/* HostStorm Pepsiman Public Launcher v2 - non-invasive skin; runtime remains original */
:root,
:root[data-theme="dark"] {
  color-scheme:dark;
  --background:#050a12;
  --surface:#0a1628;
  --surface-soft:#09111d;
  --foreground:#f5faff;
  --muted:#b8c5d6;
  --subtle:#6f89a6;
  --border:rgba(69,133,200,.30);
  --border-hover:rgba(53,151,255,.66);
  --button:#1268ed;
  --button-text:#fff;
}
html{scroll-behavior:smooth}
body{background:radial-gradient(ellipse 78% 48% at 78% 8%,#06326d 0%,#070f20 56%,#03070e 100%) fixed!important;color:#f3f8ff}
body::before{content:"";position:fixed;z-index:-1;inset:0;background:linear-gradient(110deg,rgba(0,0,0,.45) 0,transparent 58%),repeating-linear-gradient(110deg,transparent 0 56px,rgba(56,124,233,.018) 58px 59px);pointer-events:none}
.site-shell{width:min(1510px,100%);padding:26px clamp(20px,4.3vw,68px) 40px;position:relative}
.site-header{position:relative;z-index:6;margin-bottom:clamp(45px,7vw,100px);font-weight:650;color:#bdcce0;letter-spacing:.15em}
.site-header > a{display:inline-flex;align-items:center;gap:19px;color:#edf5ff;font-size:13px;letter-spacing:.38em}
.site-header > a::before{content:"";display:inline-block;width:35px;height:35px;border-radius:50%;background:linear-gradient(178deg,#e32838 0 43%,#fafafa 43% 55%,#145fd4 55% 100%);box-shadow:0 0 0 2px #fff,0 0 21px #2c84ff50;transform:rotate(-16deg)}
.header-actions{gap:32px;font-size:13px;letter-spacing:.05em}
.header-actions a{color:#c0cce0}
.header-actions a:hover{color:#fff}
.header-actions a[href*="github"],.header-label{display:none}
.theme-toggle{width:46px;height:46px;border-color:#4b5e794d;background:#182235c7;color:#dbe9fa;font-size:16px}
.app-layout{position:relative;grid-template-columns:minmax(340px,.84fr) minmax(0,1.65fr);align-items:end;gap:clamp(28px,3.6vw,63px);isolation:isolate}
.app-layout::before{content:"";pointer-events:none;position:absolute;z-index:-1;top:-110px;right:-66px;width:min(77vw,1090px);height:590px;background:linear-gradient(90deg,#06101f 0%,transparent 32%,transparent 68%,#030b18 100%),linear-gradient(0deg,#030b18 1%,transparent 45%),url('/assets/pepsiman-hero.jpg') 62% 37%/cover no-repeat;mask-image:linear-gradient(180deg,black 0%,black 56%,transparent 100%);filter:saturate(1.2) contrast(1.08);opacity:.95}
.app-layout::after{content:"";position:absolute;z-index:-1;top:-40px;right:0;width:55%;height:320px;pointer-events:none;background:linear-gradient(100deg,transparent 0%,#006eff2c 40%,transparent 84%);filter:blur(90px)}
.intro{align-self:stretch;padding-top:18px}
.release-line{color:#68b4ff;font-size:12px;margin-bottom:24px;font-weight:650;letter-spacing:.24em}
h1{font-size:clamp(53px,5.2vw,85px);line-height:1.02;max-width:600px;font-weight:800;letter-spacing:-.07em;text-shadow:0 8px 40px #0008}
h1 em{font-style:normal;background:linear-gradient(140deg,#7edcff 0%,#0a64ef 60%,#a1e1ff 96%);background-clip:text;-webkit-background-clip:text;color:transparent}
.intro-summary{grid-template-columns:minmax(0,1fr) clamp(90px,9vw,154px);max-width:490px;align-items:center;margin-top:31px;gap:20px}
.lede{font-size:16px;line-height:1.7;color:#b3c2d9}
.redrink-art{border:1px solid #1f6eba80;border-radius:12px;box-shadow:0 12px 45px #000b,0 0 38px #067aff2a;aspect-ratio:1/1}
.framework-credit{display:none}
.feature-preview{max-width:480px;margin-top:44px;border-top:0;padding-top:0}
.feature-preview-list{gap:27px}
.feature-preview-item{display:grid;grid-template-columns:62px 1fr;gap:16px;align-items:center;font-size:13px;line-height:1.6}
.feature-preview-item .feature-icon{display:grid;place-items:center;border:1px solid #2584e6a6;width:56px;height:56px;border-radius:50%;background:linear-gradient(160deg,#0c397488,#04152a);box-shadow:inset 0 0 25px #006fff16;color:#60b6ff;font-size:24px}
.feature-copy{display:flex;flex-direction:column;gap:3px}
.feature-preview-item strong{color:#fff;font-size:16px;font-weight:760}
.feature-preview-item .feature-copy span{color:#b0c0d5}
.feature-explore{display:none}
.pepsi-slogan{margin:23px 0 0;border-top:1px solid #315d927a;padding-top:20px;color:#75b7ff;font-size:24px;line-height:1.1;font-style:italic;font-weight:850;letter-spacing:.025em;transform:rotate(-5deg);text-shadow:0 0 21px #1266e780}
.game-card{align-self:end;margin-top:235px;overflow:hidden;min-width:0;border:1px solid #1e83ff96;background:linear-gradient(125deg,#061222f2,#08162bdf 65%,#08101ce9);border-radius:20px;box-shadow:0 30px 110px #000d,0 0 38px #0d5cda25;position:relative;backdrop-filter:blur(18px)}
.game-card::before{content:"";pointer-events:none;position:absolute;inset:0 0 auto 0;height:260px;background:linear-gradient(90deg,#051326ea 14%,#091e3e99),url('/assets/pepsiman-hero.jpg') 48% 58%/cover;opacity:.22;z-index:-1}
.panel{padding:34px clamp(20px,3vw,38px) 30px}
.panel-heading{margin-bottom:14px;align-items:center}
.section-label{letter-spacing:.29em;font-size:11px;color:#78b7ff;font-weight:700}
.panel-heading h2{font-size:clamp(26px,2.8vw,37px);font-weight:850;letter-spacing:-.042em;color:#fff;margin-top:9px}
#status{display:block;text-align:right;color:#94caff;font-size:11px;max-width:235px;line-height:1.45;letter-spacing:0;overflow-wrap:anywhere}
.privacy-copy{margin-bottom:24px;font-size:15px;line-height:1.7;color:#bdcee5}
body:not(.running) .inputs{display:none!important}
body:not(.running) #session-tools-note,body:not(.running) #log{display:none}
.actions{display:grid;grid-template-columns:minmax(120px,1.6fr) repeat(5,minmax(72px,1fr));align-items:stretch;gap:10px;margin:30px 0 10px}
.actions .action-button{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:62px;min-width:0;padding:8px 10px;white-space:nowrap;border-radius:12px;font-size:13px;font-weight:700;letter-spacing:-.02em;transition:filter .18s,background .18s,border .18s,transform .18s}
.actions .action-button:hover:not(:disabled){transform:translateY(-2px)}
.actions #start{background:linear-gradient(155deg,#37a9ff 0%,#1263ee 70%,#1554d9 100%);border:1px solid #71cfff;color:white;font-size:16px;box-shadow:0 0 24px #0878ff65}
.actions #start::before{content:"▶";font-size:23px}
.actions #saves::before{content:"▣";font-size:23px}
.actions #controls::before{content:"♧";font-size:23px}
.actions #settings::before{content:"⚙";font-size:22px}
.actions #install-app::before{content:"⇩";font-size:22px}
.actions #fullscreen::before{content:"▣";font-size:21px}
.actions #pause::before{content:"Ⅱ";font-size:19px}
.actions #levels::before{content:"▤";font-size:19px}
.actions .action-button.secondary{background:linear-gradient(160deg,#162841c9,#071525cf);color:#e6efff;border:1px solid #45698c75;box-shadow:inset 0 1px 0 #ffffff13}
.actions .action-button.secondary:hover{border-color:#4fa7ff;background:#142c4d}
.actions #install-app[hidden]{display:flex!important}
.actions #start:disabled{opacity:.55;filter:saturate(.4)}
.leaderboard-browser{border-top:1px solid #4075a354;background:linear-gradient(120deg,#071527ba,#071424dd)}
.leaderboard-browser-heading{padding:27px clamp(20px,3vw,38px);min-height:155px;position:relative}
.leaderboard-browser-heading::before{content:"♛";font-size:75px;color:#257bfa;opacity:.60;position:absolute;right:24%;top:22%;text-shadow:0 0 25px #236bda}
.leaderboard-browser-heading::after{content:"›";font-family:system-ui;font-size:34px;font-weight:300;color:#6bb8ff}
.leaderboard-browser[open] .leaderboard-browser-heading::after{content:"⌄"}
.leaderboard-browser-heading h2{font-size:29px;letter-spacing:-.04em;font-weight:850;color:#fff}
.leaderboard-browser-pb{z-index:1;align-self:end;max-width:180px;letter-spacing:0;font-size:11px}
.leaderboard-browser-body{padding:22px 35px;border-top:1px solid #1c4e7a91}
.leaderboard-filter span{font-size:10px;color:#b9c9de}
.leaderboard-filter select{background:#0b2035;color:#e8f4ff;border-color:#30547d;height:41px;font-size:13px}
.leaderboard-browser-status{font-size:12px}
.screen{border-color:#2d7cdd}
.hoststorm-footer{color:#67819d;text-align:center;font-size:11px;margin-top:42px;line-height:1.6}
.hoststorm-footer a{text-decoration:underline;text-decoration-color:#244672}
.hoststorm-toast{position:fixed;z-index:99999;bottom:25px;left:50%;transform:translateX(-50%);width:min(440px,calc(100vw - 30px));padding:18px;border:1px solid #3d97fa;background:#0a1a2cee;box-shadow:0 20px 70px #000b;border-radius:14px;color:#fff;font-size:14px;line-height:1.6}
.hoststorm-toast[hidden]{display:none}
:root[data-theme="light"] body{background:radial-gradient(ellipse at 65% 0,#124e83,#07152a 80%) fixed!important}
body.running{background:#020810!important}
body.running::before,.running .app-layout::before,.running .app-layout::after,.running .game-card::before{display:none}
body.running .site-header{z-index:30}
body.running .site-shell{width:min(1600px,100%)}
body.running .app-layout{display:block}
body.running .game-card{margin:0;border-radius:12px;background:#05101e}
body.running .panel{padding:9px 15px}
body.running .panel-heading{margin:0}
body.running .actions{display:flex;flex-wrap:wrap;margin:0;gap:7px}
body.running .actions .action-button{min-height:42px;padding:7px 11px;font-size:12px}
body.running .actions #start{display:none}
body.running .actions #install-app{display:none!important}
body.running .screen{height:100%}
body.running .leaderboard-browser,body.running .hoststorm-footer{display:none}
@media(max-width:1250px){
 .app-layout{grid-template-columns:minmax(290px,1fr) minmax(0,1.55fr)}
 .app-layout::before{right:-15px;height:480px}
 .actions{grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}
 .actions #start{grid-column:span 3}
 .game-card{margin-top:230px}
}
@media(max-width:850px){
 .site-shell{padding:18px 20px 30px}
 .site-header{margin-bottom:280px}
 .app-layout{display:flex;flex-direction:column;align-items:stretch}
 .app-layout::before{top:-330px;right:-20px;width:100vw;height:420px;background-position:64% 40%}
 .intro{padding:0}
 .release-line{margin-bottom:10px}
 h1{font-size:clamp(42px,11vw,76px)}
 .intro-summary{max-width:none}
 .feature-preview{margin-top:26px}
 .feature-preview-list{grid-template-columns:repeat(3,1fr);gap:9px}
 .feature-preview-item{display:flex;flex-direction:column;align-items:flex-start;gap:8px}
 .feature-preview-item .feature-icon{width:44px;height:44px;font-size:19px}
 .feature-copy strong{font-size:13px}
 .feature-copy span{font-size:11px}
 .game-card{margin-top:25px}
 .header-actions{gap:12px}
 .site-header > a{font-size:11px;letter-spacing:.20em}
 .panel{padding:24px}
}
@media(max-width:540px){
 .site-header{margin-bottom:195px}
 .app-layout::before{top:-233px;height:300px}
 .header-actions a:not(.nav-play){display:none}
 .intro-summary{grid-template-columns:1fr 105px;gap:13px}
 .lede{font-size:13px}
 .feature-preview-list{grid-template-columns:1fr;gap:10px}
 .feature-preview-item{flex-direction:row;align-items:center}
 .pepsi-slogan{font-size:19px}
 .panel-heading{display:block}
 #status{text-align:left;margin-top:10px;max-width:100%}
 .actions{grid-template-columns:repeat(2,minmax(0,1fr))}
 .actions #start{grid-column:span 2}
 .actions .action-button{min-height:52px;font-size:12px}
 .leaderboard-browser-heading{min-height:124px}
 .leaderboard-browser-heading h2{font-size:23px}
 .leaderboard-browser-heading::before{right:18%;font-size:57px}
 .leaderboard-browser-pb{display:none}
 body.running .header-actions .theme-toggle{display:none}
 body.running .actions{display:flex}
 body.running .actions .action-button{flex:1 1 auto}
}