/* pax-silica. Tokens first; every colour below comes from a token (no hex in markup). Contrast of the text pairs is asserted in scripts/check.py. */
:root, :root[data-theme="light"] {
  --bg: #f4f1e8; --surface: #fffdf7; --surface2: #ebe6d7; --ink: #101a2e; --muted: #3f4a5e; --line: #cfc7b3; --line-soft: #ddd6c4;
  --accent: #07494f; --accent-ink: #ffffff; --warm: #7a260a; --amber: #5f3902; --land: #ddd5c0; --sea: #eae6da;
  --c-decl: #0e7c86; --c-ai: #6fbfb8; --c-waico: #c2491a; --c-end: #d19a1f; --c-eu: #c9bfe0; --c-obs: #e6b9a0;
  --focus: #1d4ed8; --shadow: 0 1px 2px rgba(16,26,46,.08), 0 8px 24px rgba(16,26,46,.06);
}
:root[data-theme="dark"] {
  --bg: #0b1220; --surface: #121c30; --surface2: #182540; --ink: #e8edf7; --muted: #b4bfd3; --line: #34415c; --line-soft: #26324a;
  --accent: #6fd8cf; --accent-ink: #06222a; --warm: #ff9d7a; --amber: #f2c26b; --land: #1d2a44; --sea: #0d1526;
  --c-decl: #2fb8ad; --c-ai: #1e5b5d; --c-waico: #f0763f; --c-end: #e3b04a; --c-eu: #54497a; --c-obs: #7a4b36;
  --focus: #93b4ff; --shadow: 0 1px 2px rgba(0,0,0,.4), 0 8px 24px rgba(0,0,0,.3);
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 4rem; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; } }
body { margin: 0; background: var(--bg); color: var(--ink); font: 1.0625rem/1.62 Georgia, "Iowan Old Style", "Times New Roman", "DejaVu Serif", serif; -webkit-text-size-adjust: 100%; }
.ui, .topbar, .eyebrow, button, .chip, table, .tab, .st, .legend, .small, .mapbar, .card dt, .tally, .stats, .layers, .verb, .src, .cap, details summary, .crumb { font-family: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", sans-serif; }
a { color: var(--accent); text-underline-offset: .18em; }
a:hover { text-decoration-thickness: 2px; }
:focus-visible { outline: 3px solid var(--focus); outline-offset: 2px; border-radius: 3px; }
.skip { position: absolute; left: -999px; top: .5rem; background: var(--surface); padding: .5rem .8rem; z-index: 50; }
.skip:focus { left: .5rem; }
.wrap { width: min(72rem, 100% - 2rem); margin-inline: auto; }
.prose { max-width: 41rem; }

/* top bar */
.topbar { position: sticky; top: 0; z-index: 30; display: flex; align-items: center; gap: .9rem; height: 3rem; padding: 0 1rem; background: color-mix(in srgb, var(--bg) 92%, transparent); backdrop-filter: blur(8px); border-bottom: 1px solid var(--line-soft); }
.topbar .home { font-weight: 700; font-size: .85rem; color: var(--ink); text-decoration: none; white-space: nowrap; }
.topnav { display: flex; gap: .15rem; overflow-x: auto; scrollbar-width: none; min-width: 0; }
.topnav::-webkit-scrollbar { display: none; }
.topnav a { font-size: .82rem; color: var(--muted); text-decoration: none; padding: .35rem .55rem; border-radius: 6px; white-space: nowrap; }
.topnav a:hover, .topnav a[aria-current="true"] { color: var(--ink); background: var(--surface2); }
.spacer { flex: 1; }
.chip { font-size: .8rem; font-weight: 700; color: var(--ink); text-decoration: none; border: 1px solid var(--line); border-radius: 999px; padding: .28rem .7rem; white-space: nowrap; }
.icon-btn { display: inline-grid; place-items: center; width: 2.1rem; height: 2.1rem; border: 1px solid var(--line); border-radius: 50%; background: transparent; color: var(--ink); cursor: pointer; }
.icon-btn svg { display: block; } .icon-btn svg[hidden] { display: none; }
.progress { position: fixed; left: 0; top: 3rem; height: 2px; width: 100%; transform-origin: 0 50%; transform: scaleX(0); background: var(--accent); z-index: 31; }
section[id], article[id] { scroll-margin-top: 4rem; }

/* hero */
.hero { padding: 3.2rem 0 1.6rem; }
.eyebrow { font-size: .78rem; letter-spacing: .09em; text-transform: uppercase; color: var(--muted); margin: 0 0 .9rem; font-weight: 700; }
h1 { font-size: clamp(2rem, 4.6vw, 3.4rem); line-height: 1.08; letter-spacing: -.012em; margin: 0 0 1rem; max-width: 22ch; text-wrap: balance; }
.deck { font-size: 1.18rem; max-width: 46rem; color: var(--ink); margin: 0 0 1.4rem; }
.stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(10.5rem, 1fr)); gap: .7rem; margin: 1.4rem 0 0; padding: 0; list-style: none; }
.stats li { background: var(--surface); border: 1px solid var(--line-soft); border-radius: 12px; padding: .8rem .9rem; }
.stats b { display: block; font-size: 2rem; line-height: 1; font-family: Georgia, serif; color: var(--accent); }
.stats span { display: block; font-size: .84rem; color: var(--muted); margin-top: .35rem; line-height: 1.35; }
.herochart { margin: 1.8rem 0 0; background: var(--surface); border: 1px solid var(--line-soft); border-radius: 14px; padding: .8rem; box-shadow: var(--shadow); }
.herochart svg { display: block; width: 100%; height: auto; }
.cap { font-size: .84rem; color: var(--muted); margin: .5rem .2rem 0; line-height: 1.45; }

/* sections */
.section { padding: 3rem 0 .5rem; border-top: 1px solid var(--line-soft); margin-top: 2.2rem; }
h2 { font-size: clamp(1.5rem, 2.8vw, 2.1rem); line-height: 1.15; margin: 0 0 .8rem; text-wrap: balance; max-width: 30ch; }
h2 a, h3 a { color: inherit; text-decoration: none; } h2 a:hover { text-decoration: underline; }
h3 { font-size: 1.12rem; line-height: 1.25; margin: 1.4rem 0 .4rem; }
.lead { font-size: 1.1rem; max-width: 46rem; color: var(--ink); margin: 0 0 1.2rem; }
.small { font-size: .88rem; color: var(--muted); }
.cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr)); gap: .9rem; margin: 1rem 0; }
.card { background: var(--surface); border: 1px solid var(--line-soft); border-radius: 12px; padding: 1rem 1.1rem; }
.card h3 { margin-top: 0; font-size: 1.05rem; }
.card p { margin: .4rem 0 0; }
.card ul { margin: .4rem 0 0; padding-left: 1.1rem; } .card li { margin: .25rem 0; }
.src { font-size: .78rem; color: var(--muted); margin: .5rem 0 0; }
.src a { color: var(--muted); }

/* declaration */
.tally { display: grid; grid-template-columns: repeat(auto-fit, minmax(13rem, 1fr)); gap: .7rem; margin: 1rem 0; }
.tally div { border: 1px solid var(--line-soft); border-radius: 12px; padding: .7rem .9rem; background: var(--surface); }
.tally b { font-size: 1.8rem; font-family: Georgia, serif; display: block; line-height: 1; }
.tally .t-view b { color: var(--accent); } .tally .t-aim b { color: var(--amber); } .tally .t-duty b { color: var(--warm); }
.tally span { font-size: .84rem; color: var(--muted); display: block; margin-top: .3rem; }
.verbs { display: flex; flex-wrap: wrap; gap: .4rem; margin: .8rem 0; }
.verbs button { font-size: .82rem; border: 1px solid var(--line); background: var(--surface); color: var(--ink); border-radius: 999px; padding: .32rem .75rem; cursor: pointer; min-height: 2.2rem; }
.verbs button[aria-pressed="true"] { background: var(--ink); color: var(--bg); border-color: var(--ink); }
.sentences { list-style: none; margin: 1rem 0; padding: 0; display: grid; gap: .55rem; counter-reset: s; }
.sentences li { display: grid; grid-template-columns: 2.2rem 1fr; gap: .6rem; background: var(--surface); border: 1px solid var(--line-soft); border-radius: 10px; padding: .7rem .9rem; }
.sentences .n { font: 700 .8rem ui-sans-serif, system-ui, sans-serif; color: var(--muted); padding-top: .25rem; }
.sentences p { margin: 0; }
.sentences .ro { color: var(--muted); font-size: .98rem; margin-top: .35rem; }
.sentences .vtag { display: inline-block; font: 700 .72rem ui-sans-serif, system-ui, sans-serif; text-transform: uppercase; letter-spacing: .05em; border-radius: 4px; padding: .1rem .4rem; margin-right: .4rem; vertical-align: .08em; }
.sentences .view .vtag, .sentences .view mark { background: color-mix(in srgb, var(--accent) 22%, var(--surface)); color: var(--ink); }
.sentences .aim .vtag, .sentences .aim mark { background: color-mix(in srgb, var(--amber) 24%, var(--surface)); color: var(--ink); }
.sentences mark { border-radius: 3px; padding: 0 .12em; }
.sentences li[hidden] { display: none; }
.absent { display: flex; flex-wrap: wrap; gap: .35rem; margin: .5rem 0 1rem; padding: 0; list-style: none; }
.absent li { font: .82rem ui-sans-serif, system-ui, sans-serif; border: 1px dashed var(--line); border-radius: 999px; padding: .2rem .65rem; color: var(--muted); }

/* map */
.mapbar { display: flex; flex-wrap: wrap; align-items: center; gap: .6rem .9rem; margin: .8rem 0; }
.tabs { display: inline-flex; flex-wrap: wrap; gap: .3rem; }
.tab { font-size: .84rem; border: 1px solid var(--line); background: var(--surface); color: var(--ink); border-radius: 999px; padding: .38rem .85rem; cursor: pointer; min-height: 2.4rem; }
.tab[aria-pressed="true"] { background: var(--accent); color: var(--accent-ink); border-color: var(--accent); font-weight: 700; }
.timebox { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem .6rem; flex: 1 1 22rem; min-width: 0; }
.timebox input[type=range] { flex: 1; min-width: 6rem; accent-color: var(--accent); height: 2.2rem; }
.timebox output { font: 700 .88rem ui-sans-serif, system-ui, sans-serif; min-width: 8rem; }
.btn { font: 700 .84rem ui-sans-serif, system-ui, sans-serif; border: 1px solid var(--accent); background: var(--accent); color: var(--accent-ink); border-radius: 999px; padding: .4rem .95rem; cursor: pointer; min-height: 2.4rem; }
.btn.ghost { background: transparent; color: var(--accent); }
.btn[data-on="true"] { background: var(--ink); border-color: var(--ink); color: var(--bg); }
.mapgrid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 1rem; }
@media (min-width: 62rem) { .mapgrid { grid-template-columns: minmax(0, 1fr) 19rem; align-items: start; } }
.mapframe { background: var(--sea); border: 1px solid var(--line-soft); border-radius: 14px; padding: .5rem; box-shadow: var(--shadow); }
.mapframe svg { display: block; width: 100%; height: auto; }
#worldmap path { fill: var(--land); stroke: var(--bg); stroke-width: .5; transition: fill .25s; cursor: default; }
#worldmap .act { cursor: pointer; }
#worldmap path.c-decl { fill: var(--c-decl); } #worldmap path.c-ai { fill: var(--c-ai); } #worldmap path.c-waico { fill: var(--c-waico); }
#worldmap path.c-end { fill: var(--c-end); } #worldmap path.c-eu { fill: url(#hatch-eu); } #worldmap path.c-obs { fill: var(--c-obs); } #worldmap path.c-both { fill: url(#hatch-both); }
#worldmap path.sel, #worldmap circle.sel { stroke: var(--ink); stroke-width: 1.6; }
#worldmap circle { fill: var(--land); stroke: var(--ink); stroke-width: .8; opacity: 0; pointer-events: none; }
#worldmap circle.c-decl, #worldmap circle.c-ai, #worldmap circle.c-waico, #worldmap circle.c-end, #worldmap circle.c-eu, #worldmap circle.c-obs, #worldmap circle.c-both, #worldmap circle.sel { opacity: 1; pointer-events: auto; cursor: pointer; }
#worldmap circle.c-decl { fill: var(--c-decl); } #worldmap circle.c-ai { fill: var(--c-ai); } #worldmap circle.c-waico { fill: var(--c-waico); } #worldmap circle.c-end { fill: var(--c-end); } #worldmap circle.c-both { fill: url(#hatch-both); } #worldmap circle.c-eu { fill: url(#hatch-eu); } #worldmap circle.c-obs { fill: var(--c-obs); }
.legend { display: flex; flex-wrap: wrap; gap: .4rem 1.1rem; list-style: none; padding: 0; margin: .7rem 0; font-size: .84rem; color: var(--ink); }
.legend li { display: inline-flex; align-items: center; gap: .4rem; }
.sw { width: 1.05rem; height: .8rem; border-radius: 3px; border: 1px solid var(--line); display: inline-block; }
.sw.decl { background: var(--c-decl); } .sw.ai { background: var(--c-ai); } .sw.waico { background: var(--c-waico); } .sw.end { background: var(--c-end); } .sw.eu { background: var(--c-eu); } .sw.none { background: var(--land); }
.sw.both { background: repeating-linear-gradient(45deg, var(--c-decl) 0 5px, var(--c-waico) 5px 10px); }
#count { font: 700 1rem ui-sans-serif, system-ui, sans-serif; margin: .6rem 0 0; }
.countrycard { background: var(--surface); border: 1px solid var(--line-soft); border-radius: 14px; padding: 1rem 1.1rem; position: sticky; top: 4rem; }
.countrycard h3 { margin: 0 0 .5rem; font-size: 1.25rem; }
.countrycard dl { margin: .6rem 0; display: grid; gap: .45rem; }
.countrycard dt { font-size: .74rem; text-transform: uppercase; letter-spacing: .06em; color: var(--muted); font-weight: 700; }
.countrycard dd { margin: 0; font-size: .95rem; line-height: 1.4; }
.countrycard .note { font-size: .92rem; border-top: 1px solid var(--line-soft); padding-top: .6rem; margin-top: .6rem; }
.selectrow { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; margin: .6rem 0 0; }
.selectrow select { font: .9rem ui-sans-serif, system-ui, sans-serif; padding: .45rem .5rem; border-radius: 8px; border: 1px solid var(--line); background: var(--surface); color: var(--ink); max-width: 100%; min-height: 2.4rem; }
.events { list-style: none; margin: .6rem 0; padding: 0; max-height: 19rem; overflow: auto; border: 1px solid var(--line-soft); border-radius: 12px; background: var(--surface); }
.events li { display: grid; grid-template-columns: 6.6rem 1fr; gap: .7rem; padding: .55rem .8rem; border-bottom: 1px solid var(--line-soft); font-size: .93rem; line-height: 1.45; }
.events li:last-child { border-bottom: 0; }
.events time { font: 700 .8rem ui-sans-serif, system-ui, sans-serif; color: var(--muted); padding-top: .15rem; }
.events li.sig time { color: var(--accent); } .events li.latest { background: color-mix(in srgb, var(--accent) 12%, var(--surface)); }
.events li.future { display: none; }

/* tables */
.tablewrap { overflow-x: auto; margin: 1rem 0; border: 1px solid var(--line-soft); border-radius: 12px; background: var(--surface); }
table { border-collapse: collapse; width: 100%; font-size: .9rem; line-height: 1.42; }
th, td { text-align: left; vertical-align: top; padding: .6rem .75rem; border-bottom: 1px solid var(--line-soft); }
th { font-size: .74rem; text-transform: uppercase; letter-spacing: .06em; color: var(--muted); background: var(--surface2); position: sticky; top: 0; }
tr:last-child td { border-bottom: 0; }
td.q { font-size: .86rem; color: var(--muted); max-width: 26rem; }
.st { display: inline-block; font-size: .74rem; font-weight: 700; border-radius: 999px; padding: .12rem .6rem; border: 1px solid var(--line); white-space: nowrap; }
.st.done { background: color-mix(in srgb, var(--accent) 18%, var(--surface)); border-color: var(--accent); }
.st.planned { background: color-mix(in srgb, var(--amber) 18%, var(--surface)); border-color: var(--amber); }
.st.no_award { background: color-mix(in srgb, var(--warm) 14%, var(--surface)); border-color: var(--warm); }
.st.pilot { background: var(--surface2); }
.searchbar { display: flex; flex-wrap: wrap; gap: .6rem; align-items: center; margin: .8rem 0; }
.searchbar input { font: .92rem ui-sans-serif, system-ui, sans-serif; padding: .5rem .7rem; border-radius: 8px; border: 1px solid var(--line); background: var(--surface); color: var(--ink); min-width: 14rem; min-height: 2.4rem; }
.more { margin: .6rem 0 1.2rem; }

/* stack */
.stackwrap { display: grid; grid-template-columns: minmax(0, 1fr); gap: 1.2rem; margin-top: 1rem; }
@media (min-width: 62rem) { .stackwrap { grid-template-columns: 20rem minmax(0, 1fr); gap: 2rem; align-items: start; } }
.layers { list-style: none; margin: 0; padding: 0; display: grid; gap: .4rem; counter-reset: l; }
@media (min-width: 62rem) { .layers { position: sticky; top: 4.2rem; } }
.layers a { display: grid; grid-template-columns: 1.6rem 1fr auto; gap: .5rem; align-items: center; text-decoration: none; color: var(--ink); border: 1px solid var(--line-soft); background: var(--surface); border-radius: 10px; padding: .55rem .7rem; font-size: .9rem; line-height: 1.3; }
.layers a b { font-size: .78rem; color: var(--muted); }
.layers a em { font-style: normal; font-size: .74rem; color: var(--muted); }
.layers a[aria-current="true"] { border-color: var(--accent); background: color-mix(in srgb, var(--accent) 14%, var(--surface)); box-shadow: inset 4px 0 0 var(--accent); }
.layers a.gap em { color: var(--warm); font-weight: 700; }
.step { padding: 1.4rem 0 1.6rem; border-bottom: 1px solid var(--line-soft); }
.step:first-child { padding-top: 0; }
.step h3 { margin: 0 0 .3rem; font-size: 1.45rem; }
.step .decl-q { font: italic 1rem Georgia, serif; color: var(--muted); margin: 0 0 .7rem; }
.step h4 { font: 700 .74rem ui-sans-serif, system-ui, sans-serif; text-transform: uppercase; letter-spacing: .07em; color: var(--muted); margin: 1rem 0 .3rem; }
.step ul { margin: .2rem 0; padding-left: 1.1rem; } .step li { margin: .3rem 0; }
.bars { margin: .7rem 0; display: grid; gap: .45rem; }
.bar { display: grid; grid-template-columns: 7.5rem 1fr 3.2rem; gap: .6rem; align-items: center; font: .85rem ui-sans-serif, system-ui, sans-serif; }
.bar .track { height: 1.1rem; background: var(--land); border-radius: 4px; overflow: hidden; display: flex; }
.bar .track i { display: block; height: 100%; }
.bar .track i.club { background: var(--c-decl); } .bar .track i.china { background: var(--c-waico); } .bar .track i.oth { background: var(--line); }
.bar .track i.us { background: var(--c-decl); } .bar .track i.club2 { background: var(--c-ai); } .bar .track i.tw { background: var(--c-end); }
.bar b { text-align: right; font-weight: 700; }
.keyrow { display: flex; flex-wrap: wrap; gap: .3rem 1rem; font: .8rem ui-sans-serif, system-ui, sans-serif; color: var(--muted); margin: .3rem 0 .6rem; }
.keyrow span::before { content: ""; display: inline-block; width: .8rem; height: .6rem; border-radius: 2px; margin-right: .35rem; vertical-align: .02em; background: var(--k, var(--line)); }
.k-club { --k: var(--c-decl); } .k-china { --k: var(--c-waico); } .k-oth { --k: var(--line); } .k-club2 { --k: var(--c-ai); } .k-us { --k: var(--c-decl); }
.callout { border-left: 4px solid var(--amber); background: var(--surface); padding: .8rem 1rem; border-radius: 0 10px 10px 0; margin: 1.2rem 0; max-width: 46rem; }
.timeline-x { list-style: none; padding: 0; margin: .6rem 0; display: grid; gap: .6rem; }
.timeline-x li { display: grid; grid-template-columns: 8.4rem 1fr; gap: .8rem; align-items: start; }
.timeline-x time { font: 700 .82rem ui-sans-serif, system-ui, sans-serif; color: var(--warm); padding-top: .2rem; }
.points { display: grid; gap: .8rem; margin: 1rem 0; padding: 0; list-style: none; max-width: 48rem; }
.points li { background: var(--surface); border: 1px solid var(--line-soft); border-radius: 12px; padding: .8rem 1rem; }
.points b { display: block; font-size: 1.02rem; margin-bottom: .2rem; }
details { margin: .6rem 0; } details summary { cursor: pointer; font-weight: 700; padding: .4rem 0; }
.faq details { background: var(--surface); border: 1px solid var(--line-soft); border-radius: 10px; padding: .3rem 1rem; margin: .5rem 0; max-width: 48rem; }
.watch { max-width: 46rem; } .watch li { margin: .4rem 0; }
.dl { display: inline-block; margin: .3rem 0 .8rem; }
footer { margin-top: 4rem; padding: 2rem 0 3rem; border-top: 1px solid var(--line-soft); font-size: .9rem; color: var(--muted); }
footer a { color: var(--ink); }
.share { margin: 2.4rem 0 0; }
.share { --sr-line: var(--line); --sr-ink: var(--ink); --sr-acc: var(--accent); --sr-ok: var(--ink); }
@media (max-width: 40rem) {
  .events li { grid-template-columns: 1fr; gap: .1rem; } .timeline-x li { grid-template-columns: 1fr; gap: .1rem; }
  .bar { grid-template-columns: 5.6rem 1fr 2.8rem; } th, td { padding: .5rem; } .topbar { gap: .5rem; padding: 0 .6rem; }
  .sentences li { grid-template-columns: 1.6rem 1fr; padding: .6rem .6rem; }
}
.legend li[hidden] { display: none; }
.wrap-chart { margin: 2rem 0 0; }


/* share row (standards/v2/tools/share_row.py) */
.share-row{display:flex;flex-wrap:wrap;gap:.35rem;align-items:center}
.share-row .lab{font-size:.95rem;opacity:.8;margin-right:.3rem}
.share-row a,.share-row button{display:inline-grid;place-items:center;flex:none;width:2.5rem;height:2.5rem;padding:0;border-radius:50%;border:1px solid var(--sr-line,color-mix(in srgb,currentColor 28%,transparent));background:transparent;color:var(--sr-ink,inherit);text-decoration:none;cursor:pointer;font:inherit;transition:color .15s,border-color .15s}
.share-row a:hover,.share-row button:hover,.share-row a:focus-visible,.share-row button:focus-visible{color:var(--sr-acc,inherit);border-color:var(--sr-acc,currentColor)}
.share-row [hidden]{display:none}
@media (pointer:coarse){.share-row a,.share-row button{width:2.75rem;height:2.75rem}}
@media (max-width:30rem){.share-row .lab{flex-basis:100%;margin:0 0 .15rem}}
.share-status{font-size:.92rem;color:var(--sr-ok,inherit);min-height:1.2em;margin:.4rem 0 0}
.share-field{display:block;width:100%;max-width:36rem;margin-top:.4rem;font:inherit;font-size:.9rem}