.bag-sky{position:absolute;inset:0;z-index:-1;overflow:hidden}.bag-sky:before{content:"";position:absolute;inset:-4%;background:url(/art/lobby/sanctuary-v2.webp) 30% 40%/cover no-repeat;filter:blur(9px) brightness(.32) saturate(.8)}.bag-sky:after{content:"";position:absolute;inset:0;background:radial-gradient(ellipse 40% 50% at 78% 45%,#d3bb8522,transparent 70%),linear-gradient(0deg,#0a0d14e6,transparent 40%),linear-gradient(180deg,#0a0d14b3,transparent 18%)}.bag{position:absolute;z-index:2;left:56px;right:496px;top:calc(var(--bar) + 16px);max-height:calc(100% - var(--bar) - 48px);display:flex;flex-direction:column;padding:18px;border-radius:22px;box-shadow:0 16px 44px #0009;animation:hud-in-left .6s .05s both}.bag-tabs{display:flex;gap:6px;margin-bottom:14px}.bag-tabs button{height:34px;padding:0 16px;border-radius:17px;border:1px solid #ffffff1a;font-size:12.5px;color:#cfc9d6}.bag-tabs button.on{border-color:#e8cf9a;background:#e8cf9a1f;color:#f3dfb0}.bag-grid{flex:1;min-height:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:10px;align-content:start;overflow-y:auto;overscroll-behavior:contain;padding:2px;scrollbar-width:thin;scrollbar-color:#ffffff1f transparent}.bag-slot{position:relative;aspect-ratio:1;display:grid;place-items:center;border-radius:14px;background:#ffffff08;border:1px solid #ffffff12}.bag-slot.empty{border-style:dashed;border-color:#ffffff0d;background:#ffffff04}.bag-slot:not(.empty){color:var(--item);background:radial-gradient(circle at 50% 42%,color-mix(in srgb,var(--item) 26%,transparent),#ffffff06 70%);border-color:color-mix(in srgb,var(--item) 40%,transparent);box-shadow:inset 0 1px #ffffff14;transition:transform .2s,border-color .2s,box-shadow .2s}.bag-slot:not(.empty) svg{filter:drop-shadow(0 0 10px color-mix(in srgb,var(--item) 70%,transparent))}.bag-slot:not(.empty):hover{transform:translateY(-2px)}.bag-slot img{width:76%;height:76%;object-fit:contain;filter:drop-shadow(0 2px 6px #0008)}.bag-slot.on{border-color:#f3dca8;box-shadow:0 0 0 2px #e8cf9a80,0 0 18px #d3bb8555}.bag-slot b{position:absolute;right:6px;bottom:5px;font-size:11.5px;font-weight:800;color:#f4ecdc;text-shadow:0 1px 4px #000}.bag-note{margin-top:12px;font-size:11.5px;color:#9a97a5}.item-detail{position:absolute;z-index:2;right:56px;top:calc(var(--bar) + 16px);width:400px;display:flex;flex-direction:column;align-items:center;text-align:center;padding:30px 26px 26px;border-radius:22px;box-shadow:0 16px 44px #0009;animation:info-in .35s ease-out both}.item-icon{width:120px;height:120px;display:grid;place-items:center;border-radius:50%;color:var(--item);background:radial-gradient(circle,color-mix(in srgb,var(--item) 30%,transparent),transparent 70%);border:1px solid color-mix(in srgb,var(--item) 45%,transparent);box-shadow:0 0 40px color-mix(in srgb,var(--item) 30%,transparent),inset 0 0 30px color-mix(in srgb,var(--item) 18%,transparent)}.item-icon svg{filter:drop-shadow(0 0 14px var(--item))}.item-icon img{width:82%;height:82%;object-fit:contain;filter:drop-shadow(0 4px 12px #000a)}.item-detail .secondary-btn{margin-top:8px}.item-sold{margin:8px 0 0;color:#f3dca8;font-weight:700}.item-detail>small{margin-top:18px;font-size:11.5px;letter-spacing:1.4px;color:#a9a5b2;text-transform:uppercase}:lang(th) .item-detail>small{letter-spacing:.3px}.item-detail h2{margin-top:6px;font:400 34px/1.1 var(--serif);color:#fff8ee}.item-owned{align-self:stretch;display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:18px;padding:12px 16px;border-radius:12px;background:#ffffff0a}.item-owned span{font-size:12px;color:#a9a5b2}.item-owned strong{font:400 19px var(--serif);color:var(--item)}.item-detail p{margin-top:16px;font-size:13px;line-height:1.75;color:#cbc6d0}.item-detail .primary-btn{align-self:stretch;margin-top:22px;border-radius:12px}@media(max-width:1099px){.bag{left:24px;right:394px;max-height:calc(100% - var(--bar) - var(--nav) - 32px)}.item-detail{right:24px;width:350px}}@media(max-width:799px){.inventory-page{display:flex;flex-direction:column;overflow-y:auto;overscroll-behavior:contain;padding:var(--bar) 12px calc(var(--nav) + 16px)}.bag-sky{position:fixed}.item-detail{position:relative;inset:auto;width:auto;order:1;flex-shrink:0;display:grid;grid-template-columns:76px 1fr;column-gap:14px;text-align:left;align-items:center;padding:16px;border-radius:18px}.item-icon{grid-row:span 2;width:76px;height:76px}.item-icon svg{width:36px;height:36px}.item-detail>small{margin-top:0;font-size:11px}.item-detail h2{margin-top:2px;font-size:26px}.item-detail .primary-btn,.item-detail p,.item-owned{grid-column:1/-1}.item-owned{margin-top:14px}.item-detail p{margin-top:12px;font-size:12.5px}.item-detail .primary-btn{margin-top:14px}.bag{position:relative;inset:auto;max-height:none;width:auto;order:2;flex-shrink:0;margin-top:12px;padding:14px;border-radius:18px}.bag-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;overflow:visible}.bag-slot svg{width:24px;height:24px}.bag-slot b{font-size:10px;right:4px;bottom:3px}}.item-detail p.item-effect{margin-top:16px;padding:9px 14px;border-radius:12px;font-size:13.5px;font-weight:700;line-height:1.5;color:#fff6e4;background:color-mix(in srgb,var(--item) 18%,#0d1018);border:1px solid color-mix(in srgb,var(--item) 45%,transparent)}.item-detail p.item-effect+p{margin-top:10px}.bag-tabs{overflow-x:auto;scrollbar-width:none}.bag-tabs::-webkit-scrollbar{display:none}.bag-tabs button{flex-shrink:0}.map-sky{z-index:-1;overflow:hidden;background:#0b0e15}.map-sky,.map-sky img{position:absolute;inset:0}.map-sky img{width:100%;height:100%;object-fit:cover;filter:brightness(.62) saturate(.95);animation:map-sky-in .9s ease-out both,map-drift 60s ease-in-out infinite alternate}.map-sky:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#0a0d14d9,#0a0d1466 30%,transparent 55%),linear-gradient(270deg,#0a0d14cc,#0a0d1440 26%,transparent 42%),linear-gradient(180deg,#0a0d14c4,transparent 22%),linear-gradient(0deg,#0a0d14e6,transparent 26%)}.map-chapter{position:absolute;z-index:2;left:56px;top:calc(var(--bar) + 8px);max-width:min(560px,46vw);text-shadow:0 2px 14px #000;animation:hud-in-left .6s both}.map-chapter-tag{display:flex;align-items:center;gap:8px;font-size:13px;color:#ead6a8}.map-chapter h2{margin-top:10px;font:400 clamp(36px,3.6vw,54px)/1.08 var(--serif);color:#fff8ee;letter-spacing:-.6px}.map-chapter p{margin-top:10px;max-width:440px;font-size:13.5px;line-height:1.7;color:#d8d2cb}.map-trail{position:absolute;z-index:2;left:48px;right:448px;top:calc(var(--bar) + 200px);bottom:118px}.map-trail>svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none}.trail-tall{display:none}.trail-road{stroke:#f3dca8;stroke-opacity:.45;stroke-width:2.5;stroke-dasharray:2 9;stroke-linecap:round;filter:drop-shadow(0 1px 3px #000)}.trail-done,.trail-road{fill:none;vector-effect:non-scaling-stroke}.trail-done{stroke:#f0d59a;stroke-width:4;stroke-linecap:round;filter:drop-shadow(0 0 6px #f3cd6b99);stroke-dasharray:2000;stroke-dashoffset:2000;animation:trail-draw 1.4s ease-out .2s forwards}.trail-node{position:absolute;left:var(--x);top:var(--y);translate:-50% -50%;display:flex;flex-direction:column;align-items:center;gap:6px;animation:node-in .45s var(--d) both}.node-ring{position:relative;width:54px;height:54px;display:grid;place-items:center;border-radius:50%;color:#f1e3c2;background:radial-gradient(circle at 50% 35%,#2a2f40,#141824);border:2px solid #e8cf9a8c;box-shadow:0 8px 20px #000b,inset 0 1px #ffffff26;transition:transform .2s,box-shadow .2s,border-color .2s}.trail-node:not(:disabled):hover .node-ring{transform:scale(1.08);border-color:#f3dca8}.trail-node.cleared .node-ring{color:#2b2521;background:linear-gradient(140deg,#f2deb1,#c8aa70);border-color:#fff1cc}.trail-node.frontier .node-ring{border-color:#fff1cc;box-shadow:0 0 0 4px #e8cf9a33,0 0 26px #ffd66b99,0 8px 20px #000b}.trail-node.frontier .node-ring:before{content:"";position:absolute;inset:-2px;border-radius:50%;pointer-events:none;box-shadow:0 0 0 7px #e8cf9a1f,0 0 34px #ffd66bcc;opacity:0;animation:frontier-pulse 1.6s ease-in-out infinite alternate}.trail-node.boss .node-ring{width:76px;height:76px;color:#ffd3c4;background:radial-gradient(circle at 50% 35%,#5a2a2a,#1e1216);border-color:#e3a089;box-shadow:0 0 30px #e3708a66,0 10px 24px #000c}.trail-node.boss.cleared .node-ring{color:#2b2521;background:linear-gradient(140deg,#f2deb1,#c8aa70);border-color:#fff1cc}.trail-node.locked{opacity:1}.trail-node.locked .node-ring{color:#8b8792;background:#12151dcc;border-color:#ffffff26;box-shadow:0 6px 14px #0009}.trail-node.on .node-ring:after{content:"";position:absolute;inset:-9px;border-radius:50%;animation:node-select 2.4s linear infinite;border-color:#f3dca8 transparent;border-style:solid;border-width:2px}.node-label{display:flex;flex-direction:column;align-items:center;text-shadow:0 1px 6px #000,0 0 2px #000}.node-label b{font-size:12.5px;color:#f3e7cc}.node-label em{max-width:140px;font:italic 12.5px var(--serif);color:#efe4cf;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:none}.trail-node.boss .node-label em,.trail-node.on .node-label em,.trail-node:hover .node-label em{display:block}.trail-node.locked .node-label b{color:#9d98a3}.map-chapters{position:absolute;z-index:3;left:48px;right:448px;bottom:28px;display:flex;align-items:center;justify-content:center;gap:12px;animation:hud-in-up .6s .1s both}.chapter-dots{display:flex;gap:6px;padding:6px;border-radius:22px;background:#0c0f17b3;border:1px solid #ffffff14;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.chapter-dots button{width:32px;height:32px;border-radius:50%;font-size:12px;font-weight:700;color:#d6cfc3;border:1px solid transparent}.chapter-dots button:hover{background:#ffffff10}.chapter-dots button.on{color:#2b2521;background:linear-gradient(140deg,#f2deb1,#c8aa70);box-shadow:0 0 14px #d3bb8566}.chapter-dots button.locked{color:#77737f}.map-side{position:absolute;z-index:3;right:28px;top:calc(var(--bar) + 10px);width:392px;max-height:calc(100% - var(--bar) - 38px);display:flex;flex-direction:column;gap:12px;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:none;animation:hud-in-right .6s .05s both}.map-side::-webkit-scrollbar{display:none}.stage-card,.story-card{flex-shrink:0;padding:20px;border-radius:20px;box-shadow:0 16px 44px #0009}.stage-card{animation:info-in .3s ease-out both}.stage-kicker{display:flex;align-items:center;gap:6px;font-size:12px;color:#d8c7a0}.stage-kicker b{color:#efa58f;font-weight:700}.stage-card h3{margin-top:8px;font:400 32px/1.1 var(--serif);color:#fff8ee}.stage-sub{margin-top:4px;font:italic 14px var(--serif);color:#cfc7ba}.stage-foes{margin-top:16px}.stage-foes small,.stage-rows span{font-size:11.5px;color:#a9a5b2}.stage-foes>div{display:flex;gap:8px;margin-top:8px}.foe{flex:1;min-width:0;display:flex;flex-direction:column;align-items:center;gap:4px;padding:6px 4px 7px;border-radius:12px;background:#ffffff0a;border:1px solid #ffffff12}.foe img{width:100%;height:62px;object-fit:contain;filter:drop-shadow(0 4px 6px #000a)}.foe em{max-width:100%;font-size:11px;font-style:normal;color:#ddd5c8;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.foe.boss{border-color:#e3a08966;background:#e3708a14}.foe.boss em{color:#f2b8a6}.stage-rows{margin-top:14px;border-radius:12px;background:#ffffff08;padding:4px 14px}.stage-rows>div{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:9px 0}.stage-rows>div+div{border-top:1px solid #ffffff0d}.stage-rows strong{display:flex;align-items:center;gap:5px;font-size:13.5px;color:#ecdfc4}.stage-rows .power-ok{color:#b3d6be}.stage-rows .power-low{color:#eba58e}.stage-loot{gap:12px!important}.stage-loot span{display:flex;align-items:center;gap:4px}.stage-loot span:last-child{color:#c6b5e8}.stage-go{width:100%;height:50px;margin-top:16px;border-radius:12px;font-size:14px}.stage-go:disabled{opacity:1;background:#ffffff0d;color:#a9a5b2;box-shadow:inset 0 0 0 1px #ffffff1f;filter:none}.story-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:10px}.story-row button{display:flex;flex-direction:column;align-items:flex-start;gap:6px;padding:10px;border-radius:12px;background:#ffffff0a;border:1px solid #ffffff14;text-align:left;font-size:12.5px;color:#efe6d6}.story-row button:not(:disabled):hover{border-color:#e8cf9a80;background:#e8cf9a12}.story-row small{display:block;margin-top:3px;font-size:10.5px;color:#a9a5b2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}.story-row>button>span:last-child{max-width:100%}.beat-no{width:24px;height:24px;display:grid;place-items:center;border-radius:50%;background:#e8cf9a26;color:#f0dcae}@keyframes map-sky-in{0%{opacity:0;transform:scale(1.04)}}@keyframes map-drift{to{transform:scale(1.06) translate3d(-1%,-.6%,0)}}@keyframes trail-draw{to{stroke-dashoffset:0}}@keyframes node-in{0%{opacity:0;transform:translateY(10px) scale(.85)}}@keyframes frontier-pulse{to{opacity:1}}@keyframes node-select{to{transform:rotate(1turn)}}@media(max-height:800px) and (min-width:800px){.map-chapter p{display:none}.map-trail{top:calc(var(--bar) + 140px)}.foe img{height:48px}.stage-card h3{font-size:26px}}@media(max-width:1099px){.map-chapter{left:32px}.map-trail{left:28px;right:400px;bottom:calc(var(--nav) + 96px)}.map-chapters{left:28px;right:400px;bottom:calc(var(--nav) + 18px)}.chapter-dots{gap:2px}.chapter-dots button{width:28px;height:28px}.map-side{right:20px;width:360px;max-height:calc(100% - var(--bar) - var(--nav) - 30px)}.node-ring{width:46px;height:46px}.trail-node.boss .node-ring{width:62px;height:62px}}@media(max-width:799px){.map-page{display:flex;flex-direction:column;overflow-y:auto;overscroll-behavior:contain;padding:var(--bar) 0 var(--nav)}.map-sky{position:fixed}.map-page .screen-bar{position:fixed;background:linear-gradient(#0a0c14f0,#0a0c1400);padding-bottom:10px}.map-chapter{position:relative;inset:auto;order:1;max-width:none;margin:0 18px}.map-chapter-tag{font-size:12px}.map-chapter h2{margin-top:6px;font-size:28px}.map-chapter p{font-size:12.5px;margin-top:6px}.map-chapters{position:relative;inset:auto;order:2;margin:14px 12px 0;gap:8px}.map-chapters .round-btn{flex-shrink:0}.chapter-dots{overflow-x:auto;scrollbar-width:none;gap:2px;padding:4px}.chapter-dots::-webkit-scrollbar{display:none}.chapter-dots button{width:28px;height:28px;flex-shrink:0;font-size:11px}.map-trail{position:relative;inset:auto;order:3;flex-shrink:0;height:680px;margin:18px 22px 10px}.trail-wide{display:none}.trail-tall{display:block}.trail-node{left:var(--mx);top:var(--my);flex-direction:row;gap:8px}.trail-node .node-label{align-items:flex-start}.trail-node .node-label em{display:block;max-width:120px}.node-ring{width:48px;height:48px}.trail-node.boss .node-ring{width:64px;height:64px}.map-side{display:contents}.story-card{order:4;position:relative;z-index:3;margin:0 12px 12px}.stage-card{order:5;position:sticky;z-index:4;bottom:0;margin:0;padding:12px 16px 14px;border-radius:20px 20px 0 0;border-bottom:0;background:linear-gradient(180deg,#171c29f7,#10141dfa);box-shadow:0 -12px 32px #000b;animation:none}.stage-card h3{margin-top:2px;font-size:21px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.stage-foes,.stage-rows>div:nth-child(2),.stage-rows>div>span,.stage-sub{display:none}.stage-rows{display:flex;flex-wrap:wrap;gap:4px 16px;margin-top:6px;padding:0;background:none}.stage-rows>div{padding:0;border:0!important}.stage-rows strong{font-size:13px}.stage-go{height:44px;margin-top:10px}.story-row button{padding:8px}}.settings-panel{display:grid;gap:14px}.set-group{padding:2px 16px;border:1px solid #ffffff10;border-radius:12px;background:linear-gradient(#ffffff07,#ffffff02)}.set-group h3{margin:14px 0 4px;font-size:10px;font-weight:600;letter-spacing:1.6px;text-transform:uppercase;color:var(--gold)}:lang(th) .set-group h3{font-size:11.5px;letter-spacing:.3px}.set-row{display:grid;grid-template-columns:34px minmax(0,1fr) auto;align-items:center;gap:14px;padding:13px 0;border-top:1px solid #ffffff0b}.set-group h3+.set-row{border-top:0}.set-icon{display:grid;place-items:center;width:34px;height:34px;border-radius:10px;color:var(--gold);background:#d3bb8512;border:1px solid #d3bb8524}.set-text{min-width:0}.set-text strong{display:block;font-size:13.5px;font-weight:600;color:var(--text)}.set-text p{margin:3px 0 0;font-size:11px;line-height:1.6;color:#9997a5}.set-control{display:flex;justify-content:flex-end}.settings-note{margin:16px 2px 0;font-size:11px;line-height:1.6;color:#8d8b99;text-align:center}.segmented{display:inline-flex;gap:2px;padding:3px;border-radius:10px;background:#11131a;border:1px solid #ffffff12}.segmented button{min-height:32px;padding:0 14px;border-radius:7px;font-size:12px;color:#a9a6b5;white-space:nowrap;transition:background .15s,color .15s}.segmented button:hover{color:var(--text)}.segmented button.on{background:linear-gradient(#e8d29d,#c6a865);color:#1f1b14;font-weight:600;box-shadow:0 2px 8px #0007,inset 0 1px #fff6}.segmented button:focus-visible{outline:2px solid #d3bb8588;outline-offset:1px}.volume-slider{display:flex;align-items:center;gap:10px}.volume-slider output{width:28px;text-align:right;font-size:12px;color:#c9c3d4;font-variant-numeric:tabular-nums}.volume-slider input{-webkit-appearance:none;appearance:none;width:160px;height:24px;margin:0;background:transparent;cursor:pointer;touch-action:none}.volume-slider input:disabled{opacity:.4;cursor:not-allowed}.volume-slider input::-webkit-slider-runnable-track{height:4px;border-radius:3px;background:linear-gradient(90deg,var(--gold) var(--fill),#3a3c4b var(--fill))}.volume-slider input::-moz-range-track{height:4px;border-radius:3px;background:linear-gradient(90deg,var(--gold) var(--fill),#3a3c4b var(--fill))}.volume-slider input::-webkit-slider-thumb{-webkit-appearance:none;width:16px;height:16px;margin-top:-6px;border-radius:50%;background:#f1e2bd;border:2px solid #1b1e28;box-shadow:0 0 0 1px #d3bb8599}.volume-slider input::-moz-range-thumb{width:13px;height:13px;border-radius:50%;background:#f1e2bd;border:2px solid #1b1e28;box-shadow:0 0 0 1px #d3bb8599}.volume-slider input:focus-visible{outline:2px solid #d3bb8588;outline-offset:3px;border-radius:4px}.mute-switch{position:relative;flex:0 0 auto;width:44px;height:24px;border-radius:12px;background:#3a3c4b;border:1px solid #625875;transition:background .2s}.mute-switch i{position:absolute;top:2px;left:2px;width:18px;height:18px;border-radius:50%;background:#d8d4e0;transition:transform .2s}.mute-switch.on{background:#a8505a;border-color:#d07a83}.mute-switch.on i{transform:translateX(20px);background:#fff}.mute-switch:focus-visible{outline:2px solid #d3bb8588;outline-offset:3px}.settings-panel.compact{gap:10px}.settings-panel.compact .set-text p{display:none}.settings-panel.compact .set-row{padding:9px 0}.settings-panel.compact .set-group h3{margin-top:11px}@media(max-width:540px){.set-group{padding:2px 14px}.set-row{grid-template-columns:34px minmax(0,1fr);gap:10px 12px}.set-row:not(:has(.mute-switch)) .set-control{grid-column:1/-1}.set-row:has(.mute-switch){grid-template-columns:34px minmax(0,1fr) auto}.set-control .segmented{display:flex;width:100%}.set-control .segmented button{flex:1}.set-control .volume-slider{width:100%}.set-control .volume-slider input{flex:1;width:auto}}@media(prefers-reduced-motion:reduce){.mute-switch,.mute-switch i,.segmented button{transition:none}}@media(max-width:480px){.resource-group>.mute-top{display:none}}.settings-sky{position:absolute;inset:0;z-index:-1;overflow:hidden}.settings-sky:before{content:"";position:absolute;inset:-4%;background:url(/art/lobby/sanctuary-v2.webp) 60% 35%/cover no-repeat;filter:blur(10px) brightness(.34) saturate(.85)}.settings-sky:after{content:"";position:absolute;inset:0;background:radial-gradient(ellipse 50% 60% at 30% 40%,#b6a1dc1c,transparent 70%),linear-gradient(0deg,#0a0d14e0,transparent 40%),linear-gradient(180deg,#0a0d14b3,transparent 18%)}.settings-tabs{position:absolute;z-index:2;left:56px;top:calc(var(--bar) + 16px);width:260px;display:flex;flex-direction:column;gap:4px;padding:12px;border-radius:22px;box-shadow:0 16px 44px #0009;animation:hud-in-left .6s .05s both}.settings-tabs button{display:flex;align-items:center;gap:12px;min-height:52px;padding:0 12px;border-radius:14px;font-size:14.5px;color:#d6d0c6;text-align:left;border:1px solid transparent}.settings-tabs button:hover{background:#ffffff0a}.settings-tabs button.on{color:#fff3d6;background:linear-gradient(110deg,#e8cf9a26,#e8cf9a08);border-color:#e8cf9a55}.tab-icon{width:34px;height:34px;flex-shrink:0;display:grid;place-items:center;border-radius:11px;background:#ffffff0a;color:#cfc6b4}.settings-tabs button.on .tab-icon{color:#2b2521;background:linear-gradient(140deg,#f2deb1,#c8aa70);box-shadow:0 0 14px #d3bb8555}.settings-tabs .tab-link{margin-top:4px;border-top:1px solid #ffffff10;border-radius:0 0 14px 14px}.settings-tabs .tab-link>svg:last-child{margin-left:auto;color:#8f8a80}.settings-version{display:flex;align-items:center;gap:7px;margin:10px 12px 4px;padding-top:12px;border-top:1px solid #ffffff10;font-size:11px;color:#8f8c99}.settings-content{position:absolute;z-index:2;left:340px;right:56px;top:calc(var(--bar) + 16px);max-width:880px;max-height:calc(100% - var(--bar) - 48px);overflow-y:auto;overscroll-behavior:contain;padding:26px 28px 28px;border-radius:22px;box-shadow:0 16px 44px #0009;animation:info-in .3s ease-out both;scrollbar-width:thin;scrollbar-color:#ffffff1f transparent}.settings-content>h2{margin-bottom:18px;font:400 32px/1.1 var(--serif);color:#fff8ee}.settings-content .set-group{padding:4px 20px;border-radius:16px;background:#ffffff06}.settings-content .set-group h3{display:none}.settings-content .set-row{grid-template-columns:42px minmax(0,1fr) auto;gap:16px;padding:18px 0}.settings-content .set-group h3+.set-row{border-top:0}.settings-content .set-icon{width:42px;height:42px;border-radius:12px}.settings-content .set-text strong{font-size:15px}.settings-content .set-text p{font-size:12.5px}.settings-content .segmented button{min-height:38px;padding:0 18px;font-size:13px}.settings-content .volume-slider input{width:220px}.settings-content .settings-note{text-align:left}.settings-sub{margin:26px 0 12px;font:400 19px var(--serif);color:#efe3c8}.profile-card{display:flex;align-items:center;gap:24px;padding:22px;border-radius:18px;background:linear-gradient(120deg,color-mix(in srgb,var(--host-color) 18%,transparent),#ffffff06 60%);border:1px solid #ffffff12}.profile-avatar{position:relative;flex-shrink:0;width:96px;height:96px;display:grid;place-items:center;border-radius:50%;color:var(--gold);background:linear-gradient(145deg,#504755,#292c38);border:2px solid #d3bb85;box-shadow:0 0 0 5px #d3bb8514,0 10px 26px #0009}.profile-avatar b{position:absolute;bottom:-9px;padding:2px 10px;border-radius:6px;background:#d3bb85;color:#262229;font-size:12px}.profile-fields{flex:1;min-width:0;display:grid;gap:16px}.profile-fields .host-name{font-size:12px;letter-spacing:.4px}.profile-fields .host-name input{height:46px;font-size:18px;border-radius:12px;background:#0f1219cc}.profile-shirt>span{display:block;margin-bottom:8px;font-size:12px;color:var(--muted)}.profile-shirt .host-colors{margin-top:0}.profile-shirt .host-colors button{width:32px;height:32px}.journey-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.journey-stats>div{display:flex;flex-direction:column;gap:4px;padding:16px;border-radius:16px;background:#ffffff08;border:1px solid #ffffff10}.stat-icon{width:34px;height:34px;display:grid;place-items:center;border-radius:11px;margin-bottom:6px;color:var(--gold);background:#d3bb8514}.journey-stats small{font-size:12px;color:#a9a5b2}.journey-stats strong{font:400 24px var(--serif);color:#fff3d6}.about-card{display:grid;gap:14px;padding:24px;border-radius:18px;background:#ffffff06;border:1px solid #ffffff10}.about-brand{display:flex;align-items:center;gap:14px}.about-brand .brand-mark{font-size:40px;color:var(--gold)}.about-brand strong{display:block;font:400 30px var(--serif);letter-spacing:4px;color:#f4e6c6}.about-brand small{font-size:10px;letter-spacing:3px;color:#a9a5b2}.about-version{display:flex;align-items:center;gap:7px;font-size:12.5px;color:#cfc9d6}.about-card p{font-size:13px;line-height:1.7;color:#b9b4c2}.about-credits{padding-top:14px;border-top:1px solid #ffffff10;font-size:12px!important}@media(max-width:1099px){.settings-tabs{left:24px;width:220px}.settings-content,.settings-tabs{max-height:calc(100% - var(--bar) - var(--nav) - 32px)}.settings-content{left:262px;right:24px}.journey-stats{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:799px){.settings-page{display:flex;flex-direction:column;overflow-y:auto;overscroll-behavior:contain;padding:var(--bar) 12px calc(var(--nav) + 16px)}.settings-sky{position:fixed}.settings-tabs{position:relative;inset:auto;width:auto;max-height:none;flex-direction:row;gap:6px;padding:6px;border-radius:18px;overflow-x:auto;scrollbar-width:none;flex-shrink:0}.settings-tabs::-webkit-scrollbar{display:none}.settings-tabs button{flex-shrink:0;min-height:42px;padding:0 12px 0 6px;gap:8px;font-size:13px}.tab-icon{width:30px;height:30px;border-radius:9px}.settings-version{display:none}.settings-content{position:relative;inset:auto;max-width:none;max-height:none;overflow:visible;margin-top:12px;padding:20px 16px;border-radius:18px;flex-shrink:0}.settings-content>h2{font-size:26px;margin-bottom:14px}.settings-content .set-group{padding:2px 14px}.settings-content .set-row{grid-template-columns:38px minmax(0,1fr);gap:10px 12px;padding:14px 0}.settings-content .set-row:has(.mute-switch){grid-template-columns:38px minmax(0,1fr) auto}.settings-content .set-icon{width:38px;height:38px}.settings-content .volume-slider input{width:auto}.profile-card{flex-direction:column;align-items:stretch;text-align:left;gap:18px;padding:18px}.profile-avatar{align-self:center;width:84px;height:84px}}.account-card,.account-status{display:flex;align-items:flex-start;gap:14px;padding:16px 18px;border-radius:16px;background:#ffffff08;border:1px solid #ffffff10}.account-status{margin-bottom:12px}.account-card .stat-icon,.account-status .stat-icon{margin:0;flex-shrink:0}.account-status.off .stat-icon,.account-status.offline .stat-icon{color:#c9a07a;background:#c9a07a1c}.account-card div,.account-status div{display:grid;gap:3px;min-width:0}.account-status small{font-size:12px;color:#a9a5b2}.account-card strong,.account-status strong{font-size:15px;color:#fff3d6;overflow-wrap:anywhere}.account-card p,.account-text{font-size:12.5px;line-height:1.6;color:#b9b4c2}.account-text b{color:#e8c99a;font-weight:500}.account-id{margin-top:4px;font-size:11px;color:#8f8a98;letter-spacing:.3px;overflow-wrap:anywhere}.account-form{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto;gap:10px;margin-top:12px}.account-form.confirm{grid-template-columns:repeat(3,minmax(0,1fr)) auto}.account-form.single{grid-template-columns:minmax(0,1fr) auto}.account-register{margin-top:18px;width:max-content}.account-signout{margin-top:26px;width:max-content}.account-form input{height:44px;min-width:0;padding:0 14px;border-radius:12px;border:1px solid #ffffff1a;background:#0f1219cc;color:#f4eee2;font-size:14px}.account-form input:focus{outline:none;border-color:#e8cf9a88}.account-submit{display:flex;align-items:center;justify-content:center;gap:8px;height:44px;padding:0 18px;border-radius:12px;font-size:14px;font-weight:600;color:#2b2521;background:linear-gradient(140deg,#f2deb1,#c8aa70);white-space:nowrap}.account-submit:disabled{opacity:.6}.account-msg{grid-column:1/-1;font-size:12.5px;color:#9fd8b0}.account-msg.error{color:#f0a49a}@media (max-width:760px){.account-form,.account-form.confirm,.account-form.single{grid-template-columns:minmax(0,1fr)}}.guide-sky{position:absolute;inset:0;z-index:-1;overflow:hidden}.guide-sky:before{content:"";position:absolute;inset:-4%;background:url(/art/lobby/sanctuary-v2.webp) 40% 35%/cover no-repeat;filter:blur(10px) brightness(.32) saturate(.85)}.guide-sky:after{content:"";position:absolute;inset:0;background:radial-gradient(ellipse 50% 60% at 65% 45%,#d3bb851a,transparent 70%),linear-gradient(0deg,#0a0d14e0,transparent 40%),linear-gradient(180deg,#0a0d14b3,transparent 18%)}.guide-topics{position:absolute;z-index:2;left:56px;top:calc(var(--bar) + 16px);width:300px;max-height:calc(100% - var(--bar) - 48px);overflow-y:auto;display:flex;flex-direction:column;gap:4px;padding:12px;border-radius:22px;box-shadow:0 16px 44px #0009;scrollbar-width:none;animation:hud-in-left .6s .05s both}.guide-topics::-webkit-scrollbar{display:none}.guide-topics button{display:flex;align-items:center;gap:10px;min-height:50px;padding:0 12px;border-radius:14px;border:1px solid transparent;text-align:left;font-size:14px;color:#d6d0c6}.guide-topics button:hover{background:#ffffff0a}.guide-topics button svg{flex-shrink:0;color:#a9a39a}.guide-topics button.on{color:#fff3d6;background:linear-gradient(110deg,#e8cf9a26,#e8cf9a08);border-color:#e8cf9a55}.guide-topics button.on svg{color:var(--gold)}.topic-no{width:26px;flex-shrink:0;font:400 16px var(--serif);color:#8f8a80}.guide-topics button.on .topic-no{color:#f0d59a}.topic-name{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.guide-slide{position:absolute;z-index:2;left:380px;right:56px;top:calc(var(--bar) + 16px);bottom:32px;max-width:1100px;display:flex;flex-direction:column;padding:14px;border-radius:24px;box-shadow:0 16px 44px #0009;animation:info-in .35s ease-out both}.slide-art{position:relative;flex:1;min-height:180px;overflow:hidden;border-radius:16px;background:#141824 50%/cover no-repeat}.slide-art:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,#0b0e16cc,transparent 40%),linear-gradient(90deg,#0b0e1666,transparent 40%)}.slide-figure{right:4%;bottom:-6%;height:112%;aspect-ratio:8/9;object-fit:contain;filter:drop-shadow(0 10px 30px #000a);animation:slide-figure .55s ease-out both;-webkit-mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent),linear-gradient(180deg,#000 80%,transparent);-webkit-mask-composite:source-in;mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent),linear-gradient(180deg,#000 80%,transparent);mask-composite:intersect}.slide-figure,.slide-team{position:absolute;z-index:1}.slide-team{left:50%;bottom:10%;translate:-50% 0;display:flex;align-items:flex-end}.slide-team span{width:clamp(80px,9vw,128px);aspect-ratio:8/9;margin:0 -8px;overflow:hidden;border-radius:14px;border:2px solid color-mix(in srgb,var(--hero-color) 70%,#fff4);box-shadow:0 14px 30px #000b;rotate:calc((var(--i) - 2) * 5deg);translate:0 calc((var(--i) - 2) * (var(--i) - 2) * 6px);animation:slide-card .5s calc(var(--i) * 60ms) ease-out both}.slide-team .hero-portrait{display:block;width:100%;height:100%;object-fit:cover;object-position:50% 14%}.slide-speed{position:absolute;z-index:1;left:50%;top:50%;translate:-50% -50%;display:flex;gap:12px}.slide-speed b{display:grid;place-items:center;width:clamp(70px,7vw,96px);aspect-ratio:1;border-radius:22px;font:400 clamp(26px,2.6vw,36px) var(--serif);color:#f3e7cc;background:#10131cd9;border:1px solid #ffffff22;box-shadow:0 14px 30px #000a;animation:slide-card .45s ease-out both}.slide-speed b.on{color:#2b2521;background:linear-gradient(140deg,#f2deb1,#c8aa70);border-color:#fff1cc;box-shadow:0 0 30px #d3bb8580}.slide-host{position:absolute;z-index:1;left:50%;bottom:12%;height:56%;translate:-50% 0;filter:drop-shadow(0 12px 20px #000a);animation:slide-figure .55s ease-out both}.slide-badge{position:absolute;z-index:2;left:18px;top:18px;width:58px;height:58px;display:grid;place-items:center;border-radius:18px;color:#2b2521;background:linear-gradient(140deg,#f2deb1,#c8aa70);box-shadow:0 0 26px #d3bb8566,0 10px 24px #000a}.slide-text{padding:20px 14px 6px}.slide-no{font:400 30px var(--serif);color:#f0d59a}.slide-no small{font-size:15px;color:#8f8a80}.slide-text h2{margin-top:4px;font:400 34px/1.15 var(--serif);color:#fff8ee}.slide-text p{margin-top:10px;max-width:780px;font-size:15.5px;line-height:1.8;color:#cfc9d3}.slide-nav{display:flex;align-items:center;gap:14px;margin-top:18px}.slide-nav .round-btn{width:46px;height:46px}.slide-nav .round-btn.next{margin-left:auto;color:#2b2521;background:linear-gradient(140deg,#f2deb1,#c8aa70);border-color:#fff1cc}.slide-dots{display:flex;gap:6px}.slide-dots button{width:8px;height:8px;border-radius:4px;background:#ffffff2e;transition:width .25s,background .25s}.slide-dots button.on{width:26px;background:#e8cf9a}.slide-start{margin-left:auto;height:46px;padding:0 22px;border-radius:14px;font-size:14px}@keyframes slide-figure{0%{opacity:0;transform:translateX(24px)}}@keyframes slide-card{0%{opacity:0;transform:translateY(20px)}}@media(max-height:780px) and (min-width:800px){.slide-text h2{font-size:28px}.slide-text p{font-size:14px;line-height:1.7}.slide-nav{margin-top:12px}}@media(max-width:1099px){.guide-topics{left:24px;width:240px;max-height:calc(100% - var(--bar) - var(--nav) - 32px)}.guide-slide{left:284px;right:24px;bottom:calc(var(--nav) + 16px)}}@media(max-width:799px){.guide-page{display:flex;flex-direction:column;overflow-y:auto;overscroll-behavior:contain;padding:var(--bar) 12px calc(var(--nav) + 16px)}.guide-sky{position:fixed}.guide-topics{position:relative;inset:auto;width:auto;max-height:none;flex-direction:row;gap:6px;padding:6px;border-radius:18px;overflow-x:auto;flex-shrink:0}.guide-topics button{flex-shrink:0;min-height:42px;padding:0 12px;gap:6px}.guide-topics .topic-name{display:none}.topic-no{width:auto;font-size:15px}.guide-slide{position:relative;inset:auto;margin-top:12px;padding:10px;border-radius:20px;flex-shrink:0}.slide-art{flex:none;height:44svh;min-height:240px}.slide-team span{width:min(19vw,84px);margin:0 -6px}.slide-badge{width:46px;height:46px;border-radius:14px;left:12px;top:12px}.slide-text{padding:16px 8px 6px}.slide-no{font-size:24px}.slide-text h2{font-size:26px}.slide-text p{font-size:14.5px}}.speech-layer{position:absolute;inset:0;z-index:2;pointer-events:none;overflow:hidden;transition:opacity .4s}.arena.ended .speech-layer{opacity:0}.speech-layer.paused *{animation-play-state:paused!important}.speech{position:absolute;left:0;top:0;width:max-content;max-width:min(280px,64cqw);will-change:transform;--tail-x:50%;--rim:color-mix(in srgb,var(--speaker-color) 62%,#c9a15a)}.speech-card{position:relative;padding:12px 14px 10px 54px;min-height:50px;border-radius:16px;background:linear-gradient(180deg,#fffaf0,#f6ead2 62%,#ecdcbc);color:#2b1e14;border:2px solid var(--rim);box-shadow:0 0 0 1px #3a28178c,0 8px 22px #0009,0 0 18px color-mix(in srgb,var(--speaker-color) 45%,transparent),inset 0 1px 0 #fff;transform-origin:var(--tail-x) calc(100% + 12px);animation:speech-life var(--life,3s) cubic-bezier(.2,.9,.3,1.2) both,speech-bob 2.6s ease-in-out .4s infinite}.speech-card p{margin:0;font:600 13.5px/1.42 var(--sans);letter-spacing:.1px;text-wrap:pretty}:lang(th) .speech-card p{font-size:14.5px;line-height:1.5}.speech-unsaid{color:transparent;text-shadow:none!important}.speech-face{position:absolute;left:-10px;top:-12px;width:54px;height:54px;border-radius:50%;overflow:hidden;background:radial-gradient(circle at 50% 35%,color-mix(in srgb,var(--speaker-color) 70%,#fff),color-mix(in srgb,var(--speaker-color) 60%,#120c16));border:2px solid #f2dca6;box-shadow:0 0 0 2px #2a1b12,0 3px 10px #000a,0 0 12px color-mix(in srgb,var(--speaker-color) 70%,transparent)}.speech-face img{width:100%;height:100%;object-fit:cover;object-position:50% 0;transform:scale(1.55) translateY(6%);transform-origin:50% 0}.enemy .speech-face img{object-fit:contain;object-position:50% 40%;transform:scale(1.2)}.speech-name{position:absolute;left:46px;top:-11px;display:flex;align-items:center;gap:4px;max-width:calc(100% - 40px);padding:2px 9px 2px 10px;border-radius:999px;white-space:nowrap;overflow:hidden;background:linear-gradient(90deg,color-mix(in srgb,var(--speaker-color) 55%,#1b1210),color-mix(in srgb,var(--speaker-color) 30%,#1b1210));border:1px solid color-mix(in srgb,var(--speaker-color) 50%,#f3dfae);color:#fff8e6;font:700 10.5px/1.3 var(--sans);letter-spacing:.4px;text-shadow:0 1px 2px #000;box-shadow:0 2px 6px #0007}.speech-name svg{flex:none;color:#ffe08a}.speech-tail{position:absolute;left:var(--tail-x);bottom:-9px;width:16px;height:16px;margin-left:-8px;rotate:45deg;background:linear-gradient(135deg,transparent 50%,#ecdcbc 0);border-right:2px solid var(--rim);border-bottom:2px solid var(--rim)}.speech.enemy{--rim:color-mix(in srgb,var(--speaker-color) 45%,#ff5a46)}.enemy .speech-card{border-radius:12px 12px 12px 12px;color:#ffe8dc;background:linear-gradient(180deg,#3a1a1c,#22101a 70%,#180a12);box-shadow:0 0 0 1px #000c,0 8px 22px #000a,0 0 20px color-mix(in srgb,var(--rim) 50%,transparent),inset 0 1px 0 #ff9a7a33}.enemy .speech-card p{font-weight:600;text-shadow:0 1px 2px #000}.enemy .speech-face{border-color:#ff9a72;background:radial-gradient(circle at 50% 40%,#5a2a26,#140810)}.enemy .speech-name{background:linear-gradient(90deg,#8e1f22,#4a1016);border-color:#ff8a6a}.enemy .speech-name svg{color:#ffb38a}.enemy .speech-tail{background:linear-gradient(135deg,transparent 50%,#180a12 0)}.speech.boss{max-width:min(320px,70cqw);--rim:#f0b44c}.boss .speech-card{border-width:2.5px;box-shadow:0 0 0 1px #000c,0 10px 26px #000b,0 0 26px #ff7a3a88,inset 0 1px 0 #ffd28a44}.boss .speech-card p{font-size:15px}:lang(th) .boss .speech-card p{font-size:16px}.boss .speech-name{background:linear-gradient(90deg,#b8641c,#5a1a10);border-color:#ffd27a}.mood-cast .speech-card{animation:speech-life var(--life,3s) cubic-bezier(.2,.9,.3,1.2) both,speech-shout .5s .05s ease-out}.mood-cast .speech-card p{font-weight:800;font-style:italic;font-size:15px}:lang(th) .mood-cast .speech-card p{font-size:16px;font-style:normal}.ally.mood-cast .speech-card{box-shadow:0 0 0 1px #3a28178c,0 8px 22px #0009,0 0 26px var(--speaker-color),inset 0 1px 0 #fff}.mood-fall .speech-card{filter:saturate(.35) brightness(.92)}.mood-fall .speech-card p{font-style:italic;font-weight:500;opacity:.9}:lang(th) .mood-fall .speech-card p{font-style:normal}.mood-fall .speech-face img{filter:grayscale(.8)}.ally.mood-cheer .speech-card{background:linear-gradient(180deg,#fff7f6,#fbe6ea 62%,#f3d3da);border-color:#f19ab0}.ally.mood-cheer .speech-tail{background:linear-gradient(135deg,transparent 50%,#f3d3da 0);border-color:#f19ab0}.mood-cheer .speech-name svg{color:#ff8fb0;animation:speech-beat 1s ease-in-out infinite}.ally.mood-plead .speech-card{border-color:#f2b443;box-shadow:0 0 0 1px #3a28178c,0 8px 22px #0009,0 0 20px #f2b44399,inset 0 1px 0 #fff}.ally.mood-plead .speech-tail{border-color:#f2b443}.mood-plead .speech-name svg{color:#9cff7a;animation:speech-rise .9s ease-in-out infinite}@keyframes speech-life{0%{opacity:0;transform:translateY(10px) scale(.55)}7%{opacity:1;transform:translateY(0) scale(1.05)}11%{transform:scale(1)}93%{opacity:1;transform:none}to{opacity:0;transform:translateY(-8px) scale(.96)}}@keyframes speech-bob{50%{translate:0 -3px}}@keyframes speech-shout{0%,to{rotate:0deg}20%{rotate:-2.5deg}45%{rotate:2deg}70%{rotate:-1deg}}@keyframes speech-beat{50%{scale:1.3}}@keyframes speech-rise{0%,to{translate:0 1px}50%{translate:0 -2px}}@container (min-width:1100px){.speech{max-width:min(360px,34cqw)}.speech.boss{max-width:min(400px,38cqw)}.speech-card{padding:13px 16px 11px 62px;min-height:56px;border-radius:18px}.speech-card p{font-size:15px}:lang(th) .speech-card p{font-size:16px}.speech-face{width:62px;height:62px;left:-12px;top:-14px}.speech-name{left:54px;font-size:11.5px;top:-12px}.boss .speech-card p,.mood-cast .speech-card p,:lang(th) .boss .speech-card p,:lang(th) .mood-cast .speech-card p{font-size:17px}}@container (max-width:700px){.speech{max-width:min(230px,72cqw)}.speech-card{padding:10px 11px 8px 44px;min-height:42px;border-radius:13px}.speech-card p{font-size:12.5px}:lang(th) .speech-card p{font-size:13.5px}.speech-face{width:44px;height:44px;left:-8px;top:-10px}.speech-name{left:38px;font-size:9.5px;top:-10px}.boss .speech-card p,.mood-cast .speech-card p,:lang(th) .boss .speech-card p,:lang(th) .mood-cast .speech-card p{font-size:14px}}@media (prefers-reduced-motion:reduce){.speech-card{animation:speech-fade var(--life,3s) linear both!important}.speech-name svg{animation:none!important}@keyframes speech-fade{0%,to{opacity:0}5%,94%{opacity:1}}}.social-screen{--panel:linear-gradient(160deg,#1a1e2be0,#0f121bd6);color:#efe8dc}.social-backdrop{position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,#0a0c14f2,#0a0c14b3 40%,#0a0c14d9),linear-gradient(0deg,#07080df0,#07080d40 60%),url(/art/world/village.webp) 50% 30%/cover no-repeat}.social-chat,.social-list{position:absolute;z-index:2;top:calc(var(--bar) + 10px);bottom:24px;display:flex;flex-direction:column;min-height:0;border-radius:20px;background:var(--panel);border:1px solid #ffffff1c;-webkit-backdrop-filter:blur(16px) saturate(1.2);backdrop-filter:blur(16px) saturate(1.2);box-shadow:0 18px 50px #000a;overflow:hidden}.social-list{left:28px;width:390px;animation:hud-in-left .6s .06s both}.social-chat{left:432px;right:28px;animation:hud-in-right .6s .06s both}.social-tabs{display:grid;grid-template-columns:1fr 1fr;gap:6px;padding:10px;border-bottom:1px solid #ffffff10}.social-tabs button{position:relative;display:flex;align-items:center;justify-content:center;gap:8px;height:42px;border-radius:12px;font-size:13.5px;font-weight:600;color:#a9a39a}.social-tabs button:hover{color:#fff;background:#ffffff08}.social-tabs button.on{color:#2b2521;background:linear-gradient(110deg,#f2deb1,#c8aa70);box-shadow:0 6px 18px #d3bb8533,inset 0 1px #fff9}.list-block h4 b,.social-tabs b,.unread{min-width:20px;height:20px;padding:0 6px;display:inline-grid;place-items:center;border-radius:10px;background:#f0a07a;color:#2a1208;font-size:11px;font-weight:800}.social-tabs button.on b{background:#2b2521;color:#f2deb1}.social-scroll{flex:1;min-height:0;overflow-y:auto;flex-direction:column;scrollbar-width:thin;overscroll-behavior:contain}.my-code,.social-scroll{padding:12px;display:flex;gap:12px}.my-code{align-items:center;border-radius:16px;background:radial-gradient(ellipse at 0 0,#e8cf9a26,transparent 70%),#ffffff08;border:1px solid #e8cf9a33}.my-code>div{flex:1;min-width:0}.my-code small{display:block;font-size:10.5px;font-weight:700;letter-spacing:1px;color:#e8cf9a}:lang(th) .my-code small{letter-spacing:.2px;font-size:11.5px}.my-code strong{display:block;font:600 21px/1.2 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:2px;color:#fff6e6;white-space:nowrap}@media(max-width:420px){.my-code strong{font-size:18px;letter-spacing:1px}}.my-code.skeleton{height:72px;animation:soft-blink 1.4s infinite}.add-friend{display:flex;gap:8px}.add-friend input{flex:1;min-width:0;height:38px;padding:0 14px;border-radius:19px;background:#0a0c14b3;border:1px solid #ffffff1f;color:#fff;font:inherit;font-size:13px;letter-spacing:.5px}.add-friend input:focus{outline:none;border-color:#e8cf9a}.add-friend .chip-btn{height:38px;border-radius:19px}.list-block{display:flex;flex-direction:column;gap:4px}.list-block h4{display:flex;align-items:center;gap:7px;margin:4px;font-size:11.5px;font-weight:700;letter-spacing:1px;text-transform:uppercase;color:#bfb8ab}:lang(th) .list-block h4{text-transform:none;letter-spacing:.2px;font-size:12.5px}.list-block h4 b{background:#ffffff1a;color:#e8e2d6}.list-empty{padding:14px 10px;font-size:12.5px;line-height:1.55;color:#a59f94}.friend-row,.request-row,.room-row{display:flex;align-items:center;gap:11px;width:100%;padding:8px 10px;border-radius:14px;text-align:left;border:1px solid transparent;transition:background .15s,border-color .15s}.friend-row:hover,button.room-row:hover{background:#ffffff0a}.friend-row.active,.room-row.active{background:linear-gradient(90deg,#e8cf9a1f,#e8cf9a08);border-color:#e8cf9a44}.friend-row.offline .host-avatar{filter:grayscale(.8) brightness(.75)}.request-row.in{background:#f0a07a14;border-color:#f0a07a33}.row-text{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}.row-text strong{display:flex;align-items:center;gap:5px;font-size:14px;color:#fff6e6;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.row-text strong svg{flex-shrink:0;color:#9fd8f0}.row-text small{font-size:12px;color:#a59f94;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.row-side{flex-shrink:0;display:flex;align-items:center}.row-side small{font-size:10.5px;color:#a59f94}.presence-text.online{color:#8eecb0}.presence-text.queue{color:#ffd88a}.presence-text.match{color:#ffa699}.row-actions{display:flex;gap:6px}.room-icon{flex-shrink:0;display:grid;place-items:center;width:40px;height:40px;border-radius:13px;background:radial-gradient(circle at 50% 30%,#3a3350,#141221);border:1px solid #e8cf9a44;color:#f1dcab}.room-icon.custom{border-color:#8fd8f244;color:#bfeaff;background:radial-gradient(circle at 50% 30%,#2a3d50,#111821)}.room-icon.big{width:46px;height:46px;border-radius:15px}.chat-empty{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;padding:30px;text-align:center}.chat-empty>span{display:grid;place-items:center;width:84px;height:84px;margin-bottom:8px;border-radius:50%;background:radial-gradient(circle at 50% 30%,#3a3350,#141221);border:1px solid #e8cf9a44;color:#e8cf9a;box-shadow:0 0 40px #e8cf9a22}.chat-empty strong{font:400 22px var(--serif);color:#fff6e6}.chat-empty small{font-size:12.5px;color:#a59f94}.chat-head{display:flex;align-items:center;gap:12px;padding:12px 16px;border-bottom:1px solid #ffffff10;background:linear-gradient(90deg,#ffffff08,transparent)}.chat-back{display:none}.chat-title{flex:1;min-width:0}.chat-title strong{display:flex;align-items:center;gap:8px;font:400 21px/1.2 var(--serif);color:#fff6e6}.chat-title small,.chat-title strong{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.chat-title small{display:block;font-size:12px;color:#a59f94}.chat-tools{gap:6px}.chat-ranks,.chat-tools{display:flex;align-items:center}.chat-ranks{gap:4px;margin-right:4px}.chat-ranks small{display:flex;align-items:center;gap:3px;margin-left:4px;font-size:11.5px;font-weight:700;color:#e8cf9a}.members-toggle.on{border-color:#e8cf9a;color:#fff}.chat-confirm{display:flex;align-items:center;gap:8px;padding:10px 16px;background:#e2626222;border-bottom:1px solid #e2626244;font-size:13px;color:#ffd6d6}.chat-confirm span{flex:1}.chat-log{flex:1;min-height:0;overflow-y:auto;padding:16px 18px;display:flex;flex-direction:column;gap:3px;scrollbar-width:thin;overscroll-behavior:contain}.chat-none{margin:auto;font-size:13px;color:#8f897f}.bubble-row{display:flex;flex-direction:column;align-items:flex-start;max-width:78%}.bubble-row.first{margin-top:10px}.bubble-row.mine{align-self:flex-end;align-items:flex-end}.bubble-name{display:flex;align-items:center;gap:6px;margin:0 0 3px 12px;font-size:12px;font-weight:700}.bubble{position:relative;padding:8px 13px 7px;border-radius:16px 16px 16px 6px;background:#ffffff12;border:1px solid #ffffff14;font-size:14px;line-height:1.45;color:#f3eee6;overflow-wrap:anywhere;animation:bubble-in .22s ease-out}.bubble-row:not(.first):not(.mine) .bubble{border-top-left-radius:6px}.mine .bubble{border-radius:16px 16px 6px 16px;background:linear-gradient(135deg,#e9d3a2,#c7a565);border-color:#fff3;color:#2b2521}.mine:not(.first) .bubble{border-top-right-radius:6px}.bubble time{margin-left:9px;font-size:10px;opacity:.55;font-variant-numeric:tabular-nums}@keyframes bubble-in{0%{opacity:0;transform:translateY(6px)}}.composer{display:flex;gap:8px;padding:12px 14px calc(12px + env(safe-area-inset-bottom));border-top:1px solid #ffffff10;background:#0a0c1466}.composer input{flex:1;min-width:0;height:46px;padding:0 18px;border-radius:23px;background:#0a0c14cc;border:1px solid #ffffff1f;color:#fff;font:inherit;font-size:14px}.composer input:focus{outline:none;border-color:#e8cf9a}.composer button{flex-shrink:0;display:grid;place-items:center;width:46px;height:46px;border-radius:50%;background:linear-gradient(135deg,#f2deb1,#c8aa70);color:#2b2521;box-shadow:0 6px 16px #d3bb8544}.room-body{flex:1;min-height:0;display:grid;grid-template-columns:minmax(0,1fr) 0;transition:grid-template-columns .25s}.room-body.show-members{grid-template-columns:minmax(0,1fr) 250px}.room-main{min-height:0}.room-main,.room-members{min-width:0;display:flex;flex-direction:column}.room-members{overflow-y:auto;border-left:1px solid #ffffff10;padding:12px 10px;gap:4px;scrollbar-width:thin}.room-members h4{margin:0 4px 6px;font-size:11.5px;font-weight:700;letter-spacing:1px;text-transform:uppercase;color:#bfb8ab;white-space:nowrap}:lang(th) .room-members h4{text-transform:none;letter-spacing:.2px}.member-row{display:flex;align-items:center;gap:8px;padding:5px 6px;border-radius:10px}.member-row:hover{background:#ffffff08}.member-row .row-text strong{font-size:12.5px}.member-row .row-text small{display:flex;align-items:center;gap:3px;font-size:10.5px}.member-tag{flex-shrink:0;font-size:10px;font-weight:700;color:#a59f94}.member-tag.friend{color:#8eecb0}.member-row .icon-chip{width:30px;height:30px}@media(min-width:1400px){.room-body{grid-template-columns:minmax(0,1fr) 250px}.room-members{display:flex}.members-toggle{display:none}}@media(max-width:1099px) and (min-width:800px){.social-list{left:20px;width:330px}.social-chat{left:362px;right:20px}.chat-ranks{display:none}}@media(max-width:799px){.social-list{left:10px;right:10px;width:auto;bottom:calc(var(--nav) + 10px);border-radius:18px}.social-chat{display:none}.social-screen.has-chat .social-chat{display:flex;position:fixed;z-index:30;left:0;right:0;top:0;bottom:var(--nav);border-radius:0;border:0;padding-top:env(safe-area-inset-top);background:linear-gradient(160deg,#171b27,#0d1018);animation:chat-in .25s ease-out}.chat-back{display:grid}.chat-head{padding:10px 12px;gap:10px}.chat-tools .chip-btn{padding:0 9px}.chat-ranks,.chat-tools .chip-btn svg+*{display:none}.chat-title strong{font-size:18px}.bubble-row{max-width:86%}.room-body.show-members{grid-template-columns:0 minmax(0,1fr)}.room-body.show-members .room-main{visibility:hidden}}@keyframes chat-in{0%{transform:translateX(30px);opacity:0}}@media(prefers-reduced-motion:reduce){.bubble,.social-screen.has-chat .social-chat{animation:none}}.resource.energy svg{color:#8fd8f2}.resource.energy small{font-size:9px;font-weight:500;color:#8f95a6;letter-spacing:.3px}.resource.energy.resting svg{color:#bff2ff;filter:drop-shadow(0 0 5px #7fdcff)}.energy-cost{display:inline-flex;align-items:center;gap:2px;padding:2px 6px 2px 4px;border-radius:9px;background:#0d132026;border:1px solid #0d132033;font-size:10px;font-weight:700;line-height:1}.secondary-btn .energy-cost,.text-btn .energy-cost{background:#8fd8f20d;border-color:#8fd8f233;color:#a9e2f5}.energy-cost svg,.primary-btn .energy-cost svg{margin:0!important;width:11px;height:11px}.showcase-btn{margin-bottom:14px}.showcase-note{gap:8px;margin-bottom:14px;font-size:11px;color:#a9e2f5}.showcase-note,.world-energy{display:flex;align-items:center}.world-energy{gap:7px;color:#8fd8f2}.world-energy strong{font:19px/1 var(--serif);color:var(--text)}.world-energy strong small{font-size:12px;color:var(--muted)}.world-energy span{margin-left:auto;display:flex;align-items:center;gap:4px;min-width:0;font-size:11px;color:#b9bccb;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.world-hud.resting .world-energy span{color:#bff2ff}.world-energy-track{height:3px;margin-top:8px;border-radius:2px;background:#ffffff14;overflow:hidden}.world-energy-track i{display:block;height:100%;background:linear-gradient(90deg,#5fb6dc,#bff2ff);transition:width .9s linear}.host-name{display:flex;flex-direction:column;gap:6px;font-size:9px;letter-spacing:1.5px;color:var(--muted)}.host-name input{height:40px;padding:0 12px;border:1px solid #ffffff1a;border-radius:6px;background:#12151b;color:var(--text);font:15px var(--serif);letter-spacing:0;outline:0}.host-name input:focus{border-color:#d3bb8580}.host-colors{display:flex;gap:8px;margin-top:12px}.host-colors button{width:28px;height:28px;border-radius:50%;border:2px solid #ffffff22;box-shadow:inset 0 -6px 10px #0004}.host-colors button.chosen{border-color:var(--gold);box-shadow:0 0 0 2px #12151b,0 0 0 3px #d3bb8599}.showcase-face{width:92px;flex-shrink:0}.showcase-face .card-face{width:100%}.nearby-card ul{list-style:none;margin:0;padding:0;display:grid;gap:7px}.nearby-portrait{width:32px;height:36px;flex-shrink:0;border-radius:5px;overflow:hidden;background:var(--hero-color)}.nearby-portrait .hero-portrait{width:100%;height:100%;object-fit:cover;display:block}.nearby-info{flex:1;min-width:0}.nearby-info strong{display:block;font-size:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.nearby-info small{font-size:10px;color:var(--muted)}.nearby-meta{display:flex;align-items:center;gap:6px;font-size:10px;color:#8f95a6}.live-dot{width:7px;height:7px;border-radius:50%;background:#f0d79e;box-shadow:0 0 8px #f0d79e}.world-view{position:absolute;inset:0;z-index:0;isolation:isolate;background:#2a2533}.world-canvas{width:100%;height:100%;display:block;outline:0;touch-action:none}.world-asset-warning{position:absolute;z-index:3;top:calc(var(--bar) + 4px);left:50%;translate:-50% 0;padding:5px 12px;border-radius:12px;background:#14121bcc;font-size:11px;color:#e5cfa4}.world-left{--lw:min(212px,28vh);position:absolute;z-index:3;top:calc(var(--bar) + 10px);left:28px;display:flex;flex-direction:column;align-items:flex-start;gap:10px;pointer-events:none;animation:hud-in-left .7s .1s both}.world-left>*{pointer-events:auto}.world-hud{width:var(--lw);padding:10px 13px 11px;border-radius:14px;box-shadow:0 10px 26px #0006;transition:border-color .3s,box-shadow .3s}.world-hud.resting{border-color:#8fd8f266;box-shadow:0 0 28px #5fc8f233}.world-hint{left:50%;translate:-50% 0;display:flex;align-items:center;gap:7px;padding:8px 14px;border-radius:16px;color:#d4d2dd;font-size:11.5px;white-space:nowrap;pointer-events:none}.world-hint,.world-showcase{position:absolute;z-index:3;bottom:28px}.world-showcase{left:28px;max-width:min(470px,calc(100% - 56px));animation:hud-in-up .7s .16s both}.showcase-head{display:flex;align-items:baseline;gap:10px;margin-bottom:9px;text-shadow:0 1px 8px #000}.showcase-head span{flex-shrink:0;white-space:nowrap;font:400 17px var(--serif);color:#f3ead8}.showcase-head small{font-size:11.5px;color:#d7d0c4;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.showcase-grid{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;padding:4px 2px}.showcase-grid::-webkit-scrollbar{display:none}.showcase-grid button{flex-shrink:0;width:60px;text-align:center}.showcase-art{display:block;width:60px;height:60px;border-radius:16px;overflow:hidden;background:#1b1e27;border:1.5px solid color-mix(in srgb,var(--hero-color) 70%,#ffffff40);box-shadow:0 8px 20px #000a;transition:transform .2s,border-color .2s}.showcase-art .hero-portrait{display:block;width:100%;height:100%;object-fit:cover;object-position:50% 10%;transform:scale(1.3);transform-origin:50% 8%}.showcase-grid button small{display:block;margin-top:5px;font-size:11px;color:#e2dacd;text-shadow:0 1px 6px #000}.showcase-grid button:hover .showcase-art{transform:translateY(-2px)}.showcase-grid button.chosen .showcase-art{border-color:var(--gold);box-shadow:0 0 0 2px #e8cf9a99,0 0 18px #d3bb8580}.showcase-grid button.chosen small{color:var(--gold)}.showcase-now{display:none}.loot-feed{position:absolute;z-index:3;top:calc(var(--bar) + 10px);right:120px;display:flex;flex-direction:column;align-items:flex-end;gap:6px;margin:0;padding:0;list-style:none;pointer-events:none}.loot-feed li{display:flex;align-items:center;gap:7px;padding:4px 12px 4px 5px;border-radius:999px;color:#fff6e4;font-size:13px;font-weight:700;border:1px solid color-mix(in srgb,var(--item) 55%,transparent);animation:loot-in .35s cubic-bezier(.2,1.4,.4,1) both,loot-out .5s ease-in 3.7s forwards}.loot-feed img{width:28px;height:28px;object-fit:contain;filter:drop-shadow(0 0 6px color-mix(in srgb,var(--item) 70%,transparent))}@keyframes loot-in{0%{transform:translateX(24px) scale(.9);opacity:0}}@keyframes loot-out{to{transform:translateX(12px);opacity:0}}.hunt-pad{position:absolute;z-index:3;right:214px;bottom:22px;display:flex;align-items:flex-end;gap:4px;animation:hud-in-right .5s both}.skill-btn{position:relative;gap:6px;width:96px}.auto-hunt-btn,.skill-btn{display:flex;flex-direction:column;align-items:center;-webkit-tap-highlight-color:transparent}.auto-hunt-btn{gap:5px;width:64px;margin-bottom:2px}.auto-hunt-face{display:grid;place-items:center;width:50px;height:50px;border-radius:50%;color:#cfc6b4;background:#141826e6;border:2px solid #f6e6c055;box-shadow:0 6px 16px #0009,0 0 0 3px #0b0e1899;transition:transform .15s,color .2s,border-color .2s,box-shadow .2s}.auto-hunt-btn small{padding:2px 9px;border-radius:999px;background:#0b0e18b8;font-size:11px;font-weight:800;letter-spacing:.04em;color:#cfc6b4}.auto-hunt-btn.on .auto-hunt-face{color:#1a1206;background:radial-gradient(circle at 35% 30%,#ffe9a8,#f0b94a 70%);border-color:#fff3c8;box-shadow:0 6px 16px #0009,0 0 0 3px #f0b94a55,0 0 20px 4px #f0b94a88}.auto-hunt-btn.on .auto-hunt-face svg{animation:auto-spin 2.4s linear infinite}.auto-hunt-btn.on small{color:#ffe7a6}.auto-hunt-btn:active .auto-hunt-face{transform:scale(.9)}@keyframes auto-spin{to{transform:rotate(1turn)}}.auto-hunt{position:relative}.hunt-pad:has(.auto-hunt-panel){z-index:12}.auto-hunt-set{position:absolute;top:-6px;right:0;display:grid;place-items:center;width:24px;height:24px;border-radius:50%;background:#141826f0;border:1.5px solid #f6e6c066;color:#e9dfc8;box-shadow:0 3px 8px #0008}.auto-hunt-set.on{background:#f0b94a;color:#1a1206;border-color:#fff3c8}.auto-hunt-panel{position:absolute;right:0;bottom:calc(100% + 12px);width:min(320px,calc(100vw - 24px));padding:12px 14px 14px;border-radius:16px;color:#f4efe6;animation:sheet-in .2s ease-out}.auto-hunt-panel header{display:flex;align-items:center;justify-content:space-between;margin-bottom:6px}.auto-hunt-panel header strong{font-size:14px}.auto-hunt-panel h3{margin:10px 0 6px;font-size:11.5px;font-weight:700;letter-spacing:.04em;color:#cfc6b4}.auto-kinds{display:grid;grid-template-columns:repeat(5,1fr);gap:6px}.auto-kinds button{display:flex;flex-direction:column;align-items:center;gap:4px;padding:0;color:inherit}.auto-kind-art{position:relative;display:grid;place-items:center;width:100%;aspect-ratio:1;border-radius:12px;background:#0b0e18b8;border:1.5px solid #ffffff22;opacity:.55;transition:opacity .15s,border-color .15s}.auto-kind-art img{width:86%;height:86%;object-fit:contain}.auto-kind-art i{position:absolute;top:-5px;right:-5px;display:grid;place-items:center;width:18px;height:18px;border-radius:50%;background:#f0b94a;color:#1a1206}.auto-kinds button.on .auto-kind-art{opacity:1;border-color:#f0b94a}.auto-kinds small{font-size:10px;line-height:1.15;text-align:center;color:#e9dfc8}.auto-kinds small b{display:block;font-size:8.5px;color:#ffb98a}.auto-zones{display:flex;flex-wrap:wrap;gap:6px}.auto-zones button{padding:5px 10px;border-radius:999px;background:#0b0e18b8;border:1px solid #ffffff26;color:#e9dfc8;font-size:11.5px;font-weight:600}.auto-zones button.on{background:#f0b94a;border-color:#fff3c8;color:#1a1206}@media(prefers-reduced-motion:reduce){.auto-hunt-btn.on .auto-hunt-face svg{animation:none}}.skill-face{position:relative;width:78px;height:78px;border-radius:50%;overflow:hidden;border:3px solid color-mix(in srgb,var(--hero-color) 70%,#f6e6c0);box-shadow:0 8px 22px #0009,0 0 0 4px #0b0e1899;background:#141826;transition:transform .15s,box-shadow .2s}.skill-face img{width:100%;height:100%;object-fit:cover}.skill-face:after{content:"";position:absolute;inset:0;border-radius:50%;background:conic-gradient(#0b0e18c4 calc(var(--cool) * 1turn),transparent 0)}.skill-count{position:absolute;inset:0;z-index:1;display:grid;place-items:center;font-size:26px;color:#fff;text-shadow:0 2px 8px #000}.skill-btn small{max-width:110px;padding:2px 9px;border-radius:999px;background:#0b0e18b8;font-size:11.5px;font-weight:700;color:#f6ecd6;text-align:center;line-height:1.25}.skill-btn.ready .skill-face{box-shadow:0 8px 22px #0009,0 0 0 4px color-mix(in srgb,var(--hero-color) 55%,transparent),0 0 26px 6px color-mix(in srgb,var(--hero-color) 60%,transparent);animation:skill-ready 1.6s ease-in-out infinite}.skill-btn.idle .skill-face{filter:saturate(.75) brightness(.85)}.skill-btn.cooling .skill-face{filter:saturate(.5)}.skill-btn.down .skill-face{filter:grayscale(1) brightness(.6)}.skill-btn:active .skill-face{transform:scale(.92)}@keyframes skill-ready{50%{transform:scale(1.05)}}.world-rail{position:absolute;z-index:3;right:32px;bottom:28px;display:flex;gap:14px;animation:hud-in-right .7s .12s both}.world-rail .rail-btn{width:74px}.world-rail .rail-btn:first-child .rail-icon{color:color-mix(in srgb,var(--host-color) 55%,#f1e3c2)}.world-drawer{position:absolute;z-index:4;top:calc(var(--bar) + 10px);right:120px;max-height:calc(100% - var(--bar) - 140px);width:340px;background:linear-gradient(160deg,#151a26eb,#0f131ce3);display:flex;flex-direction:column;padding:18px;border-radius:20px;overflow-y:auto;overscroll-behavior:contain;box-shadow:0 20px 60px #000b;animation:drawer-in .3s ease-out}.world-drawer .section-heading{margin-bottom:14px}.world-drawer .section-heading h2{display:flex;align-items:center;gap:8px;font:400 19px var(--serif)}.world-drawer .section-heading h2 svg{color:var(--gold)}.host-preview{display:flex;gap:14px;align-items:center;margin-bottom:16px;padding-bottom:16px;border-bottom:2px solid var(--host-color)}.host-preview p{font-size:12px;line-height:1.55;color:#c9c5d0}.host-preview .tiny-label{display:block;margin-top:8px}.nearby-card li{display:flex;align-items:center;gap:10px;padding:8px;border-radius:10px;background:#ffffff08}.nearby-card .prototype-note{margin-top:14px}.nearby-row{display:flex;align-items:center;gap:10px;margin:-8px;padding:8px;border-radius:10px;text-align:left;width:calc(100% + 16px)}.nearby-row:hover{background:#ffffff0d}.area-chat{position:absolute;z-index:3;left:28px;bottom:166px;width:min(360px,calc(100% - 56px));display:flex;flex-direction:column;align-items:flex-start;gap:6px;color:#efe8dc;pointer-events:none;animation:hud-in-up .7s .2s both}.area-chat>*{pointer-events:auto}.area-ticker{pointer-events:none!important;display:flex;flex-direction:column;align-items:flex-start;gap:3px;max-width:100%}.area-ticker p{margin:0;max-width:100%;padding:3px 10px;border-radius:11px;background:#0b0e1873;font-size:12.5px;line-height:1.35;text-shadow:0 1px 3px #000c;overflow-wrap:anywhere;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;animation:area-line-in .3s ease-out both}.area-ticker p:not(:last-child){opacity:.78}@keyframes area-line-in{0%{opacity:0;transform:translateY(6px)}}.area-history{width:100%;display:flex;flex-direction:column;border-radius:16px;overflow:hidden;box-shadow:0 12px 30px #0007;animation:hud-in-up .25s ease-out both}.area-history header{display:flex;align-items:center;gap:7px;padding:7px 6px 4px 12px;font-size:11.5px;font-weight:700;letter-spacing:.3px;color:#e8d5a8}.area-history header span{flex:1}.area-history header button{display:grid;place-items:center;width:26px;height:26px;border-radius:8px;color:#d9d3c7}.area-history header button:hover{background:#ffffff12}.area-log{max-height:180px;overflow-y:auto;overscroll-behavior:contain;padding:2px 12px 10px;display:flex;flex-direction:column;gap:3px;font-size:13px;line-height:1.4;scrollbar-width:thin}.area-chat p{overflow-wrap:anywhere}.area-log p{margin:0}.area-chat p b{margin-right:6px;color:color-mix(in srgb,var(--who) 45%,#fff3d8)}.area-chat p.mine b{color:#f0d79e}.area-log .area-empty{color:#a9a4b4;font-size:12px}.area-bar{width:100%;gap:2px;height:38px;padding:3px;background:linear-gradient(125deg,#161b28d9,#10141ea8);box-shadow:0 6px 18px #0006}.area-bar,.area-toggle{display:flex;align-items:center;border-radius:999px}.area-toggle{flex-shrink:0;gap:1px;height:100%;padding:0 6px 0 9px;color:#e8d5a8}.area-chat.open .area-toggle,.area-toggle:hover{background:#ffffff14}.area-toggle svg:last-child{opacity:.7}.area-bar input{flex:1;min-width:0;height:100%;padding:0 8px;border:0;background:transparent;color:#fff;font:inherit;font-size:13.5px;outline:none}.area-bar input::placeholder{color:#c9c3d2b3}.area-bar:focus-within{border-color:#e8cf9a88}.area-send{flex-shrink:0;display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:linear-gradient(135deg,#f0d79e,#c99a5a);color:#2a1d10;transition:opacity .2s,transform .2s}.area-send:disabled{opacity:0;transform:scale(.6);pointer-events:none}.peer-card{position:absolute;z-index:5;left:50%;top:calc(var(--bar) + 14px);translate:-50% 0;width:min(330px,calc(100% - 24px));padding:14px;border-radius:18px;background:linear-gradient(160deg,#171c29f2,#0f131ceb);box-shadow:0 20px 60px #000b;animation:drawer-in .25s ease-out}.peer-x{position:absolute;top:6px;right:6px}.peer-head{display:flex;align-items:center;gap:12px;padding-right:34px}.peer-head .nearby-portrait{width:44px;height:50px;border-radius:8px}.peer-head strong{display:block;font:400 19px/1.2 var(--serif);color:#fff6e6}.peer-head small{display:block;margin-top:2px;font-size:11.5px;color:#b9b2a6}.peer-actions{display:flex;gap:8px;margin-top:12px}.peer-actions>*{flex:1;height:40px}@keyframes drawer-in{0%{opacity:0;transform:translateX(24px)}}.world-minimap{position:relative;width:var(--lw);aspect-ratio:1;border-radius:18px;overflow:hidden;background:#1b2420;border:1px solid #ffffff2b;box-shadow:0 14px 34px #0008}.world-minimap[hidden]{display:none}.world-minimap canvas{display:block;width:100%;height:100%;cursor:pointer;touch-action:none}.minimap-size{position:absolute;top:8px;right:8px;width:26px;height:26px;border-radius:50%;display:grid;place-items:center;background:#0b0e16a6;border:1px solid #ffffff26;color:#f2ede4;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);transition:transform .15s,background .15s}.minimap-size:hover{background:#0b0e16d9;transform:scale(1.08)}.world-atlas{position:absolute;inset:0;z-index:20;display:grid;place-items:center;padding:16px;background:#06080ec2;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);animation:atlas-in .22s ease-out}.atlas-sheet{--size:min(calc(100vw - 48px),calc(100vh - 150px),1000px);width:var(--size);display:flex;flex-direction:column;gap:12px;pointer-events:none}.atlas-sheet>*{pointer-events:auto}.atlas-head{display:flex;align-items:flex-end;justify-content:space-between;gap:12px}.atlas-head small{display:block;font:600 11px/1.4 ui-monospace,SFMono-Regular,Menlo,monospace;color:#a9a39a;letter-spacing:.5px}.atlas-head h2{font:400 24px/1.2 var(--serif);color:#fff6e6}.atlas-map{position:relative;width:var(--size);aspect-ratio:1;border-radius:22px;overflow:hidden;border:1px solid #ffffff2b;box-shadow:0 30px 80px #000c;background:#1b2420}.atlas-map canvas{display:block;width:100%;height:100%;cursor:crosshair;touch-action:none}.atlas-pin{position:absolute;translate:var(--ax) var(--ay);display:flex;align-items:center;gap:5px;padding:4px 10px 4px 8px;border-radius:999px;background:#0b0e16d1;border:1px solid #ffffff2e;color:#f4efe6;font-size:12px;font-weight:600;white-space:nowrap;box-shadow:0 6px 16px #0008;transition:background .15s,border-color .15s}.atlas-pin:not(:disabled):hover{background:#141a28f0;border-color:#ffffff66}.atlas-pin.well svg{color:#7fdcff}.atlas-pin.exit svg{color:#f0d79e}.atlas-pin.closed{opacity:.6;cursor:default}.atlas-pin.closed svg{color:#b8b4ad}.atlas-pin.elite{border-color:#ff7a5a99}.atlas-pin.elite svg{color:#ff7a5a}.atlas-pin.elite.down{border-color:#ffffff2e;color:#d9d2c4}.atlas-pin.elite.down svg{color:#9c968c}.atlas-hint{text-align:center;font-size:12px;color:#a9a39a}@keyframes atlas-in{0%{opacity:0}}.world-menu{position:absolute;z-index:3;right:28px;top:50%;translate:0 -50%;display:flex;flex-direction:column;align-items:center;gap:14px;padding:14px 6px;border-radius:44px;background:linear-gradient(180deg,#10141e66,#10141e33);border:1px solid #ffffff12;animation:hud-in-right .7s .14s both}.world-menu .rail-btn{width:72px}.menu-hosts{display:none}.chat-slot{position:relative;display:flex;justify-content:center;--peek-y:27px}.dm-peek{z-index:2;right:calc(100% + 12px);top:var(--peek-y);display:flex;align-items:center;gap:9px;width:max-content;max-width:min(250px,calc(100vw - 96px));padding:8px 13px 8px 9px;border-radius:16px;text-align:left;background:linear-gradient(125deg,#1f2536f5,#141824f5);box-shadow:0 10px 28px #000b;transform-origin:right center;animation:peek-in .38s cubic-bezier(.2,1.4,.4,1) both}.dm-peek,.dm-peek:after{position:absolute;translate:0 -50%;border:1px solid #e8cf9a55}.dm-peek:after{content:"";right:-6px;top:50%;width:10px;height:10px;rotate:45deg;background:#151a26;border-left:0;border-bottom:0}.dm-peek>span:last-child{min-width:0;display:flex;flex-direction:column;gap:1px}.dm-peek strong{font-size:12.5px;color:#fff6e6}.dm-peek small,.dm-peek strong{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.dm-peek small{font-size:12px;color:#c9c2b5}.dm-peek .host-avatar{flex-shrink:0}@keyframes peek-in{0%{opacity:0;transform:translateX(18px) scale(.4)}}@media(prefers-reduced-motion:reduce){.dm-peek{animation:none}}.chat-dock{position:absolute;z-index:4;top:calc(var(--bar) + 10px);right:120px;bottom:130px;width:370px;display:flex;flex-direction:column;min-height:0;color:#efe8dc;border-radius:20px;background:linear-gradient(160deg,#171c29f2,#0f131ceb);border:1px solid #ffffff1c;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);box-shadow:0 20px 60px #000b;overflow:hidden;animation:drawer-in .3s ease-out}.dock-head{display:flex;align-items:center;gap:10px;padding:10px 10px 10px 14px;border-bottom:1px solid #ffffff10;background:linear-gradient(90deg,#ffffff08,transparent)}.dock-head>svg{flex-shrink:0;color:var(--gold)}.dock-head>strong{flex:1;min-width:0;font:400 18px var(--serif);color:#fff6e6;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.dock-head .round-btn{flex-shrink:0;width:34px;height:34px}.dock-head .chat-title strong{font-size:17px}.dock-tools{flex-shrink:0;margin-left:auto;display:flex;gap:6px}.chat-dock .social-scroll{padding:10px}.chat-dock .chat-log{padding:12px 14px}.chat-dock .composer{padding:10px 12px}.chat-dock .composer input{height:40px;padding:0 15px}.chat-dock .composer button{width:40px;height:40px}@media(max-width:1099px){.world-hint{display:none}.world-rail,.world-showcase{bottom:calc(var(--nav) + 18px)}.world-rail{right:24px}.hunt-pad{right:200px;bottom:calc(var(--nav) + 12px)}.world-drawer{max-height:calc(100% - var(--bar) - var(--nav) - 140px)}.chat-dock{bottom:calc(var(--nav) + 130px)}.area-chat{bottom:calc(var(--nav) + 156px)}}@media(max-width:799px){.world-left{--lw:124px;left:12px;top:calc(var(--bar) + 6px);gap:7px}.world-minimap{border-radius:14px}.minimap-size{top:6px;right:6px;width:24px;height:24px}.world-hud{position:absolute;left:6px;right:6px;bottom:6px;width:auto;padding:4px 8px 5px;border-radius:10px;box-shadow:0 4px 12px #0007}.world-hud.full{display:none}.world-energy{gap:4px}.world-energy>svg{width:12px;height:12px;flex-shrink:0}.world-energy strong{display:none}.world-energy span{margin-left:0;font-size:10.5px}.world-energy-track{height:2px;margin-top:3px}.menu-satchel,.world-rail{display:none}.menu-hosts{display:contents}.atlas-sheet{--size:min(calc(100vw - 24px),calc(100vh - var(--nav) - 170px))}.atlas-head h2{font-size:20px}.atlas-pin{font-size:10.5px;padding:3px 8px 3px 6px}.world-menu{right:10px;top:calc(var(--bar) + 6px);translate:none;gap:8px;padding:6px;border-radius:30px}.world-menu .rail-btn{width:42px;gap:0}.world-menu .rail-icon{width:42px;height:42px}.world-menu .rail-icon svg{width:19px;height:19px}.world-menu .rail-btn small{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.world-menu .rail-badge{top:-5px;right:-5px}.world-menu .rail-dot{top:0;right:0}.world-menu .chat-slot{--peek-y:21px}.dm-peek{right:calc(100% + 10px)}.world-menu .host-btn .rail-icon{color:color-mix(in srgb,var(--host-color) 55%,#f1e3c2)}.chat-dock{top:auto;left:0;right:0;bottom:var(--nav);width:auto;height:72%;border-radius:20px 20px 0 0;animation:sheet-in .3s ease-out}.world-showcase{left:auto;right:12px;bottom:calc(var(--nav) + 12px);max-width:none;z-index:4}.showcase-pick{display:none}.world-showcase.open .showcase-pick{display:block;position:absolute;right:0;bottom:calc(100% + 10px);width:calc(100vw - 24px);padding:10px 12px 6px;border-radius:18px;background:var(--glass-solid);border:1px solid var(--edge);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:0 16px 40px #000a;animation:sheet-in .25s ease-out}.showcase-now{display:flex;flex-direction:column;align-items:center;gap:3px;width:62px}.showcase-now .showcase-art{width:54px;height:54px;border-radius:16px;border-color:var(--gold);box-shadow:0 0 0 2px #e8cf9a66,0 8px 20px #000a}.showcase-now small{font-size:10px;color:#f3ead8;text-shadow:0 1px 6px #000}.world-showcase.open .showcase-now .showcase-art{box-shadow:0 0 0 2px var(--gold),0 0 18px #d3bb8599}.area-chat{left:12px;right:88px;width:auto;bottom:calc(var(--nav) + 14px);gap:5px}.area-ticker p{font-size:12px;padding:2px 9px}.area-log{max-height:150px;font-size:12.5px}.area-bar{height:34px}.area-send{width:28px;height:28px}.showcase-head small{display:none}.showcase-head span{font-size:15px}.showcase-grid{gap:6px}.showcase-art,.showcase-grid button{width:50px}.showcase-art{height:50px;border-radius:13px}.showcase-grid button small{font-size:10px}.hunt-pad{right:2px;bottom:calc(var(--nav) + 96px)}.skill-btn{width:84px}.auto-hunt-btn{width:54px}.auto-hunt-face{width:44px;height:44px}.auto-hunt-btn small{font-size:10px}.skill-face{width:66px;height:66px}.skill-btn small{font-size:10px}.loot-feed{right:66px;top:calc(var(--bar) + 6px)}.loot-feed li{font-size:11.5px;padding:3px 10px 3px 4px}.loot-feed img{width:22px;height:22px}.world-drawer{top:auto;left:0;right:0;bottom:var(--nav);width:auto;max-height:64%;border-radius:20px 20px 0 0;padding:16px 16px calc(16px + env(safe-area-inset-bottom) * 0);animation:sheet-in .3s ease-out}.mobile-nav button{min-width:50px}}@keyframes sheet-in{0%{transform:translateY(40px);opacity:0}}@media(pointer:coarse){.hint-keys{display:none}}.loot-feed li.gear{padding:6px 14px 6px 6px;font-size:14px;background:radial-gradient(ellipse at 20% 50%,color-mix(in srgb,var(--item) 34%,transparent),#0d1018d9 70%);box-shadow:0 0 18px color-mix(in srgb,var(--item) 55%,transparent);animation:loot-in .45s cubic-bezier(.2,1.6,.4,1) both,loot-out .5s ease-in 3.7s forwards}.loot-feed li.gear img{width:40px;height:40px}.arena-screen{--ember:#f0a07a;--panel:linear-gradient(160deg,#1a1e2bd9,#0f121bcc);color:#efe8dc}.arena-backdrop{position:absolute;inset:0;z-index:-1;background:radial-gradient(ellipse 60% 45% at 50% 82%,#f0a07a40,transparent 70%),linear-gradient(180deg,#0a0c14e6,#0a0c1480 30%,#0a0c14a6 70%,#07080df5),url(/art/battle/ch8-wide.webp) 50% 40%/cover no-repeat}.arena-backdrop i{position:absolute;top:-20%;width:38%;height:120%;background:linear-gradient(180deg,#ffe2b31f,transparent 70%);filter:blur(8px);transform-origin:50% 0;animation:arena-ray 9s ease-in-out infinite alternate}.arena-backdrop i:first-child{left:18%;rotate:16deg}.arena-backdrop i:last-child{right:18%;rotate:-16deg;animation-delay:-4s}@keyframes arena-ray{to{opacity:.35;transform:scaleX(.7)}}.arena-screen .arena-modes,.arena-screen .arena-side{position:absolute;z-index:2;top:calc(var(--bar) + 10px);bottom:24px;display:flex;flex-direction:column;gap:12px;min-height:0}.arena-modes{left:28px;width:320px;animation:hud-in-left .6s .08s both}.arena-side{right:28px;width:340px;animation:hud-in-right .6s .08s both}.mode-cards{display:flex;flex-direction:column;gap:12px}.arena-history,.arena-side>*,.mode-card{border-radius:18px;background:var(--panel);border:1px solid #ffffff1c;-webkit-backdrop-filter:blur(14px) saturate(1.2);backdrop-filter:blur(14px) saturate(1.2);box-shadow:0 16px 40px #0009}.arena-screen h3{display:flex;align-items:center;gap:7px;margin:0 0 10px;font-size:12px;font-weight:700;letter-spacing:1.2px;text-transform:uppercase;color:#e8cf9a}:lang(th) .arena-screen h3{text-transform:none;letter-spacing:.2px;font-size:13px}.arena-empty{display:flex;flex-direction:column;align-items:flex-start;gap:10px;font-size:12.5px;line-height:1.5;color:#b9b2a6}.mode-card{position:relative;display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:12px;padding:14px 14px 14px 12px;text-align:left;transition:border-color .2s,transform .2s,box-shadow .2s}.mode-card:hover{border-color:#e8cf9a66}.mode-card.active{border-color:var(--ember);background:linear-gradient(160deg,#3a2128e6,#151320d9);box-shadow:0 0 0 1px #f0a07a55,0 0 34px #f0a07a33,0 16px 40px #0009}.mode-card.active:before{content:"";position:absolute;left:-1px;top:18%;bottom:18%;width:3px;border-radius:2px;background:var(--ember);box-shadow:0 0 10px var(--ember)}.mode-icon{display:grid;place-items:center;width:44px;height:44px;border-radius:14px;background:radial-gradient(circle at 50% 30%,#3d3348,#14111c);border:1px solid #e8cf9a55;color:#f3dcaa}.mode-card.active .mode-icon{color:#fff;border-color:var(--ember);background:radial-gradient(circle at 50% 30%,#7a3b33,#2a1218)}.mode-text{min-width:0;display:flex;flex-direction:column}.mode-text small{font-size:10.5px;font-weight:800;letter-spacing:1.4px;color:var(--ember)}.mode-text strong{font:400 22px/1.15 var(--serif);color:#fff6e6}.mode-text em{font-style:normal;font-size:11.5px;line-height:1.35;color:#b9b2a6;margin-top:2px}.mode-rank{display:flex;flex-direction:column;align-items:center;gap:1px;min-width:56px}.mode-rank b{font-size:15px;font-variant-numeric:tabular-nums;color:#fff}.mode-rank small{font-size:10.5px;color:var(--tier)}.mode-searching{position:absolute;top:-9px;right:12px;display:flex;align-items:center;gap:6px;padding:3px 9px;border-radius:99px;background:#2b1a14f2;border:1px solid #7fe0a066;color:#c9f5d6;font-size:11px;font-weight:700;box-shadow:0 4px 14px #0008}.mode-searching i,.others-searching i{position:relative;width:7px;height:7px;border-radius:50%;background:#7fe0a0}.mode-searching i:after,.others-searching i:after{content:"";position:absolute;inset:0;border-radius:50%;background:#7fe0a0;animation:searching-ping 1.6s ease-out infinite}@keyframes searching-ping{0%{opacity:.7}to{opacity:0;transform:scale(3.2)}}.others-searching{display:flex;align-items:center;gap:9px;padding:9px 12px;border-radius:12px;background:#7fe0a014;border:1px solid #7fe0a040;color:#d6f6df;font-size:12.5px;line-height:1.35}.others-searching i{flex-shrink:0}.mode-record{grid-column:1/-1;padding-top:8px;border-top:1px solid #ffffff12;font-size:11.5px;color:#cfc8bb}.arena-history{padding:14px}.arena-history,.arena-history ol{flex:1;min-height:0;display:flex;flex-direction:column}.arena-history ol{overflow-y:auto;margin:0;padding:0;list-style:none;gap:6px;scrollbar-width:thin}.arena-history li{display:flex;align-items:center;gap:9px;padding:6px 8px;border-radius:12px;background:#ffffff08;border-left:3px solid #8b8b96}.arena-history li.win{border-left-color:#6fe39a}.arena-history li.loss{border-left-color:#f08a7a}.hist-result{width:44px;flex-shrink:0;font-size:11px;font-weight:800;letter-spacing:.4px;color:#cfcfd6}.win .hist-result{color:#8eecb0}.loss .hist-result{color:#ffa699}.hist-who{flex:1;min-width:0;display:flex;flex-direction:column}.hist-who strong{font-size:12.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.hist-who strong svg{margin-left:5px;font-style:normal;font-size:9.5px;padding:0 5px;border-radius:5px;background:#8fd8f233;color:#bfeaff;vertical-align:1px}.hist-who small{font-size:10.5px;color:#9e988d}.arena-history li b{font-size:13px;font-variant-numeric:tabular-nums}.arena-history li b.up{color:#8eecb0}.arena-history li b.down{color:#ffa699}.arena-lineup{position:absolute;z-index:1;top:var(--bar);bottom:16px;left:372px;right:392px;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;min-height:0}.arena-lineup>header{position:absolute;top:10px;left:0;right:0;display:flex;flex-wrap:wrap;justify-content:center;align-items:baseline;gap:6px 12px;text-shadow:0 2px 10px #000}.arena-lineup>header span{display:flex;align-items:center;gap:6px;font-size:12px;font-weight:700;letter-spacing:1.2px;text-transform:uppercase;color:#e8cf9a}:lang(th) .arena-lineup>header span{text-transform:none;letter-spacing:.2px;font-size:13px}.arena-lineup>header b{font:400 20px var(--serif);color:#fff}.arena-lineup>header small{flex-basis:100%;text-align:center;font-size:11.5px;color:#b9b2a6}.duel-hero{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;height:min(78%,620px);aspect-ratio:3/4;max-width:100%;animation:hero-rise .7s cubic-bezier(.2,1.2,.4,1) both}.duel-hero img{position:relative;z-index:1;height:100%;width:100%;object-fit:contain;object-position:50% 100%;filter:drop-shadow(0 0 22px color-mix(in srgb,var(--hero-color) 55%,transparent)) drop-shadow(0 18px 24px #000c);transition:transform .35s}.duel-hero:hover img{transform:translateY(-6px) scale(1.02)}.duel-ring{position:absolute;z-index:0;bottom:4%;left:8%;right:8%;height:16%;border-radius:50%;background:radial-gradient(ellipse at center,color-mix(in srgb,var(--hero-color) 60%,transparent) 0,transparent 70%);box-shadow:0 0 0 2px color-mix(in srgb,var(--hero-color) 40%,transparent);animation:ring-pulse 2.6s ease-in-out infinite}@keyframes ring-pulse{50%{transform:scale(1.08);opacity:.7}}.duel-plate{position:absolute;z-index:2;bottom:0;left:50%;translate:-50% 0;flex-direction:column;padding:8px 22px 9px;border-radius:14px;background:linear-gradient(#0b0d15cc,#0b0d15f2);border:1px solid color-mix(in srgb,var(--hero-color) 60%,#e8cf9a);box-shadow:0 10px 30px #000b;white-space:nowrap}.duel-plate,.duel-plate small{display:flex;align-items:center}.duel-plate small{gap:5px;font-size:11px;color:color-mix(in srgb,var(--hero-color) 70%,#fff)}.duel-plate strong{font:400 26px/1.15 var(--serif);color:#fff6e6}.duel-plate em{font-style:normal;font-size:12px;font-weight:700;color:#e8cf9a}.squad-cards{display:flex;justify-content:center;align-items:flex-end;gap:clamp(8px,1.2vw,16px);width:100%;padding-bottom:6%}.squad-card{--w:clamp(96px,10.5vw,158px);position:relative;width:var(--w);padding:4px;border-radius:16px;background:linear-gradient(170deg,color-mix(in srgb,var(--hero-color) 55%,#f3dca4),#4a3f2c 45%,#1a1620);box-shadow:0 14px 30px #000c,inset 0 1px #fff5;transform:translateY(calc((2 - var(--i)) * (2 - var(--i)) * 6px)) rotate(calc((var(--i) - 2) * 2.5deg));animation:hero-rise .6s calc(var(--i) * 70ms) cubic-bezier(.2,1.2,.4,1) both;transition:transform .25s,box-shadow .25s}.squad-card:hover{transform:translateY(-10px) rotate(0);box-shadow:0 0 0 1px #fff,0 0 28px var(--hero-color),0 18px 34px #000c;z-index:1}.squad-card-art{position:relative;display:block;aspect-ratio:3/4;border-radius:12px 12px 6px 6px;overflow:hidden;background:#0d0a14}.squad-card-art .hero-portrait{width:100%;height:100%;aspect-ratio:auto;object-fit:cover;object-position:50% 12%}.squad-card-art:after{content:"";position:absolute;inset:55% 0 0;background:linear-gradient(#0000,#0b0910e6)}.squad-card-row{position:absolute;z-index:1;top:10px;left:10px;padding:1px 8px;border-radius:8px;background:#0b0910d0;border:1px solid #ffffff26;font-size:10px;font-weight:700;letter-spacing:.4px;color:#e8cf9a}.squad-card.front .squad-card-row{color:#ffc2a3;border-color:#f0a07a66}.squad-card-foot{display:block;padding:6px 4px 4px;text-align:center}.squad-card-foot strong{display:block;font-size:14px;color:#fff;text-shadow:0 1px 2px #000}.squad-card-foot small{display:flex;align-items:center;justify-content:center;gap:4px;font-size:11px;font-weight:700;color:#e8cf9a}@keyframes hero-rise{0%{opacity:0;transform:translateY(30px)}}.match-panel{padding:18px;display:flex;flex-direction:column;gap:16px}.match-crest{display:flex;align-items:center;gap:14px}.match-crest small{display:block;font-size:11px;font-weight:700;letter-spacing:1px;color:var(--ember)}.match-crest strong{display:block;font:400 28px/1.1 var(--serif);color:#fff6e6}.match-crest span{font-size:13px;font-weight:600;color:#d8d0c2;font-variant-numeric:tabular-nums}.find-btn{position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center;gap:14px;height:68px;border-radius:16px;background:linear-gradient(110deg,#ffd9a0,#e88a5c 55%,#b8503f);border:1px solid #fff4;color:#2a120a;box-shadow:0 10px 30px #f0a07a55,inset 0 1px #fffb,inset 0 -3px #0003;transition:filter .2s,transform .2s}.find-btn>*{position:relative;z-index:1}.find-btn:after{content:"";position:absolute;top:0;bottom:0;left:-250%;width:750%;background:linear-gradient(105deg,#0000 38%,#fff5 50%,#0000 62%) 0 0/calc(100% / 3) 100%;animation:arena-shine 2.6s ease-in-out infinite}.find-btn:not(:disabled):hover{filter:brightness(1.08);transform:translateY(-2px)}.find-btn span{display:flex;flex-direction:column;align-items:flex-start;text-align:left}.find-btn strong{font:700 20px/1.1 var(--serif);letter-spacing:.3px}.find-btn small{font-size:11px;font-weight:700;opacity:.75}.match-panel.searching{align-items:center;text-align:center;gap:8px;border-color:#f0a07a77;box-shadow:0 0 40px #f0a07a26,0 16px 40px #0009}.match-panel.searching h3{margin:6px 0 0;font:400 20px var(--serif);letter-spacing:0;text-transform:none;color:#fff6e6}.radar{position:relative;width:120px;height:120px;background:radial-gradient(circle,#f0a07a26,#0000 70%)}.radar,.radar i{border-radius:50%}.radar i{position:absolute;inset:0;border:2px solid #f0a07a;opacity:0;animation:radar 2.4s ease-out infinite}.radar i:nth-child(2){animation-delay:.8s}.radar i:nth-child(3){animation-delay:1.6s}.radar b{position:absolute;inset:30px;display:grid;place-items:center;border-radius:50%;background:radial-gradient(circle at 50% 30%,#7a3b33,#2a1218);border:1px solid var(--ember);color:#ffe2cf;box-shadow:0 0 24px #f0a07a66}@keyframes radar{0%{transform:scale(.35);opacity:.9}to{transform:scale(1.15);opacity:0}}.dots:after{content:"…";display:inline-block;width:1.2em;text-align:left;animation:soft-blink 1.2s infinite}.queue-meta{display:flex;gap:12px;align-items:center;font-size:12.5px;color:#d8d0c2}.queue-meta time{font:700 22px var(--serif);color:#fff;font-variant-numeric:tabular-nums}.queue-range{font-size:11.5px;color:#d9b9a8}.queue-cancel{margin-top:6px;width:100%}.challenge-panel{padding:14px}.challenge-panel,.challenge-panel ul{flex:1;min-height:0;display:flex;flex-direction:column}.challenge-panel ul{overflow-y:auto;margin:0;padding:0;list-style:none;gap:6px;scrollbar-width:thin}.challenge-panel li{display:flex;align-items:center;gap:10px;padding:7px 8px;border-radius:14px;background:#ffffff08}.challenge-who{flex:1;min-width:0;display:flex;flex-direction:column}.challenge-who strong{display:flex;align-items:center;gap:5px;font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.challenge-who strong svg{color:#9fd8f0}.challenge-who small{font-size:11px;color:#a59f94}.arena-picker .popup-card{width:min(640px,calc(100vw - 24px))}.picker-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(104px,1fr));gap:10px;max-height:min(56vh,520px);overflow-y:auto;padding:4px}.picker-hero{display:flex;flex-direction:column;align-items:center;gap:3px;padding:5px 5px 8px;border-radius:14px;background:#ffffff08;border:1px solid #ffffff14;transition:border-color .2s,transform .2s}.picker-hero:hover{border-color:var(--hero-color);transform:translateY(-2px)}.picker-hero.current{border-color:#e8cf9a;box-shadow:0 0 0 1px #e8cf9a,0 0 18px #e8cf9a44}.picker-hero.used{opacity:.72}.picker-art{position:relative;display:block;width:100%;aspect-ratio:1;border-radius:10px;overflow:hidden}.picker-art .hero-portrait{width:100%;height:100%;aspect-ratio:auto;object-fit:cover;object-position:50% 12%}.picker-art i{position:absolute;top:5px;right:5px;display:grid;place-items:center;min-width:20px;height:20px;padding:0 5px;border-radius:10px;background:#e8cf9a;color:#2b2521;font-size:11px;font-weight:800;font-style:normal}.picker-hero strong{font-size:13px;color:#fff}.picker-hero small{display:flex;align-items:center;gap:3px;font-size:10.5px;color:#b9b2a6}@media(max-width:1279px) and (min-width:800px){.arena-modes{left:20px;width:270px}.arena-side{right:20px;width:290px}.arena-lineup{left:304px;right:324px}.mode-text em{display:none}.squad-card{--w:clamp(84px,8.4vw,130px)}}@media(max-width:799px){.arena-screen.game-page{overflow-y:auto;overflow-x:hidden;height:100dvh;display:flex;flex-direction:column;gap:12px;padding:calc(var(--bar) + 4px) 12px calc(var(--nav) + 18px)}.arena-screen .screen-bar{position:fixed;background:linear-gradient(#0a0c14f0,#0a0c1400);padding-bottom:10px}.arena-backdrop{position:fixed}.arena-screen .arena-modes,.arena-screen .arena-side{position:static;width:auto;display:contents}.arena-modes>*,.arena-side>*{flex-shrink:0}.mode-cards{order:1;display:grid;grid-template-columns:1fr 1fr;gap:8px}.mode-card{grid-template-columns:auto minmax(0,1fr);gap:6px 9px;padding:10px}.mode-icon{width:36px;height:36px;border-radius:11px}.mode-rank{grid-column:1/-1;flex-direction:row;justify-content:flex-start;gap:6px;min-width:0}.mode-rank .tier-badge{width:26px;height:26px}.mode-record{display:none}.arena-lineup{order:2;position:relative;inset:auto;flex-shrink:0;height:auto;padding-top:0;justify-content:center;gap:10px}.arena-lineup>header{position:static}.match-panel{order:3}.challenge-panel{order:4;flex:none}.arena-history{order:5;flex:none}.arena-screen{--mode-grid:1}.mode-text em{display:none}.mode-text strong{font-size:17px}.duel-hero{height:auto;width:min(78vw,340px)}.squad-cards{gap:6px;padding-bottom:4px}.squad-card{--w:calc((100vw - 24px - 24px) / 5);padding:3px;border-radius:12px}.squad-card-row{top:5px;left:5px;font-size:9px;padding:0 5px}.squad-card-foot strong{font-size:11.5px}.squad-card-foot small{font-size:9.5px}.find-btn{height:60px}.arena-history ol,.challenge-panel ul{overflow:visible}}@media(prefers-reduced-motion:reduce){.arena-backdrop i,.duel-hero,.duel-ring,.find-btn:after,.mode-searching i:after,.others-searching i:after,.radar i,.squad-card{animation:none}}@keyframes arena-shine{0%{transform:translateX(-24%)}to{transform:translateX(24%)}}