/* Actual game scenes, sculpted content objects and consent-to-play video. */
.hero-carousel {position:relative;border-bottom:1px solid var(--edge);overflow:clip}
.hero-carousel .home-hero {border-radius:0;border:0;box-shadow:none;min-height:690px}
.hero-controls {position:relative;z-index:3;display:flex;gap:12px;align-items:center;padding:20px 0}
.hero-dots {display:flex;gap:2px}
.hero-dots button {display:grid;place-items:center;width:44px;height:44px;padding:0;border:0;background:transparent;border-radius:50%}
.hero-dots span {width:11px;height:11px;border-radius:50%;background:var(--muted);transition:transform .2s,background .2s}
.hero-dots button[aria-pressed=true] span {background:var(--cyan);box-shadow:0 0 0 5px color-mix(in srgb,var(--cyan) 16%,transparent);transform:scale(1.08)}
.hero-slide-title {font-size:12px;color:var(--muted);margin-left:8px;font-weight:800}
.game-hero {background:#17243b}
.game-hero .hero-scene {z-index:-2;object-position:center top}
.game-hero:after {background:linear-gradient(90deg,#20152fed 0%,#251b37c2 35%,#29213d20 80%)}
.hero-carousel .game-hero .wrap {padding:65px 0 95px;position:relative;z-index:3}
.game-hero .hero-copy {max-width:48%}
.hero-carousel .game-hero h1 {font-size:clamp(43px,5.4vw,73px)}
.hero-cast {position:absolute;right:1%;bottom:3%;width:55%;height:78%;z-index:2;pointer-events:none;display:flex;align-items:end;justify-content:center}
.hero-cast img {height:auto;max-height:100%;width:56%;object-fit:contain;filter:drop-shadow(0 18px 8px #1e1a2e25)}
.hero-cast .cast-brown {transform:rotate(-4deg);margin-right:-13%}
.hero-cast .cast-sky {transform:rotate(3deg);height:auto;width:53%}
.hero-ground,.world-ground {position:absolute;left:0;right:0;bottom:0;height:15%;background:url('assets/game-r5/lawn.webp') center top/cover;z-index:1;border-radius:50% 50% 0 0/20% 20% 0 0;pointer-events:none}
html[data-theme=light] .game-hero:after {background:linear-gradient(90deg,#e4d4eef2,#ecddf2c7 38%,#e5d6f118 75%)}
html[data-theme=light] .game-hero h1 {color:#291740;text-shadow:0 2px 0 #fff6}
html[data-theme=light] .game-hero h1 span {color:#774d00}
html[data-theme=light] .game-hero .hero-copy p {color:#473258}
html[data-theme=light] .game-hero .hero-note {color:#534060!important}
html[data-theme=light] .game-hero .pill {background:#d4bbe9;color:#3b234d}
html[data-theme=light] .game-hero .btn:not(.primary) {background:#ecdcf6;color:#2a163e;border-color:#a78cb7}
.film-hero {background:radial-gradient(ellipse at 85% 50%,#25c8c62b,transparent 55%),linear-gradient(135deg,var(--lavender),var(--bg))}
.film-hero:after {display:none}
.film-layout {display:grid;grid-template-columns:.85fr 1.15fr;gap:45px;align-items:center}
.film-copy h2 {font-size:clamp(36px,4.6vw,64px);line-height:1.12;margin:25px 0}
.film-copy h2 span {color:var(--cyan)}
.film-copy p {color:var(--muted);font-size:16px;margin-bottom:28px}
.hero-film-stage {position:relative;border:2px solid var(--edge);border-radius:38px;background:radial-gradient(ellipse at center,var(--aqua),var(--panel-bottom));box-shadow:inset 0 3px 0 #fff5,var(--lift);min-width:0;overflow:hidden;aspect-ratio:16/11;display:grid;place-items:center}
.film-prop {width:94%;height:90%;object-fit:contain}
.video-pending {position:absolute;bottom:20px;left:20px;right:20px;text-align:center;font-size:12px;font-weight:800;border:1px solid var(--edge);border-radius:13px;padding:10px;background:var(--surface)}
.stage-lawn {position:absolute;bottom:0;left:0;right:0;height:22%;background:url('assets/game-r5/lawn.webp') center top/cover;z-index:0}
.game-stage .cast {z-index:1;bottom:0}
.block-sculpture {display:block;max-width:100%;object-fit:contain;filter:drop-shadow(0 10px 12px #27133c1c)}
.rhythm-prop {width:340px;max-height:210px;margin:20px auto 0}
.sound-strip {grid-template-columns:.8fr 1.2fr}
.idea-prop {width:100%;max-width:470px;max-height:320px;margin:20px auto 0}
.faq-prop {width:280px;height:260px;margin-top:15px;object-fit:contain}
.world-cast {position:absolute;right:2%;bottom:2%;width:47%;height:76%;display:flex;align-items:end;justify-content:center;z-index:1;pointer-events:none}
.world-cast img {width:56%;height:auto;max-height:100%;object-fit:contain;filter:drop-shadow(0 12px 10px #14152830)}
.world-cast img+img {margin-left:-12%;height:auto;width:52%}
.world-sky .wrap {position:relative;z-index:2}
.world-sky h2 {max-width:55%}
.world-sky p {max-width:43%}
.world-sky:after {background:linear-gradient(90deg,#21172eea,#30213a9c 44%,#241a3012 80%)}
.world-sky[data-mood=night] .world-ground {filter:brightness(.55) saturate(.75)}
.video-section {background:radial-gradient(ellipse at 95% 0,#23cbca24,transparent 60%),linear-gradient(135deg,var(--bg),var(--lavender))}
.video-empty {display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:45px;border:2px solid var(--edge);border-radius:36px;padding:32px 45px;background:linear-gradient(140deg,var(--panel-top),var(--panel-bottom));box-shadow:inset 0 3px 0 #fff5,var(--lift)}
.video-empty-art {width:100%;max-height:340px;object-fit:contain}
.video-empty-copy h3 {font-family:Russo,sans-serif;font-weight:400;font-size:clamp(26px,3vw,40px);line-height:1.18;margin:22px 0}
.video-empty-copy p {color:var(--muted);font-size:15px;margin-bottom:0}
.video-intro-prop {width:100%;height:220px;object-fit:contain}
.video-filters {display:flex;gap:15px;flex-wrap:wrap;align-items:center;margin-bottom:28px}
.video-filters input {max-width:450px}
.video-grid {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.video-card {border:1px solid var(--edge);border-radius:26px;overflow:hidden;background:var(--surface);box-shadow:var(--lift)}
.video-poster {aspect-ratio:16/10;background:linear-gradient(145deg,var(--aqua),var(--lavender));position:relative;overflow:hidden}
.video-play {display:grid;place-items:center;width:100%;height:100%;padding:0;border:0;background:transparent;position:relative;cursor:pointer}
.video-play img {width:100%;height:100%;object-fit:contain;min-height:0}
.play-symbol {position:absolute;display:grid;place-items:center;width:64px;height:64px;border-radius:50%;background:#ffdc48;color:#28163c;font-size:25px;border:2px solid #fff5;box-shadow:0 8px 28px #22143d44}
.video-card-copy {padding:22px}
.video-card-copy h3 {font-size:20px;line-height:1.3}
.video-card-copy p {color:var(--muted);font-size:13px}
.youtube-player {display:block;border:0;width:100%;height:100%;aspect-ratio:16/9;background:#151126}
@media(min-width:1101px) {.navlinks a{padding:10px 9px}.navlinks{gap:1px}.nav{gap:14px}}
@media(max-width:1100px) {
  .sound-strip{grid-template-columns:1fr}.rhythm-prop{max-height:180px;margin:10px 0 0}
  .sound-strip>div:first-child {display:grid;grid-template-columns:1fr 200px;column-gap:24px}
  .sound-strip>div:first-child .rhythm-prop {grid-column:2;grid-row:1/4;width:200px;align-self:center}
  .hero-carousel .home-hero{min-height:640px}
  .film-layout {gap:28px}
}
@media(max-width:800px) {
  .hero-carousel .home-hero{min-height:0}
  .hero-carousel .game-hero{display:block}
  .game-hero .hero-scene{position:absolute;height:100%;aspect-ratio:auto;inset:0;margin:0;object-fit:cover;z-index:-2}
  .hero-carousel .game-hero .wrap {padding:35px 0 0}
  .game-hero .hero-copy {max-width:100%}
  .hero-cast{position:relative;right:auto;bottom:auto;width:100%;height:340px;margin-top:10px;z-index:2}
  .hero-cast img{width:47%;height:100%}
  .hero-cast .cast-sky{height:94%}
  .hero-ground{height:90px}
  .hero-carousel .game-hero h1{font-size:53px}
  .hero-cast .cast-brown{margin-right:-12%}
  .film-layout{grid-template-columns:1fr;gap:26px}
  .hero-carousel .film-hero .wrap{padding:35px 0}
  .film-copy h2{font-size:43px;margin:20px 0}
  .hero-film-stage{width:100%;max-width:560px;margin:auto;aspect-ratio:16/10}
  .film-copy p{font-size:15px}
  .hero-controls{padding:16px 0}
  .world-sky{display:block;min-height:0}
  .world-sky .wrap{padding:40px 0 0}
  .world-sky h2,.world-sky p{max-width:100%}
  .world-cast{position:relative;right:auto;bottom:auto;width:100%;height:300px;margin:10px auto 0;z-index:2}
  .world-ground{height:85px}
  .world-sky:after{background:linear-gradient(180deg,#24162de8,#2f224ca1 55%,#24162d0a)}
  .video-empty{gap:20px;padding:26px}
  .video-empty-copy h3{font-size:28px}
  .video-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:500px) {
  .hero-carousel .game-hero h1{font-size:42px}
  .hero-cast{height:265px}
  .hero-cast img{width:57%}
  .hero-controls{gap:6px}
  .hero-slide-title{font-size:10px;margin-left:6px}
  .hero-carousel .film-hero .wrap{padding:30px 0}
  .film-copy h2{font-size:36px}
  .hero-film-stage{border-radius:27px;aspect-ratio:1.45}
  .video-pending{font-size:11px;bottom:12px;left:12px;right:12px;padding:7px}
  .film-prop{height:85%;margin-top:-15px}
  .sound-strip>div:first-child{display:block}
  .sound-strip>div:first-child .rhythm-prop{width:100%;max-height:190px;margin:12px auto 0}
  .faq-prop{width:190px;height:180px;margin:12px auto 0}
  .idea-prop{max-height:230px}
  .world-cast{height:265px}
  .video-empty{grid-template-columns:1fr;gap:12px;padding:23px;border-radius:28px}
  .video-empty-art{height:210px}
  .video-empty-copy h3{font-size:28px;margin:18px 0}
  .video-empty-copy p{font-size:14px}
  .video-intro-prop{display:none}
  .video-grid{grid-template-columns:1fr}
}
@media(prefers-reduced-motion:reduce) {.hero-dots span{transition:none}}
