/* v1.1: controls occupy layout tracks, never the artwork. */
button:focus-visible,summary:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
button,summary{cursor:pointer}button:disabled{cursor:default}
.app{overflow:hidden}
.workspace{grid-template-rows:44px minmax(0,1fr) auto;min-width:0;overflow:hidden}
.canvasBar{grid-row:1;display:flex;align-items:center;gap:10px;padding:0 12px;border-bottom:1px solid #183849;background:#08141e;min-width:0}
.canvasBar .hud{position:static;transform:none;min-width:0;overflow:hidden;gap:5px}
.canvasBar .hud span{border:0;background:none;padding:0;font-size:10px;white-space:nowrap}
.canvasBar #hudPage{display:none}
.canvasStatus{font-size:11px;color:#a9c7d6;white-space:nowrap;margin-left:auto}
.canvasFit{flex-shrink:0;min-height:40px;padding:0 10px;background:transparent;border:0;border-left:1px solid #244657;color:#8eecfa;font-size:11px;font-weight:750}
.canvasFit[aria-pressed=true]{color:#dcfcff}
.stageWrap,.app:has(.sheet.open) .stageWrap{grid-row:2;padding:16px;min-width:0;min-height:0;scroll-padding:16px}
.stageShell{flex-shrink:0}
.timeline{grid-row:3}
.sheetIntro{background:none;border:0;border-bottom:1px solid #234757;border-radius:0;padding:0 0 10px;margin:0 0 12px}
.sheetIntro h3,.sheetIntroKicker{display:none}
.sheetIntro p{font-size:12px;line-height:1.45;color:#a8c3d0}
.sheetIntro .selectionState{font-size:11px;line-height:1.4;color:#c5e5ee}
.sheetBody .sectionTitle,.field label{font-size:11px;color:#aac8d6}
.sheetBody .sheetBtn,.sheetBody .toolBtn{font-size:11px;min-height:44px;padding:8px}
.prDisclosure>summary{font-size:12px;color:#cbe3ee;gap:10px}
.prDisclosure>.spacingStudio{border:0;border-top:1px solid #234c60;border-radius:0;margin:0}
.sheetBody .template{min-height:92px;max-height:120px;aspect-ratio:auto}
.sheetBody .templateName{font-size:10px}
.sheetBody .layoutBrowseSection .bigBtn{min-height:44px;font-size:11px}
.sheetBody input:not([type=range]):not([type=checkbox]):not([type=color]),.sheetBody textarea,.sheetBody select{font-size:16px}
.bottomNav .navBtn{min-height:44px}.navBtn span:nth-child(2){font-size:12px!important}.navBtn small{display:none}
@media(max-width:999px){
 .app{grid-template-columns:minmax(0,1fr)!important;grid-template-rows:auto minmax(0,1fr) auto!important}
 .topbar{grid-row:1;display:grid!important;grid-template-columns:minmax(0,1fr)!important;gap:4px!important;padding:5px 8px!important;min-height:0;z-index:20}
 .brand{min-height:32px;gap:8px}.brand .logo{width:28px;height:28px}.brand .appTitle{font-size:11px}.brand .projectName{font-size:10px;max-width:70vw}
 .controlPanel{display:grid!important;grid-template-columns:minmax(0,1fr)!important;grid-template-rows:auto auto auto;width:100%;margin:0;gap:4px}
 .controlPanelToggle{grid-row:1;min-height:44px;width:100%;padding:0 10px}.controlPanelState{margin-left:auto;font-size:10px}.controlPanelLabel{font-size:11px}
 .controlPanel .topActions{grid-row:2;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));width:100%;padding:0;border:0;gap:4px}
 .topActions>.actionBtn,.topActions>.saveStatusChip{width:100%!important;min-width:0!important;min-height:44px!important;height:44px;padding:3px!important;display:flex!important;flex-direction:column;justify-content:center;gap:2px}
 .topActions>.actionBtn b{display:block!important;font-size:10px!important}.topActions>.actionBtn span{font-size:15px}.saveWords{display:none!important}
 .controlPanel>.sheet.contextInControlPanel{grid-row:3!important;position:relative!important;inset:auto!important;transform:none!important;width:100%!important;height:0!important;min-height:0!important;max-height:0!important;display:none!important;margin:0;box-shadow:none;border:0;border-radius:12px;overflow:hidden}
 .controlPanel>.sheet.contextInControlPanel.open{display:grid!important;grid-template-rows:auto minmax(0,1fr);height:clamp(140px,29dvh,300px)!important;min-height:0!important;max-height:300px!important;visibility:visible;opacity:1;pointer-events:auto;border:1px solid #285469}
 .controlPanel>.sheet.contextInControlPanel .grip{display:none}
 .controlPanel>.sheet.contextInControlPanel .sheetHead{min-height:44px;padding:0 10px;position:relative!important;top:auto!important}
 .controlPanel>.sheet.contextInControlPanel .sheetTitle{font-size:13px;margin:0}
 .controlPanel>.sheet.contextInControlPanel .sheetBody{display:block!important;min-height:0;overflow:auto!important;padding:10px 12px;overscroll-behavior:contain}
 .controlPanel.collapsed .topActions,.controlPanel.collapsed>.sheet.contextInControlPanel{display:none!important}
 .workspace{grid-row:2;grid-template-columns:minmax(0,1fr);grid-template-rows:44px minmax(0,1fr) auto}
 .stageWrap{grid-column:1;height:auto}
 .timeline,.app:has(.sheet.open) .timeline{grid-column:1;grid-row:3;flex-direction:row;width:100%;height:54px;padding:4px 8px;border:0;border-top:1px solid #174057;overflow-x:auto;overflow-y:hidden}
 .thumb,.addPage{width:36px;height:44px;flex:0 0 36px}
 .bottomNav{grid-row:3!important;position:relative!important;inset:auto!important;transform:none!important;width:100%!important;border-radius:0;height:calc(58px + var(--safeB));padding:4px 6px calc(4px + var(--safeB));z-index:20}
 .canvasBar .hud span:not(#hudTool){display:none}
}
@media(min-width:1000px){
 .app{grid-template-columns:minmax(0,1fr) 0;grid-template-rows:auto minmax(0,1fr) auto!important;transition:none}
 .app:has(>.sheet.open){grid-template-columns:minmax(0,1fr) 360px}
 .topbar{grid-column:1/-1;grid-row:1;min-height:64px}
 .workspace{grid-column:1;grid-row:2;grid-template-columns:88px minmax(0,1fr);grid-template-rows:44px minmax(0,1fr)}
 .canvasBar{grid-column:2;grid-row:1}.stageWrap{grid-column:2;grid-row:2}
 .timeline{grid-column:1;grid-row:1/-1;width:88px;height:auto;flex-direction:column;border-right:1px solid #174057}
 .thumb,.addPage{width:64px;height:84px;flex:0 0 84px}
 .app>.sheet{display:none;position:relative;inset:auto;width:auto;height:auto;min-height:0;max-height:none;transform:none!important;border-radius:0;border:0;border-left:1px solid #285469;box-shadow:none;grid-column:2;grid-row:2/4;z-index:10}
 .app>.sheet.open{display:grid;grid-template-rows:auto minmax(0,1fr)}
 .sheet .grip{display:none}.sheetBody{min-height:0;overscroll-behavior:contain}
 .bottomNav{position:relative;inset:auto;transform:none;grid-column:1;grid-row:3;width:100%;height:64px;border-radius:0;padding:6px max(12px,calc((100% - 650px)/2));border:0;border-top:1px solid #244d62}
}
@media(max-height:600px) and (max-width:999px){
 .brand{display:none}.controlPanel>.sheet.contextInControlPanel.open{height:125px!important}.timeline,.app:has(.sheet.open) .timeline{display:none}.workspace{grid-template-rows:40px minmax(0,1fr)}
}
@media(prefers-reduced-motion:reduce){.sheet,.stageShell{transition:none!important}}

/* Keep language access in the header, clear of page thumbnails and tools. */
.brand{display:flex;flex-shrink:0;min-width:0}
.brand .prime-language-search{position:relative;inset:auto;z-index:100;margin-left:8px}
.brand .prime-language-search__trigger{min-height:44px;box-shadow:none}
.brand .prime-language-search__panel{top:calc(100% + 6px);bottom:auto;left:0}
@media(max-width:999px){.brand .titleWrap{flex:1;min-width:0}.brand .projectName{max-width:100%}.brand .prime-language-search{margin-left:auto}.brand .prime-language-search__panel{left:auto;right:0}.brand .prime-language-search__trigger{max-width:125px}}
@media(max-height:600px) and (max-width:999px){.brand{display:none}}

@media(min-width:1000px){.topbar{flex-wrap:wrap}.brand .prime-language-search__panel{left:0;right:auto}}