/* T06: every dialog stays calm, reachable, and returns control predictably. */
dialog{box-sizing:border-box;overscroll-behavior:contain}
dialog :is(button,a,summary,select,input){min-height:44px}
dialog .close,.arcade-guide>header button{display:grid;place-items:center;min-width:44px;min-height:44px}
#help-dialog,#daily-intro,#result-dialog{width:min(560px,calc(100vw - 24px));max-height:calc(100dvh - 24px);padding:28px;overflow:auto}
#help-dialog h2,#daily-intro h2,#result-dialog h2{padding-right:44px}
#daily-intro .primary,#result-dialog .primary{width:100%;min-height:54px}
#result-dialog .result-score{margin:8px 0 4px}
#result-dialog #result-copy{margin-top:0}
/* Leave room for the focused repeat button before the Daily result detail. */
#result-dialog #again + #result-copy{margin-top:12px}
#result-dialog #save-score-status{min-height:20px;margin:10px 0 0;font-size:12px;line-height:1.45}
.result-secondary{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:12px}
.result-secondary :is(button,#result-highscores){box-sizing:border-box;width:100%;min-height:46px;margin:0}
#result-dialog #share-status{min-height:0;margin:10px 0 0}

/* The guide itself scrolls; its title and close target never disappear above it. */
.arcade-guide{padding-top:0!important;overflow:auto!important}
.arcade-guide>header,body.focus-play .arcade-guide>header{position:sticky;top:0;z-index:2;height:auto;min-height:0;margin:0 -22px 12px!important;padding:22px 22px 10px!important;background:#111b30;border-bottom:1px solid #456084!important}
.arcade-guide>header button{right:14px!important;top:9px!important;background:#111b30!important}
.arcade-guide .arcade-rules{padding-bottom:4px}

@media(max-width:420px){
 #help-dialog,#daily-intro,#result-dialog{width:calc(100vw - 16px);max-height:calc(100dvh - 16px);padding:22px 18px}
 #daily-intro p,#help-dialog p{font-size:13px;line-height:1.45}
 .result-secondary{grid-template-columns:1fr}
 #result-dialog .result-navigation{position:static}
 .arcade-guide>header{margin-inline:-18px!important;padding-inline:18px!important}
}

@media(max-height:500px) and (orientation:landscape){
 #help-dialog,#daily-intro,#result-dialog{max-height:calc(100dvh - 12px);padding-block:16px}
 #daily-intro h2,#help-dialog h2,#result-dialog h2{margin-block:6px 10px;font-size:25px}
 .arcade-guide{max-height:calc(100dvh - 12px)!important}
 .arcade-guide>header{padding-top:12px!important;padding-bottom:6px!important}
}

/* Daily introduction: one content column and a consistent action stack. */
#daily-intro{max-width:560px;text-align:left}
#daily-intro>.eyebrow{padding-right:44px}
#daily-intro h2{padding-right:0;margin:16px 0 20px;font-size:clamp(26px,5vw,35px);line-height:1.15;letter-spacing:-1px}
#daily-intro h2:focus{outline:none}
#daily-intro>p{margin:0 0 16px}
#daily-intro details{margin:0 0 16px}
#daily-intro summary{display:list-item;min-height:0;padding:10px 0;font-size:14px;line-height:24px;cursor:pointer}
#daily-intro details p{margin:8px 0 0}
#daily-intro #daily-intro-status{padding-top:16px;border-top:1px solid var(--line)}
#daily-intro :is(#daily-start,#daily-warmup){display:flex;align-items:center;justify-content:center;width:100%;min-height:48px;padding:12px 16px;margin:0;text-align:center;font-size:14px;line-height:1.4;border-radius:6px}
#daily-intro #daily-warmup{margin-top:8px;border:1px solid var(--line)}
@media(max-height:500px) and (orientation:landscape){#daily-intro h2{font-size:25px;margin:10px 0 16px}}

/* The approved record companion: 119px preview size enlarged by 10%. */
#result-highlight{display:contents}
#result-highlight.has-record{display:flex;align-items:center;justify-content:space-between;gap:12px}
#record-mascot{height:130.9px;width:auto;max-width:137.5px;object-fit:contain;flex:none}
#result-highlight.has-record .result-score{min-width:0;font-size:clamp(68px,calc(100vw - 252px),100px);letter-spacing:-.06em;overflow-wrap:anywhere}
