/* ---------------------------------------------------------------------------
   base.css — hand written. Reset, interaction states, overlays, toasts.
   Never regenerated: _tools/gen.py only ever writes css/figma.css.
   Loaded AFTER figma.css, but generated rules are single classes, so anything
   here that must win uses a two-token selector or a state class.
--------------------------------------------------------------------------- */

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; background: #050505; color: #f1efe5;
       font-family: 'Geist', system-ui, -apple-system, sans-serif;
       -webkit-font-smoothing: antialiased; }
img, svg { display: block; max-width: 100%; }
h1, h2, h3, h4, p, figure, blockquote { margin: 0; }
ul, ol { margin: 0; padding: 0; list-style: none; }

/* the page frames are absolute-width designs: never let them force h-scroll */
body { overflow-x: hidden; }

/* --- controls -------------------------------------------------------------- */
button, input, select, textarea { font: inherit; color: inherit; margin: 0; }
button { background: none; border: 0; text-align: inherit; }
button, [role="switch"], [role="checkbox"], .lnk, a, .st-item, .faq-trigger.is-toggleable,
.chip, .odds-btn { cursor: pointer; }
a { color: inherit; text-decoration: none; }
a:hover, .lnk:hover { text-decoration: none; }

.fig-ctl {
  appearance: none; -webkit-appearance: none;
  background: transparent; border: 0; outline: 0; padding: 0;
  width: 100%; min-width: 0;
}
textarea.fig-ctl { resize: vertical; height: 100%; min-height: 100%; }
select.fig-ctl { cursor: pointer; }
.fig-ctl::placeholder { color: currentColor; opacity: 1; }
/* outline, not box-shadow: the field's own border comes from figma.css and a
   box-shadow here would replace it rather than add to it */
.fig-field:focus-within { outline: 2px solid #ff3514; outline-offset: -1px; }
.fig-field.has-error { outline: 1.5px solid #ff3514; outline-offset: -1px; }
.cbox.has-error { outline: 1.5px solid #ff3514; outline-offset: 2px; }

.field-error {
  display: block; margin-top: 6px;
  font: 700 11px/1.3 'Geist', system-ui, sans-serif;
  letter-spacing: .04em; text-transform: uppercase; color: #ff3514;
}

/* --- focus visibility ------------------------------------------------------ */
:focus-visible { outline: 2px solid #ff3514; outline-offset: 2px; }

/* --- hover affordances (design has no hover art; keep it restrained) ------- */
.btn:hover, button.lnk:hover { filter: brightness(1.08); }
.st-item:hover:not(.is-active) { filter: brightness(1.25); }
.odds-btn:hover { filter: brightness(1.12); }
a.lnk:hover > span { text-decoration: underline; text-underline-offset: 2px; }
.btn:active, .st-item:active, .odds-btn:active { transform: translateY(1px); }
.btn, .st-item, .odds-btn, .toggle, .cbox, .fig-field { transition: filter .12s, box-shadow .12s, background-color .12s; }

/* --- checkbox / toggle ----------------------------------------------------- */
.cbox .cbox-tick { visibility: hidden; }
.cbox.is-checked .cbox-tick { visibility: visible; }
.toggle { position: relative; }
.toggle .toggle-knob { transition: none; }

/* --- selected odds --------------------------------------------------------- */
.odds-btn.is-selected { outline: 2px solid #ff3514; outline-offset: -2px; }

/* --- accordion ------------------------------------------------------------- */
.faq-body { display: none; }
.faq-row.is-open .faq-body { display: flex; }
.faq-icon-minus { display: none; }
.faq-row.is-open .faq-icon-minus { display: block; }
.faq-row.is-open .faq-icon-plus { display: none; }

/* --- generic show / hide helpers ------------------------------------------ */
.is-hidden { display: none !important; }

/* --- overlays -------------------------------------------------------------- */
.ov-host { position: static; }
.ov {
  position: fixed; inset: 0; z-index: 1000;
  overflow-y: auto; overscroll-behavior: contain;
}
.ov[hidden] { display: none; }
.ov .v-desktop > div, .ov .v-mobile > div { min-height: 100dvh; }
body.ov-open { overflow: hidden; }

/* the cookie panel sits at the bottom of the viewport, not full bleed */
#ov-cookie-consent .v-desktop > div, #ov-cookie-consent .v-mobile > div {
  display: flex; flex-direction: column; justify-content: flex-end;
}

/* --- toasts ---------------------------------------------------------------- */
.toast-host {
  position: fixed; z-index: 2000; right: 24px; bottom: 24px;
  display: flex; flex-direction: column; gap: 10px;
  max-width: min(380px, calc(100vw - 32px)); pointer-events: none;
}
.toast {
  pointer-events: auto;
  background: #141414; color: #f1efe5;
  border-radius: 6px; padding: 14px 16px;
  box-shadow: inset 0 0 0 1px #262624, 0 8px 24px rgba(0,0,0,.5);
  font: 400 14px/1.45 'Geist', system-ui, sans-serif;
  animation: toast-in .18s ease-out;
}
.toast strong {
  display: block; margin-bottom: 4px;
  font: 800 11px/1.3 'Geist', system-ui, sans-serif;
  letter-spacing: .08em; text-transform: uppercase; color: #ff3514;
}
.toast.is-ok strong { color: #10b981; }
.toast.is-err strong { color: #ff3514; }
.toast .demo-tag {
  display: inline-block; margin-left: 6px; padding: 1px 5px;
  border-radius: 3px; background: #ff3514; color: #f1efe5;
  font: 800 9px/1.4 'Geist', sans-serif; letter-spacing: .1em; vertical-align: 1px;
}
@keyframes toast-in { from { opacity: 0; transform: translateY(8px); } }
@media (prefers-reduced-motion: reduce) {
  .toast { animation: none; }
  * { transition: none !important; }
}

@media (max-width: 899px) { .toast-host { right: 12px; left: 12px; bottom: 12px; } }

/* --- inline deposit-limit editor (built by app.js from design components) --- */
.limit-editor[hidden] { display: none; }
.limit-editor { display: flex; flex-direction: column; gap: 16px; width: 100%; }
.limit-editor-row { display: flex; gap: 12px; }
.limit-editor-row > * { flex: 1 1 0; }

/* --- account chip in the header (session state, see README) ---------------- */
.acct-name { white-space: nowrap; }

/* --- print ---------------------------------------------------------------- */
@media print { .ov, .toast-host { display: none !important; } }