/* Application shell. Marketing stays on the ordinary desktop site, not in the installed app. */
.site-header{display:none}.app-navigation{display:flex;align-items:center;justify-content:space-between;gap:14px;min-height:64px;padding-top:env(safe-area-inset-top);font-size:14px;font-weight:650;color:#607153}
.app-menu-button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;width:44px;height:44px;padding:10px;border:1px solid #d4ddc8;border-radius:13px;background:#fffef8;flex-shrink:0;touch-action:manipulation}
.app-menu-button>span{display:block;width:18px;height:2px;border-radius:2px;background:#53674a}.app-menu-button:hover{background:#eef3e5}
.app-menu{width:min(390px,calc(100% - 24px));padding:24px;max-height:calc(100dvh - 24px);overscroll-behavior:contain}.app-menu-brand{display:flex;align-items:center;gap:12px}.app-menu-brand img{border-radius:12px}.app-menu-brand h2{font-size:28px;margin:0}.app-menu>p{font-size:12px;margin:13px 0 18px}.app-menu-links{display:flex;flex-direction:column;gap:4px}.app-menu-links>a,.app-menu-links>button{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;min-height:44px;padding:10px 12px;border:0;border-radius:10px;text-align:left;background:#edf2e4;color:#465d3b;font-size:13px;text-decoration:none;touch-action:manipulation}.app-menu-links>*>span{color:#8d9b7e}.app-menu-creator{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:17px 0;border-top:1px solid #dce3d1;text-decoration:none}.app-menu-creator>span{font-size:10px;color:#7b866f;max-width:130px}.app-menu-creator img{display:block;max-width:110px;height:auto}.app-menu>small{font-size:10px;color:#88927b}.app-menu .app-menu-offline{font-size:10px;line-height:1.5;margin:14px 0}.app-menu .app-menu-offline:empty{display:none}
body:not(.is-playing) [data-app-game-only]{display:none}.app-install-banner{display:flex;align-items:center;gap:16px;margin-top:16px;padding:14px 16px;border:1px solid #d7dfcb;border-radius:15px;background:#edf2e2}.app-install-banner strong{font-size:13px}.app-install-banner p{font-size:11px;line-height:1.6;margin:5px 0 0}.app-install-banner button{width:44px;height:44px;border:0;border-radius:13px;background:#c6da9b;font-size:26px;color:#526937;flex-shrink:0}.app-install-banner>div{flex:1;min-width:0}
.app-session-score{display:inline-flex;align-items:center;gap:5px;font-size:10px;line-height:1.2;color:#829071;white-space:nowrap}.app-session-score b:first-child{color:#8663a4}.app-session-score b:last-child{color:#597a3d}.app-session-score b{font-size:13px}.app-session-score i{font-style:normal}.app-session-score>span{font-size:8px;font-weight:400;letter-spacing:0;margin-right:2px}
html.is-app,html.is-app body{overscroll-behavior-y:none}.is-app .app-navigation{min-height:calc(56px + env(safe-area-inset-top))}.is-app .hero,.is-app .tour-section,.is-app .how-section,.is-app .creator-section,.is-app .site-footer,.is-app .install-section,.is-app .history-section,.is-app .app-install-banner,.is-app [data-app-install]{display:none}.is-app .shell{width:min(980px,calc(100% - 28px))}.is-app #home{padding-bottom:max(18px,env(safe-area-inset-bottom))}
.is-app .session-bar.session-dashboard{padding:13px 14px;border-radius:18px}.is-app .session-dashboard-header{margin:0 0 10px;align-items:center}.is-app .session-dashboard-header h2{font-size:16px;margin:0}.is-app .session-dashboard-header p,.is-app .session-eyebrow,.is-app .session-controls,.is-app .session-player-number,.is-app .session-leader,.is-app .session-player-score>span,.is-app .session-storage-status{display:none}.is-app .session-matchup{grid-template-columns:minmax(0,1fr) 26px minmax(0,1fr)}.is-app .session-player{padding:11px 12px;flex-direction:row;align-items:center;gap:9px;border-radius:12px;min-height:70px}.is-app .session-player-info{align-items:flex-start;min-width:0;gap:0}.is-app .session-player-info>strong{font-size:14px;min-height:0;text-align:left;overflow-wrap:anywhere;display:block}.is-app .session-player-score>b{font-size:38px;line-height:1}.is-app .session-player-score>b[data-digits="4"]{font-size:29px}.is-app .session-player-score>b[data-digits="5"]{font-size:24px}.is-app .session-summary{margin-top:9px;font-size:10px;justify-content:center}.is-app .session-summary b{font-size:12px}.is-app .session-dashboard .session-resume{padding-top:10px;margin-top:10px}.is-app .session-resume-heading{display:none}.is-app .session-resume-games{margin:0;gap:5px}.is-app .session-saved-game{min-height:32px;padding:5px 8px;font-size:10px}.is-app .session-saved-symbol{font-size:14px}.is-app .session-saved-more{min-height:32px}
.is-app .games-section{padding:22px 0}.is-app .section-heading{margin-bottom:13px}.is-app .section-heading .eyebrow,.is-app .section-count{display:none}.is-app .section-heading h2{font-size:22px;margin:0}.is-app .game-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.is-app .game-card{border-radius:16px}.is-app .game-cover{height:110px;padding:10px}.is-app .cover-number,.is-app .cover-tag,.is-app .cover-arrow,.is-app .game-meta,.is-app .game-info>p,.is-app .game-bottom{display:none}.is-app .game-info{padding:12px}.is-app .game-info h3{font-size:17px;line-height:1.2;min-height:36px;margin:0}.is-app .game-cover>[class$="-art"],.is-app .game-cover>.cover-strategy-art{scale:.75}.is-app .game-cover .nim-art{scale:.8}.is-app .game-cover .chess-art{scale:.8}
/* A game owns the viewport. Rules, branding and settings are available from the menu/dialogs. */
html.is-game-screen,html.is-game-screen body{height:100%;overflow:hidden;overscroll-behavior:none}body.is-playing>.app-navigation,body.is-playing>.game-seo,body.is-playing>.game-footer,body.is-playing>.skip-link{display:none}
body.is-playing #arena{display:grid;width:100%;max-width:1100px;height:100dvh;min-height:0;margin:0 auto;padding:max(8px,env(safe-area-inset-top)) max(12px,env(safe-area-inset-right)) max(8px,env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left));grid-template-columns:minmax(0,1fr);grid-template-rows:auto auto auto auto minmax(0,1fr) auto;grid-template-areas:'header' 'tour' 'score' 'status' 'board' 'result';row-gap:5px;overflow:hidden;touch-action:none;-webkit-user-select:none;user-select:none;overscroll-behavior:none}
.is-playing .arena-header{grid-area:header;gap:10px;margin:0;min-height:44px}.is-playing .arena-header>div:not(.arena-tools){text-align:center;min-width:0}.is-playing .arena-header h1{font-size:20px;line-height:1.15;margin:0}.is-playing #arena-kicker{display:none}.is-playing .back-button{min-width:44px;min-height:44px;font-size:25px}.is-playing .back-button>span{display:none}.is-playing .arena-tools{min-width:92px;gap:5px;justify-content:flex-end}.is-playing .arena-tools>.icon-button{width:40px;height:40px;font-size:18px}.is-playing .arena-tools>.app-menu-button{width:40px;height:40px;border-radius:12px}.is-playing .game-scoreboard{grid-area:score;width:min(100%,640px);justify-self:center;grid-template-columns:minmax(0,1fr) 20px minmax(0,1fr);gap:6px;margin:0}.is-playing .score-player{padding:7px 10px;gap:8px;min-height:49px;border-radius:12px}.is-playing .score-player small{display:none}.is-playing .score-player strong{font-size:12px;line-height:1.2;overflow-wrap:anywhere}.is-playing .score-player>b{font-size:25px;line-height:1.1}.is-playing .player-symbol{font-size:24px}.is-playing .game-status{grid-area:status;text-align:center;font-size:12px;line-height:1.35;margin:0;min-height:17px;align-self:center;padding:3px 0}.is-playing .tour-progress{grid-area:tour;font-size:10px;padding:0;margin:0}.is-playing #game-board{grid-area:board;width:100%;min-width:0;min-height:0;max-height:none;flex:none;display:block;position:relative;padding:0;margin:0;overflow:hidden;touch-action:none}.play-surface{position:absolute;left:50%;top:50%;display:flex;flex-direction:column;align-items:center;gap:0;transform-origin:center;transform:translate(-50%,-50%) scale(var(--surface-scale,1));width:100%;max-width:700px;flex-shrink:0}.play-surface>*{flex-shrink:0}.is-playing .arena-footnote{display:none}
.is-playing #game-result{grid-area:result;padding:8px 12px;margin:0;max-width:640px;border-radius:13px;line-height:1.2}.is-playing #game-result .eyebrow{display:none}.is-playing #game-result h2{font-size:19px;margin:0 0 4px}.is-playing #game-result p{font-size:10px;margin:0 0 4px}.is-playing #game-result .button{width:auto;min-height:36px;padding:8px 14px;font-size:12px;margin:0}.is-playing #game-result .text-button{display:inline-block;margin:5px 8px;font-size:11px}
.is-playing .chess-captured{padding:4px 7px;margin:3px 0}.is-playing .chess-captured-heading{font-size:8px}.is-playing .chess-captured-pieces{min-height:21px;gap:1px;margin-top:1px}.is-playing .chess-captured-piece{font-size:21px;min-width:18px}.is-playing .chess-tip,.is-playing .chess-log,.is-playing .strategy-note,.is-playing .bg-colour-key{display:none}.is-playing .chess-actions,.is-playing .strategy-actions{gap:8px;margin:6px 0 0}.is-playing .chess-actions .button,.is-playing .chess-actions .text-button,.is-playing .go-confirm .button{min-height:36px;padding:8px 10px;font-size:11px}.is-playing .bg-off{margin:5px 0}.is-playing .bg-off .button{min-height:34px;padding:7px 9px}.is-playing .bg-controls{gap:8px}.is-playing .go-confirm{gap:6px;margin-top:5px}.is-playing .go-confirm .button{font-size:10px}.is-playing .game-board button{touch-action:none}
.is-playing .chess-board{container-type:inline-size}.is-playing .chess-piece{font-size:clamp(16px,10cqw,58px)}.draughts-cell>.draught{position:absolute;inset:auto;left:11.5%;top:11.5%;width:77%;height:auto;aspect-ratio:1}.go-cell>.go-stone{position:absolute;inset:auto;left:7.5%;top:7.5%;width:85%;height:auto;aspect-ratio:1}
.is-playing #arena:is([data-game="chess"],[data-game="ttt"],[data-game="nim"]) .score-player>b{display:none}
.is-playing .modal{max-height:calc(100dvh - 24px);overscroll-behavior:contain;touch-action:pan-y}.is-playing .modal input{font-size:16px}.app-game-info{display:none}
@media(max-width:700px){.hero,.tour-section,.how-section,.creator-section,.install-section,.site-footer{display:none}.app-navigation{min-height:calc(58px + env(safe-area-inset-top));font-size:13px}.session-bar.session-dashboard{margin-top:4px}.games-section{padding-top:24px}.app-install-banner{margin-top:12px}.app-install-banner p{font-size:10px}.app-install-banner strong{font-size:12px}.is-app .game-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.is-app .game-cover{height:85px}.is-app .game-info{padding:10px}.is-app .game-info h3{font-size:15px}.is-app .game-cover>.cover-strategy-art{font-size:65px;scale:.65}.is-app .session-player{padding:10px 8px;gap:6px}.is-app .session-player-info>strong{font-size:12px}.is-playing .arena-header h1{font-size:18px}.is-playing .app-session-score>span{display:none}.is-playing .arena-tools{min-width:86px}.is-playing .arena-tools>.icon-button,.is-playing .arena-tools>.app-menu-button{width:38px;height:38px}}
@media(max-height:500px) and (min-width:550px){body.is-playing #arena{max-width:none;grid-template-columns:minmax(180px,27%) minmax(0,1fr);grid-template-rows:auto auto auto minmax(0,1fr);grid-template-areas:'header board' 'score board' 'status board' 'result board';column-gap:14px}.is-playing .arena-header{flex-wrap:wrap;justify-content:space-between;gap:4px}.is-playing .arena-header h1{font-size:17px}.is-playing .arena-header>div:not(.arena-tools){order:3;width:100%;padding:3px 0}.is-playing .arena-tools{min-width:80px}.is-playing .score-player{padding:7px 6px;gap:5px}.is-playing .score-player strong{font-size:10px}.is-playing .score-player>b{font-size:20px}.is-playing .player-symbol{display:none}.is-playing .game-status{font-size:11px;align-self:start}.is-playing .tour-progress{display:none}.is-playing #game-result{padding:8px;align-self:end}.is-playing #game-result h2{font-size:15px}.is-playing #game-result p{font-size:9px}.is-playing #game-result .button{font-size:11px}.is-playing .reaction-board{grid-template-columns:1fr 1fr;padding-bottom:50px;gap:10px}.is-playing .reaction-pad{height:210px}.is-playing .math-board{grid-template-columns:1fr 1fr;gap:10px}.is-playing .math-player{padding:12px}.is-playing .math-answers{grid-template-columns:1fr 1fr}.is-playing .math-board>#math-next{grid-column:1/-1}}
