:root { color-scheme: light; font-family: Georgia, 'Times New Roman', serif; color: #171714; background: #f4efe4; }
@font-face { font-family: "Stardos Stencil"; font-style: normal; font-weight: 700; font-display: swap; src: url("/fonts/stardos-stencil-700.ttf") format("truetype"); }
* { box-sizing: border-box; }
.site-shell { isolation: isolate; min-height: 100vh; display: flex; flex-direction: column; align-items: center; justify-content: flex-start; gap: clamp(1.35rem, 4vh, 2.8rem); overflow: visible; padding: clamp(1.2rem, 4vh, 2.4rem) 2rem 1.6rem; position: relative; }
body { margin: 0; min-height: 100vh; overflow-x: clip; background-color: #f4efe4; background-image: linear-gradient(rgba(23, 23, 20, .055) 1px, transparent 1px), linear-gradient(90deg, rgba(23, 23, 20, .055) 1px, transparent 1px), radial-gradient(circle at 74% 7%, #fffdf7 0, #f4efe4 47%, #e4d6be 100%); background-size: 1.6rem 1.6rem, 1.6rem 1.6rem, auto; }
.topline { display: flex; justify-content: space-between; width: min(100%, 62rem); color: #6b6252; font: 700 .7rem/1.2 ui-monospace, SFMono-Regular, Menlo, monospace; letter-spacing: .16em; text-transform: uppercase; }
.construction-scene { animation: sceneFloat 7s ease-in-out infinite alternate; bottom: -1.8rem; height: auto; left: 50%; max-width: none; opacity: .92; pointer-events: none; position: absolute; transform: translateX(-50%); width: min(94rem, 112vw); z-index: -1; }
.mission-banner { position: relative; z-index: 0; flex: none; width: min(90vw, 34rem); margin: .35rem 0 0; padding: .78rem 1.35rem .86rem; background-color: #f4c642; background-image: linear-gradient(115deg, rgba(255, 255, 255, .34), transparent 42%), linear-gradient(0deg, rgba(124, 75, 13, .1), transparent 46%, rgba(255, 255, 255, .13)); border: .12rem solid #8d671b; border-radius: .07rem; box-shadow: .22rem .3rem 0 rgba(23, 23, 20, .18), 0 .55rem 1.1rem rgba(23, 23, 20, .14); color: #171714; font: 700 clamp(1rem, 3.25vw, 1.45rem)/1.12 "Stardos Stencil", "Stencil Std", Impact, sans-serif; letter-spacing: .075em; text-align: center; text-shadow: .03em .03em 0 rgba(115, 72, 21, .15); text-transform: uppercase; transform: rotate(-1.25deg); }
.mission-banner span { display: inline-block; white-space: nowrap; }
.mission-banner span:first-child { transform: rotate(-.35deg); }
.mission-banner span:last-child { transform: rotate(.45deg); }
.mission-banner::before, .mission-banner::after { position: absolute; top: -.48rem; width: 4.6rem; height: .9rem; background: rgba(215, 184, 111, .75); content: ""; }
.mission-banner::before { left: 7%; transform: rotate(-6deg); }
.mission-banner::after { right: 7%; transform: rotate(5deg); }
.card { position: relative; z-index: 1; width: min(100%, 42rem); padding: clamp(2.2rem, 8vw, 4.8rem) clamp(1.6rem, 7vw, 4.5rem); background: rgba(255, 252, 245, .94); border: 1px solid #d0c3ad; border-radius: .8rem; box-shadow: 0 1.25rem 4rem rgba(62, 45, 25, .15); text-align: center; }
.eyebrow { margin: 0 0 1rem; color: #7a6c58; font: 700 .76rem/1.2 ui-monospace, SFMono-Regular, Menlo, monospace; letter-spacing: .17em; text-transform: uppercase; }
h1 { margin: 0; color: #171714; font-size: clamp(3.2rem, 12vw, 6.4rem); line-height: .88; letter-spacing: -.07em; text-shadow: .08em .08em 0 #f4c642; }
.subtitle { margin: 1.55rem 0 .7rem; color: #353127; font: 700 1.16rem/1.4 ui-monospace, SFMono-Regular, Menlo, monospace; letter-spacing: -.025em; }
p:not(.eyebrow):not(.mission-banner) { max-width: 35rem; margin: .7rem auto; color: #5d5548; font-size: 1.08rem; line-height: 1.65; }
.status-line { display: inline-flex; align-items: center; gap: .55rem; margin-top: 1.65rem; padding: .6rem .8rem; border: 1px solid #d0c3ad; border-radius: 999px; color: #514938; font: 700 .72rem/1 ui-monospace, SFMono-Regular, Menlo, monospace; letter-spacing: .06em; text-transform: uppercase; }
.status-dot { width: .52rem; height: .52rem; border-radius: 50%; background: #d88c1f; box-shadow: 0 0 0 .2rem rgba(216, 140, 31, .14); }
a { display: inline-flex; justify-content: center; margin-top: 1.55rem; padding: .8rem 1.1rem; border: 1px solid #9a7a2d; border-radius: 999px; color: #353127; font: 700 .78rem/1 ui-monospace, SFMono-Regular, Menlo, monospace; letter-spacing: .06em; text-decoration: none; text-transform: uppercase; }
a:hover, a:focus-visible { background: #171714; border-color: #171714; color: #fffdf7; outline: none; }
footer { z-index: 1; color: #7a6c58; font: 700 .68rem/1.2 ui-monospace, SFMono-Regular, Menlo, monospace; letter-spacing: .14em; text-transform: uppercase; }
@keyframes sceneFloat { from { margin-bottom: 0; } to { margin-bottom: .45rem; } }
@media (prefers-reduced-motion: reduce) { .construction-scene { animation: none; } }
@media (max-height: 34rem) { main { justify-content: flex-start; gap: 1.5rem; padding-block: 1.5rem; } }
@media (max-width: 50rem) { .construction-scene { bottom: -1rem; width: 70rem; } }
@media (max-width: 32rem) { .site-shell { gap: clamp(1.35rem, 5vh, 2.25rem); padding: 1rem; } .topline { font-size: .59rem; letter-spacing: .11em; } .topline span:last-child { text-align: right; } .card { padding: 2.25rem 1.5rem; } .construction-scene { bottom: -.25rem; width: 49rem; } }