/* FRANK — one identity, four worlds. Native 3.4-second opening. */
html.intro-running, body.intro-running { overflow: hidden; scroll-behavior: auto !important; }
body.intro-running .cursor { opacity: 0 !important; }
body.intro-running :is(.site-header,.hero-top,.hero-identity,.hero-main,.hero-footer,.fragment-map,.fragment-instruction,#atmosphere,.scene-frame) { opacity: var(--intro-ui, 0) !important; pointer-events: none; }
.entrance { position: fixed; inset: 0; z-index: 20000; overflow: hidden; isolation: isolate; cursor: auto; touch-action: none; color: #f2eee7; }
.entrance-curtain { position: absolute; left: 0; right: 0; height: calc(50% + 1px); background: #0b0b0a; will-change: transform; }
.curtain-top { top: 0; animation: curtain-up 1050ms 2050ms cubic-bezier(.76,0,.24,1) both; }
.curtain-bottom { bottom: 0; animation: curtain-down 1050ms 2050ms cubic-bezier(.76,0,.24,1) both; }
.entrance-seam { position: absolute; left: 0; top: 50%; height: 1px; width: 100%; background: linear-gradient(90deg,transparent,#ee804a,transparent); transform-origin: center; animation: seam 2400ms both; }
.entrance-grid { position: absolute; inset: 0; opacity: .2; background-image: linear-gradient(#aaa08b12 1px,transparent 1px),linear-gradient(90deg,#aaa08b12 1px,transparent 1px); background-size: 80px 80px; mask-image: radial-gradient(ellipse,#000,transparent 75%); animation: stage-out 450ms 1850ms both; }
.entrance-heading { position: absolute; top: 50%; left: 50%; width: max-content; max-width: 88vw; transform: translate(-50%,-50%); animation: heading-out 550ms 1750ms cubic-bezier(.55,0,.3,1) both; }
.entrance-eyebrow { display: flex; align-items: center; gap: 12px; margin-bottom: clamp(15px,2vw,30px); color: #a8a298; font: 10px/1.4 var(--mono,monospace); letter-spacing: .2em; animation: line-in 600ms 200ms both; }
.entrance-plus { color: #f28048; font: 20px/1 monospace; }
.entrance-word { display: flex; align-items: baseline; font-family: Arial,Helvetica,sans-serif; font-size: clamp(82px,18vw,280px); font-weight: 900; letter-spacing: -.085em; line-height: .87; padding-right: .06em; }
.entrance-word > span { display: inline-block; overflow: hidden; padding: .08em .025em .08em 0; margin-right: -.025em; }
.entrance-word b { display: block; font-weight: inherit; animation: letter-in 950ms calc(80ms + var(--i,5) * 65ms) cubic-bezier(.16,1,.3,1) both; }
.entrance-word .entrance-period { color: #f28048; }
.entrance-byline { display: flex; align-items: center; justify-content: space-between; margin-top: 24px; font: 10px/1.5 var(--mono,monospace); letter-spacing: .18em; color: #a8a298; animation: line-in 650ms 600ms both; }
.entrance-byline > span:first-child { font-family: sans-serif; color: #d8d2c8; font-size: 13px; letter-spacing: .5em; }
.entrance-orbit { position: absolute; inset: 0; animation: stage-out 450ms 1750ms both; pointer-events: none; }
.entrance-orbit i { position: absolute; left: 50%; top: 50%; width: min(84vw,1120px); height: min(70vh,540px); border: 1px solid #c2b9a514; border-radius: 50%; transform: translate(-50%,-50%) rotate(-18deg); }
.entrance-orbit i + i { width: min(70vw,980px); height: min(88vh,660px); transform: translate(-50%,-50%) rotate(34deg); border-color: #c2b9a509; }
.entrance-shard { position: absolute; left: 0; top: 0; width: 43px; height: 43px; will-change: transform,opacity; }
.entrance-shard > i { position: absolute; inset: 0; display: block; transform: rotate(var(--spin,0deg)); background: conic-gradient(from 20deg,#181a19,#9a9d93 12%,#2c302d 27%,#0d0e0e 42%,#7c827a 57%,#232622 68%,#b6b9a6 80%,#181a19); box-shadow: inset 1px 1px 2px #e6d6b27a; }
.shard-0 > i { border-radius: 50%; background: radial-gradient(circle at 32% 24%,#b5baaf 0,#515a52 10%,#0b0f0e 34%,#141a17 60%,#687065 74%,#1c201c 83%); }
.shard-1 > i { clip-path: polygon(28% 0,80% 12%,100% 53%,71% 95%,18% 100%,0 43%); }
.shard-2 > i { clip-path: polygon(50% 0,100% 45%,64% 100%,0 65%); }
.shard-3 > i { border-radius: 8px; transform: rotate(var(--spin,0deg)) scale(.8); }
.entrance-shard > span { position: absolute; top: 58px; left: 50%; transform: translateX(-50%); white-space: nowrap; color: #a5a092; font: 8px/1.4 var(--mono,monospace); letter-spacing: .09em; opacity: var(--label,1); }
.entrance-skip { position: absolute; top: max(24px,env(safe-area-inset-top)); right: max(30px,env(safe-area-inset-right)); padding: 10px 16px; min-height: 44px; border: 1px solid #ded3bc33; border-radius: 2px; background: #0b0b0a9c; color: #c5bfb4; font: 10px/1.5 var(--mono,monospace); letter-spacing: .1em; cursor: pointer; }
.entrance-skip span { color: #f28048; margin-left: 8px; }
.entrance-skip:hover { border-color: #f28048; color: #fff; }
.entrance-meta { position: absolute; bottom: max(28px,env(safe-area-inset-bottom)); left: 32px; right: 32px; display: flex; justify-content: space-between; color: #827d73; font: 9px/1.4 var(--mono,monospace); letter-spacing: .13em; animation: stage-out 400ms 1950ms both; }
.entrance-count { color: #f28048; }
.entrance-replay { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 8px 0; border: 0; background: transparent; color: #aaa398; font: 9px/1.4 var(--mono,monospace); letter-spacing: .08em; cursor: pointer; }
.entrance-replay > span { color: #f28048; font-size: 15px; }
.entrance-replay:hover { color: #f28048; }
.entrance-replay[hidden] { display: none; }
.entrance-skip:focus-visible,.entrance-replay:focus-visible { outline: 2px solid #f28048; outline-offset: 4px; }
@keyframes letter-in { from { transform: translateY(115%) rotate(6deg); } to { transform: translateY(0) rotate(0); } }
@keyframes line-in { from { opacity: 0; transform: translateY(9px); } to { opacity: 1; transform: translateY(0); } }
@keyframes heading-out { to { opacity: 0; transform: translate(-50%,-64%) scale(.94); filter: blur(5px); } }
@keyframes stage-out { to { opacity: 0; } }
@keyframes curtain-up { to { transform: translateY(-101%); } }
@keyframes curtain-down { to { transform: translateY(101%); } }
@keyframes seam { 0%,10% { opacity: 0; transform: scaleX(0); } 45%,75% { opacity: .25; transform: scaleX(.7); } 86% { opacity: .7; transform: scaleX(1); } 100% { opacity: 0; transform: scaleX(1); } }
@media (max-width: 700px) {
  .entrance-word { font-size: 21vw; }
  .entrance-eyebrow { font-size: 8px; letter-spacing: .12em; }
  .entrance-byline { margin-top: 17px; font-size: 7px; letter-spacing: .08em; }
  .entrance-byline > span:first-child { font-size: 11px; }
  .entrance-shard { width: 30px; height: 30px; }
  .entrance-shard > span { top: 43px; font-size: 6px; }
  .entrance-meta { left: 20px; right: 20px; bottom: 24px; font-size: 7px; }
  .entrance-skip { top: 16px; right: 16px; }
  footer.section-shell { flex-wrap: wrap; }
}
@media (prefers-reduced-motion: reduce) { .entrance-replay { display: none; } }
