:root{--bg: #14161a;--panel: #1d2026;--panel-2: #23262d;--line: #2e323a;--text: #d6d9de;--muted: #8a8f99;--accent: #4dabf7;--skim: #ff9f43;--normal: #4dabf7;--deep: #b197fc;--main-poi: #ffd43b;--minor-poi: #38d9a9;--entrance: #51cf66;--exit: #ff6b6b}*{box-sizing:border-box}html,body{margin:0;height:100%;background:var(--bg);color:var(--text);font:13px/1.45 ui-sans-serif,system-ui,Helvetica Neue,sans-serif;overflow:hidden}body{display:flex;flex-direction:column}#toolbar{display:flex;align-items:center;gap:18px;padding:8px 14px;background:var(--panel);border-bottom:1px solid var(--line);flex:0 0 auto;-webkit-user-select:none;user-select:none}.brand{font-weight:700;letter-spacing:.04em;font-size:15px}.brand span{color:var(--accent);font-weight:400}.tool-group{display:flex;align-items:center;gap:6px}button{background:var(--panel-2);color:var(--text);border:1px solid var(--line);border-radius:6px;padding:5px 10px;cursor:pointer;font:inherit}button:hover{border-color:var(--muted)}button.active{background:var(--accent);color:#0b0d10;border-color:var(--accent)}button.danger{color:var(--exit)}button.danger:hover{border-color:var(--exit)}.toggles label{color:var(--muted);margin-left:8px;cursor:pointer}.speed-label{color:var(--muted);display:flex;align-items:center;gap:6px}.speed-label input{width:90px}#sim-speed-val{min-width:26px;color:var(--text)}main{flex:1;display:flex;min-height:0}#canvas-wrap{flex:1;position:relative;min-width:0}#canvas{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;display:block;cursor:crosshair}#hint{position:absolute;left:10px;bottom:10px;background:#14161acc;border:1px solid var(--line);border-radius:6px;padding:4px 10px;color:var(--muted);pointer-events:none;max-width:70%}#hint:empty{display:none}#sidebar{flex:0 0 250px;overflow-y:auto;background:var(--panel);border-left:1px solid var(--line);padding:12px 14px 30px}#sidebar section{margin-bottom:18px}#sidebar h2{font-size:11px;text-transform:uppercase;letter-spacing:.1em;color:var(--muted);margin:0 0 8px}.row{display:block;margin-bottom:10px}.row input[type=range]{width:100%;margin-top:3px}.row small{color:var(--muted);display:block}.row .val{float:right;color:var(--muted)}.note{color:var(--muted);display:block;margin-top:2px}.mix.skim{border-left:3px solid var(--skim);padding-left:8px}.mix.normal{border-left:3px solid var(--normal);padding-left:8px}.mix.deep{border-left:3px solid var(--deep);padding-left:8px}.btn-row{display:flex;gap:6px;margin-bottom:6px}.btn-row button{flex:1}.stats{display:grid;grid-template-columns:1fr auto;gap:2px 10px}.stats .k{color:var(--muted)}.stats .v{text-align:right;font-variant-numeric:tabular-nums}.legend div{margin-bottom:5px;color:var(--muted)}.dot{display:inline-block;width:9px;height:9px;border-radius:50%;margin-right:5px;vertical-align:-1px}.dot.skim{background:var(--skim)}.dot.normal{background:var(--normal)}.dot.deep{background:var(--deep)}.dot.main-poi{background:var(--main-poi)}.dot.minor-poi{background:var(--minor-poi)}.dot.entrance{background:var(--entrance)}.dot.exit{background:var(--exit)}.hidden{display:none!important}