/* Brain Games (Golden Matrix, Starlight Recall, Quick Wit Sixty): navy + bright gold, champagne accents. No white backgrounds. */
.pg-brain{--bk-navy:#0B2545;--bk-deep:#061633;--bk-gold:#FFC72C;--bk-gold2:#FFD54F;--bk-champ:#F3E5AB;--bk-ink:#F7F1DC}
.pg-brain .g-play{display:flex;flex-direction:column}
.pg-brain .g-play>.g-stage{order:1}.pg-brain .g-play>.g-result{order:2}.pg-brain .g-play>.g-bar{order:3;margin-top:.6rem}.pg-brain .g-play>.g-msg{order:4}
.bk-stage{background:radial-gradient(120% 90% at 50% 0%,#14336b 0%,#0B2545 45%,#061633 100%)!important;border:2px solid rgba(255,199,44,.55)!important;color:var(--bk-ink);padding:.6rem!important;overflow:hidden}
.bk-wrap{position:relative;min-height:520px;display:flex;flex-direction:column;gap:.6rem}
.bk-hud{display:flex;flex-wrap:wrap;gap:.4rem;align-items:center;padding-right:3rem;min-height:40px}
.bk-pill{display:inline-flex;align-items:center;gap:.3rem;padding:.25rem .75rem;border-radius:999px;background:rgba(6,22,51,.6);border:1.5px solid rgba(243,229,171,.35);color:var(--bk-champ);font-weight:bold;font-size:1rem;line-height:1.4}
.bk-pill:empty{display:none}.bk-pill.bk-gold{color:#1a1200;background:linear-gradient(180deg,#FFD54F,#F5B800);border-color:#FFE7A0}
.bk-pill.bk-low{color:#1a1200;background:var(--bk-champ)}
.bk-fs{position:absolute;top:.5rem;right:.5rem;z-index:22;width:44px;height:44px;border-radius:12px;border:1.5px solid rgba(255,199,44,.6);background:rgba(6,22,51,.7);color:var(--bk-gold);font-size:1.35rem;line-height:1;cursor:pointer}
.bk-fs:hover,.bk-fs:focus-visible{background:#13315c;outline:3px solid var(--bk-gold2);outline-offset:2px}
.bk-say{min-height:1.6em;margin:0;text-align:center;font-size:1.15rem;font-weight:bold;color:var(--bk-champ)}
.bk-panel{position:absolute;inset:0;z-index:15;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.6rem;text-align:center;padding:1.2rem;background:radial-gradient(90% 70% at 50% 40%,rgba(20,51,107,.97),rgba(6,22,51,.98));border-radius:12px}
.bk-panel[hidden]{display:none}
.bk-kicker{margin:0;letter-spacing:.18em;text-transform:uppercase;font-size:.85rem;color:var(--bk-champ)}
.bk-title{margin:0;font-family:Georgia,'Times New Roman',serif;font-size:clamp(2rem,7vw,3rem);font-weight:bold;color:var(--bk-gold);text-shadow:0 2px 0 #3a2a00,0 0 24px rgba(255,199,44,.35)}
.bk-sub{margin:0;font-size:1.15rem;max-width:30ch;color:var(--bk-ink)}.bk-tip{margin:0;color:var(--bk-champ);font-size:1rem}
.bk-modes{display:flex;flex-direction:column;gap:.6rem;width:min(100%,340px)}
.pg-brain .btn.alt2{background:rgba(6,22,51,.6);color:var(--bk-gold);border-color:var(--bk-gold)}
.pg-brain .btn.big{font-size:1.25rem;min-height:60px}
.bk-note{margin:.8rem 0;padding:.6rem .9rem;border-left:4px solid var(--gold,#FFC72C);background:rgba(11,37,69,.08);font-size:1rem}
.bk-progress h2{margin-top:0}.bk-sum{margin:.2rem 0 .6rem}
.bk-chart{display:block;width:100%;max-width:640px;height:auto;background:#0B2545;border-radius:12px;border:1.5px solid rgba(255,199,44,.45)}
.bk-grid{stroke:rgba(243,229,171,.16);stroke-width:1}.bk-ax{fill:#cdd9ee;font-size:13px;font-family:inherit}.bk-val{fill:#F3E5AB;font-size:12px;font-weight:bold}
.bk-bar{fill:#C99A10}.bk-bar.bk-today{fill:#FFD54F}
.bk-report{margin:.6rem 0;padding:.8rem;border-radius:14px;background:linear-gradient(160deg,#0B2545,#13315c);color:var(--bk-ink,#F7F1DC);border:2px solid #FFC72C}
.bk-report p{margin:.2rem 0}.bk-rtop{display:flex;gap:1rem;align-items:center;flex-wrap:wrap}
.bk-score{display:flex;flex-direction:column;align-items:center;justify-content:center;min-width:130px;padding:.5rem 1rem;border-radius:14px;background:linear-gradient(180deg,#FFD54F,#F5B800);color:#1a1200}
.bk-score b{font-size:2.6rem;line-height:1.05}.bk-score small{font-weight:bold}
.bk-side{flex:1 1 220px}.bk-best{font-weight:bold;color:#FFD54F;font-size:1.15rem}.bk-fb{color:#F3E5AB}.bk-ch{margin-top:.6rem!important;font-weight:bold;color:#F3E5AB}
.bk-check{display:inline-flex;align-items:center;gap:.4rem}.bk-check input{width:26px;height:26px}
.bk-more a{font-weight:bold}
/* ---------- Golden Matrix ---------- */
.mx-board{display:flex;gap:1rem;align-items:center;justify-content:center;flex:1;flex-wrap:wrap}
.mx-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;width:min(100%,400px);padding:8px;border-radius:16px;background:linear-gradient(145deg,#C99A10,#FFD54F 50%,#B8860B);box-shadow:0 10px 30px rgba(0,0,0,.4)}
.mx-cell{aspect-ratio:1;border-radius:10px;background:radial-gradient(circle at 50% 35%,#1b3d78,#0B2545 70%);display:flex;align-items:center;justify-content:center}
.mx-svg{width:92%;height:92%;display:block}
.mx-missing{background:repeating-linear-gradient(45deg,#0d2a57 0 10px,#0B2545 10px 20px);border:3px dashed var(--bk-gold2)}
.mx-q{font-size:3rem;font-weight:bold;color:var(--bk-gold);animation:mxq 1.6s ease-in-out infinite}
@keyframes mxq{50%{transform:scale(1.15);opacity:.75}}
.mx-filled{border:3px solid #3DDC97;animation:mxin .4s ease}
@keyframes mxin{from{transform:scale(.6);opacity:0}}
.mx-side{width:min(100%,400px)}.mx-ask{margin:0 0 .5rem;text-align:center;font-weight:bold;color:var(--bk-champ);font-size:1.1rem}
.mx-opts{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.mx-opt{position:relative;aspect-ratio:1;min-height:72px;border-radius:12px;border:2.5px solid rgba(243,229,171,.4);background:radial-gradient(circle at 50% 35%,#1b3d78,#0B2545 70%);cursor:pointer;padding:4px;transition:transform .12s,border-color .12s}
.mx-opt:hover,.mx-opt:focus-visible{border-color:var(--bk-gold);transform:translateY(-2px);outline:none;box-shadow:0 0 0 3px rgba(255,213,79,.5)}
.mx-n{position:absolute;top:3px;left:6px;font-size:.85rem;font-weight:bold;color:var(--bk-champ);opacity:.8}
.mx-reveal .mx-opt{opacity:.45}.mx-reveal .mx-opt.mx-right{opacity:1;border-color:#3DDC97;box-shadow:0 0 0 4px rgba(61,220,151,.45)}.mx-reveal .mx-opt.mx-wrong{opacity:.8;border-color:#F3E5AB;border-style:dashed}
@media(min-width:860px){.mx-wrap .mx-board{flex-wrap:nowrap}}
/* ---------- Starlight Recall ---------- */
.rc-tiles{display:none;grid-template-columns:repeat(2,1fr);gap:12px;width:min(100%,460px);margin:0 auto;flex:1;align-content:center}
.rc-tiles.rc-t6{grid-template-columns:repeat(3,1fr)}.rc-tiles.rc-t9{grid-template-columns:repeat(3,1fr);width:min(100%,420px)}
.rc-wrap[data-mode=seq] .rc-tiles,.rc-wrap[data-mode=menu] .rc-tiles{display:grid}
.rc-tile{aspect-ratio:1;min-height:80px;border-radius:22px;cursor:pointer;border:3px solid color-mix(in srgb,var(--c) 70%,#000);background:radial-gradient(circle at 50% 40%,color-mix(in srgb,var(--c) 38%,#0B2545),#0a1d40 80%);display:flex;align-items:center;justify-content:center;transition:transform .1s,filter .1s,box-shadow .15s}
.rc-star{font-size:clamp(2rem,9vw,3.4rem);color:color-mix(in srgb,var(--c) 60%,#0B2545);transition:color .1s}
.rc-tile.rc-on{background:radial-gradient(circle at 50% 40%,#fff6cf,var(--c) 55%);box-shadow:0 0 36px var(--c),0 0 0 4px var(--c);transform:scale(1.04)}
.rc-tile.rc-on .rc-star{color:#0B2545}
.rc-wrap[data-turn=watch] .rc-tile{cursor:default}
.rc-span{display:none;flex-direction:column;align-items:center;gap:.6rem;flex:1;justify-content:center}
.rc-wrap[data-mode=span] .rc-span{display:flex}
.rc-disp{min-height:1.2em;font-size:clamp(4rem,20vw,7rem);font-weight:bold;color:var(--bk-gold);text-shadow:0 0 30px rgba(255,199,44,.5);line-height:1.1}
.rc-disp.rc-pop{animation:rcpop .35s ease}.rc-disp.rc-show{font-size:clamp(1.6rem,7vw,2.4rem);color:#3DDC97}
@keyframes rcpop{from{transform:scale(.5);opacity:0}}
.rc-slots{display:flex;flex-wrap:wrap;gap:6px;justify-content:center;min-height:56px}
.rc-slot{width:44px;height:56px;border-radius:10px;border:2px solid rgba(243,229,171,.45);background:rgba(6,22,51,.6);display:flex;align-items:center;justify-content:center;font-size:1.8rem;font-weight:bold;color:var(--bk-ink)}
.rc-slot.rc-full{border-color:var(--bk-gold);color:var(--bk-gold)}
.rc-pad{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;width:min(100%,340px)}
.rc-wrap[data-turn=watch] .rc-pad{opacity:.4;pointer-events:none}
.rc-key{min-height:62px;border-radius:14px;border:2px solid rgba(255,199,44,.55);background:linear-gradient(180deg,#1b3d78,#0f2a59);color:var(--bk-ink);font-size:1.7rem;font-weight:bold;cursor:pointer}
.rc-key:active{transform:scale(.96)}.rc-key.rc-ok{background:linear-gradient(180deg,#FFD54F,#F5B800);color:#1a1200;font-size:1.3rem}.rc-key.rc-del{color:var(--bk-champ)}
.rc-shake{animation:rcsh .4s}@keyframes rcsh{25%{transform:translateX(-6px)}75%{transform:translateX(6px)}}
.rc-lives{letter-spacing:.1em;color:var(--bk-gold2)}
/* ---------- Quick Wit Sixty ---------- */
.qw-track{height:10px;border-radius:999px;background:rgba(6,22,51,.7);overflow:hidden;border:1px solid rgba(243,229,171,.3)}
.qw-bar{display:block;height:100%;background:linear-gradient(90deg,#B8860B,#FFD54F);transform-origin:left center}
.qw-kind{margin:.2rem 0 0;text-align:center;letter-spacing:.14em;text-transform:uppercase;font-size:.95rem;color:var(--bk-champ)}
.qw-prompt{margin:0;text-align:center;font-size:clamp(1.2rem,4.5vw,1.5rem);font-weight:bold;color:var(--bk-ink)}
.qw-show{min-height:110px;display:flex;align-items:center;justify-content:center}
.qw-show.qw-odd,.qw-show.qw-big{min-height:10px}
.qw-word{font-size:clamp(3rem,14vw,5rem);font-weight:900;letter-spacing:.04em;padding:.1rem 1.2rem;border-radius:16px;background:rgba(6,22,51,.75)}
.qw-eq{font-size:clamp(2.6rem,11vw,4.2rem);font-weight:bold;color:var(--bk-gold)}
.qw-ans{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;width:min(100%,560px);margin:0 auto}
.qw-ans.qw-n6{grid-template-columns:repeat(3,1fr)}
.qw-btn{min-height:76px;border-radius:16px;border:2.5px solid rgba(255,199,44,.6);background:linear-gradient(180deg,#1b3d78,#0f2a59);color:var(--bk-ink);font-size:1.5rem;font-weight:bold;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:.5rem;padding:.4rem}
.qw-btn.qw-big{min-height:110px;font-size:clamp(2.2rem,9vw,3.2rem)}
.qw-btn:hover,.qw-btn:focus-visible{border-color:var(--bk-gold2);outline:none;box-shadow:0 0 0 3px rgba(255,213,79,.45)}
.qw-sw{display:inline-block;width:26px;height:26px;border-radius:50%;border:2px solid #061633}
.qw-btn.qw-right{border-color:#3DDC97;box-shadow:0 0 0 4px rgba(61,220,151,.5)}.qw-btn.qw-wrong{opacity:.55;border-style:dashed}
/* ---------- phones ---------- */
@media(max-width:600px){.bk-wrap{min-height:480px}.mx-board{gap:.5rem}.mx-grid{width:min(100%,330px)}.mx-opt{min-height:64px}.rc-key{min-height:56px}.qw-btn{min-height:68px}}
@media(orientation:landscape) and (max-height:560px){.bk-wrap{min-height:300px}.mx-board{flex-wrap:nowrap}.mx-grid{width:min(44vw,300px)}.mx-side{width:min(48vw,330px)}.rc-tiles{width:min(70vh,380px)}.qw-show{min-height:70px}}
/* ---------- full screen: game fills the screen, page chrome hidden (CSS fallback for iPhone Safari too) ---------- */
html.g-immersive-on.bk-full header.site,html.g-immersive-on.bk-full footer.site,html.g-immersive-on .pg-brain header.site,html.g-immersive-on .pg-brain footer.site{display:none!important}
.pg-brain .g-play.is-full{position:fixed;inset:0;z-index:200;overflow:auto;background:#061633;padding:.4rem;display:flex;flex-direction:column}
.pg-brain .g-play.is-full .bk-stage{flex:1 1 auto;border-radius:12px}
.pg-brain .g-play.is-full .bk-wrap{min-height:calc(100dvh - 120px)}
.pg-brain .g-play.is-full .g-bar{background:rgba(6,22,51,.85);color:#F3E5AB;border-color:rgba(255,199,44,.4)}
@media(prefers-reduced-motion:reduce){.mx-q,.rc-disp.rc-pop,.mx-filled,.rc-shake{animation:none}}
/* ---------- premium polish: drifting gold dust, shimmering titles, staggered tile entrances ---------- */
.bk-stage{isolation:isolate}
.bk-stage::before{content:"";position:absolute;inset:-40px;z-index:-1;pointer-events:none;opacity:.55;
  background-image:radial-gradient(1.5px 1.5px at 12% 18%,#FFE7A0 50%,transparent 51%),radial-gradient(1px 1px at 72% 12%,#F3E5AB 50%,transparent 51%),radial-gradient(2px 2px at 86% 64%,#FFD54F 50%,transparent 51%),radial-gradient(1px 1px at 30% 80%,#F3E5AB 50%,transparent 51%),radial-gradient(1.5px 1.5px at 55% 42%,#FFE7A0 50%,transparent 51%),radial-gradient(1px 1px at 8% 60%,#FFD54F 50%,transparent 51%);
  background-size:260px 260px;animation:bkdust 60s linear infinite}
.bk-stage::after{content:"";position:absolute;left:50%;top:-30%;width:120%;height:60%;transform:translateX(-50%);z-index:-1;pointer-events:none;background:radial-gradient(closest-side,rgba(255,199,44,.16),transparent);animation:bkglow 7s ease-in-out infinite alternate}
@keyframes bkdust{to{background-position:260px -260px}}
@keyframes bkglow{from{opacity:.5}to{opacity:1}}
.bk-title{background:linear-gradient(100deg,#B8860B 0%,#FFD54F 30%,#FFF6CF 45%,#FFD54F 60%,#C99A10 100%);background-size:220% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;text-shadow:none;filter:drop-shadow(0 2px 0 #2a1e00) drop-shadow(0 0 18px rgba(255,199,44,.35));animation:bkshine 5s ease-in-out infinite}
@keyframes bkshine{0%,100%{background-position:100% 0}50%{background-position:0 0}}
.bk-panel{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}
.bk-panel .btn.big{box-shadow:0 0 0 0 rgba(255,199,44,.6);animation:bkpulse 2.4s ease-out infinite}
@keyframes bkpulse{0%{box-shadow:0 0 0 0 rgba(255,199,44,.55)}70%{box-shadow:0 0 0 16px rgba(255,199,44,0)}100%{box-shadow:0 0 0 0 rgba(255,199,44,0)}}
.bk-panel .bk-modes .btn.big{animation:none}
.mx-cell,.mx-opt{animation:bkin .38s cubic-bezier(.2,.9,.3,1.2) both}
.mx-cell:nth-child(2),.mx-opt:nth-child(2){animation-delay:.03s}.mx-cell:nth-child(3),.mx-opt:nth-child(3){animation-delay:.06s}.mx-cell:nth-child(4),.mx-opt:nth-child(4){animation-delay:.09s}.mx-cell:nth-child(5),.mx-opt:nth-child(5){animation-delay:.12s}.mx-cell:nth-child(6),.mx-opt:nth-child(6){animation-delay:.15s}.mx-cell:nth-child(7){animation-delay:.18s}.mx-cell:nth-child(8){animation-delay:.21s}.mx-cell:nth-child(9){animation-delay:.24s}
.qw-btn{animation:bkin .28s cubic-bezier(.2,.9,.3,1.2) both}.qw-word,.qw-eq{animation:bkin .3s ease both}
@keyframes bkin{from{opacity:0;transform:translateY(8px) scale(.94)}}
.mx-cell{box-shadow:inset 0 1px 0 rgba(255,231,160,.18),inset 0 -8px 16px rgba(0,0,0,.25)}
.mx-opt,.qw-btn,.rc-key{box-shadow:inset 0 1px 0 rgba(255,231,160,.2),0 4px 12px rgba(0,0,0,.3)}
.mx-reveal .mx-opt{animation:none}
@media(max-width:600px){.bk-pill{font-size:.85rem;padding:.15rem .6rem}.bk-hud{min-height:34px}}
@media(prefers-reduced-motion:reduce){.bk-stage::before,.bk-stage::after,.bk-title,.bk-panel .btn.big,.mx-cell,.mx-opt,.qw-btn,.qw-word,.qw-eq{animation:none}}
@media (max-width:700px) and (orientation:portrait){html .pg-brain .g-play.is-full .g-bar{display:flex!important;flex-direction:row!important;flex-wrap:wrap!important;justify-content:center;align-items:center}html .pg-brain .g-play.is-full .g-bar .g-stats{display:flex!important;flex-wrap:wrap!important;justify-content:center;gap:.35rem!important;width:100%;overflow:visible}html .pg-brain .g-play.is-full .g-bar .g-stats>span{flex:0 0 auto;white-space:nowrap}html .pg-brain .g-play.is-full .g-bar .g-stats{flex:0 0 100%!important}html .pg-brain .g-play.is-full .g-bar>:not(.g-stats){flex:0 0 auto!important;width:auto!important;max-width:9rem;min-width:52px}html .pg-brain .g-play.is-full .g-bar>.btns{max-width:none;margin:0!important}}
