@layer foundation, reset, tokens, components.kit, components.app, tenant-overrides, utilities;
:root{color-scheme:light}body{margin:0}img{max-width:100%}[hidden]{display:none!important}
@font-face{font-family:"Assistant";font-weight:400;font-display:swap;src:url(/fonts/demo-1.woff2) format("woff2")}@font-face{font-family:"Assistant";font-weight:500;font-display:swap;src:url(/fonts/demo-2.woff2) format("woff2")}@font-face{font-family:"Assistant";font-weight:600;font-display:swap;src:url(/fonts/demo-3.woff2) format("woff2")}@font-face{font-family:"Assistant";font-weight:700;font-display:swap;src:url(/fonts/demo-4.woff2) format("woff2")}@font-face{font-family:"Assistant";font-weight:800;font-display:swap;src:url(/fonts/demo-5.woff2) format("woff2")}@font-face{font-family:"Assistant";font-weight:400;font-display:swap;src:url(/fonts/demo-6.woff2) format("woff2")}@font-face{font-family:"Assistant";font-weight:500;font-display:swap;src:url(/fonts/demo-7.woff2) format("woff2")}@font-face{font-family:"Assistant";font-weight:600;font-display:swap;src:url(/fonts/demo-8.woff2) format("woff2")}@font-face{font-family:"Assistant";font-weight:700;font-display:swap;src:url(/fonts/demo-9.woff2) format("woff2")}@font-face{font-family:"Assistant";font-weight:800;font-display:swap;src:url(/fonts/demo-10.woff2) format("woff2")}@font-face{font-family:"JetBrains Mono";font-weight:500;font-display:swap;src:url(/fonts/demo-11.woff2) format("woff2")}@font-face{font-family:"JetBrains Mono";font-weight:700;font-display:swap;src:url(/fonts/demo-12.woff2) format("woff2")}@font-face{font-family:"Barlow Condensed";font-weight:600;font-display:swap;src:url(/fonts/demo-13.woff2) format("woff2")}@font-face{font-family:"Barlow Condensed";font-weight:700;font-display:swap;src:url(/fonts/demo-14.woff2) format("woff2")}@font-face{font-family:"Barlow Condensed";font-weight:800;font-display:swap;src:url(/fonts/demo-15.woff2) format("woff2")}
@layer components.app{.apps-row{display:grid;grid-template-columns:repeat(auto-fill,minmax(112px,1fr));gap:var(--sp-2);padding:var(--sp-4) var(--sp-5) var(--sp-5)}
.app-t{display:grid;justify-items:center;gap:8px;padding:var(--sp-3) var(--sp-2);border-radius:var(--r-md);text-decoration:none;font-size:.8125rem;font-weight:var(--fw-semibold);text-align:center;min-block-size:88px;transition:background var(--dur-fast) var(--ease)}
.app-t:hover{background:var(--c-state-hover)}.kp2{display:grid;gap:6px;padding:var(--sp-5)}.kp2 .kp-l{font-size:.875rem;font-weight:var(--fw-semibold);color:var(--c-text-secondary)}
.kp2 .kp-r{display:flex;align-items:flex-end;justify-content:space-between;gap:var(--sp-3)}.kp2 .kp-r b{font-size:2rem;font-weight:var(--fw-extrabold);letter-spacing:-.02em;line-height:1}
.kp2 svg{inline-size:min(45%,120px);block-size:36px;flex:none}.kp2 svg{--k:var(--c-success)}.kp2 svg.hot{--k:var(--c-primary)}.kp2 path{fill:none;stroke:var(--k);stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke}.kp2 path.ar{stroke:none;fill:color-mix(in oklch,var(--k) 12%,transparent)}
.kp-d{font-size:.8125rem;font-weight:var(--fw-bold)}.kp-d span{font-weight:var(--fw-regular,400);color:var(--c-text-secondary)}.kp-d.good{color:var(--c-success-ink)}.kp-d.bad{color:var(--c-error-ink)}
.app-t .ic{inline-size:28px;block-size:28px;padding:10px;box-sizing:content-box;border-radius:14px;background:color-mix(in oklch,var(--c-primary) 10%,transparent);color:var(--c-primary-ink)}}
@layer components.app{
.tn-row .tn-av{inline-size:40px;block-size:40px}
.wiz{display:grid;grid-template-columns:240px minmax(0,1fr);gap:var(--sp-6)}
.wz-steps{display:grid;gap:4px;align-content:start;position:sticky;inset-block-start:0}
.wz-s{display:flex;gap:var(--sp-3);align-items:center;padding:var(--sp-3);border-radius:var(--r-md);color:var(--c-text-disabled);font-weight:var(--fw-semibold);border:0;background:none;text-align:start;min-block-size:48px}
.wz-s b{display:grid;place-items:center;inline-size:28px;block-size:28px;border-radius:50%;background:var(--c-surface-neutral);font-size:.8125rem;flex:none}
.wz-s.on{color:var(--c-text);background:var(--c-surface)}.wz-s.on b{background:var(--c-primary);color:var(--c-primary-contrast,white)}
.wz-s.done{color:var(--c-text-secondary)}.wz-s.done b{background:var(--c-success);color:white}
.wz-p{padding:var(--sp-6);display:grid;gap:var(--sp-5)}
.opt{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,180px),1fr));gap:var(--sp-3)}
.opt button{display:grid;gap:6px;justify-items:start;text-align:start;border:1px solid var(--c-border);background:var(--c-surface);border-radius:var(--r-lg);padding:var(--sp-4);min-block-size:96px;transition:border-color var(--dur-fast) var(--ease),box-shadow var(--dur-fast) var(--ease)}
.opt button .ic{inline-size:26px;block-size:26px;color:var(--c-primary-ink)}
.opt button b{font-size:1rem}.opt button small{color:var(--c-text-secondary);font-size:.8125rem;line-height:1.4}
.opt button[aria-pressed=true]{border-color:var(--c-text);box-shadow:0 0 0 1px var(--c-text)}
.fld{display:grid;gap:6px}.fld label{font-weight:var(--fw-semibold);font-size:.875rem}
.fld input{border:1px solid var(--c-border-input,var(--c-border));border-radius:var(--r-sm);padding:12px 14px;font:inherit;background:transparent;color:var(--c-text);min-block-size:48px}
.drop{border:2px dashed var(--c-border-strong);border-radius:var(--r-lg);padding:var(--sp-6);display:grid;place-items:center;gap:8px;text-align:center;cursor:pointer;color:var(--c-text-secondary)}
.drop img{max-block-size:72px;max-inline-size:200px;object-fit:contain}
.pals{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--sp-3)}
.pal{border:1px solid var(--c-border);border-radius:var(--r-lg);padding:var(--sp-3);background:none;display:grid;gap:8px;text-align:start}
.pal[aria-pressed=true]{border-color:var(--c-text);box-shadow:0 0 0 1px var(--c-text)}
.pal .sw{display:flex;block-size:40px;border-radius:var(--r-sm);overflow:hidden}.pal .sw i{flex:1}
.phone{inline-size:240px;aspect-ratio:9/19;border-radius:34px;background:var(--c-grey-900);padding:10px;margin-inline:auto;box-shadow:var(--shadow-z16)}
.phone .scr{block-size:100%;border-radius:26px;overflow:hidden;background:white;color:oklch(19.5% 0.011 274);display:flex;flex-direction:column}
.phone .bar0{block-size:54px;display:flex;align-items:center;gap:8px;padding-inline:14px;color:white;font-weight:800}
.phone .hero{margin:12px;border-radius:14px;block-size:120px;display:grid;align-content:end;padding:10px;color:white;font-weight:800;font-size:.9rem}
.phone .ln{block-size:9px;border-radius:5px;background:oklch(92.8% 0.006 265);margin:6px 14px}.phone .ln.s{inline-size:55%}
.chk{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,220px),1fr));gap:var(--sp-2)}
.chk label{display:flex;gap:var(--sp-3);align-items:center;border:1px solid var(--c-border);border-radius:var(--r-md);padding:var(--sp-3);min-block-size:52px;cursor:pointer}
.chk input{inline-size:20px;block-size:20px;accent-color:var(--c-primary)}
.wz-f{display:flex;gap:var(--sp-2);justify-content:space-between}
.ep{display:grid;grid-template-columns:72px minmax(0,1fr) auto;gap:var(--sp-3);align-items:center;padding-block:10px;border-block-end:1px dashed var(--c-border);font-size:.875rem}
.ep b{font:var(--fw-bold) .75rem/1 var(--font-mono);padding:5px 8px;border-radius:6px;text-align:center}
.ep .GET{background:color-mix(in oklch,var(--c-success) 16%,transparent);color:var(--c-success-ink)}
.ep .POST,.ep .PATCH{background:color-mix(in oklch,var(--c-info) 16%,transparent);color:var(--c-info-ink)}
.ep .DELETE{background:color-mix(in oklch,var(--c-error) 16%,transparent);color:var(--c-error-ink)}
.roles td,.roles th{text-align:center}.roles td:first-child,.roles th:first-child{text-align:start}
@container main (max-width:899px){.wiz{grid-template-columns:minmax(0,1fr)}.wz-steps{position:static;grid-auto-flow:column;overflow-x:auto}.wz-s span{display:none}}
@container main (max-width:599px){.pals{grid-template-columns:minmax(0,1fr)}}
}
@layer components.app{
.nr{display:grid;gap:var(--sp-4);grid-template-columns:minmax(0,1fr)}
.nr>*,.nr .m-card{min-inline-size:0}
.nr .m-btn-sm,.nr .m-btn-md{min-block-size:44px}
.nr .pill{min-block-size:44px;padding-inline:14px;cursor:pointer}
.nr input[type=text],.nr input[type=search],.nr input[type=url],.nr select,.nr textarea{font:inherit;color:var(--c-text);background:var(--c-surface);border:1px solid var(--c-border-input,var(--c-border));border-radius:var(--r-sm);padding:10px 12px;min-block-size:44px;inline-size:100%;transition:border-color var(--dur-fast) var(--ease),box-shadow var(--dur-fast) var(--ease)}
.nr :is(input,select,textarea):focus{outline:0;border-color:var(--c-text);box-shadow:0 0 0 1px var(--c-text)}
.nr textarea{resize:vertical;line-height:1.6}
.nr .ib{display:inline-grid;place-items:center;inline-size:44px;block-size:44px;border-radius:50%;border:0;background:transparent;color:var(--c-text-secondary);flex:none}
.nr .ib:hover{background:var(--c-state-hover);color:var(--c-text)}
.nr .ib .ic{inline-size:20px;block-size:20px}
.nr .live{display:inline-flex;align-items:center;gap:6px;font-size:.75rem;font-weight:var(--fw-bold);color:var(--c-success-ink)}
.nr .live::before{content:"";inline-size:8px;block-size:8px;border-radius:50%;background:var(--c-success);box-shadow:0 0 0 0 color-mix(in oklch,var(--c-success) 50%,transparent);animation:nrpulse 1.8s var(--ease) infinite}
@keyframes nrpulse{70%{box-shadow:0 0 0 8px color-mix(in oklch,var(--c-success) 0%,transparent)}100%{box-shadow:0 0 0 0 color-mix(in oklch,var(--c-success) 0%,transparent)}}
@keyframes nrin{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@keyframes nrflash{0%{background:color-mix(in oklch,var(--c-primary) 14%,transparent)}100%{background:transparent}}
.nr .sec-h{display:flex;align-items:center;gap:var(--sp-2);flex-wrap:wrap}
.nr .sec-h h6{flex:1;min-inline-size:0}
.nr .card-p{padding:var(--sp-5)}
.nr .kv{display:grid;grid-template-columns:auto minmax(0,1fr);gap:6px var(--sp-4);font-size:.875rem}
.nr .kv dt{color:var(--c-text-secondary)}.nr .kv dd{margin:0;font-weight:var(--fw-semibold)}
.nr .src{display:inline-grid;place-items:center;min-inline-size:24px;block-size:22px;padding-inline:5px;border-radius:6px;font:var(--fw-bold) .6875rem/1 var(--font-mono);background:var(--c-text);color:var(--c-surface)}
.nr .src.g{background:color-mix(in oklch,var(--c-info) 18%,transparent);color:var(--c-info-ink)}
.nr .seg{display:inline-flex;padding:3px;border-radius:var(--r-md);background:var(--c-surface-neutral);gap:2px}
.nr .seg button{border:0;background:none;border-radius:calc(var(--r-md) - 3px);min-block-size:38px;padding-inline:14px;font-weight:var(--fw-semibold);font-size:.875rem;color:var(--c-text-secondary);position:relative}
.nr .seg button::before{content:"";position:absolute;inset-block:-3px;inset-inline:0}
.nr .seg button[aria-pressed=true]{background:var(--c-surface);color:var(--c-text);box-shadow:var(--shadow-z1)}
.nr .ring{--v:0;--rc:var(--c-success);position:relative;inline-size:64px;block-size:64px;flex:none}
.nr .ring svg{inline-size:100%;block-size:100%;transform:rotate(-90deg)}
.nr .ring circle{fill:none;stroke-width:6}
.nr .ring .bg{stroke:var(--c-surface-neutral)}
.nr .ring .fg{stroke:var(--rc);stroke-linecap:round;stroke-dasharray:100 100;stroke-dashoffset:calc(100 - var(--v));transition:stroke-dashoffset var(--dur-slower) var(--ease)}
.nr .ring b{position:absolute;inset:0;display:grid;place-items:center;font-size:1.125rem;font-weight:var(--fw-extrabold);font-variant-numeric:tabular-nums}
.nr .hbar{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px var(--sp-2);align-items:center;font-size:.8125rem}
.nr .hbar .bar{grid-column:1/-1}
.nr .fade-in{animation:nrin var(--dur-slower) var(--ease) both}
.nr .muted{color:var(--c-text-secondary)}
.nr .dim{color:var(--c-text-disabled)}
.nr .num{font-variant-numeric:tabular-nums}
.nr .chip{display:inline-flex;align-items:center;gap:6px;block-size:28px;padding-inline:10px;border-radius:var(--r-pill);background:var(--c-surface-neutral);font-size:.75rem;font-weight:var(--fw-semibold);white-space:nowrap}
.nr .dot{inline-size:8px;block-size:8px;border-radius:50%;background:var(--c-text-disabled);flex:none}
.nr .dot.ok{background:var(--c-success)}.nr .dot.warn{background:var(--c-warning)}.nr .dot.err{background:var(--c-error)}.nr .dot.info{background:var(--c-info)}
.nr-layer{display:contents}
.nr .scrim-d{position:fixed;inset:0;background:var(--c-overlay);z-index:1250;display:none}
.nr .scrim-d.on{display:block;animation:nrfade var(--dur-normal) var(--ease)}
.nr .drw{position:fixed;inset-block:0;inset-inline-end:0;inline-size:min(440px,100vw);background:var(--c-surface);box-shadow:var(--shadow-dialog);z-index:1260;display:none;flex-direction:column;padding-block-start:env(safe-area-inset-top,0px)}
.nr .drw.on{display:flex;animation:nrslide var(--dur-slower) var(--ease)}
.nr .drw-h{display:flex;align-items:center;gap:var(--sp-2);padding:var(--sp-3) var(--sp-4);border-block-end:1px solid var(--c-border)}
.nr .drw-h b{flex:1;font-size:1.0625rem;min-inline-size:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.nr .drw-b{flex:1;overflow:auto;padding:var(--sp-4);display:grid;grid-template-columns:minmax(0,1fr);gap:var(--sp-4);align-content:start}
.nr .drw-b .list{grid-template-columns:minmax(0,1fr)}
.nr .drw-f{display:flex;gap:var(--sp-2);padding:var(--sp-3) var(--sp-4) max(var(--sp-3),env(safe-area-inset-bottom,0px));border-block-start:1px solid var(--c-border)}
.nr .drw-f .m-btn{flex:1}
@keyframes nrfade{from{opacity:0}}
@keyframes nrslide{from{opacity:0;transform:translateX(calc(24px * var(--dir,1)))}}
[dir=rtl] .nr .drw{--dir:-1}
.nr .tw{overflow-x:auto;scrollbar-width:thin}
.nr .tw .m-table td,.nr .tw .m-table th{padding:12px 16px}
.nr .lbl{font-size:.875rem;font-weight:var(--fw-semibold);color:var(--c-text-secondary);margin-block-end:var(--sp-1)}
.nr .m-label-soft-default{color:var(--c-text)}
.nr :is(.m-btn-contained-primary,.m-btn-contained-inherit,.m-label-filled-primary),.nr .fl-n,.nr .fl-steps button.on span,.nr .pr-st .on span,.nr .sd-av{color:oklch(from var(--c-primary) clamp(0,calc((.62 - l) * 1000),1) 0 0)}
.nr .kpi b{letter-spacing:-.02em}
.nr .kpi b small{font-size:.5em;font-weight:var(--fw-bold);color:var(--c-text-secondary);letter-spacing:0}
.nr .nr-empty{display:grid;justify-items:center;gap:var(--sp-2);padding:var(--sp-8) var(--sp-4);text-align:center;color:var(--c-text-secondary);font-size:.9375rem}
.nr .nr-empty .ic{inline-size:28px;block-size:28px;color:var(--c-text-disabled)}
@container main (max-width:599px){.nr .card-p{padding:var(--sp-4)}}
}
@layer components.app{
.mn-l{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:var(--sp-4);align-items:start}
.mn-f{padding:var(--sp-4) var(--sp-5) 0;gap:var(--sp-2)}
.mn-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,200px),1fr));gap:var(--sp-3);padding:var(--sp-4) var(--sp-5) var(--sp-5)}
.mn-t{display:grid;gap:var(--sp-2);text-align:start;border:1px solid var(--c-border);background:var(--c-surface);border-radius:var(--r-lg);padding:var(--sp-2);min-inline-size:0;transition:border-color var(--dur-fast) var(--ease),box-shadow var(--dur-fast) var(--ease),transform var(--dur-fast) var(--ease)}
.mn-t:hover{border-color:var(--c-text);box-shadow:var(--shadow-z8)}
.mn-t:active{transform:scale(.98)}
.mn-img{position:relative;aspect-ratio:16/9;border-radius:var(--r-md);overflow:hidden;background:var(--c-tape)}
.mn-img img{inline-size:100%;block-size:100%;object-fit:cover;display:block}
.mn-st{position:absolute;inset-block-start:8px;inset-inline-start:8px;font-style:normal}
.thumb .mn-st{position:absolute}
.mn-vw{position:absolute;inset-block-end:8px;inset-inline-end:8px;font-style:normal;font-size:.6875rem;font-weight:var(--fw-bold);color:var(--c-on-media);background:color-mix(in oklch,var(--c-scrim-media) 70%,transparent);border-radius:6px;padding:3px 6px}
.mn-spark{display:flex;align-items:flex-end;gap:3px;aspect-ratio:16/9;border-radius:var(--r-md);background:var(--c-surface-neutral);padding:var(--sp-3)}
.mn-spark i{flex:1;block-size:calc(var(--h,10)*1%);min-block-size:3px;border-radius:2px;background:color-mix(in oklch,var(--c-primary) 70%,transparent);transition:block-size var(--dur-slower) var(--ease)}
.mn-social .mn-spark i{background:color-mix(in oklch,var(--c-info) 70%,transparent)}
.mn-tx{display:grid;padding-inline:var(--sp-1);min-inline-size:0}
.mn-tx b{font-size:.9375rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mn-tx small{font-size:.75rem;color:var(--c-text-secondary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mn-m{display:flex;align-items:center;gap:6px;padding:0 var(--sp-1) var(--sp-1);font-size:.75rem}
.mn-m .mono{margin-inline-start:auto;font-weight:var(--fw-bold)}
.mn-m small{color:var(--c-text-secondary)}
.mn-fc{font-weight:var(--fw-regular)}
.mn-tx{gap:2px}
.mn-rail{position:sticky;inset-block-start:0}
.mn-al{display:grid;padding:var(--sp-2) var(--sp-5) 0;max-block-size:620px;overflow:auto}
.mn-a{display:grid;gap:var(--sp-2);padding:var(--sp-4) var(--sp-1);border-block-end:1px dashed var(--c-border)}
.mn-a:last-child{border-block-end:0}
.mn-a.new{animation:nrin var(--dur-slower) var(--ease),nrflash 2.4s var(--ease);border-radius:var(--r-sm)}
.mn-a-k{display:flex;align-items:center;justify-content:space-between}
.mn-a-k time{font-size:.75rem;color:var(--c-text-secondary);font-variant-numeric:tabular-nums}
.mn-a b{font-size:.9375rem;line-height:1.4}
.mn-a small{font-size:.8125rem}
.mn-a .row{gap:var(--sp-1)}
.mn-rule{padding:var(--sp-3) var(--sp-5) var(--sp-4)}
@container main (max-width:1099px){.mn-l{grid-template-columns:minmax(0,1fr)}.mn-rail{position:static}.mn-al{max-block-size:none}}
@container main (max-width:599px){.mn-grid{grid-template-columns:repeat(2,minmax(0,1fr));padding-inline:var(--sp-3);gap:var(--sp-2)}.mn-f{padding-inline:var(--sp-3);flex-wrap:nowrap;overflow-x:auto}.mn-m small{display:none}.mn .g-4{grid-template-columns:repeat(2,minmax(0,1fr))}}
}
@layer components.app{
.fl-w{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:var(--sp-4);align-items:stretch;block-size:clamp(560px,calc(100dvh - 290px),780px)}
.fl-chat,.fl-stage{display:flex;flex-direction:column;min-block-size:0;overflow:hidden}
.fl-ch,.fl-sh{display:flex;align-items:center;gap:var(--sp-3);padding:var(--sp-4) var(--sp-5);border-block-end:1px solid var(--c-border)}
.fl-ch>div,.fl-sh>div{flex:1;display:grid;min-inline-size:0}
.fl-ch small,.fl-sh small{font-size:.8125rem;color:var(--c-text-secondary)}
.fl-mk{inline-size:44px;block-size:40px;flex:none}
.fl-log{flex:1;overflow:auto;padding:var(--sp-4);display:flex;flex-direction:column;gap:var(--sp-3);background:var(--c-surface-page);min-block-size:0;scroll-behavior:smooth}
.fl-m{animation:nrin var(--dur-slower) var(--ease) both;display:grid;gap:var(--sp-2)}
.fl-in{border:1px solid var(--c-border-strong,var(--c-border));border-radius:var(--r-lg);background:var(--c-surface);padding:var(--sp-3) var(--sp-4);display:grid;gap:var(--sp-2);box-shadow:var(--shadow-z8)}
.fl-in p{font-size:.9375rem;line-height:1.6}
.fl-in small{color:var(--c-text-secondary);font-size:.8125rem}
.fl-tags .chip{animation:nrin var(--dur-slower) var(--ease) both}
.fl-b{background:var(--c-surface);border-radius:var(--r-lg);padding:10px 14px;font-size:.9375rem;line-height:1.55;max-inline-size:92%;box-shadow:var(--shadow-z1)}
.fl-b.ok{background:color-mix(in oklch,var(--c-success) 14%,transparent)}
.fl-th{border-inline-start:2px solid var(--c-border-strong,var(--c-border));padding:4px var(--sp-3);display:grid;gap:2px}
.fl-th small{font-size:.8125rem;font-weight:var(--fw-semibold);color:var(--c-text-secondary)}
.fl-th p{font-size:.875rem;color:var(--c-text-secondary);line-height:1.55}
.fl-tool{display:inline-flex;align-items:center;gap:8px;align-self:start;background:var(--c-surface);border:1px solid var(--c-border);border-radius:var(--r-pill);padding:6px 12px;font-size:.8125rem;font-weight:var(--fw-semibold)}
.fl-res{display:grid;gap:6px}
.fl-res>div{display:grid;gap:2px;background:var(--c-surface);border-radius:var(--r-md);padding:var(--sp-2) var(--sp-3);border:1px solid var(--c-border)}
.fl-res b{font-size:.875rem}.fl-res small{font-size:.75rem;color:var(--c-success-ink)}
.fl-typing{display:flex;gap:4px;padding:10px 14px;background:var(--c-surface);border-radius:var(--r-lg);align-self:flex-start}
.fl-typing i{inline-size:6px;block-size:6px;border-radius:50%;background:var(--c-text-disabled);animation:gmdot 1s var(--ease) infinite}
.fl-typing i:nth-child(2){animation-delay:.15s}.fl-typing i:nth-child(3){animation-delay:.3s}
.fl-n{display:grid;place-items:center;inline-size:36px;block-size:36px;border-radius:50%;background:var(--c-primary);color:var(--c-primary-contrast,var(--c-white));font-weight:var(--fw-bold);flex:none}
.fl-sh b{font-size:1.0625rem}
.fl-ps{flex:1;position:relative;padding:var(--sp-5);overflow:auto;min-block-size:0;display:grid;align-content:start;gap:var(--sp-4)}
.fl-p[data-pane="3"]{order:-1}
.fl-big .m-label{justify-self:start}
.fl-p{display:none;gap:var(--sp-4);align-content:start}
.fl-p.on{display:grid;animation:nrin var(--dur-slower) var(--ease)}
.fl-p[data-pane="2"].on+.fl-p[data-pane="3"].on{margin-block-start:var(--sp-2)}
.fl-big{display:grid;gap:var(--sp-2);border:1px solid var(--c-border);border-radius:var(--r-lg);padding:var(--sp-5)}
.fl-big p{font-size:1.125rem;line-height:1.6;font-weight:var(--fw-medium)}
.fl-big small{color:var(--c-text-secondary)}
.fl-cls{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--sp-3)}
.fl-c,.fl-q>div,.fl-trr,.fl-net,.fl-peak,.fl-res[data-prec],[data-fc]{opacity:0;transform:translateY(6px);transition:opacity var(--dur-slower) var(--ease),transform var(--dur-slower) var(--ease),border-color var(--dur-slow) var(--ease),background var(--dur-slow) var(--ease)}
:is(.fl-c,.fl-q>div,.fl-trr,.fl-net,.fl-peak,.fl-res[data-prec],[data-fc]).in{opacity:1;transform:none}
.fl-c{display:grid;gap:2px;background:var(--c-surface-neutral);border-radius:var(--r-md);padding:var(--sp-3)}
.fl-c small{font-size:.75rem;color:var(--c-text-secondary)}.fl-c b{font-size:.9375rem}
.fl-q{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--sp-2)}
.fl-q>div{display:flex;align-items:center;gap:8px;border:1px solid var(--c-border);border-radius:var(--r-md);padding:var(--sp-3);font-weight:var(--fw-semibold);font-size:.875rem}
.fl-q>div.in .dot{background:var(--c-success)}
.fl-art{display:grid;gap:var(--sp-3)}
.fl-art-h{display:flex;align-items:center;justify-content:space-between}
.fl-art p{font-size:.9375rem;line-height:1.7;min-block-size:1em}
.fl-art p:empty{display:none}
.fl-fig{margin:0;display:grid;gap:4px}.fl-fig img{inline-size:100%;aspect-ratio:21/9;object-fit:cover;border-radius:var(--r-md);display:block}
.fl-fig figcaption{font-size:.75rem;color:var(--c-text-secondary)}
.fl-ed{display:flex;align-items:center;gap:var(--sp-3);padding:var(--sp-3);border-radius:var(--r-md);background:var(--c-surface-neutral)}
.fl-ed>div{display:grid}
.fl-acts{justify-content:flex-end;gap:var(--sp-2)}
.fl-why{background:color-mix(in oklch,var(--c-warning) 12%,transparent);border-radius:var(--r-md);padding:var(--sp-3)}
.fl-mini{display:none}
.fl-stamp{display:flex;align-items:center;gap:var(--sp-2);color:var(--c-success-ink);background:color-mix(in oklch,var(--c-success) 12%,transparent);border-radius:var(--r-md);padding:var(--sp-3) var(--sp-4);animation:nrin var(--dur-slower) var(--ease)}
.fl-stamp small{margin-inline-start:auto;color:var(--c-text-secondary)}
.fl-glow{animation:flglow 1.4s var(--ease) infinite}
@keyframes flglow{50%{box-shadow:0 0 0 6px color-mix(in oklch,var(--c-primary) 22%,transparent)}}
.fl-tr{display:grid;gap:var(--sp-2)}
.fl-trr{display:grid;grid-template-columns:20px minmax(0,1fr) auto auto;gap:4px var(--sp-3);align-items:center;padding-block:var(--sp-2);border-block-end:1px dashed var(--c-border)}
.fl-trr .bar{grid-column:2/-1}
.fl-trr .up{color:var(--c-success-ink);font-weight:var(--fw-bold)}
.fl-peak{display:grid;gap:2px;background:var(--c-surface-neutral);border-radius:var(--r-md);padding:var(--sp-3) var(--sp-4)}
.fl-peak small{color:var(--c-text-secondary)}
.fl-nets{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--sp-3)}
.fl-net{border:1px solid var(--c-border);border-radius:var(--r-lg);padding:var(--sp-3);display:grid;gap:var(--sp-2);align-content:start}
.fl-net.sent{border-color:var(--c-success);background:color-mix(in oklch,var(--c-success) 6%,transparent)}
.fl-net-h{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.fl-net-h small{color:var(--c-text-secondary);font-size:.75rem}
.fl-sent{margin-inline-start:auto;display:inline-flex;align-items:center;gap:4px;color:var(--c-success-ink);font-size:.75rem;font-weight:var(--fw-bold)}
.fl-sent .ic{inline-size:14px;block-size:14px}
.fl-net p{font-size:.8125rem;line-height:1.5}
.fl-nm{display:grid;gap:var(--sp-3)}
.fl-kp{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--sp-3)}
.fl-tl{display:flex;align-items:center;gap:var(--sp-4);padding:var(--sp-3) var(--sp-5)}
.fl-pp{background:var(--c-text);color:var(--c-surface)}.fl-pp:hover{background:var(--c-text);color:var(--c-surface)}
.fl-time{font-size:.8125rem;color:var(--c-text-secondary);flex:none;inline-size:88px;font-variant-numeric:tabular-nums}
.fl-track{flex:1;display:grid;gap:4px;min-inline-size:0}
.fl-track input{inline-size:100%;accent-color:var(--c-primary);min-block-size:28px;margin:0}
.fl-steps{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:4px}
.fl-steps button{border:0;background:none;display:grid;justify-items:center;gap:4px;min-block-size:48px;padding:2px;border-radius:var(--r-sm);color:var(--c-text-secondary);min-inline-size:0}
.fl-steps button span{display:grid;place-items:center;inline-size:24px;block-size:24px;border-radius:50%;background:var(--c-surface-neutral);font-size:.75rem;font-weight:var(--fw-bold);font-variant-numeric:tabular-nums}
.fl-steps button small{font-size:.75rem;font-weight:var(--fw-semibold);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-inline-size:100%}
.fl-steps button.done{color:var(--c-text-secondary)}.fl-steps button.done span{background:var(--c-success);color:var(--c-white)}
.fl-steps button.on{color:var(--c-text)}.fl-steps button.on span{background:var(--c-primary);color:var(--c-primary-contrast,var(--c-white))}
[dir=ltr] .fl-track input{direction:ltr}
@container main (max-width:1099px){.fl-nets{grid-template-columns:repeat(2,minmax(0,1fr))}}
@container main (max-width:899px){.fl-w{grid-template-columns:minmax(0,1fr);block-size:auto}.fl-log{block-size:300px;flex:none}.fl-ps{overflow:visible}.fl-steps small{display:none}}
@container main (max-width:599px){.fl-cls{grid-template-columns:minmax(0,1fr)}.fl-q{grid-template-columns:minmax(0,1fr)}.fl-nets{grid-template-columns:minmax(0,1fr)}.fl-ps{padding:var(--sp-4)}.fl-time{display:none}.fl-tl{gap:var(--sp-2);padding:var(--sp-2) var(--sp-3)}.fl-kp{grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--sp-2)}.fl-kp .kpi{padding:var(--sp-3)}.fl-kp .kpi b{font-size:1.25rem}.fl-kp .kpi span{font-size:.75rem}.fl-acts .m-btn-lg{flex:1}.fl-steps{gap:0}}
}
@layer components.app{
.st-top{justify-content:space-between}
.st-search{flex:1;max-inline-size:420px;min-inline-size:200px}
.st-tabs{padding-inline:var(--sp-4)}
.st-tb tbody tr{cursor:pointer}
.st-tc{max-inline-size:460px;white-space:normal}
.st-tb td.st-tc{white-space:normal;min-inline-size:260px}
.st-tc b{display:block;font-weight:var(--fw-semibold);line-height:1.4}
.st-tc small{color:var(--c-text-secondary);font-size:.8125rem}
.st-up{color:var(--c-text-secondary);font-variant-numeric:tabular-nums}
.st-tb td{block-size:60px}
.st-sc{display:inline-grid;place-items:center;inline-size:36px;block-size:26px;border-radius:6px;font-weight:var(--fw-bold);font-size:.8125rem;font-variant-numeric:tabular-nums}
.st-sc.ok{background:color-mix(in oklch,var(--c-success) 16%,transparent);color:var(--c-success-ink)}
.st-sc.warn{background:color-mix(in oklch,var(--c-warning) 16%,transparent);color:var(--c-warning-ink)}
.st-sc.err{background:color-mix(in oklch,var(--c-error) 16%,transparent);color:var(--c-error-ink)}
.st-bar{display:flex;align-items:center;gap:var(--sp-3);padding:var(--sp-3) var(--sp-4);flex-wrap:wrap}
.st-bt{flex:1;display:flex;align-items:baseline;gap:6px;min-inline-size:0}
.st-bt b{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-inline-size:0}
.st-sv{font-size:.75rem;margin-inline-end:var(--sp-2)}
.st-w{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:var(--sp-4);align-items:start}
.st-form{padding:var(--sp-5);display:grid;gap:var(--sp-4)}
.st-meta{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--sp-3)}
.st-form label{display:grid;gap:6px;position:relative}
.st-form label>span{font-size:.875rem;font-weight:var(--fw-semibold);color:var(--c-text-secondary)}
.st-form .st-h{font-size:1.375rem;font-weight:var(--fw-bold);line-height:1.35}
.st-form .st-body{font-size:1rem;line-height:1.75;min-block-size:320px}
.st-tools{display:flex;gap:2px;border:1px solid var(--c-border);border-block-end:0;border-start-start-radius:var(--r-sm);border-start-end-radius:var(--r-sm);padding:2px;margin-block-end:-6px}
.st-tools+textarea{border-start-start-radius:0;border-start-end-radius:0}
.st-ai{position:sticky;inset-block-start:0;display:grid;gap:var(--sp-4);padding:var(--sp-5)}
.st-ai-h{display:grid}
.st-seg{display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}
.st-seg button{padding-inline:6px}
.st-ai-b{display:grid;gap:var(--sp-3);min-block-size:200px;align-content:start}
.st-ld{display:flex;align-items:center;gap:6px;padding:var(--sp-6) 0}
.st-ld span{inline-size:7px;block-size:7px;border-radius:50%;background:var(--c-primary);animation:gmdot 1s var(--ease) infinite}
.st-ld span:nth-child(2){animation-delay:.15s}.st-ld span:nth-child(3){animation-delay:.3s}
.st-ld small{margin-inline-start:var(--sp-2);color:var(--c-text-secondary)}
.st-5w{display:grid;gap:var(--sp-2)}
.st-5w>div{display:grid;grid-template-columns:56px minmax(0,1fr);gap:var(--sp-2);padding:var(--sp-2) var(--sp-3);border-radius:var(--r-md);background:var(--c-surface-neutral);align-items:baseline}
.st-5w small{font-weight:var(--fw-bold);color:var(--c-text-secondary)}
.st-5w b{font-size:.875rem;font-weight:var(--fw-semibold)}
.st-5w .miss{background:color-mix(in oklch,var(--c-warning) 12%,transparent)}
.st-5w .miss b{color:var(--c-warning-ink)}
.st-fc{display:grid;gap:var(--sp-3)}
.st-rings{display:flex;gap:var(--sp-5);justify-content:center}
.st-rg{display:grid;justify-items:center;gap:4px}.st-rg small{font-size:.75rem;font-weight:var(--fw-semibold);color:var(--c-text-secondary)}
.st-judge{border-inline-start:2px solid var(--c-border-strong,var(--c-border));padding-inline-start:var(--sp-3);display:grid;gap:2px}
.st-judge small{font-size:.8125rem;font-weight:var(--fw-semibold);color:var(--c-text-secondary)}
.st-judge p{font-size:.875rem}
.st-cl{display:grid;gap:var(--sp-2)}
.st-cl>div{display:grid;gap:6px;justify-items:start;border:1px solid var(--c-border);border-radius:var(--r-md);padding:var(--sp-3)}
.st-cl>div.fl{border-color:color-mix(in oklch,var(--c-warning) 50%,transparent)}
.st-cl p{font-size:.8125rem;line-height:1.5}
.st-cl q{font-size:.75rem;color:var(--c-text-secondary);font-style:italic}
.st-vid{display:grid;gap:var(--sp-2)}
.st-dur{position:absolute;inset-block-end:8px;inset-inline-end:8px;background:color-mix(in oklch,var(--c-scrim-media) 70%,transparent);color:var(--c-on-media);border-radius:6px;padding:2px 6px;font-size:.6875rem}
.st-ln{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:var(--sp-2);align-items:center;padding-block:var(--sp-2);border-block-end:1px dashed var(--c-border)}
.st-ln time{font-size:.75rem;color:var(--c-text-secondary)}
.st-ln p{font-size:.8125rem}
@container main (max-width:1099px){.st-w{grid-template-columns:minmax(0,1fr)}.st-ai{position:static}}
@container main (max-width:599px){.st-meta{grid-template-columns:minmax(0,1fr)}.st-form{padding:var(--sp-4)}.st-sv{display:none}.st-bar .m-btn{flex:1}.st-bt{flex-basis:calc(100% - 140px)}.st-search{min-inline-size:0;max-inline-size:none;flex-basis:100%}.st-top .m-btn{flex:1}
 .st-tb :is(th,td):is(:nth-child(2),:nth-child(5)){display:none}.nr .st-tb td.st-tc{min-inline-size:0}.nr .st-tb :is(td,th){padding-inline:12px}}
}
@layer components.app{
.lg{gap:var(--sp-3)}
.lg-h{display:flex;align-items:center;gap:var(--sp-3);padding:var(--sp-3) var(--sp-4);flex-wrap:wrap}
.lg-s .chip{font-variant-numeric:tabular-nums}
.lg-h>b{font-size:1rem}
.lg-s{display:flex;gap:6px;flex:1;flex-wrap:wrap;min-inline-size:0}
.lg-f{inline-size:100%;block-size:calc(100dvh - 220px);min-block-size:480px;border:0;border-radius:var(--r-lg);background:var(--c-surface);box-shadow:var(--shadow-card);display:block}
@container main (max-width:599px){.lg-s{display:none}.lg-h{padding-inline-start:var(--sp-3)}.lg-h .m-btn{margin-inline-start:auto}}
}
@layer components.app{
.pr{max-inline-size:880px;margin-inline:auto;inline-size:100%}
.pr-apps{display:flex;gap:var(--sp-2);flex-wrap:wrap}
.pr-card{padding:var(--sp-6);display:grid;gap:var(--sp-6)}
.pr-h{display:flex;align-items:baseline;gap:6px}
.pr-h b{font-size:1.125rem}
.pr-h small{font-size:.875rem}
.pr-st{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));position:relative}
.pr-st::before{content:"";position:absolute;inset-block-start:21px;inset-inline:10%;block-size:2px;background:var(--c-border)}
.pr-st>div{display:grid;justify-items:center;gap:6px;position:relative;text-align:center}
.pr-st span{display:grid;place-items:center;inline-size:44px;block-size:44px;border-radius:50%;background:var(--c-surface-neutral);color:var(--c-text-secondary);font-weight:var(--fw-bold);border:3px solid var(--c-surface);transition:background var(--dur-slow) var(--ease)}
.pr-st span .ic{inline-size:18px;block-size:18px}
.pr-st small{font-size:.875rem;font-weight:var(--fw-semibold);color:var(--c-text-secondary)}
.pr-st .on span{background:var(--c-primary);color:var(--c-primary-contrast,var(--c-white));box-shadow:var(--shadow-primary)}
.pr-st .on small{color:var(--c-text)}
.pr-st .done span{background:var(--c-text);color:var(--c-surface)}
.pr-b{display:grid;gap:var(--sp-4);animation:nrin var(--dur-slower) var(--ease)}
.pr-in{border:1px solid var(--c-border);border-radius:var(--r-lg);background:var(--c-surface-page);padding:var(--sp-4);display:grid;gap:var(--sp-3)}
.nr .pr-in textarea{border:0;background:transparent;font-size:1.0625rem;line-height:1.7;padding:0;resize:none}
.nr .pr-in textarea:focus{box-shadow:none}
.pr-in-f,.pr-f{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-2)}
.pr-cls{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--sp-3)}
.pr-cls>div{display:grid;gap:2px;padding:var(--sp-3);border-radius:var(--r-md);background:var(--c-surface-neutral);animation:nrin var(--dur-slower) var(--ease) both}
.pr-cls small{font-size:.8125rem;color:var(--c-text-secondary)}.pr-cls b{font-size:.9375rem}
.pr-cx{display:grid;gap:var(--sp-2)}
.pr-cx label{display:flex;gap:var(--sp-3);align-items:center;border:1px solid var(--c-border);border-radius:var(--r-md);padding:var(--sp-3) var(--sp-4);min-block-size:56px;cursor:pointer}
.pr-cx label:has(input:checked){border-color:var(--c-text)}
.pr-cx input{inline-size:20px;block-size:20px;accent-color:var(--c-primary);flex:none}
.pr-cx span{display:grid}.pr-cx small{color:var(--c-text-secondary);font-size:.8125rem}
.pr-out{display:grid;gap:var(--sp-3);justify-items:start}
.pr-out p{font-size:1rem;line-height:1.7}
.pr-out .m-label .ic{inline-size:14px;block-size:14px}
.pr-done{justify-items:center;text-align:center;padding-block:var(--sp-6)}
.pr-ok{display:grid;place-items:center;inline-size:64px;block-size:64px;border-radius:50%;background:var(--c-success);color:var(--c-white)}
.pr-ok .ic{inline-size:30px;block-size:30px}
@container main (max-width:599px){.pr-card{padding:var(--sp-4);gap:var(--sp-5)}.pr-cls{grid-template-columns:repeat(2,minmax(0,1fr))}.pr-st small{font-size:.6875rem}.pr-apps{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none}.pr-apps .pill{flex:none}.pr-f .m-btn-contained-primary{flex:1}}
}
@layer components.app{
.tr-top{gap:var(--sp-2)}
.tr-tabs{padding-inline:var(--sp-3)}
.tr-tabs button{display:inline-flex;align-items:center;gap:6px}
.tr-cc{font-size:.625rem;padding:2px 4px;border-radius:4px;background:var(--c-surface-neutral);color:var(--c-text-secondary)}
.tr-n{font-size:.75rem;font-variant-numeric:tabular-nums;font-weight:var(--fw-bold);min-inline-size:22px;block-size:20px;border-radius:6px;display:inline-grid;place-items:center;background:var(--c-surface-neutral);color:var(--c-text-secondary);padding-inline:4px}
.tr-tabs button[aria-selected=true] .tr-n{background:var(--c-text);color:var(--c-surface)}
.tr-f{padding:var(--sp-4) var(--sp-5);gap:var(--sp-3)}
.nr .tr-q{flex:1;min-inline-size:180px;inline-size:auto}
.tr-g{display:flex;align-items:center;gap:var(--sp-2);font-size:.875rem;font-weight:var(--fw-semibold);min-block-size:44px;cursor:pointer}
.tr-g .m-switch::before{content:"";position:absolute;inset-block:-11px;inset-inline:0}
.tr-tb td{vertical-align:middle;block-size:60px}
.tr-vol{font-weight:var(--fw-semibold)}
.tr-tb tr.cov td{color:var(--c-text-secondary)}
.tr-tc{min-inline-size:240px;max-inline-size:420px;white-space:normal}
.nr .tr-tb td.tr-tc{white-space:normal}
.tr-tc b{display:block;font-weight:var(--fw-semibold)}
.tr-tc small{display:block;color:var(--c-text-secondary);font-size:.8125rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-inline-size:380px}
.tr-cs{display:flex;flex-wrap:wrap;gap:4px;margin-block-start:6px}.tr-cs i{font-style:normal;font-size:.75rem;font-weight:var(--fw-semibold);padding:2px 8px;border-radius:var(--r-pill);background:var(--c-surface-neutral);color:var(--c-text)}
.tr-k{display:inline-grid;place-items:center;inline-size:26px;block-size:26px;border-radius:6px;background:var(--c-text);color:var(--c-surface);font-weight:var(--fw-bold);font-size:.8125rem}
.tr-src{display:inline-flex;gap:4px}
.tr-act{display:flex;align-items:center;gap:4px;justify-content:flex-end}
.tr-act .ib .ic{inline-size:16px;block-size:16px}
.tr-act .ib{position:relative}.tr-act .ib::before{content:"";position:absolute;inset-block:-2px;inset-inline:0}
@container main (max-width:599px){.tr-f{padding:var(--sp-3)}.nr .tr-q{min-inline-size:0;flex-basis:100%;order:3}.tr-top .m-btn{flex:1}.tr-top>div:first-child{flex-basis:100%}.tr-top .sp{display:none}
 .tr-tb :is(th,td):is(:nth-child(1),:nth-child(3),:nth-child(4)){display:none}.nr .tr-tb td.tr-tc{min-inline-size:0}.tr-tc small{max-inline-size:150px}.tr-act .ib{display:none}.nr .tr-tb :is(td,th){padding-inline:10px}}
}
@layer components.app{
.sd-pick{display:flex;gap:var(--sp-2);overflow-x:auto;scrollbar-width:thin;padding-block-end:4px}
.sd-doc{display:flex;align-items:center;gap:var(--sp-3);flex:0 0 auto;inline-size:300px;border:1px solid var(--c-border);background:var(--c-surface);border-radius:var(--r-lg);padding:var(--sp-3);text-align:start;min-block-size:64px}
.sd-doc.on{border-color:var(--c-text);box-shadow:0 0 0 1px var(--c-text)}
.sd-up{border-style:dashed;inline-size:220px}
.sd-pdf{display:grid;place-items:center;inline-size:36px;block-size:44px;border-radius:6px;background:color-mix(in oklch,var(--c-error) 14%,transparent);color:var(--c-error-ink);font:var(--fw-bold) .625rem/1 var(--font-mono);flex:none}
.sd-up .sd-pdf{background:var(--c-surface-neutral);color:var(--c-text);font-size:1.25rem}
.sd-dt{display:grid;min-inline-size:0}
.sd-dt b{font-size:.875rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sd-dt small{font-size:.75rem;color:var(--c-text-secondary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sd-main{display:grid;gap:var(--sp-4)}
.sd-hd{display:grid;gap:var(--sp-2)}
.sd-kp{display:grid;grid-template-columns:repeat(5,minmax(0,1fr))}
.sd-kp .kpi{padding:var(--sp-4) var(--sp-5)}
.sd-kp .kpi+.kpi{border-inline-start:1px dashed var(--c-border)}
.sd-kp .kpi b{font-size:1.75rem}.sd-kp .kpi b small{font-size:.875rem;color:var(--c-text-secondary)}
.sd-w{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--sp-4);align-items:start}
.sd-card{display:grid}
.sd-leg{display:flex;flex-wrap:wrap;gap:var(--sp-2) var(--sp-4);padding:var(--sp-3) var(--sp-5) 0;font-size:.8125rem;color:var(--c-text-secondary)}
.sd-leg>span{display:inline-flex;align-items:center;gap:6px}
.sd-cb{padding:var(--sp-2) var(--sp-5) var(--sp-4)}
.sd-g{padding-block:var(--sp-4) 0}
.sd-f{display:grid;grid-template-columns:minmax(0,9fr) minmax(0,11fr) auto auto;gap:var(--sp-2) var(--sp-3);align-items:center;padding-block:var(--sp-2);border-block-end:1px dashed var(--c-border);min-block-size:52px}
.sd-fn{font-size:.8125rem;color:var(--c-text-secondary)}
.sd-fv{font-size:.9375rem;font-weight:var(--fw-semibold)}
.sd-cite{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--c-border);background:var(--c-surface);border-radius:var(--r-sm);padding-inline:10px;min-block-size:36px;font-size:.75rem;font-weight:var(--fw-bold);white-space:nowrap;position:relative}
.sd-cite::before{content:"";position:absolute;inset:-4px 0}
.sd-cite:hover{border-color:var(--c-text)}
.sd-ft{padding:0 var(--sp-5) var(--sp-5);display:flex;justify-content:flex-end}
.sd-chat{display:flex;flex-direction:column;min-block-size:560px;overflow:hidden}
.sd-ch{display:flex;align-items:center;gap:var(--sp-3);padding:var(--sp-4) var(--sp-5);border-block-end:1px solid var(--c-border)}
.sd-ch>div{flex:1;display:grid;min-inline-size:0}.sd-ch small{font-size:.75rem}
.sd-av{display:grid;place-items:center;inline-size:40px;block-size:40px;border-radius:var(--r-md);background:var(--c-primary);color:var(--c-primary-contrast,var(--c-white));flex:none}
.sd-log{flex:1;overflow:auto;padding:var(--sp-4);display:flex;flex-direction:column;gap:var(--sp-3);background:var(--c-surface-page);max-block-size:440px;min-block-size:240px}
.sd-m{border-radius:var(--r-lg);padding:10px 14px;max-inline-size:88%;font-size:.9375rem;line-height:1.55;display:grid;gap:var(--sp-2)}
.sd-m.ai{background:var(--c-surface);align-self:flex-start;box-shadow:var(--shadow-z1)}
.sd-m.me{background:var(--c-text);color:var(--c-surface);align-self:flex-end}
.sd-meta{display:flex;align-items:center;gap:var(--sp-2);flex-wrap:wrap;border-block-start:1px dashed var(--c-border);padding-block-start:var(--sp-2)}
.sd-meta small{font-size:.75rem;color:var(--c-text-secondary)}
.sd-wait{display:flex;gap:4px;grid-auto-flow:column}.sd-wait span{inline-size:6px;block-size:6px;border-radius:50%;background:var(--c-text-disabled);animation:gmdot 1s var(--ease) infinite}.sd-wait span:nth-child(2){animation-delay:.15s}.sd-wait span:nth-child(3){animation-delay:.3s}
.sd-sug{display:flex;gap:6px;overflow-x:auto;padding:var(--sp-3) var(--sp-4) 0;scrollbar-width:none}
.sd-sug .m-btn{flex:none;max-inline-size:280px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:block}
.sd-in{display:flex;gap:var(--sp-2);padding:var(--sp-3) var(--sp-4) var(--sp-4)}
.sd-sheet{position:relative;background:var(--c-white);color:var(--c-grey-800);border-radius:var(--r-sm);box-shadow:var(--shadow-z8);padding:var(--sp-6) var(--sp-5);display:grid;gap:10px;aspect-ratio:1/1.3}
.sd-ln{block-size:8px;border-radius:4px;background:var(--c-grey-200)}.sd-ln.s{inline-size:60%}
.sd-sheet mark{background:color-mix(in oklch,var(--c-warning) 40%,transparent);color:var(--c-grey-900);padding:4px 6px;border-radius:4px;font-size:.875rem;line-height:1.6}
.sd-miss{font-size:.8125rem;color:var(--c-error-ink);background:color-mix(in oklch,var(--c-error) 10%,transparent);padding:var(--sp-2);border-radius:4px}
.sd-pn{position:absolute;inset-block-end:10px;inset-inline:0;text-align:center;font-size:.75rem;color:var(--c-grey-600)}
.sd-job{display:grid;gap:var(--sp-3)}
.sd-js{display:flex;align-items:center;gap:var(--sp-2);color:var(--c-text-disabled);font-weight:var(--fw-semibold);transition:color var(--dur-slow) var(--ease)}
.sd-js.ok{color:var(--c-text)}.sd-js.ok .dot{background:var(--c-success)}
@container main (max-width:1099px){.sd-w{grid-template-columns:minmax(0,1fr)}.sd-kp{grid-template-columns:repeat(3,minmax(0,1fr))}.sd-kp .kpi:nth-child(4){border-inline-start:0}.sd-kp .kpi:nth-child(n+4){border-block-start:1px dashed var(--c-border)}}
@container main (max-width:599px){.sd-kp{grid-template-columns:repeat(2,minmax(0,1fr))}.sd-kp .kpi{padding:var(--sp-3) var(--sp-4)}.sd-kp .kpi:nth-child(odd){border-inline-start:0}.sd-kp .kpi:nth-child(4){border-inline-start:1px dashed var(--c-border)}.sd-kp .kpi:nth-child(n+3){border-block-start:1px dashed var(--c-border)}.sd-kp .kpi b{font-size:1.25rem}
 .sd-f{grid-template-columns:minmax(0,1fr) auto;}.sd-fv{grid-column:1/-1;grid-row:2}.sd-f .m-btn{grid-column:1/-1}.sd-cb,.sd-leg{padding-inline:var(--sp-4)}.sd-doc{inline-size:250px}.sd-ft .m-btn{flex:1}}
}
@layer components.app{
.tg-sig{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));padding:var(--sp-4) var(--sp-5) var(--sp-5)}
.tg-s{padding-inline:var(--sp-4);display:grid;gap:var(--sp-1);align-content:start}
.tg-s+.tg-s{border-inline-start:1px dashed var(--c-border)}
.tg-s:first-child{padding-inline-start:0}.tg-s:last-child{padding-inline-end:0}
.tg-s .lbl{margin:0}
.tg-s code{font-size:.75rem;color:var(--c-text-secondary);background:var(--c-surface-neutral);border-radius:var(--r-sm);padding:4px 8px;overflow-wrap:anywhere;margin-block-start:var(--sp-1)}
.tg-sv{font-size:1.75rem;font-weight:var(--fw-extrabold);letter-spacing:-.02em;line-height:1.15;color:var(--c-text);display:flex;flex-wrap:wrap;align-items:baseline;column-gap:6px}
.tg-sv small{white-space:nowrap;font-size:.8125rem;font-weight:var(--fw-semibold);color:var(--c-text-secondary);letter-spacing:0}
.tg-s p{font-size:.8125rem;line-height:1.5}
.tg-w{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:var(--sp-4);align-items:start}
.tg-feed{display:grid;padding:var(--sp-3) var(--sp-5) var(--sp-4)}
.tg-p{display:grid;gap:var(--sp-3);padding-block:var(--sp-4);border-block-end:1px dashed var(--c-border)}
.tg-p:last-child{border-block-end:0}
.tg-ph{display:flex;align-items:center;gap:var(--sp-2)}
.tg-ph>div{flex:1;display:grid;min-inline-size:0}
.tg-ph b{font-size:.9375rem}.tg-ph small{font-size:.75rem;color:var(--c-text-secondary)}
.tg-av{display:grid;place-items:center;inline-size:34px;block-size:34px;border-radius:50%;background:color-mix(in oklch,var(--c-info) 16%,transparent);color:var(--c-info-ink);font-weight:var(--fw-bold);flex:none}
.tg-lift{font:var(--fw-extrabold) .9375rem/1 var(--font-mono);color:var(--c-text);padding:6px 10px;border-radius:var(--r-pill);background:var(--c-surface-neutral)}
.tg-lift.hot{color:var(--c-error-ink);background:color-mix(in oklch,var(--c-error) 12%,transparent)}
.tg-p p{font-size:.9375rem;line-height:1.5}
.tg-st{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--sp-2);background:var(--c-surface-neutral);border-radius:var(--r-md);padding:var(--sp-3) var(--sp-4)}
.tg-st span{display:grid;gap:2px}.tg-st small{font-size:.75rem;color:var(--c-text-secondary)}.tg-st b{font-size:.9375rem;font-variant-numeric:tabular-nums}
.tg-pf{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-2)}
.tg-pf small{font-size:.75rem}
.tg-sort{padding:var(--sp-4) var(--sp-5) var(--sp-2);gap:var(--sp-2)}
.nr .tg-tb td{block-size:60px}
.tg-tb td small{font-size:.8125rem;color:var(--c-text-secondary)}
.tg-r{display:flex;align-items:center;gap:var(--sp-2);min-inline-size:120px}.tg-r .bar{flex:1}
@container main (max-width:1099px){.tg-sig{grid-template-columns:repeat(3,minmax(0,1fr));row-gap:var(--sp-5)}.tg-s:nth-child(4){border-inline-start:0;padding-inline-start:0}.tg-s:nth-child(3){padding-inline-end:0}.tg-w{grid-template-columns:minmax(0,1fr)}}
@container main (max-width:599px){.tg-sig{grid-template-columns:repeat(2,minmax(0,1fr));padding-inline:var(--sp-4)}.tg-s:nth-child(n){border-inline-start:0;padding-inline:0}.tg-s:nth-child(even){border-inline-start:1px dashed var(--c-border);padding-inline-start:var(--sp-4)}.tg-s:last-child{grid-column:1/-1}.tg-s p{display:none}.tg-feed{padding-inline:var(--sp-4)}.tg-sort{padding-inline:var(--sp-4)}.tg-sort .seg{overflow-x:auto;max-inline-size:100%}.tg-sort .seg button{white-space:nowrap}}
}
@layer components.app{
.vx,.ve,.mo,.mos,.md-root,.md-dr{--gx-on-primary:oklch(from var(--c-primary) clamp(0,(0.6 - l) * 1000,1) 0 0)}
:is(.vx,.ve,.mo,.mos,.md-root,.md-dr) :is(.m-btn-contained-primary,.m-btn-contained-inherit){color:var(--gx-on-primary)}
#gm-main :is(.vx,.ve,.mo,.mos,.md-root) .m-btn-contained-inherit:not([aria-pressed]){color:var(--gx-on-primary)}
:is(.vx,.ve-side) .tabs-h button{min-block-size:48px}
.gx-empty{display:grid;justify-items:center;gap:var(--sp-3);padding:var(--sp-10) var(--sp-4);text-align:center;color:var(--c-text-secondary)}.gx-empty>.ic{inline-size:28px;block-size:28px;padding:12px;box-sizing:content-box;border-radius:50%;background:var(--c-surface-neutral);color:var(--c-text-secondary)}.gx-empty b{color:var(--c-text);font-weight:var(--fw-semibold)}
.hit{position:relative}.hit::before{content:"";position:absolute;inset-block:-8px;inset-inline:-2px}
[dir=rtl] .flip{transform:scaleX(-1)}
.gx-stripe{display:flex;inline-size:100%;aspect-ratio:1400/15;direction:ltr}.gx-stripe i{flex:1;background:var(--sc)}
.gx-nfmark{display:block;block-size:1em;inline-size:auto}
.gx-mk{display:inline-grid;place-items:center;min-inline-size:1.6em;block-size:1.6em;padding-inline:.25em;border-radius:.3em;background:var(--c-primary);color:var(--gx-on-primary,var(--c-primary-contrast));font-weight:var(--fw-extrabold);line-height:1}
.seg{display:inline-flex;gap:2px;padding:3px;border-radius:var(--r-md);background:var(--c-surface-neutral)}
.seg button{border:0;background:none;min-block-size:38px;padding-inline:12px;border-radius:calc(var(--r-md) - 3px);font:var(--fw-semibold) .8125rem/1 var(--font-body);color:var(--c-text-secondary);position:relative;white-space:nowrap}
.seg button::before{content:"";position:absolute;inset-block:-4px;inset-inline:0}
.seg button[aria-pressed=true]{background:var(--c-surface);color:var(--c-text);box-shadow:var(--shadow-z1)}
.gx-head{display:flex;align-items:center;gap:var(--sp-3);flex-wrap:wrap}
.gx-head .sp{flex:1}
.gx-sub{font-size:.875rem;color:var(--c-text-secondary)}
.gx-tn{display:inline-flex;align-items:center;gap:8px;font-weight:var(--fw-semibold);font-size:.875rem}
.gx-tn .tn-av{inline-size:26px;block-size:26px;font-size:.6875rem}
.ib{display:inline-grid;place-items:center;inline-size:44px;block-size:44px;border-radius:50%;border:0;background:var(--c-surface-neutral);color:var(--c-text);flex:none;transition:background var(--dur-fast) var(--ease)}
.ib:hover{background:var(--c-state-hover)}
.ib.pr{background:var(--c-text);color:var(--c-surface)}
.pill{position:relative}.pill::before{content:"";position:absolute;inset-block:-7px;inset-inline:0}
.pills{display:flex;gap:var(--sp-2);flex-wrap:wrap;align-items:center}
.pill small{opacity:.6;font-weight:var(--fw-medium)}
.gx-in{border:1px solid var(--c-border-input,var(--c-border));border-radius:var(--r-sm);padding:10px 12px;font:inherit;background:var(--c-surface);color:var(--c-text);min-block-size:46px;inline-size:100%;min-inline-size:0}
.gx-in:focus{outline:2px solid var(--c-primary);outline-offset:-1px}
.gx-search{position:relative;flex:1;min-inline-size:min(100%,200px)}
.gx-search .ic{position:absolute;inset-inline-start:12px;inset-block-start:12px;color:var(--c-text-disabled)}
.gx-search .gx-in{padding-inline-start:40px}
.gx-prog{display:flex;align-items:center;gap:var(--sp-3);min-inline-size:200px}
.gx-prog .bar{flex:1;block-size:8px}.gx-prog b{font:var(--fw-bold) .75rem/1 var(--font-mono);min-inline-size:3.5em;text-align:end}
}
@layer components.app{
.vx{display:grid;gap:var(--sp-5)}
.vx-k{padding:var(--sp-5);display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:var(--sp-2)}
.vx-k span{grid-column:1/-1;font-size:.875rem;color:var(--c-text-secondary);font-weight:var(--fw-semibold)}
.vx-k b{font-size:clamp(1.5rem,2cqi + 1rem,2rem);font-weight:var(--fw-extrabold);line-height:1.1;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.vx-k small{grid-column:1/-1;font-size:.8125rem;color:var(--c-text-secondary)}
.vx-sp{inline-size:84px;block-size:34px;overflow:visible}.vx-sp path{fill:none;stroke:var(--c-primary);stroke-width:2;stroke-linejoin:round}
.vx-split{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);gap:var(--sp-4);align-items:start}
.vx-fix{flex-wrap:wrap;align-items:flex-start}
.vx .vx-fix .tx b{white-space:normal}
.vx-fix .m-btn{margin-inline-start:auto;align-self:center}
.vx-fi{display:grid;place-items:center;inline-size:40px;block-size:40px;border-radius:var(--r-md);flex:none;background:color-mix(in oklch,var(--tone) 14%,transparent);color:var(--tone)}
.vx-fi[data-tone=warning]{--tone:var(--c-warning-dark,var(--c-warning))}.vx-fi[data-tone=error]{--tone:var(--c-error)}.vx-fi[data-tone=info]{--tone:var(--c-info)}.vx-fi[data-tone=primary]{--tone:var(--c-primary)}.vx-fi[data-tone=default]{--tone:var(--c-text-secondary)}
.vx-fix.out{opacity:0;transform:translateX(12px);transition:opacity var(--dur-normal) var(--ease),transform var(--dur-normal) var(--ease)}
.vx-ok{display:grid;justify-items:center;gap:var(--sp-2);padding:var(--sp-8) var(--sp-4);text-align:center;color:var(--c-text-secondary)}
.vx-ok .ic{inline-size:36px;block-size:36px;padding:10px;box-sizing:content-box;border-radius:50%;background:color-mix(in oklch,var(--c-success) 14%,transparent);color:var(--c-success-ink)}
.vx-bars{display:grid;gap:var(--sp-4);padding:var(--sp-4) var(--sp-5) var(--sp-5)}
.vx-bars div{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px var(--sp-2);font-size:.875rem}
.vx-bars div b{font-weight:var(--fw-semibold);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.vx-bars div span{font:var(--fw-bold) .8125rem/1.6 var(--font-mono);color:var(--c-text-secondary);font-variant-numeric:tabular-nums}
.vx-bars .bar{grid-column:1/-1}
.vx-watch{overflow:hidden}
.vx-hero{position:relative;aspect-ratio:21/8;min-block-size:260px;background:var(--c-tape);color:var(--c-on-media);overflow:hidden}
.vx-hero img{position:absolute;inset:0;inline-size:100%;block-size:100%;object-fit:cover}
.vx-hero::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,var(--c-scrim-media) 8%,color-mix(in oklch,var(--c-scrim-media) 40%,transparent) 55%,transparent)}
.vx-hero-tx{position:absolute;inset-inline:var(--sp-6);inset-block-end:var(--sp-6);z-index:1;display:grid;gap:var(--sp-2);max-inline-size:620px}
.vx-hero-tx h3{font-size:clamp(1.25rem,2.4cqi + .6rem,2rem);font-weight:var(--fw-extrabold);line-height:1.15;text-wrap:balance}
.vx-hero-tx p{font-size:.875rem;opacity:.85}
.vx-hero .m-label{justify-self:start;background:var(--c-primary);color:var(--gx-on-primary)}
.vx-hero .m-btn-outlined-inherit{color:var(--c-on-media);border-color:color-mix(in oklch,var(--c-on-media) 50%,transparent)}
.vx-rail{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(220px,260px);gap:var(--sp-4);overflow-x:auto;padding:var(--sp-4) var(--sp-5) var(--sp-5);scroll-snap-type:inline mandatory;scrollbar-width:thin}
.vx-top{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:end;scroll-snap-align:start;border:0;background:none;text-align:start;padding:0;color:inherit;cursor:pointer}
.vx-top>b{font:var(--fw-extrabold) 5.5rem/0.8 var(--font-display);color:transparent;-webkit-text-stroke:2px var(--c-text-disabled);margin-inline-end:-14px;position:relative;z-index:0}
.vx-top .thumb{z-index:1}
.vx-top small{grid-column:1/-1;margin-block-start:8px;font-size:.8125rem;font-weight:var(--fw-semibold);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.vx-du{position:absolute;inset-block-end:6px;inset-inline-end:6px;font:var(--fw-bold) .6875rem/1 var(--font-mono);background:var(--c-scrim-media);color:var(--c-on-media);padding:4px 6px;border-radius:4px;unicode-bidi:isolate}
.vx-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,230px),1fr));gap:var(--sp-5) var(--sp-4);padding:var(--sp-4) var(--sp-5) var(--sp-5)}
.vx-ep{display:grid;gap:8px;border:0;background:none;padding:0;text-align:start;color:inherit;cursor:pointer;border-radius:var(--r-md)}
.vx-ep .thumb{transition:transform var(--dur-normal) var(--ease)}.vx-ep:hover .thumb{transform:scale(1.02)}
.vx-ep b{font-size:.9375rem;font-weight:var(--fw-semibold);line-height:1.35;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.vx-ep small{font-size:.8125rem;color:var(--c-text-secondary)}
.vx-ep .m-label{position:absolute;inset-block-start:6px;inset-inline-start:6px}
.vx-ep[aria-current=true] .thumb{outline:3px solid var(--c-primary);outline-offset:2px}
.vx-pl{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:var(--sp-5);padding:var(--sp-5)}
.vx-player{position:relative;aspect-ratio:16/9;border-radius:var(--r-lg);overflow:hidden;background:var(--c-tape);color:var(--c-on-media)}
.vx-player>img{inline-size:100%;block-size:100%;object-fit:cover;display:block}
.vx-player::after{content:"";position:absolute;inset-inline:0;inset-block-end:0;block-size:45%;background:linear-gradient(to top,color-mix(in oklch,var(--c-scrim-media) 85%,transparent),transparent);pointer-events:none}
.vx-ctl{position:absolute;inset-inline:12px;inset-block-end:10px;z-index:2;display:grid;gap:6px;direction:ltr}
.vx-ctl .row{gap:10px;font:var(--fw-bold) .75rem/1 var(--font-mono)}
.vx-ctl .ib{inline-size:36px;block-size:36px;background:color-mix(in oklch,var(--c-on-media) 18%,transparent);color:var(--c-on-media)}
.vx-ctl .ib::before{content:"";position:absolute;inset:-4px}
.vx-scr{position:relative;block-size:4px;border-radius:2px;background:color-mix(in oklch,var(--c-on-media) 30%,transparent)}
.vx-scr i{position:absolute;inset-block:0;inset-inline-start:0;border-radius:2px;background:var(--c-primary)}
.vx-scr u{position:absolute;inset-block:-2px;border-radius:2px;background:color-mix(in oklch,var(--c-on-media) 70%,transparent);text-decoration:none}
.vx-ov{position:absolute;z-index:3;font-size:.8125rem;font-weight:var(--fw-semibold)}
.vx-ov.live{inset-block-start:12px;inset-inline-start:12px;display:flex;gap:8px;align-items:center;direction:ltr}
.vx-ov.live b{background:var(--c-error-dark);color:var(--c-on-media);padding:4px 8px;border-radius:4px;font-size:.75rem}
.vx-ov.cap{inset-inline:10%;inset-block-end:64px;text-align:center}.vx-ov.cap span{background:color-mix(in oklch,var(--c-scrim-media) 80%,transparent);padding:4px 10px;border-radius:4px;line-height:1.6;box-decoration-break:clone;-webkit-box-decoration-break:clone}
.vx-ov.menu{inset-block-end:56px;inset-inline-end:12px;background:color-mix(in oklch,var(--c-scrim-media) 92%,transparent);border-radius:var(--r-md);padding:6px;display:grid;min-inline-size:140px;direction:ltr}
.vx-ov.menu span{padding:8px 10px;border-radius:6px;display:flex;justify-content:space-between;gap:12px}.vx-ov.menu span.on{background:color-mix(in oklch,var(--c-on-media) 14%,transparent)}
.vx-ov.card{inset-block-end:56px;inset-inline-end:12px;display:grid;grid-template-columns:96px minmax(0,1fr);gap:10px;align-items:center;background:color-mix(in oklch,var(--c-scrim-media) 92%,transparent);padding:8px;border-radius:var(--r-md);max-inline-size:min(320px,80%)}
.vx-ov.card img{inline-size:96px;aspect-ratio:16/9;object-fit:cover;border-radius:6px}.vx-ov.card small{display:block;opacity:.7;font-size:.6875rem}
.vx-ov.mid{inset:0;display:grid;place-content:center;justify-items:center;gap:10px;text-align:center;background:color-mix(in oklch,var(--c-scrim-media) 55%,transparent)}
.vx-ov.mid .m-btn-outlined-inherit{color:var(--c-on-media);border-color:color-mix(in oklch,var(--c-on-media) 50%,transparent)}
.vx-ov.clip{inset-block-start:12px;inset-inline-end:12px;background:var(--c-primary);color:var(--gx-on-primary);padding:6px 10px;border-radius:var(--r-sm)}
.vx-meta{display:grid;gap:var(--sp-3);align-content:start}
.vx-show{font-size:.875rem;font-weight:var(--fw-semibold);color:var(--c-text-secondary)}
.vx-meta h3{font-size:1.125rem;font-weight:var(--fw-bold);line-height:1.35}
.vx-dl{display:grid;grid-template-columns:auto minmax(0,1fr);gap:8px var(--sp-4);font-size:.875rem}.vx-dl dt{color:var(--c-text-secondary)}.vx-dl dd{margin:0;font-weight:var(--fw-semibold)}
.vx-area{inline-size:100%;block-size:200px;display:block}.vx-area .a{fill:color-mix(in oklch,var(--c-primary) 14%,transparent)}.vx-area .l{fill:none;stroke:var(--c-primary);stroke-width:2.5}.vx-area .g{stroke:var(--c-border);stroke-dasharray:3 4}
.vx-chart{padding:var(--sp-4) var(--sp-5) var(--sp-5);display:grid;gap:6px}
.vx-ax{display:flex;justify-content:space-between;direction:ltr;font-size:.75rem;font-weight:var(--fw-medium);color:var(--c-text-secondary);font-variant-numeric:tabular-nums}.vx-ax span{unicode-bidi:plaintext}
.vx .kpi b .vx-now{font-size:inherit;color:inherit;font-weight:inherit}.vx .kpi b{letter-spacing:-.02em}
.vx-now{display:inline-flex;align-items:center;gap:8px}.vx-now::before{content:"";inline-size:8px;block-size:8px;border-radius:50%;background:var(--c-success);animation:vxp 1.6s var(--ease) infinite}
@keyframes vxp{50%{opacity:.3}}
.vx-tt td{vertical-align:middle}.vx-tt .tt{display:flex;align-items:center;gap:var(--sp-3);min-inline-size:260px}.vx-tt img{inline-size:72px;aspect-ratio:16/9;object-fit:cover;border-radius:6px;flex:none}
.vx-tt td{padding-block:12px;padding-inline:16px}.vx-tt .mono{font-variant-numeric:tabular-nums}
.vx-tt .rk{font:var(--fw-extrabold) 1rem/1 var(--font-mono);color:var(--c-text-secondary)}
@container main (max-width:899px){.vx-split,.vx-pl{grid-template-columns:minmax(0,1fr)}.vx-hero{aspect-ratio:auto;min-block-size:300px}}
@container main (max-width:599px){.vx .vx-fix .tx{flex:1 1 calc(100% - 56px)}.vx .vx-fix .m-btn{margin-inline-start:52px}.vx-hero-tx{inset-inline:var(--sp-4);inset-block-end:var(--sp-4)}.vx-rail{grid-auto-columns:minmax(200px,72%)}.vx .g-4{grid-template-columns:repeat(2,minmax(0,1fr))}.vx-k{padding:var(--sp-4)}.vx-sp{inline-size:56px}.vx-pl{padding:var(--sp-4)}}
}
@layer components.app{
.ve{display:grid;gap:var(--sp-4)}
.ve-main{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:var(--sp-4);align-items:start}
.ve-mon{container-type:size;block-size:clamp(220px,46cqi,440px);display:grid;place-items:center;background:var(--c-tape);border-start-start-radius:var(--r-lg);border-start-end-radius:var(--r-lg);overflow:hidden}
.ve[data-ar="9:16"] .ve-mon{block-size:clamp(380px,60cqi,520px)}.ve[data-ar="1:1"] .ve-mon{block-size:clamp(320px,50cqi,460px)}
.ve-stage{position:relative;inline-size:min(100cqi,calc(100cqh * var(--arn)));aspect-ratio:var(--ar);overflow:hidden;background:var(--c-tape-2);color:var(--c-on-media);container-type:inline-size}
.ve-stage>img{position:absolute;inset:0;inline-size:100%;block-size:100%;object-fit:cover;transform-origin:var(--ox,50%) var(--oy,50%);transition:none}
.ve-bug{position:absolute;inset-block-start:4cqi;inset-inline-end:4cqi;font-size:max(11px,3.2cqi);z-index:2}.ve-bug .gx-nfmark{filter:invert(1);block-size:2.2em}
.ve-tc{position:absolute;inset-block-start:4cqi;inset-inline-start:4cqi;font:var(--fw-bold) max(10px,2.4cqi)/1 var(--font-mono);background:color-mix(in oklch,var(--c-scrim-media) 70%,transparent);padding:4px 6px;border-radius:4px;z-index:2;unicode-bidi:isolate}
.ve-cap{position:absolute;inset-inline:8%;inset-block-end:7%;text-align:center;font-size:max(12px,3.6cqi);font-weight:var(--fw-bold);line-height:1.5;z-index:3}
.ve-cap span{background:color-mix(in oklch,var(--c-scrim-media) 82%,transparent);padding:.15em .5em;border-radius:.2em;box-decoration-break:clone;-webkit-box-decoration-break:clone}
.ve-g{position:absolute;z-index:2;animation:veIn var(--dur-slow) var(--ease) both}
@keyframes veIn{from{opacity:0;transform:translateY(12px)}}
.ve-g.lower{inset-inline-start:5%;inset-block-end:24%;display:grid;max-inline-size:70%}
.ve-g.lower b{background:var(--c-primary);color:var(--gx-on-primary);font-size:max(13px,4.2cqi);padding:.2em .6em;font-weight:var(--fw-extrabold)}
.ve-g.lower small{background:var(--c-on-media);color:var(--c-grey-900);font-size:max(11px,2.8cqi);padding:.25em .8em;justify-self:start;font-weight:var(--fw-semibold)}
.ve-g.breaking{inset-inline:0;inset-block-end:20%;display:flex;align-items:stretch;font-size:max(12px,3.6cqi)}
.ve-g.breaking b{background:var(--c-primary);color:var(--gx-on-primary);padding:.35em .8em;font-weight:var(--fw-extrabold)}.ve-g.breaking span{flex:1;background:var(--c-on-media);color:var(--c-grey-900);padding:.35em .8em;font-weight:var(--fw-bold);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ve-g.quote{inset-block-start:18%;inset-inline:10%;text-align:center;font-size:max(14px,5cqi);font-weight:var(--fw-extrabold);line-height:1.25;text-shadow:0 2px 12px var(--c-scrim-media)}.ve-g.quote small{display:block;font-size:.55em;margin-block-start:.5em;color:var(--c-on-media);opacity:.85}
.ve-g.headline{inset-block-start:0;inset-inline:0;padding:6cqi 5cqi 14cqi;background:linear-gradient(to bottom,var(--c-scrim-media),transparent);font-size:max(15px,5.4cqi);font-weight:var(--fw-extrabold);line-height:1.2}.ve-g.headline i{display:block;inline-size:12%;block-size:.18em;background:var(--c-primary);margin-block-end:.4em}
.ve-g.score{inset-block-start:12cqi;inset-inline-start:4cqi;display:flex;font:var(--fw-bold) max(11px,2.8cqi)/1 var(--font-body);direction:ltr}
.ve-g.score span{background:var(--c-scrim-media);padding:.5em .7em}.ve-g.score b{background:var(--c-primary);color:var(--gx-on-primary);padding:.5em .7em;font-family:var(--font-mono)}.ve-g.score small{background:var(--c-on-media);color:var(--c-grey-900);padding:.5em .6em;font-family:var(--font-mono)}
.ve-tr{display:flex;align-items:center;gap:var(--sp-2);padding:var(--sp-3) var(--sp-4);flex-wrap:wrap}
.ve-tr .mono{font-size:.8125rem;font-weight:var(--fw-bold)}.ve-tr .mono{font-variant-numeric:tabular-nums}.ve-tr .mono small{color:var(--c-text-secondary);font-weight:var(--fw-medium)}
.ve-side .tabs-h{padding-inline:var(--sp-4)}
.ve-tp{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--sp-2);padding:var(--sp-4)}
.ve-tp button{display:grid;gap:6px;border:1px solid var(--c-border);background:var(--c-surface);border-radius:var(--r-md);padding:6px 6px 8px;text-align:start;font-size:.8125rem;font-weight:var(--fw-semibold);color:var(--c-text);min-block-size:44px}
.ve-tp button[aria-pressed=true]{border-color:var(--c-text);box-shadow:0 0 0 1px var(--c-text)}
.ve-mini{position:relative;aspect-ratio:16/9;border-radius:6px;background:var(--c-tape);overflow:hidden}
.ve-mini i{position:absolute;display:block;background:var(--c-primary)}.ve-mini u{position:absolute;display:block;background:var(--c-on-media);text-decoration:none;opacity:.9}
.ve-insp{padding:var(--sp-4);display:grid;gap:var(--sp-3)}
.ve-insp dl{display:grid;grid-template-columns:auto minmax(0,1fr);gap:6px var(--sp-3);font-size:.875rem;margin:0}.ve-insp dt{color:var(--c-text-secondary)}.ve-insp dd{margin:0;font-weight:var(--fw-semibold)}
.ve-tlc{overflow:hidden}
.ve-tl{display:grid;grid-template-columns:96px minmax(0,1fr)}
.ve-lab{display:grid;grid-template-rows:30px 64px 40px 40px 56px;border-inline-end:1px solid var(--c-border);background:var(--c-surface)}
.ve-lab span{display:flex;align-items:center;gap:8px;padding-inline:12px;font-size:.8125rem;font-weight:var(--fw-semibold);color:var(--c-text-secondary);border-block-start:1px solid var(--c-border)}
.ve-lab span:first-child{border:0}.ve-lab .ic{inline-size:16px;block-size:16px}
.ve-sc{overflow-x:auto;direction:ltr;scrollbar-width:thin;touch-action:pan-x}
.ve-in{position:relative;display:grid;grid-template-rows:30px 64px 40px 40px 56px;min-inline-size:100%;cursor:text;user-select:none;-webkit-user-select:none}
.ve-ruler{position:relative;background:var(--c-surface-neutral)}
.ve-ruler i{position:absolute;inset-block-end:0;inline-size:1px;block-size:6px;background:var(--c-border-strong)}.ve-ruler i.l{block-size:12px}
.ve-ruler b{position:absolute;inset-block-start:5px;font:var(--fw-medium) .75rem/1 var(--font-mono);color:var(--c-text-secondary);font-variant-numeric:tabular-nums;transform:translateX(4px)}
.ve-ln{position:relative;border-block-start:1px solid var(--c-border)}
.ve-it{position:absolute;inset-block:5px;border-radius:6px;overflow:hidden;font-size:.75rem;font-weight:var(--fw-semibold);display:flex;align-items:center;padding-inline:8px;white-space:nowrap;cursor:pointer;border:0;text-align:start}
.ve-it.v{background-size:auto 100%;background-repeat:repeat-x;color:var(--c-on-media);align-items:flex-end;padding-block-end:4px;box-shadow:inset 0 0 0 1px color-mix(in oklch,var(--c-on-media) 20%,transparent)}
.ve-it.v span{background:color-mix(in oklch,var(--c-scrim-media) 70%,transparent);padding:2px 6px;border-radius:4px;overflow:hidden;text-overflow:ellipsis}
.ve-it.v.sel{box-shadow:inset 0 0 0 2px var(--c-primary)}
.ve-it.k{background:color-mix(in oklch,var(--c-info) 16%,var(--c-surface));color:var(--c-text);box-shadow:inset 0 0 0 1px color-mix(in oklch,var(--c-info) 40%,transparent)}
.ve-it.g{background:color-mix(in oklch,var(--c-primary) 16%,var(--c-surface));color:var(--c-text);box-shadow:inset 0 0 0 1px color-mix(in oklch,var(--c-primary) 40%,transparent)}
.ve-it span{overflow:hidden;text-overflow:ellipsis;unicode-bidi:plaintext}
.ve-h{position:absolute;inset-block:0;inline-size:14px;background:var(--c-primary);display:grid;place-items:center;cursor:ew-resize;z-index:3;touch-action:none}
.ve-h::after{content:"";inline-size:2px;block-size:40%;border-radius:1px;background:var(--gx-on-primary)}
.ve-h::before{content:"";position:absolute;inset-block:-4px;inset-inline:-12px}
.ve-h.l{inset-inline-start:0}.ve-h.r{inset-inline-end:0}
.ve-wave{position:absolute;inset-block:6px;inset-inline:0;inline-size:100%;block-size:calc(100% - 12px)}
.ve-ph{position:absolute;inset-block:0;inline-size:2px;background:var(--c-primary);z-index:4;pointer-events:none}
.ve-ph::before{content:"";position:absolute;inset-block-start:0;inset-inline-start:-7px;inline-size:16px;block-size:14px;background:var(--c-primary);clip-path:polygon(0 0,100% 0,100% 60%,50% 100%,0 60%);pointer-events:auto;cursor:grab}
.ve-ph::after{content:"";position:absolute;inset-block-start:-6px;inset-inline-start:-20px;inline-size:42px;block-size:44px;pointer-events:auto;cursor:grab}
.ve-json pre{margin:0;padding:var(--sp-4) var(--sp-5);max-block-size:320px;overflow:auto;font-size:.75rem;line-height:1.6;direction:ltr;text-align:start;white-space:pre}
.ve-name{display:grid;gap:2px;min-inline-size:0;flex:1}.ve-name b{font-weight:var(--fw-bold);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ve-name small{font-size:.75rem;color:var(--c-text-secondary)}
@container main (max-width:899px){.ve-main{display:contents}.ve-mc{order:1}.ve-tlc{order:2}.ve-side{order:3}.ve-json{order:4}.ve-tp{grid-template-columns:repeat(3,minmax(0,1fr))}}
@container main (max-width:599px){.ve-tl{grid-template-columns:44px minmax(0,1fr)}.ve-lab span b{display:none}.ve-lab span{justify-content:center;padding:0}.ve-tp{grid-template-columns:repeat(3,minmax(0,1fr))}.ve-bar .seg{order:3}}
}
@layer components.app{@keyframes mo-up-1{0%,4%{opacity:0;transform:translateY(40%)}13%,88%{opacity:1;transform:none;clip-path:inset(0)}96%,100%{opacity:0;transform:translateY(-12%)}}[data-a="up-1"]{animation-name:mo-up-1}@keyframes mo-up-2{0%,11%{opacity:0;transform:translateY(40%)}20%,88%{opacity:1;transform:none;clip-path:inset(0)}96%,100%{opacity:0;transform:translateY(-12%)}}[data-a="up-2"]{animation-name:mo-up-2}@keyframes mo-up-3{0%,18%{opacity:0;transform:translateY(40%)}27%,88%{opacity:1;transform:none;clip-path:inset(0)}96%,100%{opacity:0;transform:translateY(-12%)}}[data-a="up-3"]{animation-name:mo-up-3}@keyframes mo-up-4{0%,25%{opacity:0;transform:translateY(40%)}34%,88%{opacity:1;transform:none;clip-path:inset(0)}96%,100%{opacity:0;transform:translateY(-12%)}}[data-a="up-4"]{animation-name:mo-up-4}@keyframes mo-down-1{0%,4%{opacity:0;transform:translateY(-140%)}13%,88%{opacity:1;transform:none;clip-path:inset(0)}96%,100%{opacity:0;transform:translateY(-140%)}}[data-a="down-1"]{animation-name:mo-down-1}@keyframes mo-down-2{0%,11%{opacity:0;transform:translateY(-140%)}20%,88%{opacity:1;transform:none;clip-path:inset(0)}96%,100%{opacity:0;transform:translateY(-140%)}}[data-a="down-2"]{animation-name:mo-down-2}@keyframes mo-down-3{0%,18%{opacity:0;transform:translateY(-140%)}27%,88%{opacity:1;transform:none;clip-path:inset(0)}96%,100%{opacity:0;transform:translateY(-140%)}}[data-a="down-3"]{animation-name:mo-down-3}@keyframes mo-down-4{0%,25%{opacity:0;transform:translateY(-140%)}34%,88%{opacity:1;transform:none;clip-path:inset(0)}96%,100%{opacity:0;transform:translateY(-140%)}}[data-a="down-4"]{animation-name:mo-down-4}@keyframes mo-side-1{0%,4%{opacity:0;transform:translateX(calc(var(--dx) * -30%))}13%,88%{opacity:1;transform:none;clip-path:inset(0)}96%,100%{opacity:0;transform:translateX(calc(var(--dx) * 20%))}}[data-a="side-1"]{animation-name:mo-side-1}@keyframes mo-side-2{0%,11%{opacity:0;transform:translateX(calc(var(--dx) * -30%))}20%,88%{opacity:1;transform:none;clip-path:inset(0)}96%,100%{opacity:0;transform:translateX(calc(var(--dx) * 20%))}}[data-a="side-2"]{animation-name:mo-side-2}@keyframes mo-side-3{0%,18%{opacity:0;transform:translateX(calc(var(--dx) * -30%))}27%,88%{opacity:1;transform:none;clip-path:inset(0)}96%,100%{opacity:0;transform:translateX(calc(var(--dx) * 20%))}}[data-a="side-3"]{animation-name:mo-side-3}@keyframes mo-side-4{0%,25%{opacity:0;transform:translateX(calc(var(--dx) * -30%))}34%,88%{opacity:1;transform:none;clip-path:inset(0)}96%,100%{opacity:0;transform:translateX(calc(var(--dx) * 20%))}}[data-a="side-4"]{animation-name:mo-side-4}@keyframes mo-scale-1{0%,4%{opacity:0;transform:scale(.4)}13%,88%{opacity:1;transform:none;clip-path:inset(0)}96%,100%{opacity:0;transform:scale(1.1)}}[data-a="scale-1"]{animation-name:mo-scale-1}@keyframes mo-scale-2{0%,11%{opacity:0;transform:scale(.4)}20%,88%{opacity:1;transform:none;clip-path:inset(0)}96%,100%{opacity:0;transform:scale(1.1)}}[data-a="scale-2"]{animation-name:mo-scale-2}@keyframes mo-scale-3{0%,18%{opacity:0;transform:scale(.4)}27%,88%{opacity:1;transform:none;clip-path:inset(0)}96%,100%{opacity:0;transform:scale(1.1)}}[data-a="scale-3"]{animation-name:mo-scale-3}@keyframes mo-scale-4{0%,25%{opacity:0;transform:scale(.4)}34%,88%{opacity:1;transform:none;clip-path:inset(0)}96%,100%{opacity:0;transform:scale(1.1)}}[data-a="scale-4"]{animation-name:mo-scale-4}@keyframes mo-fade-1{0%,4%{opacity:0}13%,88%{opacity:1;transform:none;clip-path:inset(0)}96%,100%{opacity:0}}[data-a="fade-1"]{animation-name:mo-fade-1}@keyframes mo-fade-2{0%,11%{opacity:0}20%,88%{opacity:1;transform:none;clip-path:inset(0)}96%,100%{opacity:0}}[data-a="fade-2"]{animation-name:mo-fade-2}@keyframes mo-fade-3{0%,18%{opacity:0}27%,88%{opacity:1;transform:none;clip-path:inset(0)}96%,100%{opacity:0}}[data-a="fade-3"]{animation-name:mo-fade-3}@keyframes mo-fade-4{0%,25%{opacity:0}34%,88%{opacity:1;transform:none;clip-path:inset(0)}96%,100%{opacity:0}}[data-a="fade-4"]{animation-name:mo-fade-4}@keyframes mo-grow-1{0%,4%{transform:scaleY(0)}13%,88%{opacity:1;transform:none;clip-path:inset(0)}96%,100%{transform:scaleY(0)}}[data-a="grow-1"]{animation-name:mo-grow-1}@keyframes mo-grow-2{0%,11%{transform:scaleY(0)}20%,88%{opacity:1;transform:none;clip-path:inset(0)}96%,100%{transform:scaleY(0)}}[data-a="grow-2"]{animation-name:mo-grow-2}@keyframes mo-grow-3{0%,18%{transform:scaleY(0)}27%,88%{opacity:1;transform:none;clip-path:inset(0)}96%,100%{transform:scaleY(0)}}[data-a="grow-3"]{animation-name:mo-grow-3}@keyframes mo-grow-4{0%,25%{transform:scaleY(0)}34%,88%{opacity:1;transform:none;clip-path:inset(0)}96%,100%{transform:scaleY(0)}}[data-a="grow-4"]{animation-name:mo-grow-4}@keyframes mo-wipe-1{0%,4%{clip-path:inset(0 100% 0 0)}13%,88%{opacity:1;transform:none;clip-path:inset(0)}96%,100%{clip-path:inset(0 0 0 100%)}}[data-a="wipe-1"]{animation-name:mo-wipe-1}@keyframes mo-wipe-2{0%,11%{clip-path:inset(0 100% 0 0)}20%,88%{opacity:1;transform:none;clip-path:inset(0)}96%,100%{clip-path:inset(0 0 0 100%)}}[data-a="wipe-2"]{animation-name:mo-wipe-2}@keyframes mo-wipe-3{0%,18%{clip-path:inset(0 100% 0 0)}27%,88%{opacity:1;transform:none;clip-path:inset(0)}96%,100%{clip-path:inset(0 0 0 100%)}}[data-a="wipe-3"]{animation-name:mo-wipe-3}@keyframes mo-wipe-4{0%,25%{clip-path:inset(0 100% 0 0)}34%,88%{opacity:1;transform:none;clip-path:inset(0)}96%,100%{clip-path:inset(0 0 0 100%)}}[data-a="wipe-4"]{animation-name:mo-wipe-4}@keyframes mo-wipr-1{0%,4%{clip-path:inset(0 0 0 100%)}13%,88%{opacity:1;transform:none;clip-path:inset(0)}96%,100%{clip-path:inset(0 100% 0 0)}}[data-a="wipr-1"]{animation-name:mo-wipr-1}@keyframes mo-wipr-2{0%,11%{clip-path:inset(0 0 0 100%)}20%,88%{opacity:1;transform:none;clip-path:inset(0)}96%,100%{clip-path:inset(0 100% 0 0)}}[data-a="wipr-2"]{animation-name:mo-wipr-2}@keyframes mo-wipr-3{0%,18%{clip-path:inset(0 0 0 100%)}27%,88%{opacity:1;transform:none;clip-path:inset(0)}96%,100%{clip-path:inset(0 100% 0 0)}}[data-a="wipr-3"]{animation-name:mo-wipr-3}@keyframes mo-wipr-4{0%,25%{clip-path:inset(0 0 0 100%)}34%,88%{opacity:1;transform:none;clip-path:inset(0)}96%,100%{clip-path:inset(0 100% 0 0)}}[data-a="wipr-4"]{animation-name:mo-wipr-4}[dir=rtl] [data-a="wipe-1"]{animation-name:mo-wipr-1}[dir=rtl] [data-a="wipe-2"]{animation-name:mo-wipr-2}[dir=rtl] [data-a="wipe-3"]{animation-name:mo-wipr-3}[dir=rtl] [data-a="wipe-4"]{animation-name:mo-wipr-4}@keyframes mo-g1{0%,0%{opacity:0;transform:scale(1.12)}3%{opacity:1}30%{opacity:1;transform:scale(1)}33%,100%{opacity:0}}[data-a="g1"]{animation-name:mo-g1}@keyframes mo-g2{0%,32%{opacity:0;transform:scale(1.12)}36%{opacity:1}63%{opacity:1;transform:scale(1)}66%,100%{opacity:0}}[data-a="g2"]{animation-name:mo-g2}@keyframes mo-g3{0%,65%{opacity:0;transform:scale(1.12)}69%{opacity:1}96%{opacity:1;transform:scale(1)}99%,100%{opacity:0}}[data-a="g3"]{animation-name:mo-g3}@keyframes mo-band-1{0%,10%{transform:translateX(-110%) skewX(-12deg)}30%,50%{transform:translateX(0) skewX(-12deg)}72%,100%{transform:translateX(110%) skewX(-12deg)}}[data-a="band-1"]{animation-name:mo-band-1}@keyframes mo-band-2{0%,16%{transform:translateX(-110%) skewX(-12deg)}36%,54%{transform:translateX(0) skewX(-12deg)}77%,100%{transform:translateX(110%) skewX(-12deg)}}[data-a="band-2"]{animation-name:mo-band-2}@keyframes mo-band-3{0%,22%{transform:translateX(-110%) skewX(-12deg)}42%,58%{transform:translateX(0) skewX(-12deg)}82%,100%{transform:translateX(110%) skewX(-12deg)}}[data-a="band-3"]{animation-name:mo-band-3}@keyframes mo-band-4{0%,28%{transform:translateX(-110%) skewX(-12deg)}48%,62%{transform:translateX(0) skewX(-12deg)}87%,100%{transform:translateX(110%) skewX(-12deg)}}[data-a="band-4"]{animation-name:mo-band-4}}
@layer components.app{
.mo{display:grid;gap:var(--sp-5)}
.mo-tools{display:flex;gap:var(--sp-3);flex-wrap:wrap;align-items:center}
.mo-grid{display:grid;gap:var(--sp-6) var(--sp-4);grid-template-columns:repeat(auto-fill,minmax(min(100%,var(--cw,280px)),1fr))}
.mo[data-ar="9:16"] .mo-grid,.mo[data-ar="4:5"] .mo-grid{--cw:190px}
.mo-sec{display:grid;gap:var(--sp-3)}.mo-sec h3{font-size:1.0625rem;font-weight:var(--fw-bold);display:flex;gap:8px;align-items:baseline}.mo-sec h3 small{font-size:.875rem;font-weight:var(--fw-semibold);color:var(--c-text-secondary);font-variant-numeric:tabular-nums}
.mo-card{display:grid;gap:8px;border:0;background:none;padding:0;text-align:start;color:inherit;cursor:pointer;align-content:start}
.mo-card .mo-st{border-radius:var(--r-lg);box-shadow:var(--shadow-z1);transition:transform var(--dur-normal) var(--ease),box-shadow var(--dur-normal) var(--ease)}
.mo-card:hover .mo-st{transform:translateY(-2px);box-shadow:var(--shadow-z8)}
.mo-card b{font-size:.9375rem;font-weight:var(--fw-bold)}.mo-card small{font-size:.8125rem;color:var(--c-text-secondary);line-height:1.45}
.mo-dur{position:absolute;inset-block-start:8px;inset-inline-end:8px;z-index:9;font:var(--fw-bold) .6875rem/1 var(--font-mono);background:color-mix(in oklch,var(--c-scrim-media) 75%,transparent);color:var(--c-on-media);padding:5px 7px;border-radius:5px;unicode-bidi:isolate}
.mo-st{--dx:1;--mo-acc:var(--c-primary);--mo-ink:var(--gx-on-primary);--mo-acc2:var(--c-primary);--mo-ink2:var(--gx-on-primary);--mo-hi:var(--c-primary-light);position:relative;aspect-ratio:var(--ar,16/9);overflow:hidden;container-type:size;background:var(--c-tape);color:var(--c-on-media);font-family:var(--font-body);isolation:isolate}
[dir=rtl] .mo-st,.mo-st[dir=rtl]{--dx:-1}.mo-st[dir=ltr]{--dx:1}
.mo-st [data-a],.mo-st .mo-tk span,.mo-st .mo-bg,.mo-st .mo-cnt,.mo-st .mo-cd{animation-duration:var(--d,8s);animation-iteration-count:infinite;animation-fill-mode:both;animation-timing-function:var(--ease)}
.mo-st.paused *,.mo-st.paused{animation-play-state:paused}
.mo-card .mo-st [data-a],.mo-card .mo-st .mo-tk span,.mo-card .mo-st .mo-bg,.mo-card .mo-st .mo-cnt,.mo-card .mo-st .mo-cd{animation-delay:calc(var(--d,8s) * -.5)}
.mo-bg{position:absolute;inset:0;background-size:cover;background-position:center;animation-name:mo-kb;z-index:-2}
@keyframes mo-kb{from{transform:scale(1.04)}to{transform:scale(1.18)}}
.mo-sc{position:absolute;inset:0;z-index:-1;background:linear-gradient(to top,var(--c-scrim-media) 5%,color-mix(in oklch,var(--c-scrim-media) 35%,transparent) 55%,color-mix(in oklch,var(--c-scrim-media) 20%,transparent))}
.mo-solid{position:absolute;inset:0;z-index:-2;background:radial-gradient(120% 90% at 85% 10%,color-mix(in oklch,var(--mo-acc2) 50%,var(--c-tape)),var(--c-tape) 70%)}
.mo-st.nf{--mo-acc:oklch(96.6% 0.004 106);--mo-ink:oklch(17.5% 0.004 286);--mo-acc2:oklch(55% 0.2577 29.23);--mo-ink2:oklch(98% 0 0);--mo-hi:oklch(96.6% 0.004 106)}
.mo-st.nf .mo-solid{background:oklch(17.5% 0.004 286)}
.mo-st.nf .mo-tk{border-block-start:1.2cqmin solid;border-image:linear-gradient(90deg,oklch(96.8% 0.211 109.77) 0.00% 16.67%,oklch(90.54% 0.1546 194.77) 16.67% 33.33%,oklch(86.64% 0.2948 142.5) 33.33% 50.00%,oklch(70.17% 0.3225 328.36) 50.00% 66.67%,oklch(62.8% 0.2577 29.23) 66.67% 83.33%,oklch(45.2% 0.3132 264.05) 83.33% 100.00%) 1}
.mo-st.nf .mo-lab{box-shadow:0 1.2cqmin 0 -.2cqmin oklch(62.8% 0.2577 29.23)}
.mo-pad{position:absolute;inset:7cqmin;display:flex;flex-direction:column;justify-content:flex-end;gap:2.4cqmin}
.mo-pad.c{justify-content:center;align-items:center;text-align:center}.mo-pad.t{justify-content:flex-start}
.mo-bug{position:absolute;inset-block-start:5cqmin;inset-inline-start:5cqmin;display:flex;gap:2cqmin;align-items:center;font-size:5cqmin;z-index:5}
.mo-bug .gx-mk{font-size:4.4cqmin}.mo-bug .gx-nfmark{filter:invert(1);block-size:8cqmin}
.mo-live{background:var(--c-error-dark);color:var(--c-on-media);font:var(--fw-extrabold) 3.6cqmin/1 var(--font-body);padding:1cqmin 1.6cqmin;border-radius:.6cqmin;display:inline-flex;gap:1cqmin;align-items:center}
.mo-live::before{content:"";inline-size:1.4cqmin;block-size:1.4cqmin;border-radius:50%;background:var(--c-on-media);animation:vxp 1.2s infinite}
.mo-lab{align-self:flex-start;background:var(--mo-acc);color:var(--mo-ink);font-weight:var(--fw-extrabold);font-size:6cqmin;padding:.6cqmin 2.4cqmin;letter-spacing:.02em}
.mo-h{font-size:10cqmin;font-weight:var(--fw-extrabold);line-height:1.08;text-wrap:balance;text-shadow:0 .4cqmin 3cqmin color-mix(in oklch,var(--c-scrim-media) 60%,transparent)}
.mo-h.s{font-size:7.6cqmin}
.mo-s{font-size:5.2cqmin;font-weight:var(--fw-semibold);opacity:.9}
.mo-ln{inline-size:22cqmin;block-size:1.6cqmin;background:var(--mo-acc)}
.mo-pad .gx-stripe{inline-size:40cqmin}
.mo-tk{position:absolute;inset-inline:0;inset-block-end:0;block-size:10cqmin;display:flex;align-items:center;overflow:hidden;background:var(--c-on-media);color:var(--c-grey-900);font-weight:var(--fw-bold);font-size:4.8cqmin;z-index:4}
.mo-tk b{flex:none;block-size:100%;display:grid;place-items:center;padding-inline:2.4cqmin;background:var(--mo-acc2);color:var(--mo-ink2);z-index:1}
.mo-tk span{white-space:nowrap;animation-name:mo-tick;animation-timing-function:linear;padding-inline-start:2cqmin}
@keyframes mo-tick{from{transform:translateX(0)}to{transform:translateX(calc(var(--dx) * -50%))}}
.mo-pad.tkp{inset-block-end:16cqmin}
.mo-lt{display:grid;justify-items:start;gap:0}
.mo-lt b{background:var(--mo-acc);color:var(--mo-ink);font-size:7cqmin;font-weight:var(--fw-extrabold);padding:.6cqmin 2.4cqmin}
.mo-lt small{background:var(--c-on-media);color:var(--c-grey-900);font-size:4.6cqmin;font-weight:var(--fw-semibold);padding:.8cqmin 2.4cqmin}
.mo-pin{align-self:flex-start;display:inline-flex;gap:1cqmin;align-items:center;font-size:4.6cqmin;font-weight:var(--fw-bold);background:color-mix(in oklch,var(--c-scrim-media) 70%,transparent);padding:1.2cqmin 2.4cqmin;border-radius:5cqmin}
.mo-pin::before{content:"";inline-size:1.8cqmin;block-size:1.8cqmin;border-radius:50% 50% 50% 0;background:var(--mo-acc2);transform:rotate(-45deg)}
.mo-big{font:var(--fw-extrabold) 24cqmin/1 var(--font-display);color:var(--mo-hi);font-variant-numeric:tabular-nums;direction:ltr}
.mo-cnt{animation-name:mo-cnt;counter-reset:n var(--mo-n)}.mo-cnt::before{content:counter(n)}
@keyframes mo-cnt{0%,8%{--mo-n:0}55%,100%{--mo-n:var(--to)}}
.mo-cd{animation-name:mo-cd;animation-timing-function:linear}
@keyframes mo-cd{0%,6%{--mo-n:var(--from)}90%,100%{--mo-n:0}}
.mo-cd::before{content:"00:0" counter(n)}
.mo-ups{display:grid;gap:1.6cqmin}.mo-ups div{font-size:5.2cqmin;font-weight:var(--fw-semibold);padding-inline:2.4cqmin;border-inline-start:1cqmin solid var(--mo-acc2);background:color-mix(in oklch,var(--c-scrim-media) 55%,transparent);padding-block:1cqmin}
.mo-dev{display:inline-flex;gap:1.4cqmin;align-items:center}.mo-dev::before{content:"";inline-size:2cqmin;block-size:2cqmin;border-radius:50%;background:var(--c-on-media);animation:vxp 1s infinite}
.mo-split{position:absolute;inset:0;display:grid;grid-template-columns:1fr 1fr;gap:1cqmin;z-index:-2;background:var(--c-tape-2)}
.mo-split div{background-size:cover;background-position:center}
.mo-vs{position:absolute;inset:0;margin:auto;inline-size:16cqmin;block-size:16cqmin;border-radius:50%;display:grid;place-items:center;background:var(--mo-acc);color:var(--mo-ink);font:var(--fw-extrabold) 6cqmin/1 var(--font-body);z-index:3}
.mo-two{position:absolute;inset-inline:4cqmin;inset-block-end:6cqmin;display:grid;grid-template-columns:1fr 1fr;gap:6cqmin}
.mo-two .mo-lt b{font-size:5.6cqmin}.mo-two .mo-lt small{font-size:4cqmin}
.mo-q{font-size:8.4cqmin;font-weight:var(--fw-extrabold);line-height:1.18;text-wrap:balance}
.mo-qm{font:var(--fw-extrabold) 30cqmin/.6 var(--font-display);color:var(--mo-hi)}
.mo-pts{display:grid;gap:2.2cqmin;inline-size:100%}.mo-pts div{display:flex;gap:2.4cqmin;align-items:center;font-size:6cqmin;font-weight:var(--fw-bold)}
.mo-pts i{flex:none;inline-size:8cqmin;block-size:8cqmin;border-radius:50%;display:grid;place-items:center;background:var(--mo-acc);color:var(--mo-ink);font:var(--fw-extrabold) 4.4cqmin/1 var(--font-mono);font-style:normal}
.mo-gal{position:absolute;inset:0;z-index:-2}.mo-gal>div{position:absolute;inset:0;background-size:cover;background-position:center;display:flex;align-items:flex-end;padding:7cqmin}
.mo-gal>div span{font-size:5.6cqmin;font-weight:var(--fw-bold);background:color-mix(in oklch,var(--c-scrim-media) 70%,transparent);padding:1cqmin 2.4cqmin}
.mo-tl{position:relative;inline-size:100%;display:grid;gap:5cqmin;padding-inline-start:6cqmin}
.mo-tl::before{content:"";position:absolute;inset-block:2cqmin;inset-inline-start:1.8cqmin;inline-size:.8cqmin;background:color-mix(in oklch,var(--c-on-media) 25%,transparent)}
.mo-tl div{position:relative;font-size:5.8cqmin;font-weight:var(--fw-bold)}
.mo-tl div::before{content:"";position:absolute;inset-inline-start:-6.2cqmin;inset-block-start:.6cqmin;inline-size:3.6cqmin;block-size:3.6cqmin;border-radius:50%;background:var(--mo-acc2);box-shadow:0 0 0 1.2cqmin color-mix(in oklch,var(--mo-acc2) 30%,transparent)}
.mo-poll{display:flex;gap:3cqmin;align-items:flex-end;block-size:46cqmin;inline-size:100%}
.mo-poll div{flex:1;display:grid;align-content:end;gap:1.4cqmin;block-size:100%;text-align:center;font-size:4.4cqmin;font-weight:var(--fw-bold)}
.mo-poll i{display:block;block-size:var(--h);background:color-mix(in oklch,var(--c-on-media) 35%,transparent);transform-origin:bottom;border-start-start-radius:1cqmin;border-start-end-radius:1cqmin}
.mo-poll div:first-child i{background:var(--mo-acc2)}.mo-poll em{font:var(--fw-extrabold) 5cqmin/1 var(--font-mono);font-style:normal}
.mo-score{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:3cqmin;inline-size:100%;background:color-mix(in oklch,var(--c-scrim-media) 80%,transparent);padding:3cqmin;border-radius:2cqmin;font-weight:var(--fw-extrabold);font-size:4.6cqmin;text-align:center}
.mo-score b{font:var(--fw-extrabold) 12cqmin/1 var(--font-mono);background:var(--mo-acc);color:var(--mo-ink);padding:1cqmin 3cqmin;border-radius:1cqmin;direction:ltr}
.mo-goal{font:var(--fw-extrabold) 16cqmin/1 var(--font-display);color:var(--mo-hi);letter-spacing:.02em}
.mo-push{inline-size:min(100%,80cqmin);display:grid;grid-template-columns:auto minmax(0,1fr);gap:2.4cqmin;align-items:center;background:color-mix(in oklch,var(--c-on-media) 92%,transparent);color:var(--c-grey-900);border-radius:4cqmin;padding:3cqmin;box-shadow:0 2cqmin 6cqmin color-mix(in oklch,var(--c-scrim-media) 50%,transparent)}
.mo-push .gx-mk{font-size:3.6cqmin}.mo-push .gx-nfmark{block-size:7cqmin}.mo-push b{display:block;font-size:4cqmin;opacity:.6}.mo-push span{font-size:5.4cqmin;font-weight:var(--fw-bold);line-height:1.25}
.mo-word{font:var(--fw-extrabold) 12cqmin/1 var(--font-display);letter-spacing:-.01em}
.mo-mark{font-size:10cqmin}.mo-mark .gx-nfmark{filter:invert(1);block-size:20cqmin}
.mo-band{position:absolute;inset-block:-10%;inline-size:40%;z-index:2}.mo-band:nth-child(1){inset-inline-start:-5%;background:var(--mo-acc2)}.mo-band:nth-child(2){inset-inline-start:25%;background:var(--c-on-media)}.mo-band:nth-child(3){inset-inline-start:50%;background:color-mix(in oklch,var(--mo-acc2) 70%,var(--c-tape))}.mo-band:nth-child(4){inset-inline-start:70%;background:var(--c-tape-2)}
.mo-follow{background:var(--mo-acc);color:var(--mo-ink);font-weight:var(--fw-extrabold);font-size:5.4cqmin;padding:1.6cqmin 4cqmin;border-radius:6cqmin}
.mo-segs{position:absolute;inset-block-start:3cqmin;inset-inline:4cqmin;display:flex;gap:1cqmin;z-index:5}.mo-segs i{flex:1;block-size:.8cqmin;border-radius:1cqmin;background:color-mix(in oklch,var(--c-on-media) 35%,transparent)}.mo-segs i:first-child{background:var(--c-on-media)}
.mo-det{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:var(--sp-4);align-items:start}
.mo-mon{container-type:size;block-size:clamp(240px,46cqi,460px);display:grid;place-items:center;background:var(--c-surface-neutral);border-start-start-radius:var(--r-lg);border-start-end-radius:var(--r-lg)}
.mo[data-ar="9:16"] .mo-mon,.mo[data-ar="4:5"] .mo-mon{block-size:clamp(400px,60cqi,560px)}
.mo-mon .mo-st{inline-size:min(100cqi - 32px,calc((100cqh - 32px) * var(--arn)))}
.mo-trp{display:flex;gap:var(--sp-3);align-items:center;padding:var(--sp-3) var(--sp-4)}
.mo-trp input[type=range]{flex:1;min-inline-size:0;accent-color:var(--c-primary);block-size:44px;direction:ltr}
.mo-trp .mono{font-size:.8125rem;font-weight:var(--fw-bold);min-inline-size:5.5em}
.mo-form{padding:var(--sp-5);display:grid;gap:var(--sp-4)}
.mo-form label{display:grid;gap:8px;font-size:.875rem;font-weight:var(--fw-semibold);color:var(--c-text-secondary)}
.mo-brand{display:flex;gap:var(--sp-3);align-items:center;padding:var(--sp-3);border-radius:var(--r-md);background:var(--c-surface-neutral);font-size:.875rem}
.mo-brand .tn-av{inline-size:32px;block-size:32px}
.mo-snd{display:flex;align-items:center;gap:var(--sp-3);min-block-size:44px;border:0;background:none;padding:0;color:inherit;font:inherit;font-size:.875rem;font-weight:var(--fw-semibold);cursor:pointer}
@container main (max-width:899px){.mo-det{grid-template-columns:minmax(0,1fr)}}
@container main (max-width:599px){.mo-tools .seg{overflow-x:auto;max-inline-size:100%}}
}
@layer components.app{
.mos{display:grid;grid-template-columns:260px minmax(0,1fr) 280px;gap:var(--sp-4);align-items:start}
.mos-lib{display:grid;gap:var(--sp-3);padding:var(--sp-4)}
.mos-list{display:grid;gap:6px;max-block-size:560px;overflow:auto;padding:2px}
.mos-it{display:flex;align-items:center;gap:var(--sp-3);border:1px solid transparent;background:var(--c-surface-neutral);border-radius:var(--r-md);padding:10px 12px;min-block-size:52px;text-align:start;color:var(--c-text);cursor:pointer}
.mos-it b{flex:1;font-size:.875rem;font-weight:var(--fw-semibold)}.mos-it small{font:var(--fw-bold) .75rem/1 var(--font-mono);color:var(--c-text-secondary);font-variant-numeric:tabular-nums}
.mos-it[aria-pressed=true]{background:var(--c-surface);border-color:var(--c-text);box-shadow:var(--shadow-z1)}
.mos-mon{container-type:size;block-size:clamp(240px,40cqi,440px);display:grid;place-items:center;background-color:var(--c-surface-neutral);background-image:repeating-conic-gradient(color-mix(in oklch,var(--c-text) 4%,transparent) 0 25%,transparent 0 50%);background-size:20px 20px;border-start-start-radius:var(--r-lg);border-start-end-radius:var(--r-lg)}
.mos-c[data-fmt="9:16"] .mos-mon{block-size:clamp(420px,62cqi,560px)}.mos-c[data-fmt="1:1"] .mos-mon{block-size:clamp(320px,48cqi,480px)}
.mos-st{--bg:oklch(17.5% 0.004 286);--fg:oklch(96.6% 0.004 106);position:relative;overflow:hidden;inline-size:min(100cqi - 32px,calc((100cqh - 32px) * var(--arn)));aspect-ratio:var(--ar);background:var(--bg);color:var(--fg);container-type:size;direction:ltr;box-shadow:var(--shadow-z8)}
.mos-st[data-surf=snow]{--bg:oklch(96.6% 0.004 106);--fg:oklch(17.5% 0.004 286)}
.mos-word{position:absolute;inset-inline:0;inset-block-start:50%;transform:translateY(-50%);display:flex;justify-content:center;align-items:center;gap:.04em;font:var(--fw-extrabold) 14cqmin/1 var(--font-display);letter-spacing:-.01em;white-space:nowrap}
.mos-word span{display:inline-block}
.mos-word .gx-nfmark{block-size:22cqmin}
.mos-st[data-surf=charcoal] .gx-nfmark{filter:invert(1)}
.mos-stripe{position:absolute;inset-inline:0;inset-block-start:50%;margin-block-start:-.53cqw}
.mos-stripe[data-place=under]{inset-block-start:calc(50% + 15cqmin)}.mos-stripe[data-place=bottom]{inset-block-start:auto;inset-block-end:9%}
.mos-st .gx-stripe{inline-size:100%}
.mos-lab{position:absolute;inset-block-start:16%;inset-inline:0;text-align:center;font:var(--fw-extrabold) 6cqmin/1 var(--font-display);letter-spacing:.02em}
.mos-bands{position:absolute;inset:0;display:flex}.mos-bands i{flex:1;background:var(--sc)}
.mos-hb{position:absolute;inset-inline:0;block-size:calc(100% / 6);background:var(--sc)}
.mos-lt{position:absolute;inset-inline-start:7%;inset-block-end:14%;display:grid;gap:0;min-inline-size:44%}
.mos-lt b{background:var(--fg);color:var(--bg);font:var(--fw-extrabold) 5.4cqmin/1.1 var(--font-body);padding:1.6cqmin 2.4cqmin}
.mos-lt small{font:var(--fw-semibold) 3.4cqmin/1 var(--font-body);padding:1.4cqmin 2.4cqmin;background:color-mix(in oklch,var(--fg) 14%,var(--bg))}
.mos-lt .gx-stripe{inline-size:100%}
.mos-live{position:absolute;inset-block-start:7%;inset-inline-end:6%;display:flex;gap:1.4cqmin;align-items:center;font:var(--fw-extrabold) 4cqmin/1 var(--font-body);letter-spacing:.02em}
.mos-live i{inline-size:2.4cqmin;block-size:2.4cqmin;border-radius:50%;background:oklch(62.8% 0.2577 29.23)}
.mos-handle{position:absolute;inset-inline:0;inset-block-end:16%;text-align:center;font:var(--fw-bold) 4.4cqmin/1 var(--font-body);opacity:.8}
.mos-trp{display:flex;gap:var(--sp-3);align-items:center;padding:var(--sp-3) var(--sp-4);flex-wrap:wrap}
.mos-trp input{flex:1;min-inline-size:120px;accent-color:var(--c-primary);block-size:44px;direction:ltr}
.mos-trp .mono{font-size:.8125rem;font-weight:var(--fw-bold)}
.mos-side{display:grid;gap:var(--sp-5);padding:var(--sp-4)}
.mos-side h6{font-size:.875rem;font-weight:var(--fw-semibold);color:var(--c-text-secondary);margin-block-end:10px}
.mos-pre{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--sp-2)}
.mos-pre button{display:grid;gap:4px;border:1px solid var(--c-border);background:var(--c-surface);border-radius:var(--r-md);padding:8px;text-align:start;color:var(--c-text);min-block-size:44px}
.mos-pre button[aria-pressed=true]{border-color:var(--c-text);box-shadow:0 0 0 1px var(--c-text)}
.mos-pre b{font-size:.875rem}.mos-pre small{font-size:.75rem;color:var(--c-text-secondary);line-height:1.35}
.mos-pv{block-size:44px;border-radius:6px;background:oklch(17.5% 0.004 286);display:grid;place-items:center}
.mos-pv span{display:block;aspect-ratio:var(--ar);block-size:34px;border:1px solid oklch(40% 0.004 286);border-radius:2px;position:relative;overflow:hidden}
.mos-pv .gx-stripe{position:absolute;inset-inline:0;inset-block-start:var(--y,50%)}
.mos-side .seg{display:flex}.mos-side .seg button{flex:1}
.mos-tok{display:grid;grid-template-columns:auto minmax(0,1fr);gap:8px var(--sp-3);font-size:.875rem}.mos-tok dt{color:var(--c-text-secondary)}.mos-tok dd{margin:0;font-family:var(--font-mono);font-weight:var(--fw-bold);font-variant-numeric:tabular-nums;text-align:end}
.mos-sw{display:flex;gap:3px;direction:ltr}.mos-sw i{inline-size:18px;block-size:18px;border-radius:4px;background:var(--sc)}
@container main (max-width:1099px){.mos{grid-template-columns:minmax(0,1fr) 280px}.mos-l{grid-column:1/-1;order:3}.mos-list{grid-template-columns:repeat(auto-fill,minmax(140px,1fr));max-block-size:none}}
@container main (max-width:899px){.mos{grid-template-columns:minmax(0,1fr)}.mos-l{order:2}.mos-r{order:3}}
}
@layer components.app{
.md{display:grid;grid-template-columns:220px minmax(0,1fr);gap:var(--sp-5);align-items:start}
.md-top{display:flex;gap:var(--sp-3);flex-wrap:wrap;align-items:center}
.md-top .sp{flex:1}
.md-iso{display:inline-flex;align-items:center;gap:var(--sp-2);padding-block:6px;padding-inline:6px 12px;border-radius:var(--r-pill);background:var(--c-surface);box-shadow:var(--shadow-z1);font-size:.8125rem}
.md-iso .tn-av{inline-size:28px;block-size:28px;font-size:.6875rem}.md-iso b{font-weight:var(--fw-bold)}.md-iso small{color:var(--c-text-secondary)}
.md-fold{display:grid;gap:2px;position:sticky;inset-block-start:0}
.md-fold button{display:flex;align-items:center;gap:var(--sp-2);border:0;background:none;padding:0 12px;min-block-size:48px;border-radius:var(--r-md);text-align:start;font-weight:var(--fw-semibold);font-size:.875rem;color:var(--c-text-secondary)}
.md-fold button span{flex:1}.md-fold button small{font:var(--fw-bold) .75rem/1 var(--font-mono);color:var(--c-text-secondary);font-variant-numeric:tabular-nums}
.md-fold button[aria-pressed=true]{background:var(--c-text);color:var(--c-surface)}.md-fold button[aria-pressed=true] small{color:inherit;opacity:.7}
.md-body{display:grid;gap:var(--sp-4);min-inline-size:0}
.md-drop{display:grid;place-items:center;gap:6px;text-align:center;padding:var(--sp-6) var(--sp-4);border:2px dashed var(--c-border-strong);border-radius:var(--r-lg);color:var(--c-text-secondary);cursor:pointer;transition:background var(--dur-fast) var(--ease),border-color var(--dur-fast) var(--ease)}
.md-drop b{color:var(--c-text);font-size:.9375rem}.md-drop.on{background:color-mix(in oklch,var(--c-primary) 8%,transparent);border-color:var(--c-primary)}
.md-filt{display:flex;gap:var(--sp-3);flex-wrap:wrap;align-items:center}
.md-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,190px),1fr));gap:var(--sp-4)}
.md-card{display:grid;grid-template-rows:auto 1fr;border:1px solid var(--c-border);background:var(--c-surface);border-radius:var(--r-lg);overflow:hidden;padding:0;text-align:start;color:inherit;cursor:pointer;transition:box-shadow var(--dur-normal) var(--ease),transform var(--dur-normal) var(--ease)}
.md-card:hover{box-shadow:var(--shadow-z8);transform:translateY(-2px)}
.md-pv{position:relative;aspect-ratio:4/3;background:var(--c-surface-neutral);display:grid;place-items:center;overflow:hidden;color:var(--c-text-secondary)}
.md-pv img{position:absolute;inset:0;inline-size:100%;block-size:100%;object-fit:cover}
.md-pv .ic{inline-size:36px;block-size:36px}
.md-pv .pl{position:absolute;inset-block-start:8px;inset-inline-start:8px;inline-size:30px;block-size:30px;border-radius:50%;display:grid;place-items:center;background:color-mix(in oklch,var(--c-scrim-media) 70%,transparent);color:var(--c-on-media)}.md-pv .pl .ic{inline-size:14px;block-size:14px}
.md-pv .du{position:absolute;inset-block-end:8px;inset-inline-end:8px;font:var(--fw-bold) .6875rem/1 var(--font-mono);background:color-mix(in oklch,var(--c-scrim-media) 75%,transparent);color:var(--c-on-media);padding:4px 6px;border-radius:4px;unicode-bidi:isolate}
.md-pv.pdf{background:color-mix(in oklch,var(--c-error) 8%,var(--c-surface-neutral));color:var(--c-error-ink)}
.md-pv.audio{background:color-mix(in oklch,var(--c-primary) 8%,var(--c-surface-neutral));color:var(--c-primary-ink)}
.md-wv{display:flex;align-items:center;gap:2px;block-size:40%;inline-size:76%}.md-wv i{flex:1;background:currentColor;border-radius:1px;block-size:var(--h)}
.md-tx{padding:10px 12px 12px;display:grid;gap:3px;align-content:start}
.md-tx b{font-size:.875rem;font-weight:var(--fw-bold);line-height:1.35;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.md-tx small{font-size:.75rem;color:var(--c-text-secondary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.md-scrim{position:fixed;inset:0;background:color-mix(in oklch,var(--c-scrim-media) 40%,transparent);z-index:1270;opacity:0;pointer-events:none;transition:opacity var(--dur-normal) var(--ease)}
.md-dr{position:fixed;inset-block:0;inset-inline-end:0;inline-size:min(440px,100%);background:var(--c-surface);z-index:1271;box-shadow:var(--shadow-dialog);display:none;grid-template-rows:auto minmax(0,1fr) auto;transform:translateX(calc(var(--dxx,1) * 105%));transition:transform var(--dur-slow) var(--ease),display var(--dur-slow) var(--ease) allow-discrete;padding-block:env(safe-area-inset-top,0px) env(safe-area-inset-bottom,0px)}
[dir=rtl] .md-dr{--dxx:-1}
.md-dr.on{display:grid;transform:none}@starting-style{.md-dr.on{transform:translateX(calc(var(--dxx,1) * 105%))}}.md-scrim.on{opacity:1;pointer-events:auto}
.md-dh{display:flex;align-items:center;gap:var(--sp-2);padding:var(--sp-3) var(--sp-4);border-block-end:1px solid var(--c-border)}.md-dh b{flex:1;font-weight:var(--fw-bold);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.md-db{overflow:auto;padding:var(--sp-5);display:grid;gap:var(--sp-4);align-content:start}
.md-db .md-pv{border-radius:var(--r-lg);aspect-ratio:16/10}
.md-db dl{display:grid;grid-template-columns:auto minmax(0,1fr);gap:10px var(--sp-4);font-size:.875rem;margin:0}.md-db dt{color:var(--c-text-secondary)}.md-db dd{margin:0;font-weight:var(--fw-semibold);overflow-wrap:anywhere}
.md-df{display:flex;gap:var(--sp-2);padding:var(--sp-4);border-block-start:1px solid var(--c-border);flex-wrap:wrap}.md-df .m-btn{flex:1}
.md-usb{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:var(--sp-4);align-items:center;padding:var(--sp-5)}
.md-usb>.ic{inline-size:44px;block-size:44px;padding:10px;box-sizing:content-box;border-radius:var(--r-lg);background:color-mix(in oklch,var(--c-success) 14%,transparent);color:var(--c-success-ink)}
.md-usb .bar{margin-block-start:8px}
.md-uf{display:grid;grid-template-columns:auto 56px minmax(0,1fr) auto;gap:var(--sp-3);align-items:center;min-block-size:56px;padding-block:6px;border-block-start:1px dashed var(--c-border);cursor:pointer}
.md-uf input{inline-size:20px;block-size:20px;accent-color:var(--c-primary)}
.md-uf .th{inline-size:56px;aspect-ratio:16/10;border-radius:6px;background:var(--c-surface-neutral);display:grid;place-items:center;overflow:hidden;color:var(--c-text-secondary)}.md-uf .th img{inline-size:100%;block-size:100%;object-fit:cover}
.md-uf b{font:var(--fw-semibold) .8125rem/1.3 var(--font-mono);direction:ltr;text-align:start;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.md-uf small{font:var(--fw-bold) .75rem/1 var(--font-mono);color:var(--c-text-secondary)}
@container main (max-width:899px){.md{grid-template-columns:minmax(0,1fr)}.md-fold{position:static;display:flex;overflow-x:auto;scrollbar-width:none;gap:var(--sp-2)}.md-fold button{flex:none;border:1px solid var(--c-border);border-radius:var(--r-pill)}}
@container main (max-width:599px){.md-usb{grid-template-columns:auto minmax(0,1fr)}.md-usb>.m-btn{grid-column:1/-1}.md-top .m-btn span{display:none}.md-top .md-iso{order:-1;flex-basis:100%;justify-content:flex-start;inline-size:max-content;max-inline-size:100%}}
}
@layer components.app{
.ds.g,.ds .g,.bnr,.ds .list{grid-template-columns:minmax(0,1fr)}
.ds .li .tx small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ds .m-btn-sm,.ds .pill,.ds .gd-mb{position:relative}
.ds .m-btn-sm::before,.ds .pill::before,.ds .gd-mb::before{content:"";position:absolute;inset-block:-7px;inset-inline:0}
/* nf in dark: brand fill turns light, so text on it and brand-coloured text need dark/neutral ink (shell only swaps --c-primary) */
[data-color-scheme=dark][data-tenant=nf] :is(.ds,.cp-ov,.gd-dlg){--c-primary-contrast:var(--c-grey-900);--c-primary-ink:var(--c-primary)}
:is(.ds,.cp-ov,.gd-dlg) .m-label-soft-default{color:var(--c-text)}
.ds kbd{font:var(--fw-bold) .6875rem/1 var(--font-mono);padding:3px 6px;border-radius:var(--r-xs);background:var(--c-surface-neutral);border:1px solid var(--c-border);color:var(--c-text-secondary)}
.ds .fld{display:grid;gap:6px}.ds .fld>span{font-weight:var(--fw-semibold);font-size:.875rem;color:var(--c-text-secondary);display:flex;gap:8px;align-items:baseline;justify-content:space-between}
.ds .fld input,.ds .fld textarea,.ds .fld select,.ds select,.bn-brief,.sc-form input,.gd-q{border:1px solid var(--c-border-input,var(--c-border));border-radius:var(--r-sm);padding:10px 12px;font:inherit;font-size:.9375rem;background:var(--c-surface);color:var(--c-text);min-block-size:44px;inline-size:100%;min-inline-size:0;resize:vertical}
.bn-brief:focus,.ds .fld input:focus,.ds .fld textarea:focus,.gd-q:focus,.sc-form input:focus{outline:2px solid var(--c-primary);outline-offset:-1px}
.ds .over{color:var(--c-error-ink)}
.seg{display:inline-flex;padding:3px;gap:2px;border-radius:var(--r-md);background:var(--c-surface-neutral);flex-wrap:wrap}
.seg button{border:0;background:none;border-radius:calc(var(--r-md) - 3px);min-block-size:38px;padding-inline:12px;font-size:.8125rem;font-weight:var(--fw-semibold);color:var(--c-text-secondary);position:relative;transition:background var(--dur-fast) var(--ease)}
.seg button::before{content:"";position:absolute;inset-block:-3px;inset-inline:0}
.seg button[aria-pressed=true]{background:var(--c-surface);color:var(--c-text);box-shadow:var(--shadow-z1)}

/* social */
.so{display:grid;gap:var(--sp-4);grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);grid-template-areas:"story prev" "ang prev" "tpl prev" "txt prev" "hist prev";align-items:start}
.so-a-story{grid-area:story}.so-a-prev{grid-area:prev;position:sticky;inset-block-start:var(--sp-4)}.so-a-ang{grid-area:ang}.so-a-tpl{grid-area:tpl}.so-a-txt{grid-area:txt}.so-a-hist{grid-area:hist}
.so-n{display:grid;place-items:center;inline-size:24px;block-size:24px;border-radius:50%;background:var(--c-text);color:var(--c-surface);font-size:.75rem;font-weight:var(--fw-bold);flex:none}
.so-stories{display:grid;padding:var(--sp-3) var(--sp-3) var(--sp-4);gap:2px;max-block-size:330px;overflow:auto}
.so-st{display:flex;gap:var(--sp-3);align-items:center;border:0;background:none;border-radius:var(--r-md);padding:var(--sp-2);text-align:start;min-block-size:60px;transition:background var(--dur-fast) var(--ease)}
.so-st:hover{background:var(--c-state-hover)}.so-st[aria-selected=true]{background:color-mix(in oklch,var(--c-primary) 10%,transparent);box-shadow:inset 0 0 0 1.5px var(--c-primary)}
.so-st img{inline-size:64px;block-size:44px;object-fit:cover;border-radius:var(--r-sm);flex:none}
.so-st span{display:grid;min-inline-size:0}.so-st small{font-size:.75rem;color:var(--c-primary-ink);font-weight:var(--fw-bold)}.so-st b{font-size:.875rem;font-weight:var(--fw-semibold);line-height:1.35;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.so-angs{display:grid;gap:var(--sp-2);padding:var(--sp-3) var(--sp-5) var(--sp-5)}
.so-ang{display:flex;gap:var(--sp-3);align-items:center;border:1px solid var(--c-border);background:var(--c-surface);border-radius:var(--r-md);padding:var(--sp-3);text-align:start;min-block-size:56px;transition:border-color var(--dur-fast) var(--ease)}
.so-ang i{display:grid;place-items:center;inline-size:36px;block-size:36px;border-radius:var(--r-sm);background:var(--c-surface-neutral);font-style:normal;font-weight:var(--fw-extrabold);flex:none}
.so-ang span{display:grid;min-inline-size:0;gap:2px}.so-ang b{font-size:.9375rem;display:flex;gap:6px;align-items:center}.so-ang small{font-size:.8125rem;color:var(--c-text-secondary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.so-ang em{font-style:normal}
.so-ang[aria-pressed=true]{border-color:var(--c-primary);box-shadow:0 0 0 1px var(--c-primary)}.so-ang[aria-pressed=true] i{background:var(--c-primary);color:var(--c-primary-contrast)}
.so-tpls{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:var(--sp-2);padding:var(--sp-3) var(--sp-5) var(--sp-5)}
.so-tp{display:grid;gap:6px;border:0;background:none;padding:0;text-align:center;font-size:.75rem;font-weight:var(--fw-semibold);color:var(--c-text-secondary);min-inline-size:0}
.so-tp .fr{border-radius:var(--r-sm);outline:2px solid transparent;outline-offset:2px;transition:outline-color var(--dur-fast) var(--ease)}
.so-tp[aria-pressed=true]{color:var(--c-text)}.so-tp[aria-pressed=true] .fr{outline-color:var(--c-primary)}
.so-tp span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.so-form{display:grid;gap:var(--sp-3);padding:var(--sp-3) var(--sp-5) var(--sp-5)}
.so-cnt{font-weight:var(--fw-medium);color:var(--c-text-secondary)}
.so-img{display:flex;gap:var(--sp-3);align-items:center;padding:var(--sp-2);border-radius:var(--r-md);background:var(--c-surface-neutral)}
.so-img img{inline-size:72px;block-size:48px;border-radius:var(--r-sm);object-fit:cover;flex:none}.so-img div{flex:1;display:grid;min-inline-size:0}.so-img b{font-size:.8125rem}.so-img small{font-size:.75rem}
.so-pv{display:grid;gap:var(--sp-3);padding:var(--sp-4)}
.so-fmts{display:flex;gap:6px;flex-wrap:wrap;justify-content:center}
.so-stage{display:grid;place-items:center;background:var(--c-surface-neutral);border-radius:var(--r-lg);padding:var(--sp-5) var(--sp-3);min-block-size:420px}
.so-meta{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;font-size:.8125rem;color:var(--c-text-secondary)}
.so-out{display:grid;gap:6px;justify-items:center}.so-outs{display:flex;gap:6px;flex-wrap:wrap;justify-content:center}.so-outs .pill{min-block-size:30px;font-size:.75rem}
.so-go{display:flex;gap:var(--sp-2)}.so-go select{inline-size:auto;flex:none;max-inline-size:44%}.so-go .m-btn{flex:1}
/* frame (the image itself) */
.fr,.bn{color-scheme:light;--c-primary:var(--tenant);--c-primary-contrast:var(--c-white);--c-primary-ink:color-mix(in oklch,var(--tenant) 82%,black)}
.fr{position:relative;overflow:hidden;container-type:inline-size;aspect-ratio:1;background:var(--c-tape);color:var(--c-on-media);inline-size:100%;isolation:isolate;text-align:start}
.fr-story,.fr-tiktok{aspect-ratio:9/16}.fr-x{aspect-ratio:16/9}.fr-wa{aspect-ratio:1.91}
.fr-img{position:absolute;inset:0;background:var(--img) center/cover;z-index:-2}
.fr-sc{position:absolute;inset:0;background:linear-gradient(to top,var(--c-scrim-media) 8%,color-mix(in oklch,var(--c-scrim-media) 55%,transparent) 45%,transparent 75%);z-index:-1}
.fr::after,.bn-in::after{content:"";position:absolute;inset-inline:0;inset-block-start:0;block-size:30%;background:linear-gradient(to bottom,oklch(0% 0 0 / .6),transparent);z-index:-1;pointer-events:none}
.fr-minimal::after,.bn-in::after{display:none}.bn-box .bn-in::after,.bn-tall .bn-in::after{display:block}
.fr-top{position:absolute;inset-block-start:5cqi;inset-inline:5cqi;display:flex;justify-content:space-between;align-items:center}
.fr-logo{display:flex;align-items:center;gap:1.6cqi;font-weight:var(--fw-extrabold);font-size:3.6cqi;letter-spacing:-.01em}
.fr-logo i{display:grid;place-items:center;min-inline-size:6cqi;block-size:6cqi;padding-inline:1cqi;border-radius:1cqi;background:var(--c-primary);color:var(--c-primary-contrast);font-style:normal;font-size:3cqi}
.fr-live{font:var(--fw-bold) 3cqi/1 var(--font-body);padding:1.2cqi 2cqi;border-radius:var(--r-pill);border:1px solid color-mix(in oklch,var(--c-on-media) 50%,transparent);animation:frl 1.6s var(--ease) infinite}
@keyframes frl{50%{opacity:.45}}
.fr-body{position:absolute;inset-inline:5cqi;inset-block-end:6cqi;display:grid;gap:1.6cqi;justify-items:start}
.fr-kick{font-size:3.2cqi;font-weight:var(--fw-bold);padding:.8cqi 2cqi;border-radius:.8cqi;background:var(--c-primary);color:var(--c-primary-contrast)}
.fr-h{font-size:7.4cqi;line-height:1.12;font-weight:var(--fw-extrabold);letter-spacing:-.01em;text-wrap:balance}
.fr-sub{font-size:3.6cqi;line-height:1.35;opacity:.85}
.fr-cr{font-size:2.4cqi;opacity:.85}
.fr-bar{position:absolute;inset-inline:0;inset-block-end:0;block-size:1.4cqi;background:var(--c-primary)}
.fr-stripe{position:absolute;inset-inline:0;inset-block-end:0;block-size:1.4cqi;background:linear-gradient(90deg,oklch(85% .17 95),oklch(80% .15 195),oklch(70% .2 145),oklch(62% .25 330),oklch(60% .24 25),oklch(50% .2 265))}
.fr-story .fr-h,.fr-tiktok .fr-h{font-size:9cqi}.fr-x .fr-h,.fr-wa .fr-h{font-size:5cqi}.fr-x .fr-kick,.fr-wa .fr-kick{font-size:2.2cqi}.fr-x .fr-logo,.fr-wa .fr-logo{font-size:2.6cqi}.fr-x .fr-body,.fr-wa .fr-body{inset-block-end:4cqi;gap:1cqi}.fr-x .fr-cr,.fr-wa .fr-cr{font-size:1.6cqi}
.fr-story .fr-body,.fr-tiktok .fr-body{inset-block-end:14cqi}
.fr-breaking .fr-kick{background:var(--c-error-dark);color:var(--c-on-media)}
.fr-breaking .fr-h{background:var(--c-scrim-media);padding:1.4cqi 2cqi;margin-inline:-2cqi;box-decoration-break:clone;-webkit-box-decoration-break:clone}
.fr-quote .fr-img{inset-block-end:45%;opacity:.55}.fr-quote .fr-sc{background:linear-gradient(to top,var(--c-tape) 55%,transparent)}
.fr-q{font:var(--fw-extrabold) 18cqi/0.6 Georgia,serif;color:var(--c-on-media);block-size:8cqi}
.fr-quote .fr-h{font-size:6.2cqi}.fr-who{font-size:3.4cqi;font-weight:var(--fw-semibold);opacity:.8}
.fr-number .fr-sc{background:linear-gradient(to top,var(--c-scrim-media) 30%,color-mix(in oklch,var(--c-scrim-media) 40%,transparent))}
.fr-big{font-size:22cqi;line-height:.95;font-weight:var(--fw-extrabold);letter-spacing:-.03em;color:var(--c-on-media);font-variant-numeric:tabular-nums}
.fr-number .fr-sub{font-size:4.6cqi;opacity:1;font-weight:var(--fw-semibold)}
.fr-split .fr-img{inset-block-end:42%}.fr-split .fr-sc{display:none}.fr-split .fr-body{inset:58% 0 0;padding:3cqi 5cqi 4cqi;background:var(--c-grey-50);align-content:center}.fr-split .fr-body{color:var(--c-grey-900)}.fr-split .fr-h{font-size:6.4cqi}
.fr-lower .fr-sc{background:linear-gradient(to top,var(--c-scrim-media),transparent 40%)}.fr-lower .fr-body{inset-inline:0;inset-block-end:0;padding:3cqi 5cqi 4.5cqi;background:var(--c-primary);color:var(--c-primary-contrast)}.fr-lower .fr-kick{background:var(--c-scrim-media);color:var(--c-on-media)}.fr-lower .fr-h{font-size:5.8cqi}
.fr-minimal{background:var(--c-grey-50);color:var(--c-grey-900)}.fr-minimal .fr-img{inset-block:auto 5cqi;inset-inline:auto 5cqi;inline-size:34%;aspect-ratio:1;border-radius:2cqi}.fr-minimal .fr-sc{display:none}
.fr-minimal .fr-body{inset-block-start:20cqi;inset-block-end:auto;inset-inline-end:5cqi}.fr-minimal .fr-h{font-size:7cqi}.fr-minimal .fr-kick{background:none;color:var(--c-primary-ink);padding:0;font-size:3.6cqi}.fr-minimal .fr-cr{opacity:.55}
.fr-question .fr-sc{background:linear-gradient(to top,color-mix(in oklch,var(--c-primary) 92%,black) 30%,color-mix(in oklch,var(--c-primary) 40%,transparent))}.fr-question .fr-kick{background:var(--c-on-media);color:var(--c-grey-900)}.fr-question .fr-h{font-size:8.4cqi}
.fr-explainer .fr-sc{background:linear-gradient(to top,var(--c-scrim-media) 45%,transparent 90%)}.fr-explainer .fr-sub{border-inline-start:1cqi solid var(--c-primary);padding-inline-start:2.4cqi}
/* network chrome */
.pv{background:var(--c-surface);color:var(--c-text);border-radius:var(--r-lg);box-shadow:var(--shadow-z8);overflow:hidden;inline-size:min(100%,400px);font-size:.8125rem}
.pv-h{display:flex;gap:8px;align-items:center;padding:10px 12px}.pv-h .tn-av{inline-size:30px;block-size:30px;font-size:.6875rem}.pv-h b{font-size:.8125rem}
.pv-ac{display:flex;gap:14px;padding:10px 12px 4px}
.pv-cap{padding:4px 12px 12px;line-height:1.45;margin:0;white-space:pre-wrap;overflow-wrap:anywhere}
.pv-story,.pv-tiktok{inline-size:min(100%,280px);position:relative;border-radius:22px;background:var(--c-tape)}
.pv-prog{position:absolute;inset-block-start:8px;inset-inline:10px;display:flex;gap:4px;z-index:2}.pv-prog i{flex:1;block-size:3px;border-radius:2px;background:color-mix(in oklch,var(--c-on-media) 40%,transparent)}.pv-prog i:first-child{background:var(--c-on-media)}
.pv-story .fr-top{inset-block-start:9cqi}
.pv-reply{position:absolute;inset-block-end:12px;inset-inline:12px;border:1px solid color-mix(in oklch,var(--c-on-media) 55%,transparent);border-radius:var(--r-pill);padding:9px 14px;color:var(--c-on-media);font-size:.75rem}
.pv-x{inline-size:min(100%,480px)}.pv-x .pv-cap{padding-block:0 10px}.pv-x .fr{inline-size:calc(100% - 24px);margin:0 12px 12px;border-radius:var(--r-lg)}
.pv-wa{background:none;box-shadow:none;inline-size:min(100%,380px)}
.pv-bub{background:color-mix(in oklch,var(--c-success) 16%,var(--c-surface));border-radius:var(--r-lg);border-start-end-radius:4px;padding:5px;display:grid;gap:2px;box-shadow:var(--shadow-z1)}
.pv-bub .fr{border-radius:calc(var(--r-lg) - 4px)}.pv-wat{padding:6px 8px 0;font-size:.875rem}.pv-dom{padding:0 8px;color:var(--c-text-secondary);font-size:.75rem;text-align:start}.pv-bub .pv-cap{padding:4px 8px 0}.pv-tm{justify-self:end;padding:0 8px 4px;font-size:.6875rem;color:var(--c-text-secondary)}
.pv-rail{position:absolute;inset-inline-end:8px;inset-block-end:90px;display:grid;gap:14px;color:var(--c-on-media);justify-items:center}.pv-rail span{display:grid;justify-items:center;font-size:.625rem;font-weight:var(--fw-bold)}
.pv-tcap{position:absolute;inset-inline:12px 52px;inset-block-end:12px;color:var(--c-on-media);font-size:.75rem;line-height:1.4;margin:0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.pv-tiktok .fr-body{inset-inline-end:16cqi;inset-block-end:24cqi}

/* banners */
.bnr{display:grid;gap:var(--sp-4)}
.bn-bar{gap:var(--sp-3)}.bn-proj{display:grid}.bn-proj b{font-size:1.0625rem}
.bn-grid{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:var(--sp-4);align-items:start}
.bn-side{position:sticky;inset-block-start:var(--sp-4)}
.bn-player{display:flex;align-items:center;gap:var(--sp-3);padding:var(--sp-3) var(--sp-4);transition:opacity var(--dur-normal) var(--ease)}
.bn-player.off{opacity:.45;pointer-events:none}
.bn-pp{inline-size:48px;block-size:48px;border-radius:50%;border:0;background:var(--c-text);color:var(--c-surface);display:grid;place-items:center;flex:none}
.bn-scr{flex:1;min-inline-size:0;accent-color:var(--c-primary);block-size:44px}
.bn-time{font-size:.75rem;color:var(--c-text-secondary);flex:none}
.bn-view{min-inline-size:0}
.bn-sizes{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:var(--sp-5) var(--sp-4);align-items:start}
.bn-fig{margin:0;display:grid;gap:8px;min-inline-size:0}
.bn-f-wide,.bn-f-strip[data-size="728x90"]{grid-column:1/-1}
.bn-f-box{grid-column:span 3}.bn-f-tall{grid-column:span 3;grid-row:span 3}.bn-f-strip[data-size="320x100"],.bn-f-mini{grid-column:span 3}
.bn-fig figcaption{display:flex;gap:8px;font-size:.8125rem;color:var(--c-text-secondary)}.bn-fig figcaption b{color:var(--c-text);font-weight:var(--fw-semibold)}
.bn-slot{position:relative;inline-size:100%;overflow:hidden;border-radius:var(--r-sm);box-shadow:0 0 0 1px var(--c-border)}
.bn-f-tall .bn-slot{max-inline-size:300px}
.bn{position:absolute;inset-block-start:0;inset-inline-start:0;transform-origin:0 0;overflow:hidden;background:var(--c-tape);color:var(--c-on-media);font-family:var(--font-body);--t:0;isolation:isolate}
.bn-in{position:absolute;inset:0;isolation:isolate}
[data-tenant=nf] .bn-cta{background:var(--c-on-media);color:var(--c-grey-900)}[data-tenant=nf] .bn-kick{color:var(--c-on-media);opacity:.75}
.bn-img{position:absolute;inset:0;background:var(--img) center/cover;z-index:-2;transform:scale(calc(1.04 + var(--t) * .08));transition:transform var(--dur-fast) linear}
.bn-sc{position:absolute;inset:0;z-index:-1;background:linear-gradient(270deg,var(--c-scrim-media) 30%,color-mix(in oklch,var(--c-scrim-media) 60%,transparent) 60%,transparent)}
.bn-in[dir=ltr] .bn-sc{background:linear-gradient(90deg,var(--c-scrim-media) 30%,color-mix(in oklch,var(--c-scrim-media) 60%,transparent) 60%,transparent)}
.bn-box .bn-in .bn-sc,.bn-tall .bn-in .bn-sc{background:linear-gradient(to top,var(--c-scrim-media) 45%,transparent 85%)}
.bn-logo{position:absolute;display:flex;align-items:center;gap:6px;font-weight:var(--fw-extrabold);font-size:calc(var(--fs) * .55);inset-block-start:calc(var(--fs) * .4);inset-inline-start:calc(var(--fs) * .5);transition:opacity var(--dur-slow) var(--ease),transform var(--dur-slow) var(--ease)}
.bn-logo b,.fr-logo{text-shadow:0 1px 8px color-mix(in oklch,var(--c-scrim-media) 70%,transparent)}
.bn-logo i{display:grid;place-items:center;min-inline-size:1.6em;block-size:1.6em;padding-inline:.3em;border-radius:4px;background:var(--c-primary);color:var(--c-primary-contrast);font-style:normal;font-size:.8em}
.bn-tx{position:absolute;inset-inline:calc(var(--fs) * .5) 40%;inset-block-end:calc(var(--fs) * .6);display:grid;gap:calc(var(--fs) * .18);justify-items:start}
.bn-kick{font-size:calc(var(--fs) * .36);font-weight:var(--fw-bold);color:var(--c-primary-light);letter-spacing:.02em}
.bn-h{font-size:var(--fs);line-height:1.08;font-weight:var(--fw-extrabold);letter-spacing:-.01em;text-wrap:balance}
.bn-sub{font-size:calc(var(--fs) * .4);opacity:.85;line-height:1.3}
.bn-cta{position:absolute;inset-inline-end:calc(var(--fs) * .5);inset-block-end:calc(var(--fs) * .6);background:var(--c-primary);color:var(--c-primary-contrast);font-weight:var(--fw-bold);font-size:calc(var(--fs) * .4);padding:.55em 1.1em;border-radius:var(--r-pill);white-space:nowrap}
.bn-cd{position:absolute;inset-inline-end:calc(var(--fs) * .5);inset-block-start:calc(var(--fs) * .45);display:none;gap:calc(var(--fs) * .14)}
.bn-cd{font-size:calc(var(--fs) * .5)}
.bn-cd span{display:grid;justify-items:center;background:color-mix(in oklch,var(--c-scrim-media) 70%,transparent);border:1px solid color-mix(in oklch,var(--c-on-media) 22%,transparent);border-radius:4px;padding:.2em .3em;min-inline-size:2em}
.bn-cd b{font:var(--fw-bold) 1em/1 var(--font-mono)}.bn-cd small{font-size:.42em;opacity:.7}
.bn-live{position:absolute;inset-inline-end:calc(var(--fs) * .5);inset-block-start:calc(var(--fs) * .45);display:none;font-weight:var(--fw-bold);font-size:calc(var(--fs) * .36);background:var(--c-error);color:var(--c-on-media);padding:.3em .7em;border-radius:var(--r-pill);animation:frl 1.4s var(--ease) infinite}
.bn .fr-stripe{block-size:3px}
.bn-strip .bn-tx{inset-block:0;inset-inline:calc(var(--fs) * 4.4) calc(var(--fs) * 5.6);align-content:center;gap:2px}.bn-strip .bn-sub{display:none}
.bn-strip .bn-logo{inset-block:0;inset-block-start:0}.bn-strip .bn-cta{inset-block-end:auto;inset-block-start:50%;translate:0 -50%}
.bn-strip .bn-cd{inset-block-start:50%;translate:0 -50%;inset-inline-end:calc(var(--fs) * 6.4)}.bn-strip .bn-live{inset-block-start:50%;translate:0 -50%;inset-inline-end:calc(var(--fs) * 6)}
.bn-mini .bn-tx{inset-block:0;inset-inline:calc(var(--fs) * 2.6) calc(var(--fs) * 6.4);align-content:center}.bn-mini .bn-kick,.bn-mini .bn-sub,.bn-mini .bn-logo b{display:none}.bn-mini .bn-logo{inset-block:0;inset-block-start:0}
.bn-mini .bn-cta{inset-block-end:auto;inset-block-start:50%;translate:0 -50%;font-size:calc(var(--fs) * .8)}.bn-mini .bn-h{font-size:calc(var(--fs) * 1.05)}
.bn-mini .bn-cd,.bn-mini .bn-live{inset-block-start:50%;translate:0 -50%;inset-inline-end:calc(var(--fs) * 6.6)}
.bn-box .bn-tx,.bn-tall .bn-tx{inset-inline:calc(var(--fs) * .55);inset-block-end:calc(var(--fs) * 2.3)}.bn-box .bn-cta,.bn-tall .bn-cta{inset-inline-start:calc(var(--fs) * .55);inset-inline-end:auto}
.bn-tall .bn-cd{inset-block-start:calc(var(--fs) * 1.7);inset-inline-start:calc(var(--fs) * .55);inset-inline-end:auto}
.bn[data-mode=count].bn-strip .bn-tx{inset-inline-end:calc(var(--fs) * 12)}.bn[data-mode=live].bn-strip .bn-tx{inset-inline-end:calc(var(--fs) * 14)}
.bn[data-mode=count].bn-s320 .bn-cta,.bn[data-mode=live].bn-s320 .bn-live{display:none}
.bn[data-mode=count].bn-s320 .bn-cd{inset-inline-end:calc(var(--fs) * .4)}.bn[data-mode=count].bn-s320 .bn-tx{inset-inline-end:calc(var(--fs) * 5.4)}
.bn[data-mode=live].bn-s320 .bn-tx{inset-inline-end:calc(var(--fs) * 5.8)}.bn[data-mode=live] .bn-cta{background:var(--c-error);color:var(--c-on-media)}.bn-box .bn-sub{display:none}
.bn-box .bn-cd{inset-block-start:calc(var(--fs) * 1.7);inset-inline-start:calc(var(--fs) * .55);inset-inline-end:auto}
/* timeline phases */
.bn[data-mode=anim] .bn-kick,.bn[data-mode=anim] .bn-h,.bn[data-mode=anim] .bn-sub,.bn[data-mode=anim] .bn-cta{transition:opacity var(--dur-slower) var(--ease),transform var(--dur-slower) var(--ease)}
.bn[data-ph="0"] .bn-h,.bn[data-ph="0"] .bn-sub,.bn[data-ph="0"] .bn-cta,.bn[data-ph="1"] .bn-sub,.bn[data-ph="1"] .bn-cta{opacity:0;transform:translateY(12px)}
.bn[data-ph="0"] .bn-logo{transform:scale(1.15)}
.bn[data-ph="3"] .bn-cta{animation:bncta 1.2s var(--ease) infinite}
@keyframes bncta{50%{transform:scale(1.06)}}
.bn[data-mode=count] .bn-cd{display:flex}.bn[data-mode=live] .bn-live{display:block}
.bn[data-mode=live] .bn-h{color:var(--c-on-media)}
/* placements */
.pl-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr)) minmax(0,.6fr);gap:var(--sp-4);align-items:start}
.pl{margin:0;display:grid;gap:8px;min-inline-size:0}.pl figcaption{font-size:.8125rem;font-weight:var(--fw-semibold);color:var(--c-text-secondary)}
.pl-page,.pl-phone{background:var(--c-surface);border:1px solid var(--c-border);border-radius:var(--r-md);padding:10px;display:grid;gap:8px;align-content:start}
.pl-phone{border-radius:22px;padding:12px 8px;position:relative;padding-block-end:34px;max-inline-size:240px;justify-self:center;inline-size:100%}
.pl-nav{block-size:22px;border-radius:4px;background:var(--c-surface-neutral);display:flex;align-items:center;padding-inline:8px;font-size:.6875rem}
.pl-cols{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1fr);gap:8px}.pl-cols>div{display:grid;gap:6px;align-content:start}
.pl-hero{display:block;block-size:56px;border-radius:4px;background:var(--c-surface-neutral)}.pl-title{display:block;block-size:12px;inline-size:80%;border-radius:4px;background:var(--c-grey-400)}
.pl-ln{display:block;block-size:6px;border-radius:3px;background:var(--c-surface-neutral)}.pl-ln.s{inline-size:60%}
.pl-sticky{position:absolute;inset-inline:8px;inset-block-end:8px}
.bn-code{margin:0;padding:var(--sp-4);border-radius:var(--r-md);background:var(--c-tape);color:var(--c-tape-ink);font-size:.75rem;line-height:1.6;white-space:pre-wrap;overflow-wrap:anywhere;text-align:start}
.bn-stats{justify-content:space-around;padding:var(--sp-2)}.bn-stats .kpi{padding:var(--sp-3);justify-items:center}
.bn-fields .fld input{min-block-size:46px}
.bn-nl{margin:0;padding-inline-start:18px;font-size:.8125rem;color:var(--c-success-ink);display:grid;gap:2px}

/* campaigns */
.cp-filter{gap:6px}.cp-dot{background:oklch(62% .16 var(--h))}.cp-dot{inline-size:8px;block-size:8px;border-radius:50%}
.cp-board{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--sp-3);align-items:start}
.cp-col{background:var(--c-surface-neutral);border-radius:var(--r-lg);padding:var(--sp-3);display:grid;gap:var(--sp-2);min-block-size:160px;align-content:start}
.cp-col header{display:flex;justify-content:space-between;align-items:center;padding:2px 4px 4px}.cp-col header b{font-size:.875rem;color:var(--c-text-secondary);font-variant-numeric:tabular-nums}
.cp-card{display:grid;gap:4px;text-align:start;border:0;background:var(--c-surface);border-radius:var(--r-md);padding:var(--sp-2) var(--sp-2) var(--sp-3);box-shadow:var(--shadow-card);transition:transform var(--dur-fast) var(--ease),box-shadow var(--dur-fast) var(--ease)}
.cp-card:hover{transform:translateY(-2px);box-shadow:var(--shadow-z8)}
.cp-card>b{font-size:.9375rem;padding-inline:4px;line-height:1.3}.cp-card>small{font-size:.75rem;color:var(--c-text-secondary);padding-inline:4px}
.cp-meta{display:flex;justify-content:space-between;font-size:.75rem;color:var(--c-text-secondary);font-variant-numeric:tabular-nums;padding-inline:4px;margin-block-start:4px}
.cp-th{position:relative;aspect-ratio:3.2;border-radius:var(--r-sm);overflow:hidden;background:var(--img) center/cover;margin-block-end:6px;isolation:isolate}
.cp-th::before{content:"";position:absolute;inset:0;background:linear-gradient(270deg,color-mix(in oklch,oklch(30% .1 var(--h)) 92%,transparent) 40%,transparent);z-index:-1}
[dir=ltr] .cp-th::before{background:linear-gradient(90deg,color-mix(in oklch,oklch(30% .1 var(--h)) 92%,transparent) 40%,transparent)}
.cp-th span{position:absolute;inset:0;display:grid;align-content:center;padding-inline:10px;color:var(--c-on-media);max-inline-size:70%}.cp-th b{font-size:.8125rem;font-weight:var(--fw-extrabold)}.cp-th small{font-size:.625rem;opacity:.8;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cp-th-l{aspect-ratio:auto;block-size:150px;margin:0}.cp-th-l b{font-size:1.125rem}.cp-th-l small{font-size:.75rem}
.cp-empty{border:1px dashed var(--c-border-strong);border-radius:var(--r-md);padding:var(--sp-4);text-align:center;font-size:.875rem;color:var(--c-text-secondary)}
.cp-av{inline-size:40px;block-size:40px;border-radius:50%;display:grid;place-items:center;background:light-dark(oklch(93% .05 var(--h)),oklch(36% .08 var(--h)));color:light-dark(oklch(36% .12 var(--h)),oklch(93% .05 var(--h)));font-weight:var(--fw-bold);flex:none}
.cp-pr .tx{display:grid;gap:6px}.cp-pr .mono{font-size:.8125rem;font-weight:var(--fw-bold)}
.cp-tw tbody tr{cursor:pointer}.cp-tw tbody tr:hover td{background:var(--c-state-hover)}.cp-tw{padding:var(--sp-3) var(--sp-4) var(--sp-4)}
.cp-scrim{position:fixed;inset:0;background:var(--c-overlay);z-index:1280;opacity:0;pointer-events:none;transition:opacity var(--dur-normal) var(--ease)}.cp-scrim.on{opacity:1;pointer-events:auto}
.cp-dr{position:fixed;inset-block:0;inset-inline-end:0;inline-size:min(440px,100vw);background:var(--c-surface);box-shadow:var(--shadow-dialog);z-index:1290;display:flex;flex-direction:column;transform:translateX(105%);visibility:hidden;transition:transform var(--dur-slower) var(--ease),visibility 0s var(--dur-slower);padding-block-start:env(safe-area-inset-top,0px)}
[dir=rtl] .cp-dr{transform:translateX(-105%)}
.cp-dr.on{transform:none;visibility:visible;transition:transform var(--dur-slower) var(--ease)}
.cp-dh{display:flex;gap:var(--sp-3);align-items:flex-start;justify-content:space-between;padding:var(--sp-5);border-block-end:1px solid var(--c-border)}
.cp-db{flex:1;overflow:auto;padding:var(--sp-5)}
.cp-dl{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--sp-3);margin:0}.cp-dl div{background:var(--c-surface-neutral);border-radius:var(--r-md);padding:var(--sp-3)}.cp-dl dt{font-size:.75rem;color:var(--c-text-secondary)}.cp-dl dd{margin:0;font-weight:var(--fw-bold)}
.cp-sz{gap:6px;margin-block-start:8px}
.cp-tl{list-style:none;margin:8px 0 0;padding:0;display:grid}.cp-tl li{display:flex;justify-content:space-between;gap:8px;padding-block:8px;padding-inline-start:22px;position:relative;color:var(--c-text-secondary);font-size:.875rem}
.cp-tl li::before{content:"";position:absolute;inset-inline-start:4px;inset-block-start:13px;inline-size:10px;block-size:10px;border-radius:50%;border:2px solid var(--c-border-strong);background:var(--c-surface)}
.cp-tl li::after{content:"";position:absolute;inset-inline-start:9px;inset-block:25px -5px;inline-size:2px;background:var(--c-border)}.cp-tl li:last-child::after{display:none}
.cp-tl li.done{color:var(--c-text)}.cp-tl li.done::before{background:var(--c-success);border-color:var(--c-success)}
.cp-df{display:flex;gap:var(--sp-2);padding:var(--sp-4) var(--sp-5) max(var(--sp-4),env(safe-area-inset-bottom,0px));border-block-start:1px solid var(--c-border);flex-wrap:wrap}.cp-df .m-btn{flex:1}

/* scraping */
.sc-top{gap:var(--sp-3);align-items:end}.sc-tabs{flex:1;min-inline-size:0}
.sc-badge{font-size:.6875rem;background:var(--c-primary);color:var(--c-primary-contrast);border-radius:var(--r-pill);padding:1px 7px;margin-inline-start:4px}
.sc-k{display:grid;gap:var(--sp-4);grid-template-columns:repeat(5,minmax(0,1fr))}
.sc-dot{inline-size:10px;block-size:10px;border-radius:50%;background:var(--c-success);flex:none;box-shadow:0 0 0 4px color-mix(in oklch,var(--c-success) 18%,transparent)}.sc-dot.warn{background:var(--c-warning);box-shadow:0 0 0 4px color-mix(in oklch,var(--c-warning) 18%,transparent)}
.sc-form{display:flex;gap:var(--sp-2)}.sc-form input{flex:1}
.sc-steps{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.sc-steps li{display:flex;gap:10px;align-items:center;font-size:.875rem;color:var(--c-text-disabled)}
.sc-steps li::before{content:"";inline-size:14px;block-size:14px;border-radius:50%;border:2px solid var(--c-border-strong);flex:none;box-sizing:border-box}
.sc-steps li.on{color:var(--c-text);font-weight:var(--fw-semibold)}.sc-steps li.on::before{border-color:var(--c-primary);border-block-start-color:transparent;animation:scspin .8s linear infinite}
.sc-steps li.err{color:var(--c-error-ink);font-weight:var(--fw-semibold)}.sc-steps li.err::before{background:var(--c-error);border-color:var(--c-error)}
.sc-steps li.done{color:var(--c-text-secondary)}.sc-steps li.done::before{background:var(--c-success);border-color:var(--c-success)}
@keyframes scspin{to{transform:rotate(1turn)}}
.sc-res{display:flex;gap:var(--sp-3);align-items:center;justify-content:space-between;padding:var(--sp-3);border-radius:var(--r-md);background:color-mix(in oklch,var(--c-success) 10%,transparent);margin-block-start:var(--sp-3);flex-wrap:wrap}.sc-res div{display:grid;min-inline-size:0}.sc-res small{color:var(--c-text-secondary);font-size:.8125rem}
.sc-err{color:var(--c-error-ink);font-size:.875rem}
.sc-srcs{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,300px),1fr));gap:var(--sp-3)}
.sc-src{padding:var(--sp-4);display:grid;gap:var(--sp-3)}
.sc-src header{display:flex;gap:var(--sp-3);align-items:center}.sc-src .tx{flex:1;min-inline-size:0;display:grid}.sc-src .tx b{font-size:.9375rem}.sc-src .tx small{font-size:.75rem;color:var(--c-text-secondary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:start}
.sc-eng{display:grid;place-items:center;inline-size:38px;block-size:38px;border-radius:var(--r-md);background:color-mix(in oklch,var(--c-primary) 10%,transparent);color:var(--c-primary-ink);flex:none}
.sc-src dl{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px var(--sp-3);margin:0;padding:var(--sp-3);border-radius:var(--r-md);background:var(--c-surface-neutral)}
.sc-src dt{font-size:.6875rem;color:var(--c-text-secondary)}.sc-src dd{margin:0;font-size:.8125rem;font-weight:var(--fw-semibold);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sc-src footer{display:flex;justify-content:space-between;align-items:center;gap:8px}
.sc-sess{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,220px),1fr));gap:var(--sp-3);padding:var(--sp-3) var(--sp-5) var(--sp-5)}
.sc-se{display:grid;gap:6px;justify-items:start;padding:var(--sp-3);border-radius:var(--r-md);border:1px solid var(--c-border)}.sc-se.needs_refresh{border-color:var(--c-warning);background:color-mix(in oklch,var(--c-warning) 7%,transparent)}.sc-se small{font-size:.75rem;color:var(--c-text-secondary)}
.sc-rg{align-items:stretch}.sc-con .row .tx{display:grid;flex:1;min-inline-size:0}
.sc-bar{block-size:10px}.sc-bar.err i{background:var(--c-error)}.sc-pct{justify-content:space-between}.sc-pct b{font-size:1.5rem}
.sc-cnt{gap:var(--sp-2);grid-template-columns:repeat(3,minmax(0,1fr))}.sc-c{display:grid;padding:var(--sp-3);border-radius:var(--r-md);background:var(--c-surface-neutral)}.sc-c b{font-size:1.5rem}.sc-c span{font-size:.75rem;color:var(--c-text-secondary)}
.sc-logc{display:flex;flex-direction:column;min-block-size:380px;background:var(--c-tape);color:var(--c-tape-ink)}.sc-logc .m-h6{color:var(--c-tape-ink)}
.sc-log{flex:1;overflow:auto;padding:var(--sp-3) var(--sp-5) var(--sp-5);font-size:.75rem;line-height:1.7;max-block-size:420px;text-align:start}
.sc-log .dim{color:var(--c-tape-ink-2)}.sc-log .ok{color:var(--c-success-light)}.sc-log .err{color:var(--c-error-light)}.sc-log .warn{color:var(--c-warning-light)}
.sc-q{display:grid;padding:var(--sp-2) var(--sp-3) var(--sp-3)}
.sc-qi{display:grid;gap:var(--sp-2);padding:var(--sp-3);border-radius:var(--r-md);transition:background var(--dur-fast) var(--ease)}
.sc-qi+.sc-qi{border-block-start:1px dashed var(--c-border)}
.sc-qi.on{background:color-mix(in oklch,var(--c-primary) 7%,transparent);box-shadow:inset 3px 0 0 var(--c-primary)}
[dir=rtl] .sc-qi.on{box-shadow:inset -3px 0 0 var(--c-primary)}
.sc-qi .tx b{font-size:.9375rem;font-weight:var(--fw-semibold)}.sc-qi .tx small{display:block;font-size:.8125rem;color:var(--c-text-secondary)}.sc-qi em{font-style:normal;color:var(--c-primary-ink);font-weight:var(--fw-semibold)}
.sc-qb{display:flex;gap:6px;flex-wrap:wrap}.sc-qb .m-btn{gap:6px}.sc-qb kbd{padding:2px 5px}

/* grid */
.gd{position:relative}
.gd-bar{display:flex;gap:var(--sp-3);flex-wrap:wrap;align-items:center}
.gd-q{flex:1 1 220px;inline-size:auto}
.gd-chips{gap:6px}.gd-chips:empty{display:none}
.gd-card{overflow:hidden}
.gd-tw{max-block-size:62vh;overflow:auto}
.gd-t{border-collapse:separate;border-spacing:0;table-layout:fixed;font-size:.875rem;--rh:52px}
.gd-t[data-d=dense]{--rh:36px;font-size:.8125rem}.gd-t[data-d=comfortable]{--rh:68px}
.gd-t th{position:sticky;inset-block-start:0;z-index:2;background:var(--c-surface-neutral);text-align:start;padding:0;block-size:48px;font-weight:var(--fw-semibold);color:var(--c-text-secondary);font-size:.8125rem;white-space:nowrap}
.gd-t th.flt{color:var(--c-primary-ink)}
.gd-t th{display:table-cell}.gd-t th>.gd-h{display:inline-flex;align-items:center;gap:4px;border:0;background:none;color:inherit;font-weight:inherit;padding-inline:16px 4px;block-size:48px;inline-size:calc(100% - 34px);text-align:start;overflow:hidden}
.gd-h span{overflow:hidden;text-overflow:ellipsis}.gd-ar{font-style:normal;font-size:.625rem;color:var(--c-primary-ink)}
.gd-mb{border:0;background:none;color:var(--c-text-disabled);inline-size:26px;block-size:30px;border-radius:var(--r-xs);display:inline-grid;place-items:center;vertical-align:middle;opacity:.6;transition:opacity var(--dur-fast) var(--ease),background var(--dur-fast) var(--ease)}
.gd-t th:hover .gd-mb,.gd-mb:focus-visible{opacity:1}.gd-mb:hover{background:var(--c-state-hover)}
.gd-rz{position:absolute;inset-block:10px;inset-inline-end:0;inline-size:8px;cursor:col-resize;z-index:3;touch-action:none}
.gd-rz::after{content:"";position:absolute;inset-block:0;inset-inline-end:0;inline-size:1px;background:var(--c-border-strong);transition:background var(--dur-fast) var(--ease),box-shadow var(--dur-fast) var(--ease)}
.gd-rz:hover::after,.gd-rz.on::after{background:var(--c-primary);box-shadow:0 0 8px var(--c-primary);inline-size:2px}
.gd-t th{position:sticky}.gd-t thead th{position:sticky}
.gd-t td{block-size:var(--rh);padding-inline:16px;border-block-end:1px solid color-mix(in oklch,var(--c-border) 60%,transparent);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;transition:background var(--dur-fast) var(--ease)}
.gd-t .num{text-align:end}.gd-t td.num{font-family:inherit;font-variant-numeric:tabular-nums;font-weight:var(--fw-medium)}.gd-ty{color:var(--c-text-secondary)}.gd-t th.num .gd-h{justify-content:flex-end}
.gd-tt{font-weight:var(--fw-semibold)}
.gd-ck{inline-size:44px;text-align:center}.gd-t th.gd-ck,.gd-t td.gd-ck{padding:0;text-align:center}.gd-ck input{inline-size:18px;block-size:18px;accent-color:var(--c-primary);margin:0;vertical-align:middle;position:relative}
.gd-ck input::before{content:"";position:absolute;inset:-13px}
.gd-t tbody tr:hover td{background:var(--c-state-hover)}
.gd-t tr.sel td{background:color-mix(in oklch,var(--c-primary) 7%,transparent)}.gd-t tr.sel td:first-child{box-shadow:inset 3px 0 0 var(--c-primary)}[dir=rtl] .gd-t tr.sel td:first-child{box-shadow:inset -3px 0 0 var(--c-primary)}
.gd-ctr{display:inline-flex;align-items:center;gap:8px}.gd-ctr i{display:inline-block;inline-size:36px;block-size:4px;border-radius:2px;background:linear-gradient(90deg,var(--c-primary) calc(var(--v)*1%),var(--c-surface-neutral) 0)}
[dir=rtl] .gd-ctr i{background:linear-gradient(-90deg,var(--c-primary) calc(var(--v)*1%),var(--c-surface-neutral) 0)}
.gd-foot{display:flex;flex-wrap:wrap;gap:var(--sp-2) var(--sp-6);padding:var(--sp-4) var(--sp-5);border-block-start:1px solid var(--c-border);font-variant-numeric:tabular-nums;background:var(--c-surface-neutral);font-size:.8125rem;color:var(--c-text-secondary)}.gd-foot b{color:var(--c-text)}
.gd-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,260px),1fr));gap:var(--sp-3);padding:var(--sp-3)}
.gd-cd{display:grid;gap:8px;text-align:start;border:1px solid var(--c-border);background:var(--c-surface);border-radius:var(--r-md);padding:var(--sp-4);min-inline-size:0}
.gd-cd.sel{border-color:var(--c-primary);box-shadow:0 0 0 1px var(--c-primary)}
.gd-cd small{font-size:.75rem;color:var(--c-primary-ink);font-weight:var(--fw-bold)}.gd-cd>b{font-size:.9375rem;line-height:1.35}
.gd-cm{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}.gd-cm span{display:grid;background:var(--c-surface-neutral);border-radius:var(--r-sm);padding:8px 10px}.gd-cm em{font-style:normal;font-size:.75rem;color:var(--c-text-secondary)}.gd-cm b{font-family:inherit;font-variant-numeric:tabular-nums}
.gd-src{font-size:.75rem;color:var(--c-text-secondary)}
.gd-pop{position:absolute;z-index:40;inline-size:240px}
.gd-mn{display:grid;gap:2px;padding:var(--sp-2);background:var(--c-surface);border-radius:var(--r-md);box-shadow:var(--shadow-dropdown);animation:gdpop var(--dur-normal) var(--ease)}
@keyframes gdpop{from{opacity:0;transform:translateY(-4px) scale(.98)}}
.gd-mn .m-overline{padding:6px 10px;color:var(--c-text-secondary);font-size:.875rem;font-weight:var(--fw-semibold);letter-spacing:0;text-transform:none}
.gd-mn>button{border:0;background:none;text-align:start;padding-inline:10px;min-block-size:40px;border-radius:var(--r-sm);font-size:.875rem;position:relative}.gd-mn>button::before{content:"";position:absolute;inset-block:-2px;inset-inline:0}
.gd-mn>button:hover{background:var(--c-state-hover)}.gd-mn .fld{padding:6px 10px}
.gd-cb{display:flex;gap:10px;align-items:center;min-block-size:44px;padding-inline:10px;border-radius:var(--r-sm);font-size:.875rem;cursor:pointer}.gd-cb:hover{background:var(--c-state-hover)}.gd-cb input{inline-size:18px;block-size:18px;accent-color:var(--c-primary)}
.gd-dlg{position:fixed;inset:0;z-index:1400;background:var(--c-overlay);display:grid;place-items:center;padding:var(--sp-4)}
.gd-dlg[hidden]{display:none}
.gd-dbox{background:var(--c-surface);border-radius:var(--r-lg);box-shadow:var(--shadow-dialog);inline-size:min(720px,100%);max-block-size:90vh;display:flex;flex-direction:column;animation:gdpop var(--dur-slow) var(--ease)}
.gd-dbox header{display:flex;justify-content:space-between;gap:var(--sp-3);padding:var(--sp-5) var(--sp-5) var(--sp-3)}.gd-dbox header div{display:grid;min-inline-size:0}.gd-dbox header small{font-size:.8125rem;overflow-wrap:anywhere}
.gd-csvt{margin-inline:var(--sp-5);border:1px solid var(--c-border);border-radius:var(--r-md);padding:var(--sp-3);background:var(--c-surface-neutral);color:var(--c-text);font-size:.75rem;line-height:1.6;resize:none;flex:1;min-block-size:200px;text-align:start;white-space:pre;overflow:auto}
.gd-dbox footer{display:flex;gap:var(--sp-3);align-items:center;justify-content:space-between;padding:var(--sp-4) var(--sp-5) var(--sp-5);flex-wrap:wrap}

/* responsive */
@container main (max-width:1079px){.bn-grid{grid-template-columns:minmax(0,1fr)}.bn-side{position:static;grid-template-columns:repeat(2,minmax(0,1fr))}.bn-side>.m-card:first-child{grid-column:1/-1}.pl-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.pl-m{grid-column:1/-1}}
@container main (max-width:899px){
 .so{grid-template-columns:minmax(0,1fr);grid-template-areas:"story" "prev" "ang" "tpl" "txt" "hist"}.so-a-prev{position:static}
 .cp-board{grid-template-columns:repeat(2,minmax(0,1fr))}
 .sc-rg{grid-template-columns:minmax(0,1fr)}.sc-k{grid-template-columns:repeat(3,minmax(0,1fr))}
 .bn-side{grid-template-columns:minmax(0,1fr)}
 .pl-grid{grid-template-columns:minmax(0,1fr)}
}
@container main (max-width:599px){
 .so-tpls{grid-template-columns:repeat(4,minmax(0,1fr))}.so-stage{min-block-size:0;padding:var(--sp-4) var(--sp-2)}
 .so-go{flex-direction:column}.so-go select{max-inline-size:none;inline-size:100%}
 .bn-bar .seg{order:3;inline-size:100%}.bn-bar .seg button{flex:1}.bn-bar .sp{display:none}.bn-bar .bn-exp{flex:1}
 .bn-rep span{display:none}.bn-player{gap:var(--sp-2);padding:var(--sp-2) var(--sp-3)}
 .bn-sizes>.bn-fig{grid-column:1/-1}.bn-f-tall{grid-row:auto}
 .cp-board{grid-template-columns:minmax(0,1fr)}.ds.cp .cp-k{grid-template-columns:repeat(2,minmax(0,1fr))}.cp-dl{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
 .sc-top .m-btn{inline-size:100%}.sc-top .sp{display:none}.sc-tabs{flex-basis:100%}.sc-k{grid-template-columns:repeat(2,minmax(0,1fr))}.sc-k>:last-child{grid-column:1/-1}.sc-form{flex-direction:column}
 .gd-bar .seg{inline-size:100%}.gd-bar .seg button{flex:1;padding-inline:6px}.gd-bar .m-btn{flex:1}
}
}
@layer components.app{
.mon{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--sp-5)}
.mon .m-btn-sm,.mon .m-btn-md,.mon-dr .m-btn-sm,.mon-dr .m-btn-md{position:relative}
.mon .m-btn-sm::after,.mon .m-btn-md::after,.mon-dr .m-btn-sm::after,.mon-dr .m-btn-md::after{content:'';position:absolute;inset-block:-7px;inset-inline:0}
.mon-ic{inline-size:18px;block-size:18px;flex:none}
.mon-sp{display:block;inline-size:100%;block-size:28px;fill:currentColor}
.mon-av{display:inline-grid;place-items:center;inline-size:36px;block-size:36px;border-radius:50%;flex:none;font-size:.8125rem;font-weight:var(--fw-bold);background:color-mix(in oklch,var(--a) 18%,transparent);color:light-dark(color-mix(in oklab,var(--a) 45%,black),color-mix(in oklab,var(--a) 65%,white))}
.mon-av.xl{inline-size:72px;block-size:72px;font-size:1.5rem}
.mon-av.sm{inline-size:28px;block-size:28px;font-size:.6875rem;border:2px solid var(--c-surface)}
.mon-avs{display:flex}.mon-avs .mon-av+.mon-av{margin-inline-start:-8px}
.mon-head{display:flex;align-items:center;gap:var(--sp-3);flex-wrap:wrap}
.mon-head .sp{flex:1}
.mon-seg{display:inline-flex;padding:3px;border-radius:var(--r-md);background:var(--c-surface-neutral);gap:2px}
.mon-seg button{border:0;background:none;border-radius:calc(var(--r-md) - 3px);min-block-size:38px;padding-inline:14px;font:inherit;font-weight:var(--fw-semibold);font-size:.875rem;color:var(--c-text-secondary);cursor:pointer;position:relative}
.mon-seg button::before{content:'';position:absolute;inset-block:min(0px,calc((100% - 44px)/2));inset-inline:0}
.mon-seg button[aria-pressed=true]{background:var(--c-surface);color:var(--c-text);box-shadow:var(--shadow-z1)}
.mon-live{display:inline-flex;align-items:center;gap:6px;font-size:.75rem;font-weight:var(--fw-bold);letter-spacing:.04em;text-transform:uppercase;color:var(--c-error-ink)}
.mon-dot{inline-size:8px;block-size:8px;border-radius:50%;background:var(--d,var(--c-success));flex:none;animation:mon-pulse 2s var(--ease) infinite}
@keyframes mon-pulse{0%{box-shadow:0 0 0 0 color-mix(in oklch,var(--d,var(--c-success)) 55%,transparent)}70%{box-shadow:0 0 0 7px transparent}100%{box-shadow:0 0 0 0 transparent}}
.mon-dot.ok{--d:var(--c-success)}.mon-dot.warn{--d:var(--c-warning)}.mon-dot.err{--d:var(--c-error)}.mon-dot.off{--d:var(--c-grey-500);animation:none}
.mon-kv{display:grid;grid-template-columns:minmax(110px,max-content) minmax(0,1fr);gap:0 var(--sp-4);margin:0;font-size:.875rem}
.mon-kv dt,.mon-kv dd{padding-block:9px;border-block-end:1px dashed var(--c-border);margin:0;min-inline-size:0;overflow-wrap:anywhere}
.mon-kv dt{color:var(--c-text-secondary)}.mon-kv dd{font-weight:var(--fw-medium)}
.mon-pre{margin:0;padding:var(--sp-4);border-radius:var(--r-md);background:var(--c-tape);color:var(--c-tape-ink);font:var(--fw-medium) .75rem/1.6 var(--font-mono);overflow:auto;max-block-size:280px;direction:ltr;text-align:start}
.mon-sec{font-size:.875rem;font-weight:var(--fw-semibold);color:var(--c-text-secondary);margin:0}
.mon-scrim{position:fixed;inset:0;background:color-mix(in oklch,var(--c-black,var(--c-grey-900)) 40%,transparent);z-index:1300;opacity:0;visibility:hidden;transition:opacity var(--dur-normal) var(--ease),visibility 0s var(--dur-normal)}
.mon-scrim.on{opacity:1;visibility:visible;transition:opacity var(--dur-normal) var(--ease)}
.mon-dr{position:fixed;inset-block:0;inset-inline-end:0;inline-size:min(540px,100vw);background:var(--c-surface);color:var(--c-text);z-index:1310;overflow:auto;box-shadow:var(--shadow-dialog);transform:translateX(105%);visibility:hidden;transition:transform var(--dur-slower) var(--ease),visibility 0s var(--dur-slower);overscroll-behavior:contain}
[dir=rtl] .mon-dr{transform:translateX(-105%)}
.mon-dr.on{transform:none;visibility:visible;transition:transform var(--dur-slower) var(--ease)}
.mon-dr-h{position:sticky;inset-block-start:0;display:flex;align-items:start;gap:var(--sp-3);padding:var(--sp-5) var(--sp-6);background:inherit;border-block-end:1px solid var(--c-border);z-index:1}
.mon-dr-h .tx{flex:1;min-inline-size:0}.mon-dr-h h3{margin:0;font-size:1.125rem;line-height:1.35}.mon-dr-h small{color:var(--c-text-secondary);font-size:.8125rem}
.mon-dr-b{padding:var(--sp-5) var(--sp-6) var(--sp-10);display:grid;gap:var(--sp-5)}
.mon-dr.dk{background:var(--c-tape-3);color:var(--c-tape-ink)}
.mon-dr.dk .mon-dr-h{border-color:color-mix(in oklch,var(--c-tape-ink) 12%,transparent)}
.mon-dr.dk .mon-kv dt,.mon-dr.dk .mon-dr-h small{color:var(--c-tape-ink-2)}.mon-dr.dk .mon-kv dt,.mon-dr.dk .mon-kv dd{border-color:color-mix(in oklch,var(--c-tape-ink) 12%,transparent)}
.mon-dr.dk .m-icon-btn{color:var(--c-tape-ink)}.mon-dr.dk .mon-pre{background:var(--c-tape)}
.mon-dr.dk .m-btn-outlined-inherit{color:var(--c-tape-ink);border-color:color-mix(in oklch,var(--c-tape-ink) 30%,transparent)}

/* ── control tower ── */
.twr{color-scheme:dark;background:var(--c-tape);color:var(--c-tape-ink);border-radius:var(--r-xl);padding:var(--sp-6);gap:var(--sp-6);margin-block-start:var(--sp-1)}
.twr-hd{display:flex;align-items:center;gap:var(--sp-4);flex-wrap:wrap}
.twr-hd .tx{flex:1;min-inline-size:200px}.twr-hd h2{margin:0;font-size:1.375rem;font-weight:var(--fw-bold);color:var(--c-on-media)}
.twr-hd p{margin:2px 0 0;color:var(--c-tape-ink-2);font-size:.875rem;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.twr-hk{display:flex;gap:var(--sp-2);flex-wrap:wrap}
.twr-hk div{border:1px solid color-mix(in oklch,var(--c-tape-ink) 16%,transparent);border-radius:var(--r-lg);padding:8px 14px;text-align:center;min-inline-size:84px}
.twr-hk b{display:block;font-size:1.125rem;color:var(--c-on-media);font-variant-numeric:tabular-nums}.twr-hk span{font-size:.6875rem;color:var(--c-tape-ink-2)}
.twr-k4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--sp-4)}
.twr-k{--k:var(--c-success);background:var(--c-tape-3);border:1px solid color-mix(in oklch,var(--c-tape-ink) 10%,transparent);border-inline-start:3px solid var(--k);border-radius:var(--r-lg);padding:var(--sp-4) var(--sp-5);display:grid;gap:6px;min-inline-size:0}
.twr-k.info{--k:var(--c-info)}.twr-k.warn{--k:var(--c-warning)}.twr-k.err{--k:var(--c-error)}
.twr-k>span{font-size:.8125rem;color:var(--c-tape-ink-2)}
.twr-k b{font-size:clamp(1.5rem,1.4cqi + 1rem,2rem);font-weight:var(--fw-extrabold);color:var(--c-on-media);line-height:1.1;font-variant-numeric:tabular-nums}
.twr-k .ft{display:flex;align-items:end;gap:var(--sp-3);justify-content:space-between}
.twr-k b .u{font-size:.875rem;font-weight:var(--fw-semibold);color:var(--c-tape-ink-2);letter-spacing:0}
.twr-k small{font-size:.75rem;color:var(--c-tape-ink-2)}
.twr-k .mon-sp{inline-size:64px;color:color-mix(in oklch,var(--k) 75%,transparent);flex:none}
.twr-sh{display:flex;align-items:center;gap:var(--sp-2);margin-block-end:var(--sp-3)}
.twr-sh h3{margin:0;font-size:1rem;color:var(--c-on-media);flex:1}
.twr-sh .ct{font:var(--fw-medium) .75rem/1 var(--font-mono);color:var(--c-tape-ink-2);padding:5px 8px;border-radius:var(--r-pill);background:color-mix(in oklch,var(--c-tape-ink) 8%,transparent)}
.twr-sv{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--sp-3)}
.twr-s{all:unset;box-sizing:border-box;cursor:pointer;background:var(--c-tape-3);border:1px solid color-mix(in oklch,var(--c-tape-ink) 10%,transparent);border-radius:var(--r-lg);padding:var(--sp-4) var(--sp-5);display:grid;gap:var(--sp-3);min-inline-size:0;transition:border-color var(--dur-fast) var(--ease),transform var(--dur-fast) var(--ease)}
.twr-s:hover{border-color:color-mix(in oklch,var(--c-tape-ink) 30%,transparent)}
.twr-s:focus-visible{outline:2px solid var(--c-tape-hot);outline-offset:2px}
.twr-s .r1{display:flex;align-items:center;gap:8px}.twr-s .r1 b{flex:1;color:var(--c-on-media);font-size:.9375rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.twr-chip{font:var(--fw-medium) .6875rem/1 var(--font-mono);padding:5px 7px;border-radius:6px;background:color-mix(in oklch,var(--c-tape-ink) 8%,transparent);color:var(--c-tape-ink);white-space:nowrap}
.twr-s .r2{display:flex;align-items:baseline;gap:8px}.twr-s .r2 b{font-size:1.75rem;font-weight:var(--fw-extrabold);color:var(--c-on-media);font-variant-numeric:tabular-nums}.twr-s .r2 span{font-size:.75rem;color:var(--c-tape-ink-2)}
.twr-s .r2 .mon-sp{inline-size:72px;margin-inline-start:auto;color:color-mix(in oklch,var(--c-tape-ink) 35%,transparent)}
.twr-ld{block-size:4px;border-radius:99px;background:color-mix(in oklch,var(--c-tape-ink) 10%,transparent);overflow:hidden}
.twr-ld i{display:block;block-size:100%;inline-size:calc(var(--v)*1%);background:var(--c-success);border-radius:inherit;transition:inline-size var(--dur-slower) var(--ease)}
.twr-s.warn .twr-ld i{background:var(--c-warning)}.twr-s.err .twr-ld i{background:var(--c-error)}
.twr-s .r3{display:flex;justify-content:space-between;gap:8px;font-size:.75rem;color:var(--c-tape-ink-2)}
.twr-s.warn .r3 .st{color:var(--c-warning-ink)}.twr-s.err .r3 .st{color:var(--c-error-ink)}.twr-s .r3 .st{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.twr-2{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:var(--sp-5)}
.twr-box{background:var(--c-tape-3);border:1px solid color-mix(in oklch,var(--c-tape-ink) 10%,transparent);border-radius:var(--r-lg);padding:var(--sp-2) var(--sp-4)}
.twr-r{all:unset;box-sizing:border-box;cursor:pointer;display:flex;align-items:center;gap:var(--sp-3);inline-size:100%;min-block-size:56px;padding-block:var(--sp-2)}
.twr-r+.twr-r{border-block-start:1px dashed color-mix(in oklch,var(--c-tape-ink) 12%,transparent)}
.twr-r:focus-visible{outline:2px solid var(--c-tape-hot);border-radius:6px}
.twr-r .tx{flex:1;min-inline-size:0}.twr-r .tx b{display:block;font-size:.875rem;font-weight:var(--fw-semibold);color:var(--c-on-media);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.twr-r .tx small{font-size:.75rem;color:var(--c-tape-ink-2)}
.twr-r time{font:var(--fw-bold) .6875rem/1 var(--font-mono);color:var(--c-tape-ink-2);flex:none}
.twr-r.new{animation:twr-in var(--dur-slower) var(--ease)}
@keyframes twr-in{from{opacity:0;transform:translateY(-6px)}}
.twr-sev{font:var(--fw-bold) .625rem/1 var(--font-mono);padding:5px 6px;border-radius:5px;letter-spacing:.04em;flex:none;inline-size:44px;text-align:center}
.twr-sev.err{background:color-mix(in oklch,var(--c-error) 22%,transparent);color:var(--c-error-ink)}
.twr-sev.warn{background:color-mix(in oklch,var(--c-warning) 22%,transparent);color:var(--c-warning-ink)}
.twr-sev.info{background:color-mix(in oklch,var(--c-info) 22%,transparent);color:var(--c-info-ink)}
.twr-sev.ok{background:color-mix(in oklch,var(--c-success) 22%,transparent);color:var(--c-success-ink)}
.twr-stg{display:grid;gap:0}
.twr-stg div{display:grid;grid-template-columns:22px minmax(0,1fr) auto;gap:var(--sp-3);align-items:center;min-block-size:44px;position:relative}
.twr-stg div::before{content:'';position:absolute;inset-inline-start:10px;inset-block:-50% 50%;inline-size:2px;background:color-mix(in oklch,var(--c-tape-ink) 14%,transparent)}
.twr-stg div:first-child::before{display:none}
.twr-stg i{inline-size:12px;block-size:12px;border-radius:50%;background:var(--c-success);margin-inline-start:5px;z-index:1}
.twr-stg i.wait{background:var(--c-tape-3);border:2px solid var(--c-tape-ink-2);box-sizing:border-box}
.twr-stg span{font-size:.875rem}.twr-stg em{font:var(--fw-medium) .75rem/1 var(--font-mono);color:var(--c-tape-ink-2);font-style:normal}
.twr-acts{display:flex;gap:var(--sp-2);flex-wrap:wrap}
@container main (max-width:1099px){.twr-sv{grid-template-columns:repeat(2,minmax(0,1fr))}.twr-2{grid-template-columns:minmax(0,1fr)}}
@container main (max-width:899px){.twr-k4{grid-template-columns:repeat(2,minmax(0,1fr))}}
@container main (max-width:599px){.twr{padding:var(--sp-4);border-radius:var(--r-lg);gap:var(--sp-5)}.twr-sv{grid-template-columns:minmax(0,1fr)}.twr-k4{gap:var(--sp-2)}.twr-k{padding:var(--sp-3) var(--sp-4)}.twr-k .mon-sp{display:none}.twr-hk{inline-size:100%}.twr-hk div{flex:1;min-inline-size:0}}

/* ── goal radar ── */
.gol-st{display:grid;grid-template-columns:repeat(5,minmax(0,1fr))}
.gol-st div{padding:var(--sp-5);display:grid;gap:4px;align-content:start}
.gol-st div+div{border-inline-start:1px solid var(--c-border)}
.gol-st b{font-size:clamp(1.5rem,1.6cqi + 1rem,2.25rem);font-weight:var(--fw-extrabold);line-height:1.1;font-variant-numeric:tabular-nums}
.gol-st b .u{font-size:.875rem;font-weight:var(--fw-semibold);color:var(--c-text-secondary)}
.gol-st b.ok{color:var(--c-success-ink)}.gol-st span{font-size:.8125rem;color:var(--c-text-secondary);line-height:1.4}
.gol-main{display:grid;grid-template-columns:300px minmax(0,1fr);gap:var(--sp-5);align-items:start}
.gol-ml{display:grid;padding:var(--sp-2)}
.gol-m{all:unset;box-sizing:border-box;cursor:pointer;display:grid;gap:6px;padding:var(--sp-3) var(--sp-4);border-radius:var(--r-md);min-block-size:64px}
.gol-m:hover{background:var(--c-state-hover)}.gol-m[aria-current=true]{background:var(--c-surface-neutral)}
.gol-m:focus-visible{outline:2px solid var(--c-primary)}
.gol-m .r{display:flex;align-items:center;gap:8px;font-size:.75rem;color:var(--c-text-secondary)}
.gol-m .r .mn{margin-inline-start:auto;font:var(--fw-bold) .75rem/1 var(--font-mono)}
.gol-m .tm{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:2px 8px;font-weight:var(--fw-semibold);font-size:.9375rem}
.gol-m .tm span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.gol-m .tm b{font-variant-numeric:tabular-nums}
.gol-sb{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:var(--sp-4);padding:var(--sp-6) var(--sp-5) var(--sp-4);text-align:center}
.gol-sb .tn{font-weight:var(--fw-bold);font-size:1.0625rem;line-height:1.3}
.gol-sb .sc{display:flex;justify-content:center;gap:.3em;font-size:2.75rem;font-weight:var(--fw-extrabold);font-variant-numeric:tabular-nums;line-height:1}.gol-sb .sc i{font-style:normal;color:var(--c-text-secondary)}
.gol-sb .mi{display:block;font:var(--fw-bold) .8125rem/1 var(--font-mono);color:var(--c-error-ink);margin-block-start:8px}
.gol-sb .mi.ft{color:var(--c-text-secondary)}
.gol-tl{padding:var(--sp-2) var(--sp-5) var(--sp-5);display:grid;gap:var(--sp-2)}
.gol-ln{display:grid;grid-template-columns:110px minmax(0,1fr);gap:var(--sp-3);align-items:center}
.gol-ln>span{font-size:.75rem;font-weight:var(--fw-semibold);color:var(--c-text-secondary);display:flex;gap:6px;align-items:center}
.gol-tr{position:relative;block-size:30px;border-radius:6px;background:var(--c-surface-neutral)}
.gol-tr.gl{background:none;block-size:34px;border-block-end:1px solid var(--c-border)}
.gol-s{position:absolute;inset-block:5px;inset-inline-start:calc(var(--x)*1%);inline-size:4px;margin-inline-start:-2px;border-radius:2px;background:color-mix(in oklch,var(--c) calc(var(--v)*100%),transparent);transition:opacity var(--dur-normal) var(--ease)}
.gol-s:not(.on){opacity:0}
.gol-s.crowd{--c:var(--c-warning)}.gol-s.ocr{--c:var(--c-info)}.gol-s.comm{--c:var(--c-primary)}
.gol-g{all:unset;cursor:pointer;position:absolute;inset-block-start:-5px;inset-inline-start:calc(var(--x)*1%);translate:calc(var(--sx,1)*-50%) 0;display:grid;place-items:center;inline-size:44px;block-size:44px;border-radius:50%;background:radial-gradient(circle closest-side,var(--c-success) 14px,transparent 14.5px);color:var(--c-on-media);transition:opacity var(--dur-normal) var(--ease),scale var(--dur-normal) var(--ease)}
[dir=rtl] .gol-g{--sx:-1}
.gol-g .mon-ic{inline-size:16px;block-size:16px}
.gol-g:not(.on){opacity:0;scale:.4;pointer-events:none}
.gol-g[aria-pressed=true]{background:radial-gradient(circle closest-side,var(--c-success) 14px,var(--c-surface) 14.5px 17px,var(--c-success) 17.5px 19px,transparent 19.5px)}
.gol-g:focus-visible{outline:2px solid var(--c-primary);outline-offset:-4px}
.gol-ph{position:absolute;inset-block:-2px;inset-inline-start:calc(var(--x)*1%);inline-size:2px;background:var(--c-error);transition:inset-inline-start var(--dur-slower) var(--ease);z-index:1}
.gol-ax{display:flex;justify-content:space-between;font:var(--fw-medium) .6875rem/1 var(--font-mono);color:var(--c-text-secondary);margin-inline-start:calc(110px + var(--sp-3));font-variant-numeric:tabular-nums}
.gol-lg{display:inline-block;inline-size:10px;block-size:10px;border-radius:3px;background:var(--c)}
.gol-fu{display:grid;grid-template-columns:auto minmax(0,1fr);gap:var(--sp-6);align-items:center;padding:var(--sp-5);border-block-start:1px solid var(--c-border)}
.gol-ring{--p:0;inline-size:112px;aspect-ratio:1;border-radius:50%;background:conic-gradient(var(--c-success) calc(var(--p)*1%),var(--c-surface-neutral) 0);display:grid;place-items:center;position:relative}
.gol-ring::before{content:'';position:absolute;inset:10px;border-radius:50%;background:var(--c-surface)}
.gol-ring b{position:relative;font-size:1.5rem;font-weight:var(--fw-extrabold);font-variant-numeric:tabular-nums}
.gol-ring small{position:absolute;inset-block-end:24px;font-size:.6875rem;color:var(--c-text-secondary)}
.gol-fl{display:grid;gap:var(--sp-3)}
.gol-fl h6{margin:0}.gol-fr{display:grid;grid-template-columns:120px minmax(0,1fr) 48px;gap:var(--sp-3);align-items:center;font-size:.8125rem}
.gol-fr .bar i{background:var(--c)}.gol-fr b{font:var(--fw-bold) .75rem/1 var(--font-mono);text-align:end}
.gol-fr q{grid-column:2/-1;color:var(--c-text-secondary);font-size:.8125rem;quotes:none;margin-block-start:-6px}
.gol-cl{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,220px),1fr));gap:var(--sp-4);padding:var(--sp-4) var(--sp-5) var(--sp-5)}
.gol-c{display:grid;gap:var(--sp-2);align-content:start}
.gol-th{aspect-ratio:16/9;border-radius:var(--r-md);position:relative;overflow:hidden;color:var(--c-on-media);
 background:radial-gradient(circle at 50% 50%,transparent 17%,color-mix(in oklch,var(--c-on-media) 55%,transparent) 17.5%,transparent 18.5%),linear-gradient(90deg,transparent 49.6%,color-mix(in oklch,var(--c-on-media) 55%,transparent) 49.6% 50.4%,transparent 50.4%),repeating-linear-gradient(90deg,color-mix(in oklab,var(--c-success) 62%,var(--c-grey-900)) 0 10%,color-mix(in oklab,var(--c-success) 52%,var(--c-grey-900)) 10% 20%)}
.gol-th::after{content:'';position:absolute;inset:0;background:linear-gradient(to top,color-mix(in oklch,var(--c-scrim-media) 70%,transparent),transparent 55%)}
.gol-th .bug{position:absolute;inset-block-start:8px;inset-inline-start:8px;display:flex;gap:6px;align-items:center;background:color-mix(in oklch,var(--c-scrim-media) 82%,transparent);border-radius:6px;padding:4px 8px;font:var(--fw-bold) .6875rem/1 var(--font-mono);z-index:1;direction:ltr}
.gol-th .bug i{inline-size:6px;block-size:6px;border-radius:50%;background:var(--c-error)}
.gol-th .du{position:absolute;inset-block-end:8px;inset-inline-end:8px;font:var(--fw-bold) .6875rem/1 var(--font-mono);z-index:2;padding:4px 6px;border-radius:5px;background:oklch(0% 0 0 / .6);color:var(--c-on-media);direction:ltr;font-variant-numeric:tabular-nums}
.gol-th .gpl{all:unset;cursor:pointer;position:absolute;inset:0;display:grid;place-items:center;z-index:1}
.gol-th .gpl span{inline-size:44px;block-size:44px;border-radius:50%;display:grid;place-items:center;background:color-mix(in oklch,var(--c-on-media) 22%,transparent);backdrop-filter:blur(6px)}
.gol-c b{font-size:.875rem;line-height:1.35}.gol-c small{color:var(--c-text-secondary);font-size:.75rem}
.gol-c.new .gol-th{animation:gol-pop var(--dur-slower) var(--ease)}
@keyframes gol-pop{from{opacity:0;scale:.92}}
@container main (max-width:1099px){.gol-main{grid-template-columns:minmax(0,1fr)}.gol-ml{grid-auto-flow:column;grid-auto-columns:minmax(220px,1fr);overflow-x:auto}}
@container main (max-width:899px){.gol-st{grid-template-columns:repeat(3,minmax(0,1fr))}.gol-st div:nth-child(4){border-inline-start:0}.gol-st div:nth-child(n+4){border-block-start:1px solid var(--c-border)}}
@container main (max-width:599px){.gol-st{grid-template-columns:repeat(2,minmax(0,1fr))}.gol-st div{padding:var(--sp-4)}.gol-st div:nth-child(odd){border-inline-start:0}.gol-st div:nth-child(4){border-inline-start:1px solid var(--c-border)}.gol-st div:nth-child(n+3){border-block-start:1px solid var(--c-border)}.gol-st div:last-child{grid-column:1/-1}
 .gol-ln{grid-template-columns:minmax(0,1fr)}.gol-ln>span{display:none}.gol-ax{margin-inline-start:0}.gol-lgd{display:flex}.gol-sb .sc{font-size:2.25rem}.gol-sb .tn{font-size:.9375rem}
 .gol-fu{grid-template-columns:minmax(0,1fr);justify-items:center}.gol-fl{inline-size:100%}.gol-fr{grid-template-columns:96px minmax(0,1fr) 44px}}
.gol-lgd{display:none;gap:var(--sp-4);flex-wrap:wrap;font-size:.75rem;color:var(--c-text-secondary);padding-inline:var(--sp-5)}
.gol-lgd span{display:flex;align-items:center;gap:6px}

/* ── WhatsApp desk ── */
.wad-hero{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--sp-4);padding:var(--sp-5)}
.wad-top{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-5);flex-wrap:wrap}
.wad-fl{display:flex;align-items:center;gap:var(--sp-3);flex-wrap:wrap;padding-block-start:var(--sp-4);border-block-start:1px solid var(--c-border)}
.wad-num{display:flex;align-items:center;gap:var(--sp-3);padding:var(--sp-3) var(--sp-4);border-radius:var(--r-lg);background:color-mix(in oklch,var(--c-success) 10%,transparent)}
.wad-num .mon-ic{color:var(--c-success-ink);inline-size:24px;block-size:24px}
.wad-num b{display:block;font:var(--fw-bold) 1rem/1.2 var(--font-mono);direction:ltr}.wad-num small{font-size:.8125rem;color:color-mix(in oklab,var(--c-text-secondary) 60%,var(--c-text));display:inline-flex;align-items:center;gap:6px}
.wad-arr{color:var(--c-text-secondary);display:flex;align-items:center;gap:6px;font-size:.875rem;font-weight:var(--fw-semibold)}
[dir=rtl] .wad-arr .flip{transform:scaleX(-1)}
.wad-tns{display:flex;gap:var(--sp-2);flex-wrap:wrap}
.wad-tn{display:flex;align-items:center;gap:8px;padding:6px 12px 6px 6px;border-radius:var(--r-pill);border:1px solid var(--c-border);font-size:.8125rem;font-weight:var(--fw-semibold)}
[dir=rtl] .wad-tn{padding:6px 6px 6px 12px}
.wad-tn .tn-av{inline-size:26px;block-size:26px;font-size:.625rem}
.wad-tn em{font-style:normal;color:var(--c-text-secondary);font-weight:var(--fw-regular)}
.wad-tn.me{border-color:var(--c-text)}
.wad-kp{display:flex;gap:var(--sp-8)}
.wad-kp div{display:grid}.wad-kp b small{font-size:.875rem;font-weight:var(--fw-semibold);letter-spacing:0;color:var(--c-text-secondary)}
.wad-kp b{font-size:1.75rem;font-weight:var(--fw-extrabold);letter-spacing:-.02em;line-height:1.15;font-variant-numeric:tabular-nums}.wad-kp span{font-size:.8125rem;color:var(--c-text-secondary)}
.wad-in{display:grid;grid-template-columns:280px minmax(0,1fr) 320px;min-block-size:620px;overflow:hidden;padding:0}
.wad-ls{border-inline-end:1px solid var(--c-border);display:flex;flex-direction:column;min-inline-size:0}
.wad-ls .hd{padding:var(--sp-4);display:flex;gap:var(--sp-2);flex-wrap:wrap;border-block-end:1px solid var(--c-border)}
.wad-cv{all:unset;box-sizing:border-box;cursor:pointer;display:flex;gap:var(--sp-3);align-items:center;padding:var(--sp-3) var(--sp-4);min-block-size:72px;border-block-end:1px solid var(--c-border)}
.wad-cv:hover{background:var(--c-state-hover)}.wad-cv[aria-current=true]{background:var(--c-surface-neutral)}
.wad-cv:focus-visible{outline:2px solid var(--c-primary);outline-offset:-2px}
.wad-cv .tx{flex:1;min-inline-size:0;display:grid;gap:2px}
.wad-cv .tx b{font-size:.875rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.wad-cv .tx small{font-size:.8125rem;color:var(--c-text-secondary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:flex;gap:4px;align-items:center}
.wad-cv .tx small .mon-ic{inline-size:14px;block-size:14px}
.wad-cv .wmd{display:grid;justify-items:end;gap:6px;font-size:.75rem;color:var(--c-text-secondary);font-variant-numeric:tabular-nums}
.wad-cv .ub{min-inline-size:20px;block-size:20px;border-radius:10px;background:var(--c-success-darker);color:var(--c-on-media);display:grid;place-items:center;font-weight:var(--fw-bold);padding-inline:5px}
.wad-ch{display:flex;flex-direction:column;min-inline-size:0;background:var(--c-surface-neutral)}
.wad-ch .hd{display:flex;align-items:center;gap:var(--sp-3);padding:var(--sp-3) var(--sp-4);background:var(--c-surface);border-block-end:1px solid var(--c-border);min-block-size:64px}
.wad-ch .hd .tx{flex:1;min-inline-size:0}.wad-ch .hd b{display:block;font-size:.9375rem}.wad-ch .hd small{font-size:.75rem;color:var(--c-text-secondary)}
.wad-ch .bk{display:none}
.wad-msgs{flex:1;max-block-size:600px;padding:var(--sp-4);display:flex;flex-direction:column;gap:var(--sp-2);overflow:auto}
.wad-day{align-self:center;font-size:.6875rem;font-weight:var(--fw-semibold);color:var(--c-text-secondary);background:var(--c-surface);padding:4px 10px;border-radius:var(--r-pill);margin-block:var(--sp-2)}
.wad-b{max-inline-size:min(78%,420px);padding:8px 12px 6px;border-radius:14px;background:var(--c-surface);box-shadow:var(--shadow-z1);font-size:.875rem;line-height:1.5;align-self:flex-start;border-start-start-radius:4px;white-space:pre-line}
.wad-b.out{align-self:flex-end;background:color-mix(in oklab,var(--c-success) 16%,var(--c-surface));border-start-start-radius:14px;border-start-end-radius:4px}
.wad-b time{display:block;text-align:end;font-size:.6875rem;color:var(--c-text-secondary);margin-block-start:2px;font-variant-numeric:tabular-nums}
.wad-b.out time{color:color-mix(in oklab,var(--c-text-secondary) 60%,var(--c-text))}
.wad-b .bot{display:block;font-size:.6875rem;font-weight:var(--fw-bold);color:var(--c-success-ink);margin-block-end:2px}
.wad-ph{aspect-ratio:4/3;inline-size:min(260px,60cqi);border-radius:10px;margin-block-end:6px;display:grid;place-items:center;color:var(--c-on-media);position:relative;overflow:hidden}
.wad-ph.fire{background:radial-gradient(ellipse at 60% 80%,color-mix(in oklch,var(--c-warning) 85%,transparent),transparent 55%),linear-gradient(to top,color-mix(in oklab,var(--c-error) 60%,var(--c-grey-900)),color-mix(in oklab,var(--c-grey-700) 80%,var(--c-warning)))}
.wad-ph.city{background:linear-gradient(to top,color-mix(in oklab,var(--c-info) 30%,var(--c-grey-800)) 30%,transparent 30%),linear-gradient(to top,color-mix(in oklab,var(--c-info) 55%,var(--c-grey-200)),color-mix(in oklab,var(--c-info) 20%,var(--c-grey-100)))}
.wad-ph.pitch{background:repeating-linear-gradient(90deg,color-mix(in oklab,var(--c-success) 62%,var(--c-grey-900)) 0 12%,color-mix(in oklab,var(--c-success) 50%,var(--c-grey-900)) 12% 24%)}
.wad-ph .mon-ic{inline-size:28px;block-size:28px;opacity:.85}
.wad-ph small{position:absolute;inset-block-end:6px;inset-inline-start:6px;font:var(--fw-medium) .625rem/1 var(--font-mono);direction:ltr;padding:4px 6px;border-radius:5px;background:oklch(0% 0 0 / .6);color:var(--c-on-media)}
.wad-vo{display:flex;align-items:center;gap:10px;min-inline-size:220px}
.wad-vo .pb{inline-size:44px;block-size:44px;border-radius:50%;display:grid;place-items:center;background:radial-gradient(circle closest-side,var(--c-success) 18px,transparent 18.5px);color:var(--c-on-media);border:0;flex:none;cursor:pointer;position:relative;margin:-4px}

.wad-wv{display:flex;align-items:center;gap:2px;block-size:28px;flex:1}
.wad-wv i{inline-size:3px;border-radius:2px;background:color-mix(in oklch,var(--c-text) 35%,transparent);block-size:calc(var(--h)*1%)}
.wad-wv.play i{animation:wad-wv 1s var(--ease) infinite alternate;animation-delay:calc(var(--d)*-90ms)}
@keyframes wad-wv{to{scale:1 .35}}
.wad-vo small{font:var(--fw-medium) .6875rem/1 var(--font-mono);color:var(--c-text-secondary)}
.wad-tr{display:block;margin-block-start:6px;padding-block-start:6px;border-block-start:1px dashed var(--c-border);font-size:.8125rem;color:var(--c-text-secondary)}
.wad-tr b{color:var(--c-text);font-size:.6875rem;display:block}
.wad-dr{border-inline-start:1px solid var(--c-border);display:flex;flex-direction:column;min-inline-size:0}
.wad-dr .hd{padding:var(--sp-4) var(--sp-5);border-block-end:1px solid var(--c-border);display:flex;align-items:center;gap:var(--sp-2);min-block-size:64px}
.wad-dr .hd b{flex:1}
.wad-dr .bd{padding:var(--sp-5);display:grid;gap:var(--sp-4);align-content:start;flex:1}
.wad-dr h4{margin:0;font-size:1.125rem;line-height:1.35}
.wad-dr p{margin:0;font-size:.875rem;line-height:1.6;color:var(--c-text-secondary)}
.wad-dr .ft{padding:var(--sp-4) var(--sp-5);border-block-start:1px solid var(--c-border);display:grid;gap:var(--sp-2)}
.wad-ck{display:grid;gap:6px;font-size:.8125rem}
.wad-ck div{display:flex;gap:8px;align-items:center}.wad-ck .mon-ic{inline-size:16px;block-size:16px;color:var(--c-success-ink)}
.wad-rl{display:flex;align-items:center;gap:var(--sp-4);padding:var(--sp-4) var(--sp-5);min-block-size:72px}
.wad-rl+.wad-rl{border-block-start:1px dashed var(--c-border)}
.wad-rl .ri{inline-size:40px;block-size:40px;border-radius:var(--r-md);display:grid;place-items:center;background:var(--c-surface-neutral);flex:none}
.wad-rl .tx{flex:1;min-inline-size:0}.wad-rl .tx b{display:block;font-size:.9375rem}.wad-rl .tx small{font-size:.8125rem;color:var(--c-text-secondary)}
.wad-rl code{font:var(--fw-bold) .75rem/1 var(--font-mono);background:var(--c-surface-neutral);padding:3px 6px;border-radius:5px}
.wad-rl .m-switch{position:relative}.wad-rl .m-switch::before{content:'';position:absolute;inset:min(0px,calc((100% - 44px)/2)) -4px}
.mon .m-table td.mono{font-family:var(--font-mono);direction:ltr;text-align:end}
@container main (max-width:1039px){.wad-in{grid-template-columns:280px minmax(0,1fr)}.wad-dr{grid-column:1/-1;border-inline-start:0;border-block-start:1px solid var(--c-border)}}
@container main (max-width:899px){.wad-hero{grid-template-columns:minmax(0,1fr)}
 .wad-in{grid-template-columns:minmax(0,1fr);min-block-size:0}.wad-in[data-v=list] .wad-ch,.wad-in[data-v=list] .wad-dr{display:none}.wad-in[data-v=chat] .wad-ls{display:none}.wad-ch .bk{display:inline-flex}.wad-msgs{max-block-size:none}}
@container main (max-width:599px){.wad-kp{gap:var(--sp-4);flex-wrap:wrap}.wad-rl{flex-wrap:wrap;padding:var(--sp-4)}.wad-rl .tx{flex-basis:calc(100% - 120px)}}

/* ── meeting room ── */
.mtg-top{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:var(--sp-5)}
.mtg-pv{aspect-ratio:16/9;border-radius:var(--r-lg);background:var(--c-tape);color:var(--c-tape-ink);display:grid;place-items:center;position:relative;overflow:hidden;margin:var(--sp-5) var(--sp-5) 0}
.mtg-pv .nm{position:absolute;inset-block-end:12px;inset-inline-start:12px;font-size:.8125rem;font-weight:var(--fw-semibold);background:color-mix(in oklch,var(--c-scrim-media) 70%,transparent);padding:4px 10px;border-radius:var(--r-pill)}
.mtg-pv .mon-av{background:color-mix(in oklab,var(--a) 34%,var(--c-tape-3));color:var(--c-on-media)}
.mtg-pv .ctl{position:absolute;inset-block-end:10px;inset-inline-end:10px;display:flex;gap:8px}
.mtg-tg{inline-size:44px;block-size:44px;border-radius:50%;border:0;display:grid;place-items:center;cursor:pointer;background:color-mix(in oklch,var(--c-on-media) 18%,transparent);color:var(--c-on-media);transition:background var(--dur-fast) var(--ease)}
.mtg-tg[aria-pressed=false]{background:var(--c-error)}
.mtg-tg.end{background:var(--c-error);inline-size:64px;border-radius:var(--r-pill)}
.mtg-nx{padding:var(--sp-5);display:grid;gap:var(--sp-3)}
.mtg-nx h3{margin:0;font-size:1.25rem}.mtg-nx p{margin:0;color:var(--c-text-secondary);font-size:.875rem}
.mtg-nx .row{justify-content:space-between}
.mtg-ev{display:flex;align-items:center;gap:var(--sp-4);padding-block:var(--sp-3);min-block-size:64px}
.mtg-ev,.mtg-rec,.wad-cv,.hlp-a{min-inline-size:0}
.mtg-ev+.mtg-ev{border-block-start:1px dashed var(--c-border)}
.mtg-ev .tm{inline-size:56px;flex:none;font:var(--fw-bold) .875rem/1.2 var(--font-mono);text-align:center}.mtg-ev .tm small{display:block;font:var(--fw-medium) .6875rem/1.4 var(--font-body,inherit);color:var(--c-text-secondary)}
.mtg-ev .tx{flex:1;min-inline-size:0}.mtg-ev .tx b{display:block;font-size:.9375rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mtg-ev .tx small{font-size:.8125rem;color:var(--c-text-secondary)}
.mtg-rec{all:unset;box-sizing:border-box;cursor:pointer;display:flex;align-items:center;gap:var(--sp-4);padding:var(--sp-3) var(--sp-5);min-block-size:72px;inline-size:100%}
.mtg-rec+.mtg-rec{border-block-start:1px dashed var(--c-border)}.mtg-rec:hover{background:var(--c-state-hover)}.mtg-rec:focus-visible{outline:2px solid var(--c-primary);outline-offset:-2px}
.mtg-rec .th{inline-size:96px;aspect-ratio:16/9;border-radius:var(--r-sm);background:var(--c-tape);color:var(--c-tape-ink);display:grid;place-items:center;flex:none;position:relative;font:var(--fw-bold) .625rem/1 var(--font-mono)}
.mtg-rec .th span{position:absolute;inset-block-end:4px;inset-inline-end:5px}
.mtg-rec .tx{flex:1;min-inline-size:0}.mtg-rec .tx b{display:block;font-size:.9375rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mtg-rec .tx small{font-size:.8125rem;color:var(--c-text-secondary)}
.mtg-live{display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:var(--sp-5);align-items:stretch}
.mtg-stg{background:var(--c-tape);border-radius:var(--r-xl);padding:var(--sp-4);display:grid;gap:var(--sp-4);align-content:center}
.mtg-tiles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--sp-3)}
.mtg-t{aspect-ratio:16/10;border-radius:var(--r-lg);background:var(--c-tape-3);display:grid;place-items:center;position:relative;color:var(--c-tape-ink);outline:2px solid transparent;outline-offset:-2px;transition:outline-color var(--dur-normal) var(--ease)}
.mtg-t.spk{outline-color:var(--c-success)}
.mtg-t .mon-av{inline-size:64px;block-size:64px;font-size:1.25rem;background:color-mix(in oklab,var(--a) 34%,var(--c-tape-3));color:var(--c-on-media)}
.mtg-t.spk .mon-av{animation:mtg-spk 1.2s var(--ease) infinite}
@keyframes mtg-spk{50%{box-shadow:0 0 0 8px color-mix(in oklch,var(--c-success) 30%,transparent)}}
.mtg-t .nm{position:absolute;inset-block-end:8px;inset-inline-start:10px;font-size:.75rem;font-weight:var(--fw-semibold);display:flex;gap:6px;align-items:center;max-inline-size:calc(100% - 20px);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mtg-t .nm .mon-ic{inline-size:14px;block-size:14px;color:var(--c-error-ink)}
.mtg-t .host{position:absolute;inset-block-start:8px;inset-inline-start:10px;font-size:.75rem;font-weight:var(--fw-semibold);color:var(--c-tape-ink-2)}
.mtg-bar{display:flex;justify-content:center;gap:var(--sp-3);flex-wrap:wrap}
.mtg-side{display:flex;flex-direction:column;max-block-size:640px;min-block-size:520px}
.mtg-side .tabs-h{padding-inline:var(--sp-4)}
.mtg-trs{flex:1;overflow:auto;padding:var(--sp-4) var(--sp-5);display:grid;gap:var(--sp-4);align-content:start;scroll-behavior:smooth}
.mtg-ln{display:grid;grid-template-columns:auto minmax(0,1fr);gap:var(--sp-3);animation:twr-in var(--dur-slower) var(--ease)}
.mtg-ln .mon-av{inline-size:32px;block-size:32px;font-size:.75rem}
.mtg-ln b{font-size:.8125rem}.mtg-ln time{font:var(--fw-medium) .6875rem/1 var(--font-mono);color:var(--c-text-secondary);margin-inline-start:6px}
.mtg-ln p{margin:2px 0 0;font-size:.875rem;line-height:1.55}
.mtg-ln.draft p{color:var(--c-text-secondary)}
.mtg-ln .fx{display:inline-block;margin-block-start:4px;font-size:.6875rem;color:var(--c-info-ink);font-weight:var(--fw-semibold)}
.mtg-note{padding:var(--sp-3) var(--sp-5);font-size:.75rem;color:var(--c-text-secondary);border-block-start:1px solid var(--c-border);display:flex;gap:8px;align-items:center}
.mtg-sum{padding:var(--sp-4) var(--sp-5);display:grid;gap:var(--sp-4);align-content:start;overflow:auto;flex:1}
.mtg-sum ul{margin:0;padding-inline-start:18px;display:grid;gap:6px;font-size:.875rem}
.mtg-af{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);gap:var(--sp-5);align-items:start}
.mtg-ah{padding:var(--sp-5);display:grid;gap:var(--sp-3);justify-items:start}.mtg-ah .row{justify-self:stretch}
.mtg-ah h2{margin:0;font-size:1.375rem}.mtg-ah p{margin:0;color:var(--c-text-secondary);font-size:.875rem}
.mtg-sp{padding:0 var(--sp-5) var(--sp-5);font-size:.9375rem;line-height:1.75;margin:0}
.mtg-dc{display:grid;gap:var(--sp-2);padding:0 var(--sp-5) var(--sp-5);margin:0;list-style:none;counter-reset:d}
.mtg-dc li{display:flex;gap:var(--sp-3);align-items:start;font-size:.9375rem;line-height:1.5;counter-increment:d}
.mtg-dc li::before{content:counter(d);inline-size:24px;block-size:24px;border-radius:50%;flex:none;display:grid;place-items:center;font-size:.75rem;font-weight:var(--fw-bold);background:color-mix(in oklch,var(--c-primary) 14%,transparent);color:var(--c-primary-ink)}
.mtg-ac{display:flex;gap:var(--sp-3);align-items:center;padding:var(--sp-3) var(--sp-5);min-block-size:60px;cursor:pointer}
.mtg-ac+.mtg-ac{border-block-start:1px dashed var(--c-border)}
.mtg-ac input{inline-size:20px;block-size:20px;accent-color:var(--c-success);flex:none}
.mtg-ac .tx{flex:1;min-inline-size:0;font-size:.875rem}.mtg-ac .tx b{display:block}.mtg-ac .tx small{color:var(--c-text-secondary)}
.mtg-ac:has(input:checked) .tx b{text-decoration:line-through;color:var(--c-text-secondary)}
.mtg-ac time{font:var(--fw-bold) .75rem/1 var(--font-mono);color:var(--c-warning-ink);flex:none}
.mtg-q{display:flex;align-items:center;gap:var(--sp-2);margin:var(--sp-4) var(--sp-5) 0;border:1px solid var(--c-border);border-radius:var(--r-md);padding-inline:12px;min-block-size:44px;color:var(--c-text-secondary)}
.mtg-q input{all:unset;flex:1;font-size:.875rem;color:var(--c-text);min-block-size:44px}
.mtg-q+.mtg-trs{max-block-size:420px}
.mtg-ln mark{background:color-mix(in oklch,var(--c-warning) 35%,transparent);color:inherit;border-radius:3px}
@container main (max-width:1099px){.mtg-live,.mtg-af{grid-template-columns:minmax(0,1fr)}.mtg-side{max-block-size:480px;min-block-size:0}}
@container main (max-width:899px){.mtg-top{grid-template-columns:minmax(0,1fr)}}
@container main (max-width:599px){.mtg-tiles{grid-template-columns:repeat(2,minmax(0,1fr))}.mtg-t .mon-av{inline-size:48px;block-size:48px;font-size:1rem}.mtg-rec .th{inline-size:72px}.mtg-stg{padding:var(--sp-3);border-radius:var(--r-lg)}.mtg-ev .mon-avs{display:none}.mtg-pv{margin:var(--sp-4) var(--sp-4) 0}}

/* ── help center ── */
.hlp-in{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:var(--sp-5);align-items:start}
.hlp-chat{display:flex;flex-direction:column;min-block-size:600px}
.hlp-log{flex:1;padding:var(--sp-5);display:flex;flex-direction:column;gap:var(--sp-4);overflow:auto;max-block-size:620px}
.hlp-me{align-self:flex-end;max-inline-size:80%;background:var(--c-text);color:var(--c-surface);padding:10px 14px;border-radius:16px;border-end-end-radius:4px;font-size:.9375rem;line-height:1.5}
.hlp-ai{align-self:flex-start;max-inline-size:min(92%,620px);background:var(--c-surface-neutral);padding:var(--sp-4);border-radius:16px;border-end-start-radius:4px;font-size:.9375rem;line-height:1.6;display:grid;gap:var(--sp-3)}
.hlp-ai p{margin:0}.hlp-ai ol{margin:0;padding-inline-start:20px;display:grid;gap:4px}
.hlp-ai .src{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.hlp-ai .src>span{font-size:.875rem;font-weight:var(--fw-semibold);color:var(--c-text-secondary)}
.hlp-src{all:unset;cursor:pointer;display:inline-flex;align-items:center;gap:6px;min-block-size:32px;padding-inline:10px;border-radius:var(--r-sm);background:var(--c-surface);border:1px solid var(--c-border);font-size:.8125rem;font-weight:var(--fw-semibold);position:relative}
.hlp-src::before{content:'';position:absolute;inset-block:min(0px,calc((100% - 44px)/2));inset-inline:0}
.hlp-src:hover{border-color:var(--c-border-strong)}.hlp-src .mon-ic{inline-size:14px;block-size:14px}
.hlp-fb{display:flex;align-items:center;gap:6px;font-size:.75rem;color:var(--c-text-secondary)}
.hlp-fb button{border:1px solid var(--c-border);background:var(--c-surface);border-radius:var(--r-sm);inline-size:44px;block-size:32px;display:grid;place-items:center;cursor:pointer;color:var(--c-text-secondary);position:relative}
.hlp-fb button::before{content:'';position:absolute;inset-block:min(0px,calc((100% - 44px)/2));inset-inline:0}
.hlp-fb button[aria-pressed=true]{background:var(--c-text);color:var(--c-surface);border-color:transparent}
.hlp-fb .mon-ic{inline-size:15px;block-size:15px}
.hlp-ai.unk{background:color-mix(in oklch,var(--c-warning) 12%,transparent)}
.hlp-sg{display:flex;flex-wrap:wrap;gap:var(--sp-2);padding:0 var(--sp-5) var(--sp-3)}
.hlp-sg button{border:1px solid var(--c-border);background:var(--c-surface);border-radius:var(--r-pill);min-block-size:36px;padding-inline:14px;font:inherit;font-size:.8125rem;cursor:pointer;color:var(--c-text);position:relative}
.hlp-sg button::before{content:'';position:absolute;inset-block:min(0px,calc((100% - 44px)/2));inset-inline:0}
.hlp-sg button:hover{border-color:var(--c-border-strong)}
.hlp-f{display:flex;gap:var(--sp-2);padding:var(--sp-4) var(--sp-5);border-block-start:1px solid var(--c-border)}
.hlp-f input{flex:1;min-inline-size:0;border:1px solid var(--c-border-input,var(--c-border));border-radius:var(--r-md);padding:0 14px;font:inherit;min-block-size:48px;background:transparent;color:var(--c-text)}
.hlp-f input:focus{outline:2px solid var(--c-primary);outline-offset:-1px}
.hlp-ty{display:flex;gap:4px;padding:6px 2px}.hlp-ty i{inline-size:7px;block-size:7px;border-radius:50%;background:var(--c-text-disabled);animation:hlp-ty 1s var(--ease) infinite}.hlp-ty i:nth-child(2){animation-delay:.15s}.hlp-ty i:nth-child(3){animation-delay:.3s}
@keyframes hlp-ty{50%{opacity:.25;translate:0 -3px}}
.hlp-al{display:grid}
.hlp-a{all:unset;box-sizing:border-box;cursor:pointer;display:flex;gap:var(--sp-3);align-items:center;padding:var(--sp-3) var(--sp-5);min-block-size:64px;inline-size:100%}
.hlp-a+.hlp-a{border-block-start:1px dashed var(--c-border)}.hlp-a:hover{background:var(--c-state-hover)}.hlp-a:focus-visible{outline:2px solid var(--c-primary);outline-offset:-2px}
.hlp-a .ai{inline-size:36px;block-size:36px;border-radius:var(--r-md);display:grid;place-items:center;flex:none;background:color-mix(in oklch,var(--c-primary) 10%,transparent);color:var(--c-primary-ink)}
.hlp-a .tx{flex:1;min-inline-size:0}.hlp-a .tx b{display:block;font-size:.9375rem;font-weight:var(--fw-semibold)}.hlp-a .tx small{font-size:.8125rem;color:var(--c-text-secondary)}
.hlp-se{display:flex;align-items:center;gap:var(--sp-2);border:1px solid var(--c-border);border-radius:var(--r-md);padding-inline:14px;min-block-size:48px;color:var(--c-text-secondary);background:var(--c-surface)}
.hlp-se input{all:unset;flex:1;min-block-size:48px;font-size:.9375rem;color:var(--c-text)}
.hlp-cats{display:flex;gap:var(--sp-2);flex-wrap:wrap}
.hlp-cats .pill{cursor:pointer;min-block-size:36px;position:relative}.hlp-cats .pill::before{content:'';position:absolute;inset-block:min(0px,calc((100% - 44px)/2));inset-inline:0}
.hlp-art{display:grid;gap:var(--sp-4)}
.hlp-art ol{margin:0;padding-inline-start:22px;display:grid;gap:var(--sp-2);font-size:.9375rem;line-height:1.65}
.hlp-art .nt{padding:var(--sp-3) var(--sp-4);border-radius:var(--r-md);background:color-mix(in oklch,var(--c-info) 10%,transparent);font-size:.875rem;line-height:1.6}
.hlp-q{display:flex;gap:var(--sp-3);align-items:center;padding:var(--sp-4) var(--sp-5);min-block-size:72px}
.hlp-q+.hlp-q{border-block-start:1px dashed var(--c-border)}
.hlp-q .tx{flex:1;min-inline-size:0}.hlp-q .tx b{display:block;font-size:.9375rem}.hlp-q .tx small{font-size:.8125rem;color:var(--c-text-secondary)}
.hlp-q .ct{font:var(--fw-bold) .75rem/1 var(--font-mono);padding:6px 8px;border-radius:var(--r-pill);background:var(--c-surface-neutral);flex:none}
.hlp-side{display:grid;gap:var(--sp-4)}
@container main (max-width:1099px){.hlp-in{grid-template-columns:minmax(0,1fr)}.hlp-chat{min-block-size:0}}
@container main (max-width:599px){.hlp-q{flex-wrap:wrap}.hlp-q .tx{flex-basis:calc(100% - 60px)}.hlp-me,.hlp-ai{max-inline-size:100%}.hlp-log{padding:var(--sp-4)}}
}
@layer foundation, reset, tokens, components.kit, components.app, tenant-overrides, utilities;
/* the only unlayered rule: beats the page skeleton that pins :root to light */
:root[data-color-scheme=dark]{color-scheme:dark}
/* Gamitop Live Logger — canonical tokens (CSS2025 L1→L5). Generated by Style-Dictionary 4; do not edit. */
@layer tokens {
  :root {
    /* L1 — global primitives (109) */
    --c-grey-50: oklch(99.33% 0.0011 197.14);
    --c-grey-100: oklch(98.46% 0.0017 247.84);
    --c-grey-200: oklch(97.22% 0.0034 247.86);
    --c-grey-300: oklch(91.42% 0.0081 253.86);
    --c-grey-400: oklch(84.38% 0.0149 244.75);
    --c-grey-500: oklch(69.32% 0.0242 248.18);
    --c-grey-600: oklch(54.74% 0.0291 244.76);
    --c-grey-700: oklch(42.34% 0.0238 253.08);
    --c-grey-800: oklch(25.99% 0.0213 248.65);
    --c-grey-900: oklch(21.5% 0.0165 252.5);
    --c-grey-850: oklch(31.26% 0.0241 251.04);
    --c-black: oklch(0% 0 0);
    --c-white: oklch(100% 0 0);
    --c-teal-100: oklch(94.09% 0.0704 153.61);
    --c-teal-300: oklch(82.52% 0.1588 156.76);
    --c-teal-500: oklch(64.3% 0.144 160.62);
    --c-teal-700: oklch(51.25% 0.0941 178.27);
    --c-teal-900: oklch(37.59% 0.064 202.48);
    --c-purple-100: oklch(90.92% 0.0611 312.25);
    --c-purple-300: oklch(72.93% 0.1819 307.24);
    --c-purple-500: oklch(56.95% 0.2716 296.65);
    --c-purple-700: oklch(41.58% 0.2175 288.71);
    --c-purple-900: oklch(29.32% 0.1656 281.06);
    --c-cyan-100: oklch(95.67% 0.0528 184.64);
    --c-cyan-300: oklch(88.64% 0.1238 195.15);
    --c-cyan-500: oklch(72.15% 0.1287 216.76);
    --c-cyan-700: oklch(50.42% 0.1115 237.82);
    --c-cyan-900: oklch(33.51% 0.1002 251.99);
    --c-green-100: oklch(95.12% 0.0701 144.38);
    --c-green-300: oklch(85.38% 0.1724 147.56);
    --c-green-500: oklch(72.27% 0.192 149.58);
    --c-green-700: oklch(56.82% 0.1304 157.22);
    --c-green-900: oklch(42.98% 0.0827 170.37);
    --c-amber-100: oklch(96.77% 0.0541 95.87);
    --c-amber-300: oklch(89% 0.1375 89.24);
    --c-amber-500: oklch(80.34% 0.1704 73.79);
    --c-amber-700: oklch(60.48% 0.1349 65.72);
    --c-amber-900: oklch(43.71% 0.1032 59.34);
    --c-tomato-100: oklch(94.65% 0.0358 64.68);
    --c-tomato-300: oklch(81.58% 0.1129 47.51);
    --c-tomato-500: oklch(67.9% 0.2114 34.02);
    --c-tomato-700: oklch(50.19% 0.1885 28.5);
    --c-tomato-900: oklch(37.04% 0.1428 23.75);
    --sp-1: 4px;
    --sp-2: 8px;
    --sp-3: 12px;
    --sp-4: 16px;
    --sp-5: 20px;
    --sp-6: 24px;
    --sp-8: 32px;
    --sp-10: 40px;
    --sp-12: 48px;
    --sp-16: 64px;
    --r-xs: 4px;
    --r-sm: 8px;
    --r-md: 12px;
    --r-lg: 16px;
    --r-xl: 24px;
    --r-pill: 999px;
    --z-base: 0;
    --z-raised: 1;
    --z-header: 1101;
    --z-backdrop: 1200;
    --z-nav: 1201;
    --z-popover: 1300;
    --alpha-4: 0.04;
    --alpha-8: 0.08;
    --alpha-12: 0.12;
    --alpha-16: 0.16;
    --alpha-24: 0.24;
    --alpha-32: 0.32;
    --alpha-48: 0.48;
    --dur-fast: 120ms;
    --dur-normal: 200ms;
    --dur-slow: 300ms;
    --dur-slower: 450ms;
    --ease: cubic-bezier(0.32, 0.72, 0, 1);
    --text-h1: clamp(2.5rem, 1.5rem + 3.3333cqi, 4rem);
    --text-h2: clamp(2rem, 1.3333rem + 2.2222cqi, 3rem);
    --text-h3: clamp(1.5rem, 1.1667rem + 1.1111cqi, 2rem);
    --text-h4: clamp(1.25rem, 1.0833rem + 0.5556cqi, 1.5rem);
    --text-h5: clamp(1.125rem, 1.0833rem + 0.1389cqi, 1.1875rem);
    --text-h6: clamp(1.0625rem, 1.0208rem + 0.1389cqi, 1.125rem);
    --text-subtitle1: 1rem;
    --text-subtitle2: 0.875rem;
    --text-body1: 1rem;
    --text-body2: 0.875rem;
    --text-caption: 0.75rem;
    --text-overline: 0.75rem;
    --text-button-sm: 0.8125rem;
    --text-button-lg: 0.9375rem;
    --text-micro: 0.6875rem;
    --text-nano: 0.625rem;
    --font-mono: "JetBrains Mono", ui-monospace, monospace;
    --fw-regular: 400;
    --fw-medium: 500;
    --fw-semibold: 600;
    --fw-bold: 700;
    --fw-extrabold: 800;
    --lh-none: 1;
    --lh-tight: 1.25;
    --lh-snug: 1.3333;
    --lh-normal: 1.5;
    --lh-relaxed: 1.5556;
    --lh-comfy: 1.5714;
    --lh-loose: 1.7143;
    --ls-normal: 0;
    --ls-wide: .04em;
    --ls-wider: .06em;

    /* L2 — semantic (refs L1) (64) */
    --c-secondary-lighter: var(--c-purple-100);
    --c-secondary-light: var(--c-purple-300);
    --c-secondary: var(--c-purple-500);
    --c-secondary-dark: var(--c-purple-700);
    --c-secondary-darker: var(--c-purple-900);
    --c-info-lighter: var(--c-cyan-100);
    --c-info-light: var(--c-cyan-300);
    --c-info: var(--c-cyan-500);
    --c-info-dark: var(--c-cyan-700);
    --c-info-darker: var(--c-cyan-900);
    --c-success-lighter: var(--c-green-100);
    --c-success-light: var(--c-green-300);
    --c-success: var(--c-green-500);
    --c-success-dark: var(--c-green-700);
    --c-success-darker: var(--c-green-900);
    --c-warning-lighter: var(--c-amber-100);
    --c-warning-light: var(--c-amber-300);
    --c-warning: var(--c-amber-500);
    --c-warning-dark: var(--c-amber-700);
    --c-warning-darker: var(--c-amber-900);
    --c-error-lighter: var(--c-tomato-100);
    --c-error-light: var(--c-tomato-300);
    --c-error: var(--c-tomato-500);
    --c-error-dark: var(--c-tomato-700);
    --c-error-darker: var(--c-tomato-900);
    --c-primary-contrast: var(--c-white);
    --c-warning-contrast: var(--c-grey-800);
    --c-surface-glass: color-mix(in oklch, var(--c-surface-page) 80%, transparent);
    --c-overlay: color-mix(in oklch, var(--c-black) 40%, transparent);
    --c-state-hover: color-mix(in oklch, var(--c-grey-500) 8%, transparent);
    --c-state-selected: color-mix(in oklch, var(--c-grey-500) 16%, transparent);
    --c-state-focus: color-mix(in oklch, var(--c-grey-500) 24%, transparent);
    --c-state-disabled: color-mix(in oklch, var(--c-grey-500) 80%, transparent);
    --c-state-disabled-bg: color-mix(in oklch, var(--c-grey-500) 24%, transparent);
    --c-primary-soft: color-mix(in oklch, var(--c-primary) 16%, transparent);
    --c-primary-soft-hover: color-mix(in oklch, var(--c-primary) 32%, transparent);
    --c-primary-selected: color-mix(in oklch, var(--c-primary) 8%, transparent);
    --c-border: color-mix(in oklch, var(--c-grey-500) 20%, transparent);
    --c-border-subtle: color-mix(in oklch, var(--c-grey-500) 16%, transparent);
    --c-border-strong: color-mix(in oklch, var(--c-grey-500) 32%, transparent);
    --c-border-input: var(--c-border);
    --c-focus-ring: var(--c-primary);
    --density-card-p: var(--sp-6);
    --density-grid-gap: var(--sp-3);
    --density-cell-py: var(--sp-4);
    --density-control-h: 44px;
    --focus-ring-width: 2px;
    --focus-ring-offset: 2px;
    --shadow-z1: 0 1px 2px 0 color-mix(in oklch, var(--c-shadow) 16%, transparent);
    --shadow-z4: 0 4px 8px 0 color-mix(in oklch, var(--c-shadow) 16%, transparent);
    --shadow-z8: 0 8px 16px 0 color-mix(in oklch, var(--c-shadow) 16%, transparent);
    --shadow-z12: 0 12px 24px -4px color-mix(in oklch, var(--c-shadow) 16%, transparent);
    --shadow-z16: 0 16px 32px -4px color-mix(in oklch, var(--c-shadow) 16%, transparent);
    --shadow-z20: 0 20px 40px -4px color-mix(in oklch, var(--c-shadow) 16%, transparent);
    --shadow-z24: 0 24px 48px 0 color-mix(in oklch, var(--c-shadow) 16%, transparent);
    --shadow-card: 0 0 2px 0 color-mix(in oklch, var(--c-shadow) 20%, transparent), 0 12px 24px -4px color-mix(in oklch, var(--c-shadow) 12%, transparent);
    --shadow-dropdown: 0 0 2px 0 color-mix(in oklch, var(--c-shadow) 24%, transparent), -20px 20px 40px -4px color-mix(in oklch, var(--c-shadow) 24%, transparent);
    --shadow-dialog: -40px 40px 80px -8px color-mix(in oklch, var(--c-black) 24%, transparent);
    --shadow-primary: 0 8px 16px 0 color-mix(in oklch, var(--c-primary) 24%, transparent);
    --shadow-secondary: 0 8px 16px 0 color-mix(in oklch, var(--c-secondary) 24%, transparent);
    --shadow-info: 0 8px 16px 0 color-mix(in oklch, var(--c-info) 24%, transparent);
    --shadow-success: 0 8px 16px 0 color-mix(in oklch, var(--c-success) 24%, transparent);
    --shadow-warning: 0 8px 16px 0 color-mix(in oklch, var(--c-warning) 24%, transparent);
    --shadow-error: 0 8px 16px 0 color-mix(in oklch, var(--c-error) 24%, transparent);

    /* L3 — style pack: Gamitop (22) */
    --c-primary-lighter: var(--c-gamitop-red-100);
    --c-primary-light: var(--c-gamitop-red-300);
    --c-primary: var(--c-gamitop-red-500);
    --c-primary-dark: var(--c-gamitop-red-700);
    --c-primary-darker: var(--c-gamitop-red-900);
    --c-gamitop-red-100: oklch(93.35% 0.0335 24.58);
    --c-gamitop-red-300: oklch(65.55% 0.1944 20.09);
    --c-gamitop-red-500: oklch(53.08% 0.2178 29.23);
    --c-gamitop-red-700: oklch(44.93% 0.1844 29.23);
    --c-gamitop-red-900: oklch(30.35% 0.1232 25.46);
    --c-gamitop-blue: oklch(44.36% 0.1671 263.49);
    --c-gamitop-night: oklch(18.03% 0.0121 254.14);
    --c-gamitop-rose: oklch(84.05% 0.0878 19.07);
    --c-accent: var(--c-gamitop-blue);
    --c-tape-2: var(--c-grey-800);
    --c-tape-3: var(--c-grey-850);
    --c-tape-ink: var(--c-grey-200);
    --c-tape-ink-2: var(--c-grey-500);
    --c-tape-hot: var(--c-gamitop-rose);
    --c-on-media: var(--c-white);
    --c-scrim-media: var(--c-grey-900);
    --font-display: var(--font-body);

    /* L4 — country: Israel (5) */
    --font-body: "Assistant", "Arial Hebrew", "Segoe UI", "Arial", system-ui, sans-serif;
    --dir-base: rtl;
    --dir-start: right;
    --dir-end: left;
    --dir-sign: -1;

    /* L5 — mood: light-dark() (9) */
    --c-surface: light-dark(var(--c-white), var(--c-grey-800));
    --c-surface-page: light-dark(var(--c-white), var(--c-grey-900));
    --c-surface-neutral: light-dark(var(--c-grey-200), var(--c-grey-850));
    --c-text: light-dark(var(--c-grey-800), var(--c-white));
    --c-text-secondary: light-dark(var(--c-grey-600), var(--c-grey-500));
    --c-text-disabled: light-dark(var(--c-grey-500), var(--c-grey-600));
    --c-state-active: light-dark(var(--c-grey-600), var(--c-grey-500));
    --c-shadow: light-dark(var(--c-grey-500), var(--c-black));
    --c-tape: light-dark(var(--c-grey-900), var(--c-gamitop-night));
  }
}

@layer components.kit {

.m-av-default { background: color-mix(in oklch,var(--c-grey-500) calc(var(--alpha-16) * 100%),transparent); color: var(--c-text-secondary); }
:root {                                                                  --layout-nav-zIndex: var(--z-nav); --layout-nav-mobile-width: 288px; --layout-header-blur: var(--sp-2); --layout-header-zIndex: var(--z-header); --layout-header-mobile-height: var(--sp-16); --layout-header-desktop-height: 72px; --layout-nav-mini-width: 88px; --layout-nav-vertical-width: 300px; --layout-nav-horizontal-height: var(--sp-16); --layout-dashboard-content-pt: var(--sp-2); --layout-dashboard-content-pb: var(--sp-16); --layout-dashboard-content-px: var(--sp-10); --nav-item-gap: var(--sp-1); --nav-item-radius: var(--r-sm); --nav-item-pt: var(--sp-1); --nav-item-pr: var(--sp-2); --nav-item-pb: var(--sp-1); --nav-item-pl: var(--sp-3); --nav-item-root-height: var(--density-control-h); --nav-item-sub-height: 36px; --nav-icon-size: var(--sp-6); --nav-bullet-size: var(--sp-3); --nav-bullet-light: oklch(95.15% 0.0046 258.32); --nav-bullet-dark: oklch(30.18% 0.0175 251.87);                      }
:root, [data-color-scheme="light"] {                          color-scheme: light;                    --nav-item-color: var(--c-text-secondary); --nav-item-hover-bg: var(--c-state-hover); --nav-item-caption-color: var(--c-text-disabled); --nav-item-root-active-color: var(--c-primary); --nav-item-root-active-bg: var(--c-primary-selected); --nav-item-root-active-hover-bg: var(--c-primary-soft); --nav-item-root-open-color: var(--c-text); --nav-item-sub-active-color: var(--c-text); --nav-item-sub-active-bg: var(--c-state-hover); --nav-subheader-color: var(--c-text-disabled); --nav-bullet-color: light-dark(var(--nav-bullet-light), var(--nav-bullet-dark));  }
.m-root { font-family: var(--font-body); color: var(--c-text); background: var(--c-surface-page); min-height: 100vh; -webkit-font-smoothing: antialiased; }
.m-root *, .m-root ::before, .m-root ::after { box-sizing: border-box; }
.m-root h1, .m-root h2, .m-root h3, .m-root h4, .m-root h5, .m-root h6, .m-root p { margin: 0px; }
.m-root button { font-family: inherit; }
.m-root a { color: inherit; text-decoration: none; }
.m-root ::selection { background: color-mix(in oklch,var(--c-primary) 24%,transparent); }
.m-h1, .m-h2, .m-h3 { font-family: var(--font-display); }
.m-h1 { font-weight: var(--fw-extrabold); line-height: 1.25; font-size: 2.5rem; }
.m-h2 { font-weight: var(--fw-extrabold); line-height: 1.3333; font-size: 2rem; }
.m-h3 { font-weight: var(--fw-bold); line-height: 1.5; font-size: 1.5rem; }
.m-h4 { font-weight: var(--fw-bold); line-height: 1.5; font-size: 1.25rem; }
.m-h5 { font-weight: var(--fw-bold); line-height: 1.5; font-size: 1.125rem; }
.m-h6 { font-weight: var(--fw-semibold); line-height: 1.5556; font-size: 1.0625rem; }
.m-subtitle1 { font-weight: var(--fw-semibold); line-height: 1.5; font-size: 1rem; }
.m-subtitle2 { font-weight: var(--fw-semibold); line-height: 1.5714; font-size: 0.875rem; }
.m-body1 { line-height: 1.5; font-size: 1rem; }
.m-body2 { line-height: 1.5714; font-size: 0.875rem; }
.m-caption { line-height: 1.5; font-size: 0.75rem; }
.m-overline { font-weight: var(--fw-bold); line-height: 1.5; font-size: 0.75rem; text-transform: uppercase; }
@container page (min-width: 600px){.m-h1 { font-size: 3.25rem; }
.m-h2 { font-size: 2.5rem; }
.m-h3 { font-size: 1.625rem; }
.m-h5 { font-size: 1.1875rem; }
.m-h6 { font-size: 1.125rem; }}
@container page (min-width: 900px){.m-h1 { font-size: 3.625rem; }
.m-h2 { font-size: 2.75rem; }
.m-h3 { font-size: 1.875rem; }
.m-h4 { font-size: 1.5rem; }}
@container page (min-width: 900px){.m-h1 { font-size: 4rem; }
.m-h2 { font-size: 3rem; }
.m-h3 { font-size: 2rem; }}
.m-text-secondary { color: var(--c-text-secondary); }
.m-text-disabled { color: var(--c-text-disabled); }
.m-card { position: relative; background: var(--c-surface); box-shadow: var(--shadow-card); border-radius: var(--r-lg); z-index: 0; }
.m-card-header { padding: 24px 24px 0px; display: flex; align-items: center; gap: 16px; }
.m-card-header-text { flex: 1 1 auto; min-width: 0px; }
.m-card-header .m-sub { margin-top: 4px; }
.m-card-content { padding: 24px; }
.m-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; border: 0px; cursor: pointer; user-select: none; border-radius: var(--r-sm); font-weight: var(--fw-bold); font-size: 0.875rem; line-height: 1.7143; transition: background-color 0.25s var(--ease), box-shadow 0.25s var(--ease), border-color 0.25s, color 0.15s; }
.m-btn-sm { min-height: 30px; padding: 4px 8px; font-size: 0.8125rem; line-height: 1.6923; }
.m-btn-md { min-height: 36px; padding: 6px 12px; }
.m-btn-lg { min-height: 48px; padding: 8px 16px; font-size: 0.9375rem; line-height: 1.7333; }
.m-btn-contained-primary { background: var(--c-primary); color: oklch(100% 0.0000 0.00); }
.m-btn-contained-primary:hover { background: var(--c-primary-dark); box-shadow: var(--shadow-primary); }
.m-btn-contained-inherit { background: var(--c-text); color: var(--c-surface); }
.m-btn-contained-inherit:hover { box-shadow: var(--shadow-z8); }
.m-btn-contained-white { background: oklch(100% 0.0000 0.00); color: var(--c-grey-800); }
.m-btn-contained-white:hover { box-shadow: var(--shadow-z8); }
.m-btn-soft-primary { background: color-mix(in oklch,var(--c-primary) calc(var(--alpha-16) * 100%),transparent); color: var(--c-primary-dark); }
.m-btn-soft-primary:hover { background: color-mix(in oklch,var(--c-primary) calc(var(--alpha-32) * 100%),transparent); }
.m-btn-outlined-inherit { border: 1px solid var(--c-border-strong); color: var(--c-text); background: transparent; }
.m-btn-outlined-inherit:hover { border-color: var(--c-text); box-shadow: 0 0 0 .75px var(--c-text); background: var(--c-state-hover); }
.m-btn-text-inherit { background: transparent; color: var(--c-text); }
.m-btn-text-inherit:hover { background: var(--c-state-hover); }
.m-btn:disabled { color: var(--c-state-disabled); background: var(--c-state-disabled-bg); cursor: default; pointer-events: none; }
.m-btn:focus-visible, .m-icon-btn:focus-visible, .m-nav-item:focus-visible, .m-nav-subitem:focus-visible { outline: 2px solid var(--c-primary); outline-offset: 2px; }
.m-icon-btn { display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; border: 0px; border-radius: 50%; background: transparent; color: var(--c-text-secondary); cursor: pointer; transition: background-color 0.15s var(--ease); position: relative; }
.m-icon-btn:hover { background: var(--c-state-hover); }
.m-icon-btn-sm { width: 34px; height: 34px; }
.m-badge-dot { position: absolute; top: 6px; inset-inline-end: 6px; width: 8px; height: 8px; border-radius: 50%; background: var(--c-error); border: 2px solid var(--c-surface); }
.m-label { display: inline-flex; align-items: center; gap: 4px; height: 24px; padding-inline: 6px; border-radius: 6px; font-size: 0.75rem; font-weight: var(--fw-bold); line-height: 1.5; }
.m-label-soft-success { background: color-mix(in oklch,var(--c-success) calc(var(--alpha-16) * 100%),transparent); color: var(--c-success-dark); }
.m-label-soft-error { background: color-mix(in oklch,var(--c-error) calc(var(--alpha-16) * 100%),transparent); color: var(--c-error-dark); }
.m-label-soft-warning { background: color-mix(in oklch,var(--c-warning) calc(var(--alpha-16) * 100%),transparent); color: var(--c-warning-dark); }
.m-label-soft-info { background: color-mix(in oklch,var(--c-info) calc(var(--alpha-16) * 100%),transparent); color: var(--c-info-dark); }
.m-label-soft-primary { background: color-mix(in oklch,var(--c-primary) calc(var(--alpha-16) * 100%),transparent); color: var(--c-primary-dark); }
.m-layout { display: flex; min-height: 100vh; }
.m-main { flex: 1 1 auto; min-width: 0px; display: flex; flex-direction: column; }
.m-content { display: flex; flex: 1 1 auto; flex-direction: column; padding-block-start: var(--layout-dashboard-content-pt); padding-block-end: var(--layout-dashboard-content-pb); padding-inline: 16px; width: 100%; max-width: 1536px; margin-inline: auto; }
@container page (min-width: 900px){.m-content { padding-inline: var(--layout-dashboard-content-px); }}
.m-header { position: sticky; top: 0px; z-index: var(--layout-header-zIndex); display: flex; align-items: center; gap: 4px; height: var(--layout-header-mobile-height); padding-inline: 16px; background: color-mix(in oklch,var(--c-surface-page) 80%,transparent); backdrop-filter: blur(var(--layout-header-blur)); border-block-end: 1px dashed var(--c-border); }
@container page (min-width: 900px){.m-header { height: var(--layout-header-desktop-height); padding-inline: 40px 24px; }}
.m-header-spacer { flex: 1 1 auto; }
.m-searchbox { display: none; align-items: center; gap: 8px; height: 40px; padding-inline: 12px; border-radius: var(--r-sm); color: var(--c-text-secondary); cursor: pointer; transition: background-color 0.15s; }
.m-searchbox:hover { background: var(--c-state-hover); }
.m-searchbox kbd { font: 700 12px/1 var(--font-body); background: var(--c-surface-neutral); border-radius: 6px; padding: 2px 6px; color: var(--c-text-disabled); }
@container page (min-width: 900px){.m-searchbox { display: inline-flex; }
.m-header-searchicon { display: none; }}
.m-avatar { width: 40px; height: 40px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; font-weight: var(--fw-semibold); font-size: 0.875rem; background: color-mix(in oklch,var(--c-primary) calc(var(--alpha-16) * 100%),transparent); color: var(--c-primary-dark); border: 2px solid var(--c-surface); cursor: pointer; }
[data-color-scheme="dark"] .m-avatar { color: var(--c-primary-light); }
.m-nav { display: none; }
@container page (min-width: 900px){.m-nav { display: block; width: var(--layout-nav-vertical-width); flex-shrink: 0; background: var(--c-surface-page); border-inline-end: 1px dashed var(--c-border); }
.m-nav-inner { position: sticky; top: 0px; height: 100vh; overflow-y: auto; padding: 24px 16px; }
.m-layout.m-nav-mini .m-nav { width: var(--layout-nav-mini-width); }
.m-layout.m-nav-mini .m-nav-inner { padding: 24px 8px; }}
.m-nav-logo { display: inline-flex; width: 40px; height: 40px; margin-block-end: 16px; margin-inline-start: 12px; }
.m-nav-subheader { font-size: 0.75rem; font-weight: var(--fw-bold); line-height: 1.5; text-transform: uppercase; color: var(--nav-subheader-color); padding: 24px 16px 8px; cursor: default; }
.m-nav-section:first-of-type .m-nav-subheader { padding-block-start: 8px; }
.m-nav-item { display: flex; align-items: center; width: 100%; min-height: var(--nav-item-root-height); padding-block: var(--nav-item-pt) var(--nav-item-pb); padding-inline: var(--nav-item-pl) var(--nav-item-pr); border: 0px; background: transparent; border-radius: var(--nav-item-radius); color: var(--nav-item-color); font-size: 0.875rem; font-weight: var(--fw-medium); line-height: 1.5714; cursor: pointer; text-align: start; margin-block-start: var(--nav-item-gap); transition: background-color 0.15s, color 0.15s; }
.m-nav-item:hover { background: var(--nav-item-hover-bg); }
.m-nav-item.active { color: var(--nav-item-root-active-color); background: var(--nav-item-root-active-bg); font-weight: var(--fw-semibold); }
.m-nav-item.active:hover { background: var(--nav-item-root-active-hover-bg); }
.m-nav-item .m-icon { flex-shrink: 0; }
.m-nav-item-title { flex: 1 1 auto; min-width: 0px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.m-nav-item-chevron { flex-shrink: 0; width: 16px; height: 16px; transition: transform 0.2s; opacity: 0.72; }
.m-nav-item.open .m-nav-item-chevron { transform: rotate(90deg); }
.m-nav-item-caption { display: block; font-size: 0.75rem; color: var(--nav-item-caption-color); }
.m-nav-sub { overflow: hidden; }
.m-nav-subitem { display: flex; align-items: center; width: 100%; min-height: var(--nav-item-sub-height); border: 0px; background: transparent; color: var(--nav-item-color); font-size: 0.875rem; font-weight: var(--fw-medium); border-radius: var(--nav-item-radius); padding-inline: var(--nav-item-pl) var(--nav-item-pr); cursor: pointer; text-align: start; margin-block-start: var(--nav-item-gap); }
.m-nav-subitem:hover { background: var(--nav-item-hover-bg); }
.m-nav-subitem.active { color: var(--nav-item-sub-active-color); background: var(--nav-item-sub-active-bg); font-weight: var(--fw-semibold); }
.m-nav-bullet { flex-shrink: 0; width: var(--nav-bullet-size); height: var(--nav-bullet-size); border-radius: 50%; background: var(--nav-bullet-color); margin-inline: 6px 16px; transition: transform 0.15s, background-color 0.15s; }
.m-nav-subitem.active .m-nav-bullet { background: var(--c-primary); transform: scale(1.3333); }
.m-layout.m-nav-mini .m-nav-item { flex-direction: column; justify-content: center; min-height: 56px; padding: 8px 4px 6px; text-align: center; }
.m-layout.m-nav-mini .m-nav-item .m-icon { margin-block-end: 6px; width: 22px; height: 22px; margin-inline-end: 0px; }
.m-layout.m-nav-mini .m-nav-item-title { font-size: 0.625rem; }
.m-layout.m-nav-mini .m-nav-item-chevron, .m-layout.m-nav-mini .m-nav-sub, .m-layout.m-nav-mini .m-nav-subheader { display: none; }
.m-layout.m-nav-mini .m-nav-logo { margin-inline: auto; display: flex; }
.m-drawer { position: fixed; inset-block: 0px; inset-inline-start: 0px; width: var(--layout-nav-mobile-width); background: var(--c-surface-page); z-index: var(--layout-nav-zIndex); transform: translate(-100%); transition: transform 0.25s var(--ease); box-shadow: var(--shadow-z16); overflow-y: auto; padding: 24px 16px; }
[dir="rtl"] .m-drawer { transform: translate(100%); }
.m-drawer.open { transform: translate(0px); }
.m-drawer-backdrop { position: fixed; inset: 0px; background: color-mix(in oklch,var(--c-black) 40%,transparent); z-index: 1200; }
@container page (min-width: 900px){.m-drawer, .m-drawer-backdrop, .m-menu-btn { display: none; }}
.m-grid { display: flex; flex-wrap: wrap; margin: -12px; }
.m-grid-item { padding: 12px; width: var(--w-xs, 100%); min-width: 0px; }
@container page (min-width: 900px){.m-grid-item { width: var(--w-md, var(--w-xs, 100%)); }}
@container page (min-width: 900px){.m-grid-item { width: var(--w-lg, var(--w-md, var(--w-xs, 100%))); }}
.m-icon { display: inline-block; width: 24px; height: 24px; background-color: currentcolor; mask: var(--icon-url) center / contain no-repeat; }
.m-welcome { display: flex; align-items: center; height: 100%; min-height: 200px; border-radius: var(--r-lg); padding: 24px; color: oklch(100% 0.0000 0.00); background: linear-gradient(135deg,var(--c-primary-darker) 0%,var(--c-primary-dark) 60%,var(--c-primary) 130%); overflow: hidden; position: relative; box-shadow: var(--shadow-card); }
@container page (min-width: 900px){.m-welcome { padding: 40px; }}
.m-welcome-text { flex: 1 1 auto; position: relative; z-index: 1; display: flex; flex-direction: column; align-items: flex-start; gap: 16px; }
.m-welcome-title { white-space: pre-line; }
.m-welcome-art { flex-shrink: 0; width: 200px; max-width: 34%; opacity: 0.9; }
.m-featured { position: relative; height: 100%; min-height: 200px; border-radius: var(--r-lg); overflow: hidden; color: oklch(100% 0.0000 0.00); box-shadow: var(--shadow-card); display: flex; flex-direction: column; justify-content: flex-end; padding: 24px; }
.m-featured-dots { position: absolute; inset-block-end: 20px; inset-inline-end: 20px; display: flex; gap: 6px; }
.m-featured-dot { width: 8px; height: 8px; border-radius: 50%; background: oklch(100% 0.0000 0.00 / 0.48); border: 0px; padding: 0px; cursor: pointer; }
.m-featured-dot.active { background: oklch(100% 0.0000 0.00); transform: scale(1.25); }
.m-widget-summary { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.m-trend { display: inline-flex; align-items: center; gap: 4px; font-weight: var(--fw-semibold); font-size: 0.875rem; }
.m-trend-up { color: var(--c-success-dark); }
.m-trend-down { color: var(--c-error-dark); }
[data-color-scheme="dark"] .m-trend-up { color: var(--c-success-light); }
[data-color-scheme="dark"] .m-trend-down { color: var(--c-error-light); }
.m-chart-legend { display: flex; flex-wrap: wrap; gap: 16px; justify-content: center; }
.m-legend-item { display: inline-flex; align-items: center; gap: 6px; font-size: 0.75rem; color: var(--c-text-secondary); }
.m-legend-dot { width: 12px; height: 12px; border-radius: 50%; }
.m-table-wrap { overflow-x: auto; }
.m-table { width: 100%; border-collapse: collapse; font-size: 0.875rem; }
.m-table th { background: var(--c-surface-neutral); color: var(--c-text-secondary); font-weight: var(--fw-semibold); font-size: 0.875rem; line-height: 1.5714; text-align: start; padding: 16px; white-space: nowrap; }
.m-table th:first-child { border-start-start-radius: 12px; border-end-start-radius: 12px; }
.m-table th:last-child { border-start-end-radius: 12px; border-end-end-radius: 12px; }
.m-table td { padding: 16px; border-block-end: 1px dashed var(--c-border); color: var(--c-text); white-space: nowrap; }
.m-table tbody tr:hover { background: var(--c-state-hover); }
.m-list-row { display: flex; align-items: center; gap: 16px; padding-block: 12px; }
.m-list-row + .m-list-row { border-block-start: 1px dashed var(--c-border); }
.m-thumb { width: 48px; height: 48px; border-radius: 12px; flex-shrink: 0; display: inline-flex; align-items: center; justify-content: center; color: oklch(100% 0.0000 0.00); font-weight: var(--fw-bold); }
.m-empty { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; padding: 40px 24px; color: var(--c-text-disabled); text-align: center; }
.m-empty svg { opacity: 0.72; }
.m-pop { position: absolute; inset-block-start: calc(100% + 8px); inset-inline-end: 0px; width: 280px; background: var(--c-surface); border-radius: var(--r-lg); box-shadow: var(--shadow-dropdown); padding: 20px; z-index: 1300; }
.m-pop-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding-block: 10px; }
.m-pop-row + .m-pop-row { border-block-start: 1px dashed var(--c-border); }
.m-switch { position: relative; width: 38px; height: 22px; border-radius: 11px; border: 0px; background: color-mix(in oklch,var(--c-grey-500) 48%,transparent); cursor: pointer; transition: background-color 0.15s; flex-shrink: 0; }
.m-switch::after { content: ""; position: absolute; inset-block-start: 3px; inset-inline-start: 3px; width: 16px; height: 16px; border-radius: 50%; background: oklch(100% 0.0000 0.00); transition: inset-inline-start 0.15s; }
.m-switch.on { background: var(--c-primary); }
.m-switch.on::after { inset-inline-start: 19px; }
.m-demo-badge { display: none; align-items: center; height: 22px; padding-inline: 8px; border-radius: 6px; background: var(--c-warning); color: var(--c-warning-contrast); font-size: 0.6875rem; font-weight: var(--fw-bold); letter-spacing: 0.04em; }
.m-root.m-demo .m-demo-badge { display: inline-flex; }
.m-pre { font-family: ui-monospace, "SF Mono", Menlo, monospace; font-size: 0.75rem; line-height: 1.6; background: var(--c-surface-neutral); border-radius: var(--r-sm); padding: 16px; overflow-x: auto; color: var(--c-text); }
.m-nav-inner, .m-drawer { scrollbar-width: none; }
.m-nav-inner::-webkit-scrollbar, .m-drawer::-webkit-scrollbar { display: none; }
.m-av-photo { padding: 0px; overflow: hidden; background: var(--c-surface-neutral); }
.m-av-photo img { width: 100%; height: 100%; object-fit: cover; display: block; border-radius: 50%; }
html, body { margin: 0px; }
body { background: var(--c-surface-page); }
@container page (min-width: 900px){.m-nav { background: var(--layout-nav-bg, var(--c-surface-page)); border-inline-end-color: var(--layout-nav-border-color, var(--c-border)); }}
.m-drawer { background: var(--layout-nav-bg, var(--c-surface-page)); }
.m-nav-item, .m-nav-subitem { text-decoration: none; }
[dir="rtl"] .m-nav-item.open .m-nav-item-chevron { transform: rotate(90deg); }
.m-card-content { padding: var(--density-card-p, 24px); }
.m-card-header { padding: var(--density-card-p, 24px) var(--density-card-p, 24px) 0; }
.m-grid { margin: calc(var(--density-grid-gap, 12px) * -1); }
.m-grid-item { padding: var(--density-grid-gap, 12px); }
.m-table td { padding-block: var(--density-cell-py, 16px); }
.m-demo-badge { white-space: nowrap; flex-shrink: 0; }
.m-label { white-space: nowrap; text-transform: capitalize; justify-content: center; min-width: 24px; }
.m-label-soft-default { background: color-mix(in oklch,var(--c-grey-500) calc(var(--alpha-16) * 100%),transparent); color: var(--c-text-secondary); }
.m-label-soft-secondary { background: color-mix(in oklch,var(--c-secondary) calc(var(--alpha-16) * 100%),transparent); color: var(--c-secondary-dark); }
[data-color-scheme="dark"] .m-label-soft-success { color: var(--c-success-light); }
[data-color-scheme="dark"] .m-label-soft-error { color: var(--c-error-light); }
[data-color-scheme="dark"] .m-label-soft-warning { color: var(--c-warning-light); }
[data-color-scheme="dark"] .m-label-soft-info { color: var(--c-info-light); }
[data-color-scheme="dark"] .m-label-soft-primary { color: var(--c-primary-light); }
[data-color-scheme="dark"] .m-label-soft-secondary { color: var(--c-secondary-light); }
.m-label-filled-default { background: var(--c-text); color: var(--c-surface); }
.m-label-filled-primary { background: var(--c-primary); color: var(--c-primary-contrast, oklch(100% 0.0000 0.00)); }
.m-label-filled-secondary { background: var(--c-secondary); color: oklch(100% 0.0000 0.00); }
.m-label-filled-info { background: var(--c-info); color: oklch(100% 0.0000 0.00); }
.m-label-filled-success { background: var(--c-success); color: oklch(100% 0.0000 0.00); }
.m-label-filled-warning { background: var(--c-warning); color: var(--c-warning-contrast); }
.m-label-filled-error { background: var(--c-error); color: oklch(100% 0.0000 0.00); }
.m-av { display: inline-flex; align-items: center; justify-content: center; border-radius: 50%; flex-shrink: 0; font-weight: var(--fw-semibold); }
.m-av-primary { background: color-mix(in oklch,var(--c-primary) calc(var(--alpha-16) * 100%),transparent); color: var(--c-primary-dark); }
.m-av-info { background: color-mix(in oklch,var(--c-info) calc(var(--alpha-16) * 100%),transparent); color: var(--c-info-dark); }
.m-av-warning { background: color-mix(in oklch,var(--c-warning) calc(var(--alpha-16) * 100%),transparent); color: var(--c-warning-dark); }
.m-av-error { background: color-mix(in oklch,var(--c-error) calc(var(--alpha-16) * 100%),transparent); color: var(--c-error-dark); }
.m-av-secondary { background: color-mix(in oklch,var(--c-secondary) calc(var(--alpha-16) * 100%),transparent); color: var(--c-secondary-dark); }
.m-av-success { background: color-mix(in oklch,var(--c-success) calc(var(--alpha-16) * 100%),transparent); color: var(--c-success-dark); }
[data-color-scheme="dark"] .m-av { filter: brightness(1.6); }
.m-btn { text-decoration: none; }
.m-btn-contained-warning { background: var(--c-warning); color: var(--c-warning-contrast); }
.m-btn-contained-warning:hover { background: var(--c-warning-dark); box-shadow: var(--shadow-warning); color: oklch(100% 0.0000 0.00); }
.m-btn-contained-primary { color: var(--c-primary-contrast, oklch(100% 0.0000 0.00)); }
.m-icon-btn:disabled { opacity: 0.4; cursor: default; }
.m-icon-btn:disabled:hover { background: transparent; }
.m-trend { white-space: nowrap; }
.m-widget-summary > div:first-child { min-width: 0px; }
.m-trend { direction: ltr; unicode-bidi: isolate; }
.m-root a.m-btn-contained-inherit, .m-root a.m-btn-contained-inherit:hover { color: var(--c-surface); }
.m-root a.m-icon-btn { color: var(--c-text-secondary); }
.m-header-logo { display: none; width: 40px; height: 40px; margin-inline-end: 8px; }
.m-hnav { display: none; }
@container page (min-width: 900px){.m-layout.m-nav-horizontal .m-nav { display: none; }
.m-layout.m-nav-horizontal .m-header-logo { display: inline-flex; }
.m-layout.m-nav-horizontal .m-header { padding-inline: 24px; }
.m-layout.m-nav-horizontal .m-hnav { display: flex; position: sticky; top: var(--layout-header-desktop-height); z-index: calc(var(--layout-header-zIndex) - 1); width: 100%; border-block-start-width: ; border-block-end-color: ; border-block-end-style: ; border-block-end-width: ; border-block-start-style: dashed; border-block-start-color: var(--c-border); }
.m-hnav-inner { display: flex; align-items: center; gap: 6px; width: 100%; height: var(--layout-nav-horizontal-height); padding-inline: 12px; position: relative; overflow-x: auto; scrollbar-width: none; }
.m-hnav-divider { flex-shrink: 0; width: 1px; height: 20px; margin-inline: 6px; background: var(--layout-nav-border-color, color-mix(in oklch,var(--c-grey-500) 20%,transparent)); }
.m-hnav-group { position: relative; flex-shrink: 0; }
.m-hnav-item { display: inline-flex; align-items: center; gap: 8px; height: 32px; padding-inline: 8px 6px; border: 0px; border-radius: 6px; background: transparent; color: var(--nav-item-color); font-family: inherit; font-size: 0.875rem; font-weight: var(--fw-medium); line-height: 1; text-decoration: none; cursor: pointer; white-space: nowrap; }
.m-hnav-item .m-icon { width: 22px; height: 22px; }
.m-hnav-item:hover { background: var(--nav-item-hover-bg); }
.m-hnav-item.active { color: var(--nav-item-root-active-color); background: var(--nav-item-root-active-bg); font-weight: var(--fw-semibold); }
.m-hnav-item.open:not(.active) { color: var(--nav-item-root-open-color); background: var(--nav-item-hover-bg); }
.m-hnav-chevron { width: 16px; height: 16px; opacity: 0.72; }
.m-hnav-pop { position: fixed; z-index: 1300; min-width: 180px; margin-top: 0px; padding: 4px; border-radius: 10px; background: var(--c-surface); box-shadow: var(--shadow-dropdown); display: flex; flex-direction: column; gap: 4px; }
.m-hnav-subitem { display: flex; align-items: center; min-height: 34px; padding-inline: 8px; border-radius: 6px; color: var(--c-text-secondary); font-size: 0.875rem; text-decoration: none; white-space: nowrap; }
.m-hnav-subitem:hover { background: var(--c-state-hover); color: var(--c-text); }
.m-hnav-subitem.active { color: var(--c-text); background: var(--c-state-selected); font-weight: var(--fw-semibold); }
.m-layout.m-nav-floating .m-nav { background: transparent; border-inline-end: 0px; padding: 16px; padding-inline-end: 0px; width: calc(var(--layout-nav-vertical-width) + 16px); }
.m-layout.m-nav-floating .m-nav-inner { top: 16px; height: calc(-32px + 100vh); border-radius: var(--r-lg); background: var(--layout-nav-bg, var(--c-surface)); box-shadow: var(--shadow-card); }
[data-color-scheme="dark"] .m-layout.m-nav-floating .m-nav-inner { background: var(--layout-nav-bg, var(--c-surface)); }}
@container page (min-width: 900px){.m-layout.m-nav-horizontal .m-hnav::before { content: ""; position: absolute; inset: 0px; background: var(--layout-nav-horizontal-bg, color-mix(in oklch,var(--c-surface-page) 80%,transparent)); backdrop-filter: blur(var(--layout-header-blur, 6px)); }
.m-layout.m-nav-horizontal .m-hnav-title { color: inherit; }
.m-layout.m-nav-horizontal .m-nav-item-caption { display: none; }}
.m-root a.m-nav-item, .m-root a.m-hnav-item { color: var(--nav-item-color); }
.m-root a.m-nav-item.active, .m-root a.m-hnav-item.active { color: var(--nav-item-root-active-color); }
.m-root a.m-nav-subitem { color: var(--nav-item-color); }
.m-root a.m-nav-subitem.active { color: var(--nav-item-sub-active-color); }
.m-root a.m-hnav-subitem { color: var(--c-text-secondary); }
.m-root a.m-hnav-subitem:hover, .m-root a.m-hnav-subitem.active { color: var(--c-text); }
[data-color-scheme=dark]{color-scheme:dark;--nav-bullet-color: light-dark(var(--nav-bullet-light), var(--nav-bullet-dark))}

}

/* Gamitop Master · shell (CSS2025: oklch via tokens, @layer, container queries, logical props, one easing) */
@layer foundation{
 :root,body{color-scheme:light}
 [data-color-scheme=dark],[data-color-scheme=dark] body{color-scheme:dark}
}
@layer reset{
 *,*::before,*::after{box-sizing:border-box}
 button{font:inherit;color:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent}
 :focus-visible{outline:2px solid var(--c-primary);outline-offset:2px}
 h1,h2,h3,h4,h5,h6,p{margin:0}
 a{color:inherit}
}
@layer tenant-overrides{
 /* L3 per tenant: only the primary family moves; everything else is shared */
 :root{--tenant:var(--c-primary)}
 [data-tenant]:not([data-tenant=gamitop]){--c-primary:var(--tenant);--c-primary-dark:color-mix(in oklch,var(--tenant) 82%,black);--c-primary-darker:color-mix(in oklch,var(--tenant) 60%,black);--c-primary-light:color-mix(in oklch,var(--tenant) 70%,white);--c-primary-lighter:color-mix(in oklch,var(--tenant) 16%,white)}
 [data-color-scheme=dark][data-tenant=nf]{--c-primary:oklch(92% 0.01 250);--c-primary-dark:oklch(84% 0.01 250);--c-primary-light:oklch(95% 0.008 250);--c-primary-contrast:oklch(21% 0.02 250)}
}
@layer components.app{
html{background:var(--c-surface-page)}
body{container:page/inline-size;margin:0;min-block-size:100dvb;background:var(--c-surface-page);color:var(--c-text);font-family:var(--font-body);font-size:1rem;line-height:var(--lh-normal,1.5);overflow:hidden}
body::before{content:"";position:fixed;inset:0 0 auto;block-size:env(safe-area-inset-top,0px);background:var(--c-surface);z-index:var(--z-header)}
.ic{inline-size:20px;block-size:20px;flex:none}
.mono{font-family:var(--font-mono);font-variant-numeric:tabular-nums;direction:ltr;unicode-bidi:isolate}
#gm{position:fixed;inset:0;padding-block-start:env(safe-area-inset-top,0px);display:grid;grid-template-columns:auto minmax(0,1fr);grid-template-rows:auto minmax(0,1fr)}

/* ── top bar ── */
#gm-top{grid-column:1/-1;display:flex;align-items:center;gap:var(--sp-2);block-size:64px;padding-inline:max(12px,env(safe-area-inset-left,0px)) max(12px,env(safe-area-inset-right,0px));background:var(--c-surface);border-block-end:1px solid var(--c-border-subtle,var(--c-border));z-index:var(--z-header)}
.brand{display:flex;align-items:center;gap:2px;text-decoration:none;min-block-size:44px}
.brand canvas{inline-size:44px;block-size:38px}
.brand img{block-size:18px}
.brand small{font:var(--fw-bold) .625rem/1 var(--font-mono);letter-spacing:.14em;color:var(--c-text-disabled);margin-inline-start:8px;padding-inline-start:8px;border-inline-start:1px solid var(--c-border)}
[data-color-scheme=dark] .brand img{content:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9Ii0xMjAgLTEwNDAgNDE5NSAxMzgwIj48cGF0aCB0cmFuc2Zvcm09InRyYW5zbGF0ZSgwIDApIHNjYWxlKDEgLTEpIiBkPSJNMjk2IC0xOTFRMjQxIC0xOTEgMTkzLjAgLTE4My41UTE0NSAtMTc2IDExMCAtMTYyUTgxIC0xNTIgNjkuMCAtMTMzLjBRNTcgLTExNCA1OC4wIC05My4wUTU5IC03MiA2OS41IC01NS4wUTgwIC0zOCA5OC4wIC0zMC41UTExNiAtMjMgMTM4IC0zMVExODIgLTQ5IDIxOC4wIC01NC41UTI1NCAtNjAgMjc5IC02MFEzNDAgLTYwIDM3MC41IC0zNC41UTQwMSAtOSA0MDEgNDVWMTA4SDQwOVEzOTQgNjYgMzQ4LjAgMzkuNVEzMDIgMTMgMjQ4IDEzUTE4MiAxMyAxMzMuMCA0My41UTg0IDc0IDU2LjUgMTI5LjBRMjkgMTg0IDI5IDI1OFEyOSAzMTQgNDUuMCAzNTkuMFE2MSA0MDQgODkuNSA0MzYuMFExMTggNDY4IDE1OC41IDQ4NS41UTE5OSA1MDMgMjQ4IDUwM1EzMDQgNTAzIDM0OC41IDQ3Ny4wUTM5MyA0NTEgNDA4IDQwOUwzOTggMzY4VjQxMlEzOTggNDU1IDQyMS41IDQ3OC4wUTQ0NSA1MDEgNDg3IDUwMVE1MjkgNTAxIDU1MS41IDQ3OC4wUTU3NCA0NTUgNTc0IDQxMlY2NlE1NzQgLTYyIDUwMi4wIC0xMjYuNVE0MzAgLTE5MSAyOTYgLTE5MVpNMzAzIDE0NFEzMzMgMTQ0IDM1NC4wIDE1Ny41UTM3NSAxNzEgMzg3LjAgMTk2LjVRMzk5IDIyMiAzOTkgMjU4UTM5OSAzMTIgMzczLjAgMzQyLjBRMzQ3IDM3MiAzMDMgMzcyUTI3NSAzNzIgMjUzLjAgMzU4LjVRMjMxIDM0NSAyMTkuNSAzMTkuNVEyMDggMjk0IDIwOCAyNThRMjA4IDIwNCAyMzQuMCAxNzQuMFEyNjAgMTQ0IDMwMyAxNDRaIiBmaWxsPSIjRjRGNkY4Ii8+PHBhdGggdHJhbnNmb3JtPSJ0cmFuc2xhdGUoNjE2IDApIHNjYWxlKDEgLTEpIiBkPSJNMjIzIC0xMVExNjYgLTExIDEyMi41IDEwLjBRNzkgMzEgNTQuNSA2Ny41UTMwIDEwNCAzMCAxNTFRMzAgMjA1IDU4LjAgMjM2LjBRODYgMjY3IDE0OC4wIDI4MC41UTIxMCAyOTQgMzEzIDI5NEgzNjhWMjEwSDMxM1EyNzQgMjEwIDI0OC41IDIwNC41UTIyMyAxOTkgMjExLjAgMTg3LjVRMTk5IDE3NiAxOTkgMTU4UTE5OSAxMzUgMjE1LjUgMTIwLjBRMjMyIDEwNSAyNjMgMTA1UTI4OCAxMDUgMzA3LjUgMTE2LjBRMzI3IDEyNyAzMzkuMCAxNDYuNVEzNTEgMTY2IDM1MSAxOTJWMzA4UTM1MSAzNDQgMzMyLjUgMzU5LjBRMzE0IDM3NCAyNjkgMzc0UTI0NSAzNzQgMjE1LjAgMzY4LjVRMTg1IDM2MyAxNDggMzQ5UTEyMSAzMzkgMTAyLjAgMzQ2LjBRODMgMzUzIDcyLjUgMzcwLjBRNjIgMzg3IDYyLjUgNDA3LjBRNjMgNDI3IDc1LjUgNDQ1LjBRODggNDYzIDExNCA0NzNRMTYyIDQ5MSAyMDIuNSA0OTcuMFEyNDMgNTAzIDI3NyA1MDNRMzU5IDUwMyA0MTIuNSA0NzkuNVE0NjYgNDU2IDQ5Mi41IDQwNy41UTUxOSAzNTkgNTE5IDI4M1Y4MVE1MTkgMzcgNDk4LjAgMTQuMFE0NzcgLTkgNDM3IC05UTM5NiAtOSAzNzQuNSAxNC4wUTM1MyAzNyAzNTMgODFWMTA3TDM1OSA5M1EzNTQgNjEgMzM2LjAgMzguMFEzMTggMTUgMjg5LjAgMi4wUTI2MCAtMTEgMjIzIC0xMVoiIGZpbGw9IiNGNEY2RjgiLz48cGF0aCB0cmFuc2Zvcm09InRyYW5zbGF0ZSgxMTc0IDApIHNjYWxlKDEgLTEpIiBkPSJNMTQyIC05UTEwMCAtOSA3Ny4wIDE0LjBRNTQgMzcgNTQgODFWNDEyUTU0IDQ1NSA3Ni41IDQ3OC4wUTk5IDUwMSAxNDEgNTAxUTE4MyA1MDEgMjA1LjAgNDc4LjBRMjI3IDQ1NSAyMjcgNDEyVjM1N0wyMTYgNDA2UTIzNyA0NTAgMjc4LjUgNDc2LjVRMzIwIDUwMyAzNzcgNTAzUTQzMSA1MDMgNDY5LjUgNDc3LjBRNTA4IDQ1MSA1MjUgMzk4SDUxMVE1MzQgNDQ3IDU4MC4wIDQ3NS4wUTYyNiA1MDMgNjgyIDUwM1E3NDAgNTAzIDc3Ny4wIDQ4MC41UTgxNCA0NTggODMyLjUgNDEwLjVRODUxIDM2MyA4NTEgMjkxVjgxUTg1MSAzNyA4MjcuNSAxNC4wUTgwNCAtOSA3NjEgLTlRNzE5IC05IDY5Ni4wIDE0LjBRNjczIDM3IDY3MyA4MVYyODZRNjczIDMyOSA2NjAuMCAzNDguMFE2NDcgMzY3IDYxNyAzNjdRNTgwIDM2NyA1NjAuNSAzNDEuMFE1NDEgMzE1IDU0MSAyNjdWODFRNTQxIDM3IDUxOC4wIDE0LjBRNDk1IC05IDQ1MiAtOVE0MDkgLTkgMzg2LjAgMTQuMFEzNjMgMzcgMzYzIDgxVjI4NlEzNjMgMzI5IDM1MC4wIDM0OC4wUTMzNyAzNjcgMzA3IDM2N1EyNzEgMzY3IDI1MS41IDM0MS4wUTIzMiAzMTUgMjMyIDI2N1Y4MVEyMzIgLTkgMTQyIC05WiIgZmlsbD0iI0Y0RjZGOCIvPjxwYXRoIHRyYW5zZm9ybT0idHJhbnNsYXRlKDIwNjYgMCkgc2NhbGUoMSAtMSkiIGQ9Ik0xNDAgLTlROTggLTkgNzUuMCAxNi4wUTUyIDQxIDUyIDg4VjQwNFE1MiA0NTEgNzUuMCA0NzYuMFE5OCA1MDEgMTQwIDUwMVExODMgNTAxIDIwNi41IDQ3Ni4wUTIzMCA0NTEgMjMwIDQwNFY4OFEyMzAgNDEgMjA3LjAgMTYuMFExODQgLTkgMTQwIC05Wk0xNDAgNTcyUTkzIDU3MiA2Ny41IDU5NC4wUTQyIDYxNiA0MiA2NThRNDIgNjk5IDY3LjUgNzIxLjBROTMgNzQzIDE0MCA3NDNRMTg5IDc0MyAyMTQuMCA3MjEuMFEyMzkgNjk5IDIzOSA2NThRMjM5IDYxNiAyMTQuMCA1OTQuMFExODkgNTcyIDE0MCA1NzJaIiBmaWxsPSIjRjRGNkY4Ii8+PHBhdGggdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMjMzNyAwKSBzY2FsZSgxIC0xKSIgZD0iTTMxMCAtMTFRMjM1IC0xMSAxODYuNSAxMi4wUTEzOCAzNSAxMTQuMCA4MS41UTkwIDEyOCA5MCAxOThWMzYxSDU2UTI0IDM2MSA2LjUgMzc4LjBRLTExIDM5NSAtMTEgNDI3US0xMSA0NTkgNi41IDQ3NS41UTI0IDQ5MiA1NiA0OTJIOTBWNTU0UTkwIDU5OCAxMTMuMCA2MjEuMFExMzYgNjQ0IDE3OSA2NDRRMjIyIDY0NCAyNDUuMCA2MjEuMFEyNjggNTk4IDI2OCA1NTRWNDkySDM1MFEzODMgNDkyIDQwMC41IDQ3NS41UTQxOCA0NTkgNDE4IDQyN1E0MTggMzk1IDQwMC41IDM3OC4wUTM4MyAzNjEgMzUwIDM2MUgyNjhWMjA0UTI2OCAxNjcgMjg1LjUgMTQ5LjVRMzAzIDEzMiAzNDEgMTMyUTM1NSAxMzIgMzY4LjAgMTM1LjBRMzgxIDEzOCAzOTIgMTM4UTQwOCAxMzkgNDE4LjAgMTI4LjVRNDI4IDExOCA0MjggODFRNDI4IDUxIDQxOS4wIDMwLjVRNDEwIDEwIDM4NyAxUTM3MyAtNCAzNDkuMCAtNy41UTMyNSAtMTEgMzEwIC0xMVoiIGZpbGw9IiNDQzAwMDAiLz48cGF0aCB0cmFuc2Zvcm09InRyYW5zbGF0ZSgyNzUzIDApIHNjYWxlKDEgLTEpIiBkPSJNMzAxIC0xMVEyMTkgLTExIDE1OC4wIDIwLjBROTcgNTEgNjMuMCAxMDkuMFEyOSAxNjcgMjkgMjQ2UTI5IDMwNiA0OC4wIDM1My41UTY3IDQwMSAxMDMuMCA0MzQuNVExMzkgNDY4IDE4OS4wIDQ4NS41UTIzOSA1MDMgMzAxIDUwM1EzODMgNTAzIDQ0NC4wIDQ3Mi4wUTUwNSA0NDEgNTM4LjUgMzgzLjVRNTcyIDMyNiA1NzIgMjQ2UTU3MiAxODcgNTUzLjAgMTM5LjBRNTM0IDkxIDQ5OC41IDU3LjVRNDYzIDI0IDQxMi41IDYuNVEzNjIgLTExIDMwMSAtMTFaTTMwMSAxMjBRMzI4IDEyMCAzNDkuMCAxMzMuNVEzNzAgMTQ3IDM4MS41IDE3NC41UTM5MyAyMDIgMzkzIDI0NlEzOTMgMzEzIDM2Ny4wIDM0Mi41UTM0MSAzNzIgMzAxIDM3MlEyNzQgMzcyIDI1My4wIDM1OS4wUTIzMiAzNDYgMjIwLjAgMzE4LjVRMjA4IDI5MSAyMDggMjQ2UTIwOCAxODAgMjM0LjAgMTUwLjBRMjYwIDEyMCAzMDEgMTIwWiIgZmlsbD0iI0NDMDAwMCIvPjxwYXRoIHRyYW5zZm9ybT0idHJhbnNsYXRlKDMzNDUgMCkgc2NhbGUoMSAtMSkiIGQ9Ik0xNDAgLTE4OVE5OCAtMTg5IDc1LjAgLTE2Ni4wUTUyIC0xNDMgNTIgLTk5VjQxMlE1MiA0NTUgNzQuNSA0NzguMFE5NyA1MDEgMTM5IDUwMVExODIgNTAxIDIwNC41IDQ3OC4wUTIyNyA0NTUgMjI3IDQxMlYzNTRMMjE2IDQwM1EyMzAgNDQ4IDI3NC41IDQ3NS41UTMxOSA1MDMgMzc2IDUwM1E0NDAgNTAzIDQ4OC41IDQ3Mi4wUTUzNyA0NDEgNTY0LjAgMzg0LjBRNTkxIDMyNyA1OTEgMjQ2UTU5MSAxNjcgNTY0LjAgMTA5LjBRNTM3IDUxIDQ4OC41IDIwLjBRNDQwIC0xMSAzNzYgLTExUTMyMSAtMTEgMjc3LjAgMTUuMFEyMzMgNDEgMjE4IDgzSDIzMFYtOTlRMjMwIC0xNDMgMjA2LjUgLTE2Ni4wUTE4MyAtMTg5IDE0MCAtMTg5Wk0zMjAgMTIwUTM0NyAxMjAgMzY3LjUgMTMzLjVRMzg4IDE0NyA0MDAuMCAxNzQuNVE0MTIgMjAyIDQxMiAyNDZRNDEyIDMxMyAzODYuMCAzNDIuNVEzNjAgMzcyIDMyMCAzNzJRMjkzIDM3MiAyNzIuMCAzNTkuMFEyNTEgMzQ2IDIzOS4wIDMxOC41UTIyNyAyOTEgMjI3IDI0NlEyMjcgMTgwIDI1My4wIDE1MC4wUTI3OSAxMjAgMzIwIDEyMFoiIGZpbGw9IiNDQzAwMDAiLz48L3N2Zz4=")}
#gm-word.nf{position:relative}
#gm-tn{display:flex;align-items:center;gap:var(--sp-2);border:1px solid var(--c-border);background:var(--c-surface);border-radius:var(--r-pill);padding-block:4px;padding-inline:4px 12px;min-block-size:44px;max-inline-size:260px}
.tn-av{display:grid;place-items:center;inline-size:34px;block-size:34px;border-radius:50%;background:var(--tc);color:oklch(100% 0 0);font-weight:var(--fw-extrabold);font-size:.75rem;flex:none;letter-spacing:-.02em}
.tn-tx{display:grid;min-inline-size:0;text-align:start;line-height:1.2}
.tn-tx b{font-size:.875rem;font-weight:var(--fw-bold);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tn-tx small{font-size:.6875rem;color:var(--c-text-secondary)}
#gm-tn-menu{position:fixed;inset-block-start:calc(64px + env(safe-area-inset-top,0px));inset-inline-start:max(12px,env(safe-area-inset-left,0px));inline-size:min(360px,calc(100vw - 24px));max-block-size:70vh;overflow:auto;background:var(--c-surface);border-radius:var(--r-lg);box-shadow:var(--shadow-dropdown);padding:var(--sp-2);z-index:calc(var(--z-header) + 5);opacity:0;pointer-events:none;transform:translateY(-6px);transition:opacity var(--dur-normal) var(--ease),transform var(--dur-slow) var(--ease)}
#gm-tn-menu.on{opacity:1;pointer-events:auto;transform:none}
.tm-h{display:flex;justify-content:space-between;padding:8px 10px;font-size:.75rem;font-weight:var(--fw-bold);color:var(--c-text-disabled);letter-spacing:.06em}
.tm-i,.tm-add{display:flex;align-items:center;gap:var(--sp-3);inline-size:100%;border:0;background:none;border-radius:var(--r-md);padding:8px 10px;text-align:start;min-block-size:52px}
.tm-i:hover,.tm-add:hover{background:var(--c-state-hover)}
.tm-i.on{background:var(--c-primary-soft,var(--c-state-selected))}
.tm-i .tn-tx{flex:1}
.tm-add{color:var(--c-primary-ink);font-weight:var(--fw-bold);border-block-start:1px dashed var(--c-border);border-radius:0;margin-block-start:4px}
.sp{flex:1}
#gm-api{font:var(--fw-bold) .6875rem/1 var(--font-mono);color:var(--c-text-secondary);background:var(--c-surface-neutral);border-radius:var(--r-pill);padding:6px 10px;transition:background var(--dur-fast) var(--ease)}
#gm-api.ping{background:var(--c-success-lighter,var(--c-state-selected))}
.top-b{display:flex;gap:2px}
.top-b .m-btn[aria-pressed=true]{background:var(--c-text);color:var(--c-surface)}
#gm-menu{display:none}

/* ── side nav: HaMedina back-office pattern ── */
#gm-side{inline-size:264px;overflow:auto;background:var(--c-surface);border-inline-end:1px solid var(--c-border-subtle,var(--c-border));padding:var(--sp-3) var(--sp-3) var(--sp-8);scrollbar-width:thin}
.nv-g{display:grid;gap:2px;margin-block-end:var(--sp-3)}
.nv-h{font-size:.6875rem;font-weight:var(--fw-bold);letter-spacing:.08em;color:var(--c-text-disabled);padding:var(--sp-3) var(--sp-3) var(--sp-1)}
.nv-i{display:flex;align-items:center;gap:var(--sp-3);min-block-size:44px;padding-inline:var(--sp-3);border-radius:var(--r-md);text-decoration:none;color:var(--c-text-secondary);font-weight:var(--fw-medium);font-size:.9375rem;position:relative;transition:background var(--dur-fast) var(--ease)}
.nv-i:hover{background:var(--c-state-hover);color:var(--c-text)}
.nv-i.on{background:var(--c-text);color:var(--c-surface);font-weight:var(--fw-bold)}
.nv-i.on::after{content:"";position:absolute;inset-inline-end:12px;inline-size:7px;block-size:14px;border-radius:2px;background:var(--c-primary)}
[data-color-scheme=dark] .nv-i.on{background:var(--c-surface-neutral);color:var(--c-text)}
.nv-i span{flex:1;min-inline-size:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.nv-b{font-size:.6875rem;background:var(--c-primary);color:var(--c-primary-contrast,white);border-radius:var(--r-pill);padding:1px 7px;margin-inline-end:14px}
.side-foot{margin-block-start:var(--sp-4);padding:var(--sp-4);border-radius:var(--r-lg);background:var(--c-surface-neutral);display:grid;gap:6px;font-size:.8125rem;color:var(--c-text-secondary)}
.side-foot b{color:var(--c-text);font-size:.875rem}

/* ── main ── */
#gm-main{overflow:auto;container:main/inline-size;overscroll-behavior:contain}
#gm-head{display:flex;align-items:flex-end;gap:var(--sp-3);flex-wrap:wrap;padding-block:var(--sp-6) var(--sp-4);padding-inline:var(--sp-6)}
#gm-crumb{font-size:.75rem;font-weight:var(--fw-bold);letter-spacing:.06em;color:var(--c-text-disabled);display:block}
#gm-title{font-size:clamp(1.375rem,2cqi + .9rem,1.875rem);font-weight:var(--fw-extrabold);line-height:1.2;text-wrap:balance}
#gm-view{padding-inline:var(--sp-6);padding-block-end:120px;opacity:0;transform:translateY(6px);transition:opacity var(--dur-slow) var(--ease),transform var(--dur-slower) var(--ease)}
#gm-view.in{opacity:1;transform:none}
.gm-loading{display:flex;gap:6px;justify-content:center;padding:var(--sp-16)}
.gm-loading span{inline-size:8px;block-size:8px;border-radius:50%;background:var(--c-primary);animation:gmdot 1s var(--ease) infinite}
.gm-loading span:nth-child(2){animation-delay:.15s}.gm-loading span:nth-child(3){animation-delay:.3s}
@keyframes gmdot{50%{transform:translateY(-6px);opacity:.4}}

/* ── shared module building blocks (modules may use these + kit m-* classes) ── */
.g{display:grid;gap:var(--sp-4)}
.g-2{display:grid;gap:var(--sp-4);grid-template-columns:repeat(2,minmax(0,1fr))}
.g-3{display:grid;gap:var(--sp-4);grid-template-columns:repeat(3,minmax(0,1fr))}
.g-4{display:grid;gap:var(--sp-4);grid-template-columns:repeat(4,minmax(0,1fr))}
.g-auto{display:grid;gap:var(--sp-4);grid-template-columns:repeat(auto-fill,minmax(min(100%,260px),1fr))}
.row{display:flex;align-items:center;gap:var(--sp-3);flex-wrap:wrap}
.kpi{padding:var(--sp-5);display:grid;gap:4px}
.kpi b{font-size:clamp(1.5rem,2cqi + 1rem,2.125rem);font-weight:var(--fw-extrabold);line-height:1.1;font-variant-numeric:tabular-nums}
.kpi span{font-size:.875rem;color:var(--c-text-secondary)}
.kpi b.hot{color:var(--c-primary-ink)}
.ch{display:flex;align-items:center;gap:var(--sp-2);padding:var(--sp-5) var(--sp-5) 0}
.ch h6{flex:1}
.ch .dot{inline-size:10px;block-size:14px;border-radius:2px;background:var(--c-primary)}
.list{display:grid;padding:var(--sp-2) var(--sp-5) var(--sp-4)}
.li{display:flex;align-items:center;gap:var(--sp-3);padding-block:var(--sp-3);min-block-size:52px}
.li+.li{border-block-start:1px dashed var(--c-border)}
.li .tx{flex:1;min-inline-size:0}
.li .tx b{display:block;font-weight:var(--fw-semibold);font-size:.9375rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.li .tx small{color:var(--c-text-secondary);font-size:.8125rem}
.li time{font:var(--fw-bold) .75rem/1 var(--font-mono);color:var(--c-text-disabled);flex:none}
.pill{display:inline-flex;align-items:center;gap:6px;min-block-size:32px;padding-inline:12px;border-radius:var(--r-pill);border:1px solid var(--c-border);background:var(--c-surface);font-size:.8125rem;font-weight:var(--fw-semibold)}
.pill[aria-pressed=true]{background:var(--c-text);color:var(--c-surface);border-color:transparent}
.tabs-h{display:flex;gap:var(--sp-1);border-block-end:1px solid var(--c-border);overflow-x:auto;scrollbar-width:none}
.tabs-h button{border:0;background:none;padding:var(--sp-3) var(--sp-3);min-block-size:44px;font-weight:var(--fw-semibold);color:var(--c-text-secondary);border-block-end:2px solid transparent;white-space:nowrap}
.tabs-h button[aria-selected=true]{color:var(--c-text);border-color:var(--c-text)}
.empty{padding:var(--sp-10);text-align:center;color:var(--c-text-disabled)}
.bar{block-size:6px;border-radius:99px;background:var(--c-surface-neutral);overflow:hidden}.bar i{display:block;block-size:100%;background:var(--c-primary);inline-size:calc(var(--v,0)*1%);transition:inline-size var(--dur-slower) var(--ease)}
.thumb{aspect-ratio:16/9;border-radius:var(--r-md);overflow:hidden;background:var(--c-grey-800);position:relative}
.thumb img{inline-size:100%;block-size:100%;object-fit:cover;display:block}
.demo-note{display:flex;gap:var(--sp-2);align-items:center;padding:var(--sp-3) var(--sp-4);border-radius:var(--r-md);background:var(--c-surface-neutral);color:var(--c-text-secondary);font-size:.8125rem}
.tw{overflow-x:auto}

/* ── toast / propose / ask / drawer ── */
#gm-toast{position:fixed;inset-inline:0;margin-inline:auto;inset-block-start:calc(72px + env(safe-area-inset-top,0px));inline-size:max-content;max-inline-size:calc(100% - 32px);display:flex;align-items:center;gap:10px;background:var(--c-surface);border-radius:var(--r-md);padding-block:6px;padding-inline:6px 16px;box-shadow:var(--shadow-dropdown);font-weight:var(--fw-semibold);font-size:.875rem;z-index:1500;opacity:0;transform:translateY(-10px);pointer-events:none;transition:opacity var(--dur-normal) var(--ease),transform var(--dur-slow) var(--ease)}
#gm-toast.on{opacity:1;transform:none}#gm-toast canvas{inline-size:32px;block-size:32px}
#gm-toast[data-kind=err]{color:var(--c-error-ink)}
#gm-propose{position:fixed;inset:0;display:grid;place-items:center;background:var(--c-overlay);z-index:1400;opacity:0;pointer-events:none;transition:opacity var(--dur-normal) var(--ease);padding:var(--sp-4)}
#gm-propose.on{opacity:1;pointer-events:auto}
#gm-propose .pp{background:var(--c-surface);border-radius:var(--r-lg);box-shadow:var(--shadow-dialog);inline-size:min(480px,100%);padding:var(--sp-6);display:grid;gap:var(--sp-4);transform:scale(.96);transition:transform var(--dur-slow) var(--ease)}
#gm-propose.on .pp{transform:none}
.pp-k{display:flex;gap:8px;align-items:center;font-size:.75rem;font-weight:var(--fw-bold);color:var(--c-primary-ink);letter-spacing:.04em}
.pp-title{font-size:1.25rem;font-weight:var(--fw-extrabold)}
.pp-body{color:var(--c-text-secondary);display:grid;gap:8px}.pp-body ul{margin:0;padding-inline-start:20px;display:grid;gap:4px}
.pp-a{display:flex;gap:var(--sp-2);justify-content:flex-end}
#gm-askbtn{position:fixed;inset-block-end:calc(20px + env(safe-area-inset-bottom,0px));inset-inline-end:calc(20px + env(safe-area-inset-right,0px));display:flex;align-items:center;gap:8px;background:var(--c-text);color:var(--c-surface);border:0;border-radius:var(--r-pill);padding-block:12px;padding-inline:14px 18px;font-weight:var(--fw-bold);box-shadow:var(--shadow-z16);z-index:1200;min-block-size:48px}
#gm-askbtn svg{color:var(--c-primary-ink)}
#gm-ask{position:fixed;inset-block:0;inset-inline-end:0;inline-size:min(420px,100vw);background:var(--c-surface);box-shadow:var(--shadow-dialog);z-index:1300;display:flex;flex-direction:column;transform:translateX(105%);visibility:hidden;transition:transform var(--dur-slower) var(--ease),visibility 0s var(--dur-slower);padding-block-start:env(safe-area-inset-top,0px)}
[dir=rtl] #gm-ask{transform:translateX(-105%)}
#gm-ask.on{transform:none;visibility:visible;transition:transform var(--dur-slower) var(--ease)}
.ask-h{display:flex;align-items:center;gap:var(--sp-2);padding:var(--sp-4);border-block-end:1px solid var(--c-border)}
.ask-h b{flex:1;font-size:1.0625rem}
.ask-h canvas{inline-size:36px;block-size:36px}
.ask-log{flex:1;overflow:auto;padding:var(--sp-4);display:flex;flex-direction:column;gap:var(--sp-3)}
.ask-log .me{align-self:flex-end;background:var(--c-text);color:var(--c-surface);border-radius:var(--r-lg);padding:10px 14px;max-inline-size:85%}
.ask-log .ai{align-self:flex-start;background:var(--c-surface-neutral);border-radius:var(--r-lg);padding:10px 14px;max-inline-size:90%;display:grid;gap:4px}
.ask-log .ai b{font-size:.75rem;color:var(--c-primary-ink)}
.ask-sug{display:flex;flex-wrap:wrap;gap:6px;padding:0 var(--sp-4) var(--sp-3)}
#gm-ask form{display:flex;gap:var(--sp-2);padding:var(--sp-3) var(--sp-4) max(var(--sp-4),env(safe-area-inset-bottom,0px));border-block-start:1px solid var(--c-border)}
#gm-ask textarea{flex:1;resize:none;block-size:48px;border:1px solid var(--c-border-input,var(--c-border));border-radius:var(--r-md);padding:12px;font:inherit;background:transparent;color:var(--c-text)}
#gm-scrim{position:fixed;inset:0;background:var(--c-overlay);z-index:1250;opacity:0;pointer-events:none;transition:opacity var(--dur-normal) var(--ease)}
#gm-scrim.on{opacity:1;pointer-events:auto}
#gm-drawer{position:fixed;inset-block:0;inset-inline-start:0;inline-size:min(300px,86vw);background:var(--c-surface);z-index:1260;overflow:auto;padding:var(--sp-4) var(--sp-3);transform:translateX(-105%);visibility:hidden;transition:transform var(--dur-slower) var(--ease),visibility 0s var(--dur-slower);box-shadow:var(--shadow-z16)}
[dir=rtl] #gm-drawer{transform:translateX(105%)}
#gm-drawer.on{transform:none;visibility:visible;transition:transform var(--dur-slower) var(--ease)}

/* ── responsive by container ── */
@container page (max-width:899px){
 #gm{grid-template-columns:minmax(0,1fr)}
 #gm-side{display:none}
 #gm-menu{display:inline-flex}
 .brand small,.brand img{display:none}
 #gm-api{display:none}
}
@container page (max-width:599px){
 #gm-publish span{display:none}
 .top-b{display:none}
 .tn-tx small{display:none}
 #gm-tn{max-inline-size:170px}
}
@container main (max-width:899px){.g-4{grid-template-columns:repeat(2,minmax(0,1fr))}.g-3{grid-template-columns:minmax(0,1fr)}}
@container main (max-width:599px){
 #gm-head,#gm-view{padding-inline:var(--sp-4)}
 .g-2,.g-4{grid-template-columns:minmax(0,1fr)}
 #gm-askbtn span{display:none}
}
}
@layer utilities{
 @media (prefers-reduced-motion:reduce){*{animation-duration:.001s;transition-duration:.001s}}
}

/* ── accessibility pass (measured in Chromium, 30.10.26) ── */
@layer tokens{
 /* Minimal's disabled grey was used for meaningful secondary text (2.73:1). Raised to AA (≥4.5:1). */
 :root{--c-text-disabled:light-dark(var(--c-grey-600),var(--c-grey-400));--c-text-secondary:light-dark(var(--c-grey-600),color-mix(in oklab,var(--c-grey-500),var(--c-grey-400) 45%))}
}
@layer components.app{
 /* soft labels: darker ink in light mode, light ink in dark mode — small bold text needs 4.5:1 */
 .m-label-soft-success{color:var(--c-success-ink)}
 .m-label-soft-error{color:var(--c-error-ink)}
 .m-label-soft-warning{color:var(--c-warning-ink)}
 .m-label-soft-info{color:var(--c-info-ink)}
 /* 44px touch target without changing the visual size: an invisible hit area */
 :is(.m-btn,.m-icon-btn,.pill){position:relative}
 :is(.m-btn-sm,.m-btn-md,.m-icon-btn,.pill)::before{content:'';position:absolute;inset-inline:0;inset-block:min(0px,calc((100% - 44px) / 2))}
}
@layer tokens{
 /* colour used AS TEXT: AA on both themes. Fills keep the brand/status main colour. */
 :root{
  --c-primary-ink:light-dark(var(--c-primary-dark),color-mix(in oklab,var(--c-primary-light),white 22%));
  --c-success-ink:light-dark(var(--c-success-darker),color-mix(in oklab,var(--c-success-light),white 22%));
  --c-error-ink:light-dark(var(--c-error-dark),color-mix(in oklab,var(--c-error-light),white 22%));
  --c-warning-ink:light-dark(var(--c-warning-darker),color-mix(in oklab,var(--c-warning-light),white 22%));
  --c-info-ink:light-dark(var(--c-info-darker),color-mix(in oklab,var(--c-info-light),white 22%));
 }
}
@layer components.app{
 /* Minimal's filled error/warning with white text measure 3.2:1 — one step darker */
 .m-label-filled-error{background:var(--c-error-dark)}
 .m-label-filled-warning{background:var(--c-warning-darker);color:var(--c-white)}
}
@layer components.app{ .ep code{overflow-wrap:anywhere;min-inline-size:0} }

/* ── brand polish pass (Apple-level): one quiet bar, one accent, one primary ── */
@layer components.app{
 #gm-top{gap:var(--sp-3);background:color-mix(in oklch,var(--c-surface) 86%,transparent);backdrop-filter:saturate(1.6) blur(18px)}
 #gm-tn{border-color:transparent;background:transparent;transition:background var(--dur-fast) var(--ease)}
 #gm-tn:hover,#gm-tn[aria-expanded=true]{background:var(--c-state-hover)}
 #gm-find{flex:0 1 460px;margin-inline-start:auto;display:flex;align-items:center;gap:var(--sp-2);min-block-size:44px;padding-inline:var(--sp-4) var(--sp-2);border:0;border-radius:var(--r-pill);background:var(--c-surface-neutral);color:var(--c-text-secondary);font-size:.9375rem;text-align:start;transition:background var(--dur-fast) var(--ease),box-shadow var(--dur-fast) var(--ease)}
 #gm-find span{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
 #gm-find:hover{background:color-mix(in oklch,var(--c-surface-neutral),var(--c-text) 4%)}
 #gm-find:focus-visible{box-shadow:0 0 0 3px color-mix(in oklch,var(--c-primary) 30%,transparent)}
 #gm-find kbd{font:var(--fw-bold) .6875rem/1 var(--font-mono);padding:5px 7px;border-radius:7px;background:var(--c-surface);color:var(--c-text-secondary);box-shadow:0 1px 0 var(--c-border)}
 /* side nav: soft brand tint instead of a black slab */
 .nv-i.on,[data-color-scheme=dark] .nv-i.on{background:color-mix(in oklch,var(--c-primary) 10%,transparent);color:var(--c-primary-ink);font-weight:var(--fw-bold)}
 .nv-i.on::after{display:none}
 .nv-i.on .ic{color:var(--c-primary)}
 .nv-h{letter-spacing:.04em}
 .side-foot{background:transparent;border:1px solid var(--c-border);gap:8px}
 .sf-r{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-2)}
 .sf-r .top-b .m-btn[aria-pressed=true]{background:var(--c-text);color:var(--c-surface)}
 /* one primary action colour across every screen = brand red */
 #gm-main .m-btn-contained-inherit:not([aria-pressed]),.pp .m-btn-contained-inherit{background:var(--c-primary);color:var(--c-primary-contrast,var(--c-white))}
 #gm-main .m-btn-contained-inherit:not([aria-pressed]):hover{background:var(--c-primary-dark)}
 /* no decorative red tabs before card titles */
 .ch .dot{display:none}
 /* ask: a quiet brand orb, not a slab over content */
 #gm-askbtn{inline-size:56px;block-size:56px;min-block-size:56px;padding:0;justify-content:center;border-radius:50%;background:var(--c-primary);color:var(--c-white);box-shadow:0 10px 30px -8px color-mix(in oklch,var(--c-primary) 70%,transparent),0 2px 6px color-mix(in oklch,var(--c-black,black) 12%,transparent);transition:transform var(--dur-normal) var(--ease)}
 #gm-askbtn svg{color:var(--c-white)}
 #gm-askbtn:hover{transform:scale(1.06)}
 /* dashboard: the greeting is the title */
 [data-route=dashboard] #gm-head{display:none}
 [data-route=dashboard] #gm-view{padding-block-start:var(--sp-6)}
 #gm-title{letter-spacing:-.015em}
}
@container page (width <= 599px){ #gm-find span,#gm-find kbd{display:none} #gm-find{flex:none;inline-size:44px;padding:0;justify-content:center;margin-inline-start:auto} }
@container main (width <= 599px){
 .g-4:has(> .kp2){grid-template-columns:1fr 1fr}
 .kp2{padding:var(--sp-4)}
 .kp2 .kp-r{flex-direction:column;align-items:stretch;gap:6px}
 .kp2 .kp-r b{font-size:1.625rem}
 .kp2 svg{inline-size:100%;block-size:28px}
 .kp-d span{display:none}
}

@layer components.app{
 /* tenant badges: the brand hue, capped dark enough for white initials (≥4.5:1) */
 .tn-av{background:oklch(from var(--tc) min(l,.5) c h)}
 .m-avatar,[data-color-scheme=dark] .m-avatar{color:var(--c-primary-ink)}
 .m-label-soft-primary,.m-label-soft-secondary{color:var(--c-primary-ink)}
 /* switch: 44px hit area around the 22px track */
 .m-switch::before{content:"";position:absolute;inset-block:-11px;inset-inline:0}
}

@layer components.app{
 .m-label-soft-default{color:var(--c-text)}
 .m-switch.on{background:var(--c-primary)}
 [data-tenant=nf][data-color-scheme=dark] .m-switch.on::after{background:var(--c-primary-contrast)}
}
@layer components.app{ .m-btn-soft-primary{color:var(--c-primary-ink)} }
@layer tokens{
 /* text on a brand fill: white on dark brands, near-black on light brands (sport1 green, NF in dark) */
 :root{--c-primary-contrast:oklch(from var(--c-primary) clamp(0,(.6 - l) * 1000,1) 0 0)}
}