.login-container{min-height:100vh;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#667eea,#764ba2);font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;padding:20px}.login-card{background:#fff;border-radius:12px;box-shadow:0 20px 60px #0000004d;max-width:400px;width:100%;padding:40px 30px;animation:slideUp .5s ease-out}@keyframes slideUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}.login-header{text-align:center;margin-bottom:30px}.login-header h1{font-size:28px;color:#333;margin:0 0 5px;font-weight:700}.login-header p{color:#666;font-size:13px;margin:0}.login-form h2{font-size:22px;color:#333;margin:0 0 10px}.login-form>p{color:#999;font-size:13px;margin-bottom:20px}.login-form input,.login-form select{width:100%;padding:12px 15px;margin-bottom:15px;border:1px solid #ddd;border-radius:6px;font-size:14px;transition:all .3s;box-sizing:border-box}.login-form input:focus,.login-form select:focus{outline:none;border-color:#667eea;box-shadow:0 0 0 3px #667eea1a}.btn-primary{width:100%;padding:12px;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none;border-radius:6px;font-size:15px;font-weight:600;cursor:pointer;transition:all .3s;margin-top:10px}.btn-primary:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 10px 25px #667eea66}.btn-primary:disabled{opacity:.7;cursor:not-allowed}.error-message{background-color:#fee;color:#c33;padding:10px 15px;border-radius:6px;margin-bottom:15px;font-size:13px;border-left:4px solid #c33}.toggle-form{text-align:center;margin-top:15px;color:#666;font-size:13px}.toggle-form button{background:none;border:none;color:#667eea;cursor:pointer;font-weight:600;padding:0}.toggle-form button:hover{text-decoration:underline}@media (max-width: 480px){.login-card{padding:30px 20px}.login-header h1{font-size:24px}}.navbar{background:linear-gradient(180deg,#fff,#f6f9fe);border-bottom:1px solid #e8edf4;position:sticky;top:0;z-index:100}.navbar-container{max-width:1200px;margin:0 auto;padding:14px 18px;display:flex;align-items:center;justify-content:space-between}.navbar-brand h2{margin:0;font-size:22px;font-weight:800;color:#14213d}.navbar-subtitle{display:block;margin-top:2px;color:#6b7a8c;font-size:12px}.navbar-user{display:flex;align-items:center;gap:12px}.user-meta{color:#334155;font-size:14px}.btn-logout{display:inline-flex;align-items:center;gap:8px;padding:8px 12px;background:#fff;color:#0f172a;border:1px solid #e2e8f0;border-radius:10px;font-weight:600;cursor:pointer;transition:background .15s ease,border-color .15s ease}.btn-logout:hover{background:#f7fafc;border-color:#d6e1ea}.btn-logout svg{width:16px;height:16px}:root{--bg:#f4f7ff;--card:#fff;--primary:#4c6fff;--primary-600:#3f5ae6;--text:#0f172a;--muted:#5b6b86;--ring:#e7ecff;--success:#18b26b;--error:#ef4444}*{box-sizing:border-box}.acd-page{min-height:100vh;padding:24px 16px;background:radial-gradient(1200px 600px at 20% -10%,#eaf0ff 0%,transparent 70%),var(--bg);color:var(--text);display:flex;flex-direction:column;align-items:center}.acd-header{display:flex;align-items:center;gap:12px;margin-bottom:14px}.acd-header__icon{width:54px;height:54px;border-radius:14px;background:#eef2ff;border:1px solid var(--ring);display:grid;place-items:center;font-size:24px;color:var(--primary)}.acd-title{margin:0;font-size:24px;font-weight:800}.acd-subtitle{margin:4px 0 0;color:var(--muted);font-size:14px}.acd-card{width:min(980px,100%);background:var(--card);border:1px solid var(--ring);border-radius:16px;box-shadow:0 6px 24px #1c20440f;padding:20px}.acd-card__title{font-weight:700;margin-bottom:4px}.acd-card__subtitle{color:var(--muted);margin-bottom:12px}.acd-clock{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:8px}.acd-clock__box{display:flex;gap:14px;align-items:baseline;background:#f7f9ff;border:1px dashed #dfe6ff;border-radius:12px;padding:10px 14px}.acd-clock__time{font:700 18px/1 Menlo,Consolas,ui-monospace}.acd-clock__date{color:var(--muted);font-size:14px}.btn-edit{border:1px solid var(--ring);background:#fff;color:#111827;padding:8px 12px;border-radius:10px;cursor:pointer}.btn-edit:hover{background:#f8fafc}.edit-inline{display:flex;flex-wrap:wrap;gap:10px;margin:10px 0 6px}.edit-actions{display:flex;gap:8px}.btn-secondary{background:#eef2ff;border:1px solid var(--ring);border-radius:12px;padding:12px 16px;color:#111827;cursor:pointer}.input-datetime{width:260px;max-width:100%;padding:12px 14px;border-radius:12px;border:1px solid #dbe1f1;background:#fbfcff}.input-datetime:focus{border-color:#bfd0ff;box-shadow:0 0 0 4px #e9efff}.form-block{margin-top:10px}.label{font-size:14px;font-weight:600}.type-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin:8px 0 10px}.type-card{border:1px solid #e3e9ff;background:#f9fbff;border-radius:14px;padding:16px;display:flex;align-items:center;gap:12px;cursor:pointer;transition:.18s ease}.type-card:hover{transform:translateY(-1px);background:#f3f7ff}.type-card.active{background:#eef3ff;border-color:#c9d6ff;box-shadow:0 6px 16px #4c6fff26}.type-card__icon{font-size:22px}.type-card__title{font-weight:600}.btn-primary{background:var(--primary);color:#fff;border:none;border-radius:12px;padding:12px 16px;cursor:pointer;font-weight:700;letter-spacing:.2px}.btn-small{padding:8px 12px}.btn-full{width:100%}.alert{margin-top:12px;padding:10px 12px;border-radius:10px;font-size:14px;border:1px solid}.alert.success{color:#065f46;background:#ecfdf5;border-color:#bbf7d0}.alert.error{color:#991b1b;background:#fef2f2;border-color:#fecaca}.result{margin-top:16px;border:1px solid var(--ring);background:#fff;border-radius:14px;padding:16px;display:flex;align-items:center;justify-content:space-between;gap:16px}.result__meta{display:flex;flex-direction:column;gap:4px}.result__type{font-weight:700}.result__calc{color:var(--muted);font-size:13px}.result__value{font:800 40px/1 Menlo,Consolas,ui-monospace;color:var(--primary)}.result__note{color:var(--muted);font-size:12px}.note{margin-top:12px;padding:12px;border-radius:12px;border:1px dashed #d8e1ff;color:var(--muted);background:#fbfdff}@media (max-width:700px){.type-grid{grid-template-columns:1fr}.result{flex-direction:column;align-items:flex-start}}:root{--bg:#f7faff;--card:#fff;--ring:#e7ecff;--text:#0f172a;--muted:#5b6b86;--primary:#4c6fff;--primary-600:#3f5ae6;--success:#16a34a;--success-600:#15803d;--warning:#f59e0b;--warning-600:#d97706;--danger:#ef4444;--danger-600:#dc2626;--shadow:0 8px 24px rgba(15,23,42,.06)}.users-section{max-width:1120px;margin:0 auto}.users-bar{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}.users-title{margin:0;font-size:20px;font-weight:800}.users-sub{margin:4px 0 0;color:var(--muted);font-size:13px}.create-user-form{padding:14px;margin-bottom:14px}.form-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}.form-group{display:flex;flex-direction:column;gap:6px}.form-group label{font-size:12px;font-weight:700;color:#1f2937}.form-group input,.form-group select{padding:10px 12px;border:1px solid #dbe1f1;border-radius:10px;background:#fbfcff;outline:none}.form-group input:focus,.form-group select:focus{border-color:#bfd0ff;box-shadow:0 0 0 4px #e9efff}.form-actions{display:flex;gap:10px;margin-top:8px}.btn{border:1px solid transparent;border-radius:10px;padding:8px 12px;cursor:pointer;font-weight:700}.btn-primary{background:var(--primary);color:#fff;border-color:var(--primary-600)}.btn-primary:hover{background:var(--primary-600)}.btn-ghost{background:#fff;border:1px solid var(--ring)}.btn-ghost:hover{background:#f8fafc}.btn-success{background:var(--success);color:#fff;border-color:var(--success-600)}.btn-success:hover{background:var(--success-600)}.btn-warning{background:var(--warning);color:#111827;border-color:var(--warning-600)}.btn-warning:hover{background:var(--warning-600);color:#fff}.btn-danger{background:var(--danger);color:#fff;border-color:var(--danger-600)}.btn-danger:hover{background:var(--danger-600)}.table-wrap{background:var(--card);border:1px solid var(--ring);border-radius:14px;box-shadow:var(--shadow);overflow:auto}.users-table{width:100%;border-collapse:separate;border-spacing:0}.users-table th,.users-table td{padding:12px 14px;border-bottom:1px solid #eef2ff;white-space:nowrap}.users-table thead th{position:sticky;top:0;background:#f5f8ff;text-align:left;font-weight:700;color:#0f172a}.users-table tbody tr:hover{background:#fafcff}.users-table tbody tr:last-child td{border-bottom:none}.cell-user{display:flex;align-items:center;gap:10px;min-width:220px}.user-avatar{width:28px;height:28px;border-radius:8px;background:#eef2ff;border:1px solid var(--ring);display:grid;place-items:center;font-weight:800;color:#4c6fff}.user-avatar.lg{width:40px;height:40px;border-radius:10px}.user-name{font-weight:700}.badge{display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border-radius:999px;font-size:12px;font-weight:700;border:1px solid transparent}.badge-role{background:#eef2ff;border-color:#dfe6ff;color:#334155;text-transform:capitalize}.badge-status{text-transform:capitalize}.badge-status.active{background:#ecfdf5;border-color:#bbf7d0;color:#065f46}.badge-status.inactive{background:#fff7ed;border-color:#fed7aa;color:#9a3412}.actions{display:flex;gap:8px}.cards-grid{display:none;gap:12px}.user-card{padding:14px}.uc-head{display:flex;align-items:center;gap:10px;margin-bottom:6px}.uc-titles{flex:1;min-width:0}.uc-name{font-weight:800}.uc-email{color:var(--muted);font-size:13px;overflow:hidden;text-overflow:ellipsis}.uc-row{display:flex;align-items:center;justify-content:space-between;margin:6px 0}.uc-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:6px}@media (max-width:820px){.form-grid{grid-template-columns:1fr}}@media (max-width:700px){.table-wrap{display:none}.cards-grid{display:grid}}:root{--card:#fff;--ring:#e7ecff;--text:#0f172a;--muted:#5b6b86;--shadow:0 8px 24px rgba(15,23,42,.06);--pill:#111827;--pill-muted:#6b7280;--green:#16a34a;--red:#ef4444;--amber:#f59e0b;--blue:#4c6fff}.activity-section{max-width:1120px;margin:0 auto}.activity-header{margin-bottom:12px}.title{margin:0;font-size:20px;font-weight:800}.subtitle{margin:4px 0 0;color:var(--muted);font-size:13px}.alert{background:#f5f8ff;border:1px solid var(--ring);padding:10px 12px;border-radius:10px;margin-bottom:10px}.alert.error{background:#fef2f2;border-color:#fecaca;color:#991b1b}.table-card{background:var(--card);border:1px solid var(--ring);border-radius:16px;box-shadow:var(--shadow);overflow:auto}.activity-table{width:100%;border-collapse:separate;border-spacing:0}.activity-table th,.activity-table td{padding:12px 14px;border-bottom:1px solid #eef2ff;text-align:left;white-space:nowrap}.activity-table thead th{position:sticky;top:0;background:#f5f8ff;font-weight:700}.activity-table tbody tr:hover{background:#fafcff}.activity-table tbody tr:last-child td{border-bottom:none}.cell-email{min-width:240px}.cell-time{min-width:200px}.empty{padding:18px;text-align:center;color:var(--muted)}.badge{display:inline-flex;align-items:center;justify-content:center;height:24px;padding:0 10px;border-radius:999px;font-size:12px;font-weight:800;background:var(--pill);color:#fff;text-transform:capitalize}.action-login{background:var(--pill)}.action-logout{background:var(--pill-muted)}.action-created{background:var(--blue)}.action-deleted{background:var(--red)}.action-activated{background:var(--green)}.action-deactivated{background:var(--amber);color:#111827}.cards-grid{display:none;gap:12px;margin-top:12px}.card{background:var(--card);border:1px solid var(--ring);border-radius:14px;box-shadow:var(--shadow)}.activity-card{padding:12px}.row{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:6px 0;border-bottom:1px dashed #eef2ff}.row:last-child{border-bottom:none}.label{color:var(--muted);font-size:12px}.value{font-weight:700}.ellipsis{max-width:200px;overflow:hidden;text-overflow:ellipsis}@media (max-width:700px){.table-card{display:none}.cards-grid{display:grid}}:root{--bg:#f7faff;--card:#fff;--ring:#e7ecff;--text:#0f172a;--muted:#5b6b86;--primary:#4c6fff;--shadow:0 6px 24px rgba(28,32,68,.06)}.ds-header{background:linear-gradient(180deg,#fff,#f6f9ff);border-bottom:1px solid #eef2ff}.ds-container{max-width:1120px;margin:0 auto;padding:14px 16px}.ds-top{display:flex;align-items:center;justify-content:space-between;gap:16px}.ds-title{margin:0;font-size:24px;font-weight:800;letter-spacing:.2px;color:var(--text)}.ds-subtitle{margin:2px 0 0;color:var(--muted);font-size:13px}.ds-account{display:flex;align-items:center;gap:12px}.ds-identity{color:#0f172a;opacity:.85;white-space:nowrap}.ds-logout{display:inline-flex;align-items:center;gap:8px;background:#fff;border:1px solid var(--ring);color:#0f172a;padding:8px 12px;border-radius:10px;cursor:pointer;font-weight:700;box-shadow:var(--shadow)}.ds-logout:hover{background:#f8fafc}.ds-tabsbar{padding:10px 0 6px}.ds-tabs{background:#f5f8ff;border:1px solid var(--ring);border-radius:12px;padding:6px;display:flex;gap:10px;box-shadow:var(--shadow)}.ds-tab{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:transparent;border:1px solid transparent;color:#102a43;padding:8px 12px;border-radius:10px;display:flex;align-items:center;gap:8px;cursor:pointer}.ds-tab:hover{background:#eef3ff}.ds-tab.active{background:#fff;border-color:var(--ring);box-shadow:0 8px 18px #102a4314}.ds-tab-icon{font-size:16px}.ds-tab-label{font-weight:600}@media (max-width:640px){.ds-title{font-size:20px}.ds-subtitle{display:none}.ds-identity{font-size:13px;opacity:.9}.ds-tabs{gap:6px}.ds-tab{padding:8px 10px}.ds-tab-label{font-size:14px}}*{margin:0;padding:0;box-sizing:border-box}html,body,#root{height:100%;width:100%}body{font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}#root{display:flex}html{scroll-behavior:smooth}