.syntra-opening{position:fixed;inset:0;margin:0;width:100vw;max-width:none;height:100dvh;max-height:none;padding:24px;border:0;color:#eafffc;background:#070d15;overflow:auto;z-index:20000;box-sizing:border-box}
.syntra-opening::backdrop{background:#070d15}.syntra-opening:not([open]){display:none}
.syntra-opening[open]{display:grid;place-items:center}
.opening-content{position:relative;z-index:1;text-align:center;width:min(100%,620px);margin:auto}
.opening-kicker{font:13px var(--font-display,sans-serif);letter-spacing:.2em;color:#7ae9df;margin:0 0 18px}
.opening-content h1{font:800 clamp(48px,12vw,120px)/1 var(--font-display,sans-serif);letter-spacing:-.04em;margin:0;color:#f0ff74;text-shadow:3px 0 #ff75c744,-3px 0 #49ffe455}
.opening-content h1 span{color:#49ffe4;font-size:.55em;vertical-align:middle;margin-left:12px}
.opening-ghost{width:190px;height:210px;margin:6px auto;--accent:#63fff4;--accent-soft:#49ffe426;--surface:#09141c;--surface-raised:#10232c}
.opening-line{font-size:clamp(20px,4vw,28px);line-height:1.4;margin:8px 0 18px;color:#eafffc}
.opening-note{font-size:16px;color:#acbfc7;line-height:1.5;margin:16px 0 22px}
.opening-progress{height:3px;width:min(300px,75%);margin:auto;background:#49ffe421;overflow:hidden}.opening-progress i{display:block;height:100%;background:#49ffe4;transform-origin:left;animation:opening-progress 3s linear both}
.opening-skip{display:inline-flex;gap:28px;align-items:center;padding:13px 22px;min-height:48px;background:#13232c;border:1px solid #49ffe480;color:#eafffc;font:inherit;font-size:16px;cursor:pointer}.opening-skip:hover{background:#23404a}.opening-skip:focus-visible{outline:3px solid #efff63;outline-offset:5px}
.opening-grid{position:absolute;inset:0;overflow:hidden;background:radial-gradient(ellipse at 50% 45%,#1d756129,transparent 60%),repeating-linear-gradient(0deg,transparent 0 39px,#49ffe408 39px 40px),repeating-linear-gradient(90deg,transparent 0 39px,#49ffe408 39px 40px)}
.opening-grid:before,.opening-grid:after{content:'';position:absolute;left:-5%;right:-5%;height:13%;top:25%;border-top:1px solid #49ffe44d;border-bottom:1px solid #ff75c733;background:repeating-linear-gradient(0deg,transparent 0 4px,#49ffe40a 4px 5px);animation:opening-signal 2.8s steps(1,end) both;pointer-events:none}.opening-grid:after{top:65%;animation-direction:reverse;opacity:.4}
@keyframes opening-progress{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes opening-signal{0%{transform:translateY(-50%);opacity:0}18%{transform:translate(2%,15%);opacity:.6}35%{transform:translate(-1%,80%);opacity:.3}58%{transform:translate(1%,140%);opacity:.6}80%,100%{transform:translateY(220%);opacity:0}}
@media(max-height:620px){.opening-ghost{width:120px;height:125px}.opening-content h1{font-size:clamp(44px,10vw,60px)}.opening-kicker{margin-bottom:8px}.opening-note{margin:8px 0}.opening-line{margin:4px 0 12px}}
@media(prefers-reduced-motion:reduce){.syntra-opening *{animation:none!important}}