@import"https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@400;500;600&family=Manrope:wght@400;500;700;800&display=swap";:root{--bg-main: #08131f;--bg-panel: rgba(10, 28, 43, .86);--bg-panel-strong: rgba(8, 21, 32, .96);--bg-selected: rgba(29, 59, 84, .95);--line: rgba(156, 197, 220, .16);--line-strong: rgba(156, 197, 220, .3);--text-main: #eff8ff;--text-muted: #8ca6bb;--amber: #ffbb55;--cyan: #58d2ff;--emerald: #42dfaa;--rose: #ff6c8a;--violet: #9583ff;--green-soft: rgba(66, 223, 170, .18);--amber-soft: rgba(255, 187, 85, .18);--cyan-soft: rgba(88, 210, 255, .18);--rose-soft: rgba(255, 108, 138, .18)}*{box-sizing:border-box}html,body,#root{margin:0;min-height:100%}body{color:var(--text-main);font-family:Manrope,sans-serif;background:radial-gradient(circle at 15% 18%,rgba(255,187,85,.18),transparent 32%),radial-gradient(circle at 82% 12%,rgba(88,210,255,.16),transparent 28%),linear-gradient(150deg,#050d16,#08131f 40%,#0a1a27)}button,input,textarea{font:inherit}button{cursor:pointer}.app-shell{min-height:100vh;padding:clamp(14px,2vw,28px)}.hero-card,.panel{border:1px solid var(--line);border-radius:22px;background:var(--bg-panel);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);box-shadow:0 20px 60px #00000038}.hero-card{max-width:1440px;margin:0 auto 18px;padding:clamp(18px,2vw,26px);display:grid;grid-template-columns:minmax(0,1.8fr) minmax(260px,.8fr);gap:20px}.eyebrow{margin:0 0 6px;font-family:IBM Plex Mono,monospace;font-size:.74rem;letter-spacing:.12em;text-transform:uppercase;color:var(--amber)}.hero-card h1,.problem-header-card h2,.context-banner h2{margin:0;font-size:clamp(1.8rem,3vw,3.1rem);line-height:1.04}.hero-copy,.problem-copy,.context-banner p,.problem-button p,.step-note,.hint-text{color:var(--text-muted);line-height:1.55}.hero-stats,.metric-grid{display:grid;gap:10px}.metric-card{border:1px solid var(--line);border-radius:16px;padding:12px 14px;background:#07121db8}.metric-card span{display:block;margin-bottom:5px;font-size:.76rem;text-transform:uppercase;letter-spacing:.1em;color:var(--text-muted)}.metric-card strong{display:block;font-size:.96rem;line-height:1.35}.metric-grid.three-up{grid-template-columns:repeat(3,minmax(0,1fr))}.workspace{max-width:1440px;margin:0 auto;display:grid;grid-template-columns:minmax(280px,340px) minmax(0,1fr);gap:16px;align-items:start}.problem-nav,.content-area,.problem-stack{display:grid;gap:16px}.panel{padding:16px}.panel-head{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin-bottom:14px}.panel-head h2,.panel-head h3,.triplet-panel h4{margin:0}.panel-head span,.lane-label,.problem-button span,small,.difficulty-badge{color:var(--text-muted)}.problem-list{display:grid;gap:10px}.problem-button{width:100%;text-align:left;padding:14px;border-radius:18px;border:1px solid var(--line);background:#07121db8;color:var(--text-main);transition:transform .18s ease,border-color .18s ease,background .18s ease}.problem-button:hover{transform:translateY(-1px);border-color:#58d2ff6b}.problem-button.selected{background:linear-gradient(155deg,#123046f5,#0b1d2cf5);border-color:#58d2ff7a}.problem-topline{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:6px}.problem-number,.difficulty-badge,.number-cell small,.lane-label,.mini-chip,.trace-controls span{font-family:IBM Plex Mono,monospace}.problem-button strong{display:block;margin-bottom:4px;font-size:1rem}.problem-button p{margin:8px 0 0;font-size:.9rem}.difficulty-badge{display:inline-flex;align-items:center;justify-content:center;padding:4px 8px;border-radius:999px;font-size:.72rem;border:1px solid var(--line)}.difficulty-badge.easy{color:var(--emerald);background:var(--green-soft)}.difficulty-badge.medium{color:var(--amber);background:var(--amber-soft)}.difficulty-badge.hard{color:var(--rose);background:var(--rose-soft)}.context-banner{display:flex;align-items:end;justify-content:space-between;gap:16px}.context-banner h2{font-size:clamp(1.35rem,2vw,2rem)}.context-banner p{margin:0;max-width:540px}.problem-header-card{border:1px solid var(--line);border-radius:22px;background:linear-gradient(140deg,#ffbb5514,#58d2ff14);padding:18px;display:flex;justify-content:space-between;gap:12px}.problem-header-card h2{font-size:clamp(1.3rem,2vw,2.1rem)}.problem-copy{max-width:760px;margin:10px 0 0}.panel-grid.two-up{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.panel-grid.three-up-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.preset-row,.action-row,.chip-cloud,.trace-actions{display:flex;flex-wrap:wrap;gap:10px}.preset-row button,.trace-actions button,.action-row button,.problem-button,.accent-button{transition:transform .18s ease,border-color .18s ease,background .18s ease}.preset-row button,.trace-actions button,.action-row button{padding:9px 12px;border-radius:12px;border:1px solid var(--line);background:var(--bg-panel-strong);color:var(--text-main)}.preset-row button:hover,.trace-actions button:hover,.action-row button:hover{transform:translateY(-1px);border-color:#58d2ff6b}.trace-actions button:disabled{opacity:.45;cursor:not-allowed;transform:none}.accent-button{background:linear-gradient(135deg,#ffbb5538,#58d2ff33)!important;border-color:#58d2ff59!important}.input-grid{display:grid;gap:12px;grid-template-columns:repeat(2,minmax(0,1fr))}.input-grid.compact-grid{grid-template-columns:1.5fr .7fr}label{display:grid;gap:8px}label span{font-size:.82rem;color:var(--text-muted)}textarea,input{width:100%;border:1px solid var(--line);border-radius:14px;background:#06111be0;color:var(--text-main);padding:11px 12px}textarea{resize:vertical;min-height:96px}.hint-text,.error-text{font-size:.9rem}.error-text{color:#ff8ea6}.trace-controls{display:grid;gap:12px}.slider-stack{display:grid;gap:8px}.slider-stack span{font-size:.82rem;color:var(--text-muted)}input[type=range]{padding:0}.step-note{margin:0;padding:14px;border-radius:16px;background:#06111bd1;border:1px solid var(--line)}.mini-chip{display:inline-flex;align-items:center;gap:6px;padding:8px 10px;border-radius:999px;border:1px solid var(--line);background:#06111bd1;font-size:.78rem}.mini-chip.source,.mini-chip.left{border-color:#58d2ff47}.mini-chip.candidate,.mini-chip.anchor{border-color:#ffbb5547}.mini-chip.right,.mini-chip.sum{border-color:#ff6c8a47}.mini-chip.success{border-color:#42dfaa52}.interval-board{display:grid;gap:14px}.interval-lane-wrap{display:grid;gap:8px}.lane-label{font-size:.78rem;letter-spacing:.08em;text-transform:uppercase}.interval-lane{position:relative;min-height:70px;border-radius:18px;border:1px dashed var(--line);background:linear-gradient(90deg,rgba(255,255,255,.03) 1px,transparent 1px) 0 0 / 10% 100%,#06111bb8;overflow:hidden}.interval-bar{position:absolute;top:16px;height:38px;min-width:68px;border-radius:999px;border:1px solid transparent;display:inline-flex;align-items:center;justify-content:center;padding:0 12px;box-shadow:0 10px 24px #0000002e}.interval-bar span{font-size:.78rem;font-family:IBM Plex Mono,monospace}.interval-bar.source{background:#58d2ff29;border-color:#58d2ff47}.interval-bar.candidate{background:#ffbb552e;border-color:#ffbb5561}.interval-bar.output{background:#42dfaa2e;border-color:#42dfaa57}.interval-bar.active{transform:translateY(-2px);box-shadow:0 0 0 1px #ffbb5580,0 10px 24px #ffbb552e}.interval-bar.merged{box-shadow:0 0 0 1px #58d2ff7a,0 10px 24px #58d2ff26}.number-strip{display:grid;grid-template-columns:repeat(auto-fit,minmax(74px,1fr));gap:10px}.number-cell{min-height:86px;border-radius:18px;border:1px solid var(--line);background:#06111bc7;display:grid;place-items:center;padding:8px;transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease}.number-cell strong{font-size:1.16rem}.number-cell.anchor{border-color:#ffbb5585;box-shadow:inset 0 0 0 1px #ffbb5547}.number-cell.left,.number-cell.window{border-color:#58d2ff6b}.number-cell.right{border-color:#ff6c8a6b}.number-cell.mid{box-shadow:0 0 0 1px #9583ff70,0 0 20px #9583ff1f}.number-cell.current-range{background:#58d2ff1f}.number-cell.best-range{box-shadow:inset 0 0 0 1px #42dfaa80}.triplet-panel{margin-top:16px;padding-top:14px;border-top:1px solid var(--line)}.step-rail{display:grid;gap:8px;max-height:320px;overflow:auto;padding-right:4px}.step-pill{border:1px solid var(--line);border-radius:14px;background:#06111bcc;color:var(--text-main);display:grid;gap:3px;text-align:left;padding:10px 12px}.step-pill.active{border-color:#58d2ff85;background:#123046eb}.step-pill span{font-size:.9rem}.state-table{display:grid;gap:8px}.state-row{display:grid;gap:5px;padding:10px 12px;border-radius:14px;border:1px solid var(--line);background:#06111bcc}.state-row span{font-size:.76rem;color:var(--text-muted);text-transform:uppercase;letter-spacing:.08em}.state-row strong{font-size:.94rem;line-height:1.4}.code-panel{display:grid;gap:6px}.code-line{display:grid;grid-template-columns:36px minmax(0,1fr);gap:10px;align-items:start;padding:9px 10px;border-radius:14px;border:1px solid transparent;background:#06111b9e}.code-line span,.code-line code{font-family:IBM Plex Mono,monospace}.code-line span{color:var(--text-muted);font-size:.78rem}.code-line code{color:var(--text-main);font-size:.84rem;white-space:pre-wrap}.code-line.active{border-color:#ffbb557a;background:#ffbb551f;box-shadow:inset 0 0 0 1px #ffbb552e}@media(max-width:1120px){.workspace,.hero-card,.panel-grid.two-up,.panel-grid.three-up-grid,.input-grid,.input-grid.compact-grid,.context-banner{grid-template-columns:1fr}.context-banner{align-items:start}}@media(max-width:760px){.app-shell{padding:12px}.metric-grid.three-up,.number-strip{grid-template-columns:repeat(2,minmax(0,1fr))}.problem-header-card{flex-direction:column}}