/* Shared future-science palette for the studio, public pages and consent controls. */
:root {
  color-scheme: dark;
  --metal-ink: #e9f4fc;
  --metal-text: #b5c6d9;
  --metal-muted: #94a9bf;
  --metal-line: #4b687d;
  --metal-base: #070d19;
  --metal-surface: #101d30;
  --metal-inset: #091322;
  --metal-chrome: linear-gradient(112deg, #1b3044 0%, #3c596e 23%, #263f54 37%, #172b3e 52%, #324e64 78%, #1a3045 100%);
  --metal-brush: repeating-linear-gradient(0deg, #dcf4ff04 0 1px, #00000004 1px 3px);
  --metal-panel: linear-gradient(125deg, #294155 0%, #182c40 28%, #101d30 60%, #1c3045 100%);
  --metal-raised: inset 0 1px 0 #d1f6ff70, inset 1px 0 0 #a6d7ed24, inset 0 -2px 0 #030913cc, 0 3px 0 #050c17, 0 12px 24px #00000055, 0 0 24px #72deef08;
  --metal-button: inset 0 1px 0 #dcfaff80, inset 0 -1px 0 #030d1eaa, 0 2px 0 #040c18, 0 5px 12px #00000040;
}
html { min-height: 100%; background: var(--metal-base); }
body {
  color: var(--metal-ink);
  background: radial-gradient(ellipse at 75% 0, #17364766, transparent 48%), #070d19;
  background-attachment: fixed;
}
/* Server-rendered information pages also work before JavaScript loads. */
.public-page { margin: 0; font: 16px/1.9 system-ui, sans-serif; }
.public-page * { box-sizing: border-box; }
.public-page main {
  max-width: 820px; margin: 32px auto; padding: 36px 40px 56px;
  background: var(--metal-brush), var(--metal-panel);
  border: 1px solid var(--metal-line); border-radius: 20px;
  box-shadow: var(--metal-raised);
}
.public-page a { color: #82e8ef; text-underline-offset: 4px; overflow-wrap: anywhere; }
.public-page nav { display: flex; gap: 12px 20px; flex-wrap: wrap; font-size: 14px; }
.public-page nav:first-child { padding-bottom: 20px; border-bottom: 1px solid var(--metal-line); }
.public-page nav:first-child a:first-child { color: var(--metal-ink); font-size: 24px; font-weight: 800; letter-spacing: -1px; text-decoration: none; text-shadow: none; }
.public-page .languages { margin-top: 20px; font-size: 13px; }
.public-page [aria-current] { font-weight: 750; }
.public-page h1 { font-size: clamp(25px, 5vw, 36px); line-height: 1.5; margin: 36px 0 16px; text-shadow: none; }
.public-page h2 { font-size: 20px; margin-top: 30px; }
.public-page p, .public-page li { color: var(--metal-text); }
.public-page .lead { font-size: 19px; color: var(--metal-ink); }
.public-page .contact { border-top: 1px solid var(--metal-line); margin-top: 40px; padding-top: 20px; }
.public-page .start {
  display: inline-block; color: var(--metal-ink); background: var(--metal-chrome);
  border: 1px solid var(--metal-line); padding: 10px 22px; border-radius: 9px;
  box-shadow: var(--metal-button); font-weight: 700; text-decoration: none; margin: 24px 0;
  transition: transform .18s, box-shadow .18s;
}
.public-page .start:active { transform: translateY(2px); box-shadow: inset 0 2px 4px #41493f40; }
.public-page a:focus-visible { outline: 2px solid #82e8ef; outline-offset: 4px; }
.public-page footer { color: var(--metal-muted); font-size: 13px; margin-top: 30px; }
.analytics-consent { color: var(--metal-ink) !important; background: #101d30 !important; border-color: var(--metal-line) !important; box-shadow: 0 4px 20px #0003; }
.analytics-consent a { color: #82e8ef !important; }
.analytics-consent button, .analytics-settings { color: var(--metal-ink) !important; background: var(--metal-chrome) !important; border-color: var(--metal-line) !important; box-shadow: var(--metal-button); }
@media (max-width: 600px) {
  .public-page main { margin: 12px; padding: 24px 20px 36px; border-radius: 14px; }
}
@media (prefers-reduced-motion: reduce) {
  .public-page .start { transition: none; }
}
