:root{--color-bg-primary: #ffffff;--color-bg-secondary: #f9fafb;--color-bg-tertiary: #f3f4f6;--color-text-primary: #111827;--color-text-secondary: #6b7280;--color-text-tertiary: #9ca3af;--color-border: #e5e7eb;--color-primary: #3b82f6;--color-primary-dark: #2563eb;--color-success: #10b981;--color-warning: #f59e0b;--color-danger: #ef4444;--shadow-sm: 0 1px 2px 0 rgb(0 0 0 / .05);--shadow: 0 1px 3px 0 rgb(0 0 0 / .1), 0 1px 2px -1px rgb(0 0 0 / .1);--shadow-lg: 0 10px 15px -3px rgb(0 0 0 / .1), 0 4px 6px -4px rgb(0 0 0 / .1)}.dark{--color-bg-primary: #111827;--color-bg-secondary: #1f2937;--color-bg-tertiary: #374151;--color-text-primary: #f9fafb;--color-text-secondary: #d1d5db;--color-text-tertiary: #9ca3af;--color-border: #4b5563;--color-primary: #3b82f6;--color-primary-dark: #1d4ed8;--color-success: #10b981;--color-warning: #f59e0b;--color-danger: #ef4444;--shadow-sm: 0 1px 2px 0 rgb(0 0 0 / .3);--shadow: 0 1px 3px 0 rgb(0 0 0 / .3), 0 1px 2px -1px rgb(0 0 0 / .3);--shadow-lg: 0 10px 15px -3px rgb(0 0 0 / .3), 0 4px 6px -4px rgb(0 0 0 / .3)}:root{--app-primary: var(--color-primary);--app-bg: var(--color-bg-primary);--app-text: var(--color-text-primary);--app-border: var(--color-border);--app-radius: .5rem;--app-spacing: 1rem;--app-font-size: 1rem;--app-font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif}.high-contrast{--color-text-primary: #ffffff;--color-text-secondary: #cccccc;--color-bg-primary: #000000;--color-bg-secondary: #1a1a1a;--color-border: #666666}.glass-effect{--color-bg-primary: rgba(17, 24, 39, .8);--color-bg-secondary: rgba(31, 41, 55, .8);--color-bg-tertiary: rgba(55, 65, 81, .8)}.glass-effect .bg-gray-800{background:#1f2937cc!important;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.glass-effect .bg-gray-900{background:#111827cc!important;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.font-system{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}.font-inter{font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif}.font-roboto{font-family:Roboto,-apple-system,BlinkMacSystemFont,sans-serif}.font-mono{font-family:SF Mono,Roboto Mono,monospace}.bg-app{background-color:var(--app-bg)}.text-app{color:var(--app-text)}.border-app{border-color:var(--app-border)}.rounded-app{border-radius:var(--app-radius)}.p-app{padding:var(--app-spacing)}.text-app-size{font-size:var(--app-font-size)}.font-app{font-family:var(--app-font-family)}*{transition:background-color .3s ease,border-color .3s ease,color .3s ease}.no-animations *{transition:none!important;animation:none!important}.mobile-pagination{width:100%;max-width:420px;margin:0 auto;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;background:#f8f9fa;border-radius:20px;padding:16px;box-shadow:0 4px 20px #00000014,0 1px 3px #0000001a}.pagination-stats{display:flex;justify-content:space-around;align-items:center;background:#fff;border-radius:16px;padding:12px 16px;margin-bottom:16px;box-shadow:0 2px 8px #0000000a}.stats-item{display:flex;flex-direction:column;align-items:center;gap:4px}.stats-label{font-size:11px;font-weight:600;color:#6b7280;text-transform:uppercase;letter-spacing:.3px}.stats-value{font-size:16px;font-weight:700;color:#111827}.divider{width:1px;height:24px;background:#e5e7eb}.pagination-main{background:#fff;border-radius:16px;padding:20px 16px;margin-bottom:16px;box-shadow:0 2px 8px #0000000a;display:flex;align-items:center;justify-content:space-between;gap:8px}.page-jump-buttons{display:flex;gap:8px}.jump-btn{width:36px;height:36px;display:flex;align-items:center;justify-content:center;border-radius:10px;background:#f3f4f6;border:1px solid #e5e7eb;color:#6b7280;transition:all .2s ease;cursor:pointer}.jump-btn:hover:not(:disabled){background:#4f46e5;border-color:#4f46e5;color:#fff;transform:translateY(-1px)}.jump-btn:disabled{opacity:.4;cursor:not-allowed}.nav-arrow{width:44px;height:44px;display:flex;align-items:center;justify-content:center;border-radius:12px;background:#fff;border:1.5px solid #e5e7eb;color:#374151;transition:all .2s ease;cursor:pointer;box-shadow:0 2px 4px #0000000d}.nav-arrow:hover:not(:disabled){background:#4f46e5;border-color:#4f46e5;color:#fff;transform:translateY(-2px);box-shadow:0 4px 12px #4f46e533}.nav-arrow:disabled{opacity:.4;cursor:not-allowed}.page-numbers-container{display:flex;flex-direction:column;align-items:center;gap:12px;flex:1}.page-numbers-wrapper{display:flex;gap:4px}.page-number{min-width:44px;height:44px;display:flex;align-items:center;justify-content:center;border-radius:12px;background:#fff;border:1.5px solid #e5e7eb;color:#374151;font-weight:600;font-size:15px;transition:all .2s ease;cursor:pointer}.page-number:hover:not(:disabled){background:#f3f4f6;border-color:#d1d5db;transform:translateY(-1px)}.page-number.active{background:#4f46e5;border-color:#4f46e5;color:#fff;box-shadow:0 4px 12px #4f46e533;transform:scale(1.05)}.ellipsis-dots{min-width:44px;height:44px;display:flex;align-items:center;justify-content:center;color:#9ca3af}.current-page-indicator{display:flex;align-items:center;gap:8px}.indicator-dots{display:flex;gap:4px}.indicator-dot{width:6px;height:6px;border-radius:50%;background:#d1d5db;transition:all .2s ease}.indicator-dot.active{width:24px;border-radius:3px;background:#4f46e5}.pagination-bottom{background:#fff;border-radius:16px;padding:16px;box-shadow:0 2px 8px #0000000a;display:flex;flex-direction:column;gap:16px}.items-per-page{display:flex;align-items:center;gap:12px}.per-page-label{font-size:14px;font-weight:600;color:#374151;white-space:nowrap}.per-page-buttons{display:flex;gap:8px;flex-wrap:wrap}.per-page-btn{padding:8px 16px;border-radius:10px;background:#f3f4f6;border:1px solid #e5e7eb;color:#6b7280;font-weight:600;font-size:14px;transition:all .2s ease;cursor:pointer}.per-page-btn:hover:not(:disabled){background:#e5e7eb}.per-page-btn.active{background:#4f46e5;border-color:#4f46e5;color:#fff}.per-page-btn:disabled{opacity:.5;cursor:not-allowed}.page-input-container{display:flex;align-items:center;gap:12px}.input-label{font-size:14px;font-weight:600;color:#374151;white-space:nowrap}.page-input-wrapper{display:flex;gap:8px;flex:1}.page-input{flex:1;padding:10px 16px;border-radius:10px;background:#fff;border:1.5px solid #e5e7eb;color:#374151;font-weight:600;font-size:14px;transition:all .2s ease;text-align:center}.page-input:focus{outline:none;border-color:#4f46e5;box-shadow:0 0 0 3px #4f46e51a}.go-button{padding:10px 20px;border-radius:10px;background:#4f46e5;border:none;color:#fff;font-weight:600;font-size:14px;transition:all .2s ease;cursor:pointer;white-space:nowrap}.go-button:hover:not(:disabled){background:#4338ca;transform:translateY(-1px)}.go-button:disabled{opacity:.5;cursor:not-allowed}@keyframes pageChange{0%{opacity:.6;transform:scale(.98)}to{opacity:1;transform:scale(1)}}.page-number,.nav-arrow,.jump-btn{animation:pageChange .3s ease}@media(max-width:480px){.mobile-pagination{padding:12px;border-radius:16px}.pagination-stats{flex-direction:column;gap:12px;padding:16px}.divider{display:none}.pagination-main{flex-direction:column;gap:16px;padding:16px}.page-jump-buttons{width:100%;justify-content:center}.page-numbers-wrapper{flex-wrap:wrap;justify-content:center}.current-page-indicator{display:none}.pagination-bottom{flex-direction:column;gap:12px}.items-per-page,.page-input-container{flex-direction:column;align-items:stretch;gap:8px}.per-page-buttons{justify-content:center}.page-input-wrapper{width:100%}}@media(prefers-color-scheme:dark){.mobile-pagination{background:#1a1a1a;box-shadow:0 4px 20px #0000004d}.pagination-stats,.pagination-main,.pagination-bottom{background:#2a2a2a;box-shadow:0 2px 8px #0003}.stats-value{color:#f9fafb}.stats-label{color:#9ca3af}.divider{background:#404040}.jump-btn{background:#3a3a3a;border-color:#404040;color:#9ca3af}.nav-arrow,.page-number{background:#2a2a2a;border-color:#404040;color:#d1d5db}.nav-arrow:hover:not(:disabled),.page-number:hover:not(:disabled){background:#3a3a3a;border-color:#4f46e5}.page-input{background:#2a2a2a;border-color:#404040;color:#f9fafb}.per-page-btn{background:#3a3a3a;border-color:#404040;color:#9ca3af}.per-page-btn:hover:not(:disabled){background:#4a4a4a}}
