:root{
  --ground:#E4E3DE; --paper:#FFFFFF; --paper-2:#F4F4F1;
  --ink:#15191B; --ink-2:#4A5257; --ink-3:#7C858A;
  --rule:#C8CCCB; --rule-2:#A9AEAD; --rule-hard:#15191B;
  --field:#F2F5F6; --field-focus:#FFF8DB;
  --lab:#FBF7E6; --lab-ink:#6B551C; --lab-rule:#D8CBA0;
  --req:#A21B14; --req-soft:#FBEDEC;
  --ok:#25603A; --ok-soft:#EAF1EB;
  --doc:"Archivo",Arial,Helvetica,sans-serif;
  --nar:"Archivo Narrow","Arial Narrow",Arial,sans-serif;
  --mono:ui-monospace,"SFMono-Regular",Menlo,Consolas,monospace;
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --ground:#0C0E0F; --paper:#16191B; --paper-2:#1D2123;
  --ink:#E8EAE7; --ink-2:#A6AEB1; --ink-3:#798387;
  --rule:#2C3235; --rule-2:#3E4548; --rule-hard:#8A9498;
  --field:#1F2426; --field-focus:#2B2A1C;
  --lab:#201C10; --lab-ink:#D7BC7C; --lab-rule:#463C22;
  --req:#E08079; --req-soft:#2B1614;
  --ok:#74B68C; --ok-soft:#16241A;
}}
:root[data-theme="dark"]{
  --ground:#0C0E0F; --paper:#16191B; --paper-2:#1D2123;
  --ink:#E8EAE7; --ink-2:#A6AEB1; --ink-3:#798387;
  --rule:#2C3235; --rule-2:#3E4548; --rule-hard:#8A9498;
  --field:#1F2426; --field-focus:#2B2A1C;
  --lab:#201C10; --lab-ink:#D7BC7C; --lab-rule:#463C22;
  --req:#E08079; --req-soft:#2B1614;
  --ok:#74B68C; --ok-soft:#16241A;
}
*{box-sizing:border-box}
body{margin:0;background:var(--ground);color:var(--ink);font-family:var(--doc);font-size:13.5px;line-height:1.45;-webkit-font-smoothing:antialiased;font-variant-numeric:tabular-nums}
h1,h2,h3{margin:0}
button{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--ink);outline-offset:1px}
a{color:inherit}

/* ---------------- toolbar ---------------- */
.topbar{position:sticky;top:env(safe-area-inset-top,0px);z-index:40;background:var(--paper);border-bottom:1px solid var(--rule-hard)}
.topbar-in{max-width:1120px;margin:0 auto;padding:7px 20px;display:flex;align-items:center;gap:20px;flex-wrap:wrap}
.org{margin-right:auto;display:flex;align-items:baseline;gap:9px;min-width:0}
.org b{font-family:var(--nar);font-weight:700;font-size:13px;letter-spacing:.14em;text-transform:uppercase}
.org span{font-family:var(--nar);font-size:11.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-3);white-space:nowrap}
.tabs{display:flex;gap:18px}
.tab{border:0;background:none;padding:2px 0 3px;font-family:var(--nar);font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3);cursor:pointer;border-bottom:2px solid transparent}
.tab[aria-selected="true"]{color:var(--ink);border-bottom-color:var(--ink)}
.conn{font-family:var(--mono);font-size:10.5px;letter-spacing:.04em;color:var(--ink-3);display:flex;align-items:center;gap:6px;text-transform:uppercase}
.dot{width:6px;height:6px;background:var(--ink-3)}
.dot.on{background:var(--ok)}.dot.off{background:var(--req)}

.wrap{max-width:1120px;margin:0 auto;padding-inline:20px;padding-block:22px 92px}
.cols{display:grid;grid-template-columns:186px minmax(0,1fr);gap:26px;align-items:start}

/* ---------------- index rail ---------------- */
.secnav{position:sticky;top:calc(env(safe-area-inset-top,0px) + 56px);display:flex;flex-direction:column}
.secnav .navhead{font-family:var(--nar);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-3);padding-bottom:7px;border-bottom:1px solid var(--rule-hard)}
.secnav a{display:grid;grid-template-columns:20px 1fr;gap:8px;align-items:baseline;text-decoration:none;color:var(--ink-2);font-size:12.5px;line-height:1.3;padding:7px 8px 7px 0;border-bottom:1px solid var(--rule);border-left:2px solid transparent;padding-left:8px;margin-left:-10px}
.secnav a:hover{color:var(--ink);background:var(--paper)}
.secnav a .n{font-family:var(--mono);font-size:10.5px;color:var(--ink-3)}
.secnav a.active{color:var(--ink);font-weight:600;border-left-color:var(--ink);background:var(--paper)}
.secnav a.active .n{color:var(--ink)}
.secnav a.internal{color:var(--lab-ink)}
.secnav a[hidden]{display:none}  /* [hidden] alone loses to the display:grid above */
.railnote{font-size:11px;line-height:1.4;color:var(--ink-3);padding-top:10px}
@media(max-width:880px){
  .cols{grid-template-columns:1fr;gap:0}
  .secnav{position:sticky;top:calc(env(safe-area-inset-top,0px) + 42px);z-index:30;flex-direction:row;gap:0;overflow-x:auto;background:var(--ground);border-bottom:1px solid var(--rule-hard);margin-bottom:14px;scrollbar-width:thin}
  .secnav .navhead,.railnote{display:none}
  .secnav a{flex:none;display:flex;gap:6px;white-space:nowrap;border-bottom:0;border-left:0;border-right:1px solid var(--rule);margin-left:0;padding:8px 12px}
  .secnav a.active{border-left:0;box-shadow:inset 0 -2px 0 var(--ink)}
}

/* ---------------- the sheet ---------------- */
.sheet{background:var(--paper);border:1px solid var(--rule-hard)}
.letterhead{padding:20px 22px 0}
.lh-top{display:flex;justify-content:space-between;align-items:flex-start;gap:20px;flex-wrap:wrap;padding-bottom:9px;border-bottom:2px solid var(--rule-hard)}
.lh-org{font-family:var(--nar);text-transform:uppercase}
.lh-org b{display:block;font-weight:700;font-size:17px;letter-spacing:.2em}
.lh-org span{display:block;font-size:11px;letter-spacing:.13em;color:var(--ink-2);margin-top:2px}
.lh-doc{display:grid;grid-template-columns:auto auto;border:1px solid var(--rule-2);font-size:10.5px}
.lh-doc dt{font-family:var(--nar);letter-spacing:.09em;text-transform:uppercase;color:var(--ink-3);padding:3px 9px;border-bottom:1px solid var(--rule);border-right:1px solid var(--rule)}
.lh-doc dd{margin:0;font-family:var(--mono);padding:3px 9px;border-bottom:1px solid var(--rule);color:var(--ink-2)}
.lh-doc dt:nth-last-of-type(1),.lh-doc dd:nth-last-of-type(1){border-bottom:0}
.doctitle{padding:16px 0 14px}
.doctitle h1{font-family:var(--nar);font-weight:700;font-size:clamp(20px,3.6vw,27px);letter-spacing:.09em;text-transform:uppercase;line-height:1.1}
.doctitle p{margin:6px 0 0;font-size:12.5px;color:var(--ink-2)}
.instruction{margin:0 22px 18px;border:1px solid var(--rule-2);background:var(--paper-2);padding:9px 12px;font-size:12px;color:var(--ink-2);display:flex;gap:16px;flex-wrap:wrap;justify-content:space-between}
.instruction .legend{font-family:var(--nar);letter-spacing:.06em;text-transform:uppercase;font-size:11px;color:var(--ink-3);white-space:nowrap}
.req{color:var(--req);font-weight:700}

/* ---------------- sections ---------------- */
.sec{scroll-margin-top:96px}
.sec-h{display:flex;align-items:center;gap:12px;background:var(--ink);color:var(--paper);padding:6px 22px}
:root[data-theme="dark"] .sec-h,:root:not([data-theme="light"]) .sec-h{background:var(--rule-hard);color:var(--paper)}
@media (prefers-color-scheme:light){:root:not([data-theme="dark"]) .sec-h{background:var(--ink);color:var(--paper)}}
.sec-h .n{font-family:var(--mono);font-size:11px;opacity:.7}
.sec-h h2{font-family:var(--nar);font-size:13px;font-weight:600;letter-spacing:.14em;text-transform:uppercase}
.lockbadge{margin-left:auto;font-family:var(--nar);font-size:10.5px;letter-spacing:.11em;text-transform:uppercase;opacity:.85}
.sec.internal .sec-h{background:var(--lab-ink)}
.sec.internal .sec-b{background:var(--lab)}
.sec.internal .grid,.sec.internal .f,.sec.internal .subhead{border-color:var(--lab-rule)}
.sec-b{border-bottom:1px solid var(--rule-hard)}
.subhead{font-family:var(--nar);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-2);background:var(--paper-2);padding:5px 22px;border-bottom:1px solid var(--rule)}
.sec.internal .subhead{background:rgba(0,0,0,.035)}
.sec.internal input[type=text],.sec.internal input[type=date],.sec.internal textarea{background:rgba(255,255,255,.6);border-bottom-color:var(--lab-rule)}
.sec.internal input:focus,.sec.internal textarea:focus{background:var(--paper);border-bottom-color:var(--lab-ink)}
.sec.internal .opt span::before,.sec.internal .cl input+span::before{border-color:var(--lab-ink);background:rgba(255,255,255,.6)}
.sec.internal .opt input:checked+span::before,.sec.internal .cl input:checked+span::before{background:var(--lab-ink);border-color:var(--lab-ink);box-shadow:inset 0 0 0 2px var(--lab)}

/* ---------------- ruled field grid ---------------- */
.grid{display:grid;grid-template-columns:1fr 1fr;overflow:hidden}
@media(max-width:700px){.grid{grid-template-columns:1fr}}
.f{padding:8px 22px 10px;border-bottom:1px solid var(--rule);border-right:1px solid var(--rule);min-width:0;display:flex;flex-direction:column;gap:5px}
.f.span2{grid-column:1/-1;border-right:0}
.f>label,.f>.lab{font-family:var(--nar);font-size:11px;letter-spacing:.09em;text-transform:uppercase;color:var(--ink-2)}
.hint{font-size:11px;color:var(--ink-3);line-height:1.35}
input[type=text],input[type=email],input[type=tel],input[type=date],input[type=password],textarea{
  width:100%;background:var(--field);border:0;border-bottom:1px solid var(--rule-2);border-radius:0;
  padding:6px 7px;font-family:var(--doc);font-size:13.5px;color:var(--ink)}
input[type=date]{font-family:var(--mono);font-size:12.5px}
textarea{resize:vertical;min-height:62px;line-height:1.5}
input:hover,textarea:hover{border-bottom-color:var(--ink-3)}
input:focus,textarea:focus{outline:none;background:var(--field-focus);border-bottom:1px solid var(--ink)}
.f.err input,.f.err textarea{background:var(--req-soft);border-bottom-color:var(--req)}
.errmsg{font-family:var(--nar);font-size:11px;letter-spacing:.05em;text-transform:uppercase;color:var(--req);display:none}
.f.err .errmsg{display:block}

/* tick boxes — the same ☐ convention as the paper form */
.opts{display:flex;flex-wrap:wrap;gap:5px 20px;padding-top:2px}
.opt{position:relative;display:inline-flex}
.opt input{position:absolute;inset:0;opacity:0;width:100%;height:100%;margin:0;cursor:pointer}
.opt span,.cl span{display:inline-flex;align-items:flex-start;gap:8px;font-size:13px;color:var(--ink-2);cursor:pointer;line-height:1.35}
.opt span::before,.cl input+span::before{content:"";width:12px;height:12px;margin-top:2px;flex:none;border:1px solid var(--ink-2);background:var(--paper);transition:background .08s}
.opt input:checked+span,.cl input:checked+span{color:var(--ink);font-weight:500}
.opt input:checked+span::before,.cl input:checked+span::before{background:var(--ink);border-color:var(--ink);box-shadow:inset 0 0 0 2px var(--paper)}
.opt input:focus-visible+span::before,.cl input:focus-visible+span::before{outline:2px solid var(--ink);outline-offset:2px}
.otherbox{display:none;margin-top:6px}
.otherbox.on{display:block}
.otherbox input{max-width:280px}
.checklist{display:grid;grid-template-columns:1fr 1fr;gap:6px 24px;padding-top:2px}
@media(max-width:700px){.checklist{grid-template-columns:1fr}}
.cl{display:block;cursor:pointer;position:relative}
.cl input{position:absolute;opacity:0;width:0;height:0}

/* ---------------- HPO checklist ---------------- */
.hpo{border:1px solid var(--rule-2);background:var(--paper)}
.hpo-bar{display:flex;gap:10px;align-items:center;padding:8px 10px;border-bottom:1px solid var(--rule-2);background:var(--paper-2);flex-wrap:wrap}
.hpo-bar input[type=text]{flex:1;min-width:170px;background:var(--paper);border:1px solid var(--rule-2);border-bottom:1px solid var(--rule-2)}
.count{font-family:var(--mono);font-size:11px;color:var(--ink-2);white-space:nowrap}
.linkbtn{border:1px solid var(--rule-2);background:var(--paper);padding:5px 9px;font-family:var(--nar);font-size:11px;letter-spacing:.07em;text-transform:uppercase;color:var(--ink-2);cursor:pointer}
.linkbtn:hover{border-color:var(--ink);color:var(--ink)}
.chips{padding:8px 10px;border-bottom:1px solid var(--rule-2);font-size:12.5px;line-height:1.7;color:var(--ink)}
.chips:empty{display:none}
.chip{display:inline;white-space:nowrap}
.chip:not(:last-child)::after{content:" · ";color:var(--ink-3)}
.chip button{border:0;background:none;cursor:pointer;color:var(--ink-3);font-family:var(--mono);font-size:11px;padding:0 3px}
.chip button:hover{color:var(--req)}
.grp{border-bottom:1px solid var(--rule)}
.grp:last-child{border-bottom:0}
.grp-h{width:100%;display:flex;align-items:center;gap:10px;padding:7px 10px;border:0;background:none;cursor:pointer;text-align:left}
.grp-h:hover{background:var(--paper-2)}
.tri{font-family:var(--mono);font-size:12px;color:var(--ink-3);width:10px;flex:none}
.tri::before{content:"+"}
.grp.open .tri::before{content:"\2212"}
.grp-h .nm{font-family:var(--nar);font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-2);flex:1;min-width:0}
.grp-h .badge{font-family:var(--mono);font-size:10.5px;color:var(--ink-3)}
.grp-h .badge.has{color:var(--ink);font-weight:500}
.grp-b{display:none;padding:2px 12px 12px 32px;columns:2;column-gap:24px}
.grp.open .grp-b{display:block}
@media(max-width:700px){.grp-b{columns:1}}
.grp-b .cl{break-inside:avoid;margin-bottom:5px}

/* ---------------- attachments ---------------- */
.drop{border:1px solid var(--rule-2);padding:9px 11px;display:flex;flex-direction:column;gap:6px;background:var(--paper-2);margin-bottom:8px}
.drop .lab{font-family:var(--nar);font-size:11px;letter-spacing:.09em;text-transform:uppercase;color:var(--ink-2)}
.drop input[type=file]{font-size:12px;color:var(--ink-2)}

/* ---------------- action bar ---------------- */
.actions{position:fixed;left:0;right:0;bottom:0;z-index:40;background:var(--paper);border-top:1px solid var(--rule-hard);padding:9px 20px calc(9px + env(safe-area-inset-bottom,0px))}
.actions-in{max-width:1120px;margin:0 auto;display:flex;align-items:center;gap:9px;flex-wrap:wrap}
.saved{font-family:var(--mono);font-size:10.5px;color:var(--ink-3);margin-right:auto;text-transform:uppercase;letter-spacing:.04em}
.btn{border:1px solid var(--rule-hard);background:var(--paper);color:var(--ink);padding:7px 14px;font-family:var(--nar);font-size:12px;font-weight:500;letter-spacing:.09em;text-transform:uppercase;cursor:pointer}
.btn:hover{background:var(--paper-2)}
.btn.primary{background:var(--ink);color:var(--paper);border-color:var(--ink)}
:root[data-theme="dark"] .btn.primary,:root:not([data-theme="light"]) .btn.primary{background:var(--ink);color:#121516}
@media (prefers-color-scheme:light){:root:not([data-theme="dark"]) .btn.primary{color:var(--paper)}}
.btn.primary:hover{opacity:.88}
.btn[disabled]{opacity:.5;cursor:not-allowed}

/* ---------------- notices ---------------- */
.banner{border:1px solid;padding:9px 12px;font-size:12.5px;margin-bottom:14px;display:flex;gap:9px}
.banner::before{font-family:var(--nar);font-size:11px;letter-spacing:.09em;text-transform:uppercase;flex:none}
.banner.warn{background:var(--lab);border-color:var(--lab-rule);color:var(--lab-ink)}
.banner.warn::before{content:"Notice"}
.banner.bad{background:var(--req-soft);border-color:var(--req);color:var(--req)}
.banner.bad::before{content:"Error"}
.banner.good{background:var(--ok-soft);border-color:var(--ok);color:var(--ok)}
.banner.good::before{content:"Recorded"}
.banner b{font-weight:600}

/* ---------------- register of requests ---------------- */
.reg{width:100%;border-collapse:collapse;background:var(--paper);border:1px solid var(--rule-hard)}
.reg th{font-family:var(--nar);font-size:11px;letter-spacing:.1em;text-transform:uppercase;text-align:left;color:var(--paper);background:var(--ink);padding:6px 12px;font-weight:600}
:root[data-theme="dark"] .reg th,:root:not([data-theme="light"]) .reg th{background:var(--rule-hard)}
@media (prefers-color-scheme:light){:root:not([data-theme="dark"]) .reg th{background:var(--ink)}}
.reg td{padding:8px 12px;border-bottom:1px solid var(--rule);font-size:13px;vertical-align:top}
.reg tr:last-child td{border-bottom:0}
.reg tbody tr{cursor:pointer}
.reg tbody tr:hover td{background:var(--paper-2)}
.reg .c-id{font-family:var(--mono);font-size:11.5px;white-space:nowrap}
.reg .c-sub{color:var(--ink-3);font-size:12px}
.stat{font-family:var(--nar);font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;padding:2px 8px;border:1px solid;white-space:nowrap;display:inline-block}
.stat.submitted{color:var(--ink-2);border-color:var(--rule-2)}
.stat.approved{color:var(--ok);border-color:var(--ok);background:var(--ok-soft)}
.stat.deferred{color:var(--lab-ink);border-color:var(--lab-rule);background:var(--lab)}
.stat.rejected{color:var(--req);border-color:var(--req);background:var(--req-soft)}
.empty{background:var(--paper);border:1px solid var(--rule-2);padding:44px 20px;text-align:center;color:var(--ink-3);font-size:12.5px}
.tablewrap{overflow-x:auto}
.dl{display:grid;grid-template-columns:minmax(150px,220px) 1fr;background:var(--paper);border:1px solid var(--rule-hard);border-bottom:0}
.dl dt,.dl dd{margin:0;padding:7px 12px;border-bottom:1px solid var(--rule);font-size:12.5px}
.dl dt{font-family:var(--nar);font-size:11px;letter-spacing:.07em;text-transform:uppercase;color:var(--ink-2);border-right:1px solid var(--rule)}
.dl dd{white-space:pre-wrap;overflow-wrap:anywhere}
@media(max-width:700px){.dl{grid-template-columns:1fr}.dl dt{border-right:0;border-bottom:0;padding-bottom:0}}
.backlink{border:0;background:none;color:var(--ink-2);cursor:pointer;font-family:var(--nar);font-size:11.5px;letter-spacing:.08em;text-transform:uppercase;padding:0;margin-bottom:12px}
.backlink:hover{color:var(--ink)}
.rechead{display:flex;align-items:baseline;gap:14px;flex-wrap:wrap;padding-bottom:9px;border-bottom:2px solid var(--rule-hard);margin-bottom:14px}
.rechead h2{font-family:var(--nar);font-size:20px;font-weight:700;letter-spacing:.05em;text-transform:uppercase}
.recmeta{font-family:var(--mono);font-size:11px;color:var(--ink-3);margin-left:auto}
.sheetfoot{padding:9px 22px;display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;font-family:var(--nar);font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3)}

@media print{
  .topbar,.actions,.secnav,.hpo-bar,.linkbtn,.backlink{display:none!important}
  body{background:#fff;font-size:10.5px}
  .wrap{padding:0;max-width:none}
  .cols{display:block}
  .sheet{border:0}
  .sec{break-inside:avoid}
  .grp-b{display:block!important;columns:3}
  .grp-h .tri{display:none}
}

/* ---------------- authentication gate ---------------- */
body[data-auth="loading"] .topbar,body[data-auth="loading"] .wrap,body[data-auth="loading"] .actions,
body[data-auth="out"] .topbar,body[data-auth="out"] .wrap,body[data-auth="out"] .actions{display:none}
body[data-auth="in"] .gate{display:none}
body[data-auth="loading"] #loginForm{display:none}
body[data-auth="out"] #bootMsg{display:none}
.gate{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:24px 20px}
.gate-card{background:var(--paper);border:1px solid var(--rule-hard);padding:26px 26px 22px;width:100%;max-width:380px;display:flex;flex-direction:column;gap:9px}
.gate-org{font-family:var(--nar);text-transform:uppercase;padding-bottom:9px;border-bottom:2px solid var(--rule-hard);margin-bottom:8px}
.gate-org b{display:block;font-weight:700;font-size:15px;letter-spacing:.2em}
.gate-org span{display:block;font-size:10.5px;letter-spacing:.12em;color:var(--ink-2);margin-top:2px}
.gate-card h2{font-family:var(--nar);font-size:15px;font-weight:600;letter-spacing:.08em;text-transform:uppercase}
.gate-note{margin:0;font-size:12px;color:var(--ink-3);line-height:1.45}
.gate-card label{font-family:var(--nar);font-size:11px;letter-spacing:.09em;text-transform:uppercase;color:var(--ink-2);margin-top:6px}
.gate-err{border:1px solid var(--req);background:var(--req-soft);color:var(--req);font-size:12px;padding:7px 9px}
.gate-actions{display:flex;align-items:center;gap:10px;margin-top:10px}
.who{display:flex;align-items:center;gap:10px;font-size:11.5px;color:var(--ink-3)}
.who .linkbtn{padding:3px 8px}
#inviteForm{display:none}
body[data-invite="1"] .topbar,body[data-invite="1"] .wrap,body[data-invite="1"] .actions,
body[data-invite="1"] #loginForm,body[data-invite="1"] #bootMsg{display:none!important}
body[data-invite="1"] .gate{display:flex!important}
body[data-invite="1"] #inviteForm{display:flex}
#inviteFields{display:flex;flex-direction:column;gap:9px}
#inviteFields[hidden]{display:none}
.accnew{background:var(--paper);border:1px solid var(--rule-hard);padding:0 0 12px;margin-bottom:16px}
.accnew .subhead{margin-bottom:10px}
.accnew-row{display:flex;flex-wrap:wrap;gap:12px;align-items:flex-end;padding:0 14px}
.accnew-row label{display:flex;flex-direction:column;gap:4px;flex:1 1 180px;font-family:var(--nar);font-size:11px;letter-spacing:.09em;text-transform:uppercase;color:var(--ink-2)}
.accnew-row select{font:inherit;font-size:13px;text-transform:none;letter-spacing:0;padding:6px 4px;border:0;border-bottom:1px solid var(--rule-2);background:transparent;color:var(--ink)}
.accnew .gate-note{padding:8px 14px 0}
.reg.acc tbody tr{cursor:default}
.reg.acc .acts{display:flex;flex-wrap:wrap;gap:6px}
.reg.acc .muted{color:var(--ink-3);font-size:12px}
.pwdlg{border:0;padding:0;background:transparent;max-width:calc(100vw - 32px)}
.pwdlg::backdrop{background:rgba(0,0,0,.45)}
@media(max-width:880px){.who span{display:none}}