/* Generated from src/domain/appearance.ts. Do not hand-edit. */
:root{--bg:#f5f5f5;--surface:#ffffff;--surface-soft:#eeeeee;--surface-hover:#e6e6e6;--border:#dddddd;--border-strong:#737373;--accent:#303030;--accent-hover:#161616;--accent-soft:#e8e8e8;--accent-text:#303030;--focus:#303030;--on-accent:#ffffff;--text:#222222;--muted:#565656;--faint:#606060;--danger:#a1283c;--danger-bg:#fae9ed;--warning:#765011}
:root[data-theme=dark]{--bg:#101010;--surface:#191919;--surface-soft:#232323;--surface-hover:#2c2c2c;--border:#3a3a3a;--border-strong:#888888;--accent:#dedede;--accent-hover:#f5f5f5;--accent-soft:#303030;--accent-text:#dedede;--focus:#dedede;--on-accent:#111111;--text:#f2f2f2;--muted:#bfbfbf;--faint:#b0b0b0;--danger:#ff9fae;--danger-bg:#3a2028;--warning:#ebc47d}
:root[data-palette=neutral]{--bg:#f5f5f5;--surface:#ffffff;--surface-soft:#eeeeee;--surface-hover:#e6e6e6;--border:#dddddd;--border-strong:#737373}
:root[data-theme=dark][data-palette=neutral]{--bg:#101010;--surface:#191919;--surface-soft:#232323;--surface-hover:#2c2c2c;--border:#3a3a3a;--border-strong:#888888}
.palette-choice[data-palette=neutral]{--preview-bg:#f5f5f5;--preview-surface:#ffffff;--preview-soft:#eeeeee;--preview-line:#737373}
:root[data-theme=dark] .palette-choice[data-palette=neutral]{--preview-bg:#101010;--preview-surface:#191919;--preview-soft:#232323;--preview-line:#888888}
:root[data-palette=black]{--bg:#ffffff;--surface:#fafafa;--surface-soft:#f0f0f0;--surface-hover:#e5e5e5;--border:#d9d9d9;--border-strong:#737373}
:root[data-theme=dark][data-palette=black]{--bg:#000000;--surface:#101010;--surface-soft:#1c1c1c;--surface-hover:#262626;--border:#383838;--border-strong:#888888}
.palette-choice[data-palette=black]{--preview-bg:#ffffff;--preview-surface:#fafafa;--preview-soft:#f0f0f0;--preview-line:#737373}
:root[data-theme=dark] .palette-choice[data-palette=black]{--preview-bg:#000000;--preview-surface:#101010;--preview-soft:#1c1c1c;--preview-line:#888888}
:root[data-palette=slate]{--bg:#f3f5f8;--surface:#ffffff;--surface-soft:#eaf0f5;--surface-hover:#e0e8f0;--border:#d3dce6;--border-strong:#6a7787}
:root[data-theme=dark][data-palette=slate]{--bg:#11151b;--surface:#1a2029;--surface-soft:#232d3a;--surface-hover:#2c3848;--border:#3c4858;--border-strong:#96a4b5}
.palette-choice[data-palette=slate]{--preview-bg:#f3f5f8;--preview-surface:#ffffff;--preview-soft:#eaf0f5;--preview-line:#6a7787}
:root[data-theme=dark] .palette-choice[data-palette=slate]{--preview-bg:#11151b;--preview-surface:#1a2029;--preview-soft:#232d3a;--preview-line:#96a4b5}
:root[data-palette=midnight]{--bg:#f1f5fc;--surface:#ffffff;--surface-soft:#e7eefb;--surface-hover:#dce6f7;--border:#d0dcf0;--border-strong:#67768e}
:root[data-theme=dark][data-palette=midnight]{--bg:#0c1220;--surface:#141e30;--surface-soft:#1d2a40;--surface-hover:#26364f;--border:#354660;--border-strong:#95a8c4}
.palette-choice[data-palette=midnight]{--preview-bg:#f1f5fc;--preview-surface:#ffffff;--preview-soft:#e7eefb;--preview-line:#67768e}
:root[data-theme=dark] .palette-choice[data-palette=midnight]{--preview-bg:#0c1220;--preview-surface:#141e30;--preview-soft:#1d2a40;--preview-line:#95a8c4}
:root[data-palette=dusk]{--bg:#f5f3fa;--surface:#ffffff;--surface-soft:#ece9f7;--surface-hover:#e5e0f1;--border:#dcd5e8;--border-strong:#756c86}
:root[data-theme=dark][data-palette=dusk]{--bg:#141222;--surface:#1e1b30;--surface-soft:#2a263e;--surface-hover:#36314d;--border:#4b425e;--border-strong:#aa9fc1}
.palette-choice[data-palette=dusk]{--preview-bg:#f5f3fa;--preview-surface:#ffffff;--preview-soft:#ece9f7;--preview-line:#756c86}
:root[data-theme=dark] .palette-choice[data-palette=dusk]{--preview-bg:#141222;--preview-surface:#1e1b30;--preview-soft:#2a263e;--preview-line:#aa9fc1}
:root[data-palette=aubergine]{--bg:#f9f3f7;--surface:#ffffff;--surface-soft:#f2e8ef;--surface-hover:#eadde7;--border:#dfd1dd;--border-strong:#806a7e}
:root[data-theme=dark][data-palette=aubergine]{--bg:#1b1119;--surface:#281b24;--surface-soft:#362731;--surface-hover:#43323d;--border:#59434f;--border-strong:#bda4b3}
.palette-choice[data-palette=aubergine]{--preview-bg:#f9f3f7;--preview-surface:#ffffff;--preview-soft:#f2e8ef;--preview-line:#806a7e}
:root[data-theme=dark] .palette-choice[data-palette=aubergine]{--preview-bg:#1b1119;--preview-surface:#281b24;--preview-soft:#362731;--preview-line:#bda4b3}
:root[data-palette=coffee]{--bg:#f7f4f0;--surface:#fffdf9;--surface-soft:#efebe4;--surface-hover:#e6dfd6;--border:#dbd3c9;--border-strong:#786d5e}
:root[data-theme=dark][data-palette=coffee]{--bg:#181411;--surface:#241e19;--surface-soft:#302821;--surface-hover:#3b322a;--border:#50463b;--border-strong:#b2a491}
.palette-choice[data-palette=coffee]{--preview-bg:#f7f4f0;--preview-surface:#fffdf9;--preview-soft:#efebe4;--preview-line:#786d5e}
:root[data-theme=dark] .palette-choice[data-palette=coffee]{--preview-bg:#181411;--preview-surface:#241e19;--preview-soft:#302821;--preview-line:#b2a491}
:root[data-palette=sand]{--bg:#faf7ef;--surface:#fffdf6;--surface-soft:#f1eddf;--surface-hover:#e9e2d2;--border:#dfd5c0;--border-strong:#796e56}
:root[data-theme=dark][data-palette=sand]{--bg:#191710;--surface:#25221a;--surface-soft:#312d23;--surface-hover:#3d372b;--border:#524b3d;--border-strong:#b8ab95}
.palette-choice[data-palette=sand]{--preview-bg:#faf7ef;--preview-surface:#fffdf6;--preview-soft:#f1eddf;--preview-line:#796e56}
:root[data-theme=dark] .palette-choice[data-palette=sand]{--preview-bg:#191710;--preview-surface:#25221a;--preview-soft:#312d23;--preview-line:#b8ab95}
:root[data-accent=graphite]{--accent:#303030;--accent-hover:#161616;--accent-soft:#e8e8e8;--accent-text:#303030;--focus:#303030;--on-accent:#ffffff}
:root[data-theme=dark][data-accent=graphite]{--accent:#dedede;--accent-hover:#f5f5f5;--accent-soft:#303030;--accent-text:#dedede;--focus:#dedede;--on-accent:#111111}
.accent-choice[data-accent=graphite]{--swatch:#303030;--swatch-ink:#ffffff}
:root[data-theme=dark] .accent-choice[data-accent=graphite]{--swatch:#dedede;--swatch-ink:#111111}
:root[data-accent=blue]{--accent:#285bb5;--accent-hover:#204990;--accent-soft:#e7effc;--accent-text:#285bb5;--focus:#285bb5;--on-accent:#ffffff}
:root[data-theme=dark][data-accent=blue]{--accent:#94baff;--accent-hover:#bdd3ff;--accent-soft:#223759;--accent-text:#94baff;--focus:#94baff;--on-accent:#111111}
.accent-choice[data-accent=blue]{--swatch:#285bb5;--swatch-ink:#ffffff}
:root[data-theme=dark] .accent-choice[data-accent=blue]{--swatch:#94baff;--swatch-ink:#111111}
:root[data-accent=sky]{--accent:#1c6296;--accent-hover:#134d78;--accent-soft:#e4f1fc;--accent-text:#1c6296;--focus:#1c6296;--on-accent:#ffffff}
:root[data-theme=dark][data-accent=sky]{--accent:#7fcaff;--accent-hover:#b7dfff;--accent-soft:#1e374a;--accent-text:#7fcaff;--focus:#7fcaff;--on-accent:#111111}
.accent-choice[data-accent=sky]{--swatch:#1c6296;--swatch-ink:#ffffff}
:root[data-theme=dark] .accent-choice[data-accent=sky]{--swatch:#7fcaff;--swatch-ink:#111111}
:root[data-accent=cyan]{--accent:#086674;--accent-hover:#064f5a;--accent-soft:#e1f3f5;--accent-text:#086674;--focus:#086674;--on-accent:#ffffff}
:root[data-theme=dark][data-accent=cyan]{--accent:#79d5e6;--accent-hover:#b1e9f2;--accent-soft:#1c3b40;--accent-text:#79d5e6;--focus:#79d5e6;--on-accent:#111111}
.accent-choice[data-accent=cyan]{--swatch:#086674;--swatch-ink:#ffffff}
:root[data-theme=dark] .accent-choice[data-accent=cyan]{--swatch:#79d5e6;--swatch-ink:#111111}
:root[data-accent=teal]{--accent:#17675f;--accent-hover:#105148;--accent-soft:#e0f1ee;--accent-text:#17675f;--focus:#17675f;--on-accent:#ffffff}
:root[data-theme=dark][data-accent=teal]{--accent:#7fd4c6;--accent-hover:#b3e8df;--accent-soft:#203c38;--accent-text:#7fd4c6;--focus:#7fd4c6;--on-accent:#111111}
.accent-choice[data-accent=teal]{--swatch:#17675f;--swatch-ink:#ffffff}
:root[data-theme=dark] .accent-choice[data-accent=teal]{--swatch:#7fd4c6;--swatch-ink:#111111}
:root[data-accent=forest]{--accent:#236442;--accent-hover:#194e33;--accent-soft:#e6f1e9;--accent-text:#236442;--focus:#236442;--on-accent:#ffffff}
:root[data-theme=dark][data-accent=forest]{--accent:#8bcea4;--accent-hover:#b9e5ca;--accent-soft:#253d2e;--accent-text:#8bcea4;--focus:#8bcea4;--on-accent:#111111}
.accent-choice[data-accent=forest]{--swatch:#236442;--swatch-ink:#ffffff}
:root[data-theme=dark] .accent-choice[data-accent=forest]{--swatch:#8bcea4;--swatch-ink:#111111}
:root[data-accent=mint]{--accent:#17684e;--accent-hover:#10513c;--accent-soft:#e2f3eb;--accent-text:#17684e;--focus:#17684e;--on-accent:#ffffff}
:root[data-theme=dark][data-accent=mint]{--accent:#8dddb6;--accent-hover:#bdf1d4;--accent-soft:#233e32;--accent-text:#8dddb6;--focus:#8dddb6;--on-accent:#111111}
.accent-choice[data-accent=mint]{--swatch:#17684e;--swatch-ink:#ffffff}
:root[data-theme=dark] .accent-choice[data-accent=mint]{--swatch:#8dddb6;--swatch-ink:#111111}
:root[data-accent=lime]{--accent:#526819;--accent-hover:#3d4f10;--accent-soft:#eef3dc;--accent-text:#526819;--focus:#526819;--on-accent:#ffffff}
:root[data-theme=dark][data-accent=lime]{--accent:#bfd67f;--accent-hover:#dbe9ac;--accent-soft:#343d24;--accent-text:#bfd67f;--focus:#bfd67f;--on-accent:#111111}
.accent-choice[data-accent=lime]{--swatch:#526819;--swatch-ink:#ffffff}
:root[data-theme=dark] .accent-choice[data-accent=lime]{--swatch:#bfd67f;--swatch-ink:#111111}
:root[data-accent=yellow]{--accent:#78600b;--accent-hover:#5e4905;--accent-soft:#fbf3d7;--accent-text:#78600b;--focus:#78600b;--on-accent:#ffffff}
:root[data-theme=dark][data-accent=yellow]{--accent:#ecd378;--accent-hover:#f5e5a9;--accent-soft:#403a24;--accent-text:#ecd378;--focus:#ecd378;--on-accent:#111111}
.accent-choice[data-accent=yellow]{--swatch:#78600b;--swatch-ink:#ffffff}
:root[data-theme=dark] .accent-choice[data-accent=yellow]{--swatch:#ecd378;--swatch-ink:#111111}
:root[data-accent=amber]{--accent:#87550f;--accent-hover:#684109;--accent-soft:#f9ecd6;--accent-text:#87550f;--focus:#87550f;--on-accent:#ffffff}
:root[data-theme=dark][data-accent=amber]{--accent:#edbd78;--accent-hover:#f7d8aa;--accent-soft:#413423;--accent-text:#edbd78;--focus:#edbd78;--on-accent:#111111}
.accent-choice[data-accent=amber]{--swatch:#87550f;--swatch-ink:#ffffff}
:root[data-theme=dark] .accent-choice[data-accent=amber]{--swatch:#edbd78;--swatch-ink:#111111}
:root[data-accent=orange]{--accent:#a04b18;--accent-hover:#803911;--accent-soft:#fbe9df;--accent-text:#a04b18;--focus:#a04b18;--on-accent:#ffffff}
:root[data-theme=dark][data-accent=orange]{--accent:#f6ae7e;--accent-hover:#fad0b2;--accent-soft:#453125;--accent-text:#f6ae7e;--focus:#f6ae7e;--on-accent:#111111}
.accent-choice[data-accent=orange]{--swatch:#a04b18;--swatch-ink:#ffffff}
:root[data-theme=dark] .accent-choice[data-accent=orange]{--swatch:#f6ae7e;--swatch-ink:#111111}
:root[data-accent=red]{--accent:#b1323b;--accent-hover:#8f232d;--accent-soft:#fbe7e9;--accent-text:#b1323b;--focus:#b1323b;--on-accent:#ffffff}
:root[data-theme=dark][data-accent=red]{--accent:#f49c9f;--accent-hover:#fac5c7;--accent-soft:#452a30;--accent-text:#f49c9f;--focus:#f49c9f;--on-accent:#111111}
.accent-choice[data-accent=red]{--swatch:#b1323b;--swatch-ink:#ffffff}
:root[data-theme=dark] .accent-choice[data-accent=red]{--swatch:#f49c9f;--swatch-ink:#111111}
:root[data-accent=rose]{--accent:#a33759;--accent-hover:#812645;--accent-soft:#f8e6ed;--accent-text:#a33759;--focus:#a33759;--on-accent:#ffffff}
:root[data-theme=dark][data-accent=rose]{--accent:#efa1bb;--accent-hover:#f6c6d6;--accent-soft:#432b36;--accent-text:#efa1bb;--focus:#efa1bb;--on-accent:#111111}
.accent-choice[data-accent=rose]{--swatch:#a33759;--swatch-ink:#ffffff}
:root[data-theme=dark] .accent-choice[data-accent=rose]{--swatch:#efa1bb;--swatch-ink:#111111}
:root[data-accent=pink]{--accent:#a23482;--accent-hover:#802368;--accent-soft:#f8e5f3;--accent-text:#a23482;--focus:#a23482;--on-accent:#ffffff}
:root[data-theme=dark][data-accent=pink]{--accent:#e9a4d9;--accent-hover:#f3c8e9;--accent-soft:#412c3d;--accent-text:#e9a4d9;--focus:#e9a4d9;--on-accent:#111111}
.accent-choice[data-accent=pink]{--swatch:#a23482;--swatch-ink:#ffffff}
:root[data-theme=dark] .accent-choice[data-accent=pink]{--swatch:#e9a4d9;--swatch-ink:#111111}
:root[data-accent=plum]{--accent:#794399;--accent-hover:#60337b;--accent-soft:#f2e9f8;--accent-text:#794399;--focus:#794399;--on-accent:#ffffff}
:root[data-theme=dark][data-accent=plum]{--accent:#d2a8ec;--accent-hover:#e6ccf4;--accent-soft:#382c48;--accent-text:#d2a8ec;--focus:#d2a8ec;--on-accent:#111111}
.accent-choice[data-accent=plum]{--swatch:#794399;--swatch-ink:#ffffff}
:root[data-theme=dark] .accent-choice[data-accent=plum]{--swatch:#d2a8ec;--swatch-ink:#111111}
:root[data-accent=violet]{--accent:#614fb4;--accent-hover:#4b3c91;--accent-soft:#eeebfc;--accent-text:#614fb4;--focus:#614fb4;--on-accent:#ffffff}
:root[data-theme=dark][data-accent=violet]{--accent:#bcaeff;--accent-hover:#d9d0ff;--accent-soft:#302e4c;--accent-text:#bcaeff;--focus:#bcaeff;--on-accent:#111111}
.accent-choice[data-accent=violet]{--swatch:#614fb4;--swatch-ink:#ffffff}
:root[data-theme=dark] .accent-choice[data-accent=violet]{--swatch:#bcaeff;--swatch-ink:#111111}
/* Independent surface/accent controls; no card-based page redesign. */
:root {--font-ui:-apple-system,BlinkMacSystemFont,"Helvetica Neue",Arial,Helvetica,sans-serif;--chart-ink:var(--accent-text);--mono:var(--font-ui)}
html,body,button,input,select,textarea {font-family:var(--font-ui)}
h1,h2,h3,strong {font-weight:600}
.time-display,.bpm-input,.sticking,kbd,.inline-number,.stat-value {font-family:var(--font-ui);font-variant-numeric:tabular-nums}
.dialog::backdrop {background:rgb(0 0 0 / 50%)}
.appearance-controls {container-type:inline-size;max-width:720px}
.appearance-controls .appearance-fieldset {margin:0 0 24px}
.appearance-controls .appearance-fieldset legend {color:var(--text);font-size:13px;font-weight:600;margin-bottom:10px}
.appearance-controls .theme-options {gap:8px}
.appearance-controls .button.theme-choice {min-height:44px;font-size:13px}
.appearance-controls .theme-choice[aria-pressed=true] {box-shadow:none}
.palette-description {color:var(--muted);font-size:12px;line-height:1.5;margin:0 0 12px}
.palette-options {display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.appearance-controls .button.palette-choice {display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;gap:8px;min-width:0;min-height:88px;padding:6px;border:1px solid var(--border-strong);border-radius:8px;text-align:left;background:var(--surface);color:var(--text);font-size:12px}
.appearance-controls .button.palette-choice:hover {background:var(--surface-hover)}
.appearance-controls .button.palette-choice[aria-pressed=true] {border:2px solid var(--accent);padding:5px;background:var(--accent-soft);color:var(--accent-text)}
.palette-preview {display:grid;grid-template-columns:20% minmax(0,1fr);height:46px;gap:6px;background:var(--preview-bg);border:1px solid var(--preview-line);border-radius:4px;overflow:hidden;padding:6px}
.palette-preview-rail {background:var(--preview-surface);border-right:1px solid var(--preview-line)}
.palette-preview-paper {display:flex;flex-direction:column;gap:6px;justify-content:center;background:var(--preview-surface);padding:6px}
.palette-preview-paper>span {height:3px;background:var(--preview-line);width:70%;border-radius:1px}.palette-preview-paper>span+span {width:45%}
.palette-caption {display:flex;gap:3px;align-items:center;justify-content:space-between;line-height:1.4;font-weight:500;padding:0 2px 2px;min-width:0}
.palette-check {visibility:hidden;display:flex;flex-shrink:0}.palette-choice[aria-pressed=true] .palette-check {visibility:visible}
.appearance-controls .accent-options {display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}
.appearance-controls .button.accent-choice {min-height:44px;min-width:0;padding:8px;font-size:12px;gap:8px;border-radius:6px}
.appearance-controls .accent-choice[aria-pressed=true] {border-color:var(--accent);background:var(--accent-soft);color:var(--accent-text)}
:root .appearance-controls .accent-swatch {width:22px;height:22px;color:var(--swatch-ink);border-radius:50%;box-shadow:inset 0 0 0 1px rgb(0 0 0 / 10%)}
.appearance-controls .accent-swatch>svg {width:14px;height:14px}
.appearance-summary {display:flex;gap:12px;align-items:center;justify-content:space-between;border-top:1px solid var(--border);padding-top:16px}
.appearance-selection {font-size:13px;font-weight:500;color:var(--text)}
.appearance-summary .button {min-height:44px;flex-shrink:0}
.appearance-controls .appearance-hint {font-size:12px;line-height:1.5;margin-top:8px;color:var(--muted)}
.dialog.appearance-dialog {width:min(620px,calc(100vw - 24px));max-width:620px;max-height:calc(100dvh - 24px);scroll-padding-top:70px;scroll-padding-bottom:20px}
.appearance-dialog .dialog-content {padding:22px}.appearance-dialog .dialog-footer:empty {display:none}
@container (max-width:460px) {
  .palette-options {gap:8px;grid-template-columns:repeat(4,minmax(0,1fr))}
  .appearance-controls .button.palette-choice {font-size:11px;min-height:84px}
  .palette-caption {flex-wrap:wrap;justify-content:center;gap:0}
  .palette-check {display:none}.palette-choice[aria-pressed=true] .palette-caption::before {content:"✓";margin-right:3px}
  .appearance-controls .accent-options {grid-template-columns:repeat(3,minmax(0,1fr))}
}
@container (max-width:310px) {
  .palette-options {grid-template-columns:repeat(2,minmax(0,1fr))}
  .palette-caption {justify-content:space-between}.palette-check {display:flex}
  .palette-choice[aria-pressed=true] .palette-caption::before {content:none}
  .appearance-controls .accent-options {grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:640px) {
  .dialog.appearance-dialog {max-height:calc(100dvh - 16px - env(safe-area-inset-top) - env(safe-area-inset-bottom));width:calc(100vw - 16px)}
  .appearance-dialog .dialog-content {padding:16px}
  .appearance-dialog .dialog-header {padding:10px 16px}.appearance-dialog .dialog-header .button {min-height:44px;min-width:44px}
}
@media (forced-colors:active) {
  .palette-choice[aria-pressed=true],.appearance-controls .accent-choice[aria-pressed=true] {outline:2px solid Highlight}
  .palette-preview {forced-color-adjust:none}
}
:root[data-theme=dark] .appearance-controls .accent-swatch {color:var(--swatch-ink)}

/* Keep mobile routine disclosure in document flow; negative offsets overlap the
   duration in Firefox when text or coarse-pointer sizing changes row height. */
@media (max-width:640px) {
  .routine-disclosure {margin-top:0;max-width:100%}
}

