*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#090e11;color:#eee8da;font-family:'Malgun Gothic',system-ui,sans-serif}button{font:inherit;color:inherit;cursor:pointer;touch-action:none;border:1px solid #8c846254;background:#142221ed;border-radius:4px;transition:background .15s, border-color .15s}button:hover{background:#2d3b32;border-color:#d8b972}button:focus-visible{outline:2px solid #eed5a0;outline-offset:3px}button:disabled{opacity:.45;cursor:default}button:active,[data-input].held{background:#5a6540}kbd{font:10px monospace;opacity:.45;margin-left:5px}#game{position:relative;width:100%;height:100dvh;overflow:hidden;touch-action:none;user-select:none}canvas{width:100%;height:100%;display:block;image-rendering:pixelated}[hidden]{display:none!important}#hud{position:absolute;inset:0;pointer-events:none}#hud button{pointer-events:auto}.vitals{position:absolute;top:max(22px,env(safe-area-inset-top));left:max(24px,env(safe-area-inset-left));display:flex;gap:12px;align-items:center;width:265px;filter:drop-shadow(0 2px 8px #000)}.vitals>div{flex:1}.level{display:grid;place-items:center;width:42px;height:48px;background:#162923;border:1px solid #c0a775;font-family:Georgia,serif;font-size:22px}.character-name{display:flex;justify-content:space-between;font-size:12px;margin-bottom:6px;color:#e4ddbf}.character-name span{color:#e9c981;font-size:11px}.meter{position:relative;height:12px;border:1px solid #c2be9a38;background:#101414cf;margin-top:4px;overflow:hidden}.meter i{display:block;height:100%;width:100%;transition:width .18s;background:#a4504b}.meter span{position:absolute;inset:0;text-align:center;font:9px/10px system-ui}.mana{height:9px}.mana i{background:#6b9eaf}.mana span{font-size:8px;line-height:8px}.xp{height:3px;border:0}.xp i{background:#d3bd7f}.location{position:absolute;top:23px;left:50%;transform:translateX(-50%);text-align:center;display:grid;gap:5px;text-shadow:0 2px 4px #000}.location small{font-size:9px;letter-spacing:3px;color:#c4b38b}.location strong{font-family:Georgia,'Malgun Gothic',serif;font-size:20px;font-weight:400}.location>span{font-size:11px;color:#c8cfc2}.tools{position:absolute;right:max(24px,env(safe-area-inset-right));top:24px;display:flex;gap:6px}.tools button{padding:9px 12px;font-size:12px}#toast{position:absolute;bottom:85px;left:50%;transform:translateX(-50%);max-width:70%;padding:12px 20px;border-top:1px solid #c0a77550;color:#f7e5b8;text-shadow:0 2px 4px #000;background:linear-gradient(90deg,transparent,#102020ea,transparent);text-align:center;font-size:13px;opacity:0;transition:opacity .25s}#toast.show{opacity:1}#interact{position:absolute;bottom:130px;left:50%;transform:translateX(-50%);padding:10px 20px;font-size:12px;border-color:#ac996e}.desktop-controls{position:absolute;bottom:20px;width:100%;text-align:center;font-size:11px;letter-spacing:.4px;color:#acb6ab}.desktop-controls b{margin:0 12px;color:#637367}#boss-hud{position:absolute;top:95px;left:50%;transform:translateX(-50%);width:min(440px,48%);text-align:center;text-shadow:0 2px 3px #000}#boss-hud small{display:block;font-size:9px;letter-spacing:2px;color:#c6ab91}#boss-hud strong{font-size:17px;font-weight:400}.boss{height:8px;margin:7px 0}.boss i{background:#ab5a50}#boss-intent{font-size:11px;color:#f3c9a2}.screen{position:absolute;inset:0;display:flex;align-items:center;padding:6vw;background:linear-gradient(90deg,#081718ef 0%,#091816bf 38%,#09161610 75%)}.title-content{width:470px}.eyebrow{font-size:12px;letter-spacing:4px;color:#b8c7b1}h1{font-family:Georgia,serif;font-size:clamp(52px,7vw,100px);font-weight:400;letter-spacing:3px;margin:16px 0 10px;line-height:1}h1 em{font-style:normal;color:#d2b67a}.subtitle{display:flex;align-items:center;gap:18px;letter-spacing:8px;color:#d1b77f;font-size:16px}.subtitle span{width:25px;height:1px;background:#d1b77f80}.title-content p{font-size:14px;line-height:2.1;color:#b5c2b7;margin:28px 0}.primary{padding:16px 35px;border-color:#c7a969;background:#384333;letter-spacing:2px;min-width:225px}.title-content #load-status{display:block;font-size:10px;color:#839689;margin-top:12px}footer{position:absolute;bottom:25px;left:6vw;right:4vw;display:flex;justify-content:space-between;font-size:10px;letter-spacing:2px;color:#859388}#modal-backdrop{position:absolute;inset:0;display:grid;place-items:center;background:#040a0bbd;backdrop-filter:blur(5px);padding:18px;z-index:10}#modal{width:min(720px,92%);max-height:92%;overflow:auto;background:#132020;border:1px solid #8f86604f;box-shadow:0 25px 120px #000b;padding:26px;border-radius:6px}#modal header{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #abb28525;padding-bottom:16px;margin-bottom:18px}#modal-kicker{font-size:9px;letter-spacing:3px;color:#b5a376}h2{font-size:24px;font-weight:400;margin:7px 0 0}#modal-close{width:34px;height:34px}#modal-body{font-size:13px;line-height:1.8;color:#b9c8be}#modal-body p{margin:10px 0 20px}.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.item-card{padding:16px;background:#0c1617;border:1px solid #b1b28926;border-radius:4px}.item-card img{width:64px;height:64px;object-fit:contain}.item-card h3{font-size:14px;color:#e9dfc4;margin:5px 0}.item-card small{display:block;color:#8c9d91}.item-card button{width:100%;padding:9px 5px;margin-top:10px;font-size:12px}.good{color:#9ac890}.item-card.selected{border-color:#bca570}.row-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:20px}.row-actions button{padding:10px 20px}.stats{display:flex;gap:25px;color:#d7cba8;margin:10px 0 20px}.journal-entry{padding:10px 0;border-bottom:1px solid #bbc5a21c}.journal-entry h3{color:#d4c19b;font-weight:400;margin:2px 0}.muted{color:#82968d}#rotate{display:none}#touch-controls{display:none;position:absolute;inset:0;pointer-events:none}#touch-controls button{border-radius:50%;background:#1528249c;border-color:#acb99b59;font-size:12px;color:#e1e7d5;backdrop-filter:blur(3px);width:58px;height:58px}#touch-controls button.held{background:#8895659c}.movement{position:absolute;bottom:max(18px,env(safe-area-inset-bottom));left:max(22px,env(safe-area-inset-left));display:flex;gap:12px}.actions{position:absolute;right:max(22px,env(safe-area-inset-right));bottom:max(18px,env(safe-area-inset-bottom));display:flex;gap:10px;align-items:end}#touch-controls .actions .small{width:44px;height:44px;font-size:10px}#touch-controls .actions .attack{width:72px;height:72px;border-color:#ccb375;background:#74744169}#touch-controls span{font-size:9px;color:#d1b77f}.touch #touch-controls{display:block}.touch .desktop-controls{display:none}.touch kbd{display:none}.touch #toast{bottom:100px}.touch #interact{bottom:90px}
@media(max-height:520px){.vitals{top:12px;left:max(16px,env(safe-area-inset-left));width:210px;gap:8px}.level{width:34px;height:40px;font-size:18px}.character-name{font-size:10px}.location{top:12px;gap:3px}.location strong{font-size:16px}.location>span{font-size:9px}.location small{font-size:8px}.tools{top:12px;right:max(14px,env(safe-area-inset-right))}.tools button{padding:8px;font-size:11px}#boss-hud{top:68px;width:36%}#boss-hud strong{font-size:14px}.screen{padding:4vw}.eyebrow{font-size:10px}h1{font-size:54px;margin:12px 0}.subtitle{font-size:12px}.title-content p{font-size:12px;margin:15px 0;line-height:1.8}.primary{padding:12px 25px}.title-content #load-status{font-size:9px}footer{bottom:12px;font-size:8px}#modal{padding:18px;max-height:96%}#modal header{padding-bottom:10px;margin-bottom:10px}h2{font-size:21px}.item-card{padding:10px}.item-card img{width:46px;height:46px}.item-card h3{font-size:12px}.item-card small{font-size:10px}#modal-body p{margin:7px 0 12px}.stats{margin:6px 0 10px}.item-card button{padding:6px}#toast{font-size:11px}.desktop-controls{font-size:9px;bottom:12px}.desktop-controls b{margin:0 6px}}
#online{position:absolute;right:max(24px,env(safe-area-inset-right));top:67px;font-size:10px;letter-spacing:1px;color:#a0bfad;text-shadow:0 2px 4px #000}#chat{position:absolute;left:max(24px,env(safe-area-inset-left));bottom:52px;width:265px;pointer-events:auto}#chat-log{max-height:74px;overflow:auto;font-size:10px;line-height:1.7;text-shadow:0 1px 3px #000;background:#0b17182b}#chat-log b{color:#9dceb9;font-weight:400}#chat-form{display:flex;gap:3px}#chat-input{min-width:0;flex:1;background:#0c1b1c7d;border:1px solid #abb79725;color:#ddd8c3;padding:7px;font:10px system-ui;border-radius:3px;user-select:text;touch-action:manipulation}#chat-form button{padding:0 10px;font-size:12px}.touch #chat{bottom:100px;width:190px}.touch #chat-log{max-height:42px}.touch #chat-input{font-size:16px;padding:4px;transform-origin:left center}.touch #chat-form{opacity:.7}#chat:focus-within #chat-form{opacity:1}.touch #chat-log{font-size:9px}@media(max-height:520px){#online{top:52px;right:max(14px,env(safe-area-inset-right));font-size:9px}#chat{width:220px;bottom:40px}.touch #chat{bottom:88px;width:170px}.touch #chat-log{max-height:32px}#chat-input{padding:5px}}@media(orientation:portrait) and (max-width:800px){#rotate{display:flex;position:absolute;inset:0;z-index:20;background:#0c191af5;align-items:center;justify-content:center;flex-direction:column;text-align:center;padding:24px}#rotate>span{font-size:64px;color:#c9ae70}#rotate h2{font-size:22px}#rotate p{font-size:13px;color:#a8bcae}}