/* System typography and shared geometry; theme colors remain independent. */
.workspace-page {
  --sans: -apple-system, BlinkMacSystemFont, "PingFang SC", "Segoe UI", "Microsoft YaHei", sans-serif;
  --serif: var(--sans);
  --card-radius: 26px;
  --control-radius: 14px;
  font-family: var(--sans);
}
:root[data-theme="comic"] .workspace-page { --card-radius: 20px; --control-radius: 12px; }
:root[data-theme="candy"] .workspace-page { --card-radius: 28px; --control-radius: 24px; }
:root[data-theme="circuit"] .workspace-page { --card-radius: 16px; --control-radius: 10px; }
:root[data-theme="petal"] .workspace-page { --card-radius: 28px; --control-radius: 18px; }
:root[data-theme] .workspace-page :is(.editor-card, .settings-card, .player-panel, .translation-studio) {
  border-radius: var(--card-radius);
}
:root[data-theme] .workspace-page .translation-grid .editor-card { border-radius: 0; }
:root[data-theme] .workspace-page :is(.section-nav, .section-nav a, .primary-button, #read-translation, select, .quiet-button, .download-button, #reading-speed, #translation-speed, #playback-speed) {
  border-radius: var(--control-radius);
}
:root[data-theme] .workspace-page .section-nav { border-radius: 22px; }
:root[data-theme] .workspace-page .brand { font-family: var(--sans); font-weight: 650; letter-spacing: -0.5px; }
:root[data-theme] .workspace-page .brand-mark { border-radius: 15px; transform: none; }
:root:is([data-theme="comic"], [data-theme="candy"]) .workspace-page .brand-mark { transform: rotate(-5deg); }
:root[data-theme] .workspace-page .page-heading h1 {
  font-family: var(--sans);
  font-weight: 650;
  letter-spacing: -0.8px;
}
:root[data-theme] .workspace-page .page-heading h1 em { font-style: normal; }
:root[data-theme] .workspace-page :is(.step-number, .nav-index, .audio-format) {
  font-family: var(--sans);
  font-style: normal;
  font-variant-numeric: tabular-nums;
  font-weight: 500;
}
:root[data-theme] .workspace-page :is(.note-number, .translation-greeting) { font-family: var(--sans); font-style: normal; letter-spacing: -0.5px; }
:root[data-theme] .workspace-page .note-number { font-weight: 600; }
:root[data-theme] .workspace-page .voice-name h3 { font-family: var(--sans); font-weight: 600; letter-spacing: -0.4px; }
:root[data-theme] .workspace-page .page-intro { font-size: 13px; }
:root[data-theme] .workspace-page .eyebrow { letter-spacing: 1.4px; }
:root[data-theme] .workspace-page :is(.theme-toggle, #logout-button) { min-height: 44px; }
:root[data-theme] .workspace-page :is(.small-label, .audio-meta, .voice-name h3 span) { border-radius: 8px; }
:root[data-theme] .workspace-page .sound-art { border-radius: 18px; }
:root[data-theme] .workspace-page .primary-button { font-weight: 600; letter-spacing: 0; }
:root[data-theme] .workspace-page .translation-submit > button { letter-spacing: 0; }
:root[data-theme] .workspace-page .theme-dialog { border-radius: 28px; box-shadow: 0 28px 90px #101a2433; }
:root[data-theme] .workspace-page .theme-dialog h2 { font-family: var(--sans); font-weight: 600; letter-spacing: -0.5px; }
:root[data-theme] .workspace-page .theme-choice { border-radius: 16px; }
:root[data-theme] .workspace-page .theme-preview { border-radius: 10px; }
:root[data-theme] .workspace-page .theme-dialog::backdrop { background: #101a244d; -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); }
@media (hover: hover) {
  :root[data-theme] .workspace-page :is(.primary-button, #read-translation):hover:not(:disabled):not(:active) { transform: translateY(-1px); }
}
@media (max-width: 760px) {
  :root[data-theme] .workspace-page .page-intro { font-size: 12px; }
  :root[data-theme] .workspace-page .section-nav { border-radius: 20px; }
}
@media (max-width: 520px) {
  :root[data-theme] .workspace-page .theme-dialog { border-radius: 24px; }
  :root[data-theme] .workspace-page .theme-choice { border-radius: 12px; }
}
@media (prefers-reduced-motion: reduce) {
  :root[data-theme] .workspace-page :is(.primary-button, #read-translation, .quiet-button, .editor-card) { transition: none; }
  :root[data-theme] .workspace-page :is(.primary-button, #read-translation):hover:not(:disabled):not(:active) { transform: none; }
}
