[x-cloak] { display: none !important; }

:root {
  --picker-ink: #f3f4f6;
  --picker-panel: #1f2937;
  --picker-soft: #111827;
  --picker-line: #374151;
  --picker-brand: #2563eb;
  --picker-brand-dark: #1d4ed8;
  --picker-accent: #0f766e;
  --picker-warm: #f59e0b;
  --picker-danger: #dc2626;
}

.slide-up { animation: slideUp .2s ease-out; }

@keyframes slideUp {
  from { opacity: 0; transform: translateY(12px); }
  to   { opacity: 1; transform: translateY(0); }
}

button { -webkit-tap-highlight-color: transparent; }
.tap-xl { min-height: 56px; }

html, body { overscroll-behavior: none; }
html { background: #0f172a; }

.picker-shell {
  background: #111827;
  color: var(--picker-ink);
  max-width: 430px;
  margin: 0 auto;
  padding-bottom: env(safe-area-inset-bottom);
}

.glass-panel {
  background: rgba(31, 41, 55, 0.9);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border: 1px solid rgba(55, 65, 81, 0.9);
  box-shadow: 0 18px 50px rgba(0, 0, 0, 0.3);
}

.section-card {
  background: rgba(31, 41, 55, 0.95);
  border: 1px solid rgba(55, 65, 81, 0.95);
  box-shadow: 0 18px 40px rgba(0, 0, 0, 0.25);
}

.metric-card {
  background: linear-gradient(180deg, rgba(31,41,55,0.98), rgba(17,24,39,0.98));
  border: 1px solid rgba(55, 65, 81, 0.9);
  box-shadow: 0 14px 30px rgba(0, 0, 0, 0.2);
}

.queue-card {
  background: linear-gradient(135deg, rgba(23, 32, 51, 0.98), rgba(37, 99, 235, 0.88));
  box-shadow: 0 18px 34px rgba(23, 32, 51, 0.24);
}

.order-card {
  background: rgba(31, 41, 55, 0.95);
  border: 1px solid rgba(55, 65, 81, 0.9);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.2);
}