/* Semantic colors are shared by every surface, chart, table and state. */
:root {
  --page:#f3f6fb;--surface:#ffffff;--raised:#f7f9fd;--ink:#172338;--ink-2:#40516a;--muted:#58687e;--axis:#58687e;
  --grid:#d8e0eb;--base:#b8c4d6;--border:#dce3ed;--border-strong:#9caabe;--wash:#edf2f9;
  --accent:#1859b9;--accent-ink:#ffffff;--claude:#a6462b;--chatgpt:#08754c;
  --good-text:#087340;--warn-text:#825500;--critical-text:#ad2534;
  --c1:#286bc9;--c2:#b44e29;--c3:#0c815c;--c4:#9b6b0c;--c5:#8054b5;--c6:#b62d67;--c7:#087d94;--c8:#706d13;--c9:#5863ad;--c10:#956047;--c-other:#6f7e92;
  --shadow:0 2px 8px #17233805;
}
@media(prefers-color-scheme:dark){
  :root:not([data-theme="light"]):not([data-theme="paper"]){
    color-scheme:dark;--page:#101216;--surface:#191d23;--raised:#222831;--ink:#f0f3f8;--ink-2:#c4cbd7;--muted:#a7b2c3;--axis:#a7b2c3;
    --grid:#343e4c;--base:#465367;--border:#333d4c;--border-strong:#64748b;--wash:#28313f;
    --accent:#8bbaff;--accent-ink:#102742;--claude:#f2a58a;--chatgpt:#78d5ac;
    --good-text:#7bd5a0;--warn-text:#f4c46a;--critical-text:#ff9fa6;
    --c1:#72a9f2;--c2:#f09a70;--c3:#58c49b;--c4:#e3b65e;--c5:#c7a2f5;--c6:#f28db4;--c7:#62cedf;--c8:#c5cc68;--c9:#9da6ff;--c10:#d5af94;--c-other:#98a4b7;--shadow:none;
  }
}
:root[data-theme="dark"]{
  color-scheme:dark;--page:#101216;--surface:#191d23;--raised:#222831;--ink:#f0f3f8;--ink-2:#c4cbd7;--muted:#a7b2c3;--axis:#a7b2c3;
  --grid:#343e4c;--base:#465367;--border:#333d4c;--border-strong:#64748b;--wash:#28313f;
  --accent:#8bbaff;--accent-ink:#102742;--claude:#f2a58a;--chatgpt:#78d5ac;
  --good-text:#7bd5a0;--warn-text:#f4c46a;--critical-text:#ff9fa6;
  --c1:#72a9f2;--c2:#f09a70;--c3:#58c49b;--c4:#e3b65e;--c5:#c7a2f5;--c6:#f28db4;--c7:#62cedf;--c8:#c5cc68;--c9:#9da6ff;--c10:#d5af94;--c-other:#98a4b7;--shadow:none;
}
:root[data-theme="paper"]{
  color-scheme:light;--page:#f2ede3;--surface:#fffcf5;--raised:#f7f2e8;--ink:#2e332b;--ink-2:#4e5849;--muted:#626855;--axis:#626855;
  --grid:#ddd6c7;--base:#b8b5a1;--border:#d9d2c2;--border-strong:#9b9c87;--wash:#ebe7d9;
  --accent:#386448;--accent-ink:#ffffff;--claude:#a14a2e;--chatgpt:#326447;
  --good-text:#346044;--warn-text:#855600;--critical-text:#a02e31;
  --c1:#426e77;--c2:#b15b35;--c3:#65824c;--c4:#9b7424;--c5:#81578d;--c6:#a04368;--c7:#277c86;--c8:#737524;--c9:#62699e;--c10:#86634c;--c-other:#857963;
  --shadow:0 2px 8px #3a332305;
}

.key.c5,.tip-key.c5{background:var(--c5)}
.plot .line.c5{stroke:var(--c5)}
.plot .dot.c5,.plot .seg.c5{fill:var(--c5)}
:focus-visible{outline:3px solid var(--accent);outline-offset:3px;border-radius:4px}
main:focus,h1:focus{outline:none}
button,a.btn,select{min-height:36px}
button{transition:background-color .12s,border-color .12s}
.primary:hover{filter:brightness(.95)}
.brand{flex-shrink:0}
.theme-control{margin-left:auto;flex-shrink:0}
.theme-control select{font-size:13px;background:var(--surface);border:1px solid var(--border-strong);border-radius:8px;padding:5px 8px;max-width:105px}
.sync+.theme-control{margin-left:0}
.section-nav a{min-height:36px;display:inline-flex;align-items:center}
.eyebrow{font-size:11px;letter-spacing:.09em;text-transform:uppercase;font-weight:650;color:var(--muted)}
.overview-head{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:4px 0 22px}
.overview-head h1{font-size:28px;letter-spacing:-.03em;margin:4px 0 6px;font-weight:650}
.data-health-link{display:inline-flex;align-items:center;gap:14px;border:1px solid var(--border-strong);padding:8px 13px;border-radius:8px;color:var(--ink-2);text-decoration:none;font-size:13px;font-weight:600;white-space:nowrap}
.data-health-link:hover{background:var(--surface)}
.theme-options{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:12px 0}
.theme-options button{display:grid;gap:8px;text-align:left;border:1px solid var(--border-strong);padding:8px;font-size:12px;background:var(--surface)}
.theme-options button[aria-pressed=true]{outline:2px solid var(--accent);outline-offset:1px;color:var(--accent)}
.theme-swatch{display:block;border-radius:5px;height:32px;border:1px solid #87919d;position:relative;overflow:hidden}
.theme-swatch::after{content:"";position:absolute;left:8px;right:8px;top:8px;height:5px;background:var(--swatch);box-shadow:0 10px 0 var(--swatch);opacity:.65}
.theme-swatch.light{background:#f3f6fb;--swatch:#1859b9}.theme-swatch.paper{background:#f2ede3;--swatch:#386448}.theme-swatch.dark{background:#191d23;--swatch:#8bbaff}.theme-swatch.system{background:linear-gradient(90deg,#f3f6fb 50%,#191d23 50%);--swatch:#6784b1}
.auth{max-width:460px}
.auth>.eyebrow{margin-bottom:12px}
.auth-trust{margin-top:24px;border-top:1px solid var(--border);padding-top:18px;display:grid;gap:10px;color:var(--ink-2);font-size:13px}
.auth-trust h2{font-size:15px;color:var(--ink)}
summary{cursor:pointer;padding:6px 0}
.auth-trust details p{padding:8px 0}
.dialog-head{position:sticky;top:0;background:var(--surface);z-index:1;border-bottom:1px solid var(--border)}
.health-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:16px}
.health-card{background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:20px;display:grid;align-content:start;gap:12px}
.health-card h2{font-size:18px}
.health-card p,.health-card li{font-size:14px;color:var(--ink-2)}
.health-card ul{padding-left:20px;margin:0;display:grid;gap:8px}
.health-badge{font-size:12px;font-weight:650;display:inline-block;border:1px solid currentColor;border-radius:20px;padding:3px 9px;width:fit-content;color:var(--warn-text)}
.health-badge.fresh{color:var(--good-text)}
.health-badge.partial,.health-badge.stale{color:var(--critical-text)}
.health-card .facts{font-size:13px;grid-template-columns:1fr 1fr}
.dt-sort{min-height:32px;min-width:24px;padding:4px 0}
.dt-table th:first-child a{display:inline-flex;align-items:center;min-height:28px}
.table-scroll:focus-visible{outline-offset:4px}
.table-hint{font-size:12px;color:var(--muted);margin-bottom:2px}
.inline-error{margin:0 0 16px;padding:12px 16px;border:1px solid var(--critical-text);border-radius:10px;color:var(--critical-text);font-size:14px}
@media(max-width:1100px){
  .topbar{display:grid;grid-template-columns:1fr auto auto;gap:8px 12px}
  .section-nav{grid-row:2;grid-column:1/-1;margin-left:0;padding:3px 0}
  .sync{grid-row:3;grid-column:1/-1;margin:0;font-size:12px}
  .theme-control{grid-row:1;grid-column:2}
  .top-actions{grid-row:1;grid-column:3}
  html{scroll-padding-top:150px}
}
@media(max-width:600px){
  body{font-size:15px}
  .topbar{padding:8px 16px;gap:5px 8px;grid-template-columns:1fr auto}
  .brand{font-size:15px;gap:6px}
  .brand img{width:24px;height:24px}
  .theme-control{grid-column:2}.top-actions{grid-row:3;grid-column:2}.sync{grid-row:3;grid-column:1;white-space:normal}
  .section-nav a{min-height:44px}
  .section-nav{scrollbar-width:thin;scrollbar-color:var(--border-strong) transparent}
  .section-nav::-webkit-scrollbar{display:initial;height:3px}
  button,select,a.btn{min-height:44px}
  .top-actions button{font-size:12px;padding:6px 10px}
  .overview-head{align-items:flex-start;margin:4px 0 18px;flex-wrap:wrap;gap:12px}
  .overview-head h1{font-size:25px}.overview-head .muted{font-size:13px}
  .data-health-link{min-height:40px}
  .tiles{grid-template-columns:1fr 1fr}
  .tile-value strong{font-size:28px}
  .tile .pace,.glance-note,.inactive-day small{font-size:12px}
  .theme-options{grid-template-columns:repeat(2,1fr)}
  .theme-swatch{height:36px}
  .dt-field select,.dt-field input[type=search],.dt-field input[type=number],.dt-range input{height:44px;font-size:16px}
  .dt-range input{width:calc(50% - 14px);min-width:120px}
  .dt-sort{min-height:40px}.small-seg button{min-width:44px}
  .today-grid{grid-template-columns:1fr 1fr}
  .today-cell{min-height:90px}
  .facts{grid-template-columns:1fr}.facts dd{margin-bottom:6px}
}
@media(prefers-reduced-motion:reduce){button{transition:none}}

.key.c6,.tip-key.c6{background:var(--c6)}
.plot .line.c6{stroke:var(--c6)}
.plot .dot.c6,.plot .seg.c6{fill:var(--c6)}

.key.c7,.tip-key.c7{background:var(--c7)}
.plot .line.c7{stroke:var(--c7)}
.plot .dot.c7,.plot .seg.c7{fill:var(--c7)}

.key.c8,.tip-key.c8{background:var(--c8)}
.plot .line.c8{stroke:var(--c8)}
.plot .dot.c8,.plot .seg.c8{fill:var(--c8)}

.key.c9,.tip-key.c9{background:var(--c9)}
.plot .line.c9{stroke:var(--c9)}
.plot .dot.c9,.plot .seg.c9{fill:var(--c9)}

.key.c10,.tip-key.c10{background:var(--c10)}
.plot .line.c10{stroke:var(--c10)}
.plot .dot.c10,.plot .seg.c10{fill:var(--c10)}
