
    :root{
      --tps-blue:#3598db;
      --text:#0b2239;
      --muted:#4b5b6a;
      --bg:#ffffff;
      --panel:#f3f8fe;
      --line:#d9e7f6;
      --shadow: 0 10px 30px rgba(11,34,57,.08);
      --radius: 16px;
      --font: system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, "Apple Color Emoji","Segoe UI Emoji";
    }
    .tps-article{font-family:var(--font); color:var(--text); background:var(--bg); line-height:1.65; max-width:980px; margin:0 auto; padding:20px;}
    .tps-hero{background:linear-gradient(135deg, rgba(53,152,219,.14), rgba(53,152,219,.04)); border:1px solid var(--line); border-radius:var(--radius); padding:22px; box-shadow:var(--shadow);}
    .tps-kicker{font-size:14px; color:var(--muted); margin:0 0 6px 0;}
    .tps-h1{font-size:34px; line-height:1.15; margin:6px 0 10px 0;}
    .tps-sub{font-size:16px; color:var(--muted); margin:0;}
    .tps-meta{display:flex; flex-wrap:wrap; gap:10px; margin-top:12px; font-size:13px; color:var(--muted);}
    .pill{display:inline-flex; align-items:center; gap:6px; border:1px solid var(--line); background:#fff; padding:6px 10px; border-radius:999px;}
    .dot{width:8px; height:8px; border-radius:50%; background:var(--tps-blue); display:inline-block;}
    .toc{margin:18px 0 8px 0; padding:14px; border:1px solid var(--line); border-radius:var(--radius); background:#fff;}
    .toc h2{font-size:16px; margin:0 0 10px 0;}
    .toc ol{margin:0; padding-left:18px;}
    .toc a{color:var(--tps-blue); text-decoration:none;}
    .toc a:hover{text-decoration:underline;}
    h2{font-size:22px; margin:28px 0 10px 0;}
    h3{font-size:18px; margin:18px 0 8px 0;}
    h2 strong, h3 strong{font-weight:800;}
    p{margin:10px 0;}
    .callout{background:var(--panel); border:1px solid var(--line); border-radius:var(--radius); padding:14px 14px; margin:16px 0;}
    .callout h3{margin-top:0;}
    .grid2{display:grid; grid-template-columns:1fr; gap:12px;}
    @media (min-width:860px){ .grid2{grid-template-columns:1fr 1fr;} }
    ul{margin:10px 0; padding-left:18px;}
    li{margin:6px 0;}
    .btnrow{display:flex; flex-wrap:wrap; gap:10px; margin:14px 0 0 0;}
    .btn{
      display:inline-flex; align-items:center; justify-content:center; gap:8px;
      background:var(--tps-blue); color:#fff; text-decoration:none;
      padding:10px 14px; border-radius:999px; font-weight:700; border:1px solid rgba(53,152,219,.25);
      box-shadow: 0 10px 18px rgba(53,152,219,.20);
    }
    .btn:hover{filter:brightness(.98);}
    .btn.secondary{background:#fff; color:var(--tps-blue); box-shadow:none;}
    figure{margin:18px 0; padding:14px; border:1px solid var(--line); border-radius:var(--radius); background:#fff; box-shadow:var(--shadow);}
    figcaption{font-size:13px; color:var(--muted); margin-top:10px;}
    .svgwrap{overflow:auto;}
    .hr{height:1px; background:var(--line); margin:22px 0;}
    .checklist{border-left:5px solid var(--tps-blue); padding-left:12px;}
    .resources a{color:var(--tps-blue); text-decoration:none;}
    .resources a:hover{text-decoration:underline;}
    .faq details{border:1px solid var(--line); border-radius:12px; padding:10px 12px; background:#fff; margin:10px 0;}
    .faq summary{cursor:pointer; font-weight:800;}
    .tag{display:inline-block; font-size:12px; color:var(--muted); background:#fff; border:1px solid var(--line); padding:4px 8px; border-radius:999px;}
  