/* Tuna — txna.me styles */
#scroll-progress {
  position: fixed; top: 0; left: 0; height: 2px;
  background: #10B981; z-index: 60; transition: width 75ms;
}
::-webkit-scrollbar { width: 6px; }
::-webkit-scrollbar-track { background: #111111; }
::-webkit-scrollbar-thumb { background: #1F1F1F; border-radius: 3px; }
::selection { background: rgba(16, 185, 129, 0.2); color: #ECEFF4; }
*:focus-visible { outline: 2px solid rgba(16, 185, 129, 0.5); outline-offset: 2px; }
.dot-grid {
  background-image: radial-gradient(circle, rgba(255,255,255,0.04) 1px, transparent 1px);
  background-size: 24px 24px;
}
.glow-blob {
  position: absolute; border-radius: 50%; filter: blur(80px); pointer-events: none;
}
.spinner {
  display: inline-block; width: 16px; height: 16px;
  border: 2px solid rgba(5,5,5,0.3); border-top-color: #050505;
  border-radius: 50%; animation: spin 0.6s linear infinite;
}
@keyframes spin { to { transform: rotate(360deg); } }

/* Input tabs */
.input-tab {
  color: #6B7280; background: transparent;
}
.input-tab.active {
  color: #ECEFF4; background: #1A1A1A;
}
.input-tab:hover:not(.active) {
  color: #B0B8C4;
}

/* Bank selector */
.bank-selector {
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%236B7280' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 12px center;
}

/* Bank cards */
.bank-card { transition: border-color 0.2s ease, background 0.2s ease; }
.bank-card:hover { border-color: rgba(16,185,129,0.2); background: #1A1A1A; }

/* Receipt card */
.receipt-card { transition: all 0.3s ease; }
.receipt-card.verified { border-color: rgba(16,185,129,0.3); box-shadow: 0 0 40px rgba(16,185,129,0.05); }
.receipt-card.failed { border-color: rgba(239,68,68,0.3); box-shadow: 0 0 40px rgba(239,68,68,0.05); }
.receipt-card.loading { border-color: rgba(251,191,36,0.3); }

/* Dropzone */
#dropzone.drag-over {
  border-color: #10B981;
  background: rgba(16,185,129,0.05);
}

/* Toast */
.toast {
  position: fixed; bottom: 24px; left: 50%; transform: translateX(-50%) translateY(100px);
  background: #1A1A1A; border: 1px solid #1F1F1F; border-radius: 8px;
  padding: 12px 20px; color: #ECEFF4; font-size: 14px; z-index: 100;
  opacity: 0; transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
  max-width: 90vw; text-align: center;
}
.toast.visible { transform: translateX(-50%) translateY(0); opacity: 1; }

/* History items */
.history-item {
  transition: background 0.15s ease;
}
.history-item:hover { background: #1A1A1A; }

/* QR video overlay */
#qr-video {
  position: relative;
}
.qr-overlay {
  position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);
  width: 200px; height: 200px;
  border: 2px solid rgba(16,185,129,0.6);
  border-radius: 12px;
  pointer-events: none;
}

/* Mobile menu */
#mobile-menu.show { display: block; }