:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--bg:#050711;--panel:#0b0f1c;--border:#ffffff14;--text:#d7dcec;--muted:#8b94a7}:root[data-theme=light]{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--bg:#fbfcfe;--panel:#f1f4f9;--border:#0000001a;--text:#0b1220;--muted:#3d4a63}*{box-sizing:border-box}html,body{background:var(--bg);height:100%;color:var(--text);margin:0;font:12px/1.4 Inter,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}body{flex-direction:column;display:flex}.bar{background:var(--panel);border-bottom:1px solid var(--border);flex:none;align-items:center;gap:14px;height:40px;padding:0 12px;display:flex}.brand{font-weight:600}.stat{color:var(--muted);font-variant-numeric:tabular-nums}.stat b{color:var(--text);font-weight:600}.spacer{flex:1}button,select{font:inherit;color:var(--text);border:1px solid var(--border);cursor:pointer;background:0 0;border-radius:6px;padding:4px 10px}select option{background:var(--panel)}.goto{gap:4px;display:flex}.goto input{font:inherit;color:var(--text);border:1px solid var(--border);--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark;background:0 0;border-radius:6px;padding:3px 6px}@media (prefers-color-scheme:dark){.goto input{--lightningcss-light: ;--lightningcss-dark:initial}}button:hover,select:hover{border-color:var(--muted)}.stage{flex:1;min-height:0}.chart-box{width:100%;height:100%}.static .stage{flex:none}.static .chart-box{width:1200px;height:700px}.request-log{z-index:10;border:1px solid var(--border,#2a2e39);color:#d1d4dc;pointer-events:auto;background:#0a0c12e0;border-radius:8px;max-width:min(520px,100vw - 24px);padding:8px 10px;font:12px/1.5 ui-monospace,SFMono-Regular,Menlo,monospace;position:fixed;bottom:40px;left:12px}.request-log header{margin-bottom:4px;font-weight:600}.request-log header small{color:#8b95a7;margin-left:6px;font-weight:400}.request-log ol{margin:0;padding:0;list-style:none}.request-log li{cursor:pointer;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.request-log li:hover{background:#ffffff0f}.request-log em{color:#8b95a7;font-style:normal}.replay{background:var(--panel);border-bottom:1px solid var(--border);flex-wrap:wrap;flex:none;align-items:center;gap:6px;padding:4px 12px;display:flex}.replay[hidden]{display:none}.replay input{font:inherit;color:var(--text);border:1px solid var(--border);--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark;background:0 0;border-radius:6px;padding:3px 6px}@media (prefers-color-scheme:dark){.replay input{--lightningcss-light: ;--lightningcss-dark:initial}}.replay.on [data-testid=replay-time]{color:var(--text);font-weight:600}.demos-open{color:#fff;background:#2962ff;border-color:#0000;flex:none;font-weight:600}.demos-open:hover,.demos-open[aria-expanded=true]{background:#1e53e5;border-color:#0000}.panel{z-index:20;border:1px solid var(--border);background:var(--panel);visibility:hidden;border-radius:12px;flex-direction:column;width:min(380px,100vw - 16px);transition:transform .2s,visibility .2s;display:flex;position:fixed;top:48px;bottom:8px;right:8px;transform:translate(calc(100% + 16px));box-shadow:0 18px 48px #00000073}.panel.open{visibility:visible;transform:none}.panel-head{border-bottom:1px solid var(--border);flex:none;align-items:center;gap:6px;padding:10px 12px 10px 16px;display:flex}.panel-head h2{margin:0;font-size:15px}.panel-ghost{border:1px solid var(--border);color:var(--text);border-radius:6px;padding:4px 10px;text-decoration:none}.panel-ghost:hover{border-color:var(--muted)}.panel-close{border-color:#0000;width:28px;height:28px;padding:0;font-size:18px;line-height:1}.panel-body{overscroll-behavior:contain;flex:1;padding:4px 16px 16px;overflow-y:auto}.panel-section{border-bottom:1px solid var(--border);flex-direction:column;gap:10px;padding:14px 0;display:flex}.panel-section:last-child{border-bottom:none}.panel-section h3{letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin:0;font-size:11px;font-weight:700}.panel-note{color:var(--muted);margin:0;font-size:11.5px}.panel-section>h3+.panel-note{margin-top:-6px}.preset-grid{grid-template-columns:1fr 1fr;gap:6px;display:grid}.preset{border:1px solid var(--border);background:var(--bg);color:var(--text);border-radius:8px;flex-direction:column;gap:2px;padding:8px 10px;text-decoration:none;display:flex}.preset:hover,.preset:focus-visible{border-color:#2962ff}.preset span{color:var(--muted);font-size:11px}.panel-toggle{cursor:pointer;align-items:center;gap:12px;display:flex}.panel-toggle-text{flex-direction:column;flex:1;gap:1px;display:flex}.panel-toggle-text span{color:var(--muted);font-size:11.5px}.panel-toggle input{appearance:none;background:var(--border);border:1px solid var(--border);cursor:pointer;border-radius:999px;flex:none;width:34px;height:20px;margin:0;transition:background .15s;position:relative}.panel-toggle input:after{content:"";background:var(--muted);border-radius:50%;width:14px;height:14px;transition:transform .15s,background .15s;position:absolute;top:2px;left:2px}.panel-toggle input:checked{background:#2962ff;border-color:#2962ff}.panel-toggle input:checked:after{background:#fff;transform:translate(14px)}.panel-toggle input:focus-visible{outline-offset:2px;outline:2px solid #7aa2ff}.panel-sub{border-left:2px solid #2962ff80;flex-direction:column;gap:10px;margin-left:4px;padding:10px 0 4px 12px;display:flex}.panel-sub[hidden]{display:none}.panel-layers{flex-direction:column;gap:8px;display:flex}.panel-choice{flex-direction:column;gap:5px;display:flex}.segmented{border:1px solid var(--border);border-radius:7px;flex-wrap:wrap;align-self:flex-start;gap:0;display:flex;overflow:hidden}.segmented button{border:none;border-right:1px solid var(--border);border-radius:0;padding:5px 11px}.segmented button:last-child{border-right:none}.segmented button[aria-pressed=true]{color:#fff;background:#2962ff}.panel-field{grid-template-columns:84px 1fr;align-items:center;gap:8px;display:grid}.panel-field>span{font-weight:600}.panel-field select{width:100%}.panel-inline{gap:4px;min-width:0;display:flex}.panel-inline input{min-width:0;font:inherit;color:var(--text);border:1px solid var(--border);--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark;background:0 0;border-radius:6px;flex:1;padding:3px 6px}@media (prefers-color-scheme:dark){.panel-inline input{--lightningcss-light: ;--lightningcss-dark:initial}}.panel-apply{color:#fff;background:#2962ff;border-color:#2962ff;align-self:stretch;padding:8px;font-weight:600}.panel-apply:disabled{border-color:var(--border);color:var(--muted);cursor:default;background:0 0}@media (width<=640px){.bar{scrollbar-width:none;overflow-x:auto}.panel{border-radius:14px 14px 0 0;width:100vw;max-height:72vh;inset:auto 0 0;transform:translateY(100%)}.panel-body{padding-bottom:calc(16px + env(safe-area-inset-bottom))}.segmented button{padding:7px 12px}}