:root {
  color-scheme: dark;
  --bg: #1a1510;
  --text: #e8dcc8;
  --muted: #ab9a83;
  --terracotta: #c4632a;
  --ochre: #d4920a;
  --sage: #7a9a6a;
  --line: #56402c;
  --faint-line: #35291e;
  --serif: 'Playfair Display', Georgia, serif;
  --body: 'DM Sans', system-ui, sans-serif;
}
* { box-sizing: border-box; }
body { margin: 0; min-height: 100svh; display: flex; flex-direction: column; background: var(--bg); color: var(--text); font-family: var(--body); -webkit-font-smoothing: antialiased; }
a { color: inherit; text-decoration: none; }
a:hover { color: var(--ochre); }
button, select { font: inherit; }
:focus-visible { outline: 2px solid var(--ochre); outline-offset: 7px; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.skip-link { position: fixed; top: -100px; left: 20px; z-index: 5; padding: 12px; background: var(--bg); }
.skip-link:focus { top: 16px; }
.grain { position: fixed; inset: 0; pointer-events: none; z-index: 3; opacity: .045; background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%23fff' filter='url(%23n)' d='M0 0h200v200H0z'/%3E%3C/svg%3E"); }
.masthead, footer { display: flex; justify-content: space-between; align-items: center; margin: 0 5vw; }
.masthead { min-height: 106px; }
.monogram { font-family: var(--serif); font-size: 29px; font-weight: 800; letter-spacing: -2px; }
.monogram span { color: var(--terracotta); }
.language select { padding: 12px 7px; border: 0; color: var(--muted); background: var(--bg); font-size: 11px; letter-spacing: .12em; cursor: pointer; }
main { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; padding: 38px 24px 36px; }
h1 { margin: 0; font-family: var(--serif); font-weight: 800; font-size: clamp(66px, 8.2vw, 118px); letter-spacing: -.055em; line-height: .98; }
h1 span { display: block; color: var(--terracotta); }
.message { margin: 29px 0 10px; font-family: 'Lora', Georgia, serif; font-style: italic; font-size: 22px; }
.description { margin: 0; font-size: 12px; line-height: 1.8; color: var(--muted); }
.playground { margin-top: 24px; }
.orbit-button { display: block; padding: 0; width: 230px; height: 181px; margin: 0 auto; border: none; border-radius: 50%; background: transparent; cursor: pointer; touch-action: manipulation; -webkit-tap-highlight-color: transparent; }
.orrery { width: 100%; height: 100%; overflow: visible; }
.axis, .outer-guide { stroke: var(--faint-line); stroke-width: .8; }
.outer-guide { stroke-dasharray: 2 7; }
.orbit-ring { stroke: var(--line); stroke-width: 1; transform-origin: 140px 110px; }
.planet { stroke: var(--bg); stroke-width: 3; }
.planet-ochre { fill: var(--ochre); }
.planet-sage { fill: var(--sage); }
.sun-core { fill: var(--terracotta); }
.sun-halo { stroke: var(--terracotta); opacity: .23; }
.sun-line { stroke: var(--bg); stroke-width: 1; }
.spark { stroke: var(--ochre); stroke-width: .8; }
.speck { fill: var(--muted); }
.orbit-button:hover .sun-halo, .orbit-button:focus-visible .sun-halo { opacity: .7; }
.hint { margin: 0; color: var(--muted); font-size: 10px; letter-spacing: .06em; }
footer { min-height: 85px; border-top: 1px solid var(--faint-line); font-size: 11px; }
.contact { display: inline-flex; align-items: center; gap: 24px; min-height: 44px; }
.contact > :last-child { color: var(--terracotta); font-size: 18px; }
.legal-links { display: flex; gap: 25px; color: var(--muted); }
.legal-links a { display: flex; align-items: center; min-height: 44px; }
@media (max-width: 900px) { .masthead { min-height: 84px; } h1 { font-size: clamp(66px, 11vw, 98px); } }
@media (max-width: 600px) {
  .masthead, footer { margin-inline: 24px; }
  .masthead { min-height: 76px; }
  main { padding-top: 28px; padding-bottom: 28px; }
  h1 { font-size: clamp(56px, 14.6vw, 82px); }
  .message { font-size: 19px; margin-top: 24px; }
  .description { font-size: 11px; max-width: 260px; margin-inline: auto; }
  .playground { margin-top: 20px; }
  .orbit-button { width: 200px; height: 157px; }
  footer { min-height: 78px; font-size: 10px; }
  .legal-links { gap: 18px; }
  .contact { gap: 12px; }
}
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { scroll-behavior: auto !important; } }
@media (min-width: 601px) and (max-height: 760px) {
  .masthead { min-height: 70px; }
  main { padding-block: 20px; }
  h1 { font-size: 76px; }
  .message { margin-top: 22px; font-size: 20px; }
  .playground { margin-top: 14px; }
  .orbit-button { width: 170px; height: 134px; }
  footer { min-height: 66px; }
}