:root{--bg:#ffffff;--ink:#0f172a;--muted:#64748b;--line:#e5e7eb;--card:#f8fafc;--accent:#0ea5e9;}*{box-sizing:border-box}body{color:var(--ink);background:var(--bg);font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,sans-serif;line-height:1.65;margin:0}.container{max-width:1000px;margin:0 auto;padding:0 16px}.ms-blog-header{border-bottom:1px solid var(--line);background:#fff;position:sticky;top:0;z-index:20}.ms-nav{display:flex;justify-content:space-between;align-items:center;height:56px}.ms-brand{font-weight:800;text-decoration:none;color:var(--ink)}.ms-nav a{color:var(--ink);text-decoration:none;margin-left:16px}.ms-title{font-size:clamp(26px,3.5vw,40px);line-height:1.2;margin:12px 0 8px}.ms-meta{color:var(--muted);display:flex;gap:8px;align-items:center;margin-bottom:14px}.ms-hero{margin:16px 0;border-radius:14px;overflow:hidden;border:1px solid var(--line)}.ms-hero img{display:block;width:100%;height:auto}.ms-inline{margin:12px 0;border-radius:10px;overflow:hidden;border:1px solid var(--line)}.ms-inline img{display:block;width:100%;height:auto}.ms-grid{display:grid;grid-template-columns:2fr 1fr;gap:24px;margin-top:14px}@media (max-width:900px){.ms-grid{grid-template-columns:1fr}}.ms-article{min-width:0}.ms-highlights{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:14px;margin:8px 0 16px}.ms-aside .ms-toc{background:#fff;border:1px dashed var(--line);border-radius:12px;padding:12px;position:sticky;top:72px}.ms-blog-footer{border-top:1px solid var(--line);margin-top:32px}.ms-foot{color:var(--muted);font-size:14px;padding:16px 0}.ms-article h2{margin:22px 0 10px;font-size:clamp(20px,2.5vw,28px)}.ms-article h3{margin:18px 0 8px;font-size:clamp(18px,2vw,22px)}.ms-article p{margin:12px 0}.ms-article img{max-width:100%;border-radius:10px;border:1px solid var(--line)}.ms-article ul,.ms-article ol{padding-left:20px}iframe{width:100%;min-height:360px;border:0;border-radius:12px}

/* ChatGPT mobile patch */

img, video, iframe {max-width:100%; height:auto}
iframe {width:100%}
.container {max-width:1100px; padding-left:12px; padding-right:12px}
@media (max-width: 768px){
  .container {max-width:100%; padding-left:12px; padding-right:12px}
  .grid, .two-col, .spec {grid-template-columns: 1fr !important}
  header .container, .site-header .container, .ms-nav {flex-wrap: wrap}
  .card, .section, .hero {border-radius: 16px}
  #social-stick {top:auto; bottom:1rem; right:.75rem}
  #social-stick a {width:40px; height:40px}
}