:root{--font-body:"Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;--font-title:"Palatino Linotype", "Book Antiqua", "STKaiti", serif;--bg:#f8f2e7;--bg-deep:#f1e4cf;--panel:#ffffffd6;--border:#63462d38;--text:#4a3929;--title:#2f2014;--accent:#9a4d1b;--accent-hover:#7f3f13;--soft:#9a4d1b14;--shadow:0 14px 30px #46260c21;font-family:var(--font-body);color:var(--text);background:var(--bg);text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased}*{box-sizing:border-box}body{background:radial-gradient(circle at 8% 12%, #f7d2a38c, transparent 34%), radial-gradient(circle at 92% 24%, #e8bf877a, transparent 30%), linear-gradient(135deg, var(--bg), var(--bg-deep));min-height:100vh;margin:0}#root{min-height:100vh}h1,h2,h3,p{margin:0}a{color:inherit}.shell{width:min(1120px,100% - 2rem);margin:0 auto;padding:3rem 0 4rem;animation:.42s rise-in}.shell-compact{width:min(980px,100% - 2rem)}.hero{border:1px solid var(--border);background:var(--panel);box-shadow:var(--shadow);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-radius:22px;gap:1rem;margin-bottom:2rem;padding:2.4rem;display:grid}.eyebrow{letter-spacing:.08em;text-transform:uppercase;color:var(--accent);font-size:.9rem}.hero h1{font-family:var(--font-title);color:var(--title);font-size:clamp(2rem,3.8vw,3.2rem);line-height:1.08}.subtitle{max-width:70ch;line-height:1.7}.back-home,.outline-link,.algo-entry-card{cursor:pointer;border:1px solid #0000;border-radius:999px;justify-content:center;align-items:center;padding:.62rem 1.1rem;font-family:inherit;font-size:.95rem;font-weight:600;text-decoration:none;transition:transform .18s,background-color .18s,color .18s;display:inline-flex}.back-home{background:var(--accent);color:#fff;width:fit-content}.back-home:hover{background:var(--accent-hover);transform:translateY(-1px)}.outline-link{border-color:var(--border);color:var(--title);background:#fff}.outline-link:hover{background:#fdf8ef;transform:translateY(-1px)}.section-board{gap:1rem;display:grid}.section-card{border:1px solid var(--border);background:var(--panel);box-shadow:var(--shadow);border-radius:18px;gap:.9rem;padding:1.25rem;display:grid}.section-card h2,.step-info strong{color:var(--title);font-size:1.28rem}.section-card p{line-height:1.6}.algo-entry-list{gap:.55rem;margin:0;padding:0;list-style:none;display:grid}.algo-entry{background:#fff;border:1px solid #63462d33;border-radius:12px;justify-content:space-between;align-items:center;gap:.75rem;padding:.42rem;display:flex}.algo-entry-card{width:100%;color:var(--accent);background:#9a4d1b1f;justify-content:space-between}.algo-entry-card:hover{background:#9a4d1b33;transform:translateY(-1px)}.algo-entry-disabled-card{opacity:.7;pointer-events:none}.algo-entry-title{color:var(--title)}.algo-entry-disabled{color:#4a3929cc;background:#9a4d1b14;border-radius:999px;padding:.62rem 1.1rem}.algo-badge{white-space:nowrap;border-radius:999px;padding:.25rem .6rem;font-size:.8rem}.algo-badge.is-ready{color:#2f7a39;background:#3b8a4426}.algo-badge.is-soon{color:var(--accent);background:#9a4d1b1f}.visualizer-topbar{gap:.75rem;margin-bottom:1rem}.visualizer-topbar h1{font-size:clamp(1.6rem,3vw,2.2rem)}.visualizer-panel{border:1px solid var(--border);background:var(--panel);box-shadow:var(--shadow);border-radius:22px;gap:1rem;padding:1.1rem;display:grid}.actions{flex-wrap:wrap;gap:.7rem;display:flex}.controls{flex-wrap:wrap;gap:.55rem;display:flex}.sliders{grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:.7rem;display:grid}.slider-field{gap:.3rem;font-size:.95rem;display:grid}.slider-title{color:var(--title);font-weight:600}.slider-hint{color:#4a3929bd;min-height:1.15rem;font-size:.84rem}.sliders input[type=range]{width:100%}.search-config{grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:.75rem;display:grid}.input-field{gap:.4rem;display:grid}.input-field textarea,.input-field input[type=number]{color:var(--title);background:#fff;border:1px solid #63462d47;border-radius:10px;padding:.5rem .65rem;font-family:inherit;font-size:.95rem}.search-array-wrap{background:linear-gradient(#ffffffb8,#fffffff2);border:1px dashed #63462d5c;border-radius:14px;grid-template-columns:repeat(auto-fit,minmax(58px,1fr));gap:.45rem;width:min(100%,940px);min-height:120px;margin-inline:auto;padding:.75rem;display:grid}.search-cell{background:#fff;border:1px solid #63462d2e;border-radius:9px;place-items:center;gap:.2rem;padding:.35rem;display:grid}.search-cell span{color:var(--title);font-weight:600}.search-cell small{color:#4a3929b3;font-size:.72rem}.search-cell.in-range{background:#6ea0db24}.search-cell.is-active{background:#f08d5429}.search-cell.is-found{background:#7dc88c38;border-color:#3e8c4a73}.tree-controls{grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:.8rem;display:grid}.tree-speed-field{max-width:340px}.tree-input-block{gap:.45rem;display:grid}.tree-input-block input{color:var(--title);background:#fff;border:1px solid #63462d47;border-radius:10px;padding:.52rem .65rem;font-family:inherit;font-size:.95rem}.tree-message{color:var(--title);background:#9a4d1b1f;border-radius:10px;padding:.55rem .7rem;font-size:.92rem}.tree-canvas{background:linear-gradient(#ffffffb8,#fffffff2);border:1px dashed #63462d5c;border-radius:14px;width:min(100%,940px);margin-inline:auto;position:relative;overflow:hidden}.tree-edge-layer{width:100%;height:100%;position:absolute;inset:0}.tree-edge{stroke:#63462d75;stroke-width:2.1px}.tree-node{width:46px;height:46px;color:var(--title);transition:left var(--tree-move-duration,.24s) linear var(--tree-move-delay,0s), top var(--tree-move-duration,.24s) linear var(--tree-move-delay,0s), transform calc(var(--tree-move-duration,.24s) - 20ms) ease var(--tree-move-delay,0s), opacity calc(var(--tree-move-duration,.24s) - 20ms) ease var(--tree-move-delay,0s), background-color .16s ease, border-color .16s ease;background:#fff;border:1px solid #63462d42;border-radius:999px;place-items:center;font-weight:700;display:grid;position:absolute;transform:translate(-50%,-50%)scale(1)}.tree-node-enter,.tree-node-exit{opacity:0;transform:translate(-50%,-50%)scale(.55)}.tree-node-search-visited{background:#6ea0db24;border-color:#23599773}.tree-node-search-current{background:#f08d5433;border-color:#cb55208c}.tree-node-search-found{background:#7dc88c47;border-color:#3e8c4aa6}.tree-node-unbalanced{background:#f08d5433;border-color:#cb552094}.tree-node-rb-red{color:#fff;background:#d94545;border-color:#8c2020}.tree-node-rb-black{color:#fff;background:#2e2e2e;border-color:#111}.tree-empty{color:#4a3929b3;place-items:center;font-size:.95rem;display:grid;position:absolute;inset:0}.step-info{gap:.25rem;display:grid}.bars-wrap{background:linear-gradient(#ffffffb8,#fffffff2);border:1px dashed #63462d5c;border-radius:14px;justify-content:center;align-items:end;gap:clamp(1px,.35vw,5px);width:min(100%,940px);min-height:360px;margin-inline:auto;padding:.7rem;display:flex;overflow:hidden}.bar-col{will-change:transform;flex:1 1 0;place-items:end center;gap:.25rem;min-width:0;display:grid}.bar-col span{color:#4a3929c7;font-size:.72rem}.bar{background:linear-gradient(#cf9969,#9a4d1b);border-radius:8px 8px 4px 4px;width:100%;transition:height .12s linear,background-color .12s linear}.bar.is-active{background:linear-gradient(#f08d54,#cb5520)}.bar.is-pivot{background:linear-gradient(#6ea0db,#235997)}.bar.is-sorted{background:linear-gradient(#7dc88c,#3e8c4a)}@keyframes rise-in{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@media (width<=720px){.shell{width:min(1120px,100% - 1rem);padding-top:1rem}.hero,.visualizer-panel{padding:1.2rem}.algo-entry{flex-direction:column;align-items:start;gap:.3rem}.bar-col{min-width:0}.bar-col span{font-size:.62rem}}