/* Rentaparty Photobooth — shared brand tokens */
:root {
  --navy: #262262;
  --navy-deep: #1c1a4a;
  --ink: #14122e;
  --red: #ED1C24;
  --orange: #F7A83C;
  --grey: #707070;
  --lilac: #c9c7e6;
  --paper: #f7f6f2;
  --line: #e7e5ee;
  --ok: #17784a; --ok-bg: #e3f5ec;
  --warn: #9a5a00; --warn-bg: #fff0d9;
  --bad: #c4141b; --bad-bg: #fde4e5;
  --slab: 'Roboto Slab', Georgia, serif;
  --sans: 'Roboto', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --mono: 'Roboto Mono', ui-monospace, Menlo, monospace;
}
* { box-sizing: border-box; }
html, body { margin: 0; }
body { font-family: var(--sans); color: var(--navy); -webkit-font-smoothing: antialiased; }
a { color: inherit; }
button { font: inherit; color: inherit; cursor: pointer; border: 0; background: none; }
img, video { display: block; max-width: 100%; }
.slab { font-family: var(--slab); font-weight: 800; }
.mono { font-family: var(--mono); }
.pill-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  border-radius: 999px; font-weight: 700; text-decoration: none; white-space: nowrap;
  transition: transform .08s ease, filter .15s ease, opacity .2s ease;
}
.pill-btn:active { transform: scale(.97); }
.pill-btn:hover { filter: brightness(1.07); }
.pill-btn[disabled], .pill-btn.is-disabled { opacity: .35; pointer-events: none; }
.btn-red { background: var(--red); color: #fff; }
.btn-white { background: #fff; color: var(--navy); }
.btn-navy { background: var(--navy); color: #fff; }
.logo-chip { background: #fff; display: inline-flex; align-items: center; border-radius: 16px; padding: 0 12px; height: 32px; }
.logo-chip img { height: 17px; width: auto; }
.lang-toggle { font-size: 13px; font-weight: 700; letter-spacing: .06em; }
.lang-toggle button { padding: 6px 2px; opacity: .55; }
.lang-toggle button[aria-pressed="true"] { opacity: 1; }
.dots { display: flex; gap: 10px; }
.dots span { width: 16px; height: 16px; border-radius: 50%; animation: pulse 1.2s infinite ease-in-out; }
.dots span:nth-child(1) { background: var(--red); }
.dots span:nth-child(2) { background: var(--orange); animation-delay: .2s; }
.dots span:nth-child(3) { background: rgba(255,255,255,.35); animation-delay: .4s; }
@keyframes pulse { 0%, 100% { transform: scale(.75); opacity: .6; } 40% { transform: scale(1.1); opacity: 1; } }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
@media (prefers-reduced-motion: reduce) { .dots span { animation: none; } }