/* Shared cinema UI: scene first, one task at upper left, one caption and action row. */
:root{--ui-ink:#f4ead2;--ui-muted:#d6c6a5;--ui-rule:#d6bc8277;--ui-title:clamp(24px,2.15vw,32px);--ui-body:clamp(21px,1.85vw,28px);--ui-hint:clamp(16px,1.25vw,19px);--ui-action:clamp(18px,1.5vw,22px)}
#game header{padding:16px 4%;align-items:center;gap:16px;z-index:12;font-size:16px;letter-spacing:1px;color:var(--ui-ink);text-shadow:0 2px 7px #000b}
#game header .brand{font-size:18px;white-space:nowrap}
#game header .brand small{font-size:16px;color:var(--ui-muted)}
#game header>div{display:flex;align-items:center;gap:10px}
#game header button{font-size:16px;min-height:44px;padding:8px 12px;letter-spacing:1px}
#game #objective{top:96px;left:4%;right:4%;max-width:760px;padding-left:16px;border-left:1px solid #d1aa73;font:400 var(--ui-title)/1.45 var(--ink);letter-spacing:2px;color:var(--ui-ink);text-shadow:0 2px 8px #000d;z-index:6}
#game #objective small{display:block;font:400 var(--ui-hint)/1.7 'PingFang SC','Microsoft YaHei',sans-serif;max-width:680px;margin-top:7px;letter-spacing:.5px;color:var(--ui-muted);opacity:1}
#game #subtitle{font-size:var(--ui-body);line-height:1.65;color:var(--ui-ink);letter-spacing:.6px;text-shadow:0 2px 8px #000d;max-width:1000px;margin:0 auto}
#game #subtitle small{font-size:var(--ui-hint);line-height:1.5;color:var(--ui-muted);letter-spacing:1px;margin-bottom:7px;opacity:1}
#game #controls{flex-wrap:wrap;gap:12px 24px;align-items:center;left:5%;right:5%;bottom:48px}
#game #controls button,.light-controls>button,.light-puzzle-actions button,.reunion-controls>button{font-size:var(--ui-action);line-height:1.55;min-height:48px;padding:10px 16px;letter-spacing:1px;color:var(--ui-ink);background:transparent;border:0;border-bottom:1px solid var(--ui-rule);border-radius:0;text-shadow:0 1px 5px #0008}
#game:not(.chapter-snow):not(.chapter-light):not(.chapter-reunion) #subtitle{bottom:calc(var(--story-control-height,50px) + 68px);left:8%;right:8%}
#game .bottomline{font-size:14px;line-height:1.5;letter-spacing:1px;bottom:14px;color:#d6c6a5d9}
#game .hotspot{font-size:18px;line-height:1.5;letter-spacing:1px}
#game .crosshair{display:none}
#game .shade{background:linear-gradient(180deg,#08100c99 0,transparent 32%,transparent 58%,#08100cc9 100%)}
#game .light-heading h2,#game .reunion-heading h2{font:400 var(--ui-title)/1.45 var(--ink);letter-spacing:2px;color:var(--ui-ink);margin:0;text-shadow:0 2px 7px #000c}
#game .light-heading p,#game .reunion-heading p{font:400 var(--ui-hint)/1.7 'PingFang SC','Microsoft YaHei',sans-serif;letter-spacing:.5px;color:var(--ui-muted);margin:7px 0 0;text-shadow:0 2px 6px #000b}
#game .light-narration p,#game .reunion-narration p{font-size:var(--ui-body);line-height:1.65;letter-spacing:.6px;color:var(--ui-ink);text-shadow:0 2px 8px #000d}
#game .light-narration small,#game .reunion-narration small{font-size:var(--ui-hint);line-height:1.5;color:var(--ui-muted);margin-bottom:7px;text-shadow:0 2px 6px #000c}
#game .light-controls,#game .reunion-controls{gap:12px 24px}
#game .light-footer,#game .reunion-footer{gap:16px}
#game .light-puzzle-feedback,#game .light-card-bank button,#game .light-puzzle-actions button{font-size:18px;line-height:1.6}
#game .reunion-hold-hint,#game .reunion-sources,#game .reunion-timeline p{font-size:var(--ui-hint);line-height:1.65;color:var(--ui-muted)}
#game .reunion-controls .reunion-hold{font-size:var(--ui-action);border:0;border-bottom:1px solid #e0c58c;min-height:48px;background:#d3b5760b}
#game.chapter-snow #snow-dock #subtitle{font-size:var(--ui-body);line-height:1.65;max-width:900px}
#game.chapter-snow #snow-dock #subtitle small{font-size:var(--ui-hint);line-height:1.5}
#game.chapter-snow #snow-dock #controls button{font-size:var(--ui-action);min-height:48px;line-height:1.5;padding:10px 16px}
#game.chapter-snow #snow-dock .snow-route-quick button,#game.chapter-snow #snow-dock .snow-rope-buttons button{background:transparent;border:0;border-bottom:1px solid var(--ui-rule);border-radius:0}
#game.chapter-snow #snow-dock .snow-route-quick button{max-width:180px}
#game.chapter-snow .snow-rope-status{width:min(100%,480px);height:48px}
#game.chapter-snow .snow-rope-status .snow-rope-meter small,#game.chapter-snow .snow-rope-status .snow-rope-progress small,#game.chapter-snow .snow-rope-control small{font-size:15px;line-height:1.5}
#game.chapter-snow #snow-dock .snow-rope-control{height:58px;width:min(100%,480px)}
#game.chapter-snow #snow-dock .snow-rope-buttons{width:min(100%,480px)}
#game .snow-search-progress{font-size:17px}
#hotspots .snow-route-regions button{font-size:18px}
/* Inspection typography belongs to the same scale, including auxiliary copy. */
#game dialog .close{font-size:16px;min-height:44px}
#game .prop-hint,#game .book-gesture{font-size:15px;line-height:1.6;color:#e0d1b2}
#game .object-target span{font-size:17px;line-height:1.5}
#game .physical-book-nav button,#game .physical-book-nav #book-sources{font-size:16px;opacity:1;line-height:1.5}
#game .source-document,#game .source-document p{font-size:17px;line-height:1.9}
#game .sheet-date{font-size:clamp(15px,4cqw,19px)}
#game .sheet-lines p{font-size:clamp(16px,5.1cqw,24px)}
#game .sheet-number{font-size:15px}
#game #cover .edition span,#game #cover #resume,#game .cover-bottom{font-size:15px;line-height:1.6;opacity:1}
#game #cover .start{font-size:20px}
/* Landscape uses the scene itself as the stage, like the prologue/chapter 1. */
@media(min-aspect-ratio:6/5){
 #light-chapter,#reunion-chapter{inset:0;display:block}
 #game .light-view,#game .reunion-view{position:absolute;inset:0}
 #game .light-heading,#game .reunion-heading{position:absolute;left:4%;right:4%;top:96px;padding:0;z-index:5;pointer-events:none;max-width:760px;border-left:1px solid #d1aa73;padding-left:16px}
 #game .light-footer,#game .reunion-footer{position:absolute;left:5%;right:5%;bottom:40px;padding:16px 0 4px;z-index:6;max-height:45svh;display:grid;grid-template-columns:1fr;background:linear-gradient(transparent,#0c130fc9 48%);overflow:auto}
 #game .light-footer .light-narration,#game .reunion-footer .reunion-narration{width:min(100%,1000px);margin:auto;text-align:center}
 #game.chapter-light .shade,#game.chapter-reunion .shade{background:linear-gradient(180deg,#07100b99,transparent 30%,transparent 60%,#07100bd9)}
}
/* Small screens keep the complete photograph and flow text, rather than crop the interaction. */
@media(orientation:portrait){
 :root{--ui-title:24px;--ui-body:21px;--ui-hint:16px;--ui-action:18px}
 #game header{padding:10px 4%;gap:8px;min-height:64px}
 #game header .brand{font-size:17px}
 #game header .brand i,#game header .brand small{display:none}
 #game header>div{gap:2px}
 #game header button{padding:8px;font-size:16px}
 #game #objective{top:86px;left:5%;right:5%;font-size:24px}
 #game #objective small{font-size:16px}
 #light-chapter,#reunion-chapter{inset:84px 0 28px;gap:12px}
 #game .light-heading,#game .reunion-heading{padding:0 5%}
 #game .light-footer,#game .reunion-footer{max-height:48svh;padding:0 5% 10px;gap:12px}
 #game.chapter-snow #scene{top:var(--snow-scene-top,185px);bottom:calc(var(--snow-dock-height,210px) + 52px)}
 #game.chapter-snow #snow-dock{bottom:44px;left:5%;right:5%;gap:12px}
 #game .bottomline{font-size:13px}
 #game.chapter-snow .bottomline{display:none}
 #game .physical-book-nav{gap:16px;flex-wrap:wrap}
 #game #controls{gap:8px 16px}
}
@media(orientation:landscape) and (max-height:550px){
 :root{--ui-title:22px;--ui-body:20px;--ui-hint:15px;--ui-action:17px}
 #game header{padding:5px 3%;min-height:50px}
 #game header button{min-height:40px}
 #game #objective,#game .light-heading,#game .reunion-heading{top:62px}
 #game #objective small{line-height:1.5;max-width:600px}
 #game #controls{bottom:28px;gap:8px 18px}
 #game:not(.chapter-snow):not(.chapter-light):not(.chapter-reunion) #subtitle{bottom:calc(var(--story-control-height,44px) + 38px)}
 #game .light-footer,#game .reunion-footer{bottom:22px;gap:8px;max-height:48svh}
 #game.chapter-snow #snow-dock{bottom:24px;grid-template-columns:minmax(180px,1fr) minmax(340px,1.5fr);gap:20px}
 #game.chapter-snow #snow-dock #subtitle{font-size:20px}
 #game.chapter-snow #snow-dock #controls button{font-size:17px;min-height:44px;padding:8px 10px}
 #game .bottomline{display:none}
}
@media(prefers-reduced-motion:reduce){#game *{scroll-behavior:auto}}
/* Legacy chapter-specific rules must not shrink the shared task typography. */
#game #hud #objective{font:400 var(--ui-title)/1.45 var(--ink);top:96px;left:4%;right:4%;max-width:760px;color:var(--ui-ink)}
#game #hud #objective small{font:400 var(--ui-hint)/1.7 'PingFang SC','Microsoft YaHei',sans-serif;max-width:680px;margin-top:7px;opacity:1;color:var(--ui-muted)}
@media(orientation:portrait){#game #hud #objective{top:86px;left:5%;right:5%}}
@media(orientation:landscape) and (max-height:550px){#game #hud #objective{top:62px}}
#game .bottomline,#game .prop-hint,#game .book-gesture,#game .sheet-number{font-size:16px}
#game.chapter-snow .snow-rope-status .snow-rope-meter small,#game.chapter-snow .snow-rope-status .snow-rope-progress small,#game.chapter-snow .snow-rope-control small{font-size:16px}
@media(orientation:landscape) and (max-height:550px){:root{--ui-hint:16px}}
#game .radio-inputs button,#game .radio-grip-target{font-size:16px;line-height:1.45}
#game .radio-lift-guide,#game .radio-stage-label{font-size:18px;line-height:1.5}
#game .radio-control-hint{font-size:16px!important;line-height:1.65}
#game .carry-meter small{font-size:16px;line-height:1.5}
/* Map dates must survive scaling from the photographed paper to the viewport. */
#hotspots.image-map .reunion-atlas .reunion-map-node .reunion-place-label time{font-size:21px;line-height:1.5;letter-spacing:.2px;color:#4c281c;text-shadow:0 1px 1px #f5dbad,1px 0 1px #f5dbad}
.reunion-atlas{mix-blend-mode:normal}
/* Dialogue sits over the photograph without a broad dark panel. */
:root{--ui-body:clamp(19px,1.55vw,23px);--ui-action:clamp(17px,1.3vw,20px)}
#game .light-footer,#game .reunion-footer{background:none;overflow:visible;max-height:none;gap:9px}
#game .light-narration p,#game .reunion-narration p{font-size:var(--ui-body);line-height:1.5;text-shadow:0 2px 8px #000,0 0 20px #000b}
#game .light-controls,#game .reunion-controls{gap:7px 18px}
#game .light-controls>button,#game .reunion-controls>button{min-height:42px;padding:7px 12px}
@media(min-aspect-ratio:6/5){
 #game .light-footer,#game .reunion-footer{bottom:30px;padding:0;display:grid;grid-template-columns:1fr}
 #game .light-footer .light-narration,#game .reunion-footer .reunion-narration{width:min(100%,880px)}
 #game.chapter-light:has(.light-puzzle-board) .light-narration{position:absolute;left:0;right:0;bottom:calc(100% + 6px);width:100%;text-align:left!important;pointer-events:none}
 #game.chapter-light:has(.light-puzzle-board) .light-footer{left:5%;right:5%;bottom:32px}
 #game.chapter-light:has(.light-puzzle-board) .light-controls{max-width:760px;margin:auto}
 #game.chapter-light:has(.light-puzzle-board) .light-card-bank{width:min(100%,520px)}
 #game.chapter-light:has(.light-puzzle-board) .light-puzzle-card{min-height:42px;padding:6px}
 #game.chapter-light:has(.light-puzzle-board) .light-narration small{display:none}
}
@media(orientation:portrait){
 :root{--ui-body:19px;--ui-action:17px}
 #game .light-footer,#game .reunion-footer{max-height:38svh;overflow:auto}
 #game.chapter-light:has(.light-puzzle-board) .light-footer{max-height:31svh}
 #game.chapter-light:has(.light-puzzle-board) .light-narration{display:block;position:fixed;top:170px;left:5%;right:5%;width:auto;text-align:center;z-index:8;pointer-events:none}
 #game.chapter-light:has(.light-puzzle-board) .light-narration p{font-size:17px}
 #game.chapter-light:has(.light-puzzle-board) .light-narration small{display:none}
 #game.chapter-light:has(.light-puzzle-board.message) #landscape{object-fit:cover!important}
 #hotspots .message .light-puzzle-slot{left:17%!important;width:66%!important;height:34px!important;min-height:34px!important;transform:none!important;padding:1px 8px!important;background:#ead4aa99;font-size:17px!important;line-height:32px!important;letter-spacing:1px;text-align:center}
 #hotspots .message .light-puzzle-slot:nth-child(1){top:47%!important}
 #hotspots .message .light-puzzle-slot:nth-child(2){top:56%!important}
 #hotspots .message .light-puzzle-slot:nth-child(3){top:65%!important}
 #hotspots .message .light-puzzle-slot:not(.empty){font-size:17px!important}
 #hotspots .message .light-puzzle-slot.empty{background:#ead4aa77;color:#61452d;font-size:17px!important;border-bottom:1px dashed #805c3b}
}
@media(orientation:landscape) and (max-height:550px){:root{--ui-body:18px;--ui-action:16px}}
/* Snow keeps the full route photograph, with its edges continuing behind the HUD. */
#game.chapter-snow::before{content:'';position:absolute;inset:-20px;background:var(--snow-backdrop) center/cover no-repeat;filter:blur(16px) brightness(.72);pointer-events:none;z-index:0}
#game.chapter-snow #scene{background:transparent;z-index:1}
#game.chapter-snow .shade{background:none}
#game.chapter-snow #snow-dock{background:none;box-shadow:none;padding-top:0;isolation:auto}
#game.chapter-snow #snow-dock #subtitle{text-shadow:0 2px 9px #07121a,0 0 16px #07121acc}
#game.chapter-snow #snow-dock #controls button{background:transparent}
#game.chapter-snow #snow-dock .snow-rope-control{background:transparent;border:0;border-block:1px solid #d4e4ec77;border-radius:0}
#game.chapter-snow #snow-dock .snow-rope-buttons button,#game.chapter-snow #snow-dock .snow-rope-buttons button.suggested{background:transparent}
#hotspots .snow-route-regions button{background:transparent}
#game.chapter-snow #snow-dock{background:transparent;box-shadow:none;border:0;backdrop-filter:none}
#game.chapter-snow #snow-dock .snow-rope-status,#game.chapter-snow #snow-dock .snow-rope-control{background:transparent;box-shadow:none}

#rotate{display:none!important}
@media(orientation:portrait){
 #game #rotate{display:flex!important;position:fixed;inset:0;z-index:10000;background:#111b17;align-items:center;justify-content:center;flex-direction:column;text-align:center;padding:32px;pointer-events:auto}
 #game #rotate span{font-size:64px;color:#d9c59e}
 #game #rotate h2{font-size:24px;line-height:1.5;color:#f4ead7}
 #game #rotate p{font-size:17px;line-height:1.8;color:#d2c7b3}
 #debug-chapters{display:none!important}
 #game>:not(#rotate){visibility:hidden;pointer-events:none}
 #game *{animation-play-state:paused!important}
}

#sound{display:none!important}
#global-sound{position:fixed;right:max(18px,env(safe-area-inset-right));top:max(12px,env(safe-area-inset-top));z-index:9999;min-height:44px;padding:8px 12px;background:#17201b88;color:#fff7e6;border:1px solid #dfd1ac77;border-radius:4px;font:16px system-ui;cursor:pointer}
@media(orientation:portrait){#global-sound{display:none}}
