:root{--bg: #07090d;--bg-2: #0b0f16;--panel: rgba(16, 21, 30, .78);--panel-solid: #111722;--panel-2: rgba(24, 31, 44, .85);--line: rgba(255, 255, 255, .08);--line-2: rgba(255, 255, 255, .14);--text: #e7edf5;--muted: #8a97a8;--faint: #5b6676;--heart: #ff4d5e;--heart-2: #ff8a95;--cyan: #38d6ff;--cyan-2: #8be7ff;--amber: #ffb547;--green: #3ee08f;--violet: #a08bff;--danger: #ff5c5c;--radius: 14px;--radius-sm: 9px;--shadow: 0 10px 40px rgba(0, 0, 0, .45);--font: "Inter", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;--mono: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;--nav-h: 56px;color-scheme:dark}*{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;background:radial-gradient(1200px 800px at 75% -10%,rgba(255,77,94,.08),transparent 60%),radial-gradient(900px 700px at -10% 110%,rgba(56,214,255,.06),transparent 60%),var(--bg);color:var(--text);font-family:var(--font);font-size:14px;line-height:1.5;-webkit-font-smoothing:antialiased;overflow:hidden}a{color:var(--cyan);text-decoration:none}a:hover{text-decoration:underline}h1,h2,h3,h4{margin:0 0 .4em;line-height:1.2;letter-spacing:-.01em}h1{font-size:clamp(26px,4vw,40px);font-weight:800}h2{font-size:20px;font-weight:700}h3{font-size:15px;font-weight:650}p{margin:0 0 .8em}code,.mono{font-family:var(--mono);font-size:.92em}::selection{background:#38d6ff4d}.app{display:flex;flex-direction:column;height:100%}.topbar{height:var(--nav-h);flex:0 0 var(--nav-h);display:flex;align-items:center;gap:18px;padding:0 16px;border-bottom:1px solid var(--line);background:#07090dd1;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);z-index:20}.brand{display:flex;align-items:center;gap:10px;font-weight:800;letter-spacing:.06em;font-size:13px;white-space:nowrap}.brand .beat{width:22px;height:22px;color:var(--heart);animation:beat .705s infinite;transform-origin:center}@keyframes beat{0%,to{transform:scale(1)}12%{transform:scale(1.18)}24%{transform:scale(.98)}36%{transform:scale(1.08)}55%{transform:scale(1)}}.brand small{color:var(--muted);font-weight:500;letter-spacing:.02em}.nav{display:flex;gap:4px;overflow-x:auto;scrollbar-width:none;flex:1}.nav::-webkit-scrollbar{display:none}.nav a{color:var(--muted);padding:7px 12px;border-radius:999px;font-weight:600;font-size:13px;white-space:nowrap;border:1px solid transparent;transition:all .15s ease}.nav a:hover{color:var(--text);background:#ffffff0a;text-decoration:none}.nav a.active{color:var(--text);background:#ff4d5e1f;border-color:#ff4d5e59}.main{flex:1;min-height:0;position:relative}.page-scroll{height:100%;overflow-y:auto;overflow-x:hidden}.page-pad{max-width:1240px;margin:0 auto;padding:28px 16px 80px}.panel{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}.panel-pad{padding:16px}.card{background:var(--panel-2);border:1px solid var(--line);border-radius:var(--radius);padding:16px}.eyebrow{text-transform:uppercase;letter-spacing:.14em;font-size:11px;font-weight:700;color:var(--muted)}.muted{color:var(--muted)}.faint{color:var(--faint)}.row{display:flex;gap:10px;align-items:center}.wrap{flex-wrap:wrap}.grow{flex:1;min-width:0}.grid{display:grid;gap:14px}.grid-2{grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}.grid-3{grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}.grid-4{grid-template-columns:repeat(auto-fit,minmax(170px,1fr))}.sep{height:1px;background:var(--line);margin:12px 0}.btn{appearance:none;border:1px solid var(--line-2);background:#ffffff0a;color:var(--text);padding:7px 12px;border-radius:var(--radius-sm);font:600 13px var(--font);cursor:pointer;display:inline-flex;align-items:center;gap:6px;transition:all .12s ease;white-space:nowrap}.btn:hover{background:#ffffff14;border-color:#ffffff3d}.btn:active{transform:translateY(1px)}.btn.primary{background:linear-gradient(180deg,#ff5d6c,#e63f51);border-color:transparent;color:#fff}.btn.primary:hover{filter:brightness(1.08)}.btn.cyan{background:#38d6ff1f;border-color:#38d6ff66;color:var(--cyan-2)}.btn.ghost{background:transparent;border-color:transparent;color:var(--muted)}.btn.ghost:hover{color:var(--text);background:#ffffff0d}.btn.small{padding:4px 9px;font-size:12px}.btn[disabled]{opacity:.45;cursor:not-allowed}.seg{display:inline-flex;background:#ffffff0a;border:1px solid var(--line);border-radius:10px;padding:3px;gap:2px;flex-wrap:wrap}.seg button{appearance:none;border:0;background:transparent;color:var(--muted);padding:5px 10px;border-radius:7px;font:600 12px var(--font);cursor:pointer}.seg button:hover{color:var(--text)}.seg button.on{background:#38d6ff29;color:var(--cyan-2)}.chip{display:inline-flex;align-items:center;gap:6px;padding:3px 9px;border-radius:999px;font-size:12px;font-weight:600;border:1px solid var(--line-2);background:#ffffff0a}.chip .dot{width:8px;height:8px;border-radius:50%}.chip.good{color:var(--green);border-color:#3ee08f59;background:#3ee08f14}.chip.warn{color:var(--amber);border-color:#ffb54759;background:#ffb54714}.chip.bad{color:var(--danger);border-color:#ff5c5c59;background:#ff5c5c14}.chip.violet{color:var(--violet);border-color:#a08bff59;background:#a08bff14}.chip.info{color:var(--cyan-2);border-color:#38d6ff59;background:#38d6ff14}.stat{display:flex;flex-direction:column;gap:2px}.stat .v{font:700 26px/1.1 var(--font);letter-spacing:-.02em}.stat .v small{font-size:13px;color:var(--muted);font-weight:600;margin-left:3px}.stat .k{font-size:12px;color:var(--muted);font-weight:600}input[type=range]{-webkit-appearance:none;appearance:none;width:100%;height:22px;background:transparent;cursor:pointer}input[type=range]::-webkit-slider-runnable-track{height:4px;border-radius:4px;background:linear-gradient(90deg,var(--cyan) var(--pct, 50%),rgba(255,255,255,.12) var(--pct, 50%))}input[type=range]::-moz-range-track{height:4px;border-radius:4px;background:#ffffff1f}input[type=range]::-moz-range-progress{height:4px;border-radius:4px;background:var(--cyan)}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:16px;height:16px;border-radius:50%;background:#fff;margin-top:-6px;box-shadow:0 0 0 4px #38d6ff40}input[type=range]::-moz-range-thumb{width:16px;height:16px;border:0;border-radius:50%;background:#fff;box-shadow:0 0 0 4px #38d6ff40}.slider{display:grid;gap:2px}.slider .lbl{display:flex;justify-content:space-between;font-size:12px;color:var(--muted);font-weight:600}.slider .lbl .val{color:var(--text);font-family:var(--mono);font-weight:500}.toggle{display:flex;align-items:center;gap:9px;cursor:pointer;user-select:none;font-size:13px;padding:3px 0}.toggle{position:relative}.toggle input{position:absolute;opacity:0;width:1px;height:1px;margin:0;pointer-events:none}.toggle input:focus-visible+.sw{outline:2px solid var(--cyan);outline-offset:2px}.toggle.disabled,.slider.disabled{opacity:.45;cursor:not-allowed}.toggle.disabled *,.slider.disabled input{cursor:not-allowed}.toggle .sw{width:30px;height:18px;border-radius:999px;background:#ffffff24;position:relative;transition:background .15s;flex:0 0 auto}.toggle .sw:after{content:"";position:absolute;width:14px;height:14px;left:2px;top:2px;border-radius:50%;background:#fff;transition:transform .15s}.toggle input:checked+.sw{background:var(--cyan)}.toggle input:checked+.sw:after{transform:translate(12px)}.loader{position:absolute;inset:0;display:grid;place-items:center;z-index:5;background:#07090d99;backdrop-filter:blur(4px)}.loader .box{width:min(360px,80vw);text-align:center}.loader .bar{height:4px;background:#ffffff1a;border-radius:4px;overflow:hidden;margin:12px 0 6px}.loader .bar>div{height:100%;background:linear-gradient(90deg,var(--heart),var(--cyan));transition:width .15s}.spinner{width:34px;height:34px;border-radius:50%;border:3px solid rgba(255,255,255,.12);border-top-color:var(--heart);animation:spin .9s linear infinite;margin:0 auto}@keyframes spin{to{transform:rotate(360deg)}}.tooltip{position:absolute;pointer-events:none;z-index:30;background:#0a0d13eb;border:1px solid var(--line-2);border-radius:8px;padding:6px 9px;font-size:12px;white-space:nowrap;box-shadow:var(--shadow)}table.data{width:100%;border-collapse:collapse;font-size:13px}table.data th{text-align:left;color:var(--muted);font-weight:600;font-size:11px;text-transform:uppercase;letter-spacing:.08em;padding:8px;border-bottom:1px solid var(--line-2)}table.data td{padding:8px;border-bottom:1px solid var(--line);vertical-align:top}table.data td.num{font-family:var(--mono);text-align:right}table.data th.num{text-align:right}.disclaimer{font-size:12px;color:var(--muted);border-left:3px solid var(--amber);padding:8px 12px;background:#ffb5470f;border-radius:0 8px 8px 0}.viewer{position:absolute;inset:0;display:flex}.viewer .stage{position:relative;flex:1;min-width:0}.viewer .side{width:300px;flex:0 0 300px;border-left:1px solid var(--line);background:#090c12d9;overflow-y:auto;padding:14px}.side h3{margin-top:4px}.side .group{margin-bottom:16px}@media(max-width:820px){.viewer{flex-direction:column}.viewer .side{width:auto;flex:0 0 auto;max-height:42%;border-left:0;border-top:1px solid var(--line)}.brand small{display:none}}canvas{display:block}.viewer .stage canvas{touch-action:none}.page-scroll canvas,.page-scroll div:has(>canvas){touch-action:pan-y!important}