@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=Manrope:wght@400;500;600;700;800&display=swap');
:root{font-family:Manrope,Arial,sans-serif;color:#eaf1ee;background:#0c131c;font-synthesis:none}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 25% 0,#182b38,#0c131c 65%);min-height:100vh}button,input{font:inherit}button{cursor:pointer}button:disabled{opacity:.35;cursor:not-allowed}button:focus-visible,input:focus-visible{outline:2px solid #87f4d2;outline-offset:3px}.topbar{height:72px;border-bottom:1px solid #23323e;background:#101923dc;display:flex;align-items:center;justify-content:space-between;padding:0 max(24px,calc((100vw - 1500px)/2))}.brand{display:flex;align-items:center;gap:12px}.logo{color:#98f2ce;font-size:32px}.brand small,.eyebrow,.scene-head,.footer,.tiny-label{display:block;font:10px 'DM Mono',monospace;letter-spacing:1.6px;color:#7d96a2}.brand b{display:block;font-size:18px;letter-spacing:1px}.brand em{font-style:normal;color:#91f0cc}.top-right{display:flex;align-items:center;gap:12px;font:11px 'DM Mono',monospace;color:#8ea5ad}.dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:#91f0cc;box-shadow:0 0 12px #6df1be}.round-btn{border:1px solid #36505a;border-radius:100%;width:30px;height:30px;background:transparent;color:#bcd1cb}.shell{max-width:1500px;padding:36px 25px 24px;margin:auto}.intro{display:flex;align-items:center;justify-content:space-between;margin-bottom:24px}.eyebrow{color:#88e4c4}.eyebrow span{margin-left:10px;color:#68848b}.intro h1{font-size:clamp(30px,3vw,46px);line-height:1.2;margin:10px 0 8px;letter-spacing:-2px}.intro p{color:#9eb1b8;line-height:1.7;margin:0;font-size:13px}.round-dots{display:flex;gap:7px}.round-dots i{display:block;height:5px;width:26px;border-radius:5px;background:#273946}.round-dots i.on{background:#91f0cc}.main-grid{display:grid;grid-template-columns:minmax(0,1fr) 366px;gap:19px;align-items:start}.scene-col,.sidebar{min-width:0}.scene-frame,.info-panel,.routes-panel,.timeline-panel{border:1px solid #293a44;border-radius:12px;background:#121e29;overflow:hidden}.scene-head,.scene-footer{height:43px;padding:0 17px;display:flex;align-items:center;justify-content:space-between}.scene-head{border-bottom:1px solid #273943}.scene-head span:last-child{color:#71929e;font-size:10px}.scene-head strong{color:#adc3ca;margin-left:6px}.scene-head .dot{margin-right:8px}.canvas-wrap{position:relative;aspect-ratio:1.48;background:#152831;overflow:hidden}.canvas-wrap canvas{width:100%;height:100%;display:block;touch-action:manipulation;cursor:crosshair}.timer{position:absolute;top:15px;left:16px;display:flex;flex-direction:column;gap:3px;pointer-events:none;background:#0d1b24bd;border:1px solid #314651;border-radius:7px;padding:8px 11px}.timer span{font:9px 'DM Mono',monospace;color:#6b929e}.timer b{font:19px 'DM Mono',monospace;color:#e7faf1}.scene-footer{border-top:1px solid #273943}.legend{display:flex;gap:14px;font-size:11px;color:#8fa9b2}.legend span:first-child{color:#87dbc4}.legend span:nth-child(2){color:#e2a782}.text-button{border:none;background:transparent;color:#a7c2c7;font-size:11px}.objective{display:flex;align-items:center;gap:15px;margin-top:15px;background:#15242c;border:1px solid #2e444c;border-radius:10px;padding:17px}.objective-icon{border:1px solid #477469;color:#a5f3db;border-radius:8px;padding:11px;font-size:21px}.objective div{flex:1}.objective small{display:block;font:9px 'DM Mono',monospace;letter-spacing:1.3px;color:#7fb0ab;margin-bottom:7px}.objective strong{font-size:12px;line-height:1.6}.mission-badge{font-size:10px;border:1px solid #42616a;border-radius:15px;padding:6px 8px;color:#85b6b7;white-space:nowrap}.bottom-note{color:#718995;font-size:11px;line-height:1.6;padding:2px 3px}.sidebar{display:flex;flex-direction:column;gap:12px}.info-panel,.routes-panel,.timeline-panel{padding:19px}.panel-head,.section-head,.range-head,.moves-row{display:flex;align-items:center;justify-content:space-between}.panel-head small{color:#77a99f;font:9px 'DM Mono',monospace;letter-spacing:1.2px}.panel-head h2{font-size:20px;margin:7px 0}.panel-head>span{color:#9be4c8;border:1px solid #36594e;border-radius:4px;padding:4px 6px;font:9px 'DM Mono',monospace}.panel-help{font-size:11px;color:#839ca6;margin:5px 0 16px}.selections{display:grid;grid-template-columns:1fr 21px 1fr;gap:6px;align-items:center}.selections>div{background:#1b2c37;border:1px solid #334956;border-radius:7px;padding:11px;min-height:64px}.selections small{display:block;font-size:10px;color:#8fa7b2;margin-bottom:7px}.selections strong{font-size:11px}.selections>span{text-align:center;color:#9fe0c9}.range-head{margin-top:23px;font-size:12px}.range-head strong{font:20px 'DM Mono',monospace;color:#9cf4d3}input[type=range]{width:100%;accent-color:#8ee9c8;margin:16px 0 3px}.range-ticks{display:flex;justify-content:space-between;color:#637f8b;font:10px 'DM Mono',monospace}.transfer-btn,.execute-btn,.primary-action{border:0;background:#9cefcf;color:#0e2422;border-radius:7px;font-weight:800}.transfer-btn{height:44px;width:100%;margin-top:18px;display:flex;align-items:center;justify-content:center;gap:12px;font-size:13px}.transfer-btn:hover,.execute-btn:hover,.primary-action:hover{background:#b8ffdd}.feedback{font-size:10px;min-height:30px;display:flex;align-items:center;color:#85b6b6}.feedback.error{color:#efa78d}.moves-row{border-top:1px solid #293e47;padding-top:13px;font-size:11px;color:#9db1b6}#movePips{display:flex;gap:5px}#movePips i{width:21px;height:7px;border-radius:5px;background:#9cefcf}#movePips i.used{background:#30414b}.section-head{margin-bottom:12px}.section-head h3{font-size:13px;margin:0}.section-head span{color:#75919e;font:9px 'DM Mono',monospace}.route-list{display:flex;flex-direction:column;gap:7px}.route-card{border:1px solid #2b424b;background:#172630;border-radius:8px;padding:10px 11px}.route-card:hover{background:#1e323d}.route-main{display:flex;align-items:center;gap:8px}.route-id{display:grid;place-items:center;width:28px;height:28px;border:1px solid currentColor;border-radius:6px;font:12px 'DM Mono',monospace}.route-text{min-width:0;flex:1}.route-text b{display:block;font-size:11px}.route-text small{font-size:10px;color:#7d9aa5}.route-distance{text-align:right;font:13px 'DM Mono',monospace}.route-distance small{font:9px 'DM Mono',monospace;display:block;color:#8ca5ab;margin-top:5px}.route-actions{display:flex;gap:5px;margin-top:10px}.route-actions button{flex:1;border:1px solid #314a54;border-radius:4px;padding:5px 0;background:#20313c;color:#b2c4c9;font-size:11px}.route-actions button.active{background:#285b50;color:#b0ffda;border-color:#64ae93}.route-actions button.to.active{background:#554837;color:#ffe1ab;border-color:#af8651}.route-tip{font-size:10px;line-height:1.6;color:#758e9c;margin:12px 0 0}.execute-btn{display:flex;align-items:center;text-align:left;padding:15px 20px;gap:14px;width:100%;font-size:15px}.execute-icon{display:grid;place-items:center;background:#214a3e;color:#a8f7d6;width:38px;height:38px;border-radius:6px;font-size:13px}.execute-btn small{display:block;font-size:10px;font-weight:500;margin-top:5px;color:#476d62}.execute-right{margin-left:auto;font-size:21px}.log-list{display:flex;flex-direction:column;gap:8px;max-height:125px;overflow:auto}.log-item{border-left:2px solid #506f76;padding:3px 9px;font-size:11px;color:#9bb1b9;line-height:1.5}.log-item.good{border-color:#8ce9ca}.log-item.bad{border-color:#e6a179}.log-item b{color:#d2e4e8;margin-right:7px;font:10px 'DM Mono',monospace}.footer{display:flex;justify-content:space-between;padding:25px 0}.modal-backdrop{position:fixed;inset:0;display:grid;place-items:center;background:#060d15d9;z-index:5;padding:20px;backdrop-filter:blur(10px)}.hidden{display:none!important}.result-card,.help-card{width:min(450px,100%);border:1px solid #46675f;border-radius:15px;background:linear-gradient(#21352f,#11222a);padding:30px;box-shadow:0 30px 120px #0008}.result-symbol{font-size:34px;color:#9beccc}.result-kicker{font:10px 'DM Mono',monospace;letter-spacing:2px;color:#98e8ca;margin:12px 0}.result-card h2,.help-card h2{font-size:27px;letter-spacing:-1px;margin:10px 0}.result-card p,.help-card p{color:#9fb6b8;font-size:13px;line-height:1.8}.result-stats{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid #47605a;border-bottom:1px solid #47605a;margin:25px 0;padding:19px 0;gap:9px}.result-stats small{display:block;font-size:10px;color:#91a9a7}.result-stats strong{display:block;margin-top:7px;font:16px 'DM Mono',monospace}.result-actions{display:flex;gap:8px}.result-actions button{flex:1;padding:14px 8px;font-size:12px}.secondary-action{border:1px solid #45645c;border-radius:7px;background:transparent;color:#ccdedb}.modal-close{float:right;border:0;background:transparent;color:#cfe1dc;font-size:28px}.help-card>small{color:#98e8ca;font:10px 'DM Mono',monospace}.help-play{padding:13px 25px;width:100%;margin-top:13px}@media(max-width:900px){.main-grid{grid-template-columns:1fr}.sidebar{display:grid;grid-template-columns:1fr 1fr}.info-panel{grid-row:span 2}.execute-btn,.timeline-panel{grid-column:1/-1}.shell{padding:25px 16px}}@media(max-width:570px){.topbar{height:60px;padding:0 14px}.brand small{font-size:8px}.brand b{font-size:14px}.top-right{font-size:0}.intro{align-items:flex-start}.intro h1{font-size:28px}.intro p{font-size:12px}.main-grid,.sidebar{display:flex;flex-direction:column}.sidebar>*{width:100%}.canvas-wrap{aspect-ratio:1.15}.scene-head{font-size:9px;padding:0 10px}.scene-head span:last-child{font-size:9px}.scene-footer{padding:0 9px}.legend{gap:8px;font-size:9px}.objective{padding:12px;gap:10px}.objective strong{font-size:11px}.mission-badge{font-size:9px}.round-dots{margin-top:10px}.round-dots i{width:13px}.footer{gap:12px;line-height:1.7}.footer span:last-child{text-align:right}}@media(max-width:900px){.main-grid{align-items:stretch}.sidebar,.scene-col{width:100%}}@media(max-width:570px){.main-grid{align-items:stretch}.sidebar,.scene-col{width:100%;min-width:0}.objective{align-items:center}.objective strong{overflow-wrap:anywhere}}