/* Scoped to .compat to avoid changing the existing Hugo theme or navigation. */
.compat{--ink:#172a44;--dim:#4c5e70;--hair:#d7e2ec;--paper:#fff;--wash:#f5f8fb;--primary:#1767b5;--primary-deep:#0d477e;--mint:#e7f3ec;--gold:#fff3d6;--grey:#f1f3f5;color:var(--ink);font-family:system-ui,-apple-system,"Segoe UI",sans-serif;line-height:1.65;background:var(--paper);padding:1.25rem 0 5rem}
.compat *{box-sizing:border-box}
.compat a{color:var(--primary);text-decoration:underline;text-underline-offset:2px}
.compat a:hover{color:var(--primary-deep)}
.compat a:focus-visible,.compat button:focus-visible,.compat input:focus-visible,.compat select:focus-visible{outline:3px solid #2c9dda;outline-offset:3px}
.compat-shell{width:min(1150px,calc(100% - 2rem));margin:auto}
.compat-crumb{display:flex;gap:.7rem;flex-wrap:wrap;align-items:center;font-size:.9rem;color:var(--dim);margin:0 0 2rem}
.compat h1,.compat h2,.compat h3{color:var(--ink);letter-spacing:-.025em;line-height:1.25;font-weight:740}
.compat h1{font-size:clamp(2rem,3.8vw,3.25rem);margin:.25rem 0 1.1rem}
.compat h2{font-size:1.55rem;margin:1.8rem 0 1rem}
.compat h3{font-size:1.13rem;margin:0}
.compat p{margin:.7rem 0}
.compat-eyebrow{text-transform:uppercase;letter-spacing:.12em;color:#225b91;font-weight:800;font-size:.78rem;margin:0}
.compat-lead{font-size:1.12rem;color:var(--dim);max-width:60ch}
.compat-hero{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(225px,.7fr);gap:2rem;align-items:center;padding:2rem 0 2.5rem}
.compat-hero-actions{display:flex;flex-wrap:wrap;gap:.8rem;align-items:center;margin:1.6rem 0}
.compat-cta{display:inline-block;background:var(--primary)!important;color:white!important;padding:.75rem 1rem;border-radius:.45rem;font-weight:700;text-decoration:none!important}
.compat-cta:hover{background:var(--primary-deep)!important}
.compat-minor{font-weight:650}
.compat-summary{border:1px solid var(--hair);border-radius:.9rem;padding:1.5rem;background:var(--wash);display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.compat-summary>div{display:flex;flex-direction:column;gap:.1rem}
.compat-summary strong{font-size:2rem;color:var(--primary-deep);line-height:1}
.compat-summary span,.compat-summary p{font-size:.87rem;color:var(--dim)}
.compat-summary p{grid-column:1/-1;margin:0;border-top:1px solid var(--hair);padding-top:.9rem}
.compat-intro{max-width:82ch;color:var(--dim)}
.compat-toolbar{border:1px solid var(--hair);border-radius:.75rem;padding:1rem;display:flex;flex-wrap:wrap;align-items:end;gap:1rem;background:var(--wash);margin:2rem 0 1.5rem}
.compat-toolbar>div{display:flex;flex-direction:column;min-width:220px;flex:1;gap:.28rem}
.compat-toolbar label{font-size:.83rem;font-weight:700}
.compat-toolbar input,.compat-toolbar select{font:inherit;background:white;color:var(--ink);border:1px solid #9aaebc;border-radius:.43rem;min-height:2.75rem;padding:.45rem .7rem;width:100%}
.compat-count{margin:0 0 .6rem!important;min-width:100px;font-size:.86rem;color:var(--dim)}
.compat-case-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(300px,100%),1fr));gap:1rem}
.compat-case-card{border:1px solid var(--hair);border-radius:.8rem;padding:1.25rem;background:var(--paper);display:flex;flex-direction:column;min-height:235px}
.compat-case-card:hover{border-color:#78afd5;box-shadow:0 6px 18px #194c7220}
.compat-case-card h2{font-size:1.25rem;margin:.65rem 0 .45rem}
.compat-case-card h2 a{color:var(--ink);text-decoration:none}
.compat-case-card h2 a:hover{text-decoration:underline}
.compat-case-card p{color:var(--dim);font-size:.93rem;margin:.3rem 0 1rem}
.compat-chip{border-radius:50px;background:#e8f2fa;color:#185a85;align-self:start;font-size:.77rem;font-weight:700;padding:.12rem .65rem}
.compat-case-foot{margin-top:auto;display:flex;gap:.7rem;flex-wrap:wrap;align-items:end;justify-content:space-between;font-size:.83rem;border-top:1px solid var(--hair);padding-top:.75rem}
.compat-code-result{max-width:220px;overflow-wrap:anywhere;color:var(--dim)}
.compat-case-foot>a{font-weight:720;white-space:nowrap}
.compat-method{margin-top:3rem;border-top:1px solid var(--hair);padding-top:1.2rem}
.compat-method-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(195px,1fr));gap:1rem}
.compat-method-grid>div{border:1px solid var(--hair);padding:1.1rem;border-radius:.6rem}
.compat-method-grid p{font-size:.88rem;color:var(--dim)}
.compat-status{font-size:.76rem;font-weight:740;padding:.25rem .58rem;border-radius:20px;white-space:nowrap;display:inline-flex;align-items:center}
.compat-status--tested{background:#daf1e2;color:#15552c}
.compat-status--documented{background:#e5effb;color:#234e87}
.compat-status--alternative{background:#fff0cf;color:#7b4b00}
.compat-status--unresearched{background:#eaedf0;color:#4b5864}
.compat-date,.compat-version{color:var(--dim);font-size:.82rem}
.compat-detail{max-width:1010px}
.compat-detail-hero{padding:0 0 1.6rem;border-bottom:1px solid var(--hair)}
.compat-fact-grid{display:grid;grid-template-columns:1.4fr 1fr;gap:1rem;margin:1.5rem 0}
.compat-fact-grid>div{background:var(--wash);padding:1rem 1.2rem;border-radius:.7rem}
.compat-fact-grid span{font-size:.8rem;text-transform:uppercase;letter-spacing:.07em;font-weight:750;color:var(--dim)}
.compat-fact-grid p{font-size:1rem;margin:.3rem 0}
.compat-warning{background:#fffbef;border-left:4px solid #e8aa36;padding:.9rem 1rem;border-radius:.2rem;color:#6b4b11}
.compat-downloads{display:flex;flex-wrap:wrap;gap:1rem;margin:1rem 0}
.compat-downloads a{font-weight:650}
.compat-table-scroll{overflow-x:auto;border:1px solid var(--hair);border-radius:.65rem}
.compat-fixture{border-collapse:collapse;width:100%;text-align:left;font-size:.9rem}
.compat-fixture caption{font-size:.79rem;color:var(--dim);text-align:left;padding:.5rem 1rem;background:var(--wash)}
.compat-fixture th,.compat-fixture td{border-bottom:1px solid var(--hair);padding:.45rem .8rem;white-space:nowrap}
.compat-fixture th{background:#edf3f9;font-weight:720}
.compat-fixture tbody tr:last-child td{border-bottom:none}
.compat-rows{display:grid;gap:1rem}
.compat-software-row{border:1px solid var(--hair);border-radius:.7rem;padding:1.15rem 1.3rem;scroll-margin-top:5rem}
.compat-row-header{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:.6rem;margin-bottom:.5rem}
.compat-syntax{font-size:.92rem;overflow-wrap:anywhere}
.compat code{background:#eef2f6;color:#1e3550;padding:.15rem .25rem;border-radius:.2rem;font-size:.87em}
.compat-formula{display:flex;gap:.8rem;align-items:center;justify-content:space-between;flex-wrap:wrap;border:1px solid #cad8e5;border-radius:.45rem;background:#f7faff;padding:.7rem .8rem;margin:.7rem 0 1rem}
.compat-formula code{background:transparent;font-size:.87rem;white-space:pre-wrap;overflow-wrap:anywhere;flex:1}
.compat-copy{background:white;color:#1d5a8f;border:1px solid #93b2cf;border-radius:.4rem;padding:.35rem .65rem;font-weight:700;white-space:nowrap;cursor:pointer;font-size:.79rem}
.compat-copy:hover{background:#e7f2fa}
.compat-alt{font-size:.9rem;color:#485b6a}
.compat-source{font-size:.9rem;font-weight:700}
.compat-editorial{margin-top:2.5rem;border-top:1px solid var(--hair)}
.compat-editorial>p{max-width:80ch}
.compat-test-evidence{background:var(--wash);border:1px solid var(--hair);padding:1rem 1.2rem;border-radius:.7rem;margin:1.5rem 0}
.compat-test-evidence h3{margin:.1rem 0 .7rem}
.compat-article-body{max-width:83ch;font-size:.99rem}
.compat-article-body h2{margin-top:1.4rem}
.compat-article-body ol,.compat-article-body ul{padding-left:1.3rem}
.compat-article-foot{border-top:1px solid var(--hair);margin:2.5rem 0 0;padding-top:1rem;font-size:.87rem;color:var(--dim)}
.compat-small-promo{padding:1.4rem;background:#eef6fd;border:1px solid #bed7ec;border-radius:.65rem}.compat-small-promo strong{font-size:1.1rem}
.compat [hidden]{display:none!important}
@media(max-width:680px){.compat{padding-top:.8rem}.compat-hero{grid-template-columns:1fr;gap:.5rem}.compat-summary{max-width:420px}.compat-fact-grid{grid-template-columns:1fr}.compat-software-row{padding:1rem}.compat-shell{width:min(1150px,calc(100% - 1.25rem))}}
@media(prefers-color-scheme:dark){.compat{--ink:#e5edf6;--dim:#bacada;--hair:#364859;--paper:#18222f;--wash:#212d3c;--primary:#80bfff;--primary-deep:#a9d5ff}.compat input,.compat select{background:#202b38;color:#f1f5f9}.compat-code-result,.compat-case-card h2 a{color:var(--ink)}.compat-code-result strong{color:#d7e4f3}.compat-chip{background:#203c54;color:#badcf8}.compat-fixture th{background:#22384f}.compat-warning{background:#3d341f;color:#ffe6b3}.compat code{background:#2c3b4b;color:#d9eafa}.compat-formula{background:#202f3f;border-color:#53687b}.compat-copy{background:#29445a;color:#daf0ff;border-color:#6d9bbf}.compat-status--tested{background:#1d4f36;color:#c3f5cf}.compat-status--documented{background:#1f4668;color:#dbebff}.compat-status--alternative{background:#60481e;color:#ffe6a4}.compat-status--unresearched{background:#38434e;color:#f2f2f2}.compat-cta{background:#2467a2!important;color:#fff!important}}
