:root{color-scheme:dark;font-family:Arial,Helvetica,sans-serif;color:#f4f3ef;background:#080b11;--red:#ff583c;--line:#ffffff24}*{box-sizing:border-box}body{margin:0}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer}button:focus-visible,a:focus-visible{outline:3px solid #ffce87;outline-offset:3px}button:disabled{cursor:default}[hidden]{display:none!important}#shell{height:100dvh;min-height:360px;position:relative;overflow:hidden;background:radial-gradient(ellipse at 75% 45%,#2c3542,#0c1018 64%)}#preview{position:absolute;right:0;top:30px;width:54%;height:calc(100% - 60px);pointer-events:none}.shade{position:absolute;inset:0;background:linear-gradient(90deg,#090c12 0%,#090c12f0 37%,transparent 66%);pointer-events:none}.ambient{position:absolute;inset:0;background:linear-gradient(120deg,transparent 40%,#ff492917 50%,transparent 65%);animation:light 9s ease-in-out infinite alternate}@keyframes light{to{transform:translateX(12%);opacity:.3}}header,footer{position:absolute;z-index:3;left:4vw;right:4vw;display:flex;justify-content:space-between;align-items:center}header{top:22px}.logo{font-size:34px;font-weight:950;font-style:italic;text-decoration:none;color:white;display:flex;align-items:center;gap:16px}.logo span{font-style:normal;font-size:11px;letter-spacing:3px;max-width:140px;line-height:1.5}.edition{font-size:12px;letter-spacing:2px;color:#abb2bf}footer{bottom:16px;border-top:1px solid var(--line);padding-top:12px;font-size:11px;letter-spacing:2px;color:#9fa7b5}main{position:absolute;z-index:2;inset:100px 4vw 56px;pointer-events:none}main button,main a{pointer-events:auto}.menu-left{width:49%;height:100%;overflow:auto;pointer-events:auto;padding:0 16px 12px 0;scrollbar-width:thin;scrollbar-color:#594438 transparent}.eyebrow{font-size:12px;letter-spacing:3px;color:#ffa28c;margin:0 0 12px}h1{font-size:clamp(42px,6vw,96px);font-style:italic;line-height:.94;letter-spacing:-3px;margin:0 0 32px}h2{font-size:clamp(24px,2.8vw,42px);font-style:italic;margin:10px 0 20px;line-height:1.05;letter-spacing:-1px}.home-nav{display:grid;gap:8px;width:min(410px,100%)}.menu-button{border:1px solid var(--line);border-left:3px solid #68717d;padding:18px 20px;text-align:left;background:linear-gradient(105deg,#252e3be8,#131b28aa);font-weight:900;font-style:italic;font-size:28px;display:flex;align-items:center;justify-content:space-between;transition:transform .18s,background .18s}.menu-button:hover{transform:translateX(5px);background:#343c48}.menu-button.primary{background:linear-gradient(105deg,#fa583b,#a62321);border-color:#ff8a69;padding-block:26px;font-size:38px;box-shadow:0 10px 40px #df301c20}.menu-button small{font:11px Arial;letter-spacing:1px}.preview-caption{position:absolute;bottom:18px;right:0;width:47%;text-align:center;pointer-events:none;text-shadow:0 2px 10px #000;background:linear-gradient(transparent,#080d15a0);padding:22px 8px 0}.preview-caption span{font-size:12px;letter-spacing:3px;color:#e9ae99}.preview-caption h2{font-size:clamp(32px,4.5vw,68px);margin:7px 0}.preview-caption p{font-size:12px;letter-spacing:4px;margin:0;color:#bac3cf}.back,.solid,.tab{border:1px solid var(--line);background:#17202b;padding:12px 18px;min-height:44px;font-size:13px;letter-spacing:1px}.back{margin-bottom:14px;background:transparent;border:0;border-bottom:1px solid #6c737c;padding-left:0}.solid{background:#d9442e;border-color:#ff7658;font-weight:bold}.cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;max-width:520px}.card{min-width:0;height:clamp(200px,35vh,340px);background:linear-gradient(145deg,#303b4c,#101722);border:1px solid #566171;text-align:left;position:relative;overflow:hidden;padding:0;transition:border .2s,transform .2s}.card:hover{border-color:#ff7359}.card.selected{border:2px solid #ff795a;box-shadow:0 0 0 2px #fd654223,0 7px 25px #0005}.card img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;object-position:center bottom}.card:after{content:"";position:absolute;inset:55% 0 0;background:linear-gradient(transparent,#080c16)}.card .number{position:absolute;top:12px;left:12px;font-size:30px;font-weight:900;font-style:italic;color:#ffffff55}.card-label{position:absolute;bottom:14px;left:14px;right:6px;z-index:1}.card-label b{display:block;font-size:clamp(18px,2vw,27px);font-style:italic;margin-bottom:6px}.card-label small{font-size:12px;letter-spacing:2px;color:#c3cbd7}.selection-mark{position:absolute;top:10px;right:8px;background:#ee563d;padding:5px 7px;font-size:10px;letter-spacing:1px;color:white}.confirm{margin-top:20px}.arena-card{grid-column:1/-1;height:300px}.arena-card img{object-fit:cover}.fighter-switch{display:flex;gap:8px;margin:0 0 18px}.fighter-switch button{display:flex;align-items:center;gap:10px;border:1px solid #536070;background:#192230;padding:0 14px 0 0;min-height:50px;font-weight:bold;font-size:13px}.fighter-switch img{width:44px;height:50px;object-fit:cover;object-position:center 20%;background:#2d3440}.fighter-switch .active{border-color:#ff7656;background:#46271f}.tabs{display:flex;gap:0;border-bottom:1px solid #636d7b;margin-bottom:16px}.tab{background:transparent;border:0;color:#929caa;font-weight:bold;flex:1;padding:12px 8px}.tab.active{color:#fff;border-bottom:3px solid #ff6a4c}.store-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}.item{min-width:0;border:1px solid #444e5d;background:linear-gradient(145deg,#263140e8,#111822e8)}.item.selected{border-color:#ff805e}.cosmetic-preview{height:180px;width:100%;position:relative;border:0;background:transparent;padding:0;overflow:hidden;text-align:left}.cosmetic-preview img{width:100%;height:100%;object-fit:contain}.cosmetic-preview:after{content:"";position:absolute;inset:55% 0 0;background:linear-gradient(transparent,#0c111c)}.item-title{position:absolute;z-index:1;bottom:10px;left:10px;right:8px;font-size:14px;font-weight:bold}.lock-symbol{position:absolute;inset:30px 0 auto;text-align:center;color:#8d97a5;font-size:40px}.locked{background:repeating-linear-gradient(135deg,#18202c,#18202c 9px,#1b2330 9px,#1b2330 10px)}.locked .item-title{color:#a8b0bd}.actions{min-height:42px;display:flex;border-top:1px solid #434b56;align-items:center;justify-content:center}.actions button{flex:1;min-width:0;min-height:42px;border:0;background:#293444;font-size:11px;padding:8px 3px}.actions button:hover{background:#4b392f}.actions .equipped{color:#ffb18e;background:#35251f}.actions span{font-size:10px;letter-spacing:1px;color:#a4adbc}.collection-action{margin-top:14px}.notice{font-size:13px;color:#ffc0a6;line-height:1.4}.compact .card{height:260px}.vs{height:100%;display:flex;justify-content:space-between;align-items:flex-end;padding-bottom:18px;gap:20px}.vs .side{width:38%;padding:20px;border-bottom:3px solid #ff7359;background:linear-gradient(120deg,#212c3aa0,#101722a0)}.vs .side:last-child{text-align:right;border-color:#79afff}.vs strong{align-self:center;font-size:clamp(60px,10vw,150px);font-style:italic;color:#ff6849;text-shadow:0 0 40px #ff432955}.vs h2{font-size:clamp(28px,4vw,64px);margin-bottom:10px}.vs-mode #preview{width:100%;right:0}.vs-mode .shade{background:linear-gradient(0deg,#090b10 2%,transparent 50%)}#preview-status{position:absolute;right:5vw;top:90px;font-size:12px;color:#b4beca;z-index:1}#fight-frame{position:fixed;inset:0;width:100%;height:100dvh;border:0;background:#090b10;z-index:10}@media(max-height:650px){header{top:10px}.logo{font-size:25px}.logo span{font-size:9px}main{inset:68px 4vw 35px}footer{bottom:8px;padding-top:7px;font-size:10px}h1{font-size:48px;margin-bottom:18px}h2{font-size:25px;margin:6px 0 10px}.back{padding:4px 0;min-height:32px;margin-bottom:10px}.eyebrow{font-size:10px;margin-bottom:7px}.menu-button{padding:12px 16px;font-size:23px}.menu-button.primary{padding-block:16px;font-size:31px}.card{height:185px}.card-label{bottom:9px;left:9px}.card-label b{font-size:20px}.confirm{margin-top:10px}.confirm .solid{padding:9px 14px}.fighter-switch{margin-bottom:10px}.fighter-switch button{min-height:40px;font-size:11px}.fighter-switch img{height:40px;width:34px}.tabs{margin-bottom:10px}.tab{min-height:36px;padding:8px 4px;font-size:12px}.cosmetic-preview{height:125px}.store-grid{gap:7px}.preview-caption{bottom:7px;padding-top:10px}.preview-caption h2{font-size:36px}.preview-caption span,.preview-caption p{font-size:10px}.compact .card{height:175px}.vs .side{padding:10px}.arena-card{height:200px}}@media(max-width:900px){.store-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.edition{font-size:10px}.menu-button small{display:none}.store-left{width:51%}.cards{gap:8px}.selection-mark{font-size:8px;padding:4px}.card-label small{font-size:10px;letter-spacing:1px}}@media(max-width:560px) and (orientation:portrait){#preview{width:100%;height:55%;top:30px;right:-20%}.shade{background:linear-gradient(0deg,#090c12 30%,#090c12aa 60%,transparent)}main{inset:95px 5vw 45px}.menu-left{width:100%;padding-top:38vh;height:100%}.home .menu-left{padding-top:24vh}.preview-caption{top:0;bottom:auto;right:25%;width:75%;text-align:left}.preview-caption h2{font-size:32px}.edition{display:none}.store-left{padding-top:32vh}.card{height:230px}.store-grid{grid-template-columns:repeat(2,1fr)}.vs h2{font-size:25px}.vs strong{font-size:58px}footer span:first-child{display:none}}@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
/* Shared actual-asset fallback is visible before any scripts or WebGL load. */
.hero-city{position:absolute;inset:0;background:linear-gradient(0deg,#090d19b0,#0a15213a),url('./assets/stormline-city.png') center/cover;opacity:.23}#shell[data-view=home] .hero-city{opacity:.8}#fighter-still{position:absolute;right:0;top:30px;width:54%;height:calc(100% - 60px);display:flex;justify-content:center;align-items:center;transition:opacity .35s;pointer-events:none}#fighter-still img{width:100%;height:90%;object-fit:contain;filter:drop-shadow(0 10px 24px #000a)}#preview{opacity:0;transition:opacity .4s}#shell[data-presentation=live] #preview{opacity:1}#shell[data-presentation=live] #fighter-still{opacity:0}#shell[data-view=home] .shade{background:linear-gradient(90deg,#070c13f5 0%,#080d16ec 30%,#080d1690 47%,transparent 65%),linear-gradient(0deg,#070b14aa,transparent 28%)}#shell[data-view=home] #preview{top:0;height:100%;width:60%;right:-2%}#shell[data-view=home] #fighter-still{top:0;height:100%;width:60%;right:-2%}#shell[data-view=home] .preview-caption{bottom:2%;right:1%;width:43%;border-bottom:1px solid #d56b494d;padding-bottom:8px}#shell[data-view=home] .menu-left{padding-top:5vh}#preview-status:empty{display:none}#shell[data-presentation=loading] #preview-status{display:block;width:36px;height:2px;top:auto;bottom:49px;right:25%;background:#ff9b69;animation:loadpulse 1.2s ease-in-out infinite alternate}@keyframes loadpulse{to{opacity:.2;transform:scaleX(.4)}}#fighter-still.duel-still{width:100%;right:0;gap:3vw}#fighter-still.duel-still img{width:39%;height:85%}#fighter-still.duel-still img:last-child{transform:scaleX(-1)}@media(max-height:650px){#shell[data-view=home] .menu-left{padding-top:1vh}#shell[data-view=home] .preview-caption{bottom:0}#shell[data-view=home] .preview-caption h2{font-size:32px}}@media(max-width:560px) and (orientation:portrait){#fighter-still,#shell[data-view=home] #fighter-still,#shell[data-view=home] #preview{width:100%;height:55%;top:30px;right:-20%}#shell[data-view=home] .menu-left{padding-top:24vh}#shell[data-view=home] .preview-caption{top:0;bottom:auto;right:25%;width:75%}#shell[data-view=home] .shade{background:linear-gradient(0deg,#090c12 25%,#090c1290 60%,transparent)}}

/* Give the guard and identification separate breathing room. */
#shell[data-view=home] .preview-caption{bottom:0;padding-top:12px}#shell[data-view=home] .preview-caption h2{font-size:clamp(30px,3.8vw,56px)}#shell[data-view=home] #fighter-still img{height:82%}

#shell[data-view=home] #fighter-still img{filter:grayscale(1) sepia(1) saturate(4) hue-rotate(145deg) drop-shadow(0 0 18px #28bfff55);opacity:.8}
/* Visual test store */
.shop{height:100%;pointer-events:auto;position:relative}.shop-heading{display:flex;justify-content:space-between;align-items:flex-start}.shop-heading h2{font-size:42px;margin:0}.wallet{text-align:right;display:grid;grid-template-columns:auto auto;gap:5px 16px;align-items:center}.wallet small{grid-column:1/-1;letter-spacing:3px;font-size:10px;color:#d6af8b}.wallet strong{font-size:30px;font-variant-numeric:tabular-nums}.wallet button,.shop-cta button{border:1px solid #ffffff45;background:#18202dcc;padding:12px;font-weight:800}.shop-browse{width:51%;height:calc(100% - 85px);overflow-y:auto;padding:14px 12px 20px 0;scrollbar-width:thin}.shop .tabs{position:sticky;top:0;background:#0b1018ed;z-index:2}.shop-rail{display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;padding:12px 3px 18px;min-height:280px;scrollbar-color:#b94735 #151b24;scrollbar-width:thin}.shop-card{position:relative;flex:0 0 175px;height:290px;scroll-snap-align:center;border:1px solid #ffffff25;background:linear-gradient(160deg,#293341,#0b1018);padding:0;text-align:left;overflow:hidden;transition:transform .2s,border .2s}.shop-card.selected{flex-basis:205px;border:2px solid var(--accent);box-shadow:0 0 22px #ff583c18;transform:translateY(-6px)}.shop-art{height:205px;overflow:hidden;position:relative;background:radial-gradient(ellipse at 50% 55%,#50607066,transparent 70%)}.shop-art img{width:100%;height:100%;object-fit:contain;object-position:center top}.shop-status{position:absolute;top:9px;left:8px;padding:5px 7px;font-size:9px;font-weight:900;background:#080c13d9;letter-spacing:1px}.shop-card-label{position:absolute;bottom:0;padding:12px;width:100%;background:linear-gradient(transparent,#090e17 24%);display:grid;gap:6px}.shop-card-label b{font-size:17px;font-style:italic}.shop-card-label small{font-size:10px;color:#c0c8d4}.shop-card-label em{font-size:10px;color:#ff927a;font-style:normal}.move-mark{position:absolute;right:12px;bottom:12px;color:#ff623d;font-size:54px;text-shadow:0 0 20px #ff5639}.shop-detail{position:absolute;bottom:12px;right:0;width:43%;background:linear-gradient(90deg,#0a1018ec,#0a10186b);padding:20px;border-left:2px solid #ff583c}.shop-detail>small{font-size:10px;letter-spacing:2px;color:#ffa691}.shop-detail h2{margin:8px 0;font-size:30px}.shop-detail p{font-size:13px;line-height:1.5;max-width:440px;margin:7px 0;color:#bcc5d2}.shop-detail .shop-scope{font-size:10px;color:#9eaab8}.shop-cta{display:flex;gap:8px;margin-top:12px;align-items:center}.shop-cta .solid{background:#ef533a}.soon{font-size:12px;letter-spacing:2px;color:#cfb296}.move-stats{font-weight:900;color:#fff!important}.move-stats span{display:block;font-size:10px;color:#b4bece;font-weight:400}.loadout>small{letter-spacing:2px;color:#aeb8c6;font-size:10px}.loadout>div{display:flex;gap:7px;margin-top:8px}.loadout button{flex:1;min-height:58px;border:1px solid #ffffff30;background:#17202c;font-size:10px;padding:8px;text-align:left}.loadout button.active{border-color:#ff6848}.loadout button span{display:block;color:#ff7958;margin-bottom:6px}.loadout p{font-size:10px;color:#a6b1c1}.reset-store{font-size:9px;letter-spacing:1px;margin-top:18px;background:none;border:0;color:#929aa6;padding:10px 0}.gi-concept{height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;background:radial-gradient(ellipse,var(--accent),#0d121d 70%)}.gi-concept i{width:78px;height:88px;background:var(--accent);border:1px solid #ffffff88;clip-path:polygon(20% 0,40% 0,50% 25%,60% 0,80% 0,100% 40%,80% 52%,74% 35%,75% 100%,25% 100%,26% 35%,20% 52%,0 40%)}.gi-concept span,.gi-concept b{font-size:9px;letter-spacing:2px}.effect-art{position:relative;height:100%;display:grid;place-items:center;background:radial-gradient(circle,color-mix(in srgb,var(--accent) 25%,transparent),transparent 65%);color:var(--accent)}.effect-art b{font-size:76px;text-shadow:0 0 25px var(--accent)}.effect-art span{position:absolute;width:100px;height:100px;border:2px solid var(--accent);border-radius:50%;box-shadow:0 0 15px var(--accent);transform:rotateX(60deg) rotateZ(-25deg);animation:storepulse 2s ease-in-out infinite alternate}.effect-art span:nth-child(2){transform:rotateY(60deg);animation-delay:-1s}.effect-art.electric span{border-radius:10%;transform:rotate(35deg)}.effect-art.shadow b{filter:blur(2px)}@keyframes storepulse{to{opacity:.35;scale:1.25}}#shop-toast:not(:empty){position:fixed;bottom:40px;left:50%;transform:translateX(-50%);padding:14px 24px;border:1px solid #ff7655;background:#101923;z-index:30;font-size:13px}.shop-dialog{color:#f5f6f9;background:linear-gradient(140deg,#242c39,#0b1018);border:1px solid #ff7253;padding:32px;max-width:480px;width:90vw;box-shadow:0 30px 100px #000}.shop-dialog::backdrop{background:#000b;backdrop-filter:blur(5px)}.shop-dialog small{font-size:10px;letter-spacing:2px;color:#ff9b7d}.shop-dialog h2{font-size:28px}.shop-dialog p{font-size:14px;line-height:1.6;color:#c9d1dc}.shop-dialog>div{display:flex;justify-content:flex-end;gap:12px}.shop-dialog button{padding:14px 22px;border:1px solid #ffffff40;background:#151d2b}.shop-dialog button.solid{background:#e8553b}
@media(max-height:650px){.shop-heading h2{font-size:28px}.shop-heading .back{margin:0}.wallet strong{font-size:24px}.wallet button{padding:8px;font-size:11px}.shop-browse{height:calc(100% - 58px);padding-top:4px}.shop .fighter-switch{margin:0}.shop .tabs{margin:0}.shop-rail{min-height:210px;padding:9px 2px;gap:8px}.shop-card{height:205px;flex-basis:132px}.shop-card.selected{flex-basis:155px}.shop-art{height:142px}.shop-card-label{padding:9px}.shop-card-label b{font-size:13px}.shop-detail{padding:10px;bottom:0}.shop-detail h2{font-size:23px}.shop-detail p{font-size:11px}.shop-cta button{padding:10px;font-size:11px}.loadout button{min-height:45px}.shop-status{font-size:8px}.gi-concept i{height:58px;width:55px}}
@media(max-width:560px) and (orientation:portrait){.shop-browse{width:100%;padding-top:30vh}.shop-detail{position:relative;width:100%}.shop{overflow-y:auto}.shop-browse{height:auto}.wallet strong{font-size:20px}.wallet{gap:4px}.wallet button{font-size:10px;padding:8px}.shop-heading h2{font-size:28px}}
.pad-status{position:absolute;bottom:max(12px,env(safe-area-inset-bottom));left:24px;font-size:11px;letter-spacing:.08em;color:#9db7bf;pointer-events:none;z-index:4}.online-panel p{max-width:430px;line-height:1.6;color:#cad0d9}.online-panel button{margin:6px 8px 6px 0}.online-panel button:disabled{opacity:.45}button:focus-visible,a:focus-visible{outline:3px solid #6ee3eb;outline-offset:3px}
@media(max-height:600px){.home .menu-left h1{font-size:clamp(30px,7vh,58px);margin:10px 0}.home .menu-button{min-height:44px;padding:10px 16px}.home-nav{gap:6px}.pad-status{font-size:10px;bottom:4px}.online-panel h2{font-size:30px}.online-panel p{font-size:13px;margin:8px 0}}
#match-preparation{position:absolute;left:50%;bottom:0;transform:translateX(-50%);display:flex;align-items:center;gap:14px;pointer-events:auto;font-size:13px}#match-preparation button{padding:10px 14px;min-height:44px;border:1px solid #ffffff40;background:#101622;color:white}.match-spinner{width:20px;height:20px;border:2px solid #ffffff35;border-top-color:#ff6546;border-radius:50%;animation:match-spin 1s linear infinite}@keyframes match-spin{to{transform:rotate(360deg)}}

/* The complete preview remains clear: all item details and actions live on the left. */
.shop-browse .shop-detail{position:relative;inset:auto;width:100%;padding:12px 14px;margin:10px 0;background:linear-gradient(110deg,#141d2af5,#101722d9);border-left:2px solid #ff583c}
.shop-browse .shop-detail h2{font-size:clamp(19px,2vw,28px);margin:5px 0}
.shop-browse .shop-detail .shop-scope,.shop-browse .move-stats span{display:none}
.shop-browse .shop-cta{flex-wrap:wrap;margin-top:8px}
.shop-browse .shop-cta button{min-height:44px}
.shop .fighter-switch{display:flex;overflow-x:auto;flex-wrap:nowrap;scrollbar-width:thin}
.shop .fighter-switch button{flex:0 0 auto}
@media(max-height:650px){.shop-browse .shop-detail{padding:8px 10px;margin:7px 0}.shop-browse .shop-detail p{margin:4px 0}.shop-browse .shop-cta{margin-top:6px}}

.menu-music-toggle{position:absolute;z-index:15;bottom:10px;left:50%;transform:translateX(-50%);min-height:44px;padding:8px 12px;font-size:11px;color:#ddd;background:#10151dcc;border:1px solid #52606a}
.account-link{color:#fff;text-decoration:none;border-bottom:1px solid #f45438;padding:8px;pointer-events:auto;margin-left:auto;margin-right:12px;font-size:12px}footer{gap:8px}
/* FightXHub / silver & electric blue title-screen treatment. */
#shell[data-view=home]{color:#102b48;background:radial-gradient(ellipse at 77% 40%,#fff 0%,#dcebf5 32%,#eaf0f5 62%,#f7f9fb 100%);--line:#17395728;color-scheme:light}
#shell[data-view=home] .hero-city{opacity:.10;filter:grayscale(1);background-position:70% 50%}
#shell[data-view=home] .shade{background:linear-gradient(90deg,#f0f5faf5 0%,#edf3f9ee 29%,#edf3f933 51%,transparent 69%),linear-gradient(0deg,#eaf1f7 0%,transparent 23%)}
#shell[data-view=home] .ambient{background:linear-gradient(120deg,transparent 40%,#248dff12 52%,transparent 75%)}
#shell[data-view=home] .logo{color:#122e4a;letter-spacing:-1.5px}
#shell[data-view=home] .logo span{color:#456581;letter-spacing:2px}
#shell[data-view=home] .edition{color:#4c6c86}
#shell[data-view=home] main{inset:100px 5vw 82px}
#shell[data-view=home] .menu-left{padding-top:2vh;width:47%;padding-right:24px;scrollbar-color:#9eafbd transparent}
#shell[data-view=home] .eyebrow{color:#31699b;font-size:13px;font-weight:800;letter-spacing:3px;margin-bottom:18px}
#shell[data-view=home] h1{font-size:clamp(44px,6.6vw,100px);line-height:.92;margin-bottom:30px;letter-spacing:-4px;font-weight:950;text-shadow:0 3px 0 #fff}
#shell[data-view=home] h1 em{color:#0872eb;font-style:inherit}
#shell[data-view=home] .home-nav{width:min(460px,100%);gap:10px}
#shell[data-view=home] .menu-button{position:relative;background:#ffffffb8;color:#193b5b;border:1px solid #ffffff;border-left:4px solid #9ab1c7;padding:17px 22px;font-size:27px;box-shadow:0 5px 20px #214d7210;backdrop-filter:blur(8px);transition:transform .18s,box-shadow .18s,border-color .18s}
#shell[data-view=home] .menu-button small{color:#4b6a84;font-size:11px;letter-spacing:1px}
#shell[data-view=home] .menu-button.primary{background:linear-gradient(110deg,#0760d3,#148eff);color:white;border-color:#50a9ff;border-left-color:#b8e4ff;font-size:38px;padding-block:23px;box-shadow:0 9px 28px #0471eb36}
#shell[data-view=home] .menu-button.primary small{color:#e1f2ff}
#shell[data-view=home] .menu-button:hover{transform:translateX(6px);border-color:#148eff;box-shadow:0 8px 26px #1479ca28}
#shell[data-view=home] button:focus-visible,#shell[data-view=home] a:focus-visible{outline-color:#075fd2}
#shell[data-view=home] #preview,#shell[data-view=home] #fighter-still{width:58%;right:-1%;height:88%;top:4%}
#shell[data-view=home] #fighter-still img{filter:drop-shadow(0 16px 24px #2b6b9838);height:90%}
#shell[data-view=home] .preview-caption{right:4%;bottom:0;width:42%;padding:14px 18px;text-align:left;background:linear-gradient(90deg,#ffffffb0,#ffffff10);border:0;border-left:3px solid #178cff;text-shadow:none}
#shell[data-view=home] .preview-caption span{color:#406884;font-size:12px;letter-spacing:3px}
#shell[data-view=home] .preview-caption h2{font-size:clamp(34px,4vw,58px);color:#143654;margin:7px 0;letter-spacing:-2px}
#shell[data-view=home] .preview-caption h2 span{font-size:20px;color:#7898af;font-style:normal;letter-spacing:0}
#shell[data-view=home] .preview-caption p{color:#326a96;font-weight:bold}
#shell[data-view=home] footer{color:#496a84;bottom:14px;min-height:42px;padding-top:8px;font-size:11px;letter-spacing:1px}
#shell[data-view=home] .account-link{color:#123d67;border-bottom-color:#147eff;background:#ffffffb0;padding:10px 12px}
#shell[data-view=home] .menu-music-toggle{background:#eef5fd;color:#315a7a;border-color:#b8ccdc;bottom:65px;left:auto;right:4vw;transform:none;min-height:36px}
#shell[data-view=home] .pad-status{color:#3b6585}
@media(max-height:650px){
 #shell[data-view=home] main{inset:66px 4vw 52px}
 #shell[data-view=home] .menu-left{padding-top:0}
 #shell[data-view=home] .eyebrow{font-size:11px;margin-bottom:8px;letter-spacing:2px}
 #shell[data-view=home] h1{font-size:clamp(32px,8vh,54px);margin:0 0 13px;letter-spacing:-2px}
 #shell[data-view=home] .home-nav{gap:6px}
 #shell[data-view=home] .menu-button{font-size:20px;padding:10px 14px;min-height:44px}
 #shell[data-view=home] .menu-button.primary{font-size:27px;padding-block:12px}
 #shell[data-view=home] .preview-caption{padding:8px 14px;bottom:0}
 #shell[data-view=home] .preview-caption h2{font-size:32px;margin:3px 0}
 #shell[data-view=home] .menu-music-toggle{bottom:55px;font-size:10px;min-height:30px;padding:6px}
 #shell[data-view=home] footer{bottom:6px;min-height:34px;font-size:10px}
}
@media(max-width:560px) and (orientation:portrait){
 #shell[data-view=home] main{inset:85px 5vw 70px}
 #shell[data-view=home] #preview,#shell[data-view=home] #fighter-still{width:95%;height:49%;top:5%;right:-22%}
 #shell[data-view=home] .shade{background:linear-gradient(0deg,#edf3f9 12%,#edf3f9ee 40%,transparent 70%)}
 #shell[data-view=home] .menu-left{width:100%;padding:27vh 0 0}
 #shell[data-view=home] .eyebrow{font-size:11px;margin-bottom:10px}
 #shell[data-view=home] h1{font-size:48px;letter-spacing:-2px;margin-bottom:20px}
 #shell[data-view=home] .menu-button{font-size:23px;padding:14px 18px}
 #shell[data-view=home] .menu-button.primary{font-size:30px;padding-block:18px}
 #shell[data-view=home] .preview-caption{top:0;left:0;bottom:auto;width:39%;right:auto;padding:8px;background:transparent}
 #shell[data-view=home] .preview-caption h2{font-size:29px}
 #shell[data-view=home] .preview-caption h2 span{display:none}
 #shell[data-view=home] .preview-caption span{font-size:10px;letter-spacing:1px}
 #shell[data-view=home] footer{font-size:10px;flex-wrap:wrap}
 #shell[data-view=home] .menu-music-toggle{bottom:64px}
}