*,*:before,*:after{box-sizing:border-box}*{margin:0;padding:0}html{font-family:var(--font-family-sans);scroll-behavior:smooth;height:100%}body{line-height:1.5;-webkit-font-smoothing:antialiased;min-height:100vh;background-color:var(--color-gray-50);color:var(--color-gray-800)}img,picture,video,canvas,svg{display:block;max-width:100%}input,button,textarea,select{font:inherit}button{background:none;border:none;cursor:pointer;padding:0}ul,ol{list-style:none}a{text-decoration:none;color:inherit}h1,h2,h3,h4,h5,h6{overflow-wrap:break-word;font-weight:var(--font-weight-bold)}:root{--color-primary-dark: #1E3A8A;--color-primary: #3B82F6;--color-primary-light: #DBEAFE;--color-white: #FFFFFF;--color-gray-50: #F9FAFB;--color-gray-100: #F3F4F6;--color-gray-200: #E5E7EB;--color-gray-300: #D1D5DB;--color-gray-400: #9CA3AF;--color-gray-500: #6B7280;--color-gray-600: #4B5563;--color-gray-700: #374151;--color-gray-800: #1F2937;--color-black: #000000;--color-success: #10B981;--color-warning: #F59E0B;--color-error: #EF4444;--color-info: #06B6D4;--font-family-sans: "Inter", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;--font-weight-regular: 400;--font-weight-medium: 500;--font-weight-semibold: 600;--font-weight-bold: 700;--font-size-xs: 12px;--font-size-sm: 14px;--font-size-base: 16px;--font-size-lg: 18px;--font-size-xl: 20px;--font-size-2xl: 24px;--font-size-3xl: 32px;--font-size-4xl: 48px;--spacing-1: 4px;--spacing-2: 8px;--spacing-4: 16px;--spacing-6: 24px;--spacing-8: 32px;--spacing-12: 48px;--spacing-16: 64px;--radius-sm: 4px;--radius-md: 6px;--radius-lg: 8px;--radius-xl: 12px;--radius-2xl: 16px;--radius-full: 9999px;--shadow-sm: 0 1px 2px 0 rgb(0 0 0 / .05);--shadow-md: 0 4px 6px -1px rgb(0 0 0 / .1), 0 2px 4px -2px 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);--shadow-xl: 0 20px 25px -5px rgb(0 0 0 / .1), 0 8px 10px -6px rgb(0 0 0 / .1);--transition-fast: .15s ease-in-out;--transition-normal: .3s ease-in-out}.btn{display:inline-flex;align-items:center;justify-content:center;border-radius:var(--radius-md);font-weight:var(--font-weight-medium);transition:all var(--transition-fast);cursor:pointer;border:1px solid transparent;text-decoration:none;gap:var(--spacing-2)}.btn:disabled{opacity:.6;cursor:not-allowed}.btn-primary{background-color:var(--color-primary);color:var(--color-white)}.btn-primary:hover:not(:disabled){background-color:var(--color-primary-dark)}.btn-secondary{background-color:var(--color-white);border-color:var(--color-gray-300);color:var(--color-gray-700)}.btn-secondary:hover:not(:disabled){background-color:var(--color-gray-50);border-color:var(--color-gray-400)}.btn-danger{background-color:var(--color-error);color:var(--color-white)}.btn-danger:hover:not(:disabled){filter:brightness(.9)}.btn-ghost{background-color:transparent;color:var(--color-gray-600)}.btn-ghost:hover:not(:disabled){background-color:var(--color-gray-100);color:var(--color-gray-900)}.btn-sm{padding:var(--spacing-1) var(--spacing-2);font-size:var(--font-size-xs)}.btn-md{padding:var(--spacing-2) var(--spacing-4);font-size:var(--font-size-sm)}.btn-lg{padding:var(--spacing-4) var(--spacing-6);font-size:var(--font-size-base)}.form-group{display:flex;flex-direction:column;gap:var(--spacing-1);margin-bottom:var(--spacing-4);position:relative}.label{font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);color:var(--color-gray-700)}.input-field,.textarea-field,.select-dropdown{width:100%;padding:var(--spacing-2) var(--spacing-4);border:1px solid var(--color-gray-300);border-radius:var(--radius-md);font-size:var(--font-size-base);background-color:var(--color-white);color:var(--color-gray-900);transition:border-color var(--transition-fast),box-shadow var(--transition-fast)}.input-field:focus,.textarea-field:focus,.select-dropdown:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 3px var(--color-primary-light)}.input-field:disabled,.textarea-field:disabled,.select-dropdown:disabled{background-color:var(--color-gray-100);cursor:not-allowed}.input-error{border-color:var(--color-error)}.input-error:focus{box-shadow:0 0 0 3px #ef444433}.floating-label-group{position:relative;margin-top:var(--spacing-6)}.floating-label-group .input-field:placeholder-shown+.floating-label{transform:translateY(0);font-size:var(--font-size-base);color:var(--color-gray-500)}.floating-label-group .floating-label{position:absolute;left:var(--spacing-4);top:0;transform:translateY(-24px);font-size:var(--font-size-xs);color:var(--color-primary);background-color:var(--color-white);padding:0 var(--spacing-1);transition:all var(--transition-fast);pointer-events:none}.card{background-color:var(--color-white);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);border:1px solid var(--color-gray-200);overflow:hidden;display:flex;flex-direction:column}.card-header{padding:var(--spacing-4);border-bottom:1px solid var(--color-gray-100);font-weight:var(--font-weight-semibold);font-size:var(--font-size-lg)}.card-body{padding:var(--spacing-4);flex-grow:1}.card-footer{padding:var(--spacing-4);background-color:var(--color-gray-50);border-top:1px solid var(--color-gray-100);display:flex;justify-content:flex-end;gap:var(--spacing-2)}.badge{display:inline-flex;align-items:center;padding:2px var(--spacing-2);border-radius:var(--radius-full);font-size:var(--font-size-xs);font-weight:var(--font-weight-medium);line-height:1}.badge-success{background-color:#10b9811a;color:var(--color-success)}.badge-warning{background-color:#f59e0b1a;color:var(--color-warning)}.badge-error{background-color:#ef44441a;color:var(--color-error)}.badge-info{background-color:#06b6d41a;color:var(--color-info)}.table-container{overflow-x:auto;border-radius:var(--radius-lg);border:1px solid var(--color-gray-200)}.table{width:100%;border-collapse:collapse;text-align:left;font-size:var(--font-size-sm)}.table-header{background-color:var(--color-gray-50);color:var(--color-gray-600);font-weight:var(--font-weight-medium);text-transform:uppercase;font-size:var(--font-size-xs);letter-spacing:.05em}.table th,.table td{padding:var(--spacing-4);border-bottom:1px solid var(--color-gray-200)}.table-row:hover{background-color:var(--color-gray-50)}.table-row:last-child td{border-bottom:none}@media (max-width: 1024px){.table-responsive .table-header{display:none}.table-responsive .table-row{display:grid;grid-template-columns:1fr;margin-bottom:var(--spacing-4);border:1px solid var(--color-gray-200);border-radius:var(--radius-lg);background:var(--color-white);padding:var(--spacing-4);box-shadow:var(--shadow-sm)}.table-responsive .table-cell{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--color-gray-100);padding:var(--spacing-3) 0;text-align:right}.table-responsive .table-cell:last-child{border-bottom:none}.table-responsive .table-cell:before{content:attr(data-label);font-weight:var(--font-weight-semibold);text-align:left;color:var(--color-gray-600);margin-right:var(--spacing-4);font-size:var(--font-size-xs);text-transform:uppercase}.table-responsive .actions-cell{justify-content:center;gap:var(--spacing-4);padding-top:var(--spacing-4)}}.modal-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#00000080;display:flex;align-items:center;justify-content:center;z-index:50;opacity:0;pointer-events:none;transition:opacity var(--transition-normal)}.modal-overlay.open{opacity:1;pointer-events:auto}.modal-container{background-color:var(--color-white);border-radius:var(--radius-xl);box-shadow:var(--shadow-xl);width:95%;margin:20px;max-width:800px;max-height:90vh;overflow-y:auto;transform:translateY(20px);transition:transform var(--transition-normal)}.modal-overlay.open .modal-container{transform:translateY(0)}.modal-header{padding:var(--spacing-4);border-bottom:1px solid var(--color-gray-200);display:flex;justify-content:space-between;align-items:center}.close-modal-btn{width:auto!important;min-width:unset!important;padding:8px!important;font-size:1.5rem!important;line-height:1!important;border:none!important}.modal-title{font-size:var(--font-size-xl);font-weight:var(--font-weight-semibold)}.modal-body{padding:var(--spacing-6)}.modal-footer{padding:var(--spacing-4);border-top:1px solid var(--color-gray-200);display:flex;justify-content:flex-end;gap:var(--spacing-4)}.toast-container{position:fixed;top:var(--spacing-4);right:var(--spacing-4);display:flex;flex-direction:column;gap:var(--spacing-2);z-index:99}.toast{display:flex;align-items:center;padding:12px 24px;border-radius:12px;background:#ffffffe6;backdrop-filter:blur(10px);box-shadow:0 10px 15px -3px #0000001a,0 4px 6px -2px #0000000d;min-width:320px;border:1px solid rgba(255,255,255,.3);border-left:5px solid transparent;animation:toastSlideIn .4s cubic-bezier(.16,1,.3,1) forwards;font-size:.95rem;font-weight:500;color:#1e293b;margin-bottom:8px}@keyframes toastSlideIn{0%{opacity:0;transform:translate(20px) scale(.95)}to{opacity:1;transform:translate(0) scale(1)}}.toast-success{border-left-color:var(--color-success)}.toast-error{border-left-color:var(--color-error)}.toast-info{border-left-color:var(--color-info)}.toast-warning{border-left-color:var(--color-warning)}.spinner-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#fffc;display:flex;align-items:center;justify-content:center;z-index:100;flex-direction:column;gap:var(--spacing-4)}.spinner{width:48px;height:48px;border:5px solid var(--color-gray-200);border-bottom-color:var(--color-primary);border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@media (max-width: 640px){.btn:not(.btn-sm):not(.close-modal-btn){width:100%}.card-footer{flex-direction:column}.table-responsive .table-header{display:none}.table-responsive .table-row{display:block;margin-bottom:var(--spacing-4);border:1px solid var(--color-gray-200);border-radius:var(--radius-md);background:var(--color-white);padding:var(--spacing-4)}.table-responsive .table-cell{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--color-gray-100);padding:var(--spacing-2) 0;text-align:right}.table-responsive .table-cell:last-child{border-bottom:none}.table-responsive .table-cell:before{content:attr(data-label);font-weight:var(--font-weight-medium);text-align:left;color:var(--color-gray-600);margin-right:var(--spacing-4)}.header-nav{display:none;width:100%;flex-direction:column;position:absolute;top:100%;left:0;background:var(--color-white);border-bottom:1px solid var(--color-gray-200);padding:var(--spacing-4)}.header-nav.open{display:flex}.header-hamburger{display:block!important}}.skeleton-row .table-cell{padding:var(--spacing-4)}.skeleton-text{height:16px;background:#e2e8f0;border-radius:4px;width:80%;animation:shimmer 1.5s infinite linear;background:linear-gradient(to right,#e2e8f0 4%,#cbd5e1 25%,#e2e8f0 36%);background-size:1000px 100%}.skeleton-card{border:1px solid var(--color-gray-200);padding:var(--spacing-4);display:flex;align-items:center;gap:var(--spacing-4)}.skeleton-icon{width:48px;height:48px;border-radius:50%;background:#e2e8f0;animation:shimmer 1.5s infinite linear;background:linear-gradient(to right,#e2e8f0 4%,#cbd5e1 25%,#e2e8f0 36%);background-size:1000px 100%}.skeleton-content{flex:1;display:flex;flex-direction:column;gap:8px}.skeleton-title{height:20px;width:60%;background:#e2e8f0;border-radius:4px;animation:shimmer 1.5s infinite linear;background:linear-gradient(to right,#e2e8f0 4%,#cbd5e1 25%,#e2e8f0 36%);background-size:1000px 100%}.skeleton-subtitle{height:14px;width:40%;background:#e2e8f0;border-radius:4px;animation:shimmer 1.5s infinite linear;background:linear-gradient(to right,#e2e8f0 4%,#cbd5e1 25%,#e2e8f0 36%);background-size:1000px 100%}@keyframes shimmer{0%{background-position:-1000px 0}to{background-position:1000px 0}}.empty-state{text-align:center;padding:var(--spacing-12);color:var(--color-gray-500);display:flex;flex-direction:column;align-items:center;gap:var(--spacing-4)}.empty-state-icon{font-size:48px;color:var(--color-gray-300);margin-bottom:var(--spacing-2)}.empty-state h3{font-size:var(--font-size-lg);font-weight:var(--font-weight-semibold);color:var(--color-gray-700)}.empty-state p{max-width:400px;font-size:var(--font-size-sm);margin:0 auto}
