:root { color-scheme: light dark; --ink:#20332f; --paper:#fbfcf9; --card:#fff; --line:#c6d6ce; --accent:#17675c; --soft:#e6f1eb; }
* { box-sizing:border-box; }
body { margin:0; color:var(--ink); background:var(--paper); font:16px/1.6 system-ui,sans-serif; }
header { background:linear-gradient(120deg,#cde9df,#faedca); padding:30px max(24px,calc((100vw - 1160px)/2)); }
nav { font-size:.9rem; }
h1 { max-width:850px; font-size:clamp(2rem,5vw,3.3rem); line-height:1.13; letter-spacing:-.03em; }
h2 { line-height:1.25; margin:0 0 .7rem; }
h3 { font-size:1.08rem; line-height:1.4; }
a { color:var(--accent); text-underline-offset:3px; overflow-wrap:anywhere; }
.intro { max-width:800px; font-size:1.15rem; }
.eyebrow { font-size:.75rem; letter-spacing:.12em; font-weight:750; margin-top:2rem; }
main { max-width:1208px; padding:28px 24px; margin:auto; }
section { margin:48px 0; }
.notice { border-left:4px solid var(--accent); background:var(--soft); padding:18px 22px; }
.cards { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,440px),1fr)); gap:18px; }
.card { padding:22px; border:1px solid var(--line); background:var(--card); border-radius:10px; overflow-wrap:anywhere; }
.badge { font-size:.75rem; font-weight:750; color:var(--accent); }
.scroll { overflow:auto; border:1px solid var(--line); border-radius:7px; }
table { width:100%; border-collapse:collapse; font-size:.87rem; background:var(--card); }
caption { text-align:left; font-weight:650; padding:12px; }
th,td { padding:11px 13px; text-align:left; border-bottom:1px solid var(--line); vertical-align:top; }
thead th { background:var(--soft); white-space:nowrap; }
tbody th { min-width:130px; }
button,select { font:inherit; color:inherit; background:var(--card); border:1px solid var(--line); border-radius:5px; padding:7px 11px; cursor:pointer; }
button:hover { outline:1px solid var(--accent); }
button:focus-visible,select:focus-visible,a:focus-visible,.scroll:focus-visible { outline:3px solid var(--accent); outline-offset:3px; }
select { max-width:100%; display:block; margin:8px 0; }
.cell { min-width:64px; white-space:nowrap; }
.identical { background:#daf0e6; color:#184f3f; }
.changed { background:#fae6bd; color:#623e08; }
.unresolved { background:repeating-linear-gradient(135deg,#ededed,#ededed 5px,#fff 5px,#fff 10px); color:#484848; }
.legend span { display:inline-block; padding:1px 7px; margin:3px; border-radius:3px; }
.legend { font-size:.84rem; }
.edge { padding:15px; background:var(--soft); border-radius:6px; margin:12px 0; font-size:.95rem; }
.edge b { display:block; }
blockquote { margin:12px 0; padding-left:14px; border-left:3px solid var(--line); }
code,pre { font-size:.8rem; }
pre { white-space:pre-wrap; overflow-wrap:anywhere; padding:15px; background:var(--soft); }
details { margin:16px 0; }
summary { cursor:pointer; color:var(--accent); font-weight:600; }
dialog { max-width:min(900px,94vw); max-height:90vh; border:1px solid var(--line); border-radius:10px; background:var(--paper); color:var(--ink); padding:24px; }
dialog::backdrop { background:#0009; }
#close-detail { position:sticky; top:0; float:right; }
footer { border-top:1px solid var(--line); padding:24px; text-align:center; font-size:.85rem; }
@media(prefers-color-scheme:dark) {
  :root { --ink:#e6f1eb; --paper:#121b18; --card:#1d2924; --line:#42574c; --accent:#8edaca; --soft:#263c32; }
  header { background:linear-gradient(120deg,#1e3f35,#3c3928); }
}