/* 外圈停稳，内盘浮起后阴阳片直接分离，摄像机同步穿过开口。 */
.entry-transition { position: fixed; inset: 0; z-index: 10; overflow: hidden; background: var(--paper); isolation: isolate; }
.entry-world { position: absolute; inset: 0; perspective: var(--camera-perspective); }
.entry-camera { position: absolute; inset: 0; transform-style: preserve-3d; }
.portal-wheel {
  position: absolute; width: var(--portal-size); height: var(--portal-size);
  transform: translate(-50%, -50%) scale(var(--portal-scale, .8)); transform-style: preserve-3d; pointer-events: none;
}
.entry-disc, .inner-piece { will-change: transform; }
.entry-gimbal { position: relative; width: 100%; height: 100%; transform-style: preserve-3d; }
.entry-disc { --wheel-size: var(--portal-size); position: relative; width: 100%; height: 100%; transform-style: preserve-3d; }
.entry-disc-light { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; transform: translateZ(-.5px); filter: drop-shadow(0 5px 0 #e5e5dc) drop-shadow(0 18px 20px rgb(43 46 56 / 14%)); }
.entry-pointer { position: absolute; inset: 0; width: 100%; height: 100%; transform: translateZ(2px); pointer-events: none; }
.outgoing-content { position: absolute; inset: 0; transform-origin: center; }
.outgoing-trigrams { position: absolute; inset: 0; width: 100%; height: 100%; }
.orbit-drawing { position: absolute; inset: 0; filter: none; }
.well-cover, .inner-taiji { position: absolute; left: 50%; top: 50%; width: 60.8%; height: 60.8%; }
.well-cover { border-radius: 50%; background: #fff; transform: translate(-50%, -50%) translateZ(-1px); }
.inner-taiji { transform: translate(-50%, -50%) scale(.025); opacity: 0; transform-style: preserve-3d; }
.inner-spin { position: absolute; inset: 0; transform-style: preserve-3d; will-change: transform; }
.inner-piece { position: absolute; inset: 0; transform-style: preserve-3d; }
.inner-piece svg { display: block; width: 100%; height: 100%; overflow: visible; }
.yin-piece { filter: drop-shadow(0 3px 0 #20232b) drop-shadow(0 7px 9px rgb(43 46 56 / 12%)); }
.yang-piece { filter: drop-shadow(0 3px 0 #e3e3dc) drop-shadow(0 7px 9px rgb(43 46 56 / 12%)); }
/* 遮住圆孔以外的环境，同时保留真正能穿过的内圈开口。 */
.entry-surface {
  position: absolute; inset: -100%; background: var(--paper); transform: translateZ(-2px);
  mask-image: radial-gradient(circle at center, transparent calc(var(--aperture-size) / 2 - 1px), #000 calc(var(--aperture-size) / 2));
}
.space-backdrop {
  position: absolute; inset: -100%; transform: translateZ(calc(var(--space-depth) * -1));
  background: #e8eaeb url('assets/marble-room.jpg') center / cover no-repeat;
}
.depth-ring {
  position: absolute; left: 50%; top: 50%; width: var(--aperture-size); height: var(--aperture-size);
  border: 2px solid rgb(255 255 248 / 70%); border-radius: 50%;
  box-shadow: 0 0 24px rgb(245 240 214 / 25%), inset 0 0 28px rgb(90 114 108 / 12%);
}
.depth-near { transform: translate(-50%, -50%) translateZ(-160px); }
.depth-middle { transform: translate(-50%, -50%) translateZ(-600px); }
.depth-far { transform: translate(-50%, -50%) translateZ(-1300px); }
.well-glow { position: absolute; inset: -50%; transform: translateZ(calc(var(--space-depth) * -1 + 1px)); background: radial-gradient(circle, rgb(255 248 213 / 30%), transparent 32%); opacity: .35; }
.entry-transition[data-phase="spinning"] .space-backdrop,
.entry-transition[data-phase="spinning"] .depth-ring,
.entry-transition[data-phase="spinning"] .well-glow { visibility: hidden; }
/* 倾斜初转会穿过这张平面；仅在盘面停平后才允许它参与深度遮挡。 */
.entry-transition[data-phase="idle"] .entry-surface,
.entry-transition[data-phase="spinning"] .entry-surface { visibility: hidden; }
.arrival-flight-layer { position: fixed; inset: 0; z-index: 20; overflow: hidden; pointer-events: none; isolation: isolate; }
.arrival-brand { --arrival-size: clamp(56px, 6vw, 80px); position: absolute; left: max(20px, env(safe-area-inset-left)); top: max(20px, env(safe-area-inset-top)); width: var(--arrival-size); pointer-events: none; }
.arrival-mark { position: relative; width: 100%; height: var(--arrival-size); }
/* 字形外框按实际墨迹裁齐，与太极同宽；高度随宽度等比变化，不依赖系统字体。 */
.arrival-wordmark { display: block; width: 100%; height: auto; margin-top: 8px; }
.arrival-mark.is-spinning { animation: arrival-spin 36.5s linear infinite; }
/* 5 秒加速 + 3 秒匀速 + 5 秒减速 + 15 秒静止；峰值 10800°/秒。 */
@keyframes arrival-spin {
  0% { transform: rotate(0deg); animation-timing-function: cubic-bezier(.333333, 0, .666667, .333333); }
  6.849315% { transform: rotate(13500deg); animation-timing-function: linear; }
  10.958904% { transform: rotate(29700deg); animation-timing-function: cubic-bezier(.333333, .666667, .666667, 1); }
  17.808219% { transform: rotate(43200deg); animation-timing-function: linear; }
  100% { transform: rotate(43200deg); }
}
.arrival-mark .yin-piece { filter: drop-shadow(0 1px 0 #20232b) drop-shadow(0 3px 4px rgb(43 46 56 / 12%)); }
.arrival-mark .yang-piece { filter: drop-shadow(0 1px 0 #e3e3dc) drop-shadow(0 3px 4px rgb(43 46 56 / 12%)); }
.entry-scene { position: relative; min-height: 100dvh; background: #e8eaeb url('assets/marble-room.jpg') center / cover no-repeat; color: var(--ink); }
.entry-content p { color: #697a75; }
.entry-content .return-button { color: #445d55; border-color: rgb(68 93 85 / 30%); }
.entry-content .return-button:hover { background: rgb(255 255 255 / 35%); }
@media (prefers-reduced-motion: reduce) {
  .arrival-mark.is-spinning { animation: none; }
}