*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#0e1923;color:#f4eacf;font-family:system-ui,-apple-system,'Noto Sans KR',sans-serif}button{font:inherit;color:inherit;cursor:pointer;border:1px solid #748278;background:#263c44;border-radius:3px;min-height:32px;padding:5px 10px}button:hover{background:#3d5860;border-color:#f2d68c}button:focus-visible,canvas:focus-visible{outline:2px solid #ffe19b;outline-offset:-3px}button:disabled{opacity:.45;cursor:default}#game{height:100dvh;max-width:1440px;margin:auto;display:flex;flex-direction:column;border:1px solid #405458}.game-bar{display:flex;align-items:center;gap:9px;padding:8px 13px;background:#162a34;border-bottom:1px solid #385057;flex-shrink:0}.game-mark{color:#f0cf85;font-size:29px}.game-bar strong{display:block;font-size:14px;letter-spacing:.09em}.game-bar small{display:block;font-size:10px;color:#9cafb0;margin-top:2px}.bar-actions{margin-left:auto;display:flex;gap:6px}.bar-actions button{font-size:11px}.hud{height:50px;display:flex;align-items:center;gap:15px;padding:5px 16px;background:#12232c;flex-shrink:0}.level{display:flex;align-items:center;gap:6px}.level small{color:#9aadae;font-size:10px}.level b{color:#f4d28b;font-size:23px;font-weight:500}.vitals{width:min(45%,300px)}.vitals>div:first-child{display:flex;justify-content:space-between;font-size:10px;color:#c4d1c6}.hp-track{height:8px;background:#32403b;border:1px solid #657469;margin-top:3px}.hp-track i{display:block;width:100%;height:100%;background:linear-gradient(90deg,#6dae9b,#b4ddab);transition:width .15s}.shards{margin-left:auto;font-size:12px;color:#a7e6df}#potion{font-size:12px;color:#ffcba5;min-width:47px}.stage{position:relative;flex:1;min-height:120px;overflow:hidden;background:#0a1420}canvas{display:block;width:100%;height:100%;object-fit:contain;image-rendering:pixelated;touch-action:none}.overlay{position:absolute;inset:0;background:linear-gradient(90deg,rgba(8,19,27,.89),rgba(8,19,27,.25));display:flex;align-items:center;justify-content:center;padding:18px;overflow:auto}.overlay[hidden]{display:none}.panel{width:450px;max-width:100%;padding:20px 25px;border-left:2px solid #cbb06f;background:linear-gradient(100deg,rgba(13,31,41,.93),rgba(13,31,41,.7));box-shadow:0 12px 60px #07131a66}.eyebrow{color:#b8c6ad;font-size:9px;letter-spacing:.19em}h1{font-family:Georgia,'Noto Serif KR',serif;margin:12px 0 10px;font-size:43px;line-height:1.14;letter-spacing:.08em;font-weight:600}h1 em{font-style:normal;color:#f2d593}#panel-copy{font-size:12px;color:#cad8cf;line-height:1.85;white-space:pre-line;margin:8px 0 16px}.panel-actions{display:flex;flex-wrap:wrap;gap:8px}.panel-actions button{font-size:12px;min-height:38px;padding:8px 18px}.panel-actions button:first-child{background:#d8c18e;color:#192b30;border:1px solid #ffe6af;font-weight:700}.panel-actions button:first-child:hover{background:#f3dbac}.panel-note{color:#92aaa9;font-size:10px;line-height:1.6;margin:13px 0 0}.quest{display:flex;align-items:center;gap:10px;background:#172b32;padding:8px 14px;flex-shrink:0}.quest>span{border:1px solid #697466;color:#daca99;font-size:10px;padding:2px 5px;white-space:nowrap}.quest p{font-size:11px;margin:0;line-height:1.4;color:#c9d4c8}.controls{display:flex;justify-content:space-between;gap:10px;padding:6px 12px;background:#12232b;font-size:9px;color:#a6b7b6;flex-shrink:0}kbd{font-family:inherit;color:#e4d9bc}#toast{position:absolute;left:50%;top:10px;transform:translateX(-50%);max-width:90%;width:max-content;pointer-events:none;text-align:center;background:#102b35ed;color:#ffe7b1;border:1px solid #788475;padding:8px 12px;font-size:12px;opacity:0;transition:opacity .15s;z-index:2}#toast.show{opacity:1}.touch-controls{display:none;padding:7px 12px;background:#11232b;justify-content:space-between;flex-shrink:0;user-select:none;touch-action:none}.dpad{display:grid;grid-template-columns:repeat(3,42px);grid-template-rows:repeat(2,38px);gap:3px}.dpad button{padding:0}.dpad [data-key=up]{grid-column:2}.dpad [data-key=left]{grid-column:1;grid-row:2}.dpad [data-key=down]{grid-column:2;grid-row:2}.dpad [data-key=right]{grid-column:3;grid-row:2}.touch-actions{display:flex;align-items:center;gap:6px}.touch-actions button{min-height:47px;padding:7px;font-size:12px}.touch-actions .attack{background:#756e49;min-width:54px}.touch-controls button.pressed{background:#789582;color:#10232b}body.modal .touch-controls{opacity:.4;pointer-events:none}@media(pointer:coarse),(max-width:600px){.touch-controls{display:flex}.controls>span:first-child{display:none}.controls{justify-content:flex-end}.panel{padding:14px 18px}h1{font-size:33px}.hud{gap:10px;padding-inline:10px}.game-bar{padding:6px 9px}.game-bar strong{font-size:12px}}@media(max-height:560px){.game-bar{padding:3px 9px}.game-mark{font-size:22px}.hud{height:36px}.quest{padding:4px 10px}.controls{padding-block:3px}.overlay{padding:9px}.panel{padding:10px 18px}h1{font-size:28px;margin:6px 0}#panel-copy{font-size:11px;margin:6px 0;line-height:1.55}.panel-note{margin-top:6px}.touch-controls{padding:3px 8px}.dpad{grid-template-rows:repeat(2,30px);grid-template-columns:repeat(3,37px)}.dpad button{min-height:30px}.touch-actions button{min-height:42px}.panel-actions button{min-height:32px;padding:5px 12px}}@media(prefers-reduced-motion:reduce){*{transition:none!important}}[hidden]{display:none!important}