:root{font-family:Avenir Next,Hiragino Sans,sans-serif;color:#14323f;background:radial-gradient(circle at top left,rgba(243,167,18,.28),transparent 28%),linear-gradient(135deg,#f6f2e8,#efe3c7 45%,#dce7e4);line-height:1.5;font-weight:400;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;--paper: rgba(255, 252, 245, .85);--ink: #14323f;--muted: #4d6870;--accent: #d96c23;--accent-soft: #f0c47d;--active: #187972;--sorted: #227f4c;--border: rgba(20, 50, 63, .12);--shadow: 0 24px 60px rgba(20, 50, 63, .14)}*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh}button,select,input{font:inherit}#root{min-height:100vh}.shell{display:grid;grid-template-columns:minmax(280px,360px) 1fr;min-height:100vh}.sidebar,.stage{padding:32px}.sidebar{border-right:1px solid var(--border);background:#fff8eebd;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px)}.eyebrow{margin:0 0 12px;color:var(--accent);font-size:.78rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase}h1,h2,.status-message{font-family:Iowan Old Style,Times New Roman,serif}h1{margin:0;font-size:clamp(2.4rem,3vw,3.6rem);line-height:.95}h2{margin:0 0 8px;font-size:clamp(2rem,2.8vw,3rem)}.lead{margin:20px 0 0;max-width:26rem;color:var(--muted)}.algorithm-list{display:grid;gap:16px;margin-top:32px}.algorithm-card{border:1px solid var(--border);border-radius:20px;background:var(--paper);box-shadow:var(--shadow);color:var(--ink);display:grid;gap:8px;padding:18px;text-align:left;transition:transform .18s ease,border-color .18s ease,background .18s ease}.algorithm-card span{font-weight:700}.algorithm-card small{color:var(--muted)}.algorithm-card:hover,.algorithm-card:focus-visible,.algorithm-card.active{border-color:#d96c2380;background:#fff8eefa;transform:translateY(-2px)}.stage{display:grid;gap:24px}.hero,.visualizer{border:1px solid var(--border);border-radius:28px;background:var(--paper);box-shadow:var(--shadow);padding:28px;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px)}.hero{display:flex;gap:24px;justify-content:space-between;align-items:flex-start}.hero p{margin:0;max-width:42rem;color:var(--muted)}.target-chip{display:inline-flex;margin-top:16px;border:1px solid rgba(217,108,35,.24);border-radius:999px;background:#d96c2314;color:var(--accent);font-size:.95rem;font-weight:700;padding:8px 14px}.controls{display:flex;flex-wrap:wrap;gap:12px;justify-content:flex-end}.controls button,.controls select{border:1px solid transparent;border-radius:999px;background:#173c48;color:#f8f5ef;min-height:44px;padding:0 18px}.controls label{display:flex;gap:10px;align-items:center;border-radius:999px;background:#173c4814;padding:0 8px 0 16px}.visualizer{display:grid;gap:24px}.editor-panel{display:grid;gap:20px;border:1px solid var(--border);border-radius:28px;background:var(--paper);box-shadow:var(--shadow);padding:28px}.input-editor{margin:0;padding:0;border:0}.input-editor legend{padding:0;font-weight:700}.input-grid{display:grid;gap:12px;margin-top:16px}.input-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;align-items:end}.input-field,.target-editor{display:grid;gap:8px;color:var(--muted);font-size:.95rem;font-weight:700}.input-field input,.target-editor input{width:100%;min-height:44px;border:1px solid rgba(20,50,63,.18);border-radius:16px;background:#fffc;color:var(--ink);padding:0 14px}.editor-actions{display:flex;flex-wrap:wrap;gap:12px}.input-row-button{border:1px solid rgba(20,50,63,.12);border-radius:999px;background:#173c4814;color:var(--ink);min-height:44px;padding:0 18px}.input-row-button.primary{border-color:transparent;background:#173c48;color:#f8f5ef}.input-row-button.secondary{background:#d96c231a;color:var(--accent)}.input-row-button:disabled{opacity:.5}.editor-error{margin:0;color:#b53030;font-weight:700}.bars{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));align-items:end;gap:18px;min-height:420px}.search-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:16px;min-height:320px}.cells{display:grid;gap:14px;min-height:180px;align-items:stretch;width:100%;overflow-x:auto;padding-bottom:4px;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch}.bar-card{display:flex;flex-direction:column;justify-content:end;align-items:center;gap:10px;min-height:100%}.search-card{display:grid;align-content:center;justify-items:center;gap:12px;min-height:180px;padding:20px 16px;border:1px solid rgba(20,50,63,.12);border-radius:24px;background:linear-gradient(180deg,#ffffffd1,#e9dfc857),linear-gradient(135deg,#f0c47d42,#fff0);box-shadow:0 18px 34px #14323f14;transition:transform .22s ease,border-color .22s ease,box-shadow .22s ease,background .22s ease}.search-value{font-size:clamp(1.8rem,2.3vw,2.5rem);font-weight:700;color:var(--ink)}.search-index{color:var(--muted);font-size:.85rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase}.search-card.active{border-color:#18797285;box-shadow:0 22px 42px #1879722e;transform:translateY(-8px)}.search-card.matched{border-color:#148a4b70;background:linear-gradient(180deg,#bff1bff5,#e8fae9e6),linear-gradient(135deg,#148a4b14,#fff0);box-shadow:0 22px 42px #148a4b2e}.cell-card{display:grid;align-content:center;justify-items:center;gap:10px;min-height:150px;padding:18px 14px;border:1px solid rgba(20,50,63,.12);border-radius:22px;background:linear-gradient(180deg,#ffffffdb,#e9dfc857),linear-gradient(135deg,#1879721f,#fff0);box-shadow:0 18px 34px #14323f14;transition:transform .22s ease,border-color .22s ease,box-shadow .22s ease,background .22s ease}.cell-index{color:var(--muted);font-size:.8rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase}.cell-value{font-size:clamp(1.8rem,2.4vw,2.8rem);font-weight:700;color:var(--ink)}.cell-card.active{border-color:#18797285;box-shadow:0 22px 42px #1879722e;transform:translateY(-6px)}.cell-card.shifted{border-color:#d96c2370;background:linear-gradient(180deg,#fff3dffa,#ffffffe6),linear-gradient(135deg,#d96c231a,#fff0)}.cell-card.written{border-color:#148a4b70;background:linear-gradient(180deg,#e1f5e2fa,#ffffffeb),linear-gradient(135deg,#148a4b1a,#fff0);box-shadow:0 22px 42px #148a4b24}.cell-card.empty{border-style:dashed;color:var(--muted);background:#ffffff8f;box-shadow:none}.cell-card.empty .cell-value{color:var(--muted);font-size:1.2rem;letter-spacing:.08em;text-transform:uppercase}.bar-value{font-size:1rem;font-weight:700;color:var(--ink)}.bar-track{display:flex;align-items:end;width:100%;height:300px;padding:10px;border-radius:24px;background:linear-gradient(180deg,#ffffffb8,#e9dfc847),repeating-linear-gradient(to top,rgba(20,50,63,.08) 0,rgba(20,50,63,.08) 1px,transparent 1px,transparent 48px);border:1px solid rgba(20,50,63,.08)}.bar{width:100%;min-height:20px;border-radius:18px 18px 8px 8px;background:linear-gradient(180deg,#f0c47d,#d96c23);box-shadow:0 10px 20px #d96c232e;transition:height .28s ease,transform .28s ease,filter .28s ease}.bar-card.active .bar{background:linear-gradient(180deg,#8de0d8,#187972);transform:translateY(-10px)}.bar-card.sorted .bar{background:linear-gradient(180deg,#b8edc6,#227f4c)}.bar-card.matched .bar{background:linear-gradient(180deg,#bff1bf,#148a4b);box-shadow:0 14px 30px #148a4b3d;transform:translateY(-6px)}.bar-index{color:var(--muted);font-size:.8rem;font-weight:700;letter-spacing:.08em}.status-panel{border-top:1px solid var(--border);padding-top:20px}.status-label{margin:0 0 8px;color:var(--accent);font-size:.85rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase}.status-tag{display:inline-flex;margin:0 0 12px;border-radius:999px;background:#1879721a;color:var(--active);font-size:.8rem;font-weight:700;letter-spacing:.08em;padding:6px 10px;text-transform:uppercase}.status-complexity{display:inline-flex;margin:0 0 12px;border-radius:999px;background:#d96c231f;color:var(--accent);font-size:.8rem;font-weight:700;letter-spacing:.08em;padding:6px 10px;text-transform:uppercase}.status-message{margin:0;font-size:1.5rem}@media(max-width:960px){.shell{grid-template-columns:1fr}.sidebar{border-right:0;border-bottom:1px solid var(--border)}.hero{flex-direction:column}.controls{justify-content:flex-start}}@media(max-width:720px){.sidebar,.stage,.hero,.visualizer{padding:20px}.bars{gap:10px;min-height:320px}.search-cards{gap:12px;min-height:0;grid-template-columns:repeat(auto-fit,minmax(108px,1fr))}.cells{gap:10px}.bar-track{height:220px;padding:8px}.search-card{min-height:140px;padding:16px 12px}.bar-value{font-size:.9rem}.cell-card{min-height:120px;padding:14px 10px}.status-message{font-size:1.2rem}}.robot-pathfinding-container{max-width:720px;margin:0 auto;padding:28px;border:1px solid var(--border);border-radius:28px;background:var(--paper);box-shadow:var(--shadow);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px)}.robot-pathfinding-header{margin-bottom:20px}.robot-pathfinding-title{margin:0 0 8px;font-size:clamp(1.6rem,2.4vw,2.2rem)}.robot-pathfinding-description{margin:0 0 4px;color:var(--muted);font-size:.92rem}.robot-pathfinding-controls{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin-bottom:16px}.robot-pathfinding-controls button,.robot-pathfinding-controls select{border:1px solid transparent;border-radius:999px;background:#173c48;color:#f8f5ef;min-height:40px;padding:0 18px;cursor:pointer}.robot-pathfinding-controls label{display:flex;gap:8px;align-items:center;border-radius:999px;background:#173c4814;padding:0 8px 0 14px;color:var(--ink);font-size:.9rem;font-weight:700}.robot-pathfinding-status-bar{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin-bottom:16px}.robot-pathfinding-phase{display:inline-flex;border-radius:999px;background:#1879721a;color:var(--active);font-size:.8rem;font-weight:700;letter-spacing:.08em;padding:6px 12px;text-transform:uppercase}.robot-pathfinding-message{color:var(--muted);font-size:.92rem}.robot-pathfinding-step-counter{color:var(--accent);font-size:.85rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase}.robot-pathfinding-grid{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:3px;margin-bottom:16px;border:1px solid var(--border);border-radius:12px;padding:4px;background:#fff6}.robot-pathfinding-cell{aspect-ratio:1;display:flex;align-items:center;justify-content:center;border-radius:6px;font-size:clamp(.7rem,1.5vw,.95rem);font-weight:700;transition:background .18s ease,box-shadow .18s ease;position:relative}.robot-pathfinding-cell-empty{background:#ffffff80}.robot-pathfinding-cell-wall{background:#2d3436}.robot-pathfinding-cell-start{background:#b8edc6;border:1px solid rgba(34,127,76,.3)}.robot-pathfinding-cell-goal{background:#ffd6a5;border:1px solid rgba(217,108,35,.3)}.robot-pathfinding-cell-visited{background:#d5e8ed}.robot-pathfinding-cell-frontier{background:#a3d5e0;border:1px solid rgba(24,121,114,.3)}.robot-pathfinding-cell-current{background:var(--active);box-shadow:0 0 8px #18797266}.robot-pathfinding-cell-path{background:var(--accent-soft);border:1px solid rgba(217,108,35,.3)}.robot-pathfinding-cell-robot{background:var(--accent);box-shadow:0 0 8px #d96c2366}.robot-pathfinding-marker{position:relative;z-index:1;font-weight:800;color:var(--ink);pointer-events:none}.robot-pathfinding-cell-wall .robot-pathfinding-marker,.robot-pathfinding-cell-current .robot-pathfinding-marker,.robot-pathfinding-cell-robot .robot-pathfinding-marker{color:#f8f5ef}.robot-pathfinding-legend{display:flex;flex-wrap:wrap;gap:12px 16px;padding-top:12px;border-top:1px solid var(--border)}.robot-pathfinding-legend-item{display:flex;gap:6px;align-items:center;font-size:.82rem;color:var(--muted)}.robot-pathfinding-legend-swatch{display:inline-block;width:16px;height:16px;border-radius:4px;flex-shrink:0}@media(max-width:720px){.robot-pathfinding-container{padding:20px}.robot-pathfinding-grid{gap:2px}.robot-pathfinding-cell{font-size:.65rem}}