/* ADDED 11/6/26 — shared styles for /help/ pages (hub, setup, troubleshooting). */
:root {
  --brand-red:#E51A0F; --brand-orange:#E65C14; --brand-gold:#FFBF00;
  --dark:#0a0a0a; --dark-2:#111111; --dark-3:#1a1a1a;
  --white:#ffffff; --white-80:rgba(255,255,255,0.8); --white-60:rgba(255,255,255,0.6);
  --white-20:rgba(255,255,255,0.2); --white-08:rgba(255,255,255,0.08);
  --green:#34C759; --ios-blue:#0A84FF; --purple:#7C5CFF;
  --grad:linear-gradient(90deg,var(--brand-red),var(--brand-orange),var(--brand-gold));
  --font-display:'Barlow Condensed',sans-serif; --font-body:'Barlow',sans-serif;
}
*,*::before,*::after { box-sizing:border-box; margin:0; padding:0; }
body { background:var(--dark); color:var(--white); font-family:var(--font-body); line-height:1.55; }
.wrap { max-width:720px; margin:0 auto; padding:32px 16px 64px; }
header.site { display:flex; align-items:center; gap:12px; margin-bottom:28px; }
header.site img { width:44px; height:44px; border-radius:11px; }
header.site a { color:var(--white); text-decoration:none; font-family:var(--font-display); font-weight:800; font-size:22px; text-transform:uppercase; letter-spacing:.3px; }
header.site .spacer { flex:1; }
header.site .back { font-family:var(--font-body); font-weight:600; font-size:14px; text-transform:none; color:var(--white-60); }
.eyebrow { font-weight:600; font-size:13px; letter-spacing:1.2px; text-transform:uppercase; color:var(--brand-orange); margin-bottom:6px; }
h1 { font-family:var(--font-display); font-weight:800; font-size:clamp(34px,8vw,48px); line-height:1.02; text-transform:uppercase; margin-bottom:14px; }
h2.section { font-family:var(--font-display); font-weight:800; font-size:28px; text-transform:uppercase; margin:40px 0 6px; }
h2.section small { display:block; font-family:var(--font-body); font-size:15px; font-weight:500; text-transform:none; color:var(--white-60); margin-top:2px; }
.gradient-text { background:var(--grad); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; }
.lead { color:var(--white-80); font-size:17px; margin-bottom:10px; }
.checked { display:inline-block; font-size:13px; color:var(--white-60); background:var(--white-08); border-radius:999px; padding:5px 12px; margin:8px 0 24px; }
strong { color:var(--white); }
a { color:var(--brand-orange); }
.where { display:inline-block; font-size:12px; font-weight:700; letter-spacing:1px; text-transform:uppercase; border-radius:999px; padding:4px 10px; margin-bottom:12px; }
.where.parent { background:rgba(124,92,255,0.18); color:#b6a6ff; }
.where.child { background:rgba(230,92,20,0.18); color:#ffab7a; }
.callout { border-radius:16px; padding:16px 18px; margin:0 0 20px; display:flex; gap:12px; }
.callout .ic { font-size:22px; line-height:1.2; }
.callout p { color:var(--white-80); font-size:15px; }
.callout.red { background:rgba(229,26,15,0.12); border:1px solid rgba(229,26,15,0.35); }
.callout.yellow { background:rgba(255,191,0,0.10); border:1px solid rgba(255,191,0,0.35); }
.callout.purple { background:rgba(124,92,255,0.12); border:1px solid rgba(124,92,255,0.35); }
.callout.green { background:rgba(52,199,89,0.10); border:1px solid rgba(52,199,89,0.35); }
.checklist { list-style:none; background:var(--dark-2); border:1px solid var(--white-08); border-radius:18px; padding:8px 18px; margin-bottom:20px; }
.checklist li { display:flex; gap:12px; padding:12px 0; border-top:1px solid var(--white-08); color:var(--white-80); font-size:15px; }
.checklist li:first-child { border-top:none; }
.checklist .box { flex:none; width:22px; height:22px; border-radius:6px; border:2px solid var(--brand-orange); margin-top:1px; }
.step { background:var(--dark-2); border:1px solid var(--white-08); border-radius:20px; padding:20px; margin-bottom:16px; }
.step-head { display:flex; align-items:center; gap:12px; margin-bottom:10px; }
.num { flex:none; width:34px; height:34px; border-radius:50%; background:var(--grad); color:#fff; font-weight:800; display:flex; align-items:center; justify-content:center; font-size:16px; }
.step h3 { font-family:var(--font-display); font-weight:800; font-size:23px; text-transform:uppercase; line-height:1.1; }
.step p, .step li { color:var(--white-80); font-size:16px; }
.step p { margin-bottom:10px; }
.step p:last-child { margin-bottom:0; }
.step ol, .step ul { padding-left:20px; margin:4px 0 10px; }
.step li { margin:4px 0; }
.why { font-size:14px !important; color:var(--white-60) !important; }
.must { display:inline-block; font-size:11px; font-weight:800; letter-spacing:1px; text-transform:uppercase; background:var(--brand-red); color:#fff; border-radius:6px; padding:2px 7px; margin-left:6px; vertical-align:middle; }
.ios { background:#1c1c1e; border-radius:14px; overflow:hidden; margin:12px 0; border:1px solid #2c2c2e; }
.ios .crumb { font-size:12px; color:#8e8e93; padding:9px 14px 4px; letter-spacing:.2px; }
.ios .row { display:flex; align-items:center; gap:10px; padding:11px 14px; border-top:1px solid #2c2c2e; font-size:15px; color:#fff; }
.ios .row:first-of-type { border-top:none; }
.ios .glyph { width:28px; height:28px; border-radius:7px; display:flex; align-items:center; justify-content:center; font-size:15px; flex:none; }
.ios .grow { flex:1; }
.ios .chev { color:#636366; font-size:17px; }
.ios .hl { background:rgba(10,132,255,0.16); }
.ios .hl .grow { color:var(--ios-blue); font-weight:600; }
.toggle { width:46px; height:28px; border-radius:999px; background:var(--green); position:relative; flex:none; }
.toggle::after { content:''; position:absolute; right:2px; top:2px; width:24px; height:24px; border-radius:50%; background:#fff; }
.cards { display:grid; grid-template-columns:1fr; gap:14px; margin:10px 0 8px; }
@media (min-width:600px) { .cards { grid-template-columns:1fr 1fr; } }
.card { display:block; text-decoration:none; color:var(--white); background:var(--dark-2); border:1px solid var(--white-08); border-radius:20px; padding:20px; transition:border-color .15s; }
.card:hover { border-color:var(--brand-orange); }
.card .ic { width:44px; height:44px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:22px; margin-bottom:12px; }
.card h3 { font-family:var(--font-display); font-weight:800; font-size:22px; text-transform:uppercase; line-height:1.1; margin-bottom:4px; }
.card p { color:var(--white-60); font-size:15px; }
.card .go { color:var(--brand-orange); font-weight:600; font-size:14px; margin-top:10px; display:inline-block; }
details.q { background:var(--dark-2); border:1px solid var(--white-08); border-radius:16px; margin-bottom:10px; }
details.q summary { list-style:none; cursor:pointer; padding:16px 18px; display:flex; gap:12px; align-items:center; font-weight:600; font-size:16px; }
details.q summary::-webkit-details-marker { display:none; }
details.q summary .ic { font-size:20px; flex:none; }
details.q summary .grow { flex:1; }
details.q summary::after { content:'+'; font-size:22px; color:var(--white-60); flex:none; }
details.q[open] summary::after { content:'\2212'; }
details.q .a { padding:0 18px 18px 50px; color:var(--white-80); font-size:15px; }
details.q .a p { margin-bottom:8px; }
details.q .a ol, details.q .a ul { padding-left:18px; margin:4px 0 8px; }
details.q .a li { margin:3px 0; }
.btn { display:inline-block; background:var(--grad); color:#fff; text-decoration:none; font-weight:700; border-radius:12px; padding:12px 20px; }
footer { margin-top:44px; padding-top:20px; border-top:1px solid var(--white-08); color:var(--white-60); font-size:13px; text-align:center; }