/* A single light chamber holds its place while the next document prepares. */
@view-transition { navigation:none; }
.page-transition { position:fixed; inset:0; z-index:80; display:grid; place-items:center; overflow:hidden; isolation:isolate; color:#eadbd1; background:#09080a; pointer-events:auto; }
.page-transition[hidden] { display:none!important; }
.page-transition::before { content:""; position:absolute; inset:-30%; z-index:-1; background:radial-gradient(ellipse at 60% 50%,#8d172535,transparent 54%),linear-gradient(110deg,transparent 37%,#b4263215 49%,transparent 61%); animation:transition-glow 3.2s ease-in-out infinite alternate; }
.page-transition::after { content:""; position:absolute; left:50%; top:16%; bottom:16%; width:1px; background:linear-gradient(transparent,#ee695c55,transparent); box-shadow:0 0 35px 9px #b42c3720; transform:rotate(14deg); opacity:.5; animation:transition-light 2.4s ease-in-out infinite alternate; }
.page-transition__center { position:relative; z-index:1; display:flex; align-items:center; flex-direction:column; padding:30px; }
.page-transition__brand { display:block; width:118px; height:auto; opacity:.6; margin-bottom:27px; }
.page-transition__id { color:#de786f; font:300 54px/1 var(--font-mono,monospace); letter-spacing:-.07em; margin:0 0 21px; }
.page-transition__caption { font:10px/1.6 var(--font-interface,sans-serif); color:#d2b5ac; letter-spacing:.18em; }
.page-transition__track { position:relative; width:142px; height:1px; margin-top:23px; overflow:hidden; background:#bd6a5426; }
.page-transition__track::after { content:""; position:absolute; inset:0; background:linear-gradient(90deg,transparent,#ed8270,transparent); transform:translateX(-100%); animation:transition-progress 1.5s cubic-bezier(.4,0,.2,1) infinite; }
.page-transition__back { position:absolute; bottom:calc(35px + env(safe-area-inset-bottom)); left:50%; transform:translateX(-50%); min-height:44px; display:flex; align-items:center; color:#b4938b; font:10px var(--font-interface,sans-serif); letter-spacing:.12em; text-decoration:none; }
.page-transition[data-phase="cover"] { animation:transition-cover 620ms cubic-bezier(.65,0,.22,1) both; }
.page-transition[data-phase="cover"] .page-transition__back { visibility:hidden; }
.page-transition[data-phase="reveal"] { pointer-events:none; animation:transition-reveal 700ms cubic-bezier(.25,.7,.2,1) both; }
.page-transition[data-phase="reveal"] .page-transition__center { animation:transition-center-out 550ms ease both; }
html[data-page-transition="cover"] .brand-sound,html[data-page-transition="cover"] .brand-replay { pointer-events:none; }
@keyframes transition-cover { from { transform:translateX(100%); } to { transform:translateX(0); } }
@keyframes transition-reveal { 0% { opacity:1; transform:translateY(0); } 100% { opacity:0; transform:translateY(-16px); } }
@keyframes transition-center-out { to { opacity:0; transform:translateY(-12px); } }
@keyframes transition-progress { to { transform:translateX(100%); } }
@keyframes transition-glow { from { opacity:.5; transform:translateX(-3%); } to { opacity:1; transform:translateX(3%); } }
@keyframes transition-light { from { opacity:.2; transform:translateX(-35px) rotate(14deg); } to { opacity:.6; transform:translateX(35px) rotate(14deg); } }
@media(max-width:680px) { .page-transition__brand { width:104px; }.page-transition__id { font-size:46px; }.page-transition__back { bottom:calc(23px + env(safe-area-inset-bottom)); } }
@media(max-height:500px) { .page-transition__brand { width:82px; margin-bottom:16px; }.page-transition__id { font-size:35px; margin-bottom:15px; }.page-transition__track { margin-top:16px; }.page-transition__back { left:auto; right:24px; bottom:14px; transform:none; } }
@media(prefers-reduced-motion:reduce) { .page-transition,.page-transition::before,.page-transition::after,.page-transition__track::after,.page-transition .page-transition__center { animation:none!important; } }
