*{box-sizing:border-box}html,body{margin:0;height:100%;overflow:hidden;background:#1b2a1f;font-family:Palatino Linotype,Book Antiqua,Palatino,Georgia,serif;-webkit-user-select:none;user-select:none}canvas#game{display:block;width:100vw;height:100vh}.panel{background:#2a231b linear-gradient(180deg,#ffebbe0d,#0000002e);border:1px solid #0d0a07;box-shadow:inset 0 0 0 1px #6b5532,inset 0 0 0 3px #1c160f,inset 0 0 0 4px #4a3a22,0 4px 14px #0000008c;border-radius:3px;color:#e9dcbc}#hover{z-index:5;position:fixed;left:10px;top:8px;font-size:15px;font-weight:700;color:#fff;text-shadow:1px 1px 0 #000,0 0 3px #000;pointer-events:none}#hover .t{color:#ff0}#hover .n{color:#0ff}#hover .m{color:#ff0}#hover .lv{color:#ff9a2e}#chat{position:fixed;left:8px;bottom:8px;width:min(480px,37vw);height:150px;padding:6px 10px;font-size:13px;overflow-y:auto;display:flex;flex-direction:column}#chat .line{padding:1px 0;text-shadow:1px 1px 0 #000}#chat .warn{color:#ff6b5b}#chat .quest{color:#8fe36b}#chat .lvl{color:#ffd34e}#chat .dim{color:#c8b893}#side{position:fixed;right:8px;bottom:8px;width:236px}#tabs{display:flex;gap:2px;padding:4px 4px 0}#tabs button{flex:1;height:32px;background:#241d16;border:1px solid #0d0a07;border-bottom:none;border-radius:2px 2px 0 0;color:#b89f72;cursor:pointer;display:flex;align-items:center;justify-content:center}#tabs button:hover{color:#f0d9a4}#tabs button.on{background:#4a2a1c;color:#f6dc9a;box-shadow:inset 0 2px #8a5a2c}#tabbody{height:300px;padding:8px;border-top:1px solid #6b5532}#inv{display:grid;grid-template-columns:repeat(4,50px);grid-auto-rows:38px;gap:2px 3px;justify-content:center}.slot{position:relative;display:flex;align-items:center;justify-content:center;border-radius:4px;cursor:pointer}.slot{background:#0000002e;box-shadow:inset 0 0 0 1px #00000059}.slot:hover{background:#ffe6aa14}.slot img{width:40px;height:40px;image-rendering:auto;pointer-events:none}.slot .q{position:absolute;left:2px;top:0;font-size:11px;color:#ff0;text-shadow:1px 1px 0 #000;pointer-events:none}.eq{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:10px}.eqslot{height:70px;background:#00000040;border:1px solid #0d0a07;box-shadow:inset 0 0 0 1px #4a3a22;border-radius:2px;display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:11px;cursor:pointer}.eqslot img{width:44px;height:44px}.stat{display:flex;justify-content:space-between;padding:8px 6px;border-bottom:1px solid rgba(0,0,0,.3);font-size:14px}.stat b{color:#e9c46a}.xpbar{height:6px;background:#15110c;border-radius:1px;margin:0 6px 6px;overflow:hidden;box-shadow:inset 0 0 0 1px #4a3a22}.xpbar i{display:block;height:100%;background:linear-gradient(#a6c45a,#5f8a2c)}.small{font-size:12px;color:#c8b893;padding:4px 6px;line-height:1.4}.quest-name{padding:6px;font-size:14px}.quest-name.s0{color:#ff5a4a}.quest-name.s1,.quest-name.s2{color:#ffff3a}.quest-name.s3{color:#4fe04f}#mapwrap{position:fixed;right:12px;top:10px;width:176px;height:176px;border-radius:50%;overflow:hidden;border:5px solid #2a231b;box-shadow:0 0 0 1px #6b5532,0 0 0 3px #0d0a07,0 4px 12px #0000008c;cursor:pointer}#minimap{width:100%;height:100%}#orbs{position:fixed;right:196px;top:18px;display:flex;flex-direction:column;gap:8px}.orb{width:70px;height:32px;border-radius:16px;display:flex;align-items:center;gap:6px;padding:0 10px;font-weight:700;font-size:15px}.orb svg{width:16px;height:16px;flex:none}.orb.hp svg{color:#c8402f}.orb.pray svg{color:#6fb6e8}#gfx svg{color:#b89f72}#gfx{cursor:pointer;font-size:12px}#gfx:hover{filter:brightness(1.2)}#menu{position:fixed;display:none;min-width:150px;font-size:13px;padding:0 0 3px;z-index:30;background:#2a231b;border:1px solid #000;box-shadow:inset 0 0 0 1px #6b5532,0 4px 10px #00000080;border-radius:2px}#menu .head{background:#0d0a07;color:#b89f72;padding:3px 6px;font-weight:700}#menu .opt{padding:2px 6px;color:#fff;cursor:pointer;white-space:nowrap}#menu .opt:hover{background:#ffffff26}#dialog{position:fixed;left:8px;bottom:8px;width:min(480px,37vw);height:150px;padding:10px 14px;display:none;z-index:25}#dialog .who{color:#e9c46a;font-weight:700;text-align:center;letter-spacing:.5px}#dialog .text{text-align:center;margin:6px 0 8px;font-size:14px}#dialog .opts{display:flex;flex-direction:column;align-items:center;gap:2px}#dialog .opts div{cursor:pointer;color:#a9c8e8;font-size:14px}#dialog .opts div:hover{color:#fff}#shop{position:fixed;left:50%;top:45%;transform:translate(-50%,-50%);width:360px;padding:12px;display:none;z-index:26}#shop h3{margin:0 0 8px;text-align:center;color:#e9c46a;font-weight:400;letter-spacing:1px}#shop .row{display:flex;align-items:center;gap:10px;padding:4px;border-radius:4px;cursor:pointer}#shop .row:hover{background:#ffffff14}#shop .row img{width:40px;height:40px}#shop .row .p{margin-left:auto;color:#ffff3a}#shop .close{position:absolute;right:8px;top:6px;cursor:pointer;color:#ff8a6a;font-weight:700}#xpdrops{position:fixed;right:210px;top:100px;pointer-events:none}#xpdrops div{color:#fff;font-weight:700;text-shadow:1px 1px 0 #000;animation:rise 1.6s ease-out forwards}@keyframes rise{0%{transform:translateY(0);opacity:1}to{transform:translateY(-50px);opacity:0}}#banner{position:fixed;left:50%;top:18%;transform:translate(-50%);padding:12px 26px;font-size:21px;color:#e9c46a;text-align:center;display:none;z-index:20}#banner small{display:block;font-size:13px;color:#f3e7c7;margin-top:4px}#loading{position:fixed;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;background:radial-gradient(#2b2a1e,#121009);color:#e9dcbc;z-index:50;gap:14px}#loading h1{margin:0;font-weight:400;letter-spacing:8px;color:#e9c46a;font-size:46px}#loading .bar{width:300px;height:14px;border:2px solid #75644a;border-radius:8px;overflow:hidden}#loading .bar i{display:block;height:100%;width:0;background:#b0382a;transition:width .2s}#help{position:fixed;left:50%;top:8px;transform:translate(-50%);font-size:12px;color:#ffffffbf;text-shadow:1px 1px 0 #000;pointer-events:none}#hotbar{position:fixed;left:50%;bottom:10px;transform:translate(-50%);display:flex;gap:6px;padding:7px;z-index:4}#hotbar .ab{position:relative;width:52px;height:52px;background:radial-gradient(#3b3024,#1a140e);border:1px solid #0d0a07;box-shadow:inset 0 0 0 1px #6b5532;border-radius:3px;display:flex;align-items:center;justify-content:center;color:#8d7a58;cursor:pointer;overflow:hidden}#hotbar .ab svg{width:30px;height:30px}#hotbar .ab.ready{color:#f0d595;box-shadow:inset 0 0 0 1px #a8834a,0 0 8px #e9c46a2e}#hotbar .ab:hover{filter:brightness(1.25)}#hotbar .ab .k{position:absolute;left:4px;top:1px;font-size:12px;color:#e9dcbc;text-shadow:1px 1px 0 #000}#hotbar .ab .cd{position:absolute;inset:0;background:conic-gradient(rgba(0,0,0,.72) var(--cd, 0deg),transparent 0);pointer-events:none}#xpdrops .xs{color:#e9c46a;font-size:12px;text-transform:capitalize}#chat{background:#1a1510d1!important}#xpbar{position:fixed;left:50%;bottom:82px;transform:translate(-50%);width:300px;height:18px;padding:0;overflow:hidden;z-index:4}#xpbar i{position:absolute;left:3px;top:3px;bottom:3px;width:0;max-width:calc(100% - 6px);background:linear-gradient(#d9b54a,#8c6a1c);border-radius:1px;transition:width .4s}#xpbar span{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:11px;color:#f6ecd0;text-shadow:1px 1px 0 #000,0 0 3px #000;letter-spacing:.3px}#tracker{position:fixed;left:10px;top:36px;max-width:320px;padding:8px 12px;font-size:13px;z-index:4}#tracker .tq{color:#e9c46a;font-size:14px;margin-bottom:3px}#tracker .tt{color:#e9dcbc;line-height:1.35}#tracker .tt b{color:#ffd23a}#tracker .th{color:#9c8b6a;font-size:11px;margin-top:4px;font-style:italic}.quest-name.locked{color:#7d7262!important}#areatoast{position:fixed;left:50%;top:22%;transform:translate(-50%,8px);text-align:center;pointer-events:none;opacity:0;z-index:6;transition:opacity .8s,transform .8s}#areatoast b{display:block;font-size:34px;font-weight:400;letter-spacing:3px;color:#f1d58e;text-shadow:0 2px 6px rgba(0,0,0,.8),0 0 2px #000}#areatoast small{display:block;font-size:15px;color:#e9dcbc;text-shadow:0 1px 4px #000;margin-top:2px;font-style:italic}#areatoast.show{opacity:1;transform:translate(-50%)}#worldmap{position:fixed;left:50%;top:50%;transform:translate(-50%,-50%);display:none;flex-direction:column;align-items:center;padding:10px 14px 8px;z-index:40}#worldmap canvas{height:min(84vh,1230px);aspect-ratio:380 / 410;cursor:crosshair;border:1px solid #0d0a07;box-shadow:inset 0 0 0 1px #6b5532;border-radius:2px}#worldmap .wmh{color:#e9c46a;font-size:20px;letter-spacing:2px;margin-bottom:6px}#worldmap .wmf{color:#9c8b6a;font-size:12px;font-style:italic;margin-top:5px}#fade{position:fixed;inset:0;background:#000;opacity:0;pointer-events:none;transition:opacity .45s;z-index:60}#fade.on{opacity:1}#chat{bottom:42px}#chat .public{color:#e9dcbc}#chat .me{color:#9fd7ff}#chatin{position:fixed;left:8px;bottom:8px;width:min(480px,37vw);z-index:5}#chatin input{width:100%;box-sizing:border-box;padding:7px 10px;font:inherit;font-size:13px;color:#f3e6c4;background:#1a1510e6;border:1px solid #0d0a07;box-shadow:inset 0 0 0 1px #6b5532;border-radius:3px;outline:none}#chatin input:focus{box-shadow:inset 0 0 0 1px #e9c46a}#chatin input::placeholder{color:#9c8b6a}#labels{position:fixed;inset:0;pointer-events:none;z-index:2}.nametag{padding:3px 7px;border-radius:4px;background:#120f0cad;color:#fff;font-size:15px;line-height:1.2;text-shadow:0 1px 2px #000;white-space:nowrap;transform:translateY(-4px)}.nametag small{font-size:12px}.nametag.away{opacity:.45}.bubble{max-width:220px;padding:4px 8px;font-size:13px;color:#ffe86b;text-align:center;text-shadow:1px 1px 0 #000,0 0 3px #000;opacity:0;transition:opacity .25s;transform:translateY(-6px)}.bubble.on{opacity:1}#online{position:fixed;left:50%;top:8px;transform:translate(-50%);min-width:200px;font-size:13px;z-index:5}#online .head{display:flex;align-items:center;gap:8px;width:100%;padding:6px 12px;background:none;border:0;color:#e9dcbc;font:inherit;cursor:pointer}#online .head i{width:8px;height:8px;border-radius:50%;background:#6bd36b;box-shadow:0 0 6px #6bd36b}#online.off .head i{background:#c0392b;box-shadow:none}#online .head .shard{color:#e9c46a}#online .head .count{margin-left:auto;font-weight:400;color:#c8b893}#online ul,#online .home{display:none}#online.open ul{display:block;list-style:none;margin:0;padding:0 12px 6px;max-height:260px;overflow-y:auto}#online li{display:flex;justify-content:space-between;gap:12px;padding:2px 0;color:#e9dcbc}#online li small{color:#9c8b6a}#online li.me{color:#9fd7ff}#online li.away{opacity:.5}#online.open .home{display:block;padding:6px 12px 8px;border-top:1px solid #0d0a07;color:#9c8b6a;text-decoration:none;font-size:12px}#online.open .home:hover{color:#e9c46a}#namegate{position:fixed;left:50%;top:50%;transform:translate(-50%,-50%);z-index:50;width:min(360px,90vw);padding:22px 24px;text-align:center;color:#e9dcbc}#namegate h2{margin:0 0 6px;color:#e9c46a;font-weight:400;letter-spacing:2px}#namegate p{margin:0 0 12px;font-size:14px}#namegate .err{color:#ff6b5b;min-height:1em;margin:6px 0}#namegate input{width:100%;box-sizing:border-box;padding:9px 12px;font:inherit;font-size:16px;color:#f3e6c4;background:#1a1510;border:1px solid #6b5532;border-radius:3px;outline:none}#namegate button{margin-top:6px;padding:9px 22px;font:inherit;font-size:15px;color:#1a1510;background:#e9c46a;border:1px solid #0d0a07;border-radius:3px;cursor:pointer}#loading.behind>*{opacity:0}#namegate{z-index:200}#namegate .back{display:block;margin-top:12px;font-size:12px;color:#b9a678;text-decoration:none}#namegate .back:hover{color:#e9c46a}:root{--site-bar-height: 48px}.site-bar{position:fixed;inset:0 0 auto;z-index:210;box-sizing:border-box;height:var(--site-bar-height);display:flex;align-items:center;justify-content:space-between;padding:0 clamp(8px,3vw,24px);gap:4px;background:#f3efff;color:#241b32;border-bottom:2px solid #241b32;font:600 clamp(12px,3.6vw,15px)/1 system-ui,sans-serif}.site-bar nav{display:flex;align-items:center;gap:clamp(0px,1vw,8px)}.site-bar a{color:inherit;text-decoration:none;padding:10px clamp(5px,1.5vw,12px);border-radius:8px;white-space:nowrap}.site-bar a:hover,.site-bar a:focus-visible{background:#e5dcfa}.site-bar .site-brand{font-weight:800;padding-left:0}.site-brand span{color:#6941bd}#hover,#help,#online{top:calc(var(--site-bar-height) + 8px)}#mapwrap{top:calc(var(--site-bar-height) + 10px)}#orbs{top:calc(var(--site-bar-height) + 18px)}#tracker{top:calc(var(--site-bar-height) + 36px)}#xpdrops{top:calc(var(--site-bar-height) + 100px)}#loading{top:var(--site-bar-height)}