/* FredSky — shared styles for the tiny public site (privacy / support).
   Modeled on Minnow Lake's site/style.css, restyled to FredSky's retro-80s
   planetarium identity (deep navy field, neon cyan/orange/magenta accents). */
:root {
  --page: #081024;      /* deepest navy — page field */
  --navy: #0e163d;      /* card / zenith navy */
  --ink: #e7ecf7;       /* body text */
  --cream: #fff0d2;     /* headings / brand */
  --sub: #8ea0c2;       /* muted labels */
  --cyan: #2fd0d9;
  --orange: #ff9934;
  --magenta: #b62789;
  --line: rgba(47, 208, 217, 0.18);
}
* { box-sizing: border-box; margin: 0; padding: 0; }
body {
  font-family: ui-rounded, -apple-system, 'SF Pro Rounded', 'Segoe UI', system-ui, sans-serif;
  background: var(--page);
  color: var(--ink);
  line-height: 1.65;
  -webkit-font-smoothing: antialiased;
}
header {
  /* deep navy field with the icon's ring gradient as a thin top edge */
  background:
    linear-gradient(90deg, var(--magenta), var(--orange), var(--cyan)) top / 100% 3px no-repeat,
    radial-gradient(120% 140% at 50% -10%, #14235c 0%, var(--navy) 45%, var(--page) 100%);
  color: #fff;
  padding: 48px 20px 38px;
  text-align: center;
  border-bottom: 1px solid var(--line);
}
header .brand {
  font-size: 30px;
  font-weight: 800;
  letter-spacing: 3px;
  text-transform: uppercase;
  background: linear-gradient(90deg, var(--magenta), var(--orange), var(--cyan));
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
header .tag {
  font-size: 11px;
  letter-spacing: 3px;
  color: var(--sub);
  text-transform: uppercase;
  margin-top: 8px;
}
main {
  max-width: 720px;
  margin: 0 auto;
  padding: 32px 20px 60px;
}
h1 { font-size: 26px; color: var(--cream); margin-bottom: 4px; letter-spacing: 0.3px; }
.updated {
  font-size: 13px;
  color: var(--sub);
  margin-bottom: 24px;
}
h2 { font-size: 19px; color: var(--cyan); margin: 28px 0 8px; }
p, li { font-size: 16px; color: var(--ink); margin-bottom: 10px; }
ul { padding-left: 24px; margin-bottom: 12px; }
strong { color: var(--cream); }
a { color: var(--cyan); text-decoration: none; }
a:hover { color: var(--orange); text-decoration: underline; }
.card {
  background: linear-gradient(180deg, var(--navy), #0b1330);
  border: 1px solid var(--line);
  border-radius: 16px;
  padding: 28px;
  box-shadow: 0 0 0 1px rgba(0,0,0,0.2), 0 18px 50px -30px rgba(47,208,217,0.35);
}
nav.foot {
  font-size: 13px;
  text-align: center;
  color: var(--sub);
  margin-top: 28px;
}
nav.foot a { color: var(--sub); margin: 0 8px; }
nav.foot a:hover { color: var(--cyan); }