@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@400;500;600&family=Manrope:wght@400;600&display=swap');
*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:#08030d;color:#fae8c5}.reading-lobby{min-height:100svh;position:relative;overflow:hidden;padding:28px 5vw 70px;background:#08030d url('/assets/reading-room-clean-desktop.png') center/cover no-repeat}.reading-lobby:before{content:'';position:absolute;inset:0;background:linear-gradient(180deg,#05020a55,#08030d99 75%),radial-gradient(ellipse at 50% 55%,transparent 20%,#08030dcc 95%);pointer-events:none}.reading-lobby nav,.lobby-content{position:relative;z-index:1}.reading-lobby nav{display:flex;justify-content:space-between;gap:12px}.reading-lobby nav a{border:1px solid #efc67d8c;border-radius:999px;background:#08020ec7;color:#f7dfb1;padding:10px 16px;font:600 12px/1 Manrope,sans-serif;letter-spacing:.08em;text-decoration:none;box-shadow:0 5px 18px #0007}.lobby-content{width:min(1200px,100%);margin:clamp(80px,13vh,150px) auto 0;text-align:center}.kicker{color:#e3b66c;font:600 12px Manrope,sans-serif;letter-spacing:.24em}.lobby-content h1{margin:15px 0 8px;font:400 clamp(3.3rem,7vw,6.8rem)/.88 'Cormorant Garamond',serif;text-shadow:0 0 25px #bd73e0aa}.lobby-content>p{margin:0 auto 36px;color:#eed9bd;font:1.35rem 'Cormorant Garamond',serif}.lobby-choices{display:flex;justify-content:center;align-items:end;gap:clamp(14px,3vw,46px);max-width:1120px;margin:auto}.lobby-choice{display:flex;width:min(29vw,330px);flex-direction:column;align-items:center;color:#f9dfad;text-decoration:none;transition:transform .45s ease,filter .45s ease}.lobby-choice img{display:block;width:100%;height:min(42vh,410px);object-fit:contain;filter:drop-shadow(0 14px 20px #000c);transition:transform .45s ease,filter .45s ease,opacity .2s ease}.lobby-choice.crystal img{height:min(40vh,380px)}.lobby-choice.runes img{height:min(40vh,390px);opacity:0}.lobby-choice.runes img.is-ready{opacity:1}.lobby-choice:hover{transform:translateY(-14px)}.lobby-choice:hover img{filter:drop-shadow(0 0 28px #dfae6e) drop-shadow(0 18px 20px #000d);transform:scale(1.05)}.lobby-choice span{margin-top:6px;font:600 16px Manrope,sans-serif;letter-spacing:.14em;text-shadow:0 2px 8px #000}.lobby-choice small{margin-top:7px;color:#d9c0b0;font:1.05rem 'Cormorant Garamond',serif}@media(max-width:700px){.reading-lobby{padding:18px 10px 50px;background-image:url('/assets/reading-room-clean-mobile.png')}.reading-lobby nav a{padding:8px 11px;font-size:10px;white-space:nowrap}.lobby-content{margin-top:90px}.lobby-content h1{font-size:3.6rem}.lobby-content>p{font-size:1.2rem;margin-bottom:25px}.lobby-choices{gap:3px;align-items:end}.lobby-choice{width:33.333%}.lobby-choice img,.lobby-choice.crystal img,.lobby-choice.runes img{width:100%;height:205px}.lobby-choice span{font-size:9px;letter-spacing:.08em}.lobby-choice small{max-width:115px;font-size:.82rem;line-height:1.1}}

@media(min-width:701px){.lobby-choices{gap:clamp(8px,2vw,28px);max-width:1200px}.lobby-choice{width:min(22vw,270px)}.lobby-choice img{height:min(38vh,360px)}.lobby-choice.crystal img,.lobby-choice.runes img{height:min(37vh,350px)}.lobby-choice.typewriter img{height:min(35vh,330px)}}
@media(max-width:700px){.lobby-choices{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 8px;align-items:end}.lobby-choice{width:100%}.lobby-choice img,.lobby-choice.crystal img,.lobby-choice.runes img,.lobby-choice.typewriter img{height:190px}.lobby-choice span{font-size:11px;letter-spacing:.1em}.lobby-choice small{max-width:150px;font-size:.9rem;line-height:1.15}}
 .site-audio{position:fixed;right:1.25rem;bottom:1.25rem;z-index:40;padding:8px 12px;border:1px solid #a786525e;background:#17110bd9;color:#c7b292;font:.68rem/1.4 'Courier New',monospace;letter-spacing:.05em;cursor:pointer}.site-audio:hover,.site-audio:focus-visible{color:#f1d5a2;border-color:#d3aa69;box-shadow:0 0 16px #d59a4238}

/* Add the game as a centered second row beneath the four FROG room choices. */
@media(min-width:701px){.lobby-choices{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));row-gap:clamp(22px,4vh,42px);align-items:end}.lobby-choice.game{grid-column:2/span 2;grid-row:2;justify-self:center;width:min(22vw,270px)}}
@media(max-width:700px){.lobby-choice.game{grid-column:1/-1;grid-row:3;justify-self:center;width:min(76vw,270px)}}
