:root{color-scheme:dark;font-family:IBM Plex Sans,Segoe UI,sans-serif;--bg: #1f1b16;--bg-elevated: #26211b;--bg-soft: #312920;--surface: #2b241d;--surface-hover: #352c24;--surface-muted: #221c16;--border: #41362b;--text: #f0e4cf;--text-muted: #b9aa92;--accent: #e2b86b;--accent-soft: rgba(226, 184, 107, .15);--success: #9ccf89;--danger: #ef9f85;--shadow: 0 22px 46px rgba(0, 0, 0, .22)}:root[data-theme=light]{color-scheme:light;--bg: #f3efe6;--bg-elevated: #fffaf1;--bg-soft: #ece4d5;--surface: #fffaf1;--surface-hover: #f7efdf;--surface-muted: #f0e8db;--border: #ddd1bf;--text: #352a21;--text-muted: #7f6f60;--accent: #b8812d;--accent-soft: rgba(184, 129, 45, .12);--success: #56824b;--danger: #b86357;--shadow: 0 18px 40px rgba(53, 42, 33, .08)}*{box-sizing:border-box}html,body{margin:0;min-height:100vh;background:var(--bg);color:var(--text)}a{color:inherit;text-decoration:none}button,input,textarea{font:inherit}.app-shell{min-height:100vh;background:radial-gradient(circle at top center,rgba(226,184,107,.14),transparent 28%),linear-gradient(180deg,rgba(255,255,255,.02),transparent 120px),var(--bg)}.topbar{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:20px 32px;position:sticky;top:0;background:color-mix(in srgb,var(--bg) 82%,transparent);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);border-bottom:1px solid var(--border);z-index:10}.brand-wrap{display:flex;flex-direction:column;gap:2px}.brand{font-size:1.12rem;font-weight:700;letter-spacing:.08em;text-transform:lowercase}.brand-subtitle{font-size:.76rem;color:var(--text-muted);text-transform:uppercase;letter-spacing:.08em}.topbar-nav{display:flex;align-items:center;gap:12px}.segmented-control{display:inline-flex;padding:3px;border-radius:999px;background:var(--surface-muted);border:1px solid var(--border)}.segment{border:0;background:transparent;color:var(--text-muted);border-radius:999px;padding:6px 10px;cursor:pointer}.segment.active{background:var(--accent-soft);color:var(--accent)}.nav-link{color:var(--text-muted)}.nav-link:hover{color:var(--text)}.page{padding:32px}.hero{padding:34px;border-radius:24px;background:radial-gradient(circle at top left,rgba(226,184,107,.12),transparent 30%),linear-gradient(180deg,var(--bg-elevated),var(--surface));border:1px solid var(--border);box-shadow:var(--shadow)}.hero h1,.panel h1,.card h2{margin:0 0 12px}.hero-text,.card p,.panel p{line-height:1.55}.eyebrow{margin:0 0 10px;text-transform:uppercase;letter-spacing:.08em;font-size:.76rem;color:var(--accent)}.card-grid,.algorithm-layout{display:grid;gap:20px;margin-top:24px}.card-grid{grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}.algorithm-layout{grid-template-columns:minmax(0,1.5fr) minmax(320px,1fr);align-items:start}.card,.panel,.comment{background:var(--surface);border:1px solid var(--border);border-radius:22px;padding:20px;box-shadow:var(--shadow)}.card{display:flex;flex-direction:column;gap:14px;min-height:100%;transition:border-color .14s ease,transform .14s ease,background .14s ease}.card:hover{transform:translateY(-2px);border-color:color-mix(in srgb,var(--accent) 35%,var(--border));background:var(--surface-hover)}.chip{align-self:flex-start;padding:7px 11px;background:var(--accent-soft);color:var(--accent);border-radius:999px;font-size:.76rem;text-transform:lowercase}.metrics{display:flex;flex-wrap:wrap;gap:10px;color:var(--text-muted);font-size:.94rem}.metrics-column{flex-direction:column}.primary-link,.primary-button,.ghost-button,.tab{border:1px solid var(--border);border-radius:999px;padding:10px 14px;cursor:pointer;transition:background .14s ease,border-color .14s ease,color .14s ease}.primary-link,.primary-button{background:var(--accent);border-color:var(--accent);color:#1f1b16}.primary-link{margin-top:auto;align-self:flex-start}.ghost-button,.tab{background:var(--surface-muted);color:var(--text)}.ghost-button:hover,.tab:hover{background:var(--surface-hover)}.tab.active{background:var(--accent-soft);color:var(--accent);border-color:color-mix(in srgb,var(--accent) 45%,var(--border))}.stack{display:flex;flex-direction:column;gap:16px}label{display:flex;flex-direction:column;gap:8px}input,textarea{width:100%;border-radius:10px;border:1px solid var(--border);padding:12px 14px;background:var(--bg-soft);color:var(--text)}input::placeholder,textarea::placeholder{color:var(--text-muted)}input:focus,textarea:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}.control-block{display:grid;gap:12px}.button-row{display:flex;flex-wrap:wrap;gap:10px}.danger-button{color:var(--danger)}.token-section{display:grid;gap:16px}.token-list{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}.token{padding:7px 10px;border-radius:999px;background:var(--surface-muted);border:1px solid var(--border);font-size:.9rem}.token-insert{color:var(--success)}.token-delete{color:var(--danger)}.hint-text{color:var(--text-muted)}.bars-wrap{overflow-x:auto;padding-bottom:4px}.bars{display:flex;align-items:end;gap:10px;min-height:260px;max-height:260px;padding-top:12px}.bar{flex:1 0 56px;border-radius:10px 10px 6px 6px;background:linear-gradient(180deg,#4c89ff,#2857ac);display:flex;align-items:end;justify-content:center;padding-bottom:10px;color:#fff;transition:transform .16s ease,opacity .16s ease}.bar.active{transform:translateY(-6px);background:linear-gradient(180deg,#7eaaff,#4c89ff)}.bar.dimmed{opacity:.22}.step-header,.comment-head,.comment-actions,.tab-row{display:flex;justify-content:space-between;gap:12px;align-items:center}.step-actions,.comment-actions,.reply-form{display:flex;gap:10px}.step-actions,.comment-actions{flex-wrap:wrap}.step-controls{position:sticky;bottom:12px}.reply-form{margin-top:12px;flex-direction:column}.comment-children{margin-top:16px;padding-left:16px;border-left:2px solid var(--border);display:flex;flex-direction:column;gap:16px}.comment{background:linear-gradient(180deg,color-mix(in srgb,var(--surface) 92%,white 8%),var(--surface))}.comment-icon-button{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-width:34px;height:34px;padding:0 10px;border-radius:999px;border:1px solid var(--border);background:var(--surface-muted);color:var(--text-muted);cursor:pointer;transition:transform .14s ease,background .14s ease,color .14s ease}.comment-icon-button:hover{transform:translateY(-1px);background:var(--surface-hover);color:var(--text)}.comment-icon-button span[aria-hidden=true]{font-size:.92rem;line-height:1}.tree-panel{overflow-x:auto}.tree-diagram-wrap{display:flex;justify-content:center;min-width:fit-content}.tree-diagram{display:block;width:auto;min-width:0;max-width:none;height:auto}.tree-edge{stroke:color-mix(in srgb,var(--accent) 45%,var(--border));stroke-width:2.5;stroke-linecap:round}.tree-node-circle{fill:var(--accent);stroke:color-mix(in srgb,var(--accent) 65%,white 10%);stroke-width:2}.tree-node-label{fill:#1f1b16;font-size:15px;font-weight:700}.success{color:var(--success)}.error,.error-text{color:var(--danger)}@media(max-width:980px){.algorithm-layout{grid-template-columns:1fr}}@media(max-width:640px){.topbar,.page{padding:18px}.topbar,.topbar-nav,.step-header,.comment-head,.comment-actions,.button-row{flex-direction:column;align-items:stretch}.step-actions{flex-direction:column}.bars{gap:6px}.bar span{font-size:.8rem}}