/* Self-hosted fonts (SIL OFL): no third-party requests. */
@font-face{font-family:'DM Sans';font-style:normal;font-weight:400 700;font-display:swap;src:url(../fonts/dmsans-latin.woff2) format('woff2')}
@font-face{font-family:'Playfair Display';font-style:normal;font-weight:600 700;font-display:swap;src:url(../fonts/playfair-latin.woff2) format('woff2')}
/* Layout: sticky control bar over a single reading column; tabs switch Template / Crosswalk / Roll-up / Harmonization / Verification / Save. Navy + gold signature, blue for interaction. */
:root{
  --bg:#f4f6fb; --surface:#ffffff; --surface2:#eef1f8; --ink:#0e1a33; --muted:#56627c; --line:#d5dbea;
  --navy:#0b1730; --on-navy:#f3f5fb; --gold:#8a600c; --gold-bg:#f6ead0; --blue:#1c56d6; --blue-bg:#e3ecff;
  --ok:#17683a; --ok-bg:#dcf1e4; --warn:#8a5a00; --warn-bg:#fbeacb; --crit:#a3271f; --crit-bg:#fbdedb;
  --display:'Playfair Display',Georgia,serif; --body:'DM Sans',system-ui,-apple-system,'Segoe UI',sans-serif;
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --bg:#08101f; --surface:#101b34; --surface2:#16233f; --ink:#e8ecf8; --muted:#9aa6c2; --line:#26365a;
  --navy:#050c1a; --on-navy:#f3f5fb; --gold:#e3b75a; --gold-bg:#3a2f14; --blue:#7ea3ff; --blue-bg:#182a55;
  --ok:#6fd29a; --ok-bg:#14301f; --warn:#f0c15c; --warn-bg:#3a2d0e; --crit:#ff8f86; --crit-bg:#3d1714; color-scheme:dark}}
:root[data-theme="dark"]{
  --bg:#08101f; --surface:#101b34; --surface2:#16233f; --ink:#e8ecf8; --muted:#9aa6c2; --line:#26365a;
  --navy:#050c1a; --on-navy:#f3f5fb; --gold:#e3b75a; --gold-bg:#3a2f14; --blue:#7ea3ff; --blue-bg:#182a55;
  --ok:#6fd29a; --ok-bg:#14301f; --warn:#f0c15c; --warn-bg:#3a2d0e; --crit:#ff8f86; --crit-bg:#3d1714; color-scheme:dark}
*{box-sizing:border-box}
body{background:var(--bg);color:var(--ink);font-family:var(--body);font-size:15px;line-height:1.5;padding-inline:16px;padding-block:0}
h1,h2,h3{font-family:var(--display);text-wrap:balance;margin:0}
.wrap{max-width:1080px;margin-inline:auto}
header.hero{background:var(--navy);color:var(--on-navy);margin-inline:-16px;padding:28px 16px 22px}
header.hero .wrap{display:flex;flex-direction:column;gap:8px}
.eyebrow{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:#e3b75a}
header.hero h1{font-size:clamp(26px,4.4vw,40px);line-height:1.15}
header.hero p{margin:0;max-width:70ch;color:#c9d2e8}
.draft{display:inline-block;align-self:flex-start;border:1px solid #e3b75a;color:#e3b75a;font-size:12px;letter-spacing:.08em;text-transform:uppercase;padding:2px 8px}
.bar{position:sticky;top:env(safe-area-inset-top,0px);z-index:5;background:var(--surface);border-bottom:1px solid var(--line);margin-inline:-16px;padding:10px 16px}
.bar .wrap{display:flex;flex-wrap:wrap;gap:10px 14px;align-items:end}
.ctl{display:flex;flex-direction:column;gap:2px;min-width:0}
.ctl label,.lab{font-size:12px;color:var(--muted);letter-spacing:.04em}
.prog{flex:1;min-width:140px;display:flex;flex-direction:column;gap:4px}
.track{height:8px;background:var(--surface2);border:1px solid var(--line)}
.fill{height:100%;background:var(--gold);width:0}
input,select,textarea,button{font:inherit;color:var(--ink);background:var(--surface);border:1px solid var(--line);padding:7px 9px;min-width:0;max-width:100%}
textarea{width:100%;min-height:74px;resize:vertical}
input[type=text],input[type=date],input[type=number],select{width:100%}
button{cursor:pointer;background:var(--blue-bg);border-color:var(--blue);color:var(--blue);font-weight:500}
button.ghost{background:var(--surface);border-color:var(--line);color:var(--ink)}
button.danger{border-color:var(--crit);color:var(--crit);background:var(--crit-bg)}
button.on{background:var(--blue);color:var(--surface)}
:focus-visible{outline:2px solid var(--blue);outline-offset:1px}
nav.tabs{display:flex;gap:4px;flex-wrap:wrap;margin-block:18px 6px;border-bottom:1px solid var(--line)}
nav.tabs button{background:transparent;border:1px solid transparent;border-bottom:none;color:var(--muted);padding:9px 14px}
nav.tabs button[aria-selected=true]{background:var(--surface);border-color:var(--line);color:var(--ink);font-weight:700;margin-bottom:-1px}
.pane{padding-block:14px 60px}
.note{border-left:4px solid var(--gold);background:var(--gold-bg);padding:10px 14px;margin-block:0 14px;font-size:14px}
.sec{background:var(--surface);border:1px solid var(--line);margin-bottom:12px}
.sec>summary{cursor:pointer;list-style:none;padding:14px 16px;display:flex;flex-wrap:wrap;gap:6px 12px;align-items:baseline}
.sec>summary::-webkit-details-marker{display:none}
.sec>summary h2{font-size:19px;flex:1 1 260px}
.sec[open]>summary{border-bottom:1px solid var(--line)}
.pill{font-size:12px;padding:1px 8px;border:1px solid var(--line);color:var(--muted);white-space:nowrap}
.pill.ok{background:var(--ok-bg);color:var(--ok);border-color:transparent}
.pill.warn{background:var(--warn-bg);color:var(--warn);border-color:transparent}
.pill.crit{background:var(--crit-bg);color:var(--crit);border-color:transparent}
.pill.blue{background:var(--blue-bg);color:var(--blue);border-color:transparent}
.body{padding:14px 16px 18px;display:flex;flex-direction:column;gap:14px}
.cite{font-size:13px;color:var(--muted);margin:0}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,250px),1fr));gap:12px 14px}
.grid .wide{grid-column:1/-1}
.fld{display:flex;flex-direction:column;gap:3px;min-width:0}
.fld .hint{font-size:12px;color:var(--muted)}
.chk{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,210px),1fr));gap:4px 12px;border:1px solid var(--line);padding:8px 10px;max-height:190px;overflow:auto}
.chk label{display:flex;gap:6px;align-items:flex-start;font-size:14px;color:var(--ink);letter-spacing:0}
.chk input{width:auto;margin-top:3px}
.tw{overflow-x:auto;border:1px solid var(--line)}
table{border-collapse:collapse;width:100%;font-size:14px}
th,td{border-bottom:1px solid var(--line);padding:5px 6px;text-align:left;vertical-align:top}
th{background:var(--surface2);font-size:12px;letter-spacing:.04em;color:var(--muted);white-space:nowrap}
.tw td input,.tw td select,.tw td textarea{min-width:130px;min-height:0;padding:5px 6px}
.tw td textarea{min-height:52px}
.ro td,.ro th{white-space:normal}
.tools{display:flex;gap:8px;margin-top:6px;flex-wrap:wrap}
.cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:14px}
.card{background:var(--surface);border:1px solid var(--line);padding:14px 16px;min-width:0}
.card h3{font-size:17px;margin-bottom:6px}
.flow{display:flex;flex-direction:column;gap:0}
.tier{display:grid;grid-template-columns:150px 1fr;gap:12px;background:var(--surface);border:1px solid var(--line);padding:12px 14px}
.tier b{font-family:var(--display);color:var(--gold)}
.arrow{align-self:center;color:var(--muted);padding:3px 0;font-size:13px}
@media(max-width:560px){.tier{grid-template-columns:1fr}}
ul.t{margin:6px 0 0;padding-left:18px}
ul.t li{margin-bottom:4px}
textarea.export{min-height:180px;font-family:ui-monospace,Menlo,Consolas,monospace;font-size:12px}
.mono{font-variant-numeric:tabular-nums}
details.ev{border:1px solid var(--line);background:var(--surface);margin-top:14px}
details.ev>summary{cursor:pointer;padding:12px 16px;font-weight:700}
details.ev>div{padding:0 16px 16px}
h3.sub{margin:16px 0 8px;font-size:18px}
.seg{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:12px}

/* ---------- Production additions ---------- */
.skip{position:absolute;left:-999px;top:0;background:var(--blue);color:#fff;padding:8px 12px;z-index:20}
.skip:focus{left:8px;top:8px}
.disclaimer{background:var(--navy);border-top:1px solid #26365a;color:#c9d2e8;margin-inline:-16px;padding:8px 16px;font-size:13px}
.disclaimer strong{color:#e3b75a}
.alert{border-left:4px solid var(--crit);background:var(--crit-bg);color:var(--ink);padding:10px 14px;margin-block:0 14px;font-size:14px}
.alert b{color:var(--crit)}
.note.blue{border-left-color:var(--blue);background:var(--blue-bg)}
button.primary{background:var(--blue);color:#fff;border-color:var(--blue)}
:root[data-theme="dark"] button.primary{color:#08101f}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) button.primary{color:#08101f}}
button:disabled{opacity:.6;cursor:progress}
.savestat{font-size:12px;color:var(--muted);min-width:110px}
.savestat.bad{color:var(--crit);font-weight:700}
.rem{display:flex;flex-wrap:wrap;gap:2px 10px;align-items:baseline;font-size:12px;margin-top:2px}
.rem .msg{color:var(--warn)}
.rem .msg:empty{display:none}
.rem.flagged .msg{color:var(--blue);font-weight:700}
.fld.is-empty>input:not([type=checkbox]),.fld.is-empty>select,.fld.is-empty>textarea{border-left:3px solid var(--warn)}
.fld.is-flagged>input:not([type=checkbox]),.fld.is-flagged>select,.fld.is-flagged>textarea{border-left:3px solid var(--blue)}
button.flagbtn{background:transparent;border:none;padding:0;font-size:12px;color:var(--blue);text-decoration:underline;font-weight:500}
button.flagbtn[aria-pressed=true]{font-weight:700}
.remlist{display:flex;flex-direction:column;gap:10px}
.remlist h3{font-size:17px}
.remlist ul{list-style:none;margin:6px 0 0;padding:0;display:flex;flex-direction:column;gap:2px}
.remlist a{color:var(--blue)}
.tag-tpl{font-size:12px;color:var(--gold);border:1px solid var(--gold);padding:0 6px;margin-left:6px;white-space:nowrap}
.toast{position:fixed;bottom:16px;left:50%;transform:translateX(-50%);background:var(--navy);color:var(--on-navy);padding:10px 16px;border:1px solid #e3b75a;z-index:30;max-width:calc(100vw - 32px);font-size:14px}
.privacy{border:1px solid var(--line);background:var(--surface);padding:10px 14px;font-size:14px}
.tw td .cell-lab{display:none}
.hint-inline{display:block;font-size:12px;color:var(--muted)}
.check-row{display:flex;gap:8px;align-items:flex-start}
.check-row input{width:auto;margin-top:4px}
footer.site{margin-top:30px;padding-block:20px 40px;border-top:1px solid var(--line);font-size:13px;color:var(--muted)}
@media print{.bar,nav.tabs,.disclaimer,button{display:none!important}}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* Phones: a sticky control bar would fill a quarter of the screen, so it scrolls with the page. */
@media (max-width:600px){.bar{position:static}.savestat{min-width:0;flex:1 1 100%}}
.tw{position:relative}
.sec>summary .pill{white-space:normal}