@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=JetBrains+Mono:wght@400;600&display=swap');

/* ── Tokens ──────────────────────────────────────────── */
:root {
  --bg:           #f4f4f5; /* zinc-100 */
  --surface:      #ffffff;
  --surface-hover:#e4e4e7; /* zinc-200 */
  --border:       #d4d4d8; /* zinc-300 */
  --border-focus: #71717a; /* zinc-500 */
  --text:         #09090b; /* zinc-950 */
  --text-muted:   #71717a; /* zinc-500 */
  --radius:       4px;

  --btn-primary-bg: var(--text);
  --btn-primary-text: var(--bg);
  --btn-primary-hover-bg: #27272a;

  --danger-text: #dc2626;
  --danger-border: #f87171;
  --danger-bg: #fef2f2;
  --danger-hover-bg: #fee2e2;
  --danger-hover-border: #fca5a5;

  --modal-bg: rgba(255,255,255,0.9);
}

[data-theme="dark"] {
  --bg:           #09090b;
  --surface:      #18181b;
  --surface-hover:#27272a;
  --border:       #27272a;
  --border-focus: #52525b;
  --text:         #fafafa;
  --text-muted:   #a1a1aa;

  --btn-primary-hover-bg: #d4d4d8;

  --danger-text: #f87171;
  --danger-border: #7f1d1d;
  --danger-bg: transparent;
  --danger-hover-bg: #7f1d1d;
  --danger-hover-border: #fca5a5;

  --modal-bg: rgba(0,0,0,0.85);
}

/* ── Reset ───────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; }
body {
  margin: 0;
  background: var(--bg);
  color: var(--text);
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
  font-size: 14px;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
}
a { color: var(--text); text-decoration: underline; text-underline-offset: 4px; }
a:hover { color: var(--text-muted); }
ul, ol { padding: 0; margin: 0; list-style: none; }

/* ── Typography ──────────────────────────────────────── */
.h1 {
  font-size: 24px;
  font-weight: 600;
  letter-spacing: -0.02em;
  margin: 0 0 8px;
}
.h2 {
  font-size: 18px;
  font-weight: 500;
  letter-spacing: -0.01em;
  margin: 0 0 16px;
}
.eyebrow {
  font-family: 'JetBrains Mono', monospace;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--text-muted);
  margin: 0 0 8px;
}
.muted { color: var(--text-muted); }
.small { font-size: 13px; }
.mono { font-family: 'JetBrains Mono', monospace; }

/* ── Layout ──────────────────────────────────────────── */
.container {
  max-width: 960px;
  margin: 0 auto;
  padding: 48px 24px;
}

.auth-layout {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-height: 100vh;
  padding: 24px;
}
.auth-layout > .card, .auth-layout > form {
  width: 100%;
  max-width: 400px;
  margin: 0;
}

/* ── PIN digit boxes ─────────────────────────────────── */
.pin-boxes {
  display: flex;
  gap: 10px;
  justify-content: center;
  margin-bottom: 20px;
}
.pin-digit {
  width: 56px;
  height: 60px;
  text-align: center;
  font-size: 22px;
  font-family: 'JetBrains Mono', monospace;
  font-weight: 600;
  border-radius: var(--radius);
  border: 1.5px solid var(--border);
  background: var(--surface);
  color: var(--text);
  transition: border-color 0.15s, box-shadow 0.15s;
  padding: 0;
  caret-color: transparent;
}
.pin-digit:focus {
  border-color: var(--border-focus);
  outline: none;
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--border-focus) 18%, transparent);
}
div.pin-digit {
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: text;
}
.pin-digit.focused {
  border-color: var(--border-focus);
  outline: none;
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--border-focus) 18%, transparent);
}

.split-layout {
  display: grid;
  grid-template-columns: 1fr;
  gap: 48px;
  max-width: 1200px;
  margin: 0 auto;
  padding: 48px 24px;
}
@media (min-width: 900px) {
  .split-layout { grid-template-columns: 340px 1fr; align-items: start; }
  .split-layout > .hero { position: sticky; top: 48px; margin: 0; }
}
.hero {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.hero-label {
  font-family: 'JetBrains Mono', monospace;
  font-size: 12px;
  font-weight: 600;
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: 0.1em;
}
.hero-title {
  font-size: 48px;
  font-weight: 700;
  line-height: 1.1;
  letter-spacing: -0.04em;
}
.hero-sub {
  font-size: 16px;
  color: var(--text-muted);
  line-height: 1.6;
}

.mobile-app-layout {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
  max-width: 600px;
  margin: 0 auto;
}
.mobile-header {
  position: sticky;
  top: 0;
  z-index: 10;
  padding: 16px 20px;
  background: var(--bg);
  border-bottom: 1px solid var(--border);
  margin-bottom: 24px;
}
.mobile-content { flex: 1; padding: 0 20px 120px; }
.mobile-bottom-bar {
  position: fixed;
  bottom: 0; left: 0; right: 0;
  max-width: 600px;
  margin: 0 auto;
  padding: 16px 20px;
  background: var(--bg);
  border-top: 1px solid var(--border);
  z-index: 10;
}

.row { display: flex; gap: 12px; flex-wrap: wrap; align-items: center; }
.grid2 { display: grid; grid-template-columns: 1fr; gap: 16px; }
@media (min-width: 860px) { .grid2 { grid-template-columns: 1fr 1fr; } }
hr { border: 0; border-top: 1px solid var(--border); margin: 32px 0; }
.overflow-x { overflow-x: auto; }

/* ── Cards & Panels ──────────────────────────────────── */
.card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 24px;
  margin: 0 0 24px;
}
.card-header {
  margin-bottom: 24px;
  padding-bottom: 16px;
  border-bottom: 1px solid var(--border);
}

/* ── Forms ───────────────────────────────────────────── */
label {
  display: block;
  font-size: 13px;
  font-weight: 500;
  color: var(--text-muted);
  margin: 0 0 8px;
}
input, select, textarea {
  width: 100%;
  padding: 10px 12px;
  border-radius: var(--radius);
  border: 1px solid var(--border);
  background: var(--bg);
  color: var(--text);
  font-family: inherit;
  font-size: 14px;
  transition: border-color 0.15s;
}
input:focus, select:focus, textarea:focus {
  outline: none;
  border-color: var(--border-focus);
}

/* ── Buttons ─────────────────────────────────────────── */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 10px 16px;
  border-radius: var(--radius);
  border: 1px solid var(--border);
  background: transparent;
  color: var(--text);
  font-family: inherit;
  font-size: 13px;
  font-weight: 500;
  cursor: pointer;
  text-decoration: none;
  transition: all 0.1s;
  white-space: nowrap;
}
.btn:hover { background: var(--surface-hover); }

.btn.primary {
  background: var(--btn-primary-bg);
  color: var(--btn-primary-text);
  border-color: var(--btn-primary-bg);
}
.btn.primary:hover {
  background: var(--btn-primary-hover-bg);
  border-color: var(--btn-primary-hover-bg);
}

.btn.danger { color: var(--danger-text); border-color: var(--danger-border); }
.btn.danger:hover { background: var(--danger-hover-bg); border-color: var(--danger-hover-border); }

.btn:disabled, .btn.disabled { opacity: 0.4; cursor: not-allowed; pointer-events: none; }

/* ── Status Labels ─────────────────────────────────────── */
.status-label {
  display: inline-flex;
  align-items: center;
  padding: 4px 10px;
  border-radius: 9999px;
  border: 1px solid var(--border);
  background: var(--surface);
  color: var(--text-muted);
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  line-height: 1.2;
  user-select: none;
}
.status-label.active {
  color: #047857;
  border-color: #a7f3d0;
  background: #ecfdf5;
}
.status-label.danger {
  color: var(--danger-text);
  border-color: var(--danger-hover-border);
  background: var(--danger-bg);
}

[data-theme="dark"] .status-label {
  background: #18181b;
  border-color: #27272a;
  color: #a1a1aa;
}
[data-theme="dark"] .status-label.active {
  color: #6ee7b7;
  border-color: rgba(16, 185, 129, 0.35);
  background: rgba(6, 78, 59, 0.35);
}
[data-theme="dark"] .status-label.danger {
  color: #f87171;
  border-color: rgba(248, 113, 113, 0.35);
  background: rgba(127, 29, 29, 0.35);
}

/* ── Badges ──────────────────────────────────────────── */
.badge {
  display: inline-flex;
  align-items: center;
  padding: 4px 8px;
  border-radius: var(--radius);
  border: 1px solid var(--border);
  background: var(--surface);
  color: var(--text-muted);
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.badge.active { color: var(--text); border-color: var(--border-focus); background: var(--bg); }
.badge.danger { color: var(--danger-text); border-color: var(--danger-hover-border); background: var(--danger-bg); }
[data-locked-badge]    { min-width: 72px; justify-content: center; }
[data-submitted-badge] { min-width: 80px; justify-content: center; }

/* ── Theme Toggle ────────────────────────────────────── */
.theme-toggle {
  background: transparent;
  border: 1px solid var(--border);
  color: var(--text);
  border-radius: var(--radius);
  padding: 6px 10px;
  font-size: 13px;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.theme-toggle:hover { background: var(--surface-hover); }

/* ── Tables ──────────────────────────────────────────── */
table { width: 100%; border-collapse: collapse; font-size: 13px; }
th {
  font-weight: 500;
  color: var(--text-muted);
  text-align: left;
  padding: 12px;
  border-bottom: 1px solid var(--border);
}
td {
  padding: 12px;
  border-bottom: 1px solid var(--border);
  color: var(--text);
}
tr:last-child td { border-bottom: none; }
.num-col {
  font-family: 'JetBrains Mono', monospace;
  color: var(--text-muted);
  width: 48px;
}

/* ── Custom UI Components ────────────────────────────── */

/* Admin Judge Cards */
.judge-list {
  display: flex;
  flex-direction: column;
  gap: 0;
  border: 1px solid var(--border);
  border-radius: var(--radius);
}
.judge-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px;
  border-bottom: 1px solid var(--border);
  gap: 16px;
}
.judge-row:last-child { border-bottom: none; }
.judge-info { display: flex; flex-direction: column; gap: 4px; flex: 1; }
.judge-actions { display: flex; gap: 8px; align-items: center; }

/* Admin Couples Form */
.couples-inputs {
  display: grid;
  grid-template-columns: 80px 1fr 1fr auto;
  gap: 12px;
  align-items: flex-end;
  background: var(--surface);
  padding: 16px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  margin-bottom: 24px;
}
@media (max-width: 600px) {
  .couples-inputs { grid-template-columns: 1fr 1fr; }
  .couples-inputs .btn { grid-column: span 2; }
}

/* QR Code Image & Modal */
.qr {
  width: 40px; height: 40px;
  border-radius: var(--radius);
  border: 1px solid var(--border);
  background: #fff;
  cursor: zoom-in;
}

.qr-modal {
  position: fixed;
  top: 0; left: 0; right: 0; bottom: 0;
  background: var(--modal-bg);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.2s;
}
.qr-modal.active { opacity: 1; pointer-events: auto; }
.qr-modal-content {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 24px;
}
.qr-modal-img {
  width: 320px; height: 320px;
  background: #fff;
  padding: 16px;
  border-radius: var(--radius);
  border: 1px solid var(--border);
  box-shadow: 0 20px 40px rgba(0,0,0,0.1);
}

/* Form Steps (Home) */
.step {
  padding: 24px 0;
  border-bottom: 1px solid var(--border);
}
.step:last-child { border-bottom: none; }
.step-number {
  font-family: 'JetBrains Mono', monospace;
  font-size: 11px;
  font-weight: 600;
  color: var(--text-muted);
  margin-bottom: 8px;
}
.step-title {
  font-size: 16px;
  font-weight: 600;
  margin-bottom: 16px;
}

/* Judge Chips (Home) */
.judge-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 16px;
}
.judge-chip {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 6px 8px 6px 12px;
  border-radius: var(--radius);
  border: 1px solid var(--border);
  background: var(--bg);
  font-size: 13px;
}
.judge-chip-name { font-weight: 600; }
.judge-chip-pin { color: var(--text-muted); font-family: 'JetBrains Mono', monospace; }
.judge-chip-remove {
  background: transparent;
  border: none;
  color: var(--text-muted);
  cursor: pointer;
  padding: 0 4px;
}
.judge-chip-remove:hover { color: #f87171; }

/* Judge App Form */
.couple-row {
  display: flex;
  align-items: center;
  padding: 16px 0;
  border-bottom: 1px solid var(--border);
  gap: 12px;
}
.couple-row:last-child { border-bottom: none; }
.couple-num {
  font-family: 'JetBrains Mono', monospace;
  font-weight: 600;
  color: var(--text-muted);
  width: 32px;
}
.couple-name {
  flex: 1;
  font-weight: 500;
  font-size: 16px;
}
.place {
  width: 64px;
  text-align: center;
  font-family: 'JetBrains Mono', monospace;
  font-size: 16px;
  font-weight: 600;
  padding: 8px;
}

/* ── Home Page ───────────────────────────────────────── */
.home-forms {
  display: flex;
  flex-direction: column;
  gap: 24px;
}
.section-label {
  font-size: 16px;
  font-weight: 600;
  color: var(--text);
  margin-bottom: 20px;
}
.judge-inputs {
  display: grid;
  grid-template-columns: 1fr 1fr auto;
  gap: 12px;
  align-items: flex-end;
  margin-bottom: 12px;
}
.add-btn { display: flex; flex-direction: column; justify-content: flex-end; }
.judge-meta {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 12px;
}
.event-card {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 14px 0;
  border-bottom: 1px solid var(--border);
}
.event-card:last-child { border-bottom: none; }
.event-card-name { flex: 1; font-weight: 500; }
.empty-state {
  color: var(--text-muted);
  font-size: 13px;
  padding: 24px 0;
  text-align: center;
}
.couple-status { font-size: 13px; color: var(--danger-text); min-height: 20px; }

/* Home Event List */
.event-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px 0;
  border-bottom: 1px solid var(--border);
}
.event-row:last-child { border-bottom: none; }

/* Toast Notifications */
.toast {
  position: fixed;
  bottom: 24px;
  right: 24px;
  background: var(--surface);
  color: var(--text);
  padding: 12px 20px;
  border-radius: var(--radius);
  box-shadow: 0 4px 12px rgba(0,0,0,0.15);
  font-size: 14px;
  font-weight: 500;
  z-index: 10000;
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 0.3s ease, transform 0.3s ease;
  border: 1px solid var(--border);
}
.toast.show {
  opacity: 1;
  transform: translateY(0);
}

/* ── Final Placings ──────────────────────────────────── */
.placing-list { display: flex; flex-direction: column; }

.placing-row {
  display: flex;
  align-items: center;
  gap: 24px;
  padding: 18px 0;
  border-bottom: 1px solid var(--border);
  transition: background 0.1s;
}
.placing-row:last-child { border-bottom: none; }

.placing-rank {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-width: 72px;
  flex-shrink: 0;
  gap: 3px;
}
.placing-num {
  font-family: 'JetBrains Mono', monospace;
  font-size: 42px;
  font-weight: 700;
  line-height: 1;
  letter-spacing: -0.03em;
  color: var(--text-muted);
  white-space: nowrap;
}
.placing-shared {
  font-family: 'JetBrains Mono', monospace;
  font-size: 9px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: var(--text-muted);
}
.placing-names {
  flex: 1;
  font-size: 20px;
  font-weight: 500;
  letter-spacing: -0.01em;
  line-height: 1.3;
}

/* Medal colours */
.place-gold   { padding-left: 12px; border-left: 3px solid #ca8a04; }
.place-silver { padding-left: 12px; border-left: 3px solid #71717a; }
.place-bronze { padding-left: 12px; border-left: 3px solid #c2410c; }

.place-gold   .placing-num { color: #ca8a04; }
.place-silver .placing-num { color: #52525b; }
.place-bronze .placing-num { color: #c2410c; }

[data-theme="dark"] .place-gold   { border-left-color: #fbbf24; }
[data-theme="dark"] .place-silver { border-left-color: #a1a1aa; }
[data-theme="dark"] .place-bronze { border-left-color: #fb923c; }
[data-theme="dark"] .place-gold   .placing-num { color: #fbbf24; }
[data-theme="dark"] .place-silver .placing-num { color: #a1a1aa; }
[data-theme="dark"] .place-bronze .placing-num { color: #fb923c; }

/* ── Audit Trace ─────────────────────────────────────── */
.audit-award-sep {
  border-bottom: 1px solid var(--border);
  margin-bottom: 28px;
  padding-bottom: 28px;
}
.audit-award-header {
  display: flex;
  align-items: baseline;
  gap: 16px;
  margin-bottom: 14px;
  flex-wrap: wrap;
}
.audit-place-label {
  font-family: 'JetBrains Mono', monospace;
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--text-muted);
  white-space: nowrap;
}
.audit-award-winner { font-size: 15px; }

.audit-step {
  margin-bottom: 10px;
  padding: 14px 16px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--surface);
}
.audit-step-head {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 12px;
  flex-wrap: wrap;
}
.audit-k {
  font-family: 'JetBrains Mono', monospace;
  font-size: 13px;
  font-weight: 700;
}

/* Decision badges */
.audit-badge-win-by-majority { background:#d1fae5; color:#065f46; border-color:#6ee7b7; }
.audit-badge-win-by-sum      { background:#dbeafe; color:#1e40af; border-color:#93c5fd; }
.audit-badge-carry-tie       { background:#fef3c7; color:#92400e; border-color:#fcd34d; }
.audit-badge-shared-end,
.audit-badge-shared-tie      { background:#f3e8ff; color:#6b21a8; border-color:#d8b4fe; }
[data-theme="dark"] .audit-badge-win-by-majority { background:#064e3b; color:#6ee7b7; border-color:#065f46; }
[data-theme="dark"] .audit-badge-win-by-sum      { background:#1e3a8a; color:#93c5fd; border-color:#1e40af; }
[data-theme="dark"] .audit-badge-carry-tie       { background:#78350f; color:#fcd34d; border-color:#92400e; }
[data-theme="dark"] .audit-badge-shared-end,
[data-theme="dark"] .audit-badge-shared-tie      { background:#4a044e; color:#d8b4fe; border-color:#6b21a8; }

/* Marks table & Audit trace table */
.marks-tbl th, .marks-tbl td { padding: 10px 12px; }
.marks-couple-col, .marks-couple-cell {
  width: 1%;
  white-space: nowrap;
  padding-right: 20px;
}
.marks-couple-cell { font-weight: 500; }
.marks-judge-col {
  text-align: center;
  white-space: nowrap;
  min-width: 70px;
}
.marks-mark-cell {
  font-family: 'JetBrains Mono', monospace;
  font-size: 13px;
  text-align: center;
}

.audit-tbl th, .audit-tbl td { padding: 8px 10px; }
.audit-couple-col  { width: 1%; white-space: nowrap; padding-right: 16px; }
.audit-mark-col    { text-align: center; white-space: nowrap; min-width: 70px; }
.audit-count-col   { width: 88px; text-align: center; white-space: nowrap; }
.audit-sum-col     { width: 64px; text-align: center; white-space: nowrap; }
.audit-couple-name { font-size: 13px; white-space: nowrap; width: 1%; }
.audit-mark        { font-family: 'JetBrains Mono', monospace; font-size: 13px; text-align: center; }
.audit-mark-on     { font-weight: 700; color: var(--text); }
.audit-mark-off    { color: var(--text-muted); opacity: 0.3; }
.audit-count       { font-family: 'JetBrains Mono', monospace; font-size: 13px; font-weight: 500; text-align: center; }
.audit-has-majority { color: #059669; font-weight: 700; }
[data-theme="dark"] .audit-has-majority { color: #34d399; }
.audit-sum         { font-family: 'JetBrains Mono', monospace; font-size: 13px; text-align: center; }
.audit-row-winner td { background: color-mix(in srgb, var(--surface-hover) 50%, transparent); }
.audit-note {
  margin: 10px 0 0;
  padding-top: 10px;
  border-top: 1px solid var(--border);
  font-size: 12px;
  line-height: 1.6;
  color: var(--text-muted);
}

/* ── Events list (home.html) ─────────────────────────── */
/* Slightly blue-tinted greys for the organizer events page only; every other page keeps the shared tokens above. */
body.home-body {
  --bg: #eef1f7;
  --surface-hover: #e2e7f1;
  --border: #d5dbe8;
  --border-focus: #6b7690;
  --text: #0b1020;
  --text-muted: #667189;
  --btn-primary-hover-bg: #1c2438;
}
[data-theme="dark"] body.home-body {
  --bg: #0b0e15;
  --surface: #131823;
  --surface-hover: #1b2230;
  --border: #232b3b;
  --border-focus: #4b566d;
  --text: #f3f5fa;
  --text-muted: #98a3b8;
  --btn-primary-hover-bg: #d3d9e6;
}

:root { --accent: #3b5bdb; --row-hover: #f3f5fa; }
[data-theme="dark"] { --accent: #748ffc; --row-hover: #1b2230; }
[data-theme="dark"] .home-page { --border: #232b3b; --row-hover: #1b2230; }

.home-page {
  --border: #dde2ee;
  --row-hover: #f3f5fa;
  max-width: 960px;
  margin: 0 auto;
  padding: 40px 24px 64px;
  display: flex;
  flex-direction: column;
  gap: 40px;
}
.home-top {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  flex-wrap: wrap;
}
.home-top-actions { display: flex; gap: 4px; flex-wrap: wrap; align-items: center; }
.home-top-actions form { margin: 0; }
.pill-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 12px;
  border: 0;
  border-radius: 999px;
  background: transparent;
  color: var(--text-muted);
  font: inherit;
  font-size: 13px;
  font-weight: 500;
  text-decoration: none;
  cursor: pointer;
  transition: background 0.12s, color 0.12s;
}
.pill-btn:hover { background: var(--row-hover); color: var(--text); }
.home-intro { display: flex; flex-direction: column; gap: 12px; }
.home-title {
  margin: 0;
  font-size: 44px;
  font-weight: 700;
  line-height: 1.1;
  letter-spacing: -0.035em;
  overflow-wrap: anywhere;
}
.home-intro p {
  margin: 0;
  max-width: 560px;
  font-size: 16px;
  line-height: 1.6;
  color: var(--text-muted);
}

.events-panel {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 16px;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04), 0 8px 24px -12px rgba(0, 0, 0, 0.12);
  overflow: hidden;
}
.events-head {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
  padding: 20px 24px;
  background: color-mix(in srgb, var(--accent) 7%, var(--surface));
  border-bottom: 1px solid color-mix(in srgb, var(--accent) 18%, var(--border));
}
.events-head h2 { margin: 0; font-size: 18px; font-weight: 600; letter-spacing: -0.01em; }
.events-count {
  font-family: 'JetBrains Mono', monospace;
  font-size: 12px;
  font-weight: 600;
  color: var(--accent);
  background: color-mix(in srgb, var(--accent) 14%, var(--surface));
  padding: 2px 8px;
  border-radius: 999px;
}
.events-head-spacer { flex: 1 1 120px; }
.events-search { position: relative; display: block; flex: 0 1 240px; min-width: 160px; margin: 0; }
.events-search svg {
  position: absolute;
  left: 12px;
  top: 50%;
  transform: translateY(-50%);
  color: var(--text-muted);
  pointer-events: none;
}
.events-search input { padding: 9px 12px 9px 36px; border-radius: 10px; }
.btn-new {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 10px 16px;
  border-radius: 10px;
  background: var(--btn-primary-bg);
  color: var(--btn-primary-text);
  font-size: 14px;
  font-weight: 600;
  text-decoration: none;
  transition: opacity 0.12s;
}
.btn-new:hover { color: var(--btn-primary-text); opacity: 0.88; }

.ev-row {
  display: flex;
  align-items: center;
  gap: 8px;
  padding-right: 16px;
  border-bottom: 1px solid var(--border);
  transition: background 0.12s;
}
.ev-row:last-child { border-bottom: none; }
.ev-row:hover { background: var(--row-hover); }
.ev-link {
  flex: 1;
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 18px 8px 18px 24px;
  color: var(--text);
  text-decoration: none;
}
.ev-link:hover { color: var(--text); }
.ev-name {
  flex: 1;
  min-width: 0;
  font-size: 16px;
  font-weight: 550;
  letter-spacing: -0.01em;
  overflow-wrap: anywhere;
  transition: color 0.12s;
}
.ev-row:hover .ev-name, .ev-link:focus-visible .ev-name { color: var(--accent); }
.ev-arrow {
  flex: none;
  color: var(--accent);
  opacity: 0;
  transform: translateX(-4px);
  transition: opacity 0.15s, transform 0.15s;
}
.ev-row:hover .ev-arrow, .ev-link:focus-visible .ev-arrow { opacity: 1; transform: none; }
.ev-delete {
  flex: none;
  width: 36px;
  height: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 10px;
  color: var(--text-muted);
  opacity: 0.55;
  transition: opacity 0.12s, color 0.12s, background 0.12s;
}
.ev-row:hover .ev-delete, .ev-delete:focus-visible { opacity: 1; }
.ev-delete:hover { color: var(--danger-text); background: color-mix(in srgb, var(--danger-text) 10%, transparent); }
.ev-link:focus-visible, .ev-delete:focus-visible, .pill-btn:focus-visible, .btn-new:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: -2px;
}
.btn-new:focus-visible, .pill-btn:focus-visible { outline-offset: 2px; }
.events-empty { padding: 32px 24px; text-align: center; color: var(--text-muted); font-size: 14px; }
.events-empty[hidden], .ev-row[hidden] { display: none; }
@media (max-width: 600px) {
  .home-page { padding: 24px 16px 48px; gap: 28px; }
  .home-title { font-size: 34px; }
  .events-head { padding: 16px; }
  .events-search { flex-basis: 100%; order: 3; }
  .ev-link { padding-left: 16px; }
  .ev-arrow { display: none; }
}

/* ── New event form (new_event.html; same palette as the events page) ── */
.home-page.narrow { max-width: 720px; }
body.home-body input:focus, body.home-body select:focus, body.home-body textarea:focus {
  border-color: var(--accent);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 18%, transparent);
}
body.home-body input { border-radius: 10px; }
body.home-body .btn { border-radius: 10px; }
body.home-body .btn.sm { padding: 6px 12px; font-size: 12px; }
body.home-body .btn.ghost-btn { border-color: transparent; color: var(--text-muted); }
body.home-body .btn.ghost-btn:hover { color: var(--text); }
body.home-body .btn:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }

.form-step { padding: 24px; border-bottom: 1px solid var(--border); }
.form-step-head { display: flex; align-items: center; gap: 12px; margin-bottom: 16px; }
.form-step-head h3 { margin: 0; font-size: 16px; font-weight: 600; letter-spacing: -0.01em; }
.step-badge {
  flex: none;
  width: 26px;
  height: 26px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  background: color-mix(in srgb, var(--accent) 14%, var(--surface));
  color: var(--accent);
  font-family: 'JetBrains Mono', monospace;
  font-size: 12px;
  font-weight: 600;
}
.form-hint { margin: 0 0 16px; }
body.home-body .judge-meta { margin-top: 16px; flex-wrap: wrap; }
body.home-body .judge-chips { margin-top: 12px; }
body.home-body .judge-chip { border-radius: 999px; padding: 6px 8px 6px 14px; }
body.home-body .judge-chip-remove:hover { color: var(--danger-text); }
.form-foot {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 12px;
  flex-wrap: wrap;
  padding: 20px 24px;
  background: color-mix(in srgb, var(--accent) 4%, var(--surface));
}
.form-foot .couple-status { flex: 1 1 200px; min-height: 0; }
.form-foot .btn.primary { padding: 11px 18px; font-size: 14px; font-weight: 600; }
@media (max-width: 520px) {
  .form-step, .form-foot { padding: 16px; }
  body.home-body .judge-inputs { grid-template-columns: 1fr 1fr; }
  body.home-body .judge-inputs .add-btn { grid-column: span 2; }
  .form-foot .btn { flex: 1 1 auto; }
}

/* ── Sign-in and confirmation pages (organizer_login, account_password, delete_event) ── */
.auth-page {
  min-height: 100vh;
  box-sizing: border-box;
  padding: 24px 16px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 24px;
}
.auth-page > * { width: 100%; max-width: 420px; }
.auth-brand { display: flex; flex-direction: column; gap: 8px; }
.auth-title {
  margin: 0;
  font-size: 32px;
  font-weight: 700;
  line-height: 1.15;
  letter-spacing: -0.03em;
  overflow-wrap: anywhere;
}
.auth-body { padding: 24px; }
.auth-body .field { margin-bottom: 16px; }
.auth-body .field:last-of-type { margin-bottom: 0; }
.auth-body label { margin-bottom: 6px; }
.auth-body .field-hint { margin: 6px 0 0; font-size: 12px; color: var(--text-muted); }
.auth-intro { margin: 0 0 20px; font-size: 13px; line-height: 1.6; color: var(--text-muted); }
.auth-actions { display: flex; gap: 12px; margin-top: 24px; flex-wrap: wrap; }
.auth-actions .btn { padding: 11px 18px; font-size: 14px; font-weight: 600; }
.auth-actions .btn.primary, .auth-actions .btn.danger { flex: 1 1 auto; }
.auth-foot {
  padding: 16px 24px;
  border-top: 1px solid var(--border);
  background: color-mix(in srgb, var(--accent) 4%, var(--surface));
  font-size: 12px;
  line-height: 1.6;
  color: var(--text-muted);
}
.form-alert {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  margin: 0 0 20px;
  padding: 10px 14px;
  border: 1px solid color-mix(in srgb, var(--danger-text) 35%, var(--border));
  border-radius: 10px;
  background: color-mix(in srgb, var(--danger-text) 8%, var(--surface));
  color: var(--danger-text);
  font-size: 13px;
  font-weight: 500;
  line-height: 1.5;
}
.events-head.danger {
  background: color-mix(in srgb, var(--danger-text) 7%, var(--surface));
  border-bottom-color: color-mix(in srgb, var(--danger-text) 22%, var(--border));
}
.events-head.danger h2 { color: var(--danger-text); }
body.home-body .btn.danger:hover { background: color-mix(in srgb, var(--danger-text) 10%, transparent); }
body.home-body .btn.danger.solid { background: var(--danger-text); border-color: var(--danger-text); color: #fff; }
body.home-body .btn.danger.solid:hover { background: color-mix(in srgb, var(--danger-text) 88%, #000); }

/* ── Event admin page (admin.html) ───────────────────── */
:root { --warn-text: #92400e; --warn-border: #fcd34d; --warn-bg: #fffbeb; }
[data-theme="dark"] { --warn-text: #fcd34d; --warn-border: rgba(245, 158, 11, 0.4); --warn-bg: rgba(120, 53, 15, 0.35); }

.banner { position: fixed; top: 0; left: 0; right: 0; padding: 10px 16px; text-align: center; font-size: 14px; font-weight: 600; }
.banner[hidden] { display: none; }
.banner.expired { z-index: 9999; background: #dc2626; color: #fff; }
.banner.expired a { color: #fff; margin-left: 4px; }
.banner.lost { z-index: 9998; background: #f59e0b; color: #000; }

.home-page.wide { max-width: 1120px; }
.btn-form { display: contents; }
.panel-gap { margin: 0; }
.panel-body { padding: 24px; }
.form-actions { margin-top: 20px; }

.event-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; }
.event-head-main { min-width: 0; display: flex; flex-direction: column; gap: 12px; }
.event-title { font-size: 40px; }
.event-qr { display: flex; flex-direction: column; align-items: center; gap: 6px; flex-shrink: 0; font-size: 12px; }
.event-qr .qr { width: 64px; height: 64px; border-radius: 12px; }

.action-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px 24px;
  flex-wrap: wrap;
  padding: 14px 16px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 16px;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04);
}
.action-group { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.action-group-label {
  font-family: 'JetBrains Mono', monospace;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--text-muted);
  margin-right: 4px;
}

body.home-body .status-label.warning { color: var(--warn-text); border-color: var(--warn-border); background: var(--warn-bg); }
body.home-body .status-label[hidden] { display: none; }

body.home-body .judge-list { border: 0; border-radius: 0; }
body.home-body .judge-row { padding: 16px 24px; transition: background 0.12s; }
body.home-body .judge-row:hover { background: var(--row-hover); }
body.home-body .judge-name { font-weight: 600; font-size: 15px; letter-spacing: -0.01em; }
body.home-body .judge-actions { flex-wrap: wrap; justify-content: flex-end; }
body.home-body .judge-actions .qr { width: 44px; height: 44px; border-radius: 10px; }
body.home-body .judge-row .btn { min-height: 36px; }
body.home-body .qr:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }

body.home-body .card { border-radius: 16px; }
body.home-body .couples-inputs { background: var(--bg); border-radius: 12px; }
body.home-body .couples-add-btn .btn { width: 100%; }
body.home-body .couple-actions { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-bottom: 16px; }
body.home-body .couple-actions .couple-status { flex-basis: 100%; min-height: 0; }
body.home-body .couple-actions .couple-status:empty { display: none; }
body.home-body .panel-body th { font-size: 12px; text-transform: uppercase; letter-spacing: 0.05em; }

@media (max-width: 700px) {
  .event-head { align-items: flex-start; }
  .event-title { font-size: 30px; }
  .event-qr .qr { width: 52px; height: 52px; }
  .action-bar .action-group:last-child { width: 100%; }
  body.home-body .judge-row { flex-direction: column; align-items: stretch; gap: 12px; padding: 16px; }
  body.home-body .judge-actions { justify-content: flex-start; gap: 6px; }
  body.home-body .judge-actions .btn { padding: 6px 10px; min-width: 0 !important; }
  body.home-body .judge-actions .qr { width: 40px; height: 40px; }
  .panel-body { padding: 16px; }
}
@media (max-width: 480px) { .event-qr span { display: none; } }

/* ── Mobile admin extras ── */
body.home-body .btn.success { color: #047857; border-color: #a7f3d0; }
body.home-body .btn.success:hover { background: color-mix(in srgb, #10b981 12%, transparent); }
[data-theme="dark"] body.home-body .btn.success { color: #6ee7b7; border-color: rgba(16, 185, 129, 0.4); }

/* ── Results page ── */
body.home-body .placing-row { padding: 18px 24px; }
body.home-body .place-gold, body.home-body .place-silver, body.home-body .place-bronze { padding-left: 21px; }
body.home-body .audit-step { background: color-mix(in srgb, var(--accent) 3%, var(--surface)); border-radius: 12px; }
body.home-body .badge { border-radius: 999px; padding: 4px 10px; }
body.home-body .audit-award-sep { margin-bottom: 28px; padding-bottom: 28px; }
@media (max-width: 600px) {
  body.home-body .placing-row { padding: 16px; gap: 16px; }
  body.home-body .place-gold, body.home-body .place-silver, body.home-body .place-bronze { padding-left: 13px; }
}

/* ── Logs, PIN and manual marks pages ── */
body.home-body .lock-banner, body.home-body .m-lock-status {
  border-radius: 12px;
  font-weight: 600;
  line-height: 1.4;
}
body.home-body .lock-banner.allowed, body.home-body .m-lock-status.allowed {
  background: rgba(16, 185, 129, 0.1);
  border: 1px solid rgba(16, 185, 129, 0.35);
  color: #047857;
}
body.home-body .lock-banner.blocked, body.home-body .m-lock-status.blocked {
  background: color-mix(in srgb, var(--danger-text) 8%, var(--surface));
  border: 1px solid color-mix(in srgb, var(--danger-text) 35%, var(--border));
  color: var(--danger-text);
}
[data-theme="dark"] body.home-body .lock-banner.allowed, [data-theme="dark"] body.home-body .m-lock-status.allowed { color: #6ee7b7; }
body.home-body .judge-tab, body.home-body .judge-pill { background: var(--surface); color: var(--text); }
body.home-body .judge-tab:hover, body.home-body .judge-pill:hover { border-color: var(--border-focus); }
body.home-body .judge-tab.active, body.home-body .judge-pill.active {
  background: color-mix(in srgb, var(--accent) 14%, var(--surface));
  border-color: var(--accent);
  color: var(--accent);
}
body.home-body .segmented-control { background: var(--bg); }
body.home-body .segment-btn.active { background: var(--surface); }
body.home-body .sortable-list { background: var(--bg); }
body.home-body .place-select, body.home-body .m-place-select { background: var(--bg); }
body.home-body .m-header { box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04); }
body.home-body .m-couple-card { border-radius: 14px; }
.m-top-row { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 8px; }
.m-intro-block { display: flex; flex-direction: column; gap: 6px; margin-bottom: 16px; }
.m-heading { margin: 0; font-size: 26px; font-weight: 700; line-height: 1.15; letter-spacing: -0.03em; }
.home-page .lock-banner { padding: 14px 18px; }

/* ── Super-admin pages ── */
.auth-page.wider > * { max-width: 560px; }
.auth-brand .back-pill { align-self: flex-start; margin: 0 0 8px -12px; }
.ev-meta { display: block; margin-top: 2px; font-family: 'JetBrains Mono', monospace; font-size: 12px; font-weight: 500; letter-spacing: 0; color: var(--text-muted); }
.ev-meta .badge { font-family: 'Inter', sans-serif; }
.issued-panel { border-color: color-mix(in srgb, var(--accent) 45%, var(--border)); }
.cred-label { margin-top: 12px; font-size: 12px; color: var(--text-muted); }
.cred-label:first-of-type { margin-top: 0; }
.cred-value { margin-top: 4px; padding: 10px 14px; border: 1px dashed var(--border-focus); border-radius: 10px; background: var(--bg); font-family: 'JetBrains Mono', monospace; font-size: 17px; user-select: all; overflow-wrap: anywhere; }
.cred-secret { font-size: 20px; letter-spacing: 0.08em; }
.account-row { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; padding: 14px 24px; border-bottom: 1px solid var(--border); }
.account-info { flex: 1 1 200px; min-width: 0; }
.account-name { font-size: 14px; font-weight: 600; }
.account-actions { display: flex; gap: 8px; flex-wrap: wrap; }
.account-actions form { margin: 0; }
.account-add { border-top: none; }
.account-row:last-of-type { border-bottom: none; }
@media (max-width: 520px) { .account-row { padding: 14px 16px; } }
body.home-body .btn { gap: 8px; }
.error-detail { margin: 0; font-size: 15px; line-height: 1.6; overflow-wrap: anywhere; }