/* Local system fonts and assets. No third-party requests. */
:root {
  color-scheme: dark;
  --night: #141323;
  --paper: #eee8df;
  --muted: #aaa5b8;
  --fox: #efa678;
  --line: #ffffff14;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  background: var(--night);
  color: var(--paper);
  -webkit-font-smoothing: antialiased;
}
* { box-sizing: border-box; }
body { margin: 0; min-width: 280px; background: radial-gradient(ellipse at 83% 41%, #46304c29, transparent 48%), radial-gradient(ellipse at 45% 110%, #4b344628, transparent 55%), var(--night); }
body::before { content: ""; position: fixed; inset: 0; pointer-events: none; opacity: .3; background-image: radial-gradient(circle at 12% 28%, #bbb3d0 0 1px, transparent 1.4px), radial-gradient(circle at 86% 16%, #bbb3d0 0 1px, transparent 1.4px), radial-gradient(circle at 71% 73%, #bbb3d0 0 .7px, transparent 1.2px), radial-gradient(circle at 39% 10%, #bbb3d0 0 .6px, transparent 1px); }
a { color: inherit; }
a:focus-visible { outline: 2px solid #f7d6a4; outline-offset: 7px; }
.page { width: min(100% - 48px, 1120px); margin-inline: auto; min-height: 100svh; display: flex; flex-direction: column; }
.site-header { min-height: 84px; display: flex; align-items: center; justify-content: space-between; }
.wordmark { display: inline-flex; align-items: center; gap: 11px; text-decoration: none; font-size: 22px; letter-spacing: -.8px; font-weight: 550; }
.brand-mark { color: var(--fox); width: 24px; }
.header-note { color: var(--muted); font-size: 11px; letter-spacing: .025em; }
.hero { display: flex; flex-direction: column; flex: 1; padding: 0 0 30px; }
.hero-art { position: relative; width: min(100%, 300px); align-self: center; margin: -10px -10px 25px; text-align: center; }
.watch-illustration { display: block; width: 100%; height: auto; overflow: visible; }
.art-caption { display: block; color: #aaa1b2; font-size: 10px; letter-spacing: .08em; margin-top: -14px; }
.tiny-star { color: #d5b991; margin-right: 6px; font-size: 10px; }
.hero-copy { position: relative; text-align: center; }
.eyebrow { display: flex; align-items: center; justify-content: center; gap: 9px; color: #c9b3a4; text-transform: uppercase; font-size: 9px; letter-spacing: .2em; margin: 0 0 20px; }
.eyebrow > span { width: 5px; height: 5px; background: var(--fox); border-radius: 50%; box-shadow: 0 0 10px #efa6783b; }
h1 { font-family: Iowan Old Style, Baskerville, "Palatino Linotype", "Book Antiqua", Georgia, serif; font-size: clamp(38px, 10.5vw, 54px); font-weight: 400; line-height: 1.09; letter-spacing: -.045em; margin: 0; }
h1 em { font-weight: 400; color: var(--fox); }
.description { color: var(--muted); font-size: 14px; line-height: 1.85; max-width: 32ch; margin: 24px auto 27px; }
.sign-in { display: inline-flex; align-items: center; justify-content: space-between; gap: 35px; padding: 15px 23px; min-height: 52px; min-width: 154px; border-radius: 5px; background: #efa678; color: #261e28; font-weight: 550; font-size: 14px; text-decoration: none; box-shadow: 0 5px 30px #ca795610, inset 0 1px 0 #ffffff35; transition: background-color .2s, transform .2s, box-shadow .2s; }
.sign-in:hover { transform: translateY(-2px); background: #f7bc93; box-shadow: 0 7px 30px #ca79562b; }
.sign-in svg { transition: transform .2s; }
.sign-in:hover svg { transform: translateX(3px); }
.private-note { display: flex; justify-content: center; align-items: center; gap: 7px; margin: 16px 0 0; font-size: 10px; color: #91899f; }
.site-footer { display: flex; justify-content: space-between; align-items: center; gap: 18px; padding: 25px 0 27px; border-top: 1px solid var(--line); color: #92899f; font-size: 10px; letter-spacing: .02em; }
.footer-domain { white-space: nowrap; }
.footer-domain > span { margin-left: 7px; color: #c0a48c; }
.skip-link { position: absolute; z-index: 10; top: 10px; left: 24px; transform: translateY(-160%); background: var(--paper); color: var(--night); padding: 12px 16px; border-radius: 4px; }
.skip-link:focus { transform: none; }
.fox-eyes { transform-box: fill-box; transform-origin: center; animation: blink 10s infinite; }
.ear-right { transform-box: fill-box; transform-origin: 50% 100%; animation: listen 13s infinite; }
.vesper-star { transform-box: fill-box; transform-origin: center; animation: glint 7s ease-in-out infinite; }
@keyframes blink { 0%, 42%, 46%, 100% { transform: scaleY(1); } 43.5%, 44.5% { transform: scaleY(.12); } }
@keyframes listen { 0%, 69%, 77%, 100% { transform: rotate(0); } 72% { transform: rotate(5deg); } 74% { transform: rotate(-2deg); } }
@keyframes glint { 0%, 100% { opacity: .55; transform: scale(.91); } 50% { opacity: 1; transform: scale(1.07); } }
@media (min-width: 760px) {
  .page { width: min(100% - 100px, 1120px); }
  .site-header { min-height: 124px; }
  .wordmark { font-size: 25px; gap: 13px; }
  .brand-mark { width: 28px; }
  .header-note { font-size: 12px; }
  .hero { flex-direction: row; align-items: center; gap: 10px; padding: 40px 0 72px; }
  .hero-copy { width: 52%; order: -1; text-align: left; }
  .hero-art { width: 51%; margin: -25px -20px 0 -10px; }
  .eyebrow { justify-content: flex-start; font-size: 10px; margin-bottom: 25px; }
  h1 { font-size: clamp(48px, 5.3vw, 68px); }
  .description { margin: 28px 0 31px; font-size: 15px; max-width: 34ch; }
  .private-note { justify-content: flex-start; font-size: 11px; margin-top: 18px; }
  .art-caption { font-size: 10px; margin-top: -36px; }
  .site-footer { padding: 29px 0 32px; font-size: 11px; }
}
@media (min-width: 1100px) { .hero { gap: 35px; } .hero-art { width: 55%; margin-right: -35px; } }
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}
/* The missing-page route shares the same quiet shell. */
.not-found { flex: 1; display: grid; align-content: center; justify-items: center; text-align: center; padding: 80px 0; }
.not-found h1 { font-size: clamp(40px, 7vw, 68px); }
.not-found .eyebrow { justify-content: center; }
.not-found .description { margin-inline: auto; }