:root{--bg: #0b0d0c;--panel: rgba(16, 18, 17, .92);--line: #2c302d;--ink: #e8e2d6;--muted: #9a958b;--brick: #c2412d;--gold: #f0c040;--hp: #c2412d;--xp: #d8a23a;--hunger: #8a6a3a;--thirst: #3a7aa8;--sat: env(safe-area-inset-top, 0px);--sar: env(safe-area-inset-right, 0px);--sab: env(safe-area-inset-bottom, 0px);--sal: env(safe-area-inset-left, 0px);--r-common: #9ca3af;--r-uncommon: #4ade80;--r-rare: #60a5fa;--r-epic: #c084fc;--r-legendary: #fb923c;--r-mythic: #f43f5e}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{margin:0;height:100%;background:var(--bg);color:var(--ink);overflow:hidden;font:14px/1.4 system-ui,-apple-system,Segoe UI,Roboto,sans-serif;overscroll-behavior:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;touch-action:none}#game{position:fixed;inset:0}#ui{position:fixed;inset:0;pointer-events:none}#ui>*{pointer-events:auto}button{font:inherit;color:inherit;cursor:pointer}input{font:inherit;user-select:text;-webkit-user-select:text}.screen{position:absolute;inset:0;overflow:auto;touch-action:pan-y;display:flex;flex-wrap:wrap;gap:16px;align-items:center;justify-content:center;align-content:center;padding:calc(16px + var(--sat)) calc(16px + var(--sar)) calc(16px + var(--sab)) calc(16px + var(--sal));background:radial-gradient(ellipse at 50% 30%,#1d1412 0%,var(--bg) 70%)}.logo{width:100%;text-align:center;font-weight:900;font-size:clamp(32px,7vw,64px);letter-spacing:.08em}.logo span{color:var(--ink)}.logo b{color:var(--brick);margin-left:.3em}.card{width:min(360px,100%);background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:18px;display:flex;flex-direction:column;gap:10px}.card.wide{width:min(520px,100%)}.card h2{margin:0 0 4px;font-size:16px;letter-spacing:.04em;text-transform:uppercase;color:var(--muted)}.card input{background:#0e100f;border:1px solid var(--line);border-radius:8px;padding:12px;color:var(--ink);min-height:44px}.primary{background:var(--brick);border:0;border-radius:8px;padding:12px;font-weight:700;min-height:44px}.primary:disabled{opacity:.5}.link{background:none;border:0;color:var(--muted);text-decoration:underline;padding:8px}.error{color:#ff8a7a;min-height:1em;font-size:13px}.char{display:flex;justify-content:space-between;align-items:center;background:#151816;border:1px solid var(--line);border-radius:8px;padding:12px;min-height:52px;text-align:left}.char span{color:var(--muted);font-size:12px}.profs{display:flex;flex-wrap:wrap;gap:6px}.prof{background:#151816;border:1px solid var(--line);border-radius:18px;padding:8px 12px;min-height:40px}.prof.on{border-color:var(--brick);background:#2a1612}.desc{color:var(--muted);font-size:13px;margin:0;min-height:3em}.attribution{width:100%;text-align:center;color:#5d5a54;font-size:11px}.hud-top{position:absolute;top:calc(8px + var(--sat));left:calc(8px + var(--sal));right:calc(8px + var(--sar));display:flex;gap:10px;align-items:flex-start;pointer-events:none}.hud-top>*{pointer-events:auto}.vitals{width:min(260px,38vw);display:flex;flex-direction:column;gap:4px}.vitals .row{display:flex;gap:6px;align-items:center}.vitals .small .bar{height:12px;flex:1}.level{width:30px;height:30px;border-radius:50%;background:var(--panel);border:2px solid var(--xp);display:grid;place-items:center;font-weight:800;font-size:13px;flex:none}.bar{position:relative;height:18px;flex:1;background:#0009;border:1px solid var(--line);border-radius:4px;overflow:hidden}.bar i{position:absolute;inset:0 auto 0 0;transition:width .2s}.bar em{position:relative;font-style:normal;font-size:11px;padding-left:6px;line-height:16px;text-shadow:0 1px 2px #000}.bar.hp i{background:var(--hp)}.bar.xp{height:8px}.bar.xp i{background:var(--xp)}.bar.xp em{display:none}.bar.hunger i{background:var(--hunger)}.bar.thirst i{background:var(--thirst)}.bar.hunger em,.bar.thirst em{font-size:9px;line-height:10px}.street{flex:1;text-align:center;color:var(--ink);font-weight:600;text-shadow:0 1px 3px #000;padding-top:4px;font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.top-right{display:flex;flex-direction:column;align-items:flex-end;gap:6px}.net{font-size:11px;padding:2px 8px;border-radius:10px;background:var(--panel)}.net.online{color:#7ed37e}.net.offline{color:#ff8a7a}.net.connecting{color:var(--gold)}.minimap-wrap{width:112px;height:112px;border-radius:50%;overflow:hidden;border:2px solid var(--line);background:#050606}.minimap{width:160px;height:160px;margin:-24px;transform:rotate(45deg) scaleY(.7);image-rendering:pixelated}.target{position:absolute;top:calc(52px + var(--sat));left:50%;transform:translate(-50%);background:var(--panel);border:1px solid var(--line);border-radius:6px;padding:4px 10px;display:none;min-width:160px;text-align:center}.target b{display:block;font-size:12px}.target span{display:block;height:4px;background:#000}.target span i{display:block;height:100%;background:var(--hp)}.stick-zone{position:absolute;left:0;bottom:0;width:45vw;height:65vh;touch-action:none}body.mouse .stick-zone{display:none}.stick-base{position:fixed;width:120px;height:120px;margin:-60px 0 0 -60px;border-radius:50%;border:2px solid rgba(232,226,214,.25);background:#00000040;opacity:0;transition:opacity .15s}.stick-base.on{opacity:1}.stick-knob{position:absolute;left:35px;top:35px;width:50px;height:50px;border-radius:50%;background:#e8e2d68c}.actions{position:absolute;right:calc(12px + var(--sar));bottom:calc(12px + var(--sab));display:grid;grid-template-columns:repeat(3,56px);grid-template-rows:repeat(2,56px);gap:8px}.act{border-radius:50%;border:2px solid var(--line);background:var(--panel);font-size:11px;font-weight:700;display:grid;place-items:center;touch-action:manipulation}.act:active{transform:scale(.92);border-color:var(--brick)}.act.big{grid-row:span 2;border-radius:28px;background:#3a1712;border-color:var(--brick);font-size:14px}body.mouse .actions{grid-template-columns:repeat(6,56px);grid-template-rows:56px}body.mouse .act.big{grid-row:auto}.chat{position:absolute;left:calc(8px + var(--sal));bottom:calc(8px + var(--sab));width:min(380px,50vw);display:flex;flex-direction:column;gap:4px;pointer-events:none}.chat-log{max-height:26vh;overflow:hidden;font-size:12px;text-shadow:0 1px 2px #000}.chat-log b{color:var(--gold)}.chat-log .sys{color:var(--muted);font-style:italic}.chat-input{display:none;pointer-events:auto;background:var(--panel);border:1px solid var(--line);border-radius:6px;padding:10px;color:var(--ink)}.chat.open .chat-input{display:block}.chat.open .chat-log{overflow:auto;pointer-events:auto}.panel{position:absolute;top:calc(8px + var(--sat));bottom:calc(8px + var(--sab));left:50%;transform:translate(-50%);width:min(720px,calc(100vw - 16px - var(--sal) - var(--sar)));background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:12px 14px;overflow:auto;touch-action:pan-y;z-index:5}.panel header{display:flex;justify-content:space-between;align-items:center;position:sticky;top:-12px;background:var(--panel)}.panel h2{margin:0;font-size:15px;text-transform:uppercase;letter-spacing:.06em;color:var(--muted)}.close{width:44px;height:44px;border:0;background:none;font-size:20px}.inv{display:flex;gap:14px}.equip{display:grid;grid-template-columns:repeat(2,76px);gap:6px;align-content:start}.bag{flex:1}.weight{color:var(--muted);font-size:12px;margin-bottom:6px}.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(60px,1fr));gap:6px}.slot{position:relative;min-height:60px;border:1px solid var(--line);border-radius:6px;background:#0e100f;padding:4px;font-size:10px;overflow:hidden;touch-action:none}.slot.empty small{color:#555}.slot .name{display:block;line-height:1.15}.slot .qty{position:absolute;right:4px;bottom:2px;font-weight:800}.slot .dur{position:absolute;left:0;bottom:0;height:2px;background:#7ed37e}.slot.picked{outline:2px solid var(--gold)}.r-common{border-color:var(--r-common)}.r-uncommon{border-color:var(--r-uncommon)}.r-rare{border-color:var(--r-rare)}.r-epic{border-color:var(--r-epic)}.r-legendary{border-color:var(--r-legendary)}.r-mythic{border-color:var(--r-mythic)}.hint{color:var(--muted);font-size:12px}.quest{border-bottom:1px solid var(--line);padding:8px 0}.quest h3{margin:0 0 4px;font-size:15px}.quest small{color:var(--brick)}.quest p{color:var(--muted);margin:4px 0}.quest li.done{color:#7ed37e;text-decoration:line-through}.toasts{position:absolute;top:calc(70px + var(--sat));right:calc(130px + var(--sar));display:flex;flex-direction:column;align-items:flex-end;gap:4px;pointer-events:none}.toast{background:var(--panel);border-left:3px solid var(--muted);padding:6px 10px;border-radius:4px;font-size:12px;transition:opacity .4s,transform .4s}.toast.good{border-color:#7ed37e}.toast.bad{border-color:var(--brick)}.toast.out{opacity:0;transform:translate(20px)}.death{position:absolute;inset:0;display:none;place-content:center;text-align:center;background:radial-gradient(ellipse,#5000008c,#000000e6);z-index:10}.death.on{display:grid}.death h1{font-size:48px;letter-spacing:.2em;color:var(--brick);margin:0}#rotate-hint{display:none}@media (orientation: portrait) and (max-width: 600px){body.touch #rotate-hint{display:grid;position:fixed;inset:0;place-items:center;background:var(--bg);z-index:100;font-size:18px;color:var(--muted)}}@media (max-height: 420px){.actions{grid-template-columns:repeat(3,48px);grid-template-rows:repeat(2,48px)}.vitals{width:200px}.bar{height:14px}.bar em{line-height:12px;font-size:10px}}