/* Image dimensions follow their frames; HTML size attributes reserve space only. */
img{height:auto}
.hero-copy,.hero-visual,.demo-scene,.demo-play,.family-grid>*,.takeaway-grid>*,.play-map li,.finds-strip>*,.school-section>*,.faq-section>*{min-width:0}
.hero h1{white-space:normal}

/* Reserve room for motion, labels and the die instead of enlarging past the column. */
.hero-visual{height:auto;min-height:0;aspect-ratio:auto;padding:85px 15px 105px;margin:0;align-self:center;z-index:0}
.hero-image{position:relative;inset:auto;width:100%;max-width:100%;height:auto;aspect-ratio:3/2;object-fit:contain}
.hero-floating-star{width:110px;height:110px;top:0;right:6%}
.player-label{left:4%;top:15px}
.hero-die{left:5%;bottom:85px}
.image-note{left:auto;right:3%;bottom:0;max-width:calc(100% - 24px);font-size:15px;line-height:1.65}
.hero-board-shadow{left:10%;top:65%;width:80%}
.hero-field{inset:25% -3% 10%}

/* The complete scene stays visible, including people near the edges. */
.demo-photo{border-radius:24px;overflow:hidden;background:#eee6f2}
.demo-photo img{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:contain;object-position:center;border-radius:0}
.family-image{padding:0 8px}
.family-image>img{width:100%;height:auto;aspect-ratio:3/2;object-fit:contain;object-position:center;border-radius:26px;transform:none}
.family-image:hover>img{transform:none}
.little-sticker{position:relative;inset:auto;display:table;width:fit-content;max-width:100%;margin:17px 0 0 auto;transform:rotate(-2deg)}
.map-object{padding:15px 9px 20px}
.map-object>img{width:100%;height:100%;max-width:100%;max-height:100%;object-fit:contain}
.map-characters>img{width:100%;height:auto;max-height:100%;aspect-ratio:3/2;object-fit:contain;border:0;border-radius:18px}
.finds-objects{padding:10px 5px 25px;gap:6px}
.finds-objects img{width:100%;height:auto;max-width:100%;aspect-ratio:1;object-fit:contain}
.finds-objects img:nth-child(even){transform:translateY(7px) rotate(3deg)}

/* The gift explanation has its own space below the whole chest. */
.takeaway-image{width:100%;padding:0 8px;max-width:600px;justify-self:center}
.takeaway-image img{width:100%;height:auto;aspect-ratio:3/2;object-fit:contain;object-position:center;border-radius:26px;transform:none}
.gift-note{position:relative;inset:auto;width:100%;margin-top:22px;transform:none}

/* The closing illustration occupies a full column rather than a cropped background. */
.final-section{display:grid;grid-template-columns:1fr 1.12fr;min-height:0;align-items:center;overflow:hidden}
.final-content{width:auto;min-width:0;padding:46px 40px;background:none;border-radius:0}
.final-section>img{position:static;inset:auto;width:100%;height:auto;max-width:100%;aspect-ratio:1672/941;object-fit:contain;object-position:center;border-radius:0;padding:22px 22px 22px 0}
@media(max-width:1100px){.hero-visual{padding-inline:10px}.hero-die{width:76px;height:76px;padding:16px;gap:6px;left:5%}.hero-floating-star{width:95px;height:95px}.final-content{padding:36px 28px}.final-content h2{font-size:43px}}
@media(max-width:900px){.hero{display:grid;grid-template-columns:1fr;gap:35px;min-height:0;padding-top:35px}.hero-copy{max-width:680px}.hero-visual{width:min(100%,620px);justify-self:center}.hero h1{font-size:clamp(42px,7vw,62px)}.hero h1 br{display:none}.hero-description{max-width:600px}.hero-visual{padding-top:75px}.hero-image{width:100%;left:auto;top:auto}.hero-floating-star{width:110px;height:110px}.hero .hero-die{width:80px;height:80px}.image-note{font-size:15px}.hero-copy .hero-actions{flex-direction:row}.family-image,.takeaway-image{padding-inline:4px}.final-section{grid-template-columns:1fr}.final-content{padding:40px}.final-content h2{max-width:560px}.final-section>img{padding:0 30px 30px;border-radius:0;width:100%;max-width:720px;justify-self:center}}
@media(max-width:650px){.hero{display:flex;gap:28px;padding-top:30px;padding-bottom:38px}.hero h1{font-size:clamp(35px,10.3vw,55px)}.hero-visual{width:100%;height:auto;min-height:0;padding:72px 12px 100px;align-self:stretch;margin:0}.hero-image{width:100%;left:auto;top:auto;aspect-ratio:3/2}.hero-floating-star{width:85px;height:85px;right:5%;top:0}.hero .hero-die{width:62px;height:62px;left:5%;bottom:83px;padding:13px;gap:4px;border-radius:15px}.player-label{top:17px;left:2%;font-size:13px}.image-note{font-size:13px;right:2%;bottom:0;padding:14px 16px;gap:10px}.image-note>span:first-child{font-size:28px}.hero-field{inset:22% -3% 14%}.spark-one{right:2%;top:26%}.spark-two{left:0;bottom:26%}.family-image>img,.takeaway-image img{height:auto;aspect-ratio:3/2;border-radius:20px}.little-sticker{font-size:13px;padding:14px 17px;margin-top:15px}.map-object{height:110px;padding:10px 2px 20px}.map-characters>img{width:100%;height:auto;aspect-ratio:3/2;border-radius:10px}.takeaway-image{padding:0;max-width:500px}.gift-note{margin-top:18px;width:100%;left:auto;right:auto;bottom:auto}.final-section{min-height:0;display:grid;grid-template-columns:1fr;border-radius:27px}.final-content{width:auto;padding:35px 27px 30px;background:none;border-radius:0}.final-content h2{font-size:40px}.final-section>img{position:static;width:100%;height:auto;aspect-ratio:1672/941;object-fit:contain;padding:0 16px 18px;border-radius:0}.what-heading,.what-copy{min-width:0}}
@media(max-width:370px){.hero-visual{height:auto;padding-inline:8px}.hero h1{font-size:35px}.image-note{font-size:12px;padding:13px;right:2%;max-width:95%}.player-label{font-size:12px;left:2%;padding:10px 13px}.hero-floating-star{width:76px;height:76px}.map-object{height:97px}.map-characters>img{width:100%;height:auto}.gift-note{padding:18px}.final-content{padding-inline:23px}.final-content h2{font-size:36px}}

/* Playing steps have their own illustrations. Rewards keep the full four-day field. */
.steps-section{padding-block:95px 65px;border-bottom:1px solid #dfd2df}
.steps-section .play-map{grid-template-columns:repeat(2,minmax(0,1fr));gap:40px 48px;margin-top:15px}
.steps-section .play-map:before{display:none}
.steps-section .play-map li{display:grid;grid-template-columns:180px minmax(0,1fr);column-gap:23px;align-content:start}
.steps-section .map-object{grid-row:1/3;height:195px;margin:0;padding:10px 0 24px}
.steps-section .map-object>img{width:100%;height:100%;object-fit:contain;aspect-ratio:1;filter:drop-shadow(0 12px 12px #7c518b20);animation:none}
.steps-section .map-step{left:9px;bottom:0}
.steps-section .play-map h3{margin:16px 0 12px;font-size:24px;line-height:1.35}
.steps-section .play-map p{font-size:17px;line-height:1.85}
#artifacts .artifact-image{height:auto;aspect-ratio:1;overflow:visible;padding:16px 6px 18px}
#artifacts .artifact-image img{width:100%;height:100%;object-fit:contain;aspect-ratio:1}
#artifacts .journey h3{font-size:25px;line-height:1.35;min-height:3.6em;margin-top:19px}
#artifacts .journey li>p{font-size:16px;line-height:1.85}
#artifacts .journey-line{top:270px}
#artifacts .route-note{font-size:16px;margin-top:40px}
@media(max-width:1150px){.steps-section .play-map{gap:32px}.steps-section .play-map li{grid-template-columns:145px minmax(0,1fr);column-gap:18px}.steps-section .map-object{height:175px}.steps-section .play-map h3{font-size:22px}.steps-section .play-map p{font-size:16px}#artifacts .journey h3{font-size:23px}}
@media(max-width:850px){.steps-section .play-map{grid-template-columns:1fr;gap:30px}.steps-section .play-map li{grid-template-columns:170px minmax(0,1fr);gap:0 24px}.steps-section .map-object{height:185px}.steps-section .play-map p{font-size:17px}#artifacts .journey h3{font-size:25px;min-height:2.8em}#artifacts .artifact-image{max-width:300px;margin-inline:auto}}
@media(max-width:650px){.steps-section{padding-block:70px 55px}.steps-section .play-map{gap:32px;margin-top:30px}.steps-section .play-map li{grid-template-columns:112px minmax(0,1fr);column-gap:18px}.steps-section .map-object{height:135px;padding:7px 0 25px}.steps-section .map-step{left:5px;bottom:0}.steps-section .play-map h3{font-size:21px;margin-top:8px;margin-bottom:12px}.steps-section .play-map p{font-size:16px;line-height:1.8}#artifacts{padding-top:75px}#artifacts .artifact-image{padding:13px 0 17px}#artifacts .journey h3{font-size:21px;line-height:1.35;min-height:0;margin-top:15px}#artifacts .journey li>p{font-size:15px;line-height:1.85}#artifacts .journey{gap:34px 22px}#artifacts .route-note{font-size:15px;margin-top:34px}}
@media(max-width:370px){.steps-section .play-map li{grid-template-columns:95px minmax(0,1fr);gap:0 14px}.steps-section .map-object{height:120px}.steps-section .play-map h3{font-size:20px}#artifacts .journey{gap:30px 18px}#artifacts .journey h3{font-size:19px}#artifacts .journey li>p{font-size:15px}}

#artifacts .artifact-skill{display:block;font-size:18px;line-height:1.5;letter-spacing:-.025em;margin-top:4px}
@media(max-width:650px){#artifacts .artifact-skill{font-size:16px}#artifacts .journey h3{font-size:23px;min-height:3.3em}}
@media(max-width:370px){#artifacts .artifact-skill{font-size:14px}#artifacts .journey h3{font-size:22px;min-height:3.5em}}

/* Keep every answer number in one column and let the full label wrap. */
#try .choice-button{display:grid;grid-template-columns:27px minmax(0,1fr);align-items:start;gap:13px;width:100%;min-width:0;min-height:62px;text-align:left;white-space:normal;transform:none}
#try .choice-number{margin:0;width:27px;height:27px;align-self:start;line-height:1}
#try .choice-label{min-width:0;margin:0;color:inherit;font-size:inherit;line-height:inherit;overflow-wrap:anywhere;padding-top:1px}
#try .choice-button:hover{transform:none}
#try .demo-play-header>span:nth-child(2){min-width:0}
#try .demo-step{flex-shrink:0}
#try .result-links .button{white-space:normal;text-align:center}
@media(max-width:850px) and (min-width:651px){#try .demo{grid-template-columns:1fr}}
@media(max-width:650px){#try .choice-button{grid-template-columns:25px minmax(0,1fr);gap:11px;padding:14px 13px}#try .choice-number{width:25px;height:25px}}