:root{--bg: #0e0f0d;--panel: #1f201b;--panel2: #2a2b24;--line: #6a6650;--gold: #e3b85c;--gold2: #f3dc9e;--red: #b8322a;--green: #4f7a3a;--blue: #3a6a8a;--moss: #4c6438;--heather: #7a5a8a;--slate: #3a3e3a;--text: #ece6d6;--dim: #a8a290;--font: "Trebuchet MS", Verdana, "Segoe UI", sans-serif;--serif: Georgia, "Palatino Linotype", "Book Antiqua", serif;--knot: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='40' height='12' viewBox='0 0 40 12'%3E%3Crect width='40' height='12' fill='%23202224'/%3E%3Cpath d='M-5 6L0 1L5 6L0 11ZM35 6L40 1L45 6L40 11Z' fill='%233a4450'/%3E%3Cpath d='M5 6L10 1L15 6L10 11Z' fill='%2356743e'/%3E%3Cpath d='M15 6L20 1L25 6L20 11Z' fill='%233a4450'/%3E%3Cpath d='M25 6L30 1L35 6L30 11Z' fill='%237a5690'/%3E%3Cg fill='none'%3E%3Cpath d='M-1 0L10 11L20 1L30 11L41 0' stroke='%23121210' stroke-width='3.2'/%3E%3Cpath d='M-1 0L10 11L20 1L30 11L41 0' stroke='%23e3b85c' stroke-width='1.6'/%3E%3Cpath d='M-1 12L10 1L20 11L30 1L41 12' stroke='%23121210' stroke-width='3.2'/%3E%3Cpath d='M-1 12L10 1L20 11L30 1L41 12' stroke='%23e3b85c' stroke-width='1.6'/%3E%3Cpath d='M3.2 4.2L6.8 7.8M23.2 4.2L26.8 7.8' stroke='%23121210' stroke-width='3.2'/%3E%3Cpath d='M2.6 3.6L7.4 8.4M22.6 3.6L27.4 8.4' stroke='%23e3b85c' stroke-width='1.6'/%3E%3C/g%3E%3Crect width='40' height='1' fill='%238a7a4a'/%3E%3Crect y='11' width='40' height='1' fill='%238a7a4a'/%3E%3C/svg%3E")}*{box-sizing:border-box}html,body{margin:0;height:100%;background:var(--bg);color:var(--text);font-family:var(--font);font-size:13px;overflow:hidden;-webkit-user-select:none;user-select:none}.hidden{display:none!important}canvas{image-rendering:pixelated}button{font-family:var(--font)}#app{display:grid;grid-template-columns:1fr clamp(300px,17vw,360px);grid-template-rows:1fr 172px;height:100vh;width:100vw}#main{grid-column:1;grid-row:1;position:relative;overflow:hidden;border:3px solid #33342c;border-right:0;border-bottom:0;box-shadow:inset 0 0 0 1px #7a7454}#game{position:absolute;top:0;right:0;bottom:0;left:0}#side{grid-column:2;grid-row:1;background:linear-gradient(180deg,#26241e,#181b19);border-left:3px solid #33342c;display:flex;flex-direction:column;overflow:hidden}#bottom{grid-column:1;grid-row:2;display:flex;flex-direction:column;background:#0e0e0c;border-top:3px solid #33342c;border-left:3px solid #33342c}.band{height:12px;flex:none;background:var(--knot) repeat-x left center;opacity:.92}#chatlog{flex:1;overflow-y:auto;padding:6px 10px;font-size:13px;line-height:1.38;scrollbar-width:thin;scrollbar-color:#50533f #0e0e0c;-webkit-user-select:text;user-select:text}#chatlog .l{white-space:pre-wrap;word-break:break-word}#chatlog .say b{color:#fff}#chatlog .say{color:#e8e0d0}#chatlog .shout{color:#ffb050}#chatlog .whisper{color:#d8a0f0}#chatlog .group{color:#70e0a0}#chatlog .sys{color:#c8b890}#chatlog .info{color:#70c8ff}#chatlog .warn{color:#ff7a60}#chatlog .npc{color:#ffe070}#chatlog .emote{color:#d0a0ff;font-style:italic}#chatbar{display:flex;align-items:center;gap:6px;padding:4px 8px 6px;background:#1a1b17;border-top:1px solid #33342c}#chatmode{color:var(--gold);font-weight:700;min-width:46px;font-size:12px}#chatin{flex:1;background:#0b0b09;color:var(--text);border:1px solid #50533f;padding:5px 8px;font-family:var(--font);font-size:13px;outline:none}#chatin:focus{border-color:var(--gold);box-shadow:0 0 0 1px #e0b86655}.who{display:flex;gap:10px;padding:10px 10px 6px;align-items:center}.who canvas{width:64px;height:64px;border:2px solid var(--line);background:radial-gradient(circle at 50% 40%,#40433a,#141613);border-radius:4px}.who .nm{font-family:var(--serif);font-size:18px;color:var(--gold2)}.who .ti{color:var(--dim);font-size:12px}.who{position:relative}.sndbtn{position:absolute;top:8px;right:8px;width:26px;height:26px;border-radius:50%;border:1px solid var(--line);background:#1a1b16;color:var(--gold2);font-size:14px;line-height:1;cursor:pointer;padding:0}.sndbtn:hover{border-color:var(--gold)}.sndbtn.off{color:#6a6650;text-decoration:line-through}.sndpop{position:relative;margin:0 10px 8px;padding:10px 12px;background:#141510;border:1px solid var(--line);border-radius:6px;display:flex;flex-direction:column;gap:6px;font-size:12px}.sndpop.hidden{display:none}.sndpop .sr{display:flex;align-items:center;gap:8px}.sndpop .sr span{width:58px;color:var(--dim)}.sndpop .sr input[type=range]{flex:1;accent-color:var(--gold)}.sndpop .sr b{width:34px;text-align:right;font-weight:400;color:var(--gold2)}.bars{padding:2px 10px 4px}.bar{position:relative;height:15px;background:#0b0b09;border:1px solid #40433a;margin:3px 0;border-radius:2px;overflow:hidden}.bar>i{position:absolute;left:0;top:0;bottom:0;transition:width .25s}.bar>span{position:absolute;top:0;right:0;bottom:0;left:0;text-align:center;font-size:11px;line-height:13px;color:#fff;text-shadow:0 1px 1px #000,0 0 2px #000}.bar.hp>i{background:linear-gradient(180deg,#e85a4a,#9a2018)}.bar.mp>i{background:linear-gradient(180deg,#5a9af0,#1c4a9a)}.bar.xp{height:13px}.bar.xp>i{background:linear-gradient(180deg,#f0d070,#a07a20)}.bar.xp>span{font-size:10px;line-height:11px;letter-spacing:.5px}.statline{display:flex;flex-wrap:wrap;gap:4px 10px;padding:2px 10px 6px;font-size:12px;color:var(--dim)}.statline b{color:var(--text);font-weight:400}.statline .gold{color:#ffd860}.buffs{display:flex;gap:4px;padding:0 10px 4px;flex-wrap:wrap;min-height:4px}.buffs span{font-size:10px;padding:1px 5px;border-radius:8px;background:#3a2a10;border:1px solid #7a5a20;color:#ffe0a0}.buffs span.bad{background:#3a1010;border-color:#8a2a2a;color:#ffb0a0}.tabs{display:flex;border-top:1px solid #33342c;border-bottom:1px solid #33342c;background:#191a16}.tabs button{flex:1;background:none;border:0;color:var(--dim);padding:7px 0 6px;cursor:pointer;font-size:12px;border-bottom:2px solid transparent}.tabs button:hover{color:var(--text)}.tabs button.on{color:var(--gold2);border-bottom-color:var(--gold);background:linear-gradient(180deg,#24251f,#2c3626)}.tabs button kbd{font-family:var(--font);font-size:9px;color:#8a8670;margin-left:3px;vertical-align:1px}.tabs button.on kbd{color:var(--gold)}.tabbody{flex:1;min-height:0;overflow-y:auto;padding:8px;scrollbar-width:thin;scrollbar-color:#50533f #191a16}.minimap{padding:6px 8px 8px;border-top:1px solid #33342c}.minimap .mn{font-size:11px;color:var(--gold);margin-bottom:3px;display:flex;justify-content:space-between}.minimap canvas{cursor:pointer;width:100%;height:clamp(110px,calc(100vh - 720px),360px);background:#000;border:1px solid #40433a;image-rendering:pixelated}.grid{display:grid;grid-template-columns:repeat(6,1fr);gap:4px}.slot{position:relative;aspect-ratio:1;background:linear-gradient(180deg,#191a16,#121310);border:1px solid #40433a;border-radius:3px;cursor:pointer;display:flex;align-items:center;justify-content:center}.slot:hover{border-color:var(--gold);background:#262a22}.slot img{width:32px;height:32px;image-rendering:pixelated;pointer-events:none}.slot .k{position:absolute;left:2px;top:0;font-size:9px;color:#8a8670;pointer-events:none}.slot .q{position:absolute;right:2px;bottom:0;font-size:10px;color:#fff;text-shadow:0 0 2px #000,0 0 2px #000;pointer-events:none}.slot.drag{opacity:.4}.slot.over{border-color:#fff}.slot.eq{border-color:#6a8a4a}.slot.empty{border-style:dashed;border-color:#34352d}.slot.empty i{font-style:normal;font-size:20px;color:#3a3c33}.slot.new{animation:newItem .9s ease-out}@keyframes newItem{0%{border-color:#ffe080;box-shadow:0 0 10px #ffd06090,inset 0 0 8px #ffd06060}to{border-color:#40433a;box-shadow:none}}.hint{color:var(--dim);font-size:11px;margin:6px 0;line-height:1.4}.gear{display:grid;grid-template-columns:1fr 96px 1fr;gap:6px;align-items:center}.gear .col{display:flex;flex-direction:column;gap:6px}.gslot{display:flex;align-items:center;gap:6px;font-size:11px;color:var(--dim)}.gslot .slot{width:44px;flex:none}.gear canvas{width:96px;height:160px;background:radial-gradient(circle at 50% 60%,#2c3a30,#121310);border:1px solid #40433a;border-radius:4px}.stats{margin-top:10px;display:grid;grid-template-columns:1fr 1fr;gap:3px 12px;font-size:12px}.stats div{display:flex;justify-content:space-between;border-bottom:1px dotted #34352d;padding:2px 0}.stats b{color:var(--gold2);font-weight:400}.spell{display:flex;gap:8px;padding:6px;border:1px solid #33342c;border-radius:4px;margin-bottom:5px;background:#1c1d19;cursor:pointer}.spell:hover{border-color:var(--gold)}.spell.binding{border-color:#70e0ff;background:#102028}.sicon svg{width:82%;height:82%;display:block;overflow:visible;filter:drop-shadow(0 1px 1px #0009)}.sicon{width:34px;height:34px;flex:none;border-radius:6px;display:flex;align-items:center;justify-content:center;font-family:var(--serif);font-weight:700;font-size:17px;color:#fff;text-shadow:0 1px 2px #000,0 0 3px #000;-webkit-text-stroke:.6px #0008;border:1px solid #00000080;box-shadow:inset 0 0 8px #00000080}.spell .sn{color:var(--gold2)}.spell .sd{color:var(--dim);font-size:11px;line-height:1.3}.spell .sk{margin-left:auto;color:var(--gold);font-size:12px;white-space:nowrap}.quest{padding:7px;border:1px solid #33342c;border-radius:4px;margin-bottom:6px;background:#1c1d19}.quest .qn{color:var(--gold2);font-family:var(--serif);font-size:14px}.quest .qp{color:#90d0ff;font-size:12px;margin:2px 0}.quest .qd{color:var(--dim);font-size:11px;line-height:1.35}.quest.ready .qp{color:#80ff90}.quest.done{opacity:.55}.member{padding:6px;border:1px solid #33342c;border-radius:4px;margin-bottom:5px;background:#1c1d19}.member .mn{display:flex;justify-content:space-between;color:var(--gold2)}.member .mm{color:var(--dim);font-size:11px}.btn{background:linear-gradient(180deg,#4c533c,#2b3025);border:1px solid #8a7c54;color:var(--gold2);padding:5px 12px;border-radius:3px;cursor:pointer;font-size:12px}.btn:hover{background:linear-gradient(180deg,#62704a,#3a4630);border-color:var(--gold)}.btn.big{font-size:16px;padding:10px 26px;font-family:var(--serif);letter-spacing:1px}.btn.red{background:linear-gradient(180deg,#8a2a20,#5a1610);border-color:#c05040}.row{display:flex;gap:6px;align-items:center;margin:6px 0}.row input{flex:1;background:#0b0b09;color:var(--text);border:1px solid #50533f;padding:5px 7px;font-family:var(--font)}#spellbar{position:absolute;left:50%;bottom:10px;transform:translate(-50%);display:flex;gap:5px;padding:5px 7px;background:#121310d0;border:1px solid #6a6650;border-radius:6px;z-index:5}#spellbar .sb{position:relative;width:44px;height:44px;border:1px solid #40433a;border-radius:5px;background:#0b0b09;cursor:pointer;overflow:hidden}#spellbar .sb .sicon{width:100%;height:100%;border-radius:4px;font-size:18px}#spellbar .sb .key{position:absolute;left:3px;top:1px;font-size:10px;color:#ffe8b0;text-shadow:0 0 2px #000,0 0 2px #000;z-index:2}#spellbar .sb .mp{position:absolute;right:3px;bottom:1px;font-size:9px;color:#9cc8ff;text-shadow:0 0 2px #000;z-index:2}#spellbar .sb .cd{position:absolute;top:0;right:0;bottom:0;left:0;background:#000000a0;z-index:1}#spellbar .sb.empty{opacity:.35}#spellbar .sb.nomp .sicon{filter:grayscale(.8) brightness(.6)}#spellbar .sb.armed{border-color:#ffe060;box-shadow:0 0 8px #ffe060}#spellbar .sb.fail{animation:sbFail .32s ease-out}@keyframes sbFail{0%{transform:scale(1)}30%{transform:scale(.9);border-color:#ff5040;box-shadow:0 0 10px #ff5040}to{transform:scale(1)}}#spellmsg{position:absolute;left:50%;bottom:66px;transform:translate(-50%);color:#ff9a80;font-size:13px;text-shadow:0 1px 2px #000,0 0 4px #000;pointer-events:none;z-index:6;opacity:0;white-space:nowrap}#spellmsg.show{animation:spellMsg 1.1s ease-out}@keyframes spellMsg{0%{opacity:0;transform:translate(-50%,6px)}12%{opacity:1;transform:translate(-50%)}75%{opacity:1}to{opacity:0}}#bossbar{position:absolute;left:50%;top:14px;transform:translate(-50%);width:min(380px,60%);z-index:5;pointer-events:none;text-align:center}#bossbar .bn{font-family:var(--serif);font-size:16px;color:var(--gold2);text-shadow:0 1px 3px #000,0 0 6px #000;margin-bottom:3px}#bossbar .bn .ph{font-family:var(--font);font-size:11px;color:#ffb070;letter-spacing:1px;text-transform:uppercase;margin-left:8px}#bossbar.p3 .bn .ph{color:#ff6048}#bossbar .bb{position:relative}#bossbar .bb b{position:absolute;top:-1px;bottom:-1px;width:2px;margin-left:-1px;background:#f4e2b0;box-shadow:0 0 3px #000;opacity:.8}#bossbar.p3 .bb i{background:linear-gradient(180deg,#ff4a3a,#8a0c08);animation:bosspulse .7s ease-in-out infinite alternate}@keyframes bosspulse{0%{filter:brightness(1)}to{filter:brightness(1.35)}}#bossbar .bb{height:10px;background:#0b0b09d8;border:1px solid #8a7c54;border-radius:3px;overflow:hidden;box-shadow:0 2px 8px #000a}#bossbar .bb i{display:block;height:100%;background:linear-gradient(180deg,#ff6a4a,#a01c10);transition:width .25s}#toasts{position:absolute;top:64px;left:0;right:0;display:flex;flex-direction:column;align-items:center;gap:6px;pointer-events:none;z-index:8}.toast{background:#191a16e8;border:1px solid var(--gold);color:var(--gold2);padding:7px 18px;border-radius:4px;font-family:var(--serif);font-size:16px;animation:toastIn .25s ease-out;box-shadow:0 4px 14px #00000080}.toast.bad{border-color:#c05040;color:#ffb0a0;font-family:var(--font);font-size:13px}@keyframes toastIn{0%{transform:translateY(-10px) scale(.95);opacity:0}}body.ghost #game canvas{filter:saturate(.3) brightness(.88) hue-rotate(12deg)}#game canvas{transition:filter .6s}#ghostVeil{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;background:radial-gradient(ellipse at center,transparent 40%,#1a2a5ac0 100%);z-index:6;display:flex;align-items:flex-start;justify-content:center}#ghostVeil div{margin-top:110px;background:#0a1028b8;padding:10px 22px;border-radius:8px;border:1px solid #6070b0;font-family:var(--serif);font-size:22px;color:#c8d8ff;text-shadow:0 2px 6px #000;text-align:center}#ghostVeil small{display:block;font-family:var(--font);font-size:13px;color:#a8b8e0;margin-top:4px}#dialog{position:absolute;left:50%;bottom:72px;transform:translate(-50%);width:min(640px,92%);background:linear-gradient(180deg,#24251ff4,#191a16f4);border:2px solid #8a7c54;border-radius:6px;box-shadow:0 8px 30px #000000a0,inset 0 0 0 1px #33342c;z-index:10;display:flex;gap:14px;padding:14px 16px 12px}#dialog.top{bottom:auto;top:46px}#dialog canvas{width:96px;height:96px;flex:none;border:2px solid #6a6650;border-radius:4px;background:radial-gradient(circle at 50% 40%,#40433a,#141613)}#dialog .dn{font-family:var(--serif);color:var(--gold2);font-size:17px;margin-bottom:4px}#dialog .dt{font-size:14px;line-height:1.5;color:var(--text);min-height:42px}.yut{display:inline-flex;gap:5px;vertical-align:-4px;margin:0 4px}.yut i{width:16px;height:16px;border-radius:45% 55% 50% 40%;border:1px solid #2a2418}.yut i.flat{background:radial-gradient(circle at 50% 50%,#c8bc9c 2px,transparent 2.5px),linear-gradient(135deg,#f6efdc,#d6caa6)}.yut i.round{background:radial-gradient(ellipse 40% 30% at 50% 55%,#2a2014 70%,transparent 75%),linear-gradient(135deg,#b4a47e,#7a6a48);transform:rotate(18deg)}#dialog .rw{color:#e0c070;font-size:13px;margin-top:6px;padding-top:5px;border-top:1px dotted #50533f}#dialog .opts{margin-top:8px;display:flex;flex-direction:column;gap:3px}#dialog .opt{cursor:pointer;color:#ffd890;padding:3px 6px;border-radius:3px}#dialog .opt:hover,#dialog .opt.sel{background:#3a4630;color:#fff}#dialog .opt b{color:var(--gold);margin-right:6px}#dialog .close{position:absolute;right:8px;top:4px;color:var(--dim);cursor:pointer;font-size:18px}#modal{position:absolute;left:50%;top:50%;transform:translate(-50%,-54%);width:min(620px,94%);max-height:86%;background:linear-gradient(180deg,#24251ff8,#191a16f8);border:2px solid #8a7c54;border-radius:6px;z-index:12;display:flex;flex-direction:column;box-shadow:0 10px 40px #000000c0}#modal .mh{display:flex;justify-content:space-between;align-items:center;padding:10px 14px;border-bottom:1px solid #40433a;font-family:var(--serif);color:var(--gold2);font-size:17px}#modal .mh .x{cursor:pointer;color:var(--dim);font-family:var(--font)}#modal .mb{display:flex;gap:12px;padding:10px 14px 14px;overflow:hidden;min-height:0}#modal .mc{flex:1;display:flex;flex-direction:column;min-height:0}#modal .mc h4{margin:0 0 6px;color:var(--gold);font-weight:400;font-size:13px}#modal .list{overflow-y:auto;max-height:min(340px,calc(100vh - 350px));scrollbar-width:thin;scrollbar-color:#50533f #191a16}.li{display:flex;align-items:center;gap:8px;padding:4px 6px;border:1px solid transparent;border-radius:3px;cursor:pointer}.li:hover{border-color:#8a7c54;background:#262a22}.li img{width:32px;height:32px;image-rendering:pixelated}.li .nm{flex:1}.li .pr{color:#ffd860;white-space:nowrap;min-width:52px;text-align:right}.li .st{color:var(--dim);font-size:11px;white-space:nowrap}#modal .hint.foot{margin:8px 0 0;padding-top:6px;border-top:1px dotted #40433a}.li .rq{color:#ff8070;font-size:10px}.li.no{opacity:.5}#tip{position:fixed;z-index:100;max-width:260px;background:#121310f4;border:1px solid var(--gold);border-radius:4px;padding:8px 10px;pointer-events:none;font-size:12px;line-height:1.45;box-shadow:0 6px 18px #000000a0}#tip .tn{font-family:var(--serif);font-size:14px;color:var(--gold2)}#tip .tt{color:var(--dim);font-size:11px}#tip .ts{color:#a0e0a0}#tip .tr{color:#ff8070}#tip .td{color:#d8c8b0;font-style:italic;margin-top:3px}#ctx{position:fixed;z-index:101;background:#191a16;border:1px solid var(--gold);border-radius:4px;padding:3px 0;min-width:120px;box-shadow:0 6px 18px #000000a0}#ctx div{padding:5px 14px;cursor:pointer}#ctx div:hover{background:#3a4630;color:#fff}#ctx p{margin:0 0 3px;padding:4px 14px 5px;font-family:var(--serif);color:var(--gold2);border-bottom:1px solid #40433a}#help{position:absolute;top:40px;right:40px;bottom:40px;left:40px;background:#191a16f4;border:2px solid #8a7c54;border-radius:6px;z-index:20;padding:18px 26px;overflow-y:auto;line-height:1.6}#help h2{font-family:var(--serif);color:var(--gold2);margin:0 0 8px}#help h3{color:var(--gold);margin:14px 0 4px;font-size:14px}#help kbd{background:#33342c;border:1px solid #6a6650;border-radius:3px;padding:0 5px;color:#fff;font-family:var(--font);font-size:12px}#help .cols{display:grid;grid-template-columns:1fr 1fr;gap:0 30px}#help input[type=range]{accent-color:var(--gold)}#help .hx{position:absolute;right:14px;top:10px;cursor:pointer;color:var(--dim);font-size:18px}#help .hx:hover{color:var(--gold2)}#title{position:fixed;top:0;right:0;bottom:0;left:0;z-index:50;display:flex;align-items:center;justify-content:center;background:#0b0b09;overflow:hidden}#title .bg{position:absolute;top:-10%;right:-10%;bottom:-10%;left:-10%;background-size:cover;filter:brightness(.45) saturate(.9) blur(1px);image-rendering:pixelated;animation:pan 60s linear infinite alternate}@keyframes pan{0%{transform:translate(0) scale(1.1)}to{transform:translate(-6%,-4%) scale(1.15)}}#title .vignette{position:absolute;top:0;right:0;bottom:0;left:0;background:radial-gradient(ellipse at center,transparent 30%,#05080acc 100%),linear-gradient(180deg,#1a2a3a40,transparent 40%,#0a100c60)}#title .mist{position:absolute;left:-50%;width:200%;height:55%;pointer-events:none;background:radial-gradient(ellipse 22% 38% at 15% 50%,#c8d0d4 0%,transparent 70%),radial-gradient(ellipse 18% 30% at 42% 40%,#b8c4c8 0%,transparent 70%),radial-gradient(ellipse 26% 40% at 70% 55%,#c8d0d4 0%,transparent 70%),radial-gradient(ellipse 16% 30% at 92% 45%,#b8c4c8 0%,transparent 70%);filter:blur(18px);animation:mist 70s linear infinite alternate}#title .mist.m1{bottom:-14%;opacity:.2}#title .mist.m2{top:4%;opacity:.1;animation-duration:95s;animation-direction:alternate-reverse}@keyframes mist{0%{transform:translate(0)}to{transform:translate(25%)}}#title .leaf{position:absolute;top:-20px;width:9px;height:6px;border-radius:80% 0;opacity:.85;animation:fall linear infinite;box-shadow:inset -1px -1px #0003}@keyframes fall{0%{transform:translate(0) rotate(0) scale(var(--s, 1))}50%{transform:translate(-70px,55vh) rotate(300deg) scale(var(--s, 1))}to{transform:translate(-40px,110vh) rotate(720deg) scale(var(--s, 1))}}#title .box{position:relative;text-align:center;width:min(640px,94vw)}#title h1{font-family:var(--serif);font-size:clamp(38px,5.2vw,60px);white-space:nowrap;margin:0;color:var(--gold2);letter-spacing:3px;text-shadow:0 0 30px #e0a04050,0 4px 0 #23241c,0 6px 14px #000}#title .ko{font-size:26px;color:#c9a85a;line-height:0;margin:4px 0 6px;filter:drop-shadow(0 2px 4px #000)}#title .sub{color:#c4c0ae;font-style:italic;margin-bottom:22px;font-family:var(--serif);font-size:15px}#title .card{background:linear-gradient(180deg,#22231ee8,#171916e8);border:1px solid #6a6650;border-radius:6px;padding:18px 22px;text-align:left;box-shadow:0 10px 40px #000}#title .status{font-size:12px;color:var(--dim);text-align:center;margin-top:12px}#title .status.on{color:#80e0a0}#title label{display:block;color:var(--gold);font-size:12px;margin:10px 0 4px}#title input[type=text]{width:100%;background:#0b0b09;color:var(--text);border:1px solid #6a6650;padding:8px 10px;font-size:16px;font-family:var(--serif);outline:none}#title input[type=text]:focus{border-color:var(--gold)}.creator{display:flex;gap:18px}.creator .pv{flex:none;width:120px;display:flex;flex-direction:column;align-items:center;gap:6px}.creator .pv canvas{width:112px;height:176px;background:radial-gradient(circle at 50% 60%,#2c3a30,#121310);border:1px solid #40433a;border-radius:4px}.swatches{display:flex;gap:5px;flex-wrap:wrap}.sw{min-width:28px;height:26px;border:2px solid #33342c;border-radius:4px;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:12px;padding:0 6px;background:#121310}.sw.on{border-color:var(--gold2);box-shadow:0 0 6px #e0b86680}.chars{display:flex;flex-direction:column;gap:6px;margin-bottom:10px}.charrow{display:flex;align-items:center;gap:10px;padding:8px 10px;border:1px solid #40433a;border-radius:4px;cursor:pointer;background:#121310}.charrow:hover{border-color:var(--gold)}.charrow .cn{font-family:var(--serif);font-size:16px;color:var(--gold2);flex:1}.charrow .cl{color:var(--dim);font-size:12px}.charrow .cp{width:32px;height:32px;border:1px solid #40433a;border-radius:3px;background:radial-gradient(circle at 50% 40%,#40433a,#141613)}.charrow .del{color:#a05040;font-size:11px;padding:2px 6px;margin-left:12px;opacity:0;transition:opacity .15s}.charrow:hover .del{opacity:1}.charrow .del:hover{color:#ff7060}.err{color:#ff7a60;font-size:12px;min-height:16px;margin-top:6px}.howto{font-size:12px;color:var(--dim);line-height:1.55;margin-top:12px}.howto b{color:var(--gold2);font-weight:400}#tracker{position:absolute;right:10px;top:10px;width:210px;opacity:.85;background:#12131090;border:1px solid #6a665090;border-radius:4px;padding:6px 9px;z-index:4;pointer-events:none}#tracker .th{font-family:var(--serif);color:var(--gold);font-size:13px;margin-bottom:3px}#tracker .tq{font-size:12px;color:var(--text);margin:3px 0}#tracker .tq small{display:block;color:#90c8ff;font-size:11px}#tracker .tq.ready small{color:#80ff90}#tracker .tq.flash{animation:tqFlash .7s ease-out;border-radius:3px}@keyframes tqFlash{0%{background:#2a5a2ad0}to{background:transparent}}#main:has(#dialog:not(.hidden)) #tracker,#main:has(#modal:not(.hidden)) #tracker,#main:has(#help:not(.hidden)) #tracker,#main:has(#worldmap:not(.hidden)) #tracker{opacity:0}#main:has(#modal:not(.hidden)) #bossbar{display:none}#lowhp{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:2;opacity:0;box-shadow:inset 0 0 120px 30px #c00000;transition:opacity .4s}#lowhp.on{animation:pulseRed 1.1s ease-in-out infinite}@keyframes pulseRed{0%,to{opacity:.15}50%{opacity:.55}}#intro{position:fixed;top:0;right:0;bottom:0;left:0;z-index:60;background:radial-gradient(ellipse at center,#191a16d8,#000000f0);display:flex;align-items:center;justify-content:center;animation:fadeIn .8s;cursor:pointer}#intro.out{opacity:0;transition:opacity .6s}#intro .scroll{width:min(640px,90vw);padding:34px 44px 22px;background:linear-gradient(180deg,#e9dcc0,#d8c49c);color:#2a1a0e;border-radius:4px;box-shadow:0 0 0 6px #383b30,0 0 0 9px #c9a35a,0 20px 60px #000;position:relative}#intro .scroll:before,#intro .scroll:after{content:"";position:absolute;left:-14px;right:-14px;height:16px;background:linear-gradient(180deg,#5a4c36,#26221a);border-radius:8px}#intro .scroll:before{top:-14px}#intro .scroll:after{bottom:-14px}#intro .txt{font-family:var(--serif);font-size:20px;line-height:1.6;min-height:130px}#intro .nav{display:flex;justify-content:space-between;margin-top:14px;color:#6a4a2a;font-size:13px}#intro .skip{cursor:pointer;text-decoration:underline}#intro .dots{display:flex;gap:7px;align-items:center}#intro .dots i{width:8px;height:8px;border-radius:50%;border:1.5px solid #6a4a2a}#intro .dots i.on{background:#6a4a2a}#intro .hint{text-align:center;color:#8a6a4a;font-size:11px;margin-top:6px}@keyframes fadeIn{0%{opacity:0}}#party{position:absolute;left:10px;top:10px;width:170px;z-index:4;display:flex;flex-direction:column;gap:5px}#party .pf{background:#121310c0;border:1px solid #6a665090;border-radius:4px;padding:4px 6px;cursor:pointer}#party .pf:hover{border-color:var(--gold)}#party .pn{font-size:12px;color:var(--gold2)}#party .pn small{color:var(--dim)}#party .bar{height:8px;margin:2px 0}#worldmap{position:absolute;top:0;right:0;bottom:0;left:0;z-index:15;background:#0b0b09d8;display:flex;align-items:center;justify-content:center;cursor:pointer}#worldmap .wm{width:min(760px,94%);background:linear-gradient(180deg,#e9dcc0,#d2bc92);border-radius:6px;box-shadow:0 0 0 5px #383b30,0 0 0 8px #c9a35a,0 20px 60px #000;padding:14px 20px;color:#2a1a0e}#worldmap h2{margin:0;text-align:center;font-family:var(--serif);color:#2e3a24;letter-spacing:1px}#worldmap h2:after{content:"";display:block;height:12px;width:46%;margin:4px auto 0;background:var(--knot) repeat-x center;border-radius:2px}#worldmap svg{width:100%;height:auto;max-height:calc(100vh - 300px);display:block}#worldmap line{stroke:#6a5a3a;stroke-width:4;stroke-dasharray:8 6}#worldmap rect{fill:#f4ead4;stroke:#6a4020;stroke-width:2}#worldmap .here rect{fill:#f6e6b0;stroke:#5a3a78;stroke-width:3}#worldmap text{text-anchor:middle;font-family:var(--font)}#worldmap .nm{font-family:var(--serif);font-size:16px;font-weight:700;fill:#3a1a08}#worldmap .lv{font-size:12px;fill:#5a4c36}#worldmap .nt{font-size:10px;fill:#5a4030}#worldmap .you{font-size:12px;fill:#5a3a78;font-weight:700}#worldmap .hint{text-align:center;font-size:12px;color:#6a4a2a}.classban{position:absolute;left:0;right:0;top:26%;text-align:center;z-index:9;pointer-events:none;padding:14px 0 16px;background:linear-gradient(90deg,transparent,#0b0b09c8 22% 78%,transparent);animation:classIn .6s ease-out;transition:opacity .8s}.classban b{display:block;font-family:var(--serif);font-size:64px;letter-spacing:6px;text-shadow:0 0 24px #000,0 4px 0 #1a0a04}.classban small{display:block;color:var(--gold2);font-family:var(--serif);font-size:16px;text-shadow:0 2px 6px #000}.classban.out{opacity:0}@keyframes classIn{0%{transform:scale(1.4);opacity:0}}#ending{position:fixed;top:0;right:0;bottom:0;left:0;z-index:70;background:radial-gradient(ellipse at center,#22261ad8,#000000f0);display:flex;align-items:center;justify-content:center;cursor:pointer;animation:fadeIn 1.2s}#ending .scroll{width:min(620px,90vw);padding:30px 40px;background:linear-gradient(180deg,#f1e4c4,#d8c49c);color:#2a1a0e;border-radius:4px;box-shadow:0 0 0 6px #383b30,0 0 0 9px #e0b866,0 0 80px #ffd06060;text-align:center;font-family:var(--serif);font-size:17px;line-height:1.6}#ending h2{font-size:40px;margin:0 0 10px;color:#3a4a26;letter-spacing:2px;text-shadow:0 1px 0 #fff8}#ending .knot{height:12px;width:60%;margin:0 auto 12px;background:var(--knot) repeat-x center;border-radius:2px}#ending .st{color:#4a3a5e;font-weight:700}#ending .hint{font-size:12px;color:#8a6a4a;font-family:var(--font)}#disconnected{position:fixed;top:0;right:0;bottom:0;left:0;z-index:80;background:#000000c0;display:flex;align-items:center;justify-content:center}#disconnected .scroll{background:linear-gradient(180deg,#24251f,#191a16);border:2px solid #8a7c54;border-radius:6px;padding:24px 34px;text-align:center;color:var(--text);max-width:420px}#disconnected h2{font-family:var(--serif);color:var(--gold2);margin:0 0 8px}@media (max-height: 700px){#app{grid-template-rows:1fr 124px}.minimap canvas{height:110px}.who{padding:6px 10px 4px}.who canvas{width:48px;height:48px}#toasts{top:40px}}@media (max-width: 1200px){#toasts{right:230px}}@media (min-width: 1700px){#side{font-size:14px}.bar{height:17px}.bar>span{font-size:12px;line-height:15px}.statline,.tabs button{font-size:13px}.hint{font-size:12px}}.legend{margin-top:10px}.legend h4{margin:0 0 4px;font-family:var(--serif);color:var(--gold);font-weight:400;font-size:14px}.legend ul{list-style:none;margin:0;padding:0}.legend .lm{display:flex;justify-content:space-between;gap:8px;padding:3px 0 3px 12px;border-bottom:1px dotted #34352d;font-size:12px;position:relative}.legend .lm:before{content:"";position:absolute;left:0;top:8px;width:6px;height:6px;border-radius:50%;background:#a8a290}.legend .lm small{color:var(--dim);font-size:10px;white-space:nowrap}.legend .lm b{color:var(--gold2);font-weight:400}.legend .lm.class:before{background:#70c8ff}.legend .lm.boss:before{background:#ff6040}.legend .lm.quest:before{background:#80e090}.legend .lm.hero:before{background:#ffd860;box-shadow:0 0 5px #ffd860}.legend .lm.hero span{color:#ffe08a}[data-stat]{cursor:help}#legendbox{position:absolute;top:0;right:0;bottom:0;left:0;z-index:16;display:flex;align-items:center;justify-content:center;background:#0006}#legendbox .lb{position:relative;width:min(380px,90%);max-height:70%;overflow-y:auto;background:linear-gradient(180deg,#24251ff8,#191a16f8);border:2px solid #8a7c54;border-radius:6px;padding:14px 18px;box-shadow:0 10px 40px #000c}#legendbox h3{margin:0;font-family:var(--serif);color:var(--gold2);font-size:18px}#legendbox .x{position:absolute;right:12px;top:8px;color:var(--dim);cursor:pointer}#tracker{transition:opacity .25s}#tracker.dim{opacity:.3}#invitebox{position:absolute;left:50%;bottom:78px;transform:translate(-50%);z-index:11;display:flex;align-items:center;gap:10px;background:linear-gradient(180deg,#24251ff4,#191a16f4);border:2px solid #8a7c54;border-radius:6px;padding:8px 12px;box-shadow:0 8px 24px #000a;font-family:var(--serif);color:var(--gold2);animation:toastIn .25s ease-out}#ghostVeil div{transition:all .6s}#ghostVeil.slim div{margin-top:10px;padding:4px 14px;font-size:14px}#ghostVeil.slim small{display:none}#vitals{grid-column:2;grid-row:2;background:linear-gradient(180deg,#24251f,#141512);border-left:3px solid #33342c;border-top:3px solid #33342c;display:flex;flex-direction:column;justify-content:center;gap:6px;padding:0 12px 6px}#vitals .band{margin:0 -12px 2px}#vitals .vrow{display:flex;align-items:center;gap:8px}#vitals .vl{width:38px;font-family:var(--serif);color:var(--gold);font-size:13px;text-align:right}#vitals .bar{flex:1;height:20px;margin:0;border-color:#6a6650;box-shadow:inset 0 1px 3px #000c}#vitals .bar>span{font-size:12px;line-height:18px}#vitals .bar.xp{height:12px}#vitals .bar.xp>span{font-size:10px;line-height:10px}#vitals .vgold{text-align:right;color:#ffd860;font-size:13px;padding-top:2px}#vitals .vgold b{font-weight:400;color:#ffe8a0}@media (max-height: 700px){#vitals{gap:3px}#vitals .bar{height:15px}#vitals .bar>span{line-height:13px;font-size:11px}#vitals .vgold{display:none}}