/* SDP Enrollment Companion. SDTA design system v1 (deep navy, warm gold, Atkinson Hyperlegible), the
   tokens used by Acierto FMS and Acierto IF. Every text pair is WCAG AA (checked in
   SDP_Enrollment_Companion_Tooling/tests/contrast_test.js); field borders 3:1 or better. */
@font-face{font-family:'Atkinson Hyperlegible';font-style:normal;font-weight:400;font-display:swap;src:url(fonts/atkinson-400-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Atkinson Hyperlegible';font-style:normal;font-weight:400;font-display:swap;src:url(fonts/atkinson-400-latinext.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Atkinson Hyperlegible';font-style:normal;font-weight:700;font-display:swap;src:url(fonts/atkinson-700-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Atkinson Hyperlegible';font-style:normal;font-weight:700;font-display:swap;src:url(fonts/atkinson-700-latinext.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}

:root{
  /* SDTA design system v1 */
  --navy:#22406e; --navy-deep:#15294a; --navy-700:#2c4f82;
  --steel:#5a7faa; --steel-soft:#e9f0f8; --steel-line:#c9d9ec;
  --gold:#DC9A2E; --gold-soft:#FBF1DA; --gold-deep:#8A5E10;
  --paper:#FBFAF7; --card:#FFFFFF; --ink:#1B2842; --ink-soft:#586277;
  --ok:#1F6E41; --ok-soft:#E4F2E9; --stop:#9B2C2C; --stop-soft:#FBEAEA;
  --radius:12px; --shadow:0 1px 2px rgba(21,41,74,.06),0 4px 14px rgba(21,41,74,.07);
  --font:"Atkinson Hyperlegible","Avenir Next",Avenir,"Segoe UI",system-ui,-apple-system,sans-serif;
  color-scheme:light;
}
*{box-sizing:border-box}
[hidden]{display:none !important}
html{font-size:112.5%}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--font);font-size:1rem;line-height:1.55;-webkit-text-size-adjust:100%;overflow-wrap:break-word}
a{color:var(--navy-700);text-underline-offset:3px}
a:hover{color:var(--navy-deep)}
:focus-visible{outline:3px solid var(--navy-deep);outline-offset:2px;border-radius:4px}
h1,h2,h3{line-height:1.2;margin:0;text-wrap:balance}
h2:focus,h3:focus,main:focus{outline:none}
p{margin:0}
.sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.skip{position:absolute;left:8px;top:-60px;background:var(--navy-deep);color:#fff;padding:10px 14px;border-radius:8px;z-index:10;font-weight:700}
.skip:focus{top:8px;color:#fff}

/* Header */
.top{background:linear-gradient(160deg,var(--navy) 0%,var(--navy-deep) 100%);color:#fff;padding-block:22px 26px;padding-inline:16px}
.top-in{max-width:820px;margin:0 auto;display:grid;gap:10px}
.brandline{display:flex;flex-wrap:wrap;gap:8px 12px;align-items:center;font-size:.8rem;letter-spacing:.05em;text-transform:uppercase;color:#E3ECF7}
.langs{display:inline-flex;gap:6px;margin-left:auto;text-transform:none;letter-spacing:0}
.langs button{font:inherit;font-size:.9rem;font-weight:700;border:1.5px solid #fff;background:transparent;color:#fff;border-radius:999px;padding:4px 14px;min-height:44px;cursor:pointer}
.langs button[aria-pressed="true"]{background:#fff;color:var(--navy-deep)}
.langs button:focus-visible{outline-color:var(--gold)}
.top h1{font-size:clamp(1.6rem,4.6vw,2.2rem);font-weight:700;color:#fff}
.top .tag{font-size:1.12rem;font-weight:700;color:#F6D9A4}
.top p{max-width:62ch}
.top .notpart{font-size:.92rem;color:#E3ECF7}

/* Parts of the page (in-page links, not a tab widget: each is its own address, #steps and so on) */
.tabs{background:var(--card);border-bottom:1px solid var(--steel-line)}
.tabs ul{list-style:none;margin:0 auto;padding:8px 16px;max-width:820px;display:flex;flex-wrap:wrap;gap:6px}
.tabs a{display:inline-flex;align-items:center;min-height:44px;padding:6px 14px;border-radius:999px;border:1.5px solid var(--steel-line);color:var(--navy-deep);text-decoration:none;font-weight:700;font-size:.95rem}
.tabs a:hover{border-color:var(--navy)}
.tabs a[aria-current="page"]{background:var(--navy);border-color:var(--navy);color:#fff;box-shadow:inset 0 -3px 0 var(--gold)}

.wrap{max-width:820px;margin:0 auto;padding-inline:16px;padding-block:18px 40px}
.saveline{font-size:.88rem;color:var(--ink-soft);margin-bottom:12px}
.saveline.bad{color:var(--stop);background:var(--stop-soft);border-radius:8px;padding:10px 12px;font-weight:700}
.part{display:grid;gap:18px;grid-template-columns:minmax(0,1fr)}
.part > h2{font-size:clamp(1.35rem,3.6vw,1.7rem);color:var(--navy-deep);scroll-margin-top:12px}
.intro{color:var(--ink);max-width:66ch}
.help{color:var(--ink-soft);font-size:.95rem;max-width:66ch}
.box{background:var(--steel-soft);border-radius:10px;padding:14px 16px;display:grid;gap:8px}
.box.gold{background:var(--gold-soft)}
.box.dan{border-left:4px solid var(--gold)}
.box ul{margin:0;padding-left:1.2em;display:grid;gap:4px}
.progress{font-weight:700;color:var(--navy-deep)}
.box.diy{border-left:4px solid var(--ok)}

/* The overview: each part of the path, colored by how far along it is (green done, gold in progress,
   white not started). The status is always in words too (.pill). */
.parts{list-style:none;margin:0;padding:0;display:grid;gap:14px}
.partcard{background:var(--card);border:1px solid var(--steel-line);border-left:8px solid var(--steel-line);border-radius:var(--radius);box-shadow:var(--shadow);padding:clamp(14px,3vw,20px);display:grid;gap:10px;grid-template-columns:minmax(0,1fr)}
.partcard.st-started{background:var(--gold-soft);border-color:#EBCB8B;border-left-color:var(--gold)}
.partcard.st-done{background:var(--ok-soft);border-color:#A9D3B8;border-left-color:var(--ok)}
.parthead{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px 14px}
.partcard h3{font-size:1.15rem;color:var(--navy-deep);display:flex;gap:10px;align-items:baseline}
.partcard h3 .num{flex:none;display:inline-grid;place-items:center;width:30px;height:30px;border-radius:50%;background:var(--navy);color:#fff;font-size:.95rem;font-variant-numeric:tabular-nums;transform:translateY(4px)}
.pill{display:inline-block;border-radius:999px;padding:3px 12px;font-weight:700;font-size:.9rem;line-height:1.4;border:1.5px solid var(--steel);background:#fff;color:var(--ink);white-space:nowrap}
.pill.st-started{background:var(--gold);border-color:var(--gold);color:var(--navy-deep)}
.pill.st-done{background:var(--ok);border-color:var(--ok);color:#fff}
/* The Budget tab: the request email in its step, the received budget, what the check found */
.box.mail{background:var(--card);border:1px solid var(--steel-line)}
.box.mail h4{font-size:1rem;color:var(--navy-deep)}
fieldset.period{border:0;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px 18px}
fieldset.period legend{font-weight:700;color:var(--navy-deep);padding:0;margin-bottom:6px}
fieldset.period input[type="date"]{font:inherit;font-size:1rem;border:1.5px solid var(--steel);border-radius:10px;padding:8px 10px;min-height:44px;background:#fff;color:var(--ink);max-width:100%}
ul.found{margin:0;padding-left:1.1em;display:grid;gap:10px}
ul.found ul,#found-list > ul{margin:4px 0 0;padding-left:1.1em;display:grid;gap:4px}
/* A budget row has six boxes: one column on a phone, so units, rate and amount show their whole number */
@media (max-width:560px){ .row.six{grid-template-columns:minmax(0,1fr)} .row.six .wide{grid-column:auto} }
#found-list h4{font-size:1rem;color:var(--navy-deep);margin-top:6px}
.partstatus{font-weight:700;color:var(--navy-deep);display:flex;flex-wrap:wrap;align-items:center;gap:8px}

/* Buttons */
.btn{font:inherit;font-weight:700;font-size:1rem;border-radius:10px;padding:10px 16px;cursor:pointer;border:1.5px solid var(--navy);background:#fff;color:var(--navy);min-height:44px;display:inline-flex;align-items:center;text-decoration:none;text-align:left}
.btn:hover{background:var(--steel-soft);color:var(--navy-deep)}
.btn.primary{background:var(--navy);color:#fff}
.btn.primary:hover{background:var(--navy-deep);color:#fff}
.btn.danger{border-color:var(--stop);color:var(--stop)}
.btn.danger:hover{background:var(--stop-soft)}
.btn.quiet{border-color:transparent;background:transparent;color:var(--ink-soft);font-weight:400;text-decoration:underline;padding-inline:4px}
.btnrow{display:flex;flex-wrap:wrap;gap:10px}

/* Step cards */
.steps{list-style:none;margin:0;padding:0;display:grid;gap:16px}
.card{background:var(--card);border:1px solid var(--steel-line);border-radius:var(--radius);box-shadow:var(--shadow);padding:clamp(16px,3.5vw,24px);display:grid;gap:12px;grid-template-columns:minmax(0,1fr)}
.card h3{font-size:1.2rem;color:var(--navy-deep);display:flex;gap:10px;align-items:baseline}
.card h3 .num{flex:none;display:inline-grid;place-items:center;width:30px;height:30px;border-radius:50%;background:var(--gold);color:var(--navy-deep);font-size:.95rem;font-variant-numeric:tabular-nums;transform:translateY(4px)}
.def{background:var(--steel-soft);border-radius:8px;padding:10px 12px}
.warn{background:var(--stop-soft);border-left:4px solid var(--stop);border-radius:8px;padding:10px 12px;color:#5E1A1A}
.todo strong{color:var(--navy-deep)}
.links{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.links a{font-weight:700}
.checks{border:0;margin:0;padding:10px 0 0;border-top:1px solid var(--steel-line);display:flex;flex-wrap:wrap;gap:6px 18px}
.checks .check{display:flex;align-items:center;gap:10px;min-height:44px}
.check input{width:24px;height:24px;accent-color:var(--navy);flex:none;margin:0}
.check label{cursor:pointer}
details.notes summary,details.ask summary{cursor:pointer;color:var(--navy-700);font-weight:700;min-height:44px;display:flex;align-items:center;width:fit-content}
details.notes textarea{margin-top:6px}
.askdan{font-size:.95rem}
.source{font-size:.85rem;color:var(--ink-soft)}
.source .slabel{font-weight:700}

/* Fields */
.block{background:var(--card);border:1px solid var(--steel-line);border-radius:var(--radius);box-shadow:var(--shadow);padding:clamp(16px,3.5vw,24px);display:grid;gap:12px;grid-template-columns:minmax(0,1fr)}
.block h3{font-size:1.12rem;color:var(--navy-deep)}
.field{display:grid;gap:6px;grid-template-columns:minmax(0,1fr)}
.field label{font-weight:700}
input[type="text"],textarea{font:inherit;font-size:1rem;width:100%;border:1.5px solid var(--steel);border-radius:10px;padding:10px 12px;background:#fff;color:var(--ink);min-height:44px}
textarea{line-height:1.5;resize:vertical}
textarea.draft{font-size:.92rem;background:var(--paper)}
input[type="text"]:focus,textarea:focus{border-color:var(--navy)}
input[aria-invalid="true"]{border-color:var(--stop);border-width:2px}
input[type="file"]{font:inherit;font-size:.95rem;width:100%;max-width:100%;min-width:0}
input[type="file"]::file-selector-button{font:inherit;font-weight:700;border:1.5px solid var(--navy);background:#fff;color:var(--navy);border-radius:10px;padding:10px 14px;min-height:44px;cursor:pointer;margin-right:10px}
.moneywrap{display:flex;align-items:center;gap:6px;max-width:240px}
.moneywrap .cur{font-weight:700;color:var(--ink-soft)}
.fielderr{color:var(--stop);font-weight:700;font-size:.92rem}
.rows{display:grid;gap:12px}
.row{border:1px solid var(--steel-line);border-radius:10px;padding:12px;margin:0;display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1fr);gap:10px 14px;align-items:end;min-width:0}
.row .field{align-content:end}
.row legend{font-size:.85rem;font-weight:700;color:var(--ink-soft);padding:0 4px}
.row .wide{grid-column:1 / -1}
.row .rowact{grid-column:1 / -1;display:flex;justify-content:flex-end}
.row .rownote{grid-column:1 / -1;margin:0;font-size:.88rem}
ol.pdflines{margin:4px 0 12px;padding-left:1.6em;display:grid;gap:8px}
ol.pdflines>li{min-width:0;overflow-wrap:anywhere}
fieldset.pdftables{border:1px solid var(--steel-line);border-radius:10px;padding:10px 14px;margin:0 0 12px;display:grid;gap:8px;min-width:0}
fieldset.pdftables legend{font-weight:700;padding:0 4px}
fieldset.pdftables .choice{display:flex;gap:10px;align-items:flex-start;min-width:0;overflow-wrap:anywhere}
fieldset.pdftables input[type="radio"]{width:22px;height:22px;margin:2px 0 0;flex:none}
ol.pdflines .pdfnote{display:block;font-size:.88rem;color:var(--ink-soft)}
@media (min-width:640px){ .row{grid-template-columns:minmax(0,3fr) minmax(0,1.3fr) minmax(0,1.6fr)} .row .wide{grid-column:auto} }
@media (max-width:600px){ .top{padding-block:16px 18px} .top-in{gap:8px} .top h1{font-size:1.5rem} .top .tag{font-size:1.02rem} .top p{font-size:.95rem} .tabs ul{padding-block:6px} .tabs a{padding:6px 12px} }
.empty{color:var(--ink-soft);font-style:italic}
.sumlist{margin:0;display:grid;gap:6px}
.sumlist > div{display:flex;justify-content:space-between;gap:12px;border-bottom:1px dashed var(--steel-line);padding-bottom:6px}
.sumlist > div.total{font-weight:700;color:var(--navy-deep);border-bottom:0;font-size:1.08rem}
.sumlist dt{margin:0}.sumlist dd{margin:0;font-variant-numeric:tabular-nums;white-space:nowrap}
.compare{font-weight:700;color:var(--navy-deep)}
.compare:empty,.msg.empty{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.msg{font-size:.95rem;color:var(--ok);font-weight:700}
.msg.bad{color:var(--stop)}
.confirm{background:var(--gold-soft);border-radius:10px;padding:12px 14px;display:grid;gap:10px}

/* The Spending Plan table */
.tablewrap{overflow-x:auto;border:1px solid var(--steel-line);border-radius:10px}
table.plan{border-collapse:collapse;width:100%;font-size:.95rem}
table.plan th,table.plan td{padding:8px 10px;border-bottom:1px solid var(--steel-line);text-align:left;vertical-align:top}
table.plan thead th{background:var(--steel-soft);color:var(--navy-deep);font-size:.88rem}
table.plan tbody th{font-weight:400}
table.plan .svc{display:block;font-weight:700}
table.plan .code{display:block;font-size:.85rem;color:var(--ink-soft)}
table.plan .num{text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums}
table.plan tfoot th,table.plan tfoot td{font-weight:700;color:var(--navy-deep);border-bottom:0}
.box.plancheck{border-left:4px solid var(--navy)}
.flags{font-size:.92rem}

/* News and meetings */
select{font:inherit;font-size:1rem;width:100%;max-width:min(100%,460px);min-width:0;text-overflow:ellipsis;overflow:hidden;border:1.5px solid var(--steel);border-radius:10px;padding:10px 12px;background:#fff;color:var(--ink);min-height:44px}
select:focus{border-color:var(--navy)}
.items{list-style:none;margin:0;padding:0;display:grid;gap:12px;min-width:0}
.item{border-top:1px solid var(--steel-line);padding-top:12px;display:grid;gap:6px;min-width:0;overflow-wrap:anywhere}
.item:first-child{border-top:0;padding-top:0}
.item h4{font-size:1.05rem;color:var(--navy-deep);margin:0;line-height:1.25}
.kind{font-size:.85rem;color:var(--ink-soft);text-transform:uppercase;letter-spacing:.05em}
.kind .new{color:var(--gold-deep);text-transform:none;letter-spacing:0}
.impact{background:var(--steel-soft);border-radius:8px;padding:10px 12px;display:grid;gap:4px}
.impact h5{margin:0;font-size:.95rem;color:var(--navy-deep)}

/* The Spending Plan builder, the DAN question boxes and the get-ready lists */
.check{display:flex;align-items:center;gap:10px;min-height:44px}
fieldset.radios{border:0;margin:0;padding:0;display:grid;gap:2px;min-width:0}
fieldset.radios legend{font-weight:700;padding:0;margin-bottom:4px}
.block.radios legend{margin-bottom:8px}
details.block > summary,details.line > summary,details.more > summary{cursor:pointer;min-height:44px;display:flex;align-items:center;font-weight:700;color:var(--navy-700)}
details.block > summary strong{color:var(--navy-deep);font-size:1.12rem}
details.line{border:1px solid var(--steel-line);border-radius:10px;padding:4px 14px}
details.line[open]{padding-bottom:14px}
details.line > summary .what{overflow-wrap:anywhere}
.linebody{display:grid;gap:14px;grid-template-columns:minmax(0,1fr);padding-top:6px}
.pricing{display:grid;gap:12px;grid-template-columns:minmax(0,1fr);border-top:1px dashed var(--steel-line);padding-top:12px}
.fieldrow{display:flex;flex-wrap:wrap;gap:10px 14px;align-items:end}
.fieldrow .field{width:150px}
input.num{max-width:220px}
.lineamount{font-weight:700;color:var(--navy-deep)}
.linenotes{display:grid;gap:4px}
.fixlist{margin:0;padding-left:1.2em;color:var(--stop)}
.ok{color:var(--ok);font-weight:700}
ol.goals{list-style:none;margin:0;padding:0;display:grid;gap:12px}
li.goal{display:grid;gap:6px}
li.goal .btn{justify-self:start}
.checkshead{font-weight:700;color:var(--navy-deep)}
.checklist{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.checklist .tag{display:inline-block;border-radius:999px;padding:2px 10px;font-size:.82rem;font-weight:700;margin-right:4px}
.checklist .pass .tag{background:#E4F2E9;color:var(--ok)}
.checklist .fix .tag{background:var(--stop-soft);color:var(--stop)}
.checklist .onform .tag{background:var(--steel-soft);color:var(--ink-soft)}
.checklist .help{display:block;font-size:.88rem}
.sumlist > div.over{color:var(--stop);font-weight:700}
.box.danq{border-left:4px solid var(--gold);background:var(--card);border-top:1px solid var(--steel-line);border-right:1px solid var(--steel-line);border-bottom:1px solid var(--steel-line)}
.box.danq h4,.block h4{margin:0;font-size:1.05rem;color:var(--navy-deep)}
.actions{display:flex;flex-wrap:wrap;gap:10px}
.btn.secondary{border-color:var(--gold-deep);color:var(--navy-deep)}
.move{display:grid;gap:8px}
#fill-report{display:grid;gap:8px}
#fill-report ul{margin:0;padding-left:1.2em;display:grid;gap:4px}
#fill-report li.bad{color:var(--stop);font-weight:700}

fieldset.readyline{border:1px solid var(--steel-line);border-radius:10px;margin:0;padding:10px 14px 12px;display:grid;gap:2px;min-width:0}
fieldset.readyline legend{padding:0 4px;overflow-wrap:anywhere}
.jobfields{display:grid;gap:12px;grid-template-columns:minmax(0,1fr)}
.plainlist{margin:0;padding-left:1.2em;display:grid;gap:4px}
.readysteps{margin:0;padding-left:1.4em;display:grid;gap:4px}
/* The Complete Guide to SDP (the information source) and the hand-off to Acierto Spending Plan (10/27) */
.box.guidebox{border-left:4px solid var(--navy)}
.box.dvubox{border-left:4px solid var(--steel)}
.guide{font-size:.95rem}
.block.handoff{border-left:4px solid var(--navy)}
.part > .warn{margin:0}

details.block > summary,details.line > summary,details.more > summary{list-style:none}
details.block > summary::-webkit-details-marker,details.line > summary::-webkit-details-marker,details.more > summary::-webkit-details-marker{display:none}
details.block > summary::before,details.line > summary::before,details.more > summary::before{content:"\25B8";flex:none;display:inline-block;width:1.2em;color:var(--navy-700)}
details[open] > summary::before{transform:rotate(90deg)}

/* Footer */
.foot{max-width:820px;margin:0 auto;padding:18px 16px 40px;border-top:1px solid var(--steel-line);display:grid;gap:8px;font-size:.88rem;color:var(--ink-soft)}

/* Print: only the summary */
.print-only{display:none}
@media print{
  body{background:#fff;font-size:11pt}
  .skip,.top,.tabs,.wrap,.foot{display:none !important}
  .print-only{display:block !important;padding:0 8mm}
  .print-only h2{font-size:16pt;margin:0 0 6pt}
  .print-only h3{font-size:13pt;margin:12pt 0 4pt}
  .print-only h4{font-size:12pt;margin:8pt 0 2pt}
  .print-only ol,.print-only ul{margin:0 0 6pt}
  .print-only .pre{white-space:pre-wrap}
  .print-only .letter{font-size:12pt;line-height:1.5}
}
@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto !important}}
