/* Layout: one narrow column, one question at a time, result unfolds as a filing sheet */
  :root{
    --paper:#F7F8F6;
    --card:#FFFFFF;
    --ink:#16201C;
    --muted:#5A6862;
    --rule:#DDE3DE;
    --seal:#1F5140;
    --seal-soft:#E7EFEA;
    --flag:#7A5612;
    --flag-soft:#F6EFDE;
    --display:"Newsreader",Georgia,"Times New Roman",serif;
    --body:"Public Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif;
    --mono:"IBM Plex Mono",ui-monospace,SFMono-Regular,Menlo,monospace;
  }
  @media (prefers-color-scheme: dark){
    :root:not([data-theme="light"]){
      --paper:#121614; --card:#1A201C; --ink:#E8EDE8; --muted:#9AA79F;
      --rule:#2B332D; --seal:#6FBF9A; --seal-soft:#1C2B24;
      --flag:#D8AC55; --flag-soft:#2A2416; color-scheme:dark;
    }
  }
  :root[data-theme="dark"]{
    --paper:#121614; --card:#1A201C; --ink:#E8EDE8; --muted:#9AA79F;
    --rule:#2B332D; --seal:#6FBF9A; --seal-soft:#1C2B24;
    --flag:#D8AC55; --flag-soft:#2A2416; color-scheme:dark;
  }

  body{
    background:var(--paper); color:var(--ink);
    font-family:var(--body); font-size:16px; line-height:1.6;
    padding-left:max(16px,env(safe-area-inset-left,0px));
    padding-right:max(16px,env(safe-area-inset-right,0px));
    padding-block:0 56px;
    -webkit-font-smoothing:antialiased;
  }
  .wrap{max-width:660px; margin:0 auto; display:flex; flex-direction:column; gap:28px}

  header{padding-block:40px 0; display:flex; flex-direction:column; gap:10px}
  .eyebrow{
    font-family:var(--mono); font-size:11px; letter-spacing:.14em;
    text-transform:uppercase; color:var(--seal);
  }
  h1{
    font-family:var(--display); font-weight:600; font-size:clamp(30px,6vw,42px);
    line-height:1.12; margin:0; text-wrap:balance; letter-spacing:-.01em;
  }
  .standfirst{color:var(--muted); margin:0; max-width:52ch}

  .notice{
    border-left:3px solid var(--flag); background:var(--flag-soft);
    padding:14px 16px; border-radius:0 6px 6px 0;
    display:flex; flex-direction:column; gap:6px;
  }
  .notice h2{
    font-family:var(--body); font-size:12px; font-weight:700; margin:0;
    letter-spacing:.09em; text-transform:uppercase; color:var(--flag);
  }
  .notice p{margin:0; font-size:15px}

  .card{
    background:var(--card); border:1px solid var(--rule); border-radius:10px;
    padding:24px 22px; display:flex; flex-direction:column; gap:18px;
  }

  .progress{display:flex; align-items:center; gap:8px; min-width:0}
  .pip{height:4px; flex:1 1 0; min-width:0; border-radius:2px; background:var(--rule)}
  .pip.done{background:var(--seal)}
  .pip.now{background:var(--seal); opacity:.5}
  .step-no{
    font-family:var(--mono); font-size:11px; color:var(--muted);
    letter-spacing:.08em; white-space:nowrap;
  }

  .q{font-family:var(--display); font-size:23px; line-height:1.3; margin:0; text-wrap:balance}
  .q-help{margin:-8px 0 0; color:var(--muted); font-size:14.5px}

  .opts{display:flex; flex-direction:column; gap:10px}
  .opt{
    font:inherit; text-align:left; cursor:pointer; color:var(--ink);
    background:transparent; border:1px solid var(--rule); border-radius:8px;
    padding:13px 15px; display:flex; flex-direction:column; gap:3px;
    transition:border-color .12s ease, background .12s ease;
  }
  .opt:hover{border-color:var(--seal); background:var(--seal-soft)}
  .opt:focus-visible{outline:2px solid var(--seal); outline-offset:2px}
  .opt b{font-weight:500}
  .opt span{font-size:13.5px; color:var(--muted)}

  .back{
    align-self:flex-start; font:inherit; font-size:13.5px; color:var(--muted);
    background:none; border:none; padding:4px 0; cursor:pointer; text-decoration:underline;
    text-underline-offset:3px;
  }
  .back:focus-visible{outline:2px solid var(--seal); outline-offset:2px}

  /* result */
  .verdict{display:flex; flex-direction:column; gap:7px; padding-bottom:4px; border-bottom:1px solid var(--rule)}
  .verdict .label{
    font-family:var(--mono); font-size:11px; letter-spacing:.14em;
    text-transform:uppercase; color:var(--muted);
  }
  .verdict h2{
    font-family:var(--display); font-weight:600; font-size:clamp(24px,5vw,31px);
    margin:0; line-height:1.2; color:var(--seal); text-wrap:balance;
  }
  .verdict .cite{font-family:var(--mono); font-size:12.5px; color:var(--muted)}

  .block{display:flex; flex-direction:column; gap:8px}
  .block h3{
    font-size:12px; font-weight:700; margin:0; letter-spacing:.09em;
    text-transform:uppercase; color:var(--muted);
  }
  .block p{margin:0}
  .block ol,.block ul{margin:0; padding-left:20px; display:flex; flex-direction:column; gap:7px}
  .block li::marker{color:var(--seal)}

  .facts{
    display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:1px;
    background:var(--rule); border:1px solid var(--rule); border-radius:8px; overflow:hidden;
  }
  .fact{background:var(--card); padding:12px 14px; min-width:0; display:flex; flex-direction:column; gap:2px}
  .fact dt{font-size:11.5px; letter-spacing:.07em; text-transform:uppercase; color:var(--muted)}
  .fact dd{margin:0; font-family:var(--mono); font-size:15px; font-variant-numeric:tabular-nums}

  .answers{display:flex; flex-wrap:wrap; gap:7px}
  .chip{
    font-size:12.5px; border:1px solid var(--rule); border-radius:99px;
    padding:4px 11px; color:var(--muted); background:var(--paper);
  }

  .restart{
    font:inherit; font-size:14px; font-weight:500; cursor:pointer;
    background:var(--seal); color:var(--card); border:none; border-radius:8px;
    padding:11px 18px; align-self:flex-start;
  }
  :root[data-theme="dark"] .restart,
  .restart{color:#F7F8F6}
  @media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .restart{color:#121614}}
  :root[data-theme="dark"] .restart{color:#121614}
  .restart:focus-visible{outline:2px solid var(--ink); outline-offset:2px}

  .offer{
    border:1px solid var(--seal); background:var(--seal-soft); border-radius:10px;
    padding:20px 18px; display:flex; flex-direction:column; gap:12px;
  }
  .offer h3{
    font-family:var(--display); font-weight:600; font-size:20px; margin:0;
    color:var(--ink); letter-spacing:0; text-transform:none;
  }
  .offer p{margin:0; font-size:15px}
  .offer ul{margin:0; padding-left:20px; display:flex; flex-direction:column; gap:5px; font-size:15px}
  .price{font-family:var(--mono); font-size:15px; color:var(--seal); font-variant-numeric:tabular-nums}
  .contact{display:flex; flex-wrap:wrap; align-items:center; gap:10px}
  .addr{
    font-family:var(--mono); font-size:14px; background:var(--card);
    border:1px solid var(--rule); border-radius:6px; padding:8px 11px;
    user-select:all; min-width:0; overflow-wrap:anywhere;
  }
  .copy{
    font:inherit; font-size:13.5px; font-weight:500; cursor:pointer;
    background:transparent; color:var(--seal); border:1px solid var(--seal);
    border-radius:6px; padding:8px 13px;
  }
  .copy:focus-visible{outline:2px solid var(--ink); outline-offset:2px}

  footer{
    border-top:1px solid var(--rule); padding-top:20px;
    display:flex; flex-direction:column; gap:10px; color:var(--muted); font-size:13.5px;
  }
  footer p{margin:0; max-width:60ch}
  footer code{font-family:var(--mono); font-size:12.5px; color:var(--ink)}
  @media (prefers-reduced-motion: reduce){*{transition:none!important; animation:none!important}}

/* county pages */
.lede{font-size:17px; max-width:62ch}
.crumb{font-family:var(--mono); font-size:11px; letter-spacing:.14em; text-transform:uppercase; color:var(--seal)}
.crumb a{color:inherit}
h2.sec{
  font-family:var(--display); font-weight:600; font-size:clamp(21px,4.5vw,27px);
  margin:0; line-height:1.25; text-wrap:balance;
}
.clerk{
  display:grid; grid-template-columns:repeat(auto-fit,minmax(190px,1fr)); gap:1px;
  background:var(--rule); border:1px solid var(--rule); border-radius:10px; overflow:hidden;
}
.clerk div{background:var(--card); padding:14px 16px; min-width:0; display:flex; flex-direction:column; gap:3px}
.clerk dt{font-size:11.5px; letter-spacing:.07em; text-transform:uppercase; color:var(--muted)}
.clerk dd{margin:0; font-size:15px; overflow-wrap:anywhere}
.paths{display:flex; flex-direction:column; gap:14px}
.path{
  border:1px solid var(--rule); border-left:3px solid var(--seal); border-radius:0 8px 8px 0;
  padding:14px 16px; display:flex; flex-direction:column; gap:5px; background:var(--card);
}
.path h3{font-family:var(--display); font-weight:600; font-size:18px; margin:0; color:var(--ink)}
.path p{margin:0; font-size:15px}
.path .tag{font-family:var(--mono); font-size:12px; color:var(--seal)}
.cta{
  display:inline-block; font-weight:500; text-decoration:none;
  background:var(--seal); color:var(--paper); border-radius:8px; padding:12px 18px;
  align-self:flex-start;
}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .cta{color:#121614}}
:root[data-theme="dark"] .cta{color:#121614}
.bring li{margin:0}

/* fee tables */
.feewrap{overflow-x:auto; border:1px solid var(--rule); border-radius:8px}
table.fees{border-collapse:collapse; width:100%; min-width:320px; font-size:15px}
table.fees th{
  text-align:left; font-size:11.5px; letter-spacing:.07em; text-transform:uppercase;
  color:var(--muted); font-weight:700; padding:11px 14px; background:var(--paper);
  border-bottom:1px solid var(--rule);
}
table.fees td{padding:10px 14px; border-bottom:1px solid var(--rule)}
table.fees tr:last-child td{border-bottom:none}
table.fees td:last-child,table.fees th:last-child{
  font-family:var(--mono); font-variant-numeric:tabular-nums; text-align:right; white-space:nowrap;
}
table.fees th:last-child{font-family:var(--body)}
.fee-note{margin:0; font-size:13.5px; color:var(--muted)}
.county-list{display:flex; flex-wrap:wrap; gap:10px}
.county-list a{
  font-size:15px; text-decoration:none; color:var(--ink);
  border:1px solid var(--rule); border-radius:8px; padding:10px 14px;
}
.county-list a:hover{border-color:var(--seal); background:var(--seal-soft)}