:root{--ink:#e9f1ff;--muted:#8191ac;--paper:#060a12;--panel:#101827;--line:rgba(129,161,207,.16);--cyan:#62e8ff;--mint:#62e8ff;--mint-strong:#39bdd6;--coral:#ffb267;--yellow:#ffcf86;--blue:#62e8ff;--shadow:0 24px 64px #0006;--mono:"SFMono-Regular",Consolas,"Liberation Mono",monospace}
*{box-sizing:border-box} [hidden]{display:none!important} html,body{min-height:100%;margin:0} body{background:radial-gradient(ellipse at 75% 0,#12203766,transparent 60%),var(--paper);color:var(--ink);font-family:Inter,"PingFang SC","Microsoft YaHei",system-ui,sans-serif;-webkit-font-smoothing:antialiased} button,a{-webkit-tap-highlight-color:transparent} button{font:inherit;cursor:pointer} button:focus-visible,a:focus-visible,canvas:focus-visible{outline:2px solid var(--cyan);outline-offset:5px} button{transition:background .2s,transform .2s,border-color .2s} button:hover{transform:translateY(-1px)} h1,h2,h3,p{margin-top:0} a{color:inherit;text-decoration:none} kbd{display:inline-flex;align-items:center;justify-content:center;min-width:22px;height:22px;margin:0 2px;padding:0 5px;border:1px solid #7895bf36;border-bottom-width:2px;border-radius:4px;color:#d2def0;background:#111c2b;font:11px var(--mono)}
.title-screen{position:relative;isolation:isolate;min-height:760px;height:100svh;overflow:hidden;background:#060b14;display:flex;flex-direction:column}.cover-art{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;z-index:-3}.cover-shade{position:absolute;inset:0;z-index:-2;background:linear-gradient(90deg,#040911b8,transparent 78%),linear-gradient(0deg,#050a12f5 0,transparent 34%,transparent 75%,#050a1270);pointer-events:none}.title-screen::after{content:"";position:absolute;inset:20px;border:1px solid #a8d8ff10;pointer-events:none;z-index:-1}.cover-nav{display:flex;align-items:center;justify-content:space-between;margin:0 5.8%;height:110px;border-bottom:1px solid #c3dfff20;gap:20px}.brand-lockup{display:flex;align-items:center;gap:12px;font-size:16px;font-weight:700;letter-spacing:.1em}.brand-mark{border:1px solid #62e8ff80;color:var(--cyan);font:25px var(--mono);display:grid;place-items:center;width:36px;height:40px;transform:skew(-8deg);background:#0f263d5e}.brand-en{padding-left:18px;border-left:1px solid #acc7eb33;margin-left:10px;font:10px var(--mono);letter-spacing:.15em;color:#95a7c1}.nav-edition{font:10px var(--mono);letter-spacing:.13em;color:#a9bed6;white-space:nowrap}.nav-edition i,.viewport-header i{display:inline-block;width:5px;height:5px;background:var(--cyan);box-shadow:0 0 12px #62e8ff70;border-radius:50%;margin-right:10px}.nav-edition b{font-weight:400;color:var(--cyan);margin-left:10px}.cover-content{margin:auto 0 auto 9%;padding:55px 0 40px;max-width:540px}.cover-eyebrow{font:10px var(--mono);letter-spacing:.25em;color:var(--cyan);display:flex;align-items:center;gap:12px;margin-bottom:28px}.cover-eyebrow span{display:inline-block;width:28px;height:1px;background:var(--cyan)}.cover-title{font-size:clamp(54px,6.4vw,96px);font-weight:800;letter-spacing:.035em;line-height:1.18;margin:0 0 14px;text-shadow:0 5px 40px #0008}.cover-subtitle{font-size:24px;letter-spacing:.32em;font-weight:300;margin:0 0 28px;color:#c2d6e9}.cover-description{color:#a8bad0;font-size:14px;line-height:2;letter-spacing:.06em;margin:0 0 34px}.cover-actions{display:flex;gap:22px;align-items:center}.start-button{min-width:180px;padding:17px 21px;background:var(--cyan);border:1px solid #a2f2ff;color:#05121b;font-size:15px;font-weight:750;box-shadow:0 0 28px #42d7ff21;clip-path:polygon(0 0,calc(100% - 10px) 0,100% 10px,100% 100%,10px 100%,0 calc(100% - 10px))}.start-button:hover{background:#a5f2ff;box-shadow:0 0 40px #42d7ff4d}.start-button span{float:right;margin-left:24px;font-size:19px;line-height:20px}.guide-button{background:none;border:0;color:#c4d4e6;padding:15px 0;font-size:13px}.guide-button span{color:#6d92ae;margin-left:10px}.device-note{font-size:10px;letter-spacing:.08em;color:#758ba5;margin:19px 0 0}.device-note span{font-size:15px;margin-right:6px;vertical-align:-1px}.cover-footer{margin:0 5.8%;padding:28px 0 34px;border-top:1px solid #9ec8f52a;display:flex;align-items:center;gap:52px}.cover-stat{display:flex;align-items:center;gap:14px}.cover-stat>b{font:300 36px var(--mono);color:#d9e7f6}.cover-stat>span{font-size:11px;letter-spacing:.08em;color:#adbed1}.cover-stat small{display:block;font:8px var(--mono);letter-spacing:.1em;margin-top:7px;color:#5f7691}.cover-caption{margin-left:auto;text-align:right;font-size:10px;color:#90a7c0}.coordinates{display:block;margin-top:9px;font:8px var(--mono);letter-spacing:.18em;color:#556b86}.status-dot{display:inline-block;width:5px;height:5px;margin-right:7px;border-radius:50%;background:var(--cyan);box-shadow:0 0 12px #62e8ff66;vertical-align:1px}
.app-shell{width:min(1580px,calc(100% - 64px));margin:auto;padding:28px 0;display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:26px;min-height:100vh}.game-column{min-width:0}.topbar{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:0 0 26px}.eyebrow,.panel-kicker{margin:0;font:9px/1.5 var(--mono);letter-spacing:.16em;color:var(--cyan)}.topbar h1{font-size:28px;letter-spacing:.06em;margin:9px 0 0;line-height:1.3}.title-sub{color:var(--muted);font-size:11px;margin:6px 0 0;letter-spacing:.08em}.topbar-actions{display:flex;gap:7px;flex-wrap:wrap;justify-content:flex-end}.button{border:1px solid var(--line);border-radius:5px;padding:10px 13px;color:#c4d4e7;background:#121c2a;font-size:11px;font-weight:600}.button:hover{border-color:#62e8ff66;background:#18273a}.button span{margin-left:4px;font:9px var(--mono);color:#6c86a4}.button-accent{background:#173647;color:#a2f0ff;border-color:#348797}.button-accent:hover{background:#214858}.button-ghost{background:#0d1420}.viewport-header{display:flex;justify-content:space-between;align-items:center;padding:11px 16px;border:1px solid #718eb62c;border-bottom:0;border-radius:7px 7px 0 0;background:#0d1521;color:#8ba3be;font-size:10px}.viewport-header>span:last-child{font:8px var(--mono);letter-spacing:.15em;color:#607c9e}.viewport-header b{color:var(--cyan);font-weight:400;margin-left:5px}.canvas-wrap{position:relative;width:100%;overflow:hidden;border:1px solid #718eb645;border-radius:0 0 7px 7px;background:#080e18;box-shadow:var(--shadow)}.canvas-wrap::after{position:absolute;inset:0;pointer-events:none;content:"";background:repeating-linear-gradient(0deg,#effaff04 0 1px,transparent 1px 4px);z-index:1}#gameCanvas{display:block;width:100%;height:auto;aspect-ratio:16/9;cursor:crosshair}.canvas-wrap.drag-active{border-color:var(--cyan);box-shadow:0 0 28px #62e8ff26}.drag-hint{position:absolute;left:50%;top:45px;transform:translate(-50%,-5px);padding:8px 14px;border:1px solid #62e8ff77;border-radius:5px;color:var(--cyan);background:#091622ed;font-size:11px;white-space:nowrap;opacity:0;pointer-events:none;z-index:3;transition:opacity .2s,transform .2s}.canvas-wrap.drag-active .drag-hint{opacity:1;transform:translate(-50%,0)}.toast{position:absolute;bottom:18px;left:50%;transform:translate(-50%,8px);border:1px solid #5a91bd66;border-radius:5px;padding:10px 16px;background:#0a1525ed;color:#cdefff;font-size:11px;white-space:nowrap;opacity:0;z-index:3;pointer-events:none;transition:opacity .2s,transform .2s}.toast.show{opacity:1;transform:translate(-50%,0)}.game-footer{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px 0;color:#8195af;font-size:10px}.level-progress{display:flex;gap:5px}.level-dot{width:20px;height:4px;background:#253348;border-radius:1px}.level-dot.current{background:var(--cyan);box-shadow:0 0 8px #62e8ff66}.level-dot.done{background:#39778b}.controls-hint{text-align:right;line-height:2.3}.experiment-note{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;border-top:1px solid var(--line);padding:23px 0;color:#5b718f;font-size:10px;line-height:1.8}.experiment-note p{flex-basis:100%;color:#94a8c0;margin:0;order:2;font-size:12px}.experiment-note button{color:#9eb4ce;padding:0 0 0 8px;border:0;background:none;font-size:10px}
.side-panel{display:flex;flex-direction:column;gap:13px;padding-top:2px}.panel-block{padding:19px;border:1px solid var(--line);border-radius:7px;background:linear-gradient(140deg,#121c2c,#0d1420);box-shadow:inset 0 1px #ffffff04}.level-block{position:relative;overflow:hidden;background:radial-gradient(ellipse at 100% 0,#1b456550,transparent 65%),#0e1827}.level-block::after{content:"";position:absolute;right:-44px;top:-36px;width:155px;height:155px;border:1px solid #62e8ff14;border-radius:50%;box-shadow:0 0 0 13px #62e8ff04,0 0 0 26px #62e8ff03;pointer-events:none}.level-title-row{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:10px}h2{font-size:22px;line-height:1.5;margin:0}h3{font-size:15px;line-height:1.5;margin:4px 0 0}.level-number{font:30px var(--mono);color:#62e8ff9c}.level-brief{font-size:12px;line-height:1.8;color:#8c9fb9;margin:15px 0}.objective{border-left:2px solid var(--cyan);border-radius:0 4px 4px 0;padding:10px 12px;color:#b4d9ec;background:#1a344857;font-size:11px;line-height:1.9}.objective strong{color:var(--cyan);font-weight:600}.panel-heading{display:flex;align-items:end;justify-content:space-between;gap:8px}.tiny-note{color:#627a95;font-size:10px}.card-tray{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:15px}.ability-card{--card-color:var(--cyan);position:relative;min-height:132px;padding:12px 10px;border:1px solid #62e8ff48;border-radius:5px;background:linear-gradient(145deg,#1232488a,#0b1626);cursor:grab;user-select:none;overflow:hidden;transition:transform .18s,border-color .18s,box-shadow .18s}.ability-card[data-ability=jump]{--card-color:var(--coral);border-color:#ffb26745;background:linear-gradient(145deg,#45332366,#171621)}.ability-card::after{content:"";position:absolute;right:-16px;bottom:-18px;width:60px;height:60px;border:1px solid var(--card-color);transform:rotate(45deg);opacity:.08;box-shadow:0 0 0 8px #ffffff15,0 0 0 16px #ffffff10}.ability-card:hover,.ability-card.selected{border-color:var(--card-color);box-shadow:0 0 20px #62e8ff12;transform:translateY(-3px)}.ability-card.dragging{opacity:.4}.ability-card:active{cursor:grabbing}.card-top{display:flex;justify-content:space-between;align-items:start;position:relative;z-index:1}.card-code{font:7px var(--mono);color:#7589a3;letter-spacing:.04em;white-space:nowrap}.card-glyph{color:var(--card-color);font:24px var(--mono);margin-bottom:12px;line-height:28px}.card-name{font-size:13px;font-weight:650;color:#e3edf8}.card-owner{font-size:9px;line-height:1.7;color:#748ba7;margin-top:5px}.card-owner b{color:#aac0d9;display:block;font-weight:400}.card-meter{height:2px;background:#6389ac20;margin-top:12px}.card-meter i{display:block;width:100%;height:100%;background:var(--card-color);opacity:.5}.tip{font-size:10px;line-height:1.8;color:#7388a3;margin:13px 0 0}.object-list{display:flex;flex-direction:column;gap:6px;margin-top:12px}.object-row{display:flex;align-items:center;gap:10px;padding:10px 9px;border:1px solid #8195ba13;border-radius:4px;background:#1c2a3b33;cursor:pointer;font-size:11px}.object-row:hover{background:#2c47604d;border-color:#62e8ff44}.object-dot{width:8px;height:8px;border-radius:2px;background:var(--cyan)}.object-dot.box{background:var(--coral)}.object-dot.platform{background:#9d9bff}.object-name{flex:1;color:#c4d4e6}.object-cards{display:flex;gap:4px;color:#475c76}.mini-card{font:8px var(--mono);border:1px solid #62e8ff44;border-radius:2px;padding:3px 5px;color:var(--cyan);background:#62e8ff0f}.mini-card.jump{color:var(--coral);border-color:#ffb26744;background:#ffb2670f}.object-row.targeted{outline:1px solid var(--cyan)}.log{display:flex;flex-direction:column;gap:9px;max-height:100px;overflow:auto;margin-top:14px;scrollbar-width:thin;scrollbar-color:#284056 transparent}.log-entry{position:relative;padding-left:12px;font-size:10px;line-height:1.7;color:#6f87a3}.log-entry::before{content:"";width:3px;height:3px;background:#4d7994;position:absolute;left:0;top:7px}.log-entry:first-child{color:#afc7e0}.log-entry.accent{color:var(--cyan)}.side-footer{display:flex;justify-content:space-between;gap:8px;padding:5px 0;color:#475e7a;font-size:9px}.side-footer span{font:8px var(--mono)}
.modal-backdrop{position:fixed;inset:0;display:grid;place-items:center;z-index:5;background:#040810b8;backdrop-filter:blur(12px)}.modal-card{width:min(440px,calc(100% - 32px));padding:38px;border:1px solid #62e8ff38;border-radius:10px;background:radial-gradient(ellipse at top,#153243,#0d1523 80%);box-shadow:var(--shadow);text-align:center}.modal-icon{display:grid;place-items:center;width:54px;height:54px;margin:0 auto 23px;border:1px solid #62e8ff6b;border-radius:50%;color:var(--cyan);background:#62e8ff0c;font:24px var(--mono);box-shadow:0 0 28px #62e8ff15}.modal-card h2{margin-top:10px;font-size:26px}.modal-card p:not(.eyebrow){margin:15px 0 26px;color:#8ba4bf;font-size:13px;line-height:1.9}.modal-actions{display:flex;gap:9px;justify-content:center}.guide-dialog{color:var(--ink);background:linear-gradient(140deg,#142237,#0c1422);border:1px solid #62e8ff38;border-radius:10px;width:min(520px,calc(100% - 32px));padding:36px;box-shadow:0 30px 100px #000a}.guide-dialog::backdrop{background:#030810ca;backdrop-filter:blur(8px)}.guide-close{position:absolute;top:13px;right:18px;color:#8299b5;background:none;border:0;font-size:26px}.guide-dialog h2{margin-top:14px;font-size:23px}.guide-intro{font-size:12px;color:#91a7c1;line-height:1.9;margin:12px 0 25px}.guide-row{display:flex;gap:18px;margin:20px 0;align-items:center}.guide-symbol{display:grid;place-items:center;width:43px;height:50px;flex-shrink:0;border:1px solid #62e8ff66;border-radius:4px;color:var(--cyan);font:25px var(--mono);background:#123045}.guide-symbol.jump{border-color:#ffb26766;background:#2e2424;color:var(--coral)}.guide-row h3{font-size:13px;margin:0 0 6px}.guide-row p{font-size:11px;line-height:1.8;color:#8ba1be;margin:0}.guide-detail{border-top:1px solid var(--line);padding-top:18px;margin-top:24px}.guide-detail p{font-size:11px;color:#94a9c4;line-height:2}.guide-detail b{display:block;font-weight:500;color:#d0ddec}.guide-device{font-size:10px;color:#66809e;margin:19px 0 0}
@media(min-width:1600px){.cover-content{margin-left:12%}.cover-nav,.cover-footer{margin-left:8%;margin-right:8%}}
@media(max-width:1150px){.app-shell{width:calc(100% - 36px);grid-template-columns:minmax(0,1fr) 270px;gap:18px}.topbar{align-items:flex-start}.topbar-actions{max-width:225px}.panel-block{padding:15px}.game-footer{flex-wrap:wrap}.controls-hint{text-align:left}.brand-en{display:none}.cover-content{margin-left:7%;max-width:450px}.cover-title{font-size:68px}.cover-subtitle{font-size:21px}}
@media(max-width:900px){.app-shell{grid-template-columns:1fr;max-width:800px}.side-panel{display:grid;grid-template-columns:1fr 1fr;align-items:start}.side-footer{grid-column:span 2}.topbar-actions{max-width:none}.title-screen{min-height:720px}.cover-art{object-position:60% center}.cover-shade{background:linear-gradient(90deg,#040911ed,#04091166 60%,transparent),linear-gradient(0deg,#050a12,transparent 55%)}.cover-title{font-size:64px}.cover-content{max-width:430px}.cover-stat>b{font-size:30px}.cover-footer{gap:28px}.coordinates{font-size:7px;letter-spacing:0}}
@media(max-width:580px){.title-screen{min-height:750px}.title-screen::after{inset:10px}.cover-nav{height:85px;margin:0 7%;gap:8px}.nav-edition{font-size:8px}.brand-lockup{font-size:13px;gap:9px}.brand-mark{width:28px;height:31px;font-size:20px}.cover-art{object-position:64% center}.cover-shade{background:linear-gradient(90deg,#040911e0,#04091180 80%),linear-gradient(0deg,#050a12,transparent 70%)}.cover-content{padding-top:50px;padding-bottom:40px;margin-left:8%;max-width:84%}.cover-eyebrow{font-size:8px;letter-spacing:.16em}.cover-title{font-size:clamp(44px,12vw,60px)}.cover-subtitle{font-size:18px;letter-spacing:.2em}.cover-description{font-size:12px}.cover-actions{gap:18px}.start-button{min-width:160px;font-size:14px;padding:15px 18px}.guide-button{font-size:12px}.cover-footer{margin:0 8%;padding:24px 0 28px;gap:30px;flex-wrap:wrap}.cover-caption{display:none}.cover-stat>b{font-size:28px}.app-shell{width:calc(100% - 24px);padding:18px 0}.topbar{flex-wrap:wrap;padding-bottom:18px}.topbar h1{font-size:25px}.topbar-actions{justify-content:flex-start}.side-panel{grid-template-columns:1fr}.side-footer{grid-column:auto}.game-footer{gap:12px}.experiment-note{display:none}.controls-hint{font-size:9px}.guide-dialog{padding:28px 23px}.guide-dialog h2{font-size:20px}.device-note{font-size:9px}.toast{font-size:10px;max-width:90%;white-space:normal;text-align:center}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}
@media(min-width:581px) and (max-height:800px){.title-screen{min-height:670px}.cover-nav{height:88px}.cover-content{padding-top:32px;padding-bottom:28px}.cover-footer{padding-top:22px;padding-bottom:26px}.cover-eyebrow{margin-bottom:24px}.cover-description{margin-bottom:28px}}