/* v2.1 — exact approved PoolPlay Hub header artwork */
.approved-hero{
  width:100%;
  overflow:hidden;
  border-radius:34px;
  background:#00101f;
  box-shadow:0 18px 60px rgba(0,0,0,.30);
}
.approved-hero img{
  display:block;
  width:100%;
  height:auto;
  object-fit:contain;
}
@media(max-width:680px){
  .approved-hero{
    border-radius:20px;
  }
  .approved-hero img{
    width:100%;
  }
}


:root{
  color-scheme:dark;
  --bg:#020b14;
  --panel:#071725;
  --panel2:#0a1c2b;
  --line:#183c59;
  --text:#f7f9fb;
  --muted:#b3c1cf;
  --gold:#ffc526;
  --gold2:#f6a90e;
  --green:#3ee584;
  --blue:#0b7fe7;
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif
}
*{box-sizing:border-box}
html{background:var(--bg);scroll-behavior:smooth}
body{margin:0;background:
radial-gradient(circle at 18% 0%,rgba(15,76,121,.22),transparent 34%),
linear-gradient(#020b14,#03101d 58%,#020913);color:var(--text)}
a{text-decoration:none;color:inherit}
button,a{-webkit-tap-highlight-color:transparent}
.page-shell{width:min(1480px,calc(100% - 36px));margin:auto;padding:22px 0 max(40px,env(safe-area-inset-bottom))}
.stadium-hero{min-height:270px;border:1px solid #145486;border-radius:34px;position:relative;overflow:hidden;display:grid;grid-template-columns:390px 1fr;align-items:center;padding:18px 55px;background:
linear-gradient(180deg,rgba(0,19,37,.34),rgba(0,10,18,.25)),
radial-gradient(ellipse at 50% 110%,rgba(18,100,47,.58),transparent 36%),
linear-gradient(100deg,#001023,#041a2b 50%,#001023);
box-shadow:inset 0 0 0 1px rgba(255,255,255,.015),0 18px 60px rgba(0,0,0,.3)}
.stadium-hero:before,.stadium-hero:after{content:"";position:absolute;bottom:-50px;width:60%;height:110px;border-top:2px solid rgba(255,255,255,.42);border-radius:50%;opacity:.45}
.stadium-hero:before{left:-12%;transform:rotate(-3deg)}.stadium-hero:after{right:-12%;transform:rotate(3deg)}
.hero-logo-wrap{z-index:2;display:flex;justify-content:center}.pph-crest{width:min(310px,100%);height:235px;object-fit:cover;object-position:center;border-radius:40px;mix-blend-mode:screen}
.hero-copy{z-index:2;align-self:center}.hero-kicker{margin:0 0 4px;color:var(--gold);font-size:1.05rem;font-weight:900;letter-spacing:.24em;white-space:nowrap}
h1{margin:0;font-size:clamp(4rem,7vw,7.4rem);line-height:.92;letter-spacing:-.055em;font-style:italic;text-shadow:0 7px 5px #000}
h1 span{background:linear-gradient(#fff,#cfd4da);-webkit-background-clip:text;color:transparent}h1 strong{background:linear-gradient(#ffe06b,#f5a500);-webkit-background-clip:text;color:transparent}
.gold-swoosh{height:7px;width:88%;margin:14px 0 13px;background:linear-gradient(90deg,transparent,var(--gold) 8%,var(--gold2) 82%,transparent);clip-path:polygon(0 70%,48% 0,100% 45%,100% 70%,49% 35%,0 100%)}
.hero-actions{display:flex;align-items:center;justify-content:center;gap:30px;font-size:1.25rem;letter-spacing:.14em}
.hero-actions>div{display:flex;align-items:center;gap:10px}.hero-actions i,.hub-strip i{width:9px;height:9px;border-radius:50%;background:var(--gold)}
.status-pill{position:absolute;top:22px;right:28px;z-index:3;padding:10px 17px;border:1px solid rgba(62,229,132,.32);background:#043127cc;border-radius:999px;color:#a4f7c8;font-weight:900}.status-pill span,.card-live span{display:inline-block;width:11px;height:11px;background:var(--green);border-radius:50%;margin-right:9px;box-shadow:0 0 0 6px rgba(62,229,132,.12)}
.field-lines{position:absolute;left:390px;right:0;bottom:-5px;height:38px;text-align:center;color:#8f979d66;font-size:3rem;font-weight:900;z-index:1}
.stadium-lights{position:absolute;top:45px;width:125px;height:82px;background:radial-gradient(circle,#fff 0 12%,#a8dcff 18%,transparent 48%);filter:drop-shadow(0 0 18px #70c7ff);opacity:.85}.stadium-lights.left{left:-32px}.stadium-lights.right{right:-32px}
.choose-heading{margin:22px 0 10px}.eyebrow,.card-label{margin:0;color:var(--gold);font-weight:950;letter-spacing:.16em;font-size:.95rem}.choose-heading h2{font-size:clamp(2.4rem,4.5vw,4rem);margin:3px 0 0;letter-spacing:-.045em}
.app-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.pool-card{position:relative;overflow:hidden;min-height:540px;border:1px solid #1b5b8b;border-radius:28px;background:linear-gradient(180deg,#081b2b,#04111d);display:flex;flex-direction:column;padding:20px 24px 22px;box-shadow:0 18px 54px rgba(0,0,0,.26)}
.h2h-card{background:linear-gradient(160deg,#111315 0 35%,#07131e 70%)}.h2h-card:before{content:"";position:absolute;right:-55px;top:-40px;width:150px;height:120%;background:linear-gradient(120deg,transparent 22%,rgba(255,182,14,.42) 23% 27%,transparent 28% 58%,rgba(255,182,14,.28) 59% 62%,transparent 63%);transform:rotate(5deg)}
.card-live{position:absolute;top:18px;right:18px;z-index:5;padding:8px 12px;border:1px solid rgba(62,229,132,.3);background:#073a2ddd;border-radius:999px;font-weight:950}.card-live span{width:10px;height:10px;margin-right:7px}
.logo-stage{height:275px;display:flex;align-items:center;justify-content:center;position:relative;z-index:2}.logo-stage img{max-width:92%;max-height:260px;object-fit:contain}.h2h-stage img,.pool33-stage img{border-radius:30px;mix-blend-mode:screen}.survivor-stage img{max-width:86%;max-height:270px}
.card-copy{position:relative;z-index:2}.card-label{font-size:.82rem;margin:0 0 6px}.card-label.green{color:#41e971}.card-copy h3{font-size:2.25rem;margin:0 0 8px;letter-spacing:-.04em}.card-copy>p:last-child{color:#c5d0da;font-size:1.05rem;line-height:1.52;margin:0 0 18px}
.launch-button{position:relative;z-index:2;margin-top:auto;min-height:60px;border-radius:16px;display:grid;grid-template-columns:48px 1fr 42px;align-items:center;padding:0 12px 0 16px;font-size:1.15rem;font-weight:900;box-shadow:inset 0 1px rgba(255,255,255,.32)}.launch-button .arrow{font-size:2rem;text-align:center}.gold-button{color:#081018;background:linear-gradient(#ffd84d,#ffb10f)}.blue-button{background:linear-gradient(#168bed,#094997)}.green-button{background:linear-gradient(#32bd50,#097c28)}
.feature-icon,.btn-icon,.strip-icon{display:inline-block;position:relative;flex:0 0 auto}.target-icon{width:26px;height:26px;border:3px solid #fff;border-radius:50%}.target-icon:before,.target-icon:after{content:"";position:absolute;background:#fff}.target-icon:before{width:3px;height:34px;left:9px;top:-7px}.target-icon:after{height:3px;width:34px;top:9px;left:-7px}.chart-icon{width:28px;height:25px;border-left:4px solid var(--gold);border-bottom:4px solid var(--gold);clip-path:polygon(0 0,100% 0,100% 100%,0 100%)}.chart-icon:after{content:"↗";position:absolute;left:5px;top:-11px;color:var(--gold);font-size:30px;font-weight:900}.trophy-icon{width:25px;height:21px;border:5px solid var(--gold);border-top:0;border-radius:0 0 10px 10px}.trophy-icon:before{content:"";position:absolute;width:6px;height:12px;background:var(--gold);left:5px;top:17px;box-shadow:-7px 12px 0 2px var(--gold)}.trophy-icon.dark{border-color:#111}.trophy-icon.dark:before{background:#111;box-shadow:-7px 12px 0 2px #111}
.survivor-icon{width:34px;height:38px;background:#fff;clip-path:polygon(50% 0,92% 14%,85% 70%,50% 100%,15% 70%,8% 14%)}.survivor-icon:after{content:"★";position:absolute;inset:6px 0 0;text-align:center;color:#22569c;font-size:20px}
.football-icon{width:34px;height:22px;background:#fff;border-radius:55% 48%;transform:rotate(-30deg)}.football-icon:after{content:"";position:absolute;width:13px;height:2px;background:#178e35;left:10px;top:10px;box-shadow:3px -4px 0 -1px #178e35,3px 4px 0 -1px #178e35}
.hub-strip{margin:16px auto 0;width:min(1040px,100%);min-height:62px;border:1px solid #143c5b;border-radius:18px;background:#051421;display:flex;align-items:center;justify-content:center;gap:32px;color:#dce3e9;letter-spacing:.16em}.hub-strip>div{display:flex;align-items:center;gap:13px}.shield-icon{width:28px;height:32px;border:3px solid var(--gold);clip-path:polygon(50% 0,100% 20%,88% 72%,50% 100%,12% 72%,0 20%)}.people-icon:before{content:"♟♟♟";font-size:28px;color:#d5a52c;letter-spacing:-7px}.star-icon:before{content:"★";font-size:34px;color:var(--gold)}
.info-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:18px}.info-card{background:#061522;border:1px solid #153a55;border-radius:22px;padding:24px}.info-card h2{margin:3px 0 12px;font-size:1.65rem}.steps{display:grid;gap:10px}.steps>div{display:flex;align-items:center;gap:12px;background:#0a1d2c;border-radius:13px;padding:11px 13px}.steps span{width:29px;height:29px;border-radius:50%;display:grid;place-items:center;background:#2e2610;color:var(--gold);font-weight:900}.steps p{margin:0;color:var(--muted)}.muted{color:var(--muted)}.email-list{border-top:1px solid #1b3547}.email-list>div{display:flex;justify-content:space-between;gap:14px;border-bottom:1px solid #1b3547;padding:11px 0}.email-list span{color:var(--muted);word-break:break-word;text-align:right}.install-button{margin-top:15px;border:0;border-radius:13px;background:linear-gradient(#ffd84d,#ffb10f);color:#07111b;padding:12px 18px;font-weight:950;font-size:1rem}
footer{display:flex;align-items:center;gap:13px;padding:25px 8px 6px;color:#9babb9}footer img{width:42px;height:42px;border-radius:11px}footer div{display:flex;flex-direction:column}footer strong{color:#e4ebf1}
@media(max-width:1040px){.stadium-hero{grid-template-columns:260px 1fr;padding:20px}.pph-crest{height:200px}.hero-kicker{font-size:.72rem;white-space:normal}.hero-actions{gap:14px;font-size:.95rem}.field-lines{left:260px}.app-grid{grid-template-columns:1fr}.pool-card{min-height:500px}.logo-stage{height:300px}.info-grid{grid-template-columns:1fr}}
@media(max-width:680px){.page-shell{width:calc(100% - 18px);padding-top:9px}.stadium-hero{display:flex;flex-direction:column;min-height:390px;padding:55px 15px 20px;border-radius:24px}.hero-logo-wrap{height:128px}.pph-crest{height:128px;width:170px}.hero-copy{text-align:center}.hero-kicker{font-size:.66rem;margin-top:3px}.hero-copy h1{font-size:3.2rem}.gold-swoosh{margin-left:auto;margin-right:auto}.hero-actions{font-size:.78rem;letter-spacing:.08em}.hero-actions i{width:6px;height:6px}.status-pill{top:12px;right:12px;font-size:.73rem}.field-lines{left:0}.choose-heading h2{font-size:2.25rem}.choose-heading{margin-left:5px}.pool-card{padding:18px;min-height:480px;border-radius:22px}.logo-stage{height:235px}.card-copy h3{font-size:1.9rem}.card-copy>p:last-child{font-size:.98rem}.hub-strip{flex-wrap:wrap;padding:15px;gap:13px 20px;font-size:.68rem}.hub-strip i{display:none}.email-list>div{flex-direction:column}.email-list span{text-align:left}footer{padding-bottom:20px}}


/* v2.3 — compact desktop layout
   Keeps the approved branding, but reduces the overall scale so the
   full three app cards are visible together on a typical desktop screen. */
@media (min-width: 1041px) {
  .page-shell{
    width:min(1260px,calc(100% - 30px));
    padding-top:14px;
  }

  .approved-hero{
    width:100%;
    border-radius:26px;
    box-shadow:0 14px 44px rgba(0,0,0,.26);
  }

  .choose-heading{
    margin:14px 0 7px;
  }

  .eyebrow,
  .card-label{
    font-size:.76rem;
  }

  .choose-heading h2{
    font-size:clamp(2rem,3vw,2.85rem);
    line-height:1;
    margin-top:3px;
  }

  .app-grid{
    gap:13px;
  }

  .pool-card{
    min-height:398px;
    padding:13px 16px 14px;
    border-radius:21px;
  }

  .card-live{
    top:12px;
    right:12px;
    padding:6px 9px;
    font-size:.78rem;
  }

  .card-live span{
    width:8px;
    height:8px;
    margin-right:6px;
  }

  .logo-stage{
    height:180px;
  }

  .logo-stage img{
    max-width:82%;
    max-height:174px;
  }

  .survivor-stage img{
    max-width:72%;
    max-height:178px;
  }

  .h2h-stage img,
  .pool33-stage img{
    border-radius:22px;
  }

  .card-label{
    margin-bottom:4px;
  }

  .card-copy h3{
    font-size:1.62rem;
    margin-bottom:5px;
  }

  .card-copy>p:last-child{
    font-size:.88rem;
    line-height:1.38;
    margin-bottom:10px;
  }

  .launch-button{
    min-height:47px;
    grid-template-columns:36px 1fr 30px;
    padding:0 9px 0 12px;
    border-radius:12px;
    font-size:.94rem;
  }

  .launch-button .arrow{
    font-size:1.45rem;
  }

  .btn-icon.trophy-icon{
    transform:scale(.82);
    transform-origin:center;
  }

  .btn-icon.survivor-icon{
    transform:scale(.76);
    transform-origin:center;
  }

  .btn-icon.football-icon{
    transform:rotate(-30deg) scale(.82);
    transform-origin:center;
  }

  .hub-strip{
    margin-top:10px;
    min-height:48px;
    gap:24px;
    font-size:.75rem;
    border-radius:15px;
  }

  .hub-strip>div{
    gap:9px;
  }

  .info-grid{
    margin-top:13px;
  }
}


/* v2.5 — balanced app-logo stages */
@media (min-width: 1041px) {
  .logo-stage{
    height:176px;
  }

  .logo-stage img{
    width:166px;
    height:166px;
    max-width:none;
    max-height:none;
    object-fit:contain;
    border-radius:18px;
  }

  .survivor-stage img{
    width:166px;
    height:166px;
    max-width:none;
    max-height:none;
    object-fit:contain;
    border-radius:18px;
  }

  .h2h-stage img,
  .pool33-stage img{
    mix-blend-mode:normal;
    border-radius:18px;
  }
}


/* v2.6 — final desktop fit
   Slightly shortens the desktop layout so the full app cards,
   including all three launch buttons, fit on screen together. */
@media (min-width: 1041px) {
  .page-shell{
    padding-top:10px;
  }

  .approved-hero{
    max-height:238px;
  }

  .approved-hero img{
    max-height:238px;
    object-fit:cover;
  }

  .choose-heading{
    margin:10px 0 5px;
  }

  .choose-heading h2{
    font-size:clamp(1.9rem,2.75vw,2.6rem);
    line-height:.98;
  }

  .app-grid{
    gap:12px;
  }

  .pool-card{
    min-height:372px;
    padding:11px 14px 12px;
  }

  .logo-stage{
    height:156px;
  }

  .logo-stage img,
  .survivor-stage img{
    width:148px;
    height:148px;
  }

  .card-copy h3{
    font-size:1.5rem;
    margin-bottom:4px;
  }

  .card-copy>p:last-child{
    font-size:.83rem;
    line-height:1.32;
    margin-bottom:8px;
  }

  .launch-button{
    min-height:43px;
    font-size:.9rem;
  }

  .hub-strip{
    min-height:44px;
    margin-top:8px;
  }

  .info-grid{
    margin-top:10px;
  }
}


/* v2.7 — compact chooser bar
   Reworks the "Choose Your Game / What's your play today?" area into
   one clean horizontal desktop bar to save vertical space and visually
   connect the hero banner to the three pool cards. */
@media (min-width: 1041px) {
  .choose-heading{
    min-height:54px;
    margin:8px 0 5px;
    padding:0 16px;
    display:flex;
    align-items:center;
    gap:18px;
    border-left:4px solid var(--gold);
    background:linear-gradient(90deg,rgba(255,197,38,.07),rgba(255,197,38,0) 58%);
    border-radius:8px;
  }

  .choose-heading .eyebrow{
    margin:0;
    flex:0 0 auto;
    padding:7px 10px;
    border:1px solid rgba(255,197,38,.32);
    border-radius:999px;
    background:rgba(255,197,38,.08);
    font-size:.72rem;
    line-height:1;
    white-space:nowrap;
  }

  .choose-heading h2{
    margin:0;
    font-size:2rem;
    line-height:1;
    letter-spacing:-.035em;
    white-space:nowrap;
  }

  .app-grid{
    margin-top:0;
  }
}


/* v2.8 — clean chooser transition
   Removes the tab-like gold rail and outlined pill on the left.
   Keeps the section compact, but lets the headline read more naturally. */
@media (min-width: 1041px) {
  .choose-heading{
    min-height:48px;
    margin:7px 0 5px;
    padding:0 4px;
    gap:13px;
    border-left:0;
    background:none;
    border-radius:0;
  }

  .choose-heading .eyebrow{
    margin:0;
    padding:0;
    border:0;
    border-radius:0;
    background:none;
    font-size:.72rem;
    line-height:1;
    letter-spacing:.16em;
  }

  .choose-heading .eyebrow::after{
    content:"•";
    display:inline-block;
    margin-left:13px;
    color:var(--gold);
    font-size:.9rem;
    transform:translateY(-1px);
  }

  .choose-heading h2{
    font-size:1.95rem;
  }
}