/* =====================================================================
   Paiva Care · COURT MODERN — the one design system for site, Blueprints and app.
   The personality of the site (paper, ink, clay for action, mono labels) with the calm of the app
   (soft corners, thin borders, room to breathe, a dark mode in brand colours).
   Versioned file name on purpose: /assets/* is cached for a year. Change → new file (court-modern-v2.css).
   Approved board: https://claude.ai/artifact/Yb7ygfyfhXannE8vbbQmvf
   Rules: border 1.5px ink · corners 12 (fields) / 18 (cards) / pill (buttons, chips) ·
          ONE hard shadow per screen (the main action) · spacing in steps of 4 · touch targets ≥ 48px.
   Fonts are self-hosted (latin subset) so nothing depends on Google at runtime.
   ===================================================================== */
@font-face{font-family:'Bricolage Grotesque';font-style:normal;font-weight:400 800;font-stretch:100%;font-display:swap;src:url("/assets/f-572fb8d7.woff2") format('woff2');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:'Instrument Sans';font-style:normal;font-weight:400 700;font-stretch:100%;font-display:swap;src:url("/assets/f-a5979813.woff2") format('woff2');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:'Instrument Sans';font-style:italic;font-weight:400;font-stretch:100%;font-display:swap;src:url("/assets/f-b9403d28.woff2") format('woff2');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:'IBM Plex Mono';font-style:normal;font-weight:400;font-display:swap;src:url("/assets/f-0ae1bd15.woff2") format('woff2');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:'IBM Plex Mono';font-style:normal;font-weight:500;font-display:swap;src:url("/assets/f-51e39bf9.woff2") format('woff2');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:'IBM Plex Mono';font-style:normal;font-weight:600;font-display:swap;src:url("/assets/f-49023eb2.woff2") format('woff2');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}

:root{
  /* light (default) */
  --cm-paper:#F6F0E4; --cm-card:#FFFCF5; --cm-ink:#18221E; --cm-ink-soft:#43514B; --cm-muted:#5B6A63;
  --cm-line:#18221E; --cm-hair:#D8CFBF; --cm-track:#E6DDCC;
  --cm-teal:#0F7E84; --cm-teal-deep:#0B5F63; --cm-mint:#D9EBE7; --cm-mint-ink:#0B5F63;
  --cm-clay:#D95B2B; --cm-clay-deep:#B8461C; --cm-sun:#E8A33D; --cm-on-accent:#FFFCF5;
  --cm-hero:#18221E; --cm-hero-ink:#F3EEE3; --cm-hero-soft:#C9D3CE; --cm-hero-kicker:#F2B65A;
  /* shape */
  --cm-r-sm:12px; --cm-r:18px; --cm-r-lg:22px; --cm-pill:999px; --cm-bw:1.5px;
  --cm-shadow:4px 4px 0 var(--cm-ink); --cm-shadow-clay:4px 4px 0 var(--cm-clay);
  /* type */
  --cm-display:'Bricolage Grotesque',system-ui,sans-serif; --cm-body:'Instrument Sans',system-ui,sans-serif; --cm-mono:'IBM Plex Mono',ui-monospace,monospace;
  /* space (steps of 4) */
  --cm-1:4px; --cm-2:8px; --cm-3:12px; --cm-4:16px; --cm-6:24px; --cm-8:32px; --cm-12:48px; --cm-18:72px;
  --cm-touch:48px;
}
/* dark — opt in with data-theme="dark" on <html>, or follow the phone with data-theme="auto" */
:root[data-theme="dark"]{
  --cm-paper:#101715; --cm-card:#18221E; --cm-ink:#F3EEE3; --cm-ink-soft:#C9D3CE; --cm-muted:#A9B8B1;
  --cm-line:#34453E; --cm-hair:#26352F; --cm-track:#26352F;
  --cm-teal:#3FB8B0; --cm-teal-deep:#9FE3DA; --cm-mint:#1F3B37; --cm-mint-ink:#9FE3DA;
  --cm-clay:#F07A45; --cm-clay-deep:#F59A6E; --cm-sun:#F2B65A; --cm-on-accent:#101715;
  --cm-hero:#F3EEE3; --cm-hero-ink:#18221E; --cm-hero-soft:#43514B; --cm-hero-kicker:#B8461C;
  --cm-shadow:4px 4px 0 #3FB8B0; --cm-shadow-clay:4px 4px 0 #3FB8B0;
}
@media (prefers-color-scheme:dark){
  :root[data-theme="auto"]{
    --cm-paper:#101715; --cm-card:#18221E; --cm-ink:#F3EEE3; --cm-ink-soft:#C9D3CE; --cm-muted:#A9B8B1;
    --cm-line:#34453E; --cm-hair:#26352F; --cm-track:#26352F;
    --cm-teal:#3FB8B0; --cm-teal-deep:#9FE3DA; --cm-mint:#1F3B37; --cm-mint-ink:#9FE3DA;
    --cm-clay:#F07A45; --cm-clay-deep:#F59A6E; --cm-sun:#F2B65A; --cm-on-accent:#101715;
    --cm-hero:#F3EEE3; --cm-hero-ink:#18221E; --cm-hero-soft:#43514B; --cm-hero-kicker:#B8461C;
    --cm-shadow:4px 4px 0 #3FB8B0; --cm-shadow-clay:4px 4px 0 #3FB8B0;
  }
}

/* ---- reusable pieces (prefixed, so they never collide with older page CSS) ---- */
.cm-kicker{font-family:var(--cm-mono);font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--cm-teal-deep);font-weight:600}
.cm-display{font-family:var(--cm-display);font-weight:800;letter-spacing:-.02em;line-height:.95}
.cm-card{background:var(--cm-card);border:var(--cm-bw) solid var(--cm-line);border-radius:var(--cm-r);padding:var(--cm-4)}
.cm-hero{background:var(--cm-hero);color:var(--cm-hero-ink);border-radius:var(--cm-r);padding:var(--cm-6);box-shadow:var(--cm-shadow-clay)}
.cm-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:var(--cm-touch);padding:14px 24px;border-radius:var(--cm-pill);border:var(--cm-bw) solid var(--cm-line);font-family:var(--cm-display);font-weight:700;font-size:16px;text-decoration:none;cursor:pointer;background:var(--cm-card);color:var(--cm-ink)}
.cm-btn.primary{background:var(--cm-clay);color:var(--cm-on-accent);box-shadow:var(--cm-shadow)}
.cm-btn.ink{background:var(--cm-ink);color:var(--cm-paper);border-color:var(--cm-ink)}
.cm-chip{display:inline-flex;align-items:center;font-family:var(--cm-mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;border-radius:var(--cm-pill);padding:5px 10px;background:var(--cm-mint);color:var(--cm-mint-ink)}
.cm-field{width:100%;min-height:var(--cm-touch);border:var(--cm-bw) solid var(--cm-line);border-radius:var(--cm-r-sm);background:var(--cm-paper);color:var(--cm-ink);padding:12px 14px;font:inherit}
.cm-field:focus{outline:none;border-color:var(--cm-teal);box-shadow:0 0 0 3px var(--cm-mint)}