* { -webkit-tap-highlight-color: transparent; }
body { background: #0a0e14; overscroll-behavior: none; }

::-webkit-scrollbar { width: 4px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: #1c222d; border-radius: 4px; }

/* Animations */
@keyframes pulse {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.5; }
}

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

/* Components */
.card {
  background: linear-gradient(135deg, #0f1319 0%, #151a22 100%);
  border: 1px solid rgba(255,255,255,0.04);
  border-radius: 12px;
}

.tab-active { color: #00e396; border-color: #00e396; }
.tab-inactive { color: #6b7a94; border-color: transparent; }

.position-bar {
  background: linear-gradient(90deg, rgba(0,227,150,0.15) 0%, transparent 100%);
  border-left: 2px solid #00e396;
}
.position-bar.short {
  background: linear-gradient(90deg, rgba(255,69,96,0.15) 0%, transparent 100%);
  border-left: 2px solid #ff4560;
}

.toggle-track {
  width: 44px; height: 24px; border-radius: 12px;
  background: #1c222d; transition: background 0.2s;
  cursor: pointer; position: relative;
}
.toggle-track.on { background: #00e396; }
.toggle-thumb {
  width: 18px; height: 18px; border-radius: 50%;
  background: white; position: absolute; top: 3px; left: 3px;
  transition: transform 0.2s;
}
.toggle-track.on .toggle-thumb { transform: translateX(20px); }

.trade-row {
  border-bottom: 1px solid rgba(255,255,255,0.03);
  transition: background 0.15s;
}
.trade-row:hover { background: rgba(255,255,255,0.02); }

.audit-row { transition: background 0.15s; }
.audit-row:hover { background: rgba(255,255,255,0.02); }

.confirm-overlay {
  background: rgba(10,14,20,0.85);
  backdrop-filter: blur(8px);
}

.chip {
  font-size: 10px;
  padding: 2px 8px;
  border-radius: 100px;
  font-weight: 600;
  letter-spacing: 0.5px;
  text-transform: uppercase;
}

.metric-label {
  font-size: 10px;
  letter-spacing: 1px;
  text-transform: uppercase;
}

.health-pulse { animation: pulse 2s ease-in-out infinite; }

.animate-in { animation: slideUp 0.3s ease-out forwards; }

.view { display: none; }
.view.active { display: block; }
