/* sd1toolkit.org
   There is no separate brand colour. The five authority colours ARE the identity,
   because the promise of this project is that you can see where a rule comes from.
   Links stay ink-coloured so nothing competes with them.
   An adopting district changes the tokens below and nothing else. */
:root{
  --paper:#fcfcfb;--ink:#14141a;--muted:#494952;--rule:#d8d8dd;--panel:#f1f1ef;--flag:#fdf6e3;
  --law:#5b21b6;--sos:#1d4ed8;--rpt:#9b1c1c;--local:#8a3d0b;--practice:#15603a;
  --sans:"Segoe UI",-apple-system,BlinkMacSystemFont,Roboto,"Helvetica Neue",Arial,sans-serif;
  --measure:36rem;
}
/* CR-004 C14. The title line appears here and on no other page; weight and size only.
   The slide pane is progressive: with scripts off both links are ordinary links. */
.titleline{font-size:1rem;font-weight:700;letter-spacing:.02em;margin:0 0 .4rem}
.follow{font-size:1rem;margin:.2rem 0 1.4rem}
.follow-pane[hidden]{display:none}
body.two-pane main{width:50%}
#deckpane{position:fixed;top:0;right:0;width:50%;height:100%;
  border-left:1px solid var(--rule);background:var(--paper)}
#deckpane iframe{width:100%;height:calc(100% - 3rem);border:0}
#deckpane-close{height:3rem;font:inherit}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);
  font-size:1.25rem;line-height:1.6;text-align:left}
.wrap{max-width:44rem;margin:0 auto;padding:0 1.5rem}
.skip{position:absolute;left:-9999px}
.skip:focus{position:static;display:block;padding:.7rem;background:var(--ink);color:#fff}

.top{border-bottom:3px solid var(--ink);padding:1.6rem 0 0}
/* The mark is the five authority colours set beside the wordmark. There is no emblem.
   SD1 carries the weight, toolkit sits under it, and the bars are the height of the cap. */
.mark{display:inline-flex;align-items:flex-start;gap:.65rem;text-decoration:none;color:var(--ink)}
.mark .bars{height:2.05rem;width:auto;flex:none;margin-top:.12rem}
.mark .n{display:block;font-size:2.05rem;font-weight:700;letter-spacing:-.03em;line-height:.88}
.mark .s{display:block;font-size:.95rem;font-weight:600;color:var(--muted);line-height:1;margin-top:.3rem}
.attrib{margin:0 0 .6rem;font-weight:600}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.blank{background:#fdf6e3;border-bottom:1px solid var(--ink);padding:0 2.5rem}
.tag{margin:.35rem 0 0;color:var(--muted);font-size:1.05rem}
nav{margin:1.3rem 0 0;display:flex;flex-wrap:wrap;gap:0 1.9rem}
nav a{color:var(--ink);text-decoration:none;font-weight:600;font-size:1.1rem;
  padding:.45rem 0 .8rem;border-bottom:4px solid transparent;display:inline-block}
nav a:hover,nav a:focus-visible{border-bottom-color:var(--ink)}
nav a[aria-current]{border-bottom-color:var(--rpt)}

main{padding:2.4rem 0 3.5rem}
h1{font-size:2.4rem;line-height:1.15;letter-spacing:-.025em;margin:0 0 1rem}
h2{font-size:1.55rem;margin:2.6rem 0 .9rem;padding-bottom:.4rem;border-bottom:2px solid var(--rule)}
h3{font-size:1.25rem;margin:0 0 .4rem}
p,li{max-width:var(--measure)}
.lede{font-size:1.4rem;line-height:1.45;color:var(--muted);margin:0 0 2rem}
a{color:var(--ink);text-decoration-thickness:2px;text-underline-offset:3px}
a:hover{text-decoration-thickness:4px}
.crumb{font-size:1.05rem;color:var(--muted);margin:0 0 1rem}
.crumb a{display:inline-block;padding:.4rem 0}

.src{border-left:8px solid var(--rule);padding:1rem 0 1rem 1.3rem;margin:0 0 1.4rem}
.src.law{border-color:var(--law)}.src.sos{border-color:var(--sos)}
.src.rpt{border-color:var(--rpt)}.src.local{border-color:var(--local)}
.src.practice{border-color:var(--practice)}
.src p{margin:.4rem 0}
.chip{display:inline-block;font-size:.95rem;font-weight:700;letter-spacing:.1em;color:#fff;
  padding:.3rem .7rem;margin-bottom:.55rem;vertical-align:.1em}
.chip.law{background:var(--law)}.chip.sos{background:var(--sos)}
.chip.rpt{background:var(--rpt)}.chip.local{background:var(--local)}
.chip.practice{background:var(--practice)}
.meta{font-size:1.05rem;line-height:1.75;color:var(--muted);margin:.7rem 0 0}
.meta a,footer.site a{padding:.25rem 0;display:inline-block}
.warn{background:var(--flag);border-left:6px solid var(--local);padding:.8rem 1rem;
  font-size:1.05rem;margin:.8rem 0 0;max-width:var(--measure)}

ol.steps{list-style:none;margin:0;padding:0}
ol.steps li{border-bottom:2px solid var(--rule);max-width:none}
ol.steps .row{display:flex;gap:1.2rem;align-items:baseline;padding:1.15rem .2rem}
ol.steps .num{flex:0 0 3rem;font-size:2.1rem;font-weight:700;line-height:1;
  letter-spacing:-.03em;font-variant-numeric:tabular-nums}
ol.steps .txt{font-size:1.25rem;line-height:1.35}
ol.steps .sub{display:block;color:var(--muted);font-size:1.05rem;margin-top:.2rem}

.cards{display:grid;gap:1rem;grid-template-columns:repeat(auto-fit,minmax(15rem,1fr));margin:1.5rem 0}
.card{border:2px solid var(--rule);padding:1.1rem 1.2rem;text-decoration:none;color:var(--ink);display:block}
.card:hover{border-color:var(--ink)}
.card strong{display:block;font-size:1.2rem;margin-bottom:.25rem}
.card span{color:var(--muted);font-size:1.05rem}
main p a{padding:.15rem 0}

/* CR-005/CR-007/CR-009/CR-012/CR-013. Contact cards, action buttons, the
   chair-contact disclosure, and the live-feed placeholders. Tokens only. */
.contactcard{margin:1.1rem 0}
.btnrow{display:flex;flex-wrap:wrap;gap:.6rem;margin:.7rem 0}
.abtn{display:inline-flex;align-items:center;min-height:44px;padding:.5rem 1rem;
  background:var(--ink);color:#fff;text-decoration:none;font-weight:600;font-size:1.05rem}
.abtn:hover{background:var(--law)}
button[data-fb]{font:inherit;font-size:1.05rem;font-weight:600;background:var(--ink);color:#fff;
  border:0;min-height:44px;padding:.6rem 1.2rem;cursor:pointer;margin-top:.6rem}
button[data-fb]:hover{background:var(--law)}
details.chairform{margin:.9rem 0;max-width:var(--measure)}
details.chairform summary{display:inline-flex;align-items:center;min-height:44px;padding:.5rem 1.2rem;
  background:var(--ink);color:#fff;font-weight:700;cursor:pointer;list-style:none}
details.chairform summary::-webkit-details-marker{display:none}
details.chairform summary:hover{background:var(--law)}
details.chairform[open] summary{margin-bottom:1rem}
details.chairform form{border-left:4px solid var(--rule);padding-left:1rem}
details.earlier{margin:.6rem 0;font-size:1.05rem}
details.earlier summary{cursor:pointer;color:var(--muted)}
[data-feed]{margin:1.1rem 0}

.grid19{display:grid;gap:.6rem;grid-template-columns:repeat(auto-fill,minmax(11rem,1fr));
  margin:1.4rem 0;padding:0;list-style:none}
.grid19 li{max-width:none}
.grid19 a{display:block;border:2px solid var(--rule);padding:.8rem .9rem;text-decoration:none;color:var(--ink)}
.grid19 a:hover{border-color:var(--ink)}
.grid19 .seat{display:block;font-size:1.05rem;color:var(--muted)}

pre.tpl{background:var(--panel);border-left:8px solid var(--ink);padding:1.1rem 1.2rem;
  font-family:var(--sans);font-size:1.1rem;line-height:1.55;white-space:pre-wrap;
  margin:1rem 0;max-width:var(--measure);overflow-wrap:break-word}
.copy{font:inherit;font-size:1.05rem;font-weight:600;background:var(--ink);color:#fff;
  border:0;padding:.7rem 1.2rem;cursor:pointer}
.copy:hover{background:var(--law)}

.blank{display:block;border-bottom:2px solid var(--muted);min-height:2.1rem;background:var(--panel);margin-top:.3rem}
table{border-collapse:collapse;width:100%;margin:1.2rem 0;font-size:1.1rem}
th,td{text-align:left;padding:.7rem .6rem;border-bottom:2px solid var(--rule);vertical-align:top}
th{font-size:1rem;letter-spacing:.03em;color:var(--muted)}

form label{display:block;font-weight:600;margin:1.3rem 0 .35rem;max-width:var(--measure)}
form .hint{display:block;font-weight:400;color:var(--muted);font-size:1.05rem}
input[type=text],input[type=email],input[type=tel],select,textarea{
  font:inherit;width:100%;max-width:var(--measure);padding:.7rem .8rem;
  border:2px solid var(--muted);background:#fff;color:var(--ink)}
textarea{min-height:6rem}
fieldset{border:2px solid var(--rule);padding:1rem 1.2rem;margin:1.5rem 0;max-width:var(--measure)}
legend{font-weight:700;padding:0 .5rem}
.check{display:flex;gap:.9rem;align-items:center;margin:0;padding:.85rem 0;font-weight:400;
  border-bottom:2px solid var(--rule);min-height:3.4rem}
.check input{width:1.9rem;height:1.9rem;flex:0 0 auto;margin-top:.1rem}
.scale{display:flex;gap:.5rem;flex-wrap:wrap;margin-top:.5rem}
.scale label{display:flex;flex-direction:column-reverse;gap:.4rem;align-items:center;
  border:2px solid var(--rule);padding:.8rem 1rem;margin:0;cursor:pointer;min-width:3.8rem;min-height:4.4rem;
  justify-content:center;font-size:1.2rem;font-weight:700}
.scale input{width:1.6rem;height:1.6rem}
.scale label:hover{border-color:var(--ink)}
button[type=submit]{font:inherit;font-size:1.2rem;font-weight:700;background:var(--ink);color:#fff;
  border:0;padding:.9rem 1.8rem;cursor:pointer;margin-top:1.8rem}
button[type=submit]:hover{background:var(--law)}

.qr{width:190px;height:190px;image-rendering:pixelated;border:1px solid var(--rule)}
.row2{display:flex;gap:1.8rem;align-items:center;flex-wrap:wrap}

footer.site{border-top:2px solid var(--rule);padding:1.6rem 0 3rem;font-size:1.05rem;color:var(--muted)}
footer.site p{max-width:var(--measure)}
.scope{border-left:4px solid var(--rule);padding-left:1rem}
.stamp{color:var(--ink);font-weight:600}
:focus-visible{outline:3px solid var(--law);outline-offset:2px}
@media (max-width:640px){
  body{font-size:1.18rem}
  h1{font-size:1.95rem}.lede{font-size:1.25rem}
  ol.steps .num{flex:0 0 2.4rem;font-size:1.8rem}
  nav{gap:0 1.2rem}
  .scale label{min-width:3rem;padding:.6rem .7rem}
}
@media print{
  nav,.copy,.skip{display:none}
  body{font-size:11pt;background:#fff}
  a[href^="http"]::after{content:" (" attr(href) ")";font-size:9pt;word-break:break-all}
}