:root{--primary-color: #4A6CF7;--primary-dark: #3651D4;--primary-light: #E8EDFD;--primary-gradient: linear-gradient(135deg,#4A6CF7,#6B8AFF);--bg-main: #F4F6F9;--bg-white: #FFFFFF;--bg-light: #F8F9FA;--bg-card: #FFFFFF;--bg-navbar: #FFFFFF;--bg-hover: #F8F9FA;--bg-active: #E9ECEF;--text-primary: #2C3E50;--text-secondary: #6C757D;--text-muted: #6C757D;--text-light: #F8F9FA;--text-dark: #1A2332;--border-color: #E9ECEF;--border-light: #F1F3F5;--border-dark: #D1D5DB;--card-bg: #FFFFFF;--card-shadow: 0 2px 10px rgba(0,0,0,0.08);--card-shadow-hover: 0 5px 20px rgba(0,0,0,0.12);--input-bg: #FFFFFF;--input-border: #D1D5DB;--input-border-focus: #4A6CF7;--input-text: #2C3E50;--input-placeholder: #A0AEC0;--button-primary-bg: #4A6CF7;--button-primary-text: #FFFFFF;--button-primary-hover: #3651D4;--button-primary-border: #4A6CF7;--success-color: #28A745;--danger-color: #DC3545;--warning-color: #FFC107;--info-color: #17A2B8;--secondary-color: #6C757D;--link-color: #4A6CF7;--link-hover: #3651D4;--shadow-sm: 0 1px 3px rgba(0,0,0,0.06);--shadow-md: 0 2px 10px rgba(0,0,0,0.08);--shadow-lg: 0 5px 25px rgba(0,0,0,0.12);--shadow-xl: 0 10px 40px rgba(0,0,0,0.15);--shadow-primary: 0 4px 12px rgba(74,108,247,0.4)}*{margin: 0;padding: 0;box-sizing: border-box}html{scroll-behavior: smooth}body{font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;background-color: var(--bg-main);color: var(--text-primary);line-height: 1.6;transition: background-color 0.3s ease,color 0.3s ease;min-height: 100vh}a{color: var(--link-color);text-decoration: none;transition: color 0.3s ease}a:hover{color: var(--link-hover);text-decoration: underline}.container{max-width: 1200px;margin: 0 auto;padding: 0 15px;width: 100%}.container-fluid{width: 100%;padding: 0 15px;margin: 0 auto}.card{background: var(--card-bg);border-radius: 10px;box-shadow: var(--card-shadow);border: 1px solid var(--border-color);transition: all 0.3s ease;margin-bottom: 20px;overflow: hidden}.card:hover{box-shadow: var(--card-shadow-hover)}.card-header{padding: 15px 20px;border-bottom: 1px solid var(--border-color);font-weight: 600;background: var(--bg-light)}.card-body{padding: 20px}.card-footer{padding: 15px 20px;border-top: 1px solid var(--border-color);background: var(--bg-light)}.card-title{font-size: 18px;font-weight: 600;margin-bottom: 10px}.btn{display: inline-flex;align-items: center;justify-content: center;font-weight: 500;padding: 10px 20px;font-size: 14px;line-height: 1.5;border-radius: 6px;border: 1px solid transparent;transition: all 0.3s ease;cursor: pointer;gap: 8px}.btn-primary{background-color: var(--button-primary-bg);color: var(--button-primary-text);border-color: var(--button-primary-border)}.btn-primary:hover{background-color: var(--button-primary-hover);transform: translateY(-1px);box-shadow: var(--shadow-primary);color: var(--button-primary-text);text-decoration: none}.btn-secondary{background-color: #6C757D;color: #FFFFFF;border-color: #6C757D}.btn-secondary:hover{background-color: #5A6268;transform: translateY(-1px);color: #FFFFFF;text-decoration: none}.btn-success{background-color: #28A745;color: #FFFFFF;border-color: #28A745}.btn-success:hover{background-color: #218838;transform: translateY(-1px);color: #FFFFFF;text-decoration: none}.btn-danger{background-color: #DC3545;color: #FFFFFF;border-color: #DC3545}.btn-danger:hover{background-color: #C82333;transform: translateY(-1px);color: #FFFFFF;text-decoration: none}.btn-sm{padding: 5px 12px;font-size: 12px;border-radius: 4px}.btn-lg{padding: 15px 30px;font-size: 16px;border-radius: 8px}.btn-block{display: flex;width: 100%}.form-group{margin-bottom: 20px}.form-label{display: inline-block;margin-bottom: 8px;font-weight: 500}.form-control{display: block;width: 100%;padding: 10px 15px;font-size: 14px;line-height: 1.5;color: var(--input-text);background-color: var(--input-bg);border: 1px solid var(--input-border);border-radius: 6px;transition: border-color 0.15s ease-in-out,box-shadow 0.15s ease-in-out}.form-control:focus{border-color: var(--input-border-focus);outline: 0;box-shadow: 0 0 0 3px rgba(74,108,247,0.15)}.table{width: 100%;margin-bottom: 20px;border-collapse: collapse}.table th,.table td{padding: 12px 15px;border-top: 1px solid var(--border-color)}.table thead th{border-bottom: 2px solid var(--border-color);background: var(--bg-light);font-weight: 600}.table-striped tbody tr:nth-of-type(odd){background: var(--bg-light)}.table-responsive{overflow-x: auto}.alert{padding: 15px 20px;margin-bottom: 20px;border-radius: 6px}.alert-success{color: #155724;background: #d4edda;border-color: #c3e6cb}.alert-danger{color: #721c24;background: #f8d7da;border-color: #f5c6cb}.alert-warning{color: #856404;background: #fff3cd;border-color: #ffeeba}.alert-info{color: #0c5460;background: #d1ecf1;border-color: #bee5eb}.badge{display: inline-block;padding: 4px 10px;font-size: 12px;font-weight: 600;border-radius: 50px}.badge-primary{background: var(--primary-color);color: #fff}.badge-success{background: #28A745;color: #fff}.badge-danger{background: #DC3545;color: #fff}.badge-warning{background: #FFC107;color: #212529}.text-center{text-align: center}.text-left{text-align: left}.text-right{text-align: right}.text-primary{color: var(--primary-color)}.text-secondary{color: var(--text-secondary)}.text-success{color: #28A745}.text-danger{color: #DC3545}.text-muted{color: var(--text-muted)}.bg-primary{background: var(--primary-color);color: #fff}.bg-light{background: var(--bg-light)}.bg-white{background: var(--bg-white)}.d-flex{display: flex}.flex-wrap{flex-wrap: wrap}.justify-content-center{justify-content: center}.justify-content-between{justify-content: space-between}.align-items-center{align-items: center}.gap-1{gap: 5px}.gap-2{gap: 10px}.gap-3{gap: 20px}.mt-1{margin-top: 5px}.mt-2{margin-top: 10px}.mt-3{margin-top: 20px}.mt-4{margin-top: 30px}.mb-1{margin-bottom: 5px}.mb-2{margin-bottom: 10px}.mb-3{margin-bottom: 20px}.mb-4{margin-bottom: 30px}.p-1{padding: 5px}.p-2{padding: 10px}.p-3{padding: 20px}.w-100{width: 100%}.shadow{box-shadow: var(--shadow-md)}.shadow-sm{box-shadow: var(--shadow-sm)}.rounded{border-radius: 6px}.navbar{background: var(--bg-white);border-bottom: 1px solid var(--border-color);padding: 10px 0;margin-bottom: 20px;box-shadow: var(--shadow-sm);position: sticky;top: 0;z-index: 1000}.navbar .container{display: flex;align-items: center;justify-content: space-between}.navbar-brand{font-size: 20px;font-weight: 700;color: var(--primary-color)}.navbar-nav{display: flex;list-style: none;gap: 5px}.nav-link{padding: 8px 15px;color: var(--text-primary);border-radius: 6px}.nav-link:hover{color: var(--link-color);background: var(--bg-light);text-decoration: none}.nav-link.active{color: var(--link-color);background: var(--primary-light);font-weight: 600}