:root {
    color-scheme: dark light;
    --bg:#0a0b0f; --bg-2:#0d0f15; --surface:#13151d; --surface-2:#191c26; --surface-3:#20242f;
    --line:#242835; --line-2:#333a49;
    --fg:#e7e9f0; --fg-2:#a9b0c0; --muted:#6f778a;
    --accent:#8b7bff; --accent-2:#6d5efc; --accent-weak:rgba(124,108,255,.15);
    --ok:#3fb950; --ok-weak:rgba(63,185,80,.15);
    --warn:#e3a72c; --warn-weak:rgba(227,167,44,.15);
    --err:#f56565; --err-weak:rgba(245,101,101,.15);
    --info:#4d9fff; --info-weak:rgba(77,159,255,.15);
    --r:10px; --r-sm:7px; --r-lg:14px;
    --shadow:0 1px 2px rgba(0,0,0,.35), 0 10px 30px rgba(0,0,0,.22);
    --font:-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
    --mono:ui-monospace,"SF Mono","JetBrains Mono",Menlo,Consolas,monospace;
  }
  @media (prefers-color-scheme: light) {
    :root {
      --bg:#f5f6f8; --bg-2:#eceef2; --surface:#ffffff; --surface-2:#f5f6f9; --surface-3:#eceef3;
      --line:#e4e7ec; --line-2:#d3d8e0;
      --fg:#161922; --fg-2:#4a5163; --muted:#8b93a5;
      --accent:#6d5efc; --accent-2:#5b4ce0; --accent-weak:rgba(109,94,252,.1);
      --ok:#1a7f37; --ok-weak:rgba(26,127,55,.1);
      --warn:#b26a00; --warn-weak:rgba(178,106,0,.12);
      --err:#d33f3f; --err-weak:rgba(211,63,63,.1);
      --info:#2563eb; --info-weak:rgba(37,99,235,.1);
      --shadow:0 1px 2px rgba(20,25,40,.06), 0 10px 30px rgba(20,25,40,.08);
    }
  }
  * { box-sizing:border-box; }
  html { -webkit-text-size-adjust:100%; }
  body { margin:0; font:14.5px/1.6 var(--font); background:var(--bg); color:var(--fg);
    -webkit-font-smoothing:antialiased; height:100vh; display:flex; flex-direction:column; overflow:hidden; }
  a { color:var(--accent); text-decoration:none; }
  a:hover { text-decoration:underline; }
  ::selection { background:var(--accent-weak); }
  ::-webkit-scrollbar { width:10px; height:10px; }
  ::-webkit-scrollbar-thumb { background:var(--line-2); border-radius:99px; border:2px solid transparent; background-clip:content-box; }
  ::-webkit-scrollbar-thumb:hover { background:var(--muted); background-clip:content-box; }

  .topbar { display:flex; align-items:center; justify-content:space-between; gap:16px;
    padding:11px 22px; border-bottom:1px solid var(--line); flex-shrink:0; }
  .brand { display:flex; align-items:center; gap:11px; min-width:0; cursor:pointer; }
  .logo { display:grid; place-items:center; width:30px; height:30px; border-radius:9px; font:700 12px/1 var(--mono);
    color:#fff; background:linear-gradient(135deg,var(--accent),var(--accent-2)); box-shadow:0 3px 12px var(--accent-weak); }
  .brand-name { font-weight:650; font-size:15px; letter-spacing:-.01em; }
  .brand-sub { color:var(--muted); font-size:13px; }
  .topbar-meta { display:flex; align-items:center; gap:14px; color:var(--muted); font-size:12.5px; }
  .live-ind { display:inline-flex; align-items:center; gap:7px; }
  .live-dot { width:7px; height:7px; border-radius:50%; background:var(--ok); animation:ping 2.4s ease-out infinite; }
  @keyframes ping { 0%{ box-shadow:0 0 0 0 rgba(63,185,80,.5); } 70%{ box-shadow:0 0 0 6px rgba(63,185,80,0); } 100%{ box-shadow:0 0 0 0 rgba(63,185,80,0); } }

  #msg { flex-shrink:0; color:var(--fg-2); font-size:12.5px; padding:0 22px; }
  #msg:not(:empty) { padding:7px 22px; border-bottom:1px solid var(--line); background:var(--surface); }

  .shell { flex:1; display:grid; grid-template-columns:minmax(340px,42%) 1fr; overflow:hidden; }
  .shell.solo { grid-template-columns:1fr 0; }
  .shell.solo .detail { display:none; }
  @media (max-width:900px) {
    .shell { grid-template-columns:1fr; }
    .shell.split .inbox { display:none; }
  }

  /* ---------- inbox (left) ---------- */
  .inbox { border-right:1px solid var(--line); overflow:auto; background:var(--bg-2); display:flex; flex-direction:column; }
  .inbox-h { position:sticky; top:0; z-index:5; background:var(--bg-2); padding:12px 16px 9px;
    border-bottom:1px solid var(--line); display:flex; align-items:center; gap:10px; }
  .inbox-h h2 { font-size:12px; text-transform:uppercase; letter-spacing:.06em; color:var(--fg-2); font-weight:650; margin:0; }
  .filters { margin-left:auto; display:flex; gap:6px; }
  .fchip { font-size:11px; font-weight:600; padding:3px 10px; border-radius:99px; background:var(--surface-3);
    color:var(--muted); cursor:pointer; border:0; font-family:inherit; }
  .fchip.on { background:var(--accent-weak); color:var(--accent); }
  /* per-person queue badge on "Awaiting you" (Epic A4) */
  .fbadge { display:inline-block; min-width:14px; text-align:center; font-size:10px;
    font-weight:700; padding:0 4px; border-radius:99px; background:var(--warn);
    color:var(--bg-2); margin-left:2px; }
  .me-chip.has-due::after { content:""; display:inline-block; width:6px; height:6px;
    border-radius:50%; background:var(--warn); margin-left:6px; vertical-align:middle; }
  #inbox-list { flex:1; }
  .row { display:flex; gap:11px; padding:12px 16px; border-bottom:1px solid var(--line); cursor:pointer;
    border-left:3px solid transparent; }
  .row:hover { background:var(--surface); }
  .row.sel { background:var(--surface); border-left-color:var(--accent); }
  .row .rail { width:6px; height:6px; border-radius:50%; margin-top:7px; flex-shrink:0; background:var(--line-2); }
  .row[data-status="running"] .rail { background:var(--accent); }
  .row[data-status="awaiting_input"] .rail { background:var(--warn); }
  .row[data-status="pr_opened"] .rail { background:var(--ok); }
  .row[data-status="error"] .rail, .row[data-status="timeout"] .rail { background:var(--err); }
  .row .body { min-width:0; flex:1; }
  .row .t { font-weight:600; font-size:13.5px; line-height:1.35; overflow:hidden; text-overflow:ellipsis;
    display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; }
  .row .m { font-size:11.5px; color:var(--muted); margin-top:4px; display:flex; gap:8px; align-items:center;
    font-family:var(--mono); flex-wrap:wrap; }
  .row .when { margin-left:auto; font-size:11px; color:var(--muted); white-space:nowrap; font-family:var(--mono); }
  .mini { display:flex; gap:2px; margin-top:7px; }
  .mini i { flex:1; height:4px; border-radius:2px; background:var(--surface-3); }
  .mini i.d { background:var(--accent); opacity:.8; }
  .mini i.c { background:var(--accent); box-shadow:0 0 0 2px var(--accent-weak); animation:pulse 1.5s ease-in-out infinite; }
  .mini i.c.still { animation:none; }
  @keyframes pulse { 0%,100% { opacity:1; } 50% { opacity:.35; } }
  .newbtn { margin:10px 16px 16px; display:block; width:calc(100% - 32px); padding:9px; border:1px dashed var(--line-2);
    border-radius:var(--r-sm); background:transparent; color:var(--muted); font:inherit; font-size:12.5px; cursor:pointer; }
  .newbtn:hover { border-color:var(--accent); color:var(--accent); }
  .empty { color:var(--muted); font-size:12.5px; padding:14px 16px; }

  .badge { display:inline-flex; align-items:center; gap:6px; white-space:nowrap; font-size:11px; font-weight:600;
    padding:2px 9px; border-radius:99px; background:var(--surface-3); color:var(--fg-2); }
  .badge::before { content:""; width:6px; height:6px; border-radius:50%; background:currentColor; }
  .badge.running { color:var(--accent); background:var(--accent-weak); }
  .badge.running::before { animation:pulse 1.4s ease-in-out infinite; }
  .badge.awaiting_input { color:var(--warn); background:var(--warn-weak); }
  .badge.pr_opened { color:var(--ok); background:var(--ok-weak); }
  .badge.error, .badge.timeout { color:var(--err); background:var(--err-weak); }
  .badge.queued, .badge.received { color:var(--info); background:var(--info-weak); }
  .badge.no_fix, .badge.skipped { color:var(--muted); background:var(--surface-3); }
  .badge.overdue { color:var(--err); background:var(--err-weak); }
  .badge.watching { color:var(--info); background:var(--info-weak); }
  .badge.done { color:var(--ok); background:var(--ok-weak); }
  /* outcome verdict chips (Epic B5) */
  .vchip { display:inline-block; padding:2px 9px; border-radius:999px; font-size:11px; font-weight:650; }
  .vchip.v-moved { color:var(--ok); background:var(--ok-weak); }
  .vchip.v-flat { color:var(--muted); background:var(--surface-3); }
  .vchip.v-regressed { color:var(--err); background:var(--err-weak); }
  .vchip.v-unmeasured { color:var(--info); background:var(--info-weak); }
  .vcard .vc-m { font-size:12.5px; color:var(--fg); margin-left:8px; }
  .vcard .vc-l { margin-top:8px; font-size:12.5px; color:var(--muted); }
  .vcard .vc-r { margin-top:8px; font-size:11.5px; color:var(--muted); display:flex; flex-wrap:wrap; gap:8px; }
  .vcard { padding:12px 14px; }
  .badge.kind { background:transparent; color:var(--muted); border:1px solid var(--line-2); font-weight:550; }
  .badge.kind::before { display:none; }
  .chip { display:inline-flex; align-items:center; font-size:10.5px; font-weight:600; padding:1px 8px;
    border-radius:99px; background:var(--warn-weak); color:var(--warn); margin-left:8px; }

  /* ---------- detail (right) ---------- */
  .detail { display:flex; flex-direction:column; overflow:hidden; }
  .d-top { display:flex; align-items:center; gap:12px; padding:13px 20px; border-bottom:1px solid var(--line); flex-wrap:wrap; }
  .d-back { display:none; }
  @media (max-width:900px) { .d-back { display:inline-flex; } }
  .d-back, .d-x { align-items:center; padding:5px 11px; border:1px solid var(--line-2); border-radius:var(--r-sm);
    background:var(--surface-2); color:var(--fg); cursor:pointer; font:inherit; font-size:12.5px; font-weight:600; }
  .d-title { font-weight:650; font-size:14.5px; letter-spacing:-.01em; min-width:0; overflow:hidden;
    text-overflow:ellipsis; white-space:nowrap; flex:1; }
  .d-strip { display:flex; gap:3px; width:170px; flex-shrink:0; }
  .d-strip i { flex:1; height:6px; border-radius:99px; background:var(--surface-3); }
  .d-strip i.d { background:var(--accent); opacity:.85; }
  .d-strip i.c { background:var(--accent); box-shadow:0 0 0 2px var(--accent-weak); animation:pulse 1.5s ease-in-out infinite; }
  .d-strip i.c.still { animation:none; }
  .d-links { display:flex; gap:13px; font-size:12.5px; font-weight:550; flex-shrink:0; }
  .d-sub { width:100%; display:flex; gap:10px; align-items:center; font-size:11.5px; color:var(--muted); font-family:var(--mono); }

  .thread { flex:1; overflow:auto; padding:16px 20px; display:flex; flex-direction:column; gap:12px; }
  .thread > * { flex-shrink:0; } /* children must never compress to fit — the thread scrolls */
  .daydiv { text-align:center; color:var(--muted); font-size:11px; font-family:var(--mono); margin:2px 0; }
  .stage { border:1px solid var(--line); border-radius:var(--r); background:var(--surface); overflow:hidden; }
  .stage > summary { list-style:none; cursor:pointer; padding:9px 13px; display:flex; align-items:center; gap:10px;
    font-size:12.5px; user-select:none; }
  .stage > summary::-webkit-details-marker { display:none; }
  .stage .sx { font-family:var(--mono); color:var(--muted); font-size:11px; width:22px; }
  .stage .snm { font-weight:600; }
  .stage .tick { color:var(--ok); font-size:12px; }
  .stage .sm { margin-left:auto; color:var(--muted); font-size:11px; font-family:var(--mono); }
  .stage .inner { padding:2px 13px 12px; border-top:1px solid var(--line); font-size:12.5px; color:var(--fg-2); }
  .stage .art { margin-top:9px; font:11.5px/1.55 var(--mono); background:var(--bg-2); border:1px solid var(--line);
    border-radius:var(--r-sm); padding:10px; color:var(--fg-2); white-space:pre-wrap; overflow-wrap:anywhere;
    max-height:320px; overflow:auto; }
  .stage.live { border-color:var(--accent); }
  .stage.live > summary { background:var(--accent-weak); }
  .stage.live .sm { color:var(--accent); }
  .ev { font-size:12.5px; line-height:1.5; margin-top:7px; }
  .ev.status { font-family:var(--mono); font-size:11.5px; color:var(--muted); display:flex; gap:8px; align-items:baseline; }
  .ev.status::before { content:"›"; color:var(--accent); font-weight:700; }
  .ev.text { white-space:pre-wrap; overflow-wrap:anywhere; color:var(--fg); background:var(--bg-2);
    border:1px solid var(--line); border-radius:var(--r-sm); padding:9px 12px; }
  .ev.done { color:var(--ok); font-size:12px; font-weight:650; }
  .lead { color:var(--muted); font-size:12.5px; }

  .turn { max-width:86%; font-size:13px; align-self:flex-start; }
  .turn.human { align-self:flex-end; }
  .turn .b { white-space:pre-wrap; overflow-wrap:anywhere; border:1px solid var(--line);
    border-radius:12px 12px 12px 4px; padding:8px 12px; background:var(--surface-2); line-height:1.5; }
  .turn.human .b { background:linear-gradient(135deg,var(--accent),var(--accent-2)); color:#fff;
    border-color:transparent; border-radius:12px 12px 4px 12px; }
  .turn.steer .b { background:var(--warn-weak); border-color:var(--warn); color:var(--fg); }
  .turn .c { font-size:10.5px; color:var(--muted); margin-top:3px; padding:0 4px; }
  .turn.human .c { text-align:right; }
  .turn.wait { color:var(--muted); font-size:12px; }
  .spin { display:inline-block; width:10px; height:10px; border:2px solid var(--muted); border-top-color:transparent;
    border-radius:50%; margin-right:6px; vertical-align:-1px; animation:rot .8s linear infinite; }
  @keyframes rot { to { transform:rotate(360deg); } }

  .prlist { list-style:none; margin:0; padding:0; }
  .prlist li { display:flex; align-items:center; gap:10px; padding:8px 4px; border-bottom:1px solid var(--line); font-size:12.5px; }
  .prlist li:last-child { border-bottom:0; }
  .prlist li a { font-family:var(--mono); font-size:12px; font-weight:600; }
  .prlist .meta { color:var(--muted); font-size:11.5px; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }

  .gate { border:1px solid var(--warn); border-radius:var(--r); background:var(--surface); padding:12px 14px; }
  .gate .g-h { font-size:11.5px; font-weight:650; color:var(--warn); text-transform:uppercase; letter-spacing:.06em; margin-bottom:8px; }
  /* gate ownership (Epic A3) */
  .gate .g-owner { font-size:12px; color:var(--fg-2); margin:-4px 0 8px; }
  .gate .ovr { display:block; font-size:12px; color:var(--err); margin-top:8px; cursor:pointer; }
  .gate .btns button[disabled] { opacity:.45; cursor:not-allowed; }
  .q { white-space:pre-wrap; font-size:12.5px; line-height:1.55; background:var(--bg-2); border:1px solid var(--line);
    border-radius:var(--r-sm); padding:9px 11px; max-height:190px; overflow:auto; }
  details.sub { margin-top:8px; font-size:12px; }
  details.sub summary { cursor:pointer; color:var(--fg-2); font-weight:550; user-select:none; list-style:none;
    display:inline-flex; align-items:center; gap:6px; }
  details.sub summary::-webkit-details-marker { display:none; }
  details.sub summary::before { content:"+"; font:700 12px/1 var(--mono); color:var(--muted); }
  details.sub[open] > summary::before { content:"-"; }
  details.sub pre { white-space:pre-wrap; overflow-wrap:anywhere; font:11.5px/1.55 var(--mono); background:var(--bg-2);
    border:1px solid var(--line); border-radius:var(--r-sm); padding:10px 11px; max-height:340px; overflow:auto; margin:8px 0 0; color:var(--fg-2); }
  .answer textarea { width:100%; padding:8px 11px; border:1px solid var(--line); border-radius:var(--r-sm);
    background:var(--surface-2); color:var(--fg); font:inherit; font-size:13px; resize:vertical; min-height:46px; margin-top:9px; }
  .answer textarea:focus { outline:0; border-color:var(--accent); box-shadow:0 0 0 3px var(--accent-weak); }
  .answer .btns { display:flex; gap:8px; margin-top:8px; }
  .answer button { flex:1; padding:8px 0; border:0; border-radius:var(--r-sm); cursor:pointer; font:inherit;
    font-size:12.5px; font-weight:600; color:#fff; }
  .answer button.go { background:linear-gradient(135deg,#3fb950,#2ea043); }
  .answer button.no { background:var(--surface-3); color:var(--fg-2); }
  .answer button.redo { background:linear-gradient(135deg,var(--warn),#c8860f); }
  .answer button:disabled { opacity:.5; cursor:default; }
  .hint { font-size:12px; color:var(--muted); margin:6px 0 0; line-height:1.5; }

  .composer { border-top:1px solid var(--line); padding:11px 20px 13px; flex-shrink:0; }
  .composer .tabs { display:flex; gap:8px; margin-bottom:8px; }
  .composer .tab { font-size:12px; font-weight:600; padding:4px 12px; border-radius:99px; cursor:pointer;
    background:var(--surface-3); color:var(--muted); border:0; font-family:inherit; }
  .composer .tab.on { background:var(--accent-weak); color:var(--accent); }
  .composer .tab.steer.on { background:var(--warn-weak); color:var(--warn); }
  .composer textarea { width:100%; padding:9px 12px; border:1px solid var(--line); border-radius:var(--r-sm);
    background:var(--surface-2); color:var(--fg); font:inherit; font-size:13px; resize:none; min-height:46px; }
  .composer textarea:focus { outline:0; border-color:var(--accent); box-shadow:0 0 0 3px var(--accent-weak); }
  .composer .row2 { display:flex; align-items:center; gap:12px; margin-top:8px; }
  .composer .send { padding:8px 20px; border:0; border-radius:var(--r-sm);
    background:linear-gradient(135deg,var(--accent),var(--accent-2)); color:#fff; font:inherit; font-size:13px;
    font-weight:650; cursor:pointer; }
  .composer .send.steer { background:linear-gradient(135deg,var(--warn),#c8860f); }
  .composer .send:disabled { opacity:.5; cursor:default; }
  .composer .chint { font-size:11.5px; color:var(--muted); }
  .composer .cerr { font-size:11.5px; font-weight:600; color:var(--err); }

  /* ---------- welcome / intake (right pane, nothing selected) ---------- */
  .welcome { flex:1; overflow:auto; padding:20px 22px; }
  .section-label { font-size:11.5px; text-transform:uppercase; letter-spacing:.08em; color:var(--muted);
    font-weight:650; margin:0 0 13px; }
  .intake { display:grid; grid-template-columns:repeat(auto-fit,minmax(300px,1fr)); gap:14px; margin:0 0 26px; }
  .panel { background:var(--surface); border:1px solid var(--line); border-radius:var(--r-lg); padding:15px 17px; box-shadow:var(--shadow); }
  .panel h2 { font-size:13px; font-weight:650; letter-spacing:-.01em; color:var(--fg); margin:0 0 12px; }
  .panel input, .panel textarea, .panel select { width:100%; padding:9px 12px; margin-bottom:9px; border:1px solid var(--line);
    border-radius:var(--r-sm); background:var(--surface-2); color:var(--fg); font:inherit; font-size:13.5px; }
  .panel input:focus, .panel textarea:focus, .panel select:focus { outline:0; border-color:var(--accent); box-shadow:0 0 0 3px var(--accent-weak); }
  .panel textarea { resize:vertical; min-height:66px; }
  .panel button { padding:9px 18px; border:0; border-radius:var(--r-sm);
    background:linear-gradient(135deg,var(--accent),var(--accent-2)); color:#fff; cursor:pointer; font:inherit;
    font-size:13.5px; font-weight:600; }
  .panel button:disabled { opacity:.5; }
  .panel .hint { margin:2px 0 9px; }
  .brain { background:var(--surface); border:1px solid var(--line); border-radius:var(--r-lg); padding:15px 17px; box-shadow:var(--shadow); }
  .brain > summary { cursor:pointer; font-size:13px; font-weight:650; color:var(--fg); list-style:none; }
  .brain > summary::-webkit-details-marker { display:none; }
  .brain table, .stats-body table { border-collapse:collapse; font-size:12px; margin-top:12px; width:100%; }
  .brain th, .brain td, .stats-body th, .stats-body td { border-bottom:1px solid var(--line); padding:7px 10px; text-align:left; }
  .brain tr:last-child td, .stats-body tr:last-child td { border-bottom:0; }
  .brain th, .stats-body th { color:var(--muted); font-weight:600; font-size:10.5px; text-transform:uppercase; letter-spacing:.05em; white-space:nowrap; }
  .stats-body { overflow-x:auto; }
  .stats-body td:nth-child(n+2), .stats-body th:nth-child(n+2) { font-family:var(--mono); }
  .brain button { padding:5px 12px; border:1px solid var(--line-2); border-radius:var(--r-sm); background:var(--surface-3);
    color:var(--fg); cursor:pointer; font:inherit; font-size:12px; font-weight:600; }
  .brain button:disabled { opacity:.5; }
  .ok-t { color:var(--ok); } .err-t { color:var(--err); } .muted-t { color:var(--muted); }
  /* ---------- project context editor ---------- */
  .ctx input, .ctx textarea { padding:7px 10px; border:1px solid var(--line); border-radius:var(--r-sm);
    background:var(--surface-2); color:var(--fg); font:inherit; font-size:12.5px; }
  .ctx input:focus, .ctx textarea:focus { outline:0; border-color:var(--accent); box-shadow:0 0 0 3px var(--accent-weak); }
  .ctx textarea { width:100%; resize:vertical; min-height:120px; font-family:var(--mono); font-size:12px; }
  .ctx .ctx-grid { display:grid; grid-template-columns:1fr 1fr; gap:10px; margin:12px 0; }
  .ctx .ctx-grid input { width:100%; }
  .ctx .ctx-row { display:grid; grid-template-columns:.8fr 1.3fr .6fr 1.1fr 1.1fr 1.3fr 30px; gap:6px; margin-bottom:6px; }
  .ctx .ctx-row input { min-width:0; } /* grid items must shrink below the input intrinsic width */
  .ctx label { display:block; font-size:10.5px; text-transform:uppercase; letter-spacing:.05em;
    color:var(--muted); font-weight:600; margin:10px 0 5px; }
  .ctx button.save { background:linear-gradient(135deg,var(--accent),var(--accent-2)); border:0; color:#fff; }

/* ---------- auth chrome + settings pane (Phase 1) ---------- */
.me-chip { font-family: var(--mono); font-size: 11px; color: var(--fg-2);
  border: 1px solid var(--line-2); border-radius: 99px; padding: 3px 10px; }
.tb-btn { padding: 5px 12px; border: 1px solid var(--line-2); border-radius: var(--r-sm);
  background: var(--surface-3); color: var(--fg); cursor: pointer; font: inherit;
  font-size: 12px; font-weight: 600; }
.tb-btn:hover { border-color: var(--accent); }
/* the pane must own its scroll: body is overflow:hidden for the app shell,
   so without this the Account form below Users/Workspaces is unreachable */
.settings-pane { flex: 1; overflow-y: auto; padding: 0 20px; }
.settings-pane .sp-inner { max-width: 760px; margin: 26px auto; }

/* forced first sign-in: a temporary password blocks everything else — say it
   loudly and show ONLY the password form */
.pw-banner { border: 1px solid var(--accent); border-left-width: 4px; border-radius: var(--r);
  background: color-mix(in srgb, var(--accent) 8%, var(--surface)); padding: 13px 16px;
  margin-bottom: 18px; line-height: 1.55; }
.pw-banner strong { display: block; margin-bottom: 3px; }
body.forced-pw .settings-pane .panel:not(#sp-account) { display: none; }
body.forced-pw .settings-pane .d-back { display: none; }
/* the setup checklist lives outside the pane and is shown via inline style */
body.forced-pw #setup-card { display: none !important; }
.settings-pane .sp-head { display: flex; align-items: center; gap: 12px; margin-bottom: 16px; }
.settings-pane .sp-head h2 { margin: 0; font-size: 17px; }
.settings-pane .sp-msg { margin-left: auto; color: var(--fg-2); font-size: 12.5px; }

/* first-run setup wizard (§14) — top-level banner, visible in every layout */
.setup-card { border-color: var(--accent); max-width: 860px; margin: 16px auto 0; }
.setup-steps { list-style: none; margin: 12px 0; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.setup-steps li { display: flex; gap: 10px; align-items: baseline; }
.setup-steps li.done .s-t { color: var(--muted); text-decoration: line-through; }
.setup-steps .s-tick { color: var(--muted); font-weight: 700; width: 16px; flex-shrink: 0; }
.setup-steps li.done .s-tick { color: var(--ok); }
.setup-steps .s-t { font-weight: 600; font-size: 13px; }
.setup-steps .s-h { color: var(--muted); font-size: 12px; margin-top: 2px; }
.settings-pane .sp-body { display: flex; flex-direction: column; gap: 16px; }
.settings-pane .u-row { display: grid; grid-template-columns: 1fr 1.2fr .7fr auto; gap: 8px; }
.settings-pane .u-row input, .settings-pane .u-row select { margin-bottom: 0; min-width: 0; }
.settings-pane table { border-collapse: collapse; width: 100%; font-size: 12.5px; margin: 10px 0 14px; }
.settings-pane th, .settings-pane td { text-align: left; padding: 7px 10px; border-bottom: 1px solid var(--line); }
.settings-pane th { color: var(--muted); font-weight: 600; font-size: 10.5px;
  text-transform: uppercase; letter-spacing: .05em; }
.settings-pane td button { padding: 4px 10px; border: 1px solid var(--line-2); border-radius: var(--r-sm);
  background: var(--surface-3); color: var(--fg); cursor: pointer; font: inherit; font-size: 11.5px; }
.settings-pane .u-dis { color: var(--muted); text-decoration: line-through; }

/* ---------- workspaces (Phase 2) ---------- */
.ws-switch { padding: 5px 10px; border: 1px solid var(--line-2); border-radius: var(--r-sm);
  background: var(--surface-3); color: var(--fg); font: inherit; font-size: 12px; font-weight: 600;
  max-width: 180px; }
.ws-card { border: 1px solid var(--line); border-radius: var(--r-sm); padding: 12px 14px; margin: 10px 0; }
.ws-card h3 { margin: 0 0 8px; font-size: 13px; }
.ws-card label { display: block; font-size: 10.5px; text-transform: uppercase; letter-spacing: .05em;
  color: var(--muted); font-weight: 600; margin: 10px 0 4px; }
.ws-card input, .ws-card textarea { width: 100%; box-sizing: border-box; padding: 7px 10px;
  border: 1px solid var(--line); border-radius: var(--r-sm); background: var(--surface-2);
  color: var(--fg); font: inherit; font-size: 12.5px; }
.ws-card textarea { resize: vertical; min-height: 70px; }
.ws-card .ws-repo-row { display: grid; grid-template-columns: .8fr 1.3fr .6fr 1.1fr 1.1fr 30px; gap: 6px; margin-bottom: 6px; }
.ws-card .ws-repo-row input { min-width: 0; }
.ws-card .ws-inline { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.ws-card .ws-flags { display: flex; gap: 14px; align-items: center; font-size: 12.5px; margin-top: 8px; }
.ws-card .ws-members { display: flex; gap: 10px; flex-wrap: wrap; font-size: 12.5px; margin-top: 4px; }
.ws-card .save { background: linear-gradient(135deg, var(--accent), var(--accent-2)); border: 0; color: #fff;
  padding: 8px 16px; border-radius: var(--r-sm); font: inherit; font-weight: 650; cursor: pointer; margin-top: 10px; }

/* ---------- graduated autonomy (Epic C) ---------- */
.aut-chip { display: inline-block; padding: 1px 7px; border-radius: 99px; font: 650 10.5px/1.6 var(--mono);
  border: 1px solid var(--line-2); background: var(--surface-3); color: var(--muted); vertical-align: middle; }
.aut-l1 { border-color: var(--info); color: var(--info); background: var(--info-weak); }
.aut-l2 { border-color: var(--warn); color: var(--warn); background: var(--warn-weak); }
.aut-l3 { border-color: var(--ok); color: var(--ok); background: var(--ok-weak); }
.aut-clawed { border-style: dashed; }
.aut-pinned, .aut-term { background: var(--surface-3); color: var(--fg-2); }
.aut-matrix { overflow-x: auto; margin-top: 10px; }
.aut-matrix table { border-collapse: collapse; font-size: 12px; min-width: 720px; }
.aut-matrix th, .aut-matrix td { text-align: center; padding: 5px 7px; border-bottom: 1px solid var(--line);
  white-space: nowrap; }
.aut-matrix th { color: var(--muted); font-weight: 600; font-size: 10.5px; }
.aut-matrix th:first-child, .aut-matrix td:first-child { position: sticky; left: 0; background: var(--surface);
  text-align: left; z-index: 1; }
.aut-repo { font-family: var(--mono); font-size: 11.5px; }
.aut-st { display: inline-block; }
.aut-pin-g { margin-left: 3px; }
.aut-ctl { display: flex; gap: 3px; justify-content: center; margin-top: 3px; }
.aut-pin { padding: 1px 3px; border: 1px solid var(--line-2); border-radius: var(--r-sm);
  background: var(--surface-3); color: var(--fg); font: inherit; font-size: 10px; }
.aut-claw { padding: 1px 6px; border: 1px solid var(--line-2); border-radius: var(--r-sm);
  background: var(--surface-3); color: var(--err); cursor: pointer; font: inherit; font-size: 10.5px;
  margin-left: 3px; }
.aut-claw:hover { border-color: var(--err); background: var(--err-weak); }
.aut-ws h3 { margin: 14px 0 4px; font-size: 13px; }
.aut-log { margin: 10px 0 4px; padding-left: 18px; font-size: 12px; color: var(--fg-2);
  max-height: 180px; overflow-y: auto; }
.aut-log li { margin: 2px 0; }
.aut-ev-k { font: 650 10.5px/1.6 var(--mono); color: var(--muted); text-transform: uppercase;
  letter-spacing: .04em; margin-right: 4px; }
.stage summary .aut-chip { margin-right: 8px; }
