*{box-sizing:border-box}html,body{color:#eee;-webkit-user-select:none;user-select:none;background:#0b0b12;width:100%;height:100%;margin:0;padding:0;font-family:Trebuchet MS,Verdana,sans-serif;overflow:hidden}#app{transform-origin:50%;width:1040px;height:640px;display:flex;position:absolute;top:50%;left:50%;box-shadow:0 0 40px #000}#gamewrap{cursor:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='40' height='40' viewBox='0 0 40 40' fill='none' stroke-linecap='round'%3E%3Cg stroke='%23000' stroke-width='6'%3E%3Ccircle cx='20' cy='20' r='10'/%3E%3Cpath d='M20 2v10M20 28v10M2 20h10M28 20h10'/%3E%3C/g%3E%3Cg stroke='%23fff' stroke-width='3'%3E%3Ccircle cx='20' cy='20' r='10'/%3E%3Cpath d='M20 2v10M20 28v10M2 20h10M28 20h10'/%3E%3C/g%3E%3Ccircle cx='20' cy='20' r='2' fill='%23ff3030' stroke='%23000' stroke-width='1'/%3E%3C/svg%3E") 20 20,crosshair;background:#000;width:800px;height:640px;position:relative}#game{image-rendering:pixelated;display:block}#panel{background:#2a2a2e;border-left:3px solid #111;flex-direction:column;gap:4px;width:240px;height:640px;padding:8px;font-size:12px;display:flex;overflow:hidden}#minimap{image-rendering:pixelated;background:#000;border:2px solid #111;width:224px;height:150px}#charinfo{align-items:center;gap:6px;height:34px;display:flex}#charinfo canvas{image-rendering:pixelated}#charinfo .name{font-size:14px;font-weight:700}#charinfo .sub{color:#aaa;font-size:11px}.bar{background:#444;border:1px solid #111;height:15px;position:relative}.bar .fill{position:absolute;top:0;bottom:0;left:0}.bar span{text-align:center;text-shadow:1px 1px #000;width:100%;font-size:11px;font-weight:700;line-height:13px;position:absolute}#xpbar .fill{background:#4caf50}#xpbar.fame .fill{background:#e08a1e}#hpbar .fill{background:#e03434}#mpbar .fill{background:#3a6fe0}#stats{grid-template-columns:1fr 1fr;gap:1px 10px;padding:2px 4px;display:grid}#stats div{justify-content:space-between;display:flex}#stats .lbl{color:#bbb}#stats .val{font-weight:700}#stats .val.maxed{color:#ffd84a}#stats .bonus{color:#6f6}#stats .malus{color:#f66}.slots{grid-template-columns:repeat(4,50px);justify-content:center;gap:4px;display:grid}.slot{background:#545458;border:2px solid #3a3a3e;border-radius:4px;justify-content:center;align-items:center;width:50px;height:50px;display:flex;position:relative}.slot.eq{background:#46464c}.slot canvas{image-rendering:pixelated;pointer-events:none}.slot .key{color:#999;pointer-events:none;font-size:9px;position:absolute;top:0;left:2px}.slot .ph{color:#777;pointer-events:none;text-align:center;font-size:9px;position:absolute}.slot.bad{background:#6a3434}.slot.hover{border-color:#ddd}.slot .tierlbl{pointer-events:none;text-shadow:1px 1px #000;font-size:10px;font-weight:700;position:absolute;bottom:0;right:2px}#pots{justify-content:center;gap:6px;display:flex}#pots .pot{cursor:pointer;background:#3a3a3e;border-radius:4px;align-items:center;gap:4px;padding:2px 8px;font-weight:700;display:flex}#extra{flex-direction:column;flex:1;gap:4px;min-height:0;display:flex}#extra .title{text-align:center;color:#ffd84a;font-weight:700}#extra .btn{margin:0 auto}#extra .scroll{flex:1;min-height:0;overflow-y:auto}.btn{color:#fff;cursor:pointer;background:#4a4a8a;border:2px solid #22224a;border-radius:4px;padding:6px 14px;font-family:inherit;font-size:13px;font-weight:700}.btn:hover{background:#5c5cb0}.btn.red{background:#8a3a3a;border-color:#4a1a1a}.btn.red:hover{background:#b04a4a}.btn.gold{background:#9a7a1a;border-color:#4a3a0a}.btn.gold:hover{background:#c09a2a}.btn:disabled{color:#888;cursor:default;background:#444}#chat{pointer-events:none;text-shadow:1px 1px #000,-1px -1px #000,1px -1px #000,-1px 1px #000;width:440px;font-size:12px;font-weight:700;position:absolute;bottom:34px;left:6px}#chat div{margin-top:2px;transition:opacity 1s}#party{flex-direction:column;gap:4px;width:150px;display:flex;position:absolute;top:6px;left:6px}#party .pm{color:#60e0ff;background:#0a0a14b3;border:2px solid #3a8aa0;border-radius:4px;padding:3px 5px;font-size:11px;font-weight:700}#party .pm:hover{background:#143246d9;border-color:#60e0ff}#party .pn small{color:#9ab;font-weight:400}#party .phb{background:#400;height:5px;margin-top:2px}#party .phb i{background:#e03030;height:100%;display:block}#party .pa{color:#9ab;margin-top:1px;font-size:10px;font-weight:400}#app.menu #party{display:none}#chatinput{color:#fff;background:#0a0a14d9;border:2px solid #668;border-radius:4px;outline:none;width:440px;padding:4px 6px;font:700 12px Verdana,sans-serif;display:none;position:absolute;bottom:6px;left:6px}#online{color:#ccc;margin:2px 0 6px;font-size:12px}#overlay{display:none;position:absolute;inset:0}#overlay.show{cursor:default;background:#05050cd1;justify-content:center;align-items:center;display:flex}.screen{text-align:center;width:720px;max-height:600px;padding:10px;overflow-y:auto}.screen h1{color:#ff5a3a;text-shadow:3px 3px #000,0 0 20px #f40;letter-spacing:2px;margin:4px 0;font-size:44px}.screen h2{color:#ffd84a;text-shadow:2px 2px #000;margin:8px 0}.screen p{color:#ccc}.cards{flex-wrap:wrap;justify-content:center;gap:10px;margin:12px 0;display:flex}.card{cursor:pointer;background:#26263a;border:2px solid #446;border-radius:6px;flex-direction:column;align-items:center;gap:4px;width:210px;padding:8px;display:flex}.card:hover{background:#303050;border-color:#9a9aff}.card.locked{opacity:.5;cursor:default}.card.locked:hover{background:#26263a;border-color:#446}.card canvas{image-rendering:pixelated}.card .cname{font-size:15px;font-weight:700}.card .cdesc{color:#bbb;min-height:28px;font-size:11px}.card .row{gap:6px;display:flex}.fame{color:#ffa83a;font-weight:700}.help{text-align:left;grid-template-columns:130px 1fr;gap:3px 10px;width:520px;margin:10px auto;font-size:13px;display:grid}.help b{color:#ffd84a}#tooltip{pointer-events:none;z-index:100;color:#ddd;background:#14141cf5;border:2px solid #777;border-radius:4px;max-width:260px;padding:8px;font-size:12px;display:none;position:fixed}#tooltip .tname{font-size:14px;font-weight:700}#tooltip .tdesc{color:#aaa;margin:3px 0;font-style:italic}#tooltip .tline{margin:1px 0}#tooltip .tline b{color:#fff}#tooltip .good{color:#6f6}#tooltip .warn{color:#f66}#tooltip .hint{color:#888;margin-top:4px;font-size:10px}#dragghost{pointer-events:none;z-index:101;display:none;position:fixed}#dragghost canvas{image-rendering:pixelated}.shopitem{background:#3a3a3e;border-radius:4px;align-items:center;gap:6px;margin-bottom:3px;padding:3px;display:flex}.shopitem .sname{flex:1;font-size:11px;font-weight:700}.shopitem .btn{padding:2px 6px;font-size:11px}.grave{background:#26263a;border-radius:4px;justify-content:space-between;margin:3px 0;padding:4px 10px;font-size:12px;display:flex}#app.menu #panel>*{visibility:hidden}#app.menu #chat{display:none}#win{cursor:default;background:#24242ef5;border:2px solid #777;border-radius:6px;flex-direction:column;gap:6px;width:252px;max-height:520px;padding:10px;display:none;position:absolute;top:64px;right:12px}#win.show{display:flex}#win .title{text-align:center;color:#ffd84a;font-size:14px;font-weight:700}#win .scroll{flex:1;min-height:0;overflow-y:auto}#win .sub{text-align:center;color:#999;font-size:10px}:root{--u:1;--hl:max(10px, calc(var(--sl) * .4));--hr:max(10px, calc(var(--sr) * .4));--sl:env(safe-area-inset-left,0px);--sr:env(safe-area-inset-right,0px);--st:env(safe-area-inset-top,0px);--sb:env(safe-area-inset-bottom,0px)}html,body{-webkit-touch-callout:none;-webkit-user-select:none;-webkit-tap-highlight-color:transparent;overscroll-behavior:none}#touch,#t-close{display:none}#app.mobile{width:100%;height:100%;box-shadow:none;display:block;position:fixed;top:0;left:0;transform:none}#app.mobile #gamewrap{cursor:default;touch-action:none;width:100%;height:100%}#app.mobile #game{width:100%;height:100%}#app.mobile #touch{touch-action:none;display:block;position:absolute;inset:0}#app.mobile.menu #touch{display:none}#app.mobile input,#app.mobile select{font-size:16px}#t-tl{left:var(--hl);top:calc(var(--st) + 8px);width:calc(var(--u) * 190px);pointer-events:none;flex-direction:column;gap:3px;display:flex;position:absolute}#app.mobile .bar{height:calc(var(--u) * 15px);background:#282830cc;border-radius:3px;overflow:hidden}#app.mobile .bar span{line-height:calc(var(--u) * 15px - 2px);font-size:calc(var(--u) * 10px)}#app.mobile #xpbar{height:calc(var(--u) * 9px)}#app.mobile #xpbar span{line-height:calc(var(--u) * 9px - 2px);font-size:calc(var(--u) * 7.5px)}#app.mobile #party{pointer-events:auto;width:100%;margin-top:3px;position:static}#app.mobile #chat{width:min(36vw,320px);margin-top:4px;margin-left:calc(var(--sl) - var(--hl));font-size:calc(var(--u) * 10px);line-height:1.25;position:static}#app.mobile #chat div:nth-last-child(n+5){display:none}#t-tr{right:var(--hr);top:calc(var(--st) + 8px);align-items:flex-start;gap:6px;display:flex;position:absolute}#t-tr .t-col{flex-direction:column;gap:6px;display:flex}#app.mobile #minimap{width:calc(var(--u) * 150px);height:calc(var(--u) * 100px);pointer-events:none;border:2px solid #fff3;border-radius:6px;display:block}.tb{width:calc(var(--s,56) * var(--u) * 1px);height:calc(var(--s,56) * var(--u) * 1px);right:calc(var(--sr) + (var(--r,0) - var(--s,56) / 2) * var(--u) * 1px);bottom:calc(var(--sb) + (var(--b,0) - var(--s,56) / 2) * var(--u) * 1px);color:#fff;font:bold calc(var(--u) * 13px) "Trebuchet MS", Verdana, sans-serif;touch-action:none;background:#10101c8c;border:2px solid #ffffff47;border-radius:50%;justify-content:center;align-items:center;padding:0;transition:transform 60ms,background 60ms;display:flex;position:absolute;box-shadow:0 2px 8px #00000080}.tb:active,.tb.held{background:#50508cb3;transform:scale(.9)}.tb canvas{image-rendering:pixelated;pointer-events:none;display:block}.tb span{pointer-events:none}.tb .n{min-width:calc(var(--u) * 20px);font-size:calc(var(--u) * 11px);line-height:calc(var(--u) * 14px);background:#111;border:2px solid #ffffff4d;border-radius:10px;padding:1px 4px;position:absolute;bottom:-4px;right:-4px}.tb.dim{opacity:.45}.tb.sm{--s:38;border-radius:10px;position:static}.tb.sm svg{fill:none;stroke:#fff;stroke-width:2.4px;stroke-linecap:round;stroke-linejoin:round;width:60%;height:60%}#t-ab{--s:72;--r:240;--b:62;border-color:#ffd84a99}#t-ab .n{color:#9ab8ff;bottom:-8px;left:50%;right:auto;transform:translate(-50%)}#t-ab.dim{opacity:.55;filter:grayscale(.7)}#t-hp{--s:52;--r:205;--b:152;border-color:#ff5a5a8c}#t-mp{--s:52;--r:285;--b:140;border-color:#5a8cff8c}#t-nexus{--s:0;width:calc(var(--u) * 84px);height:calc(var(--u) * 34px);right:var(--hr);bottom:auto;top:calc(var(--st) + 18px + var(--u) * 100px);letter-spacing:1px;background:#961e1eb3;border-color:#ff8c8c99;border-radius:17px}#t-nexus.hide{display:none}#t-nexus.urgent{animation:.8s infinite alternate nexuspulse}@keyframes nexuspulse{0%{box-shadow:0 0 4px #f33}to{background:#dc2828e6;box-shadow:0 0 22px 6px #f33}}#t-inv{--s:58;left:50%;right:auto;bottom:calc(var(--sb) + 8px);border-radius:14px;transform:translate(-50%)}#t-inv:active{transform:translate(-50%)scale(.9)}.chip{right:calc(var(--hr) + var(--u) * 84px + 8px);top:calc(var(--st) + 18px + var(--u) * 100px);height:calc(var(--u) * 34px);color:#cfc;font:bold calc(var(--u) * 10px) Verdana, sans-serif;background:#1e5a28b3;border:2px solid #78ff8c80;border-radius:17px;padding:0 10px;position:absolute}.chip:after{content:" ON"}.chip.off{color:#999;background:#282830b3;border-color:#fff3}.chip.off:after{content:" OFF"}.stick{pointer-events:none;background:radial-gradient(#ffffff05,#ffffff1a);border:2px solid #ffffff4d;border-radius:50%;width:112px;height:112px;margin:-56px 0 0 -56px;display:none;position:absolute}.stick .knob{background:#ffffff73;border:2px solid #ffffffb3;border-radius:50%;width:50px;height:50px;margin:-25px 0 0 -25px;position:absolute;top:50%;left:50%}.stick.on{display:block}.stick.home{opacity:.3;display:block}#t-move.home{left:calc(var(--sl) + 120px);top:calc(100% - var(--sb) - 100px)}#t-aim.home{left:calc(100% - var(--sr) - 112px);top:calc(100% - var(--sb) - 110px)}#t-aim .knob{background:#ff785a80;border-color:#ffb4a0cc}#t-ctx{left:calc(50% - 40px);bottom:calc(var(--sb) + 16px + var(--u) * 58px);pointer-events:none;flex-direction:column;align-items:center;gap:6px;display:flex;position:absolute;transform:translate(-50%)}#t-loot{pointer-events:auto;background:#0a0a14bf;border:2px solid #888;border-radius:8px;grid-template-columns:repeat(4,48px);align-items:center;gap:4px;padding:5px;display:none}#t-loot.show{display:grid}#t-loot .slot{width:48px;height:48px}#t-loot .btn{grid-column:1/-1;padding:6px 8px;font-size:13px}#t-enter{pointer-events:auto;background:#28285ad9;border-width:3px;padding:10px 22px;font-size:16px;display:none}#t-enter.show{display:block}#app.mobile #panel{height:auto;width:calc(262px + var(--sr));z-index:50;padding:calc(var(--st) + 10px) calc(var(--sr) + 11px) calc(var(--sb) + 10px) 11px;background:#24242af7;border-left:3px solid #111;gap:6px;transition:transform .18s ease-out;position:fixed;top:0;bottom:0;right:0;overflow-y:auto;transform:translate(105%);box-shadow:-6px 0 20px #0009}#app.mobile #panel.open{transform:none}#app.mobile.menu #panel{display:none}#app.mobile #t-close{right:calc(var(--sr) + 8px);top:calc(var(--st) + 8px);font-size:18px;display:flex;position:absolute}#app.mobile #pots .pot{padding:6px 12px;font-size:14px}#app.mobile #extra{flex:none}#app.mobile #win{right:calc(272px + var(--sr));top:calc(var(--st) + 8px);max-height:calc(100% - var(--st) - var(--sb) - 16px)}#app.mobile #chatinput{left:50%;top:calc(var(--st) + 8px);z-index:5;width:min(480px,70%);padding:8px 10px;bottom:auto;transform:translate(-50%)}#tooltip.inspect{pointer-events:auto;max-width:280px}#tooltip .acts{flex-wrap:wrap;gap:6px;margin-top:8px;display:flex}#tooltip .acts .btn{flex:auto;padding:9px 10px;font-size:14px}#app.mobile #overlay.show{-webkit-overflow-scrolling:touch;touch-action:pan-y;align-items:safe center;overflow-y:auto}#app.mobile .screen{width:100%;max-width:760px;max-height:none;padding:calc(var(--st) + 10px) calc(var(--sr) + 12px) calc(var(--sb) + 16px) calc(var(--sl) + 12px);overflow:visible}#app.mobile .help{grid-template-columns:auto 1fr;width:auto;max-width:560px}#app.mobile .screen>div[style*=width\:560px],#app.mobile .screen>div[style*=width\:360px]{max-width:100%}#app.mobile .btn{padding:9px 16px;font-size:14px}#app.mobile .screen label{align-items:center;gap:8px;font-size:15px;display:flex}#app.mobile .screen input[type=range]{width:160px}@media (height<=500px){#app.mobile .screen h1{font-size:32px}#app.mobile .cards{gap:8px;margin:8px 0}#app.mobile .card{width:196px}}@media (orientation:portrait) and (width<=500px){#t-ab{--r:150;--b:70;--s:68}#t-hp{--r:60;--b:170;--s:50}#t-mp{--r:60;--b:232;--s:50}#t-inv{left:calc(var(--sl) + 16px);transform:none}#t-inv:active{transform:scale(.9)}#t-ctx{bottom:calc(var(--sb) + 150px);left:50%}#t-tl{width:calc(var(--u) * 150px)}#app.mobile #minimap{width:calc(var(--u) * 112px);height:calc(var(--u) * 75px)}#t-nexus,.chip{top:calc(var(--st) + 18px + var(--u) * 75px)}}@media (orientation:landscape) and (height<=360px){#app.mobile #minimap{width:calc(var(--u) * 126px);height:calc(var(--u) * 84px)}#t-nexus,.chip{top:calc(var(--st) + 18px + var(--u) * 84px)}}
