/* Faithful implementation of the selected Playtime Clubhouse preview. */
@font-face{font-family:Clubhouse;src:url('assets/fonts/Baloo2.woff') format('woff');font-style:normal;font-weight:400 800;font-display:swap}
@font-face{font-family:Adventure;src:url('assets/fonts/Nunito.woff') format('woff');font-style:normal;font-weight:200 1000;font-display:swap}
header{padding:14px 3.5%;border-bottom-width:3px;font-family:Adventure,'Trebuchet MS',sans-serif;min-height:clamp(82px,6.18vw,102px)}
header .logo{font-family:Clubhouse,'Trebuchet MS',sans-serif;font-size:clamp(24px,2.1vw,35px);font-weight:800;line-height:.9;gap:12px}
header .logo i{font-size:clamp(44px,4.1vw,65px);line-height:.8}header .logo small{font:800 clamp(10px,.82vw,13px)/1.4 Adventure,sans-serif;letter-spacing:2.6px}
header nav{gap:clamp(20px,2.5vw,42px)}header nav a{font-size:clamp(14px,1.25vw,20px);font-weight:900}header nav .button{font-size:clamp(15px,1.35vw,22px);border-radius:18px;padding:12px 24px}
.clubhouse-hero{padding:2.08vw 6.1% 0;background:#fff9e9;border:0;overflow:hidden;isolation:isolate}
.clubhouse-hero .wrap{max-width:1450px;grid-template-columns:44% 56%;gap:0;align-items:center;position:relative;z-index:1}
.clubhouse-copy{position:relative;padding:1.6vw 0 2.8vw;z-index:2}
.clubhouse-hero h1{font-family:Clubhouse,'Arial Rounded MT Bold',sans-serif;font-size:clamp(70px,7.7vw,126px);font-weight:800;line-height:.96;letter-spacing:-2.7px;color:#103657;white-space:nowrap}
.clubhouse-hero h1 em{color:#f13d87;display:inline-block}
.clubhouse-hero .intro{font-family:Adventure,'Trebuchet MS',sans-serif;font-size:clamp(18px,1.7vw,28px);font-weight:600;line-height:1.3;max-width:590px;color:#123c63;margin:1.4vw 0 1.75vw;position:relative;z-index:2;width:88%}
.clubhouse-hero .button{font-family:Adventure,'Trebuchet MS',sans-serif;font-weight:900;font-size:clamp(19px,1.65vw,27px);border-radius:28px;padding:clamp(13px,1.2vw,20px) clamp(25px,2.7vw,44px);background:linear-gradient(#f54c96,#ed3282);border:3px solid #ffa9ce;box-shadow:0 6px 0 #d52a74;white-space:nowrap;transition:transform .18s,box-shadow .18s}
.clubhouse-hero .button span{display:inline-block;margin-left:6px;font-size:1.25em;line-height:1;vertical-align:-1px}
.clubhouse-hero .button:hover{transform:translateY(-3px);box-shadow:0 9px 0 #cc236e}
.sun-rays{position:absolute;left:-49px;top:-23px;width:clamp(65px,6.3vw,103px);height:clamp(58px,5.6vw,90px);transform:rotate(-8deg);pointer-events:none}
.clubhouse-art{padding:0;position:relative;width:100%;align-self:end;margin-bottom:-1px}
.family-arch{width:100%;aspect-ratio:795/560;overflow:hidden;background:transparent;border:0;border-radius:0}
.family-arch>svg{display:block;width:100%;height:100%;overflow:hidden}
.butterfly{position:absolute;right:-23px;top:-10px;width:clamp(95px,9vw,147px);height:clamp(82px,7.8vw,128px);pointer-events:none}
.garden-edge{position:absolute;z-index:0;left:0;right:0;bottom:0;width:100%;height:90px;pointer-events:none}
.clubhouse-shortcuts{padding:2.5vw 1.05% 1.9vw;background:linear-gradient(100deg,#cdf8f6,#c0f0e9);border-top:5px solid white;border-bottom:5px solid white}
.clubhouse-shortcuts>.wrap{max-width:1630px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(14px,1.2vw,20px)}
.game-shortcut{display:flex;align-items:center;gap:clamp(12px,1vw,16px);min-height:clamp(148px,12vw,198px);text-decoration:none;background:linear-gradient(120deg,#d5bcfa,#cbb0f3);border:6px solid white;border-radius:40px;padding:8px 20px 8px 10px;box-shadow:0 8px 0 #9ed7cf;transition:transform .18s,box-shadow .18s}
.game-shortcut.memory{background:linear-gradient(120deg,#ffe16d,#ffda45)}.game-shortcut.colour{background:linear-gradient(120deg,#ffafd7,#f99dcd)}
.shortcut-art{display:flex;flex:0 0 44%;border-right:2px solid #ffffffc0;padding-right:15px}
.shortcut-art svg{display:block;width:100%;height:auto;aspect-ratio:1.12}
.shortcut-label{font-family:Clubhouse,'Trebuchet MS',sans-serif;font-size:clamp(27px,2.5vw,41px);font-weight:800;line-height:1.02;letter-spacing:-.65px;color:#103657}
.shortcut-arrow{display:grid;place-items:center;flex:0 0 clamp(35px,3.2vw,52px);height:clamp(35px,3.2vw,52px);background:white;border-radius:50%;margin-left:auto;color:#123c63;font:900 clamp(27px,2.7vw,44px)/1 Adventure,sans-serif}
.game-shortcut:hover{transform:translateY(-5px);box-shadow:0 13px 0 #9ed7cf}.game-shortcut:active{transform:translateY(2px);box-shadow:0 4px 0 #9ed7cf}
@media(min-width:1650px){.clubhouse-hero{padding-top:35px}.clubhouse-copy{padding-top:25px;padding-bottom:45px}.clubhouse-hero .intro{margin:22px 0 28px}.clubhouse-shortcuts{padding-top:40px;padding-bottom:30px}}
@media(max-width:1080px) and (min-width:761px){header{padding-left:4%;padding-right:4%}header nav{gap:16px}.clubhouse-hero h1{font-size:7vw;letter-spacing:-1.7px}.clubhouse-hero .intro{font-size:1.8vw}.clubhouse-hero .button{font-size:1.9vw;padding:12px 22px}.game-shortcut{border-width:4px;border-radius:28px;padding:10px 12px;min-height:130px;gap:10px}.shortcut-art{flex-basis:37%;padding-right:8px}.shortcut-label{font-size:2.5vw}.shortcut-arrow{flex-basis:29px;height:29px;font-size:25px}}
@media(max-width:760px){header{padding:19px 6%;min-height:82px}header .logo{font-size:25px}header .logo i{font-size:43px}header .logo small{font-size:9px}header nav{top:82px}header nav a{font-size:16px}.clubhouse-hero{padding:28px 6% 0}.clubhouse-hero .wrap{grid-template-columns:1fr;gap:17px}.clubhouse-copy{text-align:center;padding:8px 0 15px}.clubhouse-hero h1{font-size:clamp(51px,12.8vw,86px);letter-spacing:-1.4px;line-height:1.02;white-space:normal}.sun-rays{left:-14px;top:-15px;width:45px;height:42px}.clubhouse-hero .intro{font-size:17px;max-width:440px;width:auto;margin:18px auto 24px;line-height:1.4}.clubhouse-hero .actions{justify-content:center}.clubhouse-hero .button{font-size:19px;padding:13px 22px;border-radius:23px;border-width:2px}.clubhouse-hero .button span{font-size:25px}.clubhouse-art{max-width:570px;margin:0 auto -1px}.family-arch{aspect-ratio:795/560}.butterfly{width:80px;height:75px;right:-14px;top:-8px}.garden-edge{height:65px}.clubhouse-shortcuts{padding:20px 3% 23px}.clubhouse-shortcuts>.wrap{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.game-shortcut{flex-direction:column;gap:5px;text-align:center;border-width:3px;border-radius:23px;min-height:156px;padding:6px 5px 13px;position:relative}.shortcut-art{flex:0 0 auto;width:78px;border:0;padding:0}.shortcut-art svg{height:68px;aspect-ratio:auto}.shortcut-label{font-size:22px;letter-spacing:-.5px}.shortcut-arrow{position:absolute;right:5px;top:7px;width:20px;height:20px;font-size:17px}.clubhouse-shortcuts .shortcut-arrow{flex-basis:auto}}
@media(max-width:360px){.clubhouse-hero h1{font-size:47px}.shortcut-label{font-size:20px}.game-shortcut{border-radius:18px}.clubhouse-hero .intro{font-size:16px}}
@media(prefers-reduced-motion:reduce){.game-shortcut,.clubhouse-hero .button{transition:none}}

.shortcut-art img{display:block;width:100%;height:auto;aspect-ratio:1.12;object-fit:contain}
@media(max-width:760px){.shortcut-art img{height:68px;aspect-ratio:auto}}

.memory .shortcut-art img{transform:scale(1.5);transform-origin:center}

/* Keep the expanded family navigation comfortable on smaller screens. */
@media(min-width:761px) and (max-width:960px){header{position:relative}.menu{display:block;border:0;background:none;color:#234568;font-size:26px}header nav{display:none;position:absolute;top:100%;left:0;right:0;background:#fffaf0;padding:25px;z-index:10}header nav.open{display:flex;flex-direction:column;gap:20px}}
