body:has(#gameApp:not([hidden])){overflow:hidden;overscroll-behavior:none}
#gameApp{position:fixed;inset:0;height:100dvh;width:100%;max-width:600px;margin: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));display:flex;flex-direction:column;gap:0;overflow:hidden}
#gameApp header{flex:none;height:40px}#gameApp header b{font-size:16px}#gameApp header b span{display:none}#gameApp header small{margin-left:auto;font-size:12px}#settingsButton{min-height:40px;font-size:13px}
#gameApp #dots{flex:none;margin:6px 0 8px;gap:4px}#gameApp #dots i{height:3px}
#gameApp #cloudStatus{position:absolute;z-index:4;top:48px;left:16px;right:16px;margin:0;border-radius:8px;background:#182329ee;padding:7px 10px;font-size:12px;pointer-events:none;opacity:0;animation:statusToast 4s ease forwards}
@keyframes statusToast{0%,75%{opacity:1}100%{opacity:0}}
#gameApp #play{display:flex;flex:1;min-height:0;flex-direction:column}#gameApp #play>.heading{flex:none;min-height:48px}#gameApp #title{font-size:22px;margin:0 0 4px}#gameApp #eyebrow{font-size:11px;margin:0 0 2px}#gameApp #clock{font-size:27px}#gameApp #hint{flex:none;font-size:13px;line-height:1.4;margin:4px 0 8px;min-height:0}
#gameApp .stage{flex:1;min-height:0;border-radius:16px}#gameApp canvas{position:absolute;inset:0;width:100%;height:100%;min-height:0}#gameApp .under{flex:none;min-height:40px;margin:2px 0;font-size:12px}#gameApp #finish{min-height:40px}#gameApp #cover{padding:16px}#gameApp #cover b{font-size:24px}#gameApp #cover p{font-size:13px;line-height:1.5;max-width:280px}#gameApp #start{font-size:16px;padding:12px 18px}
#gameApp #entry{flex:none;margin:4px 0 0}#gameApp .mode-tabs{padding:3px;border-radius:12px}#gameApp .mode-tabs button{font-size:14px;min-height:44px;padding:8px}#gameApp #chooseGame{display:none!important}
#gameApp #selectionSurface{flex:1;min-height:0!important}#gameApp #selectionSurface .heading{min-height:44px}#gameApp #selectionSurface h2{font-size:22px;margin:0}#gameApp #gamePicker{grid-template-rows:repeat(3,minmax(0,1fr));min-height:0;gap:8px}#gameApp #gamePicker button{font-size:16px;min-height:44px}#gameApp .picker-nav{padding:6px 0;flex:none}
#gameApp #rating{flex:1;min-height:0;display:flex;flex-direction:column;gap:6px}#gameApp #rating h2{font-size:22px;margin:4px 0}#gameApp #rating .accent{font-size:13px;margin:8px 0 0}#gameApp #rating .trial-score{font-size:13px;margin:0;color:#b5bfcb}#gameApp #rating>.row{gap:8px;flex:none}#gameApp #rating button{margin:0;min-height:44px;padding:8px 12px;font-size:14px}#gameApp #rating fieldset{margin:12px 0 0}#gameApp #rating legend{font-size:16px;margin-bottom:10px}#gameApp .scores{grid-template-columns:repeat(6,minmax(0,1fr));gap:7px}#gameApp .scores button{padding:0;min-height:44px}#gameApp .ends{margin-top:6px;font-size:12px}#gameApp #gameNote{height:90px;min-height:48px;resize:none;margin:4px 0;font-size:16px}#gameApp #next{margin:8px 0 0}#ratingSteps{margin-top:auto;padding:8px 0;flex:none}#ratingStepLabel{display:block;color:#a9b4c5;font-size:12px;margin-bottom:8px}#ratingSteps .row{justify-content:space-between}
#settingsDialog{background:#151820;color:#edf2f4;border:1px solid #454b5b;border-radius:16px;padding:20px;width:min(440px,calc(100vw - 24px));max-height:85dvh;overflow:auto}#settingsDialog::backdrop{background:#000b}.dialog-heading{display:flex;align-items:center;justify-content:space-between;gap:16px}.dialog-heading h2{font-size:22px;margin:0}#settingsDialog #wallet{display:flex}#settingsDialog #modeHelp{font-size:14px;line-height:1.7}#settingsDialog footer{font-size:13px}#settingsDialog #sound{min-height:44px}#accountDialog{max-height:85dvh}
#gameApp.keyboard-open header,#gameApp.keyboard-open #dots,#gameApp.keyboard-open #entry,#gameApp.keyboard-open #rating>.accent,#gameApp.keyboard-open #rating>h2,#gameApp.keyboard-open #rating>.row,#gameApp.keyboard-open .trial-score{display:none}#gameApp.keyboard-open #gameNote{height:64px}#gameApp.keyboard-open #rating{overflow:auto}
@media(orientation:landscape) and (max-height:520px){#gameApp{max-width:980px}#gameApp #play{display:grid;grid-template-columns:minmax(150px,1fr) minmax(250px,2fr);grid-template-rows:auto 1fr auto;gap:4px 14px}#gameApp #play>.heading{grid-column:1;grid-row:1}#gameApp #hint{grid-column:1;grid-row:2}#gameApp .under{grid-column:1;grid-row:3}#gameApp .stage{grid-column:2;grid-row:1/4}#gameApp #cover p{display:none}#gameApp #cover b{margin-bottom:12px}#gameApp #rating{display:grid;grid-template-columns:minmax(150px,1fr) minmax(250px,2fr);grid-template-rows:auto auto 1fr;gap:4px 14px}#gameApp #rating>.accent,#gameApp #rating>.trial-score{display:none}#gameApp #rating>h2{grid-column:1;grid-row:1}#gameApp #rating>.row{grid-column:1;grid-row:2}#gameApp #rating>fieldset{grid-column:2;grid-row:1/4}#gameApp #rating>label{grid-column:2;grid-row:1}#gameApp #rating>#gameNote{grid-column:2;grid-row:2}#gameApp #rating>#next{grid-column:2;grid-row:3;align-self:end}#gameApp #ratingSteps{grid-column:1;grid-row:3;align-self:end}}
@media(max-height:520px){#gameApp header{height:32px}#gameApp #play>.heading{min-height:35px}#gameApp #eyebrow{display:none}#gameApp #hint{font-size:12px;margin:2px 0 5px}#gameApp #cover b{font-size:19px}#gameApp #cover p{margin:5px 0}#gameApp #rating h2{font-size:18px}#gameApp #rating .trial-score{display:none}#gameApp #rating fieldset{margin:2px 0}#gameApp #rating legend{margin:0 0 4px}#gameApp .scores{gap:4px}#gameApp #rating>.row button{min-height:36px}#gameApp #gameNote{height:56px}#ratingSteps{padding:3px 0}#ratingStepLabel{margin-bottom:2px}}
