/* Shared surfaces and typography, including a night palette built around the app. */
:root { --action:#1f65d6; --action-hover:#1854b4; }
:root[data-theme="dark"] {
  color-scheme:dark;
  --bg:#080f1b; --soft:#0e1929; --card:#142235;
  --ink:#edf3fa; --muted:#acbbce; --line:#293c52;
  --blue:#88baff; --action:#a7ceff; --action-hover:#c4dfff;
  --bezel:#324459; --glass:#17283dee; --glass-line:#415673;
  --gold:#e6c58e; --gold-soft:#1c2027; --gold-line:#78664a; --gold-hair:#4a4235;
  --sky-ring:#35465b; --sky-ring-2:#19283b; --sky-label:#e6c58e;
  --shadow:0 24px 65px -30px #000c;
}
.primary, .nav .nav-upgrade, .suite-grid .button { background:var(--action); border-color:var(--action); color:#fff; }
.primary:hover, .nav .nav-upgrade:hover, .suite-grid .button:hover { background:var(--action-hover); border-color:var(--action-hover); color:#fff; }
:root[data-theme="dark"] :is(.primary,.nav .nav-upgrade,.suite-grid .button) { color:#0c2039; }
.theme-toggle { display:grid; place-items:center; min-width:44px; width:44px; height:44px; transition:background .18s; }
.theme-toggle svg { width:22px; height:22px; }
.theme-toggle:hover { background:var(--soft); transform:none; }
:root[data-theme="dark"] .hero { background:radial-gradient(ellipse at 75% 15%,#17305470,transparent 65%); }
:root[data-theme="dark"] .hero-stage::before { box-shadow:inset 0 0 70px #050e2470; }
:root[data-theme="dark"] .flight-cue.gate { background:#e9bc55f5; color:#211c11; box-shadow:0 12px 32px -15px #dca54f60; }
:root[data-theme="dark"] .flight-cue.belt { background:#1e5396f5; box-shadow:0 12px 32px -15px #3d7cdb60; }
:root[data-theme="dark"] .brief-showcase { background:#0a1422; border:1px solid var(--line); }
:root[data-theme="dark"] .free-pill { background:#243f63; border-color:#41628d; }
:root[data-theme="dark"] .premium-pill { background:#e6c58e; border-color:#e6c58e; color:#30240e; box-shadow:none; }
:root[data-theme="dark"] .store-badge img { border-radius:9px; box-shadow:0 0 0 1px #ffffff65; }
:root[data-theme="dark"] .mobile-download { background:#122137f5; border-color:var(--line); }
:root[data-theme="dark"] .mobile-download a { background:var(--action); color:#0c2039; }
:root[data-theme="dark"] .suite-story { background:linear-gradient(120deg,#131d2b,#252425); color:var(--ink); border-color:var(--gold-hair); }
:root[data-theme="dark"] .suite-grid .eyebrow { color:var(--gold); }
:root[data-theme="dark"] .suite-grid .intro,
:root[data-theme="dark"] .suite-sub { color:var(--muted); }

/* Preserve the photographed scene, with a separate flight caption underneath. */
.sky-panel { align-items:start; }
.scene-photo { min-height:0; height:auto; background:var(--card); border:1px solid var(--line); border-radius:20px; }
.scene-photo::after { content:none; }
.scene-image { position:relative; width:100%; aspect-ratio:1; overflow:hidden; background:#071323; }
.scene-image>img { display:block; width:100%; height:100%; object-fit:cover; }
.scene-image>img[hidden] { display:none; }
.sky-panel[data-scene="sunrise"] .scene-image>img { object-fit:contain; }
.sky-panel[data-scene="night"] .scene-image>img { transform:scale(1.6); transform-origin:50% 100%; filter:brightness(1.12); }
.scene-photo figcaption { position:static; padding:18px 22px; font-size:.84rem; color:var(--muted); line-height:1.5; min-height:86px; }
.scene-photo figcaption strong { display:block; color:var(--ink); font-size:.95rem; font-weight:600; margin-bottom:4px; }
.scene-photo figcaption span { display:block; }
.scene-info { padding-block:12px 0; }
.suite-grid { grid-template-columns:.9fr 1.1fr; gap:66px; }
.suite-watercolor { margin:0; }
.suite-watercolor img { width:100%; height:auto; border-radius:18px; border:1px solid var(--gold-hair); box-shadow:0 20px 48px -30px #20180850; }
.suite-watercolor figcaption { font-size:.8rem; color:var(--muted); margin-top:16px; }
:root[data-theme="dark"] .suite-watercolor img { filter:brightness(.88) saturate(.85); border-color:#6c604d; box-shadow:0 20px 48px -20px #0008; }
.data-credit { font-size:.72rem; color:var(--muted); margin-top:28px; line-height:1.6; max-width:none; }
.about-teaser .intro { margin-top:0; }
.footer-grid { margin-bottom:32px; }
footer { border-top:1px solid var(--line); }
.footer-bottom { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:18px; border-top:1px solid var(--line); padding-top:24px; color:var(--muted); font-size:.8rem; }
.footer-bottom nav { display:flex; flex-wrap:wrap; gap:22px; }
.footer-bottom a { text-decoration:none; }
.footer-bottom a:hover { color:var(--blue); text-decoration:underline; }

/* Supporting pages use the same quiet frame, with shorter reading measures. */
.page-nav { display:flex; gap:28px; padding-block:20px; border-bottom:1px solid var(--line); overflow-x:auto; white-space:nowrap; scrollbar-width:thin; }
.page-nav a { font-size:.84rem; text-decoration:none; color:var(--muted); padding:5px 0; }
.page-nav a[aria-current] { color:var(--blue); text-decoration:underline; text-underline-offset:9px; }
.subpage .page-hero { padding-block:68px; }
.subpage .page-hero h1 { font-size:clamp(2.8rem,5.1vw,4.4rem); max-width:900px; }
.subpage .page-hero .intro { max-width:680px; font-size:1.1rem; line-height:1.65; }
.doc { max-width:760px; padding-block:64px 80px; }
.doc h1 { font-size:clamp(2.7rem,5vw,4rem); }
.doc h2 { font-size:1.45rem; line-height:1.3; letter-spacing:-.035em; margin:42px 0 14px; }
.doc p, .doc li { line-height:1.75; color:var(--muted); }
.doc .eyebrow { color:var(--blue); }
.doc strong, .doc b { color:var(--ink); }
.doc p+p { margin-top:16px; }
.doc .updated { font:12px 'B612 Mono',monospace; margin:22px 0 30px; }
.doc ul { padding-left:22px; margin:12px 0 0; }
.doc li { margin-block:12px; }
.doc a { color:var(--blue); }
.doc .support-contact { margin-top:24px; color:#fff; }
:root[data-theme="dark"] .doc .support-contact { color:#0c2039; }
.contents { margin-bottom:28px; padding:0 22px; border:1px solid var(--line); border-radius:12px; background:var(--soft); }
.contents summary { font-size:.94rem; padding-block:18px; }
.contents nav { display:grid; gap:10px; padding-bottom:22px; }
.contents nav a { font-size:.9rem; text-decoration:none; }
.contents nav a:hover { text-decoration:underline; }
.subpage .footer-links a[aria-current] { color:var(--blue); }
.sources-layout { display:grid; grid-template-columns:1fr 1fr; gap:80px; }
.sources-layout h2 { font-size:2.5rem; }
.sources-layout .intro { font-size:1rem; max-width:440px; }
.sources dl { margin:0; }
.sources dt { color:var(--ink); font-size:.92rem; font-weight:600; }
.sources dd { margin:0; font-size:.9rem; color:var(--muted); }
.principles { display:grid; gap:28px; }
.principles h3 { font-size:1.3rem; margin-bottom:12px; }
.principles p { font-size:1rem; color:var(--muted); }
.attribution-copy { max-width:840px; }
.attribution-copy h2 { font-size:1.7rem; margin-bottom:26px; }
.attribution-copy p { max-width:none; font-size:.87rem; color:var(--muted); margin-top:18px; line-height:1.75; }
.comparison .page-hero { background:radial-gradient(ellipse at 90% 15%,#1f6feb0d,transparent 65%); }
.comparison .win { padding:28px; }
.comparison .win h3 { font-weight:600; letter-spacing:-.025em; font-size:1.16rem; }
.comparison .win h3 .pill { display:table; margin:12px 0 0; }
.comparison .win p { font-size:.95rem; line-height:1.65; }
.comparison .proof { padding-top:10px; }
.comparison .cmp { font-size:.9rem; line-height:1.65; }
.comparison .cmp thead th:nth-child(2) { color:var(--blue); }
.comparison .cmp td:nth-child(2) { background:color-mix(in srgb,var(--blue) 4%,var(--card)); }
.comparison .cta h2 { margin-inline:auto; }

@media(max-width:1050px) {
  .suite-grid { gap:36px; }
  .sources-layout { gap:40px; }
}
@media(max-width:760px) {
  .scene-photo { height:auto; min-height:0; }
  .scene-image { aspect-ratio:1; }
  .scene-photo figcaption { padding:15px 18px; min-height:80px; font-size:.78rem; }
  .scene-photo figcaption strong { font-size:.9rem; }
  .suite-grid { grid-template-columns:1fr; gap:30px; }
  .suite-watercolor { margin-inline:0; }
  .suite-watercolor figcaption { font-size:.75rem; }
  .footer-bottom { flex-direction:column; align-items:flex-start; gap:16px; }
  .footer-bottom nav { gap:18px; }
  .subpage footer { padding-bottom:36px; }
  .subpage .header-inner { height:66px; }
  .page-nav { gap:24px; padding-block:13px; }
  .page-nav a { min-height:40px; display:flex; align-items:center; }
  .subpage .page-hero { padding-block:42px; }
  .subpage .page-hero h1 { font-size:clamp(2.5rem,9.5vw,3.5rem); }
  .subpage .page-hero .intro { font-size:1rem; }
  .doc { padding-block:42px 56px; }
  .doc h1 { font-size:2.65rem; }
  .doc h2 { font-size:1.3rem; margin-top:34px; }
  .doc p, .doc li { font-size:1rem; line-height:1.7; }
  .doc .updated { font-size:11px; }
  .sources-layout { grid-template-columns:1fr; gap:30px; }
  .sources-layout h2 { font-size:2rem; }
  .sources dt { margin-top:8px; }
  .comparison .wins { grid-template-columns:1fr; }
  .comparison .win { padding:24px; }
  .comparison .proof { grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
  .comparison .proof .phone { width:100%; border-width:3px; border-radius:16px; }
  .comparison .proof figcaption { font-size:.7rem; line-height:1.5; }
  .comparison .section { padding-block:48px; }
  .comparison .cmp td:nth-child(2) { background:transparent; }
  .comparison .cmp td:before { color:var(--blue); }
  .comparison .cmp td:last-child:before { color:var(--muted); }
}
@media(prefers-reduced-motion:reduce) {
  *, *:before, *:after { animation:none!important; transition:none!important; }
}
