:root{--color-primary: #2229B5;--color-secondary: #64748b;--color-tertiary: #e2e8f0;--color-main: #2229B5;--color-background: #f5f7fa;--color-danger: #c53030;--color-danger-hover: #9b2c2c;--color-success: #15803d;--color-warning: #b45309;--color-text: #1f2937;--color-muted: #6b7280;--color-border: #e5e7eb;--color-primary-hover: color-mix(in srgb, var(--color-primary) 85%, black);--color-secondary-hover: color-mix(in srgb, var(--color-secondary) 85%, black);--color-primary-soft: color-mix(in srgb, var(--color-primary) 10%, white)}*{box-sizing:border-box;margin:0;padding:0;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif}html{background:#dbe2ec}body{min-height:100vh;background:linear-gradient(135deg,#f5f7fa,#c3cfe2);background-attachment:fixed;padding:0;overflow-x:hidden;color:var(--color-text)}.page{max-width:1200px;margin:0 auto;padding:30px 20px 60px}@media (max-width: 1360px){.page{padding-left:100px}}@media (max-width: 768px){.page{padding:10px 12px 40px}}.page-header{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:20px;padding-bottom:12px;border-bottom:2px solid #e5e7eb}.page-header h1{font-size:26px;color:#1f2937}.page-header .subtitle{color:var(--color-muted);font-size:14px;margin-top:4px}.page-actions{display:flex;gap:8px;flex-wrap:wrap}.card{background:#fff;border:1px solid #e5e7eb;border-radius:10px;box-shadow:0 2px 6px #0000000f;padding:20px;margin-bottom:20px}.card h2{font-size:18px;margin-bottom:14px;color:#1f2937}.loading{text-align:center;padding:40px;font-size:16px;color:#666}.empty{text-align:center;padding:30px;color:var(--color-muted)}.alert{padding:12px 14px;border-radius:8px;margin-bottom:16px;font-size:14px;line-height:1.45}.alert ul{margin:6px 0 0 20px}.alert-error{background:#fef2f2;color:#991b1b;border:1px solid #fecaca}.alert-warning{background:#fffbeb;color:#92400e;border:1px solid #fde68a}.alert-success{background:#f0fdf4;color:#166534;border:1px solid #bbf7d0}.alert-info{background:var(--color-primary-soft);color:#1e1b4b;border:1px solid color-mix(in srgb,var(--color-primary) 25%,white)}.btn{padding:10px 18px;border:1px solid transparent;border-radius:6px;cursor:pointer;font-size:14px;font-weight:600;transition:background-color .2s ease,opacity .2s ease;text-decoration:none;display:inline-flex;align-items:center;justify-content:center;gap:6px;white-space:nowrap}.btn:disabled{opacity:.55;cursor:not-allowed}.btn-primary{background:var(--color-primary);color:#fff}.btn-primary:hover:not(:disabled){background:var(--color-primary-hover)}.btn-secondary{background:#fff;color:#374151;border-color:#d1d5db}.btn-secondary:hover:not(:disabled){background:#f3f4f6}.btn-success{background:var(--color-success);color:#fff}.btn-success:hover:not(:disabled){background:#166534}.btn-danger{background:var(--color-danger);color:#fff}.btn-danger:hover:not(:disabled){background:var(--color-danger-hover)}.btn-link{background:none;border:none;color:var(--color-primary);padding:4px 6px;font-weight:600}.btn-link:hover:not(:disabled){text-decoration:underline}.btn-lg{padding:14px 24px;font-size:16px}.btn-sm{padding:6px 10px;font-size:13px}.table-wrapper{overflow-x:auto;background:#fff;border:1px solid #e5e7eb;border-radius:10px}.table{width:100%;border-collapse:collapse;font-size:14px}.table th,.table td{padding:10px 12px;text-align:left;border-bottom:1px solid #f1f5f9;vertical-align:top}.table th{background:#f8fafc;color:#475569;font-weight:600;font-size:13px;white-space:nowrap}.table tr.clickable{cursor:pointer}.table tr.clickable:hover td{background:var(--color-primary-soft)}.table tr.inactive td{color:#9ca3af}.table .actions{white-space:nowrap;text-align:right}.muted{color:var(--color-muted);font-size:13px}.nowrap{white-space:nowrap}.filters{display:flex;gap:10px;flex-wrap:wrap;align-items:flex-end;margin-bottom:16px}.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 18px}.form-grid .full{grid-column:1 / -1}@media (max-width: 640px){.form-grid{grid-template-columns:1fr}}.field{display:flex;flex-direction:column;gap:5px}.field label{font-size:13px;font-weight:600;color:#374151}.field .required:after{content:" *";color:var(--color-danger)}.field .hint{font-size:12px;color:var(--color-muted)}.field .warning{font-size:12px;color:var(--color-warning)}input[type=text],input[type=email],input[type=tel],input[type=number],input[type=date],input[type=password],input[type=search],select,textarea{width:100%;padding:9px 11px;border:1px solid #d1d5db;border-radius:6px;font-size:14px;background:#fff;color:#111827}textarea{resize:vertical;min-height:64px}input:focus,select:focus,textarea:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 3px color-mix(in srgb,var(--color-primary) 18%,transparent)}.checkbox{display:flex;align-items:center;gap:8px;font-size:14px;cursor:pointer}.checkbox input{width:16px;height:16px}.form-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:20px;flex-wrap:wrap}.badge{display:inline-block;padding:3px 9px;border-radius:12px;font-size:12px;font-weight:700;white-space:nowrap}.badge-status-1{background:#f3f4f6;color:#374151}.badge-status-2{background:#dbeafe;color:#1e40af}.badge-status-3{background:#dcfce7;color:#166534}.badge-status-4{background:#fee2e2;color:#991b1b}.badge-neutral{background:#f1f5f9;color:#475569}.modal-backdrop{position:fixed;inset:0;background:#0f172a80;z-index:1100;display:flex;align-items:flex-start;justify-content:center;padding:40px 12px;overflow-y:auto}.modal{background:#fff;border-radius:12px;width:100%;max-width:640px;padding:24px;box-shadow:0 25px 60px #00000040}.modal h2{font-size:20px;margin-bottom:16px}.pagination{display:flex;justify-content:space-between;align-items:center;margin-top:12px;font-size:14px;color:var(--color-muted)}.field .field-label{font-size:13px;font-weight:600;color:#374151}
