/* The same paper, artwork and canvas coordinates, reflowed for a hand-held screen. */
@media (max-width:1000px), (pointer:coarse) and (max-width:1366px) {
  :root { --compact-height:calc(100dvh - env(safe-area-inset-top) - env(safe-area-inset-bottom)); --compact-width:calc(100vw - env(safe-area-inset-left) - env(safe-area-inset-right)); }
  body { font-size:16px; overscroll-behavior:none; }
  .stage-viewport { padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left); }
  .original-stage { position:relative; inset:auto; width:100%; height:100%; transform:none; --mobile-fold:var(--scroll-fold); }
  .outcome-presentation { --mobile-fold:var(--outcome-fold); }
  .scroll-paper,.outcome-presentation .scroll-paper {
    inset:8px 2px; clip-path:inset(0 calc(2.6455% + 47.3545% * var(--mobile-fold)));
    mask:linear-gradient(to bottom,transparent 3%,#000 4.2%,#000 96%,transparent 98%);
    -webkit-mask:linear-gradient(to bottom,transparent 3%,#000 4.2%,#000 96%,transparent 98%);
  }
  .scroll-roll-rod { top:8px; bottom:8px; height:auto; width:calc((100% - 4px) * .042328); }
  .scroll-roll-rod:before { background-size:2362.5% 100%; }
  .roll-left { left:2px; --rod-mask:url('/assets/ui/scroll-rod-left-mask-mobile-v1.svg'); }
  .roll-right { right:2px; --rod-mask:url('/assets/ui/scroll-rod-right-mask-mobile-v1.svg'); }
  .roll-left,.outcome-presentation .roll-left { transform:translateX(calc(var(--compact-width) * .456 * var(--mobile-fold))); }
  .roll-right,.outcome-presentation .roll-right { transform:translateX(calc(var(--compact-width) * -.456 * var(--mobile-fold))); }
  .outcome-presentation .scroll-roll-rod:after { top:5%; bottom:3%; left:48%; width:2px; }
  .outcome-gold-burst { width:100%; height:100%; }
  .scroll-interior,.outcome-presentation .scroll-interior {
    inset:calc(8px + (100% - 16px) * .086) 28px calc(8px + (100% - 16px) * .105); padding:0 2px 12px; display:flex; flex-direction:column; gap:12px;
    clip-path:inset(0 calc(50% * var(--mobile-fold))); overflow-x:hidden; overflow-y:auto;
    overscroll-behavior:contain; scrollbar-width:thin; scrollbar-color:#ad9f7b66 transparent;
    -webkit-overflow-scrolling:touch;
  }
  .scroll-rise-window,.scroll-slide-window { clip-path:inset(8.6% 24px 10.5%); }
  #app[data-scroll-state=rising-replace] .scroll-interior { transform:translateY(100dvh); }
  .inside-heading { position:relative; inset:auto; width:100%; height:44px; flex:none; padding:0; gap:6px; }
  .scroll-section-title { font-size:25px; letter-spacing:3px; margin-left:4px; }
  .scroll-home,.options-toggle { width:44px; height:44px; flex:none; }
  .scroll-home svg,.options-toggle svg { width:23px; height:23px; }
  .inside-heading .scroll-options { top:45px; width:220px; padding:8px 15px; max-height:calc(var(--compact-height) - 170px); overflow-y:auto; }
  .inside-heading .scroll-options button { font-size:17px; min-height:44px; padding:8px 4px; }
  button,a,input { touch-action:manipulation; }
  .primary,.secondary { min-height:44px; padding:10px 14px; gap:10px; font-size:17px; letter-spacing:2px; }
  button svg { width:22px; height:22px; }
  .eyebrow,.side-label { font-size:13px; line-height:1.6; letter-spacing:2px; }
  .tabs { gap:16px; flex-wrap:wrap; }
  .tabs button { min-height:44px; font-size:15px; line-height:1.4; padding:8px 0; white-space:nowrap; }
  #toast { position:fixed; left:50%; bottom:70px; width:calc(100% - 76px); min-width:0; max-width:560px; font-size:15px; padding:12px; }
  .book-view,.library-screen .book-view,.choices-screen .book-view { position:relative; inset:auto; width:100%; flex:1; min-height:0; }
  .book-heading,.choices-screen .book-heading { height:auto; min-height:52px; gap:12px; }
  .book-heading h1,.choices-screen .book-heading h1 { font-size:25px; letter-spacing:3px; }
  .book-heading>button,.book-heading>span { font-size:14px; min-height:44px; flex:none; }
  .empty { padding:35px 10px; font-size:17px; }

  /* The menu's accompanying text is always available to a finger. */
  .home-screen .home-copy { position:relative; inset:auto; width:100%; margin:0; z-index:1; }
  .home-logo { width:220px; height:220px; margin:0 auto; }
  .home-verse { font-size:17px; line-height:1.8; letter-spacing:2px; text-align:center; }
  .home-screen .home-invitation { width:100%; margin-top:24px; gap:10px; }
  .home-invitation .home-menu-item { width:100%; min-height:62px; padding:10px 12px; gap:10px; border-bottom:1px solid var(--line); }
  .home-invitation .home-menu-item .home-menu-label { flex:0 0 96px; font-size:21px; letter-spacing:2px; }
  .home-invitation .home-menu-item .home-menu-detail { opacity:1; transform:none; color:#86755e; font-size:13px; line-height:1.7; white-space:normal; flex-wrap:wrap; gap:0 6px; }
  .home-invitation .home-menu-item .home-ordeal-number { font-size:13px; letter-spacing:1px; }
  .home-invitation .home-menu-detail::before { display:none; }
  .home-invitation .home-menu-item:is(:hover,:focus-visible,:active) .home-menu-detail { color:inherit; }
  .home-landscape { left:0; top:0; width:100%; height:240px; opacity:.27; mask-image:linear-gradient(to bottom,#000,transparent); -webkit-mask-image:linear-gradient(to bottom,#000,transparent); }

  /* Browsing keeps six paintings in portrait; a short landscape shows three. */
  .library-screen .book-view { display:flex; flex-direction:column; gap:20px; }
  .library-screen .chapter-grid { flex:1; grid-template-columns:repeat(2,minmax(0,1fr)); grid-template-rows:repeat(3,minmax(150px,1fr)); gap:18px 14px; padding:4px; }
  .library-screen .library-card { grid-template-rows:minmax(78px,1fr) 27px 38px; gap:4px; outline-offset:4px; }
  .library-screen .library-title { max-width:100%; gap:5px; justify-content:center; }
  .library-screen .library-title h3 { font-size:18px; line-height:27px; letter-spacing:1px; }
  .library-screen .canonical-seal { position:static; transform:rotate(-3deg); flex:none; font-size:10px; line-height:15px; letter-spacing:1px; padding:0 2px; }
  .library-screen .library-card>p { font-size:12px; line-height:19px; white-space:normal; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; }
  .pagination,.solution-pager { position:relative; inset:auto; width:100%; min-height:44px; height:auto; flex:none; gap:10px; font-size:15px; display:flex; justify-content:space-between; }
  .pagination button,.solution-pager button { min-height:44px; padding:8px 4px; }
  .pagination span { letter-spacing:1px; white-space:nowrap; }

  /* The paper coordinate space stays 1920 by 1080; only its CSS box changes. */
  .original-tools { position:static; width:100%; flex:none; flex-direction:row; justify-content:center; gap:8px; order:1; }
  .original-tools>span { font-size:14px; letter-spacing:2px; }
  .original-tools>i { width:1px; height:25px; border:0; border-left:1px solid var(--line); margin:0 2px; }
  .tool-item { position:static; }
  .tool { width:44px; height:44px; }
  .tool svg { width:27px; height:27px; }
  .tool-palette { left:0; right:0; top:106px; width:auto; max-width:380px; max-height:calc(100% - 118px); overflow-y:auto; padding:16px; font-size:15px; }
  .palette-title { font-size:21px; padding-bottom:8px; }
  .palette-title button { width:44px; height:44px; }
  .pen-presets { margin:10px 0; gap:8px; }
  .pen-preset { padding:6px 3px; }
  .pen-preset .writing-brush { height:54px; width:24px; }
  .pen-preset strong { font-size:17px; letter-spacing:1px; }
  .pen-preset>span,.tool-size-label,.palette-subtitle { font-size:14px; }
  .pen-sample { height:22px; }
  .tool-palette input[type=range] { height:44px; margin:3px 0 8px; }
  .tool-palette .colors { gap:5px; padding:5px; flex-wrap:wrap; }
  .swatch { width:44px; height:44px; border:7px solid #f1e9d6; box-shadow:0 0 0 1px #a79b7b77; }
  .eraser-presets { margin:10px 0; }
  .clear-ink { min-height:44px; font-size:17px; padding-top:8px; }
  .clear-note { font-size:13px; }
  .drawing-screen .play-canvas,.ending-screen .painting-view,.exhibition-art,.solution-art {
    position:relative; inset:auto; width:100%; height:auto; aspect-ratio:16/9; flex:none; order:2;
  }
  .canvas-shell { position:absolute; inset:0; width:100%; height:100%; }
  .ink { touch-action:none; -webkit-user-select:none; user-select:none; -webkit-touch-callout:none; }
  .art-actions { position:relative; inset:auto; width:100%; height:44px; flex:none; gap:8px; order:3; margin-top:-10px; }
  .art-icon { width:44px; height:44px; }
  .art-icon svg { width:23px; height:23px; }
  .art-icon span { bottom:44px; font-size:13px; }
  .story-aside,.final-inscription,.exhibition-inscription,.solution-inscription { position:relative; inset:auto; width:100%; height:auto; flex:none; order:4; padding:0 3px 6px; }
  .story-aside h1,.final-inscription h1,.exhibition-inscription h1,.solution-inscription h2 { font-size:26px; line-height:1.4; letter-spacing:2px; margin:6px 0 12px; }
  .story-aside .original-story,.final-story,.exhibition-story,.solution-inscription>p { font-size:16px; line-height:1.8; }
  .story-aside .side-label { font-size:13px; line-height:1.6; margin-bottom:6px; }
  .story-aside .chapter-goal { margin-top:16px; padding-top:12px; }
  .story-aside .chapter-goal>p,.exhibition-goal { font-size:17px; line-height:1.65; }
  .story-aside .hint-button { min-height:44px; margin-top:8px; font-size:15px; }
  .story-aside #chapter-hint { margin-top:0; font-size:15px; }
  .story-aside .submit { margin-top:18px; font-size:18px; min-height:48px; }
  .ending-screen .result-view-switch { position:relative; inset:auto; order:1; }
  .outcome-title-row { gap:8px; }
  .outcome-title-row .outcome-seal { width:76px; height:76px; flex-basis:76px; margin-top:0; }
  .final-inscription .ending-poem { margin-top:14px; padding-top:10px; }
  .final-inscription .ending-poem p,.exhibition-poem,.solution-poem { font-size:19px; line-height:1.65; letter-spacing:2px; margin-top:8px; }
  .final-inscription .ending-actions { margin-top:20px; gap:10px; }
  .final-inscription .ending-actions button,.final-inscription .ending-actions .secondary { min-height:46px; font-size:17px; padding:10px 6px; }
  .compare-slider { touch-action:none; }
  .painting-action-group { grid-template-columns:minmax(0,1fr) 44px; }
  .story-aside>.painting-action-group { margin-top:18px; }
  .painting-action-group .painting-stop-button { width:44px; height:44px; min-width:44px; min-height:44px; }
  .painting-action-group .painting-stop-confirm { width:100%; padding:12px; }
  .painting-action-group .painting-stop-confirm-title { font-size:20px; }
  .painting-action-group .painting-stop-confirm-note { font-size:15px; }
  .painting-action-group .painting-stop-confirm .painting-stop-choice { font-size:16px; }
  .painting-stage-badge { right:12px; bottom:10px; min-height:35px; padding:3px 8px 3px 4px; font-size:13px; letter-spacing:1px; }
  .painting-phase-symbol { width:28px; height:28px; flex-basis:28px; }
  .reason-view { position:relative; inset:auto; width:100%; grid-template-columns:1fr; gap:20px; }
  .reason-view img { height:auto; aspect-ratio:16/9; }
  .reason-view h1 { font-size:25px; margin:10px 0; }
  .reason-view aside>p:not(.eyebrow) { font-size:17px; line-height:1.75; }
  .reason-view .side-label { margin-top:16px; }
  .reason-actions { margin-top:18px; }
  .reason-actions button { font-size:17px; min-height:44px; }

  .exhibition-title { position:relative; inset:auto; width:100%; font-size:11px; gap:8px; letter-spacing:0; }
  .exhibition-title>.eyebrow { font-size:11px; letter-spacing:1px; }
  .exhibition-tabs { position:relative; inset:auto; gap:12px; flex-wrap:nowrap; }
  .exhibition-tabs button { font-size:13px; }
  .exhibition-film-tab { gap:1px; }
  .exhibition-film-download { width:32px; height:44px; }
  .exhibition-film-download svg { width:18px; height:18px; }
  .exhibition-art #exhibit-seal { right:8px; bottom:6px; width:66px; height:66px; }
  .exhibition-author { min-height:48px; font-size:22px; margin-bottom:12px; padding-bottom:8px; }
  .exhibition-author small { font-size:12px; }
  .exhibition-pager { position:relative; inset:auto; width:100%; height:auto; order:3; grid-template-columns:minmax(0,1fr) auto minmax(0,1fr); gap:7px; font-size:14px; }
  .exhibition-pager button { width:100%; min-height:58px; padding:6px; gap:1px; flex-direction:column; align-items:center; text-align:center; justify-content:center; }
  .exhibition-pager button:last-child { justify-content:center; text-align:center; }
  .exhibition-pager button span { font-size:15px; letter-spacing:1px; }
  .exhibition-pager strong { max-width:100%; font-size:12px; letter-spacing:0; }
  .exhibition-count { min-width:54px; padding:6px; font-size:15px; letter-spacing:0; }
  .exhibition-projection { position:relative; inset:auto; width:100%; height:auto; aspect-ratio:20/9; flex:none; order:1; }
  .exhibition-film-transport { position:relative; inset:auto; width:100%; height:44px; gap:12px; font-size:13px; order:2; }
  .exhibition-film-transport .film-play-toggle,.film-transport .film-play-toggle { width:44px; height:44px; min-width:44px; flex-basis:44px; }
  .exhibition-film-transport input,.film-transport input { height:32px; min-width:0; }

  .choices-grid { grid-template-columns:1fr; margin-top:18px; gap:16px; }
  .relay-choice { height:auto; grid-template-rows:22px auto 32px auto 36px; gap:8px; padding:14px; }
  .relay-choice .choice-type { font-size:13px; line-height:22px; letter-spacing:3px; }
  .relay-choice .thumb,.relay-choice .new-ordeal-art { height:auto; aspect-ratio:16/9; }
  .relay-choice h3 { font-size:25px; line-height:32px; letter-spacing:2px; }
  .relay-choice>p { font-size:16px; line-height:1.7; }
  .relay-choice .choice-check,.relay-choice .choice-retry { font-size:16px; min-height:36px; line-height:26px; }
  .choice-confirm-row { position:sticky; inset:auto; bottom:0; margin-top:16px; padding:12px 0 0; height:auto; background:var(--paper) var(--paper-art) center/700px auto; }
  .choice-confirm-row .primary { width:100%; min-height:48px; font-size:17px; }
  .signature-view { position:relative; inset:auto; width:100%; grid-template-columns:1fr; gap:24px; }
  .signature-preview { height:auto; aspect-ratio:16/9; width:100%; }
  .signature-preview canvas { width:68px; height:68px; right:8px; bottom:7px; }
  .signature-view h1 { font-size:30px; margin:8px 0 18px; letter-spacing:4px; }
  .signature-view label { font-size:15px; margin-bottom:6px; }
  .signature-view #player-name { font-size:27px; line-height:1.5; padding:9px 3px; letter-spacing:3px; }
  .signature-view #player-name::placeholder { font-size:17px; }
  .signature-view .signature-next { font-size:14px; margin-top:12px; letter-spacing:2px; }
  .signature-actions { margin-top:20px; gap:10px; }
  .signature-actions .primary { font-size:18px; min-height:48px; }
  .signature-view .signature-actions .signature-back-links button[type=button] { min-height:44px; font-size:15px; }
  .film-view { position:relative; inset:auto; width:100%; height:auto; display:flex; flex-direction:column; gap:14px; }
  .film-heading { position:relative; inset:auto; width:100%; height:auto; min-height:44px; font-size:13px; gap:8px; }
  .film-title { gap:8px; }
  .film-heading .eyebrow { font-size:14px; letter-spacing:1px; }
  #film-phase { font-size:12px; letter-spacing:0; }
  .film-download-control { width:44px; height:44px; }
  .film-retry { font-size:14px; min-height:44px; letter-spacing:0; }
  .film-view canvas { position:relative; inset:auto; width:100%; height:auto; aspect-ratio:20/9; }
  .film-transport { position:relative; inset:auto; width:100%; height:44px; gap:10px; font-size:12px; }
  #film-clock { white-space:nowrap; }
  .film-next-button { position:relative; inset:auto; width:auto; align-self:flex-end; min-height:48px; padding:10px 18px; flex-direction:row-reverse; gap:10px; }
  .film-next-label { writing-mode:horizontal-tb; font-size:17px; line-height:1.5; letter-spacing:2px; }
  .film-next-arrow,.film-next-arrow svg { width:23px; height:23px; }
  .film-actions,#film-status { position:relative; inset:auto; width:100%; height:auto; font-size:15px; flex-wrap:wrap; }
  .film-actions .primary { min-height:44px; font-size:17px; }

  .solutions-heading { position:relative; inset:auto; width:100%; gap:10px; }
  .solutions-heading h1 { font-size:25px; letter-spacing:3px; }
  .solutions-heading>button { min-height:44px; font-size:14px; }
  .solution-filters,.solution-art-tabs { position:relative; inset:auto; gap:15px; }
  .solution-filters button,.solution-art-tabs button { font-size:14px; }
  .solution-pager { order:3; }
  .solution-inscription small { font-size:12px; }
  .settings-view,.settings-confirm { position:relative; inset:auto; width:100%; }
  .settings-view h1,.settings-confirm h1 { font-size:27px; letter-spacing:3px; margin:8px 0 18px; }
  .settings-intro,.settings-confirm>p,.settings-confirm .settings-note { font-size:16px; line-height:1.8; margin:14px 0; }
  .settings-row { flex-direction:column; align-items:stretch; gap:16px; padding:20px 0; }
  .settings-row h2 { font-size:21px; }
  .settings-row p { font-size:16px; }
  .settings-row small { font-size:13px; }
  .settings-row button { font-size:17px; min-width:0; }
  .settings-back { position:relative; inset:auto; font-size:16px; min-height:44px; }
  .settings-confirm-actions { gap:12px; margin-top:20px; }
  .settings-confirm-actions button { font-size:16px; min-width:0; flex:1; }
  .journey-grid { grid-template-columns:1fr; grid-template-rows:none; gap:10px; margin-top:16px; }
  .journey-entry { min-height:48px; gap:12px; }
  .journey-entry h3 { font-size:20px; }
  .error-view { position:relative; inset:auto; width:100%; font-size:17px; }
}

/* A landscape phone keeps the artwork still while its story can be scrolled. */
@media (max-width:1000px) and (orientation:landscape), (pointer:coarse) and (max-width:1366px) and (orientation:landscape) {
  .scroll-interior,.outcome-presentation .scroll-interior { inset:34px 34px 48px; gap:10px; padding-bottom:0; }
  .scroll-rise-window,.scroll-slide-window { clip-path:inset(30px 28px 44px); }
  .home-screen .home-copy { display:grid; grid-template-columns:minmax(160px,1fr) minmax(300px,1.4fr); column-gap:25px; align-items:center; }
  .home-logo { width:190px; height:190px; grid-area:1/1; }
  .home-verse { grid-area:2/1; font-size:14px; letter-spacing:1px; }
  .home-screen .home-invitation { grid-area:1/2/3/3; margin-top:0; gap:7px; }
  .home-landscape { width:65%; left:0; height:100%; }
  .library-screen .chapter-grid { grid-template-columns:repeat(3,minmax(0,1fr)); grid-template-rows:repeat(2,minmax(170px,1fr)); }
  .drawing-screen .scroll-interior,.ending-screen .scroll-interior {
    display:grid; grid-template-columns:44px minmax(0,1fr) minmax(190px,28%); grid-template-rows:44px minmax(0,1fr) 44px; gap:8px 12px; overflow:hidden;
  }
  .drawing-screen .inside-heading,.ending-screen .inside-heading { grid-area:1/1/2/4; }
  .drawing-screen .original-tools { grid-area:2/1/4/2; width:44px; flex-direction:column; gap:4px; align-self:start; }
  .drawing-screen .original-tools>span,.drawing-screen .original-tools>i { display:none; }
  .drawing-screen .play-canvas { grid-area:2/2; width:min(100%,calc((var(--compact-height) - 192px) * 16 / 9)); align-self:center; justify-self:center; }
  .drawing-screen .art-actions { grid-area:3/2; margin:0; width:min(100%,calc((var(--compact-height) - 192px) * 16 / 9)); justify-self:center; }
  .drawing-screen .story-aside,.ending-screen .final-inscription { grid-area:2/3/4/4; height:100%; min-height:0; overflow-y:auto; overscroll-behavior:contain; padding:0 5px 2px; scrollbar-width:thin; }
  .drawing-screen .story-aside h1,.ending-screen .final-inscription h1 { font-size:22px; }
  .drawing-screen .story-aside .original-story,.ending-screen .final-story { font-size:15px; line-height:1.7; }
  .drawing-screen .story-aside .submit,.drawing-screen .story-aside>.painting-action-group { position:sticky; bottom:0; flex-shrink:0; z-index:8; }
  .drawing-screen .tool-palette { top:48px; left:55px; right:auto; width:min(330px,calc(100% - 60px)); max-height:calc(100% - 50px); }
  .ending-screen .scroll-interior { grid-template-columns:0 minmax(0,1fr) minmax(210px,29%); grid-template-rows:44px minmax(0,1fr) 44px; }
  .ending-screen .result-view-switch { grid-area:1/2; gap:20px; justify-self:center; z-index:46; }
  .ending-screen .result-view-switch button { min-height:36px; padding:5px 0; }
  .ending-screen .painting-view { grid-area:2/2; width:min(100%,calc((var(--compact-height) - 192px) * 16 / 9)); align-self:center; justify-self:center; }
  .ending-screen .art-actions { grid-area:3/2; margin:0; width:min(100%,calc((var(--compact-height) - 192px) * 16 / 9)); justify-self:center; }
  .ending-screen .final-inscription { grid-area:2/3/4/4; }
  .ending-screen .outcome-title-row .outcome-seal { width:60px; height:60px; flex-basis:60px; }
  .ending-screen .final-inscription .ending-poem p { font-size:17px; }
  .ending-screen .final-inscription .ending-actions { position:sticky; bottom:0; flex-shrink:0; margin-top:16px; gap:8px; padding-top:8px; background:var(--paper) var(--paper-art) center/700px auto; z-index:8; }
  .ending-screen .final-inscription .ending-actions button { font-size:15px; letter-spacing:0; gap:6px; padding-inline:4px; white-space:nowrap; }
  .ending-screen .final-inscription .ending-actions button svg { width:18px; height:18px; }
  .reason-view,.signature-view { grid-template-columns:minmax(0,1.6fr) minmax(230px,1fr); gap:24px; }
  .signature-view { align-items:start; }
  .signature-view h1 { font-size:25px; margin:6px 0 14px; }
  .signature-view #player-name { font-size:23px; }
  .signature-actions { margin-top:14px; }
  .choices-grid { grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; }
  .relay-choice { padding:10px; grid-template-rows:22px auto 30px minmax(80px,1fr) 36px; }
  .relay-choice h3 { font-size:21px; line-height:30px; letter-spacing:1px; }
  .relay-choice>p { font-size:14px; }
  .choice-confirm-row .primary { width:auto; }
  .exhibition-screen .scroll-interior { display:grid; grid-template-columns:minmax(0,1fr) minmax(200px,29%); grid-template-rows:44px minmax(0,1fr) 54px; gap:8px 22px; overflow:hidden; }
  .exhibition-screen .inside-heading { grid-area:1/1/2/3; }
  .exhibition-title { display:none; }
  .exhibition-tabs { position:absolute; top:0; left:220px; right:50px; height:44px; width:auto; z-index:46; }
  .exhibition-tabs button { min-height:40px; }
  .exhibition-art { grid-area:2/1; width:min(100%,calc((var(--compact-height) - 198px) * 16 / 9)); justify-self:center; align-self:center; }
  .exhibition-inscription { grid-area:2/2; height:100%; min-height:0; overflow-y:auto; overscroll-behavior:contain; }
  .exhibition-inscription h1 { font-size:22px; }
  .exhibition-story { font-size:15px; }
  .exhibition-poem { font-size:17px; }
  .exhibition-pager { grid-area:3/1/4/3; align-self:end; }
  .exhibition-pager button { min-height:48px; flex-direction:row; gap:10px; }
  .exhibition-projection { grid-area:2/1/3/3; width:min(100%,calc((var(--compact-height) - 242px) * 20 / 9)); justify-self:center; align-self:center; }
  .exhibition-film-screen .scroll-interior { grid-template-rows:44px minmax(0,1fr) 44px 54px; }
  .exhibition-film-screen .exhibition-film-transport { grid-area:3/1/4/3; }
  .exhibition-film-screen .exhibition-pager { grid-area:4/1/5/3; }
  .film-screen .scroll-interior { overflow:hidden; }
  .film-screen .film-view { flex:1; min-height:0; display:grid; grid-template-columns:minmax(0,1fr) 58px; grid-template-rows:minmax(0,1fr); gap:12px; }
  .film-heading { position:absolute; top:-54px; left:56px; width:190px; min-height:44px; z-index:46; }
  .film-screen #film-phase { display:none; }
  .film-view canvas { grid-area:1/1; width:min(100%,calc((var(--compact-height) - 146px) * 20 / 9)); justify-self:center; align-self:center; }
  .film-transport { position:absolute; left:260px; right:60px; top:-54px; width:auto; z-index:46; }
  .film-next-button { grid-area:1/2; width:54px; height:auto; min-height:172px; padding:10px 8px; flex-direction:column; align-self:center; justify-self:end; }
  .film-next-label { writing-mode:vertical-rl; font-size:16px; letter-spacing:2px; }
}
@media (max-width:1000px) and (orientation:landscape) and (max-height:599px), (pointer:coarse) and (max-width:1366px) and (orientation:landscape) and (max-height:599px) {
  .library-screen .chapter-grid { grid-template-rows:minmax(140px,1fr); }
  .library-screen .book-view { gap:12px; }
  .choices-screen .book-view { display:flex; flex-direction:column; }
  .choices-screen .book-heading { position:absolute; top:-54px; left:56px; right:50px; min-height:44px; height:44px; z-index:46; }
  .choices-screen .book-heading .eyebrow { display:none; }
  .choices-screen .book-heading h1 { font-size:23px; }
  .choices-screen .choices-grid { flex:1; min-height:0; margin-top:0; grid-template-rows:minmax(0,1fr); }
  .choices-screen .relay-choice { height:100%; min-height:0; grid-template-rows:16px minmax(45px,1fr) 26px 38px 26px; gap:3px; padding:7px 10px; }
  .choices-screen .relay-choice .choice-type { font-size:11px; line-height:16px; }
  .choices-screen .relay-choice .thumb,.choices-screen .relay-choice .new-ordeal-art { height:100%; min-height:0; aspect-ratio:auto; }
  .choices-screen .relay-choice h3 { font-size:19px; line-height:26px; }
  .choices-screen .relay-choice>p { font-size:12px; line-height:19px; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
  .choices-screen .relay-choice .choice-check,.choices-screen .relay-choice .choice-retry { font-size:13px; min-height:26px; padding:1px 6px; line-height:24px; }
  .choices-screen .choice-confirm-row { position:relative; flex:none; height:44px; min-height:44px; margin-top:8px; padding:0; border:0; background:none; }
  .choices-screen .choice-confirm-row .primary { min-height:44px; height:44px; }
}