/* System fonts and local assets only. No animation loops or remote resources. */
:root {
  --bg:#f6f5f1; --card:#fff; --ink:#232821; --muted:#6b716b; --line:#e7e8e1;
  --accent:#b44724; --accent-soft:#f9eee7; --warn:#96510b; --error:#b32726; --ok:#3e6549;
  --basement:#8b6aa3; --wzmh:#4a7777; --dvlce:#bb653d; --personal:#648259;
  color-scheme:light;
}
* { box-sizing:border-box; }
[hidden] { display:none !important; }
html { scroll-padding-top:94px; }
body { margin:0; background:var(--bg); color:var(--ink); font:14px/1.55 "Segoe UI",system-ui,-apple-system,sans-serif; }
button,input,select { font:inherit; }
a { color:inherit; }
button,a,input,select,summary { -webkit-tap-highlight-color:transparent; }
:focus-visible { outline:3px solid #bd6139; outline-offset:4px; }
.sr-only,.skip-link:not(:focus) { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
.skip-link:focus { position:fixed; top:12px; left:12px; z-index:20; padding:12px; background:white; }
h1,h2,h3,p { margin:0; }
h1 { font-size:40px; line-height:1.15; font-weight:600; letter-spacing:-1.5px; }
h2 { font-size:21px; line-height:1.25; font-weight:600; letter-spacing:-.6px; }
h3 { font-size:14px; font-weight:600; margin:14px 0 8px; }
.what,.project,.project-btn,.running,.total { overflow-wrap:anywhere; min-width:0; }
.muted,.helper { color:var(--muted); }
.small { font-size:12px; }
.warn { color:var(--warn); }
.eyebrow,.small-label,.nav-label { font-size:10px; font-weight:650; letter-spacing:1.55px; }
.eyebrow { margin-bottom:10px; color:var(--muted); }
.sidebar { position:fixed; inset:0 auto 0 0; z-index:5; width:222px; padding:31px 20px 20px; background:#191e1b; color:#f0f1e9; display:flex; flex-direction:column; overflow-y:auto; }
.sidebar > * { flex-shrink:0; }
.brand { display:flex; align-items:center; gap:11px; text-decoration:none; font-size:23px; font-weight:650; letter-spacing:-.9px; }
.brand-mark { display:grid; place-items:center; width:37px; height:40px; border:1px solid #65705f; border-radius:10px; color:#d7e5a8; font-size:32px; padding-bottom:6px; }
.brand-sub { display:block; font-size:10px; letter-spacing:2px; color:#a6aea2; margin-top:2px; font-weight:500; }
.nav-label { margin:50px 12px 13px; color:#9da697; letter-spacing:1.8px; font-size:10px; }
nav { display:grid; gap:6px; }
nav a { display:flex; align-items:center; gap:14px; color:#bec6b8; padding:12px 14px; border-radius:7px; text-decoration:none; font-size:13px; }
nav a:hover,nav a:focus-visible { background:#30372d; color:white; }
nav a:first-child { background:#dce8b7; color:#293324; font-weight:600; }
nav a > span { font-size:20px; width:20px; line-height:1; text-align:center; }
.sidebar-note { margin:auto 12px 34px; padding-top:70px; color:#c4ccbc; }
.sidebar-note .small-label { font-size:10px; color:#9aa68e; }
.sidebar-note p { font-size:17px; line-height:1.65; margin-top:10px; font-weight:300; }
.sidebar-note p.small { font-size:11px; color:#a6b09e; }
.sidebar-rule { display:block; width:28px; height:1px; background:#67735c; margin-top:24px; }
.sidebar-footer { border-top:1px solid #384032; padding-top:19px; display:flex; flex-wrap:wrap; align-items:center; gap:9px; font-size:10px; }
.sidebar-footer small { display:block; color:#a6b09e; font-size:10px; }
.avatar { display:grid; place-items:center; border-radius:50%; width:30px; height:30px; background:#3a4332; color:#e0e9ce; font-size:12px; }
.version { display:block; width:100%; color:#9eaa93; font:10px ui-monospace,monospace; padding-left:39px; }
.workspace { margin-left:222px; }
.topbar { height:72px; position:sticky; top:0; z-index:4; border-bottom:1px solid var(--line); background:var(--bg); display:flex; justify-content:space-between; align-items:center; gap:16px; padding:0 38px; }
.breadcrumb { color:var(--muted); font-size:11px; display:flex; gap:17px; align-items:center; }
.breadcrumb strong { font-weight:500; color:var(--ink); }
.topbar-status { display:flex; align-items:center; gap:13px; }
.connection { font-size:10px; color:var(--muted); }
.connection::before { content:""; display:inline-block; width:6px; height:6px; border-radius:50%; background:#8b9187; margin-right:7px; }
.connection.connected::before { background:#5b815b; }
.chip,.subtle-tag { font-size:10px; line-height:1.4; padding:5px 9px; border-radius:5px; background:#eeefe8; color:#59614e; white-space:nowrap; }
.chip.paused { background:#fff0da; color:var(--warn); }
main { max-width:1510px; margin:auto; padding:37px 38px 26px; display:grid; gap:25px; }
main > * { min-width:0; }
.page-heading { display:flex; align-items:flex-end; justify-content:space-between; gap:18px; padding-bottom:3px; }
.page-heading > div > .muted { margin-top:11px; font-size:12px; }
.day-picker { display:flex; gap:4px; align-items:center; padding-bottom:3px; }
.day-picker input { border:none; background:transparent; padding:7px 4px; font-size:12px; width:134px; }
.day-picker .ghost { background:transparent; }
.day-picker .day-arrow { border-color:transparent; padding:6px; min-width:30px; }
.metrics { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px; }
.metric { padding:19px 20px; border:1px solid var(--line); border-radius:11px; background:#fff; }
.metric-label { display:flex; align-items:center; gap:7px; font-size:11px; color:#5b6358; }
.metric-dot { width:6px; height:6px; background:var(--accent); border-radius:2px; }
.metric-dot.green { background:#658665; }.metric-dot.purple { background:#9a7fa4; }.metric-dot.blue { background:#65868f; }
.metric strong { display:block; font-size:31px; font-weight:550; letter-spacing:-1px; margin:9px 0 3px; font-variant-numeric:tabular-nums; }
.metric small { display:block; font-size:10px; color:var(--muted); }
.primary-grid { display:grid; grid-template-columns:minmax(0,1.45fr) minmax(0,1fr); gap:22px; }
.card { background:var(--card); border:1px solid var(--line); border-radius:12px; padding:25px; min-width:0; }
.section-heading { display:flex; align-items:center; justify-content:space-between; gap:14px; margin-bottom:22px; }
.section-heading .eyebrow { font-size:10px; letter-spacing:1.6px; margin-bottom:8px; }
.section-heading .subtle-tag { background:transparent; border:1px solid var(--line); }
.row { display:flex; flex-wrap:wrap; gap:14px; align-items:end; margin:16px 0; }
label { display:grid; gap:7px; font-size:11px; color:#656c61; min-width:0; }
input,select { min-width:0; max-width:100%; color:var(--ink); background:#fafbf8; border:1px solid #dce0d5; border-radius:6px; padding:9px 11px; }
input[type="checkbox"] { accent-color:var(--accent); vertical-align:middle; width:16px; height:16px; padding:0; margin-right:7px; }
button,.button { display:inline-block; color:white; background:var(--accent); border:1px solid var(--accent); border-radius:6px; padding:9px 15px; cursor:pointer; text-decoration:none; font-size:12px; font-weight:550; }
button:hover,.button:hover { filter:brightness(.95); }
button:disabled { opacity:.5; cursor:not-allowed; }
button.ghost,.button.ghost { background:transparent; color:#535e4f; border-color:#d9ded2; }
button.small { padding:5px 9px; font-size:10px; }
.running { padding:20px; min-height:99px; border-radius:9px; background:#f5f6f0; display:flex; align-items:center; flex-wrap:wrap; gap:13px; border:1px solid #e8eadf; }
.running strong { font-size:16px; font-weight:600; }
.running > .muted { font-size:14px; }
.elapsed { margin-left:auto; font-size:27px; font-weight:550; font-variant-numeric:tabular-nums; letter-spacing:-.8px; }
#timer-status,.editing > [role="status"] { flex-basis:100%; }
.switch-heading { display:flex; flex-wrap:wrap; justify-content:space-between; gap:5px; margin:25px 0 13px; }
.switch-heading .small-label { color:#70776b; font-size:10px; letter-spacing:1.2px; }
.switch-heading .small { font-size:10px; }
.switch { display:grid; grid-template-columns:1fr 1fr; gap:17px 14px; }
.switch-area { display:flex; align-content:start; align-items:start; flex-wrap:wrap; gap:6px; }
.switch-area > div { width:100%; font-size:10px; margin-bottom:2px; }
.project-btn { background:white; color:var(--ink); border:1px solid var(--line); border-left:3px solid var(--c,var(--muted)); text-align:left; font-size:11px; padding:8px 11px; font-weight:500; }
.project-btn.active { background:#f2f5e8; border-color:#b9c59d; border-left-color:var(--c,var(--accent)); }
.helper { font-size:10px; margin-top:20px; }
.area-basement { --c:var(--basement); }.area-wzmh { --c:var(--wzmh); }.area-dvlce { --c:var(--dvlce); }.area-personal { --c:var(--personal); }
.area-stripe { width:3px; align-self:stretch; min-height:28px; border-radius:2px; background:var(--c,var(--muted)); }
.plan-card .capacity-field { display:flex; align-items:center; justify-content:space-between; padding:0 0 15px; border-bottom:1px solid var(--line); margin-bottom:16px; }
.capacity-field input { width:70px; }
.stack { display:grid; gap:13px; }
.stack > label { font-size:10px; }
.stack select { width:100%; font-size:12px; padding:10px; }
.plan-footer { margin-top:20px; }
.plan-footer > p { font-size:10px; line-height:1.6; margin-bottom:14px; }
.plan-footer button { width:100%; display:flex; justify-content:space-between; }
.totals { display:grid; gap:8px; padding-bottom:22px; }
.total-groups { display:grid; grid-template-columns:1fr 1fr; gap:35px; }
.total-groups h3 { font-size:10px; color:var(--muted); font-weight:500; }
.total { display:grid; grid-template-columns:minmax(90px,1fr) minmax(40px,1fr) 68px; gap:12px; align-items:center; font-size:11px; margin:10px 0; }
.total > span:last-child { text-align:right; font-variant-numeric:tabular-nums; }
.bar { height:5px; background:#f0f1eb; border-radius:3px; overflow:hidden; }
.bar-fill { display:block; height:100%; background:var(--c,var(--accent)); border-radius:3px; }
.exact-seconds { display:block; font-size:10px; }
.timeline-heading { display:flex; justify-content:space-between; padding:12px 95px 12px 10px; border-top:1px solid var(--line); border-bottom:1px solid var(--line); font-size:10px; letter-spacing:1.3px; color:var(--muted); }
.timeline { list-style:none; margin:0; padding:0; }
.block { display:flex; flex-wrap:wrap; align-items:center; gap:13px; padding:15px 8px; border-bottom:1px solid #eff0e9; font-size:12px; }
.block .time { min-width:88px; font-size:11px; color:#697262; font-variant-numeric:tabular-nums; }
.block .what { flex:1; min-width:150px; }
.block .what strong { font-weight:550; font-size:12px; }
.block .what .small { font-size:10px; }
.block .dur { font-size:11px; font-variant-numeric:tabular-nums; }
.block .tools { display:flex; gap:6px; }
.block .tools button { border-color:transparent; font-weight:400; }
.block .tools button:hover { background:var(--bg); }
.block.unknown { background:#fafbf8; color:var(--muted); border-bottom-style:dashed; }
.block.unknown button { margin-left:auto; }
.block.editing { background:var(--bg); border:1px solid var(--line); border-radius:8px; padding:16px; }
.block.editing input { max-width:100%; }
.timeline > .muted { padding:30px 0; text-align:center; }
details summary { cursor:pointer; font-size:11px; color:var(--accent); padding-top:20px; }
details[open] summary { margin-bottom:14px; }
.collection-note { display:flex; align-items:center; gap:16px; border:1px solid #dce3cc; border-radius:10px; background:#eef2e5; padding:19px 24px; }
.status-symbol { font-size:28px; color:#63774e; }
.collection-note strong { font-size:12px; font-weight:600; }
.collection-note p { font-size:11px; color:#66705d; margin-top:3px; }
.collection-note a { margin-left:auto; font-size:10px; text-decoration:none; white-space:nowrap; color:#4a6037; }
#project-list > h3 { color:var(--c,var(--muted)); font-size:10px; text-transform:uppercase; letter-spacing:1.3px; margin-top:23px; }
.project { border-top:1px solid var(--line); padding:2px 0 12px; }
.project.archived { opacity:.6; }
.project .row { margin:10px 0; }
.project .row strong { font-size:13px; font-weight:550; margin-right:auto; }
.actions { list-style:none; margin:0; padding:0; }
.actions li { padding:7px 0; }
.actions label { display:inline; color:var(--ink); font-size:12px; }
.actions li.done { color:var(--muted); text-decoration:line-through; }
.project-forms { display:grid; grid-template-columns:1fr 1.5fr; gap:25px; border-top:1px solid var(--line); margin-top:18px; }
.project-forms form { align-content:start; }
.project-forms h3 { flex-basis:100%; margin:5px 0 0; }
.project-forms label { flex:1 1 120px; }
.project-forms input,.project-forms select { width:100%; }
.text-link { font-size:11px; color:var(--accent); text-decoration:none; }
.export-actions { margin-top:22px; }
.import-label { position:relative; overflow:hidden; }
.import-label input { position:absolute; inset:0; opacity:0; width:100%; cursor:pointer; }
.import-label:focus-within { outline:3px solid #bd6139; outline-offset:4px; }
.settings-form { padding:24px 0; border-top:1px solid var(--line); margin-top:24px; }
.settings-form input { max-width:240px; }
.data-footer { display:flex; justify-content:space-between; border-top:1px solid var(--line); padding-top:20px; }
button.danger { color:var(--error); border-color:#ecc9c5; }
.page-footer { display:flex; justify-content:space-between; gap:15px; font-size:10px; color:var(--muted); padding:0 3px; }
.page-footer > span:first-child { color:var(--ink); font-weight:650; }
.page-footer .muted { font-weight:400; margin-left:8px; }
.message { margin:18px 38px 0; padding:12px 16px; border:1px solid var(--line); border-radius:8px; background:white; font-size:12px; }
.message.error { color:var(--error); border-color:#e5c5bc; }
.signin { max-width:610px; margin:70px auto; padding:40px; }
.signin h1 { font-size:30px; margin:18px 0; }
.signin p { margin:15px 0; font-size:13px; }
.signin button { margin-top:10px; }
@media (min-width:1550px) { main { padding-top:45px; }.card { padding:30px; } }
@media (max-width:1150px) {
  .sidebar { width:190px; padding-inline:16px; }.workspace { margin-left:190px; }
  main { padding:28px 24px; gap:20px; }.topbar { padding-inline:24px; }
  .metric { padding:17px 14px; }.metric strong { font-size:27px; }
  .primary-grid { grid-template-columns:1.15fr 1fr; gap:18px; }.card { padding:20px; }
  .section-heading h2 { font-size:18px; }.section-heading .subtle-tag { display:none; }
  .message { margin-inline:24px; }
}
@media (max-width:900px) {
  .sidebar { width:168px; }.workspace { margin-left:168px; }.brand { font-size:20px; gap:8px; }.brand-mark { width:30px; }
  .sidebar-footer small { font-size:10px; }.metrics { grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
  .primary-grid { grid-template-columns:1fr; }.page-heading { align-items:start; flex-direction:column; }
  .topbar { gap:8px; }.breadcrumb { display:none; }.topbar-status { margin-left:auto; }
  .total-groups { gap:20px; }.project-forms { grid-template-columns:1fr; }.collection-note { flex-wrap:wrap; }
  .collection-note a { margin-left:44px; }
}
@media (max-width:620px) {
  html { scroll-padding-top:120px; }.sidebar { position:sticky; top:0; width:100%; height:auto; padding:12px 16px 8px; flex-direction:row; flex-wrap:wrap; align-items:center; gap:8px; }
  .brand { font-size:19px; }.brand-mark { height:30px; width:29px; font-size:27px; border-radius:7px; }.brand-sub { font-size:10px; letter-spacing:1.4px; }
  .nav-label,.sidebar-note,.sidebar-footer { display:none; }nav { display:flex; width:100%; justify-content:space-between; gap:5px; }nav a { gap:5px; padding:7px 9px; font-size:10px; }nav a > span { font-size:16px; width:16px; }
  .workspace { margin-left:0; }.topbar { position:static; height:48px; padding:0 16px; }.topbar-status { width:100%; justify-content:space-between; gap:6px; }.connection { font-size:10px; }.chip { font-size:10px; }
  main { padding:23px 16px; gap:18px; }.page-heading { gap:18px; }h1 { font-size:34px; }.page-heading .eyebrow { font-size:10px; }
  .day-picker { width:100%; }.day-picker label { flex:1; }.day-picker input { width:100%; }
  .metrics { gap:10px; }.metric { padding:15px; }.metric-label { font-size:10px; }.metric strong { font-size:26px; }.metric small { font-size:10px; }
  .card { padding:20px 17px; }.section-heading { margin-bottom:19px; }.section-heading h2 { font-size:19px; }.running { padding:16px; }.elapsed { font-size:24px; }
  .switch { gap:15px 9px; }.project-btn { font-size:10px; }.switch-heading .small { display:none; }
  .total-groups { grid-template-columns:1fr; gap:7px; }.timeline-heading { padding-right:8px; }.block { gap:10px; padding:14px 0; }.block .what { min-width:125px; }.block .tools { margin-left:auto; }.block .time { min-width:78px; font-size:10px; }
  .row > label { flex:1 1 140px; }.row > label input,.row > label select { width:100%; }.row > label.import-label { flex:0 0 auto; }
  .collection-note { padding:16px; gap:12px; }.collection-note > div { flex:1; }.collection-note a { margin-left:38px; }.collection-note p { font-size:10px; }
  .page-footer { flex-direction:column; gap:6px; }.message { margin-inline:16px; }.signin { margin:24px 16px; padding:25px; }
}
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } }