/* omniSKU app. Same brand as the homepage (cobalt, Plus Jakarta Sans, pill buttons), but quieter:
   white canvas, hairline borders, one primary action per screen. */
:root{
  --bg:#fff;--soft:#f6f7fb;--tx:#0a0f1e;--mute:#566074;--faint:#636d80;
  --line:rgba(10,15,30,.09);--line2:rgba(10,15,30,.16);
  --cobalt:#2a3feb;--cobalt-d:#1e31c2;--cobalt-t:rgba(42,63,235,.08);
  --ok:#0b8a5c;--ok-t:rgba(11,138,92,.1);--bad:#d0393b;--bad-t:rgba(208,57,59,.09);--warn:#a86400;--warn-t:rgba(214,138,0,.13);
  --sans:"Plus Jakarta Sans",system-ui,sans-serif;--mono:"Geist Mono",ui-monospace,monospace;
  --r:14px;--ease:cubic-bezier(.22,.8,.24,1)}
*{box-sizing:border-box;margin:0}
html{background:var(--bg);color-scheme:light}
body{font:15px/1.55 var(--sans);color:var(--tx);background:var(--bg);-webkit-font-smoothing:antialiased;min-height:100vh}
ul,ol{padding:0;list-style:none}
a{color:inherit;text-decoration:none} button{font:inherit;color:inherit;cursor:pointer;border:0;background:none}
h1,h2,h3{font-weight:800;letter-spacing:-.04em;line-height:1.15;color:var(--tx)}
::selection{background:rgba(42,63,235,.2)}
:focus-visible{outline:2px solid var(--cobalt);outline-offset:2px}
.mono{font-family:var(--mono)} .muted{color:var(--mute)} .faint{color:var(--faint)}
.ic{flex:none;display:block}
.logo{display:flex;align-items:center;gap:9px;font-weight:800;font-size:17px;letter-spacing:-.03em}
.logo svg{width:28px;height:28px;flex:none}

/* ── shell: sidebar + content ── */
.app{display:grid;grid-template-columns:248px minmax(0,1fr);min-height:100vh}
.sb{position:sticky;top:0;height:100vh;overflow-y:auto;display:flex;flex-direction:column;gap:18px;padding:18px 14px 14px;background:#fff;box-shadow:1px 0 0 var(--line);z-index:50}
.sb .logo{padding:2px 8px}
.nl{font:500 11px var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--faint);padding:0 10px 6px}
.ni{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:10px;color:var(--mute);font-size:14px;font-weight:600;min-width:0}
.ni:hover{background:var(--soft);color:var(--tx)}
.ni.on{background:var(--cobalt-t);color:var(--cobalt)}
.ni .t{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sb nav{display:grid;gap:2px}
.sb-foot{margin-top:auto;display:grid;gap:2px;padding-top:12px;border-top:1px solid var(--line)}
.sb-foot form{display:contents}
.sb-foot button.ni{width:100%;text-align:left}
.sb-foot .who{padding:8px 10px;display:flex;align-items:center;gap:10px;min-width:0;font-size:12.5px;color:var(--faint)}
.sb-foot .who span:last-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.credits{display:flex;justify-content:space-between;font-variant-numeric:tabular-nums}
.credits.low b{color:var(--warn)}
.credits b{font-weight:700;color:var(--tx)}
.avatar{width:28px;height:28px;border-radius:50%;background:var(--cobalt);color:#fff;font-weight:700;font-size:12px;display:grid;place-items:center;text-transform:uppercase;flex:none}
.top{display:none}
.scrim{display:none}
.main{min-width:0}
details.menu{position:relative}
details.menu>summary{list-style:none;cursor:pointer;display:block;border-radius:50%} details.menu>summary::-webkit-details-marker{display:none}
.menu .pop{position:absolute;right:0;top:calc(100% + 8px);z-index:50;min-width:220px;padding:6px;border-radius:14px;background:#fff;box-shadow:0 0 0 1px var(--line2),0 20px 40px -16px rgba(10,15,30,.25);display:grid;gap:2px}
.menu .pop a,.menu .pop button{display:flex;align-items:center;gap:10px;width:100%;padding:9px 12px;border-radius:9px;font-size:14px;font-weight:500;color:var(--tx);text-align:left}
.menu .pop a:hover,.menu .pop button:hover{background:var(--soft)}
.menu .pop .bad{color:var(--bad)} .menu .pop form{display:contents} .menu .pop hr{border:0;height:1px;background:var(--line);margin:4px 6px}
.menu-btn{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;color:var(--mute);box-shadow:inset 0 0 0 1px var(--line2)}
.menu-btn:hover,details.menu[open] .menu-btn{background:var(--soft);color:var(--tx)}
.icon-btn{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;color:var(--mute)} .icon-btn:hover{background:var(--soft);color:var(--tx)}

/* ── page ── */
.page{max-width:880px;margin:0;padding:40px clamp(24px,3.5vw,48px) 120px}
.page.narrow{max-width:640px}
.back-link{display:inline-flex;align-items:center;gap:6px;font-size:13.5px;font-weight:500;color:var(--mute);margin-bottom:20px} .back-link:hover{color:var(--tx)}
.kicker{font:500 11.5px var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--faint);margin-bottom:10px}
.ph{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;flex-wrap:wrap;margin-bottom:28px}
.ph h1{font-size:28px;text-wrap:balance;overflow-wrap:anywhere}
.ph .lead{color:var(--mute);font-size:15.5px;margin-top:8px;max-width:560px}
.ph .meta{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:10px;color:var(--mute);font-size:13.5px}
.acts{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.sect{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin:36px 0 12px}
.sect h2{font-size:15px;letter-spacing:-.02em}
.sect .hint{color:var(--faint);font-size:13px}
.fine{font-size:13px;color:var(--faint);margin-top:12px}
.fine code{font-size:12px;background:var(--soft);padding:1px 6px;border-radius:5px}

/* ── buttons & links ── */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:13px 24px;border-radius:999px;font-weight:700;font-size:15px;line-height:1.2;white-space:nowrap;color:#fff;background:var(--cobalt);transition:background .2s}
.btn:hover{background:var(--cobalt-d)}
.btn.ghost{color:var(--cobalt);background:#fff;box-shadow:inset 0 0 0 1.5px var(--cobalt)} .btn.ghost:hover{background:var(--cobalt-t)}
.btn.danger{color:var(--bad);background:#fff;box-shadow:inset 0 0 0 1.5px rgba(208,57,59,.35)} .btn.danger:hover{background:var(--bad-t)}
.btn.sm{padding:9px 18px;font-size:13.5px}
.btn.lg{padding:15px 28px;font-size:16px}
.btn.block{width:100%}
.btn:disabled,.btn[disabled]{opacity:.4;pointer-events:none}
.btn .ar{transition:transform .25s var(--ease)} .btn:hover .ar{transform:translateX(3px)}
form.button_to{display:inline-flex}
form.button_to:has(.block){display:block}
.link{color:var(--cobalt);font-weight:600} .link:hover{text-decoration:underline}
.link.plain{color:var(--mute);font-weight:500}

/* ── surfaces ── */
.card{border-radius:var(--r);padding:22px;background:#fff;box-shadow:0 0 0 1px var(--line)}
.card.flush{padding:0;overflow:hidden}
.card h3{font-size:16px;margin-bottom:14px}
.list{border-radius:var(--r);box-shadow:0 0 0 1px var(--line);background:#fff;overflow:hidden}
.list>*+*{border-top:1px solid var(--line)}
.row{display:flex;align-items:center;gap:16px;padding:16px 20px;transition:background .15s}
a.row:hover{background:var(--soft)}
.row .tx{flex:1;min-width:0}
.row .nm{display:block;font-weight:700;letter-spacing:-.02em;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.row .st{display:flex;align-items:center;gap:8px;margin-top:2px;font-size:13.5px;color:var(--mute)}
.row .st.risk{color:var(--bad)} .row .st.ready{color:var(--ok)}
.row .dotc{width:9px;height:9px;border-radius:50%;background:var(--c);flex:none}
.row .acts{gap:6px}
.row .s{font-size:13px;color:var(--mute);display:block}
.row b{font-weight:700;letter-spacing:-.01em;display:block}
.note{display:flex;gap:10px;align-items:flex-start;padding:12px 16px;border-radius:12px;font-size:14px;color:var(--mute);background:var(--soft);margin-bottom:20px}
.note .ic{margin-top:2px;color:var(--cobalt)}
.empty-state{text-align:center;padding:72px 20px 0}
.empty-state h1{font-size:clamp(28px,4vw,38px);max-width:14em;margin:0 auto 12px;text-wrap:balance}
.empty-state p{color:var(--mute);font-size:16px;max-width:460px;margin:0 auto 26px}
.allgood{display:grid;place-items:center;text-align:center;gap:4px;padding:56px 24px;border-radius:var(--r);background:var(--soft)}
.allgood .ico{width:48px;height:48px;border-radius:50%;display:grid;place-items:center;background:var(--ok-t);color:var(--ok);margin-bottom:8px}
.allgood h2{font-size:20px} .allgood p{color:var(--mute)}
.clean{display:flex;align-items:center;gap:10px;padding:12px 16px;border-radius:12px;background:var(--ok-t);color:var(--ok);font-size:14px;font-weight:500;margin-bottom:20px}

/* ── pills, dots, meter ── */
.pill{display:inline-flex;align-items:center;gap:6px;font:500 11.5px var(--mono);padding:3px 10px;border-radius:999px;white-space:nowrap;background:var(--soft);color:var(--mute)}
.pill.ready{background:var(--ok-t);color:var(--ok)} .pill.risk{background:var(--bad-t);color:var(--bad)} .pill.warn{background:var(--warn-t);color:var(--warn)} .pill.ai{background:var(--cobalt-t);color:var(--cobalt)}
.dot{width:7px;height:7px;border-radius:50%;background:var(--faint);flex:none;display:inline-block}
.dot.ready{background:var(--ok)} .dot.risk{background:var(--bad)} .dot.warn{background:var(--warn)} .dot.busy{background:var(--cobalt);animation:pulse 1.2s ease-in-out infinite}
@keyframes pulse{50%{opacity:.35;transform:scale(.8)}}
.pbar{height:6px;border-radius:6px;background:var(--soft);overflow:hidden;box-shadow:inset 0 0 0 1px var(--line)}
.pbar i{display:block;height:100%;border-radius:6px;background:var(--cobalt);transition:width .9s var(--ease)}
.pbar.warn i{background:var(--warn)} .pbar.ready i{background:var(--ok)}

/* ── forms ── */
.input{display:block;width:100%;padding:10px 13px;border-radius:10px;border:0;background:#fff;box-shadow:inset 0 0 0 1px var(--line2);color:var(--tx);font:inherit;font-size:14.5px;outline:none;transition:box-shadow .15s}
.input::placeholder{color:var(--faint)}
.input:focus{box-shadow:inset 0 0 0 1.5px var(--cobalt),0 0 0 4px rgba(42,63,235,.12)}
select.input{appearance:none;padding-right:34px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23566074' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center}
textarea.input{resize:vertical;line-height:1.5}
.input.err{box-shadow:inset 0 0 0 1.5px rgba(208,57,59,.6)}
.input.wrn{box-shadow:inset 0 0 0 1.5px rgba(168,100,0,.45)}
.lb{display:block;font-size:13px;font-weight:600;color:var(--mute);margin-bottom:6px}
.fld{margin-bottom:16px}
.problem{margin-top:7px;font-size:13px;display:flex;gap:7px;align-items:flex-start}
.problem.risk{color:var(--bad)} .problem.warn{color:var(--warn)} .problem .ic{margin-top:2px}
.problem small{color:var(--faint)}
.search{position:relative;flex:1;max-width:360px}
.search .ic{position:absolute;left:13px;top:50%;transform:translateY(-50%);color:var(--faint);pointer-events:none}
.search .input{padding-left:38px;border-radius:999px}
.toolbar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:16px}
.fchip{display:inline-flex;align-items:center;gap:8px;padding:5px 8px 5px 12px;border-radius:999px;background:var(--cobalt-t);color:var(--cobalt);font-size:13px;font-weight:600}
.fchip a{display:grid;place-items:center;width:18px;height:18px;border-radius:50%} .fchip a:hover{background:rgba(42,63,235,.15)}
.errs{margin:0 0 16px;padding:12px 14px 12px 30px;border-radius:12px;background:var(--bad-t);color:var(--bad);font-size:13.5px;list-style:disc}

/* ── flashes ── */
.flashes{position:fixed;top:72px;left:50%;transform:translateX(-50%);z-index:90;display:grid;gap:8px;width:min(440px,calc(100% - 32px))}
.flash{display:flex;align-items:center;gap:10px;padding:12px 14px;border-radius:12px;font-size:14px;background:#fff;box-shadow:0 0 0 1px var(--line2),0 16px 32px -14px rgba(10,15,30,.3);transition:opacity .4s,transform .4s}
.flash.out{opacity:0;transform:translateY(-8px)}
.flash.notice .ic{color:var(--ok)} .flash.alert .ic{color:var(--bad)}
.flash button{margin-left:auto;color:var(--faint);padding:2px} .flash button:hover{color:var(--tx)}

/* ── tables ── */
.tbl{width:100%;border-collapse:collapse}
.tbl td{padding:14px 20px;border-top:1px solid var(--line);vertical-align:middle}
.tbl tr:first-child td{border-top:0}
.tbl tbody tr:hover{background:var(--soft)}
.tbl .r{text-align:right}
.tbl .ttl{font-weight:600;max-width:460px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:block} .tbl a.ttl:hover{color:var(--cobalt)}
.tbl .sub{color:var(--faint);font:400 12px var(--mono);margin-top:2px}
.rowlink{display:inline-flex;color:var(--faint)} tr:hover .rowlink{color:var(--tx)}
.pager{display:flex;align-items:center;justify-content:space-between;margin-top:18px;font-size:13px;color:var(--faint)}

/* ── upload ── */
.dz{position:relative;display:grid;place-items:center;text-align:center;gap:4px;padding:72px 24px;border-radius:var(--r);border:1.5px dashed var(--line2);background:var(--soft);cursor:pointer;transition:border-color .2s,background .2s}
.dz:hover,.dz.over{border-color:var(--cobalt);background:var(--cobalt-t)}
.dz .ico{width:48px;height:48px;border-radius:14px;display:grid;place-items:center;background:#fff;box-shadow:0 0 0 1px var(--line);color:var(--cobalt);margin:0 auto 10px}
.dz b{font-size:17px;font-weight:700;letter-spacing:-.02em}
.dz p{color:var(--mute);font-size:14px}
.dz input{position:absolute;inset:0;opacity:0;cursor:pointer;width:100%;height:100%}
.dz .picked{display:none} .dz.has .empty{display:none} .dz.has .picked{display:block}
.dz.has{border-style:solid;border-color:var(--cobalt);pointer-events:none}
.dz .fn{font-weight:700;word-break:break-all} .dz .fm{font:400 12.5px var(--mono);color:var(--mute);margin-top:4px}

/* ── channel picker & mapping ── */
.chpick{display:grid;gap:8px}
.chopt{position:relative;display:flex;align-items:center;gap:14px;padding:14px 16px;border-radius:12px;cursor:pointer;background:#fff;box-shadow:0 0 0 1px var(--line);transition:box-shadow .15s,background .15s}
.chopt:hover{background:var(--soft)}
.chopt:has(input:checked){background:var(--cobalt-t);box-shadow:0 0 0 1.5px var(--cobalt)}
.chopt input{position:absolute;opacity:0}
.chopt .bx{width:20px;height:20px;border-radius:6px;box-shadow:inset 0 0 0 1.5px var(--line2);display:grid;place-items:center;color:transparent;flex:none;transition:all .15s}
.chopt:has(input:checked) .bx{background:var(--cobalt);color:#fff;box-shadow:none}
.chopt:has(input:focus-visible){outline:2px solid var(--cobalt);outline-offset:2px}
.chopt .tx{min-width:0} .chopt .tx b{display:flex;align-items:center;gap:8px;font-weight:700} .chopt .tx b i{width:8px;height:8px;border-radius:50%;background:var(--c)}
.chopt .tx span{display:block;font-size:13px;color:var(--mute);margin-top:1px}
.matchnote{margin-top:24px;font-size:14px;color:var(--mute)}
.matchnote>summary{cursor:pointer;list-style:none;display:flex;align-items:center;gap:12px;padding:2px 0} .matchnote>summary::-webkit-details-marker{display:none}
.matchnote.warn>summary{color:var(--warn)}
.mrow{display:grid;grid-template-columns:minmax(0,1fr) 20px minmax(170px,.8fr);gap:14px;align-items:center;padding:12px 20px;border-top:1px solid var(--line)}
.mrow.head{border-top:0;font:500 11px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--faint);background:var(--soft)}
.mrow .col{min-width:0} .mrow .col b{display:block;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mrow .smp{font:400 12px var(--mono);color:var(--faint);margin-top:2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mrow .ar{color:var(--faint)} .mrow.mapped .ar{color:var(--ok)} .mrow.ignored .col{opacity:.55}

/* ── processing ── */
.proc{text-align:center;padding:64px 24px;border-radius:var(--r);background:var(--soft)}
.proc .spin{width:28px;height:28px;margin:0 auto 20px;border-radius:50%;border:3px solid var(--line2);border-top-color:var(--cobalt);animation:spin .8s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.proc h2{font-size:20px} .proc p{color:var(--mute);max-width:440px;margin:8px auto 0}

/* ── catalogue overview ── */
.result .big{font-size:clamp(40px,7vw,56px);font-weight:800;letter-spacing:-.055em;line-height:1;font-variant-numeric:tabular-nums}
.result .big small{font-size:16px;letter-spacing:-.01em;font-weight:500;color:var(--mute);margin-left:10px}
.result .pbar{max-width:420px;margin:18px 0 14px}
.result p{color:var(--mute);max-width:520px}
.result .acts{margin-top:20px}

/* ── issues ── */
.disc{margin-top:24px}
.disc>summary{cursor:pointer;list-style:none;display:inline-flex;align-items:center;gap:8px;font-size:14px;font-weight:600;color:var(--mute)} .disc>summary::-webkit-details-marker{display:none}
.disc>summary:hover{color:var(--tx)}
.disc>summary:after{content:"";width:7px;height:7px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg) translateY(-2px);transition:transform .25s var(--ease)}
.disc[open]>summary:after{transform:rotate(225deg)}
.disc>.in{margin-top:14px}

/* ── product detail ── */
.fgrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:16px}
.fgrid .full{grid-column:1/-1}
.savebar{position:sticky;bottom:16px;display:flex;align-items:center;justify-content:space-between;gap:14px;margin-top:24px;padding:10px 10px 10px 20px;border-radius:999px;background:#fff;box-shadow:0 0 0 1px var(--line2),0 16px 32px -14px rgba(10,15,30,.3);font-size:13.5px;color:var(--mute)}
.diff{display:grid;gap:3px;margin-top:6px;font-size:13px}
.diff .o{padding:6px 10px;border-radius:8px;background:var(--bad-t);color:var(--bad);text-decoration:line-through;word-break:break-word}
.diff .n{padding:6px 10px;border-radius:8px;background:var(--ok-t);color:var(--ok);word-break:break-word}
.log{display:grid;gap:14px} .log .who{font:500 11px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--faint)}

/* ── billing ── */
.packs{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:12px}
.pack{display:flex;flex-direction:column;padding:20px;border-radius:var(--r);background:#fff;box-shadow:0 0 0 1px var(--line)}
.pack.on{box-shadow:0 0 0 2px var(--cobalt)}
.pack .n{font-weight:700;display:flex;justify-content:space-between;align-items:center}
.pack .big{font-size:32px;font-weight:800;letter-spacing:-.05em;margin-top:10px;font-variant-numeric:tabular-nums}
.pack .big small{font-size:13px;font-weight:500;color:var(--mute);letter-spacing:0;margin-left:4px}
.pack .sub{font-size:13px;color:var(--mute);margin:2px 0 16px}
.pack form{margin-top:auto} .pack .btn{width:100%}
.kv{display:flex;justify-content:space-between;gap:16px;padding:10px 0;font-size:14px;border-top:1px solid var(--line)} .kv:first-child{border-top:0}
.kv dt{color:var(--mute)} .kv dd{font-weight:600}
.pos{color:var(--ok)}

/* ── public pages (login, signup): the homepage nav and look ── */
.nav{white-space:nowrap;position:fixed;top:0;left:0;right:0;z-index:50;display:flex;align-items:center;justify-content:space-between;gap:24px;height:68px;padding:0 clamp(18px,3vw,40px);background:#fff;box-shadow:0 1px 0 var(--line)}
.nav .links{position:absolute;left:50%;transform:translateX(-50%);display:flex;gap:28px;font-size:14px;font-weight:500;color:var(--mute)}
.nav .links a:hover{color:var(--tx)}
.nav .rt{display:flex;align-items:center;gap:22px}
.nav .login{font-size:14px;font-weight:500;color:var(--mute)} .nav .login:hover{color:var(--tx)}
.authwrap{min-height:100vh;display:grid;place-items:center;padding:96px 20px 48px;background:radial-gradient(70% 60% at 50% 30%,#f7f8fd 0%,#f1f3fa 60%,#ecf0f8 100%)}
.authbox{width:min(420px,100%)}
.authcard{border-radius:26px;padding:34px 30px;background:#fff;box-shadow:inset 0 0 0 1px var(--line),0 1px 2px rgba(10,15,30,.05),0 18px 40px -18px rgba(10,15,30,.22)}
.authcard h1{font-size:26px}
.authcard .lead{color:var(--mute);margin-top:6px}
.authcard form{margin-top:24px}
.authcard .alt{display:flex;justify-content:space-between;gap:12px;margin-top:20px;font-size:13.5px;color:var(--mute)}
.back{display:block;text-align:center;margin-top:22px;font-size:13px;color:var(--faint)} .back:hover{color:var(--tx)}
@media(max-width:1000px){.nav .links{display:none}}
@media(max-width:560px){.nav .login{display:none}}

@media(max-width:900px){
  .app{grid-template-columns:1fr}
  .sb{position:fixed;inset:0 auto 0 0;width:min(280px,86vw);transform:translateX(-102%);transition:transform .3s var(--ease);box-shadow:30px 0 80px -30px rgba(10,15,30,.3)}
  .nav-open .sb{transform:none}
  .nav-open .scrim{display:block;position:fixed;inset:0;background:rgba(10,15,30,.35);z-index:40}
  .top{display:flex;position:sticky;top:0;z-index:30;align-items:center;justify-content:space-between;height:56px;padding:0 14px 0 18px;background:rgba(255,255,255,.94);backdrop-filter:blur(12px);box-shadow:0 1px 0 var(--line)}
}
@media(max-width:720px){
  .page{padding:28px 16px 100px}
  .ph h1{font-size:24px}
  .fgrid{grid-template-columns:1fr}
  .row{flex-wrap:wrap}.row .acts{width:100%}
  .mrow{grid-template-columns:minmax(0,1fr);gap:8px}.mrow .ar,.mrow.head{display:none}
  .tbl td:nth-child(n+2):not(:last-child){display:none}
}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}

.ph>div:first-child{flex:1 1 320px;min-width:0}

/* ── multi-column workspace (max 3 columns, cascades down as space runs out) ── */
.page.wide{max-width:1440px}
.cols{display:grid;gap:clamp(20px,2.4vw,36px);align-items:start}
.cols.c3{grid-template-columns:minmax(0,.9fr) minmax(0,1fr) minmax(0,1.1fr)}
.cols.c2u{grid-template-columns:minmax(0,1.5fr) minmax(0,1fr)}
.pane{min-width:0}
.ch{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin-bottom:12px}
.ch h2{font-size:15px;letter-spacing:-.02em}
.ch .hint{color:var(--faint);font-size:13px}
.ch .hint b{color:var(--tx)}
.narrow-block{max-width:560px}
.row{position:relative}
.row.sel{background:var(--cobalt-t);box-shadow:inset 3px 0 0 var(--cobalt)}
.row .go::after{content:"";position:absolute;inset:0}
.row .z{position:relative;z-index:1}
.row .chev{color:var(--faint)} .row:hover .chev,.row.sel .chev{color:var(--cobalt)}
.row.hov:hover{background:var(--soft)} .row.sel:hover{background:var(--cobalt-t)}
.steps{display:grid;gap:22px;align-content:start;padding-top:6px}
.steps li{display:flex;gap:14px}
.steps .n{width:28px;height:28px;border-radius:50%;background:var(--cobalt-t);color:var(--cobalt);font:700 13px var(--sans);display:grid;place-items:center;flex:none}
.steps b{display:block;font-weight:700;letter-spacing:-.01em} .steps p{color:var(--mute);font-size:14px;margin-top:2px}
.cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.card.cat{display:flex;flex-direction:column;justify-content:space-between;gap:20px;min-height:140px}
.card.cat .nm{font-weight:800;font-size:17px;letter-spacing:-.03em;display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.card.cat .nm:hover{color:var(--cobalt)}
.card.cat .btn{align-self:flex-start}
.pane .result .big{font-size:clamp(36px,4vw,48px)}
@media(max-width:1280px){
  .cols.c3{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .cols.c3>.pane:nth-child(3){grid-column:1/-1}
  .cards{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:1000px){
  .cols.c3,.cols.c2u,.cards{grid-template-columns:minmax(0,1fr)}
  .cols.c3>.pane:nth-child(3){grid-column:auto}
}

/* ── guided set-up ── */
.wstep{max-width:980px} .wstep[hidden]{display:none}
.wstep h2{font-size:22px;margin-bottom:4px} .wstep>p{margin-bottom:20px}
.grid2{grid-template-columns:repeat(2,minmax(0,1fr))}
.mapgrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}
.mapgrid>.mrow:nth-child(odd){border-right:1px solid var(--line)}
.mapgrid>.mrow:nth-child(2){border-top:0}
.wnav{display:flex;align-items:center;gap:12px;margin-top:28px;flex-wrap:wrap}
.pv th{text-align:left;font:500 11px var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--faint);padding:11px 16px;background:var(--soft);white-space:nowrap}
.pv td{padding:11px 16px;font-size:13.5px;max-width:260px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
/* ── overview ── */
.kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.kpi{padding:20px;border-radius:var(--r);background:#fff;box-shadow:0 0 0 1px var(--line);display:flex;flex-direction:column;align-items:flex-start}
.kpi .l{font:500 11.5px var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--faint)}
.kpi .v{font-size:40px;font-weight:800;letter-spacing:-.055em;line-height:1.1;margin-top:8px;font-variant-numeric:tabular-nums}
.kpi .d{font-size:13.5px;color:var(--mute);margin-top:2px}
.kpi.ok .v{color:var(--ok)} .kpi.bad .v{color:var(--bad)} .kpi.cob .v{color:var(--cobalt)}
.kpi .btn{margin-top:14px}
.tabs{display:flex;gap:4px;border-bottom:1px solid var(--line);overflow-x:auto;overflow-y:hidden;scrollbar-width:none}
.tabs a{display:flex;align-items:center;gap:9px;padding:11px 16px;font-size:14px;font-weight:700;color:var(--mute);white-space:nowrap;border-bottom:2px solid transparent;margin-bottom:-1px}
.tabs a:hover{color:var(--tx)}
.tabs a.on{color:var(--tx);border-bottom-color:var(--cobalt)}
.tabs i{width:8px;height:8px;border-radius:50%}
.cnt{font:600 11.5px var(--mono);padding:2px 8px;border-radius:999px;display:inline-flex;align-items:center}
.cnt.bad{background:var(--bad-t);color:var(--bad)} .cnt.ok{background:var(--ok-t);color:var(--ok)}
.tabpanel{padding-top:22px}
.tp-h{display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap}
.tp-s{flex:1 1 320px;font-size:14.5px;color:var(--mute)} .tp-s b{color:var(--tx)}
.tp-s .pbar{margin-top:10px;max-width:420px}
.igrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.icard{display:flex;flex-direction:column;gap:10px;padding:18px;border-radius:var(--r);background:#fff;box-shadow:0 0 0 1px var(--line)}
.icard .ih{display:flex;align-items:center;gap:9px} .icard .ih b{flex:1;min-width:0;font-weight:700;letter-spacing:-.015em}
.icard .im{font-size:13.5px;color:var(--mute)}
.icard .ex{display:grid;gap:2px;padding:4px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.icard .ex li{display:flex;justify-content:space-between;gap:12px;padding:6px 0;font-size:13px}
.icard .ex .t{font-weight:600;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap} .icard .ex .t:hover{color:var(--cobalt)}
.icard .ex .v{font:400 12px var(--mono);color:var(--mute);max-width:45%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:none} .icard .ex .v.empty{color:var(--bad)}
.icard .acts{margin-top:auto}
@media(max-width:1280px){.igrid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:1000px){.kpis{grid-template-columns:repeat(2,minmax(0,1fr))}.mapgrid,.grid2{grid-template-columns:minmax(0,1fr)}.mapgrid>.mrow:nth-child(odd){border-right:0}}
@media(max-width:700px){.igrid{grid-template-columns:minmax(0,1fr)}.kpi .v{font-size:30px}}

/* sidebar uploads */
.ni .t b{display:block;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:inherit}
.ni .t small{display:block;font-size:12px;font-weight:500;color:var(--faint)}
.ni.on .t small{color:var(--cobalt);opacity:.75}
.ni .dot{margin-top:1px}
.plats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.plat{padding:18px 20px;border-radius:var(--r);background:#fff;box-shadow:0 0 0 1px var(--line)}
.plat .pn{display:flex;align-items:center;gap:9px;font-weight:700} .plat .pn i{width:8px;height:8px;border-radius:50%}
.plat .pv2{font-size:30px;font-weight:800;letter-spacing:-.05em;line-height:1.1;margin-top:10px;font-variant-numeric:tabular-nums}
.plat .pd{font-size:13px;color:var(--mute)} .plat .pd .bad{color:var(--bad);font-weight:600} .plat .pd .ok{color:var(--ok);font-weight:600}
@media(max-width:1280px){.plats{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:560px){.plats{grid-template-columns:minmax(0,1fr)}}

[hidden]{display:none!important}

/* compact kpis, issues table, nav extras */
.kpis{gap:12px}
.kpi{padding:14px 16px}
.kpi .v{font-size:38px;margin-top:4px}
.kpi .l{font-size:10.5px}
.kpi .d{font-size:12.5px}
.kpi .btn{margin-top:8px}
.tbl thead th{text-align:left;font:500 11px var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--faint);padding:11px 20px;background:var(--soft);white-space:nowrap}
.tbl thead th.r{text-align:right}
.tbl thead+tbody tr:first-child td{border-top:0}
.nw{white-space:nowrap}
.itbl td{vertical-align:top}
.itbl .iname{display:flex;gap:10px;align-items:flex-start;min-width:260px}
.itbl .iname .dot{margin-top:7px}
.itbl .iname b{font-weight:700;letter-spacing:-.01em}
.itbl .im{font-size:13px;color:var(--mute);margin-top:1px;max-width:380px}
.itbl .iex{font-size:13px;min-width:200px}
.itbl .iex .t{font-weight:600} .itbl .iex .t:hover{color:var(--cobalt)}
.itbl .iex .v{font:400 12px var(--mono);color:var(--mute);margin-left:6px} .itbl .iex .v.empty{color:var(--bad)}
.itbl form.button_to{display:inline-flex}
.chs{display:flex;flex-wrap:wrap;gap:6px}
.chp{display:inline-flex;align-items:center;gap:6px;padding:3px 10px 3px 8px;border-radius:999px;background:var(--soft);font-size:12px;font-weight:600;color:var(--mute);white-space:nowrap}
.chp i{width:6px;height:6px;border-radius:50%}
.ni .credit-n{margin-left:auto;font:600 12px var(--mono);color:var(--faint)} .ni .credit-n.low{color:var(--warn)}

/* kpis: one integrated card, stats divided by hairlines */
.kpis{gap:0;border-radius:var(--r);background:#fff;box-shadow:0 0 0 1px var(--line);overflow:hidden}
.kpi{border-radius:0;box-shadow:none;padding:18px 22px;background:transparent}
.kpi+.kpi{border-left:1px solid var(--line)}
@media(max-width:1000px){.kpi:nth-child(3){border-left:0}.kpi:nth-child(n+3){border-top:1px solid var(--line)}}

/* ── overview scorecard: cobalt block carrying the path to 100% ── */
.vc{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);border-radius:22px;overflow:hidden;background:var(--cobalt);color:#fff;box-shadow:0 18px 40px -26px rgba(42,63,235,.6)}
.vc .label{font:500 11px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:rgba(255,255,255,.7)}
.c-l{padding:22px 28px 24px;display:flex;flex-direction:column;gap:16px;position:relative}
.c-l:before{content:"";position:absolute;inset:0;background:radial-gradient(60% 90% at 100% 0,rgba(255,255,255,.18),transparent 70%);pointer-events:none}
.c-l>*{position:relative}
.c-stats{display:grid;grid-template-columns:auto auto auto;justify-content:start;align-items:end;gap:clamp(20px,3vw,44px)}
.c-stats b{display:block;font-weight:800;letter-spacing:-.06em;line-height:.95;font-variant-numeric:tabular-nums}
.c-stats span{display:block;font-size:13.5px;color:rgba(255,255,255,.8);margin-top:6px}
.c-main b{font-size:clamp(52px,5.6vw,72px)}
.c-sub b{font-size:clamp(30px,3vw,40px)}
.c-sub{padding-left:clamp(20px,3vw,44px);border-left:1px solid rgba(255,255,255,.22)}
.c-prog .bar{display:flex;height:12px;border-radius:12px;overflow:hidden;background:rgba(255,255,255,.18)}
.c-prog .bar i{display:block;height:100%}
.rd{background:#fff} .of{background:repeating-linear-gradient(135deg,rgba(255,255,255,.75) 0 5px,rgba(255,255,255,.4) 5px 10px)} .nu{background:#6fd3c8}
.c-prog .key{display:flex;gap:18px;flex-wrap:wrap;margin-top:10px;font-size:12.5px;color:rgba(255,255,255,.85)}
.c-prog .key span{display:inline-flex;align-items:center;gap:7px}
.c-prog .key i{width:11px;height:11px;border-radius:3px;display:inline-block}
.c-acts{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.btn.white{background:#fff;color:var(--cobalt)} .btn.white:hover{background:#f3f5ff}
.btn.ghostw{background:transparent;color:#fff;box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.55)} .btn.ghostw:hover{background:rgba(255,255,255,.12)}
.c-r{padding:14px 12px;display:grid;align-content:center;background:rgba(10,15,30,.2)}
.c-row{display:grid;grid-template-columns:1fr auto;align-items:center;gap:12px;padding:11px 16px;border-radius:10px}
.c-row:hover,.c-row.on{background:rgba(255,255,255,.12)}
.c-row .nm{display:flex;align-items:center;gap:9px;font-weight:700;font-size:14px}
.c-row .nm i{width:9px;height:9px;border-radius:50%;box-shadow:0 0 0 2px rgba(255,255,255,.4)}
.c-row .nm small{font-weight:500;opacity:.7;font-size:12.5px;margin-left:4px}
.c-row .pct{font-size:20px;font-weight:800;letter-spacing:-.04em;font-variant-numeric:tabular-nums}
.c-row .pct.low{color:#ffd0d1}
@media(max-width:1100px){.vc{grid-template-columns:minmax(0,1fr)}}

/* platform logos */
.chmark{display:inline-grid;place-items:center;width:calc(var(--s) + 10px);height:calc(var(--s) + 10px);border-radius:7px;background:#fff;box-shadow:0 0 0 1px var(--line2);flex:none}
.chmark svg{display:block}
.chp .chmark{width:auto;height:auto;background:none;box-shadow:none}
.chopt .tx b .chmark,.tabs .chmark{margin-right:0}

/* fixed-by-omniSKU table, undo */
.sect form.button_to{margin-left:auto}
.ba{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap;padding:1px 0}
.ba .v{font:400 12px var(--mono)} .ba .v.old{color:var(--bad);text-decoration:line-through;text-decoration-color:rgba(208,57,59,.4)} .ba .v.new{color:var(--ok)}
.ba .ar{color:var(--faint);font-size:12px}
.logrow{display:grid;gap:6px;justify-items:start}
section[id]{scroll-margin-top:20px}

/* issues | SKUs switch */
.vswitch{display:inline-flex;gap:2px;padding:3px;margin:18px 0 4px;border-radius:999px;background:var(--soft);box-shadow:inset 0 0 0 1px var(--line)}
.vswitch a{display:inline-flex;align-items:center;gap:8px;padding:6px 16px;border-radius:999px;font-size:13.5px;font-weight:700;color:var(--mute)}
.vswitch a span{font:600 11px var(--mono);color:var(--faint)}
.vswitch a.on{background:#fff;color:var(--tx);box-shadow:0 1px 2px rgba(10,15,30,.12)}
.vswitch a.on span{color:var(--cobalt)}
.ichip{display:inline-flex;padding:3px 10px;border-radius:999px;background:var(--bad-t);color:var(--bad);font-size:12px;font-weight:600;white-space:nowrap}
.ichip.more{background:var(--soft);color:var(--mute)}

/* catalogue report, design C: report rail on the left, the chosen reader's lens on the right */
.rl{display:grid;grid-template-columns:280px minmax(0,1fr);gap:0;margin-top:4px;align-items:start}
.rail{position:sticky;top:20px;padding:4px 28px 4px 0;border-right:1px solid var(--line);display:flex;flex-direction:column;gap:26px}
.rail>*{position:relative}
.rail-h{display:flex;flex-direction:column;gap:6px;padding:0 12px}
.rail-h h1{font-size:20px;letter-spacing:-.03em;line-height:1.25;overflow-wrap:anywhere}
.rail-h span{font-size:13px;color:var(--mute)}
.rnav{display:flex;flex-direction:column;gap:4px}
.rnav .lbl{padding:0 12px 6px;margin:0}
.rail-i{padding:0 12px;display:flex;flex-direction:column;gap:8px;font-size:13.5px}
.rail-i .lbl{margin:0}
.rail>.btn{margin:0 12px;align-self:flex-start}
.lens{padding:4px 0 0 40px;display:flex;flex-direction:column;gap:0;min-width:0}
.lens>*+*{margin-top:32px}
.lens-h{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;flex-wrap:wrap}
.lens-h>div{display:flex;flex-direction:column;gap:10px;flex:1 1 380px;min-width:0}
.lens-w{display:flex;align-items:center;gap:10px;font-size:15px}
.lens-h h2{font-size:clamp(24px,2.4vw,30px);font-weight:800;letter-spacing:-.04em;line-height:1.12}
.lens-s{font-size:14px;color:var(--mute)}
.lens-sec{display:flex;flex-direction:column;gap:12px}
.lens-sec h3{font-size:18px;font-weight:800;letter-spacing:-.02em}
.why{display:grid;grid-template-columns:minmax(150px,240px) minmax(0,1fr) 40px;gap:14px 16px;align-items:center;font-size:14px}
.why4{grid-template-columns:minmax(150px,240px) minmax(0,1fr) 40px auto}
.why .n{text-align:right;font:500 13px var(--mono)}
.lens-n{font-size:12.5px;color:var(--faint)}
.stats4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.stat{font-size:13px;line-height:1.45;color:var(--mute)}
.stat b{display:block;font-size:26px;font-weight:800;letter-spacing:-.03em;color:var(--cobalt)}
.rev summary{cursor:pointer;font-size:13.5px;font-weight:700;color:var(--cobalt);padding:4px 0}
.rev .list{margin-top:10px}
.rev-a{margin:8px 0}
.lens-send{display:flex;justify-content:space-between;align-items:center;gap:14px;flex-wrap:wrap}
.lens-send>div:first-child{flex:1 1 280px;font-size:13px;color:var(--mute)}
.lens-send b{font-size:15px;color:var(--tx);display:block}
.lens-btns{display:flex;gap:8px;flex-wrap:wrap}
.eb{font:500 12px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--cobalt)}
@media(max-width:900px){.rl{grid-template-columns:minmax(0,1fr)}.rail{position:static;padding:0 0 24px;border-right:0;border-bottom:1px solid var(--line);margin-bottom:24px}.lens{padding-left:0}.stats4{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:640px){.why,.why4{grid-template-columns:minmax(0,1fr) 40px}.why .pbar{grid-column:1/3;order:3}.why4 .btn{grid-column:1/3}}

/* overview lens */
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px}
.kpi{padding:14px 16px;border-radius:16px;background:var(--soft);display:flex;flex-direction:column;gap:2px}
.kpi b{font-size:30px;font-weight:800;letter-spacing:-.05em;line-height:1.05;font-variant-numeric:tabular-nums}
.kpi span{font-size:12.5px;color:var(--mute)}
.kpi.ok b{color:var(--ok)} .kpi.bad b{color:var(--bad)}
.ov{display:flex;flex-direction:column}
.ov-r{display:grid;grid-template-columns:200px minmax(0,1fr) 48px 150px;gap:16px;align-items:center;padding:13px 12px;margin:0 -12px;border-radius:12px;color:var(--tx)}
.ov-r:hover{background:var(--soft)}
.ov-n{display:flex;align-items:center;gap:10px;font-size:14px}
.ov-p{font-weight:800;letter-spacing:-.02em;text-align:right;font-variant-numeric:tabular-nums}
.ov-m{font-size:12.5px;color:var(--mute);text-align:right}
.rrow{display:flex;gap:12px;align-items:center;justify-content:space-between;flex-wrap:wrap;padding:13px 0;border-top:1px solid var(--line)}
.rrow:first-of-type{border-top:0}
.rrow>div{flex:1 1 220px;min-width:0}
.rrow b{font-size:14.5px}
.rrow .rm{font-size:12.5px;color:var(--mute);margin-top:2px}
.sc-all{width:100%;display:flex;flex-direction:column;gap:6px}
.sc-all>b{font-size:15px;margin-bottom:4px}
.sc-r{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;padding:10px 0;border-top:1px solid var(--line)}
@media(max-width:760px){.ov-r{grid-template-columns:minmax(0,1fr) 48px}.ov-r .pbar{grid-column:1/3;order:3}.ov-m{grid-column:1/3;text-align:left}}

/* toolbar: All uploads + menu, inline; the ellipsis is centred in its button */
details.menu>summary.menu-btn{display:grid;place-items:center}
.tools,.rl-tools{display:flex;align-items:center;gap:8px}
.rl{position:relative;margin-top:0}
@media(min-width:901px){.rl-tools{position:absolute;top:0;right:0;z-index:5}.lens>:first-child:not(.qd){padding-right:52px}}
@media(max-width:900px){.rl-tools{justify-content:flex-end;margin-bottom:16px}}

/* rail nav: one consistent row style for Overview and every channel */
.rnav{gap:2px}
.rnav .lbl{padding:14px 12px 6px;margin:6px 0 0;border-top:1px solid var(--line)}
.rn{display:grid;grid-template-columns:28px minmax(0,1fr) auto;gap:10px;align-items:center;padding:7px 12px 7px 8px;border-radius:12px;color:var(--tx);width:100%;text-align:left;font:inherit;cursor:pointer}
.rn:hover{background:var(--soft)}
.rn.on{background:var(--cobalt-t)}
.rn.on b,.rn.on .p{color:var(--cobalt)}
.rn b{font-size:14px;font-weight:600}
.rn .p{font-size:13px;font-weight:700;color:var(--mute);font-variant-numeric:tabular-nums}
.rn-i{display:inline-grid;place-items:center;width:28px;height:28px;border-radius:9px;background:var(--soft);color:var(--mute)}
.rn.on .rn-i{background:#fff;color:var(--cobalt)}
.rn-c{font:600 11.5px var(--mono);padding:2px 8px;border-radius:999px;background:var(--bad-t);color:var(--bad)}
.rn-ok{display:inline-grid;place-items:center;width:20px;height:20px;border-radius:50%;background:var(--ok-t);color:var(--ok)}
.rn-add{border:0;background:transparent}
.rn-add b{color:var(--mute)}
.rn-turn{font-size:12px;font-weight:700;color:var(--cobalt)}
.rn-form{display:contents}
.rail-dl{align-self:flex-start;margin:0 8px}
.page:has(.rl){padding-top:40px;padding-left:clamp(16px,2vw,28px)}
.rail{padding-right:24px}
.rail-h{padding:0 8px}
.rail-i{padding:0 8px}
/* download modal */
.dlg{position:fixed;inset:0;margin:auto;height:fit-content;max-height:calc(100vh - 48px);overflow:auto;border:0;border-radius:22px;padding:24px;width:min(640px,calc(100vw - 32px));box-shadow:0 30px 80px -20px rgba(10,15,30,.45);color:var(--tx)}
.dlg::backdrop{background:rgba(10,15,30,.45)}
.dlg-h{display:flex;justify-content:space-between;align-items:center}
.dlg-h h2{font-size:20px;letter-spacing:-.03em}
.dlg-x{width:32px;height:32px;border-radius:50%;display:grid;place-items:center;color:var(--mute);box-shadow:inset 0 0 0 1px var(--line2)}
.dlg-x:hover{background:var(--soft)}
.dlg-s{margin:6px 0 14px;font-size:13.5px;color:var(--mute)}
.dlg-r{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;padding:14px 0;border-top:1px solid var(--line)}
.dlg-m{font-size:12px;color:var(--faint);font-weight:400}

/* before / after quality hero */
.qh{display:flex;flex-direction:column;gap:14px;padding:22px 24px;border:1px solid var(--line);border-radius:20px}
.qh-top{display:flex;align-items:flex-end;gap:clamp(12px,2.5vw,28px);flex-wrap:wrap}
.qh-k{display:block;font-size:12.5px;color:var(--mute);margin-bottom:2px}
.qh-was b{font-size:34px;font-weight:700;letter-spacing:-.05em;color:var(--faint);text-decoration:line-through;text-decoration-thickness:1.5px;font-variant-numeric:tabular-nums}
.qh-now b{font-size:56px;font-weight:800;letter-spacing:-.06em;line-height:1;color:var(--tx);font-variant-numeric:tabular-nums}
.qh-arrow{color:var(--faint);padding-bottom:10px;display:inline-flex}
.qh-delta{margin-bottom:8px;padding:6px 12px;border-radius:999px;background:var(--ok-t);color:var(--ok);font-weight:700;font-size:14px}
.qh-bar{display:flex;height:14px;border-radius:999px;overflow:hidden;background:#e3e6f0}
.qh-bar i{display:block;height:100%}
.qh-bar .was{background:var(--faint)}
.qh-bar .fix{background:var(--cobalt)}
.qh-bar .need{background:#6fd3c8}
.qh-bar.mini{height:8px}
.qh-key{display:flex;gap:20px;flex-wrap:wrap;font-size:13px;color:var(--mute)}
.qh-key span{display:inline-flex;align-items:center;gap:7px}
.qh-key i{width:10px;height:10px;border-radius:3px;display:inline-block}
.qh-key i.was{background:var(--faint)} .qh-key i.fix{background:var(--cobalt)} .qh-key i.need{background:#6fd3c8}
.qh-key b{color:var(--tx)}
.qh-by{border-top:1px solid var(--line);padding-top:12px;display:flex;flex-direction:column;gap:8px}
.qh-by>div{display:flex;flex-wrap:wrap;gap:8px}
.qh-by span:not(.qh-k){padding:6px 12px;border-radius:12px;background:var(--soft);font-size:13px;color:var(--mute)}
.qh-by b{color:var(--tx);font-size:15px;margin-right:2px}
.qh-note{margin:0;font-size:13px;color:var(--mute)}
.ov-p s{color:var(--faint);font-weight:500;margin-right:2px}
.pts{display:block;font-size:11px;font-weight:600;color:var(--ok);font-family:var(--mono)}

/* lens polish: no section rules, card stats, button-style review */
.qh-by{border-top:0;padding-top:0}
.rrow{border-top:0;padding:10px 0}
.lens-h>div{flex:1 1 100%}
.stat{padding:16px 18px;border:1px solid var(--line);border-radius:16px;background:#fff}
.stat b{font-size:28px;font-weight:800}
.rev{display:flex;flex-direction:column;gap:12px;align-items:flex-start}
.rev>summary{list-style:none;cursor:pointer;display:inline-flex}
.rev>summary::-webkit-details-marker{display:none}
.rev>*:not(summary){width:100%}

/* what we changed: cards */
.chg{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px}
.chg-c{padding:16px 18px;border:1px solid var(--line);border-radius:18px;background:#fff;display:flex;flex-direction:column;gap:2px;min-width:0}
.chg-t{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}
.chg-i{display:inline-grid;place-items:center;width:30px;height:30px;border-radius:10px;background:var(--ok-t);color:var(--ok)}
.chg-i.ai{background:var(--cobalt-t);color:var(--cobalt)}
.chg-c b{font-size:34px;font-weight:800;letter-spacing:-.05em;line-height:1;font-variant-numeric:tabular-nums}
.chg-l{font-size:13.5px;color:var(--mute);margin-bottom:10px}
.chg-x{margin-top:auto;padding:8px 10px;border-radius:10px;background:var(--soft);font:500 11.5px var(--mono);display:flex;align-items:center;gap:6px;flex-wrap:wrap;overflow:hidden}
.chg-x s{color:var(--faint)} .chg-x em{font-style:normal;color:var(--tx)} .chg-x span{color:var(--faint)}
.lens-dl{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:4px}
.lens-dl .lens-n{font-size:12.5px;color:var(--faint)}



/* what we changed: example + themed ledger */
.chg-h{display:flex;justify-content:space-between;align-items:baseline;gap:12px;flex-wrap:wrap}
.chg-h span{font-size:13px;color:var(--mute)}
.ex{padding:18px 20px;border-radius:18px;background:var(--soft);display:flex;flex-direction:column;gap:10px}
.ex-h{display:flex;justify-content:space-between;align-items:center}
.ex-h .lbl{margin:0}
.ex-n{display:inline-flex;align-items:center;gap:6px;font-size:13px;font-weight:600;color:var(--cobalt)}
.ex-t{font-weight:700;font-size:15px;color:var(--tx)}
.ex-l{display:flex;align-items:center;gap:10px;flex-wrap:wrap;font-size:13.5px;padding:3px 0}
.ex-f{flex:0 0 112px;color:var(--mute);font-size:12.5px}
.ex-l s{color:var(--faint);font-family:var(--mono);font-size:12px}
.ex-l em{font-style:normal;font-family:var(--mono);font-size:12px;color:var(--tx)}
.ex-a{color:var(--faint)}
.chl{display:flex;flex-direction:column;gap:2px}
.chl-h{display:flex;align-items:center;gap:10px;padding:8px 0 4px}
.chl-h b{font-size:12px;letter-spacing:.08em;text-transform:uppercase;font-family:var(--mono);color:var(--mute);font-weight:500}
.chl-h span{font:500 12px var(--mono);color:var(--faint)}
.chl-h form{margin-left:auto}
.chl-r{display:grid;grid-template-columns:minmax(150px,260px) minmax(0,1fr) 44px auto;gap:14px;align-items:center;padding:8px 0;font-size:14px}
.chl-n small{margin-left:8px;font-size:12.5px;color:var(--faint)}
.chl-r .n{text-align:right;font:500 13px var(--mono)}
@media(max-width:640px){.chl-r{grid-template-columns:minmax(0,1fr) 44px}.chl-r .pbar{grid-column:1/3;order:3}.chl-r form{grid-column:1/3}}

/* what we changed: field tabs over real before / after rows */
.dt{display:flex;flex-direction:column;gap:14px}
.dt-tabs{display:flex;flex-wrap:wrap;gap:6px}
.dt-tabs button{display:inline-flex;align-items:center;gap:7px;padding:7px 14px;border-radius:999px;font-size:13.5px;font-weight:600;color:var(--mute);box-shadow:inset 0 0 0 1px var(--line2);background:#fff}
.dt-tabs button:hover{color:var(--tx)}
.dt-tabs button span{font:500 11.5px var(--mono);color:var(--faint)}
.dt-tabs button.on{background:var(--tx);color:#fff;box-shadow:none}
.dt-tabs button.on span{color:rgba(255,255,255,.7)}
.dt-p{display:flex;flex-direction:column;gap:6px}
.dt-top{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:6px}
.dt-top p{margin:0;font-size:14px;color:var(--mute)} .dt-top p b{color:var(--tx)}
.dt-cols,.dt-r{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:8px}
.dt-cols span{font:500 11px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--faint);padding:0 12px}
.dt-r{margin-top:6px}
.dt-t{grid-column:1/3;font-size:12.5px;font-weight:600;color:var(--mute);padding:0 2px}
.dt-b,.dt-a{padding:11px 14px;border-radius:12px;font:500 13px/1.45 var(--mono);overflow-wrap:anywhere;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.dt-b{background:var(--bad-t);color:var(--bad)}
.dt-a{background:var(--ok-t);color:#075c3d}
.dt-foot{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;font-size:13px;color:var(--mute)}
@media(max-width:640px){.dt-cols,.dt-r{grid-template-columns:minmax(0,1fr)}.dt-t{grid-column:1}}

/* what we changed: one sentence, details on demand */
.chg-s{margin:2px 0 4px;font-size:clamp(20px,2vw,25px);font-weight:700;letter-spacing:-.03em;line-height:1.4;color:var(--mute);max-width:44ch}
.chg-n{color:var(--tx);box-shadow:inset 0 -2px 0 rgba(42,63,235,.35);border-radius:2px}
.chg-n:hover{background:var(--cobalt-t);color:var(--cobalt)}
.chg-n.ai{box-shadow:inset 0 -2px 0 rgba(139,92,246,.45)}

/* before / after diptych: two rings, the gain between them */
.qd-head{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;flex-wrap:wrap}
.qd-head>div{flex:1 1 100%;display:flex;flex-direction:column;gap:10px;min-width:0}
.qd-head h2{font-size:clamp(24px,2.4vw,30px);font-weight:800;letter-spacing:-.04em;line-height:1.12}
.qd-body{display:flex;align-items:center;gap:clamp(12px,2vw,28px);flex-wrap:wrap}
.qd{display:flex;flex-direction:column;gap:22px;padding:28px 32px;border:1px solid var(--line);border-radius:24px;background:#fff}
.qd-p{display:flex;flex-direction:column;align-items:center;gap:10px;flex:none}
.qd-ring{position:relative;width:176px;height:176px}
.qd-p.before .qd-ring{width:124px;height:124px}
.qd-ring svg{width:100%;height:100%;display:block}
.qd-ring circle{fill:none;stroke-width:11;stroke-linecap:round}
.r-track{stroke:#e6e9f3}
.r-was{stroke:#b9c0d4} .r-fix{stroke:var(--cobalt)} .r-need{stroke:#6fd3c8}
.qd-ring b{position:absolute;inset:0;display:grid;place-items:center;align-content:center;font-size:28px;font-weight:800;letter-spacing:-.05em;font-variant-numeric:tabular-nums;color:var(--faint)}
.qd-p.before .qd-ring b{text-decoration:line-through;text-decoration-thickness:1.5px;text-decoration-color:rgba(10,15,30,.35)}
.qd-ring b.qd-now{font-size:52px;color:var(--tx);letter-spacing:-.07em}
.qd-ring b small{font-size:.42em;font-weight:700;margin-left:1px;letter-spacing:0;vertical-align:.55em}
.qd-cap{font:500 11px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--mute)}
.qd-p.after .qd-cap{color:var(--cobalt)}
.qd-mid{display:flex;align-items:center;flex:none;width:clamp(48px,7vw,84px);position:relative;margin-bottom:26px}
.qd-mid i{display:block;width:100%;height:0;border-top:1.5px dashed var(--line2)}
.qd-chip{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);padding:5px 12px;border-radius:999px;background:var(--cobalt);color:#fff;font-weight:800;font-size:15px;white-space:nowrap;letter-spacing:-.02em;box-shadow:0 0 0 5px #fff}
.qd-side{flex:1 1 280px;min-width:0;display:flex;flex-direction:column;gap:18px;padding-left:clamp(0px,2.4vw,36px)}
.qd-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px 18px}
.qd-stats b{display:block;font-size:30px;font-weight:800;letter-spacing:-.05em;line-height:1.05;font-variant-numeric:tabular-nums}
.qd-stats span{display:inline-flex;align-items:center;gap:7px;font-size:12.5px;color:var(--mute);margin-top:4px}
.qd-stats i{width:9px;height:9px;border-radius:50%;flex:none}
.qd-stats i.was{background:#b9c0d4} .qd-stats i.fix{background:var(--cobalt)} .qd-stats i.need{background:#6fd3c8}
.qd-by{display:flex;flex-wrap:wrap;align-items:center;gap:6px}
.qd-k{flex:1 0 100%;font:500 11px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--faint);margin-bottom:2px}
.qd-by span:not(.qd-k){padding:5px 11px;border-radius:999px;background:var(--soft);box-shadow:inset 0 0 0 1px var(--line);font-size:12.5px;color:var(--mute)}
.qd-by b{color:var(--tx);font-size:13.5px;margin-right:2px}
.qd-note{margin:0;font-size:13px;color:var(--mute)}
@media(max-width:760px){.qd{padding:22px}.qd-side{flex-basis:100%;padding-left:0}.qd-stats b{font-size:24px}}

/* percentage sits inline with the number inside the dials */
.qd-ring b{display:grid;grid-auto-flow:column;place-content:center;align-items:baseline}
.qd-ring b small{vertical-align:baseline;margin-left:2px}

/* on-brand dial: a ring of ticks like the omniSKU mark, flat card, mono labels */
.qd{position:relative;border-radius:22px;padding:24px 28px 28px}
.qd-head{padding-right:48px}
.qd-head .lens-w{font:500 12px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--mute)}
.qd-head .lens-w b{font-weight:500}
.qd-ring line{stroke-width:3.4;stroke-linecap:round}
.tk-track{stroke:#e3e6f0} .tk-was{stroke:var(--tx)} .tk-fix{stroke:var(--cobalt)} .tk-need{stroke:#6fd3c8}
.qd-p.before .tk-was{stroke:#9aa3b8}
.qd-stats i.was{background:var(--tx)} .qd-stats i.fix{background:var(--cobalt)} .qd-stats i.need{background:#6fd3c8}
.qd-mid i{border-top-color:var(--tx);opacity:.25}
.qd-ring b.qd-now small{color:var(--cobalt)}
@media(min-width:901px){.rl-tools{top:14px;right:14px}.lens>:first-child:not(.qd){padding-right:52px}.lens>.qd:first-child{padding-right:28px}}

/* bigger dial, plain heading font */
.qd-head .lens-w{font:700 16px/1.2 var(--sans, inherit);letter-spacing:-.01em;text-transform:none;color:var(--tx)}
.qd-head .lens-w b{font-weight:700}
.qd-ring{width:232px;height:232px}
.qd-p.before .qd-ring{width:150px;height:150px}
.qd-ring b{font-size:34px}
.qd-ring b.qd-now{font-size:68px}
.qd-p.after{padding-bottom:24px}
@media(max-width:760px){.qd-ring{width:200px;height:200px}.qd-p.before .qd-ring{width:128px;height:128px}}

/* hero side: pass / fail ledger, eligibility, next best fix */
.qd-t{width:100%;border-collapse:collapse;font-size:14px}
.qd-t th,.qd-t td{padding:9px 0;text-align:right;font-variant-numeric:tabular-nums;border-top:1px solid var(--line)}
.qd-t thead th{border-top:0;font:500 11px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--faint);padding-top:0}
.qd-t tbody th{text-align:left;font-weight:500;color:var(--mute)}
.qd-t td{font-weight:700;width:90px}
.qd-t tr.opt th,.qd-t tr.opt td{color:var(--cobalt)}
.qd-t tr.now th,.qd-t tr.now td{color:var(--tx);font-weight:800;font-size:16px}
.qd-t tr.now td:first-of-type{letter-spacing:-.02em}
.qd-elig{margin:0;padding:10px 14px;border-radius:12px;background:var(--cobalt-t);color:var(--cobalt);font-size:13.5px}
.qd-elig b{font-size:18px;letter-spacing:-.03em;margin-right:4px}
.qd-next{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;padding:12px 14px;border-radius:14px;background:var(--soft)}
.qd-next>div{flex:1 1 200px;min-width:0;display:flex;flex-direction:column;gap:2px}
.qd-next b{font-size:14px}
.qd-next em{font-style:normal;font-size:12.5px;color:var(--ok);font-weight:600}
.qd-next .qd-k{margin-bottom:2px}
.qd-meta{font-size:12.5px;color:var(--faint)}
.qd-meta form{display:inline}.qd-meta .link{font-size:12.5px}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* what we changed: overview strip over the full table */
.cv{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:10px}
.cv-s{padding:14px 16px;border:1px solid var(--line);border-radius:16px;background:#fff;display:flex;flex-direction:column;gap:2px}
.cv-s b{font-size:28px;font-weight:800;letter-spacing:-.05em;line-height:1.05;font-variant-numeric:tabular-nums}
.cv-s span{font-size:12.5px;color:var(--mute)}
.cv-s.ai b{color:var(--cobalt)}
.cv-bar{display:flex;height:10px;border-radius:999px;overflow:hidden;background:#e3e6f0;gap:2px}
.cv-bar i{display:block;height:100%}
.cv-bar .clean,.cv-key .clean{background:var(--tx)}
.cv-bar .format,.cv-key .format{background:#aeb6ca}
.cv-bar .ai,.cv-key .ai{background:var(--cobalt)}
.cv-key{display:flex;gap:20px;flex-wrap:wrap;align-items:center;font-size:13px;color:var(--mute)}
.cv-key span{display:inline-flex;align-items:center;gap:7px}
.cv-key span i{width:10px;height:10px;border-radius:3px;display:inline-block}
.cv-key b{color:var(--tx)}
.cv-undo{margin-left:auto}

/* single dial: the gain is the cobalt arc, "up from" sits underneath */
.qd-p.after{padding-bottom:0;gap:12px}
.qd-delta{display:flex;align-items:center;gap:10px;font-size:13.5px;color:var(--mute)}
.qd-delta .qd-chip{position:static;transform:none;box-shadow:none;font-size:14px}

/* why the rest fail: one segmented bar + legend; scan line and download in the footer */
.qd-why{display:flex;flex-direction:column;gap:10px}
.qd-why .qd-k{margin:0}
.qd-wb{display:flex;gap:3px;height:12px}
.qd-wb a{display:block;min-width:6px;border-radius:999px}
.qd-wk{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:6px 18px;font-size:13px}
.qd-wk li{display:flex;align-items:center;gap:8px;min-width:0}
.qd-wk i{width:9px;height:9px;border-radius:50%;flex:none}
.qd-wk a{color:var(--mute);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.qd-wk a:hover{color:var(--tx)} .qd-wk b{color:var(--tx);margin-right:2px}
.w0{background:#e0585c}.w1{background:#ee8486}.w2{background:#f6a9ab}.w3{background:#fbd0d1}
.qd-foot{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;padding-top:14px;border-top:1px solid var(--line)}

/* right side of the hero: three sections in one grammar (eyebrow, content), one action row */
.qd-side{gap:22px}
.qd-sec{display:flex;flex-direction:column;gap:10px}
.qd-sec .qd-k,.qd-why .qd-k{margin:0;font:500 11px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--faint)}
.qd-t thead th{font:500 12px var(--sans);letter-spacing:0;text-transform:none;color:var(--mute);padding-bottom:6px}
.qd-t .d,.qd-t th i{display:inline-block;width:9px;height:9px;border-radius:50%;margin-right:7px;vertical-align:0}
.d.pass{background:var(--tx)} .d.fail{background:#6fd3c8} .d.fix{background:var(--cobalt)}
.qd-elig{margin:0;padding:0;background:none;border-radius:0;font-size:13.5px;color:var(--mute)}
.qd-elig b{font-size:inherit;color:var(--cobalt);margin-right:2px}
.qd-acts{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding-top:16px;border-top:1px solid var(--line)}
.qd-acts .qd-meta{margin-left:auto;font-size:12.5px;color:var(--faint)}

/* hero overhaul: dial + statement on top, one master bar for the products, then why the rest fail */
.qd{gap:26px;padding:28px 32px 30px}
.qd-top{display:flex;align-items:center;gap:clamp(20px,3vw,44px);flex-wrap:wrap}
.qd-top .qd-ring{width:216px;height:216px;flex:none}
.qd-msg{flex:1 1 300px;min-width:0;display:flex;flex-direction:column;gap:10px}
.qd-big{margin:0;font-size:clamp(24px,2.6vw,34px);font-weight:700;letter-spacing:-.04em;line-height:1.15;color:var(--tx)}
.qd-big b{font-weight:800;color:var(--cobalt)}
.qd-small{margin:0;font-size:13.5px;color:var(--mute)}
.qd-acts{border-top:0;padding-top:6px}
.qd-flow{display:flex;flex-direction:column;gap:16px}
.qd-bar{display:flex;gap:3px;height:20px}
.qd-bar i{display:block;border-radius:999px;min-width:8px}
.qd-bar .pass,.qd-cols .pass{background:var(--tx)}
.qd-bar .fix,.qd-cols .fix{background:var(--cobalt)}
.qd-bar .fail,.qd-cols .fail{background:#6fd3c8}
.qd-cols{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px 24px;margin:0}
.qd-cols>div{display:flex;flex-direction:column;gap:2px}
.qd-cols dt{display:flex;align-items:center;gap:8px;font:500 11px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--mute)}
.qd-cols dt i{width:9px;height:9px;border-radius:50%}
.qd-cols dd{margin:0;font-size:clamp(28px,3vw,40px);font-weight:800;letter-spacing:-.05em;line-height:1.05;font-variant-numeric:tabular-nums}
.qd-cols span{font-size:12.5px;color:var(--mute)}
.qd-why{padding-top:20px;border-top:1px solid var(--line)}
@media(max-width:700px){.qd-top .qd-ring{width:180px;height:180px}.qd-cols{grid-template-columns:1fr 1fr 1fr;gap:8px}.qd-cols dd{font-size:24px}}

/* editorial counts line under the statement */
.qd-counts{margin:0;font-size:clamp(16px,1.6vw,19px);font-weight:500;letter-spacing:-.02em;line-height:1.5;color:var(--mute)}
.qd-counts b{font-weight:800;letter-spacing:-.03em}
.qd-counts .c-pass{color:var(--tx)} .qd-counts .c-fix{color:var(--cobalt)} .qd-counts .c-fail{color:var(--bad)}
.qd-counts>b:not([class]){color:var(--tx);font-weight:800}

/* download modal: accordion rows */
.dlg-g{font:500 11px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--faint);margin:20px 0 6px}
.dd{border-top:1px solid var(--line)}
.dd:last-of-type{border-bottom:1px solid var(--line)}
.dd>summary{list-style:none;cursor:pointer;display:grid;grid-template-columns:28px auto minmax(0,1fr) 16px;gap:10px;align-items:center;padding:13px 0}
.dd>summary::-webkit-details-marker{display:none}
.dd>summary b{font-size:14.5px}
.dd>summary small{color:var(--faint);font-size:12.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dd-i{display:inline-grid;place-items:center;width:28px;height:28px;border-radius:9px;background:var(--soft);color:var(--mute)}
.dd-c{color:var(--faint);transition:transform .2s;transform:rotate(90deg)}
.dd[open]>summary .dd-c{transform:rotate(-90deg)}
.dd-b{padding:0 0 12px 38px;display:flex;flex-direction:column}
.dd-r{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;padding:9px 0;font-size:14px}
.dd-r small{display:block;font-size:12px;color:var(--faint)}

/* the matching ledgers: What you need to do / What we changed */
.ld-h{display:flex;justify-content:space-between;align-items:baseline;gap:12px;flex-wrap:wrap}
.ld-h span{font-size:13px;color:var(--mute)}
.ld{display:flex;flex-direction:column}
.ld-r{display:grid;grid-template-columns:28px minmax(0,1fr) auto auto;gap:6px 16px;align-items:center;padding:16px 0;border-top:1px solid var(--line)}
.ld>.ld-r:first-child,.ld>.ld-d:first-child>.ld-r{border-top:0}
.ld-n{width:26px;height:26px;border-radius:50%;background:var(--soft);display:grid;place-items:center;font-size:12px;font-weight:600;color:var(--mute)}
.ld-n.done{background:var(--ok-t);color:var(--ok)} .ld-n.ai{background:var(--cobalt-t);color:var(--cobalt)}
.ld-t{font-size:15px;font-weight:600;letter-spacing:-.01em}
.ld-s{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:3px;font-size:13px;color:var(--mute)}
.chs{display:inline-flex;gap:3px}
.ch{display:inline-block;width:18px;height:18px;border-radius:5px;font-size:10px;font-weight:700;text-align:center;line-height:18px;color:#0a0f1e}
.ld-p{text-align:right;min-width:116px}
.ld-p b{display:block;font-size:15px;font-weight:700;color:var(--tx);letter-spacing:-.01em}
.ld-p b.ok{color:var(--ok)}
.ld-p span{font-size:12px;color:var(--faint)}
.ld-more>summary{list-style:none;cursor:pointer;display:inline-flex;margin-top:6px}
.ld-more>summary::-webkit-details-marker{display:none}
.ld-d{border-top:1px solid var(--line)}
.ld-d:first-child{border-top:0}
.ld-d>summary{list-style:none;cursor:pointer;border-top:0}
.ld-d>summary::-webkit-details-marker{display:none}
.ld-d .ld-r{border-top:0}
.ld-x{display:inline-flex;align-items:center;gap:4px;font-size:13px;color:var(--mute)}
.ld-x svg{transition:transform .2s;transform:rotate(90deg)}
.ld-d[open] .ld-x svg{transform:rotate(-90deg)}
.ld-ev{padding:0 0 16px 44px;display:flex;flex-direction:column;gap:6px}
.ld-cols,.ld-pair{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:8px}
.ld-cols span{font:500 11px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--faint);padding:0 12px}
.ld-pair div{padding:10px 12px;border-radius:10px;font:500 12.5px/1.45 var(--mono);overflow-wrap:anywhere}
.ld-pair .b{background:var(--bad-t);color:var(--bad)} .ld-pair .a{background:var(--ok-t);color:#075c3d}
.ld-ea{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-top:4px;font-size:13px;color:var(--mute)}
@media(max-width:700px){.ld-r{grid-template-columns:28px minmax(0,1fr)}.ld-p{grid-column:2;text-align:left}.ld-r>.btn,.ld-x{grid-column:2;justify-self:start}.ld-ev{padding-left:0}}
.tg{opacity:.5;text-decoration:line-through;text-decoration-thickness:1px}
.ld-extra{display:flex;flex-direction:column}.ld-extra[hidden]{display:none}.ld-extra>.ld-r{border-top:1px solid var(--line)}
.ld-p{text-align:center;min-width:120px;align-self:center}
.ld-n.done{background:var(--soft);color:var(--mute)}
.ld-n.done.ai{background:var(--cobalt-t);color:var(--cobalt)}

/* catalogue = where fixes happen; a channel = a report on how the catalogue fits */
.ld-f{display:flex;align-items:center;gap:6px;flex-wrap:wrap;font-size:13px;color:var(--mute)}
.fchip2{display:inline-flex;align-items:center;gap:6px;padding:5px 12px;border-radius:999px;box-shadow:inset 0 0 0 1px var(--line2);color:var(--mute);font-weight:600;font-size:13px;background:#fff}
.fchip2:hover{color:var(--tx)} .fchip2.on{background:var(--tx);color:#fff;box-shadow:none}
.ld-once{margin:0;font-size:13px;color:var(--faint)}
.rq{display:flex;flex-direction:column}
.rq-r{display:grid;grid-template-columns:minmax(160px,230px) minmax(0,1fr) 44px 96px;gap:14px;align-items:center;padding:11px 0;border-top:1px solid var(--line);font-size:14px}
.rq-r:first-child{border-top:0}
.rq-n small{margin-left:8px;font:500 10.5px var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--faint)}
.rq-p{text-align:right;font-weight:700;font-variant-numeric:tabular-nums}
.rq-m{text-align:right;font-size:12.5px;color:var(--mute)} .rq-m a{color:var(--cobalt);font-weight:600}
.rq-go{display:flex;justify-content:space-between;align-items:center;gap:14px;flex-wrap:wrap;padding:14px 16px;border-radius:14px;background:var(--soft)}
.rq-go p{margin:0;font-size:14px;color:var(--mute);flex:1 1 300px} .rq-go b{color:var(--tx)}
.dl-r{display:flex;justify-content:space-between;align-items:center;gap:14px;flex-wrap:wrap;padding:14px 0;border-top:1px solid var(--line)}
.dl-r:first-of-type{border-top:0}
.dl-r b{display:block;font-size:14.5px} .dl-r small{display:block;font-size:12.5px;color:var(--mute);margin-top:2px;max-width:46ch}
.dl-b{display:flex;gap:8px;flex-wrap:wrap}
.dl-b form{display:contents}
@media(max-width:700px){.rq-r{grid-template-columns:minmax(0,1fr) 44px}.rq-r .pbar{grid-column:1/3;order:3}.rq-m{grid-column:1/3;text-align:left}}

.rail-cta{display:flex;flex-direction:column;gap:8px;padding:0 8px}
.rail-cta .btn{width:100%}
.rn-div{border:0;border-top:1px solid var(--line);margin:10px 8px 8px}
.rn-c{font-variant-numeric:tabular-nums;white-space:nowrap}
.rn-c.ok{background:var(--ok-t);color:var(--ok)}

/* before / after as a light table */
.ld-bt{width:100%;border-collapse:collapse;font-size:13px;border:1px solid var(--line);border-radius:12px;overflow:hidden;border-spacing:0}
.ld-bt th{font:500 11px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--faint);text-align:left;padding:9px 14px;background:var(--soft)}
.ld-bt td{padding:10px 14px;border-top:1px solid var(--line);vertical-align:top;overflow-wrap:anywhere}
.ld-bt td:first-child{width:26%;color:var(--mute)} .ld-bt td:first-child a:hover{color:var(--cobalt)}
.ld-bt .was{font-family:var(--mono);font-size:12px;color:var(--faint);text-decoration:line-through;text-decoration-thickness:1px}
.ld-bt .now{font-family:var(--mono);font-size:12px;color:var(--tx);font-weight:500}
/* catalogue hero: headline plus a dial per channel */
.qc-body{display:flex;gap:clamp(20px,3vw,44px);align-items:center;flex-wrap:wrap}
.qc-main{flex:1 1 320px;min-width:0;display:flex;flex-direction:column;gap:10px}
.qc-minis{flex:1 1 360px;display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}
.qc-m{display:flex;flex-direction:column;align-items:center;gap:6px;padding:10px 8px;border-radius:16px;width:112px;color:var(--tx);text-align:center}
.qc-m:hover{background:var(--soft)}
.qc-ring{position:relative;width:92px;height:92px;display:block}
.qc-ring svg{width:100%;height:100%;display:block}
.qc-ring line{stroke-width:4;stroke-linecap:round}
.qc-ring b{position:absolute;inset:0;display:grid;grid-auto-flow:column;place-content:center;align-items:baseline;font-size:20px;font-weight:800;letter-spacing:-.05em;font-variant-numeric:tabular-nums}
.qc-ring b small{font-size:.5em;margin-left:1px;color:var(--mute)}
.qc-n{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;font-weight:600}
.qc-d{font-size:12px;font-weight:700;color:var(--cobalt)}
.qc-body{flex-direction:column;align-items:stretch;gap:26px}
.qc-main{flex:none}
.qc-minis{flex:none;justify-content:space-between;gap:4px;border-top:1px solid var(--line);padding-top:20px}
.qc-m{flex:1 1 0;width:auto;min-width:92px}
.qc-ring{width:96px;height:96px}
.qc-m{justify-content:flex-start}
.qc-n{min-height:34px;flex-wrap:wrap;justify-content:center;align-content:flex-start;line-height:1.25}
.rn .p em{font-style:normal;font-size:11px;font-weight:700;color:var(--cobalt);margin-right:6px}
.rn.on .p em{color:var(--cobalt)}

/* catalogue hero: four steps from upload to result */
.pl-card{gap:22px}
.pl{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0}
.pl-s{position:relative;display:flex;flex-direction:column;gap:6px;padding:26px 20px 0 0}
.pl-s:before{content:"";position:absolute;top:6px;left:0;right:0;height:2px;background:var(--line2)}
.pl-s:after{content:"";position:absolute;top:0;left:0;width:14px;height:14px;border-radius:50%;background:#fff;box-shadow:inset 0 0 0 3px var(--tx)}
.pl-s.fix:after{box-shadow:inset 0 0 0 3px var(--cobalt)}
.pl-s.fix:before{background:linear-gradient(90deg,var(--line2),var(--cobalt) 40%)}
.pl-s.end:before{right:auto;width:14px}
.pl-s.end:after{background:var(--tx);box-shadow:none}
.pl-k{font:500 11px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--mute)}
.pl-s b{font-size:clamp(34px,4vw,52px);font-weight:800;letter-spacing:-.06em;line-height:1;font-variant-numeric:tabular-nums}
.pl-s.fix b{color:var(--cobalt)}
.pl-c{font-size:13px;color:var(--mute);display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.pl-c em{font-style:normal;font-weight:700;color:var(--bad)}
.pl-logos{display:inline-flex;gap:3px}
@media(max-width:760px){.pl{grid-template-columns:1fr 1fr;row-gap:22px}}
.pl-s.end b{color:var(--bad)}.pl-s.end:after{background:var(--bad)}
.pl-s.end.done b{color:var(--ok)}.pl-s.end.done:after{background:var(--ok)}

/* catalogue hero on cobalt */
.qd.qd-blue{position:relative;overflow:hidden;background:var(--cobalt);color:#fff;border:0;box-shadow:0 18px 40px -26px rgba(42,63,235,.6)}
.qd-blue:before{content:"";position:absolute;inset:0;background:radial-gradient(60% 90% at 100% 0,rgba(255,255,255,.18),transparent 70%);pointer-events:none}
.qd-blue>*{position:relative}
.qd-blue .qd-head .lens-w{color:rgba(255,255,255,.8)}
.qd-blue .tk-track{stroke:rgba(255,255,255,.22)} .qd-blue .tk-was{stroke:#fff} .qd-blue .tk-fix{stroke:#aeb9ff} .qd-blue .tk-need{stroke:#6fd3c8}
.qd-blue .qd-ring b.qd-now{color:#fff} .qd-blue .qd-ring b small{color:rgba(255,255,255,.75)}
.qd-blue .qd-big{color:#fff} .qd-blue .qd-big b{color:#fff}
.qd-blue .qd-counts{color:rgba(255,255,255,.82)}
.qd-blue .qd-counts .c-pass,.qd-blue .qd-counts b{color:#fff} .qd-blue .qd-counts .c-fix{color:#d5dbff} .qd-blue .qd-counts .c-fail{color:#ffc9cb}
.qb-flow{list-style:none;margin:0;padding:18px 0 0;border-top:1px solid rgba(255,255,255,.22);display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.qb-flow li{display:flex;align-items:center;gap:12px;min-width:0;position:relative}
.qb-flow li:not(:last-child):after{content:"›";position:absolute;right:6px;top:50%;transform:translateY(-50%);color:rgba(255,255,255,.45);font-size:22px}
.qb-flow b{font-size:clamp(26px,3vw,36px);font-weight:800;letter-spacing:-.05em;line-height:1;font-variant-numeric:tabular-nums}
.qb-flow span{display:flex;flex-direction:column;font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;font-family:var(--mono);color:rgba(255,255,255,.9);min-width:0}
.qb-flow small{font:400 12px var(--sans);letter-spacing:0;text-transform:none;color:rgba(255,255,255,.7);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.qb-flow li.last b{color:#ffc9cb}
@media(max-width:760px){.qb-flow{grid-template-columns:1fr 1fr}.qb-flow li:after{display:none}}
.rl:has(.qd-blue) .rl-tools .menu-btn{background:rgba(255,255,255,.16);color:#fff;box-shadow:inset 0 0 0 1px rgba(255,255,255,.35)}
.rl:has(.qd-blue) .rl-tools .menu-btn:hover,.rl:has(.qd-blue) details.menu[open] .menu-btn{background:rgba(255,255,255,.28);color:#fff}
.qb-flow li{padding-right:18px}

/* catalogue hero: smaller, with a palette that reads on cobalt (white = pass, mint = optimised, coral = fail) */
.qd.qd-blue{padding:20px 26px 20px;gap:16px}
.qd-blue .qd-top{gap:clamp(16px,2.4vw,32px)}
.qd-blue .qd-top .qd-ring{width:148px;height:148px}
.qd-blue .qd-ring b.qd-now{font-size:40px}
.qd-blue .qd-ring line{stroke-width:4}
.qd-blue .qd-big{font-size:clamp(20px,2.1vw,27px)}
.qd-blue .qd-counts{font-size:14.5px;line-height:1.5}
.qd-blue .tk-track{stroke:rgba(255,255,255,.2)} .qd-blue .tk-was{stroke:#fff} .qd-blue .tk-fix{stroke:#5eead4} .qd-blue .tk-need{stroke:#ff8a8f}
.qd-blue .qd-counts .c-pass{color:#fff} .qd-blue .qd-counts .c-fix{color:#5eead4} .qd-blue .qd-counts .c-fail{color:#ffa1a5}
.qd-blue .qd-big b{color:#5eead4}
.qb-flow{padding-top:14px}
.qb-flow b{font-size:clamp(20px,2.2vw,26px)}
.qb-flow li:nth-child(3) b{color:#5eead4}
.qb-flow li.last b{color:#ffa1a5}
.qb-flow span{font-size:11px}

/* channel heroes: same compact scale as the Catalogue hero */
.qd:not(.qd-blue){padding:20px 26px;gap:16px}
.qd:not(.qd-blue) .qd-top{gap:clamp(16px,2.4vw,32px)}
.qd:not(.qd-blue) .qd-top .qd-ring{width:148px;height:148px}
.qd:not(.qd-blue) .qd-ring b.qd-now{font-size:40px}
.qd:not(.qd-blue) .qd-ring line{stroke-width:4}
.qd:not(.qd-blue) .qd-big{font-size:clamp(20px,2.1vw,27px)}
.qd:not(.qd-blue) .qd-counts{font-size:14.5px;line-height:1.5}
@media(min-width:761px){.qd{min-height:286px;justify-content:center}}

/* on-brand dial palette: ink / cobalt / empty on light cards; white / amber / empty on cobalt. No red or green. */
.tk-was{stroke:var(--tx)} .tk-fix{stroke:var(--cobalt)} .tk-need{stroke:#dde1ee} .tk-track{stroke:#dde1ee}
.qd .qd-counts .c-pass{color:var(--tx)} .qd .qd-counts .c-fix{color:var(--cobalt)} .qd .qd-counts .c-fail{color:var(--mute);text-decoration:underline;text-decoration-color:#c4cadc;text-underline-offset:3px}
.qd-blue .tk-was{stroke:#fff} .qd-blue .tk-fix{stroke:#5eead4} .qd-blue .tk-need{stroke:rgba(255,255,255,.2)} .qd-blue .tk-track{stroke:rgba(255,255,255,.2)}
.qd-blue .qd-big b{color:#5eead4}
.qd-blue .qd-counts .c-pass,.qd-blue .qd-counts .c-fail{color:#fff} .qd-blue .qd-counts .c-fix{color:#5eead4}
.qd-blue .qd-counts .c-fail{text-decoration-color:rgba(255,255,255,.5)}
/* simpler KPI strip: big number, one short label, never wrapped */
.qb-flow{grid-template-columns:repeat(auto-fit,minmax(168px,1fr));gap:14px 8px;padding-top:16px}
.qb-flow li{flex-direction:column;align-items:flex-start;gap:4px;padding:0 8px 0 0}
.qb-flow li:not(:last-child):after{display:none}
.qb-flow b{font-size:clamp(30px,3.4vw,42px);color:#fff}
.qb-flow span{font:500 13px var(--sans);letter-spacing:0;text-transform:none;color:rgba(255,255,255,.82);white-space:nowrap}
.qb-flow li.opt b{color:#5eead4}
.qb-flow li.last b{color:#fff}
.qb-flow li:nth-child(3) b{color:#5eead4}

/* ── upload flow: same page standard as Uploads ── */
.dz .fmts{display:flex;justify-content:center;gap:6px;margin-top:14px}
.dz .picked .spin{width:26px;height:26px;margin:0 auto 14px;border-radius:50%;border:3px solid var(--line2);border-top-color:var(--cobalt);animation:spin .8s linear infinite}
.wstep>h2{font-size:20px}
.chrow{grid-template-columns:minmax(0,1fr);max-width:640px}
.chrow .chopt{padding:12px 16px}
.chrow .chopt .tx{flex:1} .chrow .chopt .tx b,.chrow .chopt .tx span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.up{max-width:720px}

/* ── dashboard: health headline, fix-first list, platform readiness, upload rows ── */
.dh{display:grid;grid-template-columns:auto minmax(0,1fr);gap:clamp(24px,4vw,56px);align-items:center;padding:26px 32px;border-radius:var(--r);background:#fff;box-shadow:0 0 0 1px var(--line)}
.dh .lbl{font:500 11px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--faint)}
.dh-n{display:block;font-size:clamp(60px,7vw,88px);font-weight:800;letter-spacing:-.07em;line-height:1;margin-top:6px;font-variant-numeric:tabular-nums;color:var(--cobalt)}
.dh-n small{font-size:.45em;letter-spacing:-.02em;margin-left:2px} .dh-n.ok{color:var(--ok)}
.dh-s{font-size:18px;letter-spacing:-.02em;text-wrap:balance} .dh-s b{font-weight:800}
.dh-bar,.pbar{display:flex;height:8px;border-radius:8px;overflow:hidden;background:var(--soft)}
.dh-bar{margin:14px 0 12px;height:10px} .dh-bar i.ok{background:var(--ok)} .dh-bar i.bad{background:var(--bad)}
.dh-f{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;font-size:13.5px;color:var(--mute)} .dh-f b{color:var(--tx)}
.pbar i{background:var(--cobalt);border-radius:8px}
.tf{padding:0;overflow:hidden}
.tf-row{display:grid;grid-template-columns:64px minmax(0,1fr) auto;align-items:center;gap:16px;padding:14px 20px}
.tf-row+.tf-row{border-top:1px solid var(--line)} .tf-row:hover{background:var(--soft)}
.tf-n{font-size:24px;font-weight:800;letter-spacing:-.05em;color:var(--bad);font-variant-numeric:tabular-nums}
.tf-t b{display:block;font-weight:600;font-size:14.5px} .tf-t small{display:block;color:var(--faint);font-size:12.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tf-go{color:var(--faint)} .tf-row:hover .tf-go{color:var(--cobalt)}
.plat .pv2 small{font-size:.55em;letter-spacing:0} .plat .pv2.ok{color:var(--ok)} .plat .pv2.bad{color:var(--bad)}
.plat .pbar{margin:8px 0 10px;height:6px}
.ru{padding:0;overflow:hidden}
.ru-row{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr) auto;align-items:center;gap:20px;padding:14px 20px}
.ru-row+.ru-row{border-top:1px solid var(--line)}
.ru-t{display:flex;flex-direction:column;min-width:0}
.ru-t .nm{font-weight:700;font-size:15px;letter-spacing:-.02em;overflow:hidden;text-overflow:ellipsis;white-space:nowrap} .ru-t .nm:hover{color:var(--cobalt)}
.ru-s{display:flex;flex-direction:column;gap:6px;font-size:13px}
.ru-s .st{display:flex;align-items:center;gap:8px;color:var(--mute)} .ru-s .st.risk{color:var(--bad)} .ru-s .st.ready{color:var(--ok)}
@media(max-width:700px){.dh{grid-template-columns:minmax(0,1fr);padding:20px}.ru-row{grid-template-columns:minmax(0,1fr);gap:10px}.ru-row .btn{justify-self:start}}

/* dashboard v2: channel tiles, account stat strip, recurring problems */
.plat .pbar i.was{background:var(--line2);border-radius:8px 0 0 8px}
.plat .pd{line-height:1.5}
.dstat{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin-top:14px;border-radius:var(--r);background:#fff;box-shadow:0 0 0 1px var(--line);overflow:hidden}
.dstat>div{padding:16px 22px;display:flex;flex-direction:column}
.dstat>div+div{border-left:1px solid var(--line)}
.dstat .lbl{font:500 11px var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--faint)}
.dstat b{font-size:32px;font-weight:800;letter-spacing:-.05em;line-height:1.15;margin-top:4px;font-variant-numeric:tabular-nums}
.dstat b small{font-size:.55em;letter-spacing:0} .dstat b.low{color:var(--warn)}
.dstat .d{font-size:13px;color:var(--mute)}
.tf-t .pbar{height:4px;margin-top:8px;max-width:420px}
.dfoot{margin-top:32px;font-size:13.5px;color:var(--mute)}
@media(max-width:1000px){.dstat{grid-template-columns:repeat(2,minmax(0,1fr))}.dstat>div:nth-child(3){border-left:0}.dstat>div:nth-child(n+3){border-top:1px solid var(--line)}}
.sect{flex-wrap:wrap}
.sect.stack{flex-direction:column;align-items:flex-start;gap:2px}
.sect.stack h2{font-size:22px;letter-spacing:-.03em}
.sect.stack .hint{font-size:14.5px}
.rcards{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:14px}
.card.rc{padding:18px 20px;display:flex;flex-direction:column;gap:8px}
.rc-n{font-size:34px;font-weight:800;letter-spacing:-.05em;line-height:1;color:var(--bad);font-variant-numeric:tabular-nums}
.rc-t{font-weight:600;font-size:14.5px;line-height:1.35;flex:1}
.rc .pbar{height:5px}
.rc-u{color:var(--faint);font-size:12.5px}
/* dashboard overview + history */
.ru-row.hist{grid-template-columns:minmax(0,1.2fr) minmax(0,1.6fr) auto}
.qb-flow{grid-template-columns:repeat(auto-fit,minmax(130px,1fr))}
/* catalogue report (design 4A): one report, re-scoped by a reader switch */
.r4{display:flex;flex-direction:column;gap:30px}
.r4-top{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;flex-wrap:wrap}
.r4-file{display:flex;flex-direction:column;gap:2px;min-width:0} .r4-file b{font-size:20px;font-weight:800;letter-spacing:-.03em;overflow-wrap:anywhere}
.r4-file span{font-size:13px;color:var(--mute)}
.r4-tools{display:flex;align-items:center;gap:8px}
.r4-sec{display:flex;flex-direction:column;gap:12px}
.r4-h{font-size:17px;font-weight:800;letter-spacing:-.02em}
.r4-sub{font-size:14.5px;color:var(--mute);line-height:1.55} .r4-sub b{color:var(--tx)}
.r4-seg{display:flex;gap:3px;height:14px}
.r4-seg i{display:block;height:100%;border-radius:6px;min-width:0} .r4-seg i[style*="width:0"]{display:none}
.r4-seg i.was,.r4-key i.was{background:#b9c0d4} .r4-seg i.fix,.r4-key i.fix{background:var(--cobalt)} .r4-seg i.need,.r4-key i.need{background:#6fd3c8}
.r4-key{display:flex;flex-wrap:wrap;gap:6px 26px;font-size:13.5px;color:var(--mute)} .r4-key b{color:var(--tx);font-weight:800;font-size:15px}
.r4-key i{display:inline-block;width:9px;height:9px;border-radius:50%;margin-right:7px} .r4-key a{color:var(--mute);text-decoration:underline;text-underline-offset:3px} .r4-key a:hover{color:var(--cobalt)}
.r4-gain{font:600 12px var(--mono);color:var(--ok);white-space:nowrap}
.r4-row{padding:14px 16px;border-radius:16px;background:var(--soft);display:flex;gap:12px;align-items:center;flex-wrap:wrap}
.r4-rt{flex:1 1 220px;min-width:0;display:flex;flex-direction:column;gap:2px} .r4-rt b{font-size:14.5px} .r4-rt span{font-size:12.5px;color:var(--mute)}
.r4-stack{display:flex;flex-direction:column;gap:12px;margin-top:12px}
.r4-more{font-size:14px} .r4-more>summary{cursor:pointer;color:var(--cobalt);font-weight:700;list-style:none;padding:2px 0} .r4-more>summary::-webkit-details-marker{display:none}
.r4-more[open]>summary{margin-bottom:12px}
.r4-links{display:flex;align-items:center;gap:12px;flex-wrap:wrap;font-size:12.5px;color:var(--faint)}
.r4-btns{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.r4-fine{font-size:12.5px;color:var(--faint)} .r4-fine a{color:var(--cobalt);font-weight:600}
.r4-ch{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:10px 12px;border-radius:16px;box-shadow:inset 0 0 0 1px var(--line)}
.r4-cn{display:flex;align-items:center;gap:8px;margin-right:auto;font-size:14px}
form.rn-form{display:contents}


/* channel-feed cards: the dashboard's upload cards and the catalogue page's one-card-per-channel layout */
.d3{display:flex;flex-direction:column;gap:22px}
.d3-cards{display:flex;flex-direction:column;gap:18px}
.d3-flat{padding-top:6px}
.d3-body{display:flex;flex-direction:column;gap:30px}
.d3-top{display:flex;align-items:center;gap:36px;flex-wrap:wrap}
.d3-prog{display:flex;flex-direction:column;gap:14px;flex:1 1 320px;min-width:0}
.d3-send{display:flex;flex-direction:column;gap:12px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.d3-dial{position:relative;width:176px;height:176px;flex:none}
.d3-dial svg{width:100%;height:100%;display:block}
.d3-dial line{stroke:#dde1ee;stroke-width:4;stroke-linecap:round} .d3-dial line.on{stroke:var(--cobalt)}
.d3-dial b{position:absolute;inset:0;display:grid;grid-auto-flow:column;place-content:center;align-items:baseline;font-size:46px;font-weight:800;letter-spacing:-.06em;font-variant-numeric:tabular-nums}
.d3-dial b small{font-size:.42em;letter-spacing:0;margin-left:2px;color:var(--mute)}
.d3-fix{display:flex;flex-direction:column;gap:12px}
.d3-big{display:block;font-size:26px;font-weight:800;letter-spacing:-.035em;line-height:1.2;color:var(--tx);text-wrap:balance} .d3-big b,.d3-big span{font:inherit;letter-spacing:inherit;color:inherit} .d3-big b{font-variant-numeric:tabular-nums}
.d3-dl{display:flex;flex-direction:column;gap:12px}
.d3-dl fieldset{border:0;padding:0;margin:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.d3-dl legend{grid-column:1/-1;float:left;width:100%;font:500 11px var(--mono);letter-spacing:.07em;text-transform:uppercase;color:var(--faint);padding:0;margin-bottom:8px}
.d3-opt{display:flex;gap:10px;align-items:flex-start;padding:11px 14px;border-radius:14px;box-shadow:inset 0 0 0 1px var(--line);cursor:pointer}
.d3-opt:has(input:checked){box-shadow:inset 0 0 0 2px var(--cobalt);background:var(--cobalt-t)}
.d3-opt input{margin-top:3px;accent-color:var(--cobalt)} .d3-opt b{display:block;font-size:14px} .d3-opt small{display:block;font-size:12.5px;color:var(--mute)}
.d3-go{display:flex;gap:10px;align-items:center;flex-wrap:wrap} .d3-go select{width:auto;padding:9px 12px}
.d3-add{display:grid;grid-template-columns:auto 1fr;gap:2px 12px;align-items:center;text-align:left;padding:16px 22px;border-radius:16px;box-shadow:inset 0 0 0 1.5px var(--line2);color:var(--tx);cursor:pointer;background:none;width:100%}
.d3-add:hover{background:var(--soft)} .d3-add .chmark{grid-row:span 2} .d3-add span{font-size:13px;color:var(--mute)}
form.rn-form{display:contents}
@media(max-width:700px){.d3-dl fieldset{grid-template-columns:minmax(0,1fr)}.d3-dial{width:140px;height:140px}.d3-dial b{font-size:36px}}

.card.d3-up{padding:0;overflow:hidden;margin-bottom:16px}
.d3-uh{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px 22px;border-bottom:1px solid var(--line)}
.d3-uh>div{display:flex;flex-direction:column;min-width:0} .d3-uh .nm{font-weight:800;font-size:17px;letter-spacing:-.02em;overflow:hidden;text-overflow:ellipsis;white-space:nowrap} .d3-uh .nm:hover{color:var(--cobalt)} .d3-uh span{font-size:13px;color:var(--mute)}
.d3-chans{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));margin:0 -1px -1px 0}
.d3-chan{display:flex;align-items:center;gap:16px;padding:20px 22px;border-right:1px solid var(--line);border-bottom:1px solid var(--line)}
.d3-ci{display:flex;flex-direction:column;gap:6px;min-width:0}
.d3-fn{display:flex;align-items:center;gap:8px;font-weight:700} .d3-fn:hover{color:var(--cobalt)}
.d3-fc{font-size:13px;color:var(--mute)} .d3-fc b{color:var(--tx);font-weight:800}
.d3-ca{display:flex;align-items:center;gap:12px;margin-top:2px;font-size:13px;font-weight:600}
.d3-dial.sm{width:84px;height:84px} .d3-dial.sm b{font-size:22px} .d3-dial.sm line{stroke-width:5}

/* channel picker on the catalogue page: a pill group, the open channel in cobalt */
.d3-pick{display:flex;flex-wrap:wrap;gap:4px;padding:4px;border-radius:999px;background:var(--soft);width:fit-content}
.d3-pick a,.d3-pick button{display:inline-flex;align-items:center;gap:7px;padding:7px 13px;border-radius:999px;color:var(--mute);font:600 13px var(--sans);background:none;border:0;cursor:pointer;white-space:nowrap;font-variant-numeric:tabular-nums}
.d3-pick a:hover,.d3-pick button:hover{color:var(--tx)} .d3-pick a.on{background:var(--cobalt);color:#fff}
.d3-pick b{font-weight:700;color:var(--tx)} .d3-pick a.on b{color:#fff}
.d3-pick a b{font-weight:700}
.d3-pick form{display:contents} .d3-pick .add{opacity:.8}

/* integrated hero card + what-we-fixed tiles */
.card.d3-hero{display:flex;align-items:center;gap:32px;flex-wrap:wrap;padding:26px 30px}
.d3-story{font-size:14.5px;color:var(--mute);line-height:1.5;margin-top:-4px}
.d3-pills{display:flex;flex-wrap:wrap;gap:8px}
.d3-pill{position:relative;display:inline-flex;align-items:baseline;gap:7px;padding:8px 14px 12px;border-radius:999px;background:var(--soft);font-size:13px;line-height:1.3;color:var(--mute);transition:box-shadow .15s var(--ease),color .15s}
.d3-pill:hover{box-shadow:inset 0 0 0 1px var(--cobalt);color:var(--tx)}
.d3-pill b{font-size:15px;font-weight:800;letter-spacing:-.02em;color:var(--cobalt);font-variant-numeric:tabular-nums}
@media(max-width:700px){.card.d3-hero{padding:20px}}

/* bulk fix panel: three quick ways, then a sheet */
.bf-done{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:12px 16px;border-radius:12px;background:var(--ok-t);color:var(--ok);font-weight:600;font-size:14px;margin-bottom:18px} .bf-done span{flex:1 1 auto} .bf-done form{display:contents}
.bf-modes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-bottom:34px}
.card.bf-mode{padding:18px 20px;display:flex;flex-direction:column;gap:10px;position:relative}
.bf-mode h3{font-size:16px} .bf-mode p{font-size:13.5px;color:var(--mute);line-height:1.5;flex:1} .bf-mode p b{color:var(--tx)}
.bf-n{position:absolute;top:16px;right:18px;font:600 12px var(--mono);color:var(--faint)}
.bf-one{display:flex;flex-direction:column;gap:8px}
.bf-file{display:flex;gap:8px;flex-wrap:wrap} .bf-file form{display:contents}
.bf-pick{position:relative;cursor:pointer} .bf-pick input{position:absolute;inset:0;opacity:0;cursor:pointer;width:100%}
.bf-sheet{display:flex;flex-direction:column;gap:12px}
.bf-tbl td{vertical-align:middle} .bf-cell{width:42%} .bf-cell .input{padding:8px 12px}
.input.bf-suggested{background:var(--cobalt-t);box-shadow:inset 0 0 0 1.5px var(--cobalt)}
.bf-bar{position:sticky;bottom:16px;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 18px;border-radius:999px;background:var(--tx);color:#fff;box-shadow:0 12px 30px -10px rgba(10,15,30,.5);font-size:14px;width:fit-content;margin:0 auto}
.bf-bar[hidden]{display:none} .bf-bar b{font-weight:800}
@media(max-width:900px){.bf-modes{grid-template-columns:minmax(0,1fr)}.bf-cell{width:auto}}
.bf-ai{display:flex;gap:8px;flex-wrap:wrap;padding-top:10px;border-top:1px solid var(--line)} .bf-ai form{display:contents}

/* Dashboard: stats, latest uploads, quick links */
.dash-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-bottom:28px}
.dash-chs{display:flex;flex-wrap:wrap;gap:6px}
.dash-ch{display:inline-flex;align-items:center;gap:6px;padding:4px 10px;border-radius:999px;box-shadow:inset 0 0 0 1px var(--line);font-size:13px;font-variant-numeric:tabular-nums}
.dash-ch:hover{background:var(--soft)} .dash-ch b{font-weight:700}
.dash-tiles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.dash-tile{display:grid;grid-template-columns:auto 1fr;gap:2px 12px;align-items:center;padding:16px 18px;border-radius:16px;box-shadow:inset 0 0 0 1px var(--line);color:var(--tx)}
.dash-tile:hover{background:var(--soft);box-shadow:inset 0 0 0 1.5px var(--cobalt)}
.dash-tile .ic{grid-row:span 2;color:var(--cobalt)} .dash-tile b{font-size:14.5px} .dash-tile span{font-size:13px;color:var(--mute)}
@media(max-width:900px){.dash-stats{grid-template-columns:repeat(2,minmax(0,1fr))}.dash-tiles{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:560px){.dash-tiles{grid-template-columns:minmax(0,1fr)}}

/* changes: overview rows + the full-width editor */
.ch-row{display:grid;grid-template-columns:32px minmax(0,1fr) auto auto;gap:6px 18px;align-items:center;padding:18px 20px;border-top:1px solid var(--line)}
.ch-row:first-child{border-top:0}
.ch-row .ld-t{font-size:16px}
.ch-acts{display:flex;gap:8px;align-items:center} .ch-acts form{margin:0}
.ch-n{text-align:right;min-width:90px} .ch-n b{display:block;font-size:18px;font-weight:800;letter-spacing:-.02em;color:var(--cobalt);font-variant-numeric:tabular-nums} .ch-n span{font-size:12px;color:var(--faint)}
.ph .ch-acts{align-self:flex-start}
.ch-tbl thead th{position:sticky;top:0;z-index:1}
.ch-tbl td{vertical-align:top}
.ch-tbl .c-prod{width:26%} .ch-tbl .c-was{width:30%} .ch-tbl .c-now{width:44%}
.ch-tbl .was{font:12px/1.5 var(--mono);color:var(--faint);overflow-wrap:anywhere}
.ch-tbl .was s{text-decoration-thickness:1px}
.ch-tbl .ttl{max-width:none;white-space:normal}
.ie-save{display:flex;align-items:center;gap:10px;margin:0} .ie-save .input{flex:1;min-width:0;font-size:13px;padding:8px 12px}
.ie-save .input:focus{box-shadow:0 0 0 2px var(--cobalt)}
.ie-status{font-size:12px;color:var(--faint);min-width:56px}
.ie-status.ok{color:var(--ok)}
.ie-check{display:flex;align-items:center;gap:6px;font-size:13px;color:var(--mute);white-space:nowrap}
@media(max-width:700px){.ch-row{grid-template-columns:32px minmax(0,1fr)}.ch-n,.ch-acts{grid-column:2;justify-self:start;text-align:left}.ch-tbl .c-was,.ch-tbl td.was{display:none}}
.r4-act{display:inline-flex;align-items:center;gap:6px;font-size:13px;font-weight:500;color:var(--mute);transition:color .15s} .r4-act:hover{color:var(--cobalt);text-decoration:underline}
.ch-bar{justify-content:space-between;align-items:center}
.ch-filters{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:0}
.ch-sw{margin:0}
.switch,.btn.ghost.switch{position:relative;gap:10px;cursor:pointer;user-select:none;color:var(--mute);box-shadow:inset 0 0 0 1.5px var(--line2)} .btn.ghost.switch:hover{background:var(--soft)}
.switch input{position:absolute;opacity:0;width:0;height:0}
.switch i{position:relative;width:28px;height:16px;border-radius:999px;background:var(--line2);transition:background .2s var(--ease);flex:none}
.switch i:after{content:"";position:absolute;top:2px;left:2px;width:12px;height:12px;border-radius:50%;background:#fff;box-shadow:0 1px 2px rgba(10,15,30,.3);transition:transform .2s var(--ease)}
.switch input:checked+i{background:var(--cobalt)} .switch input:checked+i:after{transform:translateX(12px)}
.switch input:focus-visible+i{box-shadow:0 0 0 2px #fff,0 0 0 4px var(--cobalt)}
.modal{border:0;border-radius:20px;padding:24px;width:min(520px,calc(100% - 32px));box-shadow:0 24px 64px -16px rgba(10,15,30,.4);margin:auto}
.modal::backdrop{background:rgba(10,15,30,.4)}
.modal-h{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:16px} .modal-h h2{font-size:19px;letter-spacing:-.02em}
.modal-opt{padding:16px;border-radius:16px;background:var(--soft);margin-top:10px} .modal-opt h3{font-size:15px} .modal-opt p{font-size:13px;color:var(--mute);margin:4px 0 12px}
.modal-row{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin:0} .modal-row form{margin:0} .modal-row .input{flex:1;min-width:160px}
.ch-count{font-size:13.5px;font-weight:600;color:var(--mute)}
.ch-tbl tr.is-done td{opacity:.55;transition:opacity .3s} .ch-tbl tr.is-done td.now{opacity:1}
.ie-save .ie-btn{flex:none}
.ch-acts .bf-ai,.ch-acts .bf-ai form{margin:0;display:contents}
.ie-btn{font:600 13px var(--sans);color:var(--cobalt);background:none;border:0;padding:0;cursor:pointer} .ie-btn:hover{text-decoration:underline}

.d3-head{font-size:14px;color:var(--mute);margin:-4px 0 2px} .d3-head b{color:var(--tx);font-weight:700}
.d3-pill .d3-bar{position:absolute;left:14px;right:14px;bottom:5px;height:3px;border-radius:3px;background:var(--line)}
.d3-pill .d3-bar:after{content:"";position:absolute;inset:0 auto 0 0;width:var(--p);border-radius:3px;background:var(--cobalt)}
.d3-pill.ai{background:var(--cobalt-t)} .d3-pill.ai span{color:var(--cobalt)} .d3-pill.ai svg{vertical-align:-1px}
.d3-eg{display:none;position:absolute;left:0;bottom:calc(100% + 8px);z-index:5;width:max-content;max-width:min(340px,80vw);padding:12px 14px;border-radius:14px;background:#fff;box-shadow:0 0 0 1px var(--line2),0 16px 32px -14px rgba(10,15,30,.3);font-style:normal;flex-direction:column;gap:4px;white-space:normal}
.d3-pill:hover .d3-eg,.d3-pill:focus-visible .d3-eg{display:flex}
.d3-eg small{font:500 10.5px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--faint)}
.d3-eg s{font:12px/1.45 var(--mono);color:var(--faint);overflow-wrap:anywhere;text-decoration-thickness:1px}
.d3-eg strong{font:500 12.5px/1.45 var(--mono);color:var(--tx);overflow-wrap:anywhere}
.d3-theme{display:flex;align-items:baseline;gap:8px;margin-top:6px;font:500 11px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--faint)} .d3-theme em{font-style:normal;color:var(--mute)}

/* what we optimised: a tile per kind of change, same tint as the Needs attention rows */
.d3-tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(168px,1fr));gap:8px}
.d3-tile{padding:14px 16px;border-radius:16px;background:var(--soft);display:flex;flex-direction:column;gap:4px;font-size:13px;line-height:1.4;color:var(--mute);transition:color .15s}
.d3-tile:hover{color:var(--tx)}
.d3-tile b{font-size:24px;font-weight:800;letter-spacing:-.04em;color:var(--tx);font-variant-numeric:tabular-nums;transition:color .15s} .d3-tile:hover b{color:var(--cobalt)}

.r4-hd{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}

.rd-chips{display:flex;gap:6px;flex-wrap:wrap;margin-top:10px}
.rd-chip{padding:5px 12px;border-radius:999px;background:var(--soft);font-size:12.5px;color:var(--mute)} .rd-chip b{color:var(--tx);font-variant-numeric:tabular-nums}
.d3-dl legend.sr{float:none;width:1px;height:1px;margin:0;grid-column:auto}

/* product page: channel edits */
.chcards{display:grid;gap:10px}
.chcard{border-radius:var(--r);background:#fff;box-shadow:0 0 0 1px var(--line);transition:box-shadow .15s}
.chcard:hover{box-shadow:0 0 0 1px var(--line2)}
.chcard[open]{box-shadow:0 0 0 1.5px var(--line2),0 12px 28px -18px rgba(10,15,30,.25)}
.chcard>summary{display:flex;align-items:center;gap:12px;padding:14px 18px;cursor:pointer;list-style:none;font-size:15px}
.chcard>summary::-webkit-details-marker{display:none}
.chcard>summary b{font-weight:700;letter-spacing:-.01em}
.chcard>summary .st{margin-left:auto}
.chcard>summary:after{content:"";width:7px;height:7px;border-right:1.5px solid var(--faint);border-bottom:1.5px solid var(--faint);transform:rotate(45deg) translateY(-2px);transition:transform .25s var(--ease);flex:none;margin-left:4px}
.chcard[open]>summary:after{transform:rotate(225deg)}
.chcard>.in{padding:4px 18px 18px;border-top:1px solid var(--line);padding-top:18px}
.chcard .chopt{margin-bottom:18px;background:var(--soft);box-shadow:none}
.chcard .chopt:has(input:checked){background:var(--bad-t);box-shadow:0 0 0 1.5px rgba(208,57,59,.5)}
.chcard .chopt:has(input:checked) .bx{background:var(--bad)}
.chfoot{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;margin-top:4px}
.chfoot .fine{margin:0}
.chcard.solo{margin-top:16px}
/* AI readability strip on the AI agents channel page */
.dstat.ar{margin-top:0;grid-template-columns:repeat(var(--n),minmax(0,1fr))}
@media(max-width:1000px){.dstat.ar{grid-template-columns:repeat(2,minmax(0,1fr))}.dstat.ar>div:nth-child(odd){border-left:0}.dstat.ar>div:nth-child(n+3){border-top:1px solid var(--line)}}
.r4-share{font:500 12.5px var(--mono);color:var(--faint);white-space:nowrap}
.r4-more{display:flex;flex-direction:column;gap:10px}
.d3-fix>.r4-row+.r4-row,.d3-fix>.disc{margin-top:0}
.d3-tile.static:hover{color:var(--mute)} .d3-tile.static:hover b{color:var(--tx)}
.r4-row .how{flex-basis:100%;margin:2px 0 0}
.r4-row .how>summary{cursor:pointer;list-style:none;display:inline-flex;align-items:center;gap:6px;font-size:13px;font-weight:600;color:var(--cobalt)}
.r4-row .how>summary::-webkit-details-marker{display:none}
.r4-row .how>summary:after{content:"";width:6px;height:6px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg) translateY(-2px);transition:transform .2s}
.r4-row .how[open]>summary:after{transform:rotate(225deg)}
.how-body{margin-top:10px;padding:14px 18px;border-radius:12px;background:#fff;box-shadow:0 0 0 1px var(--line);font-size:13.5px;line-height:1.55;color:var(--mute)}
.how-body p{margin:0 0 10px;color:var(--tx)}
.how-body ol{margin:0 0 12px;padding-left:20px;list-style:decimal} .how-body li{margin-bottom:4px}
.how-body .how-note{padding:10px 12px;border-radius:10px;background:var(--soft);color:var(--mute)} .how-body .how-note b{color:var(--tx)}
.how-body .how-src{margin:0;font-size:12.5px;color:var(--faint);display:flex;flex-wrap:wrap;align-items:center;gap:6px}
.linkbtn{background:none;border:0;padding:0;font:inherit;font-weight:600;cursor:pointer}
.how-modal p{margin:0 0 10px}
.how-modal ul{list-style:disc;margin:0;padding-left:20px} .how-modal li{margin-bottom:8px}

/* Legal pages, consent line, verification banner */
.legal{max-width:760px;margin:0 auto;padding:48px 20px 72px;line-height:1.65}
.legal h1{font-size:32px;margin:0 0 6px} .legal h2{font-size:19px;margin:30px 0 8px} .legal ul{padding-left:22px}
.legal .todo{background:#fff7e0;border:1px solid #f0d58a;border-radius:10px;padding:12px 16px;font-size:14px;margin:18px 0}
.legal .meta{color:var(--faint);font-size:14px}
.consent{display:flex;gap:8px;align-items:flex-start;font-size:13.5px;color:var(--mute)} .consent input{margin-top:3px}
.verify-banner{align-items:center;flex-wrap:wrap} .verify-banner form{margin-left:auto}
.legal-foot{margin-top:48px;padding-top:16px;border-top:1px solid var(--line);font-size:13px;color:var(--faint)} .legal-foot a:hover{color:var(--tx)}
/* ── onboarding: sample CTA, checklist, cost notice, empty states, helpers */
.inline-form{display:inline}
.alt-cta{display:flex;align-items:center;justify-content:center;gap:12px;flex-wrap:wrap;margin-top:18px;color:var(--mute);font-size:14px}
.free-tag{margin-left:auto;padding-left:10px;font:600 11px var(--mono);letter-spacing:.04em;text-transform:uppercase;color:var(--ok)}
.checklist{border-radius:var(--r);box-shadow:0 0 0 1px var(--line2);padding:20px 22px;margin-bottom:24px}
.cl-head{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:12px}
.cl-head h2{font-size:18px} .cl-head p{font-size:13.5px;margin-top:2px}
.cl-steps{display:grid;gap:2px;margin-top:14px}
.cl-steps li{display:flex;align-items:center;gap:14px;padding:10px 8px;border-radius:10px}
.cl-steps li.now{background:var(--cobalt-t)}
.cl-steps li div{flex:1;display:grid;min-width:0} .cl-steps li div span{font-size:13px;color:var(--mute)}
.cl-mark{width:22px;height:22px;border-radius:50%;flex:none;display:grid;place-items:center;box-shadow:inset 0 0 0 1.5px var(--line2);color:#fff}
.cl-steps li.done .cl-mark{background:var(--ok);box-shadow:none}
.cl-steps li.done b{color:var(--mute);font-weight:600}
.cost-note{display:flex;gap:12px;align-items:center;flex-wrap:wrap;justify-content:space-between;padding:12px 16px;border-radius:12px;background:var(--soft);font-size:14px;color:var(--mute);margin-top:24px}
.cost-note b{color:var(--tx)}
.cost-note.short{background:var(--warn-t);color:var(--tx)}
.cost-note.free b{color:var(--ok)}
.mini-empty{display:grid;justify-items:start;gap:10px;padding:20px 22px;border-radius:var(--r);background:var(--soft);color:var(--mute);font-size:14px}
.mini-empty b{color:var(--tx);font-size:15px}
.chk-row{display:flex;gap:12px;align-items:flex-start;cursor:pointer;font-size:14.5px}
.chk-row input{margin-top:4px;width:18px;height:18px;accent-color:var(--cobalt)}

/* ═══ mobile polish ═══ */
html{-webkit-text-size-adjust:100%}
.mnav{display:none;position:relative}
.mnav summary{list-style:none;cursor:pointer;width:44px;height:44px;border-radius:12px;display:grid;place-items:center;color:var(--tx)}
.mnav summary::-webkit-details-marker{display:none}
.mnav[open] summary{background:var(--soft)}
.mnav .mpanel{position:fixed;top:68px;left:0;right:0;display:grid;padding:8px 12px 16px;background:#fff;box-shadow:0 1px 0 var(--line),0 24px 40px -20px rgba(10,15,30,.25)}
.mnav .mpanel a{padding:14px 12px;font-size:16px;font-weight:600;border-radius:10px}
.mnav .mpanel a:active{background:var(--soft)}
@media(max-width:1000px){.mnav{display:block}.nav .rt{gap:10px}}
@media(max-width:900px){
  .app,.sb,.authwrap{min-height:100dvh}
  .sb{height:100dvh;padding-bottom:max(14px,env(safe-area-inset-bottom))}
  .top{padding-top:env(safe-area-inset-top);height:calc(56px + env(safe-area-inset-top))}
  .icon-btn{width:44px;height:44px}
  .ni{padding:12px 12px}
}
@media(max-width:720px){
  /* 16px inputs stop iOS Safari zooming the page on focus */
  .input,select.input,textarea.input{font-size:16px;padding:12px 14px}
  .btn.sm{padding:11px 18px}
  .page{padding-bottom:calc(80px + env(safe-area-inset-bottom))}
  .ph{margin-bottom:22px;gap:14px}
  .ph .acts,.ph .acts form{width:100%}
  .ph .acts .btn{flex:1 1 auto}
  .card{padding:18px}
  .row{padding:14px 16px}
  .kv{flex-wrap:wrap;gap:4px 16px}
  .authcard{padding:28px 20px;border-radius:22px}
  .authwrap{padding:88px 16px 40px;place-items:start center}
  .authcard .alt{flex-wrap:wrap}
  .tabs a,.tabs button{white-space:nowrap}
  .legal-foot{padding-bottom:16px}
  pre,code{overflow-wrap:anywhere}
  pre{overflow-x:auto}
}
@media(max-width:560px){.nav .rt .btn.sm{padding:9px 14px}}

@media(max-width:1000px){.nav .rt>.btn,.nav .login{display:none}.mnav .mpanel .btn{margin-top:8px;padding:14px 24px;color:#fff;font-size:16px}}

/* ── languages: switcher + Chinese typography (system CJK fonts; no web fonts needed) */
.langsw{display:inline-flex;align-items:center;gap:7px;font-size:13px;font-weight:500;color:var(--faint);white-space:nowrap}
.langsw a{color:var(--mute)} .langsw a:hover{color:var(--ink)} .langsw a[aria-current]{color:var(--ink);font-weight:700}
html:lang(zh-CN){--sans:"PingFang SC","Hiragino Sans GB","Microsoft YaHei","Noto Sans SC","Source Han Sans SC",system-ui,sans-serif}
html:lang(zh-CN) :is(h1,h2,h3,h4,b,strong){letter-spacing:0}
html:lang(zh-CN) body{line-break:strict}
.nav .rt>.langsw{display:none}
@media(min-width:1180px){.nav .rt>.langsw{display:inline-flex}}
.mpanel .langsw{padding:10px 0;font-size:14px}
.mpanel .langsw{padding:6px 12px}.mpanel .langsw a{padding:6px 4px;font-size:14px;font-weight:600}

/* New upload: one card per way of getting products in */
.up.wide{max-width:980px}
.up-methods{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;align-items:stretch}
.up-card{display:flex;flex-direction:column;gap:16px;padding:24px}
.up-card header{display:flex;gap:14px;align-items:flex-start}
.up-card header .ico{flex:none;width:44px;height:44px;border-radius:12px;display:grid;place-items:center;background:var(--cobalt-t);color:var(--cobalt)}
.up-card h2{font-size:18px;letter-spacing:-.02em}
.up-card header p{color:var(--mute);font-size:14px;margin-top:2px}
.up-card form{display:flex;flex-direction:column;gap:8px;flex:1}
.up-card .dz{flex:1;padding:44px 20px}
.up-card .fine{margin-top:0}
.url-form label{font:500 12px var(--mono);letter-spacing:.04em;text-transform:uppercase;color:var(--faint);margin-top:6px}
.url-form .btn{margin-top:auto;align-self:flex-start}
@media (max-width:760px){.up-methods{grid-template-columns:1fr}}

/* Scheduled refresh (catalogue page) */
.feed-source{margin-top:32px;padding-top:20px;border-top:1px solid var(--line);display:flex;flex-direction:column;gap:10px}
.feed-source h2{font-size:16px}
.feed-source form{display:flex;flex-wrap:wrap;gap:10px}
.feed-source .input{flex:1 1 280px;width:auto;min-width:0}
.feed-source select.input{flex:0 0 auto}
.feed-source .fine{margin:0}
