/* Shared entity-page styles — extracted from gen-entity-pages.js STYLE (was ~4.2KB inlined per page) */

    :root { --bg:#fff; --text:#0E1628; --muted:#5B6B85; --accent:#6366F1; --border:#E2E8F0; --bg-soft:#F8FAFC; }
    /* Explicit app theme choice wins; else follow OS. data-theme is set by the
       no-flash head script (reads localStorage "di.theme"). */
    :root[data-theme="dark"] { --bg:#0B0E1A; --text:#E6ECFF; --muted:#94A3B8; --accent:#818CF8; --border:#1E293B; --bg-soft:#111827; }
    @media (prefers-color-scheme: dark) {
      :root:not([data-theme="light"]) { --bg:#0B0E1A; --text:#E6ECFF; --muted:#94A3B8; --accent:#818CF8; --border:#1E293B; --bg-soft:#111827; }
    }
    * { box-sizing: border-box; }
    body { margin:0; font-family: 'IBM Plex Sans', system-ui, sans-serif; background:var(--bg); color:var(--text); line-height:1.65; -webkit-font-smoothing:antialiased; }
    header.di-hdr { position:sticky; top:0; z-index:10; background:color-mix(in srgb, var(--bg) 92%, transparent); backdrop-filter:saturate(160%) blur(8px); border-bottom:1px solid var(--border); }
    .di-hdr-inner { max-width:880px; margin:0 auto; display:flex; align-items:center; justify-content:space-between; padding:14px 24px; }
    .di-hdr a.brand { color:var(--text); text-decoration:none; font-weight:700; letter-spacing:-0.01em; font-size:17px; }
    .di-hdr nav a { color:var(--muted); text-decoration:none; margin-left:18px; font-size:14px; font-weight:500; }
    .di-hdr nav a:hover { color:var(--text); }
    main.di-guide { max-width:760px; margin:0 auto; padding:48px 24px 80px; }
    .breadcrumb { color:var(--muted); font-size:13px; margin-bottom:24px; }
    .breadcrumb a { color:var(--muted); text-decoration:none; }
    .breadcrumb a:hover { color:var(--accent); }
    .di-guide h1 { font-family:'IBM Plex Serif', serif; font-size:38px; line-height:1.18; letter-spacing:-0.015em; margin:0 0 8px; }
    .di-guide .ent-meta { color:var(--muted); font-size:14px; margin:0 0 24px; }
    .di-guide h2 { font-family:'IBM Plex Serif', serif; font-size:26px; margin:48px 0 16px; line-height:1.3; }
    .di-guide h3 { font-size:20px; margin:32px 0 12px; }
    .di-guide p { margin:0 0 18px; font-size:17px; }
    .di-guide a { color:var(--accent); text-decoration:underline; text-decoration-thickness:1px; text-underline-offset:2px; }
    .di-guide ul, .di-guide ol { padding-left:24px; margin:0 0 18px; }
    .di-guide li { margin-bottom:8px; }
    .di-guide blockquote { margin:24px 0; padding:14px 20px; border-left:3px solid var(--accent); background:var(--bg-soft); font-style:italic; color:var(--muted); }
    .di-guide code { background:var(--bg-soft); padding:2px 6px; border-radius:4px; font-size:0.92em; }
    .di-guide table { width:100%; border-collapse:collapse; margin:24px 0; font-size:14px; }
    .di-guide th, .di-guide td { border:1px solid var(--border); padding:8px 12px; text-align:left; vertical-align:top; }
    .di-guide th { background:var(--bg-soft); font-weight:600; }
    .type-badge { display:inline-block; margin-left:10px; font-size:12px; font-weight:500; color:var(--accent); padding:3px 10px; background:var(--bg-soft); border:1px solid var(--border); border-radius:99px; text-transform:uppercase; letter-spacing:0.04em; vertical-align:middle; }
    .cta-rail { margin:60px 0 0; padding:28px; border:1px solid var(--border); border-radius:12px; background:var(--bg-soft); }
    .cta-rail h3 { margin:0 0 12px; font-size:18px; }
    .cta-rail p { font-size:15px; color:var(--muted); margin:0 0 16px; }
    .cta-rail .btns a { display:inline-block; padding:10px 18px; background:var(--accent); color:#fff; text-decoration:none; border-radius:8px; font-weight:600; font-size:14px; margin-right:10px; }
    .cta-rail .btns a.outline { background:transparent; color:var(--accent); border:1px solid var(--accent); }
    footer.di-foot { border-top:1px solid var(--border); padding:36px 24px; text-align:center; color:var(--muted); font-size:13px; }
    footer.di-foot a { color:var(--muted); text-decoration:none; margin:0 10px; }
    footer.di-foot a:hover { color:var(--text); }
    .app-cta { margin-top:32px; padding:18px 22px; border:1px solid var(--accent); border-radius:10px; background:var(--bg-soft); display:flex; align-items:center; justify-content:space-between; gap:18px; flex-wrap:wrap; }
    .app-cta strong { font-size:16px; }
    .app-cta a { display:inline-block; padding:10px 16px; background:var(--accent); color:#fff !important; text-decoration:none !important; border-radius:8px; font-weight:600; font-size:14px; }
    /* Dark-mode accent is light (#818CF8): white button text = 2.98:1 (fails WCAG).
       Use near-black label on the accent fill in dark = 6.45:1. Both theme signals. */
    :root[data-theme="dark"] .cta-rail .btns a:not(.outline), :root[data-theme="dark"] .app-cta a { color:#0B0E1A !important; }
    @media (prefers-color-scheme: dark) {
      :root:not([data-theme="light"]) .cta-rail .btns a:not(.outline),
      :root:not([data-theme="light"]) .app-cta a { color:#0B0E1A !important; }
    }