/* Shared tokens + resets, reused across stall/poster/scan pages.
   Colour tokens borrowed from reference/ui-mockup.html so the lightweight
   Phase 1 pages feel like the same product. */
:root {
  --bg: #FBF3F4;
  --surface: #FFFFFF;
  --ink: #2A1418;
  --muted: #7A6468;
  --line: #EAD8DB;
  --red: #B3121F;
  --red-deep: #7E0B15;
  --gold: #F2B705;
  --gold-soft: #FFE39A;
  --paper: #FCEBEF;
  --sold: #B9AEB0;
  --display: "Chonburi", "Bai Jamjuree", "Leelawadee UI", Tahoma, serif;
  --body: "Bai Jamjuree", "Leelawadee UI", "Thonburi", Tahoma, sans-serif;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --bg: #170A0C; --surface: #241114; --ink: #F7ECEE; --muted: #B89EA3;
    --line: #3D2227; --red: #D92A38; --red-deep: #5E0810; --sold: #6E5C60;
  }
}
:root[data-theme="dark"] {
  --bg: #170A0C; --surface: #241114; --ink: #F7ECEE; --muted: #B89EA3;
  --line: #3D2227; --red: #D92A38; --red-deep: #5E0810; --sold: #6E5C60;
}
*, *::before, *::after { box-sizing: border-box; }
html { scroll-padding-top: env(safe-area-inset-top, 0px); }
body {
  margin: 0;
  background: var(--bg);
  color: var(--ink);
  font-family: var(--body);
  font-size: 16px;
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
  padding-top: env(safe-area-inset-top, 0px);
  padding-bottom: env(safe-area-inset-bottom, 0px);
}
button, input, select { font: inherit; color: inherit; }
button { cursor: pointer; }
:focus-visible { outline: 3px solid var(--gold); outline-offset: 2px; }
.app { max-width: 480px; margin: 0 auto; }
a { color: var(--red); }

.brand { font-family: var(--display); font-size: 20px; color: var(--red); margin: 0; }

.btn {
  display: block; width: 100%; border: 0; border-radius: 12px; padding: 14px;
  font-size: 16px; font-weight: 700; text-align: center;
}
.btn-main { background: var(--red); color: #fff; }
.btn-gold { background: var(--gold); color: #2A1418; }
.btn-plain { background: none; border: 2px solid var(--line); color: var(--ink); }
.btn:disabled { opacity: .5; cursor: default; }

.notice {
  font-size: 13px; color: var(--muted); text-align: center; padding: 10px 18px; margin: 0;
}

.error-state {
  padding: 60px 24px; text-align: center; color: var(--muted);
}
.error-state b { display: block; color: var(--ink); font-size: 18px; margin-bottom: 6px; }