:root { font-family: Inter, ui-sans-serif, system-ui, sans-serif; color: #172033; background: #f4f6fa; }
* { box-sizing: border-box; }
body { margin: 0; }
.dashboard-body { overflow: hidden; }
.topbar { align-items: center; background: #101827; color: white; display: flex; justify-content: space-between; padding: 16px 5vw; }
.brand, .topbar a { color: inherit; text-decoration: none; }
.brand { font-weight: 750; letter-spacing: .02em; }
nav { align-items: center; display: flex; gap: 20px; font-size: .9rem; }
.nav-user, nav a { align-items: center; display: inline-flex; gap: 7px; }
.admin-menu { position: relative; }
.admin-menu summary { align-items: center; cursor: pointer; display: inline-flex; gap: 7px; list-style: none; }
.admin-menu summary::-webkit-details-marker { display: none; }
.admin-menu-panel { background: #fff; border: 1px solid #e2e7f0; border-radius: 10px; box-shadow: 0 14px 35px #0003; min-width: 205px; padding: 8px; position: absolute; right: 0; top: calc(100% + 12px); z-index: 5; }
.admin-menu-panel a { border-radius: 6px; color: #536078; display: block; padding: 10px 12px; white-space: nowrap; }
.admin-menu-panel a:hover { background: #eef2f9; color: #2457d6; }
.nav-icon { fill: none; height: 17px; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.8; width: 17px; }
.container { margin: 0 auto; max-width: 1440px; padding: 42px 24px; }
.dashboard-container { max-width: none; padding: 0; }
.auth-card, .empty-state, .panel { background: white; border: 1px solid #e2e7f0; border-radius: 14px; box-shadow: 0 8px 30px #1720330b; padding: 30px; }
.auth-card { margin: 8vh auto; max-width: 420px; }
.password-card { background: white; border: 1px solid #e2e7f0; border-radius: 14px; box-shadow: 0 8px 30px #1720330b; margin: 7vh auto; max-width: 560px; padding: 34px; }
.form-heading { border-bottom: 1px solid #edf0f5; margin-bottom: 24px; padding-bottom: 18px; }
.form-field { margin-bottom: 18px; }
.form-field.has-error input { border-color: #bd3346; box-shadow: 0 0 0 3px #bd33461a; }
.error-summary, .field-error { color: #9d2639; font-size: .9rem; }
.error-summary { background: #fff0f2; border: 1px solid #efb8c1; border-radius: 8px; font-weight: 650; margin-bottom: 20px; padding: 13px 15px; }
.field-error ul, .error-summary ul { list-style: none; margin: 7px 0 0; padding: 0; }
.form-actions { align-items: center; display: flex; justify-content: flex-end; gap: 18px; margin-top: 24px; }
.form-actions a { color: #536078; font-size: .9rem; text-decoration: none; }
.form-actions button { margin-top: 0; }
.login-page { background: #101827; }
.login-page .container { align-items: center; display: flex; justify-content: center; max-width: none; min-height: 100vh; padding: 32px; }
.login-shell { border-radius: 18px; box-shadow: 0 24px 70px #00000052; display: grid; grid-template-columns: minmax(280px, .9fr) minmax(420px, 1.1fr); height: min(620px, calc(100vh - 64px)); margin: 0 auto; max-width: 1080px; overflow: hidden; width: 100%; }
.login-aside { background: #2F2D2D; color: #fff; display: flex; flex-direction: column; justify-content: center; overflow: hidden; padding: 72px clamp(38px, 7vw, 96px); position: relative; }
.login-aside::after { border: 1px solid #ffffff1a; border-radius: 50%; bottom: -180px; content: ""; height: 420px; position: absolute; right: -160px; width: 420px; }
.login-illustration { align-self: center; display: block; max-width: none; position: relative; transform: scale(1.22); width: 100%; z-index: 1; }
.login-mark { align-items: center; border: 1px solid #ffffff52; border-radius: 12px; display: flex; font-size: 1.05rem; font-weight: 800; height: 52px; justify-content: center; letter-spacing: -.08em; margin-bottom: 42px; width: 52px; }
.login-kicker { color: #b5c7ff; font-size: .75rem; font-weight: 750; letter-spacing: .16em; margin: 0 0 16px; text-transform: uppercase; }
.login-aside h1 { font-size: clamp(2.5rem, 5vw, 4.5rem); font-weight: 300; letter-spacing: -.06em; line-height: .94; margin: 0; }
.login-aside h1 strong { color: #fff; font-weight: 750; }
.login-aside-copy { color: #c3c1c1; font-size: 1rem; line-height: 1.6; margin: 28px 0 0; max-width: 280px; }
.login-signal { align-items: end; display: flex; gap: 5px; height: 42px; margin-top: 70px; }
.login-signal span { background: #728cff; display: block; height: 18px; opacity: .8; width: 5px; }
.login-signal span:nth-child(2) { height: 28px; }.login-signal span:nth-child(3) { height: 21px; }.login-signal span:nth-child(4) { height: 38px; }.login-signal span:nth-child(5) { height: 31px; }
.login-panel { align-self: stretch; background: #f8f9fc; padding: clamp(38px, 7vh, 72px) clamp(38px, 8vw, 120px); }
.login-panel-heading { margin-bottom: 42px; max-width: 410px; }
.login-panel-heading h2 { color: #172033; font-size: clamp(2.1rem, 3vw, 3rem); letter-spacing: -.055em; line-height: 1.05; margin: 10px 0 14px; }
.login-panel-heading .muted { font-size: .98rem; line-height: 1.65; margin: 0; max-width: 390px; }
.login-alert { background: #fff0d8; border: 1px solid #f0cc8c; border-radius: 8px; color: #7c4b00; font-size: .88rem; margin-bottom: 22px; max-width: 410px; padding: 12px 14px; }
.login-alert-error { background: #fff0f2; border-color: #efb8c1; color: #9d2639; }
.login-form { max-width: 410px; }
.login-field { margin-bottom: 22px; }
.login-field label { color: #3d4960; font-size: .86rem; font-weight: 700; letter-spacing: .01em; margin: 0 0 9px; }
.input-wrap { position: relative; }
.input-icon { color: #8190a8; height: 18px; left: 14px; position: absolute; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.7; top: 13px; width: 18px; }
.input-wrap input { background: #fff; border-color: #d8deea; font-size: .98rem; min-height: 50px; padding: 14px 14px 14px 43px; transition: border-color .18s ease, box-shadow .18s ease; }
.input-wrap input:focus { border-color: #526fe6; box-shadow: 0 0 0 4px #526fe61c; outline: none; }
.input-wrap:focus-within .input-icon { color: #526fe6; }
.login-field.has-error .input-wrap input { border-color: #bd3346; }
.login-field-error { color: #9d2639; font-size: .8rem; margin-top: 7px; }
.login-field-error ul { list-style: none; margin: 0; padding: 0; }
.login-submit { align-items: center; display: flex; font-size: .98rem; font-weight: 650; justify-content: space-between; margin-top: 14px; min-height: 50px; padding: 14px 17px; width: 100%; }
.login-submit span { font-size: 1.2rem; line-height: 1; }
.login-modal-backdrop { align-items: center; background: #101827a8; display: flex; inset: 0; justify-content: center; padding: 24px; position: fixed; z-index: 10; }
.login-modal { background: #fff; border-radius: 16px; box-shadow: 0 24px 80px #00000052; max-width: 430px; padding: 34px; position: relative; text-align: center; width: 100%; }
.login-modal-close { background: transparent; color: #7d899d; font-size: 1.65rem; line-height: 1; margin: 0; padding: 2px 7px; position: absolute; right: 14px; top: 14px; }
.login-modal-close:hover, .login-modal-close:focus-visible { background: #eef2f9; box-shadow: none; color: #172033; outline: none; transform: none; }
.login-modal-icon { align-items: center; background: #fff0f2; border: 1px solid #efb8c1; border-radius: 50%; color: #bd3346; display: flex; font-size: 1.25rem; font-weight: 800; height: 46px; justify-content: center; margin: 0 auto 20px; width: 46px; }
.login-modal .eyebrow { margin-bottom: 8px; }
.login-modal h2 { font-size: 1.55rem; letter-spacing: -.03em; margin-bottom: 12px; }
.login-modal p:not(.eyebrow) { color: #68738a; font-size: .92rem; line-height: 1.55; margin: 0 auto; max-width: 340px; }
.login-modal-action { margin-top: 25px; min-width: 130px; }
.management-page { margin: 0 auto; max-width: 1440px; padding: clamp(30px, 5vh, 56px) 0; width: 100%; }
.narrow-management { max-width: 820px; }
.management-heading { align-items: end; display: flex; justify-content: space-between; gap: 32px; margin-bottom: 24px; }
.management-heading h1 { font-size: clamp(2rem, 4vw, 3rem); letter-spacing: -.05em; margin: 8px 0 10px; }
.management-heading .muted { margin: 0; }
.primary-action { background: #2457d6; border-radius: 8px; color: #fff; padding: 12px 16px; text-decoration: none; white-space: nowrap; }
.primary-action:hover { background: #1946b6; }
.management-card { background: #fff; border: 1px solid #e2e7f0; border-radius: 14px; box-shadow: 0 8px 30px #1720330b; overflow: hidden; width: 100%; }
.management-message { border-radius: 8px; margin-bottom: 18px; padding: 12px 15px; }
.stat-grid { display: grid; gap: 16px; grid-template-columns: repeat(4, 1fr); margin-bottom: 30px; }
.stat-card { background: #fff; border: 1px solid #e2e7f0; border-radius: 14px; box-shadow: 0 8px 30px #1720330b; color: inherit; padding: 22px; text-decoration: none; }
.stat-card:hover { border-color: #2457d6; transform: translateY(-1px); }
.stat-card span { color: #68738a; display: block; font-size: .84rem; }.stat-card strong { display: block; font-size: 2.3rem; letter-spacing: -.05em; margin-top: 12px; }.stat-card small { color: #8994a7; display: block; font-size: .76rem; margin-top: 4px; }
.section-title { align-items: center; display: flex; justify-content: space-between; padding: 22px 20px 4px; }.section-title h2 { margin: 0; }.section-title a { color: #2457d6; text-decoration: none; }
.management-message.success { background: #e4f7eb; color: #176a37; }.management-message.error { background: #fff0f2; color: #9d2639; }
.management-message { align-items: center; display: flex; gap: 10px; }
.management-message::before { content: ""; background: currentColor; border-radius: 50%; height: 7px; width: 7px; }
.management-toolbar { align-items: center; background: #fbfcfe; border-bottom: 1px solid #e9edf4; display: flex; gap: 14px; justify-content: space-between; min-height: 58px; padding: 14px 22px; }
.session-actions-menu { position: relative; }.session-actions-menu summary { align-items: center; background: #fff; border: 1px solid #cbd6e8; border-radius: 8px; color: #34425d; cursor: pointer; display: inline-flex; font-size: .84rem; font-weight: 700; gap: 8px; list-style: none; padding: 9px 13px; }.session-actions-menu summary::-webkit-details-marker { display: none; }.session-actions-menu summary:hover { background: #f4f7fc; border-color: #9fb4ed; }.session-actions-menu[open] summary { border-color: #526fe6; box-shadow: 0 0 0 3px #526fe61c; }.action-menu-icon { color: #2457d6; font-size: 1rem; line-height: 1; }.action-menu-chevron { border-bottom: 1.5px solid currentColor; border-right: 1.5px solid currentColor; display: inline-block; height: 7px; margin-left: 2px; transform: rotate(45deg) translateY(-2px); transition: transform .16s ease; width: 7px; }.session-actions-menu[open] .action-menu-chevron { transform: rotate(225deg) translateY(-1px); }.session-actions-panel { background: #fff; border: 1px solid #d5deeb; border-radius: 10px; box-shadow: 0 14px 34px #17203326; min-width: 250px; padding: 7px; position: absolute; right: 0; top: calc(100% + 7px); z-index: 5; }.session-actions-panel form { margin: 0; }.session-menu-action { align-items: center; background: transparent; border-radius: 7px; color: #536078; display: flex; font-size: .84rem; justify-content: space-between; margin: 0; padding: 10px 11px; text-align: left; width: 100%; }.session-menu-action:hover:not(:disabled) { background: #eef2f9; color: #2457d6; transform: none; }.session-menu-action:disabled { color: #a7afbd; cursor: not-allowed; }.session-menu-action strong { background: #eef2f9; border-radius: 999px; color: #536078; font-size: .72rem; min-width: 22px; padding: 4px 7px; text-align: center; }.danger-menu-action { color: #bd3346; }.danger-menu-action:hover { background: #fff0f2 !important; color: #97283a !important; }.session-selection-summary { color: #2457d6; }
.session-table input[type="checkbox"] { accent-color: #2457d6; cursor: pointer; height: 17px; margin: 0; width: 17px; }
.toolbar-select { margin: 0; }.toolbar-select select { background: #fff; border: 1px solid #d8deea; border-radius: 7px; color: #536078; font: inherit; min-height: 36px; padding: 7px 28px 7px 10px; }
.toolbar-summary { color: #68738a; font-size: .86rem; white-space: nowrap; }.toolbar-summary strong { color: #172033; }
.user-filters { align-items: center; background: #fbfcfe; border-bottom: 1px solid #e9edf4; display: flex; gap: 16px; justify-content: space-between; padding: 14px 22px; }
.search-field { display: flex; flex: 1; gap: 8px; margin: 0; max-width: 560px; }
.search-field input, .user-filters select, .user-filters input[type="date"] { background: #fff; border: 1px solid #d8deea; border-radius: 7px; font: inherit; min-height: 42px; padding: 9px 11px; }
.search-field input { flex: 1; }.search-field button { margin: 0; min-height: 42px; padding: 9px 15px; }
.user-filters select { color: #3d4960; min-width: 160px; }
.user-table-wrap { overflow-x: auto; }.user-table { border-collapse: collapse; min-width: 920px; width: 100%; }
.user-table th, .user-table td { border-bottom: 1px solid #edf0f5; padding: 14px 22px; text-align: left; vertical-align: middle; }
.user-table tbody tr { transition: background .16s ease; }.user-table tbody tr:hover { background: #fbfcff; }
.user-table th { color: #7b879b; font-size: .68rem; letter-spacing: .1em; text-transform: uppercase; }.user-table td { color: #536078; font-size: .9rem; }
.user-table td strong { color: #172033; display: block; font-weight: 700; }.user-table td small { color: #8994a7; display: block; font-size: .78rem; margin-top: 4px; }
.identity-cell { align-items: center; display: flex; gap: 11px; }.identity-mark { align-items: center; background: #e9efff; border-radius: 10px; color: #2457d6; display: inline-flex; flex: 0 0 34px; font-size: .78rem; font-weight: 800; height: 34px; justify-content: center; text-transform: uppercase; }
.role-pill, .status-pill { border-radius: 999px; display: inline-block; font-size: .76rem; padding: 6px 9px; }.role-pill { background: #eef2f9; color: #52607a; }.status-pill.active { background: #e4f7eb; color: #176a37; }.status-pill.inactive { background: #fff0f2; color: #9d2639; }
.access-pill { background: #f6f8fb; border: 1px solid #e3e8f0; border-radius: 6px; color: #536078; display: inline-block; font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: .74rem; padding: 5px 7px; }
  .ip-list { display: flex; flex-wrap: wrap; gap: 6px; max-width: 360px; }.ip-fieldset { border: 1px solid #e2e7f0; border-radius: 10px; margin: 26px 0 0; padding: 18px; }.ip-fieldset legend { color: #172033; font-size: .92rem; font-weight: 700; padding: 0 7px; }.ip-form-row { align-items: end; border-bottom: 1px solid #edf0f5; display: grid; gap: 12px; grid-template-columns: 1fr 1fr auto; padding: 12px 0; }.ip-form-row[hidden] { display: none !important; }.ip-form-row:first-of-type { padding-top: 4px; }.ip-form-row:last-of-type { border-bottom: 0; }.ip-form-row label { margin: 0 0 6px; }.ip-form-row input { min-height: 42px; }.delete-field { align-items: center; display: flex; justify-content: center; margin: 0 0 11px; }.delete-field input { display: none; }.ip-remove { align-items: center; background: transparent; border: 1px solid #efb8c1; border-radius: 7px; color: #bd3346; display: inline-flex; height: 34px; justify-content: center; margin: 0; padding: 7px; width: 34px; }.ip-remove svg { fill: none; height: 16px; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.8; width: 16px; }.ip-remove:hover { background: #fff0f2; border-color: #bd3346; color: #8f2032; }
.remove-ip { align-items: center; background: #fff0f2; border: 1px solid #efb8c1; border-radius: 7px; color: #bd3346; display: inline-flex; font-size: 1.2rem; height: 42px; justify-content: center; margin: 0 0 0; padding: 0; width: 42px; }.remove-ip:hover { background: #bd3346; color: #fff; transform: none; }.secondary-action { background: #eef2f9; color: #2457d6; font-size: .86rem; margin: 14px 0 0; padding: 9px 13px; }.secondary-action:hover { background: #e1e8f5; box-shadow: none; color: #1946b6; transform: none; }
.event-pill { background: #eef2f9; border-radius: 999px; color: #52607a; display: inline-block; font-size: .74rem; padding: 6px 9px; }.event-login_failed, .event-user_deactivated { background: #fff0f2; color: #9d2639; }.event-login_success, .event-report_access { background: #e4f7eb; color: #176a37; }
.user-actions { align-items: center; display: flex; gap: 8px; justify-content: flex-end; white-space: nowrap; }.user-actions a { border: 1px solid #dce3ef; border-radius: 7px; color: #536078; font-size: .82rem; padding: 7px 10px; text-decoration: none; }.user-actions a:hover { background: #eef2f9; border-color: #c8d3e5; color: #2457d6; }
.icon-action { align-items: center; display: inline-flex !important; height: 34px; justify-content: center; padding: 7px !important; width: 34px; }.icon-action svg { fill: none; height: 16px; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.8; width: 16px; }.icon-action:hover { text-decoration: none !important; }.icon-action:focus-visible { outline: 3px solid #2457d655; outline-offset: 2px; }.edit-action { color: #2457d6 !important; }.edit-action:hover { background: #eef2ff !important; border-color: #b9c8ff !important; }.password-action { color: #a76800 !important; }.password-action:hover { background: #fff5df !important; border-color: #f0cc8c !important; }.danger-action { color: #bd3346 !important; }.danger-action:hover { background: #fff0f2 !important; border-color: #efb8c1 !important; color: #8f2032 !important; }
.user-actions .table-action { border: 1px solid #dce3ef; }
.user-actions .confirm-action .table-action:not(.danger-action) { color: #16824b !important; }
.user-actions .confirm-action .table-action:not(.danger-action):hover { background: #e4f7eb; border-color: #a8dfbc; color: #0d6538 !important; }
.table-action { background: transparent; border-radius: 7px; color: #bd3346; font-size: .82rem; margin: 0; padding: 7px 10px; }.table-action:hover { background: #fff0f2; box-shadow: none; color: #8f2032; transform: none; }
.button-quiet { background: #eef2f9; color: #536078; margin: 0; }.button-quiet:hover { background: #e0e7f3; box-shadow: none; transform: none; }.button-danger { background: #bd3346; color: #fff; margin: 0; }.button-danger:hover { background: #97283a; box-shadow: none; transform: none; }
.confirm-dialog { border: 0; border-radius: 16px; box-shadow: 0 24px 80px #0004; max-width: 430px; padding: 30px; width: calc(100% - 40px); }.confirm-dialog::backdrop { background: #10182799; }.confirm-dialog h2 { font-size: 1.35rem; margin: 15px 0 8px; }.confirm-dialog p { color: #68738a; line-height: 1.5; margin: 0; }.confirm-dialog-icon { align-items: center; background: #fff0d8; border: 1px solid #f0cc8c; border-radius: 50%; color: #9b6208; display: flex; font-weight: 800; height: 38px; justify-content: center; width: 38px; }.confirm-dialog-actions { display: flex; gap: 10px; justify-content: flex-end; margin-top: 26px; }.confirm-dialog-actions button { font-size: .86rem; padding: 10px 14px; }
.empty-row { color: #8994a7 !important; padding: 34px 20px !important; text-align: center !important; }.pagination { align-items: center; display: flex; gap: 18px; justify-content: center; padding: 20px; }.pagination a { color: #2457d6; text-decoration: none; }.pagination span { color: #68738a; font-size: .86rem; }
.back-link { color: #536078; font-size: .9rem; text-decoration: none; }.back-link:hover { color: #2457d6; }.narrow-management > .back-link { display: inline-block; margin-bottom: 24px; }
.management-form { overflow: visible; padding: clamp(24px, 4vw, 36px); }.management-field { margin-bottom: 18px; }.management-field label { margin: 0 0 8px; }.management-field input, .management-field select { background: #fff; border: 1px solid #cbd3e1; border-radius: 7px; font: inherit; min-height: 46px; padding: 11px 12px; width: 100%; }.management-field input[type="checkbox"] { min-height: 0; width: auto; }.management-field.has-error input, .management-field.has-error select { border-color: #bd3346; }.management-form-actions { align-items: center; border-top: 1px solid #edf0f5; display: flex; justify-content: flex-end; gap: 18px; margin-top: 26px; padding-top: 20px; }.management-form-actions button { margin: 0; }.field-error { color: #9d2639; font-size: .82rem; margin-top: 6px; }.field-error ul { list-style: none; margin: 0; padding: 0; }.sr-only { height: 1px; margin: -1px; overflow: hidden; position: absolute; width: 1px; clip: rect(0, 0, 0, 0); }
.field-help { color: #8994a7; display: block; font-size: .78rem; margin-top: 6px; }
.user-filters > label:not(.search-field) { margin: 0; }
.user-filters > label:not(.search-field) select { min-width: 172px; }
.user-filters .search-field button { box-shadow: none; font-weight: 650; }
.audit-filters { align-items: end; display: grid; gap: 12px; grid-template-columns: minmax(260px, 2fr) repeat(4, minmax(130px, 1fr)) auto auto; justify-content: initial; }.audit-filters .search-field { display: flex; flex-direction: column; gap: 6px; margin: 0; max-width: none; }.audit-filters label:not(.search-field) { display: flex; flex-direction: column; gap: 6px; margin: 0; min-width: 0; }.audit-filters label:not(.search-field) input, .audit-filters label:not(.search-field) select { min-width: 0; width: 100%; }.filter-label { color: #68738a; font-size: .7rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }.audit-filter-submit { align-items: center; background: #2457d6; border: 0; border-radius: 8px; box-shadow: 0 5px 12px #2457d633; color: #fff; display: inline-flex; font-size: .84rem; font-weight: 700; gap: 6px; justify-content: center; margin: 0; min-height: 42px; padding: 9px 14px; white-space: nowrap; }.audit-filter-submit:hover { background: #1946b6; box-shadow: 0 7px 16px #2457d640; transform: translateY(-1px); }.audit-filter-submit span { font-size: 1.15rem; line-height: .7; }.clear-filter { align-self: center; color: #68738a; font-size: .82rem; margin-left: 2px; text-decoration: none; white-space: nowrap; }.clear-filter:hover { color: #2457d6; }.export-button { align-items: center; background: #fff; border: 1px solid #2457d6; border-radius: 8px; color: #2457d6; display: inline-flex; font-size: .84rem; font-weight: 700; gap: 8px; padding: 9px 13px; text-decoration: none; }.export-button svg { fill: none; height: 16px; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.8; width: 16px; }.export-button:hover { background: #eef2ff; border-color: #1946b6; box-shadow: 0 4px 10px #2457d626; color: #1946b6; transform: translateY(-1px); }.audit-table { min-width: 1000px; }.audit-table td code { background: #f5f7fb; border-radius: 5px; color: #536078; font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: .76rem; padding: 4px 6px; }.audit-user-agent { max-width: 300px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }.table-detail-link { border: 1px solid #dce3ef; border-radius: 7px; color: #2457d6; font-size: .8rem; padding: 7px 9px; text-decoration: none; white-space: nowrap; }.table-detail-link:hover { background: #eef2ff; border-color: #b9c8ff; }.audit-detail-card { padding: 26px; }.audit-detail-heading { align-items: center; border-bottom: 1px solid #edf0f5; display: flex; gap: 14px; justify-content: space-between; padding-bottom: 20px; }.audit-detail-heading time { color: #68738a; font-size: .86rem; }.audit-detail-grid { display: grid; gap: 18px; grid-template-columns: repeat(2, minmax(0, 1fr)); margin: 24px 0; }.audit-detail-grid div { background: #f8faff; border: 1px solid #e7edf7; border-radius: 9px; padding: 14px; }.audit-detail-grid dt { color: #7b879b; font-size: .7rem; font-weight: 700; letter-spacing: .07em; margin-bottom: 7px; text-transform: uppercase; }.audit-detail-grid dd { color: #172033; margin: 0; word-break: break-word; }.audit-agent-detail { font-size: .82rem; line-height: 1.5; }.audit-metadata { border-top: 1px solid #edf0f5; margin-top: 8px; padding-top: 20px; }.audit-metadata h2 { font-size: 1rem; margin-bottom: 12px; }.audit-metadata pre { background: #172033; border-radius: 9px; color: #dbe6ff; font-size: .78rem; line-height: 1.5; overflow: auto; padding: 16px; white-space: pre-wrap; }
.user-filters.audit-filters { align-items: end; display: grid; gap: 14px; grid-template-columns: minmax(260px, 2fr) repeat(5, minmax(125px, 1fr)); }
.user-filters.audit-filters label { margin: 0; }
.audit-date-filters { align-items: end; background: #f8faff; border-bottom: 1px solid #e9edf4; display: grid; gap: 12px; grid-template-columns: minmax(190px, 1fr) 170px 18px 170px auto 1fr; padding: 14px 22px; }.audit-date-heading { align-items: center; align-self: center; display: flex; flex-direction: row; gap: 9px; margin: 0; min-width: 0; white-space: nowrap; }.audit-date-heading strong { color: #34425d; font-size: .82rem; }.audit-calendar-icon { align-items: center; background: #e7edff; border-radius: 7px; color: #2457d6; display: inline-flex; flex: 0 0 30px; height: 30px; justify-content: center; width: 30px; }.audit-calendar-icon svg { fill: none; height: 16px; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.7; width: 16px; }.audit-date-filters label { display: flex; flex-direction: column; gap: 5px; margin: 0; }.audit-date-filters label span { color: #68738a; font-size: .7rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }.audit-date-filters input { background: #fff; border: 1px solid #cbd6e8; border-radius: 7px; font: inherit; min-height: 40px; padding: 7px 10px; width: 100%; }.audit-date-filters input:focus { border-color: #526fe6; box-shadow: 0 0 0 3px #526fe61c; outline: 0; }.audit-date-separator { align-self: end; color: #8994a7; font-weight: 700; margin-bottom: 11px; text-align: center; }.audit-date-filters button { align-items: center; background: #2457d6; border: 0; border-radius: 7px; box-shadow: 0 4px 9px #2457d633; color: #fff; display: inline-flex; font-size: .82rem; font-weight: 700; gap: 6px; margin: 0; min-height: 40px; padding: 7px 13px; white-space: nowrap; }.audit-date-filters button svg { fill: none; height: 15px; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.8; width: 15px; }.audit-date-filters button:hover { background: #1946b6; box-shadow: 0 6px 13px #2457d640; transform: translateY(-1px); }.audit-date-filters a { align-self: center; color: #68738a; font-size: .8rem; text-decoration: none; }.audit-date-filters a:hover { color: #2457d6; }
.audit-top-filters { align-items: center; }.audit-top-filters .search-field { flex: 1; max-width: 680px; }.audit-date-filters { align-items: end; background: #f8faff; border-bottom: 1px solid #e9edf4; display: flex; gap: 12px; padding: 12px 22px; }.audit-date-heading { align-self: center; display: flex; flex-direction: column; gap: 3px; margin-right: 6px; min-width: 145px; }.audit-date-heading strong { color: #34425d; font-size: .82rem; }.audit-date-heading span { color: #8994a7; font-size: .72rem; }.audit-date-filters label { display: flex; flex-direction: column; gap: 5px; margin: 0; }.audit-date-filters label span { color: #68738a; font-size: .7rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }.audit-date-filters input { background: #fff; border: 1px solid #d8deea; border-radius: 7px; font: inherit; min-height: 38px; padding: 7px 10px; }.audit-date-filters button { background: #eef2f9; color: #2457d6; margin: 0; min-height: 38px; padding: 7px 12px; }.audit-date-filters button:hover { background: #e1e8f5; box-shadow: none; transform: none; }.audit-date-filters a { align-self: center; color: #68738a; font-size: .8rem; text-decoration: none; }.audit-date-filters a:hover { color: #2457d6; }
.management-toolbar .toolbar-select select:focus, .user-filters select:focus, .search-field input:focus { border-color: #526fe6; box-shadow: 0 0 0 3px #526fe61c; outline: 0; }
.user-table thead th { white-space: nowrap; }
.user-table tbody tr:last-child td { border-bottom: 0; }
.user-table tbody td:last-child { min-width: 112px; }
.pagination { align-items: center; border-top: 1px solid #edf0f5; gap: 12px; padding: 14px 22px; }
.pagination a { background: #fff; border: 1px solid #dce3ef; border-radius: 7px; font-size: .82rem; padding: 8px 12px; }
.pagination a:hover { background: #eef2f9; border-color: #c8d3e5; }

h1, h2 { margin-top: 0; }
.muted { color: #68738a; }
label { display: block; font-size: .9rem; font-weight: 650; margin: 18px 0 7px; }
input { border: 1px solid #cbd3e1; border-radius: 7px; font: inherit; padding: 11px 12px; width: 100%; }
button, .button { background: #2457d6; border: 0; border-radius: 7px; color: white; cursor: pointer; display: inline-block; font: inherit; margin-top: 22px; padding: 11px 16px; text-decoration: none; }
.button-danger { background: #bd3346; font-size: .82rem; margin: 0; padding: 7px 10px; }
.alert { background: #fff0d8; border-radius: 7px; color: #7c4b00; padding: 11px; }
.page-heading, .panel-heading { align-items: center; display: flex; justify-content: space-between; gap: 20px; }
.eyebrow { color: #2457d6; font-size: .78rem; font-weight: 750; letter-spacing: .1em; text-transform: uppercase; }
.status { background: #dff7e8; border-radius: 999px; color: #176a37; font-size: .85rem; padding: 8px 13px; }
.report-frame { background: #2F2D2D; border: 0; border-radius: 0; height: calc(100dvh - 49px); margin: 0; min-height: 0; overflow: hidden; position: relative; }
.report-viewport { background: #2F2D2D; height: calc(100% - 77px); overflow: hidden; position: relative; width: 100%; }
.report-viewport iframe { border: 0; height: calc(100% + 60px); left: -8px; position: absolute; top: 1px; width: calc(100% + 16px); }
.report-footer { align-items: center; background: #2F2D2D; bottom: 0; color: #fff; display: flex; font-size: 20px; font-weight: 600; height: 77px; justify-content: center; letter-spacing: .2px; left: 0; position: absolute; right: 0; text-align: center; }
.report-footer span { transform: translateY(-4px); }
@media (min-aspect-ratio: 2/1) {
  .report-viewport::before, .report-viewport::after { background: #2F2D2D; bottom: 0; content: ""; max-width: 140px; position: absolute; top: 0; width: clamp(0px, calc(50vw - 111dvh + 172px), 140px); z-index: 2; }
  .report-viewport::before { left: 0; }
  .report-viewport::after { right: 0; }
}
.empty-state { margin: 25px 0; text-align: center; }
.maintenance-page .container { align-items: center; display: flex; justify-content: center; min-height: calc(100vh - 68px); }
.maintenance-state { margin: 0; max-width: 640px; width: 100%; }
.maintenance-illustration { display: block; height: auto; margin: 0 auto 18px; max-width: 280px; width: 55%; }
.panel { margin-top: 30px; }
.panel-heading span { background: #eef2f9; border-radius: 999px; padding: 5px 10px; }
.table-wrap { overflow-x: auto; }
table { border-collapse: collapse; min-width: 650px; width: 100%; }
th, td { border-bottom: 1px solid #edf0f5; padding: 13px 10px; text-align: left; }
th { color: #68738a; font-size: .8rem; text-transform: uppercase; }
@media (max-width: 700px) { .topbar, nav { align-items: flex-start; flex-direction: column; gap: 10px; } .container { padding: 25px 4vw; } .dashboard-container { padding: 0; } .page-heading { align-items: flex-start; flex-direction: column; } .report-frame { height: calc(100dvh - 132px); min-height: 0; } .report-footer { font-size: 16px; height: 77px; } }
@media (max-width: 800px) {
  .management-page { padding: 28px 0; }
  .management-heading { align-items: flex-start; flex-direction: column; }
  .user-filters { align-items: stretch; flex-direction: column; }
  .search-field { max-width: none; }
  .login-page .container { align-items: stretch; padding: 0; }
  .login-shell { border-radius: 0; display: block; height: auto; min-height: 100vh; }
  .login-aside { min-height: 250px; padding: 34px 8vw; }
  .login-illustration { max-width: 78%; transform: scale(1.12); }
  .login-panel { min-height: calc(100vh - 250px); padding: 48px 8vw 60px; }
  .stat-grid { grid-template-columns: repeat(2, 1fr); }
  .admin-menu-panel { left: 0; right: auto; }
  .management-toolbar { align-items: stretch; flex-direction: column; }
  .audit-date-filters { align-items: stretch; display: grid; grid-template-columns: 1fr; }
  .audit-date-heading { margin-right: 0; }
  .audit-date-separator { display: none; }
  .audit-date-filters a { align-self: flex-start; }
  .audit-detail-grid { grid-template-columns: 1fr; }
  .ip-form-row { grid-template-columns: 1fr; }
  .remove-ip { margin-top: -2px; }
}
.unlock-action { background: #16824b; }
.unlock-action:hover { background: #0d6538; }
.status-pill.locked { background: #fff0d8; color: #9b6208; }
.unlock-table-action { color: #16824b !important; }
.unlock-table-action:hover { background: #e4f7eb !important; border-color: #a8dfbc !important; color: #0d6538 !important; }
.session-filters .search-field { max-width: 680px; }
.session-table { min-width: 1080px; }
.session-table td small { white-space: nowrap; }
.session-client { display: block; white-space: nowrap; }
@media (min-width: 801px) { .audit-date-filters { align-items: end; display: grid; grid-template-columns: 210px 210px auto 1fr; }.audit-date-heading { align-items: center; display: flex; flex-direction: row; gap: 9px; margin: 0; min-width: 0; white-space: nowrap; }.audit-date-filters button { align-items: center; background: #2457d6; border: 0; border-radius: 8px; box-shadow: 0 5px 12px #2457d633; color: #fff; display: inline-flex; font-size: .84rem; font-weight: 700; gap: 7px; justify-content: center; min-height: 42px; padding: 9px 15px; white-space: nowrap; }.audit-date-filters button:hover { background: #1946b6; box-shadow: 0 7px 16px #2457d640; transform: translateY(-1px); } }

.overview-subtitle { color: #68738a; margin: -8px 0 0; }.overview-updated { align-self: flex-end; color: #8994a7; font-size: .78rem; }.overview-stat-grid { margin-bottom: 22px; }.overview-grid { display: grid; gap: 22px; }.overview-main-grid { grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); }.overview-secondary-grid { grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); margin-top: 22px; }.overview-grid .management-card, .overview-activity-card { min-width: 0; }.card-kicker { color: #2457d6; font-size: .68rem; font-weight: 800; letter-spacing: .1em; margin: 0 0 5px; text-transform: uppercase; }.overview-count { align-items: center; background: #eef2f9; border-radius: 999px; color: #52607a; display: inline-flex; font-size: .78rem; height: 27px; justify-content: center; min-width: 27px; padding: 0 8px; }.overview-alerts { display: grid; gap: 9px; }.overview-alert { align-items: center; border: 1px solid #edf0f5; border-left: 4px solid #f0b429; border-radius: 9px; color: #172033; display: flex; gap: 11px; padding: 11px 13px; text-decoration: none; }.overview-alert:hover { background: #fbfcff; border-color: #dce3ef; }.overview-alert-danger { border-left-color: #bd3346; }.overview-alert-info { border-left-color: #2457d6; }.overview-alert-icon { align-items: center; background: #fff0d8; border-radius: 50%; color: #9b6208; display: inline-flex; flex: 0 0 25px; font-weight: 800; height: 25px; justify-content: center; }.overview-alert-danger .overview-alert-icon { background: #fff0f2; color: #bd3346; }.overview-alert-info .overview-alert-icon { background: #eef2ff; color: #2457d6; }.overview-alert strong, .overview-alert small { display: block; }.overview-alert strong { font-size: .84rem; }.overview-alert small { color: #68738a; font-size: .76rem; margin-top: 3px; }.overview-alert-arrow { color: #8994a7; font-size: 1.1rem; margin-left: auto; }.overview-empty { align-items: center; color: #68738a; display: flex; flex-direction: column; gap: 5px; padding: 27px 10px; text-align: center; }.overview-empty strong { color: #176a37; }.overview-empty span { font-size: .82rem; }.overview-bars { display: grid; gap: 14px; padding-top: 6px; }.overview-bar-row { align-items: center; display: grid; gap: 10px; grid-template-columns: minmax(130px, 1fr) minmax(90px, 1.5fr) 25px; }.overview-bar-row > span { color: #536078; font-size: .78rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }.overview-bar-row strong { color: #172033; font-size: .8rem; text-align: right; }.overview-bar-track { background: #eef2f9; border-radius: 999px; height: 8px; overflow: hidden; }.overview-bar-track i { background: linear-gradient(90deg, #2457d6, #6381e9); border-radius: inherit; display: block; height: 100%; }.overview-access-summary { display: grid; gap: 10px; grid-template-columns: repeat(3, 1fr); }.overview-access-summary div { background: #f8faff; border-radius: 9px; padding: 13px; }.overview-access-summary strong, .overview-access-summary span { display: block; }.overview-access-summary strong { color: #172033; font-size: 1.3rem; }.overview-access-summary span { color: #68738a; font-size: .72rem; line-height: 1.3; margin-top: 3px; }.overview-status-line { border-top: 1px solid #edf0f5; display: flex; flex-wrap: wrap; gap: 16px; margin-top: 17px; padding-top: 15px; }.overview-status-line span, .overview-health-list span { align-items: center; color: #68738a; display: inline-flex; font-size: .78rem; gap: 6px; }.status-dot { background: #8994a7; border-radius: 50%; display: inline-block; height: 8px; width: 8px; }.status-dot-good { background: #16824b; }.status-dot-warning { background: #d28b0c; }.status-dot-muted { background: #aab3c2; }.overview-health-list { display: grid; gap: 0; }.overview-health-list div { align-items: center; border-bottom: 1px solid #edf0f5; display: flex; justify-content: space-between; padding: 11px 0; }.overview-health-list div:last-child { border-bottom: 0; }.overview-health-list strong { color: #172033; font-size: .8rem; }.overview-health-list .status-offline { color: #9b6208; }.overview-activity-card { margin-top: 22px; }.overview-quick-actions { display: grid; gap: 12px; grid-template-columns: repeat(4, 1fr); margin-top: 22px; }.overview-quick-actions a { background: #fff; border: 1px solid #e2e7f0; border-radius: 10px; color: #172033; display: flex; flex-direction: column; gap: 5px; padding: 15px; text-decoration: none; }.overview-quick-actions a:hover { border-color: #b9c8ff; box-shadow: 0 5px 16px #2457d614; transform: translateY(-1px); }.overview-quick-actions strong { color: #2457d6; font-size: .84rem; }.overview-quick-actions span { color: #68738a; font-size: .75rem; }
@media (max-width: 800px) { .overview-updated { align-self: flex-start; }.overview-main-grid, .overview-secondary-grid { grid-template-columns: 1fr; }.overview-quick-actions { grid-template-columns: repeat(2, 1fr); }.overview-access-summary { grid-template-columns: 1fr; }.overview-bar-row { grid-template-columns: minmax(105px, 1fr) minmax(80px, 1.5fr) 25px; } }
/* Dashboard: sesiones vigentes agrupadas por política de acceso. */
.overview-session-list { display: grid; gap: 0; }
.overview-session-row { align-items: center; border-bottom: 1px solid #edf0f5; display: flex; gap: 14px; justify-content: space-between; padding: 10px 0; }
.overview-session-row:last-child { border-bottom: 0; }
.overview-session-row strong, .overview-session-row small { display: block; }
.overview-session-row strong { color: #172033; font-size: .82rem; }
.overview-session-row small { color: #8994a7; font-size: .72rem; margin-top: 3px; }
.overview-session-row > span { color: #68738a; font-size: .76rem; white-space: nowrap; }
.overview-session-row > span b { color: #2457d6; font-size: 1.08rem; margin-right: 3px; }
.overview-session-unrestricted { background: #f8faff; border: 0; border-radius: 8px; margin-top: 8px; padding: 11px 12px; }
.overview-session-unrestricted > span b { color: #176a37; }
@media (max-width: 800px) { .overview-session-row { align-items: flex-start; flex-direction: column; gap: 5px; } }

/* Panel general: layout responsive y componentes con contenido variable. */
.management-page { max-width: 1440px; padding: 38px 24px 48px; }
.management-heading { align-items: flex-end; margin-bottom: 28px; }
.management-heading h1 { font-size: clamp(2rem, 3.5vw, 2.75rem); line-height: 1.08; margin-bottom: 0; }
.overview-updated { flex: 0 0 auto; line-height: 1.4; }
.overview-stat-grid { gap: 16px; margin-bottom: 24px; }
.overview-stat-grid .stat-card { min-height: 132px; padding: 20px 22px; }
.overview-stat-grid .stat-card strong { line-height: 1; margin-top: 14px; }
.overview-grid { align-items: stretch; gap: 20px; }
.overview-main-grid, .overview-secondary-grid { grid-template-columns: minmax(0, 1.25fr) minmax(360px, .95fr); }
.overview-secondary-grid { margin-top: 20px; }
.overview-grid .management-card { min-width: 0; }
.overview-main-grid .overview-events-card { grid-column: 1 / -1; }
.overview-modules-grid { grid-template-columns: minmax(0, 1.25fr) minmax(300px, 1fr) minmax(270px, .9fr); }
.overview-module-card { display: flex; flex-direction: column; min-height: 100%; }
.overview-module-card .section-title { min-height: 92px; }
.overview-module-card > .overview-bars, .overview-module-card > .overview-session-list, .overview-module-card > .overview-health-list { flex: 1; }
.overview-grid .section-title { min-height: 86px; padding: 20px 20px 12px; }
.overview-grid .section-title > div { min-width: 0; }
.overview-grid .section-title h2 { font-size: 1.16rem; line-height: 1.2; }
.overview-grid .section-title a { flex: 0 0 auto; font-size: .8rem; white-space: nowrap; }
.overview-alerts, .overview-bars, .overview-session-list, .overview-health-list { padding: 0 20px 20px; }
.overview-alerts { padding-top: 0; }
.overview-bars { padding-top: 0; }
.overview-session-list { padding-bottom: 4px; }
.overview-status-line { margin: 0 20px 20px; }
.overview-empty { padding: 24px 10px; }
.overview-bar-row { min-width: 0; }
.overview-bar-row > span { min-width: 0; }
.overview-health-list { padding-bottom: 10px; }
.overview-health-list div { min-width: 0; }
.overview-health-list span { min-width: 0; }

@media (max-width: 1100px) and (min-width: 801px) {
  .stat-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .overview-main-grid, .overview-secondary-grid { grid-template-columns: 1fr; }
  .overview-modules-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .overview-modules-grid .overview-events-card { grid-column: 1 / -1; }
}
@media (max-width: 800px) {
  .management-page { padding: 30px 16px 40px; }
  .management-heading { align-items: flex-start; gap: 14px; margin-bottom: 22px; }
  .overview-stat-grid { gap: 12px; }
  .overview-stat-grid .stat-card { min-height: 120px; }
  .overview-main-grid, .overview-secondary-grid { gap: 16px; grid-template-columns: 1fr; }
  .overview-main-grid .overview-events-card { grid-column: auto; }
  .overview-modules-grid { gap: 16px; grid-template-columns: 1fr; }
  .overview-modules-grid .overview-events-card { grid-column: auto; }
  .overview-grid .section-title { min-height: 78px; padding: 18px 20px 12px; }
  .overview-alerts, .overview-bars, .overview-session-list, .overview-health-list { padding-left: 20px; padding-right: 20px; }
  .overview-status-line { margin-left: 20px; margin-right: 20px; }
  .overview-grid .section-title { align-items: flex-start; gap: 12px; }
  .overview-grid .section-title a { margin-top: 5px; }
}
@media (max-width: 560px) {
  .stat-grid { grid-template-columns: 1fr; }
  .overview-updated { font-size: .72rem; }
  .overview-grid .section-title { flex-wrap: wrap; }
  .overview-grid .section-title a { margin-left: auto; }
  .overview-session-row > span { align-self: flex-start; }
  .overview-status-line { gap: 10px 14px; }
}

/* Jerarquía visual del panel: módulo principal, estado lateral y acceso inferior. */
.overview-primary-grid { align-items: stretch; grid-template-columns: minmax(0, 1.65fr) minmax(310px, .85fr); }
.overview-primary-grid .overview-module-card { min-height: 352px; }
.overview-primary-grid .overview-events-card { grid-column: auto; }
.overview-system-card .section-title { min-height: 92px; }
.overview-access-card { margin-top: 20px; }
.overview-access-card .section-title { min-height: 92px; }
.overview-module-link { align-items: center; background: #f5f7fc; border: 1px solid #d8e0ef; border-radius: 7px; color: #2457d6 !important; display: inline-flex; flex: 0 0 132px; font-size: .76rem; font-weight: 750; gap: 8px; height: 34px; justify-content: center; padding: 0 10px; text-decoration: none; transition: background .16s ease, border-color .16s ease, box-shadow .16s ease, transform .16s ease; width: 132px; }
.overview-grid .section-title a.overview-module-link { font-size: .76rem; line-height: 1; }
.overview-module-link span { font-size: .95rem; line-height: 1; }
.overview-module-link:hover { background: #eaf0ff; border-color: #b9c8ff; box-shadow: 0 4px 10px #2457d614; transform: translateY(-1px); }
.overview-module-link:focus-visible { outline: 3px solid #2457d633; outline-offset: 2px; }
.overview-access-card .overview-session-list { display: grid; gap: 12px; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); padding: 0 20px 20px; }
.overview-access-card .overview-session-row { background: #f8faff; border: 1px solid #e8edf5; border-radius: 10px; display: flex; flex-direction: column; align-items: flex-start; gap: 14px; justify-content: space-between; min-height: 104px; padding: 15px; }
.overview-access-card .overview-session-row:last-child { border-bottom: 1px solid #e8edf5; }
.overview-access-card .overview-session-row > span { margin-top: auto; }
.overview-access-card .overview-session-unrestricted { background: #f2fbf5; border-color: #cfead8; margin-top: 0; }
.overview-access-card .overview-session-unrestricted > span b { color: #16824b; }
.overview-access-card .overview-empty { grid-column: 1 / -1; }
@media (max-width: 1100px) and (min-width: 801px) {
  .overview-primary-grid { grid-template-columns: minmax(0, 1.35fr) minmax(280px, .85fr); }
}
@media (max-width: 800px) {
  .overview-primary-grid { gap: 16px; grid-template-columns: 1fr; }
  .overview-primary-grid .overview-module-card { min-height: 0; }
  .overview-access-card { margin-top: 16px; }
  .overview-access-card .overview-session-list { grid-template-columns: 1fr; }
}
