/* Layout: a school register. Ruled rows, a mono counter column, one highlighter colour. */
:root{
  --bg:#f5f9f7; --surface:#ffffff; --band:#e7f0ec; --fg:#12211f; --muted:#4f6662;
  --primary:#0f5c57; --on-primary:#ffffff; --accent:#f0b429; --on-accent:#2b2000; --line:#cfdcd7;
  --display:"Bricolage Grotesque","Trebuchet MS",system-ui,sans-serif;
  --body:"Public Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
  --mono:"IBM Plex Mono",ui-monospace,Menlo,Consolas,monospace;
}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){
  --bg:#0d1615; --surface:#14201e; --band:#111c1a; --fg:#e4eeeb; --muted:#9bb2ad;
  --primary:#74d3c7; --on-primary:#06201d; --accent:#f3c04a; --on-accent:#2b2000; --line:#27403b; color-scheme:dark}}
:root[data-theme="dark"]{
  --bg:#0d1615; --surface:#14201e; --band:#111c1a; --fg:#e4eeeb; --muted:#9bb2ad;
  --primary:#74d3c7; --on-primary:#06201d; --accent:#f3c04a; --on-accent:#2b2000; --line:#27403b; color-scheme:dark}
*,*::before,*::after{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--fg);font:400 1.0625rem/1.65 var(--body)}
a{color:var(--primary);text-underline-offset:.18em}
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible{outline:3px solid var(--accent);outline-offset:2px}
h1,h2,h3{font-family:var(--display);line-height:1.12;text-wrap:balance;margin:0}
h1{font-size:clamp(2rem,5.2vw,3.4rem);font-weight:700;letter-spacing:-.02em}
h2{font-size:clamp(1.35rem,2.6vw,1.75rem);font-weight:700}
h3{font-size:1.15rem;font-weight:700}
p,ul,ol,dl{margin:0}
.wrap{max-width:70rem;margin-inline:auto;padding-inline:clamp(1rem,4vw,2rem)}
.narrow>*,.prose>*{max-width:46rem}
.block{padding-block:clamp(2rem,5vw,3.5rem);display:flex;flex-direction:column;gap:1.1rem}
.band{background:var(--band);border-block:1px solid var(--line);padding-block:clamp(2rem,5vw,3.5rem)}
.band .narrow{display:flex;flex-direction:column;gap:1.1rem}
.split{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,19rem),1fr));gap:2rem 3rem}
.split.block{display:grid}
.split>*{min-width:0;display:flex;flex-direction:column;gap:1rem;align-items:flex-start}
.eyebrow{font:500 .78rem/1.4 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.lead{font-size:1.2rem;line-height:1.55;color:var(--muted);max-width:40rem}
.fine{font-size:.9rem;color:var(--muted)}
.skip{position:absolute;left:-999rem}
.skip:focus{left:1rem;top:1rem;background:var(--surface);padding:.5rem .75rem;z-index:5}

.top{border-bottom:1px solid var(--line);background:var(--bg)}
.top .wrap{display:flex;flex-wrap:wrap;align-items:center;gap:.6rem 1.5rem;padding-block:.9rem}
.brand{font:700 1.35rem/1 var(--display);color:var(--fg);text-decoration:none;letter-spacing:-.02em;margin-right:auto}
.brand b{background:var(--accent);color:var(--on-accent);padding:.05em .22em;border-radius:.2em;font-weight:700}
.top nav{display:flex;flex-wrap:wrap;gap:.3rem 1.1rem;font-size:.95rem}
.top nav a{color:var(--fg);text-decoration:none;padding-block:.2rem;border-bottom:2px solid transparent}
.top nav a:hover,.top nav a[aria-current="page"]{border-bottom-color:var(--accent)}
.lang{font:500 .8rem/1 var(--mono);color:var(--muted)}

.btn{display:inline-block;font:600 1rem/1.2 var(--body);padding:.8rem 1.15rem;border-radius:.45rem;text-decoration:none;border:2px solid var(--primary);cursor:pointer}
.btn.primary{background:var(--primary);color:var(--on-primary)}
.btn.ghost{background:transparent;color:var(--primary)}
.btn.small{padding:.5rem .8rem;font-size:.92rem}
.btn:hover{filter:brightness(1.08)}
.actions{display:flex;flex-wrap:wrap;gap:.75rem}
.more{font-weight:600}

.hero{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,20rem),1fr));gap:2.5rem 3.5rem;align-items:center;padding-block:clamp(2.5rem,7vw,5rem)}
.hero-text{display:flex;flex-direction:column;gap:1.25rem;min-width:0}
.ledger{margin:0;background:var(--surface);border:1px solid var(--line);border-radius:.5rem;min-width:0;overflow:hidden}
.ledger-head{font:700 1.05rem/1.3 var(--display);padding:.9rem 1.1rem;border-bottom:2px solid var(--fg)}
.ledger ol{list-style:none;padding:0;counter-reset:row}
.ledger li{counter-increment:row;display:flex;gap:1rem;align-items:baseline;padding:.6rem 1.1rem;border-bottom:1px solid var(--line)}
.ledger li::before{content:counter(row,decimal-leading-zero);font:500 .8rem/1 var(--mono);color:var(--muted);flex:none}
.ledger li:first-child{background:color-mix(in srgb,var(--accent) 28%,transparent)}
.ledger-note{font-size:.88rem;color:var(--muted);padding:.8rem 1.1rem;line-height:1.5}

.checks{list-style:none;padding:0;display:flex;flex-direction:column;gap:.7rem;align-self:stretch}
.checks li{padding-left:1.6rem;position:relative}
.checks li::before{content:"";position:absolute;left:0;top:.62em;width:.85rem;height:.3rem;background:var(--accent);border-radius:1px}
.cols3{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,15rem),1fr));gap:1.5rem 2.5rem}
.cols3 article{display:flex;flex-direction:column;gap:.5rem;border-top:2px solid var(--fg);padding-top:.9rem;min-width:0}
.postlist{list-style:none;padding:0;display:flex;flex-direction:column;align-self:stretch}
.postlist li{display:flex;flex-direction:column;gap:.25rem;padding-block:.9rem;border-top:1px solid var(--line)}
.postlist a{font:700 1.08rem/1.3 var(--display)}
.postlist span{font:500 .78rem/1.4 var(--mono);color:var(--muted)}
.postlist.big a{font-size:1.3rem}
.postlist.big p{color:var(--muted)}

.svc{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,16rem),1fr));gap:1rem 3rem;border-top:2px solid var(--fg);padding-block:1.4rem}
.svc>div{display:flex;flex-direction:column;gap:.7rem;min-width:0}
.svc ul{padding-left:1.15rem;display:flex;flex-direction:column;gap:.3rem}
.label{font:500 .78rem/1.4 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin-top:.4rem}
.steps{list-style:none;padding:0;counter-reset:step;display:flex;flex-direction:column}
.steps li{counter-increment:step;display:grid;grid-template-columns:3rem 1fr;gap:.3rem 1rem;padding-block:1.2rem;border-top:1px solid var(--line)}
.steps li::before{content:counter(step,decimal-leading-zero);font:500 1rem/1.5 var(--mono);color:var(--primary);grid-row:span 2}
.steps h2{font-size:1.25rem}
.steps p{grid-column:2}
.tablewrap{overflow-x:auto}
table{border-collapse:collapse;width:100%;background:var(--surface)}
th,td{text-align:left;vertical-align:top;padding:.7rem .9rem;border:1px solid var(--line)}
th{font:500 .78rem/1.4 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}

.prose h2{margin-top:1.1rem}
.prose ol,.prose ul{padding-left:1.3rem;display:flex;flex-direction:column;gap:.55rem}
.prose .qa li strong{display:block}
.sources{font-size:.9rem;overflow-wrap:anywhere}
.src-h{font-size:1rem;font-family:var(--mono);font-weight:500;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);border-top:1px solid var(--line);padding-top:1.2rem}

.channels dl{display:flex;flex-direction:column;gap:.15rem;align-self:stretch}
.channels dt{font:500 .78rem/1.4 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin-top:.9rem}
.channels dd{margin:0;font-size:1.15rem;font-weight:600;overflow-wrap:anywhere;user-select:all}
.cform{background:var(--surface);border:1px solid var(--line);border-radius:.5rem;padding:1.4rem;align-self:stretch;gap:.45rem!important;align-items:stretch!important}
.cform label{font-weight:600;font-size:.95rem;margin-top:.5rem}
.cform input:not([type=checkbox]),.cform textarea{font:inherit;color:var(--fg);background:var(--bg);border:1px solid var(--line);border-radius:.35rem;padding:.65rem .75rem;width:100%}
.cform .consent{font-weight:400;font-size:.9rem;display:flex;gap:.6rem;align-items:flex-start;margin-block:.6rem}
.cform .consent input{margin-top:.3rem;flex:none}
.cform .consent span{min-width:0}
.formmsg{font-weight:600;border-left:4px solid var(--accent);padding:.5rem .8rem;background:var(--band)}

.foot{border-top:2px solid var(--fg);margin-top:2rem}
.foot .wrap{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,14rem),1fr));gap:1.5rem 3rem;padding-block:2rem;font-size:.95rem}
.foot .wrap>div{display:flex;flex-direction:column;gap:.35rem;min-width:0;overflow-wrap:anywhere}
.foot h2{font:500 .78rem/1.4 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.foot .legal{color:var(--muted);font-size:.85rem;margin-top:.5rem}
@media (prefers-reduced-motion:no-preference){.btn,.top nav a{transition:filter .15s,border-color .15s}}