:root{--navy:#0d2b59;--blue:#4f9ed8;--gold:#e4b94e;--cream:#fffaf0;--paper:#fffdf7;--ink:#18365d;--muted:#66788d;--line:#d9cfae;--shadow:0 18px 48px rgba(69,83,99,.14)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;min-height:100vh;font-family:system-ui,-apple-system,"Segoe UI",sans-serif;color:var(--ink);background:linear-gradient(180deg,#eaf8ff 0%,#fffaf0 52%,#f3e7c5 100%)}
button,a{font:inherit}.header{position:sticky;top:0;z-index:20;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:12px;padding:9px clamp(12px,3vw,38px);background:rgba(255,255,255,.94);border-bottom:1px solid #dceaf2;backdrop-filter:blur(14px)}.brand img{display:block;width:120px;max-width:27vw;height:auto}.nav{display:flex;gap:2px;overflow-x:auto;white-space:nowrap;scrollbar-width:none}.nav::-webkit-scrollbar{display:none}.nav a{padding:8px 9px;border-radius:999px;text-decoration:none;color:var(--ink);font-size:.7rem;font-weight:800}.nav a:hover,.nav a:focus-visible,.nav a.active{background:#fff0b5;color:#745000}.badge{background:#ffe18a;padding:7px 10px;border-radius:12px;font-weight:900;font-size:.7rem;color:#644900}
.hero{text-align:center;padding:20px 16px 10px}.eyebrow{display:inline-block;padding:7px 12px;border-radius:999px;background:#fff3c7;border:1px solid #f2d67f;font-size:.72rem;font-weight:1000;letter-spacing:.06em;color:#775100}.hero h1{margin:7px 0 4px;font-size:clamp(1.8rem,5vw,3rem);line-height:1;color:var(--navy)}.hero p{max-width:760px;margin:0 auto;color:#506b89;font-weight:700;line-height:1.35;font-size:.86rem}.wrap{width:min(1180px,calc(100% - 20px));margin:0 auto;padding:6px 0 24px}
.kids-switcher{width:min(880px,calc(100% - 24px));margin:0 auto 14px;display:flex;justify-content:center;gap:8px;flex-wrap:wrap}.kids-switcher a{padding:9px 13px;border-radius:999px;text-decoration:none;background:white;border:1px solid #d9e6ec;color:#315b83;font-size:.76rem;font-weight:900;box-shadow:0 5px 14px rgba(70,92,111,.07)}.kids-switcher a.active{background:#fff0b5;border-color:#e7c55f;color:#735000}
.game-shell{background:linear-gradient(180deg,rgba(255,255,255,.98),rgba(255,250,236,.98));border:1px solid var(--line);border-radius:24px;box-shadow:var(--shadow);padding:12px}.topbar{display:grid;grid-template-columns:auto 1fr auto;gap:10px;align-items:center;margin-bottom:8px}.top-left{display:flex;flex-direction:column;gap:6px;align-items:flex-start}.modes{display:flex;gap:8px;flex-wrap:wrap}.mode,.new-game,.action-btn{border:1px solid #cfdce6;background:white;color:#315b83;border-radius:13px;padding:10px 13px;cursor:pointer;font-weight:900;font-size:.8rem}.mode.active{background:#eaf7ff;border-color:#6cb5df;box-shadow:0 0 0 2px rgba(108,181,223,.14)}.new-game{background:#fff3c8;border-color:#eac764;color:#795400}.action-btn{background:#f5f9fc}.subnote{font-size:.69rem;font-weight:900;color:#6b8098;letter-spacing:.04em;text-transform:uppercase}.top-actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}
.stats{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px}.stat{background:#f4f7f9;border:1px solid #dce5ea;border-radius:13px;padding:8px 11px;text-align:center;min-width:0}.stat strong{display:block;font-size:1rem;color:var(--navy);white-space:nowrap}.stat span{display:block;font-size:.62rem;font-weight:900;color:#718198;text-transform:uppercase;letter-spacing:.06em}
.message{text-align:center;min-height:22px;font-weight:900;color:#5b728c;margin:1px 0 7px;font-size:.82rem}.board{--cols:10;--rows:3;display:grid;gap:7px;grid-template-columns:repeat(var(--cols),minmax(0,1fr));perspective:1000px;width:min(100%,calc((100dvh - 310px) * var(--cols) / var(--rows)));margin:0 auto}.card{position:relative;aspect-ratio:1/1;border:0;padding:0;background:none;cursor:pointer;border-radius:18px;min-width:0;touch-action:manipulation}.card:focus-visible{outline:3px solid #5ba9dc;outline-offset:3px}.card-inner{position:absolute;inset:0;transition:transform .42s cubic-bezier(.2,.7,.2,1);transform-style:preserve-3d}.card.flipped .card-inner,.card.matched .card-inner{transform:rotateY(180deg)}.face{position:absolute;inset:0;border-radius:18px;display:grid;place-items:center;backface-visibility:hidden;-webkit-backface-visibility:hidden;overflow:hidden}.back{background:linear-gradient(145deg,#5ca8dd,#356fba);border:2px solid rgba(255,255,255,.82);box-shadow:0 7px 15px rgba(49,93,135,.18)}.back:before{content:"✦";position:absolute;color:rgba(255,255,255,.2);font-size:4rem}.back-mark{position:relative;color:white;font-weight:1000;font-size:clamp(.62rem,1.2vw,.8rem);letter-spacing:.06em;text-shadow:0 2px 5px rgba(0,0,0,.18)}.front{transform:rotateY(180deg);background:#eaf8ff;border:0;box-shadow:0 7px 16px rgba(112,90,48,.13);padding:0}.symbol-img{display:block;width:100%;height:100%;object-fit:cover}.card.matched .front{box-shadow:0 0 0 4px #a9cf91,0 8px 20px rgba(71,117,55,.18);animation:matchGlow .55s ease}.card.matched{cursor:default}@keyframes matchGlow{50%{transform:scale(1.055)}}
.footer{text-align:center;padding:26px 14px 36px;color:#6c7782;font-size:.75rem}
.win-overlay{position:fixed;inset:0;z-index:50;background:rgba(9,35,67,.52);display:none;place-items:center;padding:18px;backdrop-filter:blur(7px)}.win-overlay.show{display:grid}.win-card{width:min(470px,100%);background:#fffdf7;border-radius:28px;padding:28px;text-align:center;box-shadow:0 25px 80px rgba(0,0,0,.26);border:1px solid #ead9aa}.win-star{font-size:3rem}.win-card h2{margin:7px 0;color:var(--navy);font-size:1.8rem}.win-card p{color:#58708a;line-height:1.5;font-weight:700}.win-actions{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;margin-top:10px}.win-actions button{border:0;border-radius:14px;padding:12px 16px;font-weight:1000;cursor:pointer}.primary-win{background:linear-gradient(135deg,#62b6e8,#3d8aca);color:white}.secondary-win{background:#f5f8fb;color:#2e5a86;border:1px solid #d6e4ec}.best{margin-top:9px;font-size:.75rem;color:#8a6c32}
@media(max-width:960px){.topbar{grid-template-columns:1fr}.top-left,.top-actions{justify-content:center;align-items:center}.top-actions{justify-content:center}}
@media(max-width:800px){.header{grid-template-columns:auto auto}.nav{grid-column:1/-1;grid-row:2}.badge{justify-self:end}.board{--cols:6;--rows:5;width:min(100%,calc((100dvh - 360px) * 6 / 5))}.stats{grid-template-columns:repeat(5,minmax(0,1fr))}}
@media(max-width:520px){.header{padding:6px 8px;gap:7px}.brand img{width:92px}.nav a{padding:6px 7px;font-size:.64rem}.kids-switcher{margin:7px auto 4px;gap:5px}.kids-switcher a{padding:6px 8px;font-size:.66rem}.wrap{width:min(100% - 10px,1180px);padding-top:2px}.game-shell{padding:7px;border-radius:17px}.hero{padding:8px 8px 4px}.hero .eyebrow{display:none}.hero h1{font-size:1.45rem;margin:2px 0}.hero p{font-size:.66rem;line-height:1.2;max-width:96%}.board{--cols:6;--rows:5;gap:4px;width:min(100%,calc((100dvh - 335px) * 6 / 5))}.card,.face{border-radius:9px}.topbar{align-items:center;margin-bottom:4px;gap:6px}.modes,.top-actions{width:100%;justify-content:center}.mode,.new-game,.action-btn{padding:7px 8px;font-size:.66rem}.subnote{font-size:.56rem}.stats{display:grid;grid-template-columns:repeat(5,1fr);gap:4px}.stat{min-width:0;padding:4px 3px;border-radius:9px}.stat strong{font-size:.75rem}.stat span{font-size:.46rem}.message{font-size:.68rem;min-height:17px;margin-bottom:4px}.footer{font-size:.62rem;padding:8px 6px}.win-card{padding:20px}.win-actions button{padding:10px 12px;font-size:.78rem}}
@media(orientation:landscape) and (max-height:560px){.header{position:static;padding:4px 7px;min-height:42px;grid-template-columns:auto minmax(0,1fr)}.brand img{width:78px}.nav{grid-column:2;grid-row:1}.nav a{padding:4px 6px;font-size:.6rem}.badge{display:none}.kids-switcher{margin:4px auto 2px}.kids-switcher a{padding:4px 7px;font-size:.61rem}.hero{padding:3px 8px 2px}.hero .eyebrow,.hero p{display:none}.hero h1{font-size:1.1rem;margin:0}.wrap{padding:0 0 5px}.game-shell{padding:5px 7px}.topbar{margin-bottom:2px;gap:4px;grid-template-columns:auto 1fr auto}.top-left{gap:3px}.modes{gap:4px}.mode,.new-game,.action-btn{padding:5px 8px;font-size:.62rem}.subnote{font-size:.5rem}.stats{gap:4px}.stat{padding:3px 5px;min-width:60px}.stat strong{font-size:.7rem}.stat span{font-size:.43rem}.message{margin-bottom:2px;font-size:.62rem;min-height:14px}.board{--cols:10;--rows:3;gap:3px;width:min(100%,calc((100dvh - 185px) * 10 / 3))}.card,.face{border-radius:8px}.footer{display:none}.win-card{padding:18px}}

/* V34 — clearer two-player turns + viewport-fit game board */
html body.book-heaven[data-page="matching-game"] .celestial-page-panel{
  width:min(96vw,1600px)!important;
  max-width:1600px!important;
}
html body.book-heaven[data-page="matching-game"] .wrap{
  width:min(100%,1540px)!important;
  padding-bottom:10px;
}
html body.book-heaven[data-page="matching-game"] .game-shell{
  width:100%!important;
}
.turn-banner{
  display:none;
  grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);
  gap:10px;
  align-items:stretch;
  margin:2px auto 8px;
  width:min(100%,980px);
}
.turn-banner.show{display:grid}
.player-turn{
  position:relative;
  min-width:0;
  border-radius:17px;
  border:2px solid rgba(128,152,177,.22);
  background:rgba(248,251,255,.9);
  padding:9px 13px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  opacity:.55;
  transform:scale(.985);
  transition:transform .2s ease,opacity .2s ease,box-shadow .2s ease,border-color .2s ease,background .2s ease;
}
.player-turn .player-name{font-weight:1000;font-size:.9rem;color:#395b7a;white-space:nowrap}
.player-turn .turn-state{font-size:.62rem;font-weight:1000;letter-spacing:.08em;text-transform:uppercase;color:#71869c;white-space:nowrap}
.player-turn .player-score{font-weight:1000;font-size:.82rem;color:#365c7e;white-space:nowrap}
.player-turn.active{opacity:1;transform:scale(1.025);z-index:1;animation:turnPulse .38s ease-out}
@keyframes turnPulse{0%{transform:scale(.985)}55%{transform:scale(1.045)}100%{transform:scale(1.025)}}
@media(prefers-reduced-motion:reduce){.player-turn.active{animation:none}}
.player-turn[data-player="1"].active{
  border-color:#56b7ed;
  background:linear-gradient(135deg,rgba(220,245,255,.98),rgba(242,251,255,.94));
  box-shadow:0 0 0 4px rgba(86,183,237,.14),0 10px 25px rgba(44,127,181,.17);
}
.player-turn[data-player="2"].active{
  border-color:#c796ff;
  background:linear-gradient(135deg,rgba(246,232,255,.98),rgba(255,246,218,.94));
  box-shadow:0 0 0 4px rgba(199,150,255,.14),0 10px 25px rgba(128,83,175,.17);
}
.player-turn.active .turn-state::before{content:"▶ ";font-size:.7rem}
.turn-vs{display:grid;place-items:center;font-size:.66rem;font-weight:1000;color:#71869c;letter-spacing:.08em;text-transform:uppercase;padding:0 2px}
.board{
  max-width:none;
  max-height:none;
  align-content:center;
  justify-content:center;
}
@media(max-width:700px){
  .turn-banner{gap:6px;margin-bottom:6px}
  .player-turn{padding:7px 8px;border-radius:12px;display:grid;grid-template-columns:1fr auto;gap:2px 7px}
  .player-turn .player-name{font-size:.72rem}.player-turn .turn-state{font-size:.48rem}.player-turn .player-score{font-size:.66rem}
  .turn-vs{font-size:.5rem}
}
@media(orientation:landscape) and (max-height:560px){
  html body.book-heaven[data-page="matching-game"] .celestial-page-panel{width:calc(100% - 12px)!important;max-width:none!important;padding:5px 7px!important;margin:4px auto!important}
  .turn-banner{margin:0 auto 3px;width:min(100%,860px);gap:5px}
  .player-turn{padding:4px 8px;border-radius:10px}
  .player-turn .player-name{font-size:.65rem}.player-turn .turn-state{font-size:.44rem}.player-turn .player-score{font-size:.6rem}
}

html,body{width:100%!important;max-width:100%!important;overflow-x:hidden!important;overscroll-behavior-x:none!important}
body.v89-kids-area{
  background:linear-gradient(180deg,rgba(249,253,255,.70),rgba(255,252,244,.62) 48%,rgba(249,253,255,.66)),
  url("theme-backgrounds/bright-gateway-world.webp") center top/cover no-repeat fixed,#f6fbff!important;
  color:#203f68!important
}
.v89-page-shell,.v89-kids-shell{
  width:min(1100px,calc(100% - 18px))!important;max-width:calc(100vw - 18px)!important;min-width:0!important;
  margin:0 auto!important;padding:8px 0 28px!important;background:transparent!important;border:0!important;
  box-shadow:none!important;overflow-x:hidden!important
}
.v89-kids-shell *,.v89-page-shell *{min-width:0}
.v89-kids-area h1,.v89-kids-area h2,.v89-kids-area h3{color:#12376c}
.v89-kids-area p{color:#49647f}
.v89-kids-area img,.v89-kids-area canvas,.v89-kids-area svg{max-width:100%}
.v89-kids-area button{box-shadow:none}
@media(max-width:700px){
  body.v89-kids-area{background-attachment:scroll!important}
  .v89-kids-shell,.v89-page-shell{width:calc(100% - 10px)!important}
}
@media (orientation:portrait),(orientation:landscape){
  .v89-core-footer{display:block!important;visibility:visible!important;opacity:1!important}
}
.hero{text-align:center!important}.hero h1{font-family:Georgia,serif!important;color:#12376c!important}
.mode-card,.stats,.game-panel,.board-shell{background:transparent!important;border:0!important;box-shadow:none!important}
.board-shell,.game-panel{border-top:1px solid rgba(151,104,24,.16)!important}#board{max-width:100%!important;margin:auto!important}
.win-overlay{max-width:100vw!important;overflow-x:hidden!important}