/* The opening is an encounter. Names belong to the figures;
   the invitation lives between them, and the full caption stays above. */
#door .presence-invitation {
  position:absolute;left:var(--invitation-x,50%);top:var(--invitation-y,44%);
  transform:translate(-50%,-50%);width:auto;margin:0;
  opacity:var(--presence-copy,1);
}
#door .threshold-actions { position:static;inset:auto;transform:none;margin:0;opacity:1; }
#door #door-play {
  flex-direction:column;align-items:center;gap:16px;min-width:120px;min-height:120px;
  padding:10px 8px;transform:none;
}
#door #door-play svg { width:64px;height:64px;overflow:visible; }
#door #door-play .journey-orbit { stroke:#8b662e;stroke-width:.6;opacity:.6; }
#door #door-play .journey-inner { stroke:#9d763d;stroke-width:.45;opacity:.22; }
#door #door-play .journey-axis { fill:none;stroke:#8a6027;stroke-width:.7;opacity:.55; }
#door #door-play .journey-beat { fill:none;stroke:#805719;stroke-width:1;opacity:calc(.35 + var(--human-pulse,0)*.65); }
#door #door-play .journey-receipt { fill:none;stroke:#a87420;stroke-width:1.3;opacity:var(--received-signal,0); }
#door #door-play:hover .journey-orbit,
#door #door-play:focus-visible .journey-orbit { stroke-width:1;opacity:1; }
#door #door-play .play-copy { text-align:center; }
#door #door-play .play-copy b { font-size:10px;line-height:1.4;letter-spacing:.025em;max-width:none;white-space:nowrap; }
#door #door-play .play-copy i { display:block;font-size:9px;line-height:1.5;margin-top:5px;letter-spacing:.015em;color:#62553e; }
#door .presence-caption {
  position:absolute;left:50%;top:clamp(106px,13vh,240px);bottom:auto;transform:translateX(-50%);
  display:block;width:min(600px,calc(100% - 48px));max-width:none;margin:0;
  font:500 clamp(20px,1.8vw,30px)/1.4 Cinzel,serif;letter-spacing:-.015em;
  text-align:center;color:#62503a;opacity:var(--presence-copy,1);pointer-events:none;
}
#door .presence-caption em { font-style:normal;color:#80591f; }
#door .presence-label {
  left:var(--human-label-x,27%);top:var(--label-y,32%);width:180px;
  transform:translate(-100%,-50%);display:flex;flex-direction:column;
  align-items:flex-end;justify-content:center;gap:6px;text-align:right;
}
#door .presence-twin { left:var(--twin-label-x,73%);transform:translateY(-50%);align-items:flex-start;text-align:left; }
#door .presence-label>span:first-child { font:500 17px/1.3 Cinzel,serif;letter-spacing:-.015em; }
#door .presence-label small { margin:0;font-size:9px;line-height:1.5;min-height:14px;max-width:none;white-space:nowrap; }
#door .presence-label .presence-trace { display:block;width:60px;height:14px;margin:0; }
#door .presence-label::after { content:none; }
#door .presence-reflection {
  position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;
  mix-blend-mode:screen;filter:brightness(4);
  opacity:calc(.02 + var(--received-signal,0)*.16);pointer-events:none;
}
@media(max-width:1200px) and (orientation:portrait) {
  #door .threshold-world::before,#door #door-ambient,#door .presence-reflection {
    top:0;bottom:auto;height:81%;object-position:center;object-fit:contain;
    mask-image:linear-gradient(transparent var(--media-clear,0%),#000 var(--media-solid,8%),#000 var(--media-ground,90%),transparent var(--media-end,100%));
  }
  #door .threshold-world::after {
    background:linear-gradient(180deg,rgba(250,244,227,.22),transparent 23%,transparent 56%,rgba(244,237,220,.25) 69%,var(--world-air) 85%);
  }
  #door .threshold-world::before { background-size:contain; }
  #door .presence-label { width:clamp(60px,17vw,140px);gap:5px; }
  #door .presence-label>span:first-child { font-size:12px;letter-spacing:-.02em; }
  #door .presence-label small { font-size:9px;min-height:14px;white-space:normal; }
  #door .presence-label .presence-trace { width:38px;height:12px; }
  #door .presence-caption { top:88px;bottom:auto;font-size:clamp(18px,4.3vw,28px); }
  #door #door-play { gap:12px;min-width:100px;min-height:104px;padding:6px 0; }
  #door #door-play svg { width:52px;height:52px; }
  #door #door-play .play-copy b { font-size:9px;letter-spacing:0;max-width:72px;margin-inline:auto;white-space:normal; }
  #door #door-play .play-copy i { font-size:9px; }
}
@media(max-width:760px) and (max-height:670px) and (orientation:portrait) {
  #door .threshold-world::before,#door #door-ambient,#door .presence-reflection { top:28px;height:72%; }
  #door .presence-label { gap:3px; }
  #door .presence-label>span:first-child { font-size:10px; }
  #door .presence-label small { font-size:8px;min-height:12px; }
  #door .presence-caption { top:76px;bottom:auto;font-size:16px; }
  #door #door-play { gap:9px;min-width:88px;min-height:92px; }
  #door #door-play svg { width:44px;height:44px; }
  #door #door-play .play-copy b { font-size:8px; }
  #door #door-play .play-copy i { font-size:8px; }
}
@media(min-width:761px) and (max-width:1200px) and (orientation:portrait) {
  #door .presence-label>span:first-child { font-size:14px; }
  #door .presence-label small { font-size:11px; }
  #door #door-play svg { width:68px;height:68px; }
  #door #door-play .play-copy b { font-size:12px; }
  #door #door-play .play-copy i { font-size:11px; }
}
@media(max-height:600px) and (orientation:landscape) {
  #door .threshold-world { background-size:cover;background-repeat:no-repeat;background-color:var(--world-air); }
  #door #door-ambient,#door .presence-reflection { object-fit:contain; }
  #door .threshold-world::before {
    content:'';position:absolute;inset:0;
    background:var(--world-poster) center/contain no-repeat;
  }
  #door .threshold-world::before,#door #door-ambient {
    mask-image:linear-gradient(90deg,transparent 8%,#000 18%,#000 82%,transparent 92%);
  }
  #door .presence-label { width:150px;gap:3px; }
  #door .presence-label>span:first-child { font-size:10px; }
  #door .presence-label small { font-size:8px;min-height:12px; }
  #door .presence-label::after { display:none; }
  #door #door-play { min-width:100px;min-height:92px;gap:8px;padding:4px; }
  #door #door-play svg { width:44px;height:44px; }
  #door #door-play .play-copy b { font-size:9px; }
  #door #door-play .play-copy i { font-size:8px; }
  #door .presence-caption { top:auto;bottom:3px;width:290px;font-size:14px; }
}
@media(max-height:360px) and (orientation:landscape) {
  #door .presence-label { width:115px; }
  #door .presence-caption { top:auto;bottom:3px;width:230px;font-size:11px; }
  #door #door-play { min-width:90px;min-height:86px; }
  #door #door-play svg { width:38px;height:38px; }
  #door #door-play .play-copy b { font-size:8px; }
}
@media(min-width:2200px) {
  #door .presence-label { width:320px;gap:10px; }
  #door .presence-label small { font-size:13px; }
  #door .presence-label>span:first-child { font-size:25px; }
  #door .presence-label .presence-trace { width:88px;height:20px; }
  #door #door-play { gap:23px;min-width:180px;min-height:180px; }
  #door #door-play svg { width:96px;height:96px; }
  #door #door-play .play-copy b { font-size:14px; }
  #door #door-play .play-copy i { font-size:12px; }
  #door .presence-caption { font-size:30px;width:800px; }
}
@media(prefers-reduced-motion:reduce) {
  #door .presence-reflection { opacity:.04; }
}
@media(max-width:360px) and (orientation:portrait) {
  #door #door-play .play-copy b { max-width:52px;margin-inline:auto;white-space:normal; }
}
