@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700;800;900&display=swap');

html { font-size: 16px; } 
@media (min-width: 768px) { html { font-size: 17px; } } 
@media (min-width: 1280px) { html { font-size: 18px; } } 

body { font-family: 'Plus Jakarta Sans', sans-serif; -webkit-font-smoothing: antialiased; background-color: #e2e8f0; color: #0f172a; }

.animate-fade-in { animation: fadeIn 0.4s cubic-bezier(0.16, 1, 0.3, 1) forwards; }
@keyframes fadeIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }

.custom-scrollbar::-webkit-scrollbar { height: 8px; width: 8px; }
.custom-scrollbar::-webkit-scrollbar-track { background: transparent; }
.custom-scrollbar::-webkit-scrollbar-thumb { background: #cbd5e1; border-radius: 10px; }
.custom-scrollbar::-webkit-scrollbar-thumb:hover { background: #94a3b8; }

.sidebar-item { position: relative; padding: 14px 20px; border-radius: 12px; color: #64748b; font-weight: 600; display: flex; align-items: center; gap: 14px; transition: all 0.2s; cursor: pointer; margin-bottom: 4px; overflow: hidden; white-space: nowrap; }
.sidebar-item:hover { background-color: #f8fafc; color: #0f172a; }
.sidebar-active { background-color: var(--tw-color-primary-50) !important; color: var(--tw-color-primary-600) !important; font-weight: 800; }
.sidebar-active::before { content: ''; position: absolute; left: 0; top: 0; bottom: 0; width: 5px; background-color: var(--tw-color-primary-600); border-radius: 4px; }

.glass-panel { background: rgba(255, 255, 255, 0.95); backdrop-filter: blur(12px); border-top: 1px solid rgba(226, 232, 240, 0.8); }
.numpad-btn { width: 100%; aspect-ratio: 1; font-size: 28px; font-weight: 800; border-radius: 20px; background: #ffffff; color: #1e293b; display: flex; align-items: center; justify-content: center; cursor: pointer; transition: all 0.1s; border: 2px solid #e2e8f0; box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05); }
.numpad-btn:active { transform: scale(0.95); background: #f8fafc; }

input[type="color"] { -webkit-appearance: none; border: none; padding: 0; overflow: hidden; }
input[type="color"]::-webkit-color-swatch-wrapper { padding: 0; }
input[type="color"]::-webkit-color-swatch { border: none; border-radius: 0.75rem; }

@media print { 
    body * { visibility: hidden; } 
    .print-area, .print-area * { visibility: visible; } 
    .print-area { position: absolute; left: 0; top: 0; width: 100%; box-shadow: none; border: none; overflow: visible !important; padding: 0 !important; background: white !important; } 
    .no-print { display: none !important; } 
    .print-bg-fix { print-color-adjust: exact; -webkit-print-color-adjust: exact; }
    .award-violation-print-hide { display: none !important; }
}