/* ===================================================================
   BRAINKONG ENGAGE STYLES — everything added after V2: daily ritual,
   Continue/Quick Play, tension layer, ghost pace, boss, duels, phone
   Grid layout, install, audio pill. Loaded after styles.css; later
   rules win by order, so no rule here needs an importance override.
   =================================================================== */
/* ===== Engage: Today's BrainKong, Continue, Game of the Day, challenge links, hints ===== */
.continue-wrap{padding-top:22px}
.continue-wrap .continue-main{display:grid;grid-template-columns:auto 1fr auto;gap:14px;align-items:center;background:var(--surface);border:1.5px solid var(--brand);border-radius:var(--radius);box-shadow:var(--shadow);padding:16px 18px;text-decoration:none;color:var(--text);margin-bottom:12px}
.continue-icon{font-size:2rem;line-height:1}
.continue-main small{display:block;font-size:12px;font-weight:900;letter-spacing:.14em;color:var(--brand)}
.continue-main strong{display:block;font-size:1.25rem;line-height:1.2;margin:2px 0}
.continue-main em{display:block;font-style:normal;color:var(--muted);font-size:.92rem}
.continue-btn{padding:10px 20px;border-radius:12px;font-weight:900}
.continue-today{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);padding:14px 16px}
.continue-today-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}
.continue-today-head span{font-weight:900;color:var(--brand)}
.today-tasks{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.today-tasks li a{display:grid;grid-template-columns:auto 1fr auto;gap:12px;align-items:center;padding:12px 14px;border:1.5px solid var(--border);border-radius:14px;background:#fbfcfb;color:var(--text);text-decoration:none;transition:.16s ease}
.today-tasks li a:hover{border-color:var(--brand);background:white}
.today-tasks li.done a{background:#edf8f1;border-color:#bcd9ca}
.today-tasks li.gotd:not(.done) a{border-color:#e6cf70;background:#fffbe6}
.today-check{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;font-size:1.15rem;background:var(--surface-soft)}
.today-tasks li.done .today-check{background:var(--brand);color:white;font-weight:900}
.today-task-text strong{display:block;font-size:1rem;line-height:1.2}
.today-task-text small{display:block;color:var(--muted);font-size:.86rem;margin-top:2px}
.today-go{font-weight:900;color:var(--brand);font-size:.9rem}
.today-tasks li.done .today-go{color:var(--good)}
.today-tasks.compact li a{padding:9px 12px}
.today-streak{display:flex;flex-wrap:wrap;gap:10px 18px;margin-top:12px;color:var(--muted);font-size:.92rem}
.today-streak strong{color:var(--text)}
.today-hub{display:grid;gap:12px;margin:0 0 22px}
.today-strip{padding:16px 18px}
.today-strip-head{display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px 16px;align-items:flex-end;margin-bottom:12px}
.today-strip-head h2{font-size:1.15rem;margin:4px 0 0;line-height:1.25}
.today-strip-head .today-streak{margin:0}
.gotd-card{display:grid;grid-template-columns:auto 1fr auto;gap:14px;align-items:center;padding:16px 18px;text-decoration:none;color:var(--text);border:1.5px solid #e6cf70;background:#fffbe6}
.gotd-card:hover{border-color:var(--brand)}
.gotd-icon{font-size:2rem;line-height:1}
.gotd-card strong{display:block;font-size:1.2rem;margin:2px 0}
.gotd-card small{display:block;color:var(--muted)}
.gotd-card .btn-primary{padding:10px 20px;border-radius:12px}
.today-page{padding-top:28px;padding-bottom:40px;display:grid;gap:16px}
.today-card{padding:20px}
.today-card .today-streak{margin:0 0 14px;font-size:1rem}
.today-card h2{margin:6px 0 8px}
.today-note{margin:14px 0 0;color:var(--muted);font-size:.92rem;line-height:1.5}
.v2-hint{border-color:#e6cf70;background:#fffbe6}
.v2-hint strong{display:block;color:#6c5600}
.v2-hint span{display:block;color:var(--text);margin-top:4px;line-height:1.45}
.challenge-banner{border:1.5px solid #e6cf70;background:#fffbe6;border-radius:14px;padding:12px 14px;margin:0 0 14px;display:grid;gap:3px}
.challenge-banner strong{color:#6c5600}
.challenge-banner span{color:var(--text);line-height:1.45}
.itl-share-row{display:grid;gap:10px;margin:0 0 14px}
.itl-verdict{margin:0;padding:12px 14px;border-radius:14px;font-weight:800;line-height:1.4}
.itl-verdict.win{background:#edf8f1;border:1.5px solid #bcd9ca;color:var(--good)}
.itl-verdict.miss{background:#fffbe6;border:1.5px solid #e6cf70;color:#6c5600}
.itl-challenge-btn{width:100%}
.itl-toast{position:fixed;left:50%;bottom:18px;transform:translate(-50%,20px);opacity:0;pointer-events:none;z-index:60;background:var(--text);color:white;border-radius:16px;padding:12px 18px;box-shadow:0 14px 34px rgba(23,32,42,.28);display:grid;gap:2px;max-width:min(92vw,440px);transition:.25s ease}
.itl-toast.show{opacity:1;transform:translate(-50%,0);pointer-events:auto}
.itl-toast strong{font-size:.98rem}
.itl-toast span{font-size:.88rem;opacity:.9}
.itl-toast a{color:#9fe1c1;font-weight:800}
@media(max-width:640px){
  .continue-wrap .continue-main{grid-template-columns:auto 1fr;padding:14px}
  .continue-btn{grid-column:1/-1;text-align:center}
  .gotd-card{grid-template-columns:auto 1fr;padding:14px}
  .gotd-card .btn-primary{grid-column:1/-1;text-align:center}
  .today-strip-head{align-items:flex-start}
  .today-page{padding-top:18px}
}


/* Continue card: side-by-side on desktop while tasks remain; collapsed one-liner when today is complete */
.continue-wrap:not(.hidden){display:grid;gap:12px}
.continue-wrap .continue-main{margin-bottom:0;align-self:stretch}
.continue-today.complete{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:6px 16px;padding:12px 16px}
.continue-today.complete .continue-today-head{margin:0;gap:10px}
.continue-today-line{margin:0;color:var(--muted);font-size:.95rem}
.continue-today-line strong{color:var(--text)}
@media(min-width:900px){
  .continue-wrap.two-up{grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:stretch}
  .continue-wrap.two-up .continue-main{grid-template-columns:auto 1fr;align-content:start}
  .continue-wrap.two-up .continue-btn{grid-column:1/-1;text-align:center;align-self:end}
}

/* ===== Tension layer: closer, urgency, streak-at-risk, perfect stamp, near-miss, rebuild ===== */
@keyframes itl-pulse{0%{box-shadow:0 0 0 0 rgba(180,35,24,.45)}100%{box-shadow:0 0 0 12px rgba(180,35,24,0)}}
@keyframes itl-closer{0%,100%{border-color:#e6cf70}50%{border-color:#b42318}}
.closer-round{border:2px solid #e6cf70;animation:itl-closer 1.4s ease-in-out infinite}
.urgent{color:var(--bad);font-weight:900;animation:itl-pulse .9s ease-out infinite;border-radius:999px}
.closer{color:#6c5600;font-weight:900;letter-spacing:.04em}
.at-risk{color:#6c5600;font-weight:900;position:relative}
.at-risk::after{content:"⚠ best";font-size:.6em;margin-left:5px;vertical-align:middle;letter-spacing:.06em}
.perfect-stamp{display:inline-flex;flex-direction:column;gap:2px;margin:6px auto 12px;padding:10px 16px;border-radius:14px;border:1.5px solid #e6cf70;background:linear-gradient(135deg,#fff8d6,#fff1a8);color:#6c5600;text-align:left}
.perfect-stamp strong{font-size:1rem;letter-spacing:.08em}
.perfect-stamp span{font-size:.85rem;color:#7a6200}
.near-miss{display:grid;gap:6px;margin:0 0 16px;padding:16px 18px;border-radius:16px;border:2px solid var(--brand);background:#edf8f1;text-align:left}
.near-miss strong{font-size:1.2rem;line-height:1.25;color:var(--brand-dark)}
.near-miss span{color:var(--text);line-height:1.45}
.near-miss-btn{margin-top:6px;width:100%;font-size:1.05rem;padding:14px 20px}
.v2-perfects{display:flex;align-items:center;gap:2px;margin:8px 0 10px;color:#d9d3b8;font-size:1rem}
.v2-perfects span.on{color:#d4a017;text-shadow:0 0 6px rgba(212,160,23,.45)}
.v2-perfects small{margin-left:8px;color:var(--muted);font-size:.8rem}
.today-streak .rebuild{color:#6c5600}

/* ===== Ghost pace + Weekly Boss ===== */
.progress-track.has-ghost{position:relative;overflow:visible;margin-bottom:6px}
.ghost-bar{position:absolute;left:0;bottom:-5px;height:3px;border-radius:999px;background:#d4a017;opacity:.85;transition:width .2s ease;pointer-events:none}
.ghost-label{font-size:.78rem;font-weight:800;margin:6px 0 16px;color:var(--muted)}
.ghost-label.ahead{color:var(--good)}.ghost-label.behind{color:#6c5600}
.boss-card{display:grid;grid-template-columns:auto 1fr auto;gap:14px;align-items:center;padding:16px 18px;text-decoration:none;color:var(--text);border:1.5px solid #c9b6f5;background:#f5f0ff}
.boss-card:hover{border-color:var(--brand)}
.boss-card.cleared{border-color:#bcd9ca;background:#edf8f1}
.boss-icon{font-size:2rem;line-height:1}
.boss-card strong{display:block;font-size:1.15rem;margin:2px 0}
.boss-card small{display:block;color:var(--muted)}
.boss-card .btn-primary{padding:10px 20px;border-radius:12px}
.challenge-banner.boss-banner{border-color:#c9b6f5;background:#f5f0ff}
.challenge-banner.boss-banner strong{color:#4b2a9a}
@media(max-width:640px){.boss-card{grid-template-columns:auto 1fr;padding:14px}.boss-card .btn-primary{grid-column:1/-1;text-align:center}}

/* ===== Duels ===== */
.duel-box{border:1.5px solid var(--border);border-radius:16px;padding:14px;background:#fbfcfb;display:grid;gap:10px;text-align:left}
.duel-head strong{display:block;font-size:1.05rem}.duel-head span{display:block;color:var(--muted);font-size:.9rem;line-height:1.4}
.duel-row{display:grid;grid-template-columns:1fr auto;gap:10px;align-items:end}
.duel-row label{display:grid;gap:4px;font-size:.8rem;font-weight:800;color:var(--muted)}
.duel-name{padding:10px 12px;border:1.5px solid var(--border);border-radius:12px;font:inherit;font-size:.95rem;min-width:0}
.duel-stakes{display:flex;gap:6px}
.duel-stake{padding:10px 12px;border:1.5px solid var(--border);border-radius:12px;background:white;font:inherit;font-weight:900;font-size:.85rem;cursor:pointer}
.duel-stake.on{border-color:var(--brand);background:#edf8f1;color:var(--brand-dark)}
.itl-rematch-btn{width:100%}
.continue-wrap .continue-main.duel-pending{border-color:#c9b6f5;background:#f5f0ff}
.duel-card{padding:16px 18px}
.duel-card-head{display:flex;justify-content:space-between;align-items:center;gap:10px}
.duel-card-head strong{font-size:1.5rem}
.duel-list{list-style:none;margin:10px 0 0;padding:0;display:grid;gap:6px}
.duel-list li{display:grid;grid-template-columns:28px 1fr auto;gap:10px;align-items:center;font-size:.9rem}
.duel-list li>span:first-child{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;font-weight:900;color:white;background:var(--muted)}
.duel-list li.won>span:first-child{background:var(--brand)}.duel-list li.lost>span:first-child{background:#b42318}
@media(max-width:640px){.duel-row{grid-template-columns:1fr}.duel-stakes{justify-content:space-between}.duel-stake{flex:1;text-align:center}}

.continue-wrap.two-up .duel-pending{grid-column:1/-1}

.today-strip.complete{padding:12px 18px}
.today-strip.complete .today-strip-head{margin-bottom:0;align-items:center}
.today-strip.complete h2{font-size:1rem;margin-top:2px}

/* Grid on phones: during play, drop the page heading and land the board in view */
#gridGamePanel{scroll-margin-top:72px}
@media(max-width:900px){
  body.grid-playing .grid-page-head{display:none}
  body.grid-playing .grid-board-help{display:none}
  body.grid-playing .grid-game-card{margin-top:0}
}

/* ===== Grid on phones during play: board first, answer sheet pinned to the bottom ===== */
@media(max-width:640px){
  body.grid-playing .grid-game-card{padding:12px 12px calc(44vh + 12px)}
  body.grid-playing .grid-game-top{flex-direction:row;flex-wrap:wrap;align-items:center;gap:6px 8px}
  body.grid-playing .grid-game-top h2,body.grid-playing #gridPuzzleTitle{font-size:1.15rem;line-height:1.15;margin:0;flex:1 1 100%}
  body.grid-playing .grid-game-top .challenge-label{flex:1 1 auto;margin:0}
  body.grid-playing .grid-game-top .game-switch-btn,body.grid-playing .grid-game-top .btn-secondary{width:auto;min-height:32px;padding:0 10px;font-size:.78rem;border-radius:9px}
  body.grid-playing .grid-difficulty-strip{margin:6px 0 4px;padding:0;background:none;border:0;box-shadow:none;font-size:.8rem;color:var(--muted);display:flex;flex-wrap:wrap;gap:4px 10px}
  body.grid-playing .grid-difficulty-strip *{font-size:.8rem;margin:0;padding:0}
  body.grid-playing .grid-game-stats{gap:4px;margin:6px 0 4px}
  body.grid-playing .grid-game-stats>*{font-size:11px;padding:4px 8px;min-height:0}
  body.grid-playing .grid-energy-row{min-height:0;margin:0 0 6px}
  body.grid-playing .grid-energy-row:empty{display:none}
  body.grid-playing .grid-rule{display:none}
  body.grid-playing .grid-play-layout{grid-template-areas:"board";gap:0}
  body.grid-playing .grid-assist-panel{position:fixed;top:auto;left:0;right:0;bottom:0;z-index:30;max-height:42vh;overflow:auto;border:0;background:#fff;border-top:1.5px solid var(--border);border-radius:16px 16px 0 0;box-shadow:0 -10px 28px rgba(23,32,42,.12);padding:8px 12px calc(8px + env(safe-area-inset-bottom))}
  body.grid-playing .grid-clue-card{margin:0;padding:0;border:0;background:none}
  body.grid-playing .grid-clue-card>.challenge-label{display:none}
  body.grid-playing .grid-selected-position{margin:0 0 4px;padding:3px 8px;font-size:11px}
  body.grid-playing .grid-clue{font-size:1.05rem;margin:0}
  body.grid-playing #gridFeedback{font-size:.82rem;margin:4px 0 0;line-height:1.3}
  body.grid-playing .grid-answer-panel{padding-top:0}
  body.grid-playing .grid-answer-panel>.challenge-label{display:none}
  body.grid-playing .grid-word-tray{margin-top:6px;gap:6px}
  body.grid-playing .grid-word-tray button{min-height:40px;padding:8px 6px;font-size:.92rem}
  body.grid-playing .grid-game-actions{margin-top:6px;gap:6px;flex-direction:row;flex-wrap:nowrap}
  body.grid-playing .grid-game-actions button{width:auto;flex:1 1 0;min-height:34px;padding:0 6px;font-size:.76rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  body.grid-playing .grid-game-card{padding-bottom:calc(42vh + 12px)}
  body.grid-playing #gridFeedback:empty{display:none}
}

/* ===== Install (add to home screen) ===== */
.install-wrap:not(.hidden){display:block;padding-top:12px}
.install-card{padding:14px 16px}
.install-head{display:grid;grid-template-columns:auto 1fr auto;gap:12px;align-items:center}
.install-icon img{border-radius:10px;display:block}
.install-head strong{display:block;font-size:1.05rem;margin:2px 0}
.install-head small{display:block;color:var(--muted)}
.install-close{border:0;background:transparent;font:inherit;font-weight:900;color:var(--muted);padding:6px;cursor:pointer;align-self:start}
.install-actions{margin-top:10px}
.install-actions .btn-primary{width:100%;text-align:center}
.install-steps{margin:10px 0 0;padding-left:20px;display:grid;gap:8px;line-height:1.45}
.install-share-icon{display:inline-flex;vertical-align:middle;padding:2px 4px;border-radius:6px;background:var(--surface-soft);color:var(--brand)}
.install-note{margin:10px 0 0;color:var(--muted);font-size:.9rem}
.install-guide{margin-top:10px}
.install-guide-page h3{margin:16px 0 4px;font-size:1rem}
@media(min-width:901px){.install-wrap:not(.hidden){display:none}}

/* ===== TypingKong-matched BrainKong Audio system ===== */
.audio-control-button{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--border);background:#fff;color:#475467;border-radius:11px;padding:8px 10px;font:inherit;font-weight:850;cursor:pointer;white-space:nowrap;line-height:1}
.audio-control-button:hover,.audio-control-button[aria-expanded="true"]{border-color:#b9d9d2;color:var(--brand-dark);background:#f7fbfa}
.itlence-audio-panel{position:fixed;top:80px;right:max(14px,calc((100vw - min(calc(100vw - 32px),1120px))/2));z-index:70;width:min(390px,calc(100vw - 24px));padding:16px;border:1px solid var(--border);border-radius:16px;background:#fff;box-shadow:0 18px 48px rgba(19,36,58,.18);display:none}
.itlence-audio-panel.show{display:block}
.audio-panel-head{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;padding-bottom:12px;border-bottom:1px solid var(--border)}
.audio-panel-head strong{display:block;font-size:1rem}.audio-panel-head span{display:block;margin-top:2px;color:var(--muted);font-size:.76rem}
.audio-panel-close{border:0;background:transparent;color:var(--muted);font-size:1.6rem;line-height:1;cursor:pointer;padding:0 2px}
.audio-switch{display:flex;justify-content:space-between;gap:18px;align-items:center;padding:13px 0;border-bottom:1px solid var(--border);cursor:pointer}
.audio-switch span{display:block}.audio-switch strong{display:block;font-size:.9rem}
.audio-switch small,.audio-voice-row small,.audio-nickname-row small{display:block;margin-top:2px;color:var(--muted);font-size:.72rem;line-height:1.35}
.audio-switch input{width:20px;height:20px;accent-color:var(--brand)}
.audio-voice-row{display:grid;grid-template-columns:1fr auto;gap:10px;align-items:end;padding-top:13px}
.audio-voice-row label{grid-column:1/-1}.audio-voice-row select{min-width:0;width:100%;border:1px solid #ccd4dd;border-radius:10px;padding:9px;background:#fff}
.audio-voice-row .btn-secondary{padding:9px 12px;min-height:40px}
.audio-nickname-row{display:grid;gap:6px;padding-top:13px;margin-top:13px;border-top:1px solid var(--border)}
.audio-nickname-row strong{font-size:.9rem}.audio-nickname-row input{width:100%;border:1px solid #ccd4dd;border-radius:10px;padding:9px;background:#fff}
@media(max-width:700px){.audio-control-text{display:none}.audio-control-button{padding:8px 9px}.itlence-audio-panel{top:76px;right:10px}.audio-voice-row{grid-template-columns:1fr}.audio-voice-row .btn-secondary{width:100%}}


/* ===== V4-16 result celebrations ===== */
@keyframes itl-celebrate-pop{0%{transform:scale(.92);opacity:.72}65%{transform:scale(1.045);opacity:1}100%{transform:scale(1);opacity:1}}
@keyframes itl-celebrate-card-in{0%{transform:translate(-50%,-14px) scale(.96);opacity:0}100%{transform:translate(-50%,0) scale(1);opacity:1}}
.itl-celebrate-headline-pop{animation:itl-celebrate-pop .48s cubic-bezier(.2,.8,.2,1)}
.itl-celebrate-canvas{position:fixed;inset:0;z-index:82;pointer-events:none;width:100%;height:100%}
.itl-celebrate-inline{margin:8px auto 14px;max-width:680px;padding:9px 14px;border-radius:999px;background:#edf8f1;border:1px solid #bcd9ca;color:var(--brand-dark);font-weight:850;line-height:1.35;text-align:center}
.itl-celebrate-card{position:fixed;z-index:84;left:50%;top:max(76px,calc(env(safe-area-inset-top) + 8px));transform:translateX(-50%);width:min(92vw,520px);display:grid;gap:7px;padding:18px 20px;border-radius:18px;border:1.5px solid #bcd9ca;background:#fff;color:var(--text);box-shadow:0 18px 48px rgba(23,32,42,.22);text-align:left;animation:itl-celebrate-card-in .34s cubic-bezier(.2,.8,.2,1);pointer-events:auto}
.itl-celebrate-card.tier-3{border-color:#e6cf70;background:linear-gradient(135deg,#fffef8,#fff8d6)}
.itl-celebrate-kicker{font-size:.72rem;font-weight:950;letter-spacing:.14em;color:var(--brand);text-transform:uppercase}
.itl-celebrate-card.tier-3 .itl-celebrate-kicker{color:#7a6200}
.itl-celebrate-card>strong{font-size:1.45rem;line-height:1.12}
.itl-celebrate-card>span{font-weight:800;color:var(--muted);line-height:1.35}
.itl-celebrate-card>p{margin:2px 0 0;line-height:1.45;color:var(--text)}
.itl-celebrate-share{margin-top:4px;width:100%}
@media(max-width:640px){
  .itl-celebrate-card{top:max(60px,calc(env(safe-area-inset-top) + 6px));width:calc(100vw - 20px);padding:14px 15px;border-radius:15px}
  .itl-celebrate-card>strong{font-size:1.2rem}
  .itl-celebrate-inline{margin:8px 10px 12px;border-radius:14px}
}
@media(prefers-reduced-motion:reduce){
  .itl-celebrate-headline-pop,.itl-celebrate-card{animation:none}
}

/* ===== V4-17 score awareness ===== */
.itl-score-anchor{position:relative}
.itl-score-delta{position:absolute;left:50%;top:-1.35rem;transform:translate(-50%,6px) scale(.92);opacity:0;pointer-events:none;font-size:.78rem;font-weight:950;letter-spacing:.02em;white-space:nowrap;transition:opacity .16s ease,transform .22s ease}
.itl-score-delta.gain{color:var(--good)}
.itl-score-delta.loss{color:var(--bad)}
.itl-score-delta.show{opacity:1;transform:translate(-50%,0) scale(1)}
body.itl-score-zero-open{overflow:hidden}
.itl-score-zero-card{position:fixed;z-index:96;inset:0;display:grid;align-content:center;justify-items:center;gap:9px;padding:28px;background:rgba(247,248,246,.96);text-align:center;color:var(--text)}
.itl-score-zero-card::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 50% 42%,rgba(255,255,255,.98),rgba(247,248,246,.96));z-index:-1}
.itl-score-zero-kicker{font-size:.78rem;font-weight:950;letter-spacing:.14em;color:var(--bad)}
.itl-score-zero-card>strong{font-size:clamp(1.7rem,6vw,2.5rem);line-height:1.05}
.itl-score-zero-card>p{max-width:520px;margin:0;color:var(--muted);font-weight:700;line-height:1.5}
.itl-score-zero-actions{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin-top:8px}
.itl-score-zero-actions .btn-primary,.itl-score-zero-actions .btn-secondary{min-width:160px;text-align:center}
@media(max-width:520px){.itl-score-zero-card{padding:22px 16px}.itl-score-zero-actions{width:100%}.itl-score-zero-actions .btn-primary,.itl-score-zero-actions .btn-secondary{width:100%}}
@media(prefers-reduced-motion:reduce){.itl-score-delta{transition:none}}

/* v4-19 — optional local-only personalization */
.itl-personal-greeting{margin-top:18px;margin-bottom:-4px;font-weight:900;font-size:clamp(18px,2.2vw,24px);color:#17324a;letter-spacing:-.02em}
.itl-personalize-overlay{position:fixed;inset:0;z-index:1200;display:grid;place-items:center;padding:20px;background:rgba(10,28,43,.42);backdrop-filter:blur(5px);opacity:0;visibility:hidden;transition:opacity .16s ease,visibility .16s ease}
.itl-personalize-overlay.show{opacity:1;visibility:visible}
.itl-personalize-card{width:min(440px,100%);background:#fff;border:1px solid #dbe4df;border-radius:22px;padding:28px;box-shadow:0 24px 70px rgba(14,36,53,.22)}
.itl-personalize-card h2{margin:6px 0 8px;font-size:clamp(26px,5vw,34px);line-height:1.05;color:#10233a}
.itl-personalize-card p{margin:0 0 20px;color:#5c6e7f}
.itl-personalize-card form{display:grid;gap:10px}
.itl-personalize-card label{color:#10233a}
.itl-personalize-card input{width:100%;min-height:48px;border:1px solid #ccd8d2;border-radius:12px;padding:0 14px;font:inherit;font-size:16px;color:#10233a;background:#fff;box-sizing:border-box}
.itl-personalize-card input:focus{outline:3px solid rgba(32,133,101,.18);border-color:#208565}
.itl-personalize-card input[aria-invalid="true"]{border-color:#b42318}
.itl-personalize-actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-top:4px}
.itl-personalize-card small{display:block;margin-top:14px;color:#6f7f8e;line-height:1.45}
@media (max-width:520px){.itl-personalize-overlay{padding:14px}.itl-personalize-card{padding:22px;border-radius:18px}.itl-personalize-actions .btn-primary,.itl-personalize-actions .btn-ghost{flex:1 1 auto;min-height:44px}}


/* BrainKong v4-22 simplified experience */
.brand-word{letter-spacing:.02em}
.home-simple-hero{padding:72px 0 46px;max-width:820px;text-align:center}
.home-simple-hero h1{margin:12px auto 18px}
.home-simple-hero h1 span{color:var(--brand)}
.home-simple-hero .hero-copy{margin:0 auto 26px;max-width:650px}
.home-primary-actions{justify-content:center}
.home-family-section{padding-top:34px}
.simple-family-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.simple-family-card{display:flex;min-width:0;min-height:146px;flex-direction:column;align-items:flex-start;justify-content:flex-end;gap:5px;padding:20px;border:1px solid var(--border);border-radius:18px;background:#fff;color:var(--text);text-decoration:none;transition:transform .15s ease,border-color .15s ease,box-shadow .15s ease}
.simple-family-card>span{font-size:30px;margin-bottom:auto}
.simple-family-card strong{font-size:18px;line-height:1.2}
.simple-family-card small{color:var(--muted);font-weight:700;line-height:1.35}
.simple-family-card em{margin-top:8px;color:var(--brand);font-style:normal;font-size:12px;font-weight:900}
.simple-family-card:hover,.simple-family-card:focus-visible{transform:translateY(-2px);border-color:#a9cdbb;box-shadow:0 8px 20px rgba(23,32,42,.06);outline:none}
.simple-family-grid-hub{grid-template-columns:repeat(2,minmax(0,1fr));max-width:880px;margin:0 auto}
.simple-family-card-large{min-height:190px;padding:24px}
.simple-family-card-large strong{font-size:24px}
.simplified-play-hub{max-width:980px}
.surprise-me-strip{display:flex;align-items:center;justify-content:space-between;gap:18px;max-width:880px;margin:18px auto 0;padding:16px 18px;border:1px solid var(--border);border-radius:16px;background:#fff}
.surprise-me-strip strong,.surprise-me-strip span{display:block}
.surprise-me-strip span{margin-top:2px;color:var(--muted);font-size:13px}
.simplified-mode-card{max-width:720px;margin-left:auto;margin-right:auto}
.simple-start-copy{margin:4px 0 16px;color:var(--muted)}
.simple-start-actions .btn-primary{min-width:180px}
.simplified-details{margin-top:14px;border-top:1px solid var(--border);padding-top:12px}
.simplified-details>summary{display:flex;align-items:center;justify-content:space-between;gap:12px;cursor:pointer;list-style:none;color:var(--text);font-weight:850;padding:7px 0}
.simplified-details>summary::-webkit-details-marker{display:none}
.simplified-details[open]>summary{color:var(--brand)}
.simplified-details .mode-grid,.simplified-details .special-grid,.simplified-details .practice-grid{margin-top:12px}
.simplified-practice-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
.simplified-result-actions{justify-content:center}
.result-more-details{text-align:left}
.result-more-details .result-more-challenge{margin-top:10px}
.result-more-details .share-card-preview{margin-top:14px}
.simplified-progress-more>summary{display:block;padding:4px 0;cursor:pointer;list-style:none}
.simplified-progress-more>summary::-webkit-details-marker{display:none}
.simplified-progress-more>summary strong,.simplified-progress-more>summary span{display:block}
.simplified-progress-more>summary span{margin-top:3px;color:var(--muted);font-size:13px;font-weight:600}
.progress-nested-section{padding:18px 0;border-top:1px solid var(--border)}
.simplified-progress-more[open]>summary{padding-bottom:14px}
.howto-family-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:18px 0 28px}
.howto-family-grid>div{border:1px solid var(--border);border-radius:14px;background:#fff;padding:16px}
.howto-family-grid strong,.howto-family-grid span{display:block}
.howto-family-grid span{margin-top:5px;color:var(--muted);font-size:14px}
.grid-more-modes,.typing-more-modes,.brain-more-games{margin-top:14px}
.typing-more-modes .typing-game-grid,.brain-more-games .brain-game-grid{margin-top:12px}
@media(max-width:820px){
  .nav-links a.nav-primary{display:inline-flex}
  .nav-links a.nav-secondary{display:none}
  .simple-family-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .simplified-practice-grid{grid-template-columns:1fr}
}
@media(max-width:520px){
  .home-simple-hero{padding:44px 0 28px;text-align:left}
  .home-simple-hero .hero-copy{margin-left:0}
  .home-primary-actions{justify-content:flex-start}
  .simple-family-grid,.simple-family-grid-hub,.howto-family-grid{grid-template-columns:1fr}
  .simple-family-card,.simple-family-card-large{min-height:128px}
  .surprise-me-strip{align-items:stretch;flex-direction:column}
  .surprise-me-strip .btn-secondary{width:100%}
  .nav-links{gap:10px}
  .nav-links a.nav-primary{font-size:13px}
  .audio-control-button{min-width:42px;justify-content:center}
}

/* v4-22 post-play personalization: value first, optional name second */
.itl-personalize-inline{margin:18px 0 0;padding:16px;border:1px solid var(--border);border-radius:15px;background:#fbfcfb;text-align:left}
.itl-personalize-inline>div strong,.itl-personalize-inline>div span{display:block}
.itl-personalize-inline>div span{margin-top:3px;color:var(--muted);font-size:13px}
.itl-personalize-inline form{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:8px;margin-top:12px}
.itl-personalize-inline input{min-width:0;min-height:44px;border:1px solid #ccd8d2;border-radius:11px;padding:0 12px;font:inherit;font-size:16px;background:#fff}
.itl-personalize-inline input:focus{outline:3px solid rgba(32,133,101,.16);border-color:#208565}
.itl-personalize-inline small{display:block;margin-top:8px;color:var(--muted);font-size:11px}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media(max-width:520px){.itl-personalize-inline form{grid-template-columns:1fr 1fr}.itl-personalize-inline input{grid-column:1/-1}}


/* V4-24 VISIBILITY ORGANIZATION */
.organized-games-hub .game-family{scroll-margin-top:86px}
.organized-games-hub .special-head .btn-secondary{white-space:nowrap}
@media(max-width:720px){.organized-games-hub .special-head .btn-secondary{width:100%;text-align:center}}


/* V4-33 Weekly Boss global ranking */
.itl-global-rank{margin:18px 0;padding:18px;border:1px solid var(--border);border-radius:18px;background:#fbfcfb;box-shadow:0 8px 24px rgba(26,48,38,.05)}
.rank-head{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;margin-bottom:12px}
.rank-head h3{margin:4px 0 0;font-size:clamp(1.2rem,4vw,1.55rem);letter-spacing:-.02em}
.rank-status{font-size:.84rem;color:var(--muted);text-align:right;max-width:17rem;line-height:1.35}
.rank-status.good{color:var(--good);font-weight:800}
.rank-best{margin:4px 0 12px;color:var(--muted)}
.rank-summary-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:12px 0}
.rank-summary-grid>div{padding:12px;border:1px solid var(--border);border-radius:14px;background:#fff;text-align:center}
.rank-summary-grid strong{display:block;font-size:1.08rem;line-height:1.2}
.rank-summary-grid span{display:block;margin-top:4px;color:var(--muted);font-size:.78rem}
.rank-top{margin-top:12px;border-top:1px solid var(--border);padding-top:10px}
.rank-top summary{cursor:pointer;font-weight:850;color:var(--brand);padding:4px 0}
.rank-top-list{list-style:none;padding:0;margin:10px 0 0;display:grid;gap:4px}
.rank-top-list li{display:grid;grid-template-columns:3.2rem minmax(0,1fr) auto;align-items:center;gap:8px;padding:8px 10px;border-radius:10px;background:#fff;border:1px solid #eef1ef;font-size:.9rem}
.rank-place{color:var(--brand);font-weight:900}.rank-name{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.rank-top-list strong{font-variant-numeric:tabular-nums}
.rank-empty{margin:10px 0 0;color:var(--muted);font-size:.9rem}
.rank-disclosure{margin:12px 0 0;color:var(--muted);font-size:.76rem;line-height:1.5}
.rank-disclosure a{color:var(--brand);font-weight:750}.rank-opt-toggle{border:0;background:none;color:var(--brand);text-decoration:underline;padding:0;font:inherit;cursor:pointer;font-weight:750}
.rank-inline{display:block!important;margin-top:5px!important;color:var(--brand)!important;font-weight:800!important}
@media(max-width:620px){.itl-global-rank{padding:15px;margin:14px 0}.rank-head{display:block}.rank-status{display:block;text-align:left;margin-top:6px;max-width:none}.rank-summary-grid{grid-template-columns:1fr 1fr}.rank-summary-grid>div:last-child{grid-column:1/-1}.rank-top-list li{grid-template-columns:2.8rem minmax(0,1fr) auto;padding:8px;font-size:.86rem}}

/* BrainKong header controls */
.header-controls{display:flex;align-items:center;gap:10px;flex:0 0 auto}
@media(max-width:700px){.nav{flex-wrap:wrap;gap:8px 12px;padding:8px 0}.brand{order:1}.header-controls{order:2;margin-left:auto;gap:7px}.nav-links{order:3;width:100%;justify-content:center;gap:18px}}

/* BrainKong V1.3 — game-family cards are full-card interactive targets */
.home-family-section .simple-family-card{
  cursor:pointer;
  position:relative;
  transition:transform .15s ease,border-color .15s ease,background .15s ease,box-shadow .15s ease;
}
.home-family-section .simple-family-card:hover,
.home-family-section .simple-family-card:focus-visible{
  transform:translateY(-3px);
  border-color:var(--brand);
  background:#f4faf6;
  box-shadow:0 10px 24px rgba(23,70,52,.10);
  outline:3px solid rgba(38,102,79,.10);
  outline-offset:2px;
}
.home-family-section .simple-family-card:hover strong,
.home-family-section .simple-family-card:focus-visible strong{color:var(--brand)}
.home-family-section .simple-family-card:active{transform:translateY(0)}

/* BrainKong V1.7 — first-visit See It. Fix It. proof challenge */
.brainkong-proof-sentence{margin:0 0 14px;padding:20px 22px;border:1px solid #d7dfdb;border-radius:16px;background:#f4f7f5;color:var(--text);font-size:clamp(19px,2vw,24px);line-height:1.5;font-weight:750;letter-spacing:.01em}
.brainkong-proof-form{display:grid;grid-template-columns:1fr auto;gap:10px;align-items:end}
.brainkong-proof-choice-label{grid-column:1/-1;font-size:.82rem;font-weight:900;letter-spacing:.08em;text-transform:uppercase;color:var(--brand)}
.brainkong-proof-choices,.typing-choice-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;grid-column:1/-1}
.brainkong-proof-choice,.typing-choice{appearance:none;text-align:left;border:1.5px solid #cfd9d4;border-radius:14px;background:#fff;color:var(--text);padding:14px 16px;min-height:56px;font:700 16px/1.35 inherit;cursor:pointer}
.brainkong-proof-choice:hover:not(:disabled),.typing-choice:hover:not(:disabled){border-color:var(--brand);background:#f4faf6}
.brainkong-proof-choice.is-correct,.typing-choice.correct{border-color:#67ad8a;background:#f1faf5}
.brainkong-proof-choice.is-wrong,.typing-choice.wrong{border-color:#d98d8d;background:#fff7f7}
.brainkong-proof-form label{grid-column:1/-1;font-size:.82rem;font-weight:900;letter-spacing:.08em;text-transform:uppercase;color:var(--brand)}
.brainkong-proof-input{width:100%;min-height:56px;padding:14px 16px;border:1.5px solid #cfd9d4;border-radius:14px;background:#fff;color:var(--text);font:700 16px/1.3 inherit;outline:none;transition:.15s ease}
.brainkong-proof-input:focus{border-color:var(--brand);box-shadow:0 0 0 3px rgba(38,102,79,.12)}
.brainkong-proof-input.is-correct{border-color:#67ad8a;background:#f1faf5}
.brainkong-proof-input.is-wrong{border-color:#d98d8d;background:#fff7f7}
.brainkong-proof-check{min-height:56px;white-space:nowrap}
@media(max-width:640px){.brainkong-proof-sentence{padding:16px;font-size:18px}.brainkong-proof-form,.brainkong-proof-choices,.typing-choice-grid{grid-template-columns:1fr}.brainkong-proof-check{width:100%}}

/* BrainKong — premium first-visit finish within the locked Kong homepage format */
.home-page{background:#f7f9f7}
.home-page .site-header{background:rgba(247,249,247,.96);border-bottom-color:#dde5df;box-shadow:0 1px 0 rgba(18,49,38,.02)}
.home-page .brand{letter-spacing:-.015em}.home-page .brand-mark{width:36px;height:36px;border-radius:11px;box-shadow:0 5px 14px rgba(38,102,79,.16)}
.home-page .nav-links a{position:relative;padding:8px 0}.home-page .nav-links a:after{content:"";position:absolute;left:0;right:0;bottom:2px;height:2px;border-radius:2px;background:var(--brand);transform:scaleX(0);transition:transform .16s ease}.home-page .nav-links a:hover:after,.home-page .nav-links a:focus-visible:after{transform:scaleX(1)}
.home-page .brainkong-first-visit{width:min(1040px,calc(100% - 32px));min-height:calc(100vh - 152px);padding:30px 0 46px;display:flex;flex-direction:column;align-items:center;text-align:center;justify-content:flex-start}
.home-page .brainkong-first-copy{max-width:860px;margin:0 auto 20px}
.home-page .brainkong-first-brandline{font-size:.75rem;letter-spacing:.16em;color:#22694f}
.home-page .brainkong-first-copy h1{max-width:850px;margin:10px auto 3px;font-size:clamp(46px,5.4vw,68px);line-height:1;letter-spacing:-.052em;color:#102238;text-wrap:balance}
.home-page .brainkong-first-tagline{margin:0 0 8px;font-size:clamp(30px,3.1vw,40px);line-height:1.08;color:#267255}
.home-page .brainkong-first-sub{max-width:680px;margin:0 auto;color:#5b6875;font-size:17px;line-height:1.5}
.home-page .brainkong-proof-card{position:relative;width:min(900px,100%);padding:23px 25px 24px;border:1px solid #d6e0da;border-radius:21px;background:#fff;box-shadow:0 18px 45px rgba(25,53,43,.085),0 2px 6px rgba(25,53,43,.035);text-align:left;overflow:hidden}
.home-page .brainkong-proof-card:before{content:"";position:absolute;inset:0 0 auto;height:3px;background:#2d7b5d}
.home-page .brainkong-proof-head{display:flex;align-items:center;gap:11px;margin-bottom:15px}
.home-page .brainkong-proof-head strong{display:block;margin-top:1px;font-size:19px;line-height:1.25;color:#17263a}
.home-page .brainkong-proof-icon{width:42px;height:42px;border-radius:12px;background:#e9f4ee;color:#174f3a;font-size:21px;box-shadow:inset 0 0 0 1px rgba(38,102,79,.06)}
.home-page .brainkong-proof-sentence{margin:0 0 14px;padding:17px 19px;border:1px solid #d8e2dc;border-radius:14px;background:#f3f6f4;color:#132337;font-size:clamp(18px,1.8vw,22px);line-height:1.45;font-weight:820;letter-spacing:-.012em}
.home-page .brainkong-proof-choice-label{margin-bottom:1px;color:#22694f;font-size:.71rem;letter-spacing:.12em}
.home-page .brainkong-proof-choices{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
.home-page .brainkong-proof-choice{display:flex;align-items:center;gap:11px;min-height:58px;padding:10px 12px;border:1px solid #d7e0db;border-radius:13px;background:#fff;color:#213043;font-size:14px;line-height:1.38;font-weight:680;box-shadow:0 2px 5px rgba(25,53,43,.025);transition:transform .14s ease,border-color .14s ease,box-shadow .14s ease,background .14s ease}
.home-page .brainkong-proof-choice:hover:not(:disabled),.home-page .brainkong-proof-choice:focus-visible:not(:disabled){transform:translateY(-2px);border-color:#559477;background:#f9fcfa;box-shadow:0 7px 16px rgba(38,102,79,.09);outline:3px solid rgba(38,102,79,.10);outline-offset:1px}
.home-page .brainkong-proof-choice:active:not(:disabled){transform:translateY(0);box-shadow:0 2px 5px rgba(25,53,43,.03)}
.home-page .brainkong-proof-choice:disabled{opacity:1;cursor:default}
.home-page .brainkong-choice-marker{display:grid;place-items:center;flex:0 0 30px;width:30px;height:30px;border-radius:9px;background:#edf3ef;color:#26664f;font-size:.75rem;font-weight:950}
.home-page .brainkong-choice-text{flex:1}
.home-page .brainkong-proof-choice.is-correct{border-color:#4f9877;background:#edf8f2;color:#164d38;box-shadow:inset 0 0 0 1px rgba(46,126,91,.05)}
.home-page .brainkong-proof-choice.is-correct .brainkong-choice-marker{background:#267255;color:#fff}
.home-page .brainkong-proof-choice.is-wrong{border-color:#c97979;background:#fff3f3;color:#7f2929}
.home-page .brainkong-proof-choice.is-wrong .brainkong-choice-marker{background:#a84444;color:#fff}
.home-page .brainkong-proof-feedback{min-height:0;margin:12px 0 0;padding:0;font-size:.94rem}.home-page .brainkong-proof-feedback:empty{display:none}
.home-page .brainkong-proof-result{padding-top:1px}
.home-page .site-footer{background:#fbfcfb}
@media(max-width:700px){.home-page .brainkong-first-visit{width:min(620px,calc(100% - 24px));min-height:0;padding:24px 0 34px}.home-page .brainkong-first-copy{margin-bottom:17px}.home-page .brainkong-first-copy h1{font-size:clamp(40px,11.5vw,54px)}.home-page .brainkong-first-tagline{font-size:30px}.home-page .brainkong-first-sub{font-size:16px}.home-page .brainkong-proof-card{padding:18px 16px;border-radius:18px}.home-page .brainkong-proof-choices{grid-template-columns:1fr;gap:8px}.home-page .brainkong-proof-choice{min-height:54px}.home-page .brainkong-proof-sentence{padding:15px;font-size:18px}}
@media(max-width:420px){.home-page .brainkong-first-brandline{font-size:.66rem;line-height:1.45}.home-page .brainkong-first-copy h1{font-size:39px}.home-page .brainkong-proof-card{padding:16px 13px}.home-page .brainkong-proof-head strong{font-size:18px}.home-page .brainkong-proof-choice{padding:9px 10px;font-size:13.5px}}
