:root{color-scheme:dark;--ink: #0e1729;--deep: #071a2a;--panel: #10304a;--panel2: #0c2438;--line: #2c6a86;--hi: #57b9d6;--text: #eef8ff;--muted: #9fc1d4;--mint: #6ff0d0;--gold: #ffd21f;--gold2: #ffe773;--hp: #ff6a6a;--volt: #3ff2ff;--px: "Press Start 2P", monospace;--body: "Pixelify Sans", system-ui, sans-serif;font-family:var(--body);color:var(--text);background:var(--deep);font-synthesis:none}*{box-sizing:border-box}body{margin:0;min-height:100vh;background:radial-gradient(ellipse at 20% -10%,#1b5a7a 0,transparent 55%),radial-gradient(ellipse at 90% 110%,#134a5e 0,transparent 50%),var(--deep)}button,input,select{font:inherit}button{cursor:pointer}button:disabled{cursor:default;opacity:.5}button:focus-visible,a:focus-visible{outline:2px solid var(--gold);outline-offset:3px}a{color:var(--gold2)}[hidden]{display:none!important}.px-panel,.px-btn,.tag,.vitals,.message,dialog,.action-bar button,.owned{clip-path:polygon(0 4px,4px 4px,4px 0,calc(100% - 4px) 0,calc(100% - 4px) 4px,100% 4px,100% calc(100% - 4px),calc(100% - 4px) calc(100% - 4px),calc(100% - 4px) 100%,4px 100%,4px calc(100% - 4px),0 calc(100% - 4px))}.px-panel{background:var(--panel);padding:12px;box-shadow:inset 0 0 0 2px var(--ink),inset 0 0 0 4px var(--line),inset 0 4px 0 4px #1c4b6a}.px-btn{border:0;padding:10px 14px;min-height:40px;color:#10204a;background:var(--gold);font:10px/1.2 var(--px);letter-spacing:.04em;text-transform:uppercase;box-shadow:inset 0 0 0 2px var(--ink),inset 0 -5px 0 2px #c49a00,inset 0 3px 0 2px var(--gold2)}.px-btn:hover:not(:disabled){filter:brightness(1.08)}.px-btn:active:not(:disabled){box-shadow:inset 0 0 0 2px var(--ink),inset 0 3px 0 2px #c49a00;transform:translateY(1px)}.px-btn.secondary{background:#1d5577;color:var(--text);box-shadow:inset 0 0 0 2px var(--ink),inset 0 -5px 0 2px #123a55,inset 0 3px 0 2px #2f7aa3}.px-btn.big{font-size:12px;padding:14px 18px;min-height:48px}.px-btn.small{font-size:8px;min-height:32px;margin-top:6px}.px-btn.on{background:#1f6b4c;color:#d9ffe9;box-shadow:inset 0 0 0 2px var(--ink),inset 0 -5px 0 2px #164a36,inset 0 3px 0 2px #2f9a6c}.app{width:min(100%,1440px);margin:auto;padding:0 clamp(8px,2.5vw,32px)}.masthead{display:flex;align-items:center;gap:10px;min-height:70px;flex-wrap:wrap;padding:8px 0}.back{font:8px var(--px);color:var(--muted);text-decoration:none}.back:hover{color:var(--gold2)}.brand{display:flex;gap:10px;align-items:center;margin-right:auto;text-decoration:none;color:inherit}.brand b{font:18px/1 var(--px);display:block;letter-spacing:.04em}.brand small{font:7px/1.6 var(--px);letter-spacing:.12em;color:var(--mint)}.brand-icon{display:grid;place-items:center;width:40px;height:40px;background:var(--gold);color:#152a29;font:22px var(--px);box-shadow:inset 0 0 0 2px var(--ink),inset -3px -3px 0 2px #c49a00}.tag{font:8px var(--px);letter-spacing:.08em;background:var(--panel2);padding:9px 10px;color:var(--mint);white-space:nowrap;box-shadow:inset 0 0 0 2px var(--ink),inset 0 0 0 4px #24566e;border:0}.layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(220px,270px);gap:12px;align-items:start}.stage{position:relative;isolation:isolate;height:clamp(440px,74dvh,820px);overflow:hidden;background:#0b2a33;touch-action:none;box-shadow:0 0 0 3px var(--ink),0 0 0 6px var(--line),0 12px 40px #0008}#game{width:100%;height:100%;outline:none}#game canvas{display:block;image-rendering:pixelated}.title{position:absolute;inset:0;z-index:30;display:grid;place-items:center;overflow:auto;padding:18px;background:linear-gradient(180deg,#0a2a44ee,#061624f5),repeating-linear-gradient(90deg,#ffffff06 0 2px,transparent 2px 4px)}.title:before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.5;background:radial-gradient(circle at 15% 20%,#3ff2ff22 0 2px,transparent 3px) 0 0 / 46px 46px,radial-gradient(circle at 70% 60%,#ffd21f22 0 2px,transparent 3px) 0 0 / 70px 70px;animation:drift 18s linear infinite}@keyframes drift{to{background-position:0 -460px,0 -700px}}.title-inner{position:relative;width:min(860px,100%);text-align:center}.kicker{font:8px var(--px);letter-spacing:.2em;color:var(--mint);margin:0 0 14px}.logo{margin:0 0 20px;font:clamp(26px,6vw,52px)/1.05 var(--px);color:#fff;text-shadow:4px 4px 0 #1f7fa3,8px 8px 0 var(--ink);letter-spacing:.02em}.logo span{display:block;margin-top:10px;font-size:.42em;color:var(--gold);text-shadow:3px 3px 0 #a87e00,6px 6px 0 var(--ink);letter-spacing:.14em}.title-body{display:grid;grid-template-columns:1.25fr 1fr;gap:12px;text-align:left}.choose{display:grid;gap:12px;align-content:start}.label{font:8px var(--px);letter-spacing:.14em;color:var(--gold2);margin:2px 0 8px}.muted{color:var(--muted);font-size:15px;margin:4px 0 10px;line-height:1.35}.owned-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(70px,1fr));gap:8px;max-height:196px;overflow:auto;margin-bottom:10px}.owned-grid:empty{display:none}.owned{position:relative;border:0;padding:3px;background:var(--panel2);box-shadow:inset 0 0 0 2px var(--ink),inset 0 0 0 4px #24566e}.owned img{display:block;width:100%;aspect-ratio:1;image-rendering:pixelated}.owned span{position:absolute;left:6px;bottom:6px;font:7px var(--px);background:#071a2acc;padding:3px 4px}.owned.sel{box-shadow:inset 0 0 0 2px var(--ink),inset 0 0 0 5px var(--gold)}.chosen{display:grid;grid-template-columns:96px 1fr;gap:12px;align-items:center;align-content:start}.chosen img{width:96px;height:96px;image-rendering:pixelated;box-shadow:0 0 0 2px var(--ink),0 0 0 4px var(--gold);background:var(--panel2)}.chosen .go{grid-column:1 / -1;width:100%}.chosen-name{font:14px/1.3 var(--px);margin:6px 0}.badge{display:inline-block;font:7px var(--px);letter-spacing:.1em;padding:5px 6px;margin:2px 0;background:#24566e;color:#cfe9f5}.badge.holder{background:#1f6b4c;color:#d9ffe9}.game-hud{position:absolute;top:10px;left:10px;right:10px;display:flex;justify-content:space-between;align-items:start;gap:8px;pointer-events:none;z-index:5}.zone-tools{display:flex;gap:6px;align-items:start}.zone-tools button{pointer-events:auto;color:var(--gold2)}.vitals{width:min(46%,200px);padding:9px 10px;background:#071a2ae6;box-shadow:inset 0 0 0 2px var(--ink),inset 0 0 0 4px #24566e}.vital{display:grid;grid-template-columns:34px 1fr 30px;align-items:center;gap:6px;font:7px var(--px)}.vital+.vital{margin-top:7px}.vital .bar{display:block;height:10px;background:#0b1f2a;box-shadow:0 0 0 2px var(--ink);position:relative}.vital .bar b{display:block;height:100%;width:100%;transition:width .12s steps(6)}.hp .bar b{background:linear-gradient(180deg,#ff9a9a 0 30%,var(--hp) 30% 80%,#b83a4a 80%)}.volt .bar b{background:linear-gradient(180deg,#b6fbff 0 30%,var(--volt) 30% 80%,#1aa6c4 80%)}.vital em{font-style:normal;text-align:right}.message{position:absolute;bottom:72px;left:50%;transform:translate(-50%);width:max-content;max-width:90%;padding:12px 14px;background:#071a2af2;box-shadow:inset 0 0 0 2px var(--ink),inset 0 0 0 4px var(--gold);font-size:16px;pointer-events:none;z-index:6}.action-bar{position:absolute;bottom:12px;left:50%;transform:translate(-50%);display:flex;gap:6px;z-index:6}.action-bar button{touch-action:manipulation;border:0;background:#0c2438f0;color:var(--text);padding:8px 10px;min-height:44px;font:15px var(--body);white-space:nowrap;box-shadow:inset 0 0 0 2px var(--ink),inset 0 0 0 4px #24566e}.action-bar button span{color:var(--gold);font:7px var(--px);margin-right:4px}.action-bar button.cooling{opacity:.55}.action-bar button.near{box-shadow:inset 0 0 0 2px var(--ink),inset 0 0 0 4px var(--gold)}.sidebar{display:grid;gap:10px}.profile{display:flex;gap:10px;align-items:center}.profile img{width:64px;height:64px;image-rendering:pixelated;box-shadow:0 0 0 2px var(--ink),0 0 0 4px var(--line)}.eyebrow{margin:0;color:var(--mint);font:7px var(--px);letter-spacing:.1em}.profile h2{font:12px/1.3 var(--px);margin:6px 0 4px}.profile p,.inventory,.journal>p:not(.eyebrow){font-size:14px;color:var(--muted);margin:4px 0;line-height:1.35}.journal h3{font:10px/1.5 var(--px);margin:8px 0 4px;color:var(--gold2)}.quest-count{font-size:14px;color:var(--gold);margin-top:8px}.px-panel summary{font:9px/1.6 var(--px);cursor:pointer}.px-panel summary b{float:right;color:var(--gold)}.px-panel ul,.px-panel ol{padding-left:18px;margin:8px 0;font-size:14px;color:var(--muted)}footer{display:flex;justify-content:space-between;gap:12px;color:var(--muted);font-size:14px;padding:14px 1px}dialog{width:min(460px,calc(100% - 22px));max-height:calc(100% - 24px);overflow:auto;border:0;background:var(--panel);color:inherit;padding:22px;box-shadow:inset 0 0 0 2px var(--ink),inset 0 0 0 4px var(--line)}dialog::backdrop{background:#04121cd0}dialog h2{font:13px/1.5 var(--px);margin:6px 0 10px}dialog p:not(.eyebrow){color:var(--muted);font-size:15px}.shop-item{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:9px 0;border-bottom:2px dashed #24566e;font-size:15px}.shop-item strong{font:9px/1.5 var(--px);color:var(--gold2)}.shop-item p{margin:3px 0}#workshop form,#chart form{margin-top:14px}#chart{width:min(980px,calc(100% - 22px))}.chart-zones{display:grid;grid-template-columns:31fr 52fr 29fr 64fr 64fr;gap:4px;text-align:center;font:7px var(--px);margin:14px 0 8px}.chart-zones span:nth-child(2){color:var(--mint)}.chart-zones span:nth-child(4){color:#a3c2b6}.chart-zones span:nth-child(5){color:#c49bff}#chart-map{display:block;width:100%;height:auto;image-rendering:pixelated;box-shadow:0 0 0 2px var(--ink),0 0 0 4px var(--line)}.chart-key{display:flex;gap:8px 16px;flex-wrap:wrap;list-style:none;padding:0;color:var(--muted);font-size:14px}.chart-key i{display:inline-block;width:10px;height:10px;background:var(--pin);margin-right:4px;box-shadow:0 0 0 2px var(--ink)}.joystick{display:none}@media(max-width:860px){.title-body{grid-template-columns:1fr}}@media(max-width:800px){.layout{grid-template-columns:1fr}.stage{height:clamp(420px,70dvh,680px)}.sidebar{grid-template-columns:repeat(2,minmax(0,1fr))}.edition,.back{display:none}}@media(pointer:coarse){.joystick{display:grid;place-items:center;position:absolute;left:14px;bottom:16px;width:84px;height:84px;background:#071a2aa8;box-shadow:0 0 0 2px var(--ink),0 0 0 4px #24566e;touch-action:none;z-index:6;border-radius:50%}.joystick>div{width:34px;height:34px;background:var(--gold);box-shadow:0 0 0 2px var(--ink),inset -3px -3px #c49a00;pointer-events:none}.action-bar{left:auto;right:8px;transform:none;display:grid;grid-template-columns:repeat(3,auto)}.action-bar button{padding:4px 8px;font-size:14px}.message{bottom:118px}footer span:first-child{display:none}}@media(max-width:420px){.sidebar{grid-template-columns:1fr}.masthead{min-height:56px}.brand b{font-size:14px}.logo{font-size:24px}.chosen{grid-template-columns:72px 1fr}.chosen img{width:72px;height:72px}}.profile .badge,.chosen .badge{font:7px/1.4 var(--px);color:#cfe9f5}.profile .badge.holder,.chosen .badge.holder{color:#d9ffe9}.dialogue{position:absolute;left:50%;bottom:66px;transform:translate(-50%);z-index:12;width:min(680px,calc(100% - 20px));display:grid;grid-template-columns:84px 1fr;gap:12px;align-items:start;padding:12px 14px;cursor:pointer;background:#071a2af5;box-shadow:inset 0 0 0 2px var(--ink),inset 0 0 0 4px var(--gold),0 10px 30px #0009;clip-path:polygon(0 4px,4px 4px,4px 0,calc(100% - 4px) 0,calc(100% - 4px) 4px,100% 4px,100% calc(100% - 4px),calc(100% - 4px) calc(100% - 4px),calc(100% - 4px) 100%,4px 100%,4px calc(100% - 4px),0 calc(100% - 4px))}.dialogue img{width:84px;height:84px;image-rendering:pixelated;object-fit:contain;background:#10304a;box-shadow:0 0 0 2px var(--ink),0 0 0 4px var(--line)}.dlg-name{margin:2px 0 8px;font:8px var(--px);letter-spacing:.08em;color:var(--gold2)}.dlg-text{margin:0;font-size:18px;line-height:1.35;min-height:3.9em}.dlg-next{position:absolute;right:14px;bottom:8px;color:var(--gold);font-size:12px;opacity:0}.dialogue.more .dlg-next{opacity:1;animation:nudge .6s steps(2) infinite}@keyframes nudge{50%{transform:translateY(3px)}}.hint{position:absolute;left:50%;top:58px;transform:translate(-50%);z-index:7;max-width:90%;padding:9px 12px;font:8px/1.6 var(--px);color:#10204a;background:var(--gold);text-align:center;pointer-events:none;box-shadow:inset 0 0 0 2px var(--ink),inset 0 -4px 0 2px #c49a00;animation:pop .25s steps(3)}.banner{position:absolute;left:50%;top:34%;transform:translate(-50%,-50%);z-index:8;pointer-events:none;text-align:center;font:clamp(14px,3.2vw,24px)/1.4 var(--px);color:#fff;text-shadow:3px 3px 0 #1f7fa3,6px 6px 0 var(--ink);white-space:nowrap;animation:banner 2.6s steps(12) forwards}.banner small{display:block;font-size:.45em;color:var(--mint);text-shadow:2px 2px 0 var(--ink);letter-spacing:.2em;margin-top:8px}.banner.gold{color:var(--gold);text-shadow:3px 3px 0 #a87e00,6px 6px 0 var(--ink)}.banner.danger{color:#ff8a7a;text-shadow:3px 3px 0 #7d1a1a,6px 6px 0 var(--ink)}@keyframes banner{0%{opacity:0;transform:translate(-50%,-30%)}12%,78%{opacity:1;transform:translate(-50%,-50%)}to{opacity:0;transform:translate(-50%,-60%)}}@keyframes pop{0%{transform:translate(-50%) scale(.7)}to{transform:translate(-50%) scale(1)}}.menu-list{display:grid;gap:10px;margin:14px 0}.menu-list .px-btn{width:100%}.howto{margin:6px 0 0;padding-left:18px;color:var(--muted);font-size:15px;line-height:1.5}.howto b{color:var(--gold2);font-weight:600}@media(pointer:coarse){.dialogue{bottom:118px;grid-template-columns:64px 1fr}.dialogue img{width:64px;height:64px}.dlg-text{font-size:16px}}.bossbar{position:absolute;left:50%;top:52px;transform:translate(-50%);z-index:6;width:min(460px,70%);display:grid;grid-template-columns:auto 1fr auto;gap:8px;align-items:center;padding:8px 10px;pointer-events:none;background:#1a0b12e6;box-shadow:inset 0 0 0 2px var(--ink),inset 0 0 0 4px #b8302a;font:7px var(--px);color:#ffd0c4}.boss-track{display:block;height:10px;background:#3a1018;box-shadow:0 0 0 2px var(--ink)}.boss-track b{display:block;height:100%;width:100%;background:linear-gradient(180deg,#ff9a7a 0 30%,#e8403a 30% 80%,#8a1a1a 80%);transition:width .15s steps(5)}.bossbar em{font-style:normal;color:var(--gold)}.bossbar.enraged{animation:rage .4s steps(2) infinite}@keyframes rage{50%{box-shadow:inset 0 0 0 2px var(--ink),inset 0 0 0 4px #ff6a3a}}@media(max-width:560px){.bossbar{top:96px;width:86%}.boss-name{display:none}.bossbar{grid-template-columns:1fr auto}}.cloud-msg{font-size:13px;margin:8px 0 0;color:var(--mint)}#leaderboard li.me{color:var(--gold)}.online-btn{margin-top:10px;background:linear-gradient(180deg,#4fe3b0,#1f9e7a);color:#04231b}.online-tag{color:#6cf08a;pointer-events:none}.chat{position:absolute;left:12px;bottom:70px;z-index:6;width:min(340px,46%);display:grid;gap:4px;pointer-events:none}.chat ol{list-style:none;margin:0;padding:0;display:grid;gap:2px;font-size:13px;line-height:1.25}.chat li{background:#071a24c4;padding:3px 7px;color:#e6faff;text-shadow:0 1px 0 #000;box-shadow:inset 0 0 0 1px #12384a;overflow-wrap:anywhere}.chat li b{color:#8fe3ff;font-weight:700}.chat li.holder b{color:var(--gold)}.chat li.system{color:#b6ffd8}.chat input{pointer-events:auto;font:13px inherit;padding:6px 8px;border:0;color:#e6faff;background:#071a24e6;box-shadow:inset 0 0 0 2px #1f5a70;outline:none;opacity:.55}.chat input:focus{opacity:1;box-shadow:inset 0 0 0 2px var(--gold)}@media(max-width:560px){.chat{bottom:150px;width:60%}.chat ol{font-size:12px}}.hero-card{margin-top:12px;padding:10px;background:#071a2499;box-shadow:inset 0 0 0 2px #1f5a70}.hero-line{margin:4px 0 8px;color:var(--gold);font-size:14px}.name-row{display:flex;gap:6px}.name-row input{flex:1;min-width:0;font:14px inherit;padding:6px 8px;border:0;color:#e6faff;background:#04121a;box-shadow:inset 0 0 0 2px #1f5a70;outline:none}.name-row input:focus{box-shadow:inset 0 0 0 2px var(--gold)}.hero-note{font-size:12px;margin:8px 0 0}