/* ============================================================
   Practice Toolkit — shared design system
   Tokens + components used by the hub and every tool page.
   Change a colour here and every tool updates together.
   v1.0 · 07-Jul-2026
   ============================================================ */
:root{
  --ink:#12212e;--ink-soft:#3d5568;--paper:#f6f8f9;--card:#ffffff;
  --line:#dce4e9;--line-strong:#b9c6cf;--emerald:#0f7a5a;--emerald-soft:#e4f2ec;
  --amber:#a86412;--amber-soft:#fbf1e0;--red:#a3352b;--red-soft:#fbe7e4;
  --radius:12px;
  --mono:"SFMono-Regular",ui-monospace,"Cascadia Mono","Consolas",monospace;
  --sans:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
}
*{box-sizing:border-box;}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);
  line-height:1.5;-webkit-font-smoothing:antialiased;padding:16px;}
.wrap{max-width:640px;margin:0 auto;}
.wrap-wide{max-width:860px;margin:0 auto;}

/* ---- header block ---- */
.backlink{display:inline-block;font-size:12.5px;font-weight:600;color:var(--ink-soft);
  text-decoration:none;margin-bottom:10px;}
.backlink:hover{color:var(--emerald);}
header.head{border-bottom:2px solid var(--ink);padding-bottom:12px;margin-bottom:14px;}
.eyebrow{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-soft);font-weight:700;}
h1{font-size:22px;margin:4px 0 2px;letter-spacing:-.01em;}
.sub{font-size:13px;color:var(--ink-soft);margin:0;}
.privacy{font-size:11.5px;color:var(--emerald);font-weight:600;margin:10px 0 0;}

/* ---- cards & fields ---- */
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:16px;margin-bottom:16px;}
.card h2{font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-soft);margin:0 0 14px;font-weight:700;}
.field{margin-bottom:14px;}.field:last-child{margin-bottom:0;}
label{display:block;font-size:13px;font-weight:600;margin-bottom:5px;}
label .hint{display:block;font-weight:400;font-size:11.5px;color:var(--ink-soft);margin-top:2px;}
input[type="number"],input[type="date"],select{width:100%;font-family:var(--mono);font-size:15px;color:var(--ink);
  padding:10px 12px;border:1px solid var(--line-strong);border-radius:8px;background:#fff;
  transition:border-color .15s,box-shadow .15s;}
select{font-family:var(--sans);font-size:14px;}
input:focus,select:focus{outline:none;border-color:var(--emerald);box-shadow:0 0 0 3px var(--emerald-soft);}
input::placeholder{color:#9fb0bb;}
.row{display:flex;gap:12px;flex-wrap:wrap;}
.row .field{flex:1;min-width:140px;}

/* ---- segmented buttons ---- */
.seg{display:inline-flex;border:1px solid var(--line-strong);border-radius:8px;overflow:hidden;}
.seg button{font-family:var(--sans);font-size:13px;font-weight:600;padding:8px 14px;border:none;
  background:#fff;color:var(--ink-soft);cursor:pointer;}
.seg button.active{background:var(--ink);color:#fff;}
.toggle-note{font-size:11.5px;color:var(--ink-soft);margin-top:6px;}

/* ---- test/limit list (the "least of" pattern) ---- */
.limits{list-style:none;margin:0;padding:0;}
.limit{display:flex;align-items:baseline;justify-content:space-between;gap:10px;padding:11px 0;border-bottom:1px dashed var(--line);}
.limit:last-child{border-bottom:none;}
.limit .lbl{font-size:13px;}.limit .lbl b{display:block;font-size:13px;}
.limit .lbl span{font-size:11.5px;color:var(--ink-soft);}
.limit .val{font-family:var(--mono);font-size:15px;font-weight:600;white-space:nowrap;}
.limit.is-binding{background:var(--emerald-soft);margin:0 -16px;padding-left:16px;padding-right:16px;border-radius:8px;}
.limit.is-binding .lbl b{color:var(--emerald);}
.limit.is-fail{background:var(--red-soft);margin:0 -16px;padding-left:16px;padding-right:16px;border-radius:8px;}
.limit.is-fail .lbl b{color:var(--red);}
.badge{display:inline-block;font-size:10px;letter-spacing:.08em;text-transform:uppercase;font-weight:700;
  color:#fff;background:var(--emerald);padding:2px 7px;border-radius:20px;margin-left:6px;vertical-align:middle;}
.badge.warn{background:var(--amber);}
.badge.fail{background:var(--red);}

/* ---- result stat cards ---- */
.headline{display:flex;flex-wrap:wrap;gap:10px;margin-top:4px;}
.stat{flex:1;min-width:150px;border:1px solid var(--line);border-radius:10px;padding:14px;}
.stat.exempt,.stat.yes{background:var(--emerald-soft);border-color:#bfe0d3;}
.stat.taxable,.stat.warn{background:var(--amber-soft);border-color:#eeddbf;}
.stat.no{background:#eef2f4;border-color:var(--line);}
.stat.fail{background:var(--red-soft);border-color:#ecc9c4;}
.stat .k{font-size:11px;letter-spacing:.1em;text-transform:uppercase;font-weight:700;color:var(--ink-soft);}
.stat.exempt .k,.stat.yes .k{color:var(--emerald);}
.stat.taxable .k,.stat.warn .k{color:var(--amber);}
.stat.fail .k{color:var(--red);}
.stat .v{font-family:var(--mono);font-size:24px;font-weight:700;margin-top:4px;}
.stat .v.small{font-size:17px;font-family:var(--sans);}
.stat .d{font-size:11.5px;color:var(--ink-soft);margin-top:4px;line-height:1.45;}

/* ---- dark reconcile / detail panel ---- */
.reconcile{background:var(--ink);color:#e8eef2;border-radius:var(--radius);padding:16px;}
.reconcile h2{color:#8fb3c4;}
.rec-row{display:flex;justify-content:space-between;gap:10px;padding:7px 0;font-size:13.5px;border-bottom:1px solid #22384a;}
.rec-row:last-child{border-bottom:none;}.rec-row .v{font-family:var(--mono);font-weight:600;}
.verdict{margin-top:12px;font-size:13.5px;line-height:1.5;padding:12px;border-radius:8px;background:#0f7a5a1a;border:1px solid #1c5b48;}
.verdict.warn{background:#a864121f;border-color:#6b4517;}
.verdict b{color:#fff;}.imp{font-family:var(--mono);}
.pos{color:#38c895;font-weight:700;}.neg{color:#e0a44a;font-weight:700;}

/* ---- footer / stamp / credit ---- */
footer.note{font-size:11.5px;color:var(--ink-soft);line-height:1.55;margin-top:6px;}
.stamp{display:inline-block;font-size:11px;font-weight:700;letter-spacing:.06em;color:var(--ink-soft);
  border:1px solid var(--line-strong);border-radius:20px;padding:3px 10px;margin:12px 0 4px;background:#fff;}
.disclaimer{font-size:11px;color:var(--ink-soft);margin-top:8px;font-style:italic;}
.credit{text-align:center;font-size:12px;color:var(--ink-soft);margin-top:22px;padding-top:14px;border-top:1px solid var(--line);}
.credit b{color:var(--ink);}
.credit a{color:var(--ink);text-decoration:none;border-bottom:1px dotted var(--line-strong);}
.credit a:hover{color:var(--emerald);}

/* ---- hub page tool cards ---- */
.toolgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:12px;margin-top:16px;}
a.toolcard{display:block;background:var(--card);border:1px solid var(--line);border-radius:var(--radius);
  padding:16px;text-decoration:none;color:var(--ink);transition:border-color .15s,box-shadow .15s,transform .1s;}
a.toolcard:hover{border-color:var(--emerald);box-shadow:0 2px 10px rgba(15,122,90,.10);transform:translateY(-1px);}
.toolcard .t-eyebrow{font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-soft);font-weight:700;}
.toolcard h3{font-size:15.5px;margin:5px 0 4px;letter-spacing:-.01em;}
.toolcard p{font-size:12.5px;color:var(--ink-soft);margin:0;line-height:1.5;}
.toolcard .go{display:inline-block;margin-top:10px;font-size:12px;font-weight:700;color:var(--emerald);}
.toolcard.soon{opacity:.62;pointer-events:none;background:#f2f5f6;}
.toolcard.soon .go{color:var(--ink-soft);}

@media print{body{background:#fff;padding:0;}input,select{border:none;padding:0;}
  .card{border:1px solid #ccc;break-inside:avoid;}.backlink{display:none;}}