.app{min-height:100%;padding:clamp(1rem,4vw,2.5rem);max-width:1200px;margin:0 auto}.app-header{margin-bottom:clamp(1.25rem,3vw,2rem)}.app-kicker{margin:0 0 .35rem;font-size:.75rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--accent)}.app-title{margin:0;font-size:clamp(1.65rem,4vw,2.35rem);font-weight:700;letter-spacing:-.02em;line-height:1.15}.app-subtitle{margin:.5rem 0 0;max-width:42ch;font-size:clamp(.9rem,2vw,1rem);color:var(--muted)}.layout{display:grid;gap:clamp(1rem,2.5vw,1.75rem);align-items:start}@media (min-width: 900px){.layout{grid-template-columns:minmax(0,1fr) minmax(280px,340px)}}.chart-card,.controls-card{border-radius:var(--radius-lg);background:var(--surface);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border:1px solid var(--border);box-shadow:var(--shadow-elevated)}.chart-card{padding:clamp(.75rem,2vw,1.25rem);overflow:hidden}.chart-surface{position:relative;width:100%;height:clamp(280px,62vmin,560px);max-height:min(72vh,600px);border-radius:var(--radius-md);background:linear-gradient(145deg,rgba(15,23,42,.9),rgba(8,12,24,.95));border:1px solid var(--border)}.chart-surface .js-plotly-plot,.chart-surface .plotly{width:100%!important;height:100%!important}.chart-surface .js-plotly-plot .plotly .modebar{display:none}.controls-card{padding:clamp(1rem,2.5vw,1.35rem);display:flex;flex-direction:column;gap:1.1rem}.metrics{display:grid;grid-template-columns:1fr 1fr;gap:.65rem}.metric{padding:.75rem .85rem;border-radius:var(--radius-md);background:rgba(15,23,42,.55);border:1px solid var(--border)}.metric-label{display:block;font-size:.7rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin-bottom:.2rem}.metric-value{font-size:1.35rem;font-weight:700;font-variant-numeric:tabular-nums;letter-spacing:-.02em}.metric-value--good{color:var(--positive)}.metric-value--bad{color:var(--negative)}.metric-denominator{font-size:.65em;font-weight:600;color:var(--muted)}.controls-stack{display:flex;flex-direction:column;gap:1.15rem}.control{display:flex;flex-direction:column;gap:.45rem}.control-header{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:.35rem .75rem}.control-label{font-size:.9rem;font-weight:600;color:var(--text)}.control-value{font-family:var(--font-mono);font-size:.8rem;font-weight:500;color:var(--accent);padding:.15rem .5rem;border-radius:999px;background:var(--accent-soft);border:1px solid rgba(56,189,248,.25)}.control-hint{margin:0;font-size:.75rem;color:var(--muted);line-height:1.45}input[type=range]{-webkit-appearance:none;appearance:none;width:100%;height:.45rem;border-radius:999px;background:rgba(148,163,184,.18);outline:none}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:1.15rem;height:1.15rem;border-radius:50%;background:linear-gradient(145deg,#e0f2fe,var(--accent));border:2px solid rgba(15,23,42,.85);box-shadow:0 2px 10px #00000059;cursor:pointer}input[type=range]::-moz-range-thumb{width:1.15rem;height:1.15rem;border-radius:50%;background:linear-gradient(145deg,#e0f2fe,var(--accent));border:2px solid rgba(15,23,42,.85);box-shadow:0 2px 10px #00000059;cursor:pointer}input[type=range]:focus-visible{box-shadow:0 0 0 3px var(--accent-soft)}.hint{margin:0;font-size:.8rem;line-height:1.55;color:var(--muted);padding-top:.25rem;border-top:1px solid var(--border)}.hint code{font-family:var(--font-mono);font-size:.78em;padding:.12em .4em;border-radius:6px;background:rgba(15,23,42,.75);border:1px solid var(--border);color:#cbd5e1}.modebar-container{position:relative!important}:root{color-scheme:dark;--bg-deep: #070b14;--bg: #0c1222;--surface: rgba(18, 26, 44, .72);--surface-solid: #121a2c;--border: rgba(120, 162, 214, .14);--border-strong: rgba(148, 163, 184, .22);--text: #e8edf7;--muted: #94a3b8;--accent: #38bdf8;--accent-soft: rgba(56, 189, 248, .16);--positive: #4ade80;--negative: #fb7185;--radius-lg: 20px;--radius-md: 12px;--radius-sm: 8px;--shadow-elevated: 0 24px 80px rgba(0, 0, 0, .45), 0 0 0 1px var(--border);--font-sans: "DM Sans", system-ui, -apple-system, "Segoe UI", sans-serif;--font-mono: "JetBrains Mono", ui-monospace, monospace}html,body,#root{min-height:100%;margin:0}html{-webkit-text-size-adjust:100%}body{font-family:var(--font-sans);background:var(--bg-deep);background-image:radial-gradient(ellipse 120% 80% at 50% -30%,rgba(56,189,248,.12),transparent 55%),radial-gradient(ellipse 70% 50% at 100% 0%,rgba(167,139,250,.08),transparent 45%),radial-gradient(ellipse 60% 40% at 0% 100%,rgba(52,211,153,.06),transparent 50%);color:var(--text);line-height:1.5}*{box-sizing:border-box}
