/* Babyface toy-stage direction: electric blue, candy pink, lemon accents. */
body[data-page="games"] {
  --play-blue:#074cd6;
  --play-navy:#102c68;
  --play-lemon:#ecff39;
  --play-pink:#ffacd0;
  background:linear-gradient(145deg,#fff1f7 0%,#ffd6e8 42%,#e7ecff 100%);
}
body[data-page="games"] .main {max-width:1440px;margin:auto}
body[data-page="games"] .main>.eyebrow {
  display:inline-block;background:var(--play-lemon);color:var(--play-navy);
  padding:9px 14px;border-radius:12px;letter-spacing:1.1px;font-size:12px;
  box-shadow:0 3px 0 #c6d829;margin-bottom:16px;
}
body[data-page="games"] .main>h1 {color:var(--play-navy);font-size:clamp(32px,3.5vw,46px);letter-spacing:-1px}
body[data-page="games"] .page-intro {font-size:16px;color:#3c466b;max-width:620px;margin-bottom:28px}
body[data-page="games"] .games-grid {gap:24px;grid-template-columns:repeat(2,minmax(0,1fr));align-items:stretch}
body[data-page="games"] .game-entry {
  display:block;position:relative;isolation:isolate;min-height:310px;grid-column:auto;
  border:2px solid #ffffffb0;border-radius:30px;background:var(--play-blue);
  padding:0;overflow:hidden;text-align:left;
  box-shadow:0 8px 0 #d786ad44,0 16px 26px #7530731f;
  transition:box-shadow .18s ease,transform .18s ease;
}
body[data-page="games"] .game-entry .game-character {
  position:absolute;inset:0;display:block;width:100%;height:100%;
  min-height:0;max-height:none;aspect-ratio:auto;object-fit:cover;object-position:65% center;
  border-radius:0;mask-image:none;background:none;z-index:-2;
}
body[data-page="games"] .game-entry::after {
  content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:linear-gradient(90deg,#003b9eae 0%,#003b9e99 30%,#003b9e35 48%,transparent 65%);
}
body[data-page="games"] .game-entry-copy {
  display:flex;position:relative;flex-direction:column;justify-content:center;
  width:49%;min-height:310px;padding:28px 0 32px 28px;margin:0;z-index:1;
}
body[data-page="games"] .game-entry h2 {
  font-size:clamp(25px,2.3vw,34px);line-height:1.12;font-weight:900;letter-spacing:-.5px;
  color:white;margin:0 0 13px;text-wrap:balance;text-shadow:0 3px 0 #00388766;
}
body[data-page="games"] .game-entry p {
  color:white;font-size:16px;line-height:1.5;max-width:260px;margin:0 0 22px;padding-right:0;
}
body[data-page="games"] .game-launch {
  display:inline-flex;align-items:center;justify-content:center;align-self:flex-start;
  min-height:48px;max-width:100%;gap:12px;border:1px solid #f4ff91;
  background:var(--play-lemon);color:#13265e;font-size:15px;font-weight:900;
  padding:11px 18px;border-radius:16px;margin:0;
  box-shadow:0 5px 0 #a6b51f,0 8px 16px #001b5140;
}
body[data-page="games"] .game-launch .icon {width:20px;height:20px;flex-shrink:0;stroke-width:2.5}
body[data-page="games"] .game-entry:hover {transform:translateY(-3px);box-shadow:0 10px 0 #d786ad44,0 20px 28px #7530732b}
body[data-page="games"] .game-entry:active {transform:translateY(2px)}
body[data-page="games"] .game-entry:focus-visible {outline:4px solid var(--play-navy);outline-offset:5px}
body[data-page="games"] .game-art-link {background:var(--play-lemon);border:2px solid white;color:var(--play-navy);box-shadow:0 6px 0 #cbd866;border-radius:25px;margin-top:30px}
body[data-page="games"] .game-art-link h2 {color:var(--play-navy)}
body[data-page="games"] .game-art-link .primary {background:var(--play-blue);color:#fff;box-shadow:0 4px 0 #16347d}
body[data-page="games"] .main>.flow-note {background:#ffffffc9;border-radius:16px;padding:16px;font-size:14px;color:#3c466b}
body[data-page="games"] .topbar {background:#fff6fbed;border-bottom-color:#f5bcd9}
body[data-page="games"] .age-control .selected {background:var(--play-lemon);color:var(--play-navy);box-shadow:0 3px 0 #bccc28}
body[data-page="games"] .sidebar {background:linear-gradient(180deg,#fff6fa,#ffe1ef);border-color:#fac6de}
body[data-page="games"] .sidebar .nav button.active {background:var(--play-blue);border-color:var(--play-blue);color:white}
body[data-page="games"] .sidebar .nav button.active .nav-icon {background:var(--play-lemon);border-color:var(--play-lemon)}
body[data-page="games"] .sidebar .nav button.active .nav-icon .icon {color:var(--play-navy)}
body[data-page="games"] .kid-game-board {border-color:white;box-shadow:0 7px 0 #efb7d2}
@media(max-width:1190px) {
  body[data-page="games"] .games-grid {grid-template-columns:1fr}
  body[data-page="games"] .game-entry,body[data-page="games"] .game-entry-copy {min-height:300px}
  body[data-page="games"] .game-entry h2 {font-size:32px}
  body[data-page="games"] .game-entry .game-character {object-position:center center}
}
@media(max-width:650px) {
  body[data-page="games"] .main {padding:24px 14px 32px}
  body[data-page="games"] .main>h1 {font-size:34px}
  body[data-page="games"] .page-intro {font-size:16px;line-height:1.55}
  body[data-page="games"] .games-grid {gap:23px}
  body[data-page="games"] .game-entry {border-radius:25px;min-height:300px}
  body[data-page="games"] .game-entry-copy {width:49%;min-height:300px;padding:24px 0 30px 20px}
  body[data-page="games"] .game-entry h2 {font-size:26px;line-height:1.12;margin-bottom:12px}
  body[data-page="games"] .game-entry p {font-size:16px;line-height:1.5;margin-bottom:20px}
  body[data-page="games"] .game-launch {font-size:14px;padding:10px 15px;gap:10px;min-height:46px;border-radius:14px}
  body[data-page="games"] .game-entry .game-character {object-position:65% center}
  body[data-page="games"] .sidebar {background:#fff;border-color:#fac6de}
  body[data-page="games"] .sidebar .nav button.active {background:var(--play-lemon);color:var(--play-navy);box-shadow:none}
  body[data-page="games"] .sidebar .nav button.active .nav-icon {background:var(--play-blue);border-color:var(--play-blue)}
  body[data-page="games"] .sidebar .nav button.active .nav-icon .icon {color:white}
}
@media(max-width:360px) {
  body[data-page="games"] .game-entry-copy {width:51%;padding-left:16px}
  body[data-page="games"] .game-entry h2 {font-size:24px}
  body[data-page="games"] .game-launch {gap:6px;padding-left:12px;padding-right:12px}
}
@media(prefers-reduced-motion:reduce) {body[data-page="games"] .game-entry{transition:none;transform:none}}
body.low-motion[data-page="games"] .game-entry {transition:none;transform:none}
