:root{--bg-page: #eceff3;--bg-card: #ffffff;--bg-header: #1f4e79;--bg-subtle: #f6f7f9;--text-main: #1a1a1a;--text-muted: #555555;--border: #d8dce3;--green: #2f9e44;--green-hover: #22863a;--blue: #2e8bc0;--blue-hover: #22719d;--red: #c0392b;--red-hover: #a93226;--gray-btn: #6c757d;--gray-btn-hover: #566068;--header-height: 36px;--input-height: 34px;--button-height: 34px;--radius: 6px;--gap: 8px}*{box-sizing:border-box}html,body,#root{margin:0;width:100%;height:100%;font-family:Segoe UI,Tahoma,Arial,sans-serif;color:var(--text-main);background:var(--bg-page)}button,input,select,textarea{font-family:inherit;font-size:13px}button,input,select,textarea{transition:border-color .15s ease,box-shadow .15s ease,background-color .15s ease}.page{min-height:100%;display:grid;place-items:center;padding:16px}.auth-form{width:min(100%,420px);display:grid;gap:10px;text-align:left;background:#fff;border:1px solid var(--border);border-radius:8px;padding:20px;box-shadow:0 10px 28px #00000014}.auth-form h1{margin:0 0 4px;color:var(--bg-header);font-size:24px;line-height:1.25;text-align:center}.auth-form input{height:var(--input-height);border:1px solid var(--border);border-radius:var(--radius);padding:0 10px}.auth-form label{font-size:12px;color:var(--text-muted);font-weight:600}.input-with-action{display:grid;grid-template-columns:1fr auto;align-items:center;border:1px solid var(--border);border-radius:var(--radius);background:#fff;overflow:hidden}.input-with-action input{border:0;border-radius:0}.input-action-btn{width:38px;height:var(--input-height);border:0;border-left:1px solid var(--border);background:#fff;color:var(--text-muted);cursor:pointer}.input-action-btn:hover{background:var(--bg-subtle)}.auth-form button{height:var(--button-height);border:0;border-radius:var(--radius);background:var(--green);color:#fff;cursor:pointer;font-weight:600}.auth-form button:hover{background:var(--green-hover)}.auth-form button:disabled{opacity:.7;cursor:not-allowed}.btn-loading-wrap{display:inline-flex;gap:8px;align-items:center;justify-content:center}.btn-spinner{width:14px;height:14px;border-radius:50%;border:2px solid rgba(255,255,255,.5);border-top-color:#fff;animation:spin .8s linear infinite}.inline-alert{display:flex;align-items:flex-start;gap:8px;border-radius:var(--radius);border:1px solid #f1b9b2;background:#fff3f1;color:#8b1e10;padding:8px 10px;font-size:12px}.inline-alert-icon{font-weight:700}.field input,.field select,.field textarea,.search-input,.auth-form input,.auth-form button,.btn,.tab-btn,.input-action-btn{border-radius:var(--radius)}.field input,.field select,.search-input,.auth-form input,.btn,.auth-form button{min-height:var(--input-height)}.field textarea{min-height:58px}button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,.input-with-action:focus-within{outline:2px solid #86b7fe;outline-offset:1px}.field input:hover,.field select:hover,.field textarea:hover,.search-input:hover,.auth-form input:hover,.input-with-action:hover{border-color:#b8c3d1}.sr-only{position:absolute;width:1px;height:1px;margin:-1px;padding:0;border:0;overflow:hidden;clip:rect(0,0,0,0)}.error{color:var(--red);margin:0}@media (max-width: 768px){.page{padding:14px}.auth-form{width:min(100%,420px);padding:16px;gap:8px}.auth-form h1{font-size:20px}}@media (max-width: 420px){.auth-form{padding:14px}.auth-form h1{font-size:18px}}.crm-page{width:100%;min-height:100%;overflow-x:hidden;overflow-y:auto;padding:10px;display:flex;flex-direction:column;gap:10px;background:var(--bg-page)}.crm-content{flex:1 1 auto;min-height:auto;display:grid;grid-template-rows:auto auto auto;gap:10px}.row-grid{min-height:auto;display:grid;gap:10px;align-items:start}.row-first{grid-template-columns:27% 23% 50%}.row-third{grid-template-columns:54% 46%}.card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);min-height:auto;display:flex;flex-direction:column;box-shadow:0 2px 8px #0000000d;transition:box-shadow .18s ease,transform .18s ease}.card:hover{box-shadow:0 8px 20px #00000014;transform:translateY(-1px)}.card-header{min-height:var(--header-height);background:var(--bg-header);color:#fff;display:flex;align-items:center;justify-content:space-between;padding:6px 10px;font-size:13px;font-weight:600;letter-spacing:.2px}.card-body{padding:10px;min-height:auto;flex:1}.topbar{background:#fff;border:1px solid var(--border);border-radius:var(--radius);padding:10px;display:grid;gap:8px;box-shadow:0 2px 8px #0000000d}.topbar-row{display:flex;justify-content:space-between;align-items:center;gap:8px}.topbar-title{margin:0;font-size:16px;color:var(--bg-header)}.topbar-left,.topbar-right{display:flex;align-items:center;gap:8px}.topbar-info{font-size:13px;color:var(--text-muted);margin:0}.search-wrap{position:relative;width:min(460px,100%);max-width:100%}.search-icon{position:absolute;left:8px;top:50%;transform:translateY(-50%);color:#7b8795;font-size:12px}.search-input{width:100%;height:var(--input-height);border:1px solid var(--border);border-radius:var(--radius);padding:0 56px 0 24px;transition:border-color .14s ease,box-shadow .14s ease}.search-input:focus{border-color:var(--blue);box-shadow:0 0 0 3px #2e72d226}.search-clear{position:absolute;right:8px;top:50%;transform:translateY(-50%);border:0;background:#eef3fa;color:#44536a;width:22px;height:22px;border-radius:999px;cursor:pointer}.search-spinner{position:absolute;right:36px;top:50%;width:14px;height:14px;margin-top:-7px;border:2px solid #d3deef;border-top-color:var(--blue);border-radius:50%;animation:spin .7s linear infinite}.btn{height:var(--button-height);border:0;border-radius:var(--radius);color:#fff;padding:0 10px;cursor:pointer;font-size:12px;white-space:nowrap;transition:transform .14s ease,filter .14s ease,box-shadow .14s ease}.btn:hover{filter:brightness(1.02);transform:translateY(-1px)}.btn:active{transform:translateY(0)}.btn.green{background:var(--green)}.btn.green:hover{background:var(--green-hover)}.btn.blue{background:var(--blue)}.btn.blue:hover{background:var(--blue-hover)}.btn.red{background:var(--red)}.btn.red:hover{background:var(--red-hover)}.btn.gray{background:var(--gray-btn)}.btn.gray:hover{background:var(--gray-btn-hover)}.btn.small{height:24px;font-size:11px;padding:0 8px}.upload-dropzone{width:100%;min-height:120px;border:2px dashed var(--brand-blue);border-radius:var(--radius-md);background:linear-gradient(180deg,#f8fbff,#f2f7ff);display:flex;flex-direction:column;justify-content:center;align-items:center;gap:6px;padding:12px;text-align:center;color:var(--muted);transition:border-color var(--transition),background var(--transition),transform var(--transition)}.upload-dropzone:hover{border-color:var(--brand-green);background:linear-gradient(180deg,#f8fffb,#eefcf5)}.upload-dropzone.is-dragging{border-color:var(--brand-green);background:linear-gradient(180deg,#f0fff7,#e3f9ec);transform:translateY(-1px)}.upload-cloud{font-size:22px;line-height:1}.upload-dropzone-title{font-weight:700;color:var(--text)}.upload-dropzone-sub{font-size:12px}.upload-selected-file{margin-top:10px;border:1px solid var(--line);border-radius:var(--radius-md);padding:10px;display:flex;justify-content:space-between;align-items:center;gap:10px}.upload-selected-meta{display:flex;align-items:center;gap:8px;min-width:0}.upload-file-icon{font-size:18px}.upload-file-name{font-weight:700;color:var(--text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:230px}.upload-file-size{font-size:12px;color:var(--muted)}.upload-image-preview-wrap{margin-top:10px;border:1px solid var(--line);border-radius:var(--radius-md);overflow:hidden;background:#fafcfe}.upload-image-preview{width:100%;max-height:160px;object-fit:contain;display:block}.upload-progress-wrap{margin-top:10px}.upload-progress-label{display:flex;justify-content:space-between;align-items:center;font-size:12px;color:var(--muted);margin-bottom:6px}.upload-progress-track{width:100%;height:8px;border-radius:999px;background:#e6ecf5;overflow:hidden}.upload-progress-fill{height:100%;background:linear-gradient(90deg,var(--brand-blue),var(--brand-green));transition:width .22s ease}.upload-error-msg{margin:10px 0 0;color:var(--danger);font-size:12px;font-weight:700}.upload-success-msg{margin:10px 0 0;color:var(--brand-green);font-size:12px;font-weight:700}.files-empty-state{border:1px dashed var(--line);border-radius:var(--radius-md);padding:16px;text-align:center;color:var(--muted);margin-bottom:10px;background:#fbfcfe}.files-empty-icon{font-size:22px;line-height:1;margin-bottom:8px}.files-empty-title{margin:0;color:var(--text);font-weight:700}.files-empty-sub{margin:6px 0 0;font-size:12px}.file-row-actions{display:inline-flex;align-items:center;gap:6px}.user-badge{font-size:11px;color:var(--text-muted);padding:2px 6px;background:var(--bg-subtle);border:1px solid var(--border);border-radius:3px}.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:10px}.field{display:grid;gap:4px}.field label{font-size:12px;color:var(--text-muted);font-weight:600}.error-inline{color:var(--red);font-size:11px}.field input,.field select,.field textarea{height:var(--input-height);border:1px solid var(--border);border-radius:var(--radius);padding:0 8px;background:#fff}.field input:focus,.field select:focus,.field textarea:focus,.btn:focus-visible,.tab-btn:focus-visible,.search-clear:focus-visible,.toast-close:focus-visible{outline:2px solid var(--blue);outline-offset:2px}.field textarea{resize:none;min-height:78px;height:auto;padding:6px 8px}.req:after{content:" *";color:var(--red)}.section-scroll{min-height:auto;overflow:visible;border:1px solid var(--border);border-radius:4px;background:#fff}.section-scroll>.data-table,.section-scroll>table{width:100%}.data-table{width:100%;border-collapse:collapse;font-size:12px}.data-table th,.data-table td{border-bottom:1px solid #e7eaef;padding:6px 8px;text-align:left;min-height:30px;vertical-align:middle}.data-table th{position:sticky;top:0;background:#f3f5f9;z-index:1}.row-selected{background:#eaf3ff}.status-green{color:#1e7e34;font-weight:600}.status-orange{color:#c77700;font-weight:600}.status-red{color:#b22222;font-weight:600}.empty{margin:0;padding:12px;font-size:12px;color:var(--text-muted)}.tabs{display:flex;gap:4px;border-bottom:1px solid var(--border);margin-bottom:10px}.tab-btn{height:24px;border:1px solid var(--border);border-bottom:0;background:#f6f8fb;border-radius:4px 4px 0 0;padding:0 8px;font-size:11px;cursor:pointer;transition:background .14s ease,transform .14s ease}.tab-btn:hover{background:#edf1f8;transform:translateY(-1px)}.tab-btn.active{background:#fff;font-weight:600}.passport-preview{border:1px dashed #b9c0cb;border-radius:var(--radius);min-height:72px;display:grid;place-items:center;font-size:11px;color:var(--text-muted);margin-top:10px}.file-meta{margin-top:4px;font-size:11px;color:var(--text-muted)}.bottom-bar{background:#fff;border:1px solid var(--border);border-radius:var(--radius);min-height:46px;display:flex;justify-content:space-between;align-items:center;padding:8px 10px;flex-shrink:0;position:sticky;bottom:8px;z-index:20;box-shadow:0 2px 10px #00000014}.bottom-info{font-size:11px;color:var(--text-muted);display:flex;gap:12px;align-items:center;flex-wrap:wrap}.bottom-actions{display:flex;gap:8px;margin-left:auto;justify-content:flex-end;align-items:center}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#00000059;display:grid;place-items:center;z-index:1000;animation:fadeIn .16s ease}.modal{width:min(760px,94vw);max-height:90vh;overflow:auto;background:#fff;border:1px solid var(--border);border-radius:6px;animation:modalIn .18s ease}.modal-head{height:32px;background:var(--bg-header);color:#fff;display:flex;align-items:center;justify-content:space-between;padding:0 8px;font-size:12px;font-weight:600}.modal-body{padding:8px}.modal-actions{padding:8px;border-top:1px solid var(--border);display:flex;justify-content:flex-end;gap:6px}.toast-wrap{position:fixed;right:8px;top:8px;display:grid;gap:6px;z-index:1100;width:min(92vw,380px)}.toast{width:100%;padding:8px 10px;border-radius:4px;border:1px solid var(--border);font-size:12px;background:#fff;display:flex;align-items:flex-start;gap:8px;box-shadow:0 8px 20px #0c182629;animation:toastIn .2s ease}.toast.info{border-left:3px solid var(--blue)}.toast.error{border-left:3px solid var(--red)}.toast.success{border-left:3px solid var(--green)}.toast.warning{border-left:3px solid #f0a500}.toast-icon{width:18px;height:18px;margin-top:1px;border-radius:999px;background:#eef3fa;display:grid;place-items:center;font-size:11px;font-weight:700}.toast-content{min-width:0;flex:1}.toast-title{margin:0;font-weight:700;color:#1f2e3f}.toast-message{margin:2px 0 0;color:#4a5a70}.toast-close{border:0;background:transparent;color:#6e7b8d;cursor:pointer;font-size:16px;line-height:1}.loading-overlay{position:absolute;top:0;right:0;bottom:0;left:0;background:#ffffffa6;display:grid;place-items:center;font-size:12px;-webkit-backdrop-filter:blur(1px);backdrop-filter:blur(1px)}.skeleton-stack{display:grid;gap:8px;margin-bottom:10px}.skeleton-line,.skeleton-block{border-radius:6px;background:linear-gradient(90deg,#ecf1f7 25%,#f5f8fc,#ecf1f7 65%);background-size:220% 100%;animation:shimmer 1.2s linear infinite}.skeleton-line{height:14px}.skeleton-block{height:64px}.skeleton-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}@keyframes shimmer{0%{background-position:100% 0}to{background-position:-120% 0}}@keyframes spin{to{transform:rotate(360deg)}}@keyframes toastIn{0%{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes modalIn{0%{opacity:0;transform:translateY(6px) scale(.99)}to{opacity:1;transform:translateY(0) scale(1)}}@media (max-width: 1500px){.row-first{grid-template-columns:30% 24% minmax(0,46%)}.search-wrap{width:320px}}@media (max-width: 1200px){.crm-page{padding:8px}.topbar-row{flex-direction:column;align-items:stretch}.topbar-left,.topbar-right{flex-wrap:wrap}.row-first,.row-third{grid-template-columns:1fr}.bottom-bar{flex-direction:column;align-items:stretch;gap:8px}.bottom-actions{width:100%}.bottom-actions .btn{flex:1 1 0}}@media (max-width: 768px){.topbar,.card-body{padding:8px}.grid-2{grid-template-columns:1fr}.search-wrap{width:100%}.skeleton-grid{grid-template-columns:1fr}}.admin-page{gap:10px}.admin-tab-row{display:flex;gap:8px;flex-wrap:wrap}.admin-dashboard-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.admin-dashboard-card{border:1px solid var(--border);border-radius:var(--radius);padding:10px;background:#fff}.admin-card-label{margin:0 0 6px;font-size:12px;color:var(--text-muted)}.admin-card-value{margin:0;font-size:22px;font-weight:700;color:var(--bg-header)}.admin-users-toolbar{display:grid;grid-template-columns:minmax(220px,1fr) 180px 180px auto auto;gap:8px;align-items:center;margin-bottom:10px}.admin-users-toolbar select,.admin-users-toolbar input{height:var(--input-height);border:1px solid var(--border);border-radius:var(--radius);padding:0 8px;background:#fff}.admin-users-skeleton{display:grid;gap:8px}.admin-users-pagination{margin-top:10px;display:flex;gap:8px;align-items:center;justify-content:flex-end;flex-wrap:wrap}.badge{display:inline-flex;align-items:center;justify-content:center;padding:2px 8px;border-radius:999px;font-size:11px;font-weight:700}.badge.role.admin{background:#e5f0ff;color:#1f4f96}.badge.role.staff{background:#eff2f6;color:#344357}.badge.status.active{background:#e8f7ee;color:#166a3a}.badge.status.inactive{background:#fbecee;color:#982c3a}.admin-user-form{display:grid;gap:6px}.admin-user-form label{font-size:12px;color:var(--text-muted);font-weight:600}.admin-user-form input,.admin-user-form select{height:var(--input-height);border:1px solid var(--border);border-radius:var(--radius);padding:0 8px;background:#fff}.admin-subsection-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.admin-subsection-card{border:1px solid var(--border);border-radius:var(--radius);padding:10px;background:#fff;min-height:110px}.admin-subtitle{margin:0 0 8px;font-size:13px;color:var(--bg-header)}.admin-mini-list{list-style:none;margin:0;padding:0;display:grid;gap:6px}.admin-mini-list li{display:flex;justify-content:space-between;gap:8px;border-bottom:1px solid #eef2f7;padding-bottom:4px;font-size:12px}.admin-mini-list li span{color:var(--text-muted);white-space:nowrap}.admin-system-indicators{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}.inline-checkbox{display:inline-flex;align-items:center;gap:6px}.inline-checkbox input{width:16px;height:16px}@media (max-width: 1200px){.admin-dashboard-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}@media (max-width: 900px){.admin-dashboard-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.admin-users-toolbar{grid-template-columns:1fr 1fr}.admin-subsection-grid{grid-template-columns:1fr}}@media (max-width: 640px){.admin-dashboard-grid{grid-template-columns:1fr}.admin-tab-row .btn{width:100%}.admin-users-toolbar{grid-template-columns:1fr}.admin-users-pagination{justify-content:flex-start}}