:root{--bar:56px;--zbg:#0d0b14;--zink:#f2eefc;--zline:rgba(255,255,255,.18);--font-display:"Chonburi","Noto Serif Thai",serif;--font-body:"IBM Plex Sans Thai",system-ui,sans-serif;color-scheme:dark}html,body{height:100%}body{background:var(--zbg);color:var(--zink);font-family:var(--font-body);position:relative;overflow:hidden}.bar{position:absolute;inset:0 0 auto 0;height:var(--bar);display:flex;align-items:center;gap:12px;padding:0 16px;background:var(--zbg);border-bottom:1px solid var(--zline);z-index:5}.bar b{font-family:var(--font-display);font-weight:400;font-size:18px;letter-spacing:.03em;white-space:nowrap}.bar label{font-size:12px;opacity:.7;white-space:nowrap}#vfxBtn{margin-left:auto}#labBtn,#vfxBtn{font:inherit;font-size:14px;color:var(--zink);background:#2a2440;border:1px solid var(--zline);border-radius:8px;padding:7px 12px;cursor:pointer;white-space:nowrap}#labBtn:hover,#vfxBtn:hover{border-color:#ffd479}#labBtn:focus-visible,#vfxBtn:focus-visible{outline:2px solid #ffd479;outline-offset:2px}body.lab .bar label,body.lab .bar select{display:none}.bar select{font:inherit;font-size:15px;color:var(--zink);background:#1d1a2b;border:1px solid var(--zline);border-radius:8px;padding:7px 10px;min-width:0;max-width:34vw;cursor:pointer}.bar select:focus-visible{outline:2px solid #ffd479;outline-offset:2px}.scene{position:absolute;inset:var(--bar) 0 0 0;overflow:hidden}.scene[hidden]{display:none}.stage{position:absolute;top:0;right:0;bottom:0;left:0}.stage canvas{display:block;touch-action:none}.hud{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;justify-content:space-between;padding:16px;gap:12px;pointer-events:none}.card{align-self:flex-start;max-width:min(320px,100%);padding:14px 16px 12px;background:var(--panel);border:1px solid var(--line);border-radius:10px;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.eyebrow{margin:0;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--accent2)}.card h1{margin:6px 0 2px;font-family:var(--font-display);font-weight:400;font-size:clamp(28px,6vw,40px);line-height:1.1;letter-spacing:.02em;color:var(--gold);text-wrap:balance}.sub{margin:0 0 10px;font-size:14px}dl{margin:0;display:grid;grid-template-columns:auto 1fr;gap:4px 14px;font-size:13px}dt{color:var(--muted)}dd{margin:0}.bottom{margin-top:auto;display:flex;flex-direction:column;gap:10px;align-items:center}.row{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;pointer-events:auto}.hud button{font:inherit;font-size:14px;cursor:pointer;color:var(--ink);background:var(--panel);border:1px solid var(--line);border-radius:999px;padding:9px 16px;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.hud button:hover{border-color:var(--accent2)}.hud button:focus-visible{outline:2px solid var(--gold);outline-offset:2px}.hint{margin:0;font-size:12px;color:var(--muted);text-align:center}.fallback{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;padding:24px;text-align:center;background:var(--bg)}.fallback[hidden]{display:none}.hud select{font:inherit;font-size:14px;color:var(--ink);background:var(--panel);border:1px solid var(--line);border-radius:999px;padding:9px 12px;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);cursor:pointer;max-width:100%}.hud select:focus-visible{outline:2px solid var(--gold);outline-offset:2px}.rigpanel{position:absolute;right:16px;top:16px;width:230px;padding:12px;display:flex;flex-direction:column;gap:8px;background:var(--panel);border:1px solid var(--line);border-radius:10px;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);pointer-events:auto;font-size:13px}.rigpanel[hidden]{display:none}.xtags{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;overflow:hidden}.xtags[hidden]{display:none}.xtag{position:absolute;transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center;gap:1px;padding:4px 10px;background:var(--panel);border:1px solid var(--line);border-radius:8px;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);font-size:12px;line-height:1.3;white-space:nowrap;text-align:center}.xtag b{color:var(--gold);font-weight:600}.xtag span{color:var(--ink);opacity:.85}.rp-h{display:flex;align-items:center;gap:8px}.rp-h b{font-family:var(--font-display);font-weight:400;color:var(--gold);font-size:16px}.rp-h select{flex:1;min-width:0;padding:6px 10px;font-size:13px}.rigpanel label{display:grid;grid-template-columns:14px 1fr 38px;gap:8px;align-items:center}.rigpanel input[type=range]{width:100%;accent-color:var(--gold);min-width:0}.rigpanel output{font-variant-numeric:tabular-nums;text-align:right;color:var(--muted)}.rp-b{display:flex;gap:6px;flex-wrap:wrap}.rp-b button{padding:6px 10px!important;font-size:12px!important}.rp-n{margin:0;font-size:11px;line-height:1.45;color:var(--muted)}@media (max-width:560px){.rigpanel{top:12px;left:16px;right:16px;width:auto}.rp-n{display:none}.hud:has(.rigpanel:not([hidden])) .card{display:none}.hud button,.hud select{font-size:13px;padding:7px 12px}.row{gap:6px}}.hud select option{background:#fff;color:#1c1a24}.zm{--bg:#e6ecf5;--ink:#1d2433;--muted:#5d6a82;--gold:#256f8f;--accent2:#c2542d;--panel:rgba(250,252,255,.84);--line:rgba(40,60,100,.26);color:var(--ink)}.zm .card{pointer-events:auto;max-width:min(340px,100%);max-height:calc(100% - 150px);overflow:auto}.zm summary{cursor:pointer;font-size:13px;color:var(--accent2);margin:2px 0 8px}.slots{display:flex;flex-direction:column;gap:6px;margin-bottom:8px}.slot{display:grid;grid-template-columns:44px minmax(0,1fr) 54px 32px;gap:6px;align-items:center;font-size:13px}.slot select{padding:5px 8px;font-size:13px;border-radius:8px;min-width:0}.slot input{min-width:0;width:100%;accent-color:var(--gold)}.slot output{font-size:11px;color:var(--muted);text-align:right;font-variant-numeric:tabular-nums}.slot select:disabled,.slot input:disabled{opacity:.45}.mnote{margin:0 0 8px;font-size:12px;line-height:1.45;color:var(--accent2)}.chips{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:8px}.zm .chips button{padding:5px 10px;font-size:12px}.zm dl{margin-top:4px}.zw{--bg:#050818;--ink:#eef1ff;--muted:#9ba6dc;--gold:#ffd479;--accent2:#8fe3ff;--panel:rgba(9,13,38,.62);--line:rgba(143,227,255,.22);color:var(--ink)}.zw .hud button.primary{background:var(--gold);color:#1a1430;border-color:var(--gold);font-weight:600}.zw .hud button.primary:hover{background:#ffe39f}.chip{display:inline-flex;align-items:center;gap:7px;font-size:13px!important;padding:6px 12px!important}.chip i{width:9px;height:9px;border-radius:50%;background:var(--c);box-shadow:0 0 8px var(--c)}.chip[aria-pressed=false]{opacity:.45}.chip[aria-pressed=false] i{box-shadow:none}.zs{--bg:#f1eee6;--ink:#2d1d10;--muted:#7a6654;--gold:#d1651a;--accent2:#b5532a;--panel:rgba(255,252,244,.78);--line:rgba(120,80,40,.28);color:var(--ink)}.zp{--bg:#1a1120;--ink:#fff1e2;--muted:#c9a9a0;--gold:#ffb52e;--accent2:#ff7a45;--panel:rgba(32,18,32,.72);--line:rgba(255,160,100,.3);color:var(--ink)}.zc{--bg:#1f1410;--ink:#fff0dc;--muted:#d1b08c;--gold:#ffb347;--accent2:#e5693a;--panel:rgba(44,26,18,.72);--line:rgba(255,170,100,.3);color:var(--ink)}.zg{--bg:#1d3328;--ink:#eef6e6;--muted:#a9c2a6;--gold:#ffb8ec;--accent2:#9ef6ff;--panel:rgba(18,34,26,.74);--line:rgba(160,220,170,.28);color:var(--ink)}.zf{--bg:#0d1432;--ink:#e8eefc;--muted:#9eacd0;--gold:#52e6ff;--accent2:#ffcf5a;--panel:rgba(12,18,42,.74);--line:rgba(190,210,255,.2);color:var(--ink)}.za{--bg:#e8f0ea;--ink:#26302a;--muted:#5f6b62;--gold:#b8431f;--accent2:#2f7d6b;--panel:rgba(250,252,246,.82);--line:rgba(60,90,70,.3);color:var(--ink)}@media (max-width:480px){.card{padding:10px 12px}dl{font-size:12px}.bar label,.bar b{display:none}.bar{gap:8px}.bar select{max-width:none;flex:1;font-size:14px}}.zs2{--bg:#2a1a2a;--ink:#fff0f4;--muted:#d8b4c4;--gold:#ffb8d8;--accent2:#ff8fb8;--panel:rgba(40,20,36,.72);--line:rgba(255,180,210,.28);color:var(--ink)}.zi{--bg:#0a1424;--ink:#eef6ff;--muted:#9fb8d8;--gold:#9fe8ff;--accent2:#7fffd0;--panel:rgba(10,22,40,.72);--line:rgba(160,220,255,.25);color:var(--ink)}.zj{--bg:#14241e;--ink:#f2f6ea;--muted:#b4c8b0;--gold:#e8c25a;--accent2:#6fd8a0;--panel:rgba(16,34,28,.74);--line:rgba(200,230,180,.26);color:var(--ink)}.zc{--bg:#ece4d4;--ink:#141418;--muted:#5a5a62;--gold:#c8322a;--accent2:#3a3a40;--panel:rgba(244,238,226,.82);--line:rgba(20,20,24,.22);color:var(--ink)}.zd{--bg:#2a1a10;--ink:#fff4e0;--muted:#e0c49c;--gold:#ffd27a;--accent2:#7fc8ff;--panel:rgba(44,28,16,.72);--line:rgba(255,210,150,.3);color:var(--ink)}.za2{--bg:#0a0818;--ink:#f0eeff;--muted:#aaa4d8;--gold:#c8b8ff;--accent2:#7fe8ff;--panel:rgba(14,10,34,.72);--line:rgba(190,170,255,.25);color:var(--ink)}.zl{--bg:#1b1d2a;--ink:#eef0fa;--muted:#a4a9c4;--gold:#ffd479;--accent2:#8fe3ff;--panel:rgba(20,22,36,.8);--line:rgba(190,200,255,.22);color:var(--ink)}.zl .card{pointer-events:auto;max-height:calc(100% - 260px);overflow:auto}.lstat{margin:0 0 10px;padding:6px 10px;border-radius:8px;font-weight:600;font-size:14px}.lstat.ok{background:#46d27a2e;color:#7dffa8}.lstat.no{background:#ff4d5a2e;color:#ff9aa2}.lskills{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:2px}.lnote{margin:4px 0 0;font-size:12px;color:var(--gold)}.lparts{display:flex;gap:8px;overflow-x:auto;max-width:100%;padding:2px;pointer-events:auto;scrollbar-width:thin}.ltile{position:relative;flex:0 0 auto}.ltile .lt-main{display:grid;grid-template-columns:56px auto;grid-template-rows:auto auto;column-gap:8px;align-items:center;text-align:left;border-radius:10px!important;padding:6px 12px 6px 6px!important;min-width:150px}.ltile img{grid-row:1/3;width:56px;height:56px;object-fit:contain;border-radius:6px;background:#ffffff0f}.lt-s{font-size:11px;color:var(--muted)}.lt-n{font-size:13px;max-width:130px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ltile.need .lt-main{border-color:#ff4d5a}.ltile.need .lt-n{color:#ff9aa2}.ltile.opt .lt-main{border-style:dashed}.ltile.off{opacity:.45}.ltile .lt-sh{position:absolute;top:-6px;right:-6px;padding:2px 7px!important;font-size:12px!important;line-height:1.4}.ltile .lt-sh[aria-pressed=true]{background:var(--gold);color:#1a1430;border-color:var(--gold)}.ltile .lt-sh:disabled{display:none}.lpick{position:absolute;left:16px;right:16px;bottom:200px;max-height:calc(100% - 300px);display:flex;flex-direction:column;background:var(--panel);border:1px solid var(--line);border-radius:12px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);pointer-events:auto;z-index:2}.lpick[hidden]{display:none}.lp-head{display:flex;align-items:center;justify-content:space-between;padding:10px 14px;border-bottom:1px solid var(--line)}.lp-head b{font-family:var(--font-display);font-weight:400;color:var(--gold);font-size:17px}.lp-x{padding:4px 10px!important}.lp-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(110px,1fr));gap:8px;padding:12px 14px;overflow:auto}.lp-h{grid-column:1/-1;margin:6px 0 0;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--accent2)}.lp-o{display:flex;flex-direction:column;align-items:center;gap:4px;border-radius:10px!important;padding:6px!important;font-size:12px!important;line-height:1.3;text-align:center}.lp-o img{width:84px;height:84px;object-fit:contain}.lp-o[aria-pressed=true]{border-color:var(--gold);box-shadow:0 0 0 1px var(--gold) inset}.lp-none{justify-content:center;min-height:110px}@media (max-width:560px){.lpick{bottom:180px;left:8px;right:8px}.ltile .lt-main{min-width:120px}.zl .card{max-height:38%}}.zv{--bg:#07080f;--ink:#e8eeff;--muted:#8d97bd;--gold:#5ad8ff;--accent2:#8fe3ff;--panel:rgba(12,16,32,.86);--line:rgba(120,160,255,.2);color:var(--ink)}.zv .hud{display:block}.vpanel{position:absolute;top:16px;bottom:270px;width:230px;padding:12px;background:var(--panel);border:1px solid var(--line);border-radius:10px;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);pointer-events:auto;overflow:auto;font-size:13px}.vleft{left:16px}.vright{right:16px;display:flex;flex-direction:column;gap:8px}.vp-title{margin:4px 0 6px;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--accent2)}.vp-name{margin:0 0 4px;font-family:var(--font-display);font-size:17px;color:var(--gold)}.vp-note{margin:4px 0 0;font-size:11px;color:var(--muted)}.vlist{display:flex;flex-direction:column;gap:3px}.vl-l{margin:10px 0 6px;color:var(--muted);font-size:11px;letter-spacing:.08em;text-transform:uppercase}.vl-l:first-of-type{margin-top:4px}.vl-d{margin-top:12px;padding:10px 12px;border:1px solid var(--line);border-radius:10px;background:#ffffff08;font-size:12.5px;line-height:1.6}.vl-d summary{cursor:pointer;font-weight:600;color:var(--ink);list-style-position:inside}.vl-d summary:focus-visible{outline:2px solid var(--gold);outline-offset:2px}.vl-d p{margin:6px 0 0}.vl-dm{color:var(--muted);font-size:11.5px}.vl-chips{display:flex;flex-wrap:wrap;gap:6px}.hud .vl-c{padding:5px 11px;font-size:12.5px;border-radius:999px;background:#ffffff08}.hud .vl-c[aria-pressed=true]{border-color:var(--gold);color:var(--gold);background:#ffd4791a}.vl-h{margin:2px 0 4px;font-weight:600}.vl-m{margin:8px 0 2px;color:var(--muted);font-size:12px}.hud .vl-s{text-align:left;border-radius:8px;padding:6px 10px;font-size:13px}.hud .vl-s[aria-pressed=true]{border-color:var(--gold);box-shadow:0 0 0 1px var(--gold) inset}.hud .vl-s:disabled{opacity:.4;cursor:default}.vprops{display:flex;flex-direction:column;gap:6px}.vp-f{display:grid;grid-template-columns:70px 1fr;align-items:center;gap:8px;font-size:12px}.vp-f input[type=color]{width:100%;height:26px;border:1px solid var(--line);border-radius:6px;background:none;padding:0}.vp-r{display:grid;grid-template-columns:1fr 38px;align-items:center;gap:6px}.vp-r input{width:100%;accent-color:var(--gold)}.vp-r output{font-size:11px;color:var(--muted);text-align:right;font-variant-numeric:tabular-nums}.vtop{position:absolute;top:16px;left:262px;right:262px;text-align:center;pointer-events:none}.vtop h1{margin:4px 0 2px;font-family:var(--font-display);font-weight:400;font-size:30px;color:var(--gold)}.vtop .sub{margin:0}.vvox{margin:2px 0 0;font-size:11px;color:var(--muted)}.vbottom{position:absolute;left:16px;right:16px;bottom:12px}.vtimeline{width:100%;max-width:1100px;padding:10px 12px;background:var(--panel);border:1px solid var(--line);border-radius:10px;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);pointer-events:auto;font-size:12px}.vt-bar{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin-bottom:6px}.hud .vt-bar button{padding:5px 10px;font-size:13px}.hud .vt-bar select{padding:5px 8px;font-size:12px}.vt-chk{display:flex;align-items:center;gap:4px}.vt-bar output{margin-left:auto;font-variant-numeric:tabular-nums;color:var(--muted)}.hud #v-shiny[aria-pressed=true]{border-color:#ffcf5a;color:#ffcf5a}.vt-scrub{position:relative;margin-left:130px}.vt-scrub input{width:100%;accent-color:var(--gold)}.vt-cursor{position:absolute;top:100%;width:1px;height:130px;background:#5ad8ff99;pointer-events:none}.vt-layers{display:flex;flex-direction:column;gap:1px;max-height:130px;overflow:auto}.vt-row{display:grid;grid-template-columns:126px 1fr;gap:4px;align-items:center;cursor:pointer;border-radius:5px;padding:1px 2px}.vt-row.sel{background:#5ad8ff1f}.vt-row.snd .vt-n{color:#ffd479}.vt-row.snd .vt-track i{opacity:1;min-width:4px}.vt-n{display:flex;align-items:center;gap:4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.vt-track{position:relative;height:12px;background:#ffffff0d;border-radius:3px}.vt-track i{position:absolute;top:2px;bottom:2px;border-radius:3px;opacity:.85}@media (max-width:900px){.vpanel{display:none}.vtop{left:16px;right:16px}}.vright.battle>*:not(.vbattle){display:none}.vbattle{display:flex;flex-direction:column;gap:6px;font-size:12.5px}.vb-ctl{display:flex;gap:6px}.hud .vb-ctl button{flex:1;padding:6px 10px;font-size:12.5px}.vb-u{padding:6px 8px;border:1px solid var(--line);border-radius:8px;display:flex;flex-direction:column;gap:2px}.vb-u span{color:var(--muted);font-size:11.5px}.vb-u small{color:#ff9a9a;font-size:11px}.vb-u.dead{opacity:.4}.vb-s{margin:0;color:#7fe3ff}.vb-log{margin:4px 0 0;padding-left:18px;color:var(--muted);font-size:11.5px;line-height:1.5;max-height:220px;overflow:auto}#hud-v.arena #v-list,#hud-v.arena .v-libt,#hud-v.arena .vt-layers,#hud-v.arena .vt-scrub,#hud-v.arena #v-restart,#hud-v.arena #v-back,#hud-v.arena #v-play,#hud-v.arena #v-fwd,#hud-v.arena .vt-chk,#hud-v.arena #v-tread,#hud-v.arena #v-battle,#hud-v.arena #v-shiny{display:none}#hud-v.arena .vtimeline{width:auto;display:inline-block}.varena{display:flex;flex-direction:column;gap:8px}.varena[hidden]{display:none}.va-who{margin:0;font-size:12px;color:var(--muted);line-height:1.5}.va-skills{display:flex;flex-direction:column;gap:5px}.va-sk{display:flex;gap:8px;align-items:flex-start;padding:7px 9px;border:1px solid var(--line);border-radius:8px;font-size:12.5px;cursor:pointer;line-height:1.45}.va-sk input{margin-top:3px;accent-color:#ffd479}.va-sk small{display:block;color:var(--muted);font-size:11px}.va-sk:has(input:checked){border-color:var(--gold);background:#ffd47914}.va-sk:has(input:disabled:not(:checked)){opacity:.45;cursor:default}.va-note{margin:0;font-size:11.5px;color:var(--muted)}.hud .varena button{padding:7px 12px;font-size:13px}