:root{--bg:#12141c;--bg-deep:#0c0e14;--panel:#141721eb;--panel-solid:#171a24;--line:#2c3040;--text:#d7dae5;--dim:#8d92a6;--gold:#e2b063;--gold-dim:#a97f3f;--hp:#6f9a68;--mp:#7d9bb8;--tp:#e2b063;--xp:#9d8fc9;--danger:#c05b4d;--caerdun:#7d9bb8;--heartwood:#82ab76;--moonmere:#9d8fc9;--rare:#c9a35c;--uncommon:#8fae8a}*{box-sizing:border-box}html,body{background:var(--bg-deep);height:100%;margin:0;overflow:hidden}body{color:var(--text);font-family:Alegreya Sans,Trebuchet MS,sans-serif;font-size:14px}#game-canvas{touch-action:none;outline:none;width:100%;height:100%;position:fixed;inset:0}#app{pointer-events:none;position:fixed;inset:0}#app>*{pointer-events:auto}button{cursor:pointer;font-family:inherit}input{font-family:inherit}.btn{color:var(--text);border:1px solid var(--line);letter-spacing:.5px;background:#232838;border-radius:2px;padding:8px 18px;font-size:14px}.btn:hover{border-color:var(--gold-dim);color:var(--gold)}.btn.primary{background:#33405c;border-color:#4a5a7a}.btn.gold{border-color:var(--gold-dim);color:var(--gold);background:#3a3222}.btn:disabled{opacity:.45;cursor:default}.bar{background:#262b3a;border-radius:1px;height:7px;overflow:hidden}.bar>div{height:100%;transition:width .25s}.serif{font-family:Cinzel,serif}.screen{background:radial-gradient(ellipse 60% 50% at 50% 40%, #1c1a20, var(--bg-deep) 75%);z-index:50;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.screen .card{background:var(--panel);border:1px solid var(--line);flex-direction:column;gap:14px;width:380px;padding:34px 38px;display:flex}.screen .card.wide{width:640px}.screen h1{letter-spacing:10px;text-align:center;color:var(--text);margin:0;font-family:Cinzel,serif;font-size:40px;font-weight:500}.screen .tagline{text-align:center;color:var(--dim);margin-bottom:8px;font-family:Alegreya,serif;font-style:italic}.screen label{letter-spacing:2px;text-transform:uppercase;color:var(--dim);font-size:11px}.screen input[type=email],.screen input[type=password],.screen input[type=text]{border:1px solid var(--line);color:var(--text);background:#1c202e;border-radius:2px;width:100%;padding:9px 12px;font-size:15px}.screen input:focus{border-color:var(--gold-dim);outline:none}.screen .error{color:var(--danger);min-height:17px;font-size:13px}.screen .swap{text-align:center;color:var(--dim);font-size:13px}.screen .swap a{color:var(--gold);cursor:pointer;text-decoration:none}.charlist{flex-direction:column;gap:8px;display:flex}.charlist .charrow{border:1px solid var(--line);cursor:pointer;background:#1c202e;align-items:center;gap:12px;padding:10px 14px;display:flex}.charlist .charrow:hover{border-color:var(--gold-dim)}.charlist .charrow .cname{font-family:Cinzel,serif;font-size:17px}.charlist .charrow .cmeta{color:var(--dim);margin-left:auto;font-size:12px}.racegrid{grid-template-columns:repeat(5,1fr);gap:8px;display:grid}.racegrid .race,.jobgrid .job{border:1px solid var(--line);text-align:center;cursor:pointer;background:#1c202e;padding:10px 6px;font-size:12px}.racegrid .race.sel,.jobgrid .job.sel{border-color:var(--gold);color:var(--gold);background:#262336}.jobgrid{grid-template-columns:repeat(6,1fr);gap:8px;display:grid}.desc{color:var(--dim);min-height:36px;font-family:Alegreya,serif;font-size:13px;font-style:italic}#hud{pointer-events:none;display:none;position:fixed;inset:0}#hud.on{display:block}#hud>*{pointer-events:auto}#game-clock{color:var(--dim);letter-spacing:1.5px;pointer-events:none;text-shadow:0 1px 3px #000;font-variant-numeric:tabular-nums;font-size:12px;position:fixed;top:52px;left:50%;transform:translate(-50%)}#game-clock .glyph{color:var(--gold-dim)}#zone-name{letter-spacing:4px;color:var(--dim);text-shadow:0 1px 4px #000;pointer-events:none;font-family:Cinzel,serif;font-size:15px;position:fixed;top:32px;left:50%;transform:translate(-50%)}#player-frame{background:var(--panel);border:1px solid var(--line);width:250px;padding:10px 12px;position:fixed;top:14px;left:14px}#player-frame .prow{align-items:baseline;gap:8px;display:flex}#player-frame .pname{font-family:Cinzel,serif;font-size:16px}#player-frame .plvl{color:var(--gold);font-size:12px}#player-frame .ptitle{color:var(--dim);font-size:11px;font-style:italic}#player-frame .bar{margin-top:5px}#player-frame .nums{color:var(--dim);justify-content:space-between;margin-top:1px;font-size:10px;display:flex}#target-frame{background:var(--panel);border:1px solid var(--line);width:230px;padding:8px 12px;display:none;position:fixed;top:14px;left:280px}#target-frame.on{display:block}#target-frame .tname{font-size:14px}#target-frame .tcon{margin-left:6px;font-size:11px}#target-frame .bar{margin-top:5px}#party-frame{flex-direction:column;gap:6px;width:190px;display:flex;position:fixed;top:120px;left:14px}#party-frame .pmember{background:var(--panel);border:1px solid var(--line);padding:6px 9px;font-size:12px}#party-frame .pmember .head{color:var(--text);justify-content:space-between;display:flex}#party-frame .pmember .head .job{color:var(--dim);font-size:10px}#party-frame .pmember.dead .head{color:var(--danger)}#party-frame .pmember .pnums{color:var(--dim);justify-content:space-between;margin:1px 0;font-size:9.5px;display:flex}#raise-offer{text-align:center;margin-top:14px;display:none}#raise-offer.on{display:block}#raise-offer .rtext{color:var(--gold-dim);margin-bottom:10px;font-family:Alegreya,serif;font-style:italic}#raise-offer .btns{justify-content:center;gap:10px;display:flex}#chat{flex-direction:column;gap:6px;width:430px;display:flex;position:fixed;bottom:14px;left:14px}#chat-log{border:1px solid var(--line);scrollbar-width:thin;background:#0e1018c7;height:170px;padding:8px 10px;font-size:13px;line-height:1.5;overflow-y:auto}#chat-log .say .from{color:#a8c4de}#chat-log .party .from{color:#b7a8e8}#chat-log .company .from{color:#8fd8a8}#chat-log .system{color:var(--gold-dim);font-style:italic}#chat-log .combatline{color:#7f8598;font-size:12px}#chat-log .loot{color:var(--uncommon)}#chat-log .xp{color:var(--xp)}#chat-log .tell{color:#e0b6d6}#chat-log .tell .from{color:#c98fc0;font-style:italic}#chat-input{border:1px solid var(--line);width:100%;color:var(--text);background:#141721e6;padding:8px 10px;font-size:13px;display:none}#chat-input.on{display:block}#chat-input:focus{border-color:var(--gold-dim);outline:none}#hotbar{gap:6px;display:flex;position:fixed;bottom:14px;left:50%;transform:translate(-50%)}#hotbar .slot{border:1px solid var(--line);cursor:pointer;width:54px;height:54px;color:var(--dim);-webkit-user-select:none;user-select:none;background:linear-gradient(#1b202e 0%,#12151f 100%);border-radius:7px;flex-direction:column;justify-content:center;align-items:center;transition:border-color .12s,transform 60ms;display:flex;position:relative;box-shadow:0 2px 6px #00000073,inset 0 1px #ffffff0a}#hotbar .slot:hover{border-color:var(--gold-dim);transform:translateY(-1px)}#hotbar .slot:active{transform:translateY(0)}#hotbar .slot .gicon{filter:drop-shadow(0 1px 2px #0009);width:26px;height:26px;margin-top:1px}#hotbar .slot .slotname{text-align:center;color:var(--dim);white-space:nowrap;text-overflow:ellipsis;max-width:50px;margin-top:2px;font-size:7.5px;line-height:1.05;overflow:hidden}#hotbar .slot .key{border:1px solid var(--line);width:14px;height:14px;color:var(--gold-dim);background:#232a3c;border-radius:4px;justify-content:center;align-items:center;font-size:9px;display:flex;position:absolute;top:-5px;left:-5px}#hotbar .slot .cost{color:var(--dim);font-size:8.5px;position:absolute;bottom:1px;right:3px}#hotbar .slot .cost.tp{color:#d8c48a}#hotbar .slot .cost.mp{color:#8fb8e0}#hotbar .slot.ws{border-color:#6b5d3a}#hotbar .slot.ready{color:var(--text)}#hotbar .slot.ws.tpready{border-color:var(--gold);box-shadow:0 0 12px #e2b06366,inset 0 0 8px #e2b0631f}#hotbar .slot.ws.tpready .slotname{color:var(--gold)}#hotbar .slot .cd{color:var(--text);background:#0a0b11c7;border-radius:7px;justify-content:center;align-items:center;font-size:15px;display:flex;position:absolute;inset:0}.gicon{display:block}.invrow .iicon{background:#171b27;border:1px solid #242a3a;border-radius:6px;flex:none;justify-content:center;align-items:center;width:30px;height:30px;display:flex}.invrow .iicon .gicon{width:20px;height:20px}#compass{pointer-events:none;width:220px;height:20px;position:fixed;top:10px;left:50%;overflow:hidden;transform:translate(-50%);-webkit-mask-image:linear-gradient(90deg,#0000,#000 18% 82%,#0000);mask-image:linear-gradient(90deg,#0000,#000 18% 82%,#0000)}#compass .cpt{letter-spacing:1px;color:var(--dim);font-size:11px;position:absolute;top:2px;transform:translate(-50%)}#compass .cpt.n{color:var(--gold)}#compass .cmark{border-left:3px solid #0000;border-right:3px solid #0000;border-bottom:4px solid var(--gold-dim);width:0;height:0;position:absolute;top:15px;left:110px;transform:translate(-50%)}#target-frame .thp{float:right;color:var(--dim);margin-left:8px;font-size:11px}#hotbar .slot.dragover{border-color:var(--gold);box-shadow:0 0 8px #e2b06380}.invrow.dragover{outline:1px dashed var(--gold-dim);background:#e2b0630f}.invrow[draggable=true]{cursor:grab}#quest-tracker{pointer-events:none;width:230px;font-size:12px;position:fixed;top:190px;right:14px}#quest-tracker .thead{color:var(--gold-dim);letter-spacing:3px;text-shadow:0 1px 3px #000;border-bottom:1px solid #a8834e59;margin-bottom:4px;padding-bottom:2px;font-family:Cinzel,serif;font-size:11px}#quest-tracker .trow{text-shadow:0 1px 3px #000;margin-bottom:7px}#quest-tracker .tq{color:var(--text);font-size:12.5px}#quest-tracker .tobj{color:var(--dim);font-size:11px;line-height:1.35}#quest-tracker .tprog{color:var(--gold)}.nameplate .mcastbar{background:#141824d9;border:1px solid #4a3f68;border-radius:2px;width:74px;height:4px;margin:2px auto 0;overflow:hidden}.nameplate .mcastbar>div{background:#a58fd8;height:100%}.nameplate .mcastname{color:#b8a8e0;text-shadow:0 1px 2px #000;font-size:9px}#item-tip{z-index:60;pointer-events:none;background:#0e111af5;border:1px solid #3a4258;border-radius:7px;min-width:180px;max-width:260px;padding:9px 11px;font-size:12px;display:none;position:fixed;box-shadow:0 6px 18px #0000008c}#item-tip.on{display:block}#item-tip .tname{color:var(--text);margin-bottom:2px;font-size:13.5px}#item-tip .tname.rare{color:var(--rare)}#item-tip .tname.uncommon{color:var(--uncommon)}#item-tip .tmeta{color:var(--dim);text-transform:capitalize;margin-bottom:3px;font-size:10.5px}#item-tip .tstat{color:#c9d2e4;font-size:11.5px}#item-tip .tcompare{color:var(--dim);border-top:1px solid #262c3c;margin-top:6px;padding-top:5px;font-size:11px}#item-tip .up{color:#8fd8a8}#item-tip .down{color:#e08a7a}.statgrid.attr span:nth-child(2n){font-variant-numeric:tabular-nums}.buffchip{color:var(--gold-dim);letter-spacing:.5px;background:#e2b0631f;border:1px solid #e2b06359;border-radius:8px;margin:1px 3px 1px 0;padding:1px 6px;font-size:9px;display:inline-block}#minimap{filter:drop-shadow(0 2px 6px #00000080);pointer-events:none;position:fixed;top:14px;right:14px}#cast-bar{background:var(--panel);border:1px solid var(--line);width:240px;padding:5px 8px;display:none;position:fixed;bottom:84px;left:50%;transform:translate(-50%)}#cast-bar.on{display:block}#cast-bar .label{color:var(--dim);margin-bottom:3px;font-size:11px}#cast-bar .bar>div{background:var(--gold-dim);transition:none}#menu-buttons{gap:6px;display:flex;position:fixed;bottom:14px;right:14px}#menu-buttons .btn{padding:7px 12px;font-size:12px}#xp-bar-wrap{background:#171a24;height:4px;position:fixed;bottom:0;left:0;right:0}#xp-bar-wrap>div{background:var(--xp);height:100%;transition:width .4s}#interact-prompt{background:var(--panel);border:1px solid var(--gold-dim);color:var(--gold);pointer-events:none;padding:7px 16px;font-size:13px;display:none;position:fixed;bottom:150px;left:50%;transform:translate(-50%)}#interact-prompt.on{display:block}.window{background:var(--panel-solid);border:1px solid var(--line);z-index:20;flex-direction:column;width:360px;max-height:70vh;display:none;position:fixed;top:90px;right:14px}.window.on{display:flex}.window.wide{width:600px;max-height:84vh;top:60px;right:calc(50% - 300px)}.window .whead{border-bottom:1px solid var(--line);justify-content:space-between;align-items:center;padding:10px 14px;display:flex}.window .whead .wtitle{letter-spacing:1px;font-family:Cinzel,serif;font-size:15px}.window .whead .wclose{color:var(--dim);background:0 0;border:none;font-size:16px}.window .wbody{scrollbar-width:thin;padding:10px 14px;overflow-y:auto}#player-ctx{z-index:70;background:var(--panel-solid);border:1px solid var(--line);min-width:168px;padding:4px;display:none;position:fixed;top:0;left:0;box-shadow:0 10px 24px #0000008c}#player-ctx.on{display:block}#player-ctx .ctx-name{color:var(--gold);border-bottom:1px solid var(--line);margin-bottom:4px;padding:4px 10px 6px;font-family:Cinzel,serif;font-size:12.5px}#player-ctx .ctx-item{text-align:left;width:100%;color:var(--text);background:0 0;border:none;padding:6px 10px;font-size:13px;display:block}#player-ctx .ctx-item:hover{color:var(--gold);background:#232838}.invrow.who-row:hover{background:#e2b0630f}.invrow{border-bottom:1px solid #20242f;align-items:center;gap:8px;padding:6px 4px;font-size:13px;display:flex}.invrow .iname{flex:1}.invrow .iname.rare{color:var(--rare)}.invrow .iname.uncommon{color:var(--uncommon)}.invrow .imeta{color:var(--dim);font-size:11px}.invrow .btn{padding:3px 9px;font-size:11px}.invrow.equipped{background:#e2b0630d}.statgrid{grid-template-columns:1fr 1fr;gap:4px 18px;margin-bottom:10px;font-size:13px;display:grid}.statgrid .k{color:var(--dim)}.jobrow{border-bottom:1px solid #20242f;justify-content:space-between;padding:5px 4px;font-size:13px;display:flex}.questrow{border-bottom:1px solid #20242f;padding:8px 4px}.questrow .qname{color:var(--gold);font-size:14px}.questrow .qobj{color:var(--dim);margin-top:2px;font-size:12px}.questrow .qprog{color:var(--text);font-size:12px}.questrow.done .qname{color:var(--uncommon)}#dialog-panel{background:var(--panel-solid);border:1px solid var(--line);z-index:25;flex-direction:column;width:520px;display:none;position:fixed;bottom:110px;left:50%;transform:translate(-50%)}#dialog-panel.on{display:flex}#dialog-panel .dhead{padding:10px 16px 0}#dialog-panel .dname{font-family:Cinzel,serif;font-size:16px}#dialog-panel .dtitle{color:var(--dim);font-size:11px;font-style:italic}#dialog-panel .dlines{padding:8px 16px;font-family:Alegreya,serif;font-size:14.5px;line-height:1.55}#dialog-panel .dlines p{margin:0 0 8px}#dialog-panel .dactions{flex-wrap:wrap;gap:8px;padding:4px 16px 14px;display:flex}#death-overlay{z-index:40;background:#08080cb8;flex-direction:column;justify-content:center;align-items:center;gap:18px;display:none;position:fixed;inset:0}#death-overlay.on{display:flex}#death-overlay .dtext{letter-spacing:6px;color:var(--danger);font-family:Cinzel,serif;font-size:30px}#death-overlay .dsub{color:var(--dim);font-family:Alegreya,serif;font-style:italic}#toasts{pointer-events:none;flex-direction:column;align-items:center;gap:8px;display:flex;position:fixed;top:90px;left:50%;transform:translate(-50%)}.toast{background:var(--panel);border:1px solid var(--gold-dim);color:var(--gold);letter-spacing:2px;padding:10px 22px;font-family:Cinzel,serif;font-size:15px;animation:4s forwards toastfade}.toast.discovery{border-color:var(--moonmere);color:#c9bfe8}.toast.sc{border-color:var(--gold);font-size:18px}@keyframes toastfade{0%{opacity:0;transform:translateY(-8px)}8%{opacity:1;transform:translateY(0)}80%{opacity:1}to{opacity:0}}#invite-prompt{background:var(--panel-solid);border:1px solid var(--gold-dim);z-index:30;text-align:center;padding:14px 20px;display:none;position:fixed;top:150px;left:50%;transform:translate(-50%)}#invite-prompt.on{display:block}#invite-prompt .btns{justify-content:center;gap:10px;margin-top:10px;display:flex}.float-text{pointer-events:none;text-shadow:0 1px 3px #000;z-index:15;font-family:Alegreya Sans,sans-serif;font-size:15px;font-weight:700;animation:1.1s forwards floatup;position:fixed;transform:translate(-50%,-50%)}.float-text.dmg-out{color:#f0e6d4}.float-text.dmg-in{color:#e08b7a}.float-text.heal{color:#a5d69c}.float-text.miss{color:#8d92a6;font-weight:400}.float-text.crit{color:var(--gold);font-size:20px}.float-text.ws{color:var(--gold);font-size:17px}.float-text.spell{color:#b7a8e8}@keyframes floatup{0%{opacity:0;margin-top:0}10%{opacity:1}to{opacity:0;margin-top:-46px}}.nameplate{pointer-events:none;text-align:center;z-index:5;text-shadow:0 1px 3px #000;font-size:12px;position:fixed;transform:translate(-50%,-100%)}.nameplate .nm{color:#dfe3ee}.nameplate .nm.npc{color:#9fd6a0}.nameplate .nm.mob{color:#e0a8a0}.nameplate .nm.mob.tough{color:#e0796a}.nameplate .sub{color:var(--dim);font-size:10px}.nameplate .mhp{background:#262b3a;width:70px;height:3px;margin:2px auto 0}.nameplate .mhp>div{background:var(--danger);height:100%}.nameplate .targeted{outline:1px solid var(--gold)}#loading-veil{background:var(--bg-deep);z-index:45;letter-spacing:6px;color:var(--dim);justify-content:center;align-items:center;font-family:Cinzel,serif;font-size:18px;display:none;position:fixed;inset:0}#loading-veil.on{display:flex}