/* A compact portrait inside an ALPHA letter orbit. */
.hero-portrait{align-self:center;align-items:center;flex-direction:column;width:100%;height:auto;min-height:0;margin:0;overflow:visible}
.portrait-system{width:100%;max-width:565px;aspect-ratio:1;position:relative;isolation:isolate}
.portrait-aura{position:absolute;inset:5%;border-radius:50%;background:radial-gradient(circle,#b38b3a25 25%,#bf994711 55%,transparent 71%);filter:blur(22px)}
.portrait-frame{position:absolute;inset:14%;border-radius:50%;overflow:hidden;z-index:3;border:1px solid #d6b57466;background:radial-gradient(ellipse at 40% 10%,#3c3021,#171918 65%,#0e1113);box-shadow:0 0 0 8px #d1ac6109,0 0 0 9px #d1ac6125,0 22px 55px #0008}
.portrait-frame img{position:absolute;left:0;top:-1%;width:100%;height:auto;max-width:none;max-height:none;object-fit:contain;filter:none;display:block}
.letter-orbit{position:absolute;inset:0;width:100%;height:100%;color:#d5b675;z-index:1;overflow:visible;animation:letter-orbit-turn 55s linear infinite;filter:drop-shadow(0 0 6px #c5a46735)}
.letter-orbit text{font:22px Arial,Helvetica,sans-serif;font-weight:600;letter-spacing:9px}
.precision-orbit{position:absolute;inset:0;width:100%;height:100%;z-index:2;fill:none;stroke:#d5b675;stroke-width:1;stroke-opacity:.35;animation:precision-turn 32s linear infinite reverse}
.precision-orbit .orbit-arc{stroke-width:2;stroke-opacity:.7;stroke-dasharray:38 250 8 210 24 400 5 450}
.precision-orbit .orbit-point{fill:#f4d598;stroke-opacity:1;filter:drop-shadow(0 0 7px #e6ba67)}
.orbital-tag{position:absolute;z-index:4;display:inline-flex;align-items:center;gap:8px;padding:7px 12px;border:1px solid #c6a4685c;background:#111719e8;backdrop-filter:blur(8px);color:#c6b084;font-size:8px;letter-spacing:.15em;border-radius:4px;box-shadow:0 8px 25px #0008;animation:orbital-tag-float 8s ease-in-out infinite alternate}
.orbital-tag b{font-size:18px;line-height:1;color:#e4c582;font-weight:400}.orbital-tag i{width:4px;height:4px;background:#e5c07d;border-radius:50%;box-shadow:0 0 8px #ebc17d}
.tag-alpha{right:8%;top:24%}.tag-x24{left:6%;bottom:23%;animation-delay:-4s}
.hero-portrait .portrait-id{position:static;margin:8px 0 0;width:77%;max-width:425px;display:flex;justify-content:space-between;align-items:center}
.hero-portrait .portrait-id>b{font-size:30px;font-weight:400;line-height:1}
.hero-portrait .portrait-id>span{font-size:6px;letter-spacing:.16em;color:#a59b86}
/* The opening is a single 3.6-second sequence, including its exit. */
.visually-hidden{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
.alpha-entrance{background:#080a0c!important;max-width:100vw;width:100vw;height:100dvh;max-height:100dvh;border:0;padding:0;margin:0;border-radius:0;overflow:hidden;box-shadow:none}
.alpha-entrance[open]{animation:none}
.alpha-entrance.is-playing{animation:alpha-opening-exit 3.6s linear both}
/* Fade over the actual profile, without a second opaque dialog surface. */
.alpha-entrance::backdrop{background:transparent;backdrop-filter:none;-webkit-backdrop-filter:none}
.alpha-entrance #enter-profile{position:absolute;z-index:20;right:30px;top:28px;background:#141719b8;border-color:#d6b8755c;color:#d7c293;font-size:10px;min-height:38px;padding:9px 15px}
.intro-stage{position:absolute;inset:0;display:grid;place-items:center;isolation:isolate;overflow:hidden}
.intro-grid{position:absolute;inset:0;background-image:linear-gradient(#d7af6713 1px,transparent 1px),linear-gradient(90deg,#d7af6713 1px,transparent 1px);background-size:80px 80px;mask-image:radial-gradient(ellipse,#000,transparent 66%);opacity:.5}
.intro-logo{position:absolute;left:50%;top:48%;transform:translate(-50%,-50%);width:min(440px,64vw);z-index:5;opacity:0;background:transparent;filter:none;-webkit-filter:none}
/* Keep transparent logo pixels out of animated filter surfaces (Safari). */
.intro-logo img{display:block;width:100%;height:auto;object-fit:contain;background:transparent;filter:none;-webkit-filter:none}
.is-playing .intro-logo{animation:alpha-logo-resolve 1.25s 1.15s cubic-bezier(.16,.8,.25,1) both}
.letter-gather{position:absolute;inset:0;z-index:4;pointer-events:none}
.gather-letter{position:absolute;left:50%;top:48%;font-family:Arial,Helvetica,sans-serif;font-size:clamp(40px,6vw,90px);line-height:1;font-weight:800;color:#e2bd77;text-shadow:0 0 20px #efba5466;opacity:0}
.is-playing .gather-letter{animation:alpha-letter-converge 1.6s var(--delay) cubic-bezier(.36,.05,.2,1) both}
.intro-energy{position:absolute;left:50%;top:48%;width:min(600px,80vw);aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,#edc27440,transparent 62%);transform:translate(-50%,-50%);opacity:0}
.is-playing .intro-energy{animation:alpha-energy 2.3s .6s both}
.intro-ripple{position:absolute;left:50%;top:48%;width:260px;aspect-ratio:1;border:1px solid #edca8580;border-radius:50%;opacity:0;transform:translate(-50%,-50%) scale(.4);box-shadow:0 0 30px #d9ad451a,inset 0 0 30px #d9ad451a}
.is-playing .intro-ripple{animation:alpha-ripple 1.6s 1.25s ease-out both}
.intro-signature{position:absolute;top:calc(48% + 115px);left:50%;transform:translateX(-50%);font-size:10px;color:#cdb684;letter-spacing:.4em;white-space:nowrap;opacity:0}
.intro-signature span{padding-inline:18px;color:#7b6a49}
.is-playing .intro-signature{animation:alpha-signature-in .7s 1.8s both}
.intro-footer{position:absolute;bottom:38px;left:5%;right:5%;display:flex;justify-content:space-between;gap:20px;font-size:7px;letter-spacing:.2em;color:#9b8968;z-index:6}
.intro-timeline{position:absolute;bottom:0;left:0;right:0;height:2px;background:#b2914b22;z-index:8}
.intro-timeline i{display:block;width:100%;height:100%;background:#d2ad68;transform-origin:left;transform:scaleX(0)}
.is-playing .intro-timeline i{animation:alpha-timeline 3.6s linear both}
.profile-arrival.motion-on .hero-copy>*{animation:profile-arrive .7s both;animation-delay:calc(var(--order,0) * 35ms)}
.profile-arrival.motion-on .portrait-system{animation:portrait-arrive 1s .15s both}
@keyframes letter-orbit-turn{to{transform:rotate(360deg)}}
@keyframes precision-turn{to{transform:rotate(360deg)}}
@keyframes orbital-tag-float{to{transform:translateY(-7px)}}
@keyframes alpha-letter-converge{0%{opacity:0;transform:translate(calc(-50% + var(--sx)),calc(-50% + var(--sy))) rotate(var(--angle)) scale(1.3)}15%{opacity:1}68%{opacity:.95}100%{opacity:0;transform:translate(calc(-50% + var(--tx)),calc(-50% + var(--ty))) rotate(0deg) scale(.4)}}
@keyframes alpha-logo-resolve{from{opacity:0;transform:translate(-50%,-50%) scale(.94)}to{opacity:1;transform:translate(-50%,-50%) scale(1)}}
@keyframes alpha-energy{0%,100%{opacity:0}45%{opacity:1}}
@keyframes alpha-ripple{0%{opacity:0;transform:translate(-50%,-50%) scale(.4)}15%{opacity:.7}100%{opacity:0;transform:translate(-50%,-50%) scale(2.2)}}
@keyframes alpha-signature-in{from{opacity:0;margin-top:10px}to{opacity:1;margin-top:0}}
@keyframes alpha-timeline{to{transform:scaleX(1)}}
@keyframes alpha-opening-exit{0%,86%{opacity:1}100%{opacity:0}}
@keyframes profile-arrive{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
@keyframes portrait-arrive{from{opacity:0;transform:scale(.97)}to{opacity:1;transform:scale(1)}}
.motion-off .letter-orbit,.motion-off .precision-orbit,.motion-off .orbital-tag{animation:none!important}
.motion-off .intro-logo,.motion-off .intro-signature{opacity:1;animation:none!important}
.motion-off .gather-letter,.motion-off .intro-ripple,.motion-off .intro-energy{display:none}
.ambient-off .portrait-aura{opacity:0}.ambient-off .letter-orbit{filter:none}
@media(max-width:1000px){.portrait-system{max-width:470px}.tag-alpha{right:4%}.tag-x24{left:3%}.hero-portrait .portrait-id{width:80%}.hero-portrait .portrait-id>b{font-size:25px}}
@media(max-width:600px){.hero-portrait{width:100%;margin:24px auto 30px;max-width:395px}.portrait-system{width:100%;max-width:370px}.portrait-frame{inset:14%}.hero-portrait .portrait-id{width:76%;margin-top:8px}.hero-portrait .portrait-id>b{font-size:25px}.orbital-tag{padding:6px 8px;font-size:6px;gap:6px}.orbital-tag b{font-size:14px}.tag-alpha{right:5%;top:23%}.tag-x24{left:4%;bottom:23%}.letter-orbit text{font-size:24px}.alpha-entrance #enter-profile{top:20px;right:20px;font-size:9px;min-height:35px}.intro-logo{width:72vw}.intro-signature{top:calc(48% + 80px);font-size:8px;letter-spacing:.25em}.intro-signature span{padding-inline:10px}.intro-footer{bottom:27px;font-size:6px;letter-spacing:.1em;left:6%;right:6%}.intro-grid{background-size:60px 60px}.intro-ripple{width:180px}}
@media(prefers-reduced-motion:reduce){html:not(.motion-on) .letter-orbit,html:not(.motion-on) .precision-orbit,html:not(.motion-on) .orbital-tag{animation:none!important}html:not(.motion-on) .intro-logo,html:not(.motion-on) .intro-signature{opacity:1;animation:none!important}html:not(.motion-on) .gather-letter{display:none}}
