.auth-page{--a-ink:#ece6d8;--a-mute:#a39fae;--a-gold:#dcc493;--a-gold-2:#bfa16b;--a-line:#ffffff17;--a-field:#0c0f17a6;--a-panel:#10131cb3;position:relative;height:100dvh;min-height:560px;overflow:hidden;display:grid;grid-template-columns:minmax(0,1fr) minmax(340px,400px);column-gap:clamp(16px,3vw,48px);padding:0 clamp(24px,5vw,88px) 0 0;background:#0a0c12;color:var(--a-ink);isolation:isolate}.auth-sr{width:1px;height:1px;clip:rect(0 0 0 0);white-space:nowrap}.auth-scene,.auth-sr{position:absolute;overflow:hidden}.auth-scene{inset:0;z-index:-2}.auth-scene img{width:100%;height:100%;object-fit:cover;object-position:46% 30%;filter:brightness(.52) saturate(.78) contrast(.96);transform-origin:40% 40%;animation:auth-drift 60s ease-in-out infinite alternate}.auth-scene:after{content:"";position:absolute;inset:0;background:radial-gradient(ellipse 40% 55% at 34% 46%,#e8c99a1f,transparent 70%),linear-gradient(90deg,#0a0c1270,transparent 28%,transparent 46%,#0a0c12b8 72%,#0a0c12e0),linear-gradient(180deg,#0a0c1299,transparent 22%,transparent 62%,#0a0c12f2)}.auth-stage{position:relative;min-width:0;height:100%;touch-action:pan-y;user-select:none;-webkit-user-select:none}.auth-hero{position:absolute;bottom:0;left:50%;height:94%;aspect-ratio:8/9;translate:-50% 0;transition:opacity .7s ease,transform .7s ease,visibility 0s}.auth-hero.kael{height:91%}.auth-hero:not(.on){opacity:0;visibility:hidden;transform:translateX(3%);pointer-events:none;transition:opacity .7s ease,transform .7s ease,visibility 0s .7s}.auth-hero .live-card{width:100%;height:100%;touch-action:pan-y;cursor:pointer}.auth-hero .live-card:focus-visible{outline:2px solid var(--a-gold);outline-offset:-6px;border-radius:8px}.auth-hero .hero-portrait{width:100%;height:100%}.auth-hero .live-card>:is(.hero-portrait,.live-canvas){-webkit-mask-image:linear-gradient(90deg,transparent,#000 9%,#000 84%,transparent);mask-image:linear-gradient(90deg,transparent,#000 9%,#000 84%,transparent)}.auth-hero.feather .live-card>:is(.hero-portrait,.live-canvas){-webkit-mask-image:linear-gradient(90deg,transparent,#000 15%,#000 82%,transparent);mask-image:linear-gradient(90deg,transparent,#000 15%,#000 82%,transparent)}.auth-hero .live-speech{top:12%;left:66%;right:-6%}.auth-hero .live-speech:after{left:-7px;right:auto;bottom:auto;top:50%;margin:-6px 0 0;transform:rotate(135deg)}.auth-shade{position:absolute;inset:auto 0 0;height:34%;pointer-events:none;background:linear-gradient(0deg,#0a0c12e6,transparent)}.auth-plate{position:absolute;z-index:2;left:clamp(24px,4vw,64px);bottom:clamp(24px,5vh,56px);text-shadow:0 2px 14px #000c;animation:auth-plate-in .5s ease-out}.auth-plate small{font-size:12px;letter-spacing:.6px;color:#cdbf9f}.auth-plate strong{display:block;margin:4px 0 2px;font:400 clamp(30px,3.2vw,42px)/1.1 var(--serif);color:#fbf5ea}.auth-plate strong em{margin-left:6px;font:normal 11px var(--sans);letter-spacing:3px;color:var(--a-gold);vertical-align:middle}.auth-plate>span{font:italic 14px var(--serif);color:#d5cec2}.auth-dots{display:flex;align-items:center;margin-top:10px}.auth-dots button{position:relative;width:16px;height:24px;padding:0}.auth-dots button:before{content:"";position:absolute;left:3px;right:3px;top:50%;height:3px;margin-top:-1.5px;border-radius:3px;background:#d8d2c84d;transition:background .3s}.auth-dots button.on{width:30px}.auth-dots button.on:before{background:var(--a-gold)}.auth-brand{position:absolute;z-index:3;top:clamp(18px,4vh,36px);left:clamp(24px,4vw,64px);display:flex;align-items:center;gap:10px;font:24px var(--serif);letter-spacing:3px;color:#eadbb9;text-shadow:0 2px 12px #000a;pointer-events:none}.auth-brand small{display:block;margin-top:4px;font:9px var(--sans);letter-spacing:3px;color:#b9b1a2}.auth-mark{font-size:40px;line-height:1;color:var(--a-gold)}.auth-lang{position:absolute;z-index:3;top:clamp(18px,4vh,36px);right:clamp(24px,5vw,88px);display:flex;padding:3px;border:1px solid var(--a-line);border-radius:999px;background:#0a0c1299;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}.auth-lang button{min-width:40px;height:26px;padding:0 10px;border-radius:999px;font-size:12px;color:var(--a-mute)}.auth-lang button[aria-pressed=true]{background:#ffffff1c;color:var(--a-ink)}.auth-side{position:relative;z-index:2;display:flex;align-items:center;min-width:0;padding:76px 0 32px}.auth-panel{width:100%;padding:28px 28px 24px;border:1px solid var(--a-line);border-radius:22px;background:linear-gradient(180deg,#151925b8,var(--a-panel));backdrop-filter:blur(18px) saturate(1.15);-webkit-backdrop-filter:blur(18px) saturate(1.15);box-shadow:0 24px 70px #0008,inset 0 1px #ffffff12;animation:auth-in .5s cubic-bezier(.2,.8,.2,1) both}.auth-back{display:inline-flex;align-items:center;gap:6px;margin:-6px 0 12px -6px;padding:6px 8px;border-radius:8px;font-size:13px;color:var(--a-mute)}.auth-back:hover{color:var(--a-ink);background:#ffffff0d}.auth-panel h1{margin:0;font:500 26px/1.3 var(--serif);color:#f3ead6;letter-spacing:.3px}.auth-sub{margin-top:4px;font-size:13px;color:var(--a-mute)}.auth-form{display:grid;gap:10px;margin-top:20px}.auth-input{display:flex;align-items:center;gap:10px;height:48px;padding:0 6px 0 14px;border:1px solid #ffffff14;border-radius:12px;background:var(--a-field);transition:border-color .18s,background .18s}.auth-input:focus-within{border-color:#dcc49366;background:#0c0f17d9}.auth-input>svg{color:#8f8b9b}.auth-input:focus-within>svg{color:var(--a-gold)}.auth-input input{flex:1;min-width:0;height:100%;border:0;outline:0;background:transparent;color:var(--a-ink);font:15px var(--sans)}.auth-input input::placeholder{color:#7f7b8a}.auth-input input:is(:autofill,:-webkit-autofill),.auth-input input:is(:autofill,:-webkit-autofill):is(:hover,:focus){-webkit-text-fill-color:var(--a-ink);caret-color:var(--a-ink);-webkit-box-shadow:inset 0 0 0 1000px transparent;box-shadow:inset 0 0 0 1000px transparent;transition:background-color 100000s 0s,color 100000s 0s;background-clip:text}.auth-input input::-ms-clear,.auth-input input::-ms-reveal{display:none}.auth-eye{display:grid;place-items:center;width:38px;height:38px;border-radius:9px;color:#8f8b9b}.auth-eye:hover{color:var(--a-ink);background:#ffffff0d}.auth-msg{padding:9px 12px;border-radius:10px;background:#ffffff0a;border:1px solid var(--a-line);font-size:12.5px;line-height:1.6;color:#d9d2c3}.auth-msg.error{background:#d0606014;border-color:#d0606040;color:#eeb0a8}.auth-cta{display:flex;align-items:center;justify-content:center;gap:10px;height:48px;margin-top:4px;border-radius:12px;background:linear-gradient(180deg,var(--a-gold),var(--a-gold-2));box-shadow:0 8px 24px #00000059,inset 0 1px #fff4d466;color:#231c12;font-size:15px;font-weight:600;letter-spacing:.2px}.auth-cta:not(:disabled):hover{filter:brightness(1.05)}.auth-links{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:14px;font-size:13px;color:var(--a-mute)}.auth-links button{color:var(--a-gold);font-weight:600}.auth-links button:hover{color:#f1dcae}.auth-links .auth-forgot{font-weight:400;color:var(--a-mute)}.auth-or{display:flex;align-items:center;gap:12px;margin:16px 0 12px;font-size:12px;color:#8b8796}.auth-or:after,.auth-or:before{content:"";flex:1;height:1px;background:var(--a-line)}.auth-alt{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.auth-alt button{position:relative;display:flex;align-items:center;justify-content:center;gap:8px;height:44px;padding:0 8px;border:1px solid #ffffff14;border-radius:12px;background:#ffffff08;color:var(--a-ink);font-size:13px;font-weight:500;white-space:nowrap}.auth-alt button:hover{background:#ffffff12;border-color:#ffffff24}.auth-alt button.soon span{opacity:.75}.auth-alt em{position:absolute;top:-7px;right:6px;padding:1px 6px;border-radius:999px;background:#272b38;border:1px solid var(--a-line);font:500 9px var(--sans);font-style:normal;color:var(--a-mute)}.auth-guest{border-color:#dcc49340!important}.auth-guest>svg{color:var(--a-gold)}@keyframes auth-in{0%{opacity:0;transform:translateY(12px)}}@keyframes auth-plate-in{0%{opacity:0;transform:translateY(8px)}}@keyframes auth-drift{to{transform:scale(1.06) translate(-1%,-1%)}}@media (max-width:1100px) and (min-width:761px){.auth-page{grid-template-columns:minmax(0,1fr) 340px;padding-right:24px}.auth-hero{height:86%}.auth-plate strong{font-size:28px}}@media (max-width:760px){.auth-page{display:flex;flex-direction:column;height:100dvh;min-height:0;padding:0;overflow-x:hidden;overflow-y:auto}.auth-scene img{object-position:42% 30%}.auth-scene:after{background:radial-gradient(ellipse 70% 40% at 50% 34%,#e8c99a1a,transparent 70%),linear-gradient(180deg,#0a0c12a6,transparent 18%,transparent 40%,#0a0c12e6 66%,#0a0c12)}.auth-stage{flex:1 1 auto;min-height:150px;height:auto}.auth-hero{bottom:-28px;height:calc(100% + 28px);max-width:none}.auth-hero.kael{height:calc(100% + 18px)}.auth-hero .live-speech{top:4%;left:18%;right:18%;padding:7px 10px;font-size:12px}.auth-hero .live-speech:after{left:50%;right:auto;top:auto;bottom:-7px;margin:0 0 0 -6px;transform:rotate(45deg)}.auth-shade{height:40%}.auth-plate{left:16px;bottom:10px}.auth-plate small,.auth-plate>span{display:none}.auth-plate strong{font-size:22px;margin:0}.auth-dots{margin-top:0}.auth-brand{top:calc(12px + env(safe-area-inset-top));left:16px;font-size:16px;letter-spacing:2px;gap:6px}.auth-brand small{font-size:7px;letter-spacing:2px;margin-top:2px}.auth-mark{font-size:26px}.auth-lang{top:calc(12px + env(safe-area-inset-top));right:12px}.auth-side{flex:0 0 auto;display:block;padding:0 10px calc(10px + env(safe-area-inset-bottom))}.auth-panel{padding:16px 16px 14px;border-radius:20px}.auth-panel h1{font-size:20px}.auth-sub{display:none}.auth-form{gap:8px;margin-top:12px}.auth-input{height:44px}.auth-input input{font-size:16px}.auth-cta{height:46px;margin-top:2px}.auth-links{margin-top:10px}.auth-or{margin:10px 0}.auth-alt button{height:42px;font-size:12.5px;gap:6px}}@media (max-width:760px) and (max-height:620px){.auth-or{display:none}.auth-alt{margin-top:10px}.auth-plate{display:none}}@media (prefers-reduced-motion:reduce){.auth-panel,.auth-plate,.auth-scene img{animation:none}.auth-hero,.auth-hero:not(.on){transform:none}}.skin-picker{position:absolute;left:10px;right:10px;bottom:40px;z-index:3;display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:6px;pointer-events:none}.skin-picker>svg{color:#f4e3b5;filter:drop-shadow(0 1px 2px #000c)}.skin-chip{pointer-events:auto;padding:5px 11px;border-radius:999px;border:1px solid #f4e3b555;background:#0d1018b8;color:#efe6d2;font-size:12px;font-weight:600;letter-spacing:.02em;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);cursor:pointer;transition:background .2s,border-color .2s,color .2s}.skin-chip:hover{border-color:#f4e3b5aa}.skin-chip.on{background:linear-gradient(180deg,#f6dd9a,#d6a94f);border-color:#fff3c9;color:#2a1d08;box-shadow:0 0 12px #f0c96a88}.skin-note{flex-basis:100%;text-align:center;font-size:11px;color:#f4e3b5;text-shadow:0 1px 3px #000}.hero-stage .skin-picker{top:14px;bottom:auto}.hero-stage .skin-chip{padding:7px 14px;font-size:13px}@media(max-width:799px){.hero-stage .skin-picker{top:auto;bottom:10px;left:auto;right:10px;flex-direction:column;align-items:flex-end}.hero-stage .skin-picker>svg{display:none}.hero-stage .skin-chip{padding:5px 11px;font-size:12px}.hero-stage .skin-note{max-width:150px;text-align:right}}.info-gear{margin-top:14px;padding:12px 12px 10px;border-radius:14px;border:1px solid #b9a7ff2e;background:linear-gradient(150deg,#b9a7ff12,#f0c25e0a 60%,transparent)}.gear-head{display:flex;align-items:baseline;justify-content:space-between;gap:10px;margin-bottom:10px}.gear-head small{font-size:11px;letter-spacing:1px;color:#c9bff2;font-weight:700}.gear-head em{font-style:normal;font-size:11.5px;color:#9a96a5;text-align:right}.gear-head .gear-note{display:inline-flex;align-items:center;gap:4px;color:#bfe9c9;animation:gear-note .3s ease-out both}.gear-slots{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.gear-slot{position:relative;display:flex;flex-direction:column;align-items:center;gap:3px;min-width:0;padding:8px 4px;border-radius:14px;background:#ffffff06;border:1px solid #ffffff14;transition:transform .15s,border-color .2s,background .2s}.gear-slot:hover{border-color:color-mix(in srgb,var(--item) 60%,transparent)}.gear-slot:active{transform:scale(.96)}.gear-slot small{font-size:10px;letter-spacing:.6px;color:#a9a5b2}.gear-slot b{max-width:100%;min-height:2.5em;overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;font-size:11px;font-weight:700;line-height:1.25;color:#e9e4ef;text-align:center;overflow-wrap:anywhere}.gear-socket{position:relative;width:62px;height:62px;display:grid;place-items:center;border-radius:50%;color:color-mix(in srgb,var(--item) 70%,#fff3);background:radial-gradient(circle at 50% 40%,color-mix(in srgb,var(--item) 16%,transparent),#0b0e16cc 70%);border:2px dashed color-mix(in srgb,var(--item) 45%,transparent)}.gear-glyph{width:30px;height:30px;opacity:.55}.gear-plus{position:absolute;right:-2px;bottom:-2px;width:22px;height:22px;padding:4px;border-radius:50%;color:#2b2521;background:linear-gradient(140deg,#f2deb1,#c8aa70);box-shadow:0 2px 8px #000a}.gear-slot.on{background:radial-gradient(ellipse at 50% 30%,color-mix(in srgb,var(--item) 22%,transparent),#ffffff05 75%);border-color:color-mix(in srgb,var(--item) 55%,transparent)}.gear-slot.on .gear-socket{border:2px solid color-mix(in srgb,var(--item) 75%,#fff);background:radial-gradient(circle at 50% 45%,color-mix(in srgb,var(--item) 40%,transparent),#0b0e16 72%);box-shadow:0 0 16px color-mix(in srgb,var(--item) 55%,transparent),inset 0 0 12px color-mix(in srgb,var(--item) 40%,transparent)}.gear-slot.on .gear-socket:after{content:"";position:absolute;inset:-5px;border-radius:50%;border:1px solid color-mix(in srgb,var(--item) 50%,transparent);animation:gear-halo 2.6s ease-in-out infinite}.gear-slot.epic .gear-socket:after{border-width:2px}.gear-socket img{width:54px;height:54px;object-fit:contain;filter:drop-shadow(0 2px 6px #000c)}.gear-bonus{display:flex;flex-wrap:wrap;justify-content:center;gap:6px;margin-top:10px}.gear-bonus span{display:inline-flex;align-items:center;gap:4px;padding:3px 9px;border-radius:999px;font-size:11.5px;font-weight:700;color:#fff6e4;background:color-mix(in srgb,var(--item) 22%,#0d1018);border:1px solid color-mix(in srgb,var(--item) 50%,transparent)}.gear-bonus svg{color:var(--item)}@keyframes gear-halo{50%{transform:scale(1.08);opacity:.35}}@keyframes gear-note{0%{opacity:0;transform:translateY(3px)}}@media(prefers-reduced-motion:reduce){.gear-slot.on .gear-socket:after{animation:none}}.gear-popup .popup-body{max-height:min(62dvh,560px);overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#ffffff1f transparent}.gear-current{display:grid;grid-template-columns:72px 1fr;gap:4px 12px;align-items:center;padding:12px;border-radius:16px;background:radial-gradient(ellipse at 15% 50%,color-mix(in srgb,var(--item) 26%,transparent),#ffffff05 70%);border:1px solid color-mix(in srgb,var(--item) 50%,transparent)}.gear-current img{width:72px;height:72px;object-fit:contain;filter:drop-shadow(0 0 10px color-mix(in srgb,var(--item) 60%,transparent))}.gear-current small{font-size:11px;letter-spacing:.8px;color:color-mix(in srgb,var(--item) 70%,#fff)}.gear-current strong{display:block;font:400 18px var(--serif);color:#fff8ee}.gear-current p{margin-top:2px;font-size:12.5px;line-height:1.5;color:#cfc9d6}.gear-current .secondary-btn{grid-column:1/-1;justify-content:center;margin-top:8px}.gear-list{display:flex;flex-direction:column;gap:10px;margin:12px 0 0;padding:0;list-style:none}.gear-row{display:grid;grid-template-columns:64px 1fr;gap:6px 12px;align-items:center;padding:10px 12px;border-radius:16px;background:#ffffff07;border:1px solid #ffffff14}.gear-row.epic{border-color:color-mix(in srgb,var(--item) 45%,transparent);background:radial-gradient(ellipse at 10% 50%,color-mix(in srgb,var(--item) 16%,transparent),#ffffff05 70%)}.gear-row.here{opacity:.75}.gear-art{width:64px;height:64px;display:grid;place-items:center;border-radius:14px;background:radial-gradient(circle,color-mix(in srgb,var(--item) 28%,transparent),transparent 70%)}.gear-art img{width:60px;height:60px;object-fit:contain;filter:drop-shadow(0 2px 6px #000c)}.gear-about{min-width:0}.gear-rarity{font-size:10.5px;letter-spacing:.8px;font-weight:700;color:color-mix(in srgb,var(--item) 75%,#fff)}.gear-about strong{display:block;margin-top:1px;font:400 17px var(--serif);color:#fff8ee}.gear-about p{margin-top:2px;font-size:12.5px;line-height:1.5;color:#d6d0dc}.gear-about small{display:block;margin-top:3px;font-size:11px;color:#9a96a5}.gear-acts{grid-column:1/-1;display:flex;flex-wrap:wrap;justify-content:flex-end;gap:6px}.gear-acts button{height:38px;min-width:120px;justify-content:center;border-radius:11px;font-size:13.5px}.gear-here{display:inline-flex;align-items:center;gap:5px;font-size:12.5px;color:#bfe9c9}.gear-empty{text-align:center}.gear-empty p{font-size:13.5px;line-height:1.7;color:#c9c4cf}.gear-empty .primary-btn{display:inline-flex;margin-top:14px}.gear-warn{margin-top:10px;text-align:center;font-size:12.5px;color:#f0a07a}@media(min-width:560px){.gear-row{grid-template-columns:64px 1fr auto}.gear-acts{grid-column:auto;flex-direction:column;align-items:stretch}}.heroes-sky{position:absolute;inset:0;z-index:-1;overflow:hidden}.heroes-sky:before{content:"";position:absolute;inset:-4%;background:url(/art/lobby/sanctuary-v2.webp) 50% 30%/cover no-repeat;filter:blur(7px) brightness(.42) saturate(.9)}.heroes-scene{position:absolute;inset:-1%;width:102%;height:102%;object-fit:cover;object-position:calc(50% - 20px) 62%;filter:blur(1.2px) brightness(.8) saturate(1.05);opacity:0}.heroes-scene.in{opacity:1;animation:scene-in .5s ease}.heroes-sky:after{content:"";position:absolute;inset:0;background:radial-gradient(ellipse 30% 46% at 50% 60%,color-mix(in srgb,var(--hero-color) 22%,transparent),transparent 72%),linear-gradient(0deg,#0a0d14eb 0,#0a0d1466 22%,transparent 40%),linear-gradient(180deg,#0a0d14b3 0,transparent 18%),linear-gradient(90deg,#0a0d14a6 0,transparent 26%,transparent 74%,#0a0d14a6 100%);transition:background .5s}.hero-panes,.stage-name{display:none}.hero-stage{position:absolute;z-index:1;top:var(--bar);bottom:0;left:340px;right:420px}.hero-floor{left:50%;bottom:7%;width:72%;height:90px;translate:-50% 0;background:radial-gradient(closest-side,color-mix(in srgb,var(--hero-color) 55%,transparent),transparent);filter:blur(6px);opacity:.75}.hero-floor,.hero-floor:after{position:absolute;border-radius:50%}.hero-floor:after{content:"";inset:22% 8%;border:1px solid #f3dca866;box-shadow:0 0 22px #f3dca833}.hero-figure{position:absolute;left:50%;bottom:0;translate:-50% 0;height:100%;aspect-ratio:8/9;cursor:pointer}.hero-figure .live-card.ready>.live-canvas,.hero-figure>.hero-portrait{animation:figure-in .5s ease-out both}.hero-figure .live-card:not(.ready)>.hero-portrait{animation:still-late .4s 1.2s backwards}.hero-figure.leaving{pointer-events:none;animation:figure-out .3s ease-in forwards}.hero-figure .live-speech{top:8%;left:62%;right:-6%}.hero-figure .live-speech:after{left:-7px;right:auto;bottom:auto;top:50%;margin:-6px 0 0;transform:rotate(135deg)}.hero-figure.locked{filter:grayscale(.85) brightness(.55)}.hero-figure .live-canvas,.hero-figure .live-card>.hero-portrait{-webkit-mask-image:linear-gradient(90deg,transparent,#000 11%,#000 89%,transparent),linear-gradient(180deg,transparent,#000 9%,#000 86%,transparent);-webkit-mask-composite:source-in;mask-image:linear-gradient(90deg,transparent,#000 11%,#000 89%,transparent),linear-gradient(180deg,transparent,#000 9%,#000 86%,transparent);mask-composite:intersect}.roster{position:absolute;z-index:3;left:28px;top:calc(var(--bar) + 10px);bottom:28px;width:300px;display:flex;flex-direction:column;padding:14px;border-radius:20px;box-shadow:0 16px 44px #0009;animation:hud-in-left .6s .05s both}.roster-filter{display:flex;gap:6px;margin-bottom:12px}.roster-filter button{flex:1;height:32px;border-radius:16px;border:1px solid #ffffff1a;font-size:12px;color:#cfc9d6}.roster-filter button.on{border-color:#e8cf9a;background:#e8cf9a1f;color:#f3dfb0}.roster-grid{flex:1;min-height:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-auto-rows:max-content;gap:8px;align-content:start;overflow-y:auto;overscroll-behavior:contain;padding:2px;scrollbar-width:thin;scrollbar-color:#ffffff1f transparent}.roster-cell{position:relative;min-width:0}.roster-card{position:relative;display:block;width:100%;aspect-ratio:4/5;overflow:hidden;border-radius:12px;background:#1b1e27;border:1.5px solid color-mix(in srgb,var(--hero-color) 55%,#ffffff22);text-align:left;transition:transform .2s,border-color .2s,box-shadow .2s}.roster-card:hover{transform:translateY(-2px);border-color:var(--hero-color)}.roster-card.on{border-color:#f3dca8;box-shadow:0 0 0 2px #e8cf9a80,0 0 18px #d3bb8566}.roster-art{position:absolute;inset:0}.roster-art .hero-portrait{display:block;width:100%;height:100%;object-fit:cover;object-position:50% 12%}.roster-card:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,#0b0e16f2,transparent 48%)}.roster-card.locked .roster-art{filter:grayscale(1) brightness(.45)}.roster-card>i{position:absolute;z-index:1;top:4px;left:6px;font:700 italic 11px var(--serif);color:#f1dba6;text-shadow:0 1px 4px #000}.roster-pick{position:absolute;z-index:2;top:2px;right:2px;width:28px;height:28px;place-items:center}.pick-badge,.roster-pick{display:grid;border-radius:50%}.pick-badge{width:20px;height:20px;place-items:center;background:#0b0e16cc;border:1px solid #e8cf9a99;color:#f3dca8;box-shadow:0 2px 6px #000a;transition:background .2s,color .2s,transform .2s}.pick-badge b{font-size:10.5px;font-weight:800}.roster-pick:hover .pick-badge{transform:scale(1.12)}.roster-pick.in .pick-badge,.roster-pick:hover .pick-badge{background:linear-gradient(140deg,#f2deb1,#c8aa70);color:#2b2521}.roster-pick.in .pick-badge{border-color:#f6e3b4}.roster-in{display:none}.roster-meta{position:absolute;z-index:1;left:6px;right:6px;bottom:5px}.roster-meta strong{display:block;font:400 13px var(--serif);color:#f6efe1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.roster-meta small{display:block;margin-top:1px;font-size:10.5px;font-weight:700;color:#d9cfbe}.hero-info{position:absolute;z-index:3;right:28px;top:calc(var(--bar) + 10px);width:380px;max-height:calc(100% - var(--bar) - 38px);overflow-y:auto;overscroll-behavior:contain;padding:22px;border-radius:20px;box-shadow:0 16px 44px #0009;animation:info-in .35s ease-out both;scrollbar-width:thin;scrollbar-color:#ffffff1f transparent}.info-rarity{font:700 italic 15px var(--serif);color:#f3cd6b;text-shadow:0 0 10px #f3cd6b66}.info-rarity em{font:normal 11px var(--sans);letter-spacing:3px;margin-left:6px}.info-head h2{margin-top:6px;font:400 42px/1.05 var(--serif);color:#fff8ee}.info-head h2 .ascend-stars{font-size:18px;vertical-align:middle}.info-head>p{margin-top:6px;font:italic 14px var(--serif);color:#d8cfbf}.info-tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:12px}.info-tags span{display:inline-flex;align-items:center;gap:5px;height:26px;padding:0 10px;border-radius:13px;background:#ffffff0f;border:1px solid #ffffff14;font-size:12px;color:#e2dcd2}.info-tags span:first-child svg{color:var(--hero-color)}.info-tags .tag-team{border-color:#e8cf9a66;color:#f0dcae;background:#e8cf9a14}.hero-info .stats-grid{margin-top:18px;gap:6px}.hero-info .stats-grid>div{background:#ffffff0a;border-radius:10px}.hero-info .stats-grid small{font-size:10px}.hero-info .stats-grid strong{font-size:14px}.hero-info .level-row{margin:12px 0 0;border-radius:12px;background:#ffffff0a}.hero-info .level-row .primary-btn{border-radius:10px}.info-locked{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-top:18px;padding:14px;border-radius:12px;background:#ffffff0a;color:#cfc8d6;font-size:13px}.info-locked .secondary-btn{width:100%}.info-skill{margin-top:14px;padding:14px 16px;border-radius:12px;border:1px solid #e8cf9a2e;background:linear-gradient(140deg,#e8cf9a12,transparent)}.info-skill small{font-size:11px;letter-spacing:1px;color:#a9a5b2}.info-skill strong{display:flex;align-items:center;gap:7px;margin-top:6px;font:400 17px var(--serif);color:#f0dcae}.info-skill p{margin-top:8px;font-size:12.5px;line-height:1.65;color:#c6c1cc}.info-actions{display:flex;flex-direction:column;gap:8px;margin-top:14px}.info-actions .secondary-btn{width:100%;border-radius:10px}.info-actions .showcase-note{margin:0;font-size:12px}.info-actions .text-btn{justify-content:center;font-size:12px}.team-dock{--slot:68px;--slot-h:var(--slot);position:absolute;z-index:3;left:356px;right:436px;bottom:24px;flex-direction:column;animation:hud-in-up .6s .1s both}.team-dock,.team-head{display:flex;align-items:center}.team-head{flex-wrap:wrap;justify-content:center;gap:4px 10px;padding:5px 14px;border-radius:14px;background:#0c0f17b3;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.team-head>span{font:400 17px var(--serif);color:#f3ead8}.team-head b{display:flex;font-size:12.5px;color:var(--gold)}.auto-team,.team-head b{align-items:center;gap:5px}.auto-team{display:inline-flex;height:28px;padding:0 11px;border-radius:14px;border:1px solid #e8cf9a8c;background:linear-gradient(140deg,#e8cf9a2e,#e8cf9a0d);font-size:12px;font-weight:700;color:#f3dca8;transition:background .2s,box-shadow .2s}.auto-team:hover:not(:disabled){background:linear-gradient(140deg,#e8cf9a4d,#e8cf9a1a);box-shadow:0 0 14px #ffd66b40}.auto-team:disabled{opacity:.6;cursor:default}.auto-team[aria-busy=true] svg{animation:auto-wave .4s ease-in-out infinite alternate}.team-slots{display:grid;grid-template-columns:repeat(2,var(--slot)) 1px repeat(3,var(--slot));grid-template-rows:auto auto;column-gap:10px;row-gap:7px;padding:8px 12px 10px;border-radius:20px;background:#0c0f17a6;border:1px solid #ffffff14;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);transition:border-color .25s,box-shadow .25s}.row-tag{grid-row:1;display:flex;align-items:center;gap:7px;font-size:10px;font-weight:800;letter-spacing:.12em;color:#e9d4a4;white-space:nowrap}.row-tag.front{grid-column:1/3}.row-tag.back{grid-column:4/7}.row-tag:after,.row-tag:before{content:"";flex:1;height:1px;background:linear-gradient(90deg,transparent,#e8cf9a59)}.row-tag:after{background:linear-gradient(90deg,#e8cf9a59,transparent)}.row-split{grid-column:3;grid-row:1/3;width:1px;background:linear-gradient(transparent,#e8cf9a73 30%,#e8cf9a73 70%,transparent)}.team-slot{grid-row:2;position:relative;width:var(--slot);text-align:center;touch-action:none;cursor:grab}.team-head{margin-bottom:8px}.team-note{display:flex;align-items:center;justify-content:center;gap:6px;min-height:18px;max-width:100%;margin:7px 0 0;padding:0 10px;font-size:11.5px;line-height:1.35;color:#d3ccc0;text-align:center;text-shadow:0 1px 4px #000,0 0 2px #000;animation:note-in .35s ease-out both}.team-note svg{flex-shrink:0}.team-note.warn{color:#ffd58a}.team-tips{display:flex;flex-wrap:wrap;justify-content:center;gap:5px}.team-tips>span{display:inline-flex;align-items:center;gap:4px;padding:3px 9px;border-radius:11px;background:#0c0f17b3;border:1px solid #ffffff17;font-size:11px;white-space:nowrap}.team-tips svg{color:#f3dca8}.team-dock.unsaved .team-slots{border-color:#ffd58a59}.team-slot.empty{cursor:pointer}.team-slot.empty .slot-art{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;background:#0c0f1780;border:1.5px dashed #e8cf9a66;color:#e8cf9aa6;box-shadow:none}.team-slot.empty .slot-art em{font-style:normal;font-size:10px;font-weight:700}.team-slot.empty .slot-num{background:#2a2d36;color:#e8cf9aa6}.team-slot.aimed .slot-art{border-style:solid;border-color:#f3dca8;color:#f6e3b4;animation:slot-aim 1s ease-in-out infinite alternate}.team-slot.over .slot-art{border-color:#f6e3b4;box-shadow:0 0 0 2px #f3dca8,0 0 22px #ffd66bb3;transform:scale(1.06)}.roster-art.lifted,.slot-art.lifted{opacity:.3}.slot-el{right:3px;bottom:3px;width:16px;height:16px;place-items:center;background:#0b0910cc;color:color-mix(in srgb,var(--hero-color) 60%,#fff)}.slot-el,.slot-out{position:absolute;display:grid;border-radius:50%}.slot-out{z-index:2;top:-5px;right:-5px;width:18px;height:18px;place-items:center;background:#1d1f27;border:1px solid #ffffff40;color:#f0e6d4;box-shadow:0 2px 6px #000b;transition:background .2s,border-color .2s}.team-slot:hover .slot-out{background:#b8463c;border-color:#ffb0a0}.slot-ghost{position:fixed;z-index:200;left:0;top:0;pointer-events:none;border-radius:16px;overflow:hidden;border:2px solid #f3dca8;background:#1b1e27;box-shadow:0 18px 36px #000c,0 0 24px #ffd66b80}.slot-ghost .hero-portrait{display:block;width:100%;height:100%;object-fit:cover;object-position:50% 10%}.slot-ghost .slot-el{display:none}.slot-art{position:relative;display:block;width:var(--slot);height:var(--slot-h);border-radius:16px;overflow:hidden;background:#1b1e27;border:1.5px solid color-mix(in srgb,var(--hero-color) 60%,#ffffff33);box-shadow:0 8px 20px #0009;transition:transform .2s,border-color .2s,box-shadow .2s,filter .2s}.slot-art .hero-portrait{display:block;width:100%;height:100%;object-fit:cover;object-position:50% 10%;transform:scale(1.3);transform-origin:50% 8%}.slot-num{position:absolute;z-index:2;top:-5px;left:-5px;width:19px;height:19px;display:grid;place-items:center;border-radius:50%;background:linear-gradient(140deg,#f2deb1,#c8aa70);color:#2b2521;font-size:10.5px;font-weight:800;box-shadow:0 2px 6px #000b}.team-slot small{display:block;margin-top:5px;font-size:11px;font-weight:700;color:#e4dccf}.slot-burst{position:absolute;z-index:7;left:0;top:0;width:var(--slot);height:var(--slot-h);border-radius:16px;opacity:0;pointer-events:none;box-shadow:0 0 0 2px #f6e3b4,0 0 26px 4px #ffd66bb3,inset 0 0 18px #ffe6a8aa}.team-slot:hover .slot-art{transform:translateY(-2px)}.team-slot:focus-visible{outline:none}.team-slot:focus-visible .slot-art{outline:2px solid var(--gold);outline-offset:3px}.team-slot.viewing .slot-art{border-color:var(--hero-color);box-shadow:0 0 0 2px color-mix(in srgb,var(--hero-color) 60%,transparent),0 8px 20px #0009}@keyframes figure-in{0%{opacity:0;transform:translateX(18px)}}@keyframes figure-out{to{opacity:0;transform:translateX(-12px)}}@keyframes still-late{0%{opacity:0}}@keyframes scene-in{0%{opacity:0}}@keyframes info-in{0%{opacity:0;transform:translateX(16px)}}@keyframes slot-aim{to{box-shadow:0 0 0 3px #f3dca8,0 0 22px #ffd66bb3}}@keyframes note-in{0%{opacity:0;transform:translateY(4px)}}@media(prefers-reduced-motion:reduce){.team-slot.aimed .slot-art{animation:none}}@keyframes auto-wave{0%{transform:rotate(-14deg)}to{transform:rotate(14deg)}}@media(max-height:820px) and (min-width:800px){.hero-info{padding:18px}.info-head h2{font-size:34px}.info-skill p{display:none}}@media(max-width:1099px){.hero-stage{left:250px;right:340px}.roster{width:220px;bottom:calc(var(--nav) + 16px)}.roster-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.hero-info{width:316px;right:20px;max-height:calc(100% - var(--bar) - var(--nav) - 26px)}.info-head h2{font-size:32px}.team-dock{left:250px;right:340px;bottom:calc(var(--nav) + 14px);--slot:50px}.team-slots{column-gap:6px;padding:7px 9px 9px}.slot-art,.slot-burst{border-radius:13px}}@media(max-width:799px){.heroes-page{display:flex;flex-direction:column;overflow-y:auto;overscroll-behavior:contain;padding:var(--bar) 0 calc(var(--nav) + 18px)}.heroes-sky{position:fixed}.hero-stage{position:relative;inset:auto;order:1;flex-shrink:0;height:50svh;min-height:300px}.hero-figure .live-speech{top:2%;left:24%;right:6%;padding:7px 10px;font-size:12px}.hero-figure .live-speech:after{left:50%;right:auto;top:auto;bottom:-7px;margin:0 0 0 -6px;transform:rotate(45deg)}.roster{position:relative;inset:auto;order:2;width:auto;margin:0 12px;padding:10px;border-radius:16px;flex-shrink:0}.roster-filter{margin-bottom:8px}.roster-grid{display:flex;overflow-x:auto;overflow-y:hidden;gap:7px;scrollbar-width:none}.roster-grid::-webkit-scrollbar{display:none}.roster-cell{flex:0 0 74px}.pane-grow .roster-pick{pointer-events:none}.pane-grow .roster-pick:not(.in){display:none}.team-dock{position:relative;inset:auto;order:3;margin:14px 12px 0;flex-shrink:0;--slot:min(60px,15.5vw);--slot-h:calc(var(--slot) * 1.25)}.team-slots{width:100%;justify-content:space-between;column-gap:4px;padding:7px 8px 9px}.hero-info{position:relative;inset:auto;order:4;width:auto;max-height:none;overflow:visible;margin:14px 12px 0;padding:18px;flex-shrink:0}.info-head h2{font-size:32px}.hero-panes{order:2;display:flex;gap:4px;margin:10px 12px 0;padding:4px;flex-shrink:0;border-radius:16px;background:#0c0f17b8;border:1px solid #ffffff14;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.hero-panes button{flex:1;height:40px;display:flex;align-items:center;justify-content:center;gap:6px;border-radius:12px;font-size:14px;font-weight:600;color:#cfc9d6;transition:background .2s,color .2s}.hero-panes button.on{background:linear-gradient(140deg,#f2deb1,#c8aa70);color:#2b2521;box-shadow:0 4px 14px #0008}.hero-stage{height:clamp(170px,calc(100svh - 500px),40svh);min-height:0;transition:height .3s ease}.roster{order:3;margin-top:10px}.pane-grow .team-dock,.pane-team .hero-info{display:none}.pane-team .hero-stage{height:24svh;min-height:180px}.pane-team .team-dock{order:3;margin-top:10px}.pane-team .roster{order:4;margin-top:12px}.pane-team .roster-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));overflow:visible}.pane-team .roster-pick{inset:0;width:auto;height:auto;place-items:start end;padding:4px;border-radius:12px}.pane-team .roster-card.deployed .roster-art{filter:brightness(.42) saturate(.6)}.pane-team .roster-card.deployed{border-color:#e8cf9a}.pane-team .roster-in{position:absolute;z-index:1;inset:0 0 22% 0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;font-size:11px;font-weight:800;color:#f3dca8;text-shadow:0 1px 4px #000}.pane-team .roster-in svg{width:24px;height:24px;padding:4px;border-radius:50%;background:linear-gradient(140deg,#f2deb1,#c8aa70);color:#2b2521;box-shadow:0 2px 10px #000a}.stage-name{display:flex;flex-direction:column;position:absolute;z-index:2;left:16px;bottom:10px;max-width:60%;pointer-events:none;text-shadow:0 2px 10px #000,0 0 3px #000;animation:info-in .35s ease-out both}.stage-name .info-rarity{font-size:13px}.stage-name strong{font:400 30px/1.05 var(--serif);color:#fff8ee}.stage-name strong .ascend-stars{font-size:15px;vertical-align:middle}.stage-name small{margin-top:3px;font:italic 13px var(--serif);color:#e2d9c8}.info-head .info-rarity,.info-head h2,.info-head>p{display:none}.info-tags{margin-top:0}.hero-info{display:flex;flex-direction:column;margin-top:12px;padding:12px}.hero-info .level-row{order:-2;position:sticky;z-index:4;bottom:calc(var(--nav) + 10px);gap:10px;margin:0;padding:10px 12px;border:1px solid #e8cf9a40;background:#141822f2;box-shadow:0 -6px 22px #0009;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.hero-info>.muted{order:-2}.hero-info .stats-grid{order:-1;margin:12px 0}.hero-info .level-row .primary-btn{min-width:0;height:44px}.hero-info .level-row strong{margin-top:2px}.hero-info .level-gold{padding-top:8px}.info-locked{margin-top:0;margin-bottom:12px;order:-2}.roster-filter button{height:30px}}@media(max-width:520px){.heroes-page .screen-res .res-pill:nth-last-child(2){display:flex}.heroes-page .screen-res .res-pill:nth-last-child(3){display:none}}.skill-layer{position:absolute;inset:0;z-index:1;pointer-events:none;overflow:hidden;--d:var(--cutin-duration,2s)}.skill-layer.paused,.skill-layer.paused *{animation-play-state:paused!important}.cast-glow{position:absolute;inset:0;background:radial-gradient(ellipse 55% 95% at 0 45%,color-mix(in srgb,var(--hero-color) 38%,transparent),transparent 70%);mix-blend-mode:screen;animation:cast-glow var(--d) ease-out both}.skill-cutins{position:absolute;left:0;right:0;top:58px;display:grid;grid-template-columns:1fr 1fr;grid-auto-flow:row dense;align-items:start;row-gap:10px}.skill-cutin{position:relative;grid-column:1;justify-self:start;width:min(360px,calc(100% - 16px));height:92px;margin-top:22px;animation:cutin-life var(--d) cubic-bezier(.2,.8,.25,1) both}.cutin-band{position:absolute;inset:0;overflow:hidden;clip-path:polygon(0 0,100% 0,86% 100%,0 100%);background:linear-gradient(90deg,color-mix(in srgb,var(--hero-color) 62%,#0c1017) 0,color-mix(in srgb,var(--hero-color) 30%,#0c1017e6) 55%,#0c101700 100%)}.cutin-band:after,.cutin-band:before{content:"";position:absolute;left:0;right:12%;height:2px;background:linear-gradient(90deg,#f3e2b8,color-mix(in srgb,var(--hero-color) 80%,#fff) 60%,transparent)}.cutin-band:before{top:0}.cutin-band:after{bottom:0}.cutin-lines{position:absolute;inset:0;opacity:.35;background:repeating-linear-gradient(180deg,transparent 0 7px,#ffffff30 7px 8px,transparent 8px 15px,#ffffff14 15px 16px);background-size:220px 100%;-webkit-mask:linear-gradient(90deg,transparent,#000 40%,transparent);mask:linear-gradient(90deg,transparent,#000 40%,transparent)}.cutin-shine{position:absolute;top:0;bottom:0;width:70px;left:-90px;background:linear-gradient(100deg,transparent,#fff8 50%,transparent);transform:skewX(-20deg);animation:cutin-shine .55s ease-out .18s both}.cutin-portrait{position:absolute;left:14px;bottom:0;width:108px;height:118px;filter:drop-shadow(0 0 10px color-mix(in srgb,var(--hero-color) 75%,transparent)) drop-shadow(0 4px 8px #000a)}.cutin-frame{width:100%;height:100%;overflow:hidden;clip-path:polygon(16% 0,100% 0,84% 100%,0 100%);background:#0c1017;border-bottom:2px solid var(--hero-color)}.cutin-frame .hero-portrait{width:100%;height:100%;aspect-ratio:auto;object-fit:cover;transform-origin:50% 24%;animation:cutin-zoom var(--d) ease-out both}.cutin-text{position:absolute;left:132px;right:48px;top:15px;white-space:nowrap;animation:cutin-text var(--d) ease-out both}.cutin-text small{display:block;font-size:8px;letter-spacing:2px;color:#f1e4c4;text-shadow:0 1px 4px #000}.cutin-text strong{display:block;font:400 22px/1.15 var(--serif);color:#fffaf0;margin-top:6px;text-shadow:0 0 14px var(--hero-color),0 2px 6px #000;overflow:hidden;text-overflow:ellipsis}.cutin-text span{display:block;font-size:11px;font-weight:600;color:#fff;margin-top:6px;text-shadow:0 1px 4px #000}.cutin-text em{font:italic 400 10px var(--serif);color:#e6dccb;margin-left:7px}@keyframes cutin-life{0%{transform:translateX(-105%);opacity:0}11%{transform:translateX(4%);opacity:1}17%{transform:translateX(0)}84%{transform:translateX(0);opacity:1}to{transform:translateX(-24%);opacity:0}}@keyframes cutin-text{0%,9%{transform:translateX(-18px);opacity:0}22%{transform:translateX(0);opacity:1}}@keyframes cutin-zoom{0%{transform:scale(1.95)}to{transform:scale(1.6)}}@keyframes cutin-shine{to{left:110%}}.cast-glow.enemy{background:radial-gradient(ellipse 55% 95% at 100% 45%,color-mix(in srgb,var(--hero-color) 30%,transparent),transparent 70%)}.skill-cutin.enemy{grid-column:2;justify-self:end;animation-name:cutin-life-enemy}.enemy .cutin-band{clip-path:polygon(0 0,100% 0,100% 100%,14% 100%);background:linear-gradient(270deg,color-mix(in srgb,var(--hero-color) 46%,#2a0d12) 0,color-mix(in srgb,var(--hero-color) 22%,#1a0b10e6) 55%,#1a0b1000 100%)}.enemy .cutin-band:after,.enemy .cutin-band:before{left:12%;right:0;background:linear-gradient(270deg,#ff8f7a,color-mix(in srgb,var(--hero-color) 70%,#ff6a5a) 60%,transparent)}.enemy.boss .cutin-band{background:linear-gradient(270deg,color-mix(in srgb,var(--hero-color) 30%,#5a0d18) 0,#3a0a14e6 55%,#1a0b1000 100%)}.enemy .cutin-lines{-webkit-mask:linear-gradient(270deg,transparent,#000 40%,transparent);mask:linear-gradient(270deg,transparent,#000 40%,transparent)}.enemy .cutin-shine{left:auto;right:-90px;transform:skewX(20deg);animation-name:cutin-shine-enemy}.enemy .cutin-portrait{left:auto;right:14px;filter:drop-shadow(0 0 10px color-mix(in srgb,var(--hero-color) 60%,#ff3b3b)) drop-shadow(0 4px 8px #000a)}.enemy .cutin-frame{clip-path:polygon(0 0,84% 0,100% 100%,16% 100%);background:radial-gradient(circle at 50% 40%,color-mix(in srgb,var(--hero-color) 40%,#1a0b10),#12080c);border-bottom-color:#ff6a5a}.monster-portrait{display:block;width:100%;height:100%;object-fit:cover;object-position:50% 8%;transform-origin:50% 22%;animation:cutin-zoom-monster var(--d) ease-out both}.enemy .cutin-text{left:48px;right:132px;text-align:right;animation-name:cutin-text-enemy}.enemy .cutin-text small{color:#ffc2b4}.enemy .cutin-text strong{text-shadow:0 0 14px color-mix(in srgb,var(--hero-color) 60%,#ff4a3a),0 2px 6px #000}@keyframes cutin-life-enemy{0%{transform:translateX(105%);opacity:0}11%{transform:translateX(-4%);opacity:1}17%{transform:translateX(0)}84%{transform:translateX(0);opacity:1}to{transform:translateX(24%);opacity:0}}@keyframes cutin-text-enemy{0%,9%{transform:translateX(18px);opacity:0}22%{transform:translateX(0);opacity:1}}@keyframes cutin-zoom-monster{0%{transform:scale(1.45)}to{transform:scale(1.2)}}@keyframes cutin-shine-enemy{to{right:110%}}@keyframes cast-glow{0%{opacity:0}12%{opacity:1}to{opacity:0}}.party-row{position:relative}.party-row.casting{background:linear-gradient(90deg,color-mix(in srgb,var(--hero-color) 22%,transparent),transparent 85%)}.party-row.casting:before{content:"";position:absolute;left:-16px;top:9px;bottom:9px;width:3px;border-radius:2px;background:var(--hero-color);box-shadow:0 0 10px var(--hero-color)}.party-row.casting .party-avatar{position:relative;border-color:var(--hero-color);animation:avatar-cast .45s ease-in-out infinite alternate}.party-row.casting .party-avatar:after{content:"SKILL";position:absolute;left:0;right:0;bottom:0;padding:2px 0 1px;text-align:center;font-size:6px;font-weight:700;letter-spacing:1px;color:#1b1820;background:var(--hero-color)}.party-row.casting strong{color:#fff}@keyframes avatar-cast{0%{box-shadow:0 0 2px color-mix(in srgb,var(--hero-color) 50%,transparent)}to{box-shadow:0 0 14px 2px color-mix(in srgb,var(--hero-color) 85%,transparent)}}@media(max-width:1250px) and (min-width:800px){.party-row.casting:before{left:-12px}}@media(max-width:799px){.skill-cutins{top:40px;row-gap:6px;grid-template-columns:1fr}.skill-cutin.enemy{grid-column:1}.skill-cutin{width:245px;height:64px;margin-top:16px}.cutin-portrait{left:8px;width:74px;height:80px}.cutin-text{left:90px;right:28px;top:9px}.enemy .cutin-portrait{left:auto;right:8px}.enemy .cutin-text{left:28px;right:90px}.cutin-text small{font-size:6px;letter-spacing:1.4px}.cutin-text strong{font-size:15px;margin-top:4px}.cutin-text span{font-size:9px;margin-top:4px}.cutin-text em{display:none}.party-row.casting{border-color:var(--hero-color);box-shadow:0 0 12px color-mix(in srgb,var(--hero-color) 55%,transparent)}.party-row.casting:before{display:none}}@media(prefers-reduced-motion:reduce){.skill-cutin{animation:cutin-fade var(--d) linear both!important}.cast-glow{display:none}}@keyframes cutin-fade{0%,to{opacity:0}8%,88%{opacity:1}}@media(max-width:799px){.skill-cutin:nth-last-child(n+3){position:absolute;visibility:hidden}}.training-page{position:fixed;z-index:60;inset:0;display:flex;flex-direction:column;color:#f3ecdf;background:#0c0f17 var(--art) center/cover no-repeat;isolation:isolate;animation:training-in .35s ease-out both}.training-page:before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,#0a0d15e6,#0a0d1599 32%,#0a0d15cc 70%,#0a0d15f5)}@keyframes training-in{0%{opacity:0;transform:scale(1.02)}}.training-bar{gap:14px;padding:calc(16px + env(safe-area-inset-top)) 24px 8px}.training-bar,.training-bar h1{display:flex;align-items:center}.training-bar h1{gap:8px;margin:0;font-size:24px;letter-spacing:.5px;color:#f1d9a2;text-shadow:0 2px 12px #000}.training-bar p{margin:3px 0 0;max-width:640px;font-size:13px;line-height:1.45;color:#d8cfbe}.training-body{flex:1;min-height:0;display:grid;grid-template-columns:minmax(220px,300px) 1fr;gap:20px;padding:8px 24px 0}.training-foe{position:relative;display:flex;flex-direction:column;justify-content:flex-end;min-height:0;border-radius:20px;border:1px solid #8fd3ff40;background:radial-gradient(circle at 50% 42%,#8fd3ff33,#0a0d1500 62%),linear-gradient(180deg,#121a2a99,#0a0d15d9);box-shadow:0 18px 44px #000a,inset 0 1px 0 #ffffff1f;overflow:hidden}.training-foe-art{position:absolute;inset:6% 6% 26%;display:grid;place-items:end center}.training-foe-art img{max-width:100%;max-height:100%;object-fit:contain;filter:drop-shadow(0 14px 18px #000c);animation:golem-bob 3.2s ease-in-out infinite}@keyframes golem-bob{50%{transform:translateY(-6px)}}.training-foe-text{position:relative;display:flex;flex-direction:column;gap:3px;padding:16px 18px 18px;background:linear-gradient(0deg,#0a0d15f2,#0a0d1500)}.training-foe-text small{display:flex;align-items:center;gap:5px;font-size:11px;letter-spacing:1px;text-transform:uppercase;color:#8fd3ff}.training-foe-text strong{font-size:21px;color:#fff}.training-foe-text span{font-size:12.5px;color:#cfc6b4}.training-pick{display:flex;flex-direction:column;min-height:0}.training-pick-head{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-bottom:10px}.training-pick-head h2{margin:0;font-size:16px;color:#f1d9a2}.training-pick-head>span{font-size:12.5px;color:#cfc6b4;margin-right:auto;font-variant-numeric:tabular-nums}.training-chip{display:inline-flex;align-items:center;gap:5px;padding:6px 12px;border-radius:999px;border:1px solid #e8cf9a59;background:#141824cc;color:#f1e3c4;font-size:12px}.training-chip:disabled{opacity:.45}.training-grid{flex:1;min-height:0;overflow:auto;display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px;padding:2px 2px 12px;align-content:start}.training-hero{position:relative;padding:3px;border-radius:14px;text-align:left;color:#fff;background:linear-gradient(170deg,color-mix(in srgb,var(--hero-color) 45%,#3a3428),#1a1620 70%);border:1px solid #ffffff1f;box-shadow:0 8px 18px #0008;transition:transform .2s,box-shadow .2s,filter .2s}.training-hero:hover{transform:translateY(-3px)}.training-hero.on{background:linear-gradient(170deg,color-mix(in srgb,var(--hero-color) 70%,#f3dca4),#4a3f2c 55%,#1a1620);box-shadow:0 0 0 2px #f1d9a2,0 10px 26px color-mix(in srgb,var(--hero-color) 45%,#0000)}.training-hero-art{display:block;aspect-ratio:4/5;border-radius:11px 11px 5px 5px;overflow:hidden;background:radial-gradient(circle at 50% 30%,color-mix(in srgb,var(--hero-color) 50%,#1c1430),#0d0a14)}.training-hero-art .hero-portrait{width:100%;height:100%;object-fit:cover;object-position:50% 14%;display:block}.training-hero-el{top:8px;right:8px;place-items:center;width:20px;height:20px;background:#0b0910cc;color:color-mix(in srgb,var(--hero-color) 60%,#fff)}.training-hero-el,.training-hero-no{position:absolute;display:grid;border-radius:50%}.training-hero-no{top:7px;left:7px;place-items:center;width:24px;height:24px;background:#f1d9a2;color:#2a1f0c;font-size:13px;font-weight:800;box-shadow:0 2px 8px #000a}.training-hero-trial{position:absolute;top:8px;left:8px;padding:1px 7px;border-radius:7px;background:#8fd3ffd9;color:#06202e;font-size:10px;font-style:normal;font-weight:700}.training-hero-foot{display:flex;flex-direction:column;padding:5px 5px 4px}.training-hero-foot strong{font-size:12.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.training-hero-foot small{font-size:10.5px;color:#cfc6b4}.training-foot{display:flex;align-items:center;gap:16px;padding:12px 24px calc(14px + env(safe-area-inset-bottom));background:linear-gradient(0deg,#0a0d15,#0a0d15d9);border-top:1px solid #e8cf9a26}.training-slots{display:flex;gap:8px;margin-right:auto}.training-slots span{display:grid;place-items:center;width:46px;height:46px;border-radius:12px;overflow:hidden;border:1px dashed #e8cf9a59;color:#e8cf9a80;font-size:13px;font-weight:700}.training-slots span.filled{border:1px solid color-mix(in srgb,var(--hero-color) 70%,#fff);box-shadow:0 0 12px color-mix(in srgb,var(--hero-color) 40%,#0000)}.training-slots .hero-portrait{width:100%;height:100%;object-fit:cover;object-position:50% 14%}.training-go{min-width:180px;display:inline-flex;align-items:center;justify-content:center;gap:8px}.training-go:disabled{opacity:.5;filter:grayscale(.6)}.rail-training .rail-icon{color:#8fd3ff}.training-meter{position:absolute;z-index:4;top:calc(86px + env(safe-area-inset-top));right:14px;width:236px;padding:6px;border-radius:14px;background:#0b0e16c7;border:1px solid #ffffff1f;box-shadow:0 12px 30px #0009;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}.training-meter:not(.open){width:auto;border-radius:18px}.training-meter.open{padding:6px 12px 10px}.training-meter-head{display:flex;align-items:center;gap:6px}.training-meter.open .training-meter-head{margin:0 -6px 2px}.training-meter-toggle{flex:1;min-width:0;display:flex;align-items:center;gap:6px;height:28px;padding:0 8px;border-radius:14px;font-size:12px;white-space:nowrap;color:#f1d9a2}.training-meter-toggle:hover{background:#ffffff0f}.training-meter-toggle strong{letter-spacing:.5px}.training-meter-toggle span{margin-right:auto;color:#f3ecdf;font-variant-numeric:tabular-nums}.training-meter-chev{flex-shrink:0;color:#cfc6b4;transition:rotate .25s}.training-meter.open .training-meter-chev{rotate:180deg}.training-meter-reset{flex-shrink:0;display:grid;place-items:center;width:26px;height:26px;border-radius:50%;background:#ffffff14;color:#f1e3c4}.training-meter-total{margin:0 0 4px;font-size:10.5px;color:#a9a191;font-variant-numeric:tabular-nums}.training-meter-row{display:grid;grid-template-columns:30px 1fr;gap:8px;align-items:center;padding:4px 0}.training-meter-face{width:30px;height:30px;border-radius:8px;overflow:hidden;border:1px solid color-mix(in srgb,var(--hero-color) 60%,#fff3)}.training-meter-face .hero-portrait{width:100%;height:100%;object-fit:cover;object-position:50% 14%}.training-meter-name{display:flex;justify-content:space-between;gap:6px;font-size:11.5px}.training-meter-name b{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.training-meter-name em{font-style:normal;color:#f1d9a2;font-variant-numeric:tabular-nums;white-space:nowrap}.training-meter-bar{position:relative;display:block;height:5px;margin:3px 0 2px;border-radius:3px;background:#ffffff14;overflow:hidden}.training-meter-bar b{position:absolute;inset:0 auto 0 0;background:linear-gradient(90deg,color-mix(in srgb,var(--hero-color) 70%,#fff),var(--hero-color));transition:width .3s}.training-meter-bar s{position:absolute;top:0;bottom:0;right:0;background:#7dff9a99;transition:width .3s}.training-meter-row small{font-size:10px;color:#a9a191;font-variant-numeric:tabular-nums}.training-golem-hp{height:4px;margin-top:6px;border-radius:2px;background:#ffffff14;overflow:hidden}.training-golem-hp i{display:block;height:100%;background:linear-gradient(90deg,#8fd3ff,#e6f6ff);transition:width .25s}.training-spar .skill-layer{z-index:5}.training-hint{position:absolute;z-index:3;left:0;right:0;bottom:calc(var(--card-w,96px) * 1.25 + 70px);display:flex;justify-content:center;align-items:center;gap:6px;margin:0;font-size:12px;color:#f1e3c4;text-shadow:0 1px 4px #000;pointer-events:none;animation:hint-pulse 2.4s ease-in-out infinite}@keyframes hint-pulse{50%{opacity:.55}}.training-card{cursor:pointer}.training-card:active{transform:translateY(-2px) scale(.97)}.training-card-cast{position:absolute;z-index:1;top:calc(var(--card-w,96px) * 1.25 - 26px);left:50%;translate:-50% 0;display:grid;place-items:center;width:22px;height:22px;border-radius:50%;background:#0b0910d9;border:1px solid color-mix(in srgb,var(--hero-color) 70%,#fff);color:#f1d9a2}.training-card.ready .training-card-cast{background:#f1d9a2;color:#2a1f0c}@media(max-width:799px){.training-bar{padding:calc(12px + env(safe-area-inset-top)) 14px 6px}.training-bar h1{font-size:20px}.training-bar p{font-size:12px}.training-page{background-image:var(--art-tall)}.training-body{grid-template-columns:1fr;grid-template-rows:auto 1fr;gap:10px;padding:6px 14px 0}.training-foe{flex-direction:row;align-items:center;min-height:0;height:112px}.training-foe-art{position:relative;inset:auto;width:112px;height:104px;flex:none}.training-foe-text{background:none;padding:10px 14px 10px 4px}.training-foe-text strong{font-size:17px}.training-grid{grid-template-columns:repeat(auto-fill,minmax(88px,1fr));gap:8px}.training-foot{gap:10px;padding:10px 14px calc(12px + env(safe-area-inset-bottom))}.training-slots{gap:5px}.training-slots span{width:38px;height:38px;border-radius:10px}.training-go{min-width:0;flex:1}.training-meter{top:calc(64px + env(safe-area-inset-top));left:8px;right:auto;width:auto;max-width:calc(100% - 16px)}.training-meter.open{width:150px;padding:4px 8px 7px}.training-meter-toggle{height:26px;padding:0 6px;font-size:11px;gap:5px}.training-meter-row small,.training-meter-total{display:none}.training-meter-row{grid-template-columns:20px 1fr;gap:6px;padding:2px 0}.training-meter-face{width:20px;height:20px;border-radius:6px}.training-meter-name{font-size:10.5px}.training-meter-bar{height:3px;margin:2px 0 0}.training-golem-hp{margin-top:4px;height:3px}.training-hint{font-size:11px}}.hero-pagination{display:flex;align-items:center;gap:0}.hero-pagination button{position:relative;width:16px;height:24px;padding:0}.hero-pagination button:before{content:"";position:absolute;left:3px;right:3px;top:50%;height:3px;margin-top:-1.5px;border-radius:3px;background:#ccc7bf66;transition:background .3s}.hero-pagination button.on{width:30px}.hero-pagination button.on:before{background:#e5cd9e}.hero-pagination button:hover:before{background:#e5cd9ecc}.hero-pagination span{font-size:10px;margin-left:6px;color:#c1b9b6;letter-spacing:1px}@media(prefers-reduced-motion:reduce){.cover-plate{animation:none}}.lobby-profile,.menu-map{background:var(--glass);border:1px solid var(--edge);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.lobby-stage{position:absolute;inset:0;z-index:0;touch-action:pan-y;user-select:none;-webkit-user-select:none}.lobby-stage .keyart{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 28%;transform-origin:55% 40%;animation:keyart-drift 50s ease-in-out infinite alternate;will-change:transform}.stage-glow{background:radial-gradient(ellipse 34% 50% at 54% 42%,#ffe2ad26,transparent 72%)}.stage-glow,.stage-motes{position:absolute;inset:0;pointer-events:none}.stage-motes{z-index:1}.stage-motes i{position:absolute;border-radius:50%;background:#fff1cc;box-shadow:0 0 8px 2px #ffd88a8c;opacity:0;animation:mote-rise linear infinite}.lobby-companion{position:absolute;z-index:1;bottom:0;left:53%;translate:-50% 0;height:97%;aspect-ratio:8/9;cursor:pointer}.lobby-companion.kael-cover{height:94%}.lobby-companion .live-card{touch-action:pan-y}.lobby-companion.feather .live-card>:is(.hero-portrait,.live-canvas){-webkit-mask-image:linear-gradient(90deg,transparent,#000 15%,#000 85%,transparent);mask-image:linear-gradient(90deg,transparent,#000 15%,#000 85%,transparent)}.lobby-companion.skinned .live-card>:is(.hero-portrait,.live-canvas){-webkit-mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent),linear-gradient(180deg,transparent,#000 7%);-webkit-mask-composite:source-in;mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent),linear-gradient(180deg,transparent,#000 7%);mask-composite:intersect}.lobby-companion .live-card:focus-visible{outline:2px solid var(--gold);outline-offset:-6px;border-radius:8px}.lobby-companion{transition:opacity .6s ease,transform .6s ease,visibility 0s}.lobby-companion:not(.active){opacity:0;visibility:hidden;transform:translateX(4%);pointer-events:none;transition:opacity .6s ease,transform .6s ease,visibility 0s .6s}.lobby-companion .live-speech{top:9%;left:64%;right:-4%}.lobby-companion .live-speech:after{left:-7px;right:auto;bottom:auto;top:50%;margin:-6px 0 0;transform:rotate(135deg)}.stage-shade{position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(90deg,#0a0d14e6,#0a0d1499 24%,transparent 48%),linear-gradient(270deg,#0a0d14b8,#0a0d1440 22%,transparent 38%),linear-gradient(180deg,#0a0d14c4,transparent 15%),linear-gradient(0deg,#0a0d14f5,#0a0d1488 18%,transparent 40%)}.cover-plate{position:absolute;z-index:2;right:36px;bottom:378px;text-align:right;text-shadow:0 2px 14px #000;animation:cover-name-in .5s ease-out}.cover-plate>span{font-size:11px;letter-spacing:2px;color:#e8d2a2;text-transform:uppercase}:lang(th) .cover-plate>span{font-size:12px;letter-spacing:.3px}.cover-plate strong{display:block;font:400 40px/1.1 var(--serif);color:#fff8ee;margin:4px 0 6px}.cover-plate strong em{font:normal 12px var(--sans);letter-spacing:3px;color:#e6c98d;vertical-align:middle;margin-left:6px}.cover-plate small{font:italic 12px var(--serif);color:#ddd6cc}.cover-plate a{color:#e9cf98;font-style:normal;text-decoration:underline;text-underline-offset:3px;text-decoration-color:#e9cf9866}.cover-plate a:hover{color:#fff1cf}.cover-plate .hero-pagination{position:static;justify-content:flex-end;margin-top:8px}.lobby-top{position:absolute;z-index:3;top:0;left:0;right:0;display:flex;justify-content:space-between;align-items:center;gap:12px;padding:calc(18px + env(safe-area-inset-top)) 28px 0;pointer-events:none;animation:lobby-in-down .6s both}.lobby-top>*{pointer-events:auto}.lobby-profile{display:flex;align-items:center;gap:12px;min-width:0;padding:5px 18px 5px 5px;border-radius:40px;box-shadow:0 8px 26px #0006}.lobby-profile .player-avatar{width:44px;height:44px}.lobby-profile .player-avatar b{bottom:-6px}.lobby-profile strong{display:block;font-size:14px;max-width:180px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.lobby-profile small{display:flex;align-items:center;gap:5px;margin-top:4px;font-size:12px;font-weight:700;color:var(--gold);letter-spacing:.3px}.lobby-res{display:flex;align-items:center;gap:10px}.lobby-icons{display:flex;gap:8px;margin-left:8px}.lobby-title{position:absolute;z-index:2;left:56px;top:clamp(104px,17vh,180px);max-width:560px;pointer-events:none;animation:lobby-in-left .7s .08s both}.lobby-chapter{display:flex;align-items:center;gap:10px;font-size:13px;letter-spacing:.5px;color:#e8d4a7;text-shadow:0 1px 8px #000}.lobby-chapter span{width:28px;height:1px;background:currentColor}.lobby-title h1{margin-top:16px;font-family:var(--serif);font-weight:400;font-size:clamp(46px,4.7vw,74px);line-height:1.08;letter-spacing:-1px;color:#fff8ee;text-shadow:0 4px 34px #000b}.lobby-title h1 em{color:#ebd5a4}.lobby-title p{margin-top:18px;max-width:390px;font-size:14px;line-height:1.85;color:#ddd6cf;text-shadow:0 1px 8px #000}.lobby-rail{position:absolute;z-index:3;left:48px;bottom:184px;display:flex;gap:14px;animation:lobby-in-left .7s .16s both}.idle-chest .rail-icon{border:0;background:radial-gradient(closest-side,#181d2a 86%,transparent 88%),conic-gradient(#e7cd94 var(--p),#ffffff26 0)}.idle-chest.full .rail-icon{position:relative}.idle-chest.full .rail-icon:after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;box-shadow:0 0 0 2px #f3dca8,0 0 26px #ffd66bb3;opacity:0;animation:chest-glow 1.4s ease-in-out infinite alternate}.idle-chest:disabled{opacity:1;cursor:default}.idle-chest:disabled .rail-icon{color:#a9a49b}.chest-badge{position:absolute;top:-5px;right:-6px;padding:2px 6px;border-radius:9px;background:linear-gradient(110deg,#f1ddb0,#c9a96b);color:#2a2420;font-size:10px;font-weight:800;box-shadow:0 2px 8px #0008}.lobby-squad{position:absolute;z-index:3;left:48px;bottom:32px;animation:lobby-in-up .7s .2s both}.squad-head{display:flex;align-items:center;gap:12px;margin-bottom:11px;text-shadow:0 1px 6px #000}.squad-head>span{font:400 17px var(--serif);color:#f3ead8}.squad-head b{display:flex;align-items:center;gap:5px;font-size:12.5px;color:var(--gold)}.squad-head button{display:flex;align-items:center;gap:6px;margin-left:4px;padding:5px 11px;border-radius:14px;border:1px solid #d3bb8547;background:#d3bb8512;color:#e7d3a3;font-size:11.5px;text-shadow:none}.squad-head button:hover{background:#d3bb8526}.squad-row{display:flex;gap:10px}.squad-avatar{position:relative;width:74px;flex-shrink:0;text-align:center}.squad-art{display:block;width:74px;height:74px;border-radius:18px;overflow:hidden;background:#1b1e27;border:1.5px solid color-mix(in srgb,var(--hero-color) 72%,#ffffff40);box-shadow:0 10px 24px #000a,inset 0 0 0 1px #0006;transition:transform .2s,border-color .2s}.squad-art .hero-portrait{display:block;width:100%;height:100%;object-fit:cover;object-position:50% 10%;transform:scale(1.3);transform-origin:50% 8%}.squad-avatar:hover .squad-art{transform:translateY(-3px);border-color:var(--hero-color)}.squad-avatar i{position:absolute;top:4px;left:7px;font:700 italic 10.5px var(--serif);color:#f1dba6;text-shadow:0 1px 4px #000}.squad-avatar small{display:block;margin-top:6px;font-size:11.5px;font-weight:700;color:#e4dccf;text-shadow:0 1px 6px #000}.lobby-menu{position:absolute;z-index:3;right:36px;bottom:32px;width:min(410px,34vw);display:flex;flex-direction:column;gap:12px;animation:lobby-in-right .7s .12s both}.menu-campaign-wrap,.menu-tile{position:relative}.menu-tile{isolation:isolate;display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-end;width:100%;overflow:hidden;padding:16px 18px;border-radius:18px;border:1px solid #ffffff26;text-align:left;color:#fff;box-shadow:0 16px 44px #000b}.menu-tile:before{z-index:-2;background:var(--art) var(--at,center)/var(--size,cover) no-repeat;transition:transform .6s ease}.menu-tile:after,.menu-tile:before{content:"";position:absolute;inset:0}.menu-tile:after{z-index:-1;background:linear-gradient(0deg,#0a0d15f2,#0a0d15a8 46%,#0a0d1533)}.menu-tile:hover{border-color:#e8cf9a85}.menu-tile:hover:before{transform:scale(1.06)}.tile-kicker{display:flex;align-items:center;gap:6px;margin-bottom:auto;font-size:12px;letter-spacing:.4px;color:#ecd8aa;text-shadow:0 1px 6px #000}.menu-campaign{height:206px;border-color:#e8cf9a5c}.menu-campaign strong{margin-top:14px;font:400 30px/1 var(--serif);color:#f2dcab;text-shadow:0 2px 12px #000}.menu-campaign strong span{margin-left:8px;font-size:19px;color:#fff6e6}.tile-meta{display:flex;gap:14px;margin-top:9px;font-size:12px;font-weight:600;color:#d9d0c1}.tile-meta>span{display:flex;align-items:center;gap:4px}.tile-meta>span:last-child{color:#c6b5e8}.tile-meta .power-ok{color:#b3d6be}.tile-meta .power-low{color:#eba58e}.tile-go{align-self:stretch;display:flex;align-items:center;justify-content:center;gap:10px;height:46px;margin-top:14px;border-radius:12px;background:linear-gradient(110deg,#f2deb1,#c8aa70);color:#2b2521;font-size:14.5px;font-weight:700;box-shadow:0 8px 26px #d3bb8538,inset 0 1px #fff9;transition:filter .2s}.tile-go .energy-cost{background:#2b25210f;border-color:#2b252126}.menu-tile:hover .tile-go{filter:brightness(1.08)}.menu-map{position:absolute;z-index:1;top:12px;right:12px;width:38px;height:38px;border-radius:50%;display:grid;place-items:center;color:#f1e3c2}.menu-map:hover{border-color:#e8cf9aa6;color:#fff}.menu-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}.menu-row .menu-tile{height:118px;padding:13px 15px}.menu-row strong{font:400 21px/1.15 var(--serif)}.menu-row small{margin-top:4px;font-size:11.5px;line-height:1.35;color:#d2cbc0}.menu-summon{--art:url(/art/portraits/vesper-v1.webp);--at:50% 22%;border-color:#b6a1dc66}.menu-summon .tile-kicker{color:#d6c3f7}.menu-world{--art:url(/art/aetheria-keyart-scene.jpg);--at:4% 42%;--size:auto 180%;border-color:#9fd2b555}.menu-world .tile-kicker{color:#b1e2c6}@keyframes keyart-drift{0%{transform:scale(1.02)}to{transform:scale(1.09) translate3d(-1.2%,-.8%,0)}}@keyframes mote-rise{0%{opacity:0;transform:translateZ(0)}12%{opacity:.9}80%{opacity:.5}to{opacity:0;transform:translate3d(36px,-170px,0)}}@keyframes chest-glow{to{opacity:1}}@keyframes cover-name-in{0%{opacity:0;transform:translateY(6px)}}@keyframes lobby-in-down{0%{opacity:0;transform:translateY(-14px)}}@keyframes lobby-in-up{0%{opacity:0;transform:translateY(18px)}}@keyframes lobby-in-left{0%{opacity:0;transform:translateX(-22px)}}@keyframes lobby-in-right{0%{opacity:0;transform:translateX(22px)}}@media(max-height:780px) and (min-width:800px){.lobby-title{top:92px}.lobby-title h1{font-size:clamp(40px,4vw,56px)}.lobby-title p{display:none}.menu-campaign{height:184px}.menu-row .menu-tile{height:104px}.cover-plate{bottom:342px}.cover-plate strong{font-size:32px}.lobby-rail{bottom:170px}.squad-art{width:64px;height:64px}.squad-avatar{width:64px}}@media(max-width:1099px){.lobby-title{left:32px}.lobby-rail,.lobby-squad{left:28px}.lobby-squad{bottom:calc(var(--nav) + 22px)}.lobby-rail{bottom:calc(var(--nav) + 170px)}.lobby-menu{right:24px;bottom:calc(var(--nav) + 22px);width:min(360px,40vw)}.cover-plate{right:24px;bottom:calc(var(--nav) + 368px)}.squad-row{gap:8px}.squad-art,.squad-avatar{width:60px}.squad-art{height:60px;border-radius:15px}.lobby-companion{left:50%}}@media(max-width:799px){.lobby-top{padding:calc(12px + env(safe-area-inset-top)) 12px 0;gap:8px}.lobby-profile{padding:3px 10px 3px 3px;gap:8px}.lobby-profile .player-avatar{width:36px;height:36px}.lobby-profile .player-avatar svg{width:18px}.lobby-profile strong{font-size:12px;max-width:84px}.lobby-profile small{font-size:10.5px;margin-top:2px}.lobby-res{gap:6px}.lobby-icons{margin-left:0;gap:6px}.lobby-title{left:18px;right:18px;top:calc(68px + env(safe-area-inset-top))}.lobby-chapter{font-size:11.5px;gap:8px}.lobby-chapter span{width:18px}.lobby-title h1{margin-top:10px;font-size:32px;letter-spacing:-.4px}.lobby-title p{display:none}.lobby-rail{left:14px;top:calc(176px + env(safe-area-inset-top));bottom:auto;flex-direction:column;gap:12px}.lobby-rail .rail-btn{width:56px;gap:5px}.lobby-rail .rail-icon{width:46px;height:46px}.lobby-rail .rail-icon svg{width:18px;height:18px}.lobby-rail .rail-btn small{font-size:10.5px}.rail-inventory{display:none}.lobby-companion,.lobby-companion.kael-cover{left:54%;bottom:calc(var(--nav) + 10px);height:auto;width:126%;max-width:640px}.lobby-companion .live-speech{top:2%;left:30%;right:12%;padding:7px 10px;font-size:12px}.lobby-companion .live-speech:after{left:50%;right:auto;top:auto;bottom:-7px;margin:0 0 0 -6px;transform:rotate(45deg)}.stage-shade{background:linear-gradient(90deg,#0a0d14b3,transparent 55%),linear-gradient(180deg,#0a0d14d9,transparent 22%),linear-gradient(0deg,#0a0d14fa,#0a0d14b3 34%,transparent 58%)}.lobby-stage .keyart{object-position:45% center}.cover-plate{right:14px;bottom:calc(var(--nav) + 300px)}.cover-plate small,.cover-plate>span{display:none}.cover-plate strong{font-size:24px;margin:0}.cover-plate .hero-pagination{margin-top:2px}.lobby-squad{left:12px;right:12px;bottom:calc(var(--nav) + 168px)}.squad-head{margin-bottom:8px;gap:10px}.squad-head>span{font-size:15px}.squad-head b{font-size:11.5px}.squad-head button{margin-left:auto;padding:4px 10px;font-size:11px}.squad-row{gap:0;justify-content:space-between}.squad-art,.squad-avatar{width:min(62px,17vw)}.squad-art{height:min(62px,17vw);border-radius:14px}.squad-avatar small{font-size:10.5px;margin-top:4px}.lobby-menu{left:12px;right:12px;width:auto;bottom:calc(var(--nav) + 12px)}.menu-campaign{height:146px;padding:12px 14px;border-radius:16px}.menu-campaign strong{margin-top:8px;font-size:24px}.menu-campaign strong span{font-size:16px}.tile-meta{margin-top:6px;font-size:11px;gap:12px}.tile-go{height:40px;margin-top:10px;font-size:13.5px}.menu-map{top:9px;right:9px;width:34px;height:34px}.menu-row{display:none}}@media(max-width:440px){.lobby-profile{padding:3px}.lobby-profile>div:last-child{display:none}}@media(max-width:360px){.lobby-title h1{font-size:28px}}@media(prefers-reduced-motion:reduce){.lobby-companion,.lobby-companion:not(.active){transform:none}.stage-motes{display:none}}.menu-arena{grid-column:1/-1;--art:url(/art/battle/ch8-wide.webp);--at:50% 40%;border-color:#f0a07a66;height:84px!important;flex-direction:column;justify-content:center;padding-right:70px!important}.menu-arena:after{background:linear-gradient(90deg,#0a0d15f2,#0a0d15b8 55%,#2a0d1580)}.menu-arena .tile-kicker{margin-bottom:2px;color:#ffc2a3}.menu-arena small{margin-top:2px!important}.tile-live{font-style:normal;margin-left:6px;padding:1px 8px;border-radius:8px;background:#f0a07a2e;color:#ffd9c4;font-size:10.5px;animation:tile-live 1.4s ease-in-out infinite}@keyframes tile-live{50%{opacity:.5}}.tile-rank{position:absolute;right:16px;top:50%;translate:0 -50%;filter:drop-shadow(0 4px 10px #000a)}.rail-social .rail-badge{background:#f0a07a;color:#2a1208}.rail-social .rail-dot{background:#f0a07a}.rail-arena.on .rail-icon{border-color:#f0a07a;box-shadow:0 0 0 1px #f0a07a88,0 0 18px #f0a07a66}@media(max-height:780px) and (min-width:800px){.menu-arena{height:72px!important}}.cover-plate{bottom:474px}@media(max-height:780px) and (min-width:800px){.cover-plate{bottom:426px}}@media(max-width:1099px) and (min-width:800px){.cover-plate{bottom:calc(var(--nav) + 464px)}}@media(max-width:799px){.cover-plate{bottom:calc(var(--nav) + 300px)}.lobby-rail{display:grid;grid-template-columns:repeat(2,56px);gap:10px 8px}.lobby-rail .rail-inventory{display:none}}@media(max-width:799px) and (max-height:740px){.lobby-rail{grid-template-columns:repeat(4,56px);top:calc(166px + env(safe-area-inset-top))}.cover-plate{transition:opacity .25s}.lobby-stage:has(.lobby-companion.active .live-speech) .cover-plate{opacity:0}}.arena{container-type:inline-size}.arena .battle-canvas{transition:filter 1.8s cubic-bezier(.2,.7,.2,1)}.arena.ended-victory .battle-canvas{filter:saturate(1.12) brightness(1.05)}.arena.ended-defeat .battle-canvas{filter:saturate(.42) brightness(.78) contrast(1.06)}.arena .battle-cards,.arena .versus-health{transition:opacity .5s ease}.arena[class*=ended-] .battle-cards,.arena[class*=ended-] .versus-health{opacity:0;pointer-events:none}.result-layer{--glow:#e9cf94;--ink:#f4e6c6;--ink-2:#c9b48a;position:absolute;inset:0;z-index:2;pointer-events:none;overflow:hidden}.result-layer.loss{--glow:#8ea4c8;--ink:#dfe5f0;--ink-2:#8e9bb4}.result-veil{position:absolute;inset:0;animation:result-fade 1.1s ease backwards;transition:opacity .6s ease;background:radial-gradient(70% 38% at 50% 14%,color-mix(in srgb,var(--glow) 20%,transparent),transparent 70%),radial-gradient(130% 95% at 50% 46%,transparent 42%,#080b12b0 100%),linear-gradient(0deg,#0a0e15e6 0,#0a0e1500 46%),linear-gradient(180deg,#0a0e1599 0,#0a0e1500 30%)}.loss .result-veil{background:radial-gradient(70% 38% at 50% 14%,#5c6f9433,transparent 70%),radial-gradient(130% 95% at 50% 46%,#1a223522 30%,#060910cc 100%),linear-gradient(0deg,#080b12ee,#080b1200 48%),linear-gradient(180deg,#080b12a8,#080b1200 32%)}.result-rays{position:absolute;left:50%;top:15%;width:min(900px,140%);aspect-ratio:1;translate:-50% -50%;opacity:0;mix-blend-mode:screen;animation:result-rays-in 1.6s ease .2s forwards,result-spin 60s linear infinite;background:repeating-conic-gradient(from 0deg,#f6dca066 0deg 3deg,transparent 3deg 18deg);-webkit-mask:radial-gradient(closest-side,#000 8%,transparent 70%);mask:radial-gradient(closest-side,#000 8%,transparent 70%)}.result-title{filter:drop-shadow(0 4px 22px color-mix(in srgb,var(--glow) 40%,transparent)) drop-shadow(0 2px 3px #0009);position:absolute;left:0;right:0;top:clamp(18px,7%,44px);flex-direction:column;text-align:center;transition:opacity .5s ease,transform .6s cubic-bezier(.2,.8,.2,1)}.result-eyebrow,.result-title{display:flex;align-items:center}.result-eyebrow{gap:12px;font-size:9px;font-weight:600;letter-spacing:3.4px;text-transform:uppercase;color:var(--ink-2);text-shadow:0 1px 8px #000a;animation:result-track 1s cubic-bezier(.2,.8,.2,1) .15s backwards}.result-eyebrow:after,.result-eyebrow:before{content:"";height:1px;width:44px;background:linear-gradient(90deg,transparent,var(--ink-2));animation:result-line .9s cubic-bezier(.2,.8,.2,1) .35s backwards}.result-eyebrow:after{background:linear-gradient(270deg,transparent,var(--ink-2))}.result-title h2{margin:6px 0 4px;font:400 clamp(46px,11cqi,84px)/1 var(--serif);letter-spacing:-.5px;color:transparent;background:linear-gradient(100deg,var(--ink) 0,var(--ink) 38%,#fffaf0 48%,var(--ink) 58%,var(--ink) 100%);background-size:260% 100%;background-position:100% 0;-webkit-background-clip:text;background-clip:text;animation:result-rise 1s cubic-bezier(.16,.84,.24,1) backwards,result-shine 4.5s ease-in-out 1.2s infinite}.loss .result-title h2{background:linear-gradient(180deg,#eef2f8,#9aa7bf);-webkit-background-clip:text;background-clip:text;animation:result-sink 1.2s cubic-bezier(.16,.84,.24,1) backwards}.result-sub{margin-top:4px;padding:4px 12px;border-radius:12px;background:#0b0f16a6;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border:1px solid #ffffff12;font-size:10px;letter-spacing:1px;color:#e2ddd2;font-variant-numeric:tabular-nums;animation:result-fade .8s ease .5s backwards}.result-reward-pop{position:absolute;left:50%;top:calc(clamp(18px,7%,44px) + clamp(118px,15cqi + 66px,150px));translate:-50% 0;display:flex;flex-direction:column;align-items:center;gap:6px;padding:10px 22px 12px;border-radius:14px;background:linear-gradient(180deg,#2a2618e0,#15130ee6);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid #e9cf9455;box-shadow:0 12px 40px #000a,0 0 30px #e9cf9433,inset 0 1px #fff2;animation:result-pop .6s cubic-bezier(.3,1.5,.5,1) .55s backwards,result-pop-out .5s ease 3.4s forwards}.result-reward-pop small{font-size:9px;font-weight:700;letter-spacing:2.4px;text-transform:uppercase;color:var(--glow)}.result-reward-pop>div{display:flex;gap:22px}.result-reward-pop span{display:inline-flex;align-items:center;gap:7px;font-size:24px;font-weight:700;font-variant-numeric:tabular-nums;color:var(--gold);text-shadow:0 2px 10px #000a;animation:result-pop-item .5s calc(.8s + var(--d,0s)) cubic-bezier(.3,1.6,.5,1) backwards}.result-reward-pop span.crystal{--d:.12s;color:#d2bbf0}.result-reward-pop span i{font-style:normal;font-size:11px;font-weight:500;color:#cfc6b2;margin-left:-1px}.result-layer.folded .result-reward-pop{visibility:hidden}.result-panel{pointer-events:auto;position:absolute;left:50%;bottom:16px;width:min(780px,calc(100% - 28px));translate:-50% 0;display:grid;grid-template-columns:auto minmax(0,1fr) auto auto;align-items:center;gap:22px;padding:16px 20px 16px 16px;border-radius:16px;background:linear-gradient(180deg,#1e2730a8,#11161ed1);-webkit-backdrop-filter:blur(16px) saturate(1.25);backdrop-filter:blur(16px) saturate(1.25);border:1px solid #ffffff14;box-shadow:0 24px 60px #0008,inset 0 1px #ffffff12;animation:result-panel-in .8s cubic-bezier(.16,.84,.24,1) .3s backwards;transition:opacity .45s ease,transform .55s cubic-bezier(.2,.8,.2,1)}.result-panel:before{content:"";position:absolute;left:18%;right:18%;top:-1px;height:1px;background:linear-gradient(90deg,transparent,var(--glow),transparent);opacity:.8}.result-fold{position:absolute;top:-13px;right:16px;width:26px;height:26px;display:grid;place-items:center;border-radius:50%;background:#1b222b;border:1px solid #ffffff1c;color:#c9c6bd;box-shadow:0 4px 12px #0007;transition:background .2s,color .2s}.result-fold:hover{background:#263039;color:#fff}.result-mvp{display:flex;align-items:center;gap:12px;animation:result-up .6s ease .5s backwards}.result-mvp-art{position:relative;width:58px;height:66px;border-radius:12px;overflow:hidden;flex-shrink:0;border:1px solid color-mix(in srgb,var(--hero-color) 60%,#f1d9a0);box-shadow:0 0 0 3px color-mix(in srgb,var(--hero-color) 18%,transparent),0 8px 22px color-mix(in srgb,var(--hero-color) 35%,transparent)}.result-mvp-art .hero-portrait{width:100%;height:100%;object-fit:cover;object-position:50% 18%;display:block}.result-mvp-art:after{content:"";position:absolute;inset:0;background:linear-gradient(115deg,transparent 35%,#ffffff40 50%,transparent 65%);background-size:250% 100%;animation:result-glint 1.4s ease 1s backwards}.result-mvp small{display:block;font-size:8px;font-weight:700;letter-spacing:2px;text-transform:uppercase;color:var(--glow)}.result-mvp strong{display:block;font:400 19px/1.15 var(--serif);color:#f3eee4;margin:3px 0 2px}.result-mvp em{font-style:normal;font-size:12px;color:#d9d3c4;font-variant-numeric:tabular-nums}.result-mvp em span{font-size:9px;color:#9a9ea7;letter-spacing:.5px}.result-bars{list-style:none;margin:0;padding:0;display:grid;gap:5px;min-width:0}.result-bars li{display:grid;grid-template-columns:52px minmax(0,1fr) 46px;align-items:center;gap:8px;font-size:9px;color:#c3c4c6;animation:result-up .5s calc(.55s + var(--i) * .06s) ease backwards}.result-bars li.down{color:#8a8d95}.result-bars span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.result-bars i{height:5px;border-radius:3px;background:#ffffff0d;overflow:hidden}.result-bars b{display:block;height:100%;width:calc(var(--share) * 100%);border-radius:inherit;transform-origin:left;background:linear-gradient(90deg,color-mix(in srgb,var(--hero-color) 55%,#1a2028),color-mix(in srgb,var(--hero-color) 85%,#fff3d8));box-shadow:0 0 10px color-mix(in srgb,var(--hero-color) 45%,transparent);animation:result-bar 1.1s calc(.7s + var(--i) * .08s) cubic-bezier(.2,.8,.2,1) backwards}.result-bars li.down b{filter:saturate(.4) brightness(.8)}.result-bars em{font-style:normal;text-align:right;font-variant-numeric:tabular-nums;color:#9fa3ab}.result-facts{display:flex;flex-direction:column;gap:9px;min-width:120px;animation:result-up .6s ease .7s backwards}.result-facts>span small{display:block;font-size:8px;letter-spacing:1.6px;text-transform:uppercase;color:#8f949d}.result-facts>span strong{font:400 22px/1.1 var(--serif);color:#efe9dc}.result-facts>span strong i{font-style:normal;font-size:13px;color:#8f949d}.result-facts p{margin:0;max-width:170px;font-size:10px;line-height:1.5;color:#a9b0bf}.result-loot{display:flex;gap:14px}.result-loot span{display:inline-flex;align-items:center;gap:6px;font-size:14px;font-weight:600;color:var(--gold);font-variant-numeric:tabular-nums}.result-loot .crystal{color:#c7aee6}.result-actions{display:flex;flex-direction:column;align-items:stretch;gap:4px;animation:result-up .6s ease .8s backwards}.result-actions .primary-btn{height:44px;border-radius:10px;white-space:nowrap;padding:0 18px;box-shadow:0 6px 24px color-mix(in srgb,var(--glow) 28%,transparent),inset 0 1px #fff7}.loss .result-actions .primary-btn{background:linear-gradient(110deg,#e1e7f1,#a9b6cf);color:#1d2330}.result-minor{display:flex;flex-direction:column;align-items:center}.result-minor .text-btn{padding:6px 0}.result-minor .claimed-label{margin-top:3px}.result-actions .primary-btn{position:relative;overflow:hidden}.result-actions .primary-btn.auto-counting:after{content:"";position:absolute;left:0;bottom:0;height:3px;width:100%;background:#4a3a1acc;transform-origin:left;animation:result-auto var(--auto-s) linear forwards}.auto-count{font-size:10px;font-weight:600;padding:2px 7px;border-radius:9px;background:#302b2922;font-variant-numeric:tabular-nums}.auto-toggle{display:inline-flex;align-items:center;gap:6px;padding:5px 0;font-size:10px;color:#a9adb5}.auto-toggle i{position:relative;width:24px;height:13px;border-radius:7px;background:#ffffff1c;transition:background .2s}.auto-toggle i:after{content:"";position:absolute;top:2px;left:2px;width:9px;height:9px;border-radius:50%;background:#c9c6bd;transition:transform .2s,background .2s}.auto-toggle.on{color:var(--gold)}.auto-toggle.on i{background:#c8aa7088}.auto-toggle.on i:after{transform:translateX(11px);background:#f3dfb3}.result-pill{pointer-events:auto;position:absolute;left:50%;bottom:18px;translate:-50% 0;display:flex;align-items:center;gap:8px;height:38px;padding:0 16px;border-radius:19px;background:#151b23cc;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid #ffffff1c;color:var(--ink);font-size:11px;letter-spacing:.4px;box-shadow:0 10px 30px #0007;opacity:0;transform:translateY(14px) scale(.96);visibility:hidden;transition:opacity .35s ease,transform .45s cubic-bezier(.2,.8,.2,1),visibility 0s .45s}.result-pill:hover{background:#1d2530e6}.result-layer.folded .result-veil{opacity:.3}.result-layer.folded .result-rays{visibility:hidden}.result-layer.folded .result-title{opacity:0;transform:translateY(-16px)}.result-layer.folded .result-panel{opacity:0;transform:translateY(30px);pointer-events:none}.result-layer.folded .result-pill{opacity:1;transform:none;visibility:visible;transition-delay:.15s,.15s,0s}@container (max-width:700px){.result-panel{grid-template-columns:auto minmax(0,1fr);gap:12px 14px;padding:14px;bottom:10px;width:calc(100% - 20px);border-radius:14px}.result-bars{display:none}.result-facts{flex-direction:row;align-items:center;justify-content:flex-end;gap:14px;min-width:0}.result-facts p{display:none}.loss .result-facts p{display:block;max-width:none;text-align:right}.result-actions{grid-column:1/-1;flex-direction:row;align-items:center;gap:12px}.result-actions .primary-btn{flex:1}.result-minor{flex-shrink:0}.result-mvp-art{width:46px;height:52px;border-radius:10px}.result-mvp strong{font-size:16px}.result-loot{flex-direction:column;gap:4px}.result-loot span{font-size:12px}.result-reward-pop{padding:8px 16px 10px}.result-reward-pop span{font-size:18px}}@container (max-width:420px){.result-eyebrow{font-size:7px;letter-spacing:2.6px}.result-eyebrow:after,.result-eyebrow:before{width:26px}.result-facts>span{display:none}}@keyframes result-fade{0%{opacity:0}}@keyframes result-rays-in{to{opacity:.32}}@keyframes result-spin{to{rotate:1turn}}@keyframes result-track{0%{opacity:0;letter-spacing:9px}}@keyframes result-line{0%{width:0;opacity:0}}@keyframes result-rise{0%{opacity:0;transform:scale(1.18);filter:blur(14px)}}@keyframes result-sink{0%{opacity:0;transform:translateY(-10px) scale(1.04);filter:blur(10px)}}@keyframes result-shine{0%,55%{background-position:100% 0}85%,to{background-position:0 0}}@keyframes result-panel-in{0%{opacity:0;transform:translateY(26px) scale(.98)}}@keyframes result-up{0%{opacity:0;transform:translateY(8px)}}@keyframes result-bar{0%{transform:scaleX(0)}}@keyframes result-pop{0%{opacity:0;transform:translateY(10px) scale(.6)}}@keyframes result-pop-item{0%{opacity:0;transform:scale(.4)}}@keyframes result-pop-out{to{opacity:0;transform:translateY(-12px) scale(.94);visibility:hidden}}@keyframes result-auto{0%{transform:scaleX(0)}}@keyframes result-glint{0%{background-position:120% 0}to{background-position:-30% 0}}@media (prefers-reduced-motion:reduce){.result-layer *,.result-layer :after,.result-layer :before{animation:none!important}.result-rays{opacity:.25}}.control-btn.auto-next{display:inline-flex;gap:6px;padding:0 10px;font-size:10px;color:#a9adb5}.control-btn.auto-next.on{color:#302b29;background:linear-gradient(110deg,#e7d3a9,#c8aa70);border-color:#e7d3a9}.wb{--wb-font:ui-sans-serif,system-ui,-apple-system,"SF Pro Text","Segoe UI",Roboto,var(--font-th-sans),sans-serif;position:fixed;inset:0;margin:auto;width:min(400px,calc(100% - 32px));max-width:none;max-height:none;height:fit-content;padding:0;border:0;background:transparent;color:#f4f2f8;font-family:var(--wb-font);overflow:visible}.wb::backdrop{background:#06070bcc;-webkit-backdrop-filter:blur(14px) saturate(1.2);backdrop-filter:blur(14px) saturate(1.2)}.wb[open]{animation:wb-in .5s cubic-bezier(.16,1,.3,1) both}.wb[open]::backdrop{animation:wb-fade .4s ease both}.wb-card{position:relative;overflow:hidden;isolation:isolate;padding:30px 22px 22px;border-radius:30px;background:linear-gradient(180deg,#1a1d2a,#11131b 60%);border:1px solid #ffffff14;box-shadow:0 40px 100px -20px #000e,0 0 0 1px #00000060,inset 0 1px #ffffff12}.wb-aurora{position:absolute;z-index:-1;inset:-40% -30% auto;height:330px;background:radial-gradient(closest-side at 32% 55%,#f0c97a55,transparent),radial-gradient(closest-side at 70% 45%,#9a7cff4a,transparent);filter:blur(28px);animation:wb-drift 9s ease-in-out infinite alternate}.wb-close{position:absolute;top:14px;right:14px;width:36px;height:36px;display:grid;place-items:center;border-radius:50%;color:#c9c6d3;background:#ffffff0f;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.wb-close:focus-visible{outline-offset:2px}.wb-close:hover{color:#fff;background:#ffffff1f}.wb-head{display:flex;flex-direction:column;align-items:center;text-align:center}.wb-ring{position:relative;width:96px;height:96px;display:grid;place-items:center}.wb-ring>svg{position:absolute;inset:0;overflow:visible;rotate:-90deg}.wb-ring circle{fill:none;stroke-width:5}.wb-ring .track{stroke:#ffffff12}.wb-ring .bar{stroke:#f0cf7e;stroke-linecap:round;stroke-dasharray:var(--fill) 1;filter:drop-shadow(0 0 6px #f0cf7e99);animation:wb-ring 1.1s cubic-bezier(.22,1,.36,1) .25s both}.wb-ring.full .bar{stroke:#ffb86b;filter:drop-shadow(0 0 8px #ffb86bcc)}.wb-ring>span{width:66px;height:66px;display:grid;place-items:center;border-radius:50%;color:#2a2110;background:linear-gradient(145deg,#fff1c9,#e5bd6c);box-shadow:0 10px 30px -6px #f0c97a99,inset 0 1px #fff}.wb-ring>span svg{width:30px;height:30px;animation:wb-tip 3.2s ease-in-out infinite}.wb-head h2{margin-top:16px;font:700 23px/1.25 var(--wb-font);letter-spacing:-.3px;text-wrap:balance;max-width:290px}.wb-head p{margin-top:6px;font-size:14px;line-height:1.55;color:#a9a6b8;text-wrap:balance}.wb-time{display:flex;align-items:center;gap:6px;margin-top:14px;padding:7px 14px;border-radius:999px;font-size:12.5px;color:#a9a6b8;background:#ffffff0b;border:1px solid #ffffff10}.wb-time b{font-weight:650;color:#f4e3b6;font-variant-numeric:tabular-nums}.wb-list{list-style:none;margin:22px 0 0;padding:6px;border-radius:22px;background:#ffffff08;border:1px solid #ffffff0d}.wb-list li{display:flex;align-items:center;gap:13px;padding:12px;border-radius:16px;animation:wb-row .55s calc(.3s + var(--i) * .1s) cubic-bezier(.16,1,.3,1) both}.wb-list li+li{position:relative}.wb-list li+li:before{content:"";position:absolute;top:0;left:69px;right:12px;height:1px;background:#ffffff0d}.wb-icon{flex:none;width:44px;height:44px;display:grid;place-items:center;border-radius:14px;color:var(--c);background:color-mix(in srgb,var(--c) 15%,transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--c) 28%,transparent)}.wb-icon svg{width:22px;height:22px}.wb-label{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px;font-size:15px;font-weight:600}.wb-label small{font-size:12px;font-weight:400;color:#8f8ca0;font-variant-numeric:tabular-nums}.wb-list strong{flex:none;max-width:60%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font:700 22px/1 var(--wb-font);letter-spacing:-.4px;font-variant-numeric:tabular-nums;color:color-mix(in srgb,var(--c) 55%,#fff)}.wb-cta{position:relative;overflow:hidden;width:100%;height:56px;margin-top:18px;display:flex;align-items:center;justify-content:center;gap:6px;border-radius:18px;font:650 16px var(--wb-font);color:#241a07;background:linear-gradient(180deg,#ffe6a6,#ebbd5f);box-shadow:0 14px 34px -10px #e9b95acc,inset 0 1px #fffbe8,inset 0 -2px #c99a3d}.wb-cta:after{content:"";position:absolute;top:0;bottom:0;left:-40%;width:30%;background:linear-gradient(100deg,transparent,#ffffff8c,transparent);animation:wb-shine 3.4s ease-in-out 1.2s infinite}.wb-cta:hover{filter:brightness(1.05)}.wb-cta svg{transition:transform .2s}.wb-cta:hover svg{transform:translateX(3px)}@keyframes wb-in{0%{opacity:0;transform:translateY(28px) scale(.96)}}@keyframes wb-fade{0%{opacity:0}}@keyframes wb-drift{to{transform:translateX(8%) translateY(6%) scale(1.08)}}@keyframes wb-ring{0%{stroke-dasharray:0 1}}@keyframes wb-tip{0%,70%{rotate:0deg}85%,to{rotate:180deg}}@keyframes wb-row{0%{opacity:0;transform:translateY(10px)}}@keyframes wb-shine{0%,55%{transform:none}to{transform:translateX(566.667%)}}@media(max-width:420px){.wb-card{padding:26px 16px 16px;border-radius:26px}.wb-head h2{font-size:21px}.wb-list strong{font-size:19px}}@media(prefers-reduced-motion:reduce){.wb-aurora,.wb-cta:after,.wb-ring>span svg{animation:none}}