/* Tokens y base compartidos por la web pública y la gestión. */
:root {
  color-scheme: light;
  --bg: #f4f6f3;
  --surface: #ffffff;
  --ink: #1c211e;
  --muted: #5a665f;
  --line: #dde3de;
  --accent: #1f6f54;
  --accent-ink: #ffffff;
  --bubble: #dcf3e4;
  --bubble-ink: #17281f;
  --warn-bg: #fff1c9;
  --warn-ink: #5a4300;
  --bad: #b3261e;
  --font: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}
@media (prefers-color-scheme: dark) {
  :root {
    color-scheme: dark;
    --bg: #141a17; --surface: #1c2420; --ink: #e9efeb; --muted: #9fb0a6; --line: #2e3a33;
    --accent: #7fd3ae; --accent-ink: #0e1a14; --bubble: #1f3a2d; --bubble-ink: #dcf3e4;
    --warn-bg: #3a3010; --warn-ink: #ffe08a; --bad: #ffb4ab;
  }
}
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--bg); color: var(--ink); font-family: var(--font); font-size: 17px; line-height: 1.5; }
img { max-width: 100%; }
[hidden] { display: none !important; }
:focus-visible { outline: 3px solid var(--accent); outline-offset: 2px; }
.wrap {
  max-width: 680px; margin-inline: auto;
  padding-left: max(16px, env(safe-area-inset-left, 0px));
  padding-right: max(16px, env(safe-area-inset-right, 0px));
}
.boton {
  display: flex; align-items: center; justify-content: center; min-height: 50px; padding: 0 20px;
  background: var(--accent); color: var(--accent-ink); border: 0; border-radius: 10px;
  font: 700 17px/1.1 var(--font); text-decoration: none; cursor: pointer;
}
.boton:disabled { opacity: 0.6; cursor: default; }
.copiar {
  min-height: 40px; padding: 0 12px; background: transparent; color: var(--ink);
  border: 1px solid var(--line); border-radius: 8px; font: 500 15px/1 var(--font); cursor: pointer;
}