/* Public displays use a 1920 × 1080 layout baseline. Scale lengths, not the
   document/canvas: pointer coordinates, fullscreen and video surfaces stay native.
   Both axes constrain growth so short ultrawide windows keep usable controls. */
:root { --display-unit: 1px; }
@media (min-width: 1921px) and (min-height: 1081px) {
  :root { --display-unit: min(.052083333vw, .092592593vh); }

  /* Home: retain the agreed menu reduction while scaling its desktop baseline. */
  .home-persistent-menu {
    --sidebar-width: calc(210 * var(--display-unit));
    --home-inset-x: calc(19.2 * var(--display-unit));
    --home-inset-y: calc(25.92 * var(--display-unit));
    --home-column-gap: calc(23.04 * var(--display-unit));
  }
  .home-persistent-menu .home-brand img { max-width: 100%; }
  .home-persistent-menu .unit-nav { --menu-gap-reduction: calc(43.2 * var(--display-unit)); }
  .home-persistent-menu .unit-art { width: min(90%, calc(186 * var(--display-unit))); height: calc(169.56 * var(--display-unit)); }
  .home-persistent-menu .unit-label { font-size: calc(24.96 * var(--display-unit)); padding: calc(5 * var(--display-unit)) calc(6 * var(--display-unit)); }
  .home-fullscreen { width: calc(58 * var(--display-unit)); height: calc(58 * var(--display-unit)); }
  .home-fullscreen svg { width: 50%; height: 50%; }

  /* Shared navigation keeps its own footprint; no page-level transform/zoom. */
  .guided-tour .tour-topbar .tour-home, .campus-app .back-home, .map-page .back-home, .shelf-home {
    width: calc(72 * var(--display-unit)); height: calc(72 * var(--display-unit));
    left: calc(28 * var(--display-unit)); bottom: calc(24 * var(--display-unit));
  }
  .guided-tour .tour-topbar .tour-home svg, .campus-app .back-home svg, .map-page .back-home svg, .shelf-home svg { width: calc(32 * var(--display-unit)); height: calc(32 * var(--display-unit)); }
  .map-zoom-controls button, .map-center .map-zoom-controls button, .map-model-toolbar button {
    width: calc(44 * var(--display-unit)); height: calc(44 * var(--display-unit)); font-size: calc(24 * var(--display-unit));
  }

  .guided-tour .tour-listen-drawer {
    min-height: calc(64 * var(--display-unit)); gap: calc(16 * var(--display-unit));
    padding: calc(12 * var(--display-unit)) calc(10 * var(--display-unit)) calc(12 * var(--display-unit)) calc(24 * var(--display-unit));
    border-radius: 0 calc(20 * var(--display-unit)) calc(20 * var(--display-unit)) 0;
    font-size: calc(20 * var(--display-unit));
  }
  .guided-tour .tour-listen-drawer svg { width: calc(24 * var(--display-unit)); height: calc(28 * var(--display-unit)); }

  /* Kindergarten navigation clearance is still measured by its existing observer. */
  .guided-tour { --tour-idle-actor-height: calc(420 * var(--display-unit)); }
  .guided-tour.has-storyboard > .tour-guide .tour-guide-actor { height: calc(475.2 * var(--display-unit)); }
  .guided-tour[data-story-layout=text] > .tour-guide .tour-guide-actor { height: var(--tour-idle-actor-height); }
  .guided-tour .tour-bottom {
    width: min(calc(1400 * var(--display-unit)), calc(100% - 160 * var(--display-unit)));
    min-height: calc(112 * var(--display-unit)); bottom: calc(24.84 * var(--display-unit));
    padding: calc(10 * var(--display-unit)) calc(12 * var(--display-unit));
  }
  .guided-tour .tour-scene-card { min-height: calc(92 * var(--display-unit)); gap: calc(7 * var(--display-unit)); }
  .guided-tour .tour-scene-icon { width: calc(47 * var(--display-unit)); height: calc(47 * var(--display-unit)); border-radius: calc(17 * var(--display-unit)); }
  .guided-tour .tour-scene-icon svg { width: 70%; height: 70%; }
  .guided-tour .tour-scene-label { font-size: calc(16 * var(--display-unit)); }
  .guided-tour > #tour-ask { top: calc(16 * var(--display-unit)); right: calc(20 * var(--display-unit)); max-width: calc(420 * var(--display-unit)); padding: calc(10 * var(--display-unit)) calc(16 * var(--display-unit)); font-size: calc(14 * var(--display-unit)); }
  .guided-tour > #tour-caption .narration-caption-text { font-size: calc(25 * var(--display-unit)); }
  .guided-tour > #tour-caption[data-status=thinking] .narration-caption-text { font-size: calc(35 * var(--display-unit)); }
  .guided-tour[data-story-layout=text] .tour-detail.is-presentation[open] { width: min(calc(420 * var(--display-unit)), calc(60vw - var(--tour-idle-actor-height) * .34 - 28px)); }
  .tour-story-bubble { width: min(calc(420 * var(--display-unit)), 100%); padding: calc(20 * var(--display-unit)) calc(24 * var(--display-unit)); }
  .tour-story-bubble p { font-size: calc(24 * var(--display-unit)); }

  /* Campus: place both actors above the return-button row, at equal height. */
  .campus-guide-dock { --campus-actor-size: calc(250 * var(--display-unit)); }
  .campus-app .campus-guide-dock > .campus-guide, .point-dialog .campus-guide-dock > .campus-guide { bottom: calc(112 * var(--display-unit)); }
  .campus-guide-dock > [data-guide-card=xiaoai] { left: calc(24 * var(--display-unit)); }
  .campus-guide-dock > [data-guide-card=xiaohe] { right: calc(24 * var(--display-unit)); }
  .campus-guide-dock .campus-guide-role { font-size: calc(15 * var(--display-unit)); padding: calc(5 * var(--display-unit)) calc(10 * var(--display-unit)); }
  .campus-guide-dock #campus-caption { width: min(30vw, calc(420 * var(--display-unit))); font-size: calc(23 * var(--display-unit)); padding: calc(16 * var(--display-unit)) calc(20 * var(--display-unit)); }
  .campus-guide-dock #campus-caption .narration-caption-speaker { font-size: calc(12 * var(--display-unit)); }
  .campus-app .view-tabs { top: calc(17 * var(--display-unit)); right: calc(22 * var(--display-unit)); }
  .campus-app .map-mode-switch { top: calc(17 * var(--display-unit)); left: calc(22 * var(--display-unit)); width: min(35vw, calc(360 * var(--display-unit))); }
  .campus-app .view-tabs button, .campus-app .map-mode-switch button { min-height: calc(50 * var(--display-unit)); font-size: calc(18 * var(--display-unit)); padding: calc(8 * var(--display-unit)) calc(16 * var(--display-unit)); }
  .campus-app .view-tabs button { min-width: calc(100 * var(--display-unit)); }
  .campus-app .panorama-pin, .campus-app .map-pin.is-labeled { min-width: calc(80 * var(--display-unit)); min-height: calc(44 * var(--display-unit)); padding: calc(8 * var(--display-unit)) calc(13 * var(--display-unit)); font-size: calc(12 * var(--display-unit)); }

  /* Campus point media must scale with the display, including both width caps. */
  .campus-app:has(.campus-content-panel.is-visual-frame:not([hidden])) .tour-main-column:not([hidden]) {
    max-width: min(calc(620 * var(--display-unit)), calc(100vw - 24 * var(--display-unit)));
  }
  .campus-app .tour-main-column > .campus-content-panel.is-visual-frame {
    width: min(calc(580 * var(--display-unit)), calc(100vw - 24 * var(--display-unit)));
    max-width: min(calc(580 * var(--display-unit)), calc(100vw - 24 * var(--display-unit)));
    max-height: calc(100dvh - 120 * var(--display-unit));
    border-radius: calc(14 * var(--display-unit));
  }
  .campus-content-panel.is-visual-frame .campus-story-content { padding: calc(8 * var(--display-unit)); }
  .campus-content-panel .campus-frame-stage { gap: calc(10 * var(--display-unit)); }
  .campus-media-viewer:not(.is-expanded) .campus-frame-image,
  .campus-media-viewer:not(.is-expanded) .campus-frame-media { height: auto; max-height: 56vh; max-height: 56dvh; max-height: min(56dvh, calc(560 * var(--display-unit))); }
  .campus-content-close { width: calc(38 * var(--display-unit)); height: calc(38 * var(--display-unit)); font-size: calc(26 * var(--display-unit)); }
  .campus-media-expand, .campus-media-collapse { top: calc(10 * var(--display-unit)); right: calc(10 * var(--display-unit)); padding: calc(8 * var(--display-unit)) calc(13 * var(--display-unit)); font-size: calc(16 * var(--display-unit)); }
  .campus-media-viewer.is-expanded { padding: calc(54 * var(--display-unit)) calc(16 * var(--display-unit)) calc(16 * var(--display-unit)); }
  .campus-media-viewer.is-expanded .campus-media-collapse { font-size: calc(28 * var(--display-unit)); min-width: calc(42 * var(--display-unit)); min-height: calc(42 * var(--display-unit)); }
  .campus-frame-status { font-size: calc(16 * var(--display-unit)); }

  /* Books: let real image proportions use the space available in each shelf cell. */
  .library { padding: calc(27 * var(--display-unit)) calc(76.8 * var(--display-unit)) calc(16 * var(--display-unit)); }
  .library-header { min-height: calc(70 * var(--display-unit)); }
  .library-header h1 { font-size: calc(50 * var(--display-unit)); }
  .school-logo { width: calc(240 * var(--display-unit)); max-height: calc(73 * var(--display-unit)); }
  .shelf-scene { margin-top: calc(54 * var(--display-unit)); padding: calc(23 * var(--display-unit)) calc(50 * var(--display-unit)) 0; }
  .book-cover img { width: min(90%, calc(310 * var(--display-unit))); max-width: 94%; }
  .shelf-toolbar { min-height: calc(66 * var(--display-unit)); margin-top: calc(20 * var(--display-unit)); gap: calc(16 * var(--display-unit)); }
  .shelf-toolbar-left, .category-filters { gap: calc(11 * var(--display-unit)); }
  .category-filters button { min-width: calc(84 * var(--display-unit)); min-height: calc(50 * var(--display-unit)); padding: calc(9 * var(--display-unit)) calc(22 * var(--display-unit)); font-size: calc(23 * var(--display-unit)); }
  .age-label { gap: calc(12 * var(--display-unit)); font-size: calc(18 * var(--display-unit)); }
  .age-filter-trigger { min-width: calc(175 * var(--display-unit)); max-width: calc(230 * var(--display-unit)); min-height: calc(50 * var(--display-unit)); padding: calc(8 * var(--display-unit)) calc(15 * var(--display-unit)); }
  .shelf-footer { gap: calc(22 * var(--display-unit)); font-size: calc(20 * var(--display-unit)); }
  .shelf-turn { min-width: calc(68 * var(--display-unit)); min-height: calc(60 * var(--display-unit)); font-size: calc(40 * var(--display-unit)); }
  #shelf-page { min-width: calc(80 * var(--display-unit)); }
  .reader { padding: calc(24 * var(--display-unit)) calc(40 * var(--display-unit)); }
  .reader > header { min-height: calc(52 * var(--display-unit)); }
  .reader h2 { max-width: min(80vw, calc(860 * var(--display-unit))); font-size: calc(29 * var(--display-unit)); padding: calc(6 * var(--display-unit)) calc(46 * var(--display-unit)); }
  .reading-stage { --reader-character-width: calc(240 * var(--display-unit)); column-gap: calc(24 * var(--display-unit)); padding-left: calc(264 * var(--display-unit)); margin: calc(13 * var(--display-unit)) 0 calc(19 * var(--display-unit)); }
  .book-frame { width: min(100%, calc(780 * var(--display-unit))); padding: calc(12 * var(--display-unit)) calc(16 * var(--display-unit)) calc(15 * var(--display-unit)); }
  .book-frame.double-spread, .book-frame.wide-page { width: min(100%, calc(1480 * var(--display-unit))); max-width: calc(1480 * var(--display-unit)); }
  .soft-button { min-height: calc(56 * var(--display-unit)); padding: calc(11 * var(--display-unit)) calc(24 * var(--display-unit)); font-size: calc(20 * var(--display-unit)); }
  .reader-controls { gap: calc(22 * var(--display-unit)); }
  .auto-turn, #page-count { font-size: calc(18 * var(--display-unit)); }
  #page-count { min-width: calc(65 * var(--display-unit)); }
  .auto-turn { gap: calc(10 * var(--display-unit)); }
  .auto-turn input { width: calc(22 * var(--display-unit)); height: calc(22 * var(--display-unit)); }

  /* Street map: actor sizes and route controls share the same display baseline. */
  .character-space { --map-character-size: calc(450 * var(--display-unit)); width: min(20vw, calc(384 * var(--display-unit))); }
  .character-space-left { left: calc(153.6 * var(--display-unit)); }
  .character-space-right { right: calc(153.6 * var(--display-unit)); }
  .map-title { width: calc(146 * var(--display-unit)); font-size: calc(16 * var(--display-unit)); padding: calc(10 * var(--display-unit)); }
  #category-list button { min-height: calc(78 * var(--display-unit)); font-size: calc(18 * var(--display-unit)); }
  .map-marker { width: calc(54 * var(--display-unit)); height: calc(54 * var(--display-unit)); }
  .map-point-label { font-size: calc(16 * var(--display-unit)); }
  .map-tour-route { top: calc(100 * var(--display-unit)); left: calc(min(38vw, 550 * var(--display-unit)) + 32 * var(--display-unit)); right: auto; width: calc(280 * var(--display-unit)); padding: calc(18 * var(--display-unit)); }
  .map-tour-content { top: calc(104 * var(--display-unit)); left: calc(16 * var(--display-unit)); right: auto; width: min(38vw, calc(550 * var(--display-unit))); padding: calc(18 * var(--display-unit)); }
  .map-tour-heading h2, .map-tour-content h3 { font-size: calc(20 * var(--display-unit)); }
  .map-tour-route li button { font-size: calc(15 * var(--display-unit)); padding: calc(9 * var(--display-unit)) calc(10 * var(--display-unit)); }
  .map-tour-controls button, .map-tour-frame-controls button, .map-tour-choices button, .map-tour-heading > span, .map-tour-content-head span, .map-tour-status { font-size: calc(12 * var(--display-unit)); }
  .map-tour-frame > img, .map-tour-frame > video { height: min(23vh, calc(260 * var(--display-unit))); }
  .map-tour-frame > p { font-size: calc(19 * var(--display-unit)); }
  .map-tour-caption { max-width: calc(360 * var(--display-unit)); }
  .map-tour-caption p { font-size: calc(22 * var(--display-unit)); }
  .map-tour-caption-label { font-size: calc(12 * var(--display-unit)); }
  .point-preview { gap: calc(12 * var(--display-unit)) calc(18 * var(--display-unit)); }
  .point-preview-heading strong { font-size: calc(24 * var(--display-unit)); }
  .point-preview-close { width: calc(40 * var(--display-unit)); height: calc(40 * var(--display-unit)); font-size: calc(25 * var(--display-unit)); }
  .point-directory { padding: calc(14 * var(--display-unit)); gap: calc(10 * var(--display-unit)); }
  .point-directory-entry { font-size: calc(16 * var(--display-unit)); min-height: calc(48 * var(--display-unit)); }
  .point-directory-caption { font-size: calc(13 * var(--display-unit)); }

  /* Detail widgets use the same scale as the surrounding page. */
  .guided-tour .tour-scenes { gap: calc(20 * var(--display-unit)); }
  .tour-song-player { padding: calc(40 * var(--display-unit)); border-radius: calc(16 * var(--display-unit)); }
  .tour-song-player h2 { font-size: calc(34 * var(--display-unit)); }
  .tour-song-player .tour-song-status { font-size: calc(16 * var(--display-unit)); margin: calc(10 * var(--display-unit)) 0 calc(28 * var(--display-unit)); }
  .tour-song-player .tour-song-controls { gap: calc(16 * var(--display-unit)); }
  .tour-song-player .tour-song-controls button { min-height: calc(48 * var(--display-unit)); padding: calc(10 * var(--display-unit)) calc(20 * var(--display-unit)); font-size: calc(18 * var(--display-unit)); }
  .tour-song-seek { height: calc(6 * var(--display-unit)); min-width: calc(100 * var(--display-unit)); }
  .tour-song-seek::-webkit-slider-thumb { width: calc(20 * var(--display-unit)); height: calc(20 * var(--display-unit)); }
  .tour-song-seek::-moz-range-thumb { width: calc(20 * var(--display-unit)); height: calc(20 * var(--display-unit)); }
  .tour-song-time { font-size: calc(16 * var(--display-unit)); }
  .tour-song-lyrics { padding: calc(12 * var(--display-unit)) calc(16 * var(--display-unit)); margin-bottom: calc(24 * var(--display-unit)); }
  .tour-song-lyrics p { font-size: calc(34 * var(--display-unit)); padding: calc(12 * var(--display-unit)) calc(6 * var(--display-unit)); }
  .tour-detail[data-presentation=choices]:is([data-scene=photos], [data-scene=characters]) .tour-story-choices { gap: calc(24 * var(--display-unit)); padding: calc(12 * var(--display-unit)); }
  .tour-detail[data-presentation=choices]:is([data-scene=photos], [data-scene=characters]) .tour-story-choice { padding: calc(16 * var(--display-unit)); font-size: calc(24 * var(--display-unit)); }
  .tour-detail[data-presentation=choices]:is([data-scene=photos], [data-scene=characters]) .tour-story-choice img { height: min(25vh, calc(300 * var(--display-unit))); }

  #category-list { gap: calc(18 * var(--display-unit)); min-height: 0; overflow-y: auto; flex-shrink: 1; }
  #category-list button.category-icon { width: calc(70 * var(--display-unit)); min-height: calc(70 * var(--display-unit)); border-radius: calc(22 * var(--display-unit)); }
  .map-progress { flex-shrink: 0; padding-top: calc(18 * var(--display-unit)); font-size: calc(16 * var(--display-unit)); }
  .progress-track { height: calc(9 * var(--display-unit)); margin-top: calc(12 * var(--display-unit)); }

  .point-dialog.has-point-story { width: min(calc(1080 * var(--display-unit)), 78vw); height: min(82vh, calc(950 * var(--display-unit))); padding: calc(30 * var(--display-unit)); }
  .detail-head { gap: calc(15 * var(--display-unit)); padding-bottom: calc(18 * var(--display-unit)); }
  .detail-head h2 { font-size: calc(34 * var(--display-unit)); }
  .detail-head small { font-size: calc(14 * var(--display-unit)); }
  .detail-star { width: calc(56 * var(--display-unit)); height: calc(56 * var(--display-unit)); }
  .detail-close { width: calc(44 * var(--display-unit)); height: calc(44 * var(--display-unit)); font-size: calc(30 * var(--display-unit)); }
  .point-frame { gap: calc(16 * var(--display-unit)); margin-top: calc(20 * var(--display-unit)); }
  .point-frame-text, .detail-description, .guide-quote p { font-size: calc(21 * var(--display-unit)); }
  .point-frame-text { padding: calc(18 * var(--display-unit)) calc(20 * var(--display-unit)); }
  .point-media img, .point-media video { max-height: 52vh; }
  .point-media figcaption, .point-narration { font-size: calc(16 * var(--display-unit)); }
  .point-narration button { min-height: calc(44 * var(--display-unit)); padding: calc(8 * var(--display-unit)) calc(12 * var(--display-unit)); }
  .point-story-content .point-video-shell { min-height: min(24vh, calc(180 * var(--display-unit))); }
  .point-story-content .point-frame .point-video-shell video, .point-story-content .point-media video { max-height: 52vh; }
  .point-video-status { font-size: calc(19 * var(--display-unit)); }
  .point-work-art > img, .point-work-art video { height: min(42vh, calc(440 * var(--display-unit))); max-height: 52vh; }
  .point-work-heading h3 { font-size: calc(23 * var(--display-unit)); }
  .point-work-heading > span { font-size: calc(14 * var(--display-unit)); }
  .point-work-art figcaption { font-size: calc(19 * var(--display-unit)); }


  #puzzle-dialog { width: min(calc(1770 * var(--display-unit)), 96vw); height: min(calc(980 * var(--display-unit)), 94vh); padding: calc(13 * var(--display-unit)); }
  .puzzle-head { min-height: calc(44 * var(--display-unit)); margin-bottom: calc(10 * var(--display-unit)); }
  .puzzle-head h2 { font-size: calc(26 * var(--display-unit)); }
  .puzzle-score { font-size: calc(19 * var(--display-unit)); padding: calc(6 * var(--display-unit)) calc(12 * var(--display-unit)); }
  .puzzle-head-actions { gap: calc(12 * var(--display-unit)); }
  #restart-puzzle { min-height: calc(44 * var(--display-unit)); padding: calc(8 * var(--display-unit)) calc(16 * var(--display-unit)); font-size: calc(17 * var(--display-unit)); }
  #close-puzzle { width: calc(44 * var(--display-unit)); height: calc(44 * var(--display-unit)); font-size: calc(30 * var(--display-unit)); }
  .puzzle-regions { gap: calc(16 * var(--display-unit)); }
  .puzzle-zone { padding: calc(8 * var(--display-unit)); }
  .puzzle-zone h3 { height: calc(28 * var(--display-unit)); font-size: calc(18 * var(--display-unit)); gap: calc(6 * var(--display-unit)); margin-bottom: calc(8 * var(--display-unit)); }
  .puzzle-zone h3 span { width: calc(23 * var(--display-unit)); height: calc(23 * var(--display-unit)); font-size: calc(13 * var(--display-unit)); }

  .map-tour-dot { width: calc(22 * var(--display-unit)); height: calc(22 * var(--display-unit)); border-width: calc(3 * var(--display-unit)); }
  .map-tour-dot i { inset: calc(-9 * var(--display-unit)); border-width: calc(2 * var(--display-unit)); }
  .map-tour-dot .route-point-icon { bottom: calc(30 * var(--display-unit)); width: calc(42 * var(--display-unit))!important; height: calc(42 * var(--display-unit))!important; }
  .map-tour-controls, .map-tour-frame-controls { gap: calc(10 * var(--display-unit)); padding-top: calc(12 * var(--display-unit)); }
  .map-tour-controls button, .map-tour-frame-controls button, .map-tour-choices button, .map-tour-route > button { min-height: calc(44 * var(--display-unit)); padding: calc(10 * var(--display-unit)) calc(14 * var(--display-unit)); font-size: calc(16 * var(--display-unit)); }

  /* Secondary activities use the same display scale. */
  .find-dialog { width: min(calc(680 * var(--display-unit)), 94vw); max-height: min(80vh, calc(760 * var(--display-unit))); padding: calc(32 * var(--display-unit)); border-radius: calc(28 * var(--display-unit)); }
  .find-dialog-head { gap: calc(16 * var(--display-unit)); }
  .find-dialog h2 { font-size: calc(34 * var(--display-unit)); }
  .find-dialog p { font-size: calc(20 * var(--display-unit)); }
  .find-dialog-close { width: calc(44 * var(--display-unit)); height: calc(44 * var(--display-unit)); font-size: calc(30 * var(--display-unit)); }
  .find-choices { grid-template-columns: repeat(auto-fit, minmax(min(100%, calc(180 * var(--display-unit))), 1fr)); gap: calc(12 * var(--display-unit)); }
  .find-choice { min-height: calc(76 * var(--display-unit)); padding: calc(12 * var(--display-unit)) calc(18 * var(--display-unit)); font-size: calc(21 * var(--display-unit)); }
  .find-choice span { font-size: calc(32 * var(--display-unit)); }
  .heritage-dialog { border-radius: calc(28 * var(--display-unit)); }
  .heritage-dialog.is-list { width: min(calc(720 * var(--display-unit)), 94vw); }
  .heritage-dialog:not(.is-list) { width: min(calc(1320 * var(--display-unit)), 96vw); }
  .heritage-dialog-head { gap: calc(12 * var(--display-unit)); padding: calc(15 * var(--display-unit)) calc(24 * var(--display-unit)); }
  .heritage-dialog-head > span, .heritage-dialog-head button { font-size: calc(30 * var(--display-unit)); }
  .heritage-dialog-head h2 { font-size: calc(32 * var(--display-unit)); }
  .heritage-dialog-head button { width: calc(44 * var(--display-unit)); height: calc(44 * var(--display-unit)); }
  .heritage-dialog-content { max-height: calc(90vh - 80 * var(--display-unit)); min-height: calc(320 * var(--display-unit)); padding: calc(34 * var(--display-unit)); }
  .heritage-dialog:not(.is-list) .heritage-dialog-content { max-height: calc(94vh - 80 * var(--display-unit)); padding: calc(22 * var(--display-unit)); }
  .heritage-story-grid { grid-template-columns: repeat(auto-fit, minmax(min(100%, calc(215 * var(--display-unit))), 1fr)); gap: calc(14 * var(--display-unit)); }
  .heritage-story-card { gap: calc(12 * var(--display-unit)); padding: calc(12 * var(--display-unit)) calc(12 * var(--display-unit)) calc(16 * var(--display-unit)); }
  .heritage-story-cover { height: calc(155 * var(--display-unit)); }
  .heritage-story-card strong { font-size: calc(21 * var(--display-unit)); }
  .heritage-empty { min-height: calc(300 * var(--display-unit)); font-size: calc(20 * var(--display-unit)); }
  .heritage-empty span { font-size: calc(70 * var(--display-unit)); }
  .heritage-reader-head { gap: calc(15 * var(--display-unit)); margin-bottom: calc(12 * var(--display-unit)); }
  .heritage-reader-head h3 { font-size: calc(30 * var(--display-unit)); }
  .heritage-reader-head button, .heritage-reader-nav button { min-height: calc(44 * var(--display-unit)); padding: calc(8 * var(--display-unit)) calc(18 * var(--display-unit)); font-size: calc(18 * var(--display-unit)); }
  .heritage-reader-head .heritage-home-button { width: calc(46 * var(--display-unit)); height: calc(46 * var(--display-unit)); min-height: calc(46 * var(--display-unit)); padding: 0; }
  .heritage-home-button svg { width: calc(24 * var(--display-unit)); height: calc(24 * var(--display-unit)); }
  .heritage-frame { padding: calc(10 * var(--display-unit)); }
  .heritage-frame img, .heritage-frame video { max-height: calc(94vh - 265 * var(--display-unit)); }
  .heritage-reader-nav { gap: calc(12 * var(--display-unit)); margin-top: calc(18 * var(--display-unit)); }
  .heritage-reader-nav span { font-size: calc(18 * var(--display-unit)); }


  .campus-app .games-view { padding: calc(110 * var(--display-unit)) calc(42 * var(--display-unit)) calc(30 * var(--display-unit)); }
  .campus-app .games-intro h2 { font-size: calc(38 * var(--display-unit)); margin-bottom: calc(8 * var(--display-unit)); }
  .campus-app .game-switch { gap: calc(12 * var(--display-unit)); margin: calc(16 * var(--display-unit)) 0 calc(22 * var(--display-unit)); }
  .campus-app .game-switch button { min-height: calc(52 * var(--display-unit)); min-width: calc(105 * var(--display-unit)); font-size: calc(20 * var(--display-unit)); padding: calc(9 * var(--display-unit)) calc(17 * var(--display-unit)); }
  .campus-app .game-board, .campus-app .game-board:has(.campus-puzzle-regions) { width: min(100%, calc(1600 * var(--display-unit))); padding: calc(22 * var(--display-unit)); border-radius: calc(22 * var(--display-unit)); flex-shrink: 0; }
  .campus-app .game-status { font-size: calc(18 * var(--display-unit)); min-height: calc(26 * var(--display-unit)); }
  .campus-puzzle-score { font-size: calc(22 * var(--display-unit)); margin-top: calc(8 * var(--display-unit)); }
  .campus-puzzle-restart { font-size: calc(16 * var(--display-unit)); min-height: calc(44 * var(--display-unit)); padding: calc(8 * var(--display-unit)) calc(16 * var(--display-unit)); margin-top: calc(8 * var(--display-unit)); }
  .campus-puzzle-regions { gap: calc(16 * var(--display-unit)); margin-top: calc(16 * var(--display-unit)); }
  .campus-puzzle-zone { padding: calc(10 * var(--display-unit)); border-radius: calc(16 * var(--display-unit)); }
  .campus-puzzle-zone h3 { font-size: calc(20 * var(--display-unit)); gap: calc(8 * var(--display-unit)); margin-bottom: calc(8 * var(--display-unit)); }
  .campus-puzzle-zone h3 span { width: calc(24 * var(--display-unit)); height: calc(24 * var(--display-unit)); font-size: calc(14 * var(--display-unit)); }
  .campus-puzzle-grid { gap: calc(3 * var(--display-unit)); padding: calc(5 * var(--display-unit)); border-width: calc(5 * var(--display-unit)); }
  .campus-puzzle-reference-image { border-width: calc(5 * var(--display-unit)); }
  .campus-app .game-choices { gap: calc(24 * var(--display-unit)); margin: calc(24 * var(--display-unit)) 0; }
  .campus-app .game-choice { width: min(28%, calc(350 * var(--display-unit))); font-size: calc(20 * var(--display-unit)); }
  .campus-app .game-choice img { height: calc(210 * var(--display-unit)); }
  .campus-app .game-choice span { padding: calc(12 * var(--display-unit)); }
  .campus-app .game-success strong, .campus-puzzle-finish strong { font-size: calc(28 * var(--display-unit)); }
  .campus-app .game-success p, .campus-puzzle-finish p { font-size: calc(18 * var(--display-unit)); }
  .campus-app .game-again { min-height: calc(44 * var(--display-unit)); font-size: calc(20 * var(--display-unit)); padding: calc(9 * var(--display-unit)) calc(18 * var(--display-unit)); }
  .course-conversation[data-unit="campus"] { top: calc(16 * var(--display-unit)); max-width: calc(420 * var(--display-unit)); gap: calc(12 * var(--display-unit)); }
  .course-conversation[data-unit="campus"] .course-voice-control { padding: calc(10 * var(--display-unit)) calc(16 * var(--display-unit)); gap: calc(8 * var(--display-unit)); font-size: calc(16 * var(--display-unit)); }
  .course-conversation[data-unit="campus"] .course-voice-hint, .course-conversation[data-unit="campus"] .course-voice-status { font-size: calc(16 * var(--display-unit)); }
  .course-conversation[data-unit="campus"] .course-voice-control button { min-height: calc(36 * var(--display-unit)); }

}

/* Shared controls are added only to content videos on large displays. */
video[data-display-controls]::-webkit-media-controls { display: none !important; }
.display-video-controls {
  position: fixed; z-index: 2147483646; left: 0; top: 0; box-sizing: border-box;
  padding: calc(10 * var(--display-unit, 1px)) calc(14 * var(--display-unit, 1px));
  color: #fff; background: linear-gradient(transparent, #000c 24%); border-radius: 0 0 8px 8px;
  font: 500 calc(16 * var(--display-unit, 1px))/1.4 system-ui, sans-serif;
}
.display-video-controls[hidden] { display: none !important; }
.display-video-controls .display-video-row { display: flex; align-items: center; gap: calc(10 * var(--display-unit, 1px)); }
.display-video-controls button {
  flex: none; min-width: calc(44 * var(--display-unit, 1px)); min-height: calc(44 * var(--display-unit, 1px));
  padding: calc(6 * var(--display-unit, 1px)); border: 0; border-radius: 6px; color: #fff; background: #ffffff12; font: inherit; cursor: pointer;
}
.display-video-controls button[data-action=play], .display-video-controls button[data-action=fullscreen] { font-size: calc(24 * var(--display-unit, 1px)); }
.display-video-controls .display-video-time { flex: 1; white-space: nowrap; font: inherit; }
.display-video-controls input { min-width: 0; margin: 0; height: calc(24 * var(--display-unit, 1px)); accent-color: #a1dbb7; cursor: pointer; }
.display-video-controls .display-video-volume { width: 15%; max-width: calc(90 * var(--display-unit, 1px)); }
.display-video-controls .display-video-seek { display: block; width: 100%; }
.display-video-controls input::-webkit-slider-thumb { zoom: 1.5; }
.display-video-controls :focus-visible { outline: 2px solid #a1dbb7; outline-offset: 2px; }
[data-display-video-fullscreen]:fullscreen { width: 100vw !important; height: 100dvh !important; max-width: none !important; max-height: none !important; margin: 0 !important; padding: 0 !important; background: #000 !important; display: block !important; }
[data-display-video-fullscreen]:fullscreen > video { display: block !important; width: 100% !important; height: 100% !important; max-height: none !important; object-fit: contain !important; }
[data-display-video-fullscreen]:fullscreen > :not(video):not(.display-video-controls) { display: none !important; }

/* Map videos keep large touch controls in their own row below the picture. */
.display-video-controls.is-docked {
  position: relative; inset: auto; z-index: auto; width: 100%; min-width: 0;
  background: #243b30; border-radius: 0 0 12px 12px;
}
[data-display-video-fullscreen]:fullscreen:has(> .is-docked) { display: flex !important; flex-direction: column; }
[data-display-video-fullscreen]:fullscreen:has(> .is-docked) > video { flex: 1; min-height: 0; height: 0 !important; }
[data-display-video-fullscreen]:fullscreen > .is-docked { flex: none; }

/* Shared compact transport: one row, with most of the width given to seeking. */
.display-video-controls.is-compact { padding: calc(6 * var(--display-unit, 1px)) calc(8 * var(--display-unit, 1px)); font-size: calc(14 * var(--display-unit, 1px)); }
.display-video-controls.is-compact .display-video-row { gap: calc(8 * var(--display-unit, 1px)); }
.display-video-controls.is-compact button { min-width: calc(32 * var(--display-unit, 1px)); min-height: calc(32 * var(--display-unit, 1px)); padding: calc(4 * var(--display-unit, 1px)); background: transparent; line-height: 1; }
.display-video-controls.is-compact button:hover { background: #ffffff18; }
.display-video-controls.is-compact button[data-action=play], .display-video-controls.is-compact button[data-action=fullscreen] { font-size: calc(20 * var(--display-unit, 1px)); }
.display-video-controls.is-compact .display-video-time { flex: none; font-variant-numeric: tabular-nums; }
.display-video-controls.is-compact .display-video-seek { flex: 1; width: 0; }
.display-video-controls.is-compact .display-video-volume { flex: 0 1 calc(50 * var(--display-unit, 1px)); width: calc(50 * var(--display-unit, 1px)); }
.display-video-controls.is-compact input::-webkit-slider-thumb { zoom: 1; }
.display-video-controls.is-compact button svg { display: block; width: calc(20 * var(--display-unit, 1px)); height: calc(20 * var(--display-unit, 1px)); fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }

/* Campus popovers and their expanded view reserve a row below the video. */
.campus-media-viewer.is-expanded:has(> .is-docked){display:flex;flex-direction:column}
.campus-media-viewer.is-expanded:has(> .is-docked) > video{flex:1;min-height:0;height:0;max-height:none}
.campus-media-viewer.is-expanded > .is-docked{flex:none}