:root{
  --bg:#E8ECEF; --surface:#FFFFFF; --surface-2:#F3F5F7; --ink:#17212B; --ink-2:#4A5664; --ink-3:#7B8691;
  --rule:#D2D8DE; --rule-2:#E4E8EC; --focus:#2B59D6; --hover:rgba(23,33,43,.055);
  --todo:#8A949E; --prog:#2A67DD; --review:#B98100; --done:#1C8C61; --block:#CC3F36;
  --f-body:"Barlow","Segoe UI",system-ui,-apple-system,Roboto,"Helvetica Neue",Arial,sans-serif;
  --f-head:"Barlow Semi Condensed","Barlow","Arial Narrow","Segoe UI",system-ui,sans-serif;
  --pri:var(--ink); --pri-ink:var(--surface);
  color-scheme:light;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --bg:#161616; --surface:#1E1E1E; --surface-2:#262626; --ink:#E3E3E3; --ink-2:#ADADAD; --ink-3:#848484;
    --rule:#343434; --rule-2:#2A2A2A; --focus:#9180F4; --hover:rgba(255,255,255,.06);
    --todo:#87909E; --prog:#4A95F6; --review:#F0A83A; --done:#34C27A; --block:#F0555C;
    --pri:#7B68EE; --pri-ink:#FFFFFF; color-scheme:dark;
  }
}
:root[data-theme="dark"]{
  --bg:#161616; --surface:#1E1E1E; --surface-2:#262626; --ink:#E3E3E3; --ink-2:#ADADAD; --ink-3:#848484;
  --rule:#343434; --rule-2:#2A2A2A; --focus:#9180F4; --hover:rgba(255,255,255,.06);
  --todo:#87909E; --prog:#4A95F6; --review:#F0A83A; --done:#34C27A; --block:#F0555C;
  --pri:#7B68EE; --pri-ink:#FFFFFF; color-scheme:dark;
}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);font:400 15px/1.55 var(--f-body);-webkit-font-smoothing:antialiased;min-height:100vh}
button,input,select,textarea{font:inherit;color:inherit}
a{color:var(--prog)}
:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

.top{position:sticky;top:0;z-index:30;min-height:56px;display:flex;flex-wrap:wrap;align-items:center;gap:8px 16px;padding:8px 18px;background:color-mix(in srgb,var(--surface) 94%,transparent);backdrop-filter:blur(8px);border-bottom:1px solid var(--rule)}
.top .brand{font:700 18px/1.1 var(--f-head);text-decoration:none;color:var(--ink);white-space:nowrap}
.top .crumb{color:var(--ink-3);font:600 15px var(--f-head)}
.top .tools{margin-left:auto;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.who{font:600 13px var(--f-head);color:var(--ink-2);max-width:200px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.who small{display:block;font:400 11.5px var(--f-body);color:var(--ink-3)}

.wrap{max-width:1120px;margin:0 auto;padding:26px 16px 70px}
.page-h{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:12px;margin-bottom:18px}
h1.page-title{margin:0;font:700 clamp(28px,4vw,40px)/1.05 var(--f-head);letter-spacing:-.012em}
.page-sub{margin:4px 0 0;color:var(--ink-2);max-width:66ch}
h2{font:700 20px/1.2 var(--f-head);margin:26px 0 10px}

.btn,.tbtn{display:inline-flex;align-items:center;justify-content:center;gap:6px;height:34px;padding:0 14px;border-radius:8px;border:1px solid var(--rule);background:var(--surface);cursor:pointer;font:600 14px var(--f-head);text-decoration:none;color:var(--ink);white-space:nowrap}
.btn:hover,.tbtn:hover{background:var(--hover)}
.btn.primary{background:var(--pri);color:var(--pri-ink);border-color:transparent}
.btn.primary:hover{filter:brightness(1.08)}
.btn.danger{color:var(--block);border-color:color-mix(in srgb,var(--block) 40%,var(--rule))}
.btn.small,.tbtn.small{height:28px;padding:0 10px;font-size:13px}
.tbtn.icon{width:34px;padding:0}
button:disabled{opacity:.55;cursor:default}

.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(330px,1fr));gap:14px}
.card{background:var(--surface);border:1px solid var(--rule);border-radius:12px;padding:16px 18px;display:flex;flex-direction:column;gap:10px;min-width:0}
.card h3{margin:0;font:700 21px/1.15 var(--f-head)}
.card h3 a{color:inherit;text-decoration:none}
.card h3 a:hover{text-decoration:underline}
.card .sub{margin:0;color:var(--ink-3);font-size:13.5px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.card .meta{display:flex;flex-wrap:wrap;gap:4px 14px;font-size:13px;color:var(--ink-2)}
.card .meta b{color:var(--ink);font-weight:600}
.bar{height:8px;background:var(--rule-2);border-radius:4px;overflow:hidden}
.bar i{display:block;height:100%;background:var(--done);border-radius:4px}
.pct{display:flex;align-items:baseline;gap:8px}
.pct b{font:700 26px/1 var(--f-head)}
.pct span{font-size:12.5px;color:var(--ink-3)}
.card .foot{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:auto;padding-top:6px}
.card .foot .when{margin-left:auto;font-size:12.5px;color:var(--ink-3)}
.pill{display:inline-flex;align-items:center;gap:5px;height:22px;padding:0 8px;border-radius:999px;font:600 12px var(--f-head);background:var(--surface-2);color:var(--ink-2);border:1px solid var(--rule-2);white-space:nowrap}
.pill.done{color:var(--done);border-color:color-mix(in srgb,var(--done) 35%,transparent)}
.pill.prog{color:var(--prog);border-color:color-mix(in srgb,var(--prog) 35%,transparent)}
.pill.block{color:var(--block);border-color:color-mix(in srgb,var(--block) 35%,transparent)}
.pill.review{color:var(--review);border-color:color-mix(in srgb,var(--review) 35%,transparent)}
.empty{color:var(--ink-3);font-style:italic}
details.arch{margin-top:26px}
details.arch summary{cursor:pointer;font:700 16px var(--f-head);color:var(--ink-2)}

.form{max-width:440px;margin:8vh auto 0;background:var(--surface);border:1px solid var(--rule);border-radius:14px;padding:26px 28px 28px}
.form h1{margin:0 0 4px;font:700 28px/1.1 var(--f-head)}
.form p{margin:0 0 16px;color:var(--ink-2)}
.field{display:flex;flex-direction:column;gap:5px;margin:0 0 14px}
.field label,.fl{font:600 13px var(--f-head);color:var(--ink-2)}
input[type=text],input[type=email],input[type=password],input[type=search],select,textarea{height:36px;border:1px solid var(--rule);border-radius:8px;background:var(--surface);padding:0 10px;width:100%;min-width:0}
textarea{height:auto;padding:8px 10px}
.row{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.msg{margin:10px 0 0;font-size:14px}
.msg.err{color:var(--block)}
.msg.ok{color:var(--done)}
.check{display:flex;gap:8px;align-items:center;font-size:14px}
.owner-list{display:flex;flex-direction:column;gap:6px;max-height:220px;overflow:auto;border:1px solid var(--rule);border-radius:8px;padding:8px 10px;margin:2px 0 6px}
.check input{width:16px;height:16px;margin:0}

.tw{overflow:auto;border:1px solid var(--rule);border-radius:10px;background:var(--surface)}
table.tbl{border-collapse:collapse;width:100%;font-size:14px}
table.tbl th,table.tbl td{padding:9px 12px;border-bottom:1px solid var(--rule-2);text-align:left;vertical-align:top}
table.tbl th{font:600 12.5px var(--f-head);color:var(--ink-3);text-transform:uppercase;letter-spacing:.04em;background:var(--surface-2)}
table.tbl tr:last-child td{border-bottom:0}
.dg .dg-row{display:flex;flex-wrap:wrap;align-items:center;gap:6px 12px;margin-top:8px;font-size:13px}
.dg .row{margin-top:8px}
.np-probs{margin:6px 0 10px;padding-left:18px;max-height:220px;overflow:auto;font-size:13px;color:var(--ink-2)}
.np-file-ok{color:var(--ink-2)}
details.dd{display:inline-block}
details.dd > summary{list-style:none;position:relative;display:flex;align-items:baseline;gap:8px;width:230px;box-sizing:border-box;padding:8px 30px 8px 11px;border:1px solid var(--rule);border-radius:8px;background:var(--surface);font-size:13.5px;color:var(--ink);cursor:pointer;user-select:none}
details.dd > summary::-webkit-details-marker{display:none}
details.dd > summary > span{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
details.dd > summary > small{flex:none;font-size:12px;color:var(--ink-3)}
details.dd > summary::after{content:"";position:absolute;right:12px;top:50%;width:6px;height:6px;margin-top:-5px;border-right:1.5px solid var(--ink-2);border-bottom:1.5px solid var(--ink-2);transform:rotate(45deg)}
details.dd[open] > summary{border-color:var(--ink-3)}
details.dd[open] > summary::after{margin-top:-1px;transform:rotate(225deg)}
details.dd > summary:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
.dd-menu{position:fixed;z-index:60;max-height:320px;overflow:auto;padding:6px;border:1px solid var(--rule);border-radius:10px;background:var(--surface);box-shadow:0 12px 32px rgba(0,0,0,.16);display:flex;flex-direction:column;gap:2px}
.dd-menu label{display:flex;align-items:center;gap:9px;padding:7px 9px;border-radius:6px;white-space:nowrap;font-size:13.5px;cursor:pointer}
.dd-menu label:hover{background:var(--hover)}
.dd-menu label small{margin-left:auto;padding-left:14px;font-size:12px;color:var(--ink-3)}
table.tbl .acts{display:flex;flex-wrap:wrap;gap:6px;max-width:250px}
.wrap.wide{max-width:1400px}
table.tbl td.nw{white-space:nowrap}
table.tbl .c-person b{display:block;font-weight:600;color:var(--ink);white-space:nowrap}
table.tbl .c-person small{display:block;color:var(--ink-3);font-size:12px;white-space:nowrap}
table.tbl .st-note{display:block;font-size:12px;color:var(--ink-3);margin-top:3px;white-space:nowrap}
table.tbl select{width:auto;min-width:0}
.code{font:13px ui-monospace,Consolas,monospace;background:var(--surface-2);border:1px solid var(--rule-2);border-radius:6px;padding:6px 8px;word-break:break-all}

/* home */
.home{max-width:1180px}
.hero{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:18px 28px;padding:10px 0 26px;border-bottom:1px solid var(--rule);margin-bottom:22px}
.hero-text{max-width:640px}
.hero-side{display:flex;flex-direction:column;align-items:flex-end;gap:14px;margin-left:auto}
.hero-side #actions{display:flex;gap:8px;justify-content:flex-end}
.prod{position:relative;background:var(--surface);border:1px solid var(--rule);border-radius:16px;padding:22px 24px 16px;margin-bottom:18px;overflow:hidden}
.prod::before{content:"";position:absolute;left:0;top:0;bottom:0;width:5px;background:var(--acc)}
.prod.is-archived{opacity:.75}
.prod-top{display:grid;grid-template-columns:48px minmax(0,1fr) auto;gap:16px 18px;align-items:start}
.prod-ini{display:grid;place-items:center;width:48px;height:48px;border-radius:12px;background:color-mix(in srgb,var(--acc) 16%,transparent);color:var(--acc);font:700 17px var(--f-head);letter-spacing:.02em}
.prod-head h2{margin:0;font:700 26px/1.1 var(--f-head);letter-spacing:-.01em}
.prod-head h2 a{color:inherit;text-decoration:none}
.prod-head h2 a:hover{text-decoration:underline}
.prod-head .sub{margin:6px 0 0;color:var(--ink-2);font-size:14px;max-width:70ch}
.chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.chip{display:inline-flex;align-items:center;gap:4px;height:24px;padding:0 10px;border-radius:999px;background:var(--surface-2);border:1px solid var(--rule-2);font-size:12.5px;color:var(--ink-2)}
.chip b{color:var(--ink);font-weight:600}
.prod-ring{display:grid;grid-template-columns:72px auto;grid-template-rows:auto auto;align-items:center;column-gap:12px;min-width:220px}
.ring{grid-row:1 / span 2;width:72px;height:72px;transform:rotate(-90deg)}
.ring-bg{fill:none;stroke:var(--rule-2);stroke-width:7}
.ring-fg{fill:none;stroke:var(--done);stroke-width:7;stroke-linecap:round;transition:stroke-dasharray .4s}
.ring-fg.zero{display:none}
.ring-num b{font:700 26px/1 var(--f-head);color:var(--ink)}
.ring-cap{font-size:12px;color:var(--ink-3);line-height:1.35;align-self:start}
.prod-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:14px 22px;margin-top:20px;padding-top:16px;border-top:1px solid var(--rule-2)}
.pcol h4,.prod-story h4,.panel h3{margin:0 0 8px;font:600 11.5px var(--f-head);letter-spacing:.07em;text-transform:uppercase;color:var(--ink-3)}
.kv{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:7px;font-size:14px}
.kv li{display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 8px;line-height:1.35}
.kv li a{color:inherit;text-decoration:none}
.kv li a:hover{text-decoration:underline}
.kv b{font-weight:600;color:var(--ink)}
.kv small{flex-basis:100%;font-size:12.5px;color:var(--ink-3)}
.kv .pill{height:20px;font-size:11.5px}
.due{font-size:12.5px;color:var(--done);font-weight:600}
.due.late{color:var(--block)}
.muted{color:var(--ink-3)}
.warn{color:var(--block)}
.mini-bar{display:inline-block;width:120px;height:6px;border-radius:3px;background:var(--rule-2);overflow:hidden;vertical-align:middle}
.mini-bar i{display:block;height:100%;background:var(--done);border-radius:3px}
.prod-story{margin-top:18px;padding-top:14px;border-top:1px solid var(--rule-2)}
.feed{list-style:none;margin:0;padding:0}
.feed li{display:grid;grid-template-columns:14px 64px minmax(100px,200px) minmax(0,1fr);gap:0 12px;align-items:baseline;padding:6px 0;border-top:1px solid var(--rule-2);font-size:14px}
.feed li:first-child{border-top:0}
.feed time{color:var(--ink-3);font-size:12.5px;white-space:nowrap}
.feed .ms{color:var(--ink-2);font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.feed .dot{display:inline-block;width:9px;height:9px;border-radius:50%;background:var(--todo);transform:translateY(-1px)}
.feed .k-qa-sent .dot,.feed li.k-qa-sent .dot,.feed li.k-ext .dot{background:var(--review)}
.feed li.k-qa-no .dot,.feed li.k-bug-block .dot{background:var(--block)}
.feed li.k-bug-prog .dot,.feed li.k-bug-review .dot{background:var(--prog)}
.feed li.k-bug-done .dot,.feed li.k-qa-ok .dot,.feed li.k-achieved .dot{background:var(--done)}
.feed li.k-released .dot{background:var(--ink)}
.feed li.k-standup .dot{background:var(--review);border-radius:2px}
.feed li.k-cadence .dot{background:var(--prog);border-radius:2px}
.feed li.k-blocked .dot{background:var(--block);border-radius:2px}
.feed li.k-unblocked .dot,.feed li.k-decided .dot{background:var(--done);border-radius:2px}
.feed li.k-ask .dot{background:var(--review);border-radius:2px}
.feed li.k-scope-added .dot{background:var(--prog)}
.feed.up li{grid-template-columns:64px 100px minmax(0,1fr) minmax(90px,170px)}
.feed.up a{color:var(--ink);text-decoration:none;font-weight:500}
.feed.up a:hover{text-decoration:underline}
.feed.up .ms{white-space:normal;line-height:1.3}
.feed.rec li{grid-template-columns:auto auto minmax(0,1fr);row-gap:2px}
.feed.rec .txt{grid-column:1 / -1;color:var(--ink-2);font-size:13.5px}
.feed .who{font-weight:600;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.feed .txt{min-width:0;overflow-wrap:anywhere}
.prod-foot{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:16px;padding-top:12px;border-top:1px solid var(--rule-2)}
.prod-foot .when{margin-left:auto;font-size:12.5px;color:var(--ink-3)}
.grid2{display:grid;grid-template-columns:repeat(auto-fit,minmax(340px,1fr));gap:18px;margin-top:6px}
.panel{background:var(--surface);border:1px solid var(--rule);border-radius:16px;padding:18px 22px 16px}
.panel-sub{margin:-4px 0 10px;font-size:12.5px;color:var(--ink-3)}
@media (max-width:760px){.prod-top{grid-template-columns:40px minmax(0,1fr)}.prod-ring{grid-column:1 / -1;min-width:0}.feed li,.feed.up li,.feed.rec li{grid-template-columns:14px 60px minmax(0,1fr)}.feed .ms,.feed .txt{grid-column:3}.hero-side{align-items:flex-start;margin-left:0}.hero-side #actions{justify-content:flex-start}}

.dlg-root{position:fixed;inset:0;z-index:60;display:none}
.dlg-root.open{display:block}
.dlg-back{position:absolute;inset:0;background:rgba(0,0,0,.4)}
.dlg{position:absolute;top:8vh;left:50%;transform:translateX(-50%);width:min(560px,94vw);max-height:84vh;overflow:auto;background:var(--surface);border:1px solid var(--rule);border-radius:12px;padding:18px 22px 22px;box-shadow:0 20px 60px rgba(0,0,0,.25)}
.dlg h2{margin:0 0 12px;font:700 22px var(--f-head)}
.dlg .acts{display:flex;gap:8px;justify-content:flex-end;margin-top:14px}
#toast{position:fixed;left:50%;bottom:22px;transform:translateX(-50%) translateY(10px);background:var(--ink);color:var(--surface);padding:9px 14px;border-radius:9px;font-size:14px;opacity:0;transition:.2s;pointer-events:none;z-index:70;max-width:90vw}
#toast.show{opacity:1;transform:translateX(-50%)}
@media (max-width:640px){.top{padding:8px 12px}.wrap{padding:18px 12px 60px}.form{margin-top:4vh;padding:20px}}
.kv .rel-state{display:block;font-size:12.5px;color:var(--ink-2)}
.kv .rel-state.done{color:var(--done)}

/* ---- ClickUp-inspired look (appended; later rules win) ---- */
:root{--bg:#F6F7FA;--surface:#FFFFFF;--surface-2:#F1F3F7;--ink:#1F2430;--ink-2:#5B6472;--ink-3:#8A93A2;--rule:#E3E6EC;--rule-2:#EDEFF3;--hover:rgba(123,104,238,.08);--focus:#7B68EE;--pri:#7B68EE;--pri-ink:#FFFFFF;--pri-2:#6B59DD;--todo:#9AA3AF;--prog:#3B82F6;--review:#E0961E;--done:#1F9D5A;--block:#E5484D;--shadow:0 1px 2px rgba(16,24,40,.05);--shadow-lg:0 12px 32px rgba(16,24,40,.16);--f-body:"Inter","Segoe UI",system-ui,-apple-system,Roboto,"Helvetica Neue",Arial,sans-serif;--f-head:"Inter","Segoe UI",system-ui,-apple-system,Roboto,"Helvetica Neue",Arial,sans-serif}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){--bg:#17191E;--surface:#1F2228;--surface-2:#272B33;--ink:#E6E8EE;--ink-2:#AAB1BD;--ink-3:#7E8794;--rule:#333845;--rule-2:#2B2F38;--hover:rgba(140,123,255,.14);--focus:#9D8FFF;--pri:#8C7BFF;--pri-ink:#FFFFFF;--pri-2:#7B68EE;--todo:#8891A0;--prog:#5B9CF7;--review:#F0B04A;--done:#3BBF7A;--block:#F0646A;--shadow:0 1px 2px rgba(0,0,0,.4);--shadow-lg:0 16px 40px rgba(0,0,0,.55)}}
:root[data-theme="dark"]{--bg:#17191E;--surface:#1F2228;--surface-2:#272B33;--ink:#E6E8EE;--ink-2:#AAB1BD;--ink-3:#7E8794;--rule:#333845;--rule-2:#2B2F38;--hover:rgba(140,123,255,.14);--focus:#9D8FFF;--pri:#8C7BFF;--pri-ink:#FFFFFF;--pri-2:#7B68EE;--todo:#8891A0;--prog:#5B9CF7;--review:#F0B04A;--done:#3BBF7A;--block:#F0646A;--shadow:0 1px 2px rgba(0,0,0,.4);--shadow-lg:0 16px 40px rgba(0,0,0,.55)}
:root{--c-done:var(--done);--c-prog:var(--prog);--c-block:var(--block);--c-plan:var(--todo);--c-qa:var(--review)}
body{font:400 14px/1.5 var(--f-body);background:var(--bg)}
*{scrollbar-width:thin;scrollbar-color:var(--rule) transparent}
:focus-visible{outline:2px solid var(--focus);outline-offset:2px;border-radius:6px}
a{color:var(--pri)}

.top{background:var(--surface);border-bottom:1px solid var(--rule);min-height:52px;padding:6px 16px;backdrop-filter:none;-webkit-backdrop-filter:none}
.top .brand{font:700 15.5px/1.2 var(--f-head);letter-spacing:-.01em}
.top .crumb{font:500 14px var(--f-body);color:var(--ink-3)}
.btn,.tbtn{height:30px;padding:0 11px;border-radius:6px;border:1px solid var(--rule);background:var(--surface);font:600 13px var(--f-body);color:var(--ink-2);transition:background .12s,border-color .12s,color .12s,box-shadow .12s}
.btn:hover,.tbtn:hover{background:var(--hover);border-color:color-mix(in srgb,var(--pri) 35%,var(--rule));color:var(--ink)}
.btn.primary{background:var(--pri);border-color:var(--pri);color:var(--pri-ink);box-shadow:0 1px 2px rgba(123,104,238,.25)}
.btn.primary:hover{background:var(--pri-2);border-color:var(--pri-2);color:#fff}
.btn.danger{color:var(--block);border-color:color-mix(in srgb,var(--block) 40%,var(--rule))}
.btn.danger:hover{background:color-mix(in srgb,var(--block) 10%,transparent)}
.pill{border-radius:6px;padding:0 8px;font:600 12px/22px var(--f-body);letter-spacing:.01em;background:color-mix(in srgb,var(--st,var(--todo)) 14%,transparent);color:color-mix(in srgb,var(--st,var(--todo)) 80%,var(--ink))}
.pill.done{--st:var(--done)}.pill.prog{--st:var(--prog)}.pill.block{--st:var(--block)}.pill.review{--st:var(--review)}
input[type=text],input[type=email],input[type=password],input[type=search],input[type=date],select,textarea{border:1px solid var(--rule);border-radius:6px;background:var(--surface);color:var(--ink);transition:border-color .12s,box-shadow .12s}
input[type=text]:focus,input[type=email]:focus,input[type=password]:focus,input[type=search]:focus,input[type=date]:focus,select:focus,textarea:focus{outline:0;border-color:var(--pri);box-shadow:0 0 0 3px color-mix(in srgb,var(--pri) 18%,transparent)}
table.tbl th,table.stat th,table.dash th,table.ppl th{font:600 11px/1.3 var(--f-body);letter-spacing:.05em;text-transform:uppercase;color:var(--ink-3);padding:8px 8px;border-bottom:1px solid var(--rule);background:var(--surface)}
table.tbl td,table.stat td,table.dash td,table.ppl td{padding:8px 8px;border-bottom:1px solid var(--rule-2)}
table.tbl tbody tr:hover td,table.stat tbody tr:hover td,table.dash tbody tr:hover td,table.ppl tbody tr:hover td{background:color-mix(in srgb,var(--pri) 5%,transparent)}
.tw{border-radius:8px}

h1.page-title{font:700 clamp(22px,2.6vw,30px)/1.15 var(--f-head);letter-spacing:-.015em}
.page-sub{font-size:14px;color:var(--ink-2)}
h2{font:700 16px/1.3 var(--f-head)}
.wrap{padding:22px 16px 70px}
.prod{border-radius:14px;padding:20px 22px 16px;margin-bottom:14px;box-shadow:var(--shadow);transition:box-shadow .15s,border-color .15s}
.prod:hover{box-shadow:0 6px 18px rgba(16,24,40,.09);border-color:color-mix(in srgb,var(--pri) 30%,var(--rule))}
.prod::before{width:4px;border-radius:14px 0 0 14px}
.prod-head h2{font:700 20px/1.2 var(--f-head)}
.prod-head .sub{font-size:13.5px}
.chip{height:24px;font-size:12px;background:var(--surface-2);border-color:var(--rule-2)}
.pcol h4,.prod-story h4,.panel h3{font:600 11px var(--f-body);letter-spacing:.06em}
.kv{font-size:13.5px}
.ring-num b{font:700 24px/1 var(--f-head)}
.card{border-radius:12px;box-shadow:var(--shadow)}
.form{border-radius:14px;box-shadow:var(--shadow-lg)}
.form h1{font:700 22px/1.2 var(--f-head)}
.field label,.fl{font:600 12px var(--f-body);color:var(--ink-2)}
table.tbl{border:1px solid var(--rule);border-radius:10px;overflow:hidden;background:var(--surface)}
table.tbl tr:last-child td{border-bottom:0}
details.dd > summary{border-radius:6px}
.dd-menu{border-radius:10px;box-shadow:var(--shadow-lg);border:1px solid var(--rule)}
.hero{padding:6px 0 18px;margin-bottom:18px}
.feed li{font-size:13.5px}
.msg.ok{color:var(--done)}
.msg.err{color:var(--block)}