/* Family admin hub — shared styles */

:root{
  --ink:#18212F; --ink-soft:#3D4A5C; --muted:#6E7A8A;
  --paper:#E9ECF0; --card:#FFFFFF;
  --rule:#C6CEDA; --rule-soft:#DEE3EA;
  --flag:#E8C547; --flag-deep:#8A6D0B;
  --slate:#2E4A6B; --slate-mid:#5C7CA0; --slate-pale:#9DB2C9;
  --restrict:#6B4E8A;
  --max:1040px;
}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;background:var(--paper);color:var(--ink);
  font-family:"IBM Plex Sans",system-ui,sans-serif;
  font-size:15px;line-height:1.55;-webkit-font-smoothing:antialiased;
}
.wrap{max-width:var(--max);margin:0 auto;padding:0 24px}
a{color:var(--slate)}

/* ---------- nav ---------- */
.topbar{background:var(--ink);color:#fff;position:sticky;top:0;z-index:20}
.topbar .wrap{display:flex;align-items:center;gap:22px;flex-wrap:wrap;padding:11px 24px}
.brand{
  font-family:"Instrument Sans",sans-serif;font-weight:700;font-size:14px;
  letter-spacing:-.01em;color:#fff;text-decoration:none;white-space:nowrap;
}
.brand span{color:var(--slate-pale);font-weight:500}
.nav{display:flex;gap:2px 14px;flex-wrap:wrap;margin-left:auto}
.nav a{
  font-family:"IBM Plex Mono",monospace;font-size:10.5px;letter-spacing:.09em;
  text-transform:uppercase;color:var(--slate-pale);text-decoration:none;
  padding:3px 0;border-bottom:2px solid transparent;
}
.nav a:hover{color:#fff}
.nav a[aria-current="page"]{color:#fff;border-bottom-color:var(--flag)}

/* ---------- page head ---------- */
.head{padding:48px 0 0}
.eyebrow{
  font-family:"IBM Plex Mono",monospace;font-size:11px;font-weight:500;
  letter-spacing:.14em;text-transform:uppercase;color:var(--muted);
  display:flex;flex-wrap:wrap;gap:6px 18px;align-items:baseline;
}
.head h1{
  font-family:"Instrument Sans",sans-serif;font-weight:700;
  font-size:clamp(1.9rem,5.2vw,2.9rem);letter-spacing:-.03em;
  line-height:1.04;margin:16px 0 0;max-width:24ch;
}
.standfirst{margin:15px 0 0;max-width:60ch;color:var(--ink-soft);font-size:16px}

/* ---------- sections ---------- */
section{padding:40px 0;border-top:1px solid var(--rule)}
section:first-of-type{border-top:none;padding-top:36px}
.sec-head{display:flex;flex-wrap:wrap;gap:6px 16px;align-items:baseline;margin-bottom:6px}
.sec-head h2{
  font-family:"Instrument Sans",sans-serif;font-size:1.3rem;
  font-weight:600;letter-spacing:-.02em;margin:0;
}
.sec-head h3{
  font-family:"Instrument Sans",sans-serif;font-size:1.05rem;
  font-weight:600;letter-spacing:-.015em;margin:0;
}
.sec-count{font-family:"IBM Plex Mono",monospace;font-size:11px;letter-spacing:.1em;color:var(--muted)}
.sec-note{margin:0 0 24px;max-width:64ch;color:var(--ink-soft);font-size:14.5px}
p{max-width:70ch}

/* ---------- ledger tables ---------- */
.ledger{border-top:1px solid var(--ink);margin-bottom:8px}
.row{
  display:grid;grid-template-columns:1.7fr .8fr .8fr 1.1fr;gap:14px;
  padding:12px 0;border-bottom:1px solid var(--rule-soft);align-items:baseline;
}
.row-head{
  border-bottom:1px solid var(--rule);padding:8px 0;
  font-family:"IBM Plex Mono",monospace;font-size:9.5px;
  letter-spacing:.12em;text-transform:uppercase;color:var(--muted);
}
.row-total{border-bottom:2px solid var(--ink);border-top:1px solid var(--ink);font-weight:600}
.cw strong{display:block;font-weight:600;font-size:14.5px}
.cw span{display:block;color:var(--muted);font-size:12px;margin-top:1px}
.num{
  font-family:"IBM Plex Mono",monospace;font-weight:500;font-size:13.5px;
  font-variant-numeric:tabular-nums;white-space:nowrap;
}
.num-soft{color:var(--ink-soft)}
.cad{font-family:"IBM Plex Mono",monospace;font-size:11.5px;color:var(--ink-soft)}
.note{font-size:12.5px;color:var(--muted)}
.up{color:var(--flag-deep);font-weight:500}
.dn{color:var(--slate)}

/* ---------- tags ---------- */
.tag{
  display:inline-block;font-family:"IBM Plex Mono",monospace;font-size:9px;
  letter-spacing:.08em;text-transform:uppercase;border:1px solid var(--rule);
  padding:1px 4px;margin-left:5px;color:var(--muted);vertical-align:1px;
}
.tag-q{border-color:var(--flag);color:var(--flag-deep);background:rgba(232,197,71,.16)}
.tag-r{border-color:var(--restrict);color:var(--restrict);background:rgba(107,78,138,.09)}

/* ---------- callouts ---------- */
.finding{
  background:var(--card);border:1px solid var(--rule);
  border-left:3px solid var(--flag);padding:20px 22px;margin-bottom:12px;
}
.finding.is-plain{border-left-color:var(--slate)}
.finding.is-restricted{border-left-color:var(--restrict)}
.finding-tag{
  font-family:"IBM Plex Mono",monospace;font-size:10px;letter-spacing:.12em;
  text-transform:uppercase;color:var(--flag-deep);font-weight:500;
}
.is-plain .finding-tag{color:var(--slate)}
.is-restricted .finding-tag{color:var(--restrict)}
.finding h3{
  font-family:"Instrument Sans",sans-serif;font-size:1.05rem;font-weight:600;
  margin:6px 0 8px;letter-spacing:-.015em;
}
.finding p{margin:0 0 8px;font-size:14.5px;color:var(--ink-soft);max-width:72ch}
.finding p:last-child{margin-bottom:0}
.big{font-family:"IBM Plex Mono",monospace;font-weight:600;color:var(--ink);font-size:15px}

/* ---------- empty state ---------- */
.empty{
  border:1px dashed var(--rule);background:var(--card);
  padding:22px 24px;margin-bottom:14px;
}
.empty h3{
  font-family:"Instrument Sans",sans-serif;font-size:1rem;font-weight:600;
  margin:0 0 8px;letter-spacing:-.01em;
}
.empty p{margin:0 0 10px;font-size:14px;color:var(--ink-soft)}
.empty p:last-child{margin-bottom:0}
.checklist{margin:10px 0 0;padding:0;list-style:none}
.checklist li{
  padding:6px 0 6px 26px;position:relative;font-size:14px;
  border-bottom:1px solid var(--rule-soft);
}
.checklist li:last-child{border-bottom:none}
.checklist li::before{
  content:"";position:absolute;left:2px;top:12px;
  width:11px;height:11px;border:1px solid var(--muted);
}
.checklist li em{display:block;color:var(--muted);font-style:normal;font-size:12.5px;margin-top:2px}

/* ---------- stat strip ---------- */
.stats{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));
  gap:1px;background:var(--rule);border:1px solid var(--rule);margin-bottom:26px;
}
.stat{background:var(--card);padding:16px 18px}
.stat-num{
  font-family:"Instrument Sans",sans-serif;font-weight:700;font-size:1.5rem;
  letter-spacing:-.03em;line-height:1;font-variant-numeric:tabular-nums;
}
.stat-lab{
  font-family:"IBM Plex Mono",monospace;font-size:10px;letter-spacing:.1em;
  text-transform:uppercase;color:var(--muted);margin-top:7px;
}

/* ---------- bars ---------- */
.bars{margin-top:4px}
.bar-row{display:grid;grid-template-columns:150px 1fr 90px;gap:12px;align-items:center;padding:5px 0}
.bar-lab{font-size:13.5px}
.bar-track{background:var(--card);border:1px solid var(--rule-soft);height:16px}
.bar-fill{height:100%;background:var(--slate-mid)}
.bar-fill.hi{background:var(--slate)}
.bar-val{
  font-family:"IBM Plex Mono",monospace;font-size:12.5px;text-align:right;
  font-variant-numeric:tabular-nums;
}

/* ---------- index cards ---------- */
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:14px}
.card{
  background:var(--card);border:1px solid var(--rule);padding:20px;
  text-decoration:none;color:inherit;display:block;
  border-top:3px solid var(--slate);
}
.card:hover{border-color:var(--slate-mid)}
.card.is-thin{border-top-color:var(--flag)}
.card.is-restricted{border-top-color:var(--restrict)}
.card h3{
  font-family:"Instrument Sans",sans-serif;font-size:1.05rem;font-weight:600;
  margin:0 0 6px;letter-spacing:-.015em;
}
.card p{margin:0;font-size:13.5px;color:var(--ink-soft)}
.card .state{
  font-family:"IBM Plex Mono",monospace;font-size:9.5px;letter-spacing:.1em;
  text-transform:uppercase;color:var(--muted);margin-top:11px;display:block;
}

/* ---------- tree ---------- */
pre.tree{
  background:var(--card);border:1px solid var(--rule);padding:18px 20px;
  font-family:"IBM Plex Mono",monospace;font-size:12.5px;line-height:1.7;
  overflow-x:auto;margin:0 0 14px;
}
pre.tree b{color:var(--slate);font-weight:600}
pre.tree i{color:var(--muted);font-style:normal}

/* ---------- footer ---------- */
footer{border-top:2px solid var(--ink);padding:26px 0 60px;font-size:13px;color:var(--muted);max-width:72ch}
footer strong{color:var(--ink)}
footer p{margin:0 0 10px}

@media (max-width:760px){
  .row{grid-template-columns:1fr auto;gap:4px 12px}
  .row-head{display:none}
  .c-wide{grid-column:1/-1}
  .bar-row{grid-template-columns:1fr 70px;gap:8px}
  .bar-track{display:none}
  .nav{width:100%;margin-left:0}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}