/* Guided phone playback only; desktop keeps its original scroll experience. */
@media (max-width:720px), (max-width:1000px) and (max-height:500px) and (orientation:landscape){
  html[data-mobile-guide]{overflow:hidden;scroll-behavior:auto;overscroll-behavior:none;--guide-clearance:0px}
  html[data-mobile-guide] body{overscroll-behavior:none}
  html[data-mobile-guide] #house-canvas{transform:translateY(calc(var(--guide-roots-lift,0) * -12svh))}
  html[data-mobile-guide] .cinematic-control,html[data-mobile-guide] .frontage .instruction,html[data-mobile-guide] .cover-invitation{display:none}
  html[data-mobile-guide] .scene .copy-frame{position:fixed;inset:0 0 auto;height:100svh;padding-top:calc(6.5rem + env(safe-area-inset-top));padding-bottom:var(--guide-clearance,88px);opacity:0!important;transform:none!important;visibility:hidden;pointer-events:none}
  html[data-mobile-guide] .scene[data-guide-current] .copy-frame{opacity:1!important;visibility:visible}
  html[data-mobile-guide] .foundations[data-guide-current] .copy-frame,html[data-mobile-guide] .scene[data-guide-revealing] .copy-frame{opacity:var(--copy-opacity)!important;visibility:visible;transform:translateY(calc((1 - var(--copy-opacity))*1rem))!important}
  html[data-mobile-guide] .scene[data-guide-current] .copy{pointer-events:auto}
  html[data-mobile-guide] .scene:not(.opening) .copy{max-height:min(49svh,100%)}
  html[data-mobile-guide] .opening .dek{max-height:max(3rem,calc(100svh - var(--opening-paragraph-top,55svh) - var(--guide-clearance) - .5rem));pointer-events:auto}
  html[data-mobile-guide] .scene .copy[data-mobile-reader]{background:#000e}
  html[data-mobile-guide] .scene .copy-frame:focus-within{z-index:25}
  html[data-mobile-guide] .after-house{visibility:hidden;padding-bottom:calc(var(--guide-clearance) + 2rem)}
  html[data-mobile-guide] .after-house[data-guide-current]{visibility:visible;pointer-events:auto}
  html[data-mobile-guide]:has(body[data-guide-stage="8"]){overflow-y:auto}
  .mobile-guide{position:fixed;z-index:80;left:max(1rem,env(safe-area-inset-left));right:max(1rem,env(safe-area-inset-right));top:calc(2.75rem + env(safe-area-inset-top));display:flex;align-items:center;gap:.75rem;background:none;color:#f2eee6;font-family:Arial,sans-serif;pointer-events:none}
  .mobile-guide button{min-height:44px;border:0;background:none;color:inherit;padding:.25rem 0;font:400 .875rem/1.25 Arial,sans-serif;touch-action:manipulation;cursor:pointer;pointer-events:auto}
  .mobile-guide [data-guide-back]{order:0;background:#050505db;padding:.25rem .3rem}
  .mobile-guide [data-guide-progress]{order:2;margin-left:auto;max-width:65%;padding:.25rem .3rem;background:#050505db;text-align:right;font-size:.625rem;letter-spacing:.06em;text-transform:uppercase;color:#ccc5ba}
  .mobile-story-controls{position:fixed;left:0;right:0;bottom:0;min-height:76px;padding:.65rem max(1rem,env(safe-area-inset-right)) max(.65rem,env(safe-area-inset-bottom)) max(1rem,env(safe-area-inset-left));background:#050505;display:flex;justify-content:flex-end;align-items:center;pointer-events:auto}
  .mobile-story-controls .story-next{margin:0;padding:.4rem 0;font:400 1.05rem/1.4 Georgia,serif;letter-spacing:0;text-align:right;text-decoration:underline;text-underline-offset:6px;max-width:100%;color:#eee8dc}
  .mobile-story-controls [data-guide-skip]{margin-left:auto}
  .story-next{display:block;margin:1rem 0 0 auto;padding:.4rem 0;min-height:44px;width:max-content;max-width:100%;border:0;background:none;color:#eee8dc;font:400 1.15rem/1.35 Georgia,serif;text-align:right;text-decoration:underline;text-underline-offset:6px;cursor:pointer;touch-action:manipulation;pointer-events:auto}
  .story-next:focus-visible{outline:2px solid #eee8dc;outline-offset:4px}
  .after-house .story-next{color:#202527}
  html[data-mobile-guide][data-mobile-ending] .after-house{visibility:visible}
  html[data-mobile-guide][data-mobile-ending] .mobile-guide{mix-blend-mode:difference;color:#fff}
  html[data-mobile-guide][data-mobile-ending] .after-inner{position:fixed;left:1rem;right:1rem;top:52svh;max-height:calc(48svh - var(--guide-clearance,88px) - .5rem);overflow:auto;opacity:var(--mobile-editorial-opacity,0);pointer-events:none}
  body[data-guide-stage="8"] .mobile-story-controls{background:#efeeea;color:#202527}
  body[data-guide-stage="8"] .mobile-story-controls .story-next{color:#202527}
  .mobile-guide button:disabled{opacity:.45;cursor:default}
  .mobile-guide button:focus-visible{outline:2px solid #fff;outline-offset:3px}
  .mobile-guide [data-guide-skip]{order:1;text-decoration:underline;min-height:44px;font-size:.75rem}
  body[data-guide-stage="8"] .mobile-guide{color:#202527}
  body[data-guide-stage="8"] .mobile-guide [data-guide-progress]{color:#4c5050}
  body[data-guide-stage="8"] .mobile-guide [data-guide-progress],body[data-guide-stage="8"] .mobile-guide [data-guide-back]{background:#efeeeadd}
  html[data-mobile-guide] .scene h2:focus,html[data-mobile-guide] .after-house h2:focus{outline:none}
}
@media (max-width:1000px) and (max-height:500px) and (orientation:landscape){
  html[data-mobile-guide] #house-canvas{transform:none}
  html[data-mobile-guide] .scene:not(.opening) .copy,html[data-mobile-guide] .opening .copy{max-height:100%}
  html[data-mobile-guide] .opening .dek{max-height:none}
  .mobile-guide{left:calc(50% + 1rem);top:.3rem;padding:0;gap:.65rem}
  .mobile-story-controls{left:50%;min-height:64px;padding-top:.35rem;padding-bottom:.35rem}
  html[data-mobile-guide][data-mobile-ending] .after-inner{left:calc(50% + 1rem);right:1rem;top:3.5rem;max-height:calc(100svh - 3.5rem - var(--guide-clearance,76px))}
  html[data-mobile-guide] .scene .copy-frame{padding-top:3.5rem}
}
@media (prefers-reduced-motion:reduce) and (max-width:720px), (prefers-reduced-motion:reduce) and (max-width:1000px) and (max-height:500px) and (orientation:landscape){
  html[data-mobile-guide] .cinema{display:block}
  html[data-mobile-guide] .cover-entry{display:block;min-height:280vh}
  html[data-mobile-guide] .scene{min-height:145vh;padding:0;background:transparent}
  html[data-mobile-guide] .frontage{min-height:120vh}
  html[data-mobile-guide] .opening{min-height:170vh}
  html[data-mobile-guide] .foundations,html[data-mobile-guide] .closing{min-height:190vh}
  html[data-mobile-guide] #return-book{display:block;min-height:230vh}
  html[data-mobile-guide] .scene .copy-frame{padding:3.5rem 1rem 1rem}
  html[data-mobile-guide] .scene .copy{max-height:100%;overflow:auto}
  html[data-mobile-guide] .after-house{min-height:140vh;padding-top:52svh;background:transparent}
}
