:root{--gold: #d9b25a;--gold-dim: #8a7440;--panel: rgba(18, 22, 32, .82);--panel-border: rgba(217, 178, 90, .35);--text: #e8e2d0;--text-dim: #a89c82;--hp: #c9504a;--mana: #4a7fe0;--xp: #9a6ad9;--energy: #d9c25a;--green: #3fae5a;font-size:15px}@media(max-width:700px){#ui #player-frame{top:10px;left:10px;gap:6px}#ui #pf-portrait{width:38px;height:42px;font-size:24px}#ui #pf-info{width:132px}#ui .pf-name-row{font-size:10px;gap:4px}#ui #minimap-mount{top:10px;right:10px;width:108px;height:108px}#ui #minimap,#ui #minimap canvas{width:108px!important;height:108px!important}#ui #compass{top:94px;left:28px;width:32px;height:32px}#ui #target-frame{top:140px;width:170px}#ui #quest-tracker{top:130px;right:10px;width:150px;font-size:11px}#ui #hotbar{bottom:62px;gap:4px;padding:6px;border-radius:6px}#ui #hotbar .slot{width:44px;height:44px;font-size:22px;border-radius:4px}#ui #chat{left:10px;bottom:124px;width:calc(100% - 20px)}#ui #chat-log{height:62px;font-size:11px;background:#12161999}#ui #chat-input{font-size:12px;padding:6px 8px}#ui #corner-buttons{bottom:10px;left:10px;right:10px;display:grid;grid-template-columns:repeat(4,1fr);gap:4px}#ui .corner-btn{min-height:38px;padding:4px 2px;font-size:10px;border-radius:4px}#ui #gold-display{position:absolute;right:4px;top:-30px;font-size:11px}#ui .modal-panel{max-width:calc(100vw - 24px);max-height:calc(100dvh - 40px);overflow:auto}#ui #create-screen{justify-content:flex-start;padding:18px 12px}#ui #create-screen .title{font-size:34px;letter-spacing:0}#ui #create-screen .subtitle{font-size:11px;letter-spacing:0}#ui .create-panel{padding:14px;max-width:100%}#ui .card{flex-basis:120px}}*{box-sizing:border-box}#ui{position:fixed;inset:0;pointer-events:none;color:var(--text);font-family:Segoe UI,system-ui,sans-serif}#ui .layer{position:absolute}#create-screen{position:absolute;inset:0;pointer-events:auto;display:flex;flex-direction:column;align-items:center;justify-content:center;background:radial-gradient(ellipse at 30% 20%,rgba(90,110,160,.25),transparent 60%),linear-gradient(180deg,#141a26,#1b2333 55%,#12151f);overflow-y:auto;padding:24px}#create-screen .title{font-family:Georgia,Times New Roman,serif;font-size:54px;letter-spacing:6px;color:var(--gold);text-shadow:0 3px 0 #3a2f12,0 0 30px rgba(217,178,90,.35);margin-bottom:4px}#create-screen .subtitle{color:var(--text-dim);font-size:14px;letter-spacing:3px;margin-bottom:28px}.create-panel{background:var(--panel);border:1px solid var(--panel-border);border-radius:10px;padding:22px 26px;width:860px;max-width:96vw;box-shadow:0 10px 40px #00000080}.create-row{margin-bottom:18px}.create-row label{display:block;font-size:12px;letter-spacing:2px;color:var(--gold);margin-bottom:8px;text-transform:uppercase}.card-row{display:flex;gap:8px;flex-wrap:wrap}.card{flex:1 1 150px;background:#ffffff0a;border:1px solid rgba(255,255,255,.08);border-radius:8px;padding:10px 12px;cursor:pointer;text-align:left;transition:all .12s ease}.card:hover{background:#ffffff14}.card.selected{border-color:var(--gold);background:#d9b25a1f;box-shadow:0 0 12px #d9b25a40}.card .card-icon{font-size:26px}.card .card-name{font-weight:700;color:var(--text)}.card .card-sub{font-size:12px;color:var(--text-dim)}.card .card-desc{font-size:11px;color:var(--text-dim);margin-top:4px;line-height:1.3}.name-input{width:100%;background:#ffffff0d;border:1px solid rgba(255,255,255,.12);border-radius:6px;color:var(--text);padding:10px 12px;font-size:16px;outline:none}.name-input:focus{border-color:var(--gold)}.start-btn{width:100%;margin-top:6px;padding:14px;font-size:16px;letter-spacing:3px;font-weight:700;background:linear-gradient(180deg,#e6c470,#b98a3a);color:#241a08;border:1px solid #8a6a2a;border-radius:8px;cursor:pointer;transition:transform .1s ease}.start-btn:hover{transform:translateY(-1px)}.start-btn:disabled{opacity:.45;cursor:not-allowed;transform:none}.summary-line{text-align:center;color:var(--text-dim);font-size:13px;margin-bottom:10px;min-height:18px}#hud{display:none;pointer-events:none}#player-frame{position:absolute;top:14px;left:14px;display:flex;gap:10px;align-items:flex-start}#pf-portrait{width:52px;height:52px;border-radius:6px;border:2px solid var(--gold-dim);background:#1a2030;font-size:30px;display:flex;align-items:center;justify-content:center}#pf-info{width:190px}.pf-name-row{display:flex;justify-content:space-between;font-size:12px;margin-bottom:3px;color:var(--text)}.bar{height:14px;border-radius:4px;background:#0000008c;border:1px solid rgba(255,255,255,.12);overflow:hidden;position:relative;margin-bottom:4px}.bar-fill{height:100%;transition:width .15s ease}.bar-text{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;text-shadow:0 1px 2px rgba(0,0,0,.8)}.bar-hp .bar-fill{background:linear-gradient(180deg,#e06a5a,#a83828)}.bar-mana .bar-fill{background:linear-gradient(180deg,#6a9ff0,#3a5fb0)}.bar-energy .bar-fill{background:linear-gradient(180deg,#e6c95a,#a88a2a)}.bar-xp{height:8px}.bar-xp .bar-fill{background:linear-gradient(180deg,#b58ae8,#7a52b0)}.bar-stamina{height:6px;margin-top:-2px}.bar-stamina .bar-fill{background:linear-gradient(180deg,#e6d27a,#b8962a)}.bar-stamina .bar-text{font-size:9px}#target-frame{position:absolute;top:14px;left:50%;transform:translate(-50%);display:none;width:220px;text-align:center}#tf-name{font-size:13px;font-weight:700;text-shadow:0 1px 3px #000}#tf-bar{margin-top:3px;height:12px}#hotbar{position:absolute;bottom:16px;left:50%;transform:translate(-50%);display:flex;gap:6px;padding:8px;background:var(--panel);border:1px solid var(--panel-border);border-radius:10px}.slot{width:52px;height:52px;border-radius:8px;background:#ffffff0d;border:1px solid rgba(255,255,255,.14);position:relative;display:flex;align-items:center;justify-content:center;font-size:24px}.slot .key{position:absolute;top:2px;left:5px;font-size:10px;color:var(--text-dim)}.slot .cost{position:absolute;bottom:2px;right:5px;font-size:10px;color:var(--mana)}.slot .cooldown{position:absolute;inset:0;background:#0a0c12c7;border-radius:8px;display:none;align-items:center;justify-content:center;font-size:13px;font-weight:700}.slot.ready .cooldown{display:none}.slot.oncd .cooldown{display:flex}.slot.nomana{filter:brightness(.5)}#quest-tracker{position:absolute;top:228px;right:14px;width:250px}#buff-bar{position:absolute;top:86px;left:14px;display:flex;gap:4px;pointer-events:none}.buff{width:30px;height:30px;border-radius:6px;display:flex;align-items:center;justify-content:center;font-size:16px;border:1px solid rgba(255,255,255,.25)}.buff-up{background:#3ca05a80;border-color:#3cc86499}.buff-down{background:#a03c3c80;border-color:#dc5a5a99}#compass{position:absolute;top:74px;left:50%;transform:translate(-50%);width:40px;height:40px;border-radius:50%;background:var(--panel);border:1px solid var(--panel-border);display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .2s ease;pointer-events:none;box-shadow:0 4px 14px #0006}#compass-arrow{font-size:18px;color:var(--gold);line-height:1}#compass-label{position:absolute;bottom:-18px;left:50%;transform:translate(-50%);font-size:10px;color:var(--text-dim);white-space:nowrap}#minimap-mount{position:absolute;top:14px;right:14px;width:200px;height:200px;pointer-events:none}#minimap{top:0!important;right:0!important}#toasts{position:absolute;top:130px;left:50%;transform:translate(-50%);display:flex;flex-direction:column;align-items:center;gap:6px;pointer-events:none;z-index:15}.toast{background:var(--panel);border:1px solid var(--panel-border);border-left:3px solid var(--gold);border-radius:6px;padding:8px 16px;font-size:13px;box-shadow:0 4px 16px #00000080;animation:toastin .25s ease-out;max-width:420px;text-align:center}.toast.out{opacity:0;transform:translateY(-8px);transition:all .4s ease}@keyframes toastin{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.shop-row{display:flex;align-items:center;gap:8px;padding:8px 6px;border-bottom:1px solid rgba(255,255,255,.08)}.shop-row:last-child{border-bottom:none}.shop-icon{font-size:20px}.shop-name{flex:0 0 auto;font-weight:700}.shop-stat{flex:1;font-size:11px;color:var(--text-dim)}.shop-price{color:var(--gold);font-weight:700;min-width:40px;text-align:right}.sell-chip{position:absolute;bottom:0;right:0;font-size:10px;line-height:1;padding:2px 4px;border-radius:4px 0 0;border:none;background:#b48c3ce6;color:#241a08;font-weight:800;cursor:pointer}.sell-chip:hover{background:var(--gold)}.settings-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:8px 0;border-bottom:1px solid rgba(255,255,255,.08)}.settings-row label{color:var(--text-dim)}.settings-row input[type=range]{flex:1}#death-overlay{position:absolute;inset:0;display:none;align-items:center;justify-content:center;background:radial-gradient(ellipse at center,#3c0a0a66,#05050ab3);z-index:30;pointer-events:auto}#death-overlay.open{display:flex}.death-panel{background:var(--panel);border:1px solid var(--panel-border);border-radius:10px;padding:22px 30px;text-align:center}.death-title{font-family:Georgia,serif;font-size:22px;color:var(--hp);margin-bottom:14px}#onboarding{position:absolute;inset:0;display:none;align-items:center;justify-content:center;background:#05080ebf;z-index:35;pointer-events:auto}#onboarding.open{display:flex}.onb-panel{background:var(--panel);border:1px solid var(--panel-border);border-radius:12px;padding:24px 30px;max-width:480px;box-shadow:0 14px 50px #0009}.onb-title{font-family:Georgia,serif;font-size:24px;color:var(--gold);margin-bottom:12px}.onb-body{font-size:13px;line-height:1.8;color:var(--text)}.onb-body div{margin-bottom:4px}.onb-quest{display:inline-flex;width:16px;height:16px;border-radius:50%;background:var(--green);color:#142;font-weight:900;align-items:center;justify-content:center}.qd-reward{font-size:11px;color:var(--gold-dim);margin-top:4px}.qt-quest{background:var(--panel);border:1px solid var(--panel-border);border-radius:8px;padding:8px 12px;margin-bottom:6px}.qt-name{font-size:13px;font-weight:700;color:var(--gold)}.qt-obj{font-size:12px;color:var(--text-dim)}.qt-obj.done{color:var(--green)}#chat{position:absolute;bottom:16px;left:16px;width:360px;pointer-events:auto}#chat-log{height:160px;overflow-y:auto;padding:8px 10px;background:var(--panel);border:1px solid var(--panel-border);border-radius:8px 8px 0 0;font-size:13px;scroll-behavior:smooth}#chat-log .line{margin-bottom:3px;line-height:1.35}#chat-log .from{color:var(--gold);font-weight:600}#chat-log .system{color:var(--gold);font-style:italic}#chat-log .combat{color:#e08a5a}#chat-log .quest{color:#a0d96a}#chat-input{width:100%;background:#0a0c12d9;border:1px solid var(--panel-border);border-top:none;color:var(--text);padding:7px 10px;font-size:13px;outline:none;border-radius:0 0 8px 8px}#chat-input:focus{border-color:var(--gold);box-shadow:0 0 8px #d9b25a40}#corner-buttons{position:absolute;bottom:16px;right:16px;display:flex;flex-direction:column;gap:6px;pointer-events:auto}.corner-btn{background:var(--panel);border:1px solid var(--panel-border);color:var(--text);border-radius:8px;padding:8px 14px;font-size:13px;cursor:pointer}.corner-btn:hover{border-color:var(--gold)}#gold-display{text-align:right;font-size:14px;font-weight:700;color:var(--gold)}#nameplates{position:absolute;inset:0;pointer-events:none;overflow:hidden}.nameplate{position:absolute;transform:translate(-50%,-100%);pointer-events:none;text-align:center;min-width:70px;margin-top:-4px}.np-marker{position:absolute;left:50%;top:-20px;transform:translate(-50%);width:20px;height:20px;border-radius:50%;color:#142;font-weight:900;font-size:13px;display:flex;align-items:center;justify-content:center;border:2px solid rgba(255,255,255,.7)}.np-name{font-size:11px;color:#e8e2d0;text-shadow:0 1px 2px #000;white-space:nowrap}.np-bar{width:76px;height:6px;margin:2px auto 0;background:#0009;border-radius:3px;overflow:hidden}.np-fill{height:100%;width:100%;transition:width .15s ease}.np-cast{width:76px;height:5px;margin:2px auto 0;background:#000000a6;border:1px solid rgba(255,90,74,.7);border-radius:3px;overflow:hidden}.np-cast-fill{height:100%;width:100%;background:#ff5a4a}#combat-text{position:absolute;inset:0;pointer-events:none;overflow:hidden}.ct{position:absolute;transform:translate(-50%,-50%);font-weight:800;font-size:17px;text-shadow:0 2px 3px rgba(0,0,0,.8);animation:ctfloat .8s ease-out forwards;will-change:transform,opacity}.ct.crit{font-size:28px;color:#ffd94a;text-shadow:0 0 10px rgba(255,210,74,.65),0 2px 3px rgba(0,0,0,.8);animation:ctpunch 1s ease-out forwards}.ct.hit{color:#ffd9c0}.ct.heal{color:#7ae08a}.ct.miss{color:#b9b9c9}.ct.block{color:#e0c08a}@keyframes ctfloat{0%{opacity:1;transform:translate(-50%,-50%)}to{opacity:0;transform:translate(-50%,-140%)}}@keyframes ctpunch{0%{transform:translate(-50%,-50%) scale(1.8);opacity:1}20%{transform:translate(-50%,-50%) scale(1)}to{transform:translate(-50%,-120%) scale(1);opacity:0}}.modal{position:absolute;inset:0;display:none;align-items:center;justify-content:center;background:#05080e99;pointer-events:auto;z-index:20}.modal.open{display:flex}.modal-panel{width:480px;max-width:92vw;max-height:80vh;overflow-y:auto;background:var(--panel);border:1px solid var(--panel-border);border-radius:10px;padding:18px 22px;box-shadow:0 14px 50px #0009}.modal-title{font-family:Georgia,serif;font-size:20px;color:var(--gold);margin-bottom:4px}.modal-giver{font-size:12px;color:var(--text-dim);margin-bottom:12px}.qd-quest{border:1px solid rgba(255,255,255,.1);border-radius:8px;padding:10px 12px;margin-bottom:8px;background:#ffffff08}.qd-name{font-weight:700;color:var(--text)}.qd-desc{font-size:12px;color:var(--text-dim);margin:4px 0 6px}.qd-btn{padding:6px 14px;border-radius:6px;border:1px solid var(--gold-dim);background:linear-gradient(180deg,#d9b25a,#a8843a);color:#241a08;font-weight:700;font-size:13px;cursor:pointer;margin-right:6px}.qd-btn.alt{background:linear-gradient(180deg,#5a6a8a,#3a4a66);color:#dce4f0;border-color:#5a6a8a}.grid{display:grid;grid-template-columns:repeat(4,52px);gap:6px;margin-top:8px}.slot-box{width:52px;height:52px;border-radius:8px;background:#ffffff0d;border:1px solid rgba(255,255,255,.14);display:flex;align-items:center;justify-content:center;font-size:22px;cursor:pointer;position:relative}.slot-box:hover{border-color:var(--gold)}.slot-box .qty{position:absolute;bottom:1px;right:4px;font-size:10px;color:var(--text-dim)}.slot-box.equipped{border-color:var(--gold)}.slot-box.empty{color:#555}.char-stats{font-size:13px;line-height:1.6}.char-stats b{color:var(--gold)}#hint{display:none;position:absolute;bottom:92px;left:50%;transform:translate(-50%);font-size:12px;color:var(--text-dim);text-shadow:0 1px 3px #000}#conn-banner{position:absolute;top:60px;left:50%;transform:translate(-50%);background:#a03228e6;padding:6px 16px;border-radius:6px;font-size:13px;display:none;z-index:40}