/* Shared styles for the RosterCal website (home, privacy, terms) */
:root {
  --bg: #eef1f5; --surface: #ffffff; --ink: #0f1b2d; --muted: #5a6577; --line: #d6dce5;
  --accent: #1d4ed8; --accent-ink: #ffffff; --signal: #c27c0e;
  --k-flight: #1d4ed8; --k-duty: #0369a1; --k-layover: #0f766e; --k-standby: #b45309; --k-training: #7c3aed; --k-off: #64748b;
  --f-display: "Barlow Condensed", "Arial Narrow", system-ui, sans-serif;
  --f-body: "Barlow", system-ui, -apple-system, "Segoe UI", sans-serif;
  --f-mono: "JetBrains Mono", ui-monospace, "SF Mono", Menlo, monospace;
}
@media (prefers-color-scheme: dark) { :root {
  --bg: #0b1220; --surface: #121b2c; --ink: #e6ebf3; --muted: #93a0b4; --line: #24324a;
  --accent: #6b9bff; --accent-ink: #0b1220; --signal: #f2b544;
  --k-flight: #6b9bff; --k-duty: #38bdf8; --k-layover: #2dd4bf; --k-standby: #f59e0b; --k-training: #a78bfa; --k-off: #94a3b8;
  color-scheme: dark } }
* { box-sizing: border-box; }
html { padding-top: env(safe-area-inset-top, 0px); }
body { margin: 0; background: var(--bg); color: var(--ink); font-family: var(--f-body); font-size: 17px; line-height: 1.55; }
a { color: var(--accent); }
.wrap { max-width: 920px; margin: 0 auto; padding-block: 0;
  padding-left: max(18px, env(safe-area-inset-left, 0px)); padding-right: max(18px, env(safe-area-inset-right, 0px)); }
.nav { display: flex; align-items: center; gap: 16px; padding-block: 18px; }
.brand { font-family: var(--f-display); font-weight: 700; font-size: 1.35rem; letter-spacing: .02em; color: var(--ink); text-decoration: none; display: inline-flex; gap: 8px; align-items: center; }
.brand svg { color: var(--accent); }
.nav .sp { flex: 1; }
.nav a.link { color: var(--muted); text-decoration: none; font-size: .95rem; }
.nav a.link:hover { color: var(--ink); }
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; font: inherit; font-weight: 600; border-radius: 12px; padding: 13px 20px; text-decoration: none; border: 0; cursor: pointer; }
.btn.primary { background: var(--accent); color: var(--accent-ink); }
.btn.ghost { color: var(--accent); border: 1px solid var(--line); background: transparent; }
.btn:focus-visible, a:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
h1, h2, h3 { font-family: var(--f-display); line-height: 1.08; text-wrap: balance; margin: 0; }
.eyebrow { font-family: var(--f-mono); font-size: .78rem; letter-spacing: .08em; text-transform: uppercase; color: var(--signal); }
.muted { color: var(--muted); }
.foot { border-top: 1px solid var(--line); margin-top: 56px; padding-block: 24px 40px; font-size: .88rem; color: var(--muted); display: flex; flex-wrap: wrap; gap: 8px 18px; }
.foot a { color: var(--muted); }
/* document pages */
.doc { max-width: 68ch; padding-block: 12px 0; }
.doc h1 { font-size: clamp(2rem, 6vw, 2.8rem); margin-bottom: 6px; }
.doc h2 { font-size: 1.45rem; margin-top: 32px; margin-bottom: 6px; }
.doc p, .doc li { color: var(--ink); }
.doc ul { padding-left: 1.2em; display: flex; flex-direction: column; gap: 6px; }
.doc .updated { color: var(--muted); font-size: .92rem; margin-top: 0; }
.brand, .nav a.link { white-space: nowrap; }
@media (max-width: 520px) { .nav a.link.wide { display: none; } }
.doc { overflow-wrap: anywhere; }
@media (max-width: 440px) { .nav { gap: 10px; } .brand { font-size: 1.15rem; } .nav a.link { font-size: .88rem; } }
@media (max-width: 380px) { .nav { flex-wrap: wrap; row-gap: 2px; } .nav .sp { flex-basis: 100%; height: 0; } }
