*{box-sizing:border-box}html{background:#F5F1E8}body{margin:0;color:#0F1311;font-family:Inter,system-ui,sans-serif;font-size:16px;line-height:1.55}button,input,select,textarea{font:inherit}button,a,input,select,textarea{-webkit-tap-highlight-color:transparent}button{cursor:pointer}button:disabled{cursor:default;opacity:.48}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid #0A2342;outline-offset:4px}a{color:#0B4D3C;text-underline-offset:4px}h1,h2,h3{font-family:'Bebas Neue',Impact,sans-serif;font-weight:400;color:#0B4D3C;line-height:1.03;margin:0}h1{font-size:clamp(64px,8vw,108px);letter-spacing:.01em}h2{font-size:36px}h3{font-size:25px}p{margin:0 0 16px}button{color:inherit}small{font-size:13px}[hidden]{display:none!important}.site-nav{display:flex;align-items:center;justify-content:space-between;max-width:1280px;margin:auto;padding:calc(19px + env(safe-area-inset-top)) 32px 18px;border-bottom:1px solid #0B4D3C33;gap:24px}.site-nav img{display:block;object-fit:contain;width:82px;height:44px}.site-nav>a:last-child{font-size:14px;font-weight:600;text-decoration:none}.site-nav span{margin-left:12px}main{max-width:1180px;margin:auto;padding:40px 28px calc(30px + env(safe-area-inset-bottom))}.masthead{display:flex;justify-content:space-between;align-items:end;gap:40px;margin-bottom:36px}.eyebrow,.small-label{font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:#0B4D3C}.eyebrow{margin-bottom:14px}.lede{font-size:26px;line-height:1.28;margin:14px 0 0;letter-spacing:-.04em}.mast-note{border-left:2px solid #F4C430;padding-left:22px;max-width:340px;margin-bottom:5px}.mast-note p{font-size:14px;margin:8px 0}.context-bar{border:1px solid #0B4D3C;border-radius:8px;display:flex;justify-content:space-between;gap:20px;padding:15px 20px;align-items:center}.context-bar span{font-weight:700;color:#0B4D3C;font-size:14px}.context-bar small{display:block;color:#53635B}.button{font-family:'Bebas Neue',Impact,sans-serif;font-size:20px;line-height:1.2;border:1px solid #0B4D3C;border-bottom:2px solid #F4C430;border-radius:6px;background:#0B4D3C;color:#F5F1E8;padding:12px 22px;min-height:46px;text-decoration:none;display:inline-flex;align-items:center;justify-content:center;text-align:center}.button.quiet{background:transparent;color:#0B4D3C;border-color:#0B4D3C}.button.small{font-family:Inter,system-ui,sans-serif;font-size:13px;padding:9px 12px;min-height:42px}.button:hover:not(:disabled){filter:brightness(.94)}.tabs{display:flex;flex-wrap:wrap;gap:6px 28px;border-bottom:1px solid #0B4D3C55;margin:30px 0 28px}.tabs button{font-size:14px;white-space:nowrap;font-weight:600;background:transparent;border:0;border-bottom:3px solid transparent;padding:12px 0;color:#53635B;min-height:46px}.tabs button[aria-current]{border-color:#F4C430;color:#0B4D3C}.studio{display:grid;grid-template-columns:minmax(0,1.17fr) minmax(300px,1fr);gap:34px}.studio-stage{position:relative;min-height:440px;border-radius:8px;background:#EEEADF;border:1px solid #0B4D3C33;overflow:hidden}.coach-mount{width:100%;height:460px;position:relative}.stage-label{position:absolute;left:20px;top:18px;z-index:2;font-size:11px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:#0B4D3C;pointer-events:none}.stage-caption{background:#F5F1E8;padding:14px 20px;min-height:52px;border-top:1px solid #0B4D3C33;font-size:14px;color:#0B4D3C}.stage-unavailable{display:flex;align-items:center;justify-content:center;text-align:center;padding:50px 28px;height:100%;color:#0B4D3C;min-height:380px}.stage-unavailable p{max-width:290px}.lesson-copy{padding-top:6px}.intro{margin:12px 0 22px;font-size:15px;color:#53635B}.rule-line{font-size:17px;border-left:3px solid #F4C430;padding-left:16px;margin:20px 0}.gesture-list{margin:20px 0;display:grid;gap:0}.gesture-row{display:flex;align-items:center;justify-content:space-between;padding:12px 0;border-bottom:1px solid #0B4D3C22;gap:12px}.gesture-row strong{display:block;font-size:14px;color:#0B4D3C}.gesture-row small{color:#53635B}.gesture-row button{border:1px solid #0B4D3C55;border-radius:50%;width:42px;height:42px;background:transparent;flex-shrink:0;color:#0B4D3C}.actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:22px}.hint{font-size:13px;color:#53635B;margin:16px 0 0}.panel{border:1px solid #0B4D3C55;border-radius:8px;padding:24px;margin-top:20px}.panel h2{margin-bottom:16px}.notice{padding:16px 20px;border-left:4px solid #F4C430;background:#EEEADF;margin-top:18px}.inline-note{font-size:14px;color:#53635B;margin-top:12px}.lesson-steps{margin:34px 0 0;padding-top:28px;border-top:1px solid #0B4D3C55;display:grid;grid-template-columns:repeat(3,1fr);gap:28px}.lesson-steps article>span{font-family:'JetBrains Mono',monospace;font-size:13px;color:#0B4D3C}.lesson-steps h3{margin:10px 0}.lesson-steps p{font-size:14px;color:#53635B}.lesson-steps>.eyebrow{grid-column:1/-1;margin:0}.round-head{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:20px}.round-meta{font-family:'JetBrains Mono',monospace;font-size:12px;color:#0B4D3C}.round-progress{height:3px;background:#0B4D3C22;margin:14px 0 26px}.round-progress>div{height:100%;background:#0B4D3C}.question{margin-top:16px}.choices{display:grid;gap:10px;margin-top:20px}.choice{background:transparent;border:1px solid #0B4D3C66;color:#0B4D3C;border-radius:6px;padding:13px 16px;text-align:left;min-height:48px;font-size:15px}.choice:hover:not(:disabled){background:#EEEADF}.choice.selected{border-width:2px;background:#EEEADF}.choice.correct{border:2px solid #0B4D3C;box-shadow:inset 4px 0 #F4C430}.feedback{border-left:3px solid #F4C430;padding:16px;background:#EEEADF;margin-top:20px}.feedback p:last-child{margin:0}.feedback strong{color:#0B4D3C}.field{display:block;margin:18px 0;color:#0B4D3C;font-size:13px;font-weight:600}.field input,.field select,.field textarea{display:block;width:100%;margin-top:7px;padding:11px 12px;border:1px solid #0B4D3C88;border-radius:6px;background:#F5F1E8;color:#0F1311;font-size:15px;font-weight:400}.field textarea{resize:vertical;min-height:88px;line-height:1.5}.two-cols{display:grid;grid-template-columns:1fr 1fr;gap:22px}.builder-top{max-width:710px}.call-card{padding:22px;border:1px solid #0B4D3C55;border-radius:8px;margin:18px 0}.call-card .field{margin:10px 0}.number-label{font:12px 'JetBrains Mono',monospace;color:#53635B;margin-bottom:12px}.builder-errors{border-left:4px solid #0A2342;background:#EEEADF;padding:16px}.builder-errors ul{padding-left:20px;margin:0}.system-rule{border-top:1px solid #0B4D3C55;margin-top:24px;padding-top:22px}.system-rule ul{font-size:14px;padding-left:20px}.summary{max-width:740px;margin:0 auto}.score-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin:28px 0}.score-grid>div{border:1px solid #0B4D3C55;border-radius:8px;padding:22px}.score-grid strong{display:block;font:36px 'JetBrains Mono',monospace;color:#0B4D3C}.score-grid span{font-size:13px}.result-row{padding:14px 0;border-top:1px solid #0B4D3C22;font-size:14px}.result-row small{display:block;color:#53635B;margin-top:4px}.page-foot{border-top:1px solid #0B4D3C33;margin-top:48px;padding-top:24px;display:flex;justify-content:space-between;gap:28px;color:#53635B;font-size:12px}.page-foot p{font-weight:600;color:#0B4D3C;white-space:nowrap}.text-sequence{display:flex;flex-direction:column;gap:7px;padding:70px 24px 25px;min-height:430px;justify-content:center}.text-token{font-size:14px;color:#0B4D3C;padding:8px 14px;border:1px solid #0B4D3C33;border-radius:5px}.text-token span{font-family:'JetBrains Mono',monospace;font-size:11px;margin-right:13px;color:#53635B}.check-intro{max-width:700px;padding:12px 0}.check-intro h2{font-size:46px}.check-intro p{margin-top:16px}.report-scroll{overflow:auto}.report-table{border-collapse:collapse;width:100%;font-size:14px;white-space:nowrap}.report-table th,.report-table td{text-align:left;padding:13px 14px;border-bottom:1px solid #0B4D3C33}.report-table th{font-size:12px;color:#53635B}.player-pick{display:flex;align-items:center;gap:12px;padding:12px 0;border-bottom:1px solid #0B4D3C22}.player-pick input{width:20px;height:20px;accent-color:#0B4D3C}.team-list{display:grid;gap:10px}.team-list button{text-align:left;justify-content:flex-start}.details{border-top:1px solid #0B4D3C33;padding:18px 0;margin-top:24px;font-size:14px}.details summary{cursor:pointer;font-weight:600;color:#0B4D3C}.details p{margin:12px 0}.busy{pointer-events:none;opacity:.55}
@media(max-width:760px){.tabs{gap:0 22px}.site-nav{padding-left:20px;padding-right:20px}.site-nav img{width:72px;height:40px}.site-nav>a:last-child{font-size:12px}main{padding:28px 18px 28px}.masthead{display:block;margin-bottom:26px}.masthead h1{font-size:72px}.lede{font-size:22px}.mast-note{display:none}.context-bar{padding:13px 14px;gap:12px}.context-bar small{font-size:12px}.context-bar .button{padding:10px 13px;font-size:18px}.tabs{gap:25px;margin:22px 0}.studio{grid-template-columns:1fr;gap:22px}.studio-stage{min-height:350px}.coach-mount{height:375px}.lesson-copy{padding:0}.lesson-steps{grid-template-columns:1fr;gap:16px}.lesson-steps article{display:grid;grid-template-columns:32px 1fr;gap:10px}.lesson-steps article>span{padding-top:4px}.lesson-steps h3{margin:0 0 8px}.lesson-steps p{grid-column:2;margin:0}.two-cols{grid-template-columns:1fr;gap:0}.call-card{padding:18px}.page-foot{display:block}.round-head h2{font-size:32px}.score-grid{gap:12px}.score-grid>div{padding:16px}.score-grid strong{font-size:30px}.text-sequence{min-height:340px}.panel{padding:18px}.actions>.button{flex-grow:1}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}
.breakdown-heading{margin-top:30px}
.sign-number{font-family:'JetBrains Mono',monospace;font-size:84px;line-height:1;letter-spacing:.16em;color:#0B4D3C;background:#EEEADF;border:1px solid #0B4D3C33;border-radius:8px;padding:30px 18px 30px 34px;text-align:center;margin:16px 0 8px}
.sign-situation{font-size:15px;font-weight:600;color:#0B4D3C;border-left:3px solid #F4C430;padding-left:14px;margin:0 0 12px}
.digit-grid{display:grid;grid-template-columns:34px minmax(0,1fr);gap:8px 12px;align-items:center;margin-top:14px}
.digit-grid>span{font-family:'JetBrains Mono',monospace;font-size:15px;color:#0B4D3C}
.digit-grid select{width:100%;padding:10px;border:1px solid #0B4D3C88;border-radius:6px;background:#F5F1E8;color:#0F1311;font-size:14px;min-height:44px}
.digit-table{border-collapse:collapse;width:100%;font-size:14px;margin-top:10px}
.digit-table th,.digit-table td{text-align:left;padding:9px 10px;border-bottom:1px solid #0B4D3C22}
.digit-table th{font-size:12px;color:#53635B}
.digit-table td:first-child{font-family:'JetBrains Mono',monospace;color:#0B4D3C;width:62px}
.kind-choice{margin:18px 0 6px}
.kind-choice .actions{margin-top:10px}
@media(max-width:760px){.sign-number{font-size:62px;padding:22px 10px 22px 26px}.digit-grid{grid-template-columns:28px minmax(0,1fr)}}
/* September 15, 2026: voice, flash cards, hear-first practice, three-number builder. */
.say{font-family:Inter,system-ui,sans-serif;font-size:14px;font-weight:600;border:1px solid #0B4D3C;border-radius:6px;background:transparent;color:#0B4D3C;padding:9px 14px;min-height:44px;display:inline-flex;align-items:center;gap:8px}
.say.saying{background:#EEEADF}
.digit-say{width:1%;white-space:nowrap;text-align:right}
.digit-say .say{padding:6px 10px;min-height:36px;font-size:13px}
.visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.sign-hidden{color:#53635B;letter-spacing:.3em}
.sign-actions{margin:6px 0 18px;align-items:center}
.hear-first{display:flex;gap:12px;align-items:flex-start;font-weight:500;font-size:15px;color:#0F1311;text-transform:none;max-width:640px}
.hear-first input{width:22px;height:22px;flex:0 0 auto;accent-color:#0B4D3C;margin-top:2px}
.shape-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.decoy-card{background:#EEEADF}
.flash{max-width:720px}
.flash-card{border:1px solid #0B4D3C;border-bottom:3px solid #F4C430;border-radius:10px;background:#F5F1E8;padding:26px 24px;min-height:240px;display:flex;flex-direction:column;justify-content:center}
.flash-pick{display:block;margin-top:6px;font-size:13px;color:#53635B}.flash-pick.ok{color:#0B4D3C;font-weight:600}.flash-pick.miss{color:#0A2342}
.flash .choices{margin-top:16px}
.flash-card.flipped{background:#EEEADF}
.flash-card:focus-visible{outline:3px solid #0A2342;outline-offset:4px}
.flash-hint{font-size:13px;color:#53635B;margin:0;text-align:center;min-height:18px}
.flash-jobs{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin:18px 0}
.flash-jobs>div{border-left:3px solid #F4C430;padding-left:14px}
.flash-jobs .eyebrow{margin-bottom:6px;display:block}
.flash-jobs strong{font-family:'Bebas Neue',Impact,sans-serif;font-weight:400;font-size:34px;line-height:1.05;color:#0B4D3C;display:block}
.flash-reason{font-size:14px;color:#53635B;margin:0}
@media(max-width:760px){.shape-row{grid-template-columns:1fr;gap:0}.flash-jobs{grid-template-columns:1fr}.flash-card{padding:20px 16px;min-height:200px}}

/* Answer board: two panels, tile choices, one lock-in. Same idea as the IQ game. */
.quads{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:18px}
.quad{border:1px solid #0B4D3C55;border-radius:8px;padding:14px}
.quad h3{font-size:22px;margin-bottom:10px}
.quad-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.tile{background:#F5F1E8;border:1px solid #0B4D3C66;color:#0B4D3C;border-radius:6px;padding:12px 10px;min-height:52px;font-size:14px;font-weight:600;text-align:center;line-height:1.25}
.tile:hover:not(:disabled):not([aria-pressed="true"]){background:#EEEADF}
.tile[aria-pressed="true"]{background:#0B4D3C;color:#F5F1E8;border-color:#0B4D3C;box-shadow:inset 0 -3px #F4C430}
.sign-listen{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;width:100%;cursor:pointer;font-family:'Bebas Neue',Impact,sans-serif;font-size:40px;letter-spacing:.04em;color:#0B4D3C;padding:22px 18px}
.sign-listen .listen-glyph{font-size:34px;line-height:1}
.sign-listen small{font-family:Inter,system-ui,sans-serif;font-size:13px;letter-spacing:0;color:#53635B;font-weight:400}
.sign-listen.saying{background:#E4DECB}
@media(max-width:760px){.quads{grid-template-columns:1fr;gap:12px}.quad-grid{grid-template-columns:1fr 1fr}.tile{min-height:48px;font-size:13px}}

/* Scoreboard and stamps, in the IQ game's register. One row since the
   afternoon of September 17: Batter x/n, Runner x/n, Streak (Ben, on the
   two-row version: "In header a score for each"). Correct and Incorrect left
   the board; the SAFE / OUT stamp carries the verdict. Three cells fit a 390px
   phone where five did not (330px inside the board, 110px a cell). Each cell
   keeps the 46px height the verdict cells measured in the two-row version, so
   the board is the same box it has always been; the three numbers share the
   20px JetBrains Mono the job row used (18px on a phone), the streak set to
   match so the row reads as one. The number sits centred in its cell under
   the 11px gold label. */
.scoreboard{display:grid;grid-template-columns:repeat(3,1fr);gap:0;margin:14px 0 6px;background:#0B4D3C;border-radius:8px;padding:10px 12px;border-bottom:3px solid #F4C430}
.scoreboard>div{min-height:46px;display:flex;flex-direction:column;justify-content:center;text-align:center;color:#F5F1E8}
.scoreboard span{display:block;font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:#F4C430}
.scoreboard strong{display:block;font:20px 'JetBrains Mono',monospace;line-height:1.2}
.flash-card{position:relative;overflow:hidden}
.stamp{position:absolute;right:14px;top:10px;font-family:'Bebas Neue',Impact,sans-serif;font-size:64px;line-height:1;letter-spacing:.06em;padding:4px 14px;border:4px solid;border-radius:8px;transform:rotate(-12deg) scale(1.6);opacity:0;animation:stamp .32s cubic-bezier(.2,.9,.3,1.2) forwards;pointer-events:none}
.stamp-safe{color:#0B4D3C;border-color:#0B4D3C;background:rgba(245,241,232,.85)}
.stamp-out{color:#0A2342;border-color:#0A2342;background:rgba(245,241,232,.85)}
@keyframes stamp{to{transform:rotate(-12deg) scale(1);opacity:1}}
@media(prefers-reduced-motion:reduce){.stamp{animation:none;opacity:1;transform:rotate(-12deg)}}
@media(max-width:760px){.scoreboard strong{font-size:18px}.stamp{font-size:48px;right:10px;top:8px}}
.quad-grid.single{grid-template-columns:1fr}
.flash-verdict{font-weight:600;color:#0B4D3C;margin:0 0 8px}
.flash-play{font-size:15px;margin:0 0 8px}
.flash-play strong{color:#0B4D3C}

/* SOUND CONTROL. sounds.js keeps one `rundown_sound` flag for the whole origin,
   so a player who muted the IQ game found Team Signs silent with no control and
   no explanation. Same glyph, same aria-pressed contract and same off-state
   slash as the game's #sound-btn; the circle is this page's own forest-on-cream
   icon button (.gesture-row button) because the game's control sits on forest
   chrome and this page is cream-grounded. 46px clears the touch target. */
.context-controls{display:flex;align-items:center;gap:12px;flex-shrink:0}
.sound-btn{position:relative;display:inline-flex;align-items:center;justify-content:center;width:46px;height:46px;flex-shrink:0;border:1px solid #0B4D3C55;border-radius:50%;background:transparent;color:#0B4D3C;padding:0}
.sound-btn:hover{background:#EEEADF}
.sound-btn[aria-pressed="false"]{color:#53635B}
.sound-btn[aria-pressed="false"] .spk-waves{display:none}
.sound-btn[aria-pressed="false"]::after{content:"";position:absolute;width:24px;height:2px;background:currentColor;transform:rotate(-45deg);border-radius:1px}

/* REDUCE MOTION CELEBRATION. The confetti guard is correct and stays; it just
   used to be the whole reward, so a player with the setting on got nothing for
   a right call or a perfect round. This is brand 7.6/7.7's gold correct state
   HELD instead of flashed: no particles, no blink, no transition, no repeat. */
.celebrate-still{box-shadow:0 0 0 3px #F4C430}
.flash-card.celebrate-still .stamp-safe{box-shadow:0 0 0 5px rgba(244,196,48,.62)}
/* The gesture summary's two score cards are separate objects with a gap between
   them, so ring each card the way brand 7.7 puts the correct state on the card,
   instead of drawing one box around the gap. */
.score-grid.celebrate-still{box-shadow:none}
.score-grid.celebrate-still>div{box-shadow:0 0 0 3px #F4C430;border-color:#F4C430}

/* THE TEAM LOGO in the context bar (schema/45-team-logo.sql, team-logo.js). A
   32px white tile with a hairline left of the team's name, shown only when a
   real team is open and the row says a logo exists; the invented demo never
   shows one. The label already wraps at 390 for a long name, so a two-line
   label beside a tile is the existing behaviour. The report line sits under
   the bar for players and co-coaches only. */
.ctx-team{display:flex;align-items:center;gap:10px;min-width:0}
.ctx-logo{flex:0 0 auto;width:32px;height:32px;padding:3px;border-radius:8px;background:#fff;border:1.5px solid #EDE7D6;display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box}
.ctx-logo img{width:100%;height:100%;object-fit:contain;display:block}
.ctx-logo-report{font-size:12px;color:#0B4D3C;margin:8px 0 0}
.ctx-logo-report a{color:#0B4D3C}

/* Keep account and team navigation usable on touch screens. */
.site-nav>a:not(:first-child){display:inline-flex;align-items:center;justify-content:center;min-height:44px;min-width:44px;font-size:14px;font-weight:600;text-decoration:none}
@media(max-width:760px){.site-nav{gap:12px}.site-nav>a:not(:first-child){font-size:12px}}
