.entry-scene[hidden]{display:none}.entry-scene{position:fixed;inset:0;z-index:100;background:#080d0b;color:#e6ddc9;display:flex;flex-direction:column;justify-content:center;isolation:isolate;overflow:hidden;opacity:1;transition:opacity .8s ease}.entry-scene.departing{opacity:0;pointer-events:none}.entry-topline{position:absolute;z-index:6;top:26px;left:4%;right:4%;display:flex;justify-content:space-between;align-items:center;gap:25px}.entry-wordmark{max-width:230px;width:28vw;filter:drop-shadow(0 2px 5px #000)}.entry-textmark{font-family:var(--serif);font-size:22px;line-height:1.1;color:#eee4cb}.entry-textmark small{display:block;font-family:var(--sans);font-size:7px;letter-spacing:2.3px;margin-top:8px;color:#b8ae91}.entry-skip{background:#0a100bb3;border:1px solid #c5a77555;padding:9px 16px;color:#d8cfb9;font-size:10px;cursor:pointer;transition:background .2s}.entry-skip:hover{background:#c5a77522}.entry-stage{width:min(100vw,178vh);position:relative;aspect-ratio:16/9;align-self:center;overflow:visible;flex-shrink:0;perspective:1800px}.entry-stage:after{content:'';position:absolute;inset:0;z-index:2;pointer-events:none;box-shadow:inset 0 0 90px 30px #07100a88;background:linear-gradient(0deg,#07100b99,transparent 22%,transparent 70%,#07100b33)}.entry-frame{position:absolute;inset:0;width:100%;height:100%;object-fit:fill}.entry-gaze{opacity:0;transition:opacity .65s ease;z-index:1}.entry-video{z-index:1;opacity:0;pointer-events:none}.entry-scene.looking .entry-gaze{opacity:1}.entry-scene.video-playing .entry-video{opacity:1}.entry-vignette{position:absolute;inset:0;z-index:2;pointer-events:none;background:radial-gradient(ellipse at 50% 50%,transparent 35%,#05100799 100%)}.entry-dust{position:absolute;inset:0;z-index:3;pointer-events:none;opacity:.25;background-image:radial-gradient(1px 1px at 20% 35%,#e1d0a7 70%,transparent),radial-gradient(1px 1px at 65% 50%,#e1d0a7 70%,transparent),radial-gradient(1px 1px at 45% 75%,#e1d0a7 70%,transparent),radial-gradient(1px 1px at 82% 25%,#e1d0a7 70%,transparent);background-size:37% 61%;animation:dust-drift 18s linear infinite}.entry-scene.looking .entry-dust{animation-play-state:paused}.journal-hotspot{position:absolute;z-index:5;border:0;cursor:pointer;background:transparent;padding:0;filter:drop-shadow(0 0 7px #d8bd7344);transition:filter .3s}.journal-hotspot:before{content:'';position:absolute;inset:0;clip-path:inherit;background:#e8cb7320;border:1px solid #d6ba75;opacity:.3;animation:journal-pulse 3s ease-in-out infinite}.journal-hotspot:hover:before,.journal-hotspot:focus-visible:before{background:#e8cb7333;opacity:1;animation:none}.journal-hotspot:focus-visible{outline:2px solid #e3ce92;outline-offset:5px}.journal-label{position:absolute;z-index:6;pointer-events:none;transform:translate(-50%,0);color:#e4d9b8;text-shadow:0 2px 4px #000;white-space:nowrap;text-align:center;font-size:8px;letter-spacing:2.3px;transition:opacity .3s}.journal-label:before{content:'';display:block;width:1px;height:22px;background:#e4d9b877;margin:0 auto 8px}.entry-scene.looking .journal-label{opacity:0}.entry-scene.looking .journal-hotspot{pointer-events:none;opacity:0}.entry-bottomline{position:absolute;z-index:7;left:4%;right:4%;bottom:30px;text-align:center}.entry-bottomline .eyebrow{color:#d2ba8c;font-size:9px;margin-bottom:13px;text-shadow:0 2px 5px #000}.entry-action{border:0;border-bottom:1px solid #cbb27b66;background:transparent;color:#eadfc6;font-family:var(--serif);font-size:30px;line-height:1.3;padding:0 5px 8px;cursor:pointer;text-shadow:0 2px 6px #000}.entry-action:hover{color:#dec18a}.entry-status{font-size:10px;letter-spacing:.4px;margin:12px 0 0;color:#b2b5a7;min-height:16px;word-break:keep-all}.entry-preview-note{position:absolute;bottom:12px;left:4%;font-size:7px;color:#6e786b;z-index:8}.entry-replay{display:inline-block;border:0;background:none;color:var(--brass);font-size:9px;padding:0;cursor:pointer;margin-right:15px}@keyframes dust-drift{from{transform:translateY(0)}to{transform:translateY(-35px)}}@keyframes journal-pulse{0%,100%{opacity:.12}50%{opacity:.65}}
@media(max-width:760px){.entry-stage{width:150vw;max-width:none;transform:translateX(-4vw);aspect-ratio:16/9;margin-top:-15px}.entry-topline{top:25px;left:6%;right:6%;align-items:start}.entry-textmark{font-size:21px}.entry-textmark small{font-size:6px}.entry-wordmark{width:190px;max-width:53vw}.entry-skip{font-size:9px;padding:8px 10px}.entry-bottomline{bottom:10%;left:6%;right:6%}.entry-action{font-size:32px}.entry-status{font-size:9px;max-width:270px;margin:14px auto 0;line-height:1.7}.entry-preview-note{left:0;right:0;text-align:center;bottom:23px;font-size:7px}.entry-stage:after{box-shadow:inset 0 0 50px 15px #07100a88;background:linear-gradient(0deg,#07100bd9,transparent 25%,transparent 65%,#07100bd9)}.journal-label{font-size:6px;letter-spacing:1.7px}.journal-label:before{height:15px}.entry-vignette{background:radial-gradient(ellipse at 50% 50%,transparent 10%,#051007aa 100%)}.entry-bottomline .eyebrow{font-size:8px;margin-bottom:16px}}
@media(max-height:650px) and (min-width:761px){.entry-bottomline{bottom:18px}.entry-action{font-size:24px}.entry-status{margin-top:6px}.entry-topline{top:18px}.entry-preview-note{display:none}}
@media(prefers-reduced-motion:reduce){.entry-dust,.journal-hotspot:before{animation:none}}
.entry-stage{width:min(100vw,150vh)}@media(max-width:760px){.entry-stage{width:100vw;transform:none;margin-top:-25px}.entry-vignette{background:radial-gradient(ellipse at 50% 50%,transparent 15%,#05100777 100%)}.entry-stage:after{box-shadow:inset 0 0 22px 4px #07100a55;background:linear-gradient(0deg,#07100bb0,transparent 15%,transparent 85%,#07100ba0)}.entry-topline{align-items:center}.entry-action{font-size:34px}}
.entry-top-actions{display:flex;gap:9px}.entry-idle-video{z-index:1;transition:opacity .3s}.entry-gaze{z-index:2}.entry-video{z-index:2;transition:opacity .3s}.entry-scene.looking .entry-idle-video{opacity:0}.entry-scene.looking .entry-gaze{opacity:1}.entry-top-actions .entry-skip[aria-pressed=true]{border-color:#c5a775aa;color:#e0c99f}.hero-image-wrap img{height:216%;top:-1%}@media(max-width:760px){.entry-top-actions{gap:5px;flex-direction:column}.entry-top-actions .entry-skip{font-size:8px;padding:6px 9px}.entry-topline{align-items:start}.hero-image-wrap img{height:260%;top:-2%}}
.entry-scene.pending .journal-hotspot:before{opacity:1;animation:none;background:#e8cb7330}.entry-scene.pending .journal-label{opacity:.5}.entry-scene.video-playing .entry-video{transition:none}.entry-scene.video-playing .entry-idle-video{transition:none}
.entry-loading{display:none}.entry-booting #site-content{visibility:hidden}.entry-booting .entry-loading{position:fixed;inset:0;z-index:90;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:28px;background:#080d0b}.entry-loading img{width:250px;max-width:65vw}.entry-loading span{font-size:8px;letter-spacing:2px;color:#a99571}

.entry-replay{display:block;flex:0 0 100%;width:100%;margin:24px 0 0;padding:18px 0;border-top:1px solid #c5a77533;font-size:12px;letter-spacing:.04em}.entry-replay:hover{color:var(--ivory)}

@media(prefers-reduced-motion:reduce){.entry-scene,.entry-gaze,.entry-video{transition:none}}
@media(max-width:760px){.entry-top-actions .entry-skip{min-height:44px;min-width:86px;font-size:10px;padding:9px 10px}.entry-replay{min-height:48px}}

/* Reserve actual space for the approved quotation on narrow screens. */
@media(max-width:760px){
 .entry-scene{justify-content:flex-start;overflow-y:auto;overscroll-behavior:contain;padding:22px 0 26px;box-sizing:border-box}
 .entry-topline{position:relative;top:auto;left:auto;right:auto;width:88%;margin:0 auto;flex-shrink:0}
 .entry-stage{margin:22px 0 0;width:100%;flex-shrink:0}
 .entry-bottomline{position:relative;left:auto;right:auto;bottom:auto;width:88%;margin:22px auto 0;flex-shrink:0}
 .entry-bottomline #opening-quote{max-width:330px;font-size:15px;line-height:1.6;margin-bottom:18px}
 .entry-preview-note{position:relative;bottom:auto;margin:18px auto 0;flex-shrink:0}
}

/* A centered letter from Hong sits over the original opening scene. Its normal
   flow reserves real space for controls; short screens scroll above the dock. */
#entry-scene {
  justify-content:flex-start;
  align-items:center;
  overflow-y:auto;
  overscroll-behavior:contain;
  box-sizing:border-box;
  padding:max(20px,calc(var(--safe-top,0px) + 12px)) max(24px,calc(var(--safe-right,0px) + 12px)) 24px max(24px,calc(var(--safe-left,0px) + 12px));
}
#entry-scene .entry-topline {
  position:relative;
  top:auto;left:auto;right:auto;
  width:100%;
  margin:0;
  flex:0 0 auto;
  justify-content:flex-end;
}
#entry-scene .entry-top-actions {
  flex-direction:row;
  flex-wrap:wrap;
  justify-content:flex-end;
  gap:8px;
  margin:0;
}
#entry-scene .entry-stage {
  position:absolute;
  top:50%;left:50%;
  transform:translate(-50%,-50%);
  margin:0;
  flex-shrink:0;
}
.entry-welcome {
  position:relative;
  z-index:6;
  flex:0 0 auto;
  width:min(100%,560px);
  box-sizing:border-box;
  margin:auto 0;
  padding:24px 28px;
  text-align:center;
  color:#eee6d5;
  background:radial-gradient(ellipse at center,#080d0be8 25%,#080d0b99 65%,#080d0b00 100%);
  text-shadow:0 2px 5px #000;
  pointer-events:none;
  transition:opacity .35s ease,visibility .35s ease;
}
#entry-scene .entry-welcome .entry-wordmark {
  display:block;
  width:330px;
  max-width:100%;
  height:auto;
  margin:0 auto 22px;
}
#entry-scene .entry-welcome .entry-textmark { margin:0 auto 22px;font-size:28px; }
.entry-welcome-copy { max-width:46ch;margin:0 auto;font-family:var(--serif);font-size:16px;line-height:1.65;text-wrap:pretty; }
.entry-welcome-copy p { margin:0; }
.entry-welcome-copy p+p { margin-top:16px; }
html[lang=ko] .entry-welcome-copy { font-family:var(--sans);font-size:15px;line-height:1.8;word-break:keep-all; }
.entry-welcome-signature { margin:22px 0 0;font-size:11px;line-height:1.6;color:#c5b38f; }
.entry-welcome-signature::before { content:'';display:block;width:32px;height:1px;margin:0 auto 13px;background:#a68b57; }
.entry-welcome-signature strong { display:block;margin-bottom:4px;font-family:var(--serif);font-size:17px;font-weight:400;letter-spacing:.04em;color:#e4d5b7; }
html[lang=ko] .entry-welcome-signature strong { font-family:var(--sans);font-size:14px; }
.entry-welcome-signature span { display:block; }
.entry-welcome [hidden] { display:none!important; }
#entry-scene .entry-bottomline {
  position:relative;
  left:auto;right:auto;bottom:auto;
  flex:0 0 auto;
  width:min(100%,620px);
  margin:12px auto 0;
}
#entry-scene .entry-bottomline #opening-quote { max-width:520px;margin:0 auto 10px;font-size:11px;line-height:1.65;color:#bdbaab; }
#entry-scene .entry-action { font-size:27px; }
#entry-scene .entry-status { margin:8px auto 0; }
#entry-scene .entry-preview-note { position:relative;left:auto;right:auto;bottom:auto;margin:16px auto 0;flex-shrink:0; }
/* Keep the complete approved action video unobscured once entry begins. */
#entry-scene.looking .entry-welcome { opacity:0;visibility:hidden; }
#entry-scene.looking .entry-stage {
  position:fixed;
  top:calc((var(--visual-viewport-height,100svh) - var(--audio-dock-height))/2);
  width:min(100vw,calc((var(--visual-viewport-height,100svh) - var(--audio-dock-height))*1.5));
}
@media(max-width:760px) {
  #entry-scene { padding-top:max(16px,calc(var(--safe-top,0px) + 12px));padding-bottom:20px; }
  #entry-scene .entry-top-actions { width:100%;justify-content:center;gap:6px; }
  #entry-scene .entry-stage { width:100%; }
  .entry-welcome { padding:28px 0 20px; }
  #entry-scene .entry-welcome .entry-wordmark { width:280px;margin-bottom:20px; }
  .entry-welcome-copy { font-size:14px;line-height:1.7; }
  html[lang=ko] .entry-welcome-copy { font-size:14px;line-height:1.8; }
  .entry-welcome-signature { margin-top:20px;font-size:10px; }
  #entry-scene .entry-bottomline #opening-quote { font-size:10px; }
  #entry-scene .entry-status { max-width:300px; }
}
@media(prefers-reduced-motion:reduce) { .entry-welcome { transition:none; } }
@media(forced-colors:active) { .entry-welcome { color:CanvasText;background:Canvas;text-shadow:none; }.entry-welcome-signature::before { background:CanvasText; } }

/* Phone opening: logo, complete scene, letter and entry controls have separate
   flow regions. Desktop and the fixed action-video geometry stay unchanged. */
@media(max-width:760px) {
  #entry-scene .entry-welcome { display:contents; }
  #entry-scene .entry-welcome .entry-wordmark,
  #entry-scene .entry-welcome .entry-textmark,
  #entry-scene .entry-welcome-copy,
  #entry-scene .entry-welcome-signature { position:relative;z-index:6; }
  #entry-scene .entry-welcome .entry-wordmark,
  #entry-scene .entry-welcome .entry-textmark {
    order:1;
    flex:0 0 auto;
    margin:20px auto 0;
  }
  #entry-scene:not(.looking) .entry-stage {
    order:2;
    position:relative;
    top:auto;
    left:auto;
    transform:none;
    width:100%;
    margin:20px 0 0;
    flex:0 0 auto;
  }
  #entry-scene .entry-welcome-copy {
    order:3;
    flex:0 0 auto;
    width:min(100%,46ch);
    margin:24px auto 0;
  }
  #entry-scene .entry-welcome-signature {
    order:4;
    flex:0 0 auto;
    width:100%;
    margin:22px auto 0;
  }
  #entry-scene .entry-bottomline { order:5; }
  #entry-scene .entry-preview-note { order:6; }
}
