/* Motion Bay — Help Center theme.
   Extracted verbatim from the self-contained static articles under
   public/help/*.html so the Astro-rendered articles are visually identical.
   ONE shared sheet — no per-article CSS duplication. Loaded AFTER global.css
   (via Base's head slot) so the help palette/body background win on help pages. */

:root {
  --hbg: #07090c;
  --hpanel: #12161d;
  --hpanel2: #171c25;
  --hline: #232a35;
  --hink: #e9edf3;
  --hdim: #9aa5b4;
  --hmuted: #5b6675;
  --hcode: #a8b3c2;
  --ha1: #5ee0c8;
  --ha2: #7aa2ff;
  --ha3: #b892ff;
  --hgrad: linear-gradient(120deg, var(--ha1), var(--ha2) 55%, var(--ha3));
  color-scheme: dark;
}

/* Help pages override the marketing body background with the article gradient. */
body.help {
  background: radial-gradient(1000px 480px at 82% -10%, rgba(122, 162, 255, .09), transparent 60%),
    radial-gradient(820px 460px at 4% -4%, rgba(94, 224, 200, .07), transparent 55%),
    var(--hbg);
  color: var(--hink);
  font: 15.5px/1.66 -apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI", system-ui, sans-serif;
}

.help .wrap { max-width: 860px; margin: 0 auto; padding: 0 1.25rem 5rem; }
.help a { color: var(--ha2); text-decoration: none; }
.help a:hover { text-decoration: underline; }
.help ::selection { background: rgba(122, 162, 255, .28); }

.help header.pg { padding: 2.6rem 0 1.4rem; border-bottom: 1px solid var(--hline); margin-bottom: 1.8rem; }
.help .crumb {
  display: flex; align-items: center; gap: .6rem;
  font: 600 .7rem/1 ui-monospace, "SF Mono", Menlo, monospace;
  letter-spacing: .12em; text-transform: uppercase; color: var(--hmuted); margin-bottom: 1rem;
}
.help .crumb .dot { width: 16px; height: 16px; border-radius: 5px; background: var(--hgrad); display: inline-block; }
.help .crumb b { color: var(--ha1); font-weight: 700; }
.help .crumb a { color: var(--hmuted); }
.help .crumb a:hover { color: var(--hdim); text-decoration: none; }
.help h1.pgh { font: 650 2rem/1.12 -apple-system, system-ui; letter-spacing: -.02em; margin: 0; }
.help h1.pgh .g { background: var(--hgrad); -webkit-background-clip: text; background-clip: text; color: transparent; }
.help .sub { color: var(--hdim); margin: .55rem 0 0; font-size: .95rem; }
.help .rule { height: 3px; background: var(--hgrad); border-radius: 3px; opacity: .65; margin-top: 1.2rem; width: 120px; }

.help .md h1 { font: 650 1.7rem/1.15 -apple-system, system-ui; letter-spacing: -.02em; margin: 1.6rem 0 .6rem; }
.help .md h1:first-child { display: none; } /* page header already shows the title */
.help .md h2 { font: 650 1.34rem/1.2 -apple-system, system-ui; letter-spacing: -.01em; margin: 2.1rem 0 .6rem; padding-top: 1.1rem; border-top: 1px solid var(--hline); }
.help .md h3 { font: 650 1.1rem/1.25 -apple-system, system-ui; margin: 1.5rem 0 .4rem; color: #eef2f8; }
.help .md h4 { font: 600 .8rem/1.2 ui-monospace, Menlo, monospace; letter-spacing: .05em; text-transform: uppercase; color: var(--ha1); margin: 1.15rem 0 .4rem; }
.help .md h5, .help .md h6 { font: 600 .95rem/1.3 -apple-system, system-ui; margin: 1rem 0 .3rem; color: #dfe6f0; }
.help .md p { margin: .3rem 0 .85rem; color: var(--hdim); }
.help .md strong { color: var(--hink); font-weight: 650; }
.help .md em { color: #cfd7e2; }
.help .md ul, .help .md ol { margin: .3rem 0 1rem; padding-left: 1.3rem; }
.help .md li { margin: .32rem 0; color: var(--hdim); }
.help .md li::marker { color: var(--hmuted); }
.help .md a { color: var(--ha2); }
.help .md code { font: .84em ui-monospace, "SF Mono", Menlo, monospace; background: #0c0f14; border: 1px solid var(--hline); padding: .05rem .34rem; border-radius: 5px; color: var(--hcode); }
.help .md pre.code { margin: .4rem 0 1rem; padding: .85rem 1rem; background: #0b0e13; border: 1px solid var(--hline); border-radius: 10px; overflow-x: auto; }
.help .md pre.code code { background: none; border: 0; padding: 0; color: var(--hcode); font-size: .82rem; line-height: 1.55; }
.help .md hr { border: 0; border-top: 1px solid var(--hline); margin: 1.8rem 0; }
.help .md blockquote { margin: 1rem 0; padding: .7rem 1rem; border-left: 3px solid var(--ha2); background: rgba(122, 162, 255, .06); border-radius: 0 10px 10px 0; color: var(--hdim); }
.help .md blockquote strong { color: #cfe0ff; }
.help .tablewrap { overflow-x: auto; margin: .6rem 0 1.2rem; border: 1px solid var(--hline); border-radius: 12px; }
.help .md table { width: 100%; border-collapse: collapse; font-size: .88rem; min-width: 520px; }
.help .md th, .help .md td { text-align: left; padding: .6rem .8rem; border-bottom: 1px solid var(--hline); vertical-align: top; }
.help .md thead th { font: 600 .64rem/1.2 ui-monospace, Menlo, monospace; text-transform: uppercase; letter-spacing: .05em; color: var(--hmuted); background: var(--hpanel2); }
.help .md tbody tr:last-child td { border-bottom: 0; }
.help .md tbody tr:hover { background: rgba(255, 255, 255, .02); }
.help .md td code { font-size: .82em; }

/* Sibling cross-links + language switcher live in the footer region. */
.help .help-nav { margin-top: 2.4rem; padding-top: 1.3rem; border-top: 1px solid var(--hline); }
.help .help-nav .navlabel { font: 600 .7rem/1 ui-monospace, Menlo, monospace; letter-spacing: .12em; text-transform: uppercase; color: var(--hmuted); margin: 0 0 .7rem; }
.help .help-nav ul { list-style: none; margin: 0; padding: 0; }
.help .help-nav li { margin: .35rem 0; }
.help footer { margin-top: 2.6rem; padding-top: 1.3rem; border-top: 1px solid var(--hline); color: var(--hmuted); font-size: .8rem; }
.help footer a { color: var(--hdim); }

/* ---- Index (Help Center landing) cards ---- */
.help .cardlist { list-style: none; margin: 1.4rem 0 0; padding: 0; }
.help .cardlist li { margin: 0 0 1.1rem; }
.help .cardlist a.cardtitle { font: 650 1.1rem/1.25 -apple-system, system-ui; color: #eef2f8; }
.help .cardlist a.cardtitle:hover { color: var(--ha2); text-decoration: none; }
.help .cardlist .blurb { color: var(--hdim); margin: .2rem 0 0; }

/* ---- RTL: mirror list indentation and the gradient rule ---- */
[dir="rtl"] .help .md ul, [dir="rtl"] .help .md ol { padding-left: 0; padding-right: 1.3rem; }
[dir="rtl"] .help .md th, [dir="rtl"] .help .md td { text-align: right; }
[dir="rtl"] .help .rule { margin-left: auto; }

/* Contact & support block on the Help index (Support folded into Help).
   Vars are the h-prefixed ones defined above — the unprefixed --line/--dim/
   --muted/--a2 came from the retired legacy public/help/*.html and are defined
   nowhere in the live site, which silently killed this block's styling.
   Scoped under .help like every other rule here: this sheet now loads on the
   homepage too (to theme the Help popup), so an unscoped rule would style any
   future .help-contact outside the Help Center. */
.help .help-contact{margin:2.4rem 0 0;padding-top:1.4rem;border-top:1px solid var(--hline)}
.help .help-contact h2{font:650 1.2rem/1.2 -apple-system,system-ui;margin:0 0 .5rem}
.help .help-contact p{color:var(--hdim);margin:.3rem 0}
.help .help-contact a{color:var(--ha2)}
.help .help-contact .reqline{font-size:.9rem;color:var(--hmuted)}