/* Fullscreen/focus overrides load after the shell and remain stronger than theme rules. */
.fullscreen-controls{position:sticky;top:0;z-index:35;display:flex;align-items:center;justify-content:flex-end;gap:4px;min-height:44px;padding:env(safe-area-inset-top) max(8px,env(safe-area-inset-right)) 0 max(8px,env(safe-area-inset-left));background:var(--surface,#fff);color:var(--ink,#172238);border-bottom:1px solid var(--line,#dae1e8)}
.fullscreen-controls[hidden],.fullscreen-controls [hidden]{display:none!important}
.fullscreen-label{margin-right:auto;font-size:.875rem}
.fullscreen-controls button,.fullscreen-guide header button{display:grid;place-items:center;flex:0 0 44px;width:44px;height:44px;min-height:44px;margin:0;padding:10px;border:1px solid var(--line,#dae1e8);border-radius:8px;background:var(--surface,#fff);color:var(--ink,#172238);cursor:pointer}
.fullscreen-controls svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.fullscreen-controls button:focus-visible,.fullscreen-guide button:focus-visible{outline:3px solid var(--accent,#2563eb);outline-offset:2px}
.fullscreen-controls.is-embedded{position:static;flex:0 0 auto;border:0;padding:0;background:none;min-width:0;margin-left:auto}
.fullscreen-controls.is-embedded .fullscreen-label{display:none}
html.page-immersive .app-body .app-frame{display:block!important;padding:0!important;grid-template-columns:1fr!important}
html.page-immersive .app-body .main-column{margin-left:0!important;width:100%!important;min-width:0}
html.page-immersive .app-body :is(.sidebar,.desktop-header,.mobile-header,.mobile-nav,.mobile-research-footer,.pixel-hud){display:none!important}
html.page-immersive .app-body #appMain{margin-inline:auto!important;padding:12px max(12px,env(safe-area-inset-right)) max(16px,env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left))!important;min-height:calc(100svh - 44px)}
html.page-immersive .app-body .practice-top{top:calc(44px + env(safe-area-inset-top));margin-bottom:8px}
html.page-immersive.focus-toolbar-embedded .app-body .practice-top{top:env(safe-area-inset-top)}
html.page-immersive.focus-toolbar-embedded .app-body #appMain{padding-top:max(8px,env(safe-area-inset-top))!important}
html.page-immersive .app-body .question-actions{bottom:0;padding-bottom:max(9px,env(safe-area-inset-bottom))}
html.page-immersive .app-body .memorize-controls{bottom:0;padding-bottom:max(10px,env(safe-area-inset-bottom))}
html.page-immersive .app-body .answer-sheet{top:calc(52px + env(safe-area-inset-top))}
/* Standalone windows still need notch space before focus is requested. */
html.app-standalone:not(.page-immersive) .app-body:not([data-playground-board="true"]){padding-top:env(safe-area-inset-top)}
@media(max-width:1100px){
 html.page-immersive .app-body[data-route="practice"] .practice-toolbar-ready{gap:6px}
 html.page-immersive .app-body[data-route="practice"] .practice-toolbar-ready>.fullscreen-controls{grid-column:4 / 6;grid-row:1;justify-self:end}
 html.page-immersive .app-body[data-route="practice"] .practice-toolbar-ready>.progress-track{grid-column:1 / -1;grid-row:3}
 html.page-immersive .app-body[data-route="practice"] .practice-toolbar-ready>:is(.button,.icon-button){min-height:44px}
 html.page-immersive .app-body[data-route="practice"] .practice-grid .answer-sheet{top:auto;bottom:calc(68px + env(safe-area-inset-bottom));max-height:calc(100dvh - 100px - env(safe-area-inset-top) - env(safe-area-inset-bottom))}
}
html.page-immersive .app-body[data-playground-board="true"] #appMain{padding:0!important;min-height:0!important}
html.page-immersive .app-body[data-playground-board="true"] .pg-scene-nav>span{display:none}
.fullscreen-guide{box-sizing:border-box;width:min(480px,calc(100% - 24px));max-height:calc(100dvh - 32px - env(safe-area-inset-top) - env(safe-area-inset-bottom));overflow:auto;padding:0;border:1px solid var(--line,#dae1e8);border-radius:16px;background:var(--surface,#fff);color:var(--ink,#172238);box-shadow:0 24px 80px #0003}
.fullscreen-guide::backdrop{background:#10182780}
.fullscreen-guide header{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:12px 16px;border-bottom:1px solid var(--line,#dae1e8)}
.fullscreen-guide h2{font-size:1.125rem;margin:0}
.fullscreen-guide-body{padding:4px 20px;line-height:1.7;overflow-wrap:anywhere}
.fullscreen-guide ol{padding-left:24px}
.fullscreen-guide li+li{margin-top:12px}
.fullscreen-guide-note{font-size:.875rem;color:var(--muted,#607080)}
.fullscreen-guide footer{display:flex;flex-wrap:wrap;gap:8px;padding:12px 20px 20px}
.fullscreen-guide footer button{min-height:44px;white-space:normal}

/* Keep the question and essential navigation visible; secondary tools remain one tap away. */
html.page-immersive .practice-topline .fullscreen-guide-button{display:none}
html.page-immersive:not(.focus-tools-open) .practice-topline>:is([data-toggle-marked],.practice-search,[data-reading-on],[data-open-settings],[data-toggle-sheet]){display:none!important}
html.page-immersive .memorize-toolbar{flex-wrap:wrap}
@media(max-width:1100px){
 html.page-immersive .app-body[data-route="practice"] .practice-toolbar-ready>.progress-track{grid-row:2}
 html.page-immersive .app-body[data-route="practice"] .practice-toolbar-ready>:is([data-toggle-marked],.practice-search,[data-reading-on],[data-open-settings],[data-toggle-sheet],[data-paper-finish]){grid-row:3}
}
