:root{--gold:#c9a45c;--gold-dim:#6e5a34;--ink:#0d0b0a;--panel:#120f0df0;--text:#d8d2c4;--dim:#8c8474;--serif:"Noto Serif TC", "Source Han Serif TC", "PMingLiU", serif;--sans:"Microsoft JhengHei", "Noto Sans TC", system-ui, sans-serif;--frame:url(/ui/frame.webp);--socket:url(/ui/socket.webp);--leather:url(/ui/leather.webp);--divider:url(/ui/divider.webp);--rarity-normal:#b8b0a0;--rarity-magic:#6f8cff;--rarity-rare:#f2d24b}*{box-sizing:border-box}html,body{height:100%;color:var(--text);font-family:var(--sans);-webkit-user-select:none;user-select:none;background:#000;margin:0;font-size:14px;overflow:hidden}#game{width:100%;height:100%;display:block;position:fixed;inset:0}#ui{pointer-events:none;position:fixed;inset:0}#ui button{color:inherit;cursor:pointer;font-family:inherit}kbd{font-family:var(--sans);color:var(--dim);font-size:10px}#labels,#floaters{position:absolute;inset:0;overflow:hidden}.label{white-space:nowrap;pointer-events:auto;cursor:pointer;text-shadow:0 1px 2px #000;background:#000000b8;border:1px solid #ffffff14;padding:1px 7px;font-size:13px;position:absolute;top:0;left:0}.label:hover{border-color:var(--gold);background:#3c321ee6}.bubble{color:#2a1a0c;white-space:nowrap;pointer-events:none;opacity:0;background:#faf0dcf2;border:2px solid #8a6a34;border-radius:12px;max-width:260px;padding:6px 12px;font-size:13px;font-weight:700;transition:opacity .2s;position:absolute;top:0;left:0;box-shadow:0 4px 12px #000000b3}.bubble:after{content:"";border:8px solid #0000;border-top-color:#8a6a34;border-bottom:0;margin-left:-8px;position:absolute;bottom:-9px;left:50%}.bubble.show{opacity:1;animation:.25s ease-out bubble-pop}@keyframes bubble-pop{0%{margin-top:8px}to{margin-top:0}}.label.npc,.label.exit{font-family:var(--serif);background:#00000080;border-color:#0000}.floater{text-shadow:0 0 4px #000,0 2px 3px #000;white-space:nowrap;letter-spacing:.02em;font-size:16px;font-weight:800;animation:.9s ease-out forwards float-up;position:absolute;transform:translate(-50%,-50%)}.floater.dmg{color:#fff2d8}.floater.dmg.fire{color:#ff9c4c;text-shadow:0 0 6px #ff5a14b3,0 2px 2px #000}.floater.dmg.cold{color:#9ae4ff;text-shadow:0 0 6px #50b4ffb3,0 2px 2px #000}.floater.dmg.earth{color:#f0b85c;text-shadow:0 0 6px #d28c28b3,0 2px 2px #000}.floater.dmg.physical{color:#f2f6ff}.floater.crit{color:#ffe04a;text-shadow:0 0 12px #ffa014f2,0 2px 3px #000;font-size:25px;animation:.95s ease-out forwards crit-pop}.floater.hurt{color:#ff5a48;font-size:18px}.floater.miss{color:#b8c4d0;font-size:14px}.floater.xp{color:#b9a0ff;font-size:12px;font-weight:400}@keyframes crit-pop{0%{opacity:0;transform:translate(-50%,-30%)scale(.6)}18%{opacity:1;transform:translate(-50%,-65%)scale(1.28)}40%{transform:translate(-50%,-85%)scale(1)}to{opacity:0;transform:translate(-50%,-145%)scale(.95)}}@keyframes float-up{0%{opacity:1;margin-top:0}to{opacity:0;margin-top:-60px}}#hurt-vignette{opacity:0;position:absolute;inset:0;box-shadow:inset 0 0 160px 40px #b400008c}#hurt-vignette.show{animation:.5s ease-out hurt}@keyframes hurt{0%{opacity:1}to{opacity:0}}#zone-name{text-align:center;font-family:var(--serif);letter-spacing:.3em;color:var(--gold);text-shadow:0 0 18px #000,0 2px 4px #000;opacity:0;font-size:40px;position:absolute;top:12%;left:0;right:0}#zone-name.show{animation:3.2s ease-out forwards zone}@keyframes zone{0%{opacity:0;letter-spacing:.6em}15%,70%{opacity:1;letter-spacing:.3em}to{opacity:0}}#target{text-align:center;width:320px;margin-left:-160px;display:none;position:absolute;top:14px;left:50%}#target .name{font-family:var(--serif);text-shadow:0 1px 3px #000;margin-bottom:3px;font-size:16px}#target .name.elite{color:#7f9cff}#target .name.unique{color:#f2c84b}#target .bar{border:1px solid var(--gold-dim);background:#000000bf;height:12px}#target .bar i{background:linear-gradient(#c8301c,#7a1408);height:100%;transition:width .12s;display:block}#quest{color:#e8dcc0;text-shadow:0 1px 3px #000;max-width:280px;font-size:13px;position:absolute;top:14px;left:14px}#quest b{font-family:var(--serif);color:var(--gold);letter-spacing:.2em;font-size:12px;display:block}#log{text-shadow:0 1px 2px #000;flex-direction:column;gap:2px;font-size:13px;display:flex;position:absolute;bottom:170px;left:14px}#log .line{animation:5s forwards log}#log .warn{color:#ff9a70}#log .good{color:#a8e08a}#log .magic{color:#6f8cff}#log .rare{color:#f2d24b}@keyframes log{0%,80%{opacity:1}to{opacity:0}}#minimap{border:2px solid var(--gold-dim);background:#0000008c;border-radius:50%;width:176px;height:176px;position:absolute;top:12px;right:12px}#minimap.large{opacity:.85;background:#00000040;border:none;border-radius:0;width:560px;height:560px;margin:-300px 0 0 -280px;top:50%;left:50%;right:auto}#bottom{z-index:10;pointer-events:auto;align-items:flex-end;gap:14px;padding:0 18px 10px;display:flex;position:absolute;bottom:0;left:50%;transform:translate(-50%)}.globe{background:#0a0808;border:3px solid #1a120a;border-radius:50%;flex:none;width:132px;height:132px;margin:0 8px 10px;position:relative;overflow:hidden;box-shadow:0 0 0 2px #6e5a34,0 0 0 4px #1a120a,0 0 0 5px #c9a45c88,0 6px 24px #000,inset 0 0 26px #000}.globe:after{content:"";pointer-events:none;border-radius:50%;position:absolute;inset:0;box-shadow:inset 0 -12px 26px #000000bf,inset 0 6px 14px #ffffff0f}.globe .fill{transition:height .15s;position:absolute;bottom:0;left:0;right:0}.globe.life .fill{background:radial-gradient(circle at 40% 30%,#ff5a40,#a81408 55%,#4a0600)}.globe.mana .fill{background:radial-gradient(circle at 40% 30%,#6a9cff,#1c3cc0 55%,#081050)}.globe .gloss{background:radial-gradient(circle at 32% 24%,#ffffff47,#0000 38%);border-radius:50%;position:absolute;inset:0}.globe span{text-align:center;text-shadow:0 0 4px #000,0 1px 2px #000;font-size:13px;font-weight:700;position:absolute;top:50%;left:0;right:0;transform:translateY(-50%)}#bar{background:linear-gradient(#0a07058c, #0a0705d9), var(--leather) center / 320px;border:22px solid #0000;border-bottom-width:0;border-image:var(--frame) 46 46 0 / 22px 22px 0 stretch;flex-direction:column;gap:7px;padding:2px 6px 8px;display:flex;position:relative;box-shadow:0 0 26px #000000e6}#xp{background:#050302;border:1px solid #6e5a34;height:12px;position:relative;box-shadow:inset 0 1px 4px #000}#xp i{background:linear-gradient(#f0d080,#b88a30 50%,#6a4a10);height:100%;transition:width .3s;display:block;box-shadow:0 0 8px #f0c86480}#xp span{text-align:center;color:#f0e6cc;text-shadow:0 0 2px #000;font-size:10px;line-height:11px;position:absolute;inset:0}#slots{align-items:center;gap:6px;display:flex}#slots .sep{background:var(--gold-dim);width:1px;height:40px;margin:0 4px}.slot{background:var(--socket) center / 100% 100%;border:none;width:52px;height:52px;padding:5px;transition:transform 80ms,filter .15s;position:relative;box-shadow:0 2px 6px #000}.slot .icon,.cell .icon{width:100%;height:100%}.slot .icon svg,.cell .icon svg{width:100%;height:100%;display:block}.icon-img{object-fit:contain;pointer-events:none;width:100%;height:100%;display:block}.slot .icon-img{border-radius:3px;box-shadow:0 0 0 1px #000c}.slot:active{transform:translateY(1px)scale(.97)}.slot kbd{color:#fff;text-shadow:0 0 3px #000,0 0 2px #000;font-weight:700;position:absolute;top:5px;left:7px}.slot b{color:#fff;text-shadow:0 0 3px #000,0 0 2px #000;font-size:13px;position:absolute;bottom:4px;right:7px}.slot:hover{filter:brightness(1.25)}.slot.skill.active{box-shadow:0 0 0 2px #ffd060,0 0 14px #ffc850d9}.slot.skill.active:after{content:"";pointer-events:none;border-radius:3px;position:absolute;inset:5px;box-shadow:inset 0 0 10px #ffd26ebf}.slot.skill.aiming{box-shadow:0 0 0 2px #60d8ff,0 0 16px #60d8fff2}.slot.skill.locked{opacity:.3;filter:grayscale()}.slot.skill .cd-mask{pointer-events:none;background:#000000b8;height:0%;position:absolute;bottom:0;left:0;right:0}.slot.skill .cd-text{color:#ffe4a0;text-shadow:0 1px 3px #000;pointer-events:none;justify-content:center;align-items:center;font-size:15px;font-weight:700;display:flex;position:absolute;inset:0}#buffs{color:#b8e4ff;background:#0c2038d9;border:1px solid #4a8ac8;border-radius:3px;justify-content:center;margin-bottom:4px;padding:2px 10px;font-size:11px;display:none}.skill-tabs{grid-template-columns:repeat(3,1fr);gap:8px;margin:10px 0 8px;display:grid}.skill-tab{font-family:var(--serif);color:#b8a88a;letter-spacing:.08em;cursor:pointer;background:#100c08d9;border:1px solid #4a3824;border-radius:4px;justify-content:center;align-items:center;gap:6px;padding:8px 10px;font-size:14px;transition:border-color .15s,color .15s,background .15s;display:flex}.skill-tab:hover{color:#f0e0c0;border-color:#8a6a38}.skill-tab.active{border-color:var(--gold);color:#ffe8a8;background:linear-gradient(#543618d9,#24160ceb);box-shadow:0 0 12px #e2b86038}.skill-tab .tab-pts{color:#ffd978;background:#d2a03c38;border:1px solid #d2a03c73;border-radius:10px;padding:1px 6px;font-family:sans-serif;font-size:11px}.tree-col.single{background:#00000073;border:1px solid #3c2e1c;border-radius:4px;flex-direction:column;align-items:center;padding:12px 10px;display:flex}.tree-link{background:#3c2e1c;width:2px;height:14px;margin:2px 0}.tree-link.open{background:#c89840;box-shadow:0 0 6px #ffc85a99}.tree-node{background:#18100ad1;border:1px solid #4a3a24;border-radius:4px;grid-template-columns:52px 1fr 28px;align-items:center;gap:10px;width:100%;padding:8px 10px;display:grid}.tree-node .slot{width:52px;height:52px;padding:4px}.tree-node .slot.passive{border-color:#6a8ac8;border-radius:50%}.tree-node.unlearned .slot .icon-img,.tree-node.unlearned .slot .icon{filter:grayscale(.85)brightness(.55)}.tree-node .node-meta{flex-direction:column;gap:3px;min-width:0;display:flex}.tree-node .node-top{justify-content:space-between;align-items:baseline;gap:8px;display:flex}.tree-node .node-name{color:#fff;font-size:14px;font-weight:700;line-height:1.25}.tree-node .node-lv{color:var(--gold);white-space:nowrap;font-size:12px}.tree-node .node-desc{color:#bfb4a0;font-size:12px;line-height:1.35}.tree-node .node-req{color:#ff7a60;font-size:11px}.tt-req{color:#ff7a60;margin:2px 0;font-size:11px}#hud-buttons{justify-content:center;gap:4px;display:flex}.hud-btn{letter-spacing:.1em;background:linear-gradient(#3a2c1c,#1a120b);border:1px solid #6e5a34;border-radius:2px;padding:3px 10px;font-size:12px;box-shadow:inset 0 1px #ffdc962e,0 2px 4px #000;color:#e8d8b0!important}.hud-btn kbd{margin-left:5px}.hud-btn:hover{border-color:var(--gold);background:linear-gradient(#54402a,#24180e);color:#fff!important}.hud-btn.alert{color:#ffd060;border-color:#ffd060;animation:1.2s infinite pulse}@keyframes pulse{50%{box-shadow:0 0 10px #ffc850cc}}.panel{z-index:10;background:linear-gradient(#0c08068c, #080605d1), var(--leather) center / 384px;border:26px solid #0000;border-image:var(--frame) 46 / 26px stretch;pointer-events:auto;flex-direction:column;width:390px;max-height:calc(100% - 250px);padding:0;display:none;position:absolute;top:60px;overflow:hidden;box-shadow:0 0 40px #000,inset 0 0 60px #000c}.panel-body{scrollbar-width:thin;scrollbar-color:#6e5a34 transparent;flex:1;min-height:0;padding:8px 10px 10px;overflow-y:auto}.panel.left{left:24px}.panel.left.skills-wide{width:min(560px,100vw - 36px);max-height:calc(100vh - 145px);top:14px;left:18px}.panel.right{z-index:12;width:480px;max-height:calc(100% - 24px);top:12px;right:16px}.panel h2{font-family:var(--serif);color:#f0d48a;letter-spacing:.25em;text-align:center;text-shadow:0 0 12px #f0b45059,0 2px 2px #000;background:var(--divider) center bottom / 230px auto no-repeat;margin:0 0 6px;padding-bottom:24px;font-size:24px;font-weight:900}.panel h3{font-family:var(--serif);color:var(--gold);letter-spacing:.2em;text-align:center;align-items:center;gap:10px;margin:14px 0 8px;font-size:14px;display:flex}.panel h3:before,.panel h3:after{content:"";background:linear-gradient(90deg,#0000,#8a6a34,#0000);flex:1;height:1px}.panel .close{z-index:3;background:radial-gradient(circle at 40% 35%,#6a1a10,#2a0805);border:1px solid #8a6a34;border-radius:50%;width:26px;height:26px;padding:0;font-size:16px;line-height:22px;position:absolute;top:4px;right:4px;box-shadow:0 2px 4px #000;color:#e8c8a0!important}.panel .close:hover{border-color:var(--gold);background:radial-gradient(circle at 40% 35%,#a02818,#3a0a06);color:#fff!important}.panel .points{text-align:center;color:#e8dcc0;margin-bottom:4px;font-size:13px}.panel .hint{color:var(--dim);text-align:center;margin-top:10px;font-size:12px}.panel .gold{color:#f0d070;text-shadow:0 0 6px #f0c85a59;justify-content:flex-end;align-items:center;gap:6px;margin-top:10px;font-weight:700;display:flex}.panel .gold .icon-img{border-radius:50%;width:22px;height:22px;box-shadow:0 0 0 1px #8a6a34}.plus{background:radial-gradient(circle at 40% 30%,#e8c070,#7a5418 60%,#3a2408);border:1px solid #f0d080;border-radius:50%;width:26px;height:26px;padding:0;font-size:17px;font-weight:900;line-height:1;animation:1.6s ease-in-out infinite plus-glow;box-shadow:0 0 8px #f0c8648c,0 2px 3px #000;color:#1a0e04!important}.plus:hover:not(:disabled){filter:brightness(1.2)}.plus:disabled{opacity:.22;filter:grayscale();box-shadow:none;animation:none;cursor:default!important}@keyframes plus-glow{50%{box-shadow:0 0 14px #ffd26ee6,0 2px 3px #000}}.attr-row{background:linear-gradient(90deg,#0000008c,#281c1066);border:1px solid #4a3a24;border-left:3px solid #8a6a34;grid-template-columns:52px 44px 1fr 28px;align-items:center;gap:8px;margin:5px 0;padding:6px 10px;display:grid;box-shadow:inset 0 0 12px #0009}.attr-row span{font-family:var(--serif);color:#e8d8b0;letter-spacing:.1em}.attr-row b{text-align:center;color:#fff;text-shadow:0 0 6px #ffdc9666;background:#0009;border:1px solid #3a2c1a;border-radius:2px;font-size:18px}.attr-row small{color:var(--dim);font-size:11px}.stat-row{align-items:baseline;gap:6px;padding:3px 6px;font-size:13px;display:flex}.stat-row:nth-child(2n){background:#00000040}.stat-row span{color:#a89c84;white-space:nowrap}.stat-row b{color:#f0e6cc;white-space:nowrap;margin-left:auto}.skill-row{background:linear-gradient(90deg,#0009,#1e140c59);border:1px solid #4a3a24;grid-template-columns:62px 1fr 28px;align-items:center;gap:10px;margin:6px 0;padding:8px 10px 8px 8px;display:grid;box-shadow:inset 0 0 14px #0009}.skill-row .slot{width:62px;height:62px;padding:6px}.skill-row.unlearned .slot .icon-img,.skill-row.unlearned .slot .icon{filter:grayscale(.85)brightness(.55)}.skill-row .title{font-family:var(--serif);color:#fff;letter-spacing:.05em;font-size:16px}.skill-row .pips{gap:3px;margin:4px 0 3px 2px;display:flex}.skill-row .pips i{background:#1a120a;border:1px solid #3a2c1a;width:13px;height:5px;transform:skew(-20deg)}.skill-row .pips i.on{background:linear-gradient(#ffe7a0,#c88a28);border-color:#f0d080;box-shadow:0 0 5px #ffc85ab3}.skill-row .pips i.bonus{background:linear-gradient(#b8d0ff,#4a6ad8);border-color:#a8c0ff;box-shadow:0 0 5px #78a0ffb3}.skill-row .title span{color:var(--gold);font-family:var(--sans);font-size:12px}.skill-row .desc{color:#c8bea8;margin:2px 0;font-size:12px}.skill-row .nums{color:#8fb8e0;font-size:11px}.skill-row .req{color:#ff7a60;font-size:11px}.weapon-tabs{justify-content:center;align-items:center;gap:6px;margin-bottom:10px;display:flex}.weapon-tabs-label{color:#9a8660;letter-spacing:.1em;margin-right:4px;font-size:11px}.weapon-tab{color:#9a8660;cursor:pointer;background:#120e0acc;border:1px solid #4a3a24;border-radius:3px;min-width:34px;padding:3px 10px;font-size:12px}.weapon-tab.active{border-color:var(--gold);color:var(--gold);background:#825f3247}.equip{background:radial-gradient(at 50% 45%,#825f3240,#0000 62%);border-bottom:1px solid #4a3a24;grid-template-rows:repeat(3,58px);grid-template-columns:repeat(4,58px);grid-template-areas:"mainHand helm amulet offHand""mainHand armor ring1 offHand""boots ring2 ring3.";justify-content:center;gap:16px 20px;margin:0 0 12px;padding:4px 0 22px;display:grid;position:relative}.equip .cell{width:58px}.equip .slot-mainHand{aspect-ratio:auto;border:12px solid #0000;border-image:var(--socket) 22 fill / 12px stretch;background:#00000059;grid-area:mainHand;height:100%;padding:0}.equip .slot-offHand{aspect-ratio:auto;border:12px solid #0000;border-image:var(--socket) 22 fill / 12px stretch;background:#00000059;grid-area:offHand;height:100%;padding:0}.equip .slot-helm{grid-area:helm}.equip .slot-armor{grid-area:armor}.equip .slot-boots{grid-area:boots}.equip .slot-amulet{grid-area:amulet}.equip .slot-ring1{grid-area:ring1}.equip .slot-ring2{grid-area:ring2}.equip .slot-ring3{grid-area:ring3}.equip .slot-label{text-align:center;color:#9a8660;letter-spacing:.2em;pointer-events:none;font-size:10px;position:absolute;bottom:-16px;left:-10px;right:-10px}.bag-tabs{gap:4px;margin-bottom:-1px;padding-left:6px;display:flex}.bag-tab{background:linear-gradient(#2a1e12,#120c07);border:1px solid #4a3a24;border-bottom:none;border-radius:4px 4px 0 0;flex:1;padding:4px 0 3px;font-size:14px;position:relative;font-family:var(--serif)!important;color:#a89070!important}.bag-tab small{font-family:var(--sans);color:#7a6a50;margin-left:6px;font-size:10px}.bag-tab:hover{color:#fff!important}.bag-tab.active{z-index:1;background:linear-gradient(#5a4224,#241810);border-color:#c9a45c;box-shadow:0 -2px 8px #f0be5a40;color:#ffe0a0!important}.bag-tab.active small{color:#d8c090}.grid{background:#00000073;border:1px solid #3a2c1a;grid-template-columns:repeat(8,1fr);gap:3px;padding:6px;display:grid;box-shadow:inset 0 0 16px #000}.cell{aspect-ratio:1;background:var(--socket) center / 100% 100%;border:none;padding:4px;position:relative}.cell.item{color:var(--rarity-normal)}.cell.item.magic{color:var(--rarity-magic)}.cell.item.rare{color:var(--rarity-rare)}.cell.item:before{content:"";background:radial-gradient(circle, color-mix(in srgb, currentColor 24%, transparent) 0%, transparent 70%);box-shadow:inset 0 0 0 1px color-mix(in srgb, currentColor 60%, transparent), inset 0 0 10px color-mix(in srgb, currentColor 35%, transparent);pointer-events:none;border-radius:2px;position:absolute;inset:3px}.cell.item.normal:before{background:0 0;box-shadow:inset 0 0 0 1px #b8b0a038}.cell.item:hover{filter:brightness(1.3)}.cell .item-art{filter:drop-shadow(0 2px 3px #000);position:relative}.cell .ghost{color:#6a5838;opacity:.5;width:auto;height:auto;position:absolute;inset:24%}.cell .price{text-align:center;color:#e8c860;background:#000000bf;font-size:10px;position:absolute;bottom:-1px;left:0;right:0}.cell .price.poor{color:#ff6a50}.grid.shop{grid-template-columns:repeat(4,1fr);gap:8px}.shop-potions{flex-direction:column;gap:5px;display:flex}.shop-potion{text-align:left;background:linear-gradient(90deg,#0009,#1e140c59);border:1px solid #4a3a24;grid-template-columns:34px 1fr auto;align-items:center;gap:8px;padding:4px 8px;display:grid}.shop-potion .icon,.shop-potion .icon-img{border-radius:3px;width:34px;height:34px}.shop-potion .icon svg{width:100%;height:100%}.shop-potion:hover{border-color:var(--gold)}.shop-potion b{color:#e8c860}#tooltip{border:16px solid #0000;border-image:var(--frame) 46 / 16px stretch;z-index:50;text-align:center;background:#060403f5;min-width:190px;max-width:290px;padding:2px 6px 4px;font-size:13px;display:none;position:absolute;box-shadow:0 6px 24px #000}.tt-art{filter:drop-shadow(0 3px 4px #000);width:64px;height:64px;margin:0 auto 4px;display:block}.tt-name{font-family:var(--serif);color:#fff;font-size:15px}.tt-name.small{font-size:13px}.tt-sub{color:var(--dim);margin-bottom:5px;font-size:11px}.tt-stat{color:#8fa8ff}.tt-desc{color:#c8c0b0;margin-bottom:4px}.tt-dim .tt-stat{color:#6a7088}.tt-divider{background:var(--divider) center top / 130px auto no-repeat;color:var(--dim);margin:8px 0 3px;padding-top:14px;font-size:11px}.tt-footer{color:#c9a45c;margin-top:7px;font-size:11px}#dialog{z-index:11;background:linear-gradient(#0c080699, #080605d9), var(--leather) center / 384px;border:26px solid #0000;border-image:var(--frame) 46 / 26px stretch;pointer-events:auto;width:540px;margin-left:-270px;padding:6px 12px;display:none;position:absolute;bottom:190px;left:50%;box-shadow:0 0 30px #000}#dialog h2{font-family:var(--serif);color:var(--gold);margin:0 0 6px;font-size:18px}#dialog p{margin:0 0 12px;line-height:1.7}#dialog button{text-align:left;background:linear-gradient(90deg,#0009,#281c1066);border:1px solid #4a3a24;border-left:3px solid #8a6a34;width:100%;margin-top:5px;padding:7px 10px;display:block}#dialog button:hover{border-color:var(--gold);color:#fff}.screen{z-index:20;pointer-events:auto;text-align:center;flex-direction:column;justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.screen h1{font-family:var(--serif);margin:0;font-weight:900}.screen button{border:1px solid var(--gold-dim);color:#e8dcc0;min-width:220px;font-family:var(--serif);letter-spacing:.2em;background:linear-gradient(#2c2218,#15100b);margin:6px;padding:11px 26px;font-size:18px}.screen button:hover:not(:disabled){border-color:var(--gold);color:#fff;box-shadow:0 0 16px #c8a05066}.screen button:disabled{opacity:.35;cursor:default}#title{background:radial-gradient(at 50% 35%,#2c160c59 0%,#0c0806ad 58%,#040303e6 100%);overflow:hidden}:is(#ui:has(#title:not([style*="display: none"])) #hud,#ui:has(#title:not([style*="display: none"])) #minimap){display:none}#title .title-embers{pointer-events:none;position:absolute;inset:0;overflow:hidden}#title .title-embers i{opacity:0;background:radial-gradient(circle,#ffe490 0%,#ff7020 65%,#0000 100%);border-radius:50%;width:4px;height:4px;animation:5s linear infinite ember-rise;position:absolute;bottom:-16px;box-shadow:0 0 10px #ff7020}@keyframes ember-rise{0%{opacity:0;transform:translateY(0)translate(0)scale(.8)}15%{opacity:.9}80%{opacity:.5}to{opacity:0;transform:translateY(-100vh)translate(28px)scale(.2)}}#title .help-btn{z-index:3;color:#d8c39c;background:#120d0ad9;border:1px solid #5a442d;min-width:0;margin:0;padding:6px 14px;font-size:12px;position:absolute;top:18px;right:20px}#title .title-inner{z-index:1;flex-direction:column;align-items:center;width:92vw;max-width:720px;padding:10px 20px;display:flex;position:relative}#title .title-crest{letter-spacing:.45em;color:#a8824c;margin-bottom:4px;font-size:10px}#title h1{letter-spacing:.25em;color:#e4bc6a;text-shadow:0 0 38px #ff6e238c,0 3px #3a2408;margin:0;padding-left:.25em;font-size:clamp(46px,6.2vw,68px)}#title .subtitle{letter-spacing:.9em;color:var(--gold-dim);margin-bottom:10px;padding-left:.9em;font-size:12px}#title .auth-bar{min-height:28px;color:var(--dim);align-items:center;gap:10px;margin-bottom:10px;font-size:12px;display:flex}#title .auth-avatar{border:1px solid var(--gold-dim);object-fit:cover;border-radius:50%;width:24px;height:24px}#title .auth-name{color:#e8dcc4}#title .auth-btn{min-width:0;margin:0;padding:5px 12px;font-size:12px}#title .auth-btn.google{border-color:var(--gold-dim);color:#f0d890}#title .auth-hint{color:var(--dim);font-size:12px}#title .lobby-root{flex-direction:column;align-items:center;width:100%;max-width:600px;display:flex}#title .mode-tabs{gap:8px;margin-bottom:10px;display:flex}#title .mode-tab{color:#a8967a;background:#140f0cd9;border:1px solid #443424;min-width:130px;margin:0;padding:7px 16px;font-size:13px}#title .mode-tab.active{color:#ffe4a8;background:linear-gradient(#402816eb,#1c110af2);border-color:#e2b860}#title .lobby-panel,#title .create-panel{background:#0e0a08d6;border:1px solid #4a3826;border-radius:6px;width:100%;padding:14px 16px;box-shadow:0 10px 30px #0000008c}#title .lobby-head{color:#d4b478;justify-content:space-between;align-items:center;margin-bottom:10px;font-size:13px;display:flex}#title .slot-count{color:#a89068;font-size:12px}#title .char-list{grid-template-columns:1fr 1fr;gap:8px;max-height:210px;margin-bottom:12px;display:grid;overflow-y:auto}#title .char-empty{text-align:center;color:var(--dim);border:1px dashed #3d2e20;border-radius:4px;grid-column:1/-1;padding:24px 12px;font-size:13px}#title .char-slot{text-align:left;cursor:pointer;background:#1a130ee6;border:1px solid #3f3020;border-radius:5px;align-items:center;gap:10px;min-width:0;margin:0;padding:9px 12px;display:flex}#title .char-slot:hover{border-color:#9e7a48}#title .char-slot.selected{background:#302012f2;border-color:#e2b860;box-shadow:inset 0 0 12px #e2b86024}#title .char-crest{flex-shrink:0;width:34px;height:34px}#title .char-crest svg{width:100%;height:100%;display:block}#title .char-meta{flex:1;min-width:0}#title .char-title-row{justify-content:space-between;align-items:center;gap:6px;display:flex}#title .char-name{color:#f2dcb0;text-overflow:ellipsis;white-space:nowrap;font-size:14px;font-weight:700;overflow:hidden}#title .char-lv{color:#e2b860;flex-shrink:0;font-size:12px}#title .char-sub-row{color:#a89476;justify-content:space-between;margin-top:2px;font-size:11px;display:flex}#title .class-select{grid-template-columns:1fr 1fr;gap:12px;width:100%;margin-bottom:12px;display:grid}#title .class-card{text-align:left;cursor:pointer;background:linear-gradient(#201610eb,#100b08f2);border:1px solid #4a3826;border-radius:6px;flex-direction:column;align-items:flex-start;min-width:0;margin:0;padding:12px 14px;transition:border-color .18s,transform .18s;display:flex}#title .class-card:hover{border-color:#9e7a48;transform:translateY(-1px)}#title .class-card.selected{border-color:#e2b860;box-shadow:0 0 18px #e2b86040,inset 0 0 14px #e2b8601a}#title .class-head{align-items:center;gap:10px;margin-bottom:6px;display:flex}#title .class-icon{border:1px solid #6b5234;border-radius:4px;flex-shrink:0;width:38px;height:38px;overflow:hidden}#title .class-icon svg{width:100%;height:100%;display:block}#title .class-name{color:#f2dcb0;font-size:16px;font-weight:700}#title .class-sub{color:#b89864;font-size:11px}#title .class-desc{color:#bfb4a0;margin-bottom:8px;font-size:12px;line-height:1.4}#title .class-skills{flex-direction:column;gap:4px;width:100%;display:flex}#title .skill-mini-row{gap:6px;display:flex}#title .skill-mini{border:1px solid #5e472d;border-radius:3px;width:22px;height:22px;display:inline-block;overflow:hidden}#title .skill-mini img,#title .skill-mini svg{width:100%;height:100%;display:block}#title .skill-preview-names{color:#d8b46c;font-size:11px}#title .create-name-row{justify-content:center;align-items:center;gap:8px;margin-bottom:12px;display:flex}#title .char-name-input{color:#f0e6d2;background:#120e0ae6;border:1px solid #5a442d;border-radius:4px;width:240px;padding:7px 10px;font-size:13px}#title .menu-main{flex-wrap:wrap;justify-content:center;gap:10px;margin-bottom:8px;display:flex}#title .menu-sub{justify-content:center;gap:10px;display:flex}#title .primary-btn,.modal-card .primary-btn{color:#ffe8b0;background:linear-gradient(#693a1af2,#32180cfa);border-color:#d4a652;min-width:240px;padding:10px 22px;font-weight:700}#title .secondary-btn{color:#d6c4a4;background:#18120ee6;border:1px solid #4a3826;min-width:110px;margin:0;padding:6px 14px;font-size:12px}#title .danger-outline{color:#e29888;border-color:#6e2d24}#title .mp-row{justify-content:center;align-items:center;gap:8px;margin-bottom:10px;display:flex}#title .room-label{color:#cbb286;font-size:12px}#title .room-input{color:#f0e6d2;text-align:center;background:#120e0ae6;border:1px solid #5a442d;border-radius:4px;width:150px;padding:6px 10px;font-size:13px}#title .status{color:#e8b878;height:18px;margin-top:8px;font-size:12px}.modal-backdrop{z-index:30;pointer-events:auto;background:#000000b8;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.modal-card{text-align:left;background:linear-gradient(#1d1510,#110c09);border:1px solid #6b5234;border-radius:6px;width:min(440px,90vw);padding:18px 20px;box-shadow:0 12px 36px #000c}.modal-card button{border:1px solid var(--gold-dim);color:#e8dcc0;font-family:var(--serif);letter-spacing:.14em;background:linear-gradient(#2c2218,#15100b)}.modal-card button:hover:not(:disabled){border-color:var(--gold);color:#fff;box-shadow:0 0 14px #c8a05059}.modal-card h3{color:#e4bc6a;margin:0 0 10px;font-size:17px}.modal-desc{color:#d8ccb8;margin:0 0 16px;font-size:13px;line-height:1.5}.modal-actions{justify-content:flex-end;gap:10px;display:flex}.modal-actions button{min-width:84px;margin:0;padding:7px 14px;font-size:13px}.danger-btn{color:#ffd4cc!important;background:linear-gradient(#6e2018,#3d100c)!important;border-color:#b43c2c!important}.help-modal{width:min(520px,92vw)}.modal-head{justify-content:space-between;align-items:center;margin-bottom:10px;display:flex}.modal-head h3{margin:0}.close-x{min-width:0!important;margin:0!important;padding:3px 9px!important;font-size:13px!important}.help-modal .controls{color:var(--dim);grid-template-columns:1fr 1fr;gap:7px 22px;font-size:12px;display:grid}.help-modal .controls kbd{color:#c9a45c;min-width:92px;font-size:12px;display:inline-block}#death{background:radial-gradient(#3c00008c,#000000e6);display:none}#death h1{color:#a81408;letter-spacing:.3em;text-shadow:0 0 30px #000;margin-bottom:30px;padding-left:.3em;font-size:80px}#fatal{color:#fcc;white-space:pre-wrap;pointer-events:auto;z-index:99;-webkit-user-select:text;user-select:text;background:#200;border:2px solid #a00;width:560px;margin-left:-280px;padding:18px;display:none;position:absolute;top:30%;left:50%}#bar{position:relative}.slot.skill.empty{background:radial-gradient(circle at 50% 45%,#1c1610b8,#0a0806eb);border-color:#3f311f}.slot.skill.empty:hover{border-color:#9e7a3c}.slot.skill.drop-target{box-shadow:0 0 12px #ffd264d9,inset 0 0 10px #ffc85059;border-color:#ffd87a!important}.slot-picker{z-index:25;pointer-events:auto;background:#0e0a08f2;border:1px solid #8a6a34;border-radius:4px;gap:6px;padding:7px 9px;display:flex;position:absolute;bottom:calc(100% + 10px);transform:translate(-50%);box-shadow:0 8px 24px #000000d9}.slot-picker-empty{color:var(--dim);white-space:nowrap;padding:2px 6px;font-size:12px}.pause-modal{width:320px}.pause-actions{flex-direction:column;gap:10px;margin-top:8px;display:flex}.pause-actions button{width:100%;padding:9px 14px;font-size:14px}.pause-actions .danger-btn{color:#f4cbc2;background:linear-gradient(#6e1c16eb,#380e0cf5);border-color:#8a3a2e}.pause-actions .danger-btn:hover{color:#fff;background:#78181073;border-color:#c85242}.death-actions{gap:14px;display:flex}.death-actions .secondary{background:#18120ed9;border-color:#6e5a34}