/* A finite story after an explicit perspective choice. All assets are local. */
body.ep-entry-open { overflow: hidden; }
html.ep-entry-scroll-reset { scroll-behavior: auto !important; }
.ep-entry [hidden], .ep-entry[hidden] { display: none !important; }
.ep-entry { position: fixed; z-index: 200; inset: 0; min-height: 100svh; overflow-x: hidden; overflow-y: auto; overscroll-behavior: contain; isolation: isolate; background: #030b17; color: #f4fbff; opacity: 1; transition: opacity .55s ease; }
.ep-entry.is-leaving { opacity: 0; pointer-events: none; }
.ep-entry::after { position: absolute; z-index: 1; inset: 0; min-height: 100%; background: linear-gradient(90deg, #030b17 0%, rgba(3,11,23,.94) 28%, rgba(3,11,23,.3) 67%, transparent); content: ''; pointer-events: none; }
.ep-entry-panel { position: relative; z-index: 2; width: min(100%,1440px); min-height: 100svh; margin: auto; display: flex; flex-direction: column; justify-content: center; padding: clamp(28px,5vw,80px); }
.ep-entry-kicker { display: flex; align-items: center; gap: 10px; margin: 0 0 24px; color: #97d7dc; font: 730 .67rem/1.4 var(--mono,monospace); letter-spacing: .14em; }
.ep-entry-kicker::before { width: 22px; height: 1px; background: #8de7e4; box-shadow: 0 0 12px #7ef0e6; content: ''; }
.ep-entry h2 { max-width: 690px; margin: 0 0 22px; color: #f3fbff; font-size: clamp(2.8rem,4.8vw,5rem); font-weight: 790; letter-spacing: -.025em; line-height: 1.09; text-wrap: balance; hyphens: none; }
.ep-entry h2 em { color: #a9f7e8; font-style: normal; text-shadow: 0 0 38px rgba(117,237,240,.18); }
.ep-entry h2[tabindex="-1"]:focus { outline: none; }
#ep-entry-copy { max-width: 440px; margin: 0; color: #b9d0db; font-size: 1rem; line-height: 1.6; }
.ep-role-choices { width: min(100%,520px); display: grid; gap: 12px; margin-top: 30px; }
.ep-role-choice { display: flex; align-items: center; gap: 18px; width: 100%; min-height: 96px; padding: 16px 20px; border: 1px solid rgba(142,225,222,.38); border-radius: 13px; background: linear-gradient(120deg,rgba(18,58,70,.88),rgba(8,27,43,.91)); color: #efffff; text-align: left; cursor: pointer; box-shadow: inset 0 1px rgba(255,255,255,.06), 0 15px 45px rgba(0,0,0,.12); transition: transform .35s ease, border-color .35s, box-shadow .35s; }
.ep-role-choice:hover { transform: translateX(5px); border-color: #b9ffdd; box-shadow: 0 10px 45px rgba(71,221,210,.13); }
.ep-role-choice:focus-visible { outline: 3px solid #caff8e; outline-offset: 4px; }
.ep-role-letter { flex: 0 0 42px; display: grid; place-items: center; width: 42px; height: 48px; border: 1px solid rgba(139,232,223,.34); border-radius: 12px 12px 18px 18px; background: rgba(85,215,220,.07); color: #baffed; font: 450 1.45rem/1 Georgia,serif; }
.ep-role-choice-teacher .ep-role-letter { color: #d2c6ff; border-color: rgba(192,166,247,.4); }
.ep-role-copy { display: flex; flex: 1 1 auto; flex-direction: column; gap: 5px; min-width: 0; }
.ep-role-name { color: #91cbd1; font: 700 .57rem/1.35 var(--mono,monospace); letter-spacing: .07em; }
.ep-role-copy strong { color: #f1fbff; font-size: 1rem; font-weight: 680; line-height: 1.35; }
.ep-role-copy small { display: flex; align-items: center; gap: 6px; color: #a0bcc9; font-size: .73rem; line-height: 1.35; }
.ep-role-copy small svg { width: 15px; height: 15px; flex: 0 0 auto; color: #b9e6db; }
.ep-role-arrow { margin-left: auto; color: #9fe7e4; font-size: 1.35rem; }
.ep-entry-voting { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 24px; width: min(100%,520px); margin-top: 18px; }
.ep-entry-voting p { flex: 1; margin: 0; color: #849eae; font-size: .71rem; line-height: 1.6; }
.ep-entry-voting button { flex: 0 0 auto; min-height: 44px; padding: 8px 0; border: 0; background: none; color: #c1d7dc; cursor: pointer; font-size: .74rem; }
.ep-entry-voting button:hover { color: #caff8e; }

/* The artwork changes with the story: question → external destination → local room. */
.ep-entry[data-entry-phase="story"]::after { background: linear-gradient(90deg,rgba(3,11,23,.95),rgba(3,11,23,.65) 44%,rgba(3,11,23,.3)); }
/* The choice-screen illustration yields to the story's own Ephraim and cloud. */
.ep-entry[data-entry-phase="story"] .ep-entry-guardian { display: none; }
.ep-cinema { position: relative; z-index: 2; display: flex; flex-direction: column; width: min(100%,1420px); min-height: 100svh; margin: auto; padding: clamp(24px,4vw,60px); }
.ep-cinema-top { display: flex; justify-content: space-between; align-items: center; gap: 15px; }
.ep-cinema-top .ep-entry-kicker { margin: 0; }
.ep-cinema-steps { display: flex; flex: 0 0 auto; gap: 7px; }
.ep-cinema-steps i { width: 22px; height: 3px; border-radius: 10px; background: #23414f; transition: background .4s; }
.ep-cinema-steps i.is-current { background: #a7ffe1; box-shadow: 0 0 14px rgba(148,255,227,.5); }
.ep-cinema-steps i.is-done { background: #668e95; }
.ep-cinema-layout { display: grid; grid-template-columns: minmax(0,.9fr) minmax(0,1.1fr); align-items: center; flex: 1; gap: 30px; padding-block: 40px; }
.ep-cinema-copy { position: relative; z-index: 2; }
.ep-cinema-kicker { color: #9fe5de; font: 740 .66rem/1.4 var(--mono,monospace); letter-spacing: .12em; margin: 0 0 20px; }
.ep-cinema-copy h2 { font-size: clamp(2.7rem,4.4vw,4.6rem); max-width: 600px; }
.ep-cinema-copy > p:last-child { max-width: 430px; margin: 0; color: #bdcfdc; font-size: 1.03rem; line-height: 1.65; }
.ep-cinema-copy.is-arriving { animation: cinema-copy-in .6s ease both; }
.ep-cinema-visual { position: relative; min-width: 0; width: 100%; height: min(480px,60vh); min-height: 350px; isolation: isolate; }
.ep-cinema-visual::before { position: absolute; inset: -10%; z-index: -1; border-radius: 50%; background: radial-gradient(ellipse,rgba(64,159,194,.13),transparent 67%); content: ''; }
.ep-cinema-lines { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; transition: opacity 1s; }
.ep-cinema-lines path { fill: none; stroke: #aba0e2; stroke-width: 1; stroke-dasharray: 3 9; animation: cinema-data-flow 3s linear infinite; }
.ep-cinema-cloud { position: absolute; top: 6%; right: 2%; width: 105px; color: #cfb9f3; opacity: 0; transform: translateY(-12px); transition: opacity 1s,transform 1s; text-align: center; }
.ep-cinema-cloud svg { width: 100%; fill: rgba(157,126,194,.08); stroke: currentColor; stroke-width: 1.2; filter: drop-shadow(0 0 15px rgba(181,150,233,.24)); }
.ep-cinema-cloud span { font: 690 .62rem/1.5 var(--mono,monospace); letter-spacing: .05em; }
.ep-cinema-message { position: absolute; top: 20%; left: 3%; width: 88%; padding: 30px; border: 1px solid rgba(118,222,228,.44); border-radius: 18px 18px 18px 3px; background: linear-gradient(135deg,rgba(18,51,71,.96),rgba(7,28,47,.94)); box-shadow: 0 25px 90px rgba(0,0,0,.22); transition: transform 1.1s ease,opacity .85s; }
.ep-cinema-message > span { color: #83cdd3; font: 720 .62rem/1.4 var(--mono,monospace); letter-spacing: .09em; }
.ep-cinema-message p { margin: 20px 0; color: #e4f5fa; font-size: clamp(1.05rem,1.45vw,1.35rem); line-height: 1.5; }
.ep-cinema-equation { color: #caffad; font: 550 clamp(1.3rem,2.2vw,2rem)/1.4 var(--mono,monospace); }
.ep-cinema-equation span { margin-inline: 7px; color: #75c3cf; }
.ep-cinema-message small { display: block; margin-top: 13px; color: #a9c4d0; font-size: .82rem; line-height: 1.5; }
.ep-cinema-facts { position: absolute; top: 10%; left: 5%; display: grid; gap: 10px; width: 65%; }
.ep-cinema-facts > span { display: flex; flex-direction: column; gap: 4px; padding: 12px 17px; border-left: 2px solid #c0afe8; border-radius: 0 7px 7px 0; background: linear-gradient(95deg,rgba(38,44,70,.94),rgba(15,33,52,.9)); box-shadow: 0 8px 24px rgba(0,0,0,.13); opacity: 0; transform: translate(-25px,35px) scale(.97); transition: opacity .85s ease,transform 1s cubic-bezier(.2,.75,.25,1),border-color 1s; }
.ep-cinema-facts small { color: #adbad2; font: 680 .56rem/1.3 var(--mono,monospace); letter-spacing: .08em; }
.ep-cinema-facts strong { color: #f1f6ff; font-size: .95rem; line-height: 1.35; font-weight: 650; }
.ep-cinema-facts > span:nth-child(2) { transition-delay: .2s; }
.ep-cinema-facts > span:nth-child(3) { transition-delay: .4s; }
.ep-cinema-facts > span:nth-child(4) { transition-delay: .6s; }
.ep-cinema-facts > span:nth-child(5) { transition-delay: .8s; }
.ep-cinema-boundary { position: absolute; inset: -1% -1% 0; border: 1px solid #7ce4d1; border-radius: 35px; box-shadow: inset 0 0 65px rgba(51,218,191,.07),0 0 45px rgba(83,210,207,.13); opacity: 0; transform: scale(.88); transition: opacity 1.3s,transform 1.3s cubic-bezier(.2,.75,.25,1); }
.ep-cinema-boundary-label { position: absolute; bottom: 15px; left: 0; width: 100%; color: #abf8d4; font: 700 .58rem/1.4 var(--mono,monospace); letter-spacing: .08em; text-align: center; }
.ep-cinema-core { position: absolute; top: 35%; right: 2%; display: flex; flex-direction: column; align-items: center; width: 26%; opacity: 0; transform: translateY(20px) scale(.8); transition: opacity 1.1s,transform 1.1s; }
.ep-cinema-core img { width: min(92px,80%); height: auto; border-radius: 50%; box-shadow: 0 0 35px rgba(136,232,235,.3); }
.ep-cinema-core strong { margin-top: 12px; color: #ddfff2; font: 780 .67rem/1.4 var(--mono,monospace); letter-spacing: .09em; }
.ep-cinema-core > span { color: #92c5cc; font-size: .7rem; }
.ep-entry[data-entry-scene="1"] .ep-cinema-cloud, .ep-entry[data-entry-scene="1"] .ep-cinema-lines { opacity: 1; transform: none; }
.ep-entry[data-entry-scene="1"] .ep-cinema-message, .ep-entry[data-entry-scene="2"] .ep-cinema-message { opacity: 0; transform: translateY(70px) scale(.85); pointer-events: none; }
.ep-entry[data-entry-scene="1"] .ep-cinema-facts > span, .ep-entry[data-entry-scene="2"] .ep-cinema-facts > span { opacity: 1; transform: none; }
.ep-entry[data-entry-scene="2"] .ep-cinema-boundary, .ep-entry[data-entry-scene="2"] .ep-cinema-core { opacity: 1; transform: none; }
.ep-entry[data-entry-scene="2"] .ep-cinema-facts > span { border-color: #a0f3cf; background: linear-gradient(95deg,rgba(21,57,66,.98),rgba(12,32,45,.93)); }
.ep-cinema-footer { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 16px 28px; padding-top: 20px; border-top: 1px solid rgba(224,202,163,.15); }
.ep-cinema-navigation { display: flex; flex: 0 0 auto; gap: 10px; }
.ep-cinema-secondary { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 6px 26px; }
.ep-cinema-controls { display: flex; flex-wrap: wrap; gap: 6px 20px; }
.ep-cinema-footer button { min-height: 44px; border: 0; padding: 10px 0; color: #a9c2d0; background: none; cursor: pointer; font-size: .76rem; }
.ep-cinema-footer button:hover { color: #d7ffee; }
.ep-cinema-footer button:focus-visible { outline: 3px solid #caff8e; outline-offset: 4px; }
.ep-cinema-footer .ep-cinema-nav { display: inline-flex; align-items: center; justify-content: center; gap: 18px; min-width: 124px; min-height: 48px; padding: 12px 18px; border: 1px solid rgba(232,199,143,.32); border-radius: 8px; background: rgba(22,29,37,.88); color: #eee4d2; font-size: .85rem; font-weight: 650; white-space: nowrap; transition: background .2s ease, border-color .2s ease, box-shadow .2s ease; }
.ep-cinema-nav > [aria-hidden] { font-size: 1.15rem; line-height: 1; }
.ep-cinema-footer .ep-cinema-nav:hover { border-color: #ebc68a; background: #2d2c29; color: #fff3db; }
.ep-cinema-footer .ep-cinema-next { background: #f0cf96; border-color: #f5dbaf; color: #231b11; box-shadow: 0 0 24px rgba(229,177,94,.1); }
.ep-cinema-footer .ep-cinema-next:hover { background: #ffe2b2; border-color: #ffe9c7; color: #231b11; box-shadow: 0 0 28px rgba(229,177,94,.19); }
.ep-cinema-footer .ep-cinema-skip { color: #caffac; font-weight: 700; white-space: nowrap; }
.ep-cinema-skip span { margin-left: 12px; font-size: 1.1rem; }
.ep-cinema-audio-note { margin: 0; min-height: 20px; color: #ffd3a1; font-size: .72rem; line-height: 1.5; }
.ep-entry.is-paused *, .ep-entry.is-paused *::before, .ep-entry.is-paused *::after { animation-play-state: paused !important; }
.ep-entry.is-paused .ep-cinema-copy { animation: none; opacity: 1; transform: none; }
@keyframes cinema-copy-in { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: none; } }
@keyframes cinema-data-flow { to { stroke-dashoffset: -144; } }
@media (max-width: 900px) {
  .ep-entry-panel { justify-content: flex-end; padding: max(15svh,100px) 32px 28px; }
  .ep-entry::after { background: linear-gradient(0deg,#030b17 0%,rgba(3,11,23,.94) 50%,rgba(3,11,23,.5) 75%,transparent); }
  .ep-entry h2 { font-size: clamp(2.5rem,6.5vw,4rem); }
  .ep-role-choices { width: min(100%,580px); }
  .ep-entry-voting { width: min(100%,580px); }
  .ep-cinema-layout { grid-template-columns: 1fr; align-content: center; gap: 14px; padding-block: 30px 10px; }
  .ep-cinema-copy h2 { max-width: 680px; font-size: 2.5rem; }
  .ep-cinema-copy > p:last-child { max-width: 640px; }
  .ep-cinema-visual { width: min(100%,550px); margin: auto; height: 340px; min-height: 0; }
  .ep-cinema-facts { top: 5%; gap: 7px; }
  .ep-cinema-facts > span { padding: 9px 13px; gap: 2px; }
  .ep-cinema-message { top: 10%; }
}
@media (max-width: 600px) {
  .ep-entry-panel { padding: max(17svh,100px) 21px max(22px,env(safe-area-inset-bottom)); }
  .ep-entry-kicker { font-size: .57rem; letter-spacing: .09em; margin-bottom: 17px; }
  .ep-entry h2 { font-size: clamp(2.05rem,7.8vw,2.8rem); margin-bottom: 15px; }
  #ep-entry-copy { font-size: .86rem; max-width: 370px; line-height: 1.5; }
  .ep-role-choices { gap: 10px; margin-top: 22px; }
  .ep-role-choice { min-height: 82px; gap: 12px; padding: 13px; border-radius: 10px; }
  .ep-role-letter { flex-basis: 32px; width: 32px; height: 40px; font-size: 1.2rem; }
  .ep-role-name { font-size: .49rem; letter-spacing: .035em; }
  .ep-role-copy { gap: 4px; }
  .ep-role-copy strong { font-size: .85rem; }
  .ep-role-copy small { font-size: .63rem; gap: 4px; }
  .ep-role-copy small svg { width: 12px; height: 12px; }
  .ep-role-arrow { font-size: 1rem; }
  .ep-entry-voting { margin-top: 13px; gap: 3px 10px; }
  .ep-entry-voting p { font-size: .64rem; }
  .ep-entry-voting button { font-size: .65rem; }
  .ep-cinema { padding: 22px 20px max(16px,env(safe-area-inset-bottom)); }
  .ep-cinema-top .ep-entry-kicker { font-size: .49rem; letter-spacing: .05em; gap: 6px; }
  .ep-cinema-steps { gap: 4px; }
  .ep-cinema-steps i { width: 14px; }
  .ep-cinema-layout { gap: 18px; padding-top: 27px; align-content: center; }
  .ep-cinema-kicker { font-size: .57rem; margin-bottom: 12px; }
  .ep-cinema-copy h2 { font-size: clamp(1.9rem,7.5vw,2.8rem); line-height: 1.13; margin-bottom: 13px; }
  .ep-cinema-copy > p:last-child { font-size: .86rem; line-height: 1.5; }
  .ep-cinema-visual { height: 290px; }
  .ep-cinema-message { top: 8%; left: 0; width: 100%; padding: 22px; }
  .ep-cinema-message p { font-size: 1rem; margin: 15px 0; }
  .ep-cinema-message small { font-size: .72rem; }
  .ep-cinema-equation { font-size: 1.3rem; }
  .ep-cinema-facts { left: 3%; width: 68%; gap: 6px; }
  .ep-cinema-facts > span { padding: 8px 10px; }
  .ep-cinema-facts small { font-size: .47rem; }
  .ep-cinema-facts strong { font-size: .77rem; }
  .ep-cinema-cloud { width: 75px; right: -1%; }
  .ep-cinema-cloud span { font-size: .5rem; }
  .ep-cinema-boundary { inset: -1% -2% 0; border-radius: 22px; }
  .ep-cinema-boundary-label { bottom: 10px; font-size: .48rem; }
  .ep-cinema-core { right: 0; top: 37%; }
  .ep-cinema-core strong { font-size: .48rem; }
  .ep-cinema-core > span { font-size: .6rem; }
  .ep-cinema-footer { flex-direction: column; align-items: stretch; gap: 8px; padding-top: 16px; }
  .ep-cinema-navigation { width: 100%; }
  .ep-cinema-footer .ep-cinema-nav { flex: 1 1 0; min-width: 0; gap: 12px; padding-inline: 12px; font-size: .82rem; }
  .ep-cinema-secondary { justify-content: space-between; align-items: flex-start; gap: 0 12px; }
  .ep-cinema-controls { flex-direction: column; gap: 0; }
  .ep-cinema-footer button { font-size: .66rem; }
  .ep-cinema-skip span { margin-left: 4px; }
}
@media (max-height: 650px) and (max-width: 600px) {
  .ep-entry-panel { padding-top: 60px; }
  .ep-entry-panel h2 { font-size: 2rem; }
  .ep-entry-kicker { margin-bottom: 12px; }
  .ep-role-choices { margin-top: 16px; gap: 8px; }
  .ep-role-choice { min-height: 77px; padding-block: 10px; }
  .ep-cinema { padding: 16px 18px 10px; }
  .ep-cinema-layout { padding-top: 17px; gap: 10px; }
  .ep-cinema-copy h2 { font-size: 1.85rem; margin-bottom: 10px; }
  .ep-cinema-copy > p:last-child { font-size: .78rem; }
  .ep-cinema-visual { height: 264px; }
  .ep-cinema-message { padding: 16px; top: 5%; }
  .ep-cinema-message p { margin-block: 12px; font-size: .9rem; }
  .ep-cinema-facts > span { padding-block: 5px; }
  .ep-cinema-boundary-label { font-size: .44rem; }
  .ep-cinema-controls { flex-direction: row; gap: 12px; }
  .ep-cinema-controls button { max-width: 76px; line-height: 1.4; text-align: left; }
}
@media (max-height: 600px) and (max-width: 360px) {
  .ep-entry-panel { padding-top: 26px; }
  .ep-entry-panel h2 { font-size: 1.8rem; }
  .ep-entry-voting { margin-top: 8px; }
}
@media (prefers-reduced-motion: reduce) {
  .ep-entry *, .ep-entry *::before, .ep-entry *::after { animation: none !important; transition: none !important; }
  .ep-entry { transition: none; }
}

/* A simple choice, with a warm protected side and a cold outside. */
.ep-entry h2 em { color: #ffe1a5; text-shadow: 0 0 40px rgba(237,177,85,.17); }
.ep-entry-kicker, .ep-cinema-kicker { color: #ddc492; }
.ep-entry-kicker::before { background: #e6bf7e; box-shadow: 0 0 12px #e6bf7e; }
.ep-entry::after { background: linear-gradient(90deg,#050d18 0%,rgba(5,13,24,.95) 25%,rgba(5,13,24,.18) 66%,transparent); }
.ep-role-choices { width: min(100%,540px); gap: 10px; }
.ep-role-choice { min-height: 88px; padding: 18px 22px; border-color: rgba(232,199,143,.28); border-radius: 10px; background: linear-gradient(110deg,rgba(71,55,34,.55),rgba(18,27,38,.88)); box-shadow: inset 0 1px rgba(255,230,174,.04); }
.ep-role-choice:hover { border-color: #ebc68a; box-shadow: 0 0 25px rgba(214,160,81,.13); }
.ep-role-copy strong { font-size: 1rem; font-weight: 600; }
.ep-role-copy small { color: #afbdc6; font-size: .7rem; }
.ep-role-copy small svg { color: #dec59a; }
.ep-role-arrow { color: #ecd2a4; }
.ep-entry-voting { width: min(100%,540px); margin-top: 20px; gap: 12px; align-items: center; }
.ep-entry-voting .ep-entry-vote { min-height: 48px; padding: 13px 18px; background: #caff8e; color: #142113; border: 1px solid #daffb7; border-radius: 6px; font-size: .83rem; box-shadow: 0 0 28px rgba(191,245,129,.12); }
.ep-entry-voting .ep-entry-vote:hover { background: #ddffb9; color: #142113; }
.ep-entry-voting p { min-width: 160px; font-size: .69rem; }
.ep-cinema-light { position: absolute; inset: 0; z-index: -1; width: 100%; height: 100%; pointer-events: none; }
.ep-cinema-message { border-color: rgba(233,199,139,.4); background: linear-gradient(135deg,rgba(50,43,32,.95),rgba(16,28,40,.95)); }
.ep-cinema-message > span { color: #dec391; }
.ep-cinema-cloud { color: #92aace; }
.ep-cinema-cloud svg { fill: #090f23; filter: drop-shadow(0 0 15px rgba(91,123,186,.2)); }
.ep-cinema-boundary { right: 16%; left: -4%; top: -8%; bottom: -6%; border: 0; border-radius: 50%; background: none; box-shadow: none; pointer-events: none; }
/* Match the WebGL ring's warm, softly lit right edge; keep the label sharp. */
.ep-cinema-boundary::before, .ep-cinema-boundary::after { position: absolute; inset: 0; border-radius: inherit; content: ''; pointer-events: none; -webkit-mask-image: linear-gradient(100deg,transparent 3%,rgba(0,0,0,.18) 30%,#000 82%); mask-image: linear-gradient(100deg,transparent 3%,rgba(0,0,0,.18) 30%,#000 82%); }
.ep-cinema-boundary::before { border: 3px solid rgba(255,194,107,.72); box-shadow: 0 0 9px rgba(239,174,79,.18),inset 0 0 9px rgba(239,174,79,.14); filter: blur(2.5px); animation: cinema-boundary-light 9.6s ease-in-out infinite; }
.ep-cinema-boundary::after { inset: -3px; border: 12px solid rgba(239,174,79,.2); filter: blur(14px); }
@keyframes cinema-boundary-light { 0%,100% { opacity: .75; } 50% { opacity: 1; } }
.ep-cinema-boundary-label { bottom: 8%; color: #ffe0a1; font-size: .57rem; }
.ep-cinema-core { right: 19%; width: 17%; }
.ep-cinema-core img { box-shadow: 0 0 38px rgba(255,194,94,.5); border: 1px solid #f5d592; }
.ep-cinema-core strong { color: #ffe4ad; }
.ep-cinema-core > span { color: #e6cc9f; }
.ep-entry[data-entry-scene="2"] .ep-cinema-facts { width: 57%; left: 2%; }
.ep-entry[data-entry-scene="2"] .ep-cinema-facts > span { border-color: #efc67f; background: linear-gradient(95deg,rgba(63,49,30,.96),rgba(33,32,34,.94)); }
.ep-entry[data-entry-scene="2"] .ep-cinema-cloud { opacity: .45; transform: scale(.85); }
.ep-entry[data-entry-scene="2"] .ep-cinema-visual::before { background: radial-gradient(ellipse,rgba(198,144,70,.18),transparent 72%); }
@media (max-width: 960px) {
  .ep-entry-guardian-stage { width: min(830px,165vw); top: max(-105px,-10vh); }
}
@media (max-width: 900px) {
  .ep-entry::after { background: linear-gradient(0deg,#050d18 0%,rgba(5,13,24,.97) 37%,rgba(5,13,24,.6) 62%,transparent 90%); }
  .ep-entry-panel { padding-top: max(22svh,160px); }
  .ep-cinema-facts { width: 68%; }
}
@media (max-width: 600px) {
  .ep-entry-panel { padding: max(25svh,165px) 21px max(22px,env(safe-area-inset-bottom)); }
  .ep-role-choice { min-height: 84px; padding: 14px 16px; }
  .ep-role-copy strong { font-size: .91rem; line-height: 1.4; }
  .ep-role-copy small { font-size: .66rem; }
  .ep-entry-voting { margin-top: 18px; gap: 10px; }
  .ep-entry-voting .ep-entry-vote { width: 100%; min-height: 48px; }
  .ep-entry-voting p { flex-basis: 100%; margin: 0; text-align: center; font-size: .64rem; }
  .ep-cinema-facts strong { font-size: .76rem; }
  .ep-cinema-boundary { top: -6%; bottom: -8%; }
  .ep-cinema-boundary-label { font-size: .43rem; }
  .ep-cinema-core strong { font-size: .43rem; }
  .ep-cinema-core > span { font-size: .56rem; }
}
@media (max-height: 700px) and (max-width: 900px) {
  .ep-entry-panel { padding-top: 50px; }
}

/* One sound preference applies to either perspective. */
.ep-entry-sound { display: flex; align-items: center; flex-wrap: wrap; gap: 10px 16px; margin-top: 24px; padding-top: 20px; border-top: 1px solid rgba(224,202,163,.15); width: min(100%,540px); }
.ep-sound-choice { display: inline-flex; gap: 3px; padding: 4px; border: 1px solid rgba(230,198,149,.22); border-radius: 28px; background: rgba(4,14,25,.76); }
.ep-sound-choice button { display: inline-flex; align-items: center; justify-content: center; gap: 7px; min-height: 44px; border: 1px solid transparent; border-radius: 24px; padding: 9px 15px; color: #b3c1ca; background: transparent; font: 600 .76rem/1.3 var(--font,sans-serif); cursor: pointer; transition: background .2s,color .2s; }
.ep-sound-choice button[aria-pressed="true"] { color: #ffe6be; border-color: rgba(236,197,139,.25); background: #393124; }
.ep-sound-choice button:disabled { cursor: default; color: #87909a; }
.ep-sound-choice button:not(:disabled):hover { color: #fff3df; }
.ep-sound-choice button:focus-visible { outline: 3px solid #caff8e; outline-offset: 3px; }
.ep-sound-choice svg { width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.ep-entry-sound > small { color: #9babb7; font-size: .72rem; line-height: 1.4; }
.ep-entry-sound + .ep-role-choices { margin-top: 16px; }
@media (max-width: 600px) {
  .ep-entry-sound { margin-top: 20px; padding-top: 18px; gap: 7px 12px; }
  .ep-sound-choice button { font-size: .71rem; padding-inline: 12px; }
  .ep-entry-sound > small { font-size: .66rem; }
  .ep-entry-sound + .ep-role-choices { margin-top: 12px; }
}

/* Small legal links stay at the bottom of the initial choice screen. */
.ep-entry-panel { padding-bottom: max(76px,calc(64px + env(safe-area-inset-bottom))); }
.ep-entry-details { position: absolute; top: max(18px,env(safe-area-inset-top)); right: max(21px,env(safe-area-inset-right),min(5vw,80px)); display: inline-flex; align-items: center; gap: 12px; min-height: 44px; padding: 10px 0; color: #d8d7cf; font-size: .75rem; line-height: 1.4; text-decoration: none; transition: color .2s; }
.ep-entry-details:hover { color: #ffe6be; }
.ep-entry-details:focus-visible { outline: 2px solid #caff8e; outline-offset: 4px; }
.ep-entry-details > span[aria-hidden] { color: #ddc492; font-size: 1rem; }
.ep-entry-legal { position: absolute; bottom: max(14px,env(safe-area-inset-bottom)); display: flex; gap: 22px; }
.ep-entry-legal a { display: inline-flex; align-items: center; min-height: 44px; color: #9aaebc; font-size: .7rem; text-decoration: none; text-underline-offset: 4px; }
.ep-entry-legal a:hover { color: #e5d8c0; text-decoration: underline; }
.ep-entry-legal a:focus-visible { outline: 2px solid #caff8e; outline-offset: 4px; border-radius: 2px; }
@media (min-width: 901px) and (max-height: 800px) {
  .ep-entry-panel { padding-top: 28px; padding-bottom: 72px; }
}
@media (max-width: 900px) and (max-height: 700px) {
  .ep-entry-panel { padding-top: max(82px,calc(64px + env(safe-area-inset-top))); }
}