:root { color-scheme: dark; --background: #08090b; --text: #f5f5f2; --muted: #a9adb5; }
* { box-sizing: border-box; }
html { min-width: 280px; background: var(--background); }
body { margin: 0; color: var(--text); background: var(--background); font-family: "Segoe UI", Arial, sans-serif; -webkit-font-smoothing: antialiased; }
main { min-height: 100vh; min-height: 100svh; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: clamp(48px, 8vh, 96px) 24px; text-align: center; }
.identity { position: relative; width: min(649px, 96.8vw); aspect-ratio: 7.1 / 1; overflow: hidden; flex: none; }
.identity img { position: absolute; display: block; width: 112%; height: auto; max-width: none; left: -6%; top: 50%; transform: translateY(-49.25%); mix-blend-mode: screen; }
h1 { margin: clamp(42px, 7vh, 70px) 0 clamp(42px, 7vh, 70px); font-size: clamp(1.665rem, 4.77vw, 3.6rem); font-weight: 550; letter-spacing: -.035em; line-height: 1.2; }
h1 span { display: block; }
.announcement p { margin: 0 0 22px; padding-left: .32em; color: var(--muted); font-size: 1rem; font-weight: 500; letter-spacing: .32em; line-height: 1.5; }
.announcement a { display: inline-block; padding: 8px 4px; color: var(--text); font-size: 1.125rem; line-height: 1.5; text-decoration: underline; text-decoration-color: #60646c; text-decoration-thickness: 1px; text-underline-offset: 7px; overflow-wrap: anywhere; }
.announcement a:hover { text-decoration-color: var(--text); }
.announcement a:focus-visible { outline: 2px solid #d7e9e3; outline-offset: 8px; border-radius: 2px; }
@media (max-width: 480px) { main { padding-inline: 18px; } .identity { width: min(99vw, calc(100vw - 24px)); } h1 { font-size: clamp(1.485rem, 6.66vw, 2.025rem); } .announcement a { font-size: 1rem; } .announcement p { font-size: .875rem; } }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { scroll-behavior: auto !important; } }