/* One reusable mobile stage, isolated from the established character editor. */
#episode.has-living-opening{position:fixed;inset:0;margin:0;padding:0;min-height:0;z-index:20;background:#202521}
#episode.has-living-opening > :not(.living-opening){display:none!important}
.living-opening,.living-opening *{box-sizing:border-box}.living-opening [hidden]{display:none!important}
.living-opening{position:relative;isolation:isolate;width:100%;height:100vh;height:100dvh;max-width:calc(100dvh * .667);margin:auto;overflow:hidden;overflow:clip;background:#27312c;color:#fff8ec;font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;--lo-art:none}
.lo-ambient{position:absolute;inset:0;background:var(--lo-art) center/cover;filter:blur(20px) brightness(.65);z-index:-1}
.lo-visual{position:absolute;inset:0;overflow:hidden}.lo-still,.lo-canvas{position:absolute;inset:0;width:100%;height:100%;display:block;object-fit:cover;object-position:50% 18%}.lo-still{opacity:1}.lo-canvas{opacity:0}.lo-topshade{position:absolute;inset:0 0 auto;height:110px;background:linear-gradient(#17201f88,transparent);pointer-events:none}
.lo-heading{position:absolute;left:max(20px,env(safe-area-inset-left));top:max(18px,env(safe-area-inset-top));z-index:3;margin:0;pointer-events:none}.lo-heading p{font-size:8px;line-height:1.3;letter-spacing:.16em;color:#f3e1bf;margin:0 0 6px}.lo-heading h2{font-size:20px;line-height:1.2;font-weight:450;letter-spacing:-.025em;margin:0;color:#fff8ec;text-shadow:0 2px 10px #18221c80}
.living-opening button{font:inherit;color:inherit;cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent;min-width:44px;min-height:44px}.living-opening button:focus-visible{outline:2px solid #f9e0ac;outline-offset:3px}.living-opening button:disabled{opacity:.36;cursor:default}.lo-top-controls{position:absolute;top:max(8px,env(safe-area-inset-top));right:max(9px,env(safe-area-inset-right));display:flex;z-index:5;gap:2px}.lo-top-controls button{width:44px;height:44px;background:#1a271f40;border:0;border-radius:50%;font-size:23px;text-shadow:0 1px 5px #0005}
.lo-dock{position:absolute;bottom:calc(85px + env(safe-area-inset-bottom));left:20px;right:20px;z-index:4;max-height:calc(100% - 180px - env(safe-area-inset-top) - env(safe-area-inset-bottom));overflow:visible;pointer-events:none}
.lo-thought{position:relative;padding:18px 21px 20px;border:1px solid #f7e7c536;border-radius:28px 28px 28px 10px;background:linear-gradient(135deg,#27302cc7,#202823e6);box-shadow:0 10px 35px #101b2029;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);max-height:inherit;pointer-events:auto;opacity:0;transform:translateY(10px)}
.lo-thought::before,.lo-thought::after{content:'';position:absolute;border:1px solid #f7e7c536;border-radius:50%;background:#28322cba}.lo-thought::before{width:12px;height:12px;right:47px;top:-20px}.lo-thought::after{width:7px;height:7px;right:36px;top:-34px}
.lo-speaker{display:block;font-size:10px;font-weight:600;line-height:1.4;letter-spacing:.13em;text-transform:uppercase;color:#f4dfb9}.lo-line{font-size:clamp(19px,5.2vw,23px);font-weight:400;line-height:1.38;letter-spacing:-.015em;margin:9px 0 0;color:#fff9ef;outline:none;overflow-wrap:break-word}
.living-opening[data-kind=budget] .lo-line,.living-opening[data-kind=detail] .lo-line{font-size:clamp(17px,4.5vw,20px);line-height:1.4}.lo-arrived .lo-thought{animation:lo-thought-in .55s .3s both cubic-bezier(.2,.65,.3,1)}
.lo-controls{position:absolute;bottom:max(13px,env(safe-area-inset-bottom));left:16px;right:16px;z-index:6;display:grid;grid-template-columns:44px 1fr 44px;align-items:center;gap:10px}.lo-controls button{border:1px solid #ecd5ab44;background:#27302cba;border-radius:24px;font-size:21px;min-height:48px}.lo-controls .lo-next{font-size:15px;color:#fff4da;font-weight:500;padding:10px 16px;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.lo-count{font-size:10px;letter-spacing:.1em;text-align:center;color:#fff0d1;text-shadow:0 1px 5px #102018;grid-column:2;grid-row:1;pointer-events:none}.lo-next:not([hidden])~.lo-count{display:none}
.lo-fact{margin:12px 0 10px;padding-bottom:12px;border-bottom:1px solid #eed9b426}.lo-fact span{display:block;font-size:9px;letter-spacing:.12em;color:#d7c7a7}.lo-fact strong{display:block;margin-top:5px;font-size:clamp(18px,5.5vw,25px);font-weight:500;line-height:1.2}.living-opening[data-frame=OPEN-V2-07] .lo-fact strong{font-size:17px}
.lo-item{display:flex;align-items:center;gap:12px;border-top:1px solid #eed9b426;margin-top:14px;padding-top:12px}.lo-item img{width:46px;height:46px;object-fit:contain;flex:none}.lo-item span{font-size:8px;letter-spacing:.13em;color:#dbc6a2}.lo-item p{font-size:14px;margin:4px 0 0;line-height:1.3}.lo-object-detail .lo-still{object-fit:contain;inset:12% 0 auto;height:53%;padding:5%;filter:drop-shadow(0 12px 20px #0006)}.lo-object-detail .lo-visual{background:#29332ab0}
.lo-dream{position:absolute;left:16px;top:max(100px,calc(env(safe-area-inset-top) + 80px));width:39%;max-width:175px;background:#25332cba;border:1px solid #f2ddba66;border-radius:18px;overflow:hidden;z-index:3;box-shadow:0 10px 35px #19291f50;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);opacity:0}.lo-dream img{width:100%;height:80px;object-fit:cover;display:block}.lo-dream span{font-size:8px;letter-spacing:.12em;display:block;color:#f4dbad;padding:12px 12px 0}.lo-dream p{font-size:15px;line-height:1.3;margin:5px 12px 14px;color:#fff8ee}.lo-arrived .lo-dream{animation:lo-thought-in .8s .2s both}
.lo-choices{display:grid;gap:7px;margin-top:16px}.lo-choice{width:100%;text-align:left;background:#fff2cd0b;border:1px solid #f3dbaa55;border-radius:13px;padding:12px 14px;font-size:15px!important;line-height:1.2;min-height:48px!important}.lo-choice:hover,.lo-choice[aria-pressed=true]{background:#f1d39a25;border-color:#f2d8a9}.lo-boundary{padding:22px;background:#26312eea;border:1px solid #f4dfb94d;border-radius:24px;pointer-events:auto}.lo-boundary p{font-size:22px;margin:0 0 10px}.lo-boundary span{font-size:15px;line-height:1.5}.lo-other{display:block;background:transparent;border:0;margin-top:15px;text-decoration:underline;font-size:14px!important}
.lo-loading{position:absolute;inset:0;display:grid;place-items:center;background:#20282199;z-index:9;font-size:14px;color:#fff1d4;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.lo-error{position:absolute;left:20px;right:20px;bottom:85px;background:#27312bf2;border-radius:20px;padding:22px;z-index:10}.lo-error button{display:block;background:transparent;border:0;text-decoration:underline;font-size:16px}
@keyframes lo-thought-in{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@media(max-width:350px){.lo-heading{left:16px}.lo-heading h2{font-size:18px}.lo-heading p{font-size:7px}.lo-top-controls{right:4px}.lo-dock{left:14px;right:14px;bottom:80px}.lo-thought{padding:16px 17px 18px;border-radius:24px 24px 24px 9px}.lo-line{font-size:18px}.lo-speaker{font-size:9px}.lo-fact{margin:9px 0;padding-bottom:9px}.lo-choices{margin-top:12px;gap:6px}.lo-choice{font-size:14px!important;padding:10px 12px;min-height:44px!important}.lo-controls{bottom:max(12px,env(safe-area-inset-bottom));left:14px;right:14px;gap:8px}.lo-dream{left:12px;width:38%}.lo-dream p{font-size:13px;margin:5px 9px 10px}.lo-dream img{height:65px}}
@media(max-height:600px) and (orientation:portrait){.lo-dock{bottom:77px}.lo-line{font-size:17px}.living-opening[data-kind=budget] .lo-line{font-size:16px}.lo-thought{padding-top:14px;padding-bottom:15px}.lo-fact strong{font-size:21px}.lo-item{padding-top:8px;margin-top:10px}.lo-item img{width:36px;height:36px}.lo-controls button{min-height:44px}.lo-choices{gap:6px;margin-top:12px}.lo-choice{min-height:44px!important;padding:10px 12px}}
@media(orientation:landscape) and (max-height:560px){.living-opening{max-width:none}.lo-visual{width:min(48vw,calc(100dvh * .667));left:calc((48vw - min(48vw,calc(100dvh * .667)))/2);right:auto}.lo-heading{top:max(10px,env(safe-area-inset-top));left:18px}.lo-heading h2{font-size:17px}.lo-heading p{font-size:7px}.lo-dock{left:50%;right:max(18px,env(safe-area-inset-right));bottom:67px;max-height:calc(100% - 128px);overflow:auto;padding-top:2px;overscroll-behavior:contain}.lo-thought{padding:14px 16px;border-radius:20px;max-height:none}.lo-thought::before,.lo-thought::after{display:none}.lo-line,.living-opening[data-kind=budget] .lo-line,.living-opening[data-kind=detail] .lo-line{font-size:16px;line-height:1.35}.lo-speaker{font-size:9px}.lo-controls{left:50%;right:18px;bottom:max(8px,env(safe-area-inset-bottom))}.lo-controls button{min-height:44px}.lo-fact{margin:8px 0;padding-bottom:8px}.lo-fact strong{font-size:20px}.lo-choices{margin-top:10px;gap:5px}.lo-choice{min-height:44px!important;padding:10px 12px;font-size:14px!important}.lo-dream{left:12px;top:77px;width:19%;max-width:140px}.lo-dream img{height:55px}.lo-dream p{font-size:12px}.lo-dream span{font-size:7px}.lo-top-controls{top:6px}}
@media(prefers-reduced-motion:reduce){.lo-arrived .lo-thought,.lo-arrived .lo-dream{animation:none;opacity:1;transform:none}.living-opening *{scroll-behavior:auto!important}}.lo-paused .lo-thought,.lo-paused .lo-dream{animation:none;opacity:1;transform:none}

.lo-arrived .lo-visual{animation:lo-scene-in .45s ease-out both}@keyframes lo-scene-in{from{opacity:.5}to{opacity:1}}@media(prefers-reduced-motion:reduce){.lo-arrived .lo-visual{animation:none}}.lo-paused .lo-visual{animation:none}

@media(orientation:portrait){.living-opening[data-frame=OPEN-V2-03]:not(.lo-object-detail) .lo-dock{top:32%;bottom:auto}}

body.lo-active #cinema > .toolbar{visibility:hidden}

.living-opening.lo-switching .lo-visual,.living-opening.lo-switching .lo-ambient{visibility:hidden}

/* This authored man's face is left of Alina's: keep the dream clear of his eyes. */
@media(orientation:portrait){
 .living-opening[data-hero="man-city-adult-v1"] .lo-dream{top:32%;width:34%;max-width:155px}
}
@media(orientation:landscape) and (max-height:560px){
 .living-opening[data-hero="man-city-adult-v1"] .lo-dream{left:50%;right:18px;top:66px;width:auto;max-width:none;display:grid;grid-template-columns:70px 1fr;min-height:78px}
 .living-opening[data-hero="man-city-adult-v1"] .lo-dream img{grid-row:1/3;height:100%;min-height:78px}
 .living-opening[data-hero="man-city-adult-v1"] .lo-dream span{padding-top:9px}
 .living-opening[data-hero="man-city-adult-v1"] .lo-dream p{margin-bottom:9px}
}

/* Blonde heroine: keep the dream card below the face in portrait and beside it in landscape. */
@media (orientation:portrait){
 .living-opening[data-hero="woman-city-blonde-adult-v1"] .lo-dream{top:32%;width:39%;max-width:175px}
}
@media (orientation:landscape) and (max-height:560px){
 .living-opening[data-hero="woman-city-blonde-adult-v1"] .lo-dream{left:50%;right:18px;top:66px;width:auto;max-width:none;display:grid;grid-template-columns:70px 1fr;min-height:78px}
 .living-opening[data-hero="woman-city-blonde-adult-v1"] .lo-dream[hidden]{display:none}
 .living-opening[data-hero="woman-city-blonde-adult-v1"] .lo-dream img{grid-row:1 / 3;height:100%;min-height:78px}
 .living-opening[data-hero="woman-city-blonde-adult-v1"] .lo-dream span{padding-top:9px}
 .living-opening[data-hero="woman-city-blonde-adult-v1"] .lo-dream p{padding-bottom:9px}
}

.lo-dream p{overflow-wrap:anywhere;hyphens:auto}

/* Blond male protagonist: dream stays clear of the face. */
@media(orientation:portrait){.living-opening[data-hero="man-city-blond-adult-v1"] .lo-dream{top:32%;width:39%;max-width:175px}}
@media(orientation:landscape) and (max-height:560px){.living-opening[data-hero="man-city-blond-adult-v1"] .lo-dream{left:50%;right:18px;top:66px;width:auto;max-width:none;display:grid;grid-template-columns:70px 1fr;min-height:78px}.living-opening[data-hero="man-city-blond-adult-v1"] .lo-dream[hidden]{display:none}.living-opening[data-hero="man-city-blond-adult-v1"] .lo-dream img{grid-row:1/3;height:100%;min-height:78px}.living-opening[data-hero="man-city-blond-adult-v1"] .lo-dream span{padding-top:9px}.living-opening[data-hero="man-city-blond-adult-v1"] .lo-dream p{margin-bottom:9px}}

/* The selected object is part of the full table illustration; only its caption remains. */
.lo-table-prop .lo-item img{display:none}
.lo-table-prop .lo-item{padding-top:9px;margin-top:10px}
@media(orientation:portrait) and (max-height:650px){.lo-table-prop .lo-item{display:none}}