:root {
  --rb-bg: #0f1020;
  --rb-panel: #1a1b33;
  --rb-accent: #6c5ce7;
  --rb-accent-2: #00d1b2;
  --rb-text: #1a1a2e;
  --rb-muted: #6b7280;
  --rb-border: #e5e7eb;
  --rb-danger: #e74c3c;
  --rb-ok: #16a34a;
}

html { font-size: 16px; }
body {
  font-family: "Segoe UI", system-ui, -apple-system, Arial, sans-serif;
  color: var(--rb-text);
  background: #f4f5fb;
  margin: 0;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}

.rb-header {
  background: linear-gradient(90deg, var(--rb-bg), #23244a);
  color: #fff;
}
.rb-brand { color: #fff; font-weight: 700; font-size: 1.15rem; text-decoration: none; }
.rb-brand:hover { color: #fff; opacity: .9; }
.rb-adminnav a {
  color: #cfd0ec; text-decoration: none; margin-left: 1rem; font-size: .95rem;
}
.rb-adminnav a:hover { color: #fff; }

.rb-main { flex: 1; padding: 1.5rem 0 2.5rem; }
.rb-footer { background: #fff; border-top: 1px solid var(--rb-border); color: var(--rb-muted); padding: 1rem 0; font-size: .85rem; }

/* Cards / panels */
.rb-card {
  background: #fff;
  border: 1px solid var(--rb-border);
  border-radius: 16px;
  padding: 1.5rem;
  box-shadow: 0 6px 24px rgba(20, 20, 60, .06);
  max-width: 560px;
  margin: 0 auto;
}
.rb-card--wide { max-width: 960px; }

h1, h2 { color: var(--rb-text); font-weight: 700; }
.rb-lead { color: var(--rb-muted); }

/* Forms */
.form-label { font-weight: 600; }
.form-control, .form-select { padding: .7rem .9rem; font-size: 1.05rem; border-radius: 10px; }
.btn { border-radius: 10px; padding: .7rem 1.2rem; font-weight: 600; font-size: 1.05rem; }
.btn-primary { background: var(--rb-accent); border-color: var(--rb-accent); }
.btn-primary:hover { background: #5a4bd1; border-color: #5a4bd1; }
.btn-accent { background: var(--rb-accent-2); border-color: var(--rb-accent-2); color:#062f28; }
.btn-block { display: block; width: 100%; }

/* OTP code entry */
.rb-otp { letter-spacing: .5rem; font-size: 2rem; text-align: center; font-weight: 700; }

/* Claim code + QR confirmation */
.rb-claim {
  font-size: 2.4rem; font-weight: 800; letter-spacing: .15rem;
  color: var(--rb-accent); text-align: center; margin: .25rem 0 1rem;
}
.rb-qr { max-width: 240px; margin: 0 auto; }
.rb-qr svg { width: 100%; height: auto; display: block; }

.rb-times { list-style: none; padding: 0; display: flex; gap: .5rem; flex-wrap: wrap; justify-content: center; }
.rb-times li { background: #eef0fb; color: var(--rb-accent); font-weight: 700; padding: .4rem .9rem; border-radius: 999px; }

/* Badges + tables (admin) */
.rb-pill { display:inline-block; padding:.15rem .6rem; border-radius:999px; font-size:.8rem; font-weight:700; }
.rb-pill--ok { background:#dcfce7; color: var(--rb-ok); }
.rb-pill--wait { background:#fef3c7; color:#92400e; }
.rb-pill--won { background:#ede9fe; color: var(--rb-accent); }
.rb-stat { display:flex; gap:1rem; flex-wrap:wrap; margin-bottom:1rem; }
.rb-stat .rb-card { flex:1; min-width:150px; text-align:center; padding:1rem; }
.rb-stat .n { font-size:2rem; font-weight:800; }
table.rb-table { width:100%; border-collapse:collapse; }
table.rb-table th, table.rb-table td { text-align:left; padding:.6rem .5rem; border-bottom:1px solid var(--rb-border); }
table.rb-table th { color: var(--rb-muted); font-size:.85rem; text-transform:uppercase; letter-spacing:.03em; }

.rb-alert { padding:.8rem 1rem; border-radius:10px; margin-bottom:1rem; }
.rb-alert--err { background:#fee2e2; color:#991b1b; }
.rb-alert--ok { background:#dcfce7; color:#14532d; }

/* Winner splash */
.rb-winner { text-align:center; padding:2rem 1rem; }
.rb-winner .name { font-size:2.6rem; font-weight:800; color: var(--rb-accent); }
.rb-winner .prize { font-size:1.2rem; color: var(--rb-muted); }

/* Printable slips */
@media print {
  .rb-header, .rb-footer, .rb-noprint { display: none !important; }
  body { background: #fff; }
  .rb-slip { page-break-inside: avoid; border:1px dashed #999; }
}
.rb-slips { display:grid; grid-template-columns: 1fr 1fr; gap:.5rem; }
.rb-slip { border:1px dashed #bbb; border-radius:8px; padding:1rem; min-height:150px; }
.rb-slip .line { border-bottom:1px solid #ccc; height:1.8rem; margin-top:.6rem; }
