:root{--night:#0d0f1c;--panel:#171a2e;--line:#2b3050;--ink:#f1e9d6;--mute:#9b97ad;--gold:#f2c14e;--hp:#e2524f;--xp:#5fc3ff;--key:#8be0a0;--ui:"Press Start 2P",monospace;--ko:"Noto Sans KR","Apple SD Gothic Neo",sans-serif;color-scheme:dark;--top-h:52px;--bottom-min:176px}*{box-sizing:border-box}html,body{margin:0;height:100%;background:var(--night);color:var(--ink);font-family:var(--ko);font-size:14px;line-height:1.4;-webkit-text-size-adjust:100%;overscroll-behavior:none}#app{max-width:430px;margin:0 auto;height:100dvh;display:flex;flex-direction:column;overflow:hidden}#top{flex:0 0 auto;min-height:var(--top-h);padding:calc(6px + env(safe-area-inset-top,0px)) 12px 6px;background:var(--panel);border-bottom:2px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:8px}#world{flex:1 1 auto;min-height:0;position:relative;overflow:hidden;background:var(--night)}#game{position:absolute;inset:0}#game canvas{display:block;image-rendering:pixelated}#ui{position:absolute;inset:0;pointer-events:none}#ui>*{pointer-events:auto}#bottom{flex:0 0 auto;min-height:var(--bottom-min);max-height:34%;padding:8px 12px calc(10px + env(safe-area-inset-bottom,0px));background:var(--panel);border-top:2px solid var(--line);display:flex;flex-direction:column;gap:8px;overflow:hidden}@media(orientation:landscape)and (max-height:520px){#world:after{content:attr(data-rotate);position:absolute;inset:0;display:grid;place-items:center;background:var(--night);color:var(--mute);font-size:16px;z-index:5}}.num{font-family:var(--ui);font-size:16px;color:var(--gold);font-variant-numeric:tabular-nums}.hud{display:flex;align-items:center;gap:10px;font-size:12px;color:var(--mute);flex:1;min-width:0;overflow:hidden;white-space:nowrap;font-variant-numeric:tabular-nums}.hud b{font-family:var(--ui);font-size:12px;color:var(--ink);font-weight:400}.hud .gold b{color:var(--gold)}.ttl{font-size:13px;font-weight:700;color:var(--gold);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}button{font-family:var(--ko);font-weight:700;font-size:13px;min-height:44px;padding:8px 10px;background:var(--line);color:var(--ink);border:0;border-radius:4px;cursor:pointer;line-height:1.3}button:focus-visible{outline:2px solid var(--gold);outline-offset:2px}button[disabled]{opacity:.45;cursor:default}button.primary{background:#7a5a1a;color:#fff}button.big{min-height:52px;font-size:16px}button.icon{min-height:40px;min-width:44px;padding:6px 10px;font-size:12px;font-weight:400;background:transparent;border:1px solid var(--line);color:var(--mute)}.bars{position:absolute;left:8px;right:8px;top:8px;display:grid;gap:4px;background:#0d0f1c99;padding:6px 8px;border-radius:6px}.bar{display:grid;grid-template-columns:40px 1fr 96px;align-items:center;gap:6px;font-size:12px;color:var(--mute)}.track{height:10px;background:var(--night);border:1px solid var(--line);position:relative;border-radius:2px}.fill{position:absolute;inset:0;width:0%}.fill.hp{background:var(--hp)}.fill.xp{background:var(--xp)}.fill.gate{background:var(--gold)}.bar .v{text-align:right;color:var(--ink);font-size:12px;font-variant-numeric:tabular-nums;white-space:nowrap}.party{display:flex;gap:6px;flex-wrap:wrap}.card{background:#0d0f1cb3;border:1px solid var(--line);padding:3px 8px;display:flex;gap:6px;align-items:baseline;font-size:12px;color:var(--mute);border-radius:4px}.card b{color:var(--ink);font-weight:700}.card .lv{color:var(--key)}.card.locked{opacity:.5}.dlg{min-height:56px;background:var(--night);border:2px solid var(--line);padding:6px 10px;display:grid;gap:2px;cursor:pointer;position:relative;border-radius:6px}.dlg .who{font-size:12px;color:var(--key)}.dlg p{margin:0;font-size:14px}.dlg .tap{position:absolute;right:8px;bottom:2px;font-size:12px;color:var(--mute)}.dlg.idle{opacity:.75;cursor:default}.skills{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.skills button{position:relative;min-height:52px;font-size:13px;background:#3b2f55}.skills button.ready{background:#5a3f8a}.skills button.locked{background:var(--night);color:var(--mute);border:1px dashed var(--line)}.skills button .cd{position:absolute;right:6px;bottom:3px;font-size:12px;color:var(--gold)}.actions{display:flex;gap:8px;align-items:center;justify-content:space-between}.note{font-size:12px;color:var(--mute);text-align:center}.dot{position:relative}.dot:after{content:"";position:absolute;top:4px;right:4px;width:12px;height:12px;border-radius:50%;background:var(--hp);box-shadow:0 0 0 2px var(--panel)}.village{position:absolute;left:0;right:0;bottom:0;width:100%;aspect-ratio:9/10;max-height:100%;background:var(--bg-village,none) center bottom / 100% auto no-repeat}.village-sky{position:absolute;inset:0;background:#0b1326}.spot{position:absolute;transform:translate(-50%,-50%);min-width:64px;max-width:46%;min-height:44px;padding:6px 12px;border-radius:22px;background:#0d0f1ccc;border:2px solid var(--line);color:var(--ink);font-size:13px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.spot.dot:after{top:-3px;right:-3px}.spot .sub{display:block;font-size:12px;font-weight:400;color:var(--mute);line-height:1.2;overflow:hidden;text-overflow:ellipsis}.row3{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.row3 button{min-height:48px;font-size:12px;line-height:1.3;background:var(--night);border:2px solid var(--line);padding:6px 4px}.res{display:flex;gap:10px;font-size:12px;color:var(--mute);white-space:nowrap;font-variant-numeric:tabular-nums}.res b{font-family:var(--ui);font-size:12px;color:var(--ink);font-weight:400}.mapwrap{position:absolute;inset:0;overflow-y:auto;background:var(--bg-map,none) center / cover no-repeat}.path{display:flex;flex-direction:column-reverse;align-items:center;gap:16px;padding:28px 0;min-height:100%}.path button{width:64px;height:64px;border-radius:50%;font-size:13px;background:#0d0f1cd1;border:2px solid var(--line)}.path button:nth-child(odd){margin-left:48px}.path button:nth-child(2n){margin-right:48px}.path button.clear{background:#2b3a2e;color:var(--key)}.path button.next{background:#7a5a1a;color:#fff;border-color:#a87a2a;transform:scale(1.15)}.path button[disabled]{opacity:.45}.modal{position:fixed;inset:0;background:#0d0f1cb3;display:flex;align-items:flex-end;justify-content:center;z-index:20}.modal .box{background:var(--panel);border:3px solid var(--line);border-bottom:0;border-radius:14px 14px 0 0;padding:10px 14px calc(14px + env(safe-area-inset-bottom,0px));width:min(430px,100%);display:grid;gap:10px;max-height:85dvh;overflow:auto;animation:sheet .22s ease-out}.modal .box:before{content:"";width:40px;height:4px;border-radius:2px;background:var(--line);margin:0 auto}@keyframes sheet{0%{transform:translateY(24px);opacity:.6}to{transform:none;opacity:1}}.modal h2{font-family:var(--ui);font-size:12px;color:var(--gold);margin:0;font-weight:400}.modal h3{font-size:14px;margin:10px 0 2px;color:var(--gold)}.modal p{margin:0;font-size:14px}.modal .num{font-family:var(--ui);font-size:16px;color:var(--gold)}.modal table{width:100%;border-collapse:collapse;font-size:13px}.modal td{padding:4px;border-bottom:1px solid var(--line)}.modal td.lv{font-family:var(--ui);font-size:12px;text-align:right}.modal tr.me td{color:var(--gold)}.grid28{display:grid;grid-template-columns:repeat(7,1fr);gap:4px}.grid28 div{aspect-ratio:1;border:1px solid var(--line);display:grid;place-items:center;font-size:12px;color:var(--mute)}.grid28 div.done{background:#2b3a2e;color:var(--key)}.grid28 div.today{border-color:var(--gold);color:var(--gold)}.grid28 div.hi{border-style:double}.list{display:grid;gap:6px}.row{display:grid;grid-template-columns:1fr auto;gap:8px;align-items:center;background:var(--night);border:1px solid var(--line);padding:8px;font-size:13px;border-radius:4px}.row b{display:block;font-size:13px}.row .sub{color:var(--mute);font-size:12px}.row button{font-size:12px;padding:8px 10px;min-height:40px}.row .btns{display:flex;gap:4px}.scene{display:grid;gap:8px;background:var(--night);border:2px solid var(--line);padding:12px;border-radius:6px}.scene .who{font-size:12px;color:var(--key)}.scene p{margin:0;font-size:14px}.result{display:grid;gap:6px}.result .num{font-family:var(--ui);font-size:16px;color:var(--gold)}.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin:6px 0}.grid3 button{font-size:13px;padding:8px 4px}.toast{position:fixed;left:50%;top:38%;transform:translate(-50%);font-family:var(--ui);font-size:20px;color:var(--gold);text-shadow:0 2px 0 #000;z-index:30;pointer-events:none;animation:toast .9s ease-out forwards}@keyframes toast{0%{opacity:0;transform:translate(-50%,10px)}20%{opacity:1}to{opacity:0;transform:translate(-50%,-20px)}}textarea{width:100%;min-height:70px;background:var(--night);color:var(--ink);border:1px solid var(--line);font-size:13px}@media(prefers-reduced-motion:reduce){.toast,.modal .box{animation:none}}.picks{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.picks .pick{aspect-ratio:3/4;min-height:96px;font-size:24px;background:var(--night);border:2px solid var(--line);display:grid;place-content:center;gap:4px;padding:6px}.picks .pick.chosen{background:#7a5a1a;color:#fff}.picks .pick b{display:block;font-size:14px}.picks .pick .sub{display:block;font-size:12px;color:var(--mute)}.picks .pick.chosen .sub{color:#f1e9d6}.skin .modal .box{border:14px solid transparent;border-bottom:0;border-image:var(--ui-panel) 16 fill stretch;border-radius:0;padding:4px 6px calc(10px + env(safe-area-inset-bottom,0px))}.skin .dlg,.skin .scene{border:14px solid transparent;border-image:var(--ui-dialog) 20 fill stretch;padding:2px 4px;border-radius:0}.skin .card{border:8px solid transparent;border-image:var(--ui-card) 16 fill stretch;padding:0 2px;border-radius:0}.skin button.primary,.skin .skills button,.skin .row3 button,.skin .path button,.skin .spot,.skin .picks .pick{border:8px solid transparent;border-image:var(--ui-button) 8 fill stretch;border-radius:0}.skin .modal .box,.skin .dlg,.skin .scene,.skin .card,.skin button,.skin .village,.skin .mapwrap{image-rendering:pixelated}