#opening{--intro-bg: #0e0b09;--intro-ink: #efe8df;--intro-dim: #9d9186;--intro-gold: #c9a36a;--intro-bar: 56px;position:fixed;inset:0;z-index:60;background:var(--intro-bg);color:var(--intro-ink);transition:opacity 1.2s ease}#opening.out{opacity:0;pointer-events:none}.intro-gate{position:absolute;inset:0;display:grid;place-content:center;justify-items:center;gap:22px;padding:0 16px;text-align:center;z-index:2;transition:opacity .5s ease}#opening.playing .intro-gate{opacity:0;pointer-events:none}.intro-gate .kicker{margin:0;color:var(--intro-gold)}.intro-name{margin:0;font-size:clamp(40px,7vw,88px);color:var(--intro-ink)}.intro-enter{margin-top:14px;font:500 11px/1 var(--sans);letter-spacing:.3em;text-transform:uppercase;color:var(--intro-ink);background:transparent;border:1px solid rgba(239,232,223,.45);padding:16px 30px 16px 33px;border-radius:999px;cursor:pointer;transition:background .25s,color .25s,border-color .25s}.intro-enter:hover,.intro-enter:focus-visible{background:var(--intro-ink);color:var(--intro-bg);border-color:var(--intro-ink);outline:none}.intro-film{position:absolute;left:0;right:0;top:0;bottom:var(--intro-bar);width:100%;height:calc(100% - var(--intro-bar));object-fit:cover;background:var(--intro-bg);opacity:0;transition:opacity .9s ease;pointer-events:none}#opening.playing .intro-film{opacity:1}.intro-bar{position:absolute;left:0;right:0;bottom:0;height:var(--intro-bar);display:flex;align-items:center;gap:20px;padding:0 24px;opacity:0;transition:opacity .6s ease .4s;pointer-events:none}#opening.playing .intro-bar{pointer-events:auto}#opening.playing .intro-bar{opacity:1}.intro-bar .kicker{margin:0;color:var(--intro-dim);white-space:nowrap}.intro-progress{flex:1;height:1px;background:#efe8df29;position:relative}.intro-progress i{position:absolute;left:0;top:0;bottom:0;width:100%;background:var(--intro-gold);transform-origin:left;transform:scaleX(0)}.intro-skip{font:500 10px/1 var(--sans);letter-spacing:.3em;text-transform:uppercase;color:var(--intro-ink);background:none;border:0;padding:12px 0 12px 12px;cursor:pointer}.intro-skip:hover,.intro-skip:focus-visible{color:var(--intro-gold);outline:none}@media (max-aspect-ratio: 1/1){.intro-film{object-fit:contain}}@media (max-width: 600px){.intro-bar .kicker{display:none}.intro-bar{padding:0 16px}}
