/* The School Day — report-card paper. */
:root{
  --paper:#efe7d6; --card:#fdfaf2; --ink:#1b1a17; --ink-2:#5f5a50; --rule:#1b1a17;
  --control:#2f6f80; --cap:#4a7c4e; --load:#b8442e; --gold:#e0a92e;
  --track:#ded4bf;
  --shadow:3px 3px 0 var(--rule);
  --col:min(100%,860px);
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;background:var(--paper);color:var(--ink);
  font-family:"Public Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
  font-size:17px;line-height:1.55;
  background-image:repeating-linear-gradient(0deg,transparent 0 31px,rgba(27,26,23,.055) 31px 32px);
}
.wrap{width:var(--col);margin-inline:auto;padding:0 16px}
h1,h2,h3{font-family:"Bricolage Grotesque",Georgia,serif;font-weight:800;line-height:1.02;margin:0}
h1{font-size:clamp(34px,8vw,62px);letter-spacing:-.02em}
h2{font-size:clamp(23px,4.4vw,31px);letter-spacing:-.01em}
h3{font-size:19px}
p{margin:0 0 .8em}
a{color:var(--control)}
.eyebrow{font-family:"DM Mono",ui-monospace,monospace;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-2);margin:0 0 6px}
.num{font-family:"DM Mono",ui-monospace,monospace;font-variant-numeric:tabular-nums}

/* masthead */
.mast{border-bottom:3px solid var(--rule);padding:22px 0 24px;margin-bottom:26px;background:linear-gradient(180deg,rgba(253,250,242,.85),rgba(253,250,242,0))}
.mast .kicker{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:14px}
.stamp{font-family:"DM Mono",ui-monospace,monospace;font-size:11px;letter-spacing:.12em;text-transform:uppercase;border:2px solid var(--rule);border-radius:999px;padding:3px 10px;background:var(--card)}
.stamp.live{background:var(--gold)}
.lede{font-size:clamp(17px,2.6vw,20px);max-width:56ch;margin-top:14px;color:var(--ink-2)}

/* audio bar */
.listen{display:flex;gap:12px;align-items:center;flex-wrap:wrap;border:2px solid var(--rule);border-radius:14px;background:var(--card);box-shadow:var(--shadow);padding:11px 13px;margin-top:20px}
.listen b{font-size:15px}
.listen small{color:var(--ink-2);font-size:13px}
.listen audio{flex:1 1 240px;min-width:200px;height:34px}

/* generic card */
.card{border:2px solid var(--rule);border-radius:16px;background:var(--card);box-shadow:var(--shadow);padding:16px;margin:16px 0}

/* instrument */
.instrument{margin:8px 0 34px}
.dialhead{display:flex;justify-content:space-between;align-items:flex-end;gap:14px;flex-wrap:wrap}
.counter{font-family:"DM Mono",ui-monospace,monospace;font-size:12px;letter-spacing:.1em;text-transform:uppercase;border:2px solid var(--rule);border-radius:999px;padding:4px 11px;background:var(--gold);white-space:nowrap}
.thesis{font-family:"Bricolage Grotesque",Georgia,serif;font-size:clamp(19px,3.4vw,25px);font-weight:700;line-height:1.22;border-left:5px solid var(--gold);padding-left:13px;margin:14px 0 4px}

.dial{margin:20px 0 6px}
.dial .lab{display:block;font-family:"DM Mono",ui-monospace,monospace;font-size:11px;letter-spacing:.13em;text-transform:uppercase;color:var(--ink-2);margin-bottom:9px}
input[type=range]{width:100%;accent-color:var(--load);height:26px}
.ticks{display:grid;grid-template-columns:repeat(5,1fr);gap:4px;text-align:center;font-size:11px;line-height:1.2;color:var(--ink-2);font-weight:600;margin-top:2px}
.ticks span:nth-child(1){text-align:left}
.ticks span:nth-child(5){text-align:right}

.seg{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
button{font:inherit;cursor:pointer}
.seg button{min-height:48px;border:2px solid var(--rule);border-radius:12px;background:var(--card);color:var(--ink);font-weight:700;font-size:15px;padding:8px 6px;box-shadow:2px 2px 0 var(--rule);transition:transform .1s,background .12s}
.seg button.on{background:var(--gold);transform:translate(1px,1px);box-shadow:1px 1px 0 var(--rule)}
.seg button:focus-visible{outline:3px solid var(--control);outline-offset:2px}
.capnote{font-size:14px;color:var(--ink-2);margin:10px 0 0}

/* verdict */
.verdict{border:3px solid var(--rule);border-radius:16px;padding:15px 16px;margin:20px 0 6px;box-shadow:var(--shadow)}
.verdict[data-verdict=carried]{background:#e4efe2}
.verdict[data-verdict=tight]{background:#f7ecd4}
.verdict[data-verdict=over]{background:#f6ded6}
.vtop{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.vlabel{font-family:"Bricolage Grotesque",Georgia,serif;font-size:26px;font-weight:800}
.vtext{margin:8px 0 12px;font-size:16px}
.tallies{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;border-top:2px solid var(--rule);padding-top:11px}
.tally{text-align:center}
.tally b{display:block;font-family:"DM Mono",ui-monospace,monospace;font-size:25px;line-height:1}
.tally span{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-2);font-family:"DM Mono",ui-monospace,monospace}

/* meters */
.group{margin:26px 0}
.ghead{display:flex;gap:10px;align-items:baseline;border-bottom:2px solid var(--rule);padding-bottom:7px;margin-bottom:4px}
.ghead h3{flex:1}
.gtag{font-family:"DM Mono",ui-monospace,monospace;font-size:10px;letter-spacing:.1em;text-transform:uppercase;border:2px solid var(--rule);border-radius:999px;padding:2px 8px;white-space:nowrap}
.group[data-g=control] .gtag{background:var(--control);color:#fff;border-color:var(--control)}
.group[data-g=cap] .gtag{background:var(--cap);color:#fff;border-color:var(--cap)}
.group[data-g=load] .gtag{background:var(--load);color:#fff;border-color:var(--load)}
.gsub{font-size:14px;color:var(--ink-2);margin:8px 0 12px}
.meters{display:grid;gap:13px}
.meter{display:block}
.mhead{display:flex;justify-content:space-between;align-items:baseline;gap:10px}
.mname{font-weight:700;font-size:15px}
.mval{font-family:"DM Mono",ui-monospace,monospace;font-size:13px;color:var(--ink-2);font-variant-numeric:tabular-nums}
.track{height:11px;background:var(--track);border:1.5px solid var(--rule);border-radius:999px;overflow:hidden;margin-top:5px}
.track i{display:block;height:100%;border-radius:999px;transition:width .22s ease}
.meter[data-kind=control] .track i{background:var(--control)}
.meter[data-kind=cap] .track i{background:var(--cap)}
.meter[data-kind=load] .track i{background:repeating-linear-gradient(135deg,var(--load) 0 7px,#a33a26 7px 14px)}
.mhint{font-size:13px;color:var(--ink-2);margin:5px 0 0;line-height:1.35}
.axis{display:flex;justify-content:space-between;font-family:"DM Mono",ui-monospace,monospace;font-size:10.5px;letter-spacing:.05em;text-transform:uppercase;color:var(--ink-2);margin-top:11px;border-top:1.5px dashed var(--rule);padding-top:7px}

/* changes */
.chglist{list-style:none;margin:12px 0 0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:8px}
.chg{display:flex;justify-content:space-between;align-items:center;gap:8px;border:2px solid var(--rule);border-radius:11px;padding:8px 11px;font-size:14px;background:var(--paper)}
.chg b{font-family:"DM Mono",ui-monospace,monospace;font-size:12px;text-transform:uppercase;letter-spacing:.06em}
.chg.yes{background:#e4efe2}.chg.part{background:#f7ecd4}.chg.no{background:#f0e6dd}

/* prose sections */
.section{border-top:3px solid var(--rule);padding-top:24px;margin-top:34px}
.section > .eyebrow{margin-bottom:8px}
.section p{max-width:64ch}
.quote{font-family:"Bricolage Grotesque",Georgia,serif;font-size:clamp(19px,3.2vw,24px);font-weight:700;line-height:1.25;margin:0}
.rolecard{display:flex;gap:14px;align-items:flex-start}
.rolecard .badge{font-family:"DM Mono",ui-monospace,monospace;font-size:11px;letter-spacing:.08em;text-transform:uppercase;border:2px solid var(--rule);border-radius:8px;padding:5px 8px;background:var(--gold);white-space:nowrap;flex:0 0 auto;margin-top:3px}
dl.facts{margin:14px 0 0;display:grid;gap:0}
dl.facts div{border-top:1.5px solid var(--rule);padding:11px 0;display:grid;grid-template-columns:150px 1fr;gap:14px}
dl.facts dt{font-family:"DM Mono",ui-monospace,monospace;font-size:12px;letter-spacing:.05em;text-transform:uppercase;color:var(--ink-2)}
dl.facts dd{margin:0;font-size:15.5px}
.jump{display:inline-block;border:2px solid var(--rule);border-radius:999px;background:var(--card);box-shadow:2px 2px 0 var(--rule);padding:6px 13px;font-size:14px;font-weight:700;margin:4px 6px 4px 0}
.src{font-size:13.5px;color:var(--ink-2);margin-top:14px}
.src a{color:var(--ink-2)}
footer{border-top:3px solid var(--rule);margin-top:40px;padding:24px 0 56px;font-size:14px;color:var(--ink-2)}
footer .closer{font-family:"Bricolage Grotesque",Georgia,serif;font-size:clamp(20px,3.6vw,27px);font-weight:800;color:var(--ink);line-height:1.2;margin-bottom:16px;max-width:22ch}
.sib{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0 18px}
.sib a{border:2px solid var(--rule);border-radius:999px;background:var(--card);padding:5px 12px;font-size:13.5px;font-weight:700;text-decoration:none;color:var(--ink)}

/* two-column instrument on wide screens */
@media (min-width:900px){
  :root{--col:min(100%,1120px)}
  .instrument .split{display:grid;grid-template-columns:minmax(0,1fr) minmax(330px,.82fr);gap:26px;align-items:start}
  .instrument .split > .right{position:sticky;top:14px}
  .meters{grid-template-columns:1fr 1fr;gap:13px 22px}
  .group[data-g=load] .meters{grid-template-columns:1fr 1fr}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}

/* credential: the meter that does not move */
.meter[data-pin] .track{border-style:dashed;border-color:var(--gold);border-width:2px}
.meter[data-pin] .mname::after{content:" \1F512";font-size:11px;opacity:.6}
.meter[data-pin] .track i{background:repeating-linear-gradient(90deg,var(--control) 0 5px,#245a68 5px 10px)}
.seg.two{grid-template-columns:1fr 1fr}
.tallies.three{grid-template-columns:repeat(3,1fr);margin-top:13px;border-top:2px solid var(--rule)}
#credDelta[data-moved=yes]{color:var(--load)}
#credDelta[data-moved=no]{color:var(--ink-2)}

/* jurisdiction dial */
select#province{width:100%;min-height:48px;font:inherit;font-weight:700;font-size:16px;color:var(--ink);
  border:2px solid var(--rule);border-radius:12px;background:var(--card);box-shadow:2px 2px 0 var(--rule);
  padding:9px 12px;appearance:none;
  background-image:linear-gradient(45deg,transparent 50%,var(--ink) 50%),linear-gradient(135deg,var(--ink) 50%,transparent 50%);
  background-position:calc(100% - 19px) 21px,calc(100% - 13px) 21px;background-size:6px 6px,6px 6px;background-repeat:no-repeat}
select#province:focus-visible{outline:3px solid var(--control);outline-offset:2px}

.pill{display:inline-block;font-family:"DM Mono",ui-monospace,monospace;font-size:12px;letter-spacing:.07em;
  text-transform:uppercase;border:2px solid var(--rule);border-radius:999px;padding:4px 12px;font-weight:500}
.pill[data-status=open]{background:#d9e9d6}
.pill[data-status=ministry]{background:#dbe7ee}
.pill[data-status=limited]{background:#f7ecd4}
.pill[data-status=enrolment]{background:#f2d9d1}

#eraWrap[data-applies=no]{opacity:.62}
#eraWrap[data-applies=no] .seg button{cursor:not-allowed;box-shadow:none;transform:none}
#eraWrap .seg{margin-top:14px}
.seg button[disabled]{background:var(--paper);color:var(--ink-2)}
.seg button[disabled].on{background:var(--track)}