/* Merci UI kit, 2026-10-18.
   Matt: "less like an AI website and more professional... buttons should have
   shadows... avoid pills... beautiful... some won't print color so if something
   is red also make text different or bold."
   Fonts are self-hosted (no Google requests): Inter for text, Fraunces for display.
   Load this before a page's own <style>; page rules may build on these tokens. */

@font-face{font-family:"Inter";src:url("/static/fonts/inter-latin-wght-normal.woff2") format("woff2");font-weight:100 900;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Inter";src:url("/static/fonts/inter-latin-ext-wght-normal.woff2") format("woff2");font-weight:100 900;font-display:swap;unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Fraunces";src:url("/static/fonts/fraunces-latin-wght-normal.woff2") format("woff2");font-weight:100 900;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Fraunces";src:url("/static/fonts/fraunces-latin-ext-wght-normal.woff2") format("woff2");font-weight:100 900;font-display:swap;unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}

:root{
  /* brand */
  --m-red:#a6192e; --m-red-dark:#7e1322; --m-red-tint:#a6192e0f;
  --m-cream:#f6f1e7; --m-paper:#fffdf9; --m-paper-2:#faf6ee;
  --m-ink:#1b1d1a; --m-ink-2:#3d3f39; --m-dim:#6b6457; --m-line:#e7dfcf; --m-line-2:#d9cfbb;
  --m-amber:#a85a0c; --m-green:#11704a; --m-blue:#2e5a87;
  /* type */
  --m-sans:"Inter",-apple-system,"Segoe UI",Roboto,sans-serif;
  --m-display:"Fraunces",Georgia,"Times New Roman",serif;
  /* depth: soft, layered, never a hard offset */
  --m-shadow-1:0 1px 2px rgba(40,30,15,.06),0 1px 1px rgba(40,30,15,.04);
  --m-shadow-2:0 1px 2px rgba(40,30,15,.06),0 4px 12px rgba(40,30,15,.07);
  --m-shadow-3:0 2px 4px rgba(40,30,15,.06),0 12px 32px rgba(40,30,15,.10);
  --m-radius:10px; --m-radius-sm:6px;
}

/* type */
.m-type, .m-type body{font-family:var(--m-sans);font-feature-settings:"cv11","ss01";-webkit-font-smoothing:antialiased;color:var(--m-ink)}
.m-display{font-family:var(--m-display);font-optical-sizing:auto;font-weight:600;letter-spacing:-.015em}
.m-num{font-variant-numeric:tabular-nums}

/* buttons: rectangles with real depth. No pills. */
.m-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font:600 15px/1 var(--m-sans);
  padding:13px 22px;border-radius:var(--m-radius);border:1px solid transparent;cursor:pointer;text-decoration:none;
  transition:transform .12s ease,box-shadow .12s ease,background .12s ease;white-space:nowrap}
.m-btn:active{transform:translateY(1px)}
.m-btn:focus-visible{outline:3px solid #a6192e55;outline-offset:2px}
.m-btn-primary{background:linear-gradient(180deg,#b51d34,var(--m-red));color:#fff;border-color:var(--m-red-dark);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.18),0 1px 2px rgba(126,19,34,.3),0 6px 16px rgba(126,19,34,.22)}
.m-btn-primary:hover{box-shadow:inset 0 1px 0 rgba(255,255,255,.18),0 2px 4px rgba(126,19,34,.3),0 10px 24px rgba(126,19,34,.28);transform:translateY(-1px)}
.m-btn-secondary{background:var(--m-paper);color:var(--m-ink);border-color:var(--m-line-2);box-shadow:var(--m-shadow-2)}
.m-btn-secondary:hover{box-shadow:var(--m-shadow-3);transform:translateY(-1px);border-color:#cbbfa6}
.m-btn-quiet{background:transparent;color:var(--m-red);padding:13px 6px;box-shadow:none}
.m-btn-quiet:hover{text-decoration:underline;text-underline-offset:3px}
.m-btn-sm{font-size:13.5px;padding:9px 14px;border-radius:8px}

/* tags: small, square-cornered labels (not pills) */
.m-tag{display:inline-flex;align-items:center;gap:6px;font:600 11.5px/1 var(--m-sans);letter-spacing:.02em;
  padding:5px 8px;border-radius:4px;border:1px solid var(--m-line-2);background:var(--m-paper);color:var(--m-ink-2)}
.m-tag-red{color:var(--m-red);border-color:#a6192e40;background:var(--m-red-tint)}
.m-tag-green{color:var(--m-green);border-color:#11704a40;background:#11704a0d}
.m-tag-amber{color:var(--m-amber);border-color:#a85a0c40;background:#a85a0c0d}

/* cards */
.m-card{background:var(--m-paper);border:1px solid var(--m-line);border-radius:12px;box-shadow:var(--m-shadow-1)}
.m-card-raised{box-shadow:var(--m-shadow-3)}

/* Emphasis that survives black-and-white printing: never color alone.
   .m-urgent = bold + a marker + color. .m-note = italic + a marker. */
.m-urgent{color:var(--m-red);font-weight:700}
.m-urgent::before{content:"▶ ";font-size:.8em}
.m-note{font-style:italic}
@media print{
  .m-btn{box-shadow:none!important}
  .m-urgent{color:#000!important;text-decoration:underline}
}