/* Shared styles for SwiftNet guide/content pages. Brand-matched, theme-aware
   (dark default + light via prefers-color-scheme), RTL-ready. */
:root{
  --bg1:#17203a; --bg2:#0b0d14; --panel:#131725; --card:#10131f; --border:#1c2135;
  --text:#e7e9f2; --muted:#9aa3bf; --dim:#7c86a6; --accent:#7c5cff; --accent2:#22d3ee;
  --good:#22c55e; --warn:#f59e0b; --bad:#ef4444;
}
@media (prefers-color-scheme: light){
  :root{ --bg1:#e8eefb; --bg2:#f6f7fb; --panel:#ffffff; --card:#ffffff; --border:#e0e5f0;
    --text:#141a2b; --muted:#59627d; --dim:#8b94ad; }
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;background:var(--bg2);color:var(--text)}
body{font-family:'Space Grotesk','Noto Sans Arabic',system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;
  -webkit-font-smoothing:antialiased;line-height:1.72;
  background:radial-gradient(1200px 600px at 50% -10%,var(--bg1) 0%,var(--bg2) 60%);min-height:100vh}
a{color:var(--accent);text-decoration:none}
a:hover{color:#a78bfa;text-decoration:underline}
nav{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:16px 26px;
  border-bottom:1px solid var(--border);position:sticky;top:0;background:rgba(11,13,20,.72);backdrop-filter:blur(10px);z-index:5}
@media (prefers-color-scheme: light){nav{background:rgba(255,255,255,.8)}}
.brand{display:flex;align-items:center;gap:12px;color:var(--text);font-weight:600;font-size:18px}
.brand:hover{text-decoration:none}
.logo{display:grid;place-items:center;width:34px;height:34px;border-radius:10px;
  background:linear-gradient(135deg,#7c5cff,#22d3ee);font-weight:700;color:#0b0d14}
.navlinks{display:flex;gap:18px;font-size:14px}
.navlinks a{color:var(--muted)}
main{max-width:820px;margin:0 auto;padding:34px 22px 72px}
.crumb{font-size:13px;color:var(--dim);margin-bottom:14px}
.crumb a{color:var(--dim)}
.kicker{font-family:'IBM Plex Mono',monospace;font-size:11px;letter-spacing:.2em;color:var(--accent);text-transform:uppercase}
h1{font-size:34px;font-weight:600;letter-spacing:-.02em;line-height:1.18;margin:10px 0 8px;text-wrap:pretty}
.updated{color:var(--dim);font-size:13px;font-family:'IBM Plex Mono',monospace;margin-bottom:22px}
.lead{font-size:18px;color:var(--text)}
h2{font-size:23px;font-weight:600;margin:38px 0 10px;letter-spacing:-.01em;text-wrap:pretty}
h3{font-size:18px;font-weight:600;margin:26px 0 6px}
p,li{color:var(--muted);font-size:16px}
li{margin:6px 0}
strong{color:var(--text);font-weight:600}
.tc{text-align:center}
/* Data tables (speed-by-activity, etc.) */
.tablewrap{overflow-x:auto;margin:16px 0;border:1px solid var(--border);border-radius:14px}
table{border-collapse:collapse;width:100%;min-width:420px;font-size:15px}
th,td{padding:11px 15px;text-align:start;border-bottom:1px solid var(--border)}
th{background:var(--card);color:var(--text);font-weight:600;font-size:12px;letter-spacing:.05em;text-transform:uppercase}
tr:last-child td{border-bottom:0}
td{color:var(--muted)}
.pill{display:inline-block;padding:2px 10px;border-radius:999px;font-size:12px;font-weight:600}
.pill.g{background:rgba(34,197,94,.16);color:var(--good)}
.pill.a{background:rgba(245,158,11,.16);color:var(--warn)}
.pill.r{background:rgba(239,68,68,.16);color:var(--bad)}
/* Callouts */
.note{border:1px solid var(--border);border-left:3px solid var(--accent);background:var(--card);
  border-radius:12px;padding:14px 18px;margin:18px 0}
.note.tip{border-left-color:var(--good)}
.note.warn{border-left-color:var(--warn)}
.note p{margin:6px 0}
/* Call-to-action */
.cta{display:flex;flex-wrap:wrap;gap:12px;align-items:center;justify-content:center;
  border:1px solid var(--border);background:linear-gradient(180deg,var(--panel),var(--card));
  border-radius:18px;padding:22px;margin:30px 0;text-align:center}
.btn{display:inline-block;font-weight:600;font-size:15px;color:#0b0d14;padding:13px 30px;border-radius:999px;
  background:linear-gradient(135deg,#22d3ee,#7c5cff);box-shadow:0 14px 34px -14px rgba(124,92,255,.9)}
.btn:hover{text-decoration:none;filter:brightness(1.05)}
/* Related guides */
.related{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:14px;margin:16px 0}
.related a{display:block;border:1px solid var(--border);background:var(--card);border-radius:14px;padding:16px 18px;color:var(--text)}
.related a:hover{border-color:var(--accent);text-decoration:none}
.related .t{font-weight:600;font-size:15px}
.related .d{color:var(--dim);font-size:13px;margin-top:4px}
footer{border-top:1px solid var(--border);padding:26px 20px;text-align:center;color:var(--dim);font-size:12px}
footer a{color:var(--dim);margin:0 8px}
/* RTL */
[dir="rtl"] body,[dir="rtl"] main{text-align:right}
[dir="rtl"] .note{border-left:1px solid var(--border);border-right:3px solid var(--accent)}
[dir="rtl"] .note.tip{border-right-color:var(--good)}
[dir="rtl"] .note.warn{border-right-color:var(--warn)}