/* tokens.css — v2 design-system single source of truth.
   Imported first by style.css. free-plans.html + free-plans-pdf.html mirror
   these values inline (they do NOT load this file). Self-hosted fonts only. */

@font-face{font-family:"Source Serif 4";font-weight:400;font-display:swap;src:url("assets/fonts/source-serif-4-400.subset.woff2") format("woff2")}
@font-face{font-family:"Source Serif 4";font-weight:600;font-display:swap;src:url("assets/fonts/source-serif-4-600.subset.woff2") format("woff2")}
@font-face{font-family:"Source Serif 4";font-weight:700;font-display:swap;src:url("assets/fonts/source-serif-4-700.subset.woff2") format("woff2")}
@font-face{font-family:"Public Sans";font-weight:400;font-display:swap;src:url("assets/fonts/public-sans-400.subset.woff2") format("woff2")}
@font-face{font-family:"Public Sans";font-weight:500;font-display:swap;src:url("assets/fonts/public-sans-500.subset.woff2") format("woff2")}
@font-face{font-family:"Public Sans";font-weight:600;font-display:swap;src:url("assets/fonts/public-sans-600.subset.woff2") format("woff2")}
@font-face{font-family:"Public Sans";font-weight:700;font-display:swap;src:url("assets/fonts/public-sans-700.subset.woff2") format("woff2")}
@font-face{font-family:"Zilla Slab";font-weight:700;font-display:swap;src:url("assets/fonts/zilla-slab-700.subset.woff2") format("woff2")}
@font-face{font-family:"IBM Plex Mono";font-weight:400;font-display:swap;src:url("assets/fonts/ibm-plex-mono-400.subset.woff2") format("woff2")}
@font-face{font-family:"IBM Plex Mono";font-weight:500;font-display:swap;src:url("assets/fonts/ibm-plex-mono-500.subset.woff2") format("woff2")}
@font-face{font-family:"IBM Plex Mono";font-weight:600;font-display:swap;src:url("assets/fonts/ibm-plex-mono-600.subset.woff2") format("woff2")}

:root{
  /* surfaces */
  --paper:#fbf9f4; --card:#ffffff; --card-tint:#fdfcf8; --header-tint:#f6f0e4;
  --section-tint-a:#f6f2e9; --section-tint-b:#f9f4e8; --footer-band:#efe8d6;
  --hairline-a:#e7dfcd; --hairline-b:#ddd3bd;
  /* text */
  --ink:#23201a; --ink-hover:#3a352b; --body:#4d463c;
  --muted-a:#6b6252; --muted-b:#8a8070; --muted-c:#8a7f6a; --faint-mono:#a39a87;
  /* semantic roles */
  --green:#3f6b4f; --green-hover:#345c43; --green-tint:#eef3ee; --green-border:#c5d6c8;
  --amber:#d9993b; --amber-border:#b5722a; --amber-text:#a3702a; --amber-text-2:#8a6134;
  --amber-tint:#f4ede0; --amber-disclosure-tint:#f4ecd9;
  --brown:#6b4c2a; --brown-hover:#8a6134;
  --red:#c04a30; --red-tint:#fdf6f0; --red-border:#e6cbb8;
  --ink-disabled:#c9bda6;
  --dark-panel:#2f2418; --dark-panel-alt:#23201a; --cream:#f2ead9;
  /* fonts */
  --serif:"Source Serif 4",Georgia,serif;
  --sans:"Public Sans",Arial,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  --mono:"IBM Plex Mono","Courier New",ui-monospace,monospace;
  --wordmark:"Zilla Slab",Georgia,serif;
  /* shape */
  --radius-btn:8px; --radius-card:10px; --radius-tag:4px; --radius-pill:20px; --radius-callout:6px;
  --shadow-card:0 1px 3px rgba(60,48,30,.06);
  --shadow-raised:0 2px 10px rgba(60,48,30,.12);
}

/* buttons: one base, forked by role */
.btn{display:inline-block;font-family:var(--sans);font-weight:700;font-size:1rem;
  padding:.9rem 1.5rem;border-radius:var(--radius-btn);border:0;cursor:pointer;
  text-decoration:none;background:var(--ink);color:var(--paper);transition:background .15s}
.btn:hover{background:var(--ink-hover)}
.btn[disabled],.btn.is-disabled{background:var(--ink-disabled);cursor:not-allowed}
.btn-green{background:var(--green);color:var(--paper)}
.btn-green:hover{background:var(--green-hover)}
.btn-brown{background:var(--brown);color:var(--paper)}
.btn-brown:hover{background:var(--brown-hover)}
.btn-red{background:var(--red);color:var(--paper)}
.btn.big{font-size:1.08rem;padding:1rem 1.7rem}

/* callouts: 3px left border + tint, three semantic variants */
.callout{border-left:3px solid var(--hairline-b);background:var(--card-tint);
  border-radius:var(--radius-callout);padding:.85rem 1.1rem;margin:1rem 0}
.callout-advice{border-left-color:var(--green);background:var(--green-tint)}
.callout-disclosure{border-left-color:var(--amber-border);background:var(--amber-disclosure-tint)}
.callout-flag{border-left-color:var(--red);background:var(--red-tint);border:1px solid var(--red-border);border-left-width:3px}

/* stamp + chips */
.stamp{border:2.5px solid var(--green);border-radius:var(--radius-btn);
  font-family:var(--mono);text-transform:uppercase;letter-spacing:.1em;
  padding:.6rem .9rem;transform:rotate(-2deg);display:inline-block}
.chip-tag{font-family:var(--mono);text-transform:uppercase;font-size:.68rem;
  letter-spacing:.08em;border-radius:var(--radius-tag);padding:.15rem .4rem}
.chip-tag.easy{background:var(--green-tint);color:var(--green)}
.chip-tag.easyplus{background:var(--amber-tint);color:var(--amber-text-2)}
.chip-pill{font-family:var(--mono);text-transform:uppercase;font-size:.72rem;
  letter-spacing:.08em;border:1px solid var(--hairline-b);border-radius:var(--radius-pill);
  padding:.35rem .8rem;background:var(--card)}