/* ============================================================
   OMNIWARGA — token bersama (font + desain token dunia "MADING RT")
   Dipakai main.css (landing), app.css (pengurus), warga.css (warga).
   ============================================================ */

@font-face {
  font-family: 'Anton';
  src: url('/assets/fonts/anton.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Public Sans';
  src: url('/assets/fonts/public-sans.woff2') format('woff2');
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Spline Sans Mono';
  src: url('/assets/fonts/spline-sans-mono.woff2') format('woff2');
  font-weight: 300 700;
  font-style: normal;
  font-display: swap;
}

:root {
  /* tanah */
  --wall: #12362e;
  --wall-deep: #0c2822;
  --felt: #17453a;
  --felt-deep: #123c31;
  --wood: #77543a;
  --wood-dark: #573b25;
  --wood-light: #93684a;

  /* kertas */
  --paper: #f7f0de;
  --paper-edge: #e6dabd;
  --paper-deep: #efe7cf;
  --panel: #fffdf6;
  --btn-text: #fff6e8;
  --ink: #262117;
  --ink-soft: #6b6250;

  /* tinta terang di dinding */
  --cream: #f0e9d6;
  --cream-70: rgba(240, 233, 214, 0.72);
  --line-on-wall: rgba(240, 233, 214, 0.16);

  /* kode seri pilar */
  --red: #b23a2e;
  --red-deep: #8e2b21;
  --blue: #2e5a9e;
  --blue-deep: #24477c;
  --blue-tint: #f0f4fa;
  --blue-edge: #c6d4e8;
  --amber: #b57317;
  --amber-deep: #8f5a10;
  --gold: #8f6e12;
  --gold-deep: #876a10; /* emas cetak untuk teks kecil di atas kertas (AA ≥4.5:1) */
  --gold-light: #ffcf87;
  --gold-mid: #d9a83f;
  --pin-light: #d96a58;
  --green: #3d7048;
  --green-deep: #2f593a;
  --orange: #a8541c;

  --shadow-soft: 0 1px 2px rgba(10, 26, 22, 0.3), 0 12px 28px -14px rgba(10, 26, 22, 0.55);
  --shadow-lift: 0 2px 4px rgba(10, 26, 22, 0.3), 0 18px 40px -16px rgba(10, 26, 22, 0.6);

  --font-display: 'Anton', 'Arial Narrow', sans-serif;
  --font-body: 'Public Sans', system-ui, sans-serif;
  --font-mono: 'Spline Sans Mono', ui-monospace, monospace;

  --sp: clamp(84px, 11vw, 150px);
}