| body { |
| font-family: 'Inter', system-ui, -apple-system, sans-serif; |
| background: #0b0b0f; |
| color: #fff; |
| -webkit-tap-highlight-color: transparent; |
| } |
|
|
| .no-scrollbar::-webkit-scrollbar { display: none; } |
| .no-scrollbar { -ms-overflow-style: none; scrollbar-width: none; } |
|
|
| .modal-enter { |
| opacity: 0; |
| pointer-events: none; |
| transition: opacity 0.3s ease; |
| } |
| .modal-enter.active { |
| opacity: 1; |
| pointer-events: auto; |
| } |
| .modal-sheet { |
| transform: translateY(100%); |
| transition: transform 0.35s cubic-bezier(0.32,0.72,0,1); |
| } |
| .modal-enter.active .modal-sheet { |
| transform: translateY(0); |
| } |
|
|
| input[type="date"]::-webkit-calendar-picker-indicator, |
| input[type="time"]::-webkit-calendar-picker-indicator { |
| filter: invert(1); |
| opacity: 0.4; |
| cursor: pointer; |
| } |
|
|
| .press:active { |
| transform: scale(0.97); |
| transition: transform 0.08s; |
| } |
|
|
| @keyframes scan { |
| 0% { top: 0%; opacity: 0; } |
| 10% { opacity: 1; } |
| 90% { opacity: 1; } |
| 100% { top: 100%; opacity: 0; } |
| } |
| .scan-line { |
| position: absolute; |
| left: 0; right: 0; |
| height: 2px; |
| background: linear-gradient(90deg, transparent, #10b981, transparent); |
| animation: scan 2.5s linear infinite; |
| box-shadow: 0 0 12px rgba(16,185,129,0.6); |
| } |
|
|
| @keyframes ping-ring { |
| 0% { transform: scale(0.8); opacity: 0.5; } |
| 100% { transform: scale(2); opacity: 0; } |
| } |
| .pulse-ring::before { |
| content: ''; |
| position: absolute; |
| inset: 0; |
| border-radius: 50%; |
| border: 1px solid #10b981; |
| animation: ping-ring 2s cubic-bezier(0,0,0.2,1) infinite; |
| } |
|
|
| @keyframes fadeIn { |
| from { opacity: 0; transform: translateY(-4px); } |
| to { opacity: 1; transform: translateY(0); } |
| } |
| .animate-fade-in { |
| animation: fadeIn 0.2s ease-out both; |
| } |