
#dms-intro[hidden]{display:none!important}html.intro-locked{overflow:hidden}#dms-intro{position:fixed;inset:0;z-index:1000;display:grid;place-items:center;isolation:isolate;overflow:hidden;color:#d5faff;background:#090d1000;perspective:1100px}
.intro-shutter{position:absolute;top:0;bottom:0;width:50.2%;background:radial-gradient(ellipse at 100% 50%,#183036 0%,#0b1115 45%,#080b0e 90%);z-index:-1;will-change:transform;transition:transform 1s cubic-bezier(.22,.95,.32,1.12),opacity 1s}.intro-left{left:0;border-right:1px solid #76d4df24;transform-origin:left center}.intro-right{right:0;transform-origin:right center;background:radial-gradient(ellipse at 0% 50%,#183036 0%,#0b1115 45%,#080b0e 90%)}
.intro-center{text-align:center;width:min(86vw,630px);position:relative;transition:transform .6s,opacity .45s}.intro-center .brand-animation{width:min(80vw,580px);height:auto;aspect-ratio:1860/845;margin:auto;filter:drop-shadow(0 0 20px #76d4df20)}.intro-center .header-logo{position:absolute;inset:0;object-fit:contain}.intro-center .pulse-cable,.intro-center .pulse-letter{animation:none;opacity:0}.intro-running .intro-center .pulse-cable{animation:intro-cable 1.45s ease-out both}.intro-running .intro-center .pulse-letter{animation:intro-cable 1.4s ease-out both}.intro-running .intro-center .pulse-m{animation-delay:.16s}.intro-running .intro-center .pulse-s{animation-delay:.32s}
.intro-name{font-size:clamp(12px,2.1vw,19px);font-weight:700;letter-spacing:clamp(2px,.5vw,5px);margin:10px -5px 15px 0;white-space:nowrap;color:#7a969e}.intro-name span{display:inline-block}.intro-running .intro-name span{animation:intro-letter .55s ease both;animation-delay:calc(1.25s + var(--i)*.042s)}.intro-tagline{font:10px monospace;letter-spacing:4px;color:#779199;margin:18px 0 30px}.intro-meter{height:3px;width:min(210px,60vw);margin:26px auto;overflow:hidden;background:#76d4df20;opacity:0;border-radius:9px}.intro-meter i{display:block;width:100%;height:100%;background:#a8f7ff;box-shadow:0 0 16px #76d4df;transform:scaleX(0);transform-origin:left}.intro-running .intro-meter{opacity:1}.intro-running .intro-meter i{animation:intro-load .65s 2.3s ease-in-out forwards}
.intro-enter{border:1px solid #76d4df8c;border-radius:7px;background:#76d4df0d;color:#c6f8ff;padding:18px 26px;font-size:11px;letter-spacing:3px;cursor:pointer;box-shadow:0 0 32px #76d4df0d}.intro-enter span{margin-left:20px;color:#76d4df}.intro-enter:hover{background:#76d4df22;box-shadow:0 0 30px #76d4df22}.intro-running .intro-enter{visibility:hidden}.intro-status{font-size:11px;color:#7c929a;min-height:16px;letter-spacing:1px}.intro-controls{position:absolute;bottom:max(28px,env(safe-area-inset-bottom));left:0;right:0;display:flex;justify-content:center;gap:30px;transition:opacity .3s}.intro-controls button,.intro-replay{border:0;background:none;color:#8da6af;font-size:11px;cursor:pointer;padding:12px}.intro-replay{font:inherit;padding:0;color:inherit}.intro-burst{position:absolute;width:15vmin;height:15vmin;border:2px solid #b9faff;border-radius:50%;opacity:0;pointer-events:none;box-shadow:0 0 45px #76d4df,inset 0 0 25px #76d4df}.intro-reveal .intro-burst{animation:intro-burst .85s ease-out both}.intro-reveal .intro-left{transform:translateX(-110%) rotateY(14deg)}.intro-reveal .intro-right{transform:translateX(110%) rotateY(-14deg)}.intro-reveal .intro-center{transform:scale(1.22);opacity:0;pointer-events:none}.intro-reveal .intro-controls{opacity:0;pointer-events:none}
@keyframes intro-cable{0%{stroke-dashoffset:100;opacity:0}8%{opacity:.36}14%{opacity:1}18%{opacity:.288}36%{opacity:.504}40%{opacity:1}44%{opacity:.2592}66%{opacity:.432}70%{opacity:1}75%{opacity:.288}86%{opacity:.864}100%{stroke-dashoffset:-1100;opacity:0}}@keyframes intro-letter{0%{color:#7a969e}30%{color:#efffff;text-shadow:0 0 10px #76d4df,0 0 24px #76d4df;transform:translateY(-2px)}100%{color:#c1e5eb;transform:translateY(0)}}@keyframes intro-load{to{transform:scaleX(1)}}@keyframes intro-burst{0%{opacity:.75;transform:scale(.3)}100%{opacity:0;transform:scale(16)}}
@media(prefers-reduced-motion:reduce){.intro-shutter,.intro-center{transition:opacity .2s!important;transform:none!important}.intro-reveal .intro-shutter{opacity:0}.intro-burst{display:none}.intro-center .brand-pulse{display:none}.intro-running .intro-name span{color:#c1e5eb}.intro-running .intro-meter i{transform:scaleX(1)}}


/* Keep the original individual-letter animation without duplicating the name in the logo. */
.intro-center .header-logo{clip-path:inset(0 0 12% 0)}
.intro-center .brand-animation{margin-bottom:clamp(-30px,-4vw,-15px)}

/* Slow high-energy cable strike, restrained typography, then phased reveal. */
.intro-center .pulse-halo{stroke-width:10;stroke:#55eaff;filter:brightness(1.44) drop-shadow(0 0 3px #91f5ff)}
.intro-center .pulse-core{stroke-width:3;stroke:#ffffff;filter:brightness(1.44) drop-shadow(0 0 2px #ffffff)}
.intro-running .intro-center .pulse-cable{animation:intro-cable 2.8s linear both;stroke-dasharray:70 1130}
.intro-running .intro-center .pulse-letter{animation:intro-cable 2.75s ease-out both;stroke-width:3}
.intro-running .intro-center .pulse-m{animation-delay:.18s}.intro-running .intro-center .pulse-s{animation-delay:.3s}
.intro-running .intro-name span{animation:intro-letter-soft .65s ease both;animation-delay:calc(2.8s + var(--i)*.06s)}
@keyframes intro-letter-soft{0%{color:#7a969e}40%{color:#e1f7fa;text-shadow:0 0 8px #76d4df88}100%{color:#b4d5dd}}
.intro-running .intro-meter i{animation:intro-load 2.5s 4.4s cubic-bezier(.6,0,.85,.4) forwards}
.intro-running .intro-center .brand-animation{animation:intro-charge 2.5s 4.4s ease-in both}
@keyframes intro-charge{0%{filter:drop-shadow(0 0 15px #76d4df25)}70%{filter:drop-shadow(0 0 30px #76d4df70)}79%,86%,93%{transform:translateX(-2.645px) skewX(-.35deg)}80%,87%,94%{transform:translateX(2.645px) skewX(.35deg)}81%,88%,95%,100%{transform:translateX(0)}100%{filter:drop-shadow(0 0 40px #76d4df99)}}
@media(prefers-reduced-motion:reduce){.intro-running .intro-center .brand-animation{animation:none}.intro-running .intro-name span{animation:none;color:#c1e5eb}}

/* Tight white-cyan flash and a brief chromatic split during the final glitch. */
.intro-running .intro-center .pulse-letter{stroke:#e0ffff;filter:brightness(1.44) drop-shadow(0 0 7px #76d4df)}
.intro-running .intro-center .header-logo{animation:intro-rgb-split 2.5s 4.4s linear both}
@keyframes intro-rgb-split{0%,78%,81%,85%,88%,92%,95%,100%{filter:hue-rotate(112deg) saturate(.52)}79%,86%,93%{filter:hue-rotate(112deg) saturate(.52) drop-shadow(-2.645px 0 0 #76d4dfaa) drop-shadow(2.645px 0 0 #b6b9ff70)}80%,87%,94%{filter:hue-rotate(112deg) saturate(.52) drop-shadow(2.645px 0 0 #76d4dfaa) drop-shadow(-2.645px 0 0 #b6b9ff70)}}
@media(prefers-reduced-motion:reduce){.intro-running .intro-center .header-logo{animation:none}}
