:root{
    --navy:#182067;
    --navy-soft:#2b3494;
    --pink:#e0457b;
    --bg:#f5f6fb;
    --card:#ffffff;
    --line:#e2e5f2;
    --text:#2a2d45;
    --muted:#6b6f8c;
    --ok:#1f9d6b;
    --warn:#c9772a;
    --warnbg:#fff7ec;
    --okbg:#eefaf3;
    --radius:14px;
    --shadow:0 2px 10px rgba(24,32,103,.06);
  }
  *{box-sizing:border-box}
  html{scroll-behavior:smooth}
  body{
    margin:0;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
    color:var(--text);background:var(--bg);line-height:1.55;
  }
  a{color:var(--navy-soft)}
  /* Header */
  header.site{
    background:linear-gradient(135deg,var(--navy),#0f1547);color:#fff;padding:38px 24px 26px;
  }
  header.site .inner{max-width:1080px;margin:0 auto}
  header.site h1{margin:0 0 6px;font-size:30px;letter-spacing:-.5px}
  header.site p{margin:0;color:#c7cbef;max-width:680px}
  .badge{display:inline-block;background:rgba(255,255,255,.14);color:#fff;font-size:12px;
    padding:3px 10px;border-radius:999px;margin-bottom:14px;letter-spacing:.4px}
  /* Tabs */
  nav.tabs{position:sticky;top:0;z-index:50;background:#fff;border-bottom:1px solid var(--line);
    box-shadow:var(--shadow)}
  nav.tabs .inner{max-width:1080px;margin:0 auto;display:flex;gap:4px;overflow-x:auto;padding:0 16px}
  nav.tabs button{
    border:0;background:none;padding:16px 16px 13px;font-size:15px;font-weight:600;color:var(--muted);
    cursor:pointer;border-bottom:3px solid transparent;white-space:nowrap;transition:.15s}
  nav.tabs button:hover{color:var(--navy)}
  nav.tabs button.active{color:var(--navy);border-bottom-color:var(--pink)}
  /* Layout */
  main{max-width:1080px;margin:0 auto;padding:30px 20px 80px}
  .tabpane{display:none;animation:fade .25s ease}
  .tabpane.active{display:block}
  @keyframes fade{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
  h2.section{font-size:24px;margin:6px 0 4px;color:var(--navy)}
  .lead{color:var(--muted);margin:0 0 22px;max-width:760px}
  /* Chip nav */
  .chips{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 26px}
  .chips a{background:#fff;border:1px solid var(--line);color:var(--navy);text-decoration:none;
    font-size:13px;font-weight:600;padding:6px 12px;border-radius:999px}
  .chips a:hover{border-color:var(--pink);color:var(--pink)}
  /* Card */
  .block{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);
    padding:0;margin:0 0 26px;overflow:hidden;box-shadow:var(--shadow);scroll-margin-top:70px}
  .block > .head{padding:20px 24px 4px}
  .block h3{margin:0;font-size:20px;color:var(--navy);display:flex;align-items:center;gap:10px;flex-wrap:wrap}
  .block h3 .slug{font-size:12px;font-weight:600;color:var(--muted);background:var(--bg);
    border:1px solid var(--line);padding:2px 8px;border-radius:6px;font-family:ui-monospace,Menlo,monospace}
  .block .purpose{color:var(--muted);padding:6px 24px 0}
  .shot{padding:18px 24px 4px}
  .shot img{width:100%;height:auto;border-radius:10px;border:1px solid var(--line);display:block;background:#fafbff}
  .shot .cap{font-size:12px;color:var(--muted);margin-top:6px;text-align:center}
  .noshot{margin:14px 24px 0;font-size:13px;color:var(--muted);background:var(--bg);
    border:1px dashed var(--line);border-radius:10px;padding:10px 14px}
  .block .body{padding:8px 24px 22px}
  /* Tables */
  table{width:100%;border-collapse:collapse;margin:10px 0 4px;font-size:14px}
  th,td{text-align:left;padding:10px 12px;border-bottom:1px solid var(--line);vertical-align:top}
  th{background:#fafbff;color:var(--navy);font-size:12px;text-transform:uppercase;letter-spacing:.4px}
  td.fname{font-weight:600;white-space:nowrap}
  .ftype{display:inline-block;font-size:11px;font-family:ui-monospace,Menlo,monospace;color:var(--navy-soft);
    background:#eef0fb;border-radius:5px;padding:1px 6px}
  .req{color:var(--pink);font-weight:700;margin-left:4px}
  /* Callouts */
  .note{border-radius:10px;padding:12px 16px;margin:14px 0;font-size:14px;border:1px solid}
  .note.warn{background:var(--warnbg);border-color:#f0d8b8;color:#8a5212}
  .note.ok{background:var(--okbg);border-color:#c4ebd5;color:#15663f}
  .note.info{background:#eef1ff;border-color:#d2d9ff;color:#2c3680}
  .note b{font-weight:700}
  /* Misc */
  ul.tight{margin:8px 0;padding-left:20px}
  ul.tight li{margin:4px 0}
  code{font-family:ui-monospace,Menlo,monospace;font-size:.9em;background:#eef0fb;padding:1px 5px;border-radius:5px}
  .grid2{display:grid;grid-template-columns:1fr 1fr;gap:16px}
  @media(max-width:720px){.grid2{grid-template-columns:1fr}}
  .pill{display:inline-block;font-size:11px;font-weight:700;padding:2px 9px;border-radius:999px;letter-spacing:.3px}
  .pill.cpt{background:#eef0fb;color:var(--navy)}
  .pill.tax{background:#fdeaf2;color:var(--pink)}
  footer.foot{max-width:1080px;margin:0 auto;padding:0 20px 60px;color:var(--muted);font-size:13px}
  .toc-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:18px 22px;margin-bottom:24px;box-shadow:var(--shadow)}
  .toc-card h4{margin:0 0 8px;color:var(--navy)}

/* ---- Doc navigation (between theme pages) ---- */
.docnav{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:18px}
.docnav a,.docnav span{font-size:13px;font-weight:600;text-decoration:none;padding:6px 14px;border-radius:999px;
  border:1px solid rgba(255,255,255,.25);color:#dfe2ff;background:rgba(255,255,255,.08);transition:.15s}
.docnav a:hover{background:rgba(255,255,255,.2);color:#fff}
.docnav a.active{background:#fff;color:var(--navy);border-color:#fff}
.docnav span.soon{opacity:.5;cursor:default}
/* diff badges */
.diff{display:inline-block;font-size:10px;font-weight:800;letter-spacing:.5px;padding:2px 8px;border-radius:999px;vertical-align:middle;margin-left:4px}
.diff.new{background:#e7f7ee;color:#15824f;border:1px solid #b9e6cd}
.diff.changed{background:#fff2e0;color:#9a5b12;border:1px solid #f0d6ab}
.diff.plugin{background:#eef0fb;color:var(--navy);border:1px solid #d2d9ff}
/* theme cards on index */
.theme-cards{display:grid;grid-template-columns:1fr 1fr 1fr;gap:18px;margin:24px 0}
@media(max-width:820px){.theme-cards{grid-template-columns:1fr}}
.theme-cards a.tc,.theme-cards div.tc{display:block;text-decoration:none;background:#fff;border:1px solid var(--line);
  border-radius:var(--radius);padding:22px;box-shadow:var(--shadow);color:var(--text);transition:.15s}
.theme-cards a.tc:hover{border-color:var(--pink);transform:translateY(-2px)}
.theme-cards .tc h3{margin:0 0 6px;color:var(--navy)}
.theme-cards .tc.disabled{opacity:.55}
.theme-cards .tc .tag{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.4px;color:var(--pink)}
.steps{counter-reset:step;list-style:none;padding:0;margin:14px 0}
.steps li{position:relative;padding:10px 0 10px 46px;border-bottom:1px solid var(--line)}
.steps li:before{counter-increment:step;content:counter(step);position:absolute;left:0;top:10px;width:30px;height:30px;
  background:var(--navy);color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:14px}

/* CSV example blocks */
pre.csv{background:#0f1547;color:#dfe3ff;border-radius:10px;padding:14px 16px;overflow:auto;
  font-family:ui-monospace,Menlo,monospace;font-size:12.5px;line-height:1.6;margin:10px 0;border:1px solid #2b3494}
pre.csv b{color:#ffd9ea;font-weight:700}
.mini-table{font-size:12px;margin:8px 0}
.mini-table th,.mini-table td{padding:5px 9px}