/* Memory Match only: the shared game/site styles remain unchanged. */
.memory-page { --scene:#e9eedf; --scene-accent:#c6d8b9; --scene-sky:#f4f5e9; }
.memory-page[data-theme="pond"] { --scene:#dfedf0; --scene-accent:#b5d4d3; --scene-sky:#eff7fa; }
.memory-page[data-theme="twilight"] { --scene:#e9e3ef; --scene-accent:#cec0dc; --scene-sky:#f6f1f7; }
.memory-page .hero { padding:34px 0 24px; }
.memory-page .hero h1 { font-size:clamp(40px,4.5vw,64px); }
.memory-page .hero-art { height:270px; }
.memory-page .mode-choices { display:grid;grid-template-columns:repeat(3,1fr);gap:14px;border:0;padding:0;margin:0; }
.memory-page .mode-choice { position:relative;display:grid;grid-template-columns:54px 1fr;grid-template-rows:auto auto;column-gap:13px;align-items:center;padding:20px;border:1px solid var(--line);border-radius:16px;background:#fffdf8;cursor:pointer; }
.memory-page .mode-choice:has(input:checked) { border-color:var(--green);box-shadow:inset 0 0 0 1px var(--green);background:#edf2e7; }
.memory-page .mode-choice:has(input:focus-visible) { outline:3px solid #ae432b;outline-offset:4px; }
.memory-page .mode-choice input { position:absolute;right:13px;top:13px;accent-color:var(--green); }
.memory-page .mode-choice>span,.memory-page .mode-choice>img { grid-row:1/3;grid-column:1;width:54px;font-size:25px;color:var(--coral);object-fit:contain; }
.memory-page .mode-choice strong { padding-right:12px;font-size:16px; }
.memory-page .mode-choice small { color:var(--muted);font-size:11px;line-height:1.5;margin-top:5px; }
.memory-page .mode-description { font-size:13px;color:var(--muted);margin:14px 0 30px; }
.memory-page .opponent-settings { display:flex;align-items:center;gap:18px;flex-wrap:wrap;margin-top:15px;padding:15px 20px;border-radius:12px;background:var(--scene);font-size:13px; }
.memory-page .opponent-settings label { font-weight:700; }
.memory-page .opponent-settings select { padding:10px 35px 10px 14px;border:1px solid #b4c5b4;border-radius:8px;color:var(--ink);background:#fffdf8; }
.memory-page .opponent-settings p { flex:1;min-width:200px; }
.memory-page .check small { display:block;font-size:10px;color:var(--muted); }
.memory-page .check:has(input:disabled) { opacity:.6; }
.memory-page .level { min-height:160px; }
.memory-page .settings { margin-bottom:25px; }
/* During a round, reserve the screen for the cards and essential controls. */
.memory-page.playing .masthead { height:52px;padding:7px 22px;justify-content:flex-start;gap:12px;flex-wrap:nowrap; }
.memory-page.playing .masthead .brand { font-size:14px; }
.memory-page.playing .masthead .brand-flower { font-size:27px; }
.memory-page.playing .masthead .brand small,.memory-page.playing .site-nav { display:none; }
.memory-page.playing>aside,.memory-page.playing>.site-footer { display:none; }
.memory-page.playing main { max-width:1400px;padding:0 20px;margin:0 auto; }
.memory-page #play { height:calc(100vh - 52px);height:calc(100svh - 52px);min-height:260px;display:flex;flex-direction:column;padding:12px 0 8px;gap:0; }
.memory-page .round-heading { gap:12px;flex-shrink:0; }
.memory-page .round-heading h1 { font-size:27px;line-height:1.1; }
.memory-page .round-heading .eyebrow { font-size:9px;margin-bottom:4px; }
.memory-page .play-tools { display:flex;align-items:center;gap:5px; }
.memory-page .play-tools button,.memory-page .round-actions button { font-size:12px;min-height:44px;padding:8px 12px; }
.memory-page .round-bar { margin:9px 0 0;padding:5px 0;flex-direction:row;align-items:center;gap:10px;flex-shrink:0; }
.memory-page .round-actions { width:auto;gap:3px; }
.memory-page .stats { gap:20px; }
.memory-page .stats>span { font-size:11px; }
.memory-page .stats strong { font-size:16px; }
.memory-page .scoreboard { display:flex;align-items:center;justify-content:center;gap:16px;margin-top:7px;flex-shrink:0; }
.memory-page .player-score { display:flex;align-items:center;gap:9px;border:1px solid transparent;border-radius:30px;padding:6px 17px;font-size:13px;color:var(--muted); }
.memory-page .player-score strong { font-size:20px;line-height:1; }
.memory-page .player-score small { font-size:10px; }
.memory-page .active-player { background:var(--green);color:white;border-color:var(--green); }
.memory-page .score-separator { color:var(--coral);font-size:15px; }
.memory-page .turn-line { display:flex;justify-content:center;gap:12px;align-items:center;min-height:29px;padding:5px 0 0;font-size:13px;flex-shrink:0; }
.memory-page .turn-line>span { font-size:10px;color:var(--muted); }
.memory-page .thinking::after { content:' · · ·';display:inline-block;animation:thinking 1.8s ease-in-out infinite; }
.memory-page .board-message { min-height:38px;padding:4px 0 7px;gap:12px;flex-direction:row;flex-shrink:0; }
.memory-page .board-message p { font-size:12px;line-height:1.4;max-width:650px; }
.memory-page .board-message button { min-height:44px;font-size:12px;padding:8px 14px; }
.memory-page .board-room { position:relative;isolation:isolate;display:grid;place-items:center;flex:1;min-height:0;overflow:hidden;border-radius:20px;border:1px solid #c5d0be;background:radial-gradient(ellipse at 3% 115%,var(--scene-accent) 0 29%,transparent 29.3%),radial-gradient(ellipse at 97% 140%,var(--scene-accent) 0 37%,transparent 37.3%),linear-gradient(175deg,var(--scene-sky),var(--scene)); }
.memory-page .board-room::before { content:'✧';position:absolute;left:4%;top:7%;color:var(--green);opacity:.12;font:56px Georgia;z-index:-1; }
.memory-page .board-room::after { content:'✳';position:absolute;right:4%;bottom:6%;color:var(--green);opacity:.1;font:82px Georgia;z-index:-1; }
.memory-page .board-room.needs-scroll { overflow:auto;place-items:start center; }
.memory-page .board { --card-size:90px;--board-gap:10px;max-width:none;grid-template-columns:repeat(var(--columns),var(--card-size));grid-auto-rows:var(--card-size);gap:var(--board-gap);width:max-content;margin:12px; }
.memory-page .card { width:var(--card-size);height:var(--card-size);aspect-ratio:1;padding:0;border:0;border-radius:12px;overflow:visible;background:none;box-shadow:none;perspective:700px; }
.memory-page .card:not([aria-disabled="true"]):hover { transform:translateY(-2px);background:none; }
.memory-page .card-inner { display:block;position:absolute;inset:0;transform-style:preserve-3d;transition:transform .32s cubic-bezier(.2,.7,.3,1); }
.memory-page .card.revealed .card-inner { transform:rotateY(180deg); }
.memory-page .card .card-back,.memory-page .card .card-front { position:absolute;inset:0;display:flex;align-items:center;justify-content:center;backface-visibility:hidden;-webkit-backface-visibility:hidden;border-radius:12px;border:1px solid #a6bd9e;box-shadow:0 3px 0 #8da685;background:#e1ebd8; }
.memory-page .card .card-back { flex-direction:column;gap:7px;background:linear-gradient(145deg,#edf3e4,#d0dfc5); }
.memory-page .card .card-back::before { content:'';position:absolute;inset:7px;border:1px solid #afc3a5;border-radius:7px; }
.memory-page .card .card-back .flower { font-size:clamp(22px,calc(var(--card-size) * .3),48px); }
.memory-page .card .card-back small { font-size:clamp(5px,calc(var(--card-size) * .06),9px);letter-spacing:.12em;display:block; }
.memory-page .card .card-front { transform:rotateY(180deg);background:#fffdf7;border-color:#c5d2bf;padding:7%; }
.memory-page .card img { visibility:visible;width:100%;height:100%;object-fit:contain; }
.memory-page .card.revealed { transform:none;background:none;box-shadow:none; }
.memory-page .card.revealed .card-back { display:flex; }
.memory-page .card.matched { border:0;background:none;box-shadow:none; }
.memory-page .card.matched .card-front { background:#f1f7e9;border:2px solid #56845c;box-shadow:0 2px 0 #8da685; }
.memory-page .card.matched img { animation:match-bloom .5s ease-out; }
.memory-page .match-check { width:18px;height:18px;line-height:18px;font-size:11px;top:4px;right:4px; }
.memory-page .card:focus-visible { outline-offset:4px;z-index:1; }
.memory-page .keyboard-help { font-size:10px;margin:7px 0 0;line-height:1.2;flex-shrink:0; }
.memory-page .pause-panel { text-align:center;padding:20px; }
.memory-page .pause-panel>span { font:45px Georgia;color:var(--coral); }
.memory-page .pause-panel h2 { font-size:30px; }
.memory-page .pause-panel p { font-size:13px;margin:10px 0 18px; }
.memory-page .completion { position:absolute;inset:auto;display:block;text-align:center;max-width:560px;width:calc(100% - 28px);max-height:calc(100% - 16px);overflow:auto;background:#fffdf7f7;backdrop-filter:blur(12px);border:1px solid #bbcdb0;box-shadow:0 10px 60px #193c3933;padding:20px 26px;border-radius:20px;margin:0;z-index:2;animation:win-arrive .45s ease-out; }
.memory-page .celebration-art { display:flex;align-items:center;justify-content:center;gap:28px;height:90px; }
.memory-page .celebration-art img { width:85px;height:85px;object-fit:contain; }
.memory-page .celebration-art span { color:var(--coral);font-size:31px;animation:match-bloom .8s ease-out; }
.memory-page .completion .eyebrow { font-size:9px;margin:9px 0; }
.memory-page .completion h2 { font-size:32px; }
.memory-page .completion p:not(.eyebrow) { font-size:13px; }
.memory-page .completion-actions { display:flex;flex-direction:row;flex-wrap:wrap;justify-content:center;gap:9px;width:auto;margin:18px 0 0; }
.memory-page .completion-actions button { padding:11px 15px; }
.memory-page #win-note { color:var(--muted);font-size:11px; }
.memory-page #tutorial-dialog { width:560px;max-width:calc(100vw - 24px);max-height:calc(100svh - 24px);padding:25px; }
.memory-page .tutorial-heading { display:flex;justify-content:space-between;align-items:center;gap:10px; }
.memory-page .tutorial-heading .eyebrow { font-size:10px;margin:0; }
.memory-page #tutorial-title { font-size:32px; }
.memory-page .tutorial-cards { display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin:25px 0 15px; }
.memory-page .demo-card { position:relative;aspect-ratio:1;border-radius:10px;border:1px solid #a5b99b;display:grid;place-items:center;background:#dfead5;transition:background .25s,transform .25s; }
.memory-page .demo-card>span { color:var(--green);font-size:33px; }
.memory-page .demo-card img { position:absolute;width:90%;height:90%;object-fit:contain;opacity:0;transform:scaleX(0);transition:transform .3s,opacity .15s; }
.memory-page .demo-revealed { background:#fffdf7; }
.memory-page .demo-revealed>span { visibility:hidden; }
.memory-page .demo-revealed img { transform:scaleX(1);opacity:1; }
.memory-page .demo-matched { box-shadow:0 0 0 2px #56845c; }
.memory-page .demo-matched::after { content:'✓';position:absolute;right:3px;top:0;color:var(--green);font-weight:750; }
.memory-page #tutorial-copy { min-height:65px;margin:12px 0;font-size:14px; }
.memory-page .tutorial-rule { font-size:12px;color:var(--muted);border-top:1px solid var(--line);padding-top:13px; }
.memory-page .tutorial-actions { display:flex;align-items:center;justify-content:space-between;gap:10px; }
.memory-page #tutorial-step { font-size:11px;color:var(--muted); }
@keyframes thinking { 50% { opacity:.35; } }
@keyframes match-bloom { 50% { transform:scale(1.06); } }
@keyframes win-arrive { from { opacity:0;transform:translateY(10px); } to { opacity:1;transform:none; } }
@media(max-width:850px) {
  .memory-page .mode-choice { grid-template-columns:1fr;padding:18px; }
  .memory-page .mode-choice>span,.memory-page .mode-choice>img { grid-row:auto;height:40px;width:40px;margin-bottom:10px; }
  .memory-page .mode-choice strong { font-size:14px; }
}
@media(max-width:600px) {
  .memory-page .hero { grid-template-columns:1fr;padding:25px 0 5px; }
  .memory-page .hero-art { display:none; }
  .memory-page .hero h1 { font-size:43px; }
  .memory-page .hero .intro { font-size:14px;margin-top:15px; }
  .memory-page .choose-heading { gap:8px;margin:22px 0 15px; }
  .memory-page .choose-heading h2 { font-size:27px; }
  .memory-page .choose-heading .text-button { padding:8px 0; }
  .memory-page .mode-choices { gap:8px; }
  .memory-page .mode-choice { padding:12px 9px;align-content:start; }
  .memory-page .mode-choice input { right:8px;top:9px;width:16px;height:16px; }
  .memory-page .mode-choice strong { padding:0;font-size:12px;line-height:1.4; }
  .memory-page .mode-choice small { font-size:10px; }
  .memory-page .mode-description { font-size:12px; }
  .memory-page .opponent-settings { padding:13px;gap:10px; }
  .memory-page .opponent-settings p { flex-basis:100%;font-size:12px; }
  .memory-page .level { min-height:140px; }
  .memory-page.playing .masthead { height:42px;padding:5px 12px; }
  .memory-page.playing .masthead .brand { font-size:12px;gap:7px; }
  .memory-page.playing .masthead .brand-flower { font-size:23px; }
  .memory-page.playing main { padding:0 10px; }
  .memory-page #play { height:calc(100svh - 42px);padding-top:8px; }
  .memory-page .round-heading { align-items:center;gap:6px; }
  .memory-page .round-heading h1 { font-size:20px; }
  .memory-page .round-heading .eyebrow { font-size:8px;letter-spacing:.1em; }
  .memory-page .play-tools { gap:0; }
  .memory-page .play-tools button,.memory-page .round-actions button { padding:7px;font-size:10px; }
  .memory-page .round-bar { margin-top:7px;gap:5px; }
  .memory-page .stats { gap:8px;flex-wrap:wrap; }
  .memory-page .stats>span { font-size:9px;white-space:nowrap; }
  .memory-page .stats strong { font-size:13px;margin-right:1px; }
  .memory-page .round-actions { flex-shrink:0; }
  .memory-page .scoreboard { margin-top:5px;gap:7px; }
  .memory-page .player-score { padding:5px 13px;gap:6px;font-size:12px; }
  .memory-page .turn-line { min-height:26px; }
  .memory-page .board-message { gap:8px;min-height:44px; }
  .memory-page .board-message p { font-size:11px; }
  .memory-page .board-message button { font-size:10px;max-width:150px; }
  .memory-page .board-room { border-radius:14px; }
  .memory-page .keyboard-help { position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%); }
  .memory-page .completion { padding:16px; }
  .memory-page .completion h2 { font-size:27px; }
  .memory-page .completion-actions { flex-direction:column;margin-top:13px; }
  .memory-page .completion-actions button { font-size:12px;min-height:44px; }
  .memory-page #tutorial-dialog { padding:20px; }
  .memory-page #tutorial-title { font-size:28px; }
}
@media(max-height:600px) and (min-width:601px) {
  .memory-page.playing .masthead { height:38px;padding:4px 20px; }
  .memory-page #play { height:calc(100svh - 38px);padding-top:5px; }
  .memory-page .round-heading h1 { font-size:21px; }
  .memory-page .round-heading .eyebrow { display:none; }
  .memory-page .round-bar { margin-top:2px;padding:0; }
  .memory-page .scoreboard { position:absolute;top:42px;left:50%;transform:translateX(-50%);margin:0;gap:8px; }
  .memory-page .player-score { font-size:11px;padding:5px 10px; }
  .memory-page .player-score strong { font-size:16px; }
  .memory-page .turn-line { min-height:24px; }
  .memory-page .board-message { min-height:29px;padding:2px 0 5px; }
  .memory-page .completion { padding:14px; }
  .memory-page .celebration-art { display:none; }
  .memory-page .completion h2 { font-size:26px; }
  .memory-page .completion-actions { margin-top:10px; }
}
@media(max-width:360px) {
  .memory-page .round-heading h1 { font-size:17px; }
  .memory-page .play-tools button { padding:6px;font-size:9px; }
  .memory-page .turn-line>span { font-size:9px; }
}
/* Instant face changes preserve the game for motion-sensitive players. */
.reduce-motion .memory-page .card-inner,.reduce-motion .memory-page .demo-card img { transition:none; }
.reduce-motion .memory-page * { animation:none!important; }
@media(prefers-reduced-motion:reduce) { .memory-page * { animation:none!important;transition:none!important; } }
/* Keep the board geometry steady when instructions or turn buttons change. */
.memory-page .board-message { height:52px;min-height:52px; }
.memory-page .completion { background:#fffdf7; }
@media(max-width:600px) { .memory-page .board-message { height:58px;min-height:58px; } }
@media(max-height:500px) and (min-width:601px) {
  .memory-page.playing .masthead { display:none; }
  .memory-page #play { height:100svh; }
  .memory-page .scoreboard { top:57px; }
  .memory-page .board-message { height:48px;min-height:48px; }
  .memory-page .keyboard-help { position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%); }
}
@media(max-height:650px) and (max-width:600px) {
  .memory-page.playing .masthead { display:none; }
  .memory-page #play { height:100svh; }
  .memory-page .round-heading .eyebrow { display:none; }
  .memory-page .board-message { height:52px;min-height:52px; }
}
.memory-page .board-room.needs-scroll { place-items:start; }
