h1{font-size:clamp(36px,5vw,56px);margin:16px 0 18px}
.intro{font-size:18px;max-width:860px}
.world-controls{display:flex;flex-wrap:wrap;gap:10px;margin:30px 0 14px}
.world-controls button:focus-visible,.board-link:focus-visible,.scene:focus-visible{outline:3px solid #658da8;outline-offset:4px}
.world-description{font-size:14px;color:#596269;margin-bottom:24px}
.style-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;--scene-x:0%;--scene-y:0%}
.style-card{min-width:0;background:#fcfcf9;border:1px solid #dde1df;border-radius:14px;overflow:hidden}
.style-copy{padding:22px}
.style-copy h2{font-size:24px;line-height:1.15;margin:12px 0}
.style-copy p{font-size:14px;margin:0;color:#596269}
.style-copy .material-note{font-size:12px;margin-bottom:16px}
.scene{display:block;position:relative;overflow:hidden;aspect-ratio:3/2;background:#e9edeb}
.scene img{display:block;position:absolute;inset:0;width:200%;height:200%;max-width:none;transform:translate(var(--scene-x),var(--scene-y))}
.all-worlds .scene img{width:100%;height:100%;transform:none}
.board-link{font-size:13px;text-underline-offset:4px}
.study-note{margin:22px 0 35px}
@media(min-width:901px){.style-card>.style-copy:first-child{min-height:170px}}
@media(max-width:900px){.style-grid{grid-template-columns:1fr}.style-copy{padding:20px}.scene{aspect-ratio:3/2}.style-copy h2{font-size:25px}}
