/* Dosar — design tokens (shared by site + app) */
:root {
  --paper: #F3EFE6;
  --paper-2: #EAE5D8;
  --card: #FFFDF8;
  --ink: #14130F;
  --ink-2: #45423A;
  --ink-3: #87826F;
  --ink-4: #B5AF9C;
  --line: #DDD7C7;
  --line-2: #E8E3D6;

  --marker: #DCFF4A;      /* brand accent — highlighter */
  --marker-ink: #2A3300;

  --ok: #17784A;      --ok-bg: #E2F1E6;
  --warn: #A86A07;    --warn-bg: #FBEFD6;
  --bad: #BE3A1E;     --bad-bg: #F8E1D9;
  --info: #2C55C2;    --info-bg: #E2E8F8;

  --serif: "Instrument Serif", "Times New Roman", serif;
  --sans: "Geist", ui-sans-serif, system-ui, -apple-system, sans-serif;
  --mono: "Geist Mono", ui-monospace, "SF Mono", Menlo, monospace;

  --r-sm: 6px;
  --r: 10px;
  --r-lg: 16px;
  --shadow-1: 0 1px 0 rgba(20,19,15,.04), 0 1px 2px rgba(20,19,15,.06);
  --shadow-2: 0 1px 0 rgba(20,19,15,.04), 0 8px 24px -8px rgba(20,19,15,.16);
  --shadow-3: 0 30px 80px -20px rgba(20,19,15,.35), 0 0 0 1px rgba(20,19,15,.06);
  --ease: cubic-bezier(.2,.7,.1,1);
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font-family: var(--sans);
  font-size: 15px;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
  font-feature-settings: "ss01", "cv11";
}
img, svg { display: block; }
button { font: inherit; color: inherit; cursor: pointer; }
a { color: inherit; }
.mono, .num { font-family: var(--mono); font-feature-settings: "tnum", "zero"; letter-spacing: -0.01em; }
.serif { font-family: var(--serif); font-weight: 400; }
mark, .mk { background: linear-gradient(transparent 12%, var(--marker) 12%, var(--marker) 88%, transparent 88%); color: inherit; padding: 0 .08em; }

/* thermal receipt — shared visual */
.receipt {
  --w: 248px;
  width: var(--w);
  background: #FFFEFA;
  color: #2a2924;
  font-family: var(--mono);
  font-size: 11.5px;
  line-height: 1.55;
  padding: 18px 18px 26px;
  position: relative;
  box-shadow: 0 1px 0 rgba(0,0,0,.04), 0 18px 40px -16px rgba(20,19,15,.35);
  -webkit-mask: conic-gradient(from -45deg at bottom, #0000, #000 1deg 89deg, #0000 90deg) 50% / 10px 100%;
          mask: conic-gradient(from -45deg at bottom, #0000, #000 1deg 89deg, #0000 90deg) 50% / 10px 100%;
}
.receipt .r-c { text-align: center; }
.receipt .r-b { font-weight: 600; }
.receipt .r-sep { border-top: 1px dashed #bdb8a8; margin: 8px 0; }
.receipt .r-row { display: flex; justify-content: space-between; gap: 8px; }
.receipt .r-big { font-size: 15px; font-weight: 600; }
.receipt .r-muted { color: #8b8778; }
.receipt .r-hl { background: var(--marker); outline: 2px solid var(--marker); }
.receipt .r-bar { height: 26px; margin-top: 10px; background: repeating-linear-gradient(90deg, #2a2924 0 2px, transparent 2px 3px, #2a2924 3px 4px, transparent 4px 7px, #2a2924 7px 8px, transparent 8px 9px); opacity: .8; }