/* Dark theme, navigation groups and the Design / Assure views. Loaded after styles.css. */

/* ===== Theme toggle and dark theme ===== */
.theme-btn{border:1px solid var(--s-rule);background:rgb(var(--wrgb)/.7);border-radius:9px;padding:5px 10px;font-size:12px;font-weight:600;color:var(--t-mid);margin-left:auto}
.theme-btn:hover{background:var(--surface)}
:root[data-theme="dark"]{
  color-scheme:dark;
  --surface:#16233a;--surface-2:#1a2942;--surface-3:#22324d;--wrgb:22 35 58;
  --t-strong:#e6edf6;--t-body:#cfd8e5;--t-mid:#b3c0d2;--t-soft:#9aa9bf;--t-meta:#8797ae;
  --s-page:#0f172a;--s-panel:#111c30;--s-hair:#243553;--s-rule:#33466a;
  --brand-50:#0f2b47;--brand-100:#143a5e;--brand-200:#1d527f;--brand-300:#2d6ea8;--brand-400:#4a9ddc;--brand-500:#4aa3e8;--brand-600:#2c86d1;--brand-700:#86c4f2;--brand-800:#a8d5f6;
}
:root[data-theme="dark"] body{background:#0b1220 radial-gradient(120% 90% at 50% 0%,#14233d 0%,#0b1220 70%) fixed;color:var(--t-body)}
:root[data-theme="dark"] ::-webkit-scrollbar-thumb{background:rgb(226 232 240/.2);background-clip:content-box;border:3px solid transparent}
:root[data-theme="dark"] .glass,:root[data-theme="dark"] .glass-chrome,:root[data-theme="dark"] .drawer{box-shadow:inset 0 1px 0 rgb(255 255 255/.06),0 0 0 1px rgb(255 255 255/.07),0 12px 32px -16px rgb(0 0 0/.6)}
:root[data-theme="dark"] .glass-chrome{border-bottom-color:rgb(255 255 255/.08)}
:root[data-theme="dark"] .badge.attack,:root[data-theme="dark"] .tac,:root[data-theme="dark"] .gap-box,:root[data-theme="dark"] .l0{background:#3a1f22;color:#f3a7a0}
:root[data-theme="dark"] .l1{background:#3b2f14;color:#f2c16b}
:root[data-theme="dark"] .l2{background:#12362f;color:#6ad1c2}
:root[data-theme="dark"] .l3{background:#143222;color:#7bdc9f}
:root[data-theme="dark"] .role-p{background:rgb(22 163 74/.12)}
:root[data-theme="dark"] .role-d{background:rgb(217 119 6/.14)}
:root[data-theme="dark"] .role-r,:root[data-theme="dark"] .role-a{background:rgb(44 134 209/.14)}
:root[data-theme="dark"] .tcell.g{background:#1d2a41;color:#7385a1}
:root[data-theme="dark"] .tcell.c1{background:#1a4268;color:#cfe5f6}
:root[data-theme="dark"] .tcell.c2{background:#235f93;color:#fff}
:root[data-theme="dark"] .tcell.c3{background:#2a72b0;color:#fff}
:root[data-theme="dark"] .tcell.c4{background:#5fb0ee;color:#06203a}
:root[data-theme="dark"] .tcell.au{background:#2a3850}
:root[data-theme="dark"] .tcell.a0{background:#5a2a2c}
:root[data-theme="dark"] .tcell.a1{background:#5e4a1c}
:root[data-theme="dark"] .tcell.a2{background:#1f5a50}
:root[data-theme="dark"] .tcell.a3{background:#1f6a3e}
:root[data-theme="dark"] .menu-body{box-shadow:0 12px 32px -8px rgb(0 0 0/.7),0 0 0 1px rgb(255 255 255/.1)}
:root[data-theme="dark"] kbd{background:var(--surface-2);box-shadow:none}
:root[data-theme="dark"] .scrim{background:rgb(0 0 0/.55)}
:root[data-theme="dark"] .bl.on{color:#bfe0fa}
:root[data-theme="dark"] .tile mark,:root[data-theme="dark"] .cell-hit mark{background:rgb(250 204 21/.3);color:#fff}

select,input[type="search"],input[type="text"]{font:inherit;font-size:12.5px;color:var(--t-strong);background:var(--surface);border:1px solid var(--s-rule);border-radius:8px;padding:5px 8px}
select option{background:var(--surface);color:var(--t-strong)}
.search input{background:rgb(var(--wrgb)/.85);color:var(--t-strong);padding:9px 38px 9px 34px;border-radius:10px;font-size:14px}
.search+.theme-btn{margin-left:0}

/* ===== Navigation groups ===== */
.tabs{align-items:center;flex-wrap:wrap}
.tabgroup{font:600 9.5px var(--display);letter-spacing:.2em;text-transform:uppercase;color:var(--t-meta);margin:0 4px 0 12px;white-space:nowrap}
.tabgroup:first-child{margin-left:0}

/* ===== Shared bits ===== */
.view-bar{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:0 0 12px}
.panel{padding:14px 16px;border-radius:14px}
.chipset{display:flex;flex-wrap:wrap;gap:5px}
.mini{font-size:11px;font-weight:600;padding:1px 8px;border-radius:9999px;background:var(--brand-50);color:var(--brand-700);white-space:nowrap}
.mini.s{background:var(--s-hair);color:var(--t-mid)}
.code{position:relative;margin:6px 0 4px}
.code pre{margin:0;padding:10px 12px;border-radius:10px;background:#0f172a;color:#dbe7f5;font:12px/1.5 ui-monospace,SFMono-Regular,Consolas,monospace;overflow:auto;max-height:340px;white-space:pre}
.code .copy{position:absolute;top:6px;right:6px;border:1px solid rgb(255 255 255/.25);background:rgb(255 255 255/.1);color:#dbe7f5;border-radius:6px;font-size:11px;padding:2px 8px}
.code .lang{position:absolute;top:8px;right:64px;font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:#8aa4c4}
.snip h4{margin:10px 0 2px;font:600 13px var(--display);color:var(--t-strong)}
.snip p{margin:2px 0;font-size:12px;color:var(--t-soft)}
.dsec{border:1px solid var(--s-hair);border-radius:10px;background:rgb(var(--wrgb)/.6);margin:0 0 8px}
.dsec>summary{cursor:pointer;padding:8px 12px;font:600 12px var(--display);letter-spacing:.06em;text-transform:uppercase;color:var(--t-mid);list-style:none;display:flex;gap:8px;align-items:center}
.dsec>summary::-webkit-details-marker{display:none}
.dsec>summary::before{content:'▸';font-size:10px;color:var(--t-meta);transition:transform .15s}
.dsec[open]>summary::before{transform:rotate(90deg)}
.dsec>summary small{margin-left:auto;font:500 11px var(--font);text-transform:none;letter-spacing:0;color:var(--t-meta)}
.dsec>.dbody{padding:2px 14px 12px}
.dsec ul{margin:4px 0 0;padding-left:18px;font-size:13px}
.dsec li{margin:3px 0}
.raci{display:grid;grid-template-columns:auto 1fr;gap:4px 12px;font-size:13px}
.raci b{color:var(--t-mid);font-size:11px;text-transform:uppercase;letter-spacing:.08em}
.thr-row{display:flex;gap:8px;align-items:baseline;font-size:13px;margin:4px 0}
.thr-tag{font:700 10px var(--font);padding:1px 7px;border-radius:5px;background:#fdecea;color:#b3382c;flex-shrink:0;min-width:24px;text-align:center}
.thr-tag.p{background:#e8e3f7;color:#5b3fa0}
:root[data-theme="dark"] .thr-tag{background:#3a1f22;color:#f3a7a0}
:root[data-theme="dark"] .thr-tag.p{background:#2d2650;color:#c4b3f2}
.fine{font-size:11.5px;color:var(--t-meta);margin:6px 0 0}

/* ===== Architecture ===== */
.arch-wrap{overflow:auto;padding-bottom:6px}
.arch-grid{display:grid;grid-template-columns:210px repeat(6,minmax(150px,1fr));gap:6px;min-width:1100px}
.ag-h{background:var(--surface-2);border-radius:8px;padding:6px 8px;font-size:11px}
.ag-h b{display:block;font:600 11px var(--display);letter-spacing:.08em;text-transform:uppercase}
.ag-h small{color:var(--t-meta);display:block}
.ag-l{padding:8px 10px;border-radius:10px;background:var(--surface-2);font-size:12px}
.ag-l b{display:block;font:600 12.5px var(--display)}
.ag-l em{font-style:normal;font-size:11px;color:var(--brand-700);font-weight:600}
.ag-l small{display:block;color:var(--t-meta);margin-top:3px;line-height:1.35}
.ag-c{border-radius:10px;background:rgb(var(--wrgb)/.55);box-shadow:inset 0 0 0 1px var(--s-hair);padding:5px;display:flex;flex-direction:column;gap:3px;min-height:46px}
.ag-c .achip{font-size:11px;text-align:left;padding:1px 6px}
.q-row{display:flex;flex-wrap:wrap;gap:6px;margin:6px 0 12px}
.q-row span{font-size:12px;border-radius:8px;background:var(--brand-50);color:var(--brand-700);padding:3px 10px}
.q-row b{margin-right:4px}
.adm{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:12px}
.adm-card{padding:14px 16px;border-radius:14px;border-top:3px solid var(--brand-500)}
.adm-card h3{display:flex;gap:8px;align-items:center;margin-bottom:2px}
.adm-card h3 .ph{width:24px;height:24px;border-radius:50%;background:var(--brand-600);color:#fff;font:700 12px var(--display);display:grid;place-items:center;flex-shrink:0}
.adm-card p{margin:0 0 6px;font-size:12.5px;color:var(--t-soft)}
.adm-card ul{margin:0 0 8px;padding-left:18px;font-size:12.5px}
.adm-card .achip{margin:2px 3px 0 0}

/* ===== Threat model ===== */
.tm-grid,.ac-grid,.rq-grid{display:grid;grid-template-columns:minmax(260px,340px) 1fr;gap:14px;align-items:start}
.tm-pick{max-height:calc(100vh - 300px);overflow:auto;padding:10px 12px}
.tm-pick label{display:flex;gap:8px;align-items:flex-start;font-size:12.5px;padding:2px 0;cursor:pointer}
.tm-pick input{margin-top:3px;accent-color:var(--brand-600)}
.tm-pick .grp{font:600 10px var(--display);letter-spacing:.14em;text-transform:uppercase;color:var(--t-meta);margin:10px 0 2px}
.tm-sum{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 10px}
.tm-sum .pill b{margin-left:4px}
.tm-table td:first-child{white-space:nowrap}

/* ===== Threat actors ===== */
.ac-list{display:flex;flex-direction:column;gap:3px;max-height:calc(100vh - 320px);overflow:auto;padding-right:4px}
.ac-item{text-align:left;border:1px solid var(--s-hair);background:rgb(var(--wrgb)/.75);border-radius:10px;padding:6px 10px;font-size:12.5px;display:flex;justify-content:space-between;gap:8px;align-items:center}
.ac-item:hover{background:var(--surface)}.ac-item.sel{box-shadow:inset 0 0 0 2px var(--brand-500);background:var(--surface)}
.ac-item small{color:var(--t-meta);white-space:nowrap}
.ac-detail{padding:14px 16px;border-radius:14px}
.ac-kpis{display:flex;gap:26px;flex-wrap:wrap;margin:8px 0 10px}
.ac-kpis b{display:block;font:600 22px var(--display);color:var(--t-strong)}
.ac-kpis span{font-size:12px;color:var(--t-meta)}
.ac-bar{height:10px;border-radius:9999px;background:var(--s-hair);overflow:hidden;margin:4px 0 12px}
.ac-bar i{display:block;height:100%;background:var(--brand-600)}
.ac-prio{width:100%;border-collapse:collapse;font-size:12.5px}
.ac-prio td,.ac-prio th{padding:5px 8px;border-bottom:1px solid var(--s-hair);text-align:left}
.ac-prio th{font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--t-soft)}

/* ===== Requirements ===== */
.rq-out{padding:14px 16px;border-radius:14px}
.rq-item{display:grid;grid-template-columns:auto 1fr;gap:2px 12px;padding:8px 0;border-bottom:1px solid var(--s-hair);font-size:13px}
.rq-id{font:600 11px ui-monospace,Consolas,monospace;color:var(--brand-700);white-space:nowrap;padding-top:2px}
.rq-refs{grid-column:2;font-size:11.5px;color:var(--t-meta)}
.rq-area{font:600 10px var(--display);letter-spacing:.14em;text-transform:uppercase;color:var(--t-meta);margin:12px 0 0}

/* ===== Roadmap ===== */
.rm-phase{margin:0 0 18px}
.rm-phase h3{display:flex;gap:10px;align-items:center;margin-bottom:6px}
.rm-phase h3 small{font:500 12px var(--font);color:var(--t-meta)}
.rm-table{width:100%;border-collapse:collapse;font-size:12.5px}
.rm-table th{text-align:left;font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--t-soft);padding:6px 8px;border-bottom:1px solid var(--s-rule)}
.rm-table td{padding:6px 8px;border-bottom:1px solid var(--s-hair);vertical-align:top}
.eff{font-weight:700;font-size:11px;padding:1px 7px;border-radius:5px;background:var(--s-hair);color:var(--t-mid)}

/* ===== Reference ===== */
.dec-card{padding:14px 16px;border-radius:14px;margin:0 0 12px}
.dec-card h3{margin-bottom:2px}
.dec-card .q{color:var(--t-soft);font-size:13px;margin:0 0 8px}
.dec-opts{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:8px}
.dec-opt{padding:8px 10px;border-radius:10px;background:rgb(var(--wrgb)/.6);box-shadow:inset 0 0 0 1px var(--s-hair);font-size:12.5px}
.dec-opt b{display:block;margin-bottom:3px;color:var(--t-strong)}
.dec-opt .w{color:var(--brand-700);margin-bottom:3px}
.dec-opt .pro::before{content:'+ ';color:#16a34a;font-weight:700}
.dec-opt .con::before{content:'– ';color:#c0392b;font-weight:700}
.dec-rec{margin:8px 0 6px;padding:8px 12px;border-radius:10px;background:var(--brand-50);border-left:3px solid var(--brand-500);font-size:13px}
.gloss-table{width:100%;border-collapse:collapse;font-size:13px}
.gloss-table td{padding:6px 10px;border-bottom:1px solid var(--s-hair);vertical-align:top}
.gloss-table td:first-child{font-weight:700;white-space:nowrap;color:var(--t-strong);width:150px}

/* ===== Diagrams, DFD, learn, obligations, risk ===== */
svg.dg{width:100%;height:auto;display:block}
.dg-zone rect{fill:var(--surface-2);stroke:var(--s-rule);stroke-dasharray:5 4}
.dg-zone text{fill:var(--t-meta);font:600 11px var(--display);letter-spacing:.08em;text-transform:uppercase}
.dg-node rect{fill:var(--surface);stroke:var(--brand-400);stroke-width:1.5}
.dg-node.warn rect{stroke:#dc2626}
.dg-node text{fill:var(--t-strong);font:12px var(--font);text-anchor:middle}
.dg-node .dfd-sub{fill:var(--t-meta);font-size:10px}
.dg-node[data-area]{cursor:pointer}
.dg-node[data-area]:hover rect,.dg-node[data-area]:focus rect{fill:var(--brand-50);stroke:var(--brand-600)}
.dg-node:focus{outline:none}
.dg-arrow path{fill:none;stroke:var(--t-soft);stroke-width:1.6}
.dg-arrow.dash path{stroke-dasharray:6 4}
.dg-arrow.bad path{stroke:#dc2626}
.dg-arrow text{fill:var(--t-soft);font:10.5px var(--font);text-anchor:middle;paint-order:stroke;stroke:var(--surface-2);stroke-width:4px}
.dg-head{fill:var(--t-soft)}.dg-head-bad{fill:#dc2626}
.dg-grid{display:grid;grid-template-columns:minmax(200px,260px) 1fr;gap:14px;align-items:start}
.dg-list{max-height:none}
.dg-wrap{overflow:auto;border-radius:10px;background:var(--surface-2);padding:6px}
.dfd-grid{display:grid;grid-template-columns:minmax(380px,520px) 1fr;gap:14px;align-items:start}
.dfd-t input[type="text"],.dfd-t input:not([type]),.dfd-t select{width:100%;min-width:90px;padding:4px 6px}
.dfd-t td,.dfd-t th{padding:4px 5px}
.ob-grid{display:grid;grid-template-columns:minmax(260px,340px) 1fr;gap:14px;align-items:start}
.ob-form label{display:flex;gap:8px;align-items:flex-start;font-size:12.5px;padding:2px 0;cursor:pointer}
.ob-form input{margin-top:3px;accent-color:var(--brand-600)}
.rk-grid{display:grid;grid-template-columns:minmax(320px,440px) 1fr;gap:14px;align-items:start}
.rk-form{display:flex;flex-direction:column;gap:8px}
.rk-row{display:grid;grid-template-columns:1fr 1.25fr;gap:8px;align-items:center;font-size:12.5px}
.rk-row small{display:block;color:var(--t-meta);font-size:11px}
.rk-tri{display:grid;grid-template-columns:repeat(3,1fr);gap:4px}
.rk-tri.rk-4{grid-template-columns:repeat(4,1fr)}
.rk-tri input,.rk-tri select{width:100%;min-width:0;padding:4px 6px}
.rk-chart{width:100%;height:auto;margin:8px 0}
.rk-chart text{fill:var(--t-meta);font:10.5px var(--font)}
.rk-grid-line,.rk-chart .rk-grid{stroke:var(--s-hair);stroke-width:1}
.rk-line{fill:none;stroke:var(--brand-600);stroke-width:2.2}
.rk-whatif{margin-top:6px;padding:10px 12px;border-radius:10px;background:var(--brand-50);border-left:3px solid var(--brand-500);font-size:13px}
table.rfp th input{width:100%;min-width:70px;padding:3px 6px;font-weight:600}
table.rfp select{padding:2px 4px}
table.rfp tfoot th{background:var(--surface-2);position:static}

/* ===== Readiness, exercises, integrations ===== */
.bar2{display:flex;height:11px;border-radius:9999px;overflow:hidden;background:var(--s-hair)}
.seg{display:block;min-width:2px}
.seg.g3{background:#16a34a}.seg.g2{background:#d97706}.seg.g1{background:#dc2626}.seg.g0{background:#94a3b8}.seg.gx{background:repeating-linear-gradient(45deg,#cbd5e1 0 4px,#e2e8f0 4px 8px)}
:root[data-theme="dark"] .seg.gx{background:repeating-linear-gradient(45deg,#3a4b68 0 4px,#2a3a55 4px 8px)}
.rd-fam{grid-template-columns:90px 1fr auto}
.ex-inject{display:grid;grid-template-columns:70px 1fr;gap:12px;padding:12px 0;border-top:1px solid var(--s-hair)}
.ex-t{font:700 12px ui-monospace,Consolas,monospace;color:var(--brand-700);padding-top:4px}
.ex-inject h3{margin:0 0 4px;font-size:14px}
.ex-inject ul{margin:6px 0 0;padding-left:18px;font-size:13px}
.ex-inject li{margin:4px 0}
.glass.panel h3{margin:0 0 4px}
.report .ex-inject{break-inside:avoid}

@media (max-width:980px){.dg-grid,.dfd-grid,.ob-grid,.rk-grid{grid-template-columns:1fr}.tm-grid,.ac-grid,.rq-grid{grid-template-columns:1fr}.tm-pick,.ac-list{max-height:260px}}
@media print{.theme-btn{display:none}}

/* ---- team sync panel ---- */
.sync-panel{position:fixed;top:64px;right:16px;width:min(560px,calc(100vw - 32px));max-height:calc(100vh - 88px);overflow:auto;z-index:60;padding:16px 18px;border-radius:14px;box-shadow:0 20px 50px rgb(15 23 42/.25)}
.sync-panel[hidden]{display:none}
.sync-head{display:flex;justify-content:space-between;align-items:center;gap:8px}
.sync-head h2{margin:0;font-size:16px}
.sync-panel h3{margin:14px 0 6px;font-size:13px}
.sync-form{margin-bottom:10px}
.sync-l{display:block;font-size:12px;font-weight:600;margin:8px 0}
.sync-l input,.sync-l select,.sync-row input,.sync-row select{display:block;width:100%;margin-top:3px;padding:6px 8px;border:1px solid var(--s-rule);border-radius:8px;background:var(--surface);color:inherit;font:inherit}
.sync-row{display:flex;gap:6px;flex-wrap:wrap;align-items:center;margin:8px 0}
.sync-row input{flex:1 1 160px;margin:0;width:auto}
.sync-row select{width:auto;margin:0}
.sync-msg{margin:8px 0;padding:6px 10px;border-radius:8px;background:rgb(16 185 129/.14);font-size:12px}
.sync-msg.bad{background:rgb(220 38 38/.14)}
.sync-scroll{max-height:220px;overflow:auto}
.btn.danger{color:#b91c1c}
#syncBtn.on{border-color:#10b981}

/* ---- evidence ---- */
.ev-list{list-style:none;margin:0 0 10px;padding:0;display:flex;flex-direction:column;gap:8px}
.ev-row{display:flex;justify-content:space-between;gap:10px;align-items:flex-start;padding:8px 10px;border:1px solid var(--s-hair);border-radius:10px}
.ev-form{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-top:6px}
.ev-form input{padding:6px 8px;border:1px solid var(--s-rule);border-radius:8px;background:var(--surface);color:inherit;font:inherit;min-width:0}
.ev-form label{display:flex;align-items:center;gap:6px}
.ev-form [data-evf="n"],.ev-form .btn{grid-column:1/-1}
.ev-pill{display:inline-block;padding:1px 8px;border-radius:99px;font-size:11px;font-weight:700;margin-left:4px}
.ev-ok{background:rgb(16 185 129/.16)}.ev-soon{background:rgb(245 158 11/.2)}.ev-bad{background:rgb(220 38 38/.16)}.ev-none{background:rgb(100 116 139/.16)}
@media(max-width:560px){.ev-form{grid-template-columns:1fr}}

/* ---- contrast fixes found by the accessibility audit ---- */
.matrix td button{color:#0b1e33;font-weight:700}
:root[data-theme="dark"] .matrix td button{color:#fff}
.tcell.c3 small,.tcell.c2 small,.tcell.c1 small{color:inherit;opacity:.85}
:root[data-theme="dark"] .tcell.c3 small{opacity:.9}
a:not(.btn):not(.tile),.link{color:#005a9c}
:root[data-theme="dark"] a:not(.btn):not(.tile),:root[data-theme="dark"] .link{color:var(--brand-700)}

/* ---- orientation: context bar, start page, help, tour ---- */
.ctxbar{display:flex;flex-wrap:wrap;gap:6px 18px;align-items:flex-start;padding:12px 16px;margin:0 0 14px;border-radius:14px}
.ctx-main{flex:1 1 420px;min-width:0}
.ctx-title{margin:0;font-size:17px;letter-spacing:-.01em}
.ctx-sub{margin:2px 0 0;color:var(--t-mid);font-size:13px;max-width:78ch}
.ctx-dyn{margin:4px 0 0;font-size:12.5px;font-weight:600;color:var(--t-strong)}
.ctx-side{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.ctx-src{font-size:12px;font-weight:600;padding:3px 10px;border-radius:99px;background:rgb(100 116 139/.14);color:var(--t-mid)}
.ctx-src.team{background:rgb(16 185 129/.18);color:var(--t-strong)}
.ctx-filters{flex-basis:100%;display:flex;flex-wrap:wrap;gap:6px 8px;align-items:center;padding-top:8px;border-top:1px solid var(--s-hair);font-size:12.5px}
.ctx-lab{font-weight:700;color:var(--t-mid)}
.ctx-chip{display:inline-flex;align-items:center;gap:4px;padding:2px 4px 2px 10px;border-radius:99px;background:var(--brand-100);color:var(--t-strong);font-weight:600}
.ctx-chip button{border:0;background:none;color:inherit;cursor:pointer;padding:2px 6px;border-radius:99px;font:inherit}
.ctx-chip button:hover{background:rgb(15 23 42/.12)}
.ctx-inert{color:var(--t-soft);font-style:italic}
.start-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:14px}
.start-card{padding:16px 18px;border-radius:14px}
.start-card h3{margin:0 0 4px;font-size:15px}
.start-go{border:0;background:none;padding:0;font:inherit;font-weight:700;color:#005a9c;cursor:pointer;text-align:left}
:root[data-theme="dark"] .start-go{color:var(--brand-700)}
.start-go:hover{text-decoration:underline}
.start-card p{margin:0 0 10px;color:var(--t-mid);font-size:13px}
.start-more{display:flex;gap:6px;flex-wrap:wrap}
.help-panel{position:fixed;top:64px;right:16px;width:min(480px,calc(100vw - 32px));max-height:calc(100vh - 88px);overflow:auto;z-index:70;padding:16px 18px;border-radius:14px;box-shadow:0 20px 50px rgb(15 23 42/.25)}
.help-panel[hidden]{display:none}
.help-panel h2{margin:0;font-size:16px}
.help-panel h3{margin:14px 0 4px;font-size:12px;text-transform:uppercase;letter-spacing:.08em;color:var(--t-soft)}
.help-panel ul{margin:0;padding-left:18px}
.help-panel li{margin:3px 0}
.help-terms dt{font-weight:700;margin-top:6px}
.help-terms dd{margin:0 0 0 0;color:var(--t-mid);font-size:13px}
kbd{padding:1px 6px;border:1px solid var(--s-rule);border-radius:5px;background:var(--surface);font:inherit;font-size:12px}
#tour{position:fixed;inset:0;z-index:90;overflow:hidden}
#tour[hidden]{display:none}
.tour-spot{position:fixed;border-radius:10px;box-shadow:0 0 0 100vmax rgb(8 15 30/.58);outline:2px solid #4aa3e8;pointer-events:none;transition:all .18s ease}
.tour-card{position:fixed;padding:16px 18px;border-radius:14px;box-shadow:0 20px 50px rgb(0 0 0/.35);max-width:calc(100vw - 24px)}
.tour-card h2{margin:2px 0 6px;font-size:17px}
.tour-card p{margin:0 0 12px;font-size:13.5px;line-height:1.5}
.tour-btns{display:flex;align-items:center;gap:8px}
.tour-btns .sep{flex:1}
.btn.primary{background:#0070c0;border-color:#0070c0;color:#fff}
.btn.primary:hover{background:#005a9c}
@media (prefers-reduced-motion:reduce){.tour-spot{transition:none}}
@media (max-width:720px){.ctxbar{padding:10px 12px}.help-panel{top:auto;bottom:8px;right:8px;left:8px;width:auto;max-height:70vh}.tour-card{top:auto!important;bottom:10px;left:10px!important;right:10px;width:auto!important;transform:none!important}}
#tour.dim{background:rgb(8 15 30/.58)}
.tour-gap{flex:1}
#tour .tour-card{background:var(--surface)!important;color:var(--t-body);-webkit-backdrop-filter:none;backdrop-filter:none}
#tour .tour-card .eyebrow{color:var(--t-soft)}