.content { padding:34px 44px 90px; max-width:800px; }
  .content h1 { font-size:31px; margin-bottom:8px; letter-spacing:-.01em; }
  .free-tag { display:inline-block; background:rgba(52,211,153,.14); color:var(--mint); font-size:11px; font-weight:800; padding:3px 10px; border-radius:20px; margin-bottom:20px; }
  .content p { color:#c2cddf; line-height:1.95; margin-bottom:15px; }
  .content h2 { font-size:22px; color:var(--cyan); margin:34px 0 12px; }
  .content h3 { font-size:16.5px; color:var(--indigo); margin:20px 0 8px; }
  .content strong { color:var(--text); }
  .content code { background:var(--bg2); color:var(--mint); padding:2px 7px; border-radius:5px; font-size:13px; font-family:"JetBrains Mono",monospace; }

  .analogy { background:linear-gradient(120deg,rgba(56,189,248,.07),rgba(129,140,248,.09)); border:1px solid rgba(56,189,248,.25); border-radius:14px; padding:18px 20px; margin:20px 0; }
  .analogy h4 { color:var(--cyan); font-size:14px; margin-bottom:8px; }
  .analogy p { margin:0; font-size:14.5px; }

  .demo { background:var(--bg2); border:1px solid var(--line); border-radius:14px; padding:20px; margin:22px 0; }
  .demo-title { font-size:12.5px; color:var(--muted); text-transform:uppercase; letter-spacing:.06em; margin-bottom:16px; text-align:center; }
  .tracks2 { display:grid; grid-template-columns:1fr 1fr; gap:20px; }
  .col h5 { font-size:13.5px; text-align:center; margin-bottom:12px; }
  .col.conc h5 { color:var(--cyan); } .col.par h5 { color:var(--mint); }
  .core-row { display:flex; align-items:center; gap:8px; margin-bottom:8px; }
  .core-label { font-size:10px; color:var(--muted); width:42px; font-family:monospace; }
  .track-bar { flex:1; height:22px; background:#0b1120; border-radius:6px; overflow:hidden; display:flex; }
  .slice { height:100%; flex:1; opacity:.2; transition:opacity .1s; }
  .slice.taskA { background:var(--cyan); } .slice.taskB { background:var(--indigo); }
  .legend { display:flex; justify-content:center; gap:18px; margin-top:14px; font-size:11.5px; color:var(--muted); }
  .legend i { display:inline-block; width:11px; height:11px; border-radius:3px; margin-right:5px; vertical-align:middle; }

  /* comparison table */
  .cmp { width:100%; border-collapse:collapse; margin:18px 0; font-size:13.5px; border:1px solid var(--line); border-radius:12px; overflow:hidden; }
  .cmp th { background:linear-gradient(90deg,var(--cyan),#2ba7ff); color:#04121f; padding:11px 14px; text-align:left; font-size:12.5px; font-weight:800; }
  .cmp td { padding:11px 14px; border-top:1px solid var(--line); color:#c2cddf; }
  .cmp tr:nth-child(even) td { background:rgba(56,189,248,.06); }
  .cmp tr:nth-child(odd) td { background:rgba(129,140,248,.05); }
  .cmp tr td:first-child { color:var(--text); font-weight:600; }

  /* thread lifecycle state machine */
  .fsm { background:var(--bg2); border:1px solid var(--line); border-radius:16px; padding:26px 20px; margin:24px 0; }
  .fsm-title { text-align:center; font-size:12.5px; color:var(--muted); text-transform:uppercase; letter-spacing:.06em; margin-bottom:22px; }
  .fsm-flow { display:flex; flex-direction:column; align-items:center; gap:0; }
  .state { border:2px solid transparent; border-radius:12px; padding:11px 20px; font-family:"JetBrains Mono",monospace; font-size:13px; font-weight:800; text-align:center; transition:all .3s; min-width:155px; color:#04121f; }
  .state small { color:rgba(4,18,31,.7) !important; }
  .state small { display:block; font-family:Inter,sans-serif; font-size:10.5px; font-weight:500; margin-top:3px; }
  .state.s-new { background:linear-gradient(135deg,#34D399,#10b981); }
  .state.s-runnable { background:linear-gradient(135deg,#38BDF8,#2ba7ff); }
  .state.s-blocked { background:linear-gradient(135deg,#fbbf24,#f59e0b); }
  .state.s-waiting { background:linear-gradient(135deg,#818CF8,#6366f1); color:#fff; }
  .state.s-waiting small { color:rgba(255,255,255,.75) !important; }
  .state.s-term { background:linear-gradient(135deg,#64748b,#475569); color:#fff; }
  .state.s-term small { color:rgba(255,255,255,.7) !important; }
  .state.active { transform:scale(1.08); }
  .state.s-new.active { box-shadow:0 0 26px rgba(52,211,153,.7); }
  .state.s-term.active { box-shadow:0 0 26px rgba(100,116,139,.6); }
  .state.s-blocked.active { box-shadow:0 0 26px rgba(251,191,36,.7); }
  .state.s-waiting.active { box-shadow:0 0 26px rgba(129,140,248,.7); }
  .arrow { color:var(--muted); font-size:18px; height:26px; display:flex; align-items:center; }
  .arrow small { font-family:monospace; font-size:10px; margin-left:8px; color:var(--muted); }
  .branch { display:flex; gap:14px; justify-content:center; flex-wrap:wrap; margin:2px 0; }
  .fsm-legend { text-align:center; font-size:12px; color:var(--muted); margin-top:18px; line-height:1.8; }

  .codeblock { border:1px solid rgba(56,189,248,.35); border-radius:12px; overflow:hidden; margin:18px 0;
              background:linear-gradient(160deg,#132132,#0d1826); box-shadow:0 8px 26px rgba(0,0,0,.35); }
  .code-tabs { display:flex; background:linear-gradient(90deg,rgba(56,189,248,.16),rgba(129,140,248,.16)); border-bottom:1px solid rgba(56,189,248,.3); padding:7px 8px; gap:4px; flex-wrap:wrap; }
  .lang { padding:6px 14px; border-radius:7px; font-size:12.5px; color:var(--muted); cursor:pointer; }
  .lang:hover { color:var(--text); }
  .lang.active { background:var(--cyan); color:#04121f; font-weight:700; }
  .code-body { padding:16px 18px; font-size:12.5px; line-height:1.75; overflow-x:auto; background:rgba(10,20,34,.55); }
  .code-body pre { white-space:pre; font-family:"JetBrains Mono",monospace; }
  .kw{color:#f472b6}.ty{color:var(--cyan)}.fn{color:var(--mint)}.st{color:var(--amber)}.cm{color:#5b6b85}.nm{color:var(--indigo)}.bad{color:var(--rose)}

  .callout { border-left:4px solid var(--rose); background:linear-gradient(135deg,rgba(251,113,133,.15),rgba(251,113,133,.05)); border-radius:0 10px 10px 0; padding:14px 18px; margin:18px 0; }
  .callout h4 { color:var(--rose); font-size:13.5px; margin-bottom:6px; }
  .callout p { margin:0; font-size:14px; }

  .exercise { border:1px solid rgba(52,211,153,.5); border-radius:14px; padding:18px 20px; margin:24px 0; background:linear-gradient(135deg,rgba(52,211,153,.13),rgba(52,211,153,.05)); }
  .exercise h4 { color:var(--mint); font-size:14px; margin-bottom:8px; }
  .exercise p { margin:0; font-size:14px; }

.lang { border:0; background:transparent; font-family:inherit; }
.legend .sw-a { background:var(--cyan); }
.legend .sw-b { background:var(--indigo); }