/* The get-the-app block (build.py getapp(), 28 Sep 2026). Loaded by every page that carries it:
   .ga-a is the framed poster under every guide, .gh the edge-to-edge homepage band. Both pages
   define the fonts; the names below cover the guide pages (Display) and the homepage. */
[data-getapp]{--ga-display:"Big Shoulders Display",Display,Impact,sans-serif;--ga-body:Archivo,system-ui,sans-serif;--ga-mono:"IBM Plex Mono",ui-monospace,SFMono-Regular,Menlo,monospace;--ga-sunset:linear-gradient(100deg,#ff3d8b 0%,#ff7a45 55%,#ffc75a 100%);--ga-ink:#0b0a18;--ga-tape-ink:#1b0820;--ga-gold:#ffcf40;--ga-muted:#b8b1cf;position:relative;isolation:isolate}
[data-getapp] [hidden]{display:none!important}
.ga-sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
[data-getapp] h2{margin:0;color:#fff;font-family:var(--ga-display);font-weight:900;text-transform:uppercase;-webkit-text-stroke:.07em #000;paint-order:stroke fill;text-shadow:.05em .06em 0 #000}
[data-getapp] .glyph{width:1.05em;height:1.05em;flex:0 0 auto}
.ga-tabs{display:flex}
.ga-tabs [role=tab]{margin:0;display:inline-flex;align-items:center;gap:.45em;white-space:nowrap;cursor:pointer}
.ga-store img{display:block;height:56px;width:auto}
.ga-qr{display:flex;align-items:center;gap:12px;padding:9px 16px 9px 9px;background:#fff;color:var(--ga-ink);text-decoration:none;box-shadow:5px 5px 0 #000;transform:rotate(-1.5deg)}
.ga-qr:hover{color:var(--ga-ink)}
.ga-qr img{display:block;width:84px;height:84px}
.ga-qr span{display:block;font:500 .8rem/1.25 var(--ga-body);color:#4b4560}
.ga-qr b{display:block;margin-bottom:4px;font:900 1.35rem/.95 var(--ga-display);letter-spacing:.04em;text-transform:uppercase;color:var(--ga-ink)}
.ga-form{display:flex;gap:10px;max-width:520px;margin:22px 0 10px}
.ga-form input[type=email]{flex:1;min-width:0;max-width:none;margin:0;padding:15px 16px;background:#fff;color:var(--ga-ink);border:3px solid #000;border-radius:0;box-shadow:4px 4px 0 #000;font:500 1rem var(--ga-body)}
.ga-form button{margin:0;padding:0 22px;border:3px solid #000;border-radius:0;background:var(--ga-sunset);color:var(--ga-tape-ink);box-shadow:4px 4px 0 #000;font:900 1.2rem/1 var(--ga-display);letter-spacing:.06em;text-transform:uppercase;cursor:pointer}
.ga-form button:hover{background:var(--ga-gold);color:var(--ga-tape-ink)}
.ga-status{margin:0;font-weight:600;color:#fff}
.ga-status:empty{display:none}
.ga-small{margin:6px 0 0;font-size:.82rem;color:#cfc6ea;max-width:none}
.ga-small a{color:inherit}
.ga-free{margin:0;font:600 .72rem/1.4 var(--ga-mono);letter-spacing:.14em;text-transform:uppercase;color:#cfc6ea}
.ga-lead{margin:0;max-width:46ch;color:#ece6ff;font-size:1.08rem}

/* ---------------------------------------------------------------- under every guide: the cover poster */
.ga-a{margin:64px 0 0;padding:12px;background:#030205;box-shadow:0 40px 90px -40px rgba(255,61,139,.6)}
.ga-a .ga-art{position:absolute;inset:12px;width:calc(100% - 24px);height:calc(100% - 24px);object-fit:cover;object-position:50% 40%;z-index:-2}
.ga-a::before{content:"";position:absolute;inset:12px;z-index:-1;background:linear-gradient(90deg,rgba(11,10,24,.96) 0%,rgba(11,10,24,.86) 40%,rgba(11,10,24,.2) 72%,rgba(11,10,24,0) 100%)}
.ga-a .ga-tabs{gap:12px;padding:26px 30px 0}
.ga-a [role=tab]{padding:.6rem .85rem .5rem;border:0;border-radius:0;background:#000;color:#fff;box-shadow:3px 3px 0 #000;font:900 1.1rem/1 var(--ga-display);letter-spacing:.1em;text-transform:uppercase;transform:rotate(-2deg)}
.ga-a [role=tab]+[role=tab]{transform:rotate(1.5deg)}
.ga-a [role=tab]:hover{background:#1d1830;color:#fff}
.ga-a [role=tab][aria-selected=true]{background:var(--ga-sunset);color:var(--ga-tape-ink);box-shadow:4px 4px 0 #000}
.ga-a .ga-body{display:grid;grid-template-columns:1.2fr .8fr;align-items:center;gap:10px;min-height:440px;padding:14px 30px 32px}
.ga-a h2{margin:22px 0 16px;font-size:clamp(2.6rem,5.2vw,4.5rem);line-height:.9}
.ga-a .ga-actions{display:flex;align-items:center;flex-wrap:wrap;gap:18px;margin:24px 0 12px}
.ga-phones{position:relative;align-self:stretch;min-height:420px}
.ga-phones img{position:absolute;display:block;height:auto;border:3px solid #000;border-radius:14px;box-shadow:10px 12px 0 rgba(0,0,0,.85)}
.ga-phones .p1{right:0;top:-58px;width:232px;transform:rotate(4deg)}
.ga-phones .p0{right:170px;top:6px;width:196px;transform:rotate(-7deg);filter:brightness(.92)}

/* ---------------------------------------------------------------- homepage: the neon band */
.gh{scroll-margin-top:64px;margin:0 0 clamp(4rem,8vw,7rem);border-top:12px solid #030205;border-bottom:12px solid #030205;overflow:hidden;background:#07060f}
.gh .ga-art{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 62%;z-index:-2}
.gh::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(to bottom,rgba(11,10,24,.72) 0%,rgba(11,10,24,.3) 38%,rgba(11,10,24,.55) 70%,rgba(11,10,24,.95) 100%)}
.gh-inner{width:min(1100px,calc(100% - 40px));margin:auto;padding:26px 0 34px;text-align:center}
.gh-top{display:flex;align-items:center;justify-content:space-between;gap:12px;text-align:left}
.gh .ga-tabs{gap:28px}
.gh [role=tab]{padding:6px 0 8px;border:0;border-bottom:4px solid transparent;border-radius:0;background:none;color:rgba(255,255,255,.62);font:900 1.55rem/1 var(--ga-display);letter-spacing:.06em;text-transform:uppercase}
.gh [role=tab]:hover{color:#fff;background:none}
.gh [role=tab][aria-selected=true]{color:#fff;border-bottom-color:var(--ga-gold);text-shadow:0 0 22px rgba(255,207,64,.55)}
.gh-tape{margin:0;padding:.45rem .6rem .38rem;background:var(--ga-sunset);color:var(--ga-tape-ink);font:900 .95rem/1 var(--ga-display);letter-spacing:.1em;text-transform:uppercase;transform:rotate(3deg);box-shadow:3px 3px 0 #000}
.gh-title{margin:22px auto 0!important;font-size:clamp(2.8rem,6.6vw,5.8rem)!important;line-height:.86!important}
.gh-title .for-android,.gh[data-tab=android] .gh-title .for-ios{display:none}
.gh[data-tab=android] .gh-title .for-android{display:inline}
.gh-fan{position:relative;height:430px;width:min(780px,100%);margin:6px auto 0;transition:filter .3s}
.gh-fan img{position:absolute;display:block;height:auto;border:3px solid #000;border-radius:16px;box-shadow:0 30px 50px rgba(0,0,0,.6),8px 10px 0 rgba(0,0,0,.8)}
.gh[data-tab=android] .gh-fan{filter:grayscale(.7) brightness(.45)}
/* two panels overlap in the middle; three fan out around the centre one */
.gh[data-count="2"] .f0{left:50%;top:70px;width:230px;margin-left:-250px;transform:rotate(-7deg)}
.gh[data-count="2"] .f1{left:50%;top:26px;width:250px;margin-left:-10px;transform:rotate(5deg);z-index:2}
.gh[data-count="3"] .f1{left:50%;top:22px;width:256px;margin-left:-128px;z-index:2}
.gh[data-count="3"] .f0{left:50%;top:84px;width:214px;margin-left:-356px;transform:rotate(-9deg)}
.gh[data-count="3"] .f2{left:50%;top:84px;width:214px;margin-left:142px;transform:rotate(9deg)}
.gh-bar{position:relative;z-index:3;display:flex;align-items:center;gap:22px;max-width:920px;margin:-118px auto 0;padding:18px 20px;background:#030205;border:1px solid rgba(255,255,255,.08);box-shadow:0 30px 60px -20px rgba(0,0,0,.9),6px 6px 0 #000;text-align:left}
.gh-text{flex:1;margin:0}
.gh-text b{display:block;font:900 2rem/.95 var(--ga-display);text-transform:uppercase;color:#fff}
.gh-text span{display:block;margin-top:6px;color:var(--ga-muted);font-size:.95rem;max-width:44ch}
.gh-bar .ga-qr{transform:rotate(2deg)}
.gh-bar-android{flex-wrap:wrap}
.gh-bar-android .ga-form{flex:1 1 420px;margin:0}
.gh-bar-android .ga-status,.gh-bar-android .ga-small{flex-basis:100%}

/* ---------------------------------------------------------------- phones: no QR code, you cannot scan your own screen */
@media (max-width:760px){
  .ga-qr{display:none}
  .ga-store img{height:60px}
  .ga-form{flex-direction:column}.ga-form button{padding:14px 22px}
  .ga-a .ga-tabs{padding:20px 18px 0}
  .ga-a .ga-body{grid-template-columns:1fr;padding:12px 18px 0;min-height:0}
  .ga-a::before{background:linear-gradient(180deg,rgba(11,10,24,.95) 0%,rgba(11,10,24,.85) 55%,rgba(11,10,24,.25) 100%)}
  .ga-phones{min-height:370px;margin-top:6px}
  .ga-phones .p1{right:auto;left:50%;top:14px;width:150px;margin-left:-8px}
  .ga-phones .p0{right:auto;left:50%;top:40px;width:132px;margin-left:-138px}
  .gh .ga-tabs{gap:20px}.gh [role=tab]{font-size:1.25rem}
  .gh-tape{display:none}
  .gh-fan{height:300px}
  .gh[data-count="2"] .f0{width:150px;margin-left:-160px;top:50px}
  .gh[data-count="2"] .f1{width:165px;margin-left:-6px;top:18px}
  .gh[data-count="3"] .f1{width:170px;margin-left:-85px;top:18px}
  .gh[data-count="3"] .f0{width:140px;margin-left:-190px;top:60px}
  .gh[data-count="3"] .f2{width:140px;margin-left:50px;top:60px}
  .gh-bar{flex-direction:column;align-items:stretch;margin-top:-80px}
  .gh-bar .ga-store{align-self:flex-start}
}
