.play-page { background: var(--bg); }
.play-page .nav-links a[aria-current="page"] { color: var(--paper); border-bottom: 2px solid var(--accent); }
.play-heading { padding: clamp(70px, 9vw, 120px) 0 clamp(64px, 8vw, 98px); }
.play-heading h1 { font-size: clamp(54px, 8vw, 104px); line-height: .98; letter-spacing: -.075em; margin: 0 0 26px; }
.play-heading h1 span { color: var(--accent); }
.play-heading>p:last-child { color: #d3dcd8; font-size: clamp(17px, 2vw, 21px); max-width: 38ch; margin: 0; }
.play-collection { padding: clamp(45px, 7vw, 85px) 0; background: var(--paper); color: var(--ink); }
.game-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px; }
.game-card { background: #fff; border-radius: 18px; overflow: hidden; box-shadow: 0 12px 30px #17202413; display: flex; flex-direction: column; }
.game-card-image { display: block; overflow: hidden; }
.game-card-image img { width: 100%; aspect-ratio: 4/3; object-fit: cover; transition: transform .25s; }
.game-card-image:hover img { transform: scale(1.035); }
.game-card-copy { padding: 23px; display: flex; flex-direction: column; align-items: flex-start; flex: 1; }
.game-card-copy .game-index { color: #cc5738; letter-spacing: .16em; font-size: 11px; font-weight: 900; margin: 0 0 15px; }
.game-card h2 { font-size: clamp(23px, 2.3vw, 31px); line-height: 1.13; letter-spacing: -.055em; margin: 0 0 5px; }
.game-card-copy p[lang="ko"] { color: #526164; font-size: 15px; font-weight: 700; margin: 0 0 18px; }
.game-card-copy p:not(.game-index):not([lang="ko"]) { color: #526164; line-height: 1.55; margin: 0 0 24px; }
.game-card .button { margin-top: auto; }
.play-next { padding: clamp(65px, 8vw, 110px) 0; }
.play-next h2 { font-size: clamp(42px, 6vw, 75px); letter-spacing: -.07em; line-height: 1.04; margin: 0 0 20px; }
.play-next>p:not(.eyebrow) { color: #d0dad5; font-size: 18px; max-width: 42ch; margin: 0 0 27px; }
.game-heading { padding: clamp(50px, 6vw, 80px) 0 42px; }
.game-heading .back { display: inline-block; margin-bottom: 30px; color: #d0dad5; font-size: 14px; }
.game-heading .back:hover { color: #fff; }
.game-heading h1 { font-size: clamp(42px, 6vw, 76px); line-height: 1.05; letter-spacing: -.07em; margin: 0 0 12px; }
.game-heading p[lang="ko"] { color: var(--accent); font-size: 20px; font-weight: 700; margin: 0 0 18px; }
.game-heading .intro { color: #d0dad5; font-size: 18px; max-width: 60ch; margin: 0 0 20px; }
.game-heading .game-new-tab { text-decoration: underline; text-underline-offset: 4px; font-size: 14px; }
.game-stage { background: #101716; padding: 20px max(16px, calc((100vw - 1180px)/2)); }
.game-stage iframe { display: block; width: 100%; height: min(90vh, 850px); min-height: 630px; border: 0; border-radius: 14px; background: #f6ead6; }
.game-end { padding: 60px 0 85px; }
.game-end h2 { font-size: clamp(30px, 4vw, 48px); letter-spacing: -.05em; margin: 0 0 12px; }
.game-end p { color: #d0dad5; max-width: 55ch; margin: 0 0 25px; }
.game-end .actions { gap: 12px; }
@media(max-width:900px) { .game-grid { grid-template-columns: 1fr 1fr; } }
@media(max-width:600px) { .game-grid { grid-template-columns: 1fr; } .game-card-image img { aspect-ratio: 16/9; } .game-stage { padding: 0; } .game-stage iframe { border-radius: 0; min-height: 680px; height: 82vh; } .game-heading .intro { font-size: 16px; } .play-page .nav-links a[aria-current="page"] { display: inline-flex; } }