/* ============ App shell ============ */
  /* col 1: all content   col 2: compact tracker (rows 3-4 only) */
  .shell{display:grid;grid-template-columns:1fr var(--rightcol-w,264px);grid-template-rows:auto auto 1fr auto auto;height:100vh;}

  /* ---------- Top bar ---------- */
  .topbar{
    grid-column:1 / -1;grid-row:1;
    display:flex;align-items:center;gap:var(--s-5);
    padding:var(--s-3) var(--s-6);min-height:56px;
    border-bottom:1px solid var(--line);
    background:linear-gradient(180deg,rgba(var(--panel-rgb),.88),rgba(var(--panel-rgb),.62));
    backdrop-filter:blur(10px);box-shadow:var(--sh-1);
    position:relative;z-index:20;
  }
  .brand{display:flex;align-items:center;gap:var(--s-3);}
  .brand .glyph{
    width:40px;height:40px;border-radius:var(--r-md);
    background:linear-gradient(140deg,var(--accent),var(--accent2));
    display:flex;align-items:center;justify-content:center;
    box-shadow:var(--sh-1),inset 0 1px 0 rgba(255,255,255,.22);
  }
  .brand .glyph svg{width:23px;height:23px;}
  .brand h1{font-size:18px;margin:0;font-weight:var(--fw-b);letter-spacing:.2px;line-height:1;}
  .brand p{margin:4px 0 0;font-size:var(--fs-caption);color:var(--faint);letter-spacing:var(--tracking-wide);font-weight:var(--fw-sb);}
  .topbar .spacer{flex:1;}
  .hbtn{
    background:var(--card);border:1px solid var(--line);color:var(--muted);
    width:38px;height:38px;border-radius:var(--r-md);font-size:16px;cursor:pointer;
    display:flex;align-items:center;justify-content:center;flex:0 0 auto;
    transition:color var(--t-base) var(--ease),border-color var(--t-base) var(--ease),background var(--t-base) var(--ease),transform var(--t-snap) var(--ease);
  }
  .hbtn:hover{color:var(--text);border-color:var(--line-bright);background:var(--card-hover);box-shadow:var(--sh-1);}
  .hbtn:active{transform:scale(.94);}

  /* Autosave indicator */
  .save-indicator{
    display:flex;align-items:center;gap:var(--s-2);
    font-size:var(--fs-small);font-weight:var(--fw-sb);letter-spacing:.2px;
    color:var(--muted);padding:4px 10px;border-radius:20px;
    background:rgba(var(--good-rgb),.08);border:1px solid rgba(var(--good-rgb),.18);
    transition:color var(--t-slow) var(--ease),background var(--t-slow) var(--ease),border-color var(--t-slow) var(--ease);
  }
  .save-dot{
    width:9px;height:9px;border-radius:50%;flex:0 0 auto;
    background:var(--good);box-shadow:0 0 8px rgba(var(--good-rgb),.6);
    transition:background var(--t-slow) var(--ease);
  }
  .save-indicator.saving{color:var(--warn);background:rgba(var(--warn-rgb),.1);border-color:rgba(var(--warn-rgb),.28);}
  .save-indicator.saving .save-dot{background:var(--warn);box-shadow:0 0 8px rgba(var(--warn-rgb),.6);animation:dot-pulse .9s ease-in-out infinite;}
  /* Hard error state — a write or read failed (quota/corruption). Stays until
     the next successful save resets the indicator. Hover shows the reason. */
  .save-indicator.save-error{color:var(--danger);background:rgba(var(--danger-rgb),.12);border-color:rgba(var(--danger-rgb),.4);}
  .save-indicator.save-error .save-dot{background:var(--danger);box-shadow:0 0 4px rgba(var(--danger-rgb),.35);animation:none;}
  @keyframes dot-pulse{0%,100%{opacity:1;}50%{opacity:.35;}}

  /* Dead space (grid row 2, col 1) */
  .dead-space{grid-column:1;grid-row:3;}

  /* Tile panel (inside content-zone) */
  .tile-panel{
    overflow-x:auto;
    overflow-y:hidden;
    padding:10px 16px 12px;
    scrollbar-width:none;
  }
  .tile-panel::-webkit-scrollbar{display:none;}

  .section-label{
    font-size:11px;text-transform:uppercase;letter-spacing:var(--tracking-label);color:var(--faint);
    margin:0 2px 14px;font-weight:700;display:flex;align-items:center;gap:9px;
  }
  .section-label.spaced{margin-top:34px;}
  .section-label .count{background:var(--card);border:1px solid var(--line);border-radius:20px;padding:2px 9px;font-size:10px;letter-spacing:.5px;color:var(--muted);}

  /* Binaural program grid */
  .grid{display:flex;flex-direction:row;flex-wrap:nowrap;gap:9px;}
  .mood{
    position:relative;text-align:left;cursor:pointer;
    background:linear-gradient(160deg,var(--card),var(--card-2));
    border:1px solid var(--line);border-radius:var(--r-lg);padding:13px;
    color:var(--text);overflow:hidden;box-shadow:var(--sh-1);
    transition:transform var(--t-snap) var(--ease),border-color var(--t-base) var(--ease),box-shadow var(--t-base) var(--ease);
    min-height:0;display:flex;flex-direction:column;
    flex:0 0 auto;width:190px;
  }
  .mood:hover{border-color:var(--line-bright);transform:translateY(-3px);box-shadow:var(--sh-2);}
  .mood:active{transform:scale(.985);}
  .mood.selected{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent),var(--glow-accent);}
  .mood .ic{
    width:36px;height:36px;border-radius:10px;display:flex;align-items:center;justify-content:center;
    margin-bottom:8px;flex:0 0 auto;
  }
  .mood .ic svg{width:20px;height:20px;}
  .mood h3{margin:0 0 3px;font-size:14px;font-weight:650;}
  .mood p{margin:0;font-size:11px;color:var(--muted);line-height:1.35;}
  .mood .freq{margin-top:9px;font-size:10.5px;color:var(--faint);font-variant-numeric:tabular-nums;letter-spacing:.2px;}
  .ev{
    position:absolute;top:13px;right:13px;font-size:9px;font-weight:var(--fw-b);letter-spacing:var(--tracking-wide);
    text-transform:uppercase;padding:3px 8px;border-radius:var(--r-sm);border:1px solid transparent;
  }
  .ev.strong{background:rgba(var(--accent2-rgb),.14);border-color:rgba(var(--accent2-rgb),.4);color:var(--accent2-soft);}
  .ev.moderate{background:rgba(var(--accent-rgb),.16);border-color:rgba(var(--accent-rgb),.4);color:var(--accent-soft);}
  .ev.mixed{background:rgba(var(--warn-rgb),.14);border-color:rgba(var(--warn-rgb),.38);color:var(--warn);}
  .ev.weak{background:rgba(155,156,192,.12);border-color:rgba(155,156,192,.28);color:var(--muted);}

  /* ============ Content zone (grid row 3, col 1) ============ */
  .content-zone{
    grid-column:1;grid-row:4;
    display:flex;flex-direction:column;
    border-top:1px solid var(--line);
  }

  .tab-strip{
    display:flex;align-items:center;
    min-height:48px;padding:0 16px;
    border-bottom:1px solid var(--line);
    background:linear-gradient(180deg,var(--panel-2),var(--panel));
    flex:0 0 auto;
  }

  /* Tab bar */
  .track-tabs{
    flex:1;display:flex;flex-direction:row;gap:6px;
    margin:0;padding:6px 0;overflow-x:auto;flex-wrap:nowrap;
    scrollbar-width:none;
  }
  .track-tabs::-webkit-scrollbar{display:none;}
  .track-tab{
    flex:0 0 auto;background:var(--card);border:1px solid var(--line);color:var(--muted);
    padding:5px 14px;border-radius:20px;font-size:11.5px;font-weight:600;cursor:pointer;
    transition:background .15s,border-color .15s,color .15s;white-space:nowrap;
  }
  .track-tab:hover{color:var(--text);border-color:var(--accent2);}
  .track-tab.active{background:rgba(var(--accent2-rgb),.18);border-color:var(--accent2);color:var(--accent2-soft);}
  .track-tab:active{transform:scale(.96);}

  /* Right column wrapper — spans the full height (rows 3–5) so the sidebar is
     completely independent of the music section collapsing below it. */
  .rightcol{
    grid-column:2;grid-row:3 / 6;
    display:flex;flex-direction:column;min-height:0;
    position:relative;
  }
  /* Drag-to-resize divider on the left edge of the right column.
     Adjusts the width of the To-Do list and productivity timer together. */
  .col-resizer{
    position:absolute;left:0;top:0;bottom:0;width:9px;
    cursor:col-resize;z-index:42;
    display:flex;align-items:center;justify-content:center;
    touch-action:none;-webkit-user-select:none;user-select:none;
  }
  .col-resizer::before{
    content:'';position:absolute;left:0;top:0;bottom:0;width:2px;
    background:transparent;transition:background .15s;
  }
  .col-resizer:hover::before,.col-resizer.dragging::before{background:var(--accent);}
  .col-resizer .grip{
    width:4px;height:36px;border-radius:3px;background:var(--line);
    transition:background .15s,height .15s;
  }
  .col-resizer:hover .grip,.col-resizer.dragging .grip{background:var(--accent-soft);height:48px;}
  body.col-resizing{cursor:col-resize;-webkit-user-select:none;user-select:none;}
  /* Compact tracker — sits at the bottom of the right column at a fixed,
     content-driven height that never changes when the music section folds. */
  .compact-tracker{
    flex:0 0 auto;
    display:flex;flex-direction:column;align-items:center;justify-content:center;
    gap:11px;padding:13px 20px;
    border-left:1px solid var(--line);
    border-top:1px solid var(--line);
    background:linear-gradient(180deg,var(--panel-2),var(--panel));
    min-width:186px;
  }
  .compact-view{width:100%;}
  .compact-view[hidden]{display:none !important;}
  .compact-log-open{width:100%;min-height:28px;padding:5px 7px;border:1px solid var(--line-soft);background:transparent;color:var(--faint);font:700 9px/1 var(--font-mono);letter-spacing:.07em;text-transform:uppercase;cursor:pointer;transition:background .15s,border-color .15s,color .15s;}
  .compact-log-open:hover{color:var(--accent);background:rgba(var(--accent-rgb),.06);border-color:rgba(var(--accent-rgb),.35);}
  .compact-log-open:focus-visible,.compact-counter-head button:focus-visible,.compact-counter-footer button:focus-visible{outline:2px solid var(--accent);outline-offset:2px;}
  .compact-counter-view{display:flex;flex-direction:column;gap:9px;}
  .compact-counter-head{display:flex;align-items:center;gap:8px;color:var(--faint);font:700 9px/1 var(--font-mono);letter-spacing:.09em;}
  .compact-counter-head b{color:var(--muted);font-weight:600;letter-spacing:0;}
  .compact-counter-head button{margin-left:auto;min-height:24px;padding:4px 6px;border:1px solid var(--line-soft);background:transparent;color:var(--faint);font:700 8px/1 var(--font-mono);letter-spacing:.06em;text-transform:uppercase;cursor:pointer;}
  .compact-counter-head button:hover{color:var(--accent);border-color:rgba(var(--accent-rgb),.35);}
  .compact-counter-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;}
  .compact-counter{min-height:54px;padding:7px 8px;border:1px solid var(--line);background:rgba(var(--accent-rgb),.035);color:var(--text);display:grid;grid-template-columns:auto 1fr;grid-template-areas:'icon count' 'icon label';column-gap:7px;align-items:center;text-align:left;cursor:pointer;transition:background .15s,border-color .15s,transform .12s;}
  .compact-counter:hover{background:rgba(var(--accent-rgb),.09);border-color:rgba(var(--accent-rgb),.42);}
  .compact-counter:active{transform:scale(.97);}
  .compact-counter:focus-visible{outline:2px solid var(--accent);outline-offset:2px;}
  .compact-counter .counter-icon{grid-area:icon;font-size:20px;line-height:1;}
  .compact-counter .counter-count{grid-area:count;color:var(--accent-soft);font:600 16px/1 var(--font-mono);font-variant-numeric:tabular-nums;}
  .compact-counter .counter-label{grid-area:label;color:var(--muted);font:600 9px/1.2 var(--font-mono);letter-spacing:.04em;text-transform:uppercase;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
  .compact-counter.is-editing{cursor:default;}
  .counter-count-input{grid-area:count;width:100%;min-width:0;height:24px;padding:2px 5px;border:1px solid var(--line);background:var(--card-subtle);color:var(--accent);font:600 14px/1 var(--font-mono);font-variant-numeric:tabular-nums;outline:0;}
  .counter-count-input:focus{border-color:var(--accent);box-shadow:0 0 0 1px rgba(var(--accent-rgb),.22);}
  .compact-counter-footer{display:flex;justify-content:flex-end;min-height:24px;}
  .compact-counter-footer button{min-height:24px;padding:4px 8px;border:0;border-bottom:1px solid var(--line-soft);background:transparent;color:var(--faint);font:700 8px/1 var(--font-mono);letter-spacing:.08em;text-transform:uppercase;cursor:pointer;}
  .compact-counter-footer button:hover,.compact-counter-footer button[aria-pressed="true"]{color:var(--accent);border-bottom-color:var(--accent);}
  .ct-time{
    font-size:32px;font-weight:300;letter-spacing:1.5px;
    font-variant-numeric:tabular-nums;color:var(--text);white-space:nowrap;line-height:1;
  }
  .ct-actions{display:flex;flex-direction:column;gap:7px;width:100%;}
  .ct-actions .btn{padding:9px 14px;font-size:12.5px;gap:6px;width:100%;justify-content:center;}
  .ct-actions .btn svg{width:14px;height:14px;}
  .ct-today{display:flex;flex-direction:column;align-items:center;gap:2px;}
  .ct-today-val{font-size:20px;font-weight:600;font-variant-numeric:tabular-nums;color:var(--text);}
  .ct-today-lbl{font-size:9.5px;text-transform:uppercase;letter-spacing:var(--tracking-label);color:var(--faint);}

  /* ---- Claude usage widget (bottom-right) ---- */
  .claude-usage{width:100%;margin-top:2px;padding-top:13px;border-top:1px solid var(--line-soft);opacity:.9;}
  .cu-head{display:none;}
  .cu-foot{display:none;}
  .cu-head{
    font-size:calc(var(--fs-caption) * var(--cu-scale,1));text-transform:uppercase;letter-spacing:var(--tracking-label);
    color:var(--faint);font-weight:700;text-align:center;margin-bottom:7px;
  }
  .cu-body{display:flex;flex-direction:column;gap:6px;}
  .cu-accts{display:grid;grid-template-columns:1fr 1fr;gap:8px 14px;}
  .cu-acct{display:flex;flex-direction:column;gap:4px;min-width:0;}
  /* Vertical divider between the two grid columns (every even cell). */
  .cu-acct:nth-child(even){position:relative;}
  .cu-acct:nth-child(even)::before{content:"";position:absolute;left:-7px;top:0;bottom:0;border-left:1px solid var(--line-soft);}
  .cu-acct-top{display:flex;align-items:baseline;justify-content:space-between;gap:5px;}
  .cu-acct-name{font-size:calc(var(--fs-small) * var(--cu-scale,1));font-weight:700;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
  .cu-acct-reset{font-size:calc(9px * var(--cu-scale,1));color:var(--faint);white-space:nowrap;flex:0 0 auto;font-variant-numeric:tabular-nums;}
  .cu-metric{display:flex;align-items:center;gap:5px;}
  .cu-metric-lbl{font-size:calc(9px * var(--cu-scale,1));color:var(--faint);width:calc(13px * var(--cu-scale,1));flex:0 0 auto;font-weight:600;}
  .cu-bar{flex:1;height:6px;border-radius:4px;background:var(--line);overflow:hidden;min-width:0;}
  .cu-bar > i{display:block;height:100%;border-radius:4px;transition:width .4s,background .4s;}
  .cu-metric-pct{font-size:calc(9.5px * var(--cu-scale,1));color:var(--muted);width:calc(26px * var(--cu-scale,1));text-align:right;flex:0 0 auto;font-variant-numeric:tabular-nums;}
  .cu-foot{font-size:calc(9px * var(--cu-scale,1));color:var(--faint);text-align:center;margin-top:4px;font-variant-numeric:tabular-nums;}
  .cu-error{font-size:calc(10.5px * var(--cu-scale,1));color:var(--faint);text-align:center;line-height:1.4;padding:4px 0;}

  /* OpenRouter wallet — a single command readout, not a generic metric card. */
  .or-wallet-card{display:flex;flex-direction:column;gap:10px;min-height:0;}
  .or-wallet-head{display:flex;align-items:center;justify-content:space-between;gap:8px;}
  .or-wallet-head .eo-rail-kicker{font-size:14px;color:#fff;}
  .or-wallet-refresh{
    width:28px;height:28px;display:grid;place-items:center;padding:0;
    color:var(--muted);background:transparent;border:1px solid var(--line-soft);
    border-radius:var(--r-sm);font:600 14px/1 var(--font-mono);cursor:pointer;
    transition:color var(--t-snap,.15s) var(--ease,ease),border-color var(--t-snap,.15s) var(--ease,ease),transform 120ms var(--ease,ease);
  }
  .or-wallet-refresh:hover{color:var(--accent);border-color:var(--hud-edge);}
  .or-wallet-refresh:focus-visible{outline:2px solid var(--accent);outline-offset:2px;}
  .or-wallet-refresh:active{transform:scale(.97);}
  .or-wallet-refresh.is-busy{opacity:.45;pointer-events:none;}
  .or-wallet-body{min-height:60px;display:flex;align-items:center;}
  .or-wallet-reading{width:100%;display:flex;align-items:end;}
  .or-wallet-value{
    color:var(--text);font:650 28px/1 var(--font-mono);letter-spacing:-.045em;
    font-variant-numeric:tabular-nums;text-wrap:balance;
  }
  // Bigger and white — it is the card's own name, not a technical annotation
  // that should hide behind accent colour. The fluff below it (rail + USED /
  // FUNDED meta) was stripped from the markup, so these orphaned rules go
  // with it.
  .or-wallet-reading.is-empty .or-wallet-value{color:var(--danger);}
  .or-wallet-state{width:100%;color:var(--faint);font:700 10px/1.35 var(--font-mono);letter-spacing:.08em;}
  .or-wallet-state small{display:block;margin-top:4px;color:var(--muted);font:500 10px/1.4 var(--font-body);letter-spacing:0;text-wrap:pretty;}
  .or-wallet-state.is-setup{color:var(--warn);}
  .or-wallet-state.is-error{color:var(--danger);}

  /* "Hide the AI Usage title" (gear modal). Drops the heading text from both
     placements; the sidebar's summary stays clickable — its chevron just
     slides left to take the freed space. */
  .cu-title-hidden .cu-title{display:none;}
  /* Hiding the title must actually reclaim the space, not leave an empty
     heading band: the divider, its padding and the gap below it all collapse,
     so the widget shrinks to the controls plus the meters. */
  .cu-title-hidden .ai-sidebar-widget{padding-top:6px;padding-bottom:8px;}
  .cu-title-hidden .ai-sidebar-widget > summary{
    justify-content:flex-end;padding-bottom:0;border-bottom:none;
  }
  .cu-title-hidden .ai-sidebar-widget[open] > summary{margin-bottom:0;}
  .cu-title-hidden .ai-sidebar-widget .ai-side-actions{margin:2px 0 6px;}
  .cu-title-hidden .claude-rail-card{padding-top:0;}
  .cu-title-hidden .claude-rail-card .eo-rail-head{
    justify-content:flex-end;padding-bottom:0;border-bottom:none;margin-bottom:6px;
  }

  /* The "updated HH:MM" line lives inside the OpenRouter card, pinned to the
     bottom of its grid cell so it fills the dead space under the short meter
     rather than adding a row beneath the whole grid. */
  .cu-accts .cu-acct > .cu-foot{margin-top:auto;padding-top:6px;text-align:left;}

  /* ---- AI usage widget — left sidebar (replaced the Custom Pages section) ---- */
  /* Brighter text overrides: the app-wide --faint (#6672A0) is too dim to read
     at this size, so the widget steps up to --muted/--text. Single-column
     layout: the four service cards stack as four full-width rows. */
  .ai-sidebar-widget{
    /* Full width of the nav bar, flush — no card-in-a-card box. A <details>
       disclosure: collapsed it is just the "AI Usage" heading row. */
    width:100%;margin:0;padding:10px 14px 12px;
    border-top:1px solid var(--line-soft);
  }
  .ai-sidebar-widget > summary{
    list-style:none;cursor:pointer;user-select:none;
    display:flex;align-items:center;gap:8px;
    border-bottom:1px solid var(--line);padding-bottom:8px;
  }
  .ai-sidebar-widget > summary::-webkit-details-marker{display:none;}
  .ai-sidebar-widget[open] > summary{margin-bottom:10px;}
  .ai-sidebar-widget .cu-title{
    flex:1;font-size:calc(14px * var(--cu-scale,1));font-weight:700;color:var(--text);
    letter-spacing:.02em;line-height:1;
  }
  .ai-sidebar-widget .ai-side-chevron{
    font-size:calc(11px * var(--cu-scale,1));color:var(--muted);transition:transform var(--t-snap, .15s) var(--ease, ease);
  }
  .ai-sidebar-widget[open] .ai-side-chevron{transform:rotate(180deg);}
  /* ↻ / ⚙ sit on their own small row directly under the heading, flush right. */
  .ai-sidebar-widget .ai-side-actions{
    display:flex;justify-content:flex-end;gap:5px;margin:-4px 0 10px;
  }
  .ai-sidebar-widget .cu-body{gap:16px;}
  /* Four rows of one column — no vertical dividers in this layout. */
  .ai-sidebar-widget .cu-accts{display:grid;grid-template-columns:1fr;gap:16px;}
  .ai-sidebar-widget .cu-acct:nth-child(even)::before{content:none;}
  .ai-sidebar-widget .cu-acct{gap:7px;}
  .ai-sidebar-widget .cu-acct-name{color:var(--text);font-weight:700;font-size:calc(11.5px * var(--cu-scale,1));}
  .ai-sidebar-widget .cu-acct-top{padding-bottom:3px;border-bottom:1px solid var(--line-soft);}
  .ai-sidebar-widget .cu-metric{gap:7px;padding:1px 0;}
  .ai-sidebar-widget .cu-bar{height:7px;}
  .ai-sidebar-widget .cu-acct-reset,.ai-sidebar-widget .cu-reset-line{color:var(--muted);}
  .ai-sidebar-widget .cu-metric-lbl{color:var(--muted);font-weight:700;width:calc(16px * var(--cu-scale,1));font-size:calc(10px * var(--cu-scale,1));}
  .ai-sidebar-widget .cu-metric-pct{color:var(--text);font-weight:700;width:calc(38px * var(--cu-scale,1));font-size:calc(13px * var(--cu-scale,1));line-height:1;}
  .ai-sidebar-widget .cu-foot{display:block;margin-top:10px;color:var(--muted);}
  .ai-sidebar-widget .cu-expiry{color:var(--muted);}
  .ai-sidebar-widget .cu-refresh{
    margin-left:auto;background:none;border:1px solid var(--line);color:var(--muted);
    border-radius:8px;padding:0 8px;font-size:calc(12px * var(--cu-scale,1));line-height:18px;cursor:pointer;
  }
  .ai-sidebar-widget .cu-refresh:hover{color:var(--text);border-color:var(--hud-edge);}
  .ai-sidebar-widget .cu-refresh.is-busy{opacity:.45;pointer-events:none;}
  /* Refresh ↻ + gear ⚙ pair; the pair owns the auto-left margin so both sit
     flush right on the header's baseline. */
  .ai-sidebar-widget .ai-side-actions .cu-refresh{margin-left:0;flex:0 0 auto;padding:0 6px;}

  /* ---- AI usage widget — Command Centre right-rail card ---- */
  /* Same data as the sidebar copy; its own chrome and 2-column layout. */
  .claude-rail-card{padding-top:4px;}
  .claude-rail-card .eo-rail-head{
    display:flex;align-items:center;gap:8px;
    border-bottom:1px solid var(--line);padding-bottom:6px;margin-bottom:12px;
  }
  .claude-rail-card .cu-title{
    flex:1;font-size:calc(14px * var(--cu-scale,1));font-weight:700;color:var(--text);line-height:1;
  }
  .claude-rail-card .cu-body{gap:16px;}
  .claude-rail-card .cu-accts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 22px;}
  .claude-rail-card .cu-acct{gap:7px;}
  .claude-rail-card .cu-acct-name{color:var(--text);font-weight:700;font-size:calc(11px * var(--cu-scale,1));}
  .claude-rail-card .cu-acct-top{padding-bottom:3px;border-bottom:1px solid var(--line-soft);}
  .claude-rail-card .cu-metric{gap:7px;padding:1px 0;}
  .claude-rail-card .cu-bar{height:7px;}
  .claude-rail-card .cu-acct-reset,.claude-rail-card .cu-reset-line{color:var(--muted);}
  .claude-rail-card .cu-metric-lbl{color:var(--muted);font-weight:700;width:calc(16px * var(--cu-scale,1));font-size:calc(10px * var(--cu-scale,1));}
  .claude-rail-card .cu-metric-pct{color:var(--text);font-weight:700;width:calc(38px * var(--cu-scale,1));font-size:calc(13px * var(--cu-scale,1));line-height:1;}
  .claude-rail-card .cu-expiry{color:var(--muted);}
  .claude-rail-card .cu-refresh{
    margin-left:auto;background:none;border:1px solid var(--line);color:var(--muted);
    border-radius:8px;padding:0 8px;font-size:calc(12px * var(--cu-scale,1));line-height:18px;cursor:pointer;
  }
  .claude-rail-card .cu-refresh:hover{color:var(--text);border-color:var(--hud-edge);}
  .claude-rail-card .cu-refresh.is-busy{opacity:.45;pointer-events:none;}
  .claude-rail-card .cu-head-actions{margin-left:auto;display:flex;gap:5px;}
  .claude-rail-card .cu-head-actions .cu-refresh{margin-left:0;flex:0 0 auto;padding:0 6px;}
  .claude-rail-card .cu-gear{font-size:calc(11px * var(--cu-scale,1));}
  .claude-rail-card .cu-foot{display:block;margin-top:10px;color:var(--muted);}
  .claude-rail-card .cu-fr-count{color:var(--text);font-size:calc(12px * var(--cu-scale,1));font-weight:650;line-height:1;}
  .claude-rail-card .cu-fr.is-warn .cu-fr-left{color:var(--warn);}
  .claude-rail-card .cu-fr.is-critical .cu-fr-left,
  .claude-rail-card .cu-fr.is-exhausted .cu-fr-left{color:var(--danger);}
  .ai-sidebar-widget .cu-gear{font-size:calc(11px * var(--cu-scale,1));}
  .cu-plan{padding:1px 5px;border-radius:8px;border:1px solid var(--line);white-space:nowrap;}
  .cu-reset-line{font-size:calc(9px * var(--cu-scale,1));margin-top:2px;font-variant-numeric:tabular-nums;}
  .cu-expiry{
    font-size:calc(9px * var(--cu-scale,1));font-weight:650;color:var(--muted);white-space:nowrap;
    margin-left:auto;padding:1px 7px;border-radius:9px;border:1px solid var(--line);
  }
  .cu-expiry.is-warn{color:var(--warn);border-color:var(--warn);}
  .cu-expiry.is-expired{color:var(--danger);border-color:var(--danger);}

  /* OpenRouter free-request meter — Analytics-driven daily allowance */
  .cu-fr{display:flex;flex-direction:column;gap:3px;margin-top:6px;}
  .cu-fr .cu-bar{height:7px;}
  .cu-fr-count{font-size:calc(9px * var(--cu-scale,1));color:var(--muted);white-space:nowrap;font-variant-numeric:tabular-nums;}
  .ai-sidebar-widget .cu-fr-count{color:var(--text);font-size:calc(12px * var(--cu-scale,1));font-weight:650;line-height:1;}
  .cu-fr-left{font-size:calc(10px * var(--cu-scale,1));font-weight:700;color:var(--text);font-variant-numeric:tabular-nums;line-height:1.2;}
  .ai-sidebar-widget .cu-fr.is-warn .cu-fr-left{color:var(--warn);}
  .ai-sidebar-widget .cu-fr.is-critical .cu-fr-left,
  .ai-sidebar-widget .cu-fr.is-exhausted .cu-fr-left{color:var(--danger);}
  .cu-fr-note{font-size:calc(9px * var(--cu-scale,1));color:var(--warn);line-height:1.35;}



  /* Timestamp + ↻/⚙ share the tail row at the bottom of the OpenRouter cell.
     The heading copies of the buttons are the fallback for a widget that has
     no data yet — once the tail exists they would be a duplicate. */
  .cu-tail{
    display:flex;align-items:center;justify-content:space-between;gap:8px;
    margin-top:auto;padding-top:6px;
  }
  .cu-accts .cu-acct > .cu-tail{margin-top:auto;}
  .cu-tail .cu-foot{margin-top:0;text-align:left;}
  .cu-inline-actions{display:flex;gap:5px;flex:0 0 auto;}
  .cu-inline-actions .cu-refresh{
    margin-left:0;background:none;border:1px solid var(--line);color:var(--muted);
    border-radius:8px;padding:0 6px;cursor:pointer;
    font-size:calc(12px * var(--cu-scale,1));line-height:calc(18px * var(--cu-scale,1));
  }
  .cu-inline-actions .cu-refresh:hover{color:var(--text);border-color:var(--hud-edge);}
  .cu-inline-actions .cu-refresh.is-busy{opacity:.45;pointer-events:none;}
  .cu-inline-actions .cu-gear{font-size:calc(11px * var(--cu-scale,1));}
  .ai-sidebar-widget.is-populated .ai-side-actions,
  .claude-rail-card.is-populated .cu-head-actions{display:none;}
  /* Title hidden AND buttons moved: the heading row shrinks to just the
     chevron — kept, because it is the only way to collapse the sidebar block. */
  .cu-title-hidden .ai-sidebar-widget.is-populated > summary{padding:0;min-height:0;}
  .cu-title-hidden .claude-rail-card.is-populated .eo-rail-head{display:none;}
  .cu-scale-val{color:var(--text);font-variant-numeric:tabular-nums;}
  .eo-range{width:100%;accent-color:var(--accent);cursor:pointer;}

  /* Music library (legacy row styles kept for reference) */
  .track-group + .track-group{margin-top:26px;}
  .group-head{
    font-size:11px;text-transform:uppercase;letter-spacing:var(--tracking-label);color:var(--faint);
    margin:0 2px 12px;font-weight:700;display:flex;align-items:center;gap:9px;
  }
  .group-head .count{background:var(--card);border:1px solid var(--line);border-radius:20px;padding:2px 9px;font-size:10px;color:var(--muted);}
  .tracks{display:flex;flex-direction:column;gap:9px;}
  .track{
    display:flex;align-items:center;gap:14px;cursor:pointer;text-align:left;
    background:linear-gradient(160deg,var(--card),var(--card-2));
    border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:var(--sh-1);padding:11px 14px;color:var(--text);
    transition:transform .12s ease,border-color .2s,background .2s;width:100%;
  }
  .track:hover{border-color:var(--accent2);background:var(--card-hover);}
  .track:active{transform:scale(.995);}
  .track.selected{border-color:var(--accent2);box-shadow:0 0 0 1px var(--accent2);}
  .track .tic{
    width:46px;height:46px;border-radius:11px;flex:0 0 auto;
    display:flex;align-items:center;justify-content:center;
  }
  .track .tic svg{width:22px;height:22px;color:#fff;}
  .track .meta{flex:1;min-width:0;}
  .track .meta h4{margin:0 0 3px;font-size:14.5px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
  .track .meta span{font-size:11.5px;color:var(--faint);}
  .track .tplay{
    width:38px;height:38px;border-radius:50%;flex:0 0 auto;
    background:var(--card-2);border:1px solid var(--line);color:var(--muted);
    display:flex;align-items:center;justify-content:center;transition:color .2s,border-color .2s;
  }
  .track:hover .tplay{color:#fff;border-color:var(--accent2);}
  .track.selected .tplay{color:#fff;border-color:var(--accent2);background:rgba(var(--accent2-rgb),.16);}
  .track .tplay svg{width:18px;height:18px;}
  .tracks-empty{color:var(--faint);font-size:13px;padding:14px 4px;line-height:1.5;}

  /* ---------- Productivity sidebar (right, permanent) ---------- */
  .sidebar{
    border-left:1px solid var(--line-soft);
    background:linear-gradient(180deg,var(--panel),var(--panel-2));
    min-height:0;overflow-y:auto;
  }
  .sidebar-inner{padding:20px 20px 28px;}
  .sidebar-head{
    font-size:11px;text-transform:uppercase;letter-spacing:var(--tracking-label);color:var(--faint);
    font-weight:700;margin:0 2px 16px;display:flex;align-items:center;gap:10px;
  }
  .sidebar-head svg{width:16px;height:16px;color:var(--accent2);}