/* All rules are opt-in screen chrome; library and printed pages keep existing CSS. */
@media screen {
  body.maker-workspace-active { padding:0; overflow:hidden; }
  body.maker-workspace-active>.app-shell { display:none!important; }
  .zg-maker-workspace[hidden] { display:none!important; }
  .zg-maker-workspace {
    --mw-surface:#fff; --mw-canvas:#f8f5ff; --mw-ink:#181818; --mw-muted:#696174;
    --mw-accent:#7545e8; --mw-line:#e6e0ee;
    position:fixed; inset:0; height:100vh; height:100dvh; color:var(--mw-ink);
    background:var(--mw-canvas); overflow:hidden; z-index:100; font-family:Inter,system-ui,sans-serif;
  }
  .dark-mode .zg-maker-workspace { --mw-surface:#2a2336; --mw-canvas:#211b2c; --mw-ink:#f6f1ff; --mw-muted:#bcb2ce; --mw-accent:#bca1ff; --mw-line:#463953; }
  .zg-maker-workspace-scroll { height:100%; min-height:0; overflow:hidden; padding:0; }
  .zg-maker-workspace .maker-engine.has-maker-rail { grid-template-columns:84px minmax(0,1fr); }
  .zg-maker-workspace .maker-engine.has-maker-rail>.maker-workspace-rail { grid-column:1; grid-row:1; }
  .zg-maker-workspace .maker-engine.has-maker-rail>.zg-maker-layout { grid-column:2; grid-row:1; }
  .zg-maker-workspace .maker-engine.has-maker-rail>.maker-workspace-dock { grid-column:1/-1; grid-row:2; }
  .zg-maker-workspace .maker-engine.zg-ws-editor.has-maker-rail>.ws-studio-header { grid-column:1/-1; grid-row:1; }
  .zg-maker-workspace .maker-engine.zg-ws-editor.has-maker-rail>.maker-workspace-rail { grid-column:1; grid-row:2; }
  .zg-maker-workspace .maker-engine.zg-ws-editor.has-maker-rail>.ws-workspace { grid-column:2; grid-row:2; }
  .zg-maker-workspace .maker-engine.zg-ws-editor.has-maker-rail>.ws-action-dock { grid-column:1/-1; grid-row:3; }
  .zg-maker-workspace .maker-workspace-rail {
    display:flex; flex-direction:column; align-items:stretch; gap:4px; min-height:0;
    padding:8px 6px; overflow-y:auto; overflow-x:hidden; overscroll-behavior:contain;
    background:var(--mw-surface); border-right:1px solid var(--mw-line);
  }
  .zg-maker-workspace .maker-rail-link {
    display:flex; flex:none; flex-direction:column; align-items:center; justify-content:center;
    gap:5px; min-height:64px; padding:8px 3px; color:var(--mw-muted);
    font:500 11px/1.25 Inter,system-ui,sans-serif; text-align:center; text-decoration:none;
    border-radius:8px; overflow-wrap:anywhere; transition:background-color 150ms,color 150ms;
  }
  .zg-maker-workspace .maker-rail-link>.ph { font-size:22px; line-height:1; color:var(--mw-accent); }
  .zg-maker-workspace .maker-rail-home { margin-bottom:8px; }
  .zg-maker-workspace .maker-rail-link:hover { color:var(--mw-accent); background:var(--mw-canvas); }
  .zg-maker-workspace .maker-rail-link[aria-current=page] { color:var(--mw-accent); background:var(--mw-canvas); font-weight:600; }
  .zg-maker-workspace .maker-rail-link:focus-visible { outline:3px solid var(--mw-accent); outline-offset:-3px; }
  @media(max-width:1000px) {
    .zg-maker-workspace .maker-engine.has-maker-rail { grid-template-columns:minmax(0,1fr); grid-template-rows:64px minmax(0,1fr) auto; }
    .zg-maker-workspace .maker-engine.has-maker-rail>.zg-maker-layout { grid-column:1/-1; grid-row:2; }
    .zg-maker-workspace .maker-engine.has-maker-rail>.maker-workspace-dock { grid-row:3; }
    .zg-maker-workspace .maker-engine.zg-ws-editor.has-maker-rail { grid-template-rows:auto 64px minmax(0,1fr) auto; }
    .zg-maker-workspace .maker-engine.zg-ws-editor.has-maker-rail>.maker-workspace-rail { grid-column:1/-1; }
    .zg-maker-workspace .maker-engine.zg-ws-editor.has-maker-rail>.ws-workspace { grid-column:1/-1; grid-row:3; }
    .zg-maker-workspace .maker-engine.zg-ws-editor.has-maker-rail>.ws-action-dock { grid-row:4; }
    .zg-maker-workspace .maker-workspace-rail {
      flex-direction:row; gap:4px; padding:3px 6px; min-width:0; overflow-x:auto; overflow-y:hidden;
      border-right:0; border-bottom:1px solid var(--mw-line); scrollbar-width:thin;
    }
    .zg-maker-workspace .maker-rail-link { width:76px; min-height:52px; padding:3px; gap:3px; }
    .zg-maker-workspace .maker-rail-link>.ph { font-size:20px; }
    .zg-maker-workspace .maker-rail-home { width:56px; margin-bottom:0; margin-right:4px; }
  }
  @media(prefers-reduced-motion:reduce) { .zg-maker-workspace .maker-rail-link { transition:none; } }
  .zg-maker-workspace #makerView { width:100%; max-width:none; height:100%; min-height:0; margin:0; padding:0; }
  .zg-maker-workspace .lesson-view-shell { max-width:none; width:100%; padding:0; gap:0; }
  .zg-maker-workspace #makerEngineShell { margin:0; padding:20px 24px 32px; border:0; border-radius:0; background:transparent; box-shadow:none; }
  .zg-maker-workspace #makerView:not(.zg-ws-active) .lesson-view-header { min-height:76px; padding:14px 24px; display:flex; align-items:center; gap:22px; border-bottom:1px solid var(--mw-line); background:var(--mw-surface); margin:0; }
  body.dark-mode .zg-maker-workspace #makerView:not(.zg-ws-active) .lesson-view-header { background:var(--mw-surface); border-bottom:1px solid var(--mw-line); }
  .zg-maker-workspace .lesson-view-titleblock { flex:1; min-width:0; }
  .zg-maker-workspace .lesson-view-kicker { display:none; }
  .zg-maker-workspace .maker-title-row { display:flex; align-items:center; gap:18px; }
  .zg-maker-workspace #makerView:not(.zg-ws-active) .lesson-view-header { position:sticky; top:0; z-index:10; }
  .zg-maker-workspace #makerView:not(.zg-ws-active) .maker-title-row .lesson-view-title { flex:1; }
  .zg-maker-workspace .lesson-view-title { font:700 25px/1.3 Poppins,Inter,system-ui,sans-serif; letter-spacing:-.8px; color:var(--mw-ink); margin:0; }
  .zg-maker-workspace .maker-title-actions { margin-left:auto; display:flex; gap:8px; align-items:center; }
  .zg-maker-workspace .maker-workspace-back,.zg-maker-workspace .maker-workspace-theme {
    min-height:44px; min-width:44px; display:inline-flex; align-items:center; justify-content:center; gap:8px;
    padding:8px 10px; border:0; border-radius:5px; background:transparent; color:var(--mw-accent); cursor:pointer;
    font:600 12px/1.4 Inter,system-ui,sans-serif; flex:none; box-shadow:none;
  }
  .zg-maker-workspace .maker-workspace-back,.zg-maker-workspace .maker-workspace-theme { width:44px; padding:8px; }
  .zg-maker-workspace .maker-workspace-back i,.zg-maker-workspace .maker-workspace-theme i { font-size:20px; }
  .zg-maker-workspace .maker-workspace-back:hover,.zg-maker-workspace .maker-workspace-theme:hover { background:var(--mw-canvas); }
  .zg-maker-workspace .maker-workspace-back:focus-visible,.zg-maker-workspace .maker-workspace-theme:focus-visible { outline:3px solid var(--mw-accent); outline-offset:2px; }
  .zg-maker-workspace .maker-workspace-brand { display:block; color:var(--mw-accent); font:800 16px/1 Poppins,Inter,system-ui,sans-serif; letter-spacing:-.5px; }
  .zg-maker-workspace .maker-help-wrap { z-index:20; }
  .zg-maker-workspace .lesson-view-header .maker-help-btn { background:transparent; color:var(--mw-accent); border-color:var(--mw-line); }
  .zg-maker-workspace .zg-maker-right { top:16px; }
  .zg-maker-workspace .maker-engine-section { scroll-margin-bottom:24px; }
  /* The other six editors keep their existing controls, cards and preview renderers. */
  .zg-maker-workspace #makerView:not(.zg-ws-active) .maker-lesson-row { min-width:0; }
  .zg-maker-workspace #makerView:not(.zg-ws-active) .maker-lesson-row select { min-width:0; }
  .zg-maker-workspace #makerView:not(.zg-ws-active) .maker-export-buttons { flex-wrap:wrap; }
  .zg-maker-workspace #makerView:not(.zg-ws-active) .maker-engine-section { scroll-margin-top:110px; }
  /* Release the approved Word Search workspace from its former app padding/chrome. */
  .zg-maker-workspace #makerView.zg-ws-active #makerEngineShell { padding:0; }
  .zg-maker-workspace .maker-engine.zg-ws-editor { border:0; border-radius:0; min-height:0; }
  .zg-maker-workspace .maker-engine.zg-ws-editor .ws-studio-header { gap:20px; }
  .zg-maker-workspace .maker-engine.zg-ws-editor .ws-header-actions { display:flex; align-items:center; gap:4px; }
  .zg-maker-workspace .maker-engine.zg-ws-editor .ws-action-dock { padding-bottom:calc(8px + env(safe-area-inset-bottom,0px)); }
  @media(max-width:1100px) {
    .zg-maker-workspace .maker-engine.zg-ws-editor .ws-studio-header { gap:12px; padding-inline:14px; }
    .zg-maker-workspace .maker-workspace-back span { display:none; }
  }
  @media(max-width:760px) {
    .zg-maker-workspace-scroll { scrollbar-gutter:auto; }
    .zg-maker-workspace #makerView:not(.zg-ws-active) .lesson-view-header { padding:10px 12px; gap:10px; flex-wrap:nowrap; align-items:flex-start; }
    .zg-maker-workspace .maker-workspace-brand { font-size:13px; margin:3px 0; }
    .zg-maker-workspace .lesson-view-titleblock { flex-basis:auto; }
    .zg-maker-workspace #makerView:not(.zg-ws-active) .maker-title-row { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:3px 8px; }
    .zg-maker-workspace #makerView:not(.zg-ws-active) .maker-title-actions { grid-column:2; grid-row:1; }
    .zg-maker-workspace #makerView:not(.zg-ws-active) .maker-engine-section { scroll-margin-top:156px; }
    .zg-maker-workspace .lesson-view-title { font-size:23px; }
    .zg-maker-workspace #makerEngineShell { padding:14px 12px calc(20px + env(safe-area-inset-bottom,0px)); }
    .zg-maker-workspace .zg-maker-layout { grid-template-columns:minmax(0,1fr); }
    .zg-maker-workspace .zg-maker-right { position:static; }
    .zg-maker-workspace .maker-engine-section { min-width:0; }
    .zg-maker-workspace #makerView:not(.zg-ws-active) .maker-controls~.maker-row .btn,
    .zg-maker-workspace #makerView:not(.zg-ws-active) .maker-export-buttons .btn { min-height:44px; }
    .zg-maker-workspace .maker-preview-header { min-width:0; }
    .zg-maker-workspace .maker-engine.zg-ws-editor { scroll-margin-top:0; }
    .zg-maker-workspace .maker-engine.zg-ws-editor .ws-studio-header { min-height:72px; display:grid; grid-template-columns:minmax(0,1fr) auto; gap:2px 8px; padding:10px 12px; }
    .zg-maker-workspace .maker-engine.zg-ws-editor .ws-brand { grid-column:1; grid-row:1; font-size:13px; letter-spacing:-.5px; padding:0; border:0; }
    .zg-maker-workspace .maker-engine.zg-ws-editor .ws-brand small { display:none; }
    .zg-maker-workspace .maker-engine.zg-ws-editor .ws-identity { grid-column:1; grid-row:2; }
    .zg-maker-workspace .maker-engine.zg-ws-editor .ws-tool-title { font-size:20px; }
    .zg-maker-workspace .maker-engine.zg-ws-editor .maker-help-panel { top:76px; }
    .zg-maker-workspace .maker-engine.zg-ws-editor .ws-header-actions { grid-column:2; grid-row:1/span 2; gap:0; }
  }
  @media(prefers-reduced-motion:reduce) { .zg-maker-workspace * { scroll-behavior:auto!important; } }
}

/* Persistent rows size themselves; desktop panels scroll separately, narrow layouts share one flow. */
@media screen {
  .zg-maker-workspace, .zg-maker-workspace * { box-sizing:border-box; }
  .zg-maker-workspace .lesson-view-shell { height:100%; min-height:0; display:grid; grid-template-rows:auto minmax(0,1fr); overflow:hidden; }
  .zg-maker-workspace #makerEngineShell { min-height:0; height:100%; padding:0; overflow:hidden; }
  .zg-maker-workspace .maker-engine { min-height:0; height:100%; display:grid; grid-template-rows:minmax(0,1fr) auto; gap:0; overflow:hidden; }
  .zg-maker-workspace #makerView:not(.zg-ws-active) .lesson-view-header { position:relative; }
  .zg-maker-workspace .zg-maker-layout { min-height:0; height:100%; padding:20px 24px; align-items:stretch; overflow:hidden; }
  .zg-maker-workspace .zg-maker-left { min-height:0; display:flex; flex-direction:column; gap:18px; }
  .zg-maker-workspace .zg-maker-left>section { flex:none; scroll-margin:0; }
  .zg-maker-workspace .zg-maker-right { position:static; top:auto; min-height:0; height:100%; display:flex; flex-direction:column; }
  .zg-maker-workspace .zg-maker-preview { flex:1; min-height:0; height:auto; max-height:none; overflow:hidden; display:flex; flex-direction:column; }
  .zg-maker-workspace [data-workspace-panel] { min-width:0; min-height:0; overflow-y:auto; overflow-x:hidden; overscroll-behavior:contain; scrollbar-gutter:stable; scroll-padding:8px; }
  .zg-maker-workspace #makerView:not(.zg-ws-active) [data-workspace-panel=editor] { padding-right:10px; }
  .zg-maker-workspace [data-workspace-panel]:focus-visible { outline:2px solid var(--mw-accent); outline-offset:-3px; }
  .zg-maker-workspace [data-workspace-panel] .maker-list { max-height:none; overflow:visible; }
  .zg-maker-workspace #makerView [data-workspace-panel] textarea.maker-textarea { min-height:min(150px,var(--mw-field-height,150px)); max-height:var(--mw-field-height,none); transition-property:color,background-color,border-color,box-shadow; }
  .zg-maker-workspace .maker-preview-header { flex:none; }
  .zg-maker-workspace .maker-preview-warning { flex:none; max-height:25%; overflow:auto; }
  .zg-maker-workspace .maker-workspace-dock { display:flex; align-items:center; gap:12px; background:var(--mw-surface); color:var(--mw-ink); border-top:1px solid var(--mw-line); padding:10px 24px calc(10px + env(safe-area-inset-bottom,0px)); }
  .zg-maker-workspace .maker-workspace-dock>.maker-row { display:flex; gap:8px; flex:none; margin:0; }
  .zg-maker-workspace .maker-workspace-dock>section { flex:1; min-width:0; display:flex; align-items:center; flex-wrap:wrap; justify-content:flex-end; gap:6px 12px; border:0; background:transparent; box-shadow:none; padding:0; margin:0; }
  .zg-maker-workspace .maker-workspace-dock .maker-section-title { display:none; }
  .zg-maker-workspace .maker-workspace-dock .maker-export-controls { display:flex; align-items:center; gap:8px; }
  .zg-maker-workspace .maker-workspace-dock .maker-export-controls input { width:60px; min-width:0; }
  .zg-maker-workspace .maker-workspace-dock .maker-export-buttons { display:flex; flex-wrap:nowrap; gap:8px; margin:0; }
  .zg-maker-workspace .maker-workspace-dock .maker-print-tip { flex-basis:100%; text-align:right; margin:0; font-size:11px; }
  .zg-maker-workspace [data-workspace-dock] button { min-height:44px; }
  /* The vocabulary stylesheet can load after this shell during maker switches.
     Keep its standalone flex layout from overriding dedicated workspace Grid. */
  .zg-maker-workspace .maker-engine.zg-ws-editor { display:grid; grid-template-rows:auto minmax(0,1fr) auto; }
  .zg-maker-workspace .maker-engine.zg-ws-editor .ws-studio-header { grid-row:1; }
  .zg-maker-workspace .maker-engine.zg-ws-editor .ws-workspace { grid-row:2; }
  .zg-maker-workspace .maker-engine.zg-ws-editor .ws-action-dock { grid-row:3; }
  .zg-maker-workspace #makerView.zg-ws-active .lesson-view-shell { grid-template-rows:minmax(0,1fr); }
  .zg-maker-workspace .maker-engine.zg-ws-editor .ws-studio-header { position:relative; flex:none; z-index:10; }
  .zg-maker-workspace .maker-engine.zg-ws-editor .ws-workspace { min-height:0; height:100%; overflow:hidden; align-items:stretch; }
  .zg-maker-workspace .maker-engine.zg-ws-editor .ws-editing-rail { min-height:0; }
  .zg-maker-workspace .maker-engine.zg-ws-editor .ws-preview { position:relative; top:auto; height:100%; min-height:0; max-height:none; }
  .zg-maker-workspace .maker-engine.zg-ws-editor .ws-action-dock { position:relative; bottom:auto; z-index:8; }
  .zg-maker-workspace .maker-engine.zg-ws-editor .maker-preview-pages { margin-block:auto; }
  .zg-maker-workspace .maker-engine.zg-ws-editor .ws-output-actions { display:flex; }
  .zg-maker-workspace .maker-help-panel { max-height:min(60dvh,480px); overflow:auto; }
  @media(max-width:1000px) {
    .zg-maker-workspace #makerView:not(.zg-ws-active) .zg-maker-layout { display:block; padding:14px 12px; }
    .zg-maker-workspace #makerView:not(.zg-ws-active) [data-workspace-flow] { overflow-y:auto; overflow-x:hidden; overscroll-behavior:contain; }
    .zg-maker-workspace #makerView:not(.zg-ws-active) [data-workspace-panel] { height:auto; overflow:visible; }
    .zg-maker-workspace #makerView:not(.zg-ws-active) .zg-maker-right { height:auto; margin-top:18px; }
    .zg-maker-workspace #makerView:not(.zg-ws-active) .zg-maker-preview { flex:none; overflow:visible; }
  }
  @media(max-width:760px) {
    .zg-maker-workspace [data-workspace-panel] { scrollbar-gutter:auto; }
    .zg-maker-workspace .maker-workspace-dock { display:grid; gap:6px; padding:8px 12px calc(8px + env(safe-area-inset-bottom,0px)); }
    .zg-maker-workspace .maker-workspace-dock>.maker-row { justify-content:stretch; }
    .zg-maker-workspace .maker-workspace-dock>.maker-row button:first-child { flex:1; }
    .zg-maker-workspace .maker-workspace-dock>section { justify-content:space-between; gap:6px; }
    .zg-maker-workspace .maker-workspace-dock .maker-print-tip { text-align:left; font-size:10px; }
    .zg-maker-workspace .maker-engine.zg-ws-editor .ws-workspace { display:block; flex:initial; overflow-y:auto; overflow-x:hidden; overscroll-behavior:contain; }
    .zg-maker-workspace .maker-engine.zg-ws-editor .ws-editing-rail { height:auto; overflow:visible; }
    .zg-maker-workspace .maker-engine.zg-ws-editor .ws-preview { height:auto; border-top:1px solid var(--ws-line); }
    .zg-maker-workspace .maker-engine.zg-ws-editor .maker-preview { flex:none; height:auto; overflow:visible; display:block; container-type:normal; }
    .zg-maker-workspace .maker-engine.zg-ws-editor .maker-preview-pages { width:100%; margin:0; }
    .zg-maker-workspace .maker-engine.zg-ws-editor .ws-output-actions { display:flex; justify-content:space-between; }
    .zg-maker-workspace .maker-engine.zg-ws-editor .ws-action-dock { padding:8px 12px calc(8px + env(safe-area-inset-bottom,0px)); gap:6px; }
    .zg-maker-workspace .maker-engine.zg-ws-editor .ws-generate-actions>[data-maker-action] { display:inline-flex; align-items:center; justify-content:center; }
    .zg-maker-workspace .maker-engine.zg-ws-editor .ws-mobile-pagination:has(.maker-preview-navigation:not([hidden])) { display:block; }
    .zg-maker-workspace .maker-engine.zg-ws-editor .maker-preview-header { flex-wrap:wrap; }
  }
  /* Extremely short landscape/keyboard viewports keep actions reachable in one horizontal strip. */
  @media(max-width:360px) {
    .zg-maker-workspace .maker-workspace-dock .maker-export-controls { flex-direction:column; align-items:flex-start; gap:2px; }
    .zg-maker-workspace .maker-workspace-dock .maker-export-controls input { width:48px; }
    .zg-maker-workspace .maker-workspace-dock .maker-export-controls label { font-size:10px; }
  }
  .zg-maker-workspace[data-workspace-compact=true] [data-workspace-dock] { display:flex; flex-direction:row; flex-wrap:nowrap; align-items:center; gap:10px; max-height:96px; overflow-x:auto; overflow-y:auto; padding:6px 12px; }
  .zg-maker-workspace[data-workspace-compact=true] [data-workspace-dock]>* { flex:none; }
  .zg-maker-workspace[data-workspace-compact=true] .maker-workspace-dock>section { flex:none; flex-wrap:nowrap; }
  .zg-maker-workspace[data-workspace-compact=true] .maker-workspace-dock .maker-print-tip { flex-basis:auto; }
  .zg-maker-workspace[data-workspace-compact=true] [data-workspace-dock] :is(.ws-feedback,.maker-print-tip) { width:240px; white-space:normal; font-size:10px; }
  .zg-maker-workspace[data-workspace-compact=true] .ws-mobile-pagination .maker-preview-navigation { width:auto; }
  .zg-maker-workspace[data-workspace-compact=true] #makerView:not(.zg-ws-active) .lesson-view-header { min-height:0; padding-block:4px; }
  .zg-maker-workspace[data-workspace-compact=true] .maker-workspace-brand { font-size:11px; margin-block:1px; }
  .zg-maker-workspace[data-workspace-compact=true] .lesson-view-title { font-size:18px; line-height:1.2; }
  .zg-maker-workspace[data-workspace-compact=true] .zg-maker-layout { padding:6px 12px; }
  .zg-maker-workspace[data-workspace-compact=true] .zg-maker-preview { padding:8px; gap:4px; }
  .zg-maker-workspace[data-workspace-compact=true] .maker-preview { padding:2px 4px; }
  .zg-maker-workspace[data-workspace-compact=true] .maker-engine.zg-ws-editor .ws-preview { padding:4px 8px; gap:4px; }
  .zg-maker-workspace[data-workspace-compact=true] .maker-engine.zg-ws-editor .ws-preview-bottom { min-height:0; }
  .zg-maker-workspace[data-workspace-compact=true] .maker-engine.zg-ws-editor .ws-preview-note { max-width:none; font-size:9px; line-height:1.2; }
  .zg-maker-workspace[data-workspace-compact=true] .maker-engine.zg-ws-editor .maker-preview-warning { max-height:24px; }
  .zg-maker-workspace[data-workspace-compact=true] .maker-engine.zg-ws-editor .ws-preview-note { display:none; }
  @supports(overflow:clip) {
    .zg-maker-workspace, .zg-maker-workspace .zg-maker-workspace-scroll,
    .zg-maker-workspace .lesson-view-shell, .zg-maker-workspace #makerEngineShell,
    .zg-maker-workspace .maker-engine { overflow:clip; }
  }
  .zg-maker-workspace [data-workspace-flow]:focus-visible { outline:2px solid var(--mw-accent); outline-offset:-3px; }
}
