/* Layout: dark stage; glass cards fan out on a shelf (home); inside a project, quiet panels with one green accent */
:root{color-scheme:dark;--k1:rgba(255,255,255,.24);--k2:rgba(255,255,255,.05);--kb:rgba(255,255,255,.42);--ks:rgba(255,255,255,.14);--kl:rgba(255,255,255,.62);--kp1:rgba(255,255,255,.3);--kp2:rgba(255,255,255,.1);--kpk:rgba(255,255,255,.08);--kt:#fff;--lnA:rgba(255,255,255,.55);--lnB:rgba(93,240,138,.85);--qbg:linear-gradient(180deg,#123420,#0c2416);--soft:rgba(255,255,255,.065);--mapbg:#0c0e0c;--dot:rgba(255,255,255,.085);--bg:#090a09;--panel:#121412;--panel2:#191c19;--line:#272b27;--ink:#eef2ee;--mut:#8d968e;--dim:#3a3f3a;--acc:#4fc96d;--acc2:#1f7a3c;--accbg:rgba(79,201,109,.14);--ok:#6fdc8a;--okbg:rgba(79,201,109,.14);--warn:#d6ffe0;--warnbg:rgba(214,255,224,.12);--info:#cdd4ce;--infobg:rgba(255,255,255,.07);--bad:#ffffff;--badbg:rgba(255,255,255,.17);--glass:rgba(255,255,255,.09);--glassline:rgba(255,255,255,.2);--disp:"Urbanist","Inter",system-ui,sans-serif;--body:"Urbanist","Inter",system-ui,-apple-system,"PingFang SC",sans-serif}
*{box-sizing:border-box}
body{margin:0;font:400 15px/1.5 var(--body);letter-spacing:.005em;color:var(--ink);background:var(--bg)}
button,select,input,textarea{font:inherit;color:inherit}
svg.ic{width:18px;height:18px;flex:none;stroke:currentColor;fill:none;stroke-width:1.45;stroke-linecap:round;stroke-linejoin:round;vertical-align:-3px}
svg.ic.fl{fill:currentColor;stroke:none}
button{border:1px solid rgba(255,255,255,.05);background:rgba(255,255,255,.065);box-shadow:inset 0 1px 0 rgba(255,255,255,.05);border-radius:999px;padding:8px 16px;font-weight:500;cursor:pointer;display:inline-flex;align-items:center;gap:7px;transition:border-color .15s,background .15s}
button:hover{border-color:#4a514a}button:focus-visible,select:focus-visible,input:focus-visible{outline:2px solid var(--acc);outline-offset:2px}
button.primary{background:var(--acc);color:#06150a;border-color:var(--acc);font-weight:600}button.primary:hover{background:#6bdc86}
button.link{border:0;background:none;padding:0;text-decoration:underline;color:var(--acc);border-radius:0}
button:disabled{opacity:.4;cursor:not-allowed}
select,input[type=text],input[type=number],input[type=search],textarea{border:1px solid var(--line);border-radius:12px;padding:8px 10px;background:#0d0f0d;width:100%}
input[type=file]{color:var(--mut)}textarea{min-height:70px}input[type=checkbox]{accent-color:var(--acc);width:16px;height:16px}
h1{font:600 26px/1.2 var(--disp);margin:0 0 6px;letter-spacing:-.01em;text-wrap:balance}h2{font:600 17px var(--disp);margin:0 0 12px}h3{font:600 14px var(--disp);margin:0 0 8px}
p{margin:0 0 10px}.mut{color:var(--mut)}small{color:var(--mut)}
.proto{display:flex;gap:10px;align-items:center;padding:6px 20px;background:#3a2a5c;color:#fff;font-size:12px;flex-wrap:wrap}.proto .sp{flex:1}.proto select{width:auto;padding:2px 6px;font-size:12px;background:#fff;color:#16202e;border-radius:6px}.proto button{padding:2px 10px;font-size:12px;background:#fff;color:#16202e;border:0}
.top{display:flex;align-items:center;gap:18px;padding:12px 20px;background:rgba(9,10,9,.82);backdrop-filter:blur(14px);border-bottom:1px solid var(--line);position:sticky;top:env(safe-area-inset-top,0px);z-index:50;flex-wrap:wrap}
.brand{font:700 16px var(--disp);display:flex;align-items:center;gap:9px}.brand i{width:26px;height:26px;border-radius:8px;background:linear-gradient(150deg,#7be495,#1f7a3c);display:grid;place-items:center;color:#06150a}
.top nav{display:flex;gap:6px}.top nav button{border-color:transparent;background:none;color:var(--mut)}.top nav button.on{background:var(--panel2);color:var(--ink);border-color:var(--line)}
.top .sp{flex:1}.user{display:flex;gap:9px;align-items:center;line-height:1.25}.user small{display:block}.av{width:32px;height:32px;border-radius:50%;background:var(--accbg);color:var(--acc);display:grid;place-items:center;font-weight:700;border:1px solid var(--acc2)}
.crumb{padding:12px 20px 0;color:var(--mut);font-size:13px}.crumb a{color:var(--mut);cursor:pointer;text-decoration:underline}
.ptabs,.ttabs{display:flex;gap:4px;padding:8px 20px 0;border-bottom:1px solid var(--line);align-items:center;flex-wrap:wrap}
.ptabs button,.ttabs button{border:0;border-bottom:2px solid transparent;border-radius:0;background:none;padding:9px 12px;color:var(--mut)}
.ptabs button.on,.ttabs button.on{border-bottom-color:var(--acc);color:var(--ink);font-weight:600}
.ttabs>button:last-child{border:1px solid var(--line);border-radius:999px;padding:6px 12px}
.strip{display:flex;gap:6px;padding:10px 20px;border-bottom:1px solid var(--line);align-items:center;flex-wrap:wrap}
.strip button{padding:4px 12px;font-size:13px}.strip button.on{background:var(--accbg);color:var(--acc);border-color:var(--acc2)}
.cnt{display:inline-block;min-width:18px;padding:0 6px;border-radius:9px;background:var(--warnbg);color:var(--warn);font-size:12px;text-align:center}.cnt.zero{background:var(--panel);color:var(--mut)}
main{padding:22px 20px;max-width:1280px;margin:0 auto}main.wide{max-width:none;padding:0}
.card{background:var(--panel);border:1px solid var(--line);border-radius:18px;padding:18px;margin-bottom:14px;overflow-x:auto;min-width:0}
.grid{display:grid;gap:14px}.grid>*{min-width:0}.g2{grid-template-columns:1fr 1fr}.g3{grid-template-columns:repeat(3,1fr)}.g4{grid-template-columns:repeat(4,1fr)}
.row{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.between{justify-content:space-between}
table{border-collapse:collapse;width:100%}th,td{padding:9px 10px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}
th{font-size:13px;color:var(--mut);font-weight:500;white-space:nowrap}
tbody tr:hover td,table tr:hover td{background:rgba(255,255,255,.025)}td.num,th.num{text-align:right;font-variant-numeric:tabular-nums}
tr:last-child td{border-bottom:0}
.tag{display:inline-block;padding:2px 9px;border-radius:999px;font-size:12px;background:var(--panel2);color:#b7c0b8;white-space:nowrap;border:1px solid var(--line)}
.tag.ok{background:var(--okbg);color:var(--ok);border-color:transparent}.tag.warn{background:var(--warnbg);color:var(--warn);border-color:transparent}.tag.info{background:var(--infobg);color:var(--info);border-color:transparent}.tag.bad{background:var(--badbg);color:var(--bad);border-color:transparent}
.note{padding:11px 14px;border-radius:12px;border:1px solid transparent;background:rgba(255,255,255,.06);border-color:var(--line);color:#dfe6df;margin:10px 0}.note b{color:var(--warn)}
.note.info{background:var(--infobg);color:#dfe6df}.note.info b{color:var(--info)}.note.ok{background:var(--okbg);color:#c8efd2}.note.ok b{color:var(--ok)}.note.bad{background:var(--badbg);color:#fff}.note.bad b{color:var(--bad)}
.steps{display:flex;gap:6px;margin:0 0 16px;flex-wrap:wrap}.steps div{flex:1;min-width:120px;padding:9px 12px;border:1px solid var(--line);background:var(--panel);font-size:13px;color:var(--mut);border-radius:12px}
.steps div.on{background:var(--accbg);color:var(--acc);border-color:var(--acc2);font-weight:600}.steps div.done{color:var(--ok)}
.pipe{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;margin-bottom:14px}.pipe div{padding:14px;border:1px solid var(--line);background:var(--panel);cursor:pointer;border-radius:16px;transition:border-color .15s,transform .15s}.pipe div:hover{border-color:var(--acc2);transform:translateY(-2px)}
.pipe b{display:block;font-family:var(--disp)}.pipe .big{font:600 24px var(--disp)}
.field{display:block;margin-bottom:12px}.field>span{display:block;font-size:12px;color:var(--mut);margin-bottom:4px}
.ws{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);height:calc(100vh - 230px);min-height:540px}
.ws>section{overflow:auto;border-right:1px solid var(--line)}.ws>aside{overflow:auto;padding:14px}
.ws tr{cursor:pointer}.ws tr.sel td{background:var(--accbg)}.ws tr.sel td:first-child{box-shadow:inset 3px 0 0 var(--acc)}.ws tr.sec td{color:var(--mut);font-weight:600;cursor:default}
.ws th{position:sticky;top:0;background:var(--bg);z-index:2}
td.pend{color:var(--warn)}td.sugg{color:var(--info)}
.diff{display:grid;grid-template-columns:1fr 1fr;border:1px solid var(--line);border-radius:12px;margin:10px 0}.diff div{padding:10px}.diff div+div{border-left:1px solid var(--line)}
mark{background:var(--warnbg);color:var(--warn);padding:0 3px;border-radius:4px}
.src{border:1px solid var(--line);border-radius:12px;background:#0d0f0d;padding:12px;font-size:12px}.src tr.cur td{background:var(--warnbg);color:var(--warn)}
.chips{display:flex;gap:6px;padding:9px 12px;border-bottom:1px solid var(--line);flex-wrap:wrap;align-items:center}
.chips button{padding:3px 11px;font-size:12px}.chips button.on{background:var(--accbg);color:var(--acc);border-color:var(--acc2)}.chips select{width:auto;padding:4px 8px}
.opt{border:1px solid var(--line);border-radius:16px;padding:18px;background:var(--panel2);cursor:pointer;text-align:left;width:100%;display:block}.opt:hover{border-color:var(--acc)}
dialog{border:1px solid var(--glassline);border-radius:18px;padding:20px;width:min(520px,92vw);background:#161916;color:var(--ink)}dialog::backdrop{background:rgba(0,0,0,.6);backdrop-filter:blur(4px)}
#toast{position:fixed;bottom:22px;left:50%;transform:translateX(-50%);background:var(--acc);color:#06150a;font-weight:600;padding:9px 18px;border-radius:999px;display:none;z-index:99}
.tree{font-size:13px}.tree ul{list-style:none;margin:0;padding-left:20px;border-left:1px solid var(--line)}.tree>ul{border:0;padding:0}.tree li{padding:3px 0}
.s-rec{background:var(--okbg);color:var(--ok)}.s-prop{background:var(--infobg);color:var(--info)}.s-kick{background:var(--warnbg);color:var(--warn)}.s-new{background:rgba(255,255,255,.14);color:#fff}
.scan{background:repeating-linear-gradient(0deg,#141714,#141714 16px,#222622 17px);border:1px solid var(--line);height:300px;border-radius:12px;position:relative}.scan span{position:absolute;left:10px;top:8px;font-size:11px;color:var(--mut);background:#141714;padding:0 4px}
td.low{background:var(--warnbg)}td.low input{border-color:var(--warn)}
.glass{background:var(--glass);border:1px solid var(--glassline);backdrop-filter:blur(18px) saturate(1.2);-webkit-backdrop-filter:blur(18px) saturate(1.2);border-radius:18px;box-shadow:0 18px 50px rgba(0,0,0,.5)}
/* stacked bars with linked highlight */
.bar{height:8px;background:var(--panel2);border-radius:99px;overflow:hidden;display:flex;min-width:120px}.bar i{display:block;height:100%;transition:opacity .15s}
.bar .sf{background:var(--acc)}.bar .sr{background:repeating-linear-gradient(115deg,rgba(214,255,224,.8) 0 2px,rgba(214,255,224,.15) 2px 5px)}.bar .sm{background:var(--dim)}
.bar.big{height:26px;border-radius:9px}.bar.big i{position:relative;font:600 12px/26px var(--body);font-style:normal;color:#06150a;text-align:center;overflow:hidden}.bar.big .sm{color:var(--ink)}
.bar.big i span{opacity:0;transition:opacity .15s}.bar.big i:hover span{opacity:1}
[data-hl=f] .sr,[data-hl=f] .sm,[data-hl=r] .sf,[data-hl=r] .sm,[data-hl=m] .sf,[data-hl=m] .sr{opacity:.18}
[data-hl=f] .sf span,[data-hl=r] .sr span,[data-hl=m] .sm span{opacity:1}
.legend{display:flex;gap:6px;flex-wrap:wrap}.legend button{font-size:12px;padding:4px 11px}.legend i{width:9px;height:9px;border-radius:3px;display:inline-block}
/* home: one long row of project folders with real depth; the centre one turns green */
.hero{padding:34px 20px 80px;max-width:1760px;margin:0 auto}
.shelfwrap{position:relative;margin-top:26px}
.shelf{position:relative;height:470px;perspective:1500px;perspective-origin:50% 12%;overflow:hidden;cursor:pointer;touch-action:pan-y}
.shelf:focus-visible{outline:1px solid var(--acc2);outline-offset:-2px;border-radius:20px}
.track{position:absolute;inset:0;transform-style:preserve-3d}
.book{position:absolute;left:50%;top:150px;margin-left:-82px;width:164px;height:234px;transform-style:preserve-3d;will-change:transform;--h:0;color:color-mix(in srgb,#fff calc(var(--h)*100%),var(--kt))}
.book>*{position:absolute}
.pl{inset:0;border-radius:22px;border:1.5px solid color-mix(in srgb,rgba(190,255,208,.95) calc(var(--h)*100%),var(--kb));background:linear-gradient(176deg,color-mix(in srgb,rgba(70,245,125,.97) calc(var(--h)*100%),var(--k1)),color-mix(in srgb,rgba(4,120,42,.96) calc(var(--h)*100%),var(--k2)))}
.pl.e1{transform:translateZ(-3px)}.pl.e2{transform:translateZ(-6px);opacity:.55}
.sheet{left:20%;right:9%;top:8%;height:52%;border-radius:9px;box-sizing:border-box;padding:13px 11px 0;background:repeating-linear-gradient(180deg,transparent 0 9px,color-mix(in srgb,rgba(255,255,255,.75) calc(var(--h)*100%),var(--kl)) 9px 14px) content-box,color-mix(in srgb,rgba(210,255,222,.36) calc(var(--h)*100%),var(--ks));border:1px solid var(--kb)}
.sheet.s1{transform:translate3d(-13px,12px,5px)}.sheet.s2{transform:translate3d(-6px,6px,9px)}.sheet.s3{transform:translateZ(13px)}
.pocket,.pk{left:-1.5px;right:-1.5px;bottom:-1.5px;height:52%;border-radius:4px 24px 22px 22px;border:1.5px solid color-mix(in srgb,rgba(190,255,208,.95) calc(var(--h)*100%),var(--kb));transform-origin:50% 100%}
.pocket{--pt:color-mix(in srgb,rgba(40,225,100,.96) calc(var(--h)*100%),var(--kp1));background:linear-gradient(180deg,var(--pt),color-mix(in srgb,rgba(6,140,48,.96) calc(var(--h)*100%),var(--kp2)));transform:translateZ(24px) rotateX(-7deg)}
.pk{background:color-mix(in srgb,rgba(4,95,34,.9) calc(var(--h)*100%),var(--kpk));transform:translateZ(20px) rotateX(-7deg);opacity:.6}
.pocket::before{content:"";position:absolute;left:-1.5px;top:-21px;width:52%;height:22px;background:var(--pt);border:1.5px solid color-mix(in srgb,rgba(190,255,208,.95) calc(var(--h)*100%),var(--kb));border-bottom:0;border-radius:16px 16px 0 0}
.bk-n{position:absolute;left:15px;top:4px;font:600 14px var(--disp);display:flex;gap:6px;align-items:center}.bk-n svg{width:17px;height:17px}
.bk-name{position:absolute;left:18px;bottom:24px;font:500 17px var(--disp);transform:rotate(-24deg);transform-origin:left bottom;white-space:nowrap}
.pop{position:absolute;top:34px;left:max(8px,calc(50% - 270px));width:180px;padding:12px 14px;z-index:5;display:grid;gap:0;border-radius:18px;border:1px solid rgba(255,255,255,.5);background:linear-gradient(140deg,rgba(255,255,255,.46),rgba(255,255,255,.18));backdrop-filter:blur(20px) saturate(1.3);-webkit-backdrop-filter:blur(20px) saturate(1.3);box-shadow:0 16px 40px rgba(0,0,0,.4);color:#fff;pointer-events:none}
.pop b{font:500 15px/1.2 var(--disp)}.pop small{color:rgba(255,255,255,.72);font-size:12px}.pop .pc{font:300 26px/1.1 var(--disp);margin-top:6px}.pop .pc i{font-style:normal;font-size:16px;opacity:.65}
.ticks{display:flex;justify-content:center;align-items:flex-end;gap:9px;height:26px;margin-top:6px}
.ticks button{width:2px;height:10px;padding:0;border:0;border-radius:2px;background:rgba(255,255,255,.28);box-shadow:none;transition:height .2s,background .2s}.ticks button.on{height:22px;background:var(--acc)}
.count{text-align:center;color:var(--mut);font-size:13px;margin:10px 0 0}
.duo{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:12px;align-items:center}
.duo .shelfwrap{margin-left:-20px}
#pdet{min-width:0}
@media(max-width:1100px){.duo{grid-template-columns:1fr}#pdet{max-width:440px;margin:30px auto 0;width:100%}}
.gstack{position:relative;padding-top:40px}
.gstack>i{position:absolute;top:0;height:120px;border-radius:22px;background:linear-gradient(160deg,rgba(120,220,150,.5),rgba(40,140,75,.35));border:1px solid rgba(190,250,205,.4)}
.gstack>i:nth-child(1){left:18%;right:6%;transform:rotate(-3deg)}.gstack>i:nth-child(2){left:30%;right:14%;top:8px;transform:rotate(2deg)}
.gpanel{position:relative;border-radius:26px;padding:24px 22px 18px;color:#fff;background:linear-gradient(165deg,#3aa862,#1f7f43 70%);box-shadow:0 30px 60px rgba(0,0,0,.45),inset 0 1px 0 rgba(255,255,255,.25)}
.gpanel small{color:rgba(255,255,255,.72);display:block}.gt{font:500 22px var(--disp)}
.gline{display:flex;justify-content:space-between;flex-wrap:wrap;font-size:13px;margin:22px 0 18px}.gl{flex-basis:100%;position:relative;height:2px;margin-top:8px;background:repeating-linear-gradient(90deg,rgba(255,255,255,.7) 0 2px,transparent 2px 6px)}
.gl i{position:absolute;left:0;top:0;bottom:0;background:#fff}.gl em{position:absolute;top:-9px;margin-left:-5px;border:5px solid transparent;border-top:7px solid #fff}
.grow{display:flex;gap:14px;align-items:center;padding:10px 0;text-align:left;width:100%}.grow b{font-weight:500;font-size:16px;display:block}
.gi{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;background:rgba(255,255,255,.14);flex:none}
.gnext{margin-top:10px;display:flex;gap:14px;align-items:center;width:100%;text-align:left;padding:14px;border-radius:20px;background:rgba(255,255,255,.14);border:0;color:#fff;box-shadow:none}.gnext:hover{background:rgba(255,255,255,.22)}.gnext>div{flex:1}.gnext b{font-weight:500;font-size:16px;display:block}
.gpill{padding:5px 12px;border-radius:99px;background:rgba(0,0,0,.22);font-size:13px}
.plist h2{font-size:22px;font-weight:500;margin:6px 0 4px}
.plist{max-width:1400px;margin:120px auto 0;background:linear-gradient(180deg,#1a1c1a,#121412);border:1px solid var(--line);border-radius:28px;padding:10px 20px 14px;min-width:0}.plist .scroll{overflow-x:auto}
.plist th{position:sticky;top:0;background:#181a18;z-index:3;padding-top:14px}.plist td{padding:13px 10px;vertical-align:middle}.plist td b{font-weight:500;font-size:16px}
.pill{padding:11px 20px;font-size:15px;font-weight:400;gap:10px;color:#d9dfd9}.pill svg{width:20px;height:20px}.pill.on{background:var(--acc);color:#06150a;font-weight:500;border-color:transparent}
.hint{position:relative;cursor:help;border-bottom:1px dotted var(--mut);padding-bottom:1px}.hint .tip{right:auto;left:0;top:calc(100% + 8px);white-space:nowrap;font-weight:400;color:var(--ink)}.hint:hover .tip,.hint:focus .tip{display:block}th.num .hint .tip{left:auto;right:0}
.pg{position:relative;height:8px;border-radius:99px;background:rgba(255,255,255,.08);overflow:hidden;min-width:160px;margin-bottom:5px}
.pg i{position:absolute;left:0;top:0;bottom:0;border-radius:99px;background:linear-gradient(90deg,#0c6a2e,#2fbf5f 55%,#b8f9c8);box-shadow:0 0 12px rgba(79,201,109,.6)}.pg em{position:absolute;top:0;bottom:0;background:repeating-linear-gradient(115deg,rgba(214,255,224,.75) 0 2px,transparent 2px 5px)}
/* tables */
.tcard{padding:16px}.cell2{display:flex;gap:10px;align-items:center}.cell2 small{display:block}.cell2 b{font-weight:600}
.fi{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;background:var(--panel2);border:1px solid var(--line);flex:none;color:var(--mut)}.fi.g{background:var(--accbg);color:var(--acc);border-color:var(--acc2)}
.icb{width:34px;height:34px;padding:0;justify-content:center;border-radius:10px}
.search{display:flex;align-items:center;gap:8px;border:1px solid var(--line);border-radius:12px;padding:0 10px;background:#0d0f0d;width:260px;max-width:100%}.search input{border:0;background:none;padding:8px 0}.search input:focus-visible{outline:0}.search:focus-within{border-color:var(--acc)}.search svg{color:var(--mut)}
.legend button.on{background:var(--accbg);color:var(--acc);border-color:var(--acc2)}
.search{border-radius:999px;padding:3px 16px;background:rgba(255,255,255,.065);border-color:rgba(255,255,255,.05)}
th svg{width:13px;height:13px;margin-right:4px}
.tag.ok::before,.tag.warn::before,.tag.bad::before,.tag.info::before{content:"";display:inline-block;width:6px;height:6px;border-radius:50%;background:currentColor;margin-right:6px;vertical-align:1px}
.exp{width:22px;height:22px;padding:0;justify-content:center;border-radius:6px;margin-right:8px;font-size:14px;line-height:1}
tr.sub td{background:rgba(255,255,255,.02);padding-left:42px}tr.sub td+td{padding-left:10px}
/* slide to compare */
.cmp{position:relative;border:1px solid var(--line);border-radius:14px;overflow:hidden;margin:12px 0;--p:16%;user-select:none}
.cmp .layer{padding:34px 14px 12px;display:grid;gap:0}.cmp .layer.bq{background:#0d0f0d}.cmp .layer.qt{position:absolute;inset:0;background:linear-gradient(160deg,#143621,#0e2416);clip-path:inset(0 0 0 var(--p));transition:clip-path .08s linear}
.cmp .lab{position:absolute;top:9px;font-size:12px;color:var(--mut)}.cmp .bq .lab{left:14px}.cmp .qt .lab{right:14px;color:var(--ok)}
.cmp .f{display:grid;grid-template-columns:92px 1fr;gap:10px;min-height:46px;padding:6px 0;border-top:1px solid rgba(255,255,255,.07);align-items:start}.cmp .f small{padding-top:2px}
.cmp .f div{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.cmp .f.df div{color:var(--warn);font-weight:600}
.cmp .hd{position:absolute;top:0;bottom:0;left:var(--p);width:2px;background:var(--acc);transform:translateX(-1px);pointer-events:none}
.cmp .hd::after{content:"‹ ›";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);background:var(--acc);color:#06150a;font-weight:700;font-size:12px;padding:5px 7px;border-radius:999px;white-space:nowrap;box-shadow:0 4px 14px rgba(0,0,0,.5)}
.cmp input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:ew-resize;margin:0}
.fchk{display:flex;gap:6px;flex-wrap:wrap;margin:0 0 10px}
/* supplier comparison */
.sups{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:14px;margin:26px 0 18px;align-items:end}
.supc{position:relative;background:linear-gradient(170deg,#262a26,#171a17);border:1px solid var(--line);border-radius:22px;padding:18px;transition:opacity .15s,transform .2s;color:#b9c1ba}
.supc .sn{font:600 16px var(--disp);color:var(--ink)}.supc.dim{opacity:.4}
.supc.best{background:linear-gradient(170deg,#1f8f47,#0f4a26 70%);border-color:#7be495;color:#e9fbee;padding:30px 18px 22px;transform:translateY(-12px);box-shadow:0 24px 50px rgba(31,143,71,.3)}
.supc.best small{color:#c5efd0}.supc.best .bar{background:rgba(0,0,0,.25)}.supc.best .bar .sf{background:#fff}
.ribbon{position:absolute;top:-13px;left:18px;background:var(--acc);color:#06150a;font-weight:700;font-size:12px;padding:5px 12px;border-radius:99px}
.supc .bigp{font:600 46px/1.1 var(--disp);margin:8px 0 2px;color:var(--ink)}.supc .bigp i{font-style:normal;font-size:24px;opacity:.7}
.crit{list-style:none;margin:14px 0 0;padding:0}.crit li{display:flex;gap:10px;align-items:center;padding:9px 0;border-top:1px solid rgba(255,255,255,.1);font-size:13px}
.crit i{width:22px;height:22px;border-radius:50%;display:grid;place-items:center;font-style:normal;font-size:12px;font-weight:700;flex:none}.crit .y i{background:var(--acc);color:#06150a}.crit .n i{background:transparent;color:#fff;border:1px solid rgba(255,255,255,.6)}.supc.best .crit .y i{background:#fff}
.dv{display:block;position:relative;height:5px;width:84px;background:var(--panel2);border-radius:3px;margin:4px 0 0 auto}.dv::after{content:"";position:absolute;left:50%;top:-2px;bottom:-2px;width:1px;background:var(--mut)}.dv i{position:absolute;top:0;bottom:0;background:#9aa39b;border-radius:3px}.dv i.hot{background:var(--bad)}
#cmpt td.c{transition:opacity .15s}#cmpt td.flag{background:var(--badbg)}#cmpt td.flag small{color:var(--bad);font-weight:600}
#cmpt[data-hc="1"] td.c:not(.c1),#cmpt[data-hc="2"] td.c:not(.c2),#cmpt[data-hc="3"] td.c:not(.c3),#cmpt[data-hc="4"] td.c:not(.c4){opacity:.3}
.tipw{position:relative;display:inline-block}.tipw small{display:block}
.tip{position:absolute;right:0;top:calc(100% + 6px);display:none;white-space:nowrap;text-align:left;z-index:9;padding:10px 12px;font-size:12px;line-height:1.6;border-radius:12px;background:#1d221d}
td.c:hover .tip{display:block}
@media(max-width:1000px){.plist{margin-top:60px}.supc.best{transform:none}.pop{left:16px}}
@media(max-width:900px){.g2,.g3,.g4,.pipe{grid-template-columns:1fr}.ws{grid-template-columns:1fr;height:auto}.ws>section{border-right:0}.diff{grid-template-columns:1fr}main{padding:16px}.hero{padding:18px 16px 0}.hero h1{font-size:26px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}
/* motion: staggered entrance on page change, soft pulse on cells waiting for review */
@keyframes rise{from{opacity:0;transform:translateY(12px)}}
.enter .card,.enter .pipe>div,.enter .supc,.enter .plist,.enter .map{animation:rise .5s cubic-bezier(.2,.7,.2,1) backwards}
.enter .tile:nth-child(2),.enter .pipe>div:nth-child(2),.enter .supc:nth-child(2){animation-delay:.06s}.enter .tile:nth-child(3),.enter .pipe>div:nth-child(3),.enter .supc:nth-child(3){animation-delay:.12s}.enter .tile:nth-child(4),.enter .pipe>div:nth-child(4){animation-delay:.18s}.enter .pipe>div:nth-child(5){animation-delay:.24s}
@keyframes beat{50%{box-shadow:inset 0 0 0 1px var(--warn)}}
td.pend{animation:beat 2.6s ease-in-out infinite}
@media(prefers-reduced-motion:reduce){*{animation:none!important}}
/* project overview: node map and ask box */
.ov{max-width:1400px}
.map{position:relative;border-radius:30px;padding:26px 22px 22px;border:1px solid var(--line);background:radial-gradient(var(--dot) 1px,transparent 1.5px) 0 0/22px 22px,radial-gradient(90% 80% at 8% 100%,rgba(46,170,84,.5),transparent 60%),radial-gradient(60% 50% at 100% 0,rgba(46,170,84,.12),transparent 70%),var(--mapbg)}
.mapscroll{overflow-x:auto}.mapscroll>svg{display:block;width:100%;min-width:900px;height:auto}
.ln{fill:none;stroke:url(#lg);stroke-width:1.2}.lg2{fill:none;stroke:#3ddc6a;stroke-width:5;opacity:.1;filter:url(#gw)}.dt{fill:var(--ink)}.dt2{fill:var(--mapbg);stroke:var(--mut);stroke-width:1}.ah{fill:#5df08a}
.nd{cursor:pointer;outline:0}.nd .art,.nd .chip{transition:filter .18s,transform .18s}.nd:hover .art,.nd:focus-visible .art,.nd:hover .chip,.nd:focus-visible .chip{filter:brightness(1.06) drop-shadow(0 0 12px rgba(110,230,140,.8))}
.nt{fill:var(--ink);font:500 16px var(--disp);text-anchor:middle}.ns{fill:var(--mut);font-size:13px;text-anchor:middle}
.paper{stroke:#fff;stroke-width:1.5}.paper.on{stroke:var(--acc);stroke-width:3}
.nt2{fill:#10140f;font:600 15px var(--disp)}.ns2{fill:#4d554e;font-size:12.5px}
.bd{stroke:#0c0e0c;stroke-width:2}.bd.ok{fill:var(--acc)}.bd.note{fill:#fff}.bd.warn{fill:#fff}.bt{text-anchor:middle;font:700 12px var(--body);fill:#06150a}
.chip{fill:rgba(255,255,255,.08);stroke:rgba(255,255,255,.28)}.ct{text-anchor:middle;font:500 12.5px var(--disp);fill:#e6ece6}.nb{fill:var(--acc);stroke:#0c0e0c;stroke-width:1.5}
.tc{fill:#141814;stroke:rgba(255,255,255,.18);stroke-width:3}.tr{fill:none;stroke:var(--acc);stroke-width:3;stroke-linecap:round}.tg path{fill:none;stroke:#fff;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.ft{text-anchor:middle;font:600 16px var(--disp);fill:#fff}.fs{text-anchor:middle;font-size:13px;fill:rgba(255,255,255,.9)}
.drawer{margin:6px 0 18px;padding:18px 20px;border-radius:22px;box-shadow:none}.srows{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:4px 18px;margin-top:8px}
.grow.d{background:none;border:0;box-shadow:none;border-radius:16px;padding:8px}.grow.d:hover{background:rgba(255,255,255,.06)}.grow.d small{display:block}
.ask{max-width:640px;margin:6px auto 0;padding:18px 20px 14px;border-radius:26px;border:1px solid rgba(255,255,255,.35);background:rgba(255,255,255,.1);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);display:grid;gap:10px}
.ask input{border:0;background:none;font-size:17px;padding:4px 0}.ask input:focus-visible{outline:0}.ask:focus-within{border-color:#fff}
.sg{font-size:13px;padding:6px 12px;font-weight:400}.send{width:38px;height:38px;padding:0;justify-content:center;background:#fff;color:#06150a;border-radius:50%}
.qa{padding-bottom:6px}.qa p{margin:8px 0 0;font-size:16px;min-height:1.5em}
.think{margin-top:8px;border-radius:14px;background:rgba(0,0,0,.22);padding:10px 12px}.thh{display:flex;align-items:center;gap:8px;font-size:14px;color:#dfe6df}
.ring{width:15px;height:15px;fill:none;stroke:var(--acc);stroke-width:1.6;animation:spin 2.4s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}
.dots{display:inline-flex;gap:3px}.dots i{width:3px;height:3px;border-radius:50%;background:currentColor;opacity:.22;animation:dot 1.4s ease-in-out infinite}.dots i:nth-child(2){animation-delay:.18s}.dots i:nth-child(3){animation-delay:.36s}@keyframes dot{0%,62%,100%{opacity:.22}31%{opacity:.9}}
.think ul{list-style:none;margin:8px 0 0;padding:0 0 0 23px;font-size:13.5px}.think li{padding:3px 0;animation:tin .3s ease both}@keyframes tin{from{opacity:0;transform:translateY(-6px)}}
.think li.now{background:linear-gradient(90deg,#8d968e 0 35%,#fff 50%,#8d968e 65% 100%) 100% 0/300% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:tin .3s ease both,shine 1.3s linear infinite}@keyframes shine{to{background-position:0 0}}
.think li.done{color:var(--mut)}.think li.done::before{content:"✓ ";color:var(--acc)}
.think.mini{padding:6px 12px;background:none}.think.mini ul,.think.mini .dots,.think.mini .ring{display:none}.think.mini .thh{color:var(--mut);font-size:13px}.think.mini svg{color:var(--acc)}
.caret::after{content:"";display:inline-block;width:2px;height:1em;background:#fff;margin-left:2px;vertical-align:-2px;animation:blink 1s steps(1) infinite}@keyframes blink{50%{opacity:0}}
/* review: one sheet, two layers, a line that follows the pointer */
.rv{max-width:1500px}
.wlab{display:flex;justify-content:space-between;align-items:flex-end;margin:6px 4px 10px}.wlab small{display:block}.wlab b{font:500 20px var(--disp)}.wlab b.q{color:var(--acc)}
.wipe{position:relative;border:1px solid var(--line);border-radius:22px;overflow:hidden;cursor:ew-resize;user-select:none;-webkit-user-select:none;touch-action:pan-y}
.wl table{table-layout:fixed}.wl th,.wl td{height:50px;padding:0 14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;vertical-align:middle;border-bottom:1px solid var(--line)}
.wl tr:hover td{background:transparent}.wl tr{cursor:pointer}.wl tr.sec td{color:var(--mut);font-weight:600;cursor:default}
.wl.bq{background:var(--panel)}.wl.bq td{color:var(--mut)}.wl.bq td:nth-child(-n+4){color:var(--ink)}
.wl.qt{position:absolute;inset:0;background:var(--qbg);clip-path:inset(0 0 0 var(--p))}
.wl.qt td.eq{color:var(--ink)}.wl.qt td.df{color:var(--ink);font-weight:600;background:var(--badbg);box-shadow:inset 0 0 0 1px var(--dim)}.wl.qt td.df::before{content:"≠";margin-right:8px;opacity:.7}
.wl.qt td.pc{color:var(--ink);background:repeating-linear-gradient(90deg,var(--mut) 0 4px,transparent 4px 8px) right 14px bottom 12px/78px 1px no-repeat}
.wl tr.sel td{box-shadow:inset 0 1px 0 var(--acc),inset 0 -1px 0 var(--acc)}.wl.qt tr.sel td.df{box-shadow:inset 0 0 0 1px var(--acc)}
.slot{display:inline-block;width:70px;height:12px;border-radius:6px;border:1px dashed var(--dim)}
.nq{display:block;padding:6px 12px;border-radius:8px;color:var(--mut);background:repeating-linear-gradient(115deg,var(--soft) 0 6px,transparent 6px 12px);border:1px dashed var(--dim)}
.wh{position:absolute;top:0;bottom:0;left:var(--p);width:2px;margin-left:-1px;background:var(--acc);pointer-events:none;box-shadow:0 0 14px var(--acc)}
.wh i{position:sticky;top:45vh;display:block;width:44px;margin-left:-21px;margin-top:40vh;padding:7px 0;border-radius:99px;background:var(--acc);color:#06150a;font:700 12px var(--body);font-style:normal;text-align:center;box-shadow:0 6px 18px rgba(0,0,0,.4)}
.wcap{color:var(--mut);font-size:13px;margin:12px 4px 0}.lg{display:inline-flex;align-items:center;gap:6px;margin-left:14px;white-space:nowrap}.lg i{width:12px;height:12px;border-radius:4px;display:inline-block}.lg i{font-style:normal;font-size:11px;text-align:center;line-height:16px;width:22px;height:16px;color:var(--ink)}.l2{background:var(--badbg);box-shadow:inset 0 0 0 1px var(--mut);font-weight:700}.l3{background:repeating-linear-gradient(115deg,var(--mut) 0 2px,transparent 2px 5px)}.l4{border-bottom:1px dashed var(--mut)}
.actbar{position:sticky;bottom:14px;margin-top:18px;display:flex;gap:16px;justify-content:space-between;align-items:center;flex-wrap:wrap;padding:14px 18px;border-radius:22px;background:var(--glass);border:1px solid var(--glassline);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);box-shadow:0 18px 50px rgba(0,0,0,.35)}
.ai{min-width:0;flex:1 1 320px}.ai b{display:block;font:500 16px var(--disp)}.ai small{display:block}
/* light theme: same layout, same green, paper instead of black */
body.light{color-scheme:light;--bg:#f2f4ef;--panel:#ffffff;--panel2:#eef1eb;--line:#dde3da;--ink:#0f1a12;--mut:#647067;--dim:#c4ccc4;--acc:#14a84b;--acc2:#0c7a34;--accbg:rgba(20,168,75,.12);--ok:#0c8a3a;--okbg:rgba(20,168,75,.12);--warn:#0f1a12;--warnbg:rgba(15,26,18,.08);--info:#465149;--infobg:rgba(15,26,18,.05);--bad:#0f1a12;--badbg:rgba(15,26,18,.1);--glass:rgba(255,255,255,.78);--glassline:rgba(15,26,18,.12);--k1:rgba(15,26,18,.15);--k2:rgba(15,26,18,.04);--kb:rgba(15,26,18,.2);--ks:rgba(255,255,255,.75);--kl:rgba(15,26,18,.3);--kp1:rgba(255,255,255,.8);--kp2:rgba(15,26,18,.1);--kpk:rgba(15,26,18,.14);--kt:#0f1a12;--lnA:rgba(15,26,18,.4);--lnB:rgba(12,138,58,.9);--qbg:linear-gradient(180deg,#e6f6ea,#dcf1e2);--soft:rgba(15,26,18,.05);--mapbg:#f7f9f5;--dot:rgba(15,26,18,.1)}
body.light button{background:rgba(15,26,18,.05);border-color:rgba(15,26,18,.06);box-shadow:none}body.light button:hover{border-color:rgba(15,26,18,.25)}
body.light button.primary,body.light .pill.on{background:var(--acc);color:#fff}body.light button.link{background:none}
body.light .pill{color:var(--ink)}body.light .top{background:rgba(242,244,239,.86)}body.light .top nav button{background:none}body.light .top nav button.on{background:#fff}
body.light select,body.light input[type=text],body.light input[type=number],body.light input[type=search],body.light textarea{background:#fff}
body.light .search{background:#fff;border-color:var(--line)}body.light .search input{background:none}
body.light .tag{color:#3d4840}body.light .tag.ok{color:var(--ok)}body.light .tag.warn{color:var(--ink);background:var(--warnbg);font-weight:600}
body.light .note,body.light .note.info,body.light .note.ok,body.light .note.bad{color:var(--ink)}body.light .note b{color:var(--ink)}
body.light table tr:hover td{background:rgba(15,26,18,.025)}body.light .wl tr:hover td{background:transparent}
body.light dialog{background:#fff}body.light .src{background:#f6f8f4}body.light .scan{background:repeating-linear-gradient(0deg,#fff,#fff 16px,#e3e8e1 17px)}body.light .scan span{background:#fff}
body.light .pop{background:rgba(255,255,255,.8);border-color:rgba(15,26,18,.12);color:var(--ink);box-shadow:0 16px 40px rgba(15,26,18,.14)}body.light .pop small{color:var(--mut)}
body.light .ticks button{background:rgba(15,26,18,.25)}body.light .ticks button.on{background:var(--acc)}
body.light .plist{background:#fff}body.light .plist th{background:#fff}
body.light .pg{background:rgba(15,26,18,.08)}body.light .pg i{box-shadow:none;background:linear-gradient(90deg,#0c7a34,#22b85a 60%,#7fe3a0)}body.light .pg em,body.light .bar .sr{background:repeating-linear-gradient(115deg,rgba(15,26,18,.55) 0 2px,transparent 2px 5px)}
body.light .map{background:radial-gradient(var(--dot) 1px,transparent 1.5px) 0 0/22px 22px,radial-gradient(90% 80% at 8% 100%,rgba(20,168,75,.28),transparent 60%),var(--mapbg)}
body.light .art{filter:drop-shadow(0 8px 14px rgba(15,26,18,.2))}body.light .nd:hover .art,body.light .nd:focus-visible .art,body.light .nd:hover .chip{filter:drop-shadow(0 8px 16px rgba(20,168,75,.45))}
body.light .bd{stroke:var(--mapbg)}body.light .bd.note,body.light .bd.warn{fill:#0f1a12}body.light .bt.note,body.light .bt.warn{fill:#fff}body.light .ah{fill:var(--acc)}body.light .lg2{opacity:.14}
body.light .chip{fill:#fff;stroke:rgba(15,26,18,.22)}body.light .ct{fill:var(--ink)}body.light .nb{stroke:#fff}
body.light .tc{fill:#fff;stroke:rgba(15,26,18,.12)}body.light .tg path{stroke:var(--ink)}
body.light .ask{background:rgba(255,255,255,.8);border-color:rgba(15,26,18,.14)}body.light .ask:focus-within{border-color:var(--acc)}body.light .send{background:var(--ink);color:#fff}
body.light .think{background:rgba(15,26,18,.05)}body.light .thh{color:var(--ink)}body.light .think li.now{background-image:linear-gradient(90deg,#8b958d 0 35%,#0f1a12 50%,#8b958d 65% 100%)}body.light .caret::after{background:var(--ink)}
body.light .supc{background:#fff;color:var(--mut)}body.light .supc.best{background:linear-gradient(170deg,#1f8f47,#0f4a26 70%);color:#e9fbee}body.light .supc.best .sn,body.light .supc.best .bigp{color:#fff}body.light .tip{background:#fff}
body.light .crit .n i{color:var(--ink);border-color:rgba(15,26,18,.5)}body.light .supc.best .crit .n i{color:#fff;border-color:rgba(255,255,255,.7)}body.light .crit li{border-top-color:rgba(15,26,18,.1)}body.light .supc.best .crit li{border-top-color:rgba(255,255,255,.15)}
body.light .wh i{color:#fff}body.light .actbar{box-shadow:0 18px 40px rgba(15,26,18,.14)}body.light #toast{color:#fff}
body.light .brand i{color:#fff}body.light .av{background:var(--accbg)}
body.light .proto button{background:#fff;color:#16202e}body.light .ttabs button,body.light .ptabs button{background:none}body.light .ttabs>button:last-child{background:rgba(15,26,18,.05)}
.brand img{height:30px;width:auto;display:block}
h1+p.mut{display:none}
.umenu{position:relative}.umenu summary{list-style:none;cursor:pointer;padding:4px 8px;border-radius:14px}.umenu summary::-webkit-details-marker{display:none}.umenu summary:hover{background:var(--soft)}
.um{position:absolute;right:0;top:calc(100% + 8px);z-index:60;display:grid;gap:4px;padding:12px;min-width:210px;border-radius:16px;background:var(--panel)}.um small{padding:4px 6px 0}.um button{justify-content:flex-start;border-radius:10px;background:none;border-color:transparent;box-shadow:none}.um button.on{background:var(--accbg);color:var(--acc)}
.psel{padding:0 16px 0 18px;cursor:pointer}.psel select{border:0;background:none;padding:11px 0;width:auto;font-size:15px;color:inherit;cursor:pointer}.psel select:focus-visible{outline:0}.psel:focus-within{border-color:var(--acc)}
body.light .psel select{background:none}body.light .um button{background:none}body.light .um button.on{background:var(--accbg)}
.wcap b{color:var(--ink);font-weight:500;margin-right:10px}
.psel{display:inline-flex;align-items:center;gap:10px;border-radius:999px;border:1px solid rgba(255,255,255,.05);background:rgba(255,255,255,.065)}body.light .psel{background:rgba(15,26,18,.05);border-color:rgba(15,26,18,.06)}
.mapscroll>svg{max-width:1000px;margin:0 auto}.ov{padding-top:10px}.map{padding:14px 22px 20px}.nt{font-size:15px}.ns{font-size:12.5px}.lg2{display:none}.ln{stroke-width:1}
.nt{font-size:17px}.ns{font-size:14px}.ct{font-size:13.5px}
/* project map: clickable nodes respond to the pointer */
.nd .art{transform-box:fill-box;transform-origin:50% 60%;transition:transform .28s cubic-bezier(.2,.8,.2,1),filter .2s}
.nd:hover .art,.nd:focus-visible .art{transform:translateY(-6px) scale(1.08)}
.nd:active .art{transform:translateY(-1px) scale(.97);transition-duration:.08s}
.nd .nt,.nd .ns,.nd .ct{transition:fill .2s}.nd:hover .nt,.nd:focus-visible .nt{fill:var(--acc)}
.tr{transition:stroke-width .25s}.tc{transition:fill .25s,stroke .25s}.nd:hover .tr,.nd:focus-visible .tr{stroke-width:5}.nd:hover .tc,.nd:focus-visible .tc{fill:var(--accbg);stroke:var(--acc2)}
.tg{transition:opacity .2s}
.chip{transition:fill .2s,stroke .2s,transform .25s cubic-bezier(.2,.8,.2,1);transform-box:fill-box;transform-origin:center}
.nd:hover .chip,.nd:focus-visible .chip{fill:var(--acc);stroke:var(--acc);transform:scale(1.08);filter:none}.nd:hover .ct,.nd:focus-visible .ct{fill:#06150a}
.nd:active .chip{transform:scale(.96)}
body.light .nd:hover .chip,body.light .nd:focus-visible .chip{fill:var(--acc);stroke:var(--acc);filter:none}body.light .nd:hover .ct,body.light .nd:focus-visible .ct{fill:#fff}