:root{color-scheme:dark;--ink:#05070c;--paper:#f5f3fa;--blue:#29a8ff;--green:#82c6ac;font-family:"Helvetica Neue",Helvetica,Arial,sans-serif}
*{box-sizing:border-box}body{margin:0;background:var(--ink);color:var(--paper)}
.public-opening{min-width:280px}.opening{height:100svh;min-height:400px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;isolation:isolate;position:relative;padding:3rem 1.5rem 5rem;overflow:hidden}
.opening-light{position:absolute;inset:0;z-index:-1;background:radial-gradient(ellipse at 50% 40%,#1272aa1c,transparent 57%),radial-gradient(ellipse at 50% 100%,#29564c0a,transparent 55%)}
.opening-mark{width:clamp(210px,32vw,390px);padding:1.2rem;outline-offset:8px;border-radius:28px;transition:filter .35s,transform .35s;filter:drop-shadow(0 0 16px #168cff33)}
.opening-mark{color:inherit;text-decoration:none;cursor:pointer}.login-door{position:absolute;z-index:2;top:1rem;right:1rem;min-width:44px;min-height:44px;padding:.6rem;border:0;background:transparent;color:#aaa7b3;font:inherit;font-size:.75rem;cursor:pointer;text-decoration:none;display:flex;align-items:center;justify-content:center}.login-door[hidden]{display:none}.login-door:focus-visible,.access-back:focus-visible{outline:2px solid var(--blue);outline-offset:2px;border-radius:4px}.access-back{color:var(--paper);margin-top:2rem;padding:1rem;text-underline-offset:.3em}.access-note{color:#aaa7b3;max-width:30rem;line-height:1.6}
.opening-mark img{display:block;width:100%;height:auto;filter:invert(1)}.identity-name{display:block;margin-top:1.4rem;font-size:clamp(1.3rem,2.2vw,2rem);font-weight:700;letter-spacing:.27em;padding-left:.27em}
.opening-mark:hover,.opening-mark:focus-visible,.opening-mark:active{filter:drop-shadow(0 0 24px #29a8ff88);transform:translateY(-3px)}
.opening-mark:focus-visible{outline:2px solid var(--blue)}
.opening h1{font-family:Georgia,"Times New Roman",serif;font-weight:400;font-size:clamp(2rem,3.7vw,3.6rem);line-height:1.14;letter-spacing:-.035em;max-width:800px;margin:2.8rem 0 0;text-wrap:balance}
.opening-signoff{position:absolute;bottom:2.25rem;margin:0;color:#aaa7b3;text-transform:uppercase;letter-spacing:.2em;font-size:.62rem}
@media(max-width:600px){.opening{padding:2rem 1.4rem 5rem}.opening-mark{width:min(72vw,300px)}.opening h1{font-size:2.25rem;margin-top:2.6rem;max-width:330px}.opening-signoff{bottom:2rem;font-size:.55rem}}
@media(max-height:600px){.opening{padding:1rem 1.2rem 3rem}.opening-mark{width:180px;padding:.3rem}.identity-name{font-size:1rem;margin-top:.6rem}.opening h1{font-size:1.65rem;margin-top:1.1rem;max-width:600px}.opening-signoff{bottom:1rem}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.opening-mark:hover,.opening-mark:focus-visible,.opening-mark:active{transform:none}}

.opening-mark{position:relative;isolation:isolate}.mark-current{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:visible;z-index:-1;fill:none;stroke:#42baff;stroke-width:1;opacity:0;transition:opacity .25s}.mark-current circle{fill:#2aaaff22;stroke:#68d1ff}.mark-current path{animation:filament-fade 1.8s ease-out forwards}.opening-mark:hover .mark-current,.opening-mark:focus-visible .mark-current,.opening-mark:active .mark-current,.wake-mark:hover .mark-current,.wake-mark:focus-visible .mark-current,.wake-mark:active .mark-current{opacity:.7}@keyframes filament-fade{from{opacity:.8}to{opacity:0}}@media(prefers-reduced-motion:reduce){.mark-current path{display:none}.opening-mark,.wake-mark{transform:none!important}}

/* The whole opening participates; its text and controls remain fixed above decoration. */
.viewport-current{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:-1;fill:none;stroke:#37b7ee;stroke-width:1}
.viewport-halo{stroke:#58bdbf;stroke-dasharray:1 8}
.viewport-thread{stroke-linecap:round}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
@media(prefers-reduced-motion:reduce){.viewport-thread{display:none}.viewport-current{transition:none}}