:root{
 --ink:#0b111d;--surface:#131c2a;--surface2:#172232;--line:#3d4c63;
 --moon:#f0f3f7;--mist:#a6b2c2;--magic:#8fa2d0;--magic2:#b8a8d8;
 --success:#79c9a8;--warning:#d4b36e;--danger:#d98f9e;--red:#d95d68;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
html,body{margin:0;min-height:100%;background:var(--ink);color:var(--moon);
font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif}
body{min-height:100vh;background:
radial-gradient(circle at 50% -10%,rgba(143,162,208,.12),transparent 36%),
linear-gradient(180deg,#0f1725 0%,#0b111d 70%,#080d16 100%)}
.stars{position:fixed;inset:0;pointer-events:none;opacity:.22;background-image:
radial-gradient(circle at 20% 15%,#fff 0 1px,transparent 1.3px),
radial-gradient(circle at 72% 11%,#fff 0 1px,transparent 1.3px),
radial-gradient(circle at 84% 42%,#fff 0 1px,transparent 1.3px),
radial-gradient(circle at 10% 58%,#fff 0 1px,transparent 1.3px);
background-size:260px 260px,340px 340px,390px 390px,310px 310px}
.app-shell{position:relative;width:min(92vw,820px);margin:auto;min-height:100vh;padding:clamp(24px,4vw,52px) clamp(14px,3vw,28px) 56px}
.screen{display:none;width:100%;animation:fade .22s ease}.screen.active{display:block}
@keyframes fade{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}
.masthead{text-align:center;padding:6px 0 20px}.sigil,.secret-mark{text-align:center;color:var(--magic2);font-size:34px;margin-bottom:9px}
.overline,.day-eyebrow,.section-heading,.card-label{font-size:clamp(10px,1.6vw,12px);font-weight:750;letter-spacing:2px;color:var(--magic);text-align:center}
h1{font-family:Georgia,"Times New Roman",serif;font-size:clamp(34px,6vw,58px);font-weight:500;letter-spacing:.8px;margin:10px 0 8px}
h1 span{font-style:italic;color:#c9bce4}h2{font-family:Georgia,"Times New Roman",serif;text-align:center;font-size:clamp(27px,4.5vw,38px);font-weight:500;margin:12px 0 22px}
.tagline,.muted{color:var(--mist);text-align:center;line-height:1.55}.tagline{margin:0;font-family:Georgia,serif;font-style:italic;font-size:clamp(15px,2vw,17px)}
.welcome-card,.score-card,.puzzle-card{background:linear-gradient(180deg,rgba(23,34,50,.9),rgba(15,23,36,.94));border:1px solid var(--line);border-radius:18px;box-shadow:0 18px 55px rgba(0,0,0,.22)}
.welcome-card{padding:24px;text-align:center;margin:18px 0}.welcome-card p{color:#c4ccd8;line-height:1.65;margin:12px 0 0}
.score-card{padding:22px;margin:14px 0 28px}.score-title{text-align:center;font-size:13px;font-weight:800;letter-spacing:1.4px;color:#c6cfdd}.score-title span{font-family:Georgia,serif;font-style:italic;font-weight:400;color:var(--mist);letter-spacing:0}
.score-main{display:flex;justify-content:center;align-items:center;gap:clamp(12px,4vw,28px);margin:18px 0}.score-main>div:not(.score-divider){display:flex;flex-direction:column;align-items:center;min-width:80px}.score-main strong{font-family:Georgia,serif;font-size:clamp(38px,7vw,48px);font-weight:500}.score-main small{font-size:9px;letter-spacing:1.4px;color:var(--mist)}.score-divider{color:#52627d;font-size:28px}
.score-stats{border-top:1px solid rgba(255,255,255,.07);padding-top:14px;display:flex;flex-wrap:wrap;justify-content:center;gap:10px 18px;color:var(--mist);font-size:12px}.score-stats b{color:var(--moon)}
.section-heading{margin:10px 0 14px}.day-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.day-card{appearance:none;text-align:left;padding:17px;border-radius:15px;border:1px solid #2d394e;background:rgba(17,25,39,.9);color:var(--moon);cursor:pointer;min-height:108px;transition:transform .28s ease,border-color .2s ease,box-shadow .2s ease}
.day-card:hover{border-color:#4f6284}.day-card .dayline{display:flex;align-items:center;justify-content:space-between;gap:12px}.day-card .day{font-family:Georgia,serif;font-size:21px}.state-icon{width:22px;height:22px;display:block;flex:0 0 auto}.unsolved-icon{color:#e0606b}.solved-icon{color:#63c99b}.flag-icon{color:#f2f4f7}.day-card .date{font-size:11px;color:var(--mist);margin-top:5px}.day-card .state{font-size:12px;margin-top:12px;color:#aebbd0}.day-card .solved{color:var(--success)}.day-card .flag{color:var(--warning)}
.day-card .ready{color:#d9a0a7}.day-card .solved{color:var(--success);font-weight:700;letter-spacing:.25px}.day-card .flag{color:#d8c28e;font-weight:700;letter-spacing:.25px}
.day-card.entering{animation:cardIn .34s ease}@keyframes cardIn{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none}}
.empty-state{text-align:center;color:var(--mist);padding:28px 0}
.test-tools{text-align:center;color:#687990;font-size:10px;margin-top:20px;line-height:1.6}.test-tools code{color:#8295b3;background:#101827;padding:2px 4px;border-radius:4px}
.hidden{display:none!important}
.home-link{appearance:none;background:none;border:0;color:#8a98ad;font-size:11px;font-weight:750;letter-spacing:1.3px;padding:0;margin:0 0 28px;cursor:pointer}
.puzzle-card{padding:clamp(24px,4vw,34px);margin:18px auto;width:min(100%,720px)}.card-label{text-align:left;color:#7f90b3;margin-bottom:18px}
.question{font-family:Georgia,"Times New Roman",serif;font-size:clamp(19px,3vw,24px);line-height:1.65;color:#eef1f5;text-align:center;max-width:34em;margin:auto}
.question .line{display:block;text-wrap:balance}.question .gap{height:1em}
.scroll-cue{display:flex;flex-direction:column;align-items:center;gap:2px;margin:4px auto 12px;background:transparent;border:0;color:#8191ad;cursor:pointer;font-size:11px;letter-spacing:.5px}
.scroll-cue .chevron{font-size:28px;line-height:1;animation:bounce 1.7s ease-in-out infinite}
@keyframes bounce{0%,100%{transform:translateY(0)}50%{transform:translateY(6px)}}
.answer-area{width:min(100%,620px);margin:0 auto}
input{width:100%;padding:16px 18px;margin:4px 0 10px;border-radius:13px;border:1px solid #3b4a63;background:#0d1420;color:var(--moon);font-size:17px;text-align:center;outline:none}
input:focus{border-color:var(--magic);box-shadow:0 0 0 3px rgba(143,162,208,.10)}
button.primary,button.secondary,button.giveup,.home-button{width:100%;padding:15px 18px;margin-top:10px;border-radius:13px;font-size:14px;font-weight:750;letter-spacing:.2px;cursor:pointer}
.primary{border:1px solid #7387b8;background:#536994;color:#fff}.secondary{border:1px solid #3a4a62;background:#141e2d;color:#c6cfdd}.giveup{border:1px solid #62414b;background:#261820;color:#e3b5bd}.home-button{border:1px solid #2d394e;background:transparent;color:#8795aa}
.status-panel{min-height:62px;text-align:center;padding:10px 4px 0}.feedback,.attempts{margin:3px 0;font-size:13px}.feedback.bad{color:#d1a5ad}.feedback.good{color:var(--success)}.attempts{color:#aeb8c8}
.compact{text-align:center}.answer-reveal{text-align:center;font-family:Georgia,serif;font-size:45px;color:#c8bce5;letter-spacing:3px;margin:18px 0}
.divider{display:flex;align-items:center;gap:12px;margin:25px 0 8px;color:#67758a}.divider span{height:1px;background:#2d394e;flex:1}.divider em{font-style:normal;font-size:10px;letter-spacing:1.5px}
.qr-wrap{width:min(280px,75vw);padding:15px;margin:18px auto;background:#fff;border-radius:14px}.qr-wrap img{display:block;width:100%;height:auto}.small{font-size:12px}

@media(max-width:620px){
 .app-shell{width:min(100%,520px);padding:24px 16px 42px}
 .day-grid{grid-template-columns:1fr}
 .welcome-card,.score-card,.puzzle-card{border-radius:16px}
 .score-stats{gap:8px 12px}
 .question{max-width:26em}
}
@media(min-width:621px) and (max-width:900px){
 .app-shell{width:min(94vw,760px)}
 .question{max-width:31em}
}
@media(min-width:901px){
 .app-shell{width:min(88vw,840px)}
 .question{max-width:34em}
}
@media(orientation:landscape) and (max-height:620px){
 .app-shell{padding-top:18px}
 .masthead{padding-top:0}
 .welcome-card{padding:18px}
}


/* v0.7 status icon + browser consistency fixes */
.day-card .state{font-size:11px;letter-spacing:.15px}
.day-card .state-icon{transition:none!important;animation:none!important}
.day-card .today-chip{
 display:inline-block;margin-left:7px;padding:2px 6px;border:1px solid #526887;border-radius:999px;
 color:#a9bce0;font-size:8px;font-weight:800;letter-spacing:1px;vertical-align:1px
}
.day-grid{grid-auto-flow:row!important}
.day-card{order:initial!important}


/* v1.1 dashboard freeze + scrolling cards */
.white-flag{color:#fff;font-weight:900}
.gift-mark{text-align:center;font-size:46px;line-height:1;margin:10px 0 14px}

/* Keep the scoreboard and "YOUR SECRETS" heading fixed while the card list scrolls. */
#home .score-card{
 position:sticky;
 top:10px;
 z-index:20;
 backdrop-filter:blur(10px);
 -webkit-backdrop-filter:blur(10px);
}
#home .section-heading{
 position:sticky;
 top:calc(var(--score-sticky-height, 238px));
 z-index:19;
 margin:0;
 padding:14px 0 10px;
 background:linear-gradient(180deg,rgba(11,17,29,.98),rgba(11,17,29,.94));
}
#home .day-grid{
 max-height:52vh;
 overflow-y:auto;
 overscroll-behavior:contain;
 padding-right:4px;
 scrollbar-width:thin;
}
#home .day-grid::-webkit-scrollbar{width:8px}
#home .day-grid::-webkit-scrollbar-thumb{background:#2c3a50;border-radius:999px}
#home .day-grid::-webkit-scrollbar-track{background:transparent}

/* On smaller screens, keep the sticky header compact enough to leave useful room for cards. */
@media(max-width:620px){
 #home .score-card{top:6px;padding:16px;margin-bottom:8px}
 #home .score-main{margin:10px 0}
 #home .score-main strong{font-size:36px}
 #home .score-stats{padding-top:10px;gap:6px 9px;font-size:10px}
 #home .section-heading{top:194px;padding-top:10px}
 #home .day-grid{max-height:48vh}
}
@media(min-width:621px){
 #home .section-heading{top:236px}
}

/* Fallback when backdrop-filter is unsupported */
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
 #home .score-card{background:#131c2a}
}


/* v1.2 test controls */
.reset-test{
 margin-top:10px;
 padding:8px 12px;
 border:1px solid #6d4851;
 border-radius:10px;
 background:#21151b;
 color:#e8b5bd;
 font-size:10px;
 font-weight:800;
 letter-spacing:.8px;
 cursor:pointer;
}
.reset-test:hover{border-color:#9b626f}

/* Secret list can now hold all 41 date entries without expanding the page header. */
#home .day-grid{
 max-height:56vh;
 overflow-y:auto;
}


/* v1.4 EXIT 0 birthday finale */
.finale-screen{position:relative;overflow:hidden;min-height:calc(100vh - 80px)}
.finale-content{position:relative;z-index:2;width:min(100%,720px);margin:0 auto;text-align:center;padding-top:4px}
.finale-cake{font-size:58px;line-height:1;margin:6px 0 16px}
.birthday-title{font-size:clamp(34px,6vw,56px);margin:15px 0 10px}
.birthday-subtitle{font-family:Georgia,"Times New Roman",serif;font-size:clamp(21px,3vw,28px);margin:0 0 6px;color:#c9bce4}
.finale-gift{margin-top:26px}
.celebration-layer{position:fixed;inset:0;z-index:1;pointer-events:none;overflow:hidden}
.confetti-piece{position:absolute;top:-30px;opacity:0;animation:confettiFall 4s ease-in forwards;transform:translateX(0) rotate(0deg)}
@keyframes confettiFall{
  0%{transform:translateX(0) translateY(-20px) rotate(0deg);opacity:0}
  8%{opacity:1}
  100%{transform:translateX(var(--drift,0px)) translateY(105vh) rotate(720deg);opacity:.85}
}
.birthday-balloon{position:absolute;bottom:-100px;font-size:clamp(34px,6vw,56px);animation:balloonRise 6s ease-in forwards;opacity:.95}
@keyframes balloonRise{
  0%{transform:translateY(0) rotate(-4deg);opacity:0}
  8%{opacity:.95}
  50%{transform:translateY(-55vh) rotate(5deg)}
  100%{transform:translateY(-120vh) rotate(-3deg);opacity:.75}
}
@media(prefers-reduced-motion:reduce){
 .confetti-piece{animation-duration:6.5s!important;animation-timing-function:linear!important}
 .birthday-balloon{animation-duration:9s!important;animation-timing-function:linear!important}
}


/* v1.5 streamlined home masthead */
.journey-intro{
  max-width:900px;
  margin:10px auto 16px;
  text-align:center;
  color:#9fb2dc;
  font-size:clamp(10px,1.3vw,13px);
  font-weight:700;
  line-height:1.65;
  letter-spacing:.12em;
}
.masthead h1{
  margin-top:4px;
}
@media(max-width:700px){
  .journey-intro{
    padding:0 8px;
    font-size:10px;
    line-height:1.55;
    letter-spacing:.08em;
  }
}


/* v1.6 title refinement */
.masthead h1 .title-second-line{
  display:inline-block;
}
.masthead h1 .title-second-line em{
  color:#E8DFFF;
  font-style:italic;
}


/* v1.7 mobile-first frozen dashboard + reliable birthday celebration */

/*
   PHONE HOME SCREEN ARCHITECTURE
   - one fixed app viewport
   - page/body do not scroll
   - scoreboard + YOUR EXITS remain in place
   - only EXIT cards scroll
   - masthead gently collapses after the card pane starts moving
*/
@media(max-width:620px){
  html,
  body.home-active{
    height:100%;
    height:100dvh;
    overflow:hidden;
    overscroll-behavior:none;
  }

  body.home-active .app-shell{
    width:100%;
    max-width:520px;
    height:100vh;
    height:100dvh;
    min-height:0;
    padding:
      max(10px, env(safe-area-inset-top))
      12px
      max(8px, env(safe-area-inset-bottom));
    overflow:hidden;
    display:block;
  }

  body.home-active #home.active{
    height:100%;
    min-height:0;
    display:flex;
    flex-direction:column;
    overflow:hidden;
  }

  body.home-active #home .masthead{
    flex:0 0 auto;
    max-height:178px;
    overflow:hidden;
    padding:0 0 8px;
    opacity:1;
    transform:translateY(0);
    transition:
      max-height .28s ease,
      opacity .20s ease,
      transform .28s ease,
      padding .28s ease;
  }

  body.home-active #home .sigil{
    font-size:24px;
    margin:0 0 4px;
  }

  body.home-active #home .journey-intro{
    margin:2px auto 6px;
    padding:0 4px;
    font-size:8.8px;
    line-height:1.4;
    letter-spacing:.055em;
  }

  body.home-active #home .masthead h1{
    font-size:clamp(28px,8.4vw,38px);
    line-height:1.02;
    margin:3px 0 2px;
    letter-spacing:.35px;
  }

  /* Once Mika starts scrolling the exits, free the masthead space.
     The dashboard itself never jumps; the EXIT pane simply gains room. */
  body.home-active.home-grid-scrolled #home .masthead{
    max-height:0;
    opacity:0;
    transform:translateY(-12px);
    padding:0;
    pointer-events:none;
  }

  body.home-active #home .score-card{
    position:relative!important;
    top:auto!important;
    z-index:20;
    flex:0 0 auto;
    margin:4px 0 5px;
    padding:10px 12px 9px;
    border-radius:14px;
    backdrop-filter:blur(12px);
    -webkit-backdrop-filter:blur(12px);
  }

  body.home-active #home .score-title{
    font-size:10.5px;
    letter-spacing:1.05px;
  }

  body.home-active #home .score-main{
    margin:5px 0 6px;
    gap:18px;
  }

  body.home-active #home .score-main>div:not(.score-divider){
    min-width:58px;
  }

  body.home-active #home .score-main strong{
    font-size:29px;
    line-height:1;
  }

  body.home-active #home .score-main small{
    font-size:7.5px;
  }

  body.home-active #home .score-divider{
    font-size:20px;
  }

  body.home-active #home .score-stats{
    padding-top:7px;
    gap:4px 9px;
    font-size:8.8px;
    line-height:1.25;
  }

  body.home-active #home .section-heading{
    position:relative!important;
    top:auto!important;
    z-index:19;
    flex:0 0 auto;
    margin:0;
    padding:6px 0 7px;
    background:linear-gradient(180deg,rgba(11,17,29,.99),rgba(11,17,29,.96));
  }

  body.home-active #home .day-grid{
    flex:1 1 auto;
    min-height:0;
    max-height:none!important;
    overflow-y:auto;
    overflow-x:hidden;
    -webkit-overflow-scrolling:touch;
    overscroll-behavior-y:contain;
    touch-action:pan-y;
    padding:1px 2px max(14px, env(safe-area-inset-bottom)) 0;
    scrollbar-gutter:stable;
  }

  body.home-active #home .day-card{
    min-height:96px;
    padding:14px 15px;
  }

  body.home-active #home .day-card .day{
    font-size:20px;
  }

  body.home-active #home .test-tools{
    flex:0 0 auto;
    margin:4px 0 0;
    padding-top:2px;
    line-height:1.25;
    font-size:8px;
  }

  body.home-active #home .test-tools .test-hint{
    display:none;
  }

  body.home-active #home .reset-test{
    margin-top:4px;
    padding:5px 9px;
    font-size:8px;
  }
}

/* Normal scrolling resumes on puzzle / gift / finale screens. */
@media(max-width:620px){
  body:not(.home-active){
    min-height:100%;
    overflow-y:auto;
    overscroll-behavior-y:auto;
  }
}

/*
   Birthday celebration:
   keep animation viewport-wide and above the background on mobile.
   Content stays above the effects so buttons remain readable/tappable.
*/
.celebration-layer{
  position:fixed!important;
  inset:0!important;
  width:100vw;
  width:100dvw;
  height:100vh;
  height:100dvh;
  z-index:90!important;
  pointer-events:none!important;
  overflow:hidden!important;
  contain:layout paint;
}

.finale-content{
  position:relative;
  z-index:100!important;
}

.confetti-piece{
  will-change:transform,opacity;
  text-shadow:0 0 8px rgba(255,255,255,.22);
}

.birthday-balloon{
  will-change:transform,opacity;
  filter:drop-shadow(0 4px 8px rgba(0,0,0,.28));
}

@media(max-width:620px){
  .finale-screen{
    overflow:visible;
    min-height:calc(100dvh - 30px);
  }
  .finale-content{
    padding-bottom:max(20px,env(safe-area-inset-bottom));
  }
  .finale-cake{
    font-size:48px;
    margin:3px 0 11px;
  }
  .birthday-title{
    font-size:clamp(30px,9vw,42px);
    line-height:1.08;
  }
  .finale-gift{
    margin-top:18px;
  }
}


/* =========================================================
   v1.8 — responsive home + mobile reward usability
   ========================================================= */

/* HOME: page is the scroller on every device. The journey intro/title
   scrolls away naturally; only the scoreboard remains sticky. */
#home .day-grid{
  max-height:none!important;
  overflow:visible!important;
  overscroll-behavior:auto!important;
  scrollbar-gutter:auto!important;
  padding-right:0!important;
}
#home .section-heading{
  position:relative!important;
  top:auto!important;
  z-index:auto!important;
  margin:10px 0 14px!important;
  padding:0!important;
  background:none!important;
}
#home .score-card{
  position:sticky!important;
  top:10px;
  z-index:30;
}

/* Laptop/desktop sticky scoreboard: approximately 90% of prior footprint. */
@media(min-width:621px){
  #home .score-card{padding:18px 20px;margin:12px 0 18px}
  #home .score-main{margin:14px 0}
  #home .score-main strong{font-size:clamp(36px,6.2vw,43px)}
  #home .score-stats{padding-top:11px;gap:8px 16px;font-size:11px}
}

/* MOBILE PORTRAIT + LANDSCAPE */
@media(max-width:620px){
  html{
    height:auto!important;
    min-height:100%!important;
    overflow-x:hidden!important;
    overflow-y:auto!important;
    overscroll-behavior-y:auto!important;
  }
  body,
  body.home-active,
  body:not(.home-active){
    height:auto!important;
    min-height:100vh!important;
    min-height:100dvh!important;
    overflow-x:hidden!important;
    overflow-y:auto!important;
    overscroll-behavior-y:auto!important;
  }
  body.home-active .app-shell,
  body:not(.home-active) .app-shell{
    width:100%!important;
    max-width:520px;
    height:auto!important;
    min-height:100vh!important;
    min-height:100dvh!important;
    overflow:visible!important;
    display:block!important;
    padding:max(10px,env(safe-area-inset-top)) 10px max(34px,env(safe-area-inset-bottom))!important;
  }
  body.home-active #home.active{
    height:auto!important;
    min-height:0!important;
    display:block!important;
    overflow:visible!important;
  }
  body.home-active #home .masthead,
  body.home-active.home-grid-scrolled #home .masthead{
    max-height:none!important;
    overflow:visible!important;
    opacity:1!important;
    transform:none!important;
    padding:0 0 8px!important;
    pointer-events:auto!important;
  }

  /* Portrait scoreboard ≈75–80% of previous mobile footprint. */
  body.home-active #home .score-card{
    position:sticky!important;
    top:max(4px,env(safe-area-inset-top))!important;
    margin:4px 0 7px!important;
    padding:8px 10px 7px!important;
    border-radius:13px;
  }
  body.home-active #home .score-title{font-size:9.6px;letter-spacing:.95px}
  body.home-active #home .score-main{margin:4px 0 5px;gap:14px}
  body.home-active #home .score-main>div:not(.score-divider){min-width:52px}
  body.home-active #home .score-main strong{font-size:26px;line-height:1}
  body.home-active #home .score-main small{font-size:6.8px;letter-spacing:1px}
  body.home-active #home .score-divider{font-size:17px}
  body.home-active #home .score-stats{padding-top:6px;gap:3px 7px;font-size:8px;line-height:1.18}
  body.home-active #home .section-heading{margin:7px 0 8px!important}

  /* Two columns on phone. Existing newest-first ordering is intentionally
     preserved, which keeps EXIT 40 at the bottom of the full journey. */
  body.home-active #home .day-grid,
  #home .day-grid{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:8px!important;
    overflow:visible!important;
    max-height:none!important;
    padding:0 1px 6px!important;
  }
  body.home-active #home .day-card{
    min-width:0;
    min-height:88px;
    padding:11px 10px;
    border-radius:13px;
  }
  body.home-active #home .day-card .dayline{justify-content:flex-start;gap:6px}
  body.home-active #home .day-card .day{font-size:18px;line-height:1.05;white-space:nowrap}
  body.home-active #home .day-card .state-icon{width:19px;height:19px}
  body.home-active #home .day-card .date{font-size:9.5px;line-height:1.25;margin-top:6px}
  body.home-active #home .day-card .state{font-size:9.6px;line-height:1.2;margin-top:9px;overflow-wrap:anywhere}
  body.home-active #home .day-card .today-chip{margin-left:3px;padding:1px 4px;font-size:6.5px}
  body.home-active #home .test-tools{margin-top:12px}

  /* QR is not useful on the same phone. Direct surprise/video button stays primary. */
  #video .divider,
  #video .qr-wrap,
  #video .qr-wrap + .muted.small,
  #finale .divider,
  #finale .qr-wrap,
  #finale .qr-wrap + .muted.small{display:none!important}
  #video.active,
  #finale.active{overflow:visible!important;min-height:auto!important}
  #video .home-button,
  #finale .home-button{margin-top:18px}
  .finale-screen{overflow:visible!important;min-height:auto!important}
  .finale-content{padding-bottom:max(44px,env(safe-area-inset-bottom))!important}
}

/* Short landscape phones: tighter ≈60% scoreboard footprint. */
@media(max-width:920px) and (orientation:landscape) and (max-height:620px){
  .app-shell{
    width:min(100%,920px)!important;
    max-width:none!important;
    padding:max(6px,env(safe-area-inset-top)) 10px max(22px,env(safe-area-inset-bottom))!important;
  }
  body.home-active #home .masthead{padding-bottom:4px!important}
  body.home-active #home .sigil{font-size:18px;margin-bottom:1px}
  body.home-active #home .journey-intro{margin:1px auto 3px;font-size:7.3px;line-height:1.25}
  body.home-active #home .masthead h1{font-size:23px;line-height:1;margin:2px 0 1px}
  body.home-active #home .score-card{
    top:max(3px,env(safe-area-inset-top))!important;
    padding:5px 8px!important;
    margin:2px 0 4px!important;
    border-radius:11px;
  }
  body.home-active #home .score-title{font-size:8px;letter-spacing:.75px}
  body.home-active #home .score-main{margin:2px 0 3px;gap:10px}
  body.home-active #home .score-main>div:not(.score-divider){min-width:42px}
  body.home-active #home .score-main strong{font-size:21px}
  body.home-active #home .score-main small{font-size:5.8px}
  body.home-active #home .score-divider{font-size:14px}
  body.home-active #home .score-stats{padding-top:4px;gap:2px 6px;font-size:7.2px;line-height:1.1}
  body.home-active #home .section-heading{margin:4px 0 5px!important;font-size:9px}
  body.home-active #home .day-grid,
  #home .day-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:7px!important}
  body.home-active #home .day-card{min-height:72px;padding:8px 10px}
  body.home-active #home .day-card .day{font-size:16px}
  body.home-active #home .day-card .state-icon{width:17px;height:17px}
  body.home-active #home .day-card .date{font-size:8.5px;margin-top:4px}
  body.home-active #home .day-card .state{font-size:8.5px;margin-top:6px}
}

/* Birthday effects */
.confetti-piece{
  color:var(--confetti-color,#f3c5d2);
  text-shadow:0 0 8px rgba(255,255,255,.18);
}
.birthday-balloon{
  top:var(--balloon-origin-y,calc(100vh - 90px))!important;
  bottom:auto!important;
}
@keyframes balloonRise{
  0%{transform:translateY(20px) rotate(-4deg);opacity:0}
  5%{opacity:.95}
  50%{transform:translateY(-58vh) rotate(5deg)}
  100%{transform:translateY(-118vh) rotate(-3deg);opacity:.72}
}


/* =========================================================
   PROJECT 40 v2.0 — approved UX pass
   ========================================================= */
.project40-header{text-align:center;padding:2px 0 14px}
.project40-brand{position:relative;display:inline-flex;align-items:center;justify-content:center;min-width:min(92vw,430px);padding:0 42px}
.project40-handwritten{
 margin:0!important;font-family:"Segoe Print","Bradley Hand","Segoe Script","Brush Script MT",cursive!important;
 font-size:clamp(42px,6.2vw,62px)!important;font-weight:500!important;line-height:1!important;letter-spacing:-2px!important;
 background:linear-gradient(105deg,#eab8d1 4%,#e6c4dc 42%,#e9cf9b 77%,#f0dba9 100%);
 -webkit-background-clip:text;background-clip:text;color:transparent!important;-webkit-text-fill-color:transparent;
 filter:drop-shadow(0 2px 12px rgba(225,181,208,.13))
}
.project40-handwritten span{color:inherit!important;font-style:normal!important;-webkit-text-fill-color:transparent}
.brand-sparkle{position:absolute;color:#efd7a3;text-shadow:0 0 10px rgba(239,215,163,.48);pointer-events:none}
.sparkle-left{left:23px;top:15px;font-size:15px}.sparkle-right{right:19px;top:3px;font-size:19px}.sparkle-mini{right:39px;bottom:3px;font-size:8px;color:#e8bfd3}
.journey-lockup{margin-top:17px}
.project40-subtitle{color:#d3dbed;font-size:11px;font-weight:750;line-height:1.1;letter-spacing:.32em;text-indent:.32em}
.project40-subline{margin-top:4px;color:#77609f;font-family:Georgia,"Times New Roman",serif;font-size:15px;line-height:1.1;font-style:italic;font-weight:600}
.project40-header .journey-intro{margin:14px auto 0;max-width:760px;padding:0 8px;color:#a9b9d6;font-size:12px;font-weight:650;line-height:1.55;letter-spacing:.06em}

/* Opaque frozen frame on desktop: EXIT cards cannot be seen through it */
#home .score-card{background:#131c2a!important;z-index:50!important;box-shadow:0 12px 20px rgba(5,9,17,.72)}
#home .section-heading{background:#0b111d!important;z-index:49}
@media(min-width:621px){
 #home .score-card{backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
 #home .section-heading{position:sticky!important;top:var(--score-frame-bottom,180px)!important;padding:9px 0!important;margin:0!important;box-shadow:0 8px 12px rgba(5,9,17,.65)}
}

/* Long revealed answers never overflow */
#answerReveal{display:block;width:100%;max-width:100%;box-sizing:border-box;padding-inline:12px;white-space:normal!important;overflow-wrap:anywhere;word-break:normal;line-height:1.04}

/* Laptop QR is intentionally secondary */
@media(min-width:921px){
 .qr-wrap{width:132px!important;padding:8px!important;margin:12px auto!important;border-radius:10px!important}
 .qr-wrap img{width:100%!important;height:auto!important}
}

/* Wrong-answer phone popup, anchored above the keyboard */
.wrong-answer-popover{
 position:fixed;left:50%;bottom:calc(var(--keyboard-offset,0px) + 16px);transform:translateX(-50%);
 width:min(90vw,390px);z-index:10000;display:none;box-sizing:border-box;padding:16px 16px 13px;
 border:1px solid rgba(181,197,230,.28);border-radius:16px;background:rgba(17,27,45,.99);
 box-shadow:0 12px 38px rgba(0,0,0,.55);text-align:center;color:#eef2fb
}
.wrong-answer-popover.show{display:block}
.wap-message{font-family:Georgia,"Times New Roman",serif;font-size:18px;line-height:1.32}
.wap-remaining{margin-top:7px;color:#b8c5e2;font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase}
.wap-ok{width:100%;margin-top:12px;padding:11px 16px;border:1px solid rgba(190,205,236,.3);border-radius:12px;background:#5d78a7;color:#fff;font:700 14px/1 system-ui,sans-serif;letter-spacing:.08em}

/* Mobile = fixed app frame; ONLY EXIT cards scroll */
@media(max-width:620px){
 html,body.home-active{height:100%!important;height:100dvh!important;overflow:hidden!important;overscroll-behavior:none!important}
 body.home-active .app-shell{width:100%!important;max-width:520px;height:100vh!important;height:100dvh!important;min-height:0!important;overflow:hidden!important;display:block!important;padding:max(8px,env(safe-area-inset-top)) 10px max(7px,env(safe-area-inset-bottom))!important}
 body.home-active #home.active{height:100%!important;min-height:0!important;display:flex!important;flex-direction:column!important;overflow:hidden!important}
 body.home-active #home .project40-header,body.home-active.home-grid-scrolled #home .project40-header{flex:0 0 auto;max-height:none!important;overflow:visible!important;opacity:1!important;transform:none!important;padding:0 0 7px!important}
 body.home-active #home .project40-brand{min-width:min(94vw,360px);padding:0 34px}
 body.home-active #home .project40-handwritten{font-size:clamp(36px,11vw,46px)!important;line-height:.98!important}
 body.home-active #home .journey-lockup{margin-top:14px}
 body.home-active #home .project40-subtitle{font-size:8.8px;letter-spacing:.30em;text-indent:.30em}
 body.home-active #home .project40-subline{font-size:13px;margin-top:3px}
 body.home-active #home .project40-header .journey-intro{margin:10px auto 0;font-size:10px;line-height:1.42;letter-spacing:.04em}
 body.home-active #home .score-card{position:relative!important;top:auto!important;flex:0 0 auto!important;margin:3px 0 4px!important;padding:8px 10px 7px!important;background:#131c2a!important}
 body.home-active #home .section-heading{position:relative!important;top:auto!important;flex:0 0 auto!important;margin:0!important;padding:6px 0 7px!important;background:#0b111d!important}
 body.home-active #home .day-grid,#home .day-grid{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important;flex:1 1 auto!important;min-height:0!important;max-height:none!important;overflow-y:auto!important;overflow-x:hidden!important;-webkit-overflow-scrolling:touch;overscroll-behavior-y:contain!important;touch-action:pan-y;padding:1px 1px max(14px,env(safe-area-inset-bottom))!important}
 body.home-active #home .test-tools{flex:0 0 auto;margin:3px 0 0!important;font-size:8px}
 #video .divider,#video .qr-wrap,#video .qr-wrap + .muted.small,#finale .divider,#finale .qr-wrap,#finale .qr-wrap + .muted.small{display:none!important}
}

/* Phone landscape is still phone: no QR */
@media(max-width:920px) and (orientation:landscape) and (max-height:620px){
 #video .divider,#video .qr-wrap,#video .qr-wrap + .muted.small,#finale .divider,#finale .qr-wrap,#finale .qr-wrap + .muted.small{display:none!important}
 body.home-active #home .project40-handwritten{font-size:30px!important}
 body.home-active #home .journey-lockup{margin-top:5px}
 body.home-active #home .project40-header .journey-intro{font-size:7.5px;line-height:1.22;margin-top:4px}
}
@media(min-width:921px){.wrong-answer-popover{display:none!important}}


/* =========================================================
   PROJECT 40 v2.1
   - selected subtitle Option 5
   - mobile single-scroll sticky scoreboard
   - intentional mobile intro wrapping
   - compact desktop gift CTA
   ========================================================= */

/* Option 5: cinematic subtitle */
.option5-lockup .project40-subtitle{
  color:#f0e5cf!important;
  font-family:Georgia,"Times New Roman",serif!important;
  font-size:12px!important;
  font-weight:600!important;
  letter-spacing:.34em!important;
  text-indent:.34em!important;
}
.option5-lockup .project40-subline{
  margin-top:5px!important;
  line-height:1.05!important;
}
.option5-lockup .subline-with{
  color:#b78ad6;
  font-family:"Segoe Script","Snell Roundhand","Brush Script MT",cursive;
  font-style:italic;
  font-weight:500;
  font-size:17px;
}
.option5-lockup .subline-exits{
  color:#e6c56d;
  font-family:Georgia,"Times New Roman",serif;
  font-style:normal;
  font-weight:700;
  font-size:16px;
  letter-spacing:.08em;
}

.intro-mobile{display:none}

/* Laptop/desktop: primary gift button fits its wording instead of spanning the page */
@media(min-width:621px){
  #video .primary,
  #finale .primary{
    width:auto!important;
    max-width:none!important;
    display:inline-flex!important;
    align-items:center;
    justify-content:center;
    padding-left:30px!important;
    padding-right:30px!important;
    min-width:0!important;
  }
  #video .actions,
  #finale .actions{
    text-align:center;
  }
}

/* PHONE: one natural page scrollbar.
   Branding/intro scroll away; scoreboard + YOUR EXITS become sticky only after reaching top. */
@media(max-width:620px){
  html,
  body,
  body.home-active{
    height:auto!important;
    min-height:100%!important;
    overflow-x:hidden!important;
    overflow-y:auto!important;
    overscroll-behavior-y:auto!important;
  }

  body.home-active .app-shell{
    height:auto!important;
    min-height:100dvh!important;
    overflow:visible!important;
    display:block!important;
    padding:
      max(8px,env(safe-area-inset-top))
      10px
      max(12px,env(safe-area-inset-bottom))!important;
  }

  body.home-active #home.active{
    height:auto!important;
    min-height:100dvh!important;
    display:block!important;
    overflow:visible!important;
  }

  /* Branding and intro are normal content: they scroll away. */
  body.home-active #home .project40-header,
  body.home-active.home-grid-scrolled #home .project40-header{
    position:relative!important;
    top:auto!important;
    max-height:none!important;
    overflow:visible!important;
    opacity:1!important;
    transform:none!important;
    pointer-events:auto!important;
  }

  body.home-active #home .option5-lockup .project40-subtitle{
    font-size:9.2px!important;
    letter-spacing:.30em!important;
    text-indent:.30em!important;
  }
  body.home-active #home .option5-lockup .subline-with{
    font-size:14px!important;
  }
  body.home-active #home .option5-lockup .subline-exits{
    font-size:13px!important;
  }

  /* Intentional mobile line breaks for intro copy. */
  .intro-desktop{display:none!important}
  .intro-mobile{
    display:block!important;
  }
  .intro-mobile > span{
    display:block;
    white-space:nowrap;
  }
  body.home-active #home .project40-header .journey-intro{
    font-size:9.5px!important;
    line-height:1.42!important;
    letter-spacing:.025em!important;
    padding:0 2px!important;
  }

  /* Single-scroll sticky frame: scoreboard sticks once it reaches top. */
  body.home-active #home .score-card{
    position:sticky!important;
    top:max(8px,env(safe-area-inset-top))!important;
    z-index:60!important;
    margin:3px 0 0!important;
    background:#131c2a!important;
  }

  /* YOUR EXITS sits directly under the sticky scoreboard. */
  body.home-active #home .section-heading{
    position:sticky!important;
    top:var(--mobile-score-bottom, 150px)!important;
    z-index:59!important;
    margin:0!important;
    padding:7px 0 8px!important;
    background:#0b111d!important;
  }

  /* IMPORTANT: no nested scrolling / second scrollbar. */
  body.home-active #home .day-grid,
  #home .day-grid{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:8px!important;
    height:auto!important;
    max-height:none!important;
    min-height:0!important;
    overflow:visible!important;
    padding:1px 1px max(16px,env(safe-area-inset-bottom))!important;
  }

  body.home-active #home .test-tools{
    position:relative!important;
    bottom:auto!important;
  }
}

/* On very narrow phones, allow only the third intro line to wrap gracefully if absolutely necessary. */
@media(max-width:365px){
  .intro-mobile > span{white-space:normal}
}

/* Keep mobile CTA touch-friendly; override desktop content-width behavior. */
@media(max-width:620px){
  #video .primary,
  #finale .primary{
    width:100%!important;
    display:flex!important;
  }
}

/* =========================================================
   PROJECT 40 v2.2
   Testing fixes from canonical MAIN CHAT
   ========================================================= */

/* Scoreboard: labels belong directly above their score; VS aligns with dash. */
.score-main{
  align-items:flex-start!important;
}
.score-main .score-player,
.score-main .score-divider{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:flex-start;
}
.score-main .score-player small,
.score-main .score-divider small{
  display:block;
  min-height:14px;
  margin:0 0 5px;
  color:#c6cfdd;
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
  font-size:9px;
  font-style:normal;
  font-weight:800;
  letter-spacing:1.2px;
  line-height:1;
  white-space:nowrap;
}
.score-main .score-divider{
  min-width:42px;
  color:#52627d;
}
.score-main .score-divider span{
  display:block;
  font-size:28px;
  line-height:1;
}

/* EXIT cards: highway-sign treatment with Option 7's warm serif EXIT label
   and a clearly boxed route/exit number so EXIT 0 can never read as EXIT O. */
.day-card{
  border:1px solid rgba(235,239,224,.74)!important;
  background:linear-gradient(180deg,#07523f 0%,#063f33 100%)!important;
  box-shadow:
    inset 0 0 0 3px rgba(255,255,255,.08),
    inset 0 0 0 5px rgba(236,240,225,.12),
    0 10px 24px rgba(0,0,0,.18)!important;
}
.day-card:hover{
  border-color:#f2e9c5!important;
  box-shadow:
    inset 0 0 0 3px rgba(255,255,255,.10),
    inset 0 0 0 5px rgba(236,240,225,.15),
    0 12px 28px rgba(0,0,0,.24)!important;
}
.day-card .dayline{align-items:center!important}
.day-card .day{
  display:flex;
  align-items:center;
  gap:9px;
  font-family:Georgia,"Times New Roman",serif!important;
  line-height:1;
}
.day-card .exit-word{
  color:#e6c56d;
  font-family:Georgia,"Times New Roman",serif;
  font-size:22px;
  font-weight:700;
  letter-spacing:.02em;
}
.day-card .exit-number{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:38px;
  height:34px;
  padding:0 8px;
  border:2px solid #f2efe5;
  border-radius:7px;
  color:#fffdf4;
  font-family:Georgia,"Times New Roman",serif;
  font-size:23px;
  font-weight:700;
  line-height:1;
  text-shadow:0 1px 1px rgba(0,0,0,.35);
}
.day-card .date{color:#d8e3dc!important}
.day-card .state{color:#e6ece8!important}
.day-card .ready{color:#ffd0d5!important}
.day-card .solved{color:#a9f0cf!important}
.day-card .flag{color:#f0dca7!important}
.day-card .today-chip{border-color:#9bb9d8!important;color:#cfe1ff!important;background:rgba(11,17,29,.24)}

/* Desktop/laptop primary surprise CTA: true horizontal centering. */
@media(min-width:621px){
  #video #watchBtn,
  #finale #birthdaySurpriseBtn{
    margin:10px auto 0!important;
  }
}

/* PHONE PORTRAIT: freeze the complete Project 40 header + scoreboard + YOUR EXITS.
   The EXIT list is the only scrolling region. This intentionally does NOT touch
   the already-approved mobile landscape home behavior. */
@media(max-width:620px) and (orientation:portrait){
  html,
  body.home-active{
    height:100%!important;
    height:100dvh!important;
    overflow:hidden!important;
    overscroll-behavior:none!important;
  }
  body.home-active .app-shell{
    width:100%!important;
    max-width:520px!important;
    height:100vh!important;
    height:100dvh!important;
    min-height:0!important;
    overflow:hidden!important;
    display:block!important;
    padding:max(8px,env(safe-area-inset-top)) 10px max(7px,env(safe-area-inset-bottom))!important;
  }
  body.home-active #home.active{
    height:100%!important;
    min-height:0!important;
    display:flex!important;
    flex-direction:column!important;
    overflow:hidden!important;
  }
  body.home-active #home .project40-header,
  body.home-active.home-grid-scrolled #home .project40-header{
    position:relative!important;
    top:auto!important;
    flex:0 0 auto!important;
    max-height:none!important;
    overflow:visible!important;
    opacity:1!important;
    transform:none!important;
    pointer-events:auto!important;
    padding:0 0 7px!important;
  }
  body.home-active #home .score-card{
    position:relative!important;
    top:auto!important;
    flex:0 0 auto!important;
    margin:3px 0 4px!important;
    padding:8px 10px 7px!important;
    background:#131c2a!important;
  }
  body.home-active #home .section-heading{
    position:relative!important;
    top:auto!important;
    flex:0 0 auto!important;
    margin:0!important;
    padding:6px 0 7px!important;
    background:#0b111d!important;
  }
  body.home-active #home .day-grid,
  #home .day-grid{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:8px!important;
    flex:1 1 auto!important;
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    -webkit-overflow-scrolling:touch;
    overscroll-behavior-y:contain!important;
    touch-action:pan-y;
    padding:1px 1px max(14px,env(safe-area-inset-bottom))!important;
  }
  body.home-active #home .test-tools{
    flex:0 0 auto;
    margin:3px 0 0!important;
    font-size:8px;
  }

  /* Mobile finale CTA alignment: independent of text length / device width. */
  #finale #birthdaySurpriseBtn,
  #video #watchBtn{
    width:calc(100% - 12px)!important;
    max-width:480px!important;
    margin:10px auto 0!important;
    align-items:center!important;
    justify-content:center!important;
    text-align:center!important;
  }
}

/* Wrong-answer/surrender popups stay above the soft keyboard. */
.wrong-answer-popover[data-mode="surrender"]{
  border-color:rgba(217,143,158,.42);
}
.wrong-answer-popover[data-mode="surrender"] .wap-ok{
  background:#6d4851;
  border-color:#93606d;
}

/* Mobile landscape puzzle entry: when the keyboard is open, temporarily collapse
   nonessential puzzle chrome so the textbox and UNLOCK button remain usable.
   Home/scoreboard landscape layout is untouched. */
@media(max-width:920px) and (orientation:landscape) and (max-height:620px){
  body.answer-entry-active .app-shell{
    padding:4px 12px!important;
  }
  body.answer-entry-active #puzzle .home-link,
  body.answer-entry-active #puzzle .day-eyebrow,
  body.answer-entry-active #puzzle .secret-mark,
  body.answer-entry-active #puzzle .puzzle-card,
  body.answer-entry-active #puzzle .scroll-cue,
  body.answer-entry-active #puzzle #hintBtn,
  body.answer-entry-active #puzzle .status-panel,
  body.answer-entry-active #puzzle .home-button,
  body.answer-entry-active #puzzle #giveUpBtn{
    display:none!important;
  }
  body.answer-entry-active #puzzle.active{
    display:block!important;
    min-height:var(--visual-height,100dvh)!important;
  }
  body.answer-entry-active #answerArea{
    position:fixed!important;
    z-index:9000!important;
    left:50%!important;
    top:calc(var(--visual-top, 0px) + 4px)!important;
    transform:translateX(-50%)!important;
    width:min(94vw,680px)!important;
    margin:0!important;
    padding:0!important;
  }
  body.answer-entry-active #answerInput{
    margin:0 0 4px!important;
    padding:8px 12px!important;
    min-height:36px!important;
    font-size:16px!important;
  }
  body.answer-entry-active #submitBtn{
    margin:0!important;
    padding:8px 12px!important;
    min-height:34px!important;
    font-size:12px!important;
  }
}

/* =========================================================
   PROJECT 40 v2.3 — MAIN CHAT QA fixes
   ========================================================= */

/* Locked EXIT design: Option A black/neon card + A3 modern digits. */
.day-card{
  border:1px solid #20d98b!important;
  background:linear-gradient(180deg,#101720 0%,#090e15 100%)!important;
  box-shadow:inset 0 0 0 1px rgba(32,217,139,.12),0 9px 22px rgba(0,0,0,.22)!important;
}
.day-card:hover{border-color:#35efa0!important;box-shadow:inset 0 0 0 1px rgba(53,239,160,.16),0 11px 25px rgba(0,0,0,.27)!important}
.day-card .exit-word{color:#e7c75f!important;font-family:Georgia,"Times New Roman",serif!important;font-weight:700!important}
.day-card .exit-number{
  min-width:38px!important;height:36px!important;padding:0 7px!important;
  border:2px solid #20d98b!important;border-radius:5px!important;color:#f5f7f8!important;
  font-family:Arial,"Helvetica Neue",sans-serif!important;font-size:23px!important;font-weight:800!important;
  line-height:36px!important;text-align:center!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;
  font-variant-numeric:tabular-nums lining-nums!important;text-shadow:none!important;
}
.day-card .date{color:#f0f2f3!important}.day-card .state{color:#dfe7e3!important}
.day-card .ready{color:#20d98b!important}.day-card .solved{color:#20d98b!important}.day-card .flag{color:#e7c75f!important}
.day-card .today-chip{border-color:#20d98b!important;color:#e7c75f!important;background:#111820!important}

/* Locked scoreboard treatment: airport split-flap style ONLY on the large score digits. */
.score-main .score-player strong{
  position:relative;display:inline-flex!important;align-items:center;justify-content:center;
  min-width:54px;height:58px;padding:0 8px;border:1px solid #394453;border-radius:5px;
  background:linear-gradient(to bottom,#111820 0%,#111820 49%,#070b10 50%,#0d131b 100%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06),0 5px 12px rgba(0,0,0,.28);
  color:#f3f0e7!important;font-family:"Arial Narrow",Arial,"Helvetica Neue",sans-serif!important;
  font-size:42px!important;font-weight:800!important;line-height:1!important;font-variant-numeric:tabular-nums lining-nums;
  text-shadow:0 1px 0 #000;
}
.score-main .score-player strong::after{content:"";position:absolute;left:3px;right:3px;top:50%;height:1px;background:rgba(0,0,0,.9);box-shadow:0 1px 0 rgba(255,255,255,.055);pointer-events:none}

/* CTA alignment: deterministic centering on laptop and phone. */
#video .actions,#finale .actions{display:flex!important;flex-direction:column!important;align-items:center!important}
#video #watchBtn,#finale #birthdaySurpriseBtn{display:flex!important;align-items:center!important;justify-content:center!important;text-align:center!important;margin:10px auto 0!important;box-sizing:border-box!important}
@media(min-width:621px){#video #watchBtn,#finale #birthdaySurpriseBtn{width:max-content!important;max-width:100%!important;min-width:260px!important}}
@media(max-width:620px){#video #watchBtn,#finale #birthdaySurpriseBtn{width:calc(100% - 24px)!important;max-width:440px!important}}

/* PORTRAIT HOME: natural single page scroll. Branding scrolls away; scoreboard alone sticks.
   This overrides v2.2's accidental whole-screen frozen frame. */
@media(max-width:620px) and (orientation:portrait){
  html,body,body.home-active{height:auto!important;min-height:100%!important;overflow-x:hidden!important;overflow-y:auto!important;overscroll-behavior-y:auto!important}
  body.home-active .app-shell{height:auto!important;min-height:100dvh!important;overflow:visible!important;display:block!important;padding:max(8px,env(safe-area-inset-top)) 10px max(12px,env(safe-area-inset-bottom))!important}
  body.home-active #home.active{height:auto!important;min-height:100dvh!important;display:block!important;overflow:visible!important}
  body.home-active #home .project40-header,body.home-active.home-grid-scrolled #home .project40-header{position:relative!important;top:auto!important;max-height:none!important;overflow:visible!important;opacity:1!important;transform:none!important;pointer-events:auto!important}
  body.home-active #home .score-card{position:sticky!important;top:max(8px,env(safe-area-inset-top))!important;z-index:60!important;margin:3px 0 0!important;background:#131c2a!important}
  body.home-active #home .section-heading{position:sticky!important;top:var(--mobile-score-bottom,150px)!important;z-index:59!important;margin:0!important;padding:7px 0 8px!important;background:#0b111d!important}
  body.home-active #home .day-grid,#home .day-grid{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important;height:auto!important;max-height:none!important;min-height:0!important;overflow:visible!important;padding:1px 1px max(16px,env(safe-area-inset-bottom))!important}
}

/* Compact modal so message + OK always fit inside the visible keyboard-adjusted viewport. */
@media(max-width:920px){
 .wrong-answer-popover{bottom:auto!important;max-height:calc(var(--visual-height,100dvh) - 16px);overflow:auto;padding:12px 14px 10px!important}
 .wap-message{font-size:16px!important;line-height:1.22!important}.wap-remaining{margin-top:5px!important;font-size:10px!important}.wap-ok{margin-top:8px!important;padding:10px 14px!important}
}

/* =========================================================
   PROJECT 40 v2.4 — MAIN CHAT QA hardening
   ========================================================= */

/* Header descender safety: keep the "j" in Project fully clear of MIKA'S JOURNEY. */
.project40-brand{padding-bottom:9px!important}
.project40-handwritten{line-height:1.08!important}
.journey-lockup{margin-top:13px!important}

/* Laptop scoreboard labels: larger and easier to read, same three-column alignment. */
@media(min-width:621px){
  .score-main .score-player small,
  .score-main .score-divider small{
    font-size:12px!important;
    line-height:1.05!important;
    letter-spacing:1.35px!important;
    min-height:16px!important;
    margin-bottom:6px!important;
  }
}

/* Locked EXIT card design: ONLY change the EXIT word from gold/yellow to white. */
.day-card .exit-word{color:#f5f7f8!important}

/* Wrong-answer popup: distinct lavender family, separate from answer blue and SAVE ME. */
.wrong-answer-popover[data-mode="wrong"]{
  background:#403653!important;
  border-color:#cdb9e8!important;
  box-shadow:0 12px 38px rgba(0,0,0,.55),0 0 0 1px rgba(205,185,232,.08) inset!important;
}
.wrong-answer-popover[data-mode="wrong"] .wap-message{color:#fffafc!important}
.wrong-answer-popover[data-mode="wrong"] .wap-remaining{color:#eadff6!important}
.wrong-answer-popover[data-mode="wrong"] .wap-ok{
  background:#b79ad8!important;
  border-color:#d9c7ed!important;
  color:#1b1422!important;
}

/* CTA centering hardening across laptop + phone. */
#video #watchBtn,#finale #birthdaySurpriseBtn{
  margin-left:auto!important;margin-right:auto!important;
  align-self:center!important;left:auto!important;right:auto!important;transform:none!important;
}

/* Portrait-only deterministic score freeze. JS adds this class exactly when the
   scoreboard reaches the top. Landscape is intentionally untouched. */
@media(max-width:620px) and (orientation:portrait){
  body.home-active.portrait-score-fixed #home .score-card{
    position:fixed!important;
    top:max(8px,env(safe-area-inset-top))!important;
    left:var(--portrait-score-left,10px)!important;
    width:var(--portrait-score-width,calc(100vw - 20px))!important;
    margin:0!important;
    z-index:80!important;
    background:#131c2a!important;
  }
  body.home-active.portrait-score-fixed #home .section-heading{
    margin-top:var(--portrait-score-space,0px)!important;
  }
  /* Do not stack YOUR EXITS as a second sticky layer in portrait. */
  body.home-active #home .section-heading{
    position:relative!important;
    top:auto!important;
    z-index:1!important;
  }
}

/* =========================================================
   ROUTE 4T v2.5 — approved MAIN CHAT visual + QA pass
   ========================================================= */
/* Scenic header from approved Route 4T visual target. */
.project40-header{
  position:relative; isolation:isolate; overflow:hidden;
  padding:18px 12px 16px!important; border-radius:0 0 18px 18px;
  background:
    linear-gradient(180deg,rgba(4,12,27,.10),rgba(5,13,28,.34) 56%,rgba(8,17,31,.92)),
    url('route4t-header.png') center 16%/cover no-repeat!important;
  box-shadow:inset 0 -1px 0 rgba(255,255,255,.06);
}
.project40-header::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(5,13,27,.16),transparent 28%,transparent 72%,rgba(5,13,27,.14));pointer-events:none}
.project40-brand{padding:0 42px 18px!important;overflow:visible!important}
.project40-handwritten{line-height:1.22!important;padding:0 0 .16em!important;overflow:visible!important}
.journey-lockup{margin-top:4px!important;position:relative;z-index:2}
.project40-subtitle{text-shadow:0 2px 8px #06101f}
.project40-subline .subline-with{color:#f0cf61!important}.project40-subline .subline-exits{color:#ffd85b!important}
.project40-header .journey-intro{color:#e4ebf6!important;text-shadow:0 2px 8px #06101f;background:rgba(5,13,27,.36);border-radius:10px;padding:5px 10px!important;width:max-content;max-width:96%}

/* Mobile scoreboard labels: intentionally readable, not micro type. */
@media(max-width:620px){
  body.home-active #home .score-main .score-player small,
  body.home-active #home .score-main .score-divider small{
    font-size:10.5px!important;line-height:1.08!important;letter-spacing:1.05px!important;
    min-height:13px!important;margin-bottom:5px!important;font-weight:800!important;
  }
}

/* Wrong answer attempt palette: 1 yellow, 2 lavender, 3 green. */
/* v2.23: one common popup engine; deterministic Green → Purple → Red themes. */
.wrong-answer-popover[data-attempt="1"]{background:#294b3d!important;border-color:#9ed7b9!important}
.wrong-answer-popover[data-attempt="1"] .wap-message{color:#f1fff7!important}.wrong-answer-popover[data-attempt="1"] .wap-remaining{color:#ccebd9!important}.wrong-answer-popover[data-attempt="1"] .wap-ok{background:#91cfad!important;border-color:#b8e4cb!important;color:#10261a!important}
.wrong-answer-popover[data-attempt="2"]{background:#403653!important;border-color:#cdb9e8!important}.wrong-answer-popover[data-attempt="2"] .wap-message{color:#fffafc!important}.wrong-answer-popover[data-attempt="2"] .wap-remaining{color:#eadff6!important}.wrong-answer-popover[data-attempt="2"] .wap-ok{background:#b79ad8!important;border-color:#d9c7ed!important;color:#1b1422!important}
.wrong-answer-popover[data-attempt="3"]{background:#562e36!important;border-color:#e49aa5!important}
.wrong-answer-popover[data-attempt="3"] .wap-message{color:#fff4f5!important}.wrong-answer-popover[data-attempt="3"] .wap-remaining{color:#f4c9cf!important}.wrong-answer-popover[data-attempt="3"] .wap-ok{background:#d97984!important;border-color:#efaab2!important;color:#2b1015!important}

/* Ensure modal remains compact above phone keyboard. */
@media(max-width:620px){
 .wrong-answer-popover{width:min(92vw,390px)!important;padding:10px 13px 9px!important}
 .wap-message{font-size:15px!important;line-height:1.18!important}.wap-remaining{margin-top:4px!important;font-size:9.5px!important}.wap-ok{margin-top:7px!important;padding:9px 12px!important}
}


/* =========================================================
   ROUTE 4T v2.6 — banner + popup reliability QA
   ========================================================= */
/* The approved artwork already contains Route 4T, MIKA'S JOURNEY,
   with 40 EXITS and the intro copy. Hide the HTML copies so the
   banner can never double-render those words. */
.project40-header .project40-brand,
.project40-header .journey-lockup,
.project40-header .journey-intro{display:none!important}

/* Show the complete approved scenic composition on every viewport.
   `contain` is deliberate: it preserves BOTH the moon and the 40 road sign
   instead of cropping either edge on portrait phones. */
.project40-header{
  min-height:0!important;
  aspect-ratio:940/350!important;
  padding:0!important;
  border-radius:0 0 18px 18px!important;
  background-color:#071326!important;
  background-image:url('route4t-header.png')!important;
  background-repeat:no-repeat!important;
  background-position:center center!important;
  background-size:100% 100%!important;
}
.project40-header::after{
  /* Mask ONLY the embedded “Small Puzzles Brighter Days” lettering.
     Keep the moon, road, sign and the rest of the approved scene visible. */
  content:""!important;display:block!important;position:absolute!important;
  left:0!important;bottom:0!important;width:20.5%!important;height:39%!important;
  z-index:3!important;pointer-events:none!important;
  background:linear-gradient(145deg,rgba(4,15,31,.96),rgba(5,19,37,.92) 54%,rgba(7,24,43,.72) 100%)!important;
  border-radius:0 0 0 18px!important;
}
@media(max-width:620px) and (orientation:portrait){
  .project40-header{aspect-ratio:940/350!important;background-size:100% 100%!important;background-position:center!important}
}

/* Preserve the already-approved mobile scoreboard label size. */
@media(max-width:620px){
  body.home-active #home .score-main .score-player small,
  body.home-active #home .score-main .score-divider small{
    font-size:10.5px!important;line-height:1.08!important;letter-spacing:1.05px!important;
    min-height:13px!important;margin-bottom:5px!important;font-weight:800!important;
  }
}

/* v2.6 popup instance is freshly created for every failed attempt. */
.wrong-answer-popover{z-index:10000!important}


/* =========================================================
   ROUTE 4T v2.7 — FINAL QA hardening
   ========================================================= */

/* The banner asset itself is now clean (moon restored; four-word phrase removed).
   Remove the v2.6 masking overlay entirely so it cannot cover the moon. */
.project40-header::after{display:none!important}

/* Modal shield blocks ghost taps from reaching HOME / puzzle controls while
   the soft keyboard changes the visual viewport. */
.wrong-answer-backdrop{
  position:fixed!important;
  inset:0!important;
  z-index:9999!important;
  display:none;
  background:transparent!important;
  pointer-events:auto!important;
  touch-action:none!important;
}
.wrong-answer-backdrop.show{display:block!important}
.wrong-answer-backdrop .wrong-answer-popover{z-index:10000!important}

/* Message content may compress/scroll, but OK stays inside the visible viewport. */
@media(max-width:920px){
  .wrong-answer-popover{
    display:none;
    flex-direction:column!important;
    overflow:hidden!important;
    width:min(92vw,390px)!important;
  }
  .wrong-answer-popover.show{display:flex!important}
  .wap-message{
    flex:0 1 auto!important;
    overflow:auto!important;
    max-height:3.1em!important;
  }
  .wap-remaining{flex:0 0 auto!important}
  .wap-ok{
    flex:0 0 auto!important;
    position:relative!important;
    bottom:auto!important;
  }
}

/* =========================================================
   ROUTE 4T v2.14 — v2.7 stable-baseline anti-flicker patch
   =========================================================
   IMPORTANT: Popup positioning remains the v2.7 implementation.
   Only visual transitions are disabled; JS reveals the modal after
   the original v2.7 placement sequence settles. */
@media(max-width:920px){
  .wrong-answer-popover,
  .wrong-answer-popover.show{
    animation:none!important;
    transition:none!important;
  }
}


/* =========================================================
   ROUTE 4T v2.18 — video attribution + birthday celebration QA
   Stable v2.16 puzzle/popup/keyboard rules above are intentionally untouched.
   ========================================================= */
.gift-from{
  margin:4px auto 10px;
  max-width:620px;
  color:#e9d9f4;
  font-family:Georgia,"Times New Roman",serif;
  font-size:clamp(16px,2.4vw,20px);
  line-height:1.35;
  text-align:center;
}
button.primary:disabled{
  cursor:not-allowed!important;
  opacity:.58!important;
  filter:saturate(.65)!important;
}

/* Use dedicated keyframe names so older birthday CSS cannot override this pass. */
.celebration-layer{
  position:fixed!important;
  top:0!important;
  left:0!important;
  right:auto!important;
  bottom:auto!important;
  z-index:90!important;
  pointer-events:none!important;
  overflow:hidden!important;
  contain:layout paint style!important;
  transform:translateZ(0);
}
.confetti-piece{
  position:absolute!important;
  top:-36px!important;
  opacity:0;
  animation-name:route4tConfettiFall!important;
  animation-timing-function:cubic-bezier(.18,.72,.35,1)!important;
  animation-fill-mode:both!important;
  color:var(--confetti-color,#f3c5d2)!important;
  will-change:transform,opacity;
  backface-visibility:hidden;
}
.birthday-balloon{
  position:absolute!important;
  top:var(--balloon-origin-y,calc(100dvh + 8px))!important;
  bottom:auto!important;
  opacity:0;
  animation-name:route4tBalloonRise!important;
  animation-timing-function:cubic-bezier(.22,.61,.36,1)!important;
  animation-fill-mode:both!important;
  will-change:transform,opacity;
  backface-visibility:hidden;
}
@keyframes route4tConfettiFall{
  0%{transform:translate3d(0,-24px,0) rotate(0deg);opacity:0}
  7%{opacity:1}
  82%{opacity:.96}
  100%{transform:translate3d(var(--drift,0px),var(--celebration-fall,110vh),0) rotate(760deg);opacity:.25}
}
@keyframes route4tBalloonRise{
  0%{transform:translate3d(0,0,0) rotate(-4deg) scale(.94);opacity:0}
  6%{opacity:.98}
  50%{transform:translate3d(10px,var(--celebration-rise-mid,-58vh),0) rotate(5deg) scale(1)}
  100%{transform:translate3d(-8px,var(--celebration-rise-end,-118vh),0) rotate(-3deg) scale(1.03);opacity:.68}
}
@media(prefers-reduced-motion:reduce){
  .confetti-piece{animation-timing-function:linear!important}
  .birthday-balloon{animation-timing-function:linear!important}
}
@media(max-width:620px){
  .gift-from{font-size:16px;margin:3px 12px 9px}
}


/* v2.19 photo puzzle support */
.question-media{display:flex;justify-content:center;align-items:center;margin:0 auto 22px;max-width:min(100%,520px)}
.puzzle-photo{display:block;width:min(100%,520px);max-height:min(52vh,420px);object-fit:contain;border-radius:16px;border:1px solid rgba(255,255,255,.14);box-shadow:0 14px 32px rgba(0,0,0,.28);background:rgba(6,10,18,.55)}
@media(max-width:620px){
 .question-media{margin-bottom:18px;max-width:100%}
 .puzzle-photo{width:100%;max-height:min(42vh,320px);border-radius:14px}
}


/* =========================================================
   ROUTE 4T v2.21 — solved/gift typography refinement only
   ========================================================= */
#video #giftHeading{
  font-size:clamp(25px,3.6vw,32px);
  margin-bottom:10px;
}
#video .gift-from{
  color:#f0cf91;
  font-size:clamp(19px,2.8vw,23px);
  line-height:1.35;
  margin:5px auto 13px;
}
#video .gift-from-name{
  color:#ffd76a;
  font-weight:700;
  font-size:1.13em;
}
@media(max-width:620px){
  #video #giftHeading{font-size:clamp(23px,7.2vw,29px);}
  #video .gift-from{font-size:18px;margin:4px 12px 11px;}
  #video .gift-from-name{font-size:1.1em;}
}


/* =========================================================
   ROUTE 4T v2.22 — mobile regression hardening
   ========================================================= */
#hintBtn{display:none!important}


/* =========================================================
   ROUTE 4T v2.24 — focused mobile QA (EXIT 0–3)
   Standardize photo-puzzle geometry without cropping originals.
   ========================================================= */
.question-media{
  width:min(100%,520px)!important;
  max-width:520px!important;
  aspect-ratio:4/3!important;
  height:auto!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  overflow:hidden!important;
  margin:0 auto 22px!important;
  border-radius:16px!important;
  border:1px solid rgba(255,255,255,.14)!important;
  background:rgba(6,10,18,.72)!important;
  box-shadow:0 14px 32px rgba(0,0,0,.28)!important;
}
.question-media .puzzle-photo{
  width:100%!important;
  height:100%!important;
  max-width:none!important;
  max-height:none!important;
  object-fit:contain!important;
  object-position:center center!important;
  border:0!important;
  border-radius:0!important;
  box-shadow:none!important;
  background:transparent!important;
}
@media(max-width:620px){
  .question-media{width:100%!important;aspect-ratio:4/3!important;margin-bottom:18px!important;border-radius:14px!important}
}


/* v2.26 — Route 4T opening / Rule of the Road screen.
   Live HTML/CSS (not a baked poster) so the approved copy remains crisp on phone + laptop.
   Isolated from HOME/puzzle rules below/above; gameplay layout is intentionally untouched. */
.welcome-screen{width:100%}
body.welcome-active{min-height:100dvh;overflow:auto;background:radial-gradient(circle at 50% -10%,rgba(28,55,103,.36),transparent 34%),linear-gradient(180deg,#071020 0%,#0b1020 54%,#120a1a 100%)}
body.welcome-active .app-shell{width:100%;min-height:100dvh;padding:clamp(12px,2.2vw,24px) 14px 30px}
.welcome-desktop-poster,.welcome-poster-hit{display:none!important}
.welcome-mobile-layout{display:flex;flex-direction:column;gap:14px;width:min(94vw,940px);margin:0 auto}
.welcome-mobile-brand{text-align:center;padding:2px 4px 0}
.welcome-route-sign{position:relative;display:inline-flex;align-items:center;justify-content:center;min-width:min(86vw,620px);padding:7px 28px 17px;border:3px solid #ff70c9;border-radius:22px;background:linear-gradient(180deg,rgba(33,18,46,.94),rgba(8,20,37,.97));box-shadow:0 0 0 2px rgba(255,203,92,.22) inset,0 0 25px rgba(255,84,190,.28);overflow:hidden}
.welcome-route-sign::before{content:"";position:absolute;inset:5px;border:1px solid rgba(255,207,97,.38);border-radius:15px;pointer-events:none}
.welcome-route-sign::after{content:"";position:absolute;left:9%;right:9%;bottom:8px;height:3px;background:repeating-linear-gradient(90deg,#ffd356 0 23px,transparent 23px 38px);filter:drop-shadow(0 0 3px rgba(255,211,86,.45));pointer-events:none}
.welcome-route-mark{position:relative;z-index:1;font-family:"Arial Black",Impact,"Arial Narrow",Arial,sans-serif;font-size:clamp(48px,8vw,86px);font-weight:900;font-style:italic;line-height:.92;letter-spacing:.018em;transform:skewX(-3deg);background:linear-gradient(90deg,#ff64c6 5%,#ff9fbd 47%,#ffd45f 88%);-webkit-background-clip:text;background-clip:text;color:transparent;text-shadow:0 0 22px rgba(255,91,189,.2);white-space:nowrap}
.welcome-route-mark b{font:inherit;font-size:1.06em}
.welcome-journey{margin-top:8px;font-family:Georgia,"Times New Roman",serif;font-weight:700;font-size:clamp(14px,1.9vw,22px);letter-spacing:.26em;color:#f3f0f7}
.welcome-journey em{display:block;margin-top:4px;font-weight:500;font-size:clamp(16px,2vw,24px);letter-spacing:.12em;color:#ff9fce}
.welcome-wiser{margin:9px auto 0;max-width:900px;font-family:"Trebuchet MS",Arial,sans-serif;font-size:clamp(11px,1.35vw,16px);font-weight:800;letter-spacing:.035em;color:#d8c7ec;line-height:1.35}
.welcome-photo-wrap{position:relative;height:clamp(300px,43vw,480px);border-radius:22px;overflow:hidden;border:1px solid rgba(255,111,195,.38);box-shadow:0 18px 42px rgba(0,0,0,.34)}
.welcome-photo-wrap::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(7,10,22,.02) 48%,rgba(8,10,22,.23) 100%);pointer-events:none}
.welcome-photo-wrap img{display:block;width:100%;height:100%;object-fit:cover;object-position:50% 47%}
.welcome-rule-card{padding:18px 22px 17px;border:1px solid rgba(255,86,193,.62);border-radius:20px;background:linear-gradient(145deg,rgba(17,20,50,.97),rgba(26,15,47,.96));box-shadow:0 0 24px rgba(210,62,182,.16)}
.welcome-rule-title{text-align:center;font-family:Georgia,"Times New Roman",serif;font-size:clamp(16px,2vw,23px);font-weight:800;letter-spacing:.15em;color:#ffd7a0;margin-bottom:10px}
.welcome-rule-card p{margin:0;color:#f0edf6;text-align:center;font-size:clamp(14px,1.6vw,18px);line-height:1.46}
.welcome-rule-card p+p{margin-top:10px;color:#d9d3e4}
.welcome-enter{display:flex;align-items:center;justify-content:center;gap:12px;width:100%;min-height:68px;margin:0;padding:15px 18px;border:2px solid #ff9ed6;border-radius:999px;background:linear-gradient(90deg,#ff70c8 0%,#ff9cc2 52%,#ffd37d 100%);color:#25102a;box-shadow:0 10px 28px rgba(255,82,181,.28),inset 0 1px 0 rgba(255,255,255,.65);font-family:"Arial Black",Impact,"Trebuchet MS",Arial,sans-serif;font-size:clamp(20px,2.8vw,34px);font-weight:900;font-style:normal;cursor:pointer;letter-spacing:.025em;text-transform:uppercase}
.welcome-enter b{font-family:Arial,sans-serif;font-style:normal;font-size:34px;line-height:.7}
.welcome-enter:active{transform:translateY(1px) scale(.995)}
.welcome-enter:focus-visible{outline:3px solid #fff;outline-offset:3px}

@media(max-width:700px){
 body.welcome-active .app-shell{padding:max(9px,env(safe-area-inset-top)) 12px max(16px,env(safe-area-inset-bottom))}
 .welcome-mobile-layout{gap:10px;width:100%;max-width:520px;min-height:calc(100dvh - 24px)}
 .welcome-mobile-brand{padding:1px 2px 0}
 .welcome-route-sign{min-width:min(88vw,430px);padding:5px 18px 13px;border-width:2px;border-radius:16px}
 .welcome-route-sign::before{inset:4px;border-radius:11px}
 .welcome-route-sign::after{left:10%;right:10%;bottom:6px;height:2px;background:repeating-linear-gradient(90deg,#ffd356 0 15px,transparent 15px 25px)}
 .welcome-route-mark{font-size:clamp(42px,13vw,62px);letter-spacing:.012em}
 .welcome-journey{margin-top:5px;font-size:12px;letter-spacing:3px}
 .welcome-journey em{margin-top:3px;font-size:15px;letter-spacing:1.8px}
 .welcome-wiser{margin-top:7px;padding:0 3px;font-size:clamp(9px,2.7vw,11.5px);letter-spacing:.02em;line-height:1.28}
 .welcome-photo-wrap{height:clamp(205px,31dvh,286px);border-radius:20px}
 .welcome-photo-wrap img{object-position:63% 48%}
 .welcome-rule-card{padding:13px 15px 12px;border-radius:17px}
 .welcome-rule-title{font-size:14px;letter-spacing:2px;margin-bottom:8px}
 .welcome-rule-card p{font-size:clamp(12px,3.35vw,14px);line-height:1.38}
 .welcome-rule-card p+p{margin-top:8px}
 .welcome-enter{min-height:58px;padding:13px 12px;gap:8px;font-size:clamp(16px,4.35vw,20px);letter-spacing:.015em}
 .welcome-enter b{font-size:30px}
}



/* =========================================================
   v2.28 — mobile-first welcome / Rule of the Road refresh
   Uses the approved Route 4T highway-sign artwork as a header
   and the ORIGINAL uploaded Cybertruck photo without filters.
   ========================================================= */
body.welcome-active{
  min-height:100dvh;
  overflow:auto;
  background:
    radial-gradient(circle at 50% -6%,rgba(63,133,220,.34),transparent 31%),
    linear-gradient(180deg,#174777 0%,#15345e 32%,#102649 65%,#13213a 100%)!important;
}
body.welcome-active .app-shell{
  width:100%;
  min-height:100dvh;
  padding:max(8px,env(safe-area-inset-top)) 10px max(16px,env(safe-area-inset-bottom))!important;
}
.welcome-mobile-layout{
  width:min(100%,520px)!important;
  margin:0 auto!important;
  gap:10px!important;
  display:flex!important;
  flex-direction:column!important;
}
.welcome-top-art{
  display:block;
  width:100%;
  height:auto;
  border-radius:18px;
  border:1px solid rgba(255,193,63,.68);
  box-shadow:0 12px 28px rgba(5,18,43,.28),0 0 0 1px rgba(70,169,255,.24) inset;
}
.welcome-photo-wrap{
  width:100%!important;
  height:auto!important;
  aspect-ratio:2048 / 1351;
  border-radius:18px!important;
  overflow:hidden!important;
  background:#eef3f7!important;
  border:2px solid rgba(255,191,47,.78)!important;
  box-shadow:0 10px 24px rgba(5,18,43,.27),0 0 0 2px rgba(46,154,255,.46)!important;
}
.welcome-photo-wrap::after{display:none!important}
.welcome-photo-wrap img{
  display:block!important;
  width:100%!important;
  height:100%!important;
  object-fit:contain!important;
  object-position:center center!important;
  filter:none!important;
  opacity:1!important;
}
.welcome-rule-card{
  padding:11px 12px 10px!important;
  border-radius:18px!important;
  border:2px solid rgba(255,193,49,.92)!important;
  background:linear-gradient(135deg,rgba(11,43,82,.98),rgba(8,33,69,.99))!important;
  box-shadow:0 10px 25px rgba(5,18,43,.27),0 0 0 2px rgba(42,151,255,.45)!important;
}
.welcome-rule-title{
  margin:0 0 7px!important;
  padding-bottom:7px;
  border-bottom:1px solid rgba(255,208,76,.7);
  text-align:center!important;
  font-family:Georgia,"Times New Roman",serif!important;
  font-size:clamp(18px,5vw,24px)!important;
  line-height:1!important;
  font-weight:900!important;
  letter-spacing:.055em!important;
  color:#ffe079!important;
  text-shadow:0 2px 0 rgba(0,0,0,.28);
}
.welcome-rule-row{
  display:grid;
  grid-template-columns:30px minmax(0,1fr);
  align-items:center;
  gap:8px;
  min-height:34px;
  border-bottom:1px solid rgba(255,255,255,.13);
  color:#fff;
  font-family:Arial,"Helvetica Neue",sans-serif;
  font-size:clamp(11px,3.05vw,14px);
  font-weight:700;
  line-height:1.08;
  white-space:nowrap;
}
.welcome-rule-row:last-child{border-bottom:0}
.welcome-rule-icon{
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:21px;
  filter:drop-shadow(0 0 4px rgba(69,164,255,.45));
}
.welcome-enter{
  position:relative;
  overflow:hidden;
  width:100%!important;
  min-height:62px!important;
  margin:0!important;
  padding:11px 42px 17px 16px!important;
  border:2px solid #ffc636!important;
  border-radius:999px!important;
  background:linear-gradient(180deg,#153a68 0%,#0b274e 58%,#071c38 100%)!important;
  color:#ffe35e!important;
  box-shadow:0 8px 22px rgba(4,17,39,.32),0 0 0 2px rgba(51,168,255,.5),inset 0 1px 0 rgba(255,255,255,.18)!important;
  font-family:Impact,"Arial Black","Roboto Condensed","Arial Narrow",sans-serif!important;
  font-size:clamp(18px,5.1vw,25px)!important;
  font-weight:900!important;
  font-style:italic!important;
  letter-spacing:.025em!important;
  text-transform:uppercase!important;
  text-shadow:0 2px 0 rgba(0,0,0,.46);
}
.welcome-enter::before{
  content:"";
  position:absolute;
  left:14%;
  right:12%;
  bottom:8px;
  height:4px;
  background:repeating-linear-gradient(90deg,#ffd523 0 24px,transparent 24px 39px);
  border-radius:99px;
  opacity:.95;
}
.welcome-enter::after{
  content:"";
  position:absolute;
  left:11px;
  top:12px;
  bottom:15px;
  width:4px;
  background:repeating-linear-gradient(180deg,#ffd523 0 13px,transparent 13px 22px);
  transform:skewX(-19deg);
}
.welcome-enter span{position:relative;z-index:1}
.welcome-enter b{
  position:absolute;
  right:18px;
  top:50%;
  z-index:1;
  transform:translateY(-54%);
  font-family:Arial,sans-serif!important;
  font-size:38px!important;
  line-height:.7!important;
  color:#ffd943;
}
.welcome-enter:active{transform:translateY(1px) scale(.995)}
.welcome-enter:focus-visible{outline:3px solid #fff;outline-offset:3px}

@media (max-width:420px){
  .welcome-mobile-layout{gap:8px!important}
  .welcome-top-art{border-radius:15px}
  .welcome-photo-wrap{border-radius:15px!important}
  .welcome-rule-card{padding:9px 10px 8px!important;border-radius:15px!important}
  .welcome-rule-title{font-size:clamp(17px,5.3vw,21px)!important;margin-bottom:4px!important;padding-bottom:5px}
  .welcome-rule-row{grid-template-columns:27px minmax(0,1fr);gap:6px;min-height:31px;font-size:clamp(10.5px,3vw,12.5px)}
  .welcome-rule-icon{font-size:19px}
  .welcome-enter{min-height:58px!important;padding:10px 38px 15px 14px!important;font-size:clamp(17px,5vw,21px)!important}
  .welcome-enter::before{bottom:7px;height:3px;background:repeating-linear-gradient(90deg,#ffd523 0 18px,transparent 18px 30px)}
  .welcome-enter b{right:15px;font-size:34px!important}
}
@media (max-width:350px){
  .welcome-rule-row{font-size:10.4px}
  .welcome-rule-icon{font-size:18px}
  .welcome-enter{font-size:16px!important}
}

/* =========================================================
   ROUTE 4T v2.29 — approved full-poster mobile welcome
   =========================================================
   The approved scenic composition is the overall screen artwork. The Mika
   photo itself is overlaid from the untouched original upload so it is never
   replaced by an AI-rendered likeness. */
.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
body.welcome-active{
  min-height:100dvh!important;
  overflow:auto!important;
  background:#061a3d!important;
}
body.welcome-active .stars{display:none!important}
body.welcome-active .app-shell{
  width:100%!important;
  max-width:none!important;
  min-height:100dvh!important;
  padding:0!important;
  margin:0!important;
}
#welcome.welcome-screen{width:100%!important;margin:0!important;padding:0!important}
.welcome-poster-shell{
  position:relative;
  width:min(100vw,560px);
  aspect-ratio:941/1672;
  margin:0 auto;
  overflow:hidden;
  background:#071c42;
}
.welcome-poster-bg{
  position:absolute;
  inset:0;
  display:block;
  width:100%;
  height:100%;
  object-fit:fill;
  user-select:none;
  -webkit-user-drag:none;
  pointer-events:none;
}
/* Exact original photo over the rendered photo panel. */
.welcome-original-photo{
  position:absolute;
  left:4.65%;
  top:38.55%;
  width:89.65%;
  height:25.15%;
  object-fit:cover;
  object-position:50% 0%;
  border-radius:3.3% / 6.5%;
  box-sizing:border-box;
  border:2px solid rgba(255,198,54,.92);
  box-shadow:0 0 9px rgba(255,187,35,.72);
  z-index:2;
  pointer-events:none;
}
/* The artwork already contains the styled ENTER button. This transparent
   hit-area preserves the artwork exactly while making the whole button live. */
.welcome-poster-enter{
  position:absolute!important;
  left:4.1%!important;
  right:4.1%!important;
  bottom:3.0%!important;
  width:auto!important;
  height:8.25%!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  border-radius:999px!important;
  background:transparent!important;
  color:transparent!important;
  box-shadow:none!important;
  cursor:pointer!important;
  z-index:4!important;
  -webkit-tap-highlight-color:transparent;
}
.welcome-poster-enter:focus-visible{outline:3px solid #fff!important;outline-offset:-7px!important}
.welcome-poster-enter:active{background:rgba(255,255,255,.06)!important}
@media(min-width:621px){
  .welcome-poster-shell{width:min(720px,72vw)}
}

/* =========================================================
   ROUTE 4T v2.29 — mobile keyboard-safe first-error popup
   ========================================================= */
@media(max-width:920px){
  .wrong-answer-popover[data-attempt="1"]{
    bottom:auto!important;
  }
  .wrong-answer-backdrop.ack-shield{
    display:block!important;
    pointer-events:auto!important;
    touch-action:none!important;
    background:transparent!important;
  }
}


/* =========================================================
   ROUTE 4T v2.30 — Samsung QA refinement only
   - clearer welcome ENTER control, cooler welcome palette
   - all three wrong-answer popups share the same top anchor
   - slightly more compact mobile puzzle/question cards
   ========================================================= */

/* Tone the poster artwork down slightly; the untouched Mika/Cybertruck overlay
   remains above this layer and is not filtered. */
.welcome-poster-bg{
  filter:saturate(.94) brightness(.98) contrast(1.01)!important;
}

/* Make the live hit-area unmistakably look and feel like an actual button.
   It intentionally covers the baked poster button while leaving the scenic
   background and Rule of the Road artwork intact. */
.welcome-poster-enter{
  left:5.0%!important;
  right:5.0%!important;
  bottom:2.55%!important;
  height:8.85%!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:10px!important;
  padding:0 48px 0 22px!important;
  border:3px solid #8ed5ff!important;
  border-radius:999px!important;
  background:linear-gradient(180deg,rgba(22,76,126,.98),rgba(4,31,69,.99))!important;
  color:#f8fbff!important;
  box-shadow:
    0 7px 0 #03172f,
    0 13px 26px rgba(0,0,0,.42),
    0 0 0 2px rgba(255,255,255,.10) inset,
    0 0 14px rgba(82,184,255,.38)!important;
  font-family:Impact,"Arial Narrow",system-ui,sans-serif!important;
  font-size:clamp(18px,5.2vw,27px)!important;
  font-style:italic!important;
  font-weight:900!important;
  letter-spacing:.025em!important;
  line-height:1!important;
  text-shadow:0 2px 0 rgba(0,0,0,.42)!important;
  transform:translateY(-2px);
  transition:transform .08s ease,box-shadow .08s ease,filter .08s ease;
}
.welcome-poster-enter::before{
  content:"";
  position:absolute;
  left:12%;right:12%;bottom:12%;height:3px;
  border-radius:999px;
  background:repeating-linear-gradient(90deg,#dff4ff 0 24px,transparent 24px 39px);
  opacity:.70;
  pointer-events:none;
}
.welcome-enter-label{position:relative;z-index:1;white-space:nowrap}
.welcome-enter-arrow{
  position:absolute;right:17px;top:50%;z-index:1;
  transform:translateY(-53%);
  width:34px;height:34px;border-radius:50%;
  display:grid;place-items:center;
  background:#e9f7ff;color:#062f5e;
  font-family:Arial,sans-serif;font-style:normal;font-size:35px;font-weight:900;line-height:.8;
  box-shadow:0 2px 8px rgba(0,0,0,.28);
}
.welcome-poster-enter:active{
  transform:translateY(4px)!important;
  box-shadow:0 2px 0 #03172f,0 6px 14px rgba(0,0,0,.34),0 0 0 2px rgba(255,255,255,.08) inset!important;
  filter:brightness(1.08);
}
@media(max-width:390px){
  .welcome-poster-enter{font-size:clamp(16px,4.9vw,20px)!important;padding-left:16px!important;padding-right:43px!important}
  .welcome-enter-arrow{right:12px;width:30px;height:30px;font-size:31px}
}

/* All three wrong-answer colors now occupy the same keyboard-safe top slot. */
@media(max-width:920px){
  .wrong-answer-popover[data-mode="wrong"]{bottom:auto!important}
}

/* Slightly tighter puzzle presentation on phones only. Desktop/laptop stays unchanged. */
@media(max-width:620px){
  #puzzle .puzzle-card{
    width:96%!important;
    padding:16px 13px!important;
    margin:10px auto 11px!important;
  }
  #puzzle .card-label{
    margin-bottom:10px!important;
    font-size:10px!important;
    letter-spacing:.06em!important;
  }
  #puzzle .question{
    max-width:28em!important;
    font-size:clamp(16px,4.35vw,18.5px)!important;
    line-height:1.42!important;
  }
  #puzzle .question .gap{height:.65em!important}
  #puzzle .question-media{
    width:92%!important;
    max-width:430px!important;
    margin-bottom:12px!important;
    border-radius:12px!important;
  }
}

/* =========================================================
   ROUTE 4T v2.31 — welcome-only visual refinement
   - removes the baked-in decorative button entirely
   - one unmistakable real highway-sign ENTER button
   - original Mika photo cropped from the original upload (no AI edit)
   - slightly shorter photo card so more winding road is visible
   - gameplay CSS remains untouched
   ========================================================= */
body.welcome-active{
  background:#071f3e!important;
}
.welcome-poster-shell{
  position:relative!important;
  width:min(100vw,560px)!important;
  aspect-ratio:auto!important;
  margin:0 auto!important;
  overflow:hidden!important;
  background:
    linear-gradient(180deg,rgba(6,31,63,.02),rgba(5,25,48,.22)),
    url('welcome-road-bg.png') center bottom/cover no-repeat!important;
}
.welcome-top-full,
.welcome-rule-art{
  position:relative!important;
  display:block!important;
  width:100%!important;
  height:auto!important;
  user-select:none!important;
  -webkit-user-drag:none!important;
  pointer-events:none!important;
  z-index:1!important;
}
.welcome-photo-stage{
  position:relative!important;
  display:flex!important;
  justify-content:center!important;
  align-items:center!important;
  width:100%!important;
  padding:10px 6.2% 16px!important;
  box-sizing:border-box!important;
  background:
    linear-gradient(180deg,rgba(5,26,58,.08),rgba(5,23,49,.16)),
    url('welcome-road-bg.png') center center/cover no-repeat!important;
  z-index:1!important;
}
.welcome-original-photo{
  position:relative!important;
  inset:auto!important;
  left:auto!important;right:auto!important;top:auto!important;bottom:auto!important;
  display:block!important;
  width:100%!important;
  height:auto!important;
  aspect-ratio:1.75/1!important;
  object-fit:cover!important;
  object-position:50% 42%!important;
  border-radius:19px!important;
  box-sizing:border-box!important;
  border:3px solid rgba(245,216,123,.92)!important;
  box-shadow:0 8px 22px rgba(0,0,0,.28)!important;
  filter:none!important;
  z-index:2!important;
}
/* Hide legacy poster-layer image if an old browser restores stale markup. */
.welcome-poster-bg{display:none!important}

/* Real button lives BELOW the artwork. Nothing is underneath it. */
.welcome-poster-enter{
  position:relative!important;
  left:auto!important;right:auto!important;top:auto!important;bottom:auto!important;
  width:90%!important;
  height:auto!important;
  min-height:70px!important;
  margin:10px auto 22px!important;
  padding:10px 56px 10px 20px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:10px!important;
  box-sizing:border-box!important;
  border:4px solid #f8fbf6!important;
  border-radius:18px!important;
  background:linear-gradient(180deg,#147451 0%,#0b573e 52%,#084b36 100%)!important;
  color:#fff!important;
  box-shadow:
    0 7px 0 #043625,
    0 11px 22px rgba(0,0,0,.38),
    inset 0 0 0 2px rgba(255,255,255,.28)!important;
  font-family:"Arial Narrow","Franklin Gothic Medium",Arial,sans-serif!important;
  font-size:clamp(19px,5.2vw,25px)!important;
  font-style:normal!important;
  font-weight:900!important;
  letter-spacing:.015em!important;
  line-height:1.08!important;
  text-transform:uppercase!important;
  text-shadow:0 2px 0 rgba(0,0,0,.28)!important;
  cursor:pointer!important;
  transform:translateY(-2px)!important;
  transition:transform .08s ease,box-shadow .08s ease,filter .08s ease!important;
  -webkit-tap-highlight-color:transparent!important;
  z-index:5!important;
}
.welcome-poster-enter::before{
  content:""!important;
  position:absolute!important;
  inset:6px!important;
  border:2px solid rgba(255,255,255,.72)!important;
  border-radius:11px!important;
  background:none!important;
  pointer-events:none!important;
}
.welcome-enter-label{
  position:relative!important;
  z-index:2!important;
  white-space:nowrap!important;
}
.welcome-enter-arrow{
  position:absolute!important;
  right:16px!important;top:50%!important;
  transform:translateY(-50%)!important;
  width:36px!important;height:36px!important;
  border-radius:9px!important;
  display:grid!important;place-items:center!important;
  background:#fff!important;
  color:#0b573e!important;
  font-family:Arial,sans-serif!important;
  font-size:34px!important;
  font-style:normal!important;
  font-weight:900!important;
  line-height:.8!important;
  box-shadow:0 2px 7px rgba(0,0,0,.26)!important;
  z-index:2!important;
}
.welcome-poster-enter:active{
  transform:translateY(4px)!important;
  box-shadow:0 2px 0 #043625,0 5px 12px rgba(0,0,0,.30),inset 0 0 0 2px rgba(255,255,255,.22)!important;
  filter:brightness(1.07)!important;
}
.welcome-poster-enter:focus-visible{outline:3px solid #ffd65a!important;outline-offset:3px!important}
@media(max-width:390px){
  .welcome-photo-stage{padding:8px 5.6% 13px!important}
  .welcome-original-photo{border-radius:15px!important}
  .welcome-poster-enter{
    width:91%!important;
    min-height:64px!important;
    margin:8px auto 18px!important;
    padding:9px 48px 9px 14px!important;
    font-size:clamp(16px,4.8vw,19px)!important;
  }
  .welcome-enter-arrow{right:12px!important;width:32px!important;height:32px!important;font-size:30px!important}
}


/* ===== v2.32 AUTUMN THEME REFINEMENT ===== */
:root{
  --autumn-gold:#e2ae3d;
  --autumn-wood-1:#7c441a;
  --autumn-wood-2:#3a1d0a;
  --autumn-cream:#f7efe0;
  --autumn-green:#0b684f;
  --autumn-green-deep:#0a4033;
  --autumn-charcoal:#1c2126;
}
body{background:#8b5118!important;color:#fff5e8!important;}
.stars{display:none!important;}
body::before{content:"";position:fixed;inset:0;z-index:-3;background:url('autumn-scene.png') center/cover no-repeat;filter:brightness(.48) saturate(1.05);}
body::after{content:"";position:fixed;inset:0;z-index:-2;background:linear-gradient(180deg,rgba(49,25,7,.58),rgba(71,37,12,.66) 38%,rgba(39,19,6,.72));}
.app-shell{position:relative;z-index:1;max-width:980px!important;}

/* Welcome page */
.welcome-screen{background:transparent!important;padding-bottom:max(24px,env(safe-area-inset-bottom));}
.welcome-poster-shell{display:flex!important;flex-direction:column;gap:14px;align-items:stretch;max-width:920px;margin:0 auto;}
.welcome-top-full,.welcome-top,.welcome-rule-art,.welcome-photo-stage{display:block;width:100%;border-radius:22px;border:3px solid rgba(243,184,68,.95);box-shadow:0 18px 45px rgba(0,0,0,.3),0 0 0 2px rgba(80,38,10,.45) inset;background:#2c1608!important;}
.welcome-top-full{aspect-ratio:auto!important;height:auto!important;object-fit:cover;}
.welcome-photo-stage{padding:0!important;overflow:hidden;background:#241207!important;}
.welcome-original-photo{display:block;width:100%;height:auto;object-fit:cover;}
.welcome-rule-art{padding:0!important;background:none!important;}
.welcome-poster-enter{position:relative!important;display:flex!important;align-items:center;justify-content:center;gap:12px;width:100%;min-height:88px;padding:18px 70px 18px 22px!important;border-radius:24px!important;border:4px solid #f2c358!important;background:linear-gradient(180deg,#13815b,#0b5139)!important;box-shadow:0 18px 36px rgba(0,0,0,.3),inset 0 0 0 2px rgba(255,244,210,.18)!important;color:#fff1be!important;font-family:Impact, Haettenschweiler, 'Arial Black', sans-serif!important;font-size:clamp(22px,5.6vw,40px)!important;font-style:normal!important;font-weight:900!important;letter-spacing:.03em!important;text-transform:uppercase!important;}
.welcome-poster-enter::before{content:'📣';font-size:1.05em;line-height:1;filter:drop-shadow(0 3px 2px rgba(0,0,0,.2));}
.welcome-poster-enter::after{content:'HONK!';position:absolute;right:16px;top:50%;transform:translateY(-50%);font-size:clamp(20px,4.4vw,32px);font-weight:900;color:#ffe478;text-shadow:0 2px 0 rgba(63,30,2,.5);}
.welcome-enter-label{display:block;line-height:1.02;}
.welcome-enter-arrow{display:none!important;}
.welcome-poster-enter:active{transform:translateY(1px) scale(.997);}

/* Home page */
#home{background:transparent!important;}
#home .project40-header{padding:0!important;margin:0 0 14px!important;min-height:auto!important;background:none!important;box-shadow:none!important;border:none!important;}
#home .project40-header .home-header-art{display:block;width:100%;height:auto;border-radius:22px;border:3px solid rgba(243,184,68,.95);box-shadow:0 18px 45px rgba(0,0,0,.3),0 0 0 2px rgba(80,38,10,.45) inset;background:#2c1608;}
#home .score-card{background:linear-gradient(180deg,rgba(106,55,20,.96),rgba(53,25,9,.98))!important;border:3px solid rgba(233,177,57,.96)!important;border-radius:24px!important;box-shadow:0 20px 44px rgba(0,0,0,.3),0 0 0 2px rgba(111,56,21,.42) inset!important;padding:18px 16px 16px!important;margin:10px 0 18px!important;position:relative!important;top:auto!important;}
#home .score-card::before{content:'';position:absolute;inset:10px;border:1px solid rgba(255,235,183,.14);border-radius:16px;pointer-events:none;}
#home .score-main{display:grid!important;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr)!important;align-items:end!important;gap:10px!important;margin-bottom:14px!important;}
#home .score-player{display:flex;flex-direction:column;align-items:center;gap:10px;text-align:center;}
#home .score-player small{display:block;color:#fff1c2!important;font-family:Georgia,'Times New Roman',serif!important;font-size:clamp(17px,4vw,28px)!important;font-weight:800!important;letter-spacing:.02em!important;text-transform:uppercase!important;text-shadow:0 2px 5px rgba(0,0,0,.25);}
#home .score-player strong{display:inline-flex!important;align-items:center;justify-content:center;min-width:3.4em;padding:12px 16px!important;background:linear-gradient(180deg,#0b0d10,#252b31)!important;border:3px solid #533418!important;border-radius:14px!important;box-shadow:inset 0 3px 10px rgba(255,255,255,.07),0 10px 18px rgba(0,0,0,.25)!important;color:#f7f6ef!important;font-family:'Courier New',monospace!important;font-size:clamp(42px,11vw,74px)!important;line-height:1!important;font-weight:900!important;letter-spacing:.18em!important;text-indent:.18em;}
#home .score-divider{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;}
#home .score-divider small{color:#ffe59b!important;font-size:11px!important;font-weight:800!important;letter-spacing:.12em!important;}
#home .score-divider span{display:flex!important;align-items:center;justify-content:center;width:74px;height:74px;border-radius:50%;background:radial-gradient(circle at 30% 30%,#ffe48a,#daa02a 62%,#8b5a12)!important;border:3px solid #f6e3a0!important;box-shadow:0 8px 14px rgba(0,0,0,.25),inset 0 2px 10px rgba(255,255,255,.38)!important;color:#2d1a04!important;font-family:Georgia,'Times New Roman',serif!important;font-size:28px!important;font-weight:900!important;letter-spacing:.03em!important;}
#home .score-stats{display:grid!important;grid-template-columns:repeat(5,minmax(0,1fr))!important;gap:0!important;border-top:2px solid rgba(242,197,97,.45)!important;padding-top:12px!important;color:#fff2dd!important;font-size:11px!important;line-height:1.25!important;}
#home .score-stats span{position:relative;display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:flex-start!important;gap:2px!important;text-align:center!important;padding:0 4px!important;min-width:0;}
#home .score-stats span+span{border-left:1px solid rgba(242,197,97,.35);}
#home .score-stats span::before{display:block;font-size:24px;line-height:1;margin-bottom:2px;color:#f2c14a;}
#home .score-stats span:nth-child(1)::before{content:'🧩';}
#home .score-stats span:nth-child(2)::before{content:'⚑';color:#fff;}
#home .score-stats span:nth-child(3)::before{content:'◎';}
#home .score-stats span:nth-child(4)::before{content:'🔥';}
#home .score-stats span:nth-child(5)::before{content:'🏆';}
#home .score-stats b{display:block;color:#fff!important;font-size:clamp(18px,4.8vw,30px)!important;line-height:1.02!important;font-weight:900!important;margin-top:2px;}
#home .white-flag{display:none!important;}
#home .section-heading{display:block!important;width:fit-content;max-width:92%;margin:12px auto 14px!important;padding:10px 28px!important;background:linear-gradient(180deg,rgba(118,64,22,.98),rgba(63,31,11,.98))!important;border:3px solid rgba(233,177,57,.96)!important;border-radius:18px!important;box-shadow:0 12px 24px rgba(0,0,0,.22),0 0 0 2px rgba(111,56,21,.42) inset!important;color:#fff0ab!important;font-family:Georgia,'Times New Roman',serif!important;font-size:clamp(32px,7vw,52px)!important;font-weight:900!important;letter-spacing:.02em!important;text-transform:uppercase!important;text-align:center!important;}
#home .day-grid,#home.day-grid{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:14px!important;max-height:none!important;overflow:visible!important;padding-bottom:max(18px,env(safe-area-inset-bottom))!important;}
#home .day-card{display:block!important;padding:0!important;min-height:auto!important;border-radius:20px!important;border:3px solid rgba(233,177,57,.96)!important;background:linear-gradient(180deg,rgba(111,56,21,.98),rgba(56,27,11,.99))!important;box-shadow:0 14px 28px rgba(0,0,0,.26),0 0 0 2px rgba(111,56,21,.38) inset!important;overflow:hidden!important;}
#home .day-card:hover{transform:translateY(-1px);border-color:#f2c55c!important;}
#home .day-card .dayline{display:block!important;padding:12px 12px 10px!important;background:linear-gradient(180deg,rgba(129,73,26,.28),rgba(69,33,12,.1));}
#home .day-card .day{display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;min-height:84px!important;border-radius:14px!important;border:3px solid rgba(238,243,236,.95)!important;background:linear-gradient(180deg,#0d7355,#0a523d)!important;box-shadow:inset 0 -8px 18px rgba(0,0,0,.24),0 6px 14px rgba(0,0,0,.14)!important;text-align:center!important;}
#home .day-card .exit-word{display:block!important;color:#eef8f1!important;font-family:Arial Black,Impact,sans-serif!important;font-size:16px!important;line-height:1!important;letter-spacing:.08em!important;font-weight:900!important;}
#home .day-card .exit-number{display:block!important;color:#ffffff!important;font-family:Arial Black,Impact,sans-serif!important;font-size:56px!important;line-height:.95!important;font-weight:900!important;letter-spacing:.02em!important;text-shadow:0 3px 6px rgba(0,0,0,.22)!important;}
#home .day-card .date{background:#f5efe3!important;color:#2a241b!important;font-size:16px!important;font-weight:900!important;letter-spacing:.02em!important;line-height:1.2!important;text-align:center!important;padding:9px 10px!important;margin:0!important;}
#home .day-card .today-chip{margin-left:6px!important;padding:2px 6px!important;border-radius:999px!important;border:1px solid rgba(42,36,27,.18)!important;background:rgba(0,0,0,.06)!important;color:#2a241b!important;font-size:10px!important;font-weight:800!important;}
#home .day-card .state-row{display:grid!important;grid-template-columns:auto minmax(0,1fr) auto!important;align-items:center!important;gap:10px!important;padding:11px 12px 12px!important;background:linear-gradient(180deg,#0f5c47,#0b4737)!important;}
#home .day-card .state-row.ready-state{background:linear-gradient(180deg,#8d6910,#5f4705)!important;}
#home .day-card .state-row.flag-state{background:linear-gradient(180deg,#6a5620,#493b14)!important;}
#home .day-card .state-row.locked-state{background:linear-gradient(180deg,#2d3137,#1d2126)!important;}
#home .day-card .state{margin:0!important;color:#fff5de!important;font-size:clamp(15px,3.2vw,22px)!important;line-height:1.08!important;font-weight:900!important;letter-spacing:.02em!important;text-align:left!important;}
#home .day-card .ready{color:inherit!important;}
#home .day-card .solved{color:inherit!important;}
#home .day-card .flag{color:inherit!important;}
#home .day-card .state-chevron{color:#fff8db!important;font-size:28px!important;font-weight:900!important;line-height:1!important;}
#home .day-card .state-icon{width:28px!important;height:28px!important;display:block!important;flex:0 0 auto!important;}
#home .day-card .solved-icon{color:#4bf25b!important;}
#home .day-card .unsolved-icon{color:#ff4e4e!important;}
#home .day-card .flag-icon{color:#ffffff!important;}

/* Puzzle / other cards retain gameplay, but warm the palette slightly. */
#puzzle .puzzle-card,#confirmGiveUp .puzzle-card,#surrender .answer-reveal,#video .qr-wrap,#finale .finale-content{border-color:rgba(233,177,57,.55)!important;box-shadow:0 14px 34px rgba(0,0,0,.22)!important;}
.primary{background:linear-gradient(180deg,#157752,#0c5038)!important;border-color:#f2c358!important;color:#fff1be!important;}
.secondary,.giveup,.home-link,.home-button{border-color:rgba(233,177,57,.55)!important;}

@media (max-width: 620px){
  .app-shell{padding:10px 10px calc(14px + env(safe-area-inset-bottom))!important;}
  .welcome-poster-shell{gap:12px;}
  .welcome-top-full,.welcome-rule-art,.welcome-photo-stage,#home .project40-header .home-header-art,#home .score-card,#home .section-heading,#home .day-card{border-radius:18px!important;}
  #home .score-player small{font-size:18px!important;}
  #home .score-player strong{font-size:clamp(34px,12vw,56px)!important;padding:10px 12px!important;}
  #home .score-divider span{width:62px;height:62px;font-size:24px!important;}
  #home .score-stats{grid-template-columns:repeat(5,minmax(0,1fr))!important;}
  #home .score-stats span{font-size:8.8px!important;padding:0 2px!important;}
  #home .score-stats span::before{font-size:18px;}
  #home .score-stats b{font-size:16px!important;}
  #home .section-heading{font-size:clamp(26px,8.4vw,40px)!important;padding:8px 20px!important;margin:10px auto 12px!important;}
  #home .day-grid,#home.day-grid{gap:10px!important;}
  #home .day-card .day{min-height:70px!important;}
  #home .day-card .exit-word{font-size:14px!important;}
  #home .day-card .exit-number{font-size:44px!important;}
  #home .day-card .date{font-size:12px!important;padding:7px 8px!important;}
  #home .day-card .state-row{padding:9px 10px 10px!important;gap:8px!important;}
  #home .day-card .state{font-size:clamp(12px,3.5vw,16px)!important;}
  #home .day-card .state-chevron{font-size:24px!important;}
  #home .day-card .state-icon{width:24px!important;height:24px!important;}
}

@media (max-width: 390px){
  #home .score-card{padding:14px 10px 12px!important;}
  #home .score-main{gap:6px!important;}
  #home .score-player strong{font-size:30px!important;letter-spacing:.14em;text-indent:.14em;min-width:3em;padding:8px 10px!important;}
  #home .score-player small{font-size:15px!important;}
  #home .score-divider span{width:54px;height:54px;font-size:20px!important;}
  #home .score-stats span{font-size:7.3px!important;}
  #home .score-stats b{font-size:14px!important;}
  #home .day-card .exit-number{font-size:40px!important;}
  #home .day-card .state{font-size:11.5px!important;}
}

/* =========================================================
   ROUTE 4T v2.32 FINAL AUTUMN QA THEME
   Visual-only HOME/WELCOME refinement. Gameplay mechanics remain unchanged.
   ========================================================= */
html,body{background:#4a270f!important;}
body{color:#fff8ec!important;}
body::before{
  content:""!important;position:fixed!important;inset:0!important;z-index:-3!important;
  background:url('autumn-scene.png') center top/cover no-repeat!important;
  filter:none!important;
}
body::after{
  content:""!important;position:fixed!important;inset:0!important;z-index:-2!important;
  background:linear-gradient(180deg,rgba(48,24,8,.18),rgba(58,29,9,.42) 38%,rgba(35,18,7,.62))!important;
}
.stars{display:none!important;}
.app-shell{max-width:980px!important;}

/* ---------- Welcome / front cover ---------- */
body.welcome-active{overflow-y:auto!important;background:#542b0d!important;}
body.welcome-active .app-shell{width:100%!important;max-width:none!important;min-height:100dvh!important;padding:0!important;}
#welcome.welcome-screen{width:100%!important;margin:0!important;padding:8px 0 max(10px,env(safe-area-inset-bottom))!important;background:transparent!important;}
.welcome-poster-shell{
  display:flex!important;flex-direction:column!important;align-items:center!important;
  width:min(100%,560px)!important;max-width:560px!important;margin:0 auto!important;
  gap:6px!important;padding:0 8px!important;box-sizing:border-box!important;
  background:transparent!important;overflow:visible!important;aspect-ratio:auto!important;
}
.welcome-photo-frame{
  width:94%!important;aspect-ratio:1.90/1!important;overflow:hidden!important;
  border:2px solid rgba(224,164,48,.90)!important;border-radius:16px!important;
  background:#211106!important;box-shadow:0 9px 24px rgba(0,0,0,.24)!important;
}
.welcome-photo-frame .welcome-original-photo{
  position:static!important;display:block!important;width:100%!important;height:100%!important;
  object-fit:cover!important;object-position:center top!important;border:0!important;border-radius:0!important;
  box-shadow:none!important;filter:none!important;transform:none!important;
}
.welcome-title-art{display:block!important;width:94%!important;height:auto!important;margin:0!important;border:0!important;border-radius:0!important;box-shadow:none!important;}
.welcome-rules-art{display:block!important;width:87%!important;height:auto!important;margin:-2px auto 0!important;border:0!important;border-radius:0!important;box-shadow:none!important;}
.welcome-honk-button{
  position:relative!important;display:block!important;width:82%!important;height:auto!important;margin:-2px auto 2px!important;
  padding:0!important;border:0!important;background:transparent!important;box-shadow:none!important;border-radius:18px!important;
  cursor:pointer!important;-webkit-tap-highlight-color:transparent!important;transform-origin:center!important;
}
.welcome-honk-button img{display:block!important;width:100%!important;height:auto!important;pointer-events:none!important;filter:drop-shadow(0 7px 12px rgba(0,0,0,.28));}
.welcome-honk-button:active,.welcome-honk-button.honked{animation:route4t-honk .42s ease both!important;}
.welcome-honk-button:focus-visible{outline:3px solid #fff6c2!important;outline-offset:3px!important;}
@keyframes route4t-honk{
  0%{transform:scale(1)} 18%{transform:scale(.965) rotate(-.7deg)} 38%{transform:scale(1.025) rotate(.7deg)}
  60%{transform:scale(.985) rotate(-.35deg)} 100%{transform:scale(1);filter:brightness(1.08)}
}

/* ---------- Game HOME ---------- */
#home{background:transparent!important;}
#home .project40-header{
  position:relative!important;display:block!important;min-height:0!important;aspect-ratio:auto!important;
  overflow:visible!important;padding:0!important;margin:0 0 9px!important;border:0!important;border-radius:18px!important;
  background:none!important;box-shadow:none!important;
}
#home .project40-header::after{display:none!important;}
#home .project40-header .home-header-art{
  display:block!important;width:100%!important;height:auto!important;border-radius:18px!important;
  border:2px solid rgba(226,170,56,.92)!important;box-shadow:0 12px 28px rgba(0,0,0,.24)!important;
}

/* Wood-and-brass scoreboard inspired by the approved render. */
#home .score-card{
  position:relative!important;top:auto!important;margin:6px 0 10px!important;padding:13px 12px 11px!important;
  border:2px solid #d9a83b!important;border-radius:18px!important;
  background:linear-gradient(180deg,#6b3717 0%,#4b250e 54%,#381b0a 100%)!important;
  box-shadow:0 12px 28px rgba(0,0,0,.28),inset 0 0 0 1px rgba(255,235,179,.14)!important;
}
#home .score-card::before{content:"";position:absolute;inset:6px;border:1px solid rgba(255,226,157,.15);border-radius:13px;pointer-events:none;}
#home .score-main{display:grid!important;grid-template-columns:minmax(0,1fr) 62px minmax(0,1fr)!important;align-items:end!important;gap:7px!important;margin:0 0 10px!important;}
#home .score-player{display:flex!important;flex-direction:column!important;align-items:center!important;gap:6px!important;min-width:0!important;}
#home .score-player small{
  color:#fff4d6!important;font-family:"Arial Narrow","Franklin Gothic Medium",Arial,sans-serif!important;
  font-size:clamp(14px,3.6vw,21px)!important;font-weight:900!important;letter-spacing:.045em!important;line-height:1!important;
  text-transform:uppercase!important;text-shadow:0 2px 3px rgba(0,0,0,.30)!important;white-space:nowrap!important;
}
#home .score-player strong{
  position:relative!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;
  min-width:78px!important;height:64px!important;padding:0 12px!important;border:2px solid #2e1c10!important;border-radius:9px!important;
  background:linear-gradient(180deg,#17191d 0 48%,#07090c 49% 52%,#20242a 53% 100%)!important;
  color:#f8f6ee!important;font-family:"Courier New",monospace!important;font-size:clamp(38px,9.2vw,58px)!important;font-weight:900!important;
  line-height:1!important;letter-spacing:.08em!important;text-indent:.08em!important;font-variant-numeric:tabular-nums!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 5px 10px rgba(0,0,0,.28)!important;text-shadow:0 2px 0 #000!important;
}
#home .score-player strong::after{content:"";position:absolute;left:4px;right:4px;top:50%;height:1px;background:#000;box-shadow:0 1px 0 rgba(255,255,255,.08);}
#home .score-divider{display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:flex-end!important;gap:4px!important;}
#home .score-divider small{display:none!important;}
#home .score-divider span{
  display:grid!important;place-items:center!important;width:52px!important;height:52px!important;border-radius:50%!important;
  border:2px solid #ffe38b!important;background:radial-gradient(circle at 32% 26%,#fff0a9,#d89a24 61%,#845311 100%)!important;
  color:#2b1803!important;font-family:Georgia,serif!important;font-size:18px!important;font-weight:900!important;line-height:1!important;
  box-shadow:0 5px 10px rgba(0,0,0,.28),inset 0 2px 7px rgba(255,255,255,.36)!important;
}
#home .score-stats{
  display:grid!important;grid-template-columns:repeat(5,minmax(0,1fr))!important;gap:0!important;
  border-top:1px solid rgba(239,192,82,.50)!important;padding:9px 0 0!important;margin:0!important;
  color:#fff5e6!important;
}
#home .score-stats .stat-item{
  display:grid!important;grid-template-rows:22px auto auto!important;align-items:center!important;justify-items:center!important;
  gap:1px!important;min-width:0!important;padding:0 3px!important;text-align:center!important;
}
#home .score-stats .stat-item+.stat-item{border-left:1px solid rgba(239,192,82,.34)!important;}
#home .score-stats .stat-icon{display:block!important;font-size:18px!important;line-height:1!important;filter:drop-shadow(0 1px 1px rgba(0,0,0,.25));}
#home .score-stats .stat-label{display:block!important;color:#fff0d2!important;font-family:Arial,sans-serif!important;font-size:8.5px!important;font-weight:800!important;line-height:1.05!important;}
#home .score-stats b{display:block!important;color:#fff!important;font-size:17px!important;font-weight:900!important;line-height:1!important;margin-top:2px!important;}

#home .section-heading{
  width:fit-content!important;max-width:94%!important;margin:8px auto 10px!important;padding:7px 24px!important;
  border:2px solid #d9a83b!important;border-radius:14px!important;
  background:linear-gradient(180deg,#693515,#42200b)!important;color:#fff0ad!important;
  font-family:"Arial Narrow","Franklin Gothic Medium",Arial,sans-serif!important;font-size:clamp(24px,6.8vw,38px)!important;
  font-weight:900!important;letter-spacing:.035em!important;line-height:1!important;text-transform:uppercase!important;text-align:center!important;
  box-shadow:0 8px 18px rgba(0,0,0,.22)!important;
}

/* Solid EXIT tiles. No repeated scenery inside each tile. */
#home .day-grid{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:9px!important;max-height:none!important;overflow:visible!important;padding:0 0 max(14px,env(safe-area-inset-bottom))!important;}
#home .day-card{
  position:relative!important;padding:0!important;min-height:0!important;overflow:hidden!important;
  border:2px solid #d6a036!important;border-radius:14px!important;background:#254d3b!important;color:#fff!important;
  box-shadow:0 7px 16px rgba(0,0,0,.22),inset 0 0 0 1px rgba(255,235,185,.09)!important;
}
#home .day-card::before,#home .day-card::after{content:"";position:absolute;top:0;width:32px;height:32px;opacity:.58;pointer-events:none;background:linear-gradient(135deg,#c94c1d 0 45%,#e8a52e 46% 70%,transparent 71%);}
#home .day-card::before{left:0;clip-path:polygon(0 0,100% 0,0 100%)}
#home .day-card::after{right:0;transform:scaleX(-1);clip-path:polygon(0 0,100% 0,0 100%)}
#home .day-card .dayline{display:block!important;padding:9px 10px 8px!important;background:linear-gradient(180deg,#1b704f,#0b5a40)!important;}
#home .day-card .day{
  display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;
  width:78%!important;min-height:69px!important;margin:0 auto!important;padding:6px 4px!important;
  border:2px solid #eef2e9!important;border-radius:9px!important;background:#08704f!important;
  box-shadow:inset 0 -7px 13px rgba(0,0,0,.18),0 4px 9px rgba(0,0,0,.15)!important;
}
#home .day-card .exit-word{display:block!important;color:#fff!important;font-family:Arial Black,Impact,sans-serif!important;font-size:13px!important;font-weight:900!important;letter-spacing:.08em!important;line-height:1!important;}
#home .day-card .exit-number{display:block!important;color:#fff!important;font-family:Arial Black,Impact,sans-serif!important;font-size:42px!important;font-weight:900!important;line-height:.95!important;text-shadow:0 2px 4px rgba(0,0,0,.28)!important;}
#home .day-card .date{margin:0!important;padding:6px 5px!important;background:#f4ecdc!important;color:#2c2418!important;font-family:Arial,sans-serif!important;font-size:10.5px!important;font-weight:900!important;line-height:1.1!important;text-align:center!important;}
#home .day-card .today-chip{margin-left:3px!important;padding:1px 4px!important;border-radius:999px!important;border:1px solid rgba(34,28,20,.25)!important;background:#fff7e7!important;color:#5b3911!important;font-size:7px!important;font-weight:900!important;}
#home .day-card .state-row{display:grid!important;grid-template-columns:23px minmax(0,1fr) 18px!important;align-items:center!important;gap:5px!important;min-height:42px!important;padding:6px 8px!important;background:#0c4f3b!important;}
#home .day-card .state-row.ready-state{background:linear-gradient(180deg,#376a21,#245017)!important;}
#home .day-card .state-row.solved-state{background:linear-gradient(180deg,#0e6547,#0a4b37)!important;}
#home .day-card .state-row.flag-state{background:linear-gradient(180deg,#71551b,#4d3911)!important;}
#home .day-card .state-row.locked-state{background:linear-gradient(180deg,#34383d,#202328)!important;}
#home .day-card .state{margin:0!important;color:#fff6de!important;font-family:Arial,sans-serif!important;font-size:9.6px!important;font-weight:900!important;letter-spacing:.015em!important;line-height:1.05!important;text-align:left!important;overflow-wrap:anywhere!important;}
#home .day-card .state .ready,#home .day-card .state .solved,#home .day-card .state .flag,#home .day-card .state .locked{color:inherit!important;}
#home .day-card .state-icon{display:block!important;width:22px!important;height:22px!important;}
#home .day-card .solved-icon{color:#4af15f!important;}
#home .day-card .unsolved-icon{color:#ff4d4d!important;}
#home .day-card .flag-icon{color:#fff!important;}
#home .day-card .state-chevron{color:#fff1b1!important;font-family:Arial,sans-serif!important;font-size:22px!important;font-weight:900!important;line-height:1!important;}
#home .day-card:hover{transform:translateY(-1px)!important;border-color:#f0be55!important;}

/* Preserve the proven portrait behavior: branding scrolls away; scoreboard alone freezes. */
@media(max-width:620px) and (orientation:portrait){
  body.home-active .app-shell{height:auto!important;min-height:100dvh!important;overflow:visible!important;display:block!important;padding:max(8px,env(safe-area-inset-top)) 9px max(12px,env(safe-area-inset-bottom))!important;}
  body.home-active #home.active{height:auto!important;min-height:100dvh!important;display:block!important;overflow:visible!important;}
  body.home-active #home .project40-header{position:relative!important;top:auto!important;max-height:none!important;overflow:visible!important;opacity:1!important;transform:none!important;}
  body.home-active #home .score-card{position:sticky!important;top:max(8px,env(safe-area-inset-top))!important;z-index:60!important;margin:4px 0 8px!important;}
  body.home-active.portrait-score-fixed #home .score-card{
    position:fixed!important;top:max(8px,env(safe-area-inset-top))!important;left:var(--portrait-score-left,9px)!important;
    width:var(--portrait-score-width,calc(100vw - 18px))!important;margin:0!important;z-index:80!important;
  }
  body.home-active.portrait-score-fixed #home .section-heading{margin-top:var(--portrait-score-space,0px)!important;}
  body.home-active #home .section-heading{position:relative!important;top:auto!important;z-index:1!important;}
}

@media(max-width:620px){
  .app-shell{padding:8px 9px max(12px,env(safe-area-inset-bottom))!important;}
  #home .project40-header .home-header-art{border-radius:14px!important;}
  #home .score-card{border-radius:15px!important;padding:10px 8px 9px!important;}
  #home .score-main{grid-template-columns:minmax(0,1fr) 48px minmax(0,1fr)!important;gap:5px!important;margin-bottom:8px!important;}
  #home .score-player small{font-size:11px!important;}
  #home .score-player strong{min-width:58px!important;height:48px!important;padding:0 8px!important;font-size:31px!important;border-radius:7px!important;}
  #home .score-divider span{width:42px!important;height:42px!important;font-size:14px!important;}
  #home .score-stats{padding-top:7px!important;}
  #home .score-stats .stat-item{grid-template-rows:18px auto auto!important;padding:0 1px!important;}
  #home .score-stats .stat-icon{font-size:15px!important;}
  #home .score-stats .stat-label{font-size:6.9px!important;}
  #home .score-stats b{font-size:13px!important;}
  #home .section-heading{font-size:24px!important;padding:6px 18px!important;}
}
@media(max-width:390px){
  .welcome-poster-shell{gap:4px!important;padding:0 6px!important;}
  .welcome-photo-frame{width:95%!important;aspect-ratio:1.96/1!important;border-radius:13px!important;}
  .welcome-title-art{width:95%!important;}
  .welcome-rules-art{width:85%!important;}
  .welcome-honk-button{width:80%!important;}
  #home .score-stats .stat-label{font-size:6.2px!important;}
  #home .score-stats b{font-size:12px!important;}
  #home .day-card .exit-number{font-size:37px!important;}
  #home .day-card .state{font-size:8.6px!important;}
}
/* v2.32 specificity cleanup for nested stat spans + sticky wood scoreboard. */
#home .score-stats span::before{content:none!important;display:none!important;}
#home .score-stats .stat-item > span{border-left:0!important;padding:0!important;}
@media(max-width:620px) and (orientation:portrait){
  body.home-active #home .score-card,
  body.home-active.portrait-score-fixed #home .score-card{
    background:linear-gradient(180deg,#6b3717 0%,#4b250e 54%,#381b0a 100%)!important;
    border-color:#d9a83b!important;
  }
}

/* ===== Route 4T v2.33 — FULL FALL THEME + SEQUENTIAL PLAY ===== */
:root{
  --fall-cream:#fff4dc;
  --fall-gold:#d7a33b;
  --fall-bronze:#7c461d;
  --fall-brown:#4d2b16;
  --fall-wood:#342013;
  --fall-green:#0c6247;
  --fall-green-2:#0a513b;
  --fall-red:#cf4d42;
  --fall-ink:#1c160f;
}
html,body{background:#b66a2c!important;}
body{
  background-image:linear-gradient(rgba(255,246,225,.06),rgba(97,45,15,.10)),url('autumn-scene.png')!important;
  background-size:cover!important;background-position:center top!important;background-repeat:no-repeat!important;background-attachment:fixed!important;
}
body::before,body::after{display:none!important;}
.stars{display:none!important;}
.app-shell{background:transparent!important;}
.screen{background:transparent!important;}
#welcome.active,#home.active,#puzzle.active,#confirmGiveUp.active,#surrender.active,#video.active,#finale.active,#review.active{
  position:relative!important;
  background-image:linear-gradient(rgba(255,248,232,.10),rgba(73,35,12,.20)),url('autumn-scene.png')!important;
  background-size:cover!important;background-position:center top!important;background-repeat:no-repeat!important;
  border-radius:20px!important;
}

/* WELCOME: one continuous fall canvas, not separate cards floating on maroon */
.welcome-screen{padding:10px 8px max(18px,env(safe-area-inset-bottom))!important;}
.welcome-poster-shell{
  gap:7px!important;padding:8px 7px 14px!important;border-radius:20px!important;
  background:linear-gradient(rgba(255,248,232,.10),rgba(74,36,13,.08))!important;
  box-shadow:none!important;
}
.welcome-photo-frame,.welcome-title-art,.welcome-rules-art{
  box-shadow:0 8px 18px rgba(56,28,8,.16)!important;
}
.welcome-honk-button{
  display:block!important;width:min(72%,340px)!important;margin:3px auto 8px!important;padding:0!important;border:0!important;background:transparent!important;
  box-shadow:none!important;border-radius:22px!important;overflow:visible!important;transform:none!important;
  -webkit-tap-highlight-color:transparent!important;
}
.welcome-honk-button img{display:block!important;width:100%!important;height:auto!important;border-radius:18px!important;filter:drop-shadow(0 7px 10px rgba(65,34,10,.28))!important;}
.welcome-honk-button::before,.welcome-honk-button::after{display:none!important;content:none!important;}
.welcome-honk-button:active,.welcome-honk-button.honked{transform:scale(.955)!important;filter:brightness(1.06)!important;}

/* HOME: keep the approved wood scoreboard but let fall scenery continue behind it */
#home{padding-bottom:max(18px,env(safe-area-inset-bottom))!important;}
#home .score-card{background:linear-gradient(180deg,rgba(83,45,22,.97),rgba(47,27,15,.98))!important;border-color:#c89131!important;}
#home .score-player small{color:#fff1d1!important;}
#home .score-stats{border-top-color:rgba(230,185,86,.55)!important;}
#home .score-stats .stat-label{color:#fff0d5!important;}
#home .section-heading{background:linear-gradient(180deg,#5b351d,#382114)!important;border-color:#c89131!important;color:#fff2c8!important;}

/* EXIT tiles: ONE continuous green highway sign; no pasted-on black status rectangle. */
#home .day-card{
  background:linear-gradient(180deg,#0d6a4a 0%,#0b5b42 52%,#094d39 100%)!important;
  border:2px solid #d3a13d!important;border-radius:16px!important;overflow:hidden!important;
  box-shadow:0 8px 17px rgba(52,26,8,.24),inset 0 0 0 1px rgba(255,248,220,.10)!important;
}
#home .day-card::before,#home .day-card::after{opacity:.28!important;}
#home .day-card .dayline{background:transparent!important;padding:10px 9px 6px!important;}
#home .day-card .day{
  width:76%!important;min-height:65px!important;background:transparent!important;border:2px solid rgba(238,248,240,.72)!important;
  box-shadow:none!important;border-radius:9px!important;
}
#home .day-card .exit-word{font-size:13px!important;}
#home .day-card .exit-number{font-size:42px!important;}
#home .day-card .date{
  background:transparent!important;color:#fff1d8!important;border-top:1px solid rgba(255,245,215,.16)!important;
  padding:7px 5px!important;font-size:10.5px!important;
}
#home .day-card .state-row,
#home .day-card .state-row.ready-state,
#home .day-card .state-row.solved-state,
#home .day-card .state-row.flag-state,
#home .day-card .state-row.locked-state{
  background:transparent!important;border-top:1px solid rgba(255,245,215,.17)!important;min-height:41px!important;padding:7px 9px!important;
}
#home .day-card .state-row.locked-state{background:rgba(55,28,24,.14)!important;}
#home .day-card .state-row.flag-state{background:rgba(111,82,23,.14)!important;}
#home .day-card .state{color:#fff4df!important;}
#home .day-card .solved-icon{color:#65f079!important;filter:drop-shadow(0 0 3px rgba(47,214,80,.28));}
#home .day-card .unsolved-icon{color:#ff6a62!important;filter:drop-shadow(0 0 3px rgba(255,64,64,.24));}
#home .day-card .flag-icon{color:#fff!important;}
#home .day-card .state-chevron{color:#ffe8a1!important;}

/* Individual game/review/surrender/video screens: same fall journey, no dark wash. */
#puzzle,#confirmGiveUp,#surrender,#video,#finale,#review{
  color:#2b2117!important;padding:18px 16px max(24px,env(safe-area-inset-bottom))!important;
}
#puzzle::before,#confirmGiveUp::before,#surrender::before,#video::before,#finale::before,#review::before{
  content:"";position:absolute;inset:0;z-index:-1;border-radius:20px;
  background:linear-gradient(180deg,rgba(255,250,239,.82),rgba(250,232,197,.80) 55%,rgba(239,201,142,.78));
  backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px);
}
.home-link,.day-eyebrow,.muted{color:#5e4029!important;}
.secret-mark{color:#a75a2b!important;}
#puzzle .puzzle-card,#confirmGiveUp .puzzle-card,#review .puzzle-card{
  background:linear-gradient(180deg,rgba(255,251,241,.96),rgba(248,232,198,.96))!important;
  border:2px solid #b97a32!important;color:#2d2116!important;box-shadow:0 8px 20px rgba(84,44,14,.16)!important;
}
#puzzle .card-label,#review .card-label{color:#8a5425!important;font-weight:900!important;}
#puzzle .question,#review .question{color:#302317!important;text-shadow:none!important;}
#puzzle .scroll-cue{color:#694725!important;}
#answerInput{
  background:rgba(255,252,244,.95)!important;border:2px solid #9b6a35!important;color:#2a2119!important;box-shadow:0 5px 14px rgba(76,39,12,.10)!important;
}
#answerInput::placeholder{color:#765b43!important;opacity:.9!important;}
.primary,#submitBtn,#watchBtn,#birthdaySurpriseBtn,#surrenderSurpriseBtn,#reviewGiftBtn{
  background:linear-gradient(180deg,#176b4d,#0d513b)!important;border:2px solid #b88932!important;color:#fff7d9!important;
  box-shadow:0 7px 14px rgba(61,31,8,.18),inset 0 1px 0 rgba(255,255,255,.12)!important;
}
.secondary,.home-button,.giveup{
  background:linear-gradient(180deg,#714526,#4d301c)!important;border:2px solid #b07b39!important;color:#fff2d6!important;
}

/* Unified mature autumn popup. Every wrong/surrender popup uses exactly this one style & top anchor. */
.wrong-answer-backdrop{background:rgba(44,25,11,.10)!important;}
.wrong-answer-popover,
.wrong-answer-popover[data-attempt="1"],
.wrong-answer-popover[data-attempt="2"],
.wrong-answer-popover[data-attempt="3"],
.wrong-answer-popover[data-mode="surrender"]{
  background:linear-gradient(180deg,#50301d,#342014)!important;border:2px solid #d1a04a!important;color:#fff4dc!important;
  box-shadow:0 10px 28px rgba(45,22,6,.30),inset 0 0 0 1px rgba(255,237,190,.08)!important;
}
.wrong-answer-popover .wap-message{color:#fff5e5!important;font-family:Georgia,'Times New Roman',serif!important;font-weight:700!important;}
.wrong-answer-popover .wap-remaining{color:#e9cfa6!important;}
.wrong-answer-popover .wap-ok{
  background:linear-gradient(180deg,#a96f2d,#7e4d20)!important;border:1px solid #e2b35d!important;color:#fff7e5!important;
}

/* Sequence gate uses same top-prompt visual language. */
.sequence-gate-backdrop{position:fixed;inset:0;z-index:12000;background:rgba(43,25,11,.16);display:block;}
.sequence-gate-popup{position:absolute;top:max(10px,env(safe-area-inset-top));left:50%;transform:translateX(-50%);width:min(92vw,560px);padding:17px 16px 15px;border-radius:18px;border:2px solid #d1a04a;background:linear-gradient(180deg,#50301d,#342014);box-shadow:0 12px 28px rgba(45,22,6,.30);color:#fff4dc;text-align:center;}
.sequence-gate-title{font-weight:900;font-size:18px;letter-spacing:.03em;margin-bottom:8px;color:#ffe0a3;}
.sequence-gate-copy{font-size:15px;line-height:1.45;}
.sequence-gate-popup button{margin-top:12px;width:100%;min-height:48px;border-radius:12px;border:1px solid #e2b35d;background:linear-gradient(180deg,#176b4d,#0d513b);color:#fff7d9;font-weight:900;font-size:15px;}

/* Read-only completed EXIT review. */
.review-badge{width:max-content;max-width:100%;margin:8px auto 12px;padding:6px 12px;border-radius:999px;background:#6d4527;color:#fff2d5;font-size:11px;font-weight:900;letter-spacing:.06em;}
.review-answer-card{margin:14px auto 18px;width:min(100%,720px);padding:18px 16px;border:2px solid #b97a32;border-radius:18px;background:linear-gradient(180deg,rgba(255,250,236,.97),rgba(245,221,177,.97));text-align:center;box-shadow:0 8px 20px rgba(84,44,14,.14);}
.review-answer-label{font-size:11px;font-weight:900;letter-spacing:.12em;color:#845025;}
.review-answer{margin:7px 0 5px;color:#2c2118;font-family:Georgia,'Times New Roman',serif;font-size:clamp(22px,6vw,36px);font-weight:800;white-space:nowrap;overflow-x:auto;}
.review-outcome{font-size:12px;color:#6a4c31;font-weight:700;}

/* Reveal page answer: 60–70% of prior visual size and never wrap. */
#surrender .answer-reveal{white-space:nowrap!important;overflow-x:auto!important;max-width:100%!important;padding:14px 10px!important;color:#2d2118!important;background:rgba(255,250,237,.80)!important;border:2px solid #b97a32!important;border-radius:16px!important;text-shadow:none!important;}
#surrender h2,#video h2,#finale h2{color:#3b2819!important;text-shadow:none!important;}

@media(max-width:620px){
  .welcome-poster-shell{gap:5px!important;padding:6px!important;}
  .welcome-honk-button{width:min(64%,280px)!important;margin:1px auto 7px!important;}
  #puzzle,#confirmGiveUp,#surrender,#video,#finale,#review{padding:14px 10px max(18px,env(safe-area-inset-bottom))!important;}
  #puzzle .puzzle-card,#review .puzzle-card{padding:15px 12px!important;margin:12px auto!important;}
  #puzzle .question,#review .question{font-size:clamp(16px,4.4vw,19px)!important;line-height:1.42!important;}
  #home .day-card{border-radius:12px!important;}
  #home .day-card .day{min-height:60px!important;}
  #home .day-card .exit-number{font-size:38px!important;}
  #home .day-card .date{font-size:9.5px!important;}
  #home .day-card .state{font-size:8.6px!important;}
}

/* ===== Route 4T v2.34 — FINAL PRE-LAUNCH VISUAL CLEANUP ===== */
html,body{
  background:#f2d6a6!important;
  background-image:linear-gradient(rgba(255,248,232,.36),rgba(239,199,138,.22)),url('fall-leaves-bg.svg')!important;
  background-size:auto,520px 730px!important;
  background-repeat:repeat,repeat!important;
  background-position:center top,center top!important;
  background-attachment:scroll,scroll!important;
}
#welcome.active,#home.active,#puzzle.active,#confirmGiveUp.active,#surrender.active,#video.active,#finale.active,#review.active{
  background:transparent!important;
  background-image:none!important;
}

/* Welcome: preserve every edge of the artwork; the fall leaves belong to the page, not a stretched photo. */
.welcome-screen{background:transparent!important;overflow:visible!important;}
.welcome-poster-shell{
  width:100%!important;max-width:520px!important;margin:0 auto!important;padding:8px 8px 16px!important;
  gap:8px!important;background:rgba(255,247,229,.16)!important;overflow:visible!important;border-radius:22px!important;
}
.welcome-photo-frame{width:96%!important;margin:0 auto!important;overflow:hidden!important;border-radius:18px!important;}
.welcome-title-art,.welcome-rules-art{
  display:block!important;width:94%!important;max-width:94%!important;height:auto!important;max-height:none!important;
  object-fit:contain!important;object-position:center!important;margin:0 auto!important;overflow:visible!important;
  border-radius:14px!important;
}
.welcome-rules-art{width:90%!important;max-width:90%!important;}
.welcome-honk-button{width:min(56%,250px)!important;margin:4px auto 10px!important;overflow:visible!important;}
.welcome-honk-button img{width:100%!important;height:auto!important;object-fit:contain!important;}

/* GAME HOME: clean fall background, no photo wash. */
#home{background:transparent!important;}
#home .project40-header{background:transparent!important;}
#home .project40-header .home-header-art{display:block!important;width:100%!important;height:auto!important;object-fit:contain!important;}
#home .score-card{
  background:linear-gradient(180deg,#653718 0%,#4a2814 56%,#382012 100%)!important;
  border:2px solid #c89231!important;box-shadow:0 8px 18px rgba(70,36,10,.24)!important;
}

/* YOUR EXITS is a centered full-width sticky road sign. */
#home .section-heading{
  width:100%!important;box-sizing:border-box!important;text-align:center!important;display:block!important;
  margin:0 0 8px!important;padding:8px 12px!important;border:2px solid #c89231!important;border-radius:13px!important;
  background:linear-gradient(180deg,#0b5f43,#084934)!important;color:#fff4cf!important;
  font-family:Georgia,'Times New Roman',serif!important;font-weight:900!important;letter-spacing:.06em!important;
  box-shadow:0 6px 12px rgba(64,34,11,.18)!important;
}

/* EXIT cards: one single highway-green sign. No brown backing, no separate bands, no extra divider lines. */
#home .day-card{
  background:#075b3f!important;border:2px solid #c89433!important;border-radius:14px!important;
  padding:12px 10px 11px!important;box-shadow:0 7px 14px rgba(63,34,13,.20)!important;overflow:hidden!important;
}
#home .day-card::before,#home .day-card::after{display:none!important;content:none!important;}
#home .day-card .dayline{display:block!important;padding:0!important;background:transparent!important;border:0!important;}
#home .day-card .day{
  width:100%!important;min-height:0!important;padding:0!important;margin:0!important;border:0!important;border-radius:0!important;
  background:transparent!important;box-shadow:none!important;display:flex!important;flex-direction:column!important;align-items:center!important;
  justify-content:center!important;color:#fff!important;
}
#home .day-card .exit-word{font-family:system-ui,sans-serif!important;font-size:12px!important;line-height:1!important;font-weight:900!important;color:#fff!important;letter-spacing:.05em!important;}
#home .day-card .exit-number{margin-top:3px!important;font-family:system-ui,sans-serif!important;font-size:40px!important;line-height:.95!important;font-weight:900!important;color:#fff!important;text-shadow:0 2px 4px rgba(0,0,0,.20)!important;}
#home .day-card .date{
  margin:8px 0 0!important;padding:0!important;background:transparent!important;border:0!important;color:#fff1d9!important;
  font-size:10px!important;line-height:1.2!important;font-weight:800!important;text-align:center!important;
}
#home .day-card .state-row,
#home .day-card .state-row.ready-state,
#home .day-card .state-row.solved-state,
#home .day-card .state-row.flag-state,
#home .day-card .state-row.locked-state{
  margin:9px 0 0!important;padding:0!important;min-height:25px!important;background:transparent!important;border:0!important;
  display:grid!important;grid-template-columns:22px minmax(0,1fr) 15px!important;gap:6px!important;align-items:center!important;
}
#home .day-card .state{margin:0!important;padding:0!important;color:#fff!important;font-size:8.8px!important;line-height:1.15!important;font-weight:850!important;text-align:left!important;overflow-wrap:anywhere!important;}
#home .day-card .state-icon{width:20px!important;height:20px!important;}
#home .day-card .state-chevron{font-size:24px!important;line-height:1!important;color:#ffe8a3!important;align-self:center!important;}
#home .day-card .solved-icon{color:#57e77a!important;}
#home .day-card .unsolved-icon{color:#ff6c68!important;}
#home .day-card .flag-icon{color:#fff!important;}

/* Fall puzzle/review/result pages: light translucent cream content over leaf background. */
#puzzle,#confirmGiveUp,#surrender,#video,#finale,#review{
  background:rgba(255,248,232,.34)!important;color:#2d2116!important;border-radius:20px!important;
}
#puzzle::before,#confirmGiveUp::before,#surrender::before,#video::before,#finale::before,#review::before{
  background:linear-gradient(180deg,rgba(255,251,241,.56),rgba(250,230,193,.42))!important;
  backdrop-filter:none!important;-webkit-backdrop-filter:none!important;
}
#puzzle .puzzle-card,#review .puzzle-card,#confirmGiveUp .puzzle-card{
  background:linear-gradient(180deg,#fff9ea,#f7e4bf)!important;border:2px solid #c9862d!important;color:#332417!important;
}
#puzzle .question,#review .question{color:#392719!important;}
#puzzle .card-label,#review .card-label{color:#9a5c20!important;}
#puzzle .scroll-cue{color:#6f4726!important;}
#answerInput{
  background:#fffaf0!important;border:2px solid #b77a31!important;color:#2d2117!important;box-shadow:none!important;
}
#answerInput::placeholder{color:#6f5a45!important;opacity:.88!important;}

/* Every wrong-answer and surrender popup uses exactly one adult autumn style. */
.wrong-answer-popover,
.wrong-answer-popover[data-attempt="1"],
.wrong-answer-popover[data-attempt="2"],
.wrong-answer-popover[data-attempt="3"],
.wrong-answer-popover[data-mode="wrong"],
.wrong-answer-popover[data-mode="surrender"]{
  background:linear-gradient(180deg,#fff8e7,#f4dba9)!important;
  border:2px solid #c87925!important;color:#3d2615!important;
  box-shadow:0 10px 24px rgba(79,43,14,.28)!important;
}
.wrong-answer-popover .wap-message,
.wrong-answer-popover[data-attempt="1"] .wap-message,
.wrong-answer-popover[data-attempt="2"] .wap-message,
.wrong-answer-popover[data-attempt="3"] .wap-message{
  color:#542d18!important;font-family:Georgia,'Times New Roman',serif!important;font-weight:800!important;
}
.wrong-answer-popover .wap-remaining{color:#75502d!important;}
.wrong-answer-popover .wap-ok,
.wrong-answer-popover[data-attempt="1"] .wap-ok,
.wrong-answer-popover[data-attempt="2"] .wap-ok,
.wrong-answer-popover[data-attempt="3"] .wap-ok,
.wrong-answer-popover[data-mode="surrender"] .wap-ok{
  background:linear-gradient(180deg,#168057,#0c6247)!important;border:1px solid #a16a28!important;color:#fff8dd!important;
}

/* Simpler, brighter surrender confirmation. */
#confirmGiveUp{text-align:center!important;}
#confirmGiveUp h2{color:#5b321a!important;font-size:clamp(30px,8vw,44px)!important;margin:8px 0 12px!important;}
#confirmGiveUp .puzzle-card.compact{padding:16px 14px!important;margin:12px auto 16px!important;}
#confirmGiveUp .puzzle-card.compact p{margin:4px 0!important;font-size:16px!important;line-height:1.35!important;color:#472d1d!important;}
#tryAgainBtn{background:linear-gradient(180deg,#f7e6bf,#e6c78e)!important;color:#3d2919!important;border:2px solid #b87b32!important;}
#saveMeBtn{background:linear-gradient(180deg,#a74a2c,#7f351f)!important;color:#fff7e7!important;border:2px solid #c9823e!important;}

/* Consolation/final answer: lighter panel, smaller one-line answer. */
#surrender{text-align:center!important;}
#surrender h2{font-size:clamp(28px,7vw,40px)!important;color:#5a321c!important;line-height:1.08!important;}
#surrender .answer-reveal{
  font-size:clamp(15px,4.4vw,20px)!important;line-height:1.15!important;white-space:nowrap!important;overflow-x:auto!important;overflow-y:hidden!important;
  width:100%!important;max-width:100%!important;padding:13px 10px!important;background:#fff4d2!important;border:2px solid #c7852c!important;
  color:#5b3118!important;font-weight:800!important;text-align:center!important;box-sizing:border-box!important;
}
#surrender .muted{color:#60442e!important;}
#surrenderSurpriseBtn{background:linear-gradient(180deg,#168057,#0c6247)!important;}

/* Sequence modal keeps the proven logic but adopts the lighter fall style. */
.sequence-gate-backdrop{background:rgba(68,38,16,.24)!important;}
.sequence-gate-popup{background:linear-gradient(180deg,#fff8e7,#f4dba9)!important;border-color:#c87925!important;color:#412717!important;}
.sequence-gate-title{color:#6b381b!important;}
.sequence-gate-copy{color:#4a3020!important;}
.sequence-gate-popup button{background:linear-gradient(180deg,#168057,#0c6247)!important;color:#fff8dc!important;}

@media(max-width:620px){
  .app-shell{padding:8px 10px max(14px,env(safe-area-inset-bottom))!important;}
  .welcome-poster-shell{padding:7px 5px 14px!important;gap:6px!important;}
  .welcome-photo-frame{width:96%!important;}
  .welcome-title-art{width:95%!important;max-width:95%!important;}
  .welcome-rules-art{width:89%!important;max-width:89%!important;}
  .welcome-honk-button{width:min(54%,235px)!important;margin-top:3px!important;}

  body.home-active #home .score-card,
  body.home-active.portrait-score-fixed #home .score-card{background:linear-gradient(180deg,#653718,#4a2814 56%,#382012)!important;}
  body.home-active #home .section-heading,
  body.home-active.portrait-score-fixed #home .section-heading{
    position:sticky!important;top:calc(var(--mobile-score-bottom,142px) + 5px)!important;z-index:79!important;
    width:100%!important;margin:0 0 8px!important;padding:7px 10px!important;font-size:21px!important;
  }
  body.home-active.portrait-score-fixed #home .section-heading{margin-top:var(--portrait-score-space,0px)!important;}

  #home .day-card{padding:11px 9px 10px!important;min-height:126px!important;}
  #home .day-card .exit-number{font-size:36px!important;}
  #home .day-card .date{font-size:9.2px!important;margin-top:7px!important;}
  #home .day-card .state{font-size:8.2px!important;}

  #answerInput{font-size:12.5px!important;letter-spacing:.01em!important;padding-left:12px!important;padding-right:12px!important;}
  #answerInput::placeholder{font-size:12.5px!important;letter-spacing:.01em!important;}

  .wrong-answer-popover,
  .wrong-answer-popover[data-attempt="1"],
  .wrong-answer-popover[data-attempt="2"],
  .wrong-answer-popover[data-attempt="3"],
  .wrong-answer-popover[data-mode="surrender"]{
    width:min(92vw,390px)!important;top:calc(var(--visual-top,0px) + 10px)!important;bottom:auto!important;
  }
  .wap-message{font-size:16px!important;}
  #confirmGiveUp .puzzle-card.compact p{font-size:15px!important;}
}

@media(max-width:390px){
  .welcome-title-art{width:96%!important;max-width:96%!important;}
  .welcome-rules-art{width:90%!important;max-width:90%!important;}
  .welcome-honk-button{width:min(56%,220px)!important;}
  #home .section-heading{font-size:19px!important;}
  #home .day-card .exit-number{font-size:34px!important;}
  #answerInput,#answerInput::placeholder{font-size:11.7px!important;}
}

/* ======================================================================
   ROUTE 4T v2.35 — LAUNCH QA VISUAL CORRECTIONS
   - non-stretched repeating fall-leaf background
   - sticky scoreboard + YOUR EXITS stack
   - Route 40 shield + EXIT sign tiles
   - mature unified autumn alerts
   - transparent answer field + embossed controls
   ====================================================================== */
:root{
  --r4t-leaf-cream:#f9edcf;
  --r4t-leaf-tan:#efd39c;
  --r4t-rust:#a7542d;
  --r4t-rust-dark:#73361f;
  --r4t-bronze:#9d6b32;
  --r4t-brown:#4b2c1b;
  --r4t-green:#0b6348;
  --r4t-green-dark:#084c38;
  --r4t-ink:#2f2117;
}

/* One real fall-leaf canvas. The SVG repeats at its natural ratio; it is never stretched. */
html,body{
  background-color:#efd39c!important;
  background-image:url('fall-leaves-bg.svg')!important;
  background-repeat:repeat!important;
  background-size:320px auto!important;
  background-position:top center!important;
  background-attachment:fixed!important;
}
body::before,body::after,.stars{display:none!important;content:none!important;}
.app-shell{background:transparent!important;}
#welcome.active,#home.active,#puzzle.active,#review.active,#confirmGiveUp.active,#surrender.active,#video.active,#finale.active{
  background-image:none!important;
  background-color:rgba(255,248,231,.20)!important;
  box-shadow:none!important;
}

/* WELCOME — keep Mika as a normal image, never as a stretched page background. */
#welcome .welcome-poster-shell{
  background:transparent!important;
  overflow:visible!important;
  padding:8px 10px max(16px,env(safe-area-inset-bottom))!important;
  gap:8px!important;
}
#welcome .welcome-photo-frame{
  width:min(94%,520px)!important;
  overflow:hidden!important;
  border-radius:16px!important;
  border:2px solid rgba(126,73,33,.58)!important;
  background:#f8e6bd!important;
  box-shadow:0 6px 16px rgba(79,44,20,.18)!important;
}
#welcome .welcome-original-photo{display:block!important;width:100%!important;height:auto!important;object-fit:cover!important;}
#welcome .welcome-title-art{
  width:min(91%,500px)!important;max-width:91%!important;height:auto!important;object-fit:contain!important;
  margin:0 auto!important;overflow:visible!important;clip-path:none!important;
}
#welcome .welcome-rules-art{
  width:min(84%,450px)!important;max-width:84%!important;height:auto!important;object-fit:contain!important;
  margin:0 auto!important;overflow:visible!important;clip-path:none!important;
}
#welcome .welcome-honk-button{
  width:min(48%,205px)!important;max-width:205px!important;margin:2px auto 8px!important;
  overflow:visible!important;background:transparent!important;border:0!important;box-shadow:none!important;
}
#welcome .welcome-honk-button img{width:100%!important;height:auto!important;display:block!important;object-fit:contain!important;}
#welcome .welcome-honk-button:active,#welcome .welcome-honk-button.honked{transform:scale(.94)!important;}

/* HOME — sticky scoreboard + YOUR EXITS as one stack, so the heading cannot slide behind it. */
#home{background:transparent!important;}
#home .project40-header{background:transparent!important;}
#home .home-header-art{display:block!important;width:100%!important;height:auto!important;object-fit:contain!important;border-radius:14px!important;}
#home .home-sticky-stack{width:100%!important;box-sizing:border-box!important;z-index:90!important;}
#home .home-sticky-stack .score-card{margin:4px 0 5px!important;}
#home .home-sticky-stack .section-heading{
  display:flex!important;align-items:center!important;justify-content:center!important;text-align:center!important;
  width:100%!important;box-sizing:border-box!important;margin:0 0 8px!important;padding:8px 12px!important;
  color:#fff7df!important;background:linear-gradient(180deg,#7d4728,#59311d)!important;
  border:2px solid #b9813f!important;border-radius:12px!important;
  font-family:Georgia,'Times New Roman',serif!important;font-weight:900!important;letter-spacing:.08em!important;
  box-shadow:0 3px 0 #4d2918,0 6px 12px rgba(76,43,20,.15)!important;
}
@media(max-width:620px) and (orientation:portrait){
  body.home-active #home .home-sticky-stack{
    position:sticky!important;top:max(7px,env(safe-area-inset-top))!important;z-index:90!important;
  }
  /* JS still measures the scoreboard for older builds; v2.35 intentionally lets the wrapper own stickiness. */
  body.home-active #home .score-card,
  body.home-active.portrait-score-fixed #home .score-card{
    position:relative!important;top:auto!important;left:auto!important;width:auto!important;margin:4px 0 5px!important;z-index:auto!important;
  }
  body.home-active #home .section-heading,
  body.home-active.portrait-score-fixed #home .section-heading{
    position:relative!important;top:auto!important;margin:0 0 8px!important;width:100%!important;
  }
}

/* EXIT TILE — one green highway tile, with a Route 40 shield and a real EXIT sign. */
#home .day-card{
  background:linear-gradient(180deg,#0b684b 0%,#095a42 100%)!important;
  border:2px solid #efe8d5!important;border-radius:14px!important;padding:11px 10px 10px!important;
  box-shadow:0 5px 0 #5b3a21,0 8px 15px rgba(70,42,22,.18)!important;
  overflow:visible!important;min-height:136px!important;
}
#home .day-card::before,#home .day-card::after{display:none!important;content:none!important;}
#home .route-tile-signs{
  display:grid!important;grid-template-columns:64px minmax(0,1fr)!important;gap:8px!important;align-items:center!important;
  width:100%!important;margin:0!important;padding:0!important;
}
#home .route-shield{
  width:62px!important;height:68px!important;display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;
  background:#fff!important;color:#111!important;clip-path:polygon(18% 0,82% 0,100% 22%,90% 69%,50% 100%,10% 69%,0 22%)!important;
  box-shadow:inset 0 0 0 3px #161616!important;font-family:Arial,Helvetica,sans-serif!important;
}
#home .route-shield .route-word{font-size:9px!important;font-weight:900!important;line-height:1!important;letter-spacing:.07em!important;margin-top:-2px!important;}
#home .route-shield .route-number{font-size:31px!important;font-weight:900!important;line-height:.95!important;letter-spacing:-.04em!important;}
#home .exit-sign{
  min-height:60px!important;display:flex!important;align-items:center!important;justify-content:center!important;gap:8px!important;
  padding:7px 9px!important;background:#08704f!important;color:#fff!important;border:3px solid #fff!important;border-radius:7px!important;
  box-shadow:inset 0 0 0 1px rgba(0,0,0,.10)!important;font-family:Arial,Helvetica,sans-serif!important;
}
#home .exit-sign-label{font-size:15px!important;font-weight:900!important;letter-spacing:.06em!important;line-height:1!important;}
#home .exit-sign-number{font-size:34px!important;font-weight:900!important;line-height:.92!important;letter-spacing:-.03em!important;}
#home .day-card .date{
  margin:8px 0 0!important;padding:0!important;border:0!important;background:transparent!important;color:#fff4df!important;
  text-align:center!important;font-size:10px!important;font-weight:750!important;line-height:1.2!important;
}
#home .day-card .state-row,
#home .day-card .state-row.ready-state,
#home .day-card .state-row.solved-state,
#home .day-card .state-row.flag-state,
#home .day-card .state-row.locked-state{
  margin:8px 0 0!important;padding:0!important;border:0!important;background:transparent!important;
  display:grid!important;grid-template-columns:22px minmax(0,1fr) 13px!important;gap:6px!important;align-items:center!important;min-height:24px!important;
}
#home .day-card .state{padding:0!important;margin:0!important;color:#fff!important;font-size:8.5px!important;line-height:1.12!important;font-weight:850!important;text-align:left!important;}
#home .day-card .state-icon{width:20px!important;height:20px!important;}
#home .day-card .solved-icon{color:#55ec72!important;}
#home .day-card .unsolved-icon{color:#ff655f!important;}
#home .day-card .flag-icon{color:#fff!important;}
#home .day-card .state-chevron{font-size:22px!important;color:#fff2bd!important;}

/* Puzzle / review / surrender / gift pages — all on the same fall canvas. */
#puzzle,#review,#confirmGiveUp,#surrender,#video,#finale{
  background:rgba(255,249,235,.42)!important;color:var(--r4t-ink)!important;border-radius:18px!important;
}
#puzzle::before,#review::before,#confirmGiveUp::before,#surrender::before,#video::before,#finale::before{display:none!important;content:none!important;}
#puzzle .puzzle-card,#review .puzzle-card,#confirmGiveUp .puzzle-card.compact{
  background:rgba(255,248,226,.92)!important;border:2px solid #b97834!important;color:#342419!important;
  box-shadow:0 7px 16px rgba(88,48,20,.16)!important;
}
#puzzle .question,#review .question{color:#342419!important;}
#puzzle .card-label,#review .card-label{color:#8a4f28!important;}
.home-link,.day-eyebrow,.muted{color:#624329!important;}
.secret-mark{color:#a85b2d!important;}

/* Text field should look like an entry field — translucent, inset, and clearly unlike the button. */
#answerInput{
  background:rgba(255,255,255,.54)!important;color:#302218!important;border:2px solid #9f7143!important;border-radius:13px!important;
  box-shadow:inset 0 2px 5px rgba(76,47,26,.14)!important;font-size:16px!important;font-weight:600!important;
}
#answerInput::placeholder{color:#6b5845!important;opacity:.9!important;font-size:11.6px!important;letter-spacing:0!important;font-weight:650!important;}

/* Embossed primary button; distinct secondary HOME button in a softer fall color. */
button.primary,#submitBtn,#watchBtn,#birthdaySurpriseBtn,#surrenderSurpriseBtn,#reviewGiftBtn{
  background:linear-gradient(180deg,#b96934 0%,#92431f 100%)!important;color:#fff8e8!important;border:2px solid #6f351b!important;
  box-shadow:0 4px 0 #5d2d17,0 7px 12px rgba(72,39,20,.18)!important;text-shadow:0 1px 1px rgba(0,0,0,.24)!important;
}
button.primary:active,#submitBtn:active,#watchBtn:active,#birthdaySurpriseBtn:active,#surrenderSurpriseBtn:active,#reviewGiftBtn:active{
  transform:translateY(2px)!important;box-shadow:0 2px 0 #5d2d17,0 4px 8px rgba(72,39,20,.16)!important;
}
.home-button{
  background:linear-gradient(180deg,#ead7ad,#d7b77e)!important;color:#4a321f!important;border:2px solid #a37643!important;
  box-shadow:0 3px 0 #8a6238,0 6px 10px rgba(75,46,25,.13)!important;
}

/* All wrong-answer + give-up popups are one restrained autumn style. No green/purple/red. */
.wrong-answer-backdrop{background:rgba(74,45,24,.18)!important;}
.wrong-answer-popover,
.wrong-answer-popover[data-attempt="1"],
.wrong-answer-popover[data-attempt="2"],
.wrong-answer-popover[data-attempt="3"],
.wrong-answer-popover[data-mode="wrong"],
.wrong-answer-popover[data-mode="surrender"]{
  background:linear-gradient(180deg,#fff3d7 0%,#efd19b 100%)!important;color:#432a1a!important;border:2px solid #ad6733!important;
  box-shadow:0 8px 20px rgba(68,39,20,.25)!important;
}
.wrong-answer-popover .wap-message,.wrong-answer-popover .wap-remaining{color:#4f2f1c!important;}
.wrong-answer-popover .wap-ok,
.wrong-answer-popover[data-attempt="1"] .wap-ok,
.wrong-answer-popover[data-attempt="2"] .wap-ok,
.wrong-answer-popover[data-attempt="3"] .wap-ok,
.wrong-answer-popover[data-mode="surrender"] .wap-ok{
  background:linear-gradient(180deg,#b96835,#914522)!important;color:#fff7e6!important;border:2px solid #71371f!important;
  box-shadow:0 3px 0 #63301b!important;
}
@media(max-width:620px){
  .wrong-answer-popover,
  .wrong-answer-popover[data-attempt="1"],
  .wrong-answer-popover[data-attempt="2"],
  .wrong-answer-popover[data-attempt="3"],
  .wrong-answer-popover[data-mode="surrender"]{
    top:calc(var(--visual-top,0px) + 10px)!important;bottom:auto!important;width:min(91vw,390px)!important;
  }
}

/* Sequence gate: subtle cream/tan panel separated from the leaf background. */
.sequence-gate-backdrop{background:rgba(78,48,27,.20)!important;}
.sequence-gate-popup{
  background:linear-gradient(180deg,#fff2d5,#ebca93)!important;color:#3f291b!important;border:2px solid #ad6935!important;
  box-shadow:0 10px 22px rgba(67,39,20,.24)!important;
}
.sequence-gate-icons{font-size:25px!important;line-height:1!important;margin-bottom:5px!important;}
.sequence-gate-title{color:#62361e!important;font-weight:900!important;}
.sequence-gate-copy{color:#49301f!important;}
.sequence-gate-popup button{
  background:linear-gradient(180deg,#b96835,#914522)!important;color:#fff7e6!important;border:2px solid #71371f!important;
  box-shadow:0 3px 0 #63301b!important;
}

/* ARE YOU SURE — concise, bright, single-card confirmation. */
#confirmGiveUp{text-align:center!important;background:rgba(255,247,228,.54)!important;}
#confirmGiveUp h2{color:#5d341e!important;margin:7px 0 10px!important;}
#confirmGiveUp .puzzle-card.compact{padding:13px 12px!important;margin:10px auto 14px!important;}
#confirmGiveUp .puzzle-card.compact p{margin:0!important;font-size:15px!important;color:#4b3120!important;line-height:1.3!important;}
#tryAgainBtn{background:linear-gradient(180deg,#ead9b5,#d8ba82)!important;color:#432e20!important;border:2px solid #a5753c!important;}
#saveMeBtn{background:linear-gradient(180deg,#b76238,#8e4227)!important;color:#fff6e8!important;border:2px solid #6d351f!important;}

/* Surrender/result page — light fall treatment and one-line answer. */
#surrender{background:rgba(255,247,226,.58)!important;text-align:center!important;}
#surrender h2{color:#5c341f!important;}
#surrender .answer-reveal{
  width:100%!important;box-sizing:border-box!important;white-space:nowrap!important;overflow:hidden!important;
  background:#fff1ce!important;color:#5a311b!important;border:2px solid #b97934!important;border-radius:12px!important;
  padding:10px 8px!important;font-weight:850!important;line-height:1.12!important;text-align:center!important;
}

/* Review + success screens — no dark wash; HOME remains visually secondary. */
#review .review-answer-card,#video .gift-from,#finale .finale-content{
  background-color:rgba(255,247,226,.72)!important;border-color:#b97934!important;color:#3d291d!important;
}
#video,#finale{color:#33241a!important;}
#video h2,#finale h2{color:#5a321e!important;}

@media(max-width:620px){
  html,body{background-size:280px auto!important;}
  #welcome .welcome-title-art{width:90%!important;max-width:90%!important;}
  #welcome .welcome-rules-art{width:82%!important;max-width:82%!important;}
  #welcome .welcome-honk-button{width:min(47%,190px)!important;}
  #home .home-sticky-stack .section-heading{font-size:20px!important;padding:7px 10px!important;}
  #home .day-card{min-height:132px!important;padding:10px 9px!important;}
  #home .route-tile-signs{grid-template-columns:58px minmax(0,1fr)!important;gap:7px!important;}
  #home .route-shield{width:56px!important;height:62px!important;}
  #home .route-shield .route-word{font-size:8px!important;}
  #home .route-shield .route-number{font-size:28px!important;}
  #home .exit-sign{min-height:54px!important;padding:6px 7px!important;gap:6px!important;}
  #home .exit-sign-label{font-size:13px!important;}
  #home .exit-sign-number{font-size:30px!important;}
  #home .day-card .date{font-size:9px!important;}
  #home .day-card .state{font-size:8px!important;}
  #answerInput::placeholder{font-size:11px!important;}
}


/* ======================================================================
   ROUTE 4T v2.36 — LOCKED QA VISUALS
   ====================================================================== */
:root{
  --r4t-cream:#fff7e6;
  --r4t-deep-green:#075f42;
  --r4t-green:#0b704f;
  --r4t-navy:#173a59;
  --r4t-rust:#9a512e;
  --r4t-brown:#54311f;
}

/* WELCOME: use the approved image itself so the curvy road, mountains and real
   fall trees appear exactly as approved. Never stretch it. */
html,body{background:#efd7aa!important;background-image:none!important;}
#welcome.active{background:#e7c28e!important;padding:0!important;}
#welcome .welcome-reference-shell{position:relative;width:100%;max-width:620px;margin:0 auto;background:#e7c28e;overflow:hidden;}
#welcome .welcome-reference-image{display:block;width:100%;height:auto;object-fit:contain;}
#welcome .welcome-honk-hotspot{position:absolute;left:24%;right:24%;bottom:2.2%;height:10.5%;border:0;background:transparent;box-shadow:none;border-radius:18px;cursor:pointer;}
#welcome .welcome-honk-hotspot:active,#welcome .welcome-honk-hotspot.honked{transform:scale(.96);}
@media(max-width:620px){#welcome .welcome-reference-shell{max-width:none;}#welcome .welcome-honk-hotspot{left:21%;right:21%;bottom:2%;height:11%;}}

/* GAME + all internal screens: real leaf artwork supplied by user, repeated at
   natural proportions instead of stretched or generated emoji/explosion shapes. */
#home.active,#puzzle.active,#review.active,#confirmGiveUp.active,#surrender.active,#video.active,#finale.active{
  background-color:#f2dfb9!important;
  background-image:linear-gradient(rgba(249,239,216,.70),rgba(239,210,164,.70)),url('fall-leaves-tile.png')!important;
  background-repeat:repeat!important;
  background-size:auto,600px 600px!important;
  background-position:0 0,center top!important;
  box-shadow:none!important;
}

/* YOUR EXITS: mathematically centered, full width, sticky with scoreboard. */
#home .home-sticky-stack{position:sticky!important;top:max(6px,env(safe-area-inset-top))!important;z-index:95!important;width:100%!important;}
#home .home-sticky-stack .section-heading{
  display:flex!important;align-items:center!important;justify-content:center!important;text-align:center!important;
  width:100%!important;max-width:none!important;box-sizing:border-box!important;margin:0 0 8px!important;padding:8px 10px!important;
  color:#fff4dc!important;background:#5e341f!important;border:2px solid #b57a39!important;border-radius:10px!important;
  font-family:Georgia,'Times New Roman',serif!important;font-size:20px!important;font-weight:900!important;letter-spacing:.08em!important;
}
body.home-active.portrait-score-fixed #home .section-heading,body.home-active #home .section-heading{position:relative!important;top:auto!important;left:auto!important;right:auto!important;}

/* EXIT TILE — locked Option 1: ONE solid green highway board. No brown backing,
   no second green inset. Only B/W US-style 4T shield + EXIT number + existing metadata. */
#home .day-card{
  background:#0a6a4a!important;border:3px solid #f8f4e8!important;border-radius:10px!important;
  box-shadow:0 4px 0 #064c37,0 7px 12px rgba(58,41,24,.16)!important;
  padding:10px 10px 9px!important;min-height:132px!important;overflow:hidden!important;
}
#home .day-card::before,#home .day-card::after{display:none!important;content:none!important;}
#home .route-tile-top{display:grid!important;grid-template-columns:50px minmax(0,1fr)!important;align-items:center!important;gap:8px!important;width:100%!important;}
#home .us-route-shield{display:block!important;width:48px!important;height:54px!important;filter:none!important;}
#home .exit-number-lockup{display:flex!important;align-items:baseline!important;justify-content:center!important;gap:7px!important;min-width:0!important;color:#fff!important;}
#home .exit-sign-label{font-family:Arial,Helvetica,sans-serif!important;font-size:14px!important;line-height:1!important;font-weight:900!important;letter-spacing:.07em!important;color:#fff!important;}
#home .exit-sign-number{font-family:Arial,Helvetica,sans-serif!important;font-size:36px!important;line-height:.9!important;font-weight:900!important;letter-spacing:-.02em!important;color:#fff!important;}
#home .day-card .date{margin-top:7px!important;color:#fff5df!important;text-align:center!important;font-size:9.5px!important;font-weight:750!important;background:transparent!important;border:0!important;}
#home .day-card .state-row,#home .day-card .state-row.ready-state,#home .day-card .state-row.solved-state,#home .day-card .state-row.flag-state,#home .day-card .state-row.locked-state{
  margin-top:7px!important;padding:0!important;background:transparent!important;border:0!important;display:grid!important;grid-template-columns:21px minmax(0,1fr) 12px!important;gap:5px!important;align-items:center!important;
}
#home .day-card .state{font-size:8.3px!important;line-height:1.13!important;color:#fff!important;font-weight:850!important;margin:0!important;padding:0!important;text-align:left!important;}
#home .day-card .solved-icon{color:#55ec72!important;}#home .day-card .unsolved-icon{color:#ff625e!important;}#home .day-card .flag-icon{color:#fff!important;}
#home .day-card .state-chevron{color:#fff4d2!important;}

/* Question input must read as an input, not as a button. */
#answerInput{background:rgba(255,255,255,.68)!important;border:2px solid #9b7655!important;box-shadow:inset 0 2px 5px rgba(74,48,28,.13)!important;color:#312318!important;}
#answerInput::placeholder{font-size:10.6px!important;letter-spacing:0!important;color:#6f5e4e!important;opacity:.95!important;}
#submitBtn{background:linear-gradient(180deg,#aa5b34,#86401f)!important;border:2px solid #6d341d!important;box-shadow:0 4px 0 #5f2c18,0 7px 10px rgba(80,45,25,.18)!important;}

/* Locked popup style for attempts 1/2/3 + give-up prompt: cream body, green border, navy OK. */
.wrong-answer-backdrop{background:rgba(66,48,30,.18)!important;}
.wrong-answer-popover,.wrong-answer-popover[data-attempt="1"],.wrong-answer-popover[data-attempt="2"],.wrong-answer-popover[data-attempt="3"],.wrong-answer-popover[data-mode="wrong"],.wrong-answer-popover[data-mode="surrender"]{
  background:#fffaf0!important;color:#35271d!important;border:3px solid #3f7b57!important;border-radius:17px!important;box-shadow:0 10px 24px rgba(61,42,25,.20)!important;
}
.wrong-answer-popover .wap-message,.wrong-answer-popover .wap-remaining{color:#3a2a20!important;}
.wrong-answer-popover .wap-ok,.wrong-answer-popover[data-attempt="1"] .wap-ok,.wrong-answer-popover[data-attempt="2"] .wap-ok,.wrong-answer-popover[data-attempt="3"] .wap-ok,.wrong-answer-popover[data-mode="surrender"] .wap-ok{
  background:#173a59!important;color:#fff!important;border:2px solid #102b44!important;box-shadow:0 3px 0 #0c2237!important;border-radius:10px!important;
}
@media(max-width:620px){.wrong-answer-popover,.wrong-answer-popover[data-attempt="1"],.wrong-answer-popover[data-attempt="2"],.wrong-answer-popover[data-attempt="3"],.wrong-answer-popover[data-mode="surrender"]{top:calc(var(--visual-top,0px) + 10px)!important;bottom:auto!important;width:min(91vw,390px)!important;}}

/* NOT SO FAST locked style. Production uses this when QA_DISABLE_SEQUENCE=false. */
.sequence-gate-backdrop{background:rgba(66,48,30,.22)!important;}
.sequence-gate-popup{background:#fffaf0!important;color:#3a2a20!important;border:3px solid #3f7b57!important;border-radius:17px!important;box-shadow:0 10px 24px rgba(61,42,25,.20)!important;}
.sequence-gate-title{color:#7e3d22!important;font-family:Georgia,'Times New Roman',serif!important;font-weight:900!important;}
.sequence-gate-copy{color:#3a2a20!important;}
.sequence-gate-popup button{background:#d6a34e!important;color:#5e331f!important;border:2px solid #a76c2d!important;box-shadow:0 3px 0 #86511f!important;font-family:Georgia,'Times New Roman',serif!important;font-weight:900!important;}

/* Success screen: keep approved theme; sender name matches ENJOY TODAY'S GIFT. */
#video #giftHeading,#video .gift-from,#video .gift-from-name{font-family:Georgia,'Times New Roman',serif!important;color:#6f3b23!important;}
#video .gift-from{font-weight:500!important;}#video .gift-from-name{font-weight:700!important;}
#video .home-button,#finale .home-button,#review .home-button{background:#d8c4a0!important;color:#4d3524!important;border:2px solid #9f7b4f!important;box-shadow:0 3px 0 #87643e!important;}

/* Confirmation + surrender/result remain light fall themed. */
#confirmGiveUp,#surrender,#video,#review{color:#33251c!important;}
#confirmGiveUp .puzzle-card.compact,#surrender .answer-reveal,#review .review-answer-card{background:rgba(255,250,238,.94)!important;border-color:#b77a3c!important;}
#surrender .answer-reveal{font-size:clamp(18px,5vw,28px)!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;letter-spacing:.01em!important;}

@media(max-width:620px){
  #home .day-card{min-height:126px!important;padding:9px 8px!important;}
  #home .route-tile-top{grid-template-columns:46px minmax(0,1fr)!important;gap:6px!important;}
  #home .us-route-shield{width:44px!important;height:50px!important;}
  #home .exit-sign-label{font-size:12px!important;}#home .exit-sign-number{font-size:32px!important;}
}


/* ======================================================================
   ROUTE 4T v2.37 — FINAL QA / PRODUCTION-REHEARSAL LOCKS
   Date gating OFF; sequential order ON. No visual redesign beyond locked fixes.
   ====================================================================== */

/* Replace only the welcome photo portion while preserving the approved scenic
   road / Rules artwork underneath. The new user-supplied photo is not altered. */
#welcome .welcome-reference-shell{position:relative!important;}
#welcome .welcome-photo-new{
  position:absolute!important;
  left:3.1%!important;right:3.1%!important;top:.7%!important;
  width:93.8%!important;height:31.1%!important;
  display:block!important;object-fit:cover!important;object-position:center 51%!important;
  border-radius:22px!important;z-index:2!important;
}
#welcome .welcome-honk-hotspot{z-index:5!important;}

/* The scoreboard + YOUR EXITS bar are one sticky unit. Disable all legacy
   fixed-score overrides so nothing can scroll behind or detach from the stack. */
body.home-active #home.active{overflow:visible!important;}
body.home-active #home .home-sticky-stack{
  position:sticky!important;top:max(6px,env(safe-area-inset-top))!important;
  z-index:999!important;width:100%!important;background:transparent!important;
}
body.home-active #home .score-card,
body.home-active.portrait-score-fixed #home .score-card{
  position:relative!important;top:auto!important;left:auto!important;right:auto!important;
  width:100%!important;margin:0 0 5px!important;z-index:auto!important;
}
body.home-active #home .section-heading,
body.home-active.portrait-score-fixed #home .section-heading{
  position:relative!important;top:auto!important;left:auto!important;right:auto!important;
  width:100%!important;max-width:none!important;margin:0 0 8px!important;
  display:flex!important;align-items:center!important;justify-content:center!important;text-align:center!important;
}

/* Locked exit-board refinement: same content, tighter rectangular proportions.
   EXIT label slightly larger; exit number slightly smaller. */
#home .day-card{
  min-height:112px!important;padding:8px 9px 7px!important;
  background:#0a6a4a!important;border:3px solid #f8f4e8!important;border-radius:9px!important;
}
#home .route-tile-top{
  grid-template-columns:42px minmax(0,1fr)!important;gap:5px!important;min-height:43px!important;
}
#home .us-route-shield{width:40px!important;height:45px!important;}
#home .exit-number-lockup{gap:6px!important;justify-content:center!important;white-space:nowrap!important;}
#home .exit-sign-label{font-size:15px!important;letter-spacing:.055em!important;}
#home .exit-sign-number{font-size:29px!important;letter-spacing:-.02em!important;}
#home .day-card .date{margin-top:5px!important;font-size:9px!important;}
#home .day-card .state-row,
#home .day-card .state-row.ready-state,
#home .day-card .state-row.solved-state,
#home .day-card .state-row.flag-state,
#home .day-card .state-row.locked-state{margin-top:5px!important;}
#home .day-card .state{font-size:8.1px!important;}

/* Completed EXIT revisit is explicitly read-only and visually clear. */
#review .review-badge{
  width:max-content!important;max-width:92%!important;margin:8px auto 12px!important;
  padding:7px 12px!important;border-radius:999px!important;
  background:#fffaf0!important;border:2px solid #3f7b57!important;
  color:#274b37!important;font-weight:900!important;letter-spacing:.04em!important;
}
#reviewGiftBtn{margin-top:6px!important;}

@media(max-width:620px){
  #welcome .welcome-photo-new{left:3%!important;right:3%!important;width:94%!important;height:31.2%!important;border-radius:16px!important;}
  #home .day-card{min-height:108px!important;padding:7px 8px 6px!important;}
  #home .route-tile-top{grid-template-columns:39px minmax(0,1fr)!important;gap:4px!important;min-height:40px!important;}
  #home .us-route-shield{width:37px!important;height:42px!important;}
  #home .exit-sign-label{font-size:14px!important;}
  #home .exit-sign-number{font-size:27px!important;}
  #home .day-card .date{font-size:8.6px!important;margin-top:4px!important;}
  #home .day-card .state-row,#home .day-card .state-row.ready-state,#home .day-card .state-row.solved-state,#home .day-card .state-row.flag-state,#home .day-card .state-row.locked-state{margin-top:4px!important;}
  #home .day-card .state{font-size:7.9px!important;}
}

/* ======================================================================
   ROUTE 4T v2.38 — URGENT DEFECT FIXES ONLY
   Photo replacement + frozen scoreboard + pure B/W shield + rectangular tiles.
   ====================================================================== */

/* Use the newly supplied Mika photo without filters or opacity effects. */
#welcome .welcome-photo-new{
  filter:none!important;
  opacity:1!important;
  mix-blend-mode:normal!important;
  object-fit:cover!important;
  object-position:center center!important;
}

/* 4T shield must be PURE white with PURE black letters. */
#home .us-route-shield{
  opacity:1!important;
  filter:none!important;
  mix-blend-mode:normal!important;
}
#home .us-route-shield path{
  fill:#ffffff!important;
  stroke:#000000!important;
  opacity:1!important;
}
#home .us-route-shield text{
  fill:#000000!important;
  color:#000000!important;
  opacity:1!important;
}

/* Mobile portrait: freeze the header/scoreboard/YOUR EXITS by making ONLY the
   EXIT grid scroll. This avoids browser-specific sticky/fixed conflicts. */
@media (max-width:620px) and (orientation:portrait){
  html,body,body.home-active{
    width:100%!important;
    height:100%!important;
    height:100dvh!important;
    min-height:0!important;
    overflow:hidden!important;
    overscroll-behavior:none!important;
  }
  body.home-active .app-shell{
    width:100%!important;
    max-width:520px!important;
    height:100%!important;
    height:100dvh!important;
    min-height:0!important;
    margin:0 auto!important;
    padding:max(7px,env(safe-area-inset-top)) 9px max(7px,env(safe-area-inset-bottom))!important;
    overflow:hidden!important;
    display:block!important;
  }
  body.home-active #home.active{
    width:100%!important;
    height:100%!important;
    min-height:0!important;
    overflow:hidden!important;
    display:flex!important;
    flex-direction:column!important;
  }
  body.home-active #home .project40-header{
    position:relative!important;
    inset:auto!important;
    flex:0 0 auto!important;
    margin:0!important;
    padding:0 0 5px!important;
    transform:none!important;
  }
  body.home-active #home .home-sticky-stack,
  body.home-active.portrait-score-fixed #home .home-sticky-stack{
    position:relative!important;
    inset:auto!important;
    top:auto!important;
    left:auto!important;
    right:auto!important;
    width:100%!important;
    flex:0 0 auto!important;
    z-index:50!important;
    transform:none!important;
  }
  body.home-active #home .score-card,
  body.home-active.portrait-score-fixed #home .score-card{
    position:relative!important;
    inset:auto!important;
    top:auto!important;
    left:auto!important;
    right:auto!important;
    width:100%!important;
    margin:0 0 4px!important;
    transform:none!important;
  }
  body.home-active #home .section-heading,
  body.home-active.portrait-score-fixed #home .section-heading{
    position:relative!important;
    inset:auto!important;
    top:auto!important;
    left:auto!important;
    right:auto!important;
    width:100%!important;
    margin:0 0 5px!important;
    transform:none!important;
  }
  body.home-active #home .day-grid,
  #home .day-grid{
    flex:1 1 auto!important;
    min-height:0!important;
    height:auto!important;
    max-height:none!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    -webkit-overflow-scrolling:touch!important;
    overscroll-behavior-y:contain!important;
    touch-action:pan-y!important;
    padding:1px 1px max(12px,env(safe-area-inset-bottom))!important;
  }

  /* EXIT board proportions: visibly rectangular, less whitespace. */
  #home .day-card{
    box-sizing:border-box!important;
    height:102px!important;
    min-height:102px!important;
    max-height:102px!important;
    padding:5px 7px 5px!important;
    border-radius:8px!important;
    overflow:hidden!important;
  }
  #home .route-tile-top{
    grid-template-columns:34px minmax(0,1fr)!important;
    gap:4px!important;
    min-height:34px!important;
    height:34px!important;
    align-items:center!important;
  }
  #home .us-route-shield{
    width:32px!important;
    height:36px!important;
  }
  #home .exit-number-lockup{
    gap:5px!important;
    justify-content:center!important;
    align-items:baseline!important;
    white-space:nowrap!important;
    min-width:0!important;
  }
  #home .exit-sign-label{
    font-size:16px!important;
    line-height:1!important;
    font-weight:900!important;
    letter-spacing:.055em!important;
  }
  #home .exit-sign-number{
    font-size:23px!important;
    line-height:1!important;
    font-weight:900!important;
    letter-spacing:-.02em!important;
  }
  #home .day-card .date{
    margin-top:3px!important;
    font-size:8.3px!important;
    line-height:1.05!important;
  }
  #home .day-card .state-row,
  #home .day-card .state-row.ready-state,
  #home .day-card .state-row.solved-state,
  #home .day-card .state-row.flag-state,
  #home .day-card .state-row.locked-state{
    margin-top:3px!important;
    min-height:17px!important;
    grid-template-columns:17px minmax(0,1fr) 9px!important;
    gap:3px!important;
  }
  #home .day-card .state-icon{
    width:16px!important;
    height:16px!important;
  }
  #home .day-card .state{
    font-size:7.5px!important;
    line-height:1.05!important;
    white-space:normal!important;
    overflow:hidden!important;
  }
  #home .day-card .state-chevron{
    font-size:17px!important;
    line-height:1!important;
  }
}


/* ======================================================================
   ROUTE 4T v2.40 — USER QA CORRECTIONS ONLY
   No newly rendered artwork. Existing supplied assets are reused as-is.
   ====================================================================== */

/* 1) Welcome photo: fully cover the old photo AND its old gold frame so no
   legacy image/frame can show behind the new Mika photograph. */
#welcome .welcome-photo-new{
  position:absolute!important;
  left:1.2%!important;
  right:1.2%!important;
  top:0!important;
  width:97.6%!important;
  height:34.35%!important;
  z-index:4!important;
  display:block!important;
  object-fit:cover!important;
  object-position:center center!important;
  border:0!important;
  border-radius:0!important;
  box-shadow:none!important;
  filter:none!important;
  opacity:1!important;
  mix-blend-mode:normal!important;
}

/* 2) Clean HONK control. Cover the old baked-in button/extra HONK callout with
   the existing fall texture, then reuse the existing HONK-only asset. */
#welcome .welcome-honk-clean-zone{
  position:absolute!important;
  left:2.5%!important;
  right:2.5%!important;
  bottom:.5%!important;
  height:16.4%!important;
  z-index:4!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  overflow:hidden!important;
  border-radius:18px!important;
  background-color:#9a5726!important;
  background-image:linear-gradient(rgba(129,65,24,.12),rgba(81,39,16,.12)),url('fall-leaves-tile.png')!important;
  background-size:auto,330px 330px!important;
  background-position:center!important;
}
#welcome .welcome-honk-clean{
  display:block!important;
  width:94%!important;
  height:auto!important;
  max-height:92%!important;
  object-fit:contain!important;
  mix-blend-mode:multiply!important;
  filter:contrast(1.04) saturate(1.02)!important;
  pointer-events:none!important;
  user-select:none!important;
}
#welcome .welcome-honk-hotspot{
  left:8%!important;
  right:8%!important;
  bottom:1.2%!important;
  height:14.5%!important;
  z-index:7!important;
}

/* 3) EXIT boards: deliberately LANDSCAPE/RECTANGULAR. Make EXIT larger and
   the number smaller so the visual hierarchy matches the requested road sign. */
#home .day-card{
  box-sizing:border-box!important;
  min-height:100px!important;
  height:100px!important;
  max-height:100px!important;
  padding:6px 8px 5px!important;
  border-radius:7px!important;
}
#home .route-tile-top{
  grid-template-columns:39px minmax(0,1fr)!important;
  min-height:37px!important;
  height:37px!important;
  gap:5px!important;
  align-items:center!important;
}
#home .us-route-shield{width:37px!important;height:41px!important;}
#home .exit-number-lockup{gap:6px!important;align-items:baseline!important;justify-content:center!important;}
#home .exit-sign-label{
  font-size:18px!important;
  line-height:1!important;
  font-weight:900!important;
  letter-spacing:.055em!important;
}
#home .exit-sign-number{
  font-size:24px!important;
  line-height:1!important;
  font-weight:900!important;
  letter-spacing:-.015em!important;
}
#home .day-card .date{margin-top:4px!important;font-size:8.5px!important;line-height:1.05!important;}
#home .day-card .state-row,
#home .day-card .state-row.ready-state,
#home .day-card .state-row.solved-state,
#home .day-card .state-row.flag-state,
#home .day-card .state-row.locked-state{
  margin-top:4px!important;
  min-height:18px!important;
  grid-template-columns:18px minmax(0,1fr) 10px!important;
  gap:4px!important;
}
#home .day-card .state-icon{width:17px!important;height:17px!important;}
#home .day-card .state{font-size:7.7px!important;line-height:1.05!important;}
#home .day-card .state-chevron{font-size:18px!important;line-height:1!important;}

/* 4) 4T shield: force actual SVG geometry to pure white and actual glyphs
   to pure black. Avoid opacity/filter inherited from any earlier theme layer. */
#home svg.us-route-shield{
  background:transparent!important;
  color:#000!important;
  opacity:1!important;
  filter:none!important;
  -webkit-filter:none!important;
}
#home svg.us-route-shield path{
  fill:rgb(255,255,255)!important;
  stroke:rgb(0,0,0)!important;
  stroke-opacity:1!important;
  fill-opacity:1!important;
}
#home svg.us-route-shield text{
  fill:rgb(0,0,0)!important;
  color:rgb(0,0,0)!important;
  stroke:none!important;
  fill-opacity:1!important;
  opacity:1!important;
  font-weight:900!important;
}

/* 5) Mobile portrait scroll model: the header/artwork above the scoreboard is
   normal content and scrolls away. Only the scoreboard/YOUR EXITS stack sticks
   once it naturally reaches the top. The EXIT list is NOT a nested scroll pane. */
@media (max-width:620px) and (orientation:portrait){
  html,body,body.home-active{
    width:100%!important;
    height:auto!important;
    min-height:100%!important;
    overflow-x:hidden!important;
    overflow-y:auto!important;
    overscroll-behavior-y:auto!important;
  }
  body.home-active .app-shell{
    width:100%!important;
    max-width:520px!important;
    height:auto!important;
    min-height:100dvh!important;
    margin:0 auto!important;
    padding:max(7px,env(safe-area-inset-top)) 9px max(14px,env(safe-area-inset-bottom))!important;
    overflow:visible!important;
    display:block!important;
  }
  body.home-active #home.active{
    width:100%!important;
    height:auto!important;
    min-height:100dvh!important;
    overflow:visible!important;
    display:block!important;
  }
  body.home-active #home .project40-header{
    position:relative!important;
    inset:auto!important;
    z-index:auto!important;
    margin:0!important;
    padding:0 0 6px!important;
    transform:none!important;
  }
  body.home-active #home .home-sticky-stack,
  body.home-active.portrait-score-fixed #home .home-sticky-stack{
    position:sticky!important;
    top:max(7px,env(safe-area-inset-top))!important;
    left:auto!important;
    right:auto!important;
    width:100%!important;
    z-index:90!important;
    transform:none!important;
    background:transparent!important;
  }
  body.home-active #home .score-card,
  body.home-active.portrait-score-fixed #home .score-card{
    position:relative!important;
    inset:auto!important;
    top:auto!important;
    left:auto!important;
    right:auto!important;
    width:100%!important;
    margin:0 0 4px!important;
    transform:none!important;
    z-index:auto!important;
  }
  body.home-active #home .section-heading,
  body.home-active.portrait-score-fixed #home .section-heading{
    position:relative!important;
    inset:auto!important;
    top:auto!important;
    left:auto!important;
    right:auto!important;
    width:100%!important;
    margin:0 0 6px!important;
    transform:none!important;
    z-index:auto!important;
  }
  body.home-active #home .day-grid,
  #home .day-grid{
    height:auto!important;
    max-height:none!important;
    min-height:0!important;
    overflow:visible!important;
    padding:1px 1px max(12px,env(safe-area-inset-bottom))!important;
    touch-action:pan-y!important;
  }

  /* Stronger portrait proportions. */
  #home .day-card{
    height:94px!important;
    min-height:94px!important;
    max-height:94px!important;
    padding:5px 7px 4px!important;
  }
  #home .route-tile-top{
    grid-template-columns:32px minmax(0,1fr)!important;
    min-height:32px!important;
    height:32px!important;
    gap:4px!important;
  }
  #home .us-route-shield{width:30px!important;height:34px!important;}
  #home .exit-sign-label{font-size:17px!important;}
  #home .exit-sign-number{font-size:21px!important;}
  #home .day-card .date{font-size:8px!important;margin-top:3px!important;}
  #home .day-card .state-row,
  #home .day-card .state-row.ready-state,
  #home .day-card .state-row.solved-state,
  #home .day-card .state-row.flag-state,
  #home .day-card .state-row.locked-state{margin-top:3px!important;min-height:17px!important;}
  #home .day-card .state{font-size:7.3px!important;}

  #welcome .welcome-photo-new{
    left:1%!important;right:1%!important;width:98%!important;
    top:0!important;height:34.45%!important;border-radius:0!important;
  }
  #welcome .welcome-honk-clean-zone{left:1.8%!important;right:1.8%!important;height:16.6%!important;bottom:.25%!important;}
  #welcome .welcome-honk-hotspot{left:7%!important;right:7%!important;bottom:.8%!important;height:15%!important;}
}


/* ======================================================================
   ROUTE 4T v2.41 — WELCOME STRUCTURE FIX
   The old composite welcome image is NO LONGER rendered. It contained the
   old Mika photo and old HONK artwork baked into one raster, which caused
   visible layering when replacements were positioned above it.
   v2.41 uses separate existing assets in normal document flow instead.
   ====================================================================== */
#welcome.active{
  background-color:#e8c690!important;
  background-image:linear-gradient(rgba(242,218,171,.62),rgba(232,196,144,.62)),url('fall-leaves-tile.png')!important;
  background-repeat:repeat!important;
  background-size:auto,480px 480px!important;
  padding:8px 8px max(16px,env(safe-area-inset-bottom))!important;
}
#welcome .welcome-v241-stack{
  position:relative!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  gap:8px!important;
  width:min(100%,620px)!important;
  max-width:620px!important;
  margin:0 auto!important;
  padding:0!important;
  overflow:visible!important;
  background:transparent!important;
}
/* Old composite/overlay layers must never render in this build. */
#welcome .welcome-reference-image,
#welcome .welcome-honk-clean-zone,
#welcome .welcome-honk-clean,
#welcome .welcome-honk-hotspot{
  display:none!important;
}
#welcome .welcome-v241-photo-frame{
  position:relative!important;
  width:100%!important;
  aspect-ratio:2.05/1!important;
  overflow:hidden!important;
  border:3px solid #d99a31!important;
  border-radius:18px!important;
  background:#f4ddb3!important;
  box-sizing:border-box!important;
  box-shadow:0 5px 14px rgba(77,39,13,.24)!important;
}
#welcome .welcome-v241-photo-frame .welcome-photo-new{
  position:static!important;
  inset:auto!important;
  display:block!important;
  width:100%!important;
  height:100%!important;
  max-width:none!important;
  object-fit:cover!important;
  object-position:center center!important;
  border:0!important;
  border-radius:0!important;
  box-shadow:none!important;
  filter:none!important;
  opacity:1!important;
  mix-blend-mode:normal!important;
}
#welcome .welcome-v241-title,
#welcome .welcome-v241-rules{
  position:static!important;
  display:block!important;
  width:100%!important;
  height:auto!important;
  max-width:none!important;
  object-fit:contain!important;
  margin:0!important;
  border:0!important;
  box-shadow:none!important;
}
#welcome .welcome-v241-honk{
  position:static!important;
  display:block!important;
  width:min(82%,470px)!important;
  height:auto!important;
  margin:2px auto 6px!important;
  padding:0!important;
  border:0!important;
  background:transparent!important;
  box-shadow:none!important;
  cursor:pointer!important;
  overflow:visible!important;
  appearance:none!important;
  -webkit-appearance:none!important;
}
#welcome .welcome-v241-honk img{
  display:block!important;
  width:100%!important;
  height:auto!important;
  object-fit:contain!important;
  pointer-events:none!important;
  user-select:none!important;
  mix-blend-mode:multiply!important;
  filter:drop-shadow(0 6px 9px rgba(67,33,10,.28))!important;
}
#welcome .welcome-v241-honk:active,
#welcome .welcome-v241-honk.honked{
  transform:scale(.965)!important;
}
#welcome .welcome-v241-honk:focus-visible{
  outline:3px solid #fff4b5!important;
  outline-offset:4px!important;
}
@media(max-width:620px){
  #welcome.active{padding:0 0 max(12px,env(safe-area-inset-bottom))!important;}
  #welcome .welcome-v241-stack{gap:5px!important;width:100%!important;}
  #welcome .welcome-v241-photo-frame{border-left:0!important;border-right:0!important;border-radius:0!important;}
  #welcome .welcome-v241-honk{width:88%!important;margin:1px auto 5px!important;}
}

/* ======================================================================
   ROUTE 4T v2.42 — Samsung/mobile QA fixes
   Fixes only existing UI/CSS/JS behavior. No new rendered artwork.
   ====================================================================== */

/* 1) Scoreboard stat row: center each of the 5 groups inside equal columns. */
#home .score-stats{
  display:grid!important;
  grid-template-columns:repeat(5,minmax(0,1fr))!important;
  align-items:stretch!important;
  justify-items:stretch!important;
  width:100%!important;
}
#home .score-stats .stat-item{
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  text-align:center!important;
  width:100%!important;
  min-width:0!important;
  padding:0 3px!important;
  box-sizing:border-box!important;
  gap:2px!important;
}
#home .score-stats .stat-item+.stat-item{border-left:1px solid rgba(239,192,82,.34)!important;}
#home .score-stats .stat-icon,
#home .score-stats .stat-label,
#home .score-stats .stat-item b{
  width:100%!important;
  text-align:center!important;
}

/* 2) 4T shield must be pure white with black 4T text. */
#home svg.us-route-shield,
#home .day-card svg.us-route-shield{
  display:block!important;
  background:transparent!important;
  color:#000000!important;
  opacity:1!important;
  filter:none!important;
  -webkit-filter:none!important;
  mix-blend-mode:normal!important;
}
#home svg.us-route-shield path,
#home .day-card svg.us-route-shield path{
  fill:#ffffff!important;
  stroke:#000000!important;
  fill-opacity:1!important;
  stroke-opacity:1!important;
  opacity:1!important;
}
#home svg.us-route-shield text,
#home .day-card svg.us-route-shield text{
  fill:#000000!important;
  color:#000000!important;
  stroke:none!important;
  fill-opacity:1!important;
  opacity:1!important;
}

/* 3) EXIT tiles/signs: flatter rectangular look, larger EXIT label, smaller number. */
#home .day-card{
  min-height:96px!important;
  height:96px!important;
  max-height:96px!important;
  padding:5px 8px 5px!important;
  border-radius:8px!important;
}
#home .route-tile-top{
  display:grid!important;
  grid-template-columns:36px minmax(0,1fr)!important;
  align-items:center!important;
  gap:6px!important;
  min-height:34px!important;
  height:34px!important;
}
#home .us-route-shield{width:34px!important;height:38px!important;}
#home .exit-number-lockup{
  display:flex!important;
  align-items:baseline!important;
  justify-content:center!important;
  gap:5px!important;
  min-width:0!important;
  white-space:nowrap!important;
}
#home .exit-sign-label{
  font-size:20px!important;
  line-height:1!important;
  font-weight:900!important;
  letter-spacing:.04em!important;
}
#home .exit-sign-number{
  font-size:17px!important;
  line-height:1!important;
  font-weight:900!important;
  letter-spacing:-.01em!important;
}
#home .day-card .date{margin-top:4px!important;font-size:8.4px!important;line-height:1.05!important;}
#home .day-card .state-row,
#home .day-card .state-row.ready-state,
#home .day-card .state-row.solved-state,
#home .day-card .state-row.flag-state,
#home .day-card .state-row.locked-state{
  margin-top:4px!important;
  min-height:18px!important;
  grid-template-columns:17px minmax(0,1fr) 10px!important;
  gap:4px!important;
}
#home .day-card .state-icon{width:16px!important;height:16px!important;}
#home .day-card .state{font-size:7.6px!important;line-height:1.05!important;}
#home .day-card .state-chevron{font-size:18px!important;line-height:1!important;}

/* 4) Restore the intended portrait behavior on Samsung Internet:
   header artwork scrolls away normally; then scoreboard/YOUR EXITS freezes. */
@media (max-width:620px) and (orientation:portrait){
  html,body,body.home-active{
    height:auto!important;
    min-height:100%!important;
    overflow-x:hidden!important;
    overflow-y:auto!important;
    overscroll-behavior-y:auto!important;
  }
  body.home-active .app-shell,
  body.home-active #home.active{
    height:auto!important;
    min-height:100dvh!important;
    overflow:visible!important;
    display:block!important;
  }
  body.home-active #home .project40-header{
    position:relative!important;
    inset:auto!important;
    margin:0 0 6px!important;
    padding:0!important;
    z-index:1!important;
    transform:none!important;
  }
  body.home-active #home .home-sticky-stack{
    position:relative!important;
    inset:auto!important;
    top:auto!important;
    left:auto!important;
    right:auto!important;
    width:100%!important;
    z-index:90!important;
    transform:none!important;
    background:transparent!important;
  }
  body.home-active.portrait-score-fixed #home .home-sticky-stack{
    position:fixed!important;
    top:max(7px,env(safe-area-inset-top))!important;
    left:50%!important;
    right:auto!important;
    width:calc(100vw - 18px)!important;
    max-width:502px!important;
    transform:translateX(-50%)!important;
    z-index:98!important;
    background:transparent!important;
  }
  body.home-active #home .score-card,
  body.home-active #home .section-heading{
    position:relative!important;
    inset:auto!important;
    width:100%!important;
    left:auto!important;
    right:auto!important;
    transform:none!important;
  }
  body.home-active #home .score-card{margin:0 0 4px!important;}
  body.home-active #home .section-heading{margin:0 0 6px!important;}
  body.home-active #home .day-grid{
    height:auto!important;
    max-height:none!important;
    min-height:0!important;
    overflow:visible!important;
    padding:1px 1px max(12px,env(safe-area-inset-bottom))!important;
    margin-top:0!important;
  }
  body.home-active.portrait-score-fixed #home .day-grid{
    margin-top:calc(var(--portrait-stack-space, 182px) - 4px)!important;
  }

  /* Mobile-specific stat centering and readable labels. */
  #home .score-stats .stat-item{padding:0 2px!important;gap:1px!important;}
  #home .score-stats .stat-icon{font-size:17px!important;line-height:1!important;}
  #home .score-stats .stat-label{font-size:6.8px!important;line-height:1.05!important;}
  #home .score-stats .stat-item b{font-size:8px!important;line-height:1!important;}

  /* Mobile-specific exit sign sizing tuned for 2-column Samsung portrait. */
  #home .day-card{
    min-height:94px!important;
    height:94px!important;
    max-height:94px!important;
    padding:5px 7px 5px!important;
  }
  #home .route-tile-top{
    grid-template-columns:31px minmax(0,1fr)!important;
    min-height:31px!important;
    height:31px!important;
    gap:5px!important;
  }
  #home .us-route-shield{width:29px!important;height:33px!important;}
  #home .exit-sign-label{font-size:19px!important;}
  #home .exit-sign-number{font-size:16px!important;}
  #home .day-card .date{font-size:8px!important;}
  #home .day-card .state{font-size:7.2px!important;}
}

/* ======================================================================
   ROUTE 4T v2.43 — final QA corrections from Samsung screenshots/video
   Built on v2.42. Preserve scoreboard centering + sticky behavior.
   No new rendered artwork.
   ====================================================================== */

/* Welcome title: the markup now uses the already-approved uncropped
   home-header-autumn.png. Keep it natural-size / fully visible. */
#welcome .welcome-v241-title{
  display:block!important;
  width:100%!important;
  height:auto!important;
  max-width:none!important;
  object-fit:contain!important;
  object-position:center center!important;
  overflow:visible!important;
}

/* HONK: retain a visible physical press/release animation, but never let
   Samsung Internet paint a native/disabled white button background. */
#welcome .welcome-v241-honk,
#welcome .welcome-v241-honk:hover,
#welcome .welcome-v241-honk:active,
#welcome .welcome-v241-honk:focus,
#welcome .welcome-v241-honk.honked,
#welcome .welcome-v241-honk[aria-busy="true"]{
  background:transparent!important;
  background-color:transparent!important;
  border:0!important;
  box-shadow:none!important;
  appearance:none!important;
  -webkit-appearance:none!important;
  -webkit-tap-highlight-color:transparent!important;
}
#welcome .welcome-v241-honk:active{transform:translateY(3px) scale(.975)!important;}
#welcome .welcome-v241-honk.honked{
  animation:r4tHonkPress .34s cubic-bezier(.2,.8,.25,1) both!important;
}
@keyframes r4tHonkPress{
  0%{transform:translateY(0) scale(1)}
  38%{transform:translateY(5px) scale(.955)}
  72%{transform:translateY(1px) scale(.985)}
  100%{transform:translateY(0) scale(1)}
}
#welcome .welcome-v241-honk img{
  background:transparent!important;
  opacity:1!important;
}

/* EXIT board: a single green rectangle. Remove the offset dark/teal layer
   that looked like a second card underneath every EXIT tile. */
#home .day-card,
#home .day-card:hover,
#home .day-card:active,
#home .day-card:focus{
  background:#0a6a4a!important;
  border:3px solid #f8f4e8!important;
  box-shadow:none!important;
  transform:none!important;
}

/* EXIT + number should carry almost equal visual weight. */
#home .exit-number-lockup{
  display:flex!important;
  justify-content:center!important;
  align-items:baseline!important;
  gap:6px!important;
  white-space:nowrap!important;
}
#home .exit-sign-label,
#home .exit-sign-number{
  font-family:Arial,Helvetica,sans-serif!important;
  font-weight:900!important;
  line-height:1!important;
  color:#fff!important;
}
#home .exit-sign-label{font-size:19px!important;letter-spacing:.035em!important;}
#home .exit-sign-number{font-size:20px!important;letter-spacing:-.01em!important;}

/* Keep the corrected white/black colors and let the revised SVG path define
   the actual U.S.-route shield silhouette. */
#home svg.us-route-shield,
#home .day-card svg.us-route-shield{
  background:transparent!important;
  color:#000!important;
  filter:none!important;
  -webkit-filter:none!important;
  opacity:1!important;
  mix-blend-mode:normal!important;
  overflow:visible!important;
}
#home svg.us-route-shield path,
#home .day-card svg.us-route-shield path{
  fill:#fff!important;
  stroke:#000!important;
  stroke-width:3.2!important;
  stroke-linejoin:round!important;
  fill-opacity:1!important;
  stroke-opacity:1!important;
  opacity:1!important;
}
#home svg.us-route-shield text,
#home .day-card svg.us-route-shield text{
  fill:#000!important;
  color:#000!important;
  stroke:none!important;
  font-weight:900!important;
  fill-opacity:1!important;
  opacity:1!important;
}

/* Flatter, unmistakably rectangular EXIT boards while keeping the approved
   date/status rows unchanged in structure. */
#home .day-card{
  min-height:92px!important;
  height:92px!important;
  max-height:92px!important;
  padding:5px 7px 5px!important;
  border-radius:8px!important;
  overflow:hidden!important;
}
#home .route-tile-top{
  grid-template-columns:32px minmax(0,1fr)!important;
  gap:5px!important;
  min-height:31px!important;
  height:31px!important;
  align-items:center!important;
}
#home .us-route-shield{width:31px!important;height:35px!important;}
#home .day-card .date{margin-top:4px!important;}
#home .day-card .state-row,
#home .day-card .state-row.ready-state,
#home .day-card .state-row.solved-state,
#home .day-card .state-row.flag-state,
#home .day-card .state-row.locked-state{margin-top:4px!important;}

@media (max-width:620px) and (orientation:portrait){
  #home .day-card{
    min-height:90px!important;
    height:90px!important;
    max-height:90px!important;
    padding:4px 6px 4px!important;
  }
  #home .route-tile-top{
    grid-template-columns:31px minmax(0,1fr)!important;
    gap:4px!important;
    min-height:30px!important;
    height:30px!important;
  }
  #home .us-route-shield{width:30px!important;height:34px!important;}
  #home .exit-number-lockup{gap:5px!important;}
  #home .exit-sign-label{font-size:18px!important;letter-spacing:.025em!important;}
  #home .exit-sign-number{font-size:19px!important;}
  #home .day-card .date{margin-top:3px!important;font-size:8px!important;}
  #home .day-card .state-row,
  #home .day-card .state-row.ready-state,
  #home .day-card .state-row.solved-state,
  #home .day-card .state-row.flag-state,
  #home .day-card .state-row.locked-state{margin-top:3px!important;min-height:17px!important;}
  #home .day-card .state{font-size:7.1px!important;line-height:1.04!important;}
}

/* ======================================================================
   ROUTE 4T v2.44 — cross-browser + light/dark-theme hardening only.
   No visual redesign. Preserve v2.43 layout and gameplay behavior.
   ====================================================================== */

/* Route4T owns its visual palette. Do not let OS/browser dark mode recolor UI. */
:root, html {
  color-scheme: only light!important;
  -webkit-text-size-adjust:100%!important;
  text-size-adjust:100%!important;
}
html, body {
  background-color:#d59a55!important;
}

/* Normalize interactive controls across Chrome Android, Samsung Internet,
   Safari/iOS, Edge and Firefox without changing the approved appearance. */
button,
input,
select,
textarea {
  font:inherit;
  color:inherit;
  border-radius:inherit;
}
button,
input[type="button"],
input[type="submit"],
input[type="reset"] {
  -webkit-appearance:none!important;
  appearance:none!important;
}
button {
  -webkit-tap-highlight-color:transparent!important;
  touch-action:manipulation;
}

/* Samsung/Chrome pressed/disabled-state protection for the HONK control. */
#welcome .welcome-v241-honk,
#welcome .welcome-v241-honk:hover,
#welcome .welcome-v241-honk:focus,
#welcome .welcome-v241-honk:active,
#welcome .welcome-v241-honk.honked,
#welcome .welcome-v241-honk[aria-busy="true"] {
  background:transparent!important;
  background-color:transparent!important;
  border:0!important;
  box-shadow:none!important;
  color:inherit!important;
  -webkit-appearance:none!important;
  appearance:none!important;
  -webkit-tap-highlight-color:transparent!important;
}
#welcome .welcome-v241-honk::-moz-focus-inner {
  border:0!important;
  padding:0!important;
}

/* Explicitly preserve the approved Route4T colors if the device uses dark UI. */
#home .day-card {
  color:#ffffff!important;
}
#home .score-card,
#home .section-heading {
  color:#ffffff!important;
}
#home svg.us-route-shield,
#home svg.us-route-shield path,
#home svg.us-route-shield text {
  opacity:1!important;
  filter:none!important;
  -webkit-filter:none!important;
  mix-blend-mode:normal!important;
}
#home svg.us-route-shield path {
  fill:#ffffff!important;
  stroke:#000000!important;
}
#home svg.us-route-shield text {
  fill:#000000!important;
  color:#000000!important;
}

/* Form controls should not flip themselves into a browser dark theme. */
#answerInput,
#submitBtn,
#giveUpBtn,
.home-link,
.home-button,
.secondary,
.primary {
  color-scheme:only light!important;
}

/* ======================================================================
   ROUTE 4T v2.45 PRODUCTION — final HONK transparency + release locks
   Built from approved v2.44. No layout/gameplay redesign.
   ====================================================================== */

/* The HONK PNG now has a true alpha background. Render it normally so the
   transformed/animated layer never relies on blend-mode compositing. */
#welcome .welcome-v241-honk,
#welcome .welcome-v241-honk:hover,
#welcome .welcome-v241-honk:focus,
#welcome .welcome-v241-honk:active,
#welcome .welcome-v241-honk.honked,
#welcome .welcome-v241-honk[aria-busy="true"]{
  background:none!important;
  background-color:transparent!important;
  border:0!important;
  box-shadow:none!important;
  -webkit-appearance:none!important;
  appearance:none!important;
  -webkit-tap-highlight-color:transparent!important;
  isolation:isolate!important;
}
#welcome .welcome-v241-honk img{
  background:transparent!important;
  mix-blend-mode:normal!important;
  opacity:1!important;
  filter:drop-shadow(0 6px 9px rgba(67,33,10,.28))!important;
  transform:translateZ(0);
  backface-visibility:hidden;
  -webkit-backface-visibility:hidden;
}

/* Keep the approved visible press/release animation. */
#welcome .welcome-v241-honk:active{transform:translateY(3px) scale(.975)!important;}
#welcome .welcome-v241-honk.honked{animation:r4tHonkPress .34s cubic-bezier(.2,.8,.25,1) both!important;}