:root { color-scheme: dark; font-family: Arial, Helvetica, sans-serif; background: #000; color: #f3f3f3; }
* { box-sizing: border-box; }
body { margin: 0; min-height: 100svh; padding: 34px 5vw 26px; display: flex; flex-direction: column; }
a { color: inherit; text-decoration: none; }
a:hover { color: #fff; text-decoration: underline; text-underline-offset: 5px; }
a:focus-visible { outline: 2px solid #fff; outline-offset: 8px; }
header, footer { display: flex; align-items: center; justify-content: space-between; gap: 24px; }
header { min-height: 26px; }
.wordmark { display: inline-flex; align-items: center; gap: 10px; font-size: 12px; font-weight: 700; letter-spacing: 2px; }
.dot { height: 5px; width: 5px; border-radius: 50%; background: #eee; }
.domain, footer { font-size: 12px; color: #8b8b8b; }
main { flex: 1; display: flex; flex-direction: column; justify-content: center; padding: 100px 0; }
.eyebrow { font-size: 10px; text-transform: uppercase; letter-spacing: 3px; color: #929292; margin: 0 0 36px; }
h1 { font-size: clamp(60px, 20vw, 290px); line-height: .8; letter-spacing: -.075em; margin: 0 0 0 -.04em; font-weight: 800; }
h1 > span { color: #777; }
.intro { font-size: clamp(17px, 2vw, 22px); color: #b1b1b1; line-height: 1.6; margin: 40px 0 26px; }
.status { display: flex; align-items: center; gap: 10px; font-size: 12px; color: #929292; margin: 0; }
.status span { width: 5px; height: 5px; background: #c0c0c0; border-radius: 50%; }
.patreon { display: inline-flex; align-items: center; gap: 28px; width: fit-content; max-width: 100%; margin-top: 32px; padding: 18px 20px; border: 1px solid #333; border-radius: 4px; text-decoration: none; }
.patreon:hover { background: #0a0a0a; border-color: #777; text-decoration: none; }
.patreon-copy { min-width: 0; font-size: 14px; line-height: 1.5; color: #eee; }
.patreon-copy > span { display: block; }
.patreon-url { margin-top: 4px; font-size: 12px; color: #aaa; overflow-wrap: anywhere; }
.patreon-arrow { flex-shrink: 0; font-size: 22px; color: #ccc; }
footer { border-top: 1px solid #252525; padding-top: 22px; line-height: 1.6; }
footer a { color: #ccc; }
@media (max-width: 520px) { body { padding: 24px 6vw; } .domain { display: none; } main { padding: 100px 0; } h1 { font-size: 23vw; } footer { align-items: flex-start; font-size: 11px; } }