/* The catalogue has one visual system; in-game layouts retain their own styles. */
:root { --arcade-ink:#123331; --arcade-deep:#102827; --arcade-paper:#fff9e9; --arcade-soft:#c2d0c6; --arcade-gold:#e7ef8c; }
body { background:#102827; }
.masthead { background:#fff7e7; border-bottom:1px solid #c9cdb4; padding:10px max(20px,calc((100vw - 1440px)/2)); gap:20px; position:relative; min-height:78px; }
.masthead .brand { font-family:'Baloo 2',Georgia,serif; font-size:19px; letter-spacing:-.04em; }
.masthead .brand strong { color:#a1472c; font-size:25px; }
.studio-nav { display:flex; margin-left:auto; gap:clamp(12px,1.8vw,25px); align-items:center; }
.studio-nav a { font-size:14px; text-decoration:none; }
.studio-nav .baby-link { color:#684615; background:#f5e5bd; border:1px solid #d6be83; border-radius:8px; padding:0 12px; }
.studio-nav a[aria-current] { border-bottom:2px solid #a1472c; }
.utility { display:none; }
body[data-destination=learning] .utility { display:flex; }
body[data-destination=learning] .utility #motion { min-height:44px; }
#music-button { border:1px solid #5e7865; border-radius:8px; background:none; font-size:12px; min-width:115px; }
.destination-nav { background:#102827; border-bottom:1px solid #ffffff21; padding:0 max(20px,calc((100vw - 1440px)/2)); justify-content:flex-start; gap:26px; min-height:50px; }
.destination-nav a { font-size:13px; letter-spacing:.03em; }
.destination-nav a[aria-current] { color:#e7ef8c; border-bottom-color:#e7ef8c; }
.destination-nav .destination-note { margin-left:auto; display:flex; align-items:center; color:#b4c4ba; font-size:12px; }
#lobby { background:radial-gradient(ellipse at 95% 0,#64815a38,transparent 42%),linear-gradient(135deg,#173936,#102827 60%); padding-bottom:1px; }
.arcade-marquee { max-width:1480px; padding:24px 20px 22px; gap:30px; }
.arcade-marquee .eyebrow { color:#b2cfb8; letter-spacing:.18em; font-size:10px; margin-bottom:8px; }
.arcade-marquee h1 { font-family:'Baloo 2',Georgia,serif; font-size:clamp(34px,3.5vw,52px); letter-spacing:-.035em; text-transform:none; line-height:1; color:#fff9e9; text-shadow:none; }
.arcade-marquee h1 em { color:#e7ef8c; }
.marquee-note { color:#cfdbd2; font-size:14px; max-width:32ch; line-height:1.5; }
.arcade-floor { max-width:1480px; padding:0 20px 24px; }
.dashboard-tools { border:1px solid #8ba79850; background:#0a23244d; border-radius:12px; padding:12px 14px; }
.search-row { gap:12px; }
.search-box { max-width:330px; }
.search-box input { border:1px solid #8ea394; background:#f9f8e9; border-radius:8px; font-size:14px; padding-inline:12px; }
.age-choice select, .mobile-discovery select { background:#183d39; color:#f9f8e9; border:1px solid #6f8d7e; border-radius:8px; }
.age-choice select { width:132px; }
.shelf-switch button { color:#cbd9ce; border-radius:8px; }
.shelf-switch button[aria-pressed=true] { border-color:#9db791; background:#36594a; color:#fff9e9; }
.category-row { margin-top:8px; }
.kind-filter { gap:4px; }
.kind-filter button { border:0; color:#cbd9ce; border-radius:7px; padding:7px 13px; min-height:40px; }
.kind-filter button[aria-pressed=true] { background:#e7ef8c; color:#1b3122; }
.device-note { font-size:11px; color:#c0cec4; }
.shelf-heading { margin:20px 0 12px; }
.shelf-heading h2 { font-size:19px; }
.cabinet-wall { grid-template-columns:repeat(6,minmax(0,1fr)); gap:18px; perspective:none; }
.cabinet-tile, .cabinet-tile:nth-child(n) { --card-accent:#bddcbc; position:relative; padding:0; border:1px solid #72978060; border-radius:12px; background:#193c37; box-shadow:0 5px 14px #0002; transform:none; overflow:hidden; transition:border-color .18s,box-shadow .18s; }
.cabinet-tile[data-category=racing] { --card-accent:#ffd487; }
.cabinet-tile[data-category=puzzles] { --card-accent:#8edcdb; }
.cabinet-tile[data-category=sports] { --card-accent:#c9ed8a; }
.cabinet-tile[data-category=together] { --card-accent:#efbc9b; }
.cabinet-tile::before,.cabinet-tile::after { display:none; }
.cabinet-tile:hover,.cabinet-tile:focus-within { transform:none; border-color:var(--card-accent); box-shadow:0 7px 23px #0005; }
.game-card { overflow:hidden; border-radius:11px; }
.game-cover { position:relative; aspect-ratio:4/3; border:0; border-bottom:1px solid #8ba79850; border-radius:0; box-shadow:none; background:#122c29; }
.game-cover img { position:static; width:100%; height:100%; object-fit:cover; object-position:center; clip-path:none; transform:none!important; }
.cover-pacman .game-cover img,.cover-spider .game-cover img { position:absolute; width:100%; height:100%; inset:0; object-fit:contain; aspect-ratio:auto; clip-path:none; transform:none!important; }
.game-category { position:absolute; bottom:9px; left:9px; color:#102c28; background:var(--card-accent); padding:4px 7px; border:1px solid #fff6; border-radius:5px; font-size:10px; line-height:1; font-weight:800; letter-spacing:.025em; box-shadow:0 2px 8px #0002; }
.game-body { margin:0; min-height:116px; padding:12px 11px 42px; background:none; border:0; }
.game-body strong { font-size:16px; line-height:1.18; color:#fff9e9; }
.game-ages { font-size:12px; line-height:1.4; color:#c8d7ce; margin-top:5px; }
.game-go { position:absolute; width:auto; height:auto; bottom:10px; left:11px; clip-path:none; overflow:visible; color:var(--card-accent); font-size:12px; font-weight:800; }
.favourite { right:5px; bottom:3px; border-radius:8px; background:transparent; }
.favourite span { font-size:24px; }
.favourite[aria-pressed=true] { color:#e7ef8c; background:#39563a; }
.age-guide { margin-top:20px; color:#bfcec4; font-size:12px; }
#learning { max-width:1440px; margin:auto; border-radius:12px; border:1px solid #c4cbb0; }
.learning-intro h2 { font-family:'Baloo 2',Georgia,serif; font-size:36px; }
#trail-list { grid-template-columns:repeat(4,minmax(0,1fr)); }
.trail-tile { box-shadow:0 3px 10px #244c3814; }
.family-note { max-width:1440px; border-top:1px solid #66846f65; border-radius:0; background:transparent; padding:24px 20px; margin-top:0; }
.family-note h2 { font-size:22px; }
.family-note .device-record-copy { font-size:12px; }
body[data-destination=learning] #lobby { background:linear-gradient(#1b3d33,#e8ecda 420px); }
.shelf-empty { border-radius:10px; }
@media (max-width:1180px) {
  .masthead { gap:15px; }
  .studio-nav { gap:13px; }
  .cabinet-wall { grid-template-columns:repeat(4,minmax(0,1fr)); }
  .search-box { max-width:none; }
  .shelf-switch { margin-left:auto; }
  .device-note { max-width:29ch; text-align:right; }
}
@media (max-width:800px) {
  .masthead { flex-wrap:wrap; gap:8px 12px; padding:10px 16px; }
  .masthead .brand { font-size:16px; }
  .masthead .brand strong { font-size:22px; }
  .studio-nav { order:3; width:100%; flex-wrap:wrap; gap:4px 12px; }
  .studio-nav a { flex-shrink:0; font-size:12px; }
  #arcade-sound-slot { margin-left:auto; }
  .destination-nav { padding:0 16px; gap:24px; }
  .destination-nav .destination-note { display:none; }
  .arcade-marquee { padding:20px 16px; }
  .arcade-marquee .eyebrow { display:block; font-size:9px; }
  .arcade-marquee h1 { font-size:38px; }
  .marquee-note { display:none; }
  .arcade-floor { padding:0 16px 18px; }
  .dashboard-tools { padding:10px; }
  .search-row { display:grid; grid-template-columns:minmax(0,1fr) 132px; gap:8px; }
  .age-choice { font-size:0; }
  .shelf-switch,.kind-filter { display:none; }
  .category-row { display:block; margin-top:8px; }
  .mobile-discovery { display:grid; grid-template-columns:1fr 1fr; gap:8px; }
  .mobile-discovery select { min-width:0; width:100%; font-size:12px; }
  .device-note { max-width:none; text-align:left; margin-top:8px; }
  .shelf-heading { margin:16px 0 10px; }
  .shelf-heading h2 { display:block; font-size:17px; }
  .cabinet-wall { grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
  .cabinet-tile .favourite { right:4px; bottom:3px; }
  .game-body { min-height:122px; }
  #trail-list { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:540px) {
  .cabinet-wall { grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
  .game-body strong { font-size:16px; }
  .game-body { padding:11px 10px 42px; min-height:124px; }
  .game-ages { font-size:12px; }
  .game-go { font-size:11px; left:10px; }
  .arcade-marquee h1 { font-size:34px; }
.game-category { font-size:9px; padding:5px 6px; bottom:6px; left:6px; }
}
.game-cover.has-current-capture img { object-fit:contain; padding:3px; position:relative; z-index:1; }
.game-cover.has-current-capture { background:linear-gradient(135deg,#365347,#102622); }
.game-cover.has-current-capture .game-category { z-index:2; }
@media (prefers-reduced-motion:no-preference) {
  .cabinet-wall { animation:shelf-arrive .4s ease-out both; }
  @keyframes shelf-arrive { from { translate:0 8px; } to { translate:0 0; } }
}
