:root{color-scheme:light;--surface: hsl(0 0% 99%);--surface-2: hsl(240 6% 96%);--fg: hsl(240 6% 10%);--muted: hsl(240 4% 42%);--line: hsl(240 6% 88%);--brand: hsl(258 89% 66%);--brand-strong: hsl(258 70% 52%);--brand-tint: hsl(258 89% 66% / .1);--on-brand: hsl(0 0% 100%);--excellent: hsl(160 84% 30%);--moderate: hsl(35 92% 36%);--poor: hsl(21 90% 44%);--blocked: hsl(0 72% 48%);--tone: var(--brand-strong)}@media (prefers-color-scheme: dark){:root:not([data-theme=light]){color-scheme:dark;--surface: hsl(240 5% 11%);--surface-2: hsl(240 4% 16%);--fg: hsl(0 0% 98%);--muted: hsl(240 5% 68%);--line: hsl(240 4% 23%);--brand-strong: hsl(258 95% 76%);--brand-tint: hsl(258 89% 66% / .18);--excellent: hsl(158 64% 58%);--moderate: hsl(43 96% 60%);--poor: hsl(27 96% 64%);--blocked: hsl(0 91% 72%)}}:root[data-theme=dark]{color-scheme:dark;--surface: hsl(240 5% 11%);--surface-2: hsl(240 4% 16%);--fg: hsl(0 0% 98%);--muted: hsl(240 5% 68%);--line: hsl(240 4% 23%);--brand-strong: hsl(258 95% 76%);--brand-tint: hsl(258 89% 66% / .18);--excellent: hsl(158 64% 58%);--moderate: hsl(43 96% 60%);--poor: hsl(27 96% 64%);--blocked: hsl(0 91% 72%)}*{box-sizing:border-box;margin:0}html,body{height:100%;background:transparent}body{font-family:Chakra Petch,ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,sans-serif;color:var(--fg);font-size:14px;line-height:1.4;-webkit-font-smoothing:antialiased;overflow:hidden}.card{position:relative;display:flex;flex-direction:column;height:100%;min-height:0;max-width:560px;max-height:480px;margin-inline:auto;overflow:hidden;background:var(--surface);border:1px solid var(--line);border-radius:14px}.card[data-tone=excellent]{--tone: var(--excellent)}.card[data-tone=moderate]{--tone: var(--moderate)}.card[data-tone=poor]{--tone: var(--poor)}.card[data-tone=blocked]{--tone: var(--blocked)}.head{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:12px 16px 0}.brand{display:inline-flex;align-items:center;gap:7px;font-weight:600;font-size:13px}.brand svg{width:15px;height:15px;color:var(--brand)}.status{font-size:11px;letter-spacing:.02em;color:var(--muted)}[data-state=running] .status{color:var(--brand-strong)}[data-state=done] .status{color:var(--tone)}.path{display:flex;align-items:flex-start;padding:12px 20px 0}.node{display:flex;flex:none;flex-direction:column;align-items:center;gap:3px;width:44px}.node-box{display:grid;place-items:center;width:34px;height:34px;color:var(--muted);background:var(--surface-2);border:1px solid var(--line);border-radius:9px;transition:color .25s,border-color .25s,background-color .25s}.node-box svg{width:17px;height:17px}.node-label{font-size:10.5px;color:var(--muted)}.node-nat .node-box{color:var(--brand-strong);background:var(--brand-tint);border-color:transparent}[data-state=done] .node-nat .node-box{color:var(--tone);background:color-mix(in srgb,var(--tone) 13%,transparent)}.wire{position:relative;flex:1;min-width:18px;height:2px;margin-top:16px;background:repeating-linear-gradient(90deg,var(--line) 0 4px,transparent 4px 8px)}[data-state=running] .wire:after{content:"";position:absolute;top:-2px;left:0;width:6px;height:6px;background:var(--brand);border-radius:50%;animation:packet 1.2s ease-in-out infinite}[data-state=running] .wire-in:after{animation-delay:.6s;opacity:0}@keyframes packet{0%{left:0;opacity:0}15%{opacity:1}85%{opacity:1}to{left:calc(100% - 6px);opacity:0}}[data-state=done] .wire-out{background:var(--tone)}[data-state=done] .wire-in{background:repeating-linear-gradient(90deg,var(--tone) 0 4px,transparent 4px 8px)}[data-state=done][data-tone=excellent] .wire-in{background:var(--tone)}.chip{position:absolute;top:50%;left:50%;display:none;padding:1px 6px;font-size:10px;font-weight:600;line-height:1.4;color:var(--tone);white-space:nowrap;background:var(--surface);border:1px solid color-mix(in srgb,var(--tone) 45%,transparent);border-radius:999px;transform:translate(-50%,-50%)}[data-state=done] .chip:not(:empty){display:block}.pane{display:none;flex:1;flex-direction:column;min-height:0;padding:12px 16px 0}[data-state=idle] .pane-idle,[data-state=running] .pane-result,[data-state=done] .pane-result{display:flex}h1{font-size:23px;font-weight:700;line-height:1.15;letter-spacing:-.01em}.lede{margin-top:6px;color:var(--muted)}.checks{display:flex;flex-wrap:wrap;gap:4px 12px;margin-top:10px;padding:0;font-size:12.5px;font-weight:600;list-style:none}.checks li{display:inline-flex;align-items:center;gap:6px}.checks li:before{content:"";width:7px;height:7px;background:var(--brand);border-radius:2px}.hint{margin-top:8px;font-size:12px;color:var(--muted);text-align:center}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:42px;padding:0 16px;font:inherit;font-weight:600;text-decoration:none;cursor:pointer;border:1px solid transparent;border-radius:10px;transition:background-color .15s,border-color .15s,transform .15s}.btn:active{transform:translateY(1px)}.btn:focus-visible,.foot a:focus-visible{outline:2px solid var(--brand);outline-offset:2px}.btn-primary{color:var(--on-brand);background:#7444e4}.btn-primary:hover{background:#622fda}.btn-primary svg{width:16px;height:16px}.btn-start{width:100%;margin-top:auto}.btn-ghost{flex:none;color:var(--fg);background:transparent;border-color:var(--line)}.btn-ghost:hover{background:var(--surface-2)}.eyebrow{font-size:11.5px;color:var(--muted)}.verdict{margin-top:1px;font-size:23px;font-weight:700;line-height:1.15;letter-spacing:-.01em;color:var(--fg)}[data-state=done] .verdict{color:var(--tone);animation:rise .28s ease-out}@keyframes rise{0%{opacity:0;transform:translateY(5px)}to{opacity:1;transform:none}}.meaning{min-height:2.8em;margin-top:4px;font-size:13px;color:var(--muted)}.meter{display:grid;grid-template-columns:repeat(4,1fr);gap:4px;margin-top:6px}.seg{height:5px;background:var(--surface-2);border-radius:3px;box-shadow:inset 0 0 0 1px var(--line);transition:background-color .25s}[data-state=running] .seg{animation:seg-pulse 1.2s ease-in-out infinite}.seg:nth-child(2){animation-delay:.15s!important}.seg:nth-child(3){animation-delay:.3s!important}.seg:nth-child(4){animation-delay:.45s!important}@keyframes seg-pulse{50%{background:var(--brand-tint)}}.seg.on{background:var(--tone);box-shadow:none}.rows{margin-top:8px}.row{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:25px}.row+.row{border-top:1px solid var(--line)}dt{flex:none;font-size:12.5px;color:var(--muted)}dd{min-width:0;overflow:hidden;font-size:12.5px;font-weight:600;text-overflow:ellipsis;white-space:nowrap}dd.mono{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-weight:500}.spin{display:inline-block;width:12px;height:12px;vertical-align:-2px;border:2px solid var(--line);border-top-color:var(--brand);border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.actions{display:none;gap:8px;margin-top:auto}[data-state=done] .actions{display:flex}.btn-cta{flex:1;min-width:0;padding:0 10px;white-space:nowrap}.foot{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:10px 16px 11px;font-size:11px;color:var(--muted)}.foot a{color:inherit;text-decoration:none}.foot a:hover{color:var(--fg)}.foot strong{font-weight:600;color:var(--fg)}@media (max-width: 339px){.private{display:none}.path,.btn-ghost{padding-inline:10px}h1,.verdict{font-size:20px}}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation:none!important;transition:none!important}[data-state=running] .wire:after{display:none}}
