:root {
  color-scheme: light;
  --ink: #17243b;
  --muted: #647087;
  --line: #dfe5ee;
  --soft: #f4f6f9;
  --panel: #ffffff;
  --navy: #101a2d;
  --navy-soft: #19263d;
  --accent: #1f6feb;
  --accent-dark: #1558bd;
  --green: #178267;
  --amber: #a96100;
  --shadow: 0 10px 28px rgba(24, 39, 63, 0.07);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }

* { box-sizing: border-box; }
body { margin: 0; min-width: 320px; background: var(--soft); color: var(--ink); }
button, input, select { font: inherit; }
button { cursor: pointer; }
button:disabled { cursor: not-allowed; opacity: .5; }

.login-screen { position: relative; min-height: 100vh; display: grid; place-items: center; overflow: hidden; padding: 28px; background: #0b1628; }
.login-screen::before, .login-screen::after { content: ""; position: absolute; border-radius: 50%; pointer-events: none; filter: blur(1px); }
.login-screen::before { top: -270px; left: -160px; width: 620px; height: 620px; background: radial-gradient(circle, rgba(48, 105, 184, .25), transparent 68%); }
.login-screen::after { right: -230px; bottom: -340px; width: 720px; height: 720px; background: radial-gradient(circle, rgba(23, 130, 103, .14), transparent 68%); }
.login-layout { position: relative; z-index: 1; display: grid; grid-template-columns: minmax(360px, .92fr) minmax(430px, 1.08fr); width: min(960px, 100%); min-height: 540px; overflow: hidden; border: 1px solid rgba(255,255,255,.14); border-radius: 20px; background: #fff; box-shadow: 0 36px 100px rgba(0,0,0,.38); }
.login-intro { position: relative; display: flex; flex-direction: column; overflow: hidden; padding: 42px 44px 36px; color: #fff; background: linear-gradient(145deg, #162b4a 0%, #10213b 60%, #102e49 100%); }
.login-intro::after { content: ""; position: absolute; right: -195px; bottom: -205px; z-index: 0; width: 430px; height: 430px; background: url("/assets/logvault-mark-flat.png") center/contain no-repeat; opacity: .075; pointer-events: none; transform: rotate(-4deg); }
.login-brand { position: relative; z-index: 1; display: flex; align-items: center; width: 250px; height: 76px; margin: -10px 0 0 -15px; overflow: hidden; color: #fff; }
.login-brand-logo { display: block; width: 100%; height: 100%; object-fit: cover; }
.login-intro-copy { position: relative; z-index: 1; margin: 36px 0 auto; padding: 0 0 24px; }
.login-intro-copy > p { margin: 0 0 12px; color: #79adfa; font-size: 9px; font-weight: 800; letter-spacing: .15em; }
.login-intro-copy h2 { max-width: 340px; margin: 0 0 16px; font-size: 28px; line-height: 1.16; letter-spacing: -.035em; }
.login-intro-copy > span { display: block; max-width: 325px; color: #b3c0d1; font-size: 12px; line-height: 1.65; }
.login-intro-copy ul { display: grid; gap: 11px; margin: 27px 0 0; padding: 0; color: #d8e0eb; font-size: 11px; list-style: none; }
.login-intro-copy li { display: flex; align-items: center; gap: 9px; }
.login-intro-copy li i { display: grid; place-items: center; flex: 0 0 19px; width: 19px; height: 19px; border-radius: 50%; color: #70d0b3; background: rgba(50,198,154,.11); font-size: 9px; font-style: normal; }
.login-card { display: flex; flex-direction: column; justify-content: center; width: 100%; padding: 54px 62px; background: #fff; }
.login-mode { width: 100%; }
.login-card-head { margin-bottom: 29px; }
.login-card .eyebrow { color: #5577a7; font-size: 9px; font-weight: 800; }
.login-card h1 { margin: 8px 0 11px; color: #15233a; font-size: 30px; line-height: 1.15; letter-spacing: -.045em; }
.login-card h1 span { color: var(--accent); }
.login-copy { max-width: 390px; margin: 0; color: #65738a; font-size: 13px; line-height: 1.6; }
.login-form { display: grid; grid-template-columns: minmax(0, 1fr); gap: 18px; }
.login-form .field { min-width: 0; }
.login-form .field label { margin-bottom: 8px; color: #26364f; font-size: 10px; letter-spacing: .055em; }
.forgot-password-link, .login-back { padding: 0; border: 0; color: #3568aa; background: transparent; font-size: 10px; font-weight: 700; }
.forgot-password-link { display: block; margin: 9px 0 0 auto; }
.forgot-password-link:hover, .login-back:hover { color: #1558bd; text-decoration: underline; }
.forgot-password-link:focus-visible, .login-back:focus-visible { border-radius: 3px; outline: 3px solid rgba(31,111,235,.2); outline-offset: 3px; }
.login-back { display: inline-flex; align-items: center; gap: 6px; margin-bottom: 24px; }
.login-back span { font-size: 14px; line-height: 1; }
.login-form .field input { height: 48px; border-radius: 9px; color: #1c2b42; background: #fbfcfe; }
.login-input-control { position: relative; }
.login-input-control .login-field-icon { position: absolute; top: 50%; left: 14px; z-index: 1; width: 17px; height: 17px; color: #7b899e; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; pointer-events: none; transform: translateY(-50%); transition: color .15s; }
.login-form .login-input-control > input { padding-left: 42px; }
.login-input-control:focus-within .login-field-icon { color: var(--accent); }
.login-password-control { position: relative; }
.login-form .login-password-control input { padding-right: 50px; }
.login-password-control button { position: absolute; top: 5px; right: 5px; height: 36px; padding: 0 10px; border: 0; border-radius: 6px; color: #4773a8; background: transparent; font-size: 9px; font-weight: 700; }
.login-password-control button:hover { background: #edf4fc; }
#toggle-login-password { top: 4px; display: grid; place-items: center; width: 40px; height: 40px; padding: 0; }
#toggle-login-password:focus-visible { outline: 3px solid rgba(31,111,235,.2); outline-offset: 1px; }
.password-eye { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.password-eye-closed, #toggle-login-password[aria-pressed="true"] .password-eye-open { display: none; }
#toggle-login-password[aria-pressed="true"] .password-eye-closed { display: block; }
.login-form .login-button { grid-column: 1; grid-row: auto; width: 100%; height: 48px; margin-top: 2px; border-radius: 9px; box-shadow: 0 8px 20px rgba(31,111,235,.22); transition: background .15s, box-shadow .15s, transform .15s; }
.login-form .login-button:not(:disabled):hover { box-shadow: 0 10px 24px rgba(31,111,235,.28); transform: translateY(-1px); }
.login-form .login-button:not(:disabled):active { box-shadow: 0 5px 12px rgba(31,111,235,.2); transform: translateY(0); }
.login-error { margin: -3px 0 0; padding: 11px 12px; border: 1px solid #edcaca; border-radius: 8px; color: #923b3b; background: #fff7f7; font-size: 11px; line-height: 1.45; }
.login-error.success { color: #286e5d; border-color: #bddfce; background: #f1faf7; }
.login-security-note { display: flex; align-items: center; justify-content: center; gap: 7px; margin: -2px 0 0; color: #7a8799; font-size: 10px; }
.login-security-note svg { width: 15px; height: 15px; color: #2c8a70; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }

.shell { min-height: 100vh; display: grid; grid-template-columns: 238px 1fr; }
.sidebar { position: sticky; top: 0; height: 100vh; display: flex; flex-direction: column; padding: 28px 18px 20px; background: var(--navy); color: #fff; z-index: 5; }
.brand { display: block; padding: 0 2px 23px; color: #fff; text-decoration: none; }
.sidebar-brand-logo { display: block; width: 196px; height: 60px; object-fit: cover; object-position: center; filter: drop-shadow(0 0 7px rgba(0, 153, 255, .18)); }
nav { min-height: 0; flex: 1; display: grid; align-content: start; gap: 11px; overflow-x: hidden; overflow-y: auto; padding-right: 3px; scrollbar-color: #30415c transparent; scrollbar-width: thin; }
.nav-group { display: grid; gap: 2px; }
.nav-group + .nav-group { padding-top: 10px; border-top: 1px solid rgba(151, 169, 195, .13); }
.nav-section-title { margin: 0; padding: 0 12px 4px; color: #62728a; font-size: 8px; font-weight: 800; letter-spacing: .13em; text-transform: uppercase; }
.nav-item { position: relative; display: flex; align-items: center; gap: 11px; min-height: 36px; padding: 0 12px; border-radius: 8px; color: #aeb8c8; font-size: 12px; text-decoration: none; }
.icon-sprite { position: absolute; width: 0; height: 0; overflow: hidden; }
.nav-item > svg { width: 18px; height: 18px; flex: 0 0 18px; fill: none; stroke: #8190a8; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.nav-item.active { color: #fff; background: var(--navy-soft); box-shadow: inset 3px 0 #4c91f5; }
.nav-item.active > svg { stroke: #70a9ff; }
.nav-item em { margin-left: auto; color: #6f7e96; font-size: 8px; font-style: normal; letter-spacing: .08em; text-transform: uppercase; }
.nav-item.disabled { cursor: default; }
.account-card { display: grid; grid-template-columns: 31px minmax(0, 1fr) 27px 27px; align-items: center; gap: 6px; margin-top: 15px; padding: 12px 9px; border: 1px solid #2a3950; border-radius: 8px; background: rgba(255,255,255,.025); }
.account-avatar { width: 31px; height: 31px; display: grid; place-items: center; border-radius: 50%; color: #fff; background: #2b6bc5; font-size: 11px; font-weight: 700; }
.account-copy { min-width: 0; }
.account-copy strong, .account-copy small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.account-copy strong { color: #eef3fb; font-size: 10px; }
.account-copy small { margin-top: 3px; color: #7f8da2; font-size: 8px; }
.account-card button { width: 27px; height: 27px; padding: 0; border: 0; border-radius: 6px; color: #8e9cb1; background: transparent; font-size: 16px; }
.account-card button:hover { color: #fff; background: #25344b; }
.sidebar-version { flex: 0 0 auto; padding: 8px 4px 0; color: #62728a; font-size: 8px; font-weight: 600; letter-spacing: .025em; text-align: center; }

main { min-width: 0; }
.topbar { min-height: 82px; display: flex; align-items: center; gap: 14px; padding: 0 34px; background: var(--panel); border-bottom: 1px solid var(--line); }
.topbar h1 { margin: 2px 0 0; font-size: 21px; letter-spacing: -.02em; }
.eyebrow { margin: 0; color: #78859a; font-size: 9px; font-weight: 700; letter-spacing: .11em; text-transform: uppercase; }
.environment { display: flex; align-items: center; gap: 7px; margin-left: auto; padding: 7px 10px; border: 1px solid #d5e3dc; border-radius: 18px; color: #2a6f5d; background: #f6fbf9; font-size: 10px; font-weight: 600; }
.environment span { width: 6px; height: 6px; border-radius: 50%; background: #2fa27f; }
.tenant-context { display: flex; align-items: center; gap: 13px; margin-left: auto; padding: 7px 8px 7px 12px; border: 1px solid #cddcf0; border-radius: 9px; background: #f5f9ff; }
.tenant-context > div { min-width: 0; }
.tenant-context span, .tenant-context strong { display: block; }
.tenant-context span { color: #718198; font-size: 7px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.tenant-context strong { max-width: 240px; margin-top: 2px; overflow: hidden; color: #223752; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.tenant-context button { height: 28px; padding: 0 10px; border: 1px solid #b9cbe3; border-radius: 6px; color: #2d65a8; background: #fff; font-size: 9px; font-weight: 700; }
.tenant-context button:hover { border-color: #78a2d7; background: #eef5ff; }
.tenant-context + .environment { margin-left: 0; }
.menu-button { display: none; border: 0; background: transparent; color: var(--ink); font-size: 20px; }

.content { width: min(1460px, 100%); margin: 0 auto; padding: 31px 34px 48px; }
.intro { display: flex; align-items: end; justify-content: space-between; gap: 24px; margin-bottom: 20px; }
.intro h2 { margin: 0 0 6px; font-size: 25px; letter-spacing: -.035em; }
.intro p { margin: 0; color: var(--muted); font-size: 13px; }
.retention-card { min-width: 150px; padding: 10px 13px; border-left: 2px solid #9facc0; }
.retention-card span, .retention-card strong { display: block; }
.retention-card span { color: #7f8a9b; font-size: 8px; font-weight: 700; letter-spacing: .11em; }
.retention-card strong { margin-top: 3px; font-size: 12px; }

.search-panel { display: grid; grid-template-columns: minmax(210px, 1.05fr) minmax(195px, .72fr) minmax(255px, 1.1fr) minmax(120px, .62fr) minmax(125px, .62fr) 118px; gap: 14px; align-items: start; padding: 20px; background: var(--panel); border: 1px solid var(--line); border-radius: 11px; box-shadow: var(--shadow); }
.field label { display: block; margin: 0 0 7px; color: #344158; font-size: 10px; font-weight: 700; letter-spacing: .035em; text-transform: uppercase; }
.field label span { color: #8d97a7; font-size: 8px; font-weight: 500; }
.field input, .field select { width: 100%; height: 42px; padding: 0 12px; border: 1px solid #cfd7e3; border-radius: 7px; outline: none; color: var(--ink); background: #fff; font-size: 13px; transition: border-color .15s, box-shadow .15s; }
.field input:focus, .field select:focus { border-color: #6c9fec; box-shadow: 0 0 0 3px rgba(31, 111, 235, .11); }
.field-help { display: block; margin-top: 5px; color: #7b8798; font-size: 8px; line-height: 1.35; }
.cep-field-status { min-height: 11px; transition: color .15s; }
.cep-field-status.loading { color: #386da8; }
.cep-field-status.success { color: #26725d; }
.cep-field-status.error { color: #a34646; }
.field input.cep-loading { padding-right: 34px; color: #5f7189; background-image: radial-gradient(circle at center, transparent 45%, #4e83c3 47%, #4e83c3 58%, transparent 60%); background-position: right 12px center; background-repeat: no-repeat; background-size: 13px 13px; }
.password-generator { position: relative; }
.password-generator input { padding-right: 92px; font-family: "SFMono-Regular", Consolas, monospace; }
.password-generator-button { position: absolute; top: 5px; right: 5px; height: 32px; padding: 0 10px; border: 1px solid #c6d4e6; border-radius: 5px; color: #315b91; background: #f3f7fd; font-size: 9px; font-weight: 700; }
.password-generator-button:hover { border-color: #8da9ce; background: #eaf2fd; }
.erp-toggle { grid-column: 1 / 5; display: flex; align-items: center; gap: 8px; width: fit-content; margin-top: 2px; color: #566278; font-size: 11px; cursor: pointer; }
.erp-toggle input { position: absolute; opacity: 0; pointer-events: none; }
.erp-toggle span { position: relative; width: 27px; height: 16px; border-radius: 10px; background: #b6bfcc; transition: background .15s; }
.erp-toggle span::after { content: ""; position: absolute; top: 2px; left: 2px; width: 12px; height: 12px; border-radius: 50%; background: #fff; transition: transform .15s; }
.erp-toggle input:checked + span { background: var(--accent); }
.erp-toggle input:checked + span::after { transform: translateX(11px); }
.search-panel > .primary-button { align-self: start; margin-top: 24px; }
.primary-button { grid-column: 6; grid-row: 1; height: 42px; min-width: 118px; border: 0; border-radius: 7px; color: #fff; background: var(--accent); font-size: 12px; font-weight: 700; box-shadow: 0 5px 14px rgba(31, 111, 235, .2); }
.primary-button:hover { background: var(--accent-dark); }
.spinner { display: none; width: 14px; height: 14px; margin: auto; border: 2px solid rgba(255,255,255,.4); border-top-color: #fff; border-radius: 50%; animation: spin .7s linear infinite; }
.primary-button.loading .button-label { display: none; }
.primary-button.loading .spinner { display: block; }
@keyframes spin { to { transform: rotate(360deg); } }

.notice { display: flex; gap: 11px; align-items: flex-start; margin-top: 15px; padding: 12px 14px; border: 1px solid #eedcbf; border-radius: 8px; background: #fffaf0; color: #6b4d1e; }
.notice > span { flex: 0 0 20px; height: 20px; display: grid; place-items: center; border: 1px solid #d5a75c; border-radius: 50%; font-family: Georgia, serif; font-size: 12px; }
.notice strong { display: block; font-size: 11px; }
.notice p { margin: 2px 0 0; color: #826a43; font-size: 10px; }

.results-panel { margin-top: 19px; overflow: hidden; background: var(--panel); border: 1px solid var(--line); border-radius: 11px; box-shadow: var(--shadow); }
.results-header { min-height: 82px; display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 17px 20px; border-bottom: 1px solid var(--line); }
.results-header h2 { margin: 3px 0; font-size: 16px; }
.audit-line { margin: 0; color: #818c9d; font-size: 9px; }
.export-actions { display: flex; gap: 8px; }
.secondary-button { height: 34px; padding: 0 13px; border: 1px solid #ccd5e2; border-radius: 6px; color: #35435a; background: #fff; font-size: 10px; font-weight: 700; }
.secondary-button:not(:disabled):hover { border-color: #8da9ce; background: #f7faff; }
.state { min-height: 280px; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 36px; text-align: center; }
.state-icon { width: 44px; height: 44px; display: grid; place-items: center; margin-bottom: 12px; border: 1px solid #dce3ed; border-radius: 50%; color: #8490a2; background: #f7f8fa; font-size: 22px; }
.state strong { font-size: 13px; }
.state p { margin: 5px 0 0; color: #7b8798; font-size: 11px; }
.error-state .state-icon { color: #aa3e3e; border-color: #edcaca; background: #fff7f7; }
.table-wrap { overflow-x: auto; }
table { width: 100%; border-collapse: collapse; font-size: 11px; }
th { padding: 11px 14px; color: #68758a; background: #f7f8fa; border-bottom: 1px solid var(--line); font-size: 8px; letter-spacing: .065em; text-align: left; text-transform: uppercase; white-space: nowrap; }
td { padding: 14px; border-bottom: 1px solid #edf0f4; color: #334158; white-space: nowrap; }
tbody tr:last-child td { border-bottom: 0; }
tbody tr:hover { background: #fafcff; }
.ip-value { color: #14233b; font-family: "SFMono-Regular", Consolas, monospace; font-weight: 600; }
.protocol-pill, .event-pill { display: inline-flex; padding: 4px 7px; border-radius: 12px; font-size: 9px; font-weight: 700; }
.protocol-pill { color: #315b91; background: #edf4fd; }
.event-pill { color: var(--green); background: #ebf8f4; }
.erp-muted { color: #8a95a5; }

.devices-intro { align-items: center; }
.device-page-actions { display: flex; gap: 8px; }
.refresh-button { height: 38px; }
.alerts-configure-button { grid-column: auto; grid-row: auto; padding: 0 16px; font-size: 10px; }
.device-summary { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; margin-bottom: 19px; }
.device-summary article { padding: 18px 19px; border: 1px solid var(--line); border-radius: 10px; background: var(--panel); box-shadow: var(--shadow); }
.device-summary span, .device-summary strong, .device-summary small { display: block; }
.device-summary span { color: #7c8899; font-size: 8px; font-weight: 700; letter-spacing: .1em; }
.device-summary strong { margin: 6px 0 3px; font-size: 24px; letter-spacing: -.04em; }
.device-summary small { color: #8a95a4; font-size: 9px; }
.device-summary .summary-good { color: var(--green); }
.device-summary .summary-warning { color: var(--amber); }
.device-summary .summary-critical { color: #b64242; }
.dashboard-controls { display: flex; align-items: end; gap: 8px; }
.dashboard-controls label { align-self: center; color: #748197; font-size: 9px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
.dashboard-controls select { height: 38px; min-width: 150px; padding: 0 10px; border: 1px solid #ccd5e2; border-radius: 6px; color: #35435a; background: #fff; font-size: 10px; }
.dashboard-highlight-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; margin-bottom: 19px; }
.dashboard-highlight-grid article { min-width: 0; padding: 17px 18px; border: 1px solid var(--line); border-radius: 10px; background: #18243a; box-shadow: var(--shadow); }
.dashboard-highlight-grid span, .dashboard-highlight-grid strong, .dashboard-highlight-grid small { display: block; }
.dashboard-highlight-grid span { min-height: 22px; color: #9facc0; font-size: 8px; font-weight: 700; letter-spacing: .055em; line-height: 1.4; }
.dashboard-highlight-grid strong { margin: 7px 0 5px; overflow: hidden; color: #fff; font: 700 15px/1.25 "SFMono-Regular", Consolas, monospace; text-overflow: ellipsis; white-space: nowrap; }
.dashboard-highlight-grid small { color: #b7c1cf; font-size: 9px; line-height: 1.45; }
.dashboard-chart-panel { margin-top: 0; }
.dashboard-chart-wrap { padding: 16px 20px 20px; overflow-x: auto; }
.dashboard-chart-legend { display: flex; justify-content: flex-end; gap: 16px; margin-bottom: 13px; color: #6e7b8e; font-size: 9px; }
.dashboard-chart-legend span { display: inline-flex; align-items: center; gap: 6px; }
.dashboard-chart-legend i { width: 9px; height: 9px; border-radius: 2px; }
.dashboard-chart-legend i.allocated { background: #2a9d7c; }
.dashboard-chart-legend i.deallocated { background: #7489aa; }
.dashboard-chart { display: flex; align-items: stretch; gap: 4px; min-width: 720px; height: 270px; padding: 10px 4px 0; border-bottom: 1px solid #dce3ed; background: repeating-linear-gradient(to top, transparent 0, transparent 66px, #edf1f6 67px); }
.dashboard-chart-column { display: grid; flex: 1 1 0; grid-template-rows: minmax(0, 1fr) 24px; min-width: 16px; gap: 6px; }
.dashboard-chart-bars { display: flex; align-items: end; justify-content: center; gap: 2px; min-height: 0; }
.dashboard-chart-bar { width: min(10px, 42%); min-height: 0; border-radius: 3px 3px 0 0; transition: opacity .15s; }
.dashboard-chart-bar:hover { opacity: .75; }
.dashboard-chart-bar.allocated { background: #2a9d7c; }
.dashboard-chart-bar.deallocated { background: #7489aa; }
.dashboard-chart-label { overflow: visible; color: #8490a2; font-size: 8px; text-align: center; white-space: nowrap; }
.dashboard-note { margin-top: 19px; }
.server-health-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; padding: 18px; background: #f7f9fc; }
.continuity-summary { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.continuity-summary article:last-child strong { font-size: 15px; line-height: 1.35; }
.continuity-command-center { position: relative; display: grid; grid-template-columns: minmax(260px, 1.15fr) minmax(420px, 1.85fr); gap: 24px; overflow: hidden; margin-bottom: 18px; padding: 24px 26px; border: 1px solid #233452; border-radius: 13px; color: #fff; background: linear-gradient(135deg, #132039 0%, #1b2e4d 58%, #183f4a 100%); box-shadow: 0 12px 30px rgba(18, 32, 55, .14); }
.continuity-command-center::after { position: absolute; right: -80px; bottom: -110px; width: 270px; height: 270px; border: 1px solid rgba(255,255,255,.08); border-radius: 50%; box-shadow: 0 0 0 38px rgba(255,255,255,.025), 0 0 0 76px rgba(255,255,255,.018); content: ""; }
.continuity-command-primary { position: relative; z-index: 1; display: flex; align-items: center; gap: 17px; min-width: 0; }
.continuity-command-icon { display: grid; flex: 0 0 auto; place-items: center; width: 48px; height: 48px; border: 1px solid rgba(115, 224, 190, .3); border-radius: 12px; color: #76d7bb; background: rgba(47, 174, 140, .12); }
.continuity-command-icon svg { width: 25px; height: 25px; fill: none; stroke: currentColor; }
.continuity-command-primary .eyebrow { color: #8fa1b9; }
.continuity-command-primary strong { display: block; margin-top: 5px; color: #fff; font-size: 25px; line-height: 1.15; }
.continuity-command-primary .continuity-value.healthy { color: #78dfbf; }
.continuity-command-primary .continuity-value.warning { color: #ffd280; }
.continuity-command-primary .continuity-value.critical { color: #ff9da5; }
.continuity-command-primary .continuity-value.disabled, .continuity-command-primary .continuity-value.unknown { color: #fff; }
.continuity-command-primary > div > p:last-child { margin: 7px 0 0; color: #b9c6d7; font-size: 10px; line-height: 1.45; }
.continuity-command-metrics { position: relative; z-index: 1; display: grid; grid-template-columns: .75fr .85fr 1.4fr; align-items: stretch; border: 1px solid rgba(255,255,255,.1); border-radius: 10px; background: rgba(7, 17, 34, .2); }
.continuity-command-metrics article { min-width: 0; padding: 14px 17px; border-left: 1px solid rgba(255,255,255,.1); }
.continuity-command-metrics article:first-child { border-left: 0; }
.continuity-command-metrics span, .continuity-command-metrics strong, .continuity-command-metrics small { display: block; }
.continuity-command-metrics span { color: #8fa1b9; font-size: 8px; font-weight: 800; letter-spacing: .08em; }
.continuity-command-metrics strong { overflow: hidden; margin: 8px 0 5px; color: #fff; font-size: 18px; text-overflow: ellipsis; white-space: nowrap; }
.continuity-command-metrics .continuity-value.healthy { color: #78dfbf; }
.continuity-command-metrics .continuity-value.warning { color: #ffd280; }
.continuity-command-metrics .continuity-value.critical { color: #ff9da5; }
.continuity-command-metrics .continuity-value.disabled, .continuity-command-metrics .continuity-value.unknown { color: #fff; }
.continuity-command-metrics small { color: #94a5ba; font-size: 8px; }
.continuity-command-updated { position: absolute; right: 18px; bottom: 7px; z-index: 2; color: rgba(211, 221, 234, .55); font-size: 7px; }
.continuity-topology-panel { overflow: hidden; }
.continuity-observer { padding: 6px 10px; border: 1px solid #dbe3ec; border-radius: 999px; color: #67758a; background: #f7f9fc; font-size: 8px; font-weight: 700; }
.continuity-topology { display: grid; grid-template-columns: minmax(0, 1fr) 178px minmax(0, 1fr); align-items: stretch; gap: 16px; padding: 20px; background: #f5f8fb; }
.continuity-site-card { overflow: hidden; min-width: 0; border: 1px solid #dbe3ec; border-radius: 12px; background: #fff; box-shadow: 0 5px 18px rgba(28, 45, 72, .045); transition: border-color .2s, box-shadow .2s, transform .2s; }
.continuity-site-card.active { border-color: #7fcab5; box-shadow: 0 8px 24px rgba(33, 138, 109, .11); }
.continuity-site-card.standby { border-color: #b8c7dc; }
.continuity-site-card.critical { border-color: #e6afb3; }
.continuity-site-card > header { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; padding: 18px 18px 15px; border-bottom: 1px solid #e8edf3; background: linear-gradient(180deg, #fff, #fbfcfe); }
.continuity-site-card > header div { min-width: 0; }
.continuity-site-card > header span, .continuity-site-card > header strong, .continuity-site-card > header small { display: block; }
.continuity-site-card > header span { margin-bottom: 5px; color: #8290a2; font-size: 8px; font-weight: 800; letter-spacing: .1em; }
.continuity-site-card > header strong { overflow: hidden; color: #17243a; font-size: 16px; text-overflow: ellipsis; white-space: nowrap; }
.continuity-site-card > header small { overflow: hidden; margin-top: 5px; color: #8491a2; font: 9px/1.3 ui-monospace, SFMono-Regular, Menlo, monospace; text-overflow: ellipsis; white-space: nowrap; }
.continuity-site-card > header em { flex: 0 0 auto; padding: 6px 9px; border-radius: 999px; color: #657388; background: #edf1f5; font-size: 8px; font-style: normal; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; }
.continuity-site-card.active > header em { color: #16684f; background: #ddf3eb; }
.continuity-site-card.standby > header em { color: #4f6688; background: #eaf0f8; }
.continuity-site-card.critical > header em { color: #a43a42; background: #f9e6e8; }
.continuity-site-services { padding: 8px 17px; }
.continuity-site-services > div { display: grid; grid-template-columns: 31px minmax(0, 1fr) 9px; align-items: center; gap: 10px; padding: 11px 0; border-top: 1px solid #edf1f5; }
.continuity-site-services > div:first-child { border-top: 0; }
.continuity-service-icon { position: relative; display: block; width: 29px; height: 29px; border-radius: 8px; background: #edf2f7; }
.continuity-service-icon::before, .continuity-service-icon::after { position: absolute; content: ""; }
.continuity-service-icon.database::before { inset: 7px 7px 9px; border: 1.5px solid #6c7d94; border-radius: 50%; box-shadow: 0 5px 0 -1px #edf2f7, 0 5px 0 0 #6c7d94; }
.continuity-service-icon.storage::before { inset: 7px; border: 1.5px solid #6c7d94; border-radius: 4px; transform: rotate(45deg); }
.continuity-service-icon.app::before { inset: 7px; border: 1.5px solid #6c7d94; border-radius: 3px; }
.continuity-service-icon.app::after { top: 10px; left: 10px; width: 3px; height: 3px; border-radius: 50%; background: #6c7d94; box-shadow: 6px 0 #6c7d94, 0 6px #6c7d94, 6px 6px #6c7d94; }
.continuity-site-services p { min-width: 0; margin: 0; }
.continuity-site-services p strong, .continuity-site-services p small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.continuity-site-services p strong { color: #27364c; font-size: 11px; }
.continuity-site-services p small { margin-top: 4px; color: #8390a1; font-size: 8px; }
.continuity-site-services i { width: 8px; height: 8px; border-radius: 50%; background: #a8b2c0; box-shadow: 0 0 0 3px #edf1f5; }
.continuity-site-services i.healthy { background: #22956f; box-shadow: 0 0 0 3px #dff3eb; }
.continuity-site-services i.warning { background: #c8891e; box-shadow: 0 0 0 3px #fff0d2; }
.continuity-site-services i.critical { background: #be424b; box-shadow: 0 0 0 3px #fae3e5; }
.continuity-site-card > footer { padding: 12px 17px; border-top: 1px solid #e8edf3; background: #fafbfd; }
.continuity-site-card > footer span, .continuity-site-card > footer strong { display: block; }
.continuity-site-card > footer span { color: #8995a5; font-size: 7px; font-weight: 800; letter-spacing: .08em; }
.continuity-site-card > footer strong { overflow: hidden; margin-top: 5px; color: #4c5d73; font: 9px/1.3 ui-monospace, SFMono-Regular, Menlo, monospace; text-overflow: ellipsis; white-space: nowrap; }
.continuity-replication-lane { display: flex; align-items: center; justify-content: center; flex-direction: column; min-width: 0; padding: 18px 4px; text-align: center; }
.continuity-flow-label { color: #8491a2; font-size: 7px; font-weight: 800; letter-spacing: .1em; }
.continuity-flow-line { display: flex; align-items: center; width: 100%; margin: 20px 0 18px; color: #8798ad; }
.continuity-flow-line i { position: relative; display: block; flex: 1; height: 2px; overflow: hidden; background: #cbd5e1; }
.continuity-flow-line i::after { position: absolute; inset: 0; background: repeating-linear-gradient(90deg, transparent 0 8px, #2a9d7c 8px 16px); content: ""; animation: continuity-flow 1.2s linear infinite; }
.continuity-flow-line b { margin-left: -3px; font-size: 30px; font-weight: 300; line-height: 0; }
.continuity-replication-lane strong { color: #304057; font-size: 11px; }
.continuity-replication-lane small { max-width: 160px; margin-top: 7px; color: #8290a2; font-size: 8px; line-height: 1.45; }
.continuity-replication-lane.warning .continuity-flow-line i::after { background: repeating-linear-gradient(90deg, transparent 0 8px, #c8891e 8px 16px); }
.continuity-replication-lane.critical .continuity-flow-line i::after { background: #be424b; animation: none; }
.continuity-replication-lane.disabled .continuity-flow-line i::after, .continuity-replication-lane.unknown .continuity-flow-line i::after { background: #a8b4c3; animation: none; }
.continuity-technical { border-top: 1px solid #e3e9f0; background: #fff; }
.continuity-technical summary { display: flex; align-items: center; justify-content: space-between; gap: 15px; padding: 14px 20px; color: #405068; cursor: pointer; font-size: 10px; font-weight: 700; list-style: none; }
.continuity-technical summary::-webkit-details-marker { display: none; }
.continuity-technical summary::before { margin-right: -5px; color: #7d8b9d; content: "+"; font-size: 15px; }
.continuity-technical[open] summary::before { content: "−"; }
.continuity-technical summary small { margin-left: auto; color: #8c98a8; font-size: 8px; font-weight: 400; }
@keyframes continuity-flow { to { transform: translateX(16px); } }
.continuity-value.healthy { color: var(--green); }
.continuity-value.warning { color: var(--amber); }
.continuity-value.critical { color: #b64242; }
.continuity-value.disabled, .continuity-value.unknown { color: #697789; }
.continuity-components { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; padding: 18px; background: #f7f9fc; }
.continuity-component { padding: 17px; border: 1px solid var(--line); border-left: 4px solid #8794a5; border-radius: 10px; background: var(--panel); }
.continuity-component.healthy { border-left-color: var(--green); }
.continuity-component.warning { border-left-color: var(--amber); }
.continuity-component.critical { border-left-color: #b64242; }
.continuity-component > div { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.continuity-component > div strong { font-size: 13px; }
.continuity-component > div span { padding: 4px 8px; border-radius: 999px; background: #edf1f6; color: #657285; font-size: 9px; font-weight: 800; text-transform: uppercase; }
.continuity-component.healthy > div span { background: #e5f5ef; color: var(--green); }
.continuity-component.warning > div span { background: #fff3d9; color: #986310; }
.continuity-component.critical > div span { background: #fae8e9; color: #a63740; }
.continuity-component b { display: block; margin-top: 14px; color: #263346; font-size: 12px; }
.continuity-component p { margin: 5px 0 0; color: #7b8797; font-size: 10px; line-height: 1.5; }
.continuity-settings-panel { margin-top: 18px; }
.continuity-settings-head { align-items: center; }
.continuity-settings-head .primary-button { grid-column: auto; width: auto; }
.continuity-settings-overview { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; padding: 18px; background: #f8fafc; }
.continuity-settings-overview article { padding: 15px; border: 1px solid #dfe5ed; border-radius: 9px; background: #fff; }
.continuity-settings-overview span, .continuity-settings-overview strong, .continuity-settings-overview small { display: block; }
.continuity-settings-overview span { color: #8490a1; font-size: 8px; font-weight: 800; letter-spacing: .08em; }
.continuity-settings-overview strong { margin: 7px 0 4px; color: #34435a; font-size: 14px; }
.continuity-settings-overview small { color: #8491a2; font-size: 9px; }
.continuity-prerequisites { margin-top: 18px; padding: 14px 16px; border: 1px solid #dfe5ed; border-radius: 9px; background: #f8fafc; }
.continuity-prerequisites strong { color: #34435a; font-size: 11px; }
.continuity-prerequisites p { margin: 6px 0 0; color: #778397; font-size: 10px; line-height: 1.55; }
.continuity-enrollment-command { margin-top: 18px; }
.continuity-enrollment-command label { display: block; margin-bottom: 7px; color: #435168; font-size: 10px; font-weight: 700; }
.continuity-enrollment-command textarea { box-sizing: border-box; width: 100%; resize: vertical; padding: 12px; border: 1px solid #cfd8e4; border-radius: 8px; background: #172033; color: #d9e4f2; font: 10px/1.55 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; }
.continuity-enrollment-command .secondary-button { margin-top: 9px; width: auto; }
.continuity-wizard-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.continuity-site-names { margin-top: 18px; }
.continuity-site-names-help { margin: 9px 0 0; color: #7a8798; font-size: 9px; line-height: 1.5; }
.continuity-wizard-grid .field-wide { grid-column: 1 / -1; }
.continuity-number-field { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; }
.continuity-number-field input { border-radius: 7px 0 0 7px; }
.continuity-number-field span { align-self: stretch; display: flex; align-items: center; padding: 0 12px; border: 1px solid var(--line); border-left: 0; border-radius: 0 7px 7px 0; background: #f4f6f9; color: #778397; font-size: 10px; }
.continuity-test-state { display: flex; align-items: center; gap: 13px; margin-top: 20px; padding: 15px 16px; border: 1px solid #dbe3ed; border-radius: 9px; background: #f8fafc; }
.continuity-test-state > span { display: grid; place-items: center; flex: 0 0 auto; width: 30px; height: 30px; border-radius: 50%; color: #697789; background: #e8edf3; font-weight: 800; }
.continuity-test-state strong { display: block; color: #34435a; font-size: 11px; }
.continuity-test-state p { margin: 4px 0 0; color: #7b8797; font-size: 9px; line-height: 1.4; }
.continuity-test-state.healthy { border-color: #b9ddcf; background: #f0faf6; }
.continuity-test-state.healthy > span { color: var(--green); background: #dff3eb; }
.continuity-test-state.critical { border-color: #edc3c6; background: #fff5f5; }
.continuity-test-state.critical > span { color: #b64242; background: #f8dfe1; }
.server-health-card { min-width: 0; padding: 18px; border: 1px solid #dfe5ed; border-radius: 10px; background: #fff; box-shadow: 0 4px 14px rgba(24, 39, 66, .045); }
.server-health-card.infrastructure { border-top: 3px solid #77a8df; }
.server-health-card.infrastructure:nth-child(2) { border-top-color: #83bca9; }
.server-health-card.collector-first { grid-column: 1; }
.server-health-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; margin-bottom: 17px; }
.server-health-identity { min-width: 0; }
.server-health-identity > span { display: block; margin-bottom: 4px; color: #778498; font-size: 8px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.server-health-identity strong { display: block; overflow: hidden; color: #1d2b42; font-size: 14px; text-overflow: ellipsis; white-space: nowrap; }
.server-health-identity small { display: block; margin-top: 5px; overflow: hidden; color: #8994a4; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.server-health-status { flex: 0 0 auto; padding: 5px 8px; border-radius: 14px; font-size: 8px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; }
.server-health-status.healthy { color: #24735d; background: #e9f7f2; }
.server-health-status.warning, .server-health-status.collecting { color: #8b681f; background: #fff6df; }
.server-health-status.critical, .server-health-status.offline { color: #9a4141; background: #fbecee; }
.server-health-status.disabled { color: #647086; background: #eef1f5; }
.server-health-status.not_implemented { color: #66758a; background: #edf1f5; }
.server-health-card.not_implemented { border-style: dashed; border-top-color: #aeb9c7; background: #fbfcfd; box-shadow: none; }
.server-resource-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.server-resource { min-width: 0; padding: 12px; border: 1px solid #e7ebf1; border-radius: 8px; background: #fafbfd; }
.server-resource-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.server-resource-head span { color: #748197; font-size: 8px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
.server-resource-head .server-resource-name { display: inline-flex; align-items: center; gap: 6px; min-width: 0; }
.server-resource-name svg { flex: 0 0 auto; width: 13px; height: 13px; fill: none; stroke: #3e7fce; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.server-resource-head strong { color: #26364f; font-size: 11px; }
.server-resource-bar { height: 6px; margin: 9px 0 7px; overflow: hidden; border-radius: 4px; background: #e7ebf1; }
.server-resource-bar i { display: block; height: 100%; border-radius: inherit; background: #3c8cda; }
.server-resource.warning .server-resource-bar i { background: #d5a63a; }
.server-resource.critical .server-resource-bar i { background: #d05b64; }
.server-resource small { display: block; overflow: hidden; color: #8994a4; font-size: 8px; line-height: 1.4; text-overflow: ellipsis; white-space: nowrap; }
.server-health-foot { display: flex; justify-content: space-between; gap: 12px; margin-top: 13px; color: #8792a2; font-size: 8px; }
.server-hosted-collectors { overflow: hidden; margin-top: 14px; border: 1px solid #e2e8f0; border-radius: 8px; background: #fafbfd; }
.server-hosted-head, .server-hosted-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.server-hosted-head { padding: 9px 11px; border-bottom: 1px solid #e5eaf1; color: #53647b; }
.server-hosted-head strong { font-size: 9px; }
.server-hosted-head span { display: grid; place-items: center; min-width: 20px; height: 20px; border-radius: 10px; color: #54708f; background: #eaf0f7; font-size: 8px; font-weight: 800; }
.server-hosted-row { padding: 9px 11px; }
.server-hosted-row + .server-hosted-row { border-top: 1px solid #e9edf3; }
.server-hosted-row p { min-width: 0; margin: 0; }
.server-hosted-row p strong, .server-hosted-row p small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.server-hosted-row p strong { color: #293a52; font-size: 9px; }
.server-hosted-row p small { margin-top: 3px; color: #8491a2; font-size: 7px; }
.server-hosted-placement { flex: 0 0 auto; padding: 4px 7px; border-radius: 10px; color: #526780; background: #eaf0f7; font-size: 7px; font-weight: 800; text-transform: uppercase; }
.server-hosted-placement.active { color: #1d7459; background: #def3eb; }
.server-hosted-placement.standby { color: #4f6788; background: #e8eff8; }
.server-hosted-placement.offline { color: #a23d48; background: #fae8eb; }
.server-hosted-placement.disabled, .server-hosted-placement.not_implemented { color: #69768a; background: #edf0f4; }
.server-hosted-remaining { display: block; padding: 0 11px 9px; color: #77869a; font-size: 7px; font-weight: 700; }
.server-health-note { margin-top: 19px; }
.server-history-panel { margin-top: 19px; }
.server-history-head { align-items: flex-end; }
.server-history-controls { display: flex; align-items: center; justify-content: flex-end; gap: 9px; }
.server-history-controls label { color: #748197; font-size: 8px; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; }
.server-history-controls select { height: 34px; min-width: 190px; padding: 0 30px 0 10px; border: 1px solid #ccd5e2; border-radius: 6px; color: #35435a; background: #fff; font-size: 10px; }
.server-period-picker { display: inline-flex; padding: 3px; border: 1px solid #d9e0e9; border-radius: 7px; background: #f4f6f9; }
.server-period-picker button { height: 27px; padding: 0 10px; border: 0; border-radius: 5px; color: #718096; background: transparent; font-size: 8px; font-weight: 700; white-space: nowrap; }
.server-period-picker button:hover { color: #315b91; }
.server-period-picker button.active { color: #fff; background: #315f9b; box-shadow: 0 2px 6px rgba(49, 95, 155, .2); }
.server-history-content { padding: 18px 20px 14px; }
.server-history-summary { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 10px; margin-bottom: 16px; }
.server-history-summary article { padding: 12px 14px; border: 1px solid #e3e8ef; border-radius: 8px; background: #fafbfd; }
.server-history-summary span, .server-history-summary strong, .server-history-summary small { display: block; }
.server-history-summary span { color: #7a879a; font-size: 8px; font-weight: 700; letter-spacing: .065em; text-transform: uppercase; }
.server-history-summary strong { margin: 5px 0 2px; color: #26364f; font-size: 16px; }
.server-history-summary small { color: #8a95a4; font-size: 8px; }
.server-history-summary article.cpu { border-left: 3px solid #357fd1; }
.server-history-summary article.memory { border-left: 3px solid #2d9a78; }
.server-history-summary article.storage { border-left: 3px solid #9a6bc0; }
.server-history-summary article.network-in { border-left: 3px solid #1688a7; }
.server-history-summary article.network-out { border-left: 3px solid #df7b35; }
.server-history-legend { display: flex; justify-content: flex-end; gap: 17px; margin-bottom: 8px; color: #657389; font-size: 9px; }
.server-history-legend span { display: inline-flex; align-items: center; gap: 6px; }
.server-history-legend i { width: 17px; height: 3px; border-radius: 2px; }
.server-history-legend i.cpu { background: #357fd1; }
.server-history-legend i.memory { background: #2d9a78; }
.server-history-legend i.storage { background: #9a6bc0; }
.server-history-legend i.network-in { background: #1688a7; }
.server-history-legend i.network-out { background: #df7b35; }
.server-history-chart-wrap { position: relative; overflow-x: auto; border: 1px solid #e4e9f0; border-radius: 8px; background: linear-gradient(180deg, #fbfcfe, #fff); }
.server-history-chart { display: block; width: 100%; min-width: 720px; height: auto; min-height: 270px; touch-action: pan-x; }
.server-history-chart .grid-line { stroke: #e8edf3; stroke-width: 1; vector-effect: non-scaling-stroke; }
.server-history-chart .axis-label { fill: #8995a6; font-size: 10px; font-family: Arial, sans-serif; }
.server-history-chart .series-line { fill: none; stroke-width: 2.5; stroke-linecap: round; stroke-linejoin: round; vector-effect: non-scaling-stroke; }
.server-history-chart .series-line.cpu { stroke: #357fd1; }
.server-history-chart .series-line.memory { stroke: #2d9a78; }
.server-history-chart .series-line.storage { stroke: #9a6bc0; }
.server-history-chart .series-line.network-in { stroke: #1688a7; }
.server-history-chart .series-line.network-out { stroke: #df7b35; }
.server-history-chart .hover-line { stroke: #9aa7b9; stroke-width: 1; stroke-dasharray: 4 4; vector-effect: non-scaling-stroke; }
.server-history-chart .hover-point { fill: #fff; stroke-width: 2.5; vector-effect: non-scaling-stroke; }
.server-history-chart .hover-point.cpu { stroke: #357fd1; }
.server-history-chart .hover-point.memory { stroke: #2d9a78; }
.server-history-chart .hover-point.storage { stroke: #9a6bc0; }
.server-history-chart .hover-point.network-in { stroke: #1688a7; }
.server-history-chart .hover-point.network-out { stroke: #df7b35; }
.server-history-tooltip { position: absolute; z-index: 2; min-width: 135px; padding: 9px 10px; border: 1px solid #d9e1ec; border-radius: 7px; color: #445269; background: rgba(255,255,255,.96); box-shadow: 0 6px 18px rgba(33, 48, 72, .12); font-size: 8px; line-height: 1.65; pointer-events: none; }
.server-history-tooltip strong { display: block; margin-bottom: 2px; color: #26364f; font-size: 9px; }
.server-network-history { margin-top: 20px; padding-top: 17px; border-top: 1px solid #e5eaf1; }
.server-network-history-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 18px; margin: 0 2px 9px; }
.server-network-history-head > div:first-child span, .server-network-history-head > div:first-child strong { display: block; }
.server-network-history-head > div:first-child span { color: #7b899c; font-size: 8px; font-weight: 700; letter-spacing: .07em; }
.server-network-history-head > div:first-child strong { margin-top: 4px; color: #26364f; font-size: 13px; }
.server-network-history-head .server-history-legend { margin-bottom: 0; }
.server-history-updated { margin: 9px 2px 0; color: #8a95a4; font-size: 8px; text-align: right; }
.devices-panel { overflow: hidden; border: 1px solid var(--line); border-radius: 11px; background: var(--panel); box-shadow: var(--shadow); }
.devices-panel-head { min-height: 72px; display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 16px 20px; border-bottom: 1px solid var(--line); }
.devices-panel-head h2 { margin: 3px 0 0; font-size: 16px; }
.devices-panel-head > small { color: #8792a2; font-size: 9px; }
.device-loading-dot { width: 18px; height: 18px; margin-bottom: 13px; border: 2px solid #d7e0ec; border-top-color: var(--accent); border-radius: 50%; animation: spin .7s linear infinite; }
.device-list { display: grid; gap: 0; }
.device-card { display: grid; grid-template-columns: minmax(230px, 1.15fr) minmax(125px, .65fr) minmax(330px, 1.5fr); gap: 24px; align-items: center; padding: 20px; border-bottom: 1px solid #edf0f4; }
.device-card:last-child { border-bottom: 0; }
.device-identity { display: flex; align-items: center; gap: 12px; min-width: 0; }
.vendor-badge { flex: 0 0 64px; width: 64px; height: 46px; display: grid; place-items: center; padding: 7px; border: 1px solid #dce5f0; border-radius: 9px; color: #315b91; background: #f8fbff; font-size: 8px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; }
.vendor-badge img { display: block; width: 100%; max-width: 50px; height: 30px; object-fit: contain; }
.device-identity strong, .device-identity small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.device-identity strong { font-size: 12px; }
.device-identity small { margin-top: 4px; color: #808c9d; font-family: "SFMono-Regular", Consolas, monospace; font-size: 9px; }
.device-state { display: flex; align-items: center; gap: 8px; }
.device-state > span:first-child { width: 8px; height: 8px; border-radius: 50%; }
.device-state strong, .device-state small { display: block; }
.device-state strong { font-size: 10px; }
.device-state small { margin-top: 3px; color: #8a95a4; font-size: 8px; }
.device-state.receiving > span:first-child, .device-state.connected > span:first-child { background: #29aa80; box-shadow: 0 0 0 4px rgba(41,170,128,.12); }
.device-state.delayed > span:first-child { background: #d08a24; box-shadow: 0 0 0 4px rgba(208,138,36,.12); }
.device-state.offline > span:first-child, .device-state.never > span:first-child { background: #c75252; box-shadow: 0 0 0 4px rgba(199,82,82,.1); }
.device-state.disabled > span:first-child { background: #9aa4b2; }
.device-metrics { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.device-metrics div { padding-left: 11px; border-left: 1px solid #e2e7ee; }
.device-metrics span, .device-metrics strong { display: block; }
.device-metrics span { color: #8792a2; font-size: 7px; font-weight: 700; letter-spacing: .055em; text-transform: uppercase; }
.device-metrics strong { margin-top: 4px; font-size: 11px; }
.metric-error { color: #b24949; }
.collector-summary { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.collector-card { padding: 20px; border-bottom: 1px solid #edf0f4; }
.collector-card:last-child { border-bottom: 0; }
.collector-primary { display: grid; grid-template-columns: minmax(230px, 1fr) 170px; gap: 24px; align-items: center; }
.collector-mode { flex: 0 0 46px; width: 46px; height: 42px; display: grid; place-items: center; border: 1px solid #ded9ef; border-radius: 9px; color: #5b4a88; background: #f1eef9; }
.collector-mode.cloud { color: #2f72c7; border-color: #d4e3f6; background: #edf5ff; }
.collector-mode svg { width: 23px; height: 23px; fill: none; stroke: currentColor; stroke-width: 1.65; stroke-linecap: round; stroke-linejoin: round; }

.firewall-summary article { display: flex; align-items: center; gap: 13px; min-height: 96px; }
.firewall-summary article > div { min-width: 0; }
.firewall-summary-icon { display: grid !important; place-items: center; flex: 0 0 38px; width: 38px; height: 38px; border-radius: 9px; }
.firewall-summary-icon svg { width: 19px; height: 19px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.firewall-summary-icon.blue { color: #2874d6; background: #edf5ff; }
.firewall-summary-icon.green { color: #168067; background: #e8f6f1; }
.firewall-summary-icon.amber { color: #a66b00; background: #fff3d9; }
.firewall-summary-icon.red { color: #b63a49; background: #fcecef; }
.firewall-summary-icon.violet { color: #7158bd; background: #f1edfb; }
.firewall-tabs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin-bottom: 18px; padding: 5px; border: 1px solid #d9e2ef; border-radius: 12px; background: #eaf0f7; }
.firewall-tabs[hidden] { display: none; }
.firewall-tabs button { display: flex; align-items: center; gap: 11px; min-height: 56px; padding: 8px 14px; color: #65758e; border: 1px solid transparent; border-radius: 9px; background: transparent; font: inherit; text-align: left; cursor: pointer; }
.firewall-tabs button:hover { color: #243a58; background: rgba(255, 255, 255, .55); }
.firewall-tabs button.active { color: #15375f; border-color: #d4deeb; background: #fff; box-shadow: 0 5px 14px rgba(24, 50, 87, .08); }
.firewall-tabs svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.7; }
.firewall-tabs button > span { display: grid; gap: 2px; font-size: 11px; font-weight: 800; }
.firewall-tabs small { color: #8491a4; font-size: 8px; font-weight: 500; }
.firewall-access-summary { margin-bottom: 18px; }
.firewall-host-note { margin-bottom: 18px; border-color: #d9e4f2; background: #f6f9fd; }
.firewall-host-note > span { color: #346da9; border-color: #b8cee8; }
.firewall-access-head { align-items: center; }
.firewall-current-origin { display: grid; justify-items: end; gap: 4px; }
.firewall-current-origin span { color: #8190a4; font-size: 8px; font-weight: 800; letter-spacing: .07em; }
.firewall-current-origin strong { color: #29405f; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 10px; }
.firewall-access-list { display: grid; gap: 15px; padding: 16px; background: #f7f9fc; }
.firewall-access-card { overflow: hidden; border: 1px solid #dce4ef; border-left: 3px solid #8291a7; border-radius: 11px; background: #fff; box-shadow: 0 7px 20px rgba(17, 38, 72, .04); }
.firewall-access-card.allowlist { border-left-color: #249d7d; }
.firewall-access-card-head { display: flex; align-items: center; justify-content: space-between; gap: 24px; min-height: 122px; padding: 19px 20px; }
.firewall-access-identity { display: flex; align-items: center; min-width: 0; gap: 14px; }
.firewall-access-icon { display: grid; place-items: center; flex: 0 0 50px; width: 50px; height: 50px; color: #2874d6; border: 1px solid #d5e3f5; border-radius: 12px; background: #eef5ff; }
.firewall-access-icon svg { width: 24px; height: 24px; fill: none; stroke: currentColor; stroke-width: 1.7; }
.firewall-access-identity > div { display: grid; min-width: 0; gap: 3px; }
.firewall-access-identity > div > span:first-child { color: #76869d; font-size: 8px; font-weight: 800; letter-spacing: .08em; }
.firewall-access-identity h3 { margin: 0; color: var(--ink); font-size: 17px; }
.firewall-access-identity p { margin: 0; color: #66768e; font-size: 9px; }
.firewall-access-port { justify-self: start; margin-top: 4px; padding: 4px 8px; color: #335276; border-radius: 5px; background: #eef3f9; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 9px; }
.firewall-access-controls { display: grid; min-width: 370px; gap: 10px; }
.firewall-access-states { display: flex; align-items: center; justify-content: flex-end; gap: 9px; }
.firewall-access-states small { position: relative; padding-left: 12px; color: #71819a; font-size: 9px; }
.firewall-access-states small::before { position: absolute; top: 50%; left: 0; width: 6px; height: 6px; border-radius: 50%; background: #d99a28; content: ''; transform: translateY(-50%); }
.firewall-access-states small.synchronized { color: #28856f; }
.firewall-access-states small.synchronized::before { background: #2ca17f; }
.firewall-policy-badge.open { color: #58677e; background: #edf1f6; }
.firewall-access-sources { padding: 18px 20px 20px; border-top: 1px solid #e7ecf3; background: #fbfcfe; }
.firewall-rules-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 22px; padding: 20px; border-bottom: 1px solid #dfe6ef; }
.firewall-rules-toolbar h2 { margin: 3px 0 0; color: var(--ink); font-size: 18px; }
.firewall-rules-tools { display: flex; align-items: center; gap: 9px; }
.firewall-rules-tools input, .firewall-rules-tools select { height: 38px; padding: 0 11px; border: 1px solid #cfd9e7; border-radius: 7px; color: #263854; background: #fff; font: inherit; font-size: 10px; outline: none; }
.firewall-rules-tools input { width: 230px; }
.firewall-rules-tools select { min-width: 155px; }
.firewall-rules-tools input:focus, .firewall-rules-tools select:focus { border-color: #6c9fec; box-shadow: 0 0 0 3px rgba(31, 111, 235, .1); }
.firewall-new-rule { grid-column: auto; width: auto; min-width: 108px; min-height: 38px; }
.firewall-service-policies { display: flex; align-items: center; gap: 10px; min-height: 58px; padding: 10px 20px; border-bottom: 1px solid #e5eaf1; background: #f8fafc; }
.firewall-service-policy { display: flex; align-items: center; gap: 9px; min-height: 38px; padding: 5px 7px 5px 11px; border: 1px solid #dbe3ee; border-radius: 8px; background: #fff; }
.firewall-service-policy > div { display: grid; min-width: 94px; gap: 2px; }
.firewall-service-policy > div strong { color: #273a57; font-size: 10px; }
.firewall-service-policy > div span { color: #8794a7; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 8px; }
.firewall-service-policy select { height: 28px; padding: 0 25px 0 8px; border: 1px solid #d3dce8; border-radius: 6px; color: #40516b; background: #fff; font: inherit; font-size: 9px; }
.firewall-service-policy .firewall-apply-button { min-width: 58px; min-height: 28px; height: 28px; padding: 0 8px; }
.firewall-rules-table-wrap { overflow-x: auto; }
.firewall-rules-table { min-width: 720px; }
.firewall-rules-table th { white-space: nowrap; }
.firewall-rules-table td { color: #53627a; font-size: 9px; }
.firewall-rules-table .firewall-rule-source { color: #18314f; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 10px; font-weight: 800; }
.firewall-rule-actions { display: flex; gap: 6px; white-space: nowrap; }
.firewall-rule-dialog { width: min(470px, calc(100% - 28px)); }
.firewall-summary .firewall-summary-icon + div > span { font-size: 8px; }
.firewall-summary .firewall-summary-icon + div > strong { margin: 4px 0 2px; font-size: 22px; }
.firewall-safety-note { margin-bottom: 18px; }
.firewall-collector-list { display: grid; gap: 14px; padding: 16px; background: #f7f9fc; }
.firewall-collector-card { overflow: hidden; border: 1px solid #dce4ef; border-radius: 11px; background: #fff; box-shadow: 0 7px 20px rgba(17, 38, 72, .04); }
.firewall-collector-card.enforce { border-left: 3px solid #249d7d; }
.firewall-collector-card.monitor { border-left: 3px solid #d99a28; }
.firewall-collector-head { display: flex; align-items: center; justify-content: space-between; gap: 24px; min-height: 104px; padding: 18px 20px; }
.firewall-collector-identity { display: flex; align-items: center; min-width: 0; gap: 13px; }
.firewall-collector-icon { display: grid; place-items: center; flex: 0 0 48px; width: 48px; height: 48px; color: #2874d6; border: 1px solid #d5e3f5; border-radius: 11px; background: #eef5ff; }
.firewall-collector-icon svg { width: 25px; height: 25px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.firewall-collector-identity > div { min-width: 0; }
.firewall-collector-identity > div > span { display: block; margin-bottom: 3px; color: #73839d; font-size: 9px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.firewall-collector-identity h3 { margin: 0; color: var(--ink); font-size: 17px; }
.firewall-collector-identity p { margin: 5px 0 0; color: #65758e; font-size: 10px; }
.firewall-port-list { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 9px; }
.firewall-port-list > span { display: inline-flex; align-items: center; gap: 7px; min-height: 26px; margin: 0; padding: 0 9px; border: 1px solid #dce5f0; border-radius: 6px; background: #f7f9fc; text-transform: none; }
.firewall-port-list small { color: #7a899f; font-size: 7px; font-weight: 800; letter-spacing: .055em; }
.firewall-port-list strong { color: #29405f; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 9px; }
.firewall-policy-controls { display: grid; min-width: 360px; gap: 10px; }
.firewall-policy-summary { display: flex; align-items: center; justify-content: flex-end; gap: 9px; }
.firewall-policy-summary > small { position: relative; padding-left: 12px; color: #71819a; font-size: 9px; }
.firewall-policy-summary > small::before { position: absolute; top: 50%; left: 0; width: 6px; height: 6px; border-radius: 50%; content: ''; transform: translateY(-50%); }
.firewall-policy-summary > small.synchronized { color: #28856f; }
.firewall-policy-summary > small.synchronized::before { background: #2ca17f; }
.firewall-policy-summary > small.pending { color: #a16a06; }
.firewall-policy-summary > small.pending::before { background: #d99a28; }
.firewall-policy-badge, .firewall-source-state { display: inline-flex; align-items: center; justify-content: center; border-radius: 999px; font-size: 9px; font-style: normal; font-weight: 800; letter-spacing: .035em; text-transform: uppercase; }
.firewall-policy-badge { min-height: 25px; padding: 0 10px; }
.firewall-policy-badge.enforce { color: #14745e; background: #e6f5ef; }
.firewall-policy-badge.monitor { color: #976000; background: #fff1d2; }
.firewall-policy-badge.local { color: #5d6880; background: #edf1f7; }
.firewall-policy-form { display: grid; grid-template-columns: 1fr auto; gap: 5px 7px; }
.firewall-policy-form label { grid-column: 1 / -1; color: #75849a; font-size: 8px; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; }
.firewall-policy-form select { min-width: 150px; height: 34px; padding: 0 30px 0 10px; border: 1px solid #cfd9e7; border-radius: 7px; background: #fff; color: #253651; font: inherit; font-size: 10px; }
.firewall-apply-button { min-width: 72px; min-height: 34px; padding: 0 12px; }
.firewall-authorized-section, .firewall-observed-section { padding: 18px 20px 20px; border-top: 1px solid #e7ecf3; }
.firewall-authorized-section { background: #fbfcfe; }
.firewall-section-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; margin-bottom: 13px; }
.firewall-section-head > div { display: flex; align-items: center; flex-wrap: wrap; gap: 6px 8px; }
.firewall-section-head span { color: #586a84; font-size: 10px; font-weight: 800; letter-spacing: .07em; }
.firewall-section-head strong { display: grid; place-items: center; min-width: 22px; height: 22px; padding: 0 6px; color: #335276; border-radius: 999px; background: #e9f0f9; font-size: 10px; }
.firewall-section-head small { color: #7c899d; font-size: 9px; }
.firewall-section-title > small { flex-basis: 100%; line-height: 1.45; }
.firewall-authorization-list { display: grid; gap: 7px; }
.firewall-authorization { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 12px; min-height: 60px; padding: 9px 10px 9px 12px; border: 1px solid #dfe7f1; border-radius: 8px; background: #fff; }
.firewall-authorization-icon { display: grid; place-items: center; width: 33px; height: 33px; color: #22866e; border-radius: 8px; background: #e9f7f2; }
.firewall-authorization-icon svg { width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.firewall-authorization-copy { display: grid; min-width: 0; gap: 2px; }
.firewall-authorization-copy strong { color: #172943; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 11px; }
.firewall-authorization-copy span { overflow: hidden; color: #53647d; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.firewall-authorization-copy small { color: #8794a7; font-size: 8px; }
.firewall-add-origin { display: grid; grid-template-columns: minmax(180px, .45fr) minmax(0, 1.55fr); align-items: end; gap: 18px; margin-top: 12px; padding: 14px; border: 1px solid #d9e6f6; border-radius: 9px; background: #f3f8ff; }
.firewall-add-origin-copy { align-self: center; display: grid; gap: 4px; }
.firewall-add-origin-copy strong { color: #243a58; font-size: 11px; }
.firewall-add-origin-copy span { color: #6f8098; font-size: 9px; line-height: 1.45; }
.firewall-authorization-form { display: grid; grid-template-columns: minmax(190px, .8fr) minmax(190px, 1.2fr) auto; align-items: end; gap: 9px; }
.firewall-authorization-form label { display: grid; min-width: 0; gap: 5px; color: #687a94; font-size: 8px; font-weight: 800; letter-spacing: .055em; }
.firewall-authorization-form label span small { color: #9aa5b5; font-size: 7px; }
.firewall-authorization-form input { min-width: 0; height: 36px; padding: 0 11px; border: 1px solid #cfd9e7; border-radius: 7px; background: #fff; color: #172943; font: inherit; font-size: 10px; outline: none; }
.firewall-authorization-form input:focus { border-color: var(--blue); box-shadow: 0 0 0 3px rgba(38, 114, 231, .1); }
.firewall-authorization-form button { min-height: 36px; padding: 0 14px; }
.firewall-authorization-form .firewall-add-button { grid-column: auto; grid-row: auto; width: auto; min-width: 128px; }
.firewall-empty-copy { margin: 0; padding: 12px 13px; color: #75849a; border: 1px dashed #d9e1ec; border-radius: 8px; background: #fbfcfe; font-size: 10px; }
.firewall-empty-observations { display: flex; align-items: center; justify-content: center; gap: 11px; min-height: 72px; }
.firewall-empty-icon { display: grid; place-items: center; width: 34px; height: 34px; color: #8091a8; border: 1px solid #dce4ef; border-radius: 50%; background: #fff; }
.firewall-empty-icon svg { width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-width: 1.7; }
.firewall-empty-observations > span:last-child { display: grid; gap: 3px; }
.firewall-empty-observations strong { color: #40536e; font-size: 10px; }
.firewall-empty-observations small { color: #7b899d; font-size: 9px; }
.firewall-observation { display: grid; grid-template-columns: minmax(150px, .8fr) minmax(300px, 1.5fr) 90px auto; align-items: center; gap: 14px; min-height: 61px; padding: 10px 0; border-top: 1px solid #edf1f6; }
.firewall-observation:first-of-type { border-top: 0; }
.firewall-observation-address { display: flex; align-items: center; flex-wrap: wrap; gap: 4px 7px; min-width: 0; }
.firewall-observation-address strong { flex-basis: 100%; color: #172943; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 11px; }
.firewall-observation-address span { color: #72819a; font-size: 9px; }
.firewall-observation-address em { padding: 2px 6px; color: #9a6406; border-radius: 999px; background: #fff1d8; font-size: 8px; font-style: normal; font-weight: 700; }
.firewall-observation-activity { display: grid; grid-template-columns: 1.3fr .7fr .7fr; gap: 11px; }
.firewall-observation-activity span { display: grid; gap: 3px; color: #8190a4; font-size: 8px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; }
.firewall-observation-activity strong { color: #263854; font-size: 10px; letter-spacing: 0; text-transform: none; }
.firewall-source-state { min-height: 23px; padding: 0 9px; }
.firewall-source-state.allowed { color: #14745e; background: #e6f5ef; }
.firewall-source-state.observed { color: #966002; background: #fff1d2; }
.firewall-source-state.blocked { color: #b52d3b; background: #fbe7ea; }
.firewall-source-authorize { min-height: 32px; padding: 0 11px; white-space: nowrap; }
.firewall-local-note { display: flex; align-items: center; gap: 13px; padding: 15px 20px; color: #607089; border-top: 1px solid #e7ecf3; background: #fafbfd; font-size: 10px; }
.firewall-local-note strong { color: #273a57; white-space: nowrap; }
.collector-metrics { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 10px; margin-top: 18px; padding-top: 17px; border-top: 1px solid #edf0f4; }
.collector-metrics div { padding-left: 11px; border-left: 1px solid #e2e7ee; }
.collector-metrics span, .collector-metrics strong { display: block; }
.collector-metrics span { color: #8792a2; font-size: 7px; font-weight: 700; letter-spacing: .055em; text-transform: uppercase; }
.collector-metrics strong { margin-top: 4px; font-size: 10px; }
.collector-queue-note { margin: 12px 0 0; padding: 9px 11px; border-radius: 7px; color: #6e552a; background: #fff8eb; font-size: 9px; }
.collector-error-note { color: #923b3b; background: #fff3f3; }
.collector-form { display: grid; grid-template-columns: minmax(240px, 1fr) 190px auto; gap: 14px; align-items: end; padding: 18px 20px 20px; }
.collector-admin-actions { display: flex; justify-content: flex-end; gap: 7px; margin-top: 14px; }
.credential-dialog { width: min(610px, calc(100% - 28px)); }
.credential-dialog textarea { width: 100%; min-height: 205px; padding: 13px; resize: vertical; border: 1px solid #cfd7e3; border-radius: 7px; outline: none; color: #26354d; background: #f7f9fc; font: 10px/1.65 "SFMono-Regular", Consolas, monospace; }
.credential-dialog textarea:focus { border-color: #6c9fec; box-shadow: 0 0 0 3px rgba(31, 111, 235, .11); }
.credential-warning { display: grid; gap: 3px; padding: 12px 13px; border: 1px solid #efd5a8; border-radius: 8px; color: #6e4c16; background: #fff9ec; }
.credential-warning strong { font-size: 11px; }
.credential-warning span { font-size: 10px; line-height: 1.45; }
.user-create-panel { margin-bottom: 19px; overflow: hidden; border: 1px solid var(--line); border-radius: 11px; background: var(--panel); box-shadow: var(--shadow); }
.user-form { display: grid; grid-template-columns: 1fr 1.15fr .65fr 1fr auto; gap: 14px; align-items: end; padding: 18px 20px 20px; }
.client-onboarding-card { position: relative; display: grid; grid-template-columns: 54px minmax(0, 1fr) auto; align-items: center; gap: 18px; margin-bottom: 19px; overflow: hidden; padding: 21px 23px; border: 1px solid #d8e2ef; border-radius: 12px; background: linear-gradient(115deg, #fff 0%, #f8fbff 70%, #eef5ff 100%); box-shadow: var(--shadow); }
.client-onboarding-card::after { content: ""; position: absolute; top: -80px; right: 170px; width: 190px; height: 190px; border: 1px solid rgba(65, 125, 207, .08); border-radius: 50%; box-shadow: 0 0 0 30px rgba(65, 125, 207, .025); pointer-events: none; }
.client-onboarding-icon { position: relative; z-index: 1; display: grid; place-items: center; width: 54px; height: 54px; border: 1px solid #cfe0f7; border-radius: 13px; color: #2f72c7; background: #edf5ff; }
.client-onboarding-icon svg { width: 25px; height: 25px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.client-onboarding-copy { position: relative; z-index: 1; min-width: 0; }
.client-onboarding-copy h2 { margin: 3px 0 5px; font-size: 17px; letter-spacing: -.02em; }
.client-onboarding-copy > p:last-of-type { max-width: 720px; margin: 0; color: #65738a; font-size: 10px; line-height: 1.5; }
.client-onboarding-features { display: flex; flex-wrap: wrap; gap: 7px 15px; margin-top: 11px; color: #4e637f; font-size: 8px; font-weight: 700; }
.client-onboarding-features span::before { content: "✓"; margin-right: 5px; color: #218169; }
.client-onboarding-button { position: relative; z-index: 1; grid-column: auto; grid-row: auto; min-width: 185px; }
.client-wizard-dialog { width: min(960px, calc(100% - 32px)); max-height: calc(100vh - 32px); padding: 0; overflow: hidden; border: 0; border-radius: 15px; color: var(--ink); background: #fff; box-shadow: 0 30px 90px rgba(0, 0, 0, .36); }
.client-wizard-dialog::backdrop { background: rgba(8, 15, 28, .7); backdrop-filter: blur(3px); }
.client-wizard-form { display: flex; min-height: min(720px, calc(100vh - 32px)); flex-direction: column; }
.client-wizard-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; padding: 24px 27px 20px; border-bottom: 1px solid #e3e8ef; }
.client-wizard-head h2 { margin: 4px 0 5px; font-size: 21px; letter-spacing: -.025em; }
.client-wizard-head > div > span { color: #758196; font-size: 9px; }
.client-wizard-head > button { flex: 0 0 auto; width: 32px; height: 32px; padding: 0; border: 0; border-radius: 8px; color: #66758b; background: #f1f4f8; font-size: 21px; }
.client-wizard-head > button:hover { color: #243750; background: #e6ebf2; }
.client-wizard-progress { display: grid; grid-template-columns: repeat(4, 1fr); margin: 0; padding: 17px 27px; border-bottom: 1px solid #e6ebf2; background: #f8fafc; list-style: none; }
.client-wizard-progress li { position: relative; display: flex; align-items: center; gap: 9px; min-width: 0; color: #8b97a8; }
.client-wizard-progress li:not(:last-child)::after { content: ""; position: absolute; top: 15px; right: 14px; left: 39px; height: 1px; background: #dce3ec; }
.client-wizard-progress li > span { position: relative; z-index: 1; display: grid; place-items: center; flex: 0 0 30px; width: 30px; height: 30px; border: 1px solid #cfd8e4; border-radius: 50%; background: #fff; font-size: 9px; font-weight: 800; }
.client-wizard-progress li > div { position: relative; z-index: 1; padding-right: 12px; background: #f8fafc; }
.client-wizard-progress strong, .client-wizard-progress small { display: block; }
.client-wizard-progress strong { color: #56657b; font-size: 9px; }
.client-wizard-progress small { margin-top: 2px; font-size: 7px; }
.client-wizard-progress li.active > span { color: #fff; border-color: #2d76d4; background: #2d76d4; box-shadow: 0 0 0 4px rgba(45, 118, 212, .1); }
.client-wizard-progress li.active strong { color: #234b7e; }
.client-wizard-progress li.completed > span { color: #fff; border-color: #27816a; background: #27816a; }
.client-wizard-progress li.completed:not(:last-child)::after { background: #92c9b9; }
.client-wizard-body { flex: 1; min-height: 0; overflow-y: auto; padding: 26px 28px 30px; }
.client-wizard-step { animation: client-step-in .16s ease-out; }
@keyframes client-step-in { from { opacity: 0; transform: translateX(7px); } to { opacity: 1; transform: none; } }
.client-step-heading { display: flex; align-items: flex-start; gap: 13px; margin-bottom: 23px; }
.client-step-heading > span { display: grid; place-items: center; flex: 0 0 34px; width: 34px; height: 34px; border-radius: 9px; color: #2d6dbd; background: #edf4fd; font-size: 8px; font-weight: 800; }
.client-step-heading h3 { margin: 0 0 5px; font-size: 16px; letter-spacing: -.02em; }
.client-step-heading p { margin: 0; color: #748196; font-size: 9px; line-height: 1.5; }
.client-step-heading + * { margin-left: 47px; }
.client-step-company-layout { display: grid; grid-template-columns: minmax(0, 1fr) 205px; align-items: stretch; gap: 22px; }
.client-step-fields, .client-address-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 17px 15px; }
.client-wizard-step .field label b { color: #2c75cd; font-size: 7px; font-weight: 700; }
.client-logo-upload { display: flex; align-items: center; justify-content: center; min-height: 222px; flex-direction: column; padding: 22px; border: 1px dashed #b9c8db; border-radius: 11px; color: #60728b; background: #f8fbff; cursor: pointer; text-align: center; transition: border-color .15s, background .15s; }
.client-logo-upload:hover, .client-logo-upload.has-file { border-color: #5d94d7; background: #f1f7ff; }
.client-logo-upload-icon { display: grid; place-items: center; width: 49px; height: 49px; margin-bottom: 13px; border-radius: 12px; color: #3678c8; background: #e9f3ff; }
.client-logo-upload-icon svg { width: 24px; height: 24px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.client-logo-upload strong { color: #31445f; font-size: 10px; }
.client-logo-upload small { max-width: 150px; margin-top: 6px; font-size: 8px; line-height: 1.45; }
.client-logo-upload em { margin-top: 10px; color: #95a0af; font-size: 7px; font-style: normal; text-transform: uppercase; }
.client-step-tip { display: flex; align-items: flex-start; gap: 10px; margin: 22px 0 0 47px; padding: 12px 14px; border: 1px solid #d9e5f2; border-radius: 8px; color: #59708d; background: #f5f9fd; }
.client-step-tip strong { flex: 0 0 auto; color: #315c8e; font-size: 9px; }
.client-step-tip span { font-size: 8px; line-height: 1.5; }
.client-plan-layout { display: grid; grid-template-columns: minmax(0, 1fr) 310px; gap: 24px; }
.client-plan-fields { display: grid; align-content: start; gap: 19px; }
.client-plan-preview { padding: 20px; border: 1px solid #d5e2f2; border-radius: 11px; background: linear-gradient(145deg, #f8fbff, #eef5fd); }
.client-plan-preview > span, .client-review-card > span { color: #7b8ca3; font-size: 7px; font-weight: 800; letter-spacing: .1em; }
.client-plan-preview > strong { display: block; margin-top: 13px; color: #254d7d; font-size: 17px; }
.client-plan-preview > p { margin: 6px 0 20px; color: #667991; font-size: 9px; }
.client-plan-preview > div { display: flex; align-items: flex-start; gap: 8px; padding-top: 15px; border-top: 1px solid #d6e2ef; color: #58708e; }
.client-plan-preview i { display: grid; place-items: center; flex: 0 0 18px; height: 18px; border-radius: 50%; color: #fff; background: #288169; font-size: 8px; font-style: normal; }
.client-plan-preview small { font-size: 8px; line-height: 1.45; }
.client-access-layout { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 24px; }
.client-access-fields { display: grid; align-content: start; gap: 17px; }
.client-review-card { padding: 18px 19px; border: 1px solid #dfe5ed; border-radius: 11px; background: #f8fafc; }
.client-review-card > div { padding: 12px 0; border-bottom: 1px solid #e3e8ef; }
.client-review-card > div:last-child { border-bottom: 0; }
.client-review-card small, .client-review-card strong { display: block; }
.client-review-card small { color: #8995a6; font-size: 7px; text-transform: uppercase; }
.client-review-card strong { margin-top: 4px; overflow: hidden; color: #314158; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.client-wizard-footer { display: flex; align-items: center; justify-content: flex-end; gap: 9px; padding: 16px 27px; border-top: 1px solid #e2e7ee; background: #fbfcfd; }
.client-wizard-footer .form-feedback { flex: 1; margin-right: 10px; }
.client-wizard-footer .primary-button { grid-column: auto; grid-row: auto; min-width: 125px; }
.client-wizard-footer .secondary-button { min-width: 90px; }
.field-wide { grid-column: span 2; }
.official-reports-panel { margin-top: 19px; overflow: hidden; }
.official-report-status { display: inline-flex; padding: 4px 8px; border-radius: 12px; font-size: 8px; font-weight: 800; text-transform: uppercase; }
.official-report-status.pending, .official-report-status.processing { color: #79571d; background: #fff4df; }
.official-report-status.ready { color: #25705b; background: #eaf7f2; }
.official-report-status.failed { color: #973d3d; background: #fdeeee; }
.official-report-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; }
.official-report-delete-dialog { width: min(460px, calc(100% - 28px)); }
.official-report-dialog { width: min(650px, calc(100% - 28px)); }
.official-report-dialog textarea { width: 100%; min-height: 82px; padding: 11px; resize: vertical; border: 1px solid #ccd5e2; border-radius: 7px; font: inherit; }
.official-report-selection { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; padding: 12px; border: 1px solid #dce4ee; border-radius: 8px; background: #f7f9fc; }
.official-report-selection div { min-width: 0; }
.official-report-selection span, .official-report-selection strong { display: block; }
.official-report-selection span { color: #7d899b; font-size: 7px; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; }
.official-report-selection strong { margin-top: 4px; overflow: hidden; color: #263750; font-size: 10px; text-overflow: ellipsis; }
.official-erp-notice { display: grid; gap: 4px; padding: 12px 13px; border: 1px solid #ebd39c; border-radius: 8px; color: #775317; background: #fff8e8; }
.official-erp-notice strong { font-size: 10px; }
.official-erp-notice span { font-size: 9px; line-height: 1.45; }
.search-row-actions { display: flex; align-items: center; gap: 6px; min-width: 205px; }
.table-action.cycle-action { color: #2765ad; border-color: #b9cfea; background: #f7fbff; }
dialog.password-dialog.allocation-cycle-dialog { width: min(880px, calc(100% - 32px)); max-width: none; max-height: calc(100vh - 32px); overflow-x: hidden; overflow-y: auto; }
.allocation-cycle-content { display: grid; gap: 20px; padding: 30px 32px 28px; }
.allocation-cycle-dialog .dialog-head h2 { margin-top: 5px; font-size: 23px; letter-spacing: -.02em; }
.allocation-cycle-dialog .dialog-head > div > span { margin-top: 7px; font-size: 10px; }
.allocation-cycle-dialog .dialog-head button { flex: 0 0 34px; width: 34px; height: 34px; }
.allocation-cycle-loading { display: grid; justify-items: center; gap: 7px; padding: 42px 20px; color: #7c899b; text-align: center; }
.allocation-cycle-loading i { width: 24px; height: 24px; margin-bottom: 5px; border: 2px solid #d9e3ef; border-top-color: var(--accent); border-radius: 50%; animation: spin .7s linear infinite; }
.allocation-cycle-loading strong { color: #314158; font-size: 11px; }
.allocation-cycle-loading span { font-size: 9px; }
.allocation-cycle-error { display: grid; gap: 5px; padding: 15px; border: 1px solid #edcaca; border-radius: 8px; color: #913c3c; background: #fff4f4; }
.allocation-cycle-error strong { font-size: 11px; }
.allocation-cycle-error span { font-size: 9px; }
.allocation-cycle-summary { display: grid; grid-template-columns: 1.25fr 1.25fr .7fr 1fr; gap: 11px; }
.allocation-cycle-summary div { min-width: 0; padding: 14px 15px; border: 1px solid #dce4ee; border-radius: 9px; background: #f7f9fc; }
.allocation-cycle-summary span, .allocation-cycle-summary strong { display: block; }
.allocation-cycle-summary span { color: #7d899b; font-size: 8px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.allocation-cycle-summary strong { margin-top: 6px; overflow-wrap: anywhere; color: #263750; font-size: 13px; }
.allocation-cycle-status { display: flex; align-items: flex-start; gap: 13px; margin-top: 15px; padding: 16px 17px; border: 1px solid; border-radius: 10px; }
.allocation-cycle-status > i { flex: 0 0 10px; height: 10px; margin-top: 4px; border-radius: 50%; }
.allocation-cycle-status strong, .allocation-cycle-status span { display: block; }
.allocation-cycle-status strong { font-size: 12px; }
.allocation-cycle-status span { margin-top: 5px; font-size: 10px; line-height: 1.5; }
.allocation-cycle-status.closed { color: #256b57; border-color: #bfe0d3; background: #f0faf6; }
.allocation-cycle-status.closed > i { background: #299271; box-shadow: 0 0 0 4px rgba(41,146,113,.12); }
.allocation-cycle-status.open { color: #72521b; border-color: #ead5a8; background: #fff9ec; }
.allocation-cycle-status.open > i { background: #cf922d; box-shadow: 0 0 0 4px rgba(207,146,45,.12); }
.allocation-cycle-status.ambiguous { color: #8a3d3d; border-color: #e8c5c5; background: #fff4f4; }
.allocation-cycle-status.ambiguous > i { background: #c75454; box-shadow: 0 0 0 4px rgba(199,84,84,.11); }
.allocation-cycle-timeline { display: grid; grid-template-columns: minmax(260px, 1fr) 145px minmax(260px, 1fr); align-items: stretch; margin-top: 22px; }
.allocation-cycle-event { display: flex; align-items: flex-start; gap: 14px; min-width: 0; min-height: 116px; padding: 19px; border: 1px solid #d9e2ed; border-radius: 10px; background: #fff; }
.allocation-cycle-event > div { min-width: 0; }
.allocation-cycle-marker { display: grid; place-items: center; flex: 0 0 38px; height: 38px; border-radius: 50%; font-size: 12px; font-weight: 900; }
.allocation-cycle-marker svg { width: 19px; height: 19px; fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }
.allocation-cycle-event.allocated .allocation-cycle-marker { color: #27644f; background: #e3f4ed; }
.allocation-cycle-event.deallocated .allocation-cycle-marker { color: #315f96; background: #e8f1fc; }
.allocation-cycle-event.open .allocation-cycle-marker { color: #805e22; background: #fff0cf; }
.allocation-cycle-event.ambiguous .allocation-cycle-marker { color: #973f3f; background: #fbe3e3; }
.allocation-cycle-event small, .allocation-cycle-event strong, .allocation-cycle-event div > span { display: block; }
.allocation-cycle-event small { color: #7b899c; font-size: 8px; font-weight: 800; letter-spacing: .06em; }
.allocation-cycle-event strong { margin-top: 8px; color: #273850; font-size: 14px; line-height: 1.3; }
.allocation-cycle-event div > span { margin-top: 7px; color: #7f8c9e; font-size: 9px; line-height: 1.45; }
.allocation-cycle-link { position: relative; display: grid; place-items: center; min-width: 0; }
.allocation-cycle-link i { position: absolute; right: 0; left: 0; height: 1px; background: #cfd8e4; }
.allocation-cycle-link i::after { content: ""; position: absolute; top: -3px; right: 0; width: 6px; height: 6px; border-top: 1px solid #aebac9; border-right: 1px solid #aebac9; transform: rotate(45deg); }
.allocation-cycle-link span { position: relative; z-index: 1; max-width: 130px; padding: 6px 10px; border: 1px solid #d4deea; border-radius: 14px; color: #5d6c81; background: #fff; font-size: 8px; font-weight: 800; line-height: 1.35; text-align: center; }
.allocation-cycle-note { margin: 17px 2px 0; padding-top: 14px; border-top: 1px solid #e6ebf1; color: #69778b; font-size: 10px; line-height: 1.5; }
.company-profile-panel { overflow: hidden; }
.company-profile-form { display: grid; grid-template-columns: 190px minmax(0, 1fr); gap: 22px; padding: 20px; }
.company-logo-card { display: flex; align-items: stretch; flex-direction: column; gap: 9px; }
.company-logo-preview { display: grid; place-items: center; min-height: 112px; overflow: hidden; border: 1px dashed #bfc9d7; border-radius: 9px; color: #8793a5; background: #f8fafc; font-size: 9px; }
.company-logo-preview img { display: block; max-width: 100%; max-height: 105px; object-fit: contain; }
.company-logo-card small { color: #8793a5; font-size: 8px; text-align: center; }
.company-logo-button { display: flex; align-items: center; justify-content: center; min-height: 34px; cursor: pointer; }
.company-fields-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.company-profile-actions { display: flex; align-items: center; justify-content: flex-end; grid-column: 1 / -1; gap: 14px; padding-top: 17px; border-top: 1px solid #e2e7ee; }
.company-profile-actions .form-feedback { flex: 1; }
.company-profile-actions button { min-width: 190px; }
.company-dialog { width: min(820px, calc(100% - 28px)); }
.company-dialog form { gap: 18px; }
.company-dialog-logo { display: grid; grid-template-columns: 180px 1fr; align-items: center; gap: 15px; }
.company-dialog-logo > div:last-child { display: flex; flex-wrap: wrap; gap: 8px; }
.company-dialog-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 13px; }
dialog.password-dialog.client-edit-dialog { width: min(1040px, calc(100% - 40px)); height: min(820px, calc(100dvh - 32px)); max-width: none; max-height: calc(100dvh - 32px); padding: 0; overflow: hidden; border-radius: 14px; }
dialog.password-dialog.client-edit-dialog > form { display: flex; width: 100%; height: 100%; min-height: 0; overflow: hidden; padding: 0; flex-direction: column; background: #f4f7fa; }
.client-edit-dialog .dialog-head { position: relative; z-index: 3; flex: 0 0 auto; padding: 24px 30px 21px; border-bottom: 1px solid #dfe5ed; background: #fff; }
.client-edit-dialog .dialog-head h2 { margin: 5px 0 0; font-size: 22px; letter-spacing: -.025em; }
.client-edit-dialog .dialog-head > div > span { display: block; margin-top: 7px; color: #718095; font-size: 10px; line-height: 1.45; }
.client-edit-dialog .dialog-head > button { flex: 0 0 32px; width: 32px; height: 32px; border-radius: 8px; }
.client-edit-body { display: grid; flex: 1 1 auto; min-height: 0; overflow-x: hidden; overflow-y: auto; gap: 16px; padding: 20px 24px 24px; scrollbar-gutter: stable; }
.client-edit-section { padding: 22px 24px 24px; border: 1px solid #dfe5ed; border-radius: 11px; background: #fff; box-shadow: 0 5px 16px rgba(31, 48, 72, .035); }
.client-edit-section-head { display: flex; align-items: flex-start; gap: 12px; margin-bottom: 19px; padding-bottom: 15px; border-bottom: 1px solid #e8ecf1; }
.client-edit-section-head > span { display: grid; place-items: center; flex: 0 0 34px; width: 34px; height: 34px; border-radius: 9px; color: #2d6dbd; background: #edf4fd; font-size: 9px; font-weight: 800; }
.client-edit-section-head strong, .client-edit-section-head small { display: block; }
.client-edit-section-head strong { color: #263a56; font-size: 13px; line-height: 1.25; }
.client-edit-section-head small { margin-top: 5px; color: #7b899c; font-size: 9px; line-height: 1.45; }
.client-edit-section > .company-dialog-grid, .client-edit-company-layout { margin-left: 46px; }
.client-edit-dialog .company-dialog-grid { grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 15px; }
.client-edit-dialog .company-dialog-grid > .field { grid-column: span 4; }
.client-edit-dialog .company-dialog-grid > .field.field-wide { grid-column: span 8; }
.client-contract-grid { align-items: end; }
.client-contract-grid > .field:nth-child(1) { grid-column: span 8; }
.client-contract-grid > .field:nth-child(2) { grid-column: span 4; }
.client-contract-grid > .field:nth-child(3), .client-contract-grid > .field:nth-child(4) { grid-column: span 4; }
.client-edit-active { display: flex; grid-column: span 4; align-items: center; gap: 11px; min-height: 58px; padding: 11px 13px; border: 1px solid #d8e2ee; border-radius: 8px; background: #f7faff; cursor: pointer; }
.client-edit-active input { width: 16px; height: 16px; margin-top: 1px; accent-color: var(--accent); }
.client-edit-active span, .client-edit-active strong, .client-edit-active small { display: block; }
.client-edit-active strong { color: #30445f; font-size: 10px; }
.client-edit-active small { margin-top: 4px; color: #7c899b; font-size: 9px; line-height: 1.35; }
.client-edit-active.locked { cursor: not-allowed; opacity: .7; }
.client-edit-company-layout { display: grid; grid-template-columns: 190px minmax(0, 1fr); align-items: start; gap: 22px; }
.client-edit-company-layout .company-dialog-logo { grid-template-columns: 1fr; align-content: start; }
.client-edit-company-layout .company-dialog-logo > div:last-child { align-items: center; justify-content: center; }
.client-edit-company-layout .company-logo-preview { min-height: 128px; background: #f8fafc; }
.client-edit-company-layout .company-logo-preview img { max-height: 112px; }
.client-edit-dialog .field label { margin-bottom: 8px; font-size: 9px; }
.client-edit-dialog .field input, .client-edit-dialog .field select { height: 44px; font-size: 13px; }
.client-address-fields > .field:nth-child(1) { grid-column: span 4; }
.client-address-fields > .field:nth-child(2) { grid-column: span 8; }
.client-address-fields > .field:nth-child(3) { grid-column: span 3; }
.client-address-fields > .field:nth-child(4) { grid-column: span 5; }
.client-address-fields > .field:nth-child(5) { grid-column: span 4; }
.client-address-fields > .field:nth-child(6) { grid-column: span 9; }
.client-address-fields > .field:nth-child(7) { grid-column: span 3; }
.client-edit-footer { position: relative; z-index: 3; display: flex; flex: 0 0 auto; align-items: center; justify-content: flex-end; gap: 9px; min-height: 74px; padding: 14px 30px; border-top: 1px solid #dfe5ed; background: #fff; box-shadow: 0 -7px 20px rgba(27, 43, 66, .04); }
.client-edit-footer .form-feedback { flex: 1; margin: 0; }
.client-edit-footer .secondary-button { min-width: 100px; }
.client-edit-dialog .dialog-submit { display: flex; flex: 0 0 auto; min-width: 155px; width: auto; margin: 0; }
dialog.password-dialog.client-users-dialog { width: min(1120px, calc(100% - 28px)); max-width: none; max-height: calc(100vh - 28px); overflow: hidden; }
.client-users-shell { display: flex; max-height: calc(100vh - 28px); overflow-x: hidden; overflow-y: auto; flex-direction: column; background: #f5f7fa; }
.client-users-head { position: sticky; z-index: 4; top: 0; display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; padding: 23px 26px 20px; border-bottom: 1px solid #dfe5ed; background: rgba(255, 255, 255, .98); }
.client-users-head h2 { margin: 4px 0 0; font-size: 21px; }
.client-users-head > div > span { display: block; margin-top: 5px; color: #7c8899; font-size: 9px; line-height: 1.45; }
.client-users-head > button { flex: 0 0 auto; width: 31px; height: 31px; padding: 0; border: 0; border-radius: 7px; color: #69768a; background: #eef1f5; font-size: 20px; }
.client-users-summary { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; padding: 18px 26px 0; }
.client-users-summary article { padding: 14px 16px; border: 1px solid #dfe5ed; border-radius: 9px; background: #fff; box-shadow: 0 3px 10px rgba(31, 46, 68, .035); }
.client-users-summary span, .client-users-summary strong, .client-users-summary small { display: block; }
.client-users-summary span { color: #8290a2; font-size: 7px; font-weight: 800; letter-spacing: .09em; }
.client-users-summary strong { margin: 5px 0 2px; color: #203149; font-size: 20px; }
.client-users-summary small { color: #8b97a7; font-size: 8px; }
.client-user-create-card, .client-users-list-card { margin: 14px 26px 0; overflow: hidden; border: 1px solid #dfe5ed; border-radius: 10px; background: #fff; }
.client-user-section-heading { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 15px 17px; border-bottom: 1px solid #e5e9ef; }
.client-user-section-heading h3 { margin: 3px 0 0; color: #263750; font-size: 13px; }
.client-user-section-heading > div > span { display: block; margin-top: 4px; color: #8793a4; font-size: 8px; }
.client-user-create-form { display: grid; grid-template-columns: 1.05fr 1.25fr .72fr 1.08fr auto; align-items: end; gap: 12px; padding: 16px 17px 18px; }
.client-user-create-form .field { min-width: 0; }
.client-user-create-form .field input, .client-user-create-form .field select { height: 38px; font-size: 10px; }
.client-user-create-form .password-generator-button { top: 3px; }
.client-user-create-submit { grid-column: auto; grid-row: auto; height: 38px; min-width: 125px; }
.client-user-create-form .form-feedback { grid-column: 1 / -1; }
.client-users-list-card { margin-bottom: 18px; }
.client-users-state { min-height: 170px; }
.client-users-table input, .client-users-table select { height: 34px; padding: 0 9px; border: 1px solid #d5dce6; border-radius: 6px; color: var(--ink); background: #fff; font-size: 10px; }
.client-users-table input { width: 100%; min-width: 135px; }
.client-users-table td:nth-child(1) { min-width: 165px; }
.client-users-table td:nth-child(2) { min-width: 210px; }
.client-users-table select { min-width: 105px; }
.client-users-table .user-actions { min-width: 250px; }
.client-users-footer { position: sticky; z-index: 4; bottom: 0; display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 13px 26px; border-top: 1px solid #dfe5ed; color: #8591a2; background: rgba(255, 255, 255, .98); font-size: 8px; box-shadow: 0 -7px 18px rgba(27, 43, 66, .04); }
.client-users-footer button { min-width: 100px; }
.client-user-password-dialog { width: min(470px, calc(100% - 28px)); }
.client-user-password-dialog .field-help { margin-top: 7px; }
.plan-form { display: grid; grid-template-columns: minmax(220px, 1fr) 190px auto; gap: 14px; align-items: end; padding: 18px 20px 20px; border-bottom: 1px solid var(--line); }
.user-create-button { grid-column: auto; grid-row: auto; min-width: 125px; }
.access-profiles-panel { overflow: hidden; margin-bottom: 19px; border: 1px solid var(--line); border-radius: 11px; background: #fff; box-shadow: var(--shadow); }
.access-profile-add { grid-column: auto; grid-row: auto; width: auto; min-width: 130px; height: 38px; }
.access-profile-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; padding: 16px; background: #f7f9fc; }
.access-profile-card { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 12px; min-height: 94px; padding: 14px; border: 1px solid #dce4ef; border-radius: 9px; background: #fff; }
.access-profile-card-icon { display: grid; place-items: center; width: 40px; height: 40px; color: #2d72ca; border: 1px solid #d8e5f5; border-radius: 9px; background: #eff6ff; }
.access-profile-card-icon svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.access-profile-card-copy { display: grid; min-width: 0; gap: 4px; }
.access-profile-card-copy > div { display: flex; align-items: center; flex-wrap: wrap; gap: 7px; }
.access-profile-card-copy > div strong { color: #20334f; font-size: 12px; }
.access-profile-card-copy > div em { padding: 3px 6px; color: #46617f; border-radius: 999px; background: #edf2f8; font-size: 7px; font-style: normal; font-weight: 800; letter-spacing: .05em; }
.access-profile-card-copy > span { overflow: hidden; color: #718198; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.access-profile-card-copy p { display: flex; align-items: center; flex-wrap: wrap; gap: 5px; margin: 2px 0 0; color: #7c899c; font-size: 8px; }
.access-profile-card-copy p b { color: #3b506d; }
.access-profile-card-copy p i { width: 3px; height: 3px; border-radius: 50%; background: #bdc7d4; }
.access-profile-card-actions { display: flex; align-items: center; gap: 6px; }
.access-profile-user-badge { display: inline-flex; align-items: center; min-height: 27px; padding: 0 9px; border-radius: 999px; color: #355374; background: #eaf1f9; font-size: 9px; font-weight: 700; }
.access-profile-user-badge.owner { color: #176f5b; background: #e6f5ef; }
.access-profile-read-only { color: #8692a3; font-size: 9px; }
.access-profile-dialog { width: min(900px, calc(100% - 28px)); max-height: min(850px, calc(100vh - 30px)); padding: 0; border: 0; border-radius: 12px; color: var(--ink); background: #fff; box-shadow: 0 24px 75px rgba(16, 30, 50, .28); }
.access-profile-dialog::backdrop { background: rgba(13, 25, 43, .63); backdrop-filter: blur(2px); }
.access-profile-dialog .dialog-head { padding: 20px 24px; }
.access-profile-basics { display: grid; grid-template-columns: .8fr 1.2fr; gap: 14px; padding: 18px 24px; border-top: 1px solid #e2e7ee; background: #f8fafc; }
.access-profile-matrix-head { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 17px 24px 12px; }
.access-profile-matrix-head > div { display: grid; gap: 3px; }
.access-profile-matrix-head strong { font-size: 12px; }
.access-profile-matrix-head span { color: #7c899c; font-size: 9px; }
.access-profile-full-button { min-height: 30px; padding: 0 10px; border: 1px solid #ccd8e7; border-radius: 6px; color: #33577f; background: #fff; font-size: 8px; font-weight: 700; }
.access-profile-matrix { padding: 0 24px 20px; }
.access-profile-matrix-group { margin: 11px 0 5px; color: #6d7e97; font-size: 8px; font-weight: 800; letter-spacing: .09em; text-transform: uppercase; }
.access-profile-permission-row { display: grid; grid-template-columns: minmax(230px, 1fr) 345px; align-items: center; gap: 18px; min-height: 58px; padding: 9px 0; border-bottom: 1px solid #edf1f5; }
.access-profile-permission-row > div:first-child { display: grid; gap: 3px; }
.access-profile-permission-row > div:first-child strong { color: #263a57; font-size: 10px; }
.access-profile-permission-row > div:first-child span { color: #8290a3; font-size: 8px; }
.access-profile-level-options { display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; padding: 4px; border-radius: 8px; background: #f1f4f8; }
.access-profile-level-options label { position: relative; display: flex; align-items: center; justify-content: center; min-height: 32px; border: 1px solid transparent; border-radius: 6px; color: #718096; background: transparent; font-size: 8px; font-weight: 700; cursor: pointer; }
.access-profile-level-options input { position: absolute; opacity: 0; pointer-events: none; }
.access-profile-level-options label:has(input:checked) { color: #245f9f; border-color: #c7daf2; background: #fff; box-shadow: 0 2px 7px rgba(28, 62, 102, .08); }
.access-profile-level-options label.manage:has(input:checked) { color: #17705c; border-color: #bfe2d7; background: #f2fbf7; }
.access-profile-level-options label.none:has(input:checked) { color: #7e5660; border-color: #e6d4d8; background: #fff8f9; }
.access-profile-dialog-footer { position: sticky; bottom: 0; display: flex; align-items: center; justify-content: flex-end; gap: 8px; min-height: 68px; padding: 13px 24px; border-top: 1px solid #dfe5ed; background: rgba(255,255,255,.98); box-shadow: 0 -7px 18px rgba(27,43,66,.04); }
.access-profile-dialog-footer .form-feedback { flex: 1; margin-right: auto; }
.access-profile-dialog-footer .primary-button { grid-column: auto; grid-row: auto; width: auto; min-width: 120px; }
.form-feedback { grid-column: 1 / -1; margin: 0; padding: 9px 11px; border-radius: 7px; color: #2a6f5d; background: #edf9f5; font-size: 10px; }
.form-feedback.error { color: #923b3b; background: #fff3f3; }
.users-table input, .users-table select { height: 34px; padding: 0 9px; border: 1px solid #d5dce6; border-radius: 6px; color: var(--ink); background: #fff; font-size: 10px; }
.users-table input { width: min(190px, 100%); }
.users-table select { min-width: 105px; }
.client-table-identity strong, .client-table-identity small, .client-table-plan strong, .client-table-plan small { display: block; }
.client-table-identity strong, .client-table-plan strong { color: #26364d; font-size: 10px; }
.client-table-identity small, .client-table-plan small { margin-top: 4px; color: #8995a5; font-size: 8px; }
.client-table-identity small { font-family: "SFMono-Regular", Consolas, monospace; }
.plans-table input[type="number"] { width: 140px; }
.plan-management-panel { overflow: hidden; }
.platform-audit-panel { margin-top: 0; }
.platform-audit-controls { display: flex; align-items: center; gap: 8px; margin-left: auto; }
.platform-audit-controls select { height: 34px; min-width: 150px; padding: 0 9px; border: 1px solid #ccd5e2; border-radius: 6px; color: #35435a; background: #fff; font-size: 9px; }
.platform-audit-panel .devices-panel-head > small { min-width: 145px; text-align: right; }
.platform-email-panel, .platform-email-test-panel { overflow: hidden; }
.platform-email-test-panel { margin-top: 19px; }
.platform-email-form { padding: 18px 20px 20px; background: #f8fafc; }
.platform-email-master { margin-bottom: 18px; }
.platform-email-fields { display: grid; grid-template-columns: 1.4fr .55fr 1fr; gap: 16px 14px; }
.platform-email-fields .field { min-width: 0; }
.platform-email-save-row { display: flex; align-items: center; justify-content: flex-end; gap: 16px; margin-top: 20px; padding-top: 17px; border-top: 1px solid #e0e6ee; }
.platform-email-save-row .form-feedback { flex: 1; margin: 0; }
.platform-email-save-row button { min-width: 160px; }
.platform-email-test-form { display: grid; grid-template-columns: minmax(260px, 430px) auto minmax(0, 1fr); align-items: end; gap: 12px; padding: 18px 20px 20px; }
.platform-email-test-form .secondary-button { height: 42px; min-width: 120px; }
.platform-email-test-form .form-feedback { align-self: center; margin: 0; }
.user-status { display: inline-flex; padding: 4px 7px; border-radius: 12px; font-size: 9px; font-weight: 700; }
.user-status.active { color: var(--green); background: #ebf8f4; }
.user-status.inactive { color: #8a5660; background: #faeef0; }
.user-actions { display: flex; flex-wrap: wrap; gap: 6px; }
.table-action { height: 30px; padding: 0 9px; border: 1px solid #ccd5e2; border-radius: 6px; outline: none; color: #35435a; background: #fff; font-size: 9px; font-weight: 700; }
.table-action:focus-visible { border-color: #6f9fe3; box-shadow: 0 0 0 3px rgba(31, 111, 235, .16); }
.table-action.danger { color: #9c3f46; border-color: #e5b9bd; background: #fff1f2; }
.table-action.deactivate { color: #85570e; border-color: #dfb968; background: #fff4dc; }
.table-action.activate { color: #27715e; border-color: #bcdacc; }
.table-action.danger:not(:disabled):hover { color: #862f37; border-color: #d9959b; background: #ffe5e7; }
.table-action.deactivate:not(:disabled):hover { color: #704706; border-color: #cc9d3e; background: #ffe9ba; }
.table-action.activate:not(:disabled):hover { border-color: #82bba5; background: #f1faf6; }
.password-dialog { width: min(430px, calc(100% - 28px)); padding: 0; border: 0; border-radius: 13px; color: var(--ink); background: #fff; box-shadow: 0 24px 70px rgba(0,0,0,.3); }
.password-dialog::backdrop { background: rgba(8, 15, 28, .64); backdrop-filter: blur(2px); }
.password-dialog form { display: grid; gap: 15px; padding: 25px; }
.dialog-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; }
.dialog-head h2 { margin: 3px 0 0; font-size: 20px; }
.dialog-head > div > span { display: block; margin-top: 5px; color: #7c8899; font-size: 9px; line-height: 1.45; }
.dialog-head button { width: 29px; height: 29px; padding: 0; border: 0; border-radius: 6px; color: #69768a; background: #f1f3f6; font-size: 20px; }
.dialog-copy { margin: -4px 0 2px; color: var(--muted); font-size: 10px; line-height: 1.5; }
.dialog-submit { grid-column: auto; grid-row: auto; width: 100%; margin-top: 2px; }
.deletion-warning { display: grid; gap: 5px; padding: 12px 13px; border: 1px solid #e3baba; border-radius: 8px; color: #7f3030; background: #fff3f3; }
.deletion-warning strong { font-size: 12px; }
.deletion-warning span, .deletion-ack { font-size: 10px; line-height: 1.5; }
.deletion-ack { display: flex; align-items: flex-start; gap: 8px; color: #5f4a4a; }
.deletion-ack input { margin-top: 2px; }
.danger-submit { grid-column: auto; grid-row: auto; width: 100%; background: #a83d3d; }
.danger-submit:hover { background: #8f3030; }
.audit-controls { display: flex; align-items: center; gap: 9px; }
.audit-controls select { height: 38px; min-width: 155px; padding: 0 10px; border: 1px solid #ccd5e2; border-radius: 6px; color: #35435a; background: #fff; font-size: 10px; }
.audit-category { display: inline-flex; padding: 4px 7px; border-radius: 12px; color: #315b91; background: #edf4fd; font-size: 8px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; }
.audit-category.auth { color: #6b538b; background: #f2eef8; }
.audit-category.users { color: #72562e; background: #faf3e8; }
.audit-category.devices { color: #286e5d; background: #eaf7f2; }
.audit-category.collectors { color: #5b4a88; background: #f1eef9; }
.audit-category.firewall { color: #1d6584; background: #e8f4f9; }
.audit-category.backups { color: #2d6770; background: #eaf7f7; }
.audit-action { font-weight: 700; }
.audit-details { min-width: 260px; max-width: 460px; color: #657186; line-height: 1.45; white-space: normal; }
.audit-id { max-width: 145px; overflow: hidden; color: #8a95a5; font-family: "SFMono-Regular", Consolas, monospace; font-size: 8px; text-overflow: ellipsis; }
.backup-panel { margin-top: 19px; }
.backup-policy-copy { display: grid; gap: 4px; text-align: right; }
.backup-policy-copy span { display: block; }
.backup-download { display: inline-flex; align-items: center; text-decoration: none; white-space: nowrap; }
.compact-state { min-height: 155px; }
.system-service-list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; padding: 19px 20px 20px; }
.system-service-card { min-width: 0; padding: 15px 16px; border: 1px solid #dce4ed; border-radius: 9px; background: #fbfcfe; }
.system-service-card > div { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.system-service-card strong { color: #26354d; font-size: 11px; }
.system-service-card p { margin: 8px 0 0; color: #758296; font-size: 9px; line-height: 1.45; }
.system-service-status { flex: 0 0 auto; display: inline-flex; align-items: center; gap: 5px; padding: 4px 7px; border-radius: 12px; font-size: 8px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; }
.system-service-status::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.system-service-status.ok { color: #27715e; background: #eaf7f2; }
.system-service-status.warning { color: #8a5b18; background: #fff5e4; }
.system-service-status.critical { color: #9a3434; background: #fdeeee; }
.system-ok-state { min-height: 190px; }
.system-ok-state .state-icon { color: var(--green); border-color: #bee0d5; background: #effaf6; }
.system-severity, .system-source { display: inline-flex; padding: 4px 7px; border-radius: 12px; font-size: 8px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; }
.system-severity.critical { color: #9a3434; background: #fdeeee; }
.system-severity.warning { color: #8a5b18; background: #fff5e4; }
.system-source { color: #315b91; background: #edf4fd; }
.system-alert-title { min-width: 210px; font-weight: 700; }
.system-alert-detail { min-width: 300px; color: #657186; white-space: normal; }
.system-alert-action { white-space: nowrap; }
.alert-investigation-dialog { width: min(960px, calc(100% - 28px)); max-width: none; max-height: calc(100vh - 28px); overflow: hidden; }
.alert-investigation-shell { display: grid; gap: 24px; max-height: calc(100vh - 28px); overflow-y: auto; padding: 28px; }
.alert-investigation-shell .dialog-head h2 { font-size: 22px; line-height: 1.2; }
.alert-investigation-shell .dialog-head > div > span { font-size: 11px; line-height: 1.45; }
.alert-investigation-shell section > .eyebrow,
.alert-investigation-section-head .eyebrow { font-size: 9px; }
.alert-investigation-loading { min-height: 260px; display: grid; place-items: center; align-content: center; gap: 8px; color: #78869a; text-align: center; }
.alert-investigation-loading i { width: 30px; height: 30px; border: 3px solid #dce6f2; border-top-color: var(--accent); border-radius: 50%; animation: spin .8s linear infinite; }
.alert-investigation-loading strong { color: #283a53; font-size: 13px; }
.alert-investigation-loading span { font-size: 11px; }
#alert-investigation-result { display: grid; gap: 24px; }
.alert-investigation-summary { display: flex; align-items: flex-start; gap: 14px; padding: 17px 18px; border: 1px solid #dce4ed; border-radius: 9px; background: #f8fafc; }
.alert-investigation-summary > span { flex: 0 0 auto; display: inline-flex; padding: 6px 9px; border-radius: 12px; font-size: 10px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; }
.alert-investigation-summary > span.critical { color: #9a3434; background: #fdeeee; }
.alert-investigation-summary > span.warning { color: #8a5b18; background: #fff0d4; }
.alert-investigation-summary strong { display: block; color: #263850; font-size: 15px; line-height: 1.4; }
.alert-investigation-summary p { margin: 6px 0 0; color: #67758a; font-size: 12px; line-height: 1.6; }
.alert-investigation-context { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin-top: 10px; }
.alert-investigation-context article { min-width: 0; padding: 13px 14px; border: 1px solid #e0e6ee; border-radius: 8px; background: #fff; }
.alert-investigation-context span, .alert-investigation-context strong { display: block; }
.alert-investigation-context span { color: #8490a2; font-size: 9px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.alert-investigation-context strong { margin-top: 6px; overflow-wrap: anywhere; color: #33445b; font-size: 11px; line-height: 1.5; }
.alert-investigation-actions { display: grid; gap: 10px; margin: 11px 0 0; padding: 0; list-style: none; counter-reset: alert-action; }
.alert-investigation-actions li { display: grid; grid-template-columns: 29px 1fr; align-items: center; gap: 11px; color: #536278; font-size: 12px; line-height: 1.55; counter-increment: alert-action; }
.alert-investigation-actions li::before { content: counter(alert-action); width: 29px; height: 29px; display: grid; place-items: center; border-radius: 8px; color: #326fb9; background: #edf4fd; font-size: 10px; font-weight: 800; }
.alert-investigation-section-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 15px; margin-bottom: 11px; }
.alert-investigation-section-head h3 { margin: 4px 0 0; color: #293a52; font-size: 16px; }
.alert-investigation-section-head > small { color: #8793a4; font-size: 10px; }
.alert-investigation-evidence { display: grid; gap: 11px; }
.alert-evidence-card { overflow: hidden; border: 1px solid #dfe5ed; border-radius: 9px; background: #fff; }
.alert-evidence-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 13px 15px; background: #f8fafc; }
.alert-evidence-head strong { color: #2b3d56; font-size: 12px; }
.alert-evidence-head span { color: #7c899b; font: 9px/1.45 "SFMono-Regular", Consolas, monospace; }
.alert-evidence-meta { display: flex; flex-wrap: wrap; gap: 7px; padding: 0 15px 12px; background: #f8fafc; }
.alert-evidence-meta span { padding: 4px 7px; border-radius: 10px; color: #496078; background: #eaf0f7; font-size: 8px; font-weight: 800; text-transform: uppercase; }
.alert-evidence-error { margin: 0; padding: 13px 15px; color: #7d4c19; background: #fff9ee; border-top: 1px solid #eee2cd; font-size: 11px; line-height: 1.55; }
.alert-evidence-card details { border-top: 1px solid #e4e9f0; }
.alert-evidence-card summary { padding: 11px 15px; color: #3269a8; font-size: 10px; font-weight: 800; cursor: pointer; }
.alert-evidence-card pre { max-height: 240px; margin: 0; overflow: auto; padding: 15px; color: #d9e4f3; background: #172337; font: 10px/1.6 "SFMono-Regular", Consolas, monospace; white-space: pre-wrap; overflow-wrap: anywhere; }
.alert-investigation-empty { margin: 0; padding: 14px 15px; border: 1px dashed #cfd8e4; border-radius: 8px; color: #758297; background: #fafbfd; font-size: 11px; line-height: 1.55; }
.system-overall-ok { color: var(--green); }
.system-overall-warning { color: var(--amber); }
.system-overall-critical { color: #b34141; }
.alert-settings-panel { margin-top: 19px; }

.system-alert-client { color: #19375d; font-weight: 700; white-space: nowrap; }

.server-health-identity .server-health-tenant {
  width: fit-content;
  margin-top: 2px;
  padding: 3px 7px;
  border-radius: 999px;
  background: #eaf2ff;
  color: #2260ad;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .025em;
  line-height: 1.2;
}
.alert-settings-list { display: grid; gap: 12px; padding: 18px 20px 20px; background: #f8fafc; }
.alert-notification-overview { padding: 18px 20px 20px; border: 1px solid #dfe5ed; border-radius: 10px; background: #fff; }
.alert-settings-empty { background: #f8fafc; }
.alert-overview-head { display: flex; align-items: center; justify-content: space-between; gap: 18px; }
.alert-overview-identity { display: flex; align-items: center; gap: 11px; min-width: 0; }
.alert-overview-icon { display: grid; place-items: center; flex: 0 0 auto; width: 37px; height: 37px; border-radius: 9px; color: #3976ba; background: #eaf3fd; }
.alert-overview-icon svg { width: 19px; height: 19px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.alert-overview-icon svg.brand-fill { fill: currentColor; stroke: none; }
.alert-overview-identity strong, .alert-overview-identity small { display: block; }
.alert-overview-identity strong { color: #293b54; font-size: 12px; }
.alert-overview-identity small { margin-top: 3px; color: #8793a4; font-size: 9px; }
.alert-overview-identity small.active { color: #27715e; }
.alert-overview-actions { display: flex; gap: 8px; }
.alert-overview-actions button { min-width: 96px; }
.alert-overview-actions .alert-delete-button { color: #9a4141; border-color: #e2c3c3; }
.alert-summary-grid { display: grid; grid-template-columns: 1.2fr 1fr 1.5fr; gap: 10px; margin-top: 15px; }
.alert-summary-grid article { min-width: 0; padding: 13px 14px; border: 1px solid #dfe5ed; border-radius: 8px; background: #fff; }
.alert-summary-grid span, .alert-summary-grid strong, .alert-summary-grid small { display: block; }
.alert-summary-grid span { color: #8490a1; font-size: 7px; font-weight: 800; letter-spacing: .08em; }
.alert-summary-grid strong { overflow-wrap: anywhere; margin-top: 6px; color: #34435a; font-size: 10px; line-height: 1.4; }
.alert-summary-grid small { margin-top: 4px; color: #8a95a5; font-size: 8px; line-height: 1.35; }
.alert-test-feedback { margin: 0; }
.alert-settings-panel > .alert-test-feedback { margin: 0 20px 18px; }
.alert-wizard-dialog { width: min(930px, calc(100% - 32px)); max-height: calc(100vh - 32px); padding: 0; border: 0; border-radius: 13px; color: var(--ink); background: #fff; box-shadow: 0 28px 80px rgba(0, 0, 0, .34); }
.alert-wizard-dialog::backdrop { background: rgba(8, 15, 28, .68); backdrop-filter: blur(2px); }
.alert-wizard-form { display: flex; min-height: min(650px, calc(100vh - 32px)); flex-direction: column; }
.alert-wizard-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; padding: 20px 22px 17px; border-bottom: 1px solid #e1e6ed; }
.alert-wizard-head h2 { margin: 3px 0 0; font-size: 18px; }
.alert-wizard-head > button { width: 29px; height: 29px; padding: 0; border: 0; border-radius: 6px; color: #69768a; background: #f1f3f6; font-size: 20px; }
.alert-wizard-progress { display: grid; grid-template-columns: repeat(4, 1fr); margin: 0; padding: 14px 22px 12px; border-bottom: 1px solid #e6eaf0; list-style: none; background: #f8fafc; }
.alert-wizard-progress li { position: relative; display: flex; align-items: center; justify-content: center; flex-direction: column; gap: 6px; color: #929cab; font-size: 9px; line-height: 1.2; text-align: center; }
.alert-wizard-progress li:not(:last-child)::after { content: ""; position: absolute; z-index: 0; top: 13px; right: calc(-50% + 13px); left: calc(50% + 13px); height: 1px; background: #d8e0e9; }
.alert-wizard-progress li > span { position: relative; z-index: 1; display: grid; place-items: center; width: 26px; height: 26px; border: 1px solid #cbd4df; border-radius: 50%; background: #fff; font-size: 9px; font-weight: 800; }
.alert-wizard-progress li > strong { position: relative; z-index: 1; font-weight: 700; }
.alert-wizard-progress li.active, .alert-wizard-progress li.completed { color: #2e588b; }
.alert-wizard-progress li.active > span { color: #fff; border-color: #3479c5; background: #3479c5; }
.alert-wizard-progress li.completed > span { color: #28705d; border-color: #91c4b5; background: #eaf7f2; }
.alert-wizard-progress li.completed:not(:last-child)::after { background: #91c4b5; }
.alert-wizard-body { flex: 1; overflow-y: auto; padding: 22px; }
.alert-wizard-step { max-width: 850px; margin: 0 auto; }
.alert-wizard-step-head { margin-bottom: 18px; }
.alert-wizard-step-head > span { color: #3479c5; font-size: 8px; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; }
.alert-wizard-step-head h3 { margin: 6px 0 5px; color: #263850; font-size: 17px; }
.alert-wizard-step-head p { margin: 0; color: #7d899a; font-size: 9px; }
.alert-wizard-step .alert-credential-grid { margin-top: 16px; }
.alert-wizard-step .alert-severity-options { max-width: 690px; }
.alert-wizard-step .alert-severity-explanation { max-width: 690px; }
.alert-reminder-field { max-width: 340px; margin-top: 18px; }
.alert-wizard-step .alert-recovery { max-width: 420px; }
.alert-wizard-step[data-alert-step="3"] .alert-source-options { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.alert-wizard-review { display: grid; grid-template-columns: 1fr 1fr 1.3fr; gap: 10px; }
.alert-wizard-review article { min-width: 0; padding: 14px; border: 1px solid #dfe5ed; border-radius: 8px; background: #fbfcfd; }
.alert-wizard-review span, .alert-wizard-review strong, .alert-wizard-review small { display: block; }
.alert-wizard-review span { color: #8490a1; font-size: 7px; font-weight: 800; letter-spacing: .08em; }
.alert-wizard-review strong { margin-top: 7px; color: #34435a; font-size: 11px; }
.alert-wizard-review small { overflow-wrap: anywhere; margin-top: 4px; color: #8491a2; font-size: 8px; line-height: 1.4; }
.alert-review-activation { margin-top: 15px; }
.alert-wizard-footer { display: flex; align-items: center; justify-content: space-between; gap: 18px; min-height: 72px; padding: 14px 22px; border-top: 1px solid #e1e6ed; background: #f8fafc; }
.alert-wizard-footer .form-feedback { flex: 1; margin: 0; }
.alert-wizard-footer > div { display: flex; gap: 8px; margin-left: auto; }
.alert-wizard-footer button { min-width: 120px; }
.alert-wizard-footer .primary-button { grid-column: auto; grid-row: auto; }
.alert-settings-form { padding: 20px; background: #f8fafc; }
.alert-master-row { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 16px 18px; border: 1px solid #cfe0f4; border-radius: 10px; background: #f0f6fd; }
.alert-master-row > div { display: grid; gap: 4px; }
.alert-master-row > div strong { color: #243650; font-size: 12px; }
.alert-master-row > div small { color: #718198; font-size: 9px; }
.alert-master-toggle { display: flex; align-items: center; gap: 9px; color: #5f6f85; font-size: 9px; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; cursor: pointer; }
.alert-master-toggle input { position: absolute; opacity: 0; pointer-events: none; }
.alert-switch-track { position: relative; width: 40px; height: 22px; border-radius: 13px; background: #aeb9c8; transition: background .15s; }
.alert-switch-track::after { content: ""; position: absolute; top: 3px; left: 3px; width: 16px; height: 16px; border-radius: 50%; background: #fff; box-shadow: 0 1px 3px rgba(23, 42, 68, .24); transition: transform .15s; }
.alert-master-toggle input:checked + .alert-switch-track { background: var(--accent); }
.alert-master-toggle input:checked + .alert-switch-track::after { transform: translateX(18px); }
.alert-master-toggle input:focus-visible + .alert-switch-track { box-shadow: 0 0 0 3px rgba(31, 111, 235, .16); }
.alert-master-state.active { color: #27715e; }
.alert-config-section { min-width: 0; margin: 16px 0 0; padding: 17px 18px 18px; border: 1px solid #dbe3ed; border-radius: 10px; background: #fff; }
.alert-config-section legend { padding: 0 7px; color: #30425c; font-size: 10px; font-weight: 800; letter-spacing: .035em; text-transform: uppercase; }
.alert-section-copy { margin: 0 0 14px; color: #7b899c; font-size: 9px; line-height: 1.45; }
.alert-channel-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.alert-channel-option { min-width: 0; cursor: pointer; }
.alert-channel-option > input { position: absolute; opacity: 0; pointer-events: none; }
.alert-channel-card { display: grid; grid-template-columns: 35px minmax(0, 1fr) 18px; align-items: center; gap: 11px; min-height: 72px; padding: 11px 12px; border: 1px solid #d9e1eb; border-radius: 9px; color: #526176; background: #fbfcfe; transition: border-color .15s, background .15s, box-shadow .15s; }
.alert-channel-card:hover { border-color: #aebfd5; background: #f7faff; }
.alert-channel-icon { display: grid; place-items: center; width: 35px; height: 35px; border-radius: 8px; color: #3976ba; background: #eaf3fd; }
.alert-channel-icon svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.alert-channel-icon svg.brand-fill { fill: currentColor; stroke: none; }
.alert-channel-card strong, .alert-channel-card small { display: block; }
.alert-channel-card strong { color: #2b3b53; font-size: 11px; }
.alert-channel-card small { margin-top: 3px; color: #8390a2; font-size: 8px; line-height: 1.35; }
.alert-channel-card > i { display: grid; place-items: center; width: 18px; height: 18px; border-radius: 50%; color: #fff; background: #318169; font-size: 10px; font-style: normal; opacity: 0; transform: scale(.75); transition: opacity .15s, transform .15s; }
.alert-channel-option > input:checked + .alert-channel-card { border-color: #4b8bd1; background: #f3f8fe; box-shadow: 0 0 0 2px rgba(42, 118, 194, .09); }
.alert-channel-option > input:checked + .alert-channel-card > i { opacity: 1; transform: scale(1); }
.alert-channel-option > input:focus-visible + .alert-channel-card { box-shadow: 0 0 0 3px rgba(31, 111, 235, .15); }
.alert-channel-option.unavailable { cursor: not-allowed; }
.alert-channel-option.unavailable .alert-channel-card { opacity: .48; background: #f3f5f8; box-shadow: none; }
.alert-credential-grid { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(220px, .8fr); gap: 13px; align-items: start; margin-top: 14px; }
.alert-credential-grid .field input { font-family: "SFMono-Regular", Consolas, monospace; font-size: 10px; letter-spacing: 0; }
.alert-settings-grid { display: grid; grid-template-columns: minmax(300px, .8fr) minmax(420px, 1.2fr); gap: 16px; }
.alert-policy-grid { display: grid; gap: 14px; }
.alert-config-label { display: block; margin-bottom: 7px; color: #344158; font-size: 9px; font-weight: 700; letter-spacing: .035em; text-transform: uppercase; }
.alert-severity-options { display: grid; gap: 7px; }
.alert-severity-options label { cursor: pointer; }
.alert-severity-options input { position: absolute; opacity: 0; pointer-events: none; }
.alert-severity-options label > span { display: grid; grid-template-columns: 17px minmax(0, 1fr) auto; align-items: center; gap: 10px; min-height: 57px; padding: 9px 11px; border: 1px solid #dde4ed; border-radius: 8px; background: #fbfcfd; transition: border-color .15s, background .15s, box-shadow .15s; }
.alert-severity-options label:hover > span { border-color: #bac8da; }
.alert-severity-options i { width: 16px; height: 16px; border: 1px solid #aeb9c8; border-radius: 50%; box-shadow: inset 0 0 0 3px #fff; background: #fff; }
.alert-severity-options strong, .alert-severity-options small { display: block; }
.alert-severity-options strong { color: #34435a; font-size: 9px; }
.alert-severity-options small { margin-top: 3px; color: #8491a3; font-size: 8px; line-height: 1.3; }
.alert-severity-options em { padding: 4px 7px; border-radius: 10px; font-size: 7px; font-style: normal; font-weight: 800; letter-spacing: .025em; text-transform: uppercase; white-space: nowrap; }
.alert-severity-options em.warning { color: #805316; background: #fff1d7; }
.alert-severity-options em.critical { color: #923838; background: #fde7e7; }
.alert-severity-options input:checked + span { border-color: #4b8bd1; background: #f3f8fe; box-shadow: 0 0 0 2px rgba(42, 118, 194, .09); }
.alert-severity-options input:checked + span i { border-color: #2f78c4; background: #2f78c4; }
.alert-severity-options input:focus-visible + span { box-shadow: 0 0 0 3px rgba(31, 111, 235, .15); }
.alert-severity-explanation { display: grid; gap: 4px; margin-top: 8px; color: #758296; font-size: 8px; line-height: 1.35; }
.alert-severity-explanation b { display: inline-block; min-width: 40px; margin-right: 4px; font-size: 7px; text-transform: uppercase; }
.alert-severity-explanation b.warning { color: #8a5b18; }
.alert-severity-explanation b.critical { color: #9a3434; }
.alert-recovery { display: flex; align-items: flex-start; gap: 10px; margin-top: 15px; padding: 11px 12px; border: 1px solid #e0e6ee; border-radius: 8px; color: #536176; background: #fbfcfd; cursor: pointer; }
.alert-recovery input { width: 16px; height: 16px; margin-top: 1px; accent-color: var(--accent); }
.alert-recovery span, .alert-recovery strong, .alert-recovery small { display: block; }
.alert-recovery strong { color: #35445a; font-size: 10px; }
.alert-recovery small { margin-top: 3px; color: #8290a2; font-size: 8px; }
.alert-source-options { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.alert-source-options label { position: relative; cursor: pointer; }
.alert-source-options input { position: absolute; top: 12px; left: 11px; width: 15px; height: 15px; margin: 0; accent-color: var(--accent); }
.alert-source-options label > span { display: block; min-height: 57px; padding: 10px 10px 9px 35px; border: 1px solid #e0e6ee; border-radius: 8px; background: #fbfcfd; transition: border-color .15s, background .15s; }
.alert-source-options label:hover > span { border-color: #bac8da; }
.alert-source-options input:checked + span { border-color: #87aed9; background: #f2f7fd; }
.alert-source-options strong, .alert-source-options small { display: block; }
.alert-source-options strong { color: #35445a; font-size: 9px; }
.alert-source-options small { margin-top: 3px; color: #8793a4; font-size: 8px; line-height: 1.3; }
.alert-settings-footer { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin-top: 16px; padding-top: 16px; border-top: 1px solid #dfe5ed; }
.alert-settings-footer .form-feedback { flex: 1; margin: 0; }
.alert-settings-actions { display: flex; justify-content: flex-end; gap: 8px; }
.alert-settings-actions button { min-width: 130px; }
.alert-settings-actions .primary-button { grid-column: auto; grid-row: auto; min-width: 165px; }
.capacity-detail-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; margin-bottom: 19px; }
.capacity-detail-grid article { padding: 17px 19px; border: 1px solid var(--line); border-radius: 10px; background: var(--panel); box-shadow: var(--shadow); }
.capacity-detail-grid span, .capacity-detail-grid strong, .capacity-detail-grid small { display: block; }
.capacity-detail-grid span { color: #7c8899; font-size: 8px; font-weight: 700; letter-spacing: .1em; }
.capacity-detail-grid strong { margin: 7px 0 4px; font-size: 18px; letter-spacing: -.025em; }
.capacity-detail-grid small { color: #8a95a4; font-size: 9px; line-height: 1.4; }
.capacity-panel { margin-top: 0; }
.capacity-note { margin-top: 15px; }
.capacity-device strong, .capacity-device small { display: block; }
.capacity-device strong { color: #233149; font-size: 11px; }
.capacity-device small { margin-top: 4px; color: #8590a0; font-family: "SFMono-Regular", Consolas, monospace; font-size: 8px; }
.capacity-table td { font-variant-numeric: tabular-nums; }
.capacity-tabs { display: inline-flex; gap: 4px; margin: 0 0 19px; padding: 4px; border: 1px solid #d8e0ea; border-radius: 9px; background: #f2f5f9; }
.capacity-tabs button { height: 34px; padding: 0 17px; border: 0; border-radius: 6px; color: #69778b; background: transparent; font-size: 10px; font-weight: 700; }
.capacity-tabs button.active { color: #1f5f9e; background: #fff; box-shadow: 0 2px 8px rgba(39, 63, 92, .11); }
.capacity-calculator-card { overflow: hidden; }
.capacity-calculator-form { display: grid; grid-template-columns: repeat(6, minmax(125px, 1fr)) auto; gap: 14px; align-items: end; padding: 19px 20px 20px; }
.capacity-calculator-form label { display: grid; gap: 7px; color: #344158; font-size: 9px; font-weight: 700; letter-spacing: .035em; text-transform: uppercase; }
.capacity-calculator-form input, .capacity-calculator-form select { width: 100%; height: 42px; padding: 0 11px; border: 1px solid #cfd7e3; border-radius: 7px; outline: none; color: var(--ink); background: #fff; font-size: 12px; }
.capacity-calculator-form input:focus, .capacity-calculator-form select:focus { border-color: #6c9fec; box-shadow: 0 0 0 3px rgba(31, 111, 235, .11); }
.capacity-calculate-button { grid-column: auto; grid-row: auto; min-width: 145px; }
.capacity-calculator-card .form-feedback { margin: 0 20px 20px; }
.capacity-calculator-card .form-feedback:empty { display: none; }
.capacity-calculator-summary { margin-top: 19px; }
.capacity-estimate-detail { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1px; overflow: hidden; margin-top: 14px; border: 1px solid var(--line); border-radius: 10px; background: var(--line); box-shadow: var(--shadow); }
.capacity-estimate-detail div { padding: 14px 17px; background: var(--panel); }
.capacity-estimate-detail span, .capacity-estimate-detail strong { display: block; }
.capacity-estimate-detail span { color: #7c8899; font-size: 8px; font-weight: 700; letter-spacing: .08em; }
.capacity-estimate-detail strong { margin-top: 6px; color: #26354d; font-size: 12px; }
.capacity-edge-estimate { margin-top: 19px; overflow: hidden; }
.capacity-edge-summary { margin: 0; padding: 18px 20px; box-shadow: none; }
.capacity-edge-explanation { margin: 0; padding: 0 20px 18px; color: #718095; font-size: 9px; line-height: 1.5; }
.device-form { display: grid; grid-template-columns: 1.25fr .65fr 1fr 1fr auto; gap: 14px; align-items: end; padding: 18px 20px 20px; }
.device-admin-actions { display: flex; justify-content: flex-end; gap: 7px; grid-column: 1 / -1; }
.device-card .device-admin-actions { margin-top: -4px; }
.discovery-dialog { width: min(700px, calc(100% - 28px)); }
.discovery-dialog-content { display: grid; gap: 15px; padding: 25px; }
.discovery-start-form { display: grid; grid-template-columns: minmax(220px, 1fr) auto; gap: 12px; align-items: end; }
.discovery-start-form .dialog-submit { min-width: 180px; margin: 0; }
.discovery-progress { display: grid; gap: 9px; padding: 14px; border: 1px solid #dbe5f1; border-radius: 9px; background: #f7faff; }
.discovery-progress > div:first-child { display: flex; align-items: center; justify-content: space-between; gap: 15px; }
.discovery-progress span { color: #66758b; font-size: 8px; font-weight: 800; letter-spacing: .07em; }
.discovery-progress strong { color: #204f88; font: 700 22px/1 "SFMono-Regular", Consolas, monospace; }
.discovery-progress small { color: #8390a2; font-size: 9px; }
.discovery-progress-track { height: 7px; overflow: hidden; border-radius: 5px; background: #dfe8f3; }
.discovery-progress-track span { display: block; width: 0; height: 100%; border-radius: inherit; background: #397bc1; transition: width .5s linear; }
.discovery-results { overflow: hidden; border: 1px solid #e0e6ee; border-radius: 9px; }
.discovery-results-head { display: flex; justify-content: space-between; gap: 12px; padding: 12px 14px; border-bottom: 1px solid #e8ecf2; background: #f8f9fb; }
.discovery-results-head strong { font-size: 11px; }
.discovery-results-head small { color: #7d8999; font-size: 9px; }
.discovery-candidate-list { display: grid; }
.discovery-candidate { display: grid; grid-template-columns: minmax(220px, 1.2fr) minmax(165px, .8fr) auto; gap: 14px; align-items: center; padding: 14px; border-bottom: 1px solid #edf0f4; }
.discovery-candidate:last-child { border-bottom: 0; }
.discovery-candidate strong, .discovery-candidate small { display: block; }
.discovery-candidate strong { font-size: 11px; }
.discovery-candidate small { margin-top: 4px; color: #818d9e; font-size: 9px; }
.discovery-candidate-ip { color: #233d63; font: 700 10px/1.4 "SFMono-Regular", Consolas, monospace; }
.discovery-empty { padding: 22px 14px; color: #7b8798; font-size: 10px; text-align: center; }
.device-enabled { display: flex; align-items: center; gap: 8px; color: #4f5d73; font-size: 11px; }
.device-enabled input { width: 16px; height: 16px; }

.integration-target { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: 17px; padding: 14px 17px; border: 1px solid #cddcf0; border-radius: 10px; background: #f2f7fd; }
.integration-target label { display: grid; grid-template-columns: auto minmax(220px, 360px); align-items: center; gap: 13px; }
.integration-target label > span { color: #61728a; font-size: 8px; font-weight: 800; letter-spacing: .07em; }
.integration-target select { min-height: 39px; padding: 0 35px 0 12px; border: 1px solid #c9d5e5; border-radius: 7px; color: #263b58; background: #fff; font: inherit; }
.integration-target p { margin: 0; color: #718198; font-size: 9px; }
.integration-hero { display: grid; grid-template-columns: 54px minmax(0, 1fr) auto; align-items: center; gap: 16px; padding: 20px 22px; border: 1px solid #dbe3ed; border-radius: 11px; background: #fff; box-shadow: 0 10px 27px rgba(28, 48, 76, .06); }
.integration-provider-mark { display: grid; place-items: center; width: 54px; height: 54px; border-radius: 13px; color: #fff; background: linear-gradient(145deg, #1768d7, #3888ed); font-size: 24px; font-weight: 900; box-shadow: 0 8px 18px rgba(37, 113, 216, .22); }
.integration-provider-mark.elleven-logo { width: 82px; border: 1px solid rgba(157, 203, 252, .24); border-radius: 10px; color: #fff; background: #13283c; box-shadow: 0 8px 18px rgba(19, 40, 60, .2); font-size: 19px; font-weight: 400; letter-spacing: -.055em; }
.elleven-logo > span > span { color: #f05b49; font-style: italic; font-weight: 650; }
.integration-provider-copy { min-width: 0; }
.integration-provider-copy h2 { margin: 3px 0 5px; color: #132a48; font-size: 17px; }
.integration-provider-copy > span { color: #718096; font-size: 10px; line-height: 1.5; }
.integration-state-pill, .source-test-state { display: inline-flex; align-items: center; min-height: 28px; padding: 0 12px; border: 1px solid #dce3ec; border-radius: 15px; color: #69778a; background: #f7f9fb; font-size: 9px; font-weight: 800; white-space: nowrap; }
.integration-state-pill.success, .source-test-state.success { color: #257158; border-color: #bee0d3; background: #eef9f5; }
.integration-state-pill.warning { color: #8b611c; border-color: #ebd7ae; background: #fff9ed; }
.source-test-state.failed { color: #9b4046; border-color: #edc9cc; background: #fff4f4; }
.integration-progress { display: grid; grid-template-columns: 1fr 46px 1fr 46px 1fr; align-items: center; margin: 15px 0 19px; padding: 15px 20px; border: 1px solid #dce4ee; border-radius: 10px; background: #f8fafc; }
.integration-progress article { display: flex; align-items: center; gap: 10px; min-width: 0; }
.integration-progress article > span { display: grid; place-items: center; flex: 0 0 29px; width: 29px; height: 29px; border-radius: 50%; color: #758399; background: #e7edf4; font-size: 9px; font-weight: 900; }
.integration-progress article strong, .integration-progress article small { display: block; }
.integration-progress article strong { color: #3d4c62; font-size: 10px; }
.integration-progress article small { margin-top: 3px; overflow: hidden; color: #8490a2; font-size: 8px; text-overflow: ellipsis; white-space: nowrap; }
.integration-progress article.complete > span { color: #fff; background: #278c6c; }
.integration-progress article.current > span { color: #fff; background: #2877df; box-shadow: 0 0 0 4px rgba(40,119,223,.11); }
.integration-progress > i { height: 1px; margin: 0 8px; background: #ccd6e2; }
.integration-form { display: grid; gap: 17px; }
.integration-source-card { overflow: hidden; border: 1px solid #dce3ed; border-radius: 11px; background: #fff; box-shadow: 0 9px 24px rgba(29, 49, 76, .045); }
.integration-source-card > header { display: grid; grid-template-columns: 34px minmax(0, 1fr) auto; align-items: center; gap: 12px; padding: 17px 20px; border-bottom: 1px solid #e5eaf0; }
.integration-source-card > header h2 { margin: 3px 0 3px; color: #172e4d; font-size: 14px; }
.integration-source-card > header small { display: block; color: #8390a2; font-size: 8px; }
.integration-card-number { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 9px; color: #256dc8; background: #eaf3ff; font-size: 9px; font-weight: 900; }
.integration-mode-row { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; padding: 18px 20px 0; }
.integration-mode { position: relative; display: flex; align-items: flex-start; gap: 11px; min-height: 67px; padding: 13px 14px; border: 1px solid #dce4ee; border-radius: 9px; background: #fafbfd; cursor: pointer; }
.integration-mode.active { border-color: #8fb9ef; background: #f1f7ff; box-shadow: inset 0 0 0 1px rgba(41,119,220,.08); }
.integration-mode.disabled { opacity: .68; cursor: not-allowed; }
.integration-mode input { width: 15px; height: 15px; margin-top: 2px; accent-color: var(--accent); }
.integration-mode span strong, .integration-mode span small { display: block; }
.integration-mode span strong { color: #30435e; font-size: 11px; }
.integration-mode span small { margin-top: 5px; color: #7f8da0; font-size: 9px; line-height: 1.45; }
.integration-mode em { position: absolute; top: 9px; right: 10px; color: #8290a3; font-size: 8px; font-style: normal; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; }
.integration-fields { display: grid; gap: 14px; padding: 18px 20px 20px; background: #fff; }
.radius-fields { grid-template-columns: 1.4fr .45fr .8fr .65fr 1fr 1fr 1.05fr; }
.api-fields { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.integration-fields .field { min-width: 0; }
.integration-fields .field-wide { grid-column: span 2; }
.integration-source-card > footer { display: flex; align-items: center; justify-content: flex-end; gap: 15px; padding: 13px 20px; border-top: 1px solid #e5eaf0; background: #f9fafc; }
.integration-source-card > footer .form-feedback { flex: 1; margin: 0; }
.integration-source-card > footer button { min-width: 180px; }
.integration-discovery { display: grid; grid-template-columns: minmax(210px, .8fr) minmax(0, 1.2fr); gap: 18px; margin: 0 20px 20px; padding: 14px 15px; border: 1px solid #cde3d9; border-radius: 9px; background: #f3faf7; }
.integration-discovery strong, .integration-discovery small { display: block; }
.integration-discovery strong { color: #2d604f; font-size: 11px; }
.integration-discovery small { margin-top: 5px; color: #688478; font-size: 9px; line-height: 1.45; }
#radius-candidates, #voalle-database-candidates { display: flex; align-items: center; justify-content: flex-end; flex-wrap: wrap; gap: 6px; }
.radius-candidate { padding: 6px 9px; border: 1px solid #bcd8cd; border-radius: 14px; color: #315f51; background: #fff; font: 700 9px/1 "SFMono-Regular", Consolas, monospace; }
.integration-save-card { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 17px 20px; border: 1px solid #cfdae7; border-radius: 11px; background: #f7faff; }
.integration-enable { display: flex; align-items: flex-start; gap: 11px; cursor: pointer; }
.integration-enable input { width: 17px; height: 17px; margin-top: 1px; accent-color: var(--accent); }
.integration-enable strong, .integration-enable small { display: block; }
.integration-enable strong { color: #2c405c; font-size: 11px; }
.integration-enable small { margin-top: 5px; color: #748399; font-size: 8px; }
.integration-save-card > div { display: flex; align-items: center; gap: 14px; }
.integration-save-card .form-feedback { margin: 0; }
.integration-save-card .primary-button { min-width: 180px; }
.integration-page-actions { display: flex; align-items: center; gap: 9px; }
.integration-page-actions .primary-button { grid-column: auto; grid-row: auto; width: auto; }
.integration-page-actions .integration-add-button { height: 38px; min-width: 108px; padding: 0 15px; font-size: 10px; }
.platform-integrations-panel .devices-panel-head { align-items: center; min-height: 86px; }
.platform-integrations-panel .devices-panel-head p:not(.eyebrow) { max-width: 760px; margin: 5px 0 0; color: #748299; font-size: 10px; line-height: 1.5; }
.platform-integration-catalog { padding: 20px; }
.platform-integration-card { display: grid; grid-template-columns: 88px minmax(260px, 1fr) minmax(150px, .42fr) minmax(285px, .7fr); align-items: center; gap: 20px; min-height: 126px; padding: 20px 22px; border: 1px solid #dbe3ed; border-radius: 11px; background: #fff; box-shadow: 0 8px 24px rgba(27, 47, 73, .045); }
.platform-integration-card .integration-provider-mark.elleven-logo { width: 82px; height: 54px; }
.platform-integration-copy { min-width: 0; }
.platform-integration-copy > div { display: flex; align-items: baseline; gap: 8px; }
.platform-integration-copy h3 { margin: 0; color: #1d3453; font-size: 17px; }
.platform-integration-copy span { color: #718198; font-size: 9px; }
.platform-integration-copy p { margin: 7px 0 0; color: #64758c; font-size: 10px; line-height: 1.45; }
.platform-integration-usage { padding-left: 20px; border-left: 1px solid #e3e8ef; }
.platform-integration-usage span, .platform-integration-usage strong, .platform-integration-usage small { display: block; }
.platform-integration-usage span { color: #8290a3; font-size: 8px; font-weight: 800; letter-spacing: .07em; }
.platform-integration-usage strong { margin: 7px 0 4px; color: #203653; font-size: 20px; }
.platform-integration-usage small { color: #7c899b; font-size: 9px; }
.platform-integration-availability { display: grid; grid-template-columns: minmax(0, 1fr); align-items: center; gap: 9px; padding-left: 20px; border-left: 1px solid #e3e8ef; }
.platform-integration-availability > small { grid-column: 1 / -1; color: #748299; font-size: 9px; line-height: 1.4; }
.integration-availability-switch { display: inline-flex; align-items: center; gap: 9px; color: #31445f; cursor: pointer; }
.integration-availability-switch input { position: absolute; opacity: 0; pointer-events: none; }
.integration-availability-switch > span { position: relative; flex: 0 0 35px; width: 35px; height: 20px; border-radius: 12px; background: #b8c2d0; transition: background .18s; }
.integration-availability-switch > span::after { content: ""; position: absolute; top: 3px; left: 3px; width: 14px; height: 14px; border-radius: 50%; background: #fff; box-shadow: 0 1px 3px rgba(0,0,0,.2); transition: transform .18s; }
.integration-availability-switch input:checked + span { background: #2d8c70; }
.integration-availability-switch input:checked + span::after { transform: translateX(15px); }
.integration-availability-switch input:focus-visible + span { box-shadow: 0 0 0 3px rgba(31,111,235,.16); }
.integration-availability-switch input:disabled + span { opacity: .55; cursor: wait; }
.integration-availability-switch strong { font-size: 10px; line-height: 1.3; }
.integration-empty { display: grid; justify-items: center; min-height: 360px; padding: 55px 24px; border: 1px dashed #cad5e3; border-radius: 12px; background: #fff; text-align: center; }
.integration-empty-icon { display: grid; place-items: center; width: 58px; height: 58px; border-radius: 15px; color: #3978c4; background: #eaf3fd; }
.integration-empty-icon svg { width: 27px; height: 27px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.integration-empty h2 { margin: 18px 0 7px; color: #233853; font-size: 17px; }
.integration-empty p { max-width: 460px; margin: 0; color: #7b899d; font-size: 10px; line-height: 1.55; }
.integration-empty .primary-button { grid-column: auto; grid-row: auto; width: auto; min-width: 190px; margin-top: 21px; }
.integration-list { display: grid; gap: 13px; }
.integration-list-card { display: grid; grid-template-columns: 84px minmax(210px, 1.15fr) minmax(190px, .8fr) minmax(220px, 1fr) auto; align-items: center; gap: 17px; padding: 18px 20px; border: 1px solid #dbe3ed; border-radius: 11px; background: #fff; box-shadow: 0 10px 27px rgba(28,48,76,.055); }
.integration-list-copy { min-width: 0; }
.integration-list-copy > div { display: flex; align-items: baseline; gap: 7px; }
.integration-list-copy h2 { margin: 0; color: #1b3455; font-size: 15px; }
.integration-list-copy span { color: #7b899b; font-size: 9px; }
.integration-list-copy p { margin: 6px 0 0; color: #65758c; font-size: 9px; }
.integration-list-health { display: grid; justify-items: start; gap: 6px; }
.integration-list-health small { color: #8a96a6; font-size: 8px; }
.integration-list-checks { display: flex; align-items: center; flex-wrap: wrap; gap: 7px; }
.integration-list-checks span { padding: 5px 8px; border-radius: 12px; color: #737f91; background: #f0f3f7; font-size: 8px; font-weight: 800; }
.integration-list-checks span.success { color: #286e59; background: #eaf7f2; }
.integration-list-checks span.failed { color: #933d43; background: #fdeeee; }
.integration-list-actions { display: flex; justify-content: flex-end; gap: 7px; }
.integration-catalog-dialog, .integration-wizard-dialog { padding: 0; border: 0; border-radius: 13px; color: var(--ink); background: #fff; box-shadow: 0 28px 80px rgba(0,0,0,.34); }
.integration-catalog-dialog::backdrop, .integration-wizard-dialog::backdrop { background: rgba(8,15,28,.68); backdrop-filter: blur(2px); }
.integration-catalog-dialog { width: min(690px, calc(100% - 28px)); }
.integration-catalog-shell { min-height: 360px; }
.integration-dialog-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; padding: 22px 28px 19px; border-bottom: 1px solid #e1e6ed; }
.integration-dialog-head h2 { margin: 4px 0 0; color: #1c324f; font-size: 21px; line-height: 1.2; }
.integration-dialog-head > div > span { display: block; margin-top: 7px; color: #718095; font-size: 10px; line-height: 1.45; }
.integration-dialog-head > button { width: 31px; height: 31px; padding: 0; border: 0; border-radius: 7px; color: #69768a; background: #f1f3f6; font-size: 20px; }
.integration-catalog-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 13px; padding: 24px; }
.integration-catalog-option { display: grid; grid-template-columns: 82px minmax(0,1fr) 22px; align-items: center; gap: 14px; min-height: 112px; padding: 17px; border: 1px solid #d8e1ec; border-radius: 11px; color: inherit; background: #fbfcfe; text-align: left; transition: border-color .15s, background .15s, transform .15s; }
button.integration-catalog-option { cursor: pointer; }
button.integration-catalog-option:hover:not(:disabled) { border-color: #76a8e5; background: #f3f8fe; transform: translateY(-1px); }
.integration-catalog-option > span:nth-child(2) strong, .integration-catalog-option > span:nth-child(2) small, .integration-catalog-option > span:nth-child(2) em { display: block; }
.integration-catalog-option strong { color: #273a54; font-size: 13px; }
.integration-catalog-option small { margin-top: 4px; color: #7f8c9e; font-size: 9px; }
.integration-catalog-option em { margin-top: 9px; color: #2f795f; font-size: 7px; font-style: normal; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.integration-catalog-option > i { color: #6e7d91; font-size: 25px; font-style: normal; }
.integration-provider-placeholder { display: grid; place-items: center; width: 54px; height: 54px; border-radius: 13px; color: #8290a2; background: #e9edf2; font-size: 10px; font-weight: 900; }
.integration-catalog-option.unavailable, .integration-catalog-option:disabled { opacity: .58; cursor: not-allowed; }
.integration-catalog-option.unavailable { grid-template-columns: 54px minmax(0,1fr); }
.integration-catalog-option.unavailable em, .integration-catalog-option.configured em { color: #7f8998; }
.integration-wizard-dialog { width: min(1060px, calc(100% - 48px)); height: min(720px, calc(100dvh - 32px)); max-height: calc(100dvh - 32px); overflow: hidden; }
.integration-wizard-form { display: flex; height: 100%; min-height: 0; max-height: none; flex-direction: column; }
.integration-wizard-progress { display: grid; grid-template-columns: repeat(3,1fr); margin: 0; padding: 16px 28px; border-bottom: 1px solid #e5eaf0; background: #f8fafc; list-style: none; }
.integration-wizard-progress li { position: relative; display: flex; align-items: center; gap: 10px; color: #929cab; }
.integration-wizard-progress li:not(:last-child)::after { content: ""; position: absolute; z-index: 0; top: 15px; right: 18px; left: 49px; height: 1px; background: #d7dfe9; }
.integration-wizard-progress li > span { position: relative; z-index: 1; display: grid; place-items: center; flex: 0 0 30px; width: 30px; height: 30px; border: 1px solid #cbd4df; border-radius: 50%; background: #fff; font-size: 10px; font-weight: 900; }
.integration-wizard-progress strong, .integration-wizard-progress small { display: block; }
.integration-wizard-progress strong { font-size: 10px; }
.integration-wizard-progress small { margin-top: 2px; font-size: 9px; }
.integration-wizard-progress li.active, .integration-wizard-progress li.completed { color: #2e588b; }
.integration-wizard-progress li.active > span { color: #fff; border-color: #3479c5; background: #3479c5; }
.integration-wizard-progress li.completed > span { color: #28705d; border-color: #91c4b5; background: #eaf7f2; }
.integration-wizard-progress li.completed:not(:last-child)::after { background: #91c4b5; }
.integration-wizard-body { flex: 1; min-height: 0; overflow-y: auto; padding: 26px 32px; }
.integration-wizard-step { max-width: 960px; margin: 0 auto; }
.integration-wizard-step-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; margin-bottom: 19px; }
.integration-wizard-step-head > div > span { color: #3479c5; font-size: 9px; font-weight: 800; letter-spacing: .07em; }
.integration-wizard-step-head h3 { margin: 7px 0 6px; color: #263850; font-size: 20px; line-height: 1.2; }
.integration-wizard-step-head p { margin: 0; color: #718095; font-size: 10px; line-height: 1.5; }
.integration-wizard-step .integration-mode-row { padding: 0 0 17px; }
.integration-wizard-step .integration-fields { padding: 19px; border: 1px solid #e0e6ee; border-radius: 10px; background: #fbfcfe; }
.integration-wizard-step .radius-fields,
.integration-wizard-step .voalle-database-fields { grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: 14px; row-gap: 16px; }
.integration-wizard-step .radius-fields > .field:nth-child(1),
.integration-wizard-step .voalle-database-fields > .field:nth-child(1) { grid-column: span 6; }
.integration-wizard-step .radius-fields > .field:nth-child(2),
.integration-wizard-step .voalle-database-fields > .field:nth-child(2) { grid-column: span 2; }
.integration-wizard-step .radius-fields > .field:nth-child(3),
.integration-wizard-step .voalle-database-fields > .field:nth-child(3) { grid-column: span 4; }
.integration-wizard-step .radius-fields > .field:nth-child(n+4),
.integration-wizard-step .voalle-database-fields > .field:nth-child(n+4) { grid-column: span 3; }
.integration-wizard-dialog .field label { margin-bottom: 8px; font-size: 10px; line-height: 1.25; }
.integration-wizard-dialog .field input,
.integration-wizard-dialog .field select { height: 43px; font-size: 13px; }
.integration-wizard-dialog .field-help { font-size: 9px; }
.integration-test-row { display: flex; align-items: center; justify-content: flex-end; gap: 14px; margin-top: 17px; }
.integration-test-row .form-feedback { flex: 1; margin: 0; }
.integration-test-row button { min-width: 200px; min-height: 39px; font-size: 10px; }
.integration-review-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; margin: 20px 0; }
.integration-review-grid article { min-width: 0; padding: 17px; border: 1px solid #dde4ed; border-radius: 9px; background: #fbfcfe; }
.integration-review-grid span, .integration-review-grid strong, .integration-review-grid small { display: block; }
.integration-review-grid span { color: #8490a1; font-size: 7px; font-weight: 800; letter-spacing: .08em; }
.integration-review-grid strong { margin-top: 8px; color: #30445f; font-size: 12px; }
.integration-review-grid small { overflow-wrap: anywhere; margin-top: 5px; color: #8290a2; font-size: 8px; }
.integration-wizard-step .integration-enable { padding: 15px 16px; border: 1px solid #cfe0f4; border-radius: 9px; background: #f2f7fd; }
.integration-wizard-footer { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 74px; padding: 14px 28px; border-top: 1px solid #e1e6ed; background: #f8fafc; }
.integration-wizard-footer .form-feedback { flex: 1; margin: 0; }
.integration-wizard-footer > div { display: flex; gap: 8px; margin-left: auto; }
.integration-wizard-footer button { grid-column: auto; grid-row: auto; width: auto; min-width: 126px; min-height: 41px; font-size: 11px; }

.platform-dashboard-actions { display: flex; align-items: center; gap: 8px; }
.platform-dashboard-actions label { color: #748197; font-size: 8px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.platform-dashboard-actions select { height: 38px; min-width: 145px; padding: 0 10px; border: 1px solid #ccd5e2; border-radius: 6px; color: #35435a; background: #fff; font-size: 10px; }
.platform-dashboard-summary { grid-template-columns: repeat(4, minmax(0, 1fr)); margin-bottom: 19px; }
.platform-dashboard-grid { display: grid; grid-template-columns: minmax(0, 1.55fr) minmax(330px, .85fr); gap: 19px; margin-bottom: 19px; }
.platform-operation-metrics { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.platform-operation-metrics > div { min-width: 0; padding: 18px 20px; border-right: 1px solid #e4e9ef; border-bottom: 1px solid #e4e9ef; }
.platform-operation-metrics > div:nth-child(3n) { border-right: 0; }
.platform-operation-metrics > div:nth-last-child(-n+3) { border-bottom: 0; }
.platform-operation-metrics span, .platform-operation-metrics strong, .platform-operation-metrics small { display: block; }
.platform-operation-metrics span { color: #7c899b; font-size: 7px; font-weight: 800; letter-spacing: .08em; }
.platform-operation-metrics strong { min-height: 21px; margin: 7px 0 4px; overflow: hidden; color: #20344f; font-size: 16px; text-overflow: ellipsis; white-space: nowrap; }
.platform-operation-metrics strong.metric-warning { color: #ab6900; }
.platform-operation-metrics small { color: #8b96a5; font-size: 8px; }
.platform-health-panel .devices-panel-head { min-height: 73px; }
.platform-health-status { padding: 5px 8px; border-radius: 13px; color: #6e7b8e; background: #eef1f5; font-size: 8px; font-weight: 800; text-transform: uppercase; }
.platform-health-status.healthy { color: #24735d; background: #e9f7f2; }
.platform-health-status.warning { color: #95610e; background: #fff3dc; }
.platform-health-status.critical, .platform-health-status.offline { color: #a23d48; background: #fae9ec; }
.platform-health-resources { display: grid; gap: 14px; padding: 18px 20px 16px; }
.platform-health-resources > div > span { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 7px; }
.platform-resource-name { display: inline-flex; align-items: center; gap: 6px; min-width: 0; }
.platform-resource-name svg { flex: 0 0 auto; width: 13px; height: 13px; fill: none; stroke: #3e7fce; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.platform-health-resources small { color: #7c899b; font-size: 8px; font-weight: 800; letter-spacing: .06em; }
.platform-health-resources strong { color: #263950; font-size: 10px; }
.platform-health-resources i, .platform-storage-row > i { display: block; height: 6px; overflow: hidden; border-radius: 4px; background: #e9edf3; }
.platform-health-resources b, .platform-storage-row > i b { display: block; height: 100%; border-radius: inherit; background: #3e84dc; transition: width .25s ease; }
.platform-health-resources b.warning { background: #df9a28; }
.platform-health-resources b.critical { background: #ce555f; }
.platform-health-foot { display: grid; grid-template-columns: 1fr 1fr; border-top: 1px solid #e4e9ef; background: #f9fafc; }
.platform-health-foot > div { min-width: 0; padding: 13px 20px; }
.platform-health-foot > div + div { border-left: 1px solid #e4e9ef; }
.platform-health-foot span, .platform-health-foot strong { display: block; }
.platform-health-foot span { color: #8490a1; font-size: 7px; font-weight: 800; letter-spacing: .07em; }
.platform-health-foot strong { margin-top: 5px; overflow: hidden; color: #304258; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.platform-chart-grid { display: grid; grid-template-columns: minmax(0, 1.55fr) minmax(330px, .85fr); gap: 19px; margin-bottom: 19px; }
.platform-chart-legend { display: flex; justify-content: flex-end; gap: 15px; padding: 13px 18px 0; color: #718095; font-size: 8px; }
.platform-chart-legend span { display: inline-flex; align-items: center; gap: 6px; }
.platform-chart-legend i { width: 8px; height: 8px; border-radius: 2px; }
.platform-chart-legend i.raw, .platform-chart-bars i.raw { background: #367fd4; }
.platform-chart-legend i.events, .platform-chart-bars i.events { background: #2aa07d; }
.platform-volume-chart { display: flex; align-items: stretch; gap: 3px; min-width: 560px; height: 218px; margin: 4px 18px 18px; padding-top: 10px; border-bottom: 1px solid #dce3ed; background: repeating-linear-gradient(to top, transparent 0, transparent 48px, #edf1f6 49px); }
.platform-chart-column { display: grid; flex: 1 1 0; grid-template-rows: minmax(0, 1fr) 23px; min-width: 10px; gap: 5px; }
.platform-chart-bars { display: flex; align-items: end; justify-content: center; gap: 2px; min-height: 0; }
.platform-chart-bars i { width: min(9px, 42%); border-radius: 3px 3px 0 0; transition: opacity .15s; }
.platform-chart-bars i:hover { opacity: .72; }
.platform-chart-column small { color: #8490a2; font-size: 7px; text-align: center; white-space: nowrap; }
.platform-storage-list { display: grid; align-content: start; gap: 16px; min-height: 236px; padding: 20px; }
.platform-storage-row > div { display: flex; justify-content: space-between; gap: 12px; margin-bottom: 7px; }
.platform-storage-row strong { overflow: hidden; color: #293c55; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.platform-storage-row span { color: #6e7d91; font-size: 9px; white-space: nowrap; }
.platform-storage-row > i b { background: linear-gradient(90deg, #2d72ca, #5c9be4); }
.platform-storage-empty { align-self: center; padding: 22px; color: #8490a2; font-size: 9px; line-height: 1.55; text-align: center; }
.platform-dashboard-loading, .platform-dashboard-error { min-height: 76px; margin-bottom: 19px; border: 1px solid var(--line); border-radius: 10px; background: #fff; box-shadow: var(--shadow); }
.platform-dashboard-loading .device-loading-dot { margin-bottom: 8px; }
.platform-attention-panel { margin-bottom: 19px; }
.platform-attention-list { display: grid; gap: 12px; padding: 16px 20px 20px; background: #fbfcfe; }
.platform-attention-item { position: relative; overflow: hidden; border: 1px solid #dde5ef; border-radius: 10px; background: #fff; box-shadow: 0 4px 14px rgba(31, 51, 75, .04); }
.platform-attention-item::before { position: absolute; inset: 0 auto 0 0; width: 4px; background: #e2a126; content: ""; }
.platform-attention-item.critical::before { background: #d94d58; }
.platform-attention-item-head { display: flex; align-items: center; justify-content: space-between; gap: 24px; min-height: 76px; margin: 0 20px 0 24px; padding: 13px 0; border-bottom: 1px solid #e4e9f0; }
.platform-attention-client { display: grid; grid-template-columns: 46px minmax(0, 1fr); align-items: center; gap: 13px; min-width: 0; }
.platform-attention-avatar { position: relative; display: grid; place-items: center; width: 46px; height: 46px; overflow: hidden; border-radius: 10px; color: #9a6410; background: #fff2d9; font-size: 15px; font-weight: 800; }
.platform-attention-avatar.critical { color: #a23d48; background: #fae9ec; }
.platform-attention-avatar.has-logo { border: 1px solid #d9e1eb; color: transparent; background: #fff; }
.platform-attention-avatar img { position: absolute; inset: 0; width: 100%; height: 100%; padding: 6px; object-fit: contain; background: #fff; }
.platform-attention-client strong, .platform-attention-client div > span { display: block; }
.platform-attention-client strong { overflow: hidden; color: #20344f; font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.platform-attention-client div > span { margin-top: 5px; overflow: hidden; color: #6f7f94; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.platform-attention-summary { display: flex; flex: 0 0 auto; align-items: center; gap: 18px; }
.platform-attention-summary > strong { min-width: 112px; color: #2d4058; font-size: 10px; font-weight: 700; }
.platform-attention-severity { flex: 0 0 auto; min-width: 67px; padding: 5px 10px; border-radius: 14px; font-size: 8px; font-weight: 800; text-align: center; text-transform: uppercase; }
.platform-attention-severity.warning { color: #95610e; background: #fff2d9; }
.platform-attention-severity.critical { color: #a23d48; background: #fae9ec; }
.platform-attention-issues { display: grid; gap: 0; margin: 0 20px 0 24px; }
.platform-attention-issue { display: grid; grid-template-columns: 42px minmax(0, 1fr); align-items: center; gap: 13px; min-width: 0; padding: 12px 0; }
.platform-attention-issue + .platform-attention-issue { border-top: 1px solid #edf0f4; }
.platform-attention-source-icon { display: grid; place-items: center; width: 42px; height: 42px; border: 1px solid #dce4ee; border-radius: 9px; color: #345777; background: #fbfcfe; }
.platform-attention-source-icon svg { width: 21px; height: 21px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.platform-attention-issue-content { min-width: 0; }
.platform-attention-source { display: inline-flex; align-items: center; min-height: 18px; margin-bottom: 4px; padding: 0 7px; border-radius: 6px; color: #526780; background: #e9eef5; font-size: 7px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; }
.platform-attention-issue strong, .platform-attention-issue small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.platform-attention-issue strong { color: #263b55; font-size: 11px; }
.platform-attention-issue small { margin-top: 4px; color: #76869a; font-size: 9px; }
.platform-attention-remaining { padding: 0 0 12px 55px; color: #657990; font-size: 8px; font-weight: 700; }
.platform-attention-empty { display: flex; align-items: center; justify-content: center; gap: 12px; min-height: 92px; padding: 18px; }
.platform-attention-empty > span { display: grid; place-items: center; width: 31px; height: 31px; border-radius: 50%; color: #24735d; background: #e9f7f2; font-size: 14px; }
.platform-attention-empty strong, .platform-attention-empty small { display: block; }
.platform-attention-empty strong { color: #263a53; font-size: 10px; }
.platform-attention-empty small { margin-top: 4px; color: #7c899a; font-size: 8px; }
.platform-manager-callout { display: grid; grid-template-columns: 48px minmax(0, 1fr) auto; align-items: center; gap: 17px; margin-bottom: 19px; padding: 19px 21px; border: 1px solid #d7e2f0; border-radius: 11px; background: linear-gradient(120deg, #ffffff 0%, #f6f9fd 100%); box-shadow: var(--shadow); }
.platform-manager-callout h2 { margin: 3px 0 5px; font-size: 16px; }
.platform-manager-callout p:last-child { max-width: 830px; margin: 0; color: #68778d; font-size: 10px; line-height: 1.5; }
.platform-manager-icon { display: grid; place-items: center; width: 48px; height: 48px; border: 1px solid #cfe0f5; border-radius: 12px; color: #2d72c7; background: #edf5ff; }
.platform-manager-icon svg { width: 23px; height: 23px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.platform-manager-callout button { min-width: 142px; }
.platform-client-identity strong, .platform-client-identity small { display: block; }
.platform-client-identity strong { color: #20344f; font-size: 11px; }
.platform-client-identity small { margin-top: 4px; color: #7d899a; font-size: 8px; }
.platform-access-button { display: inline-flex; align-items: center; gap: 6px; height: 31px; padding: 0 12px; border: 1px solid #b9d2f1; border-radius: 6px; color: #2364b6; background: #f3f8ff; font-size: 9px; font-weight: 800; }
.platform-access-button:hover { border-color: #70a3df; background: #eaf3ff; }
.platform-access-button::after { content: "→"; font-size: 12px; }
.user-status.warning { color: #95610e; background: #fff2d9; }
.user-status.critical { color: #a23d48; background: #fae9ec; }
.user-status.neutral { color: #65758b; background: #edf1f5; }

[hidden] { display: none !important; }

@media (max-width: 1050px) {
  .continuity-command-center { grid-template-columns: 1fr; }
  .continuity-topology { grid-template-columns: 1fr; }
  .continuity-replication-lane { padding: 12px 20px; }
  .continuity-flow-line { width: min(360px, 80%); margin: 14px 0 12px; }
  .search-panel { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .erp-toggle { grid-column: 1; }
  .search-panel > .primary-button { grid-column: 2; grid-row: auto; margin-top: 0; }
  .device-card { grid-template-columns: minmax(210px, 1fr) 140px; }
  .device-metrics { grid-column: 1 / -1; }
  .collector-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .dashboard-highlight-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .platform-manager-callout { grid-template-columns: 48px minmax(0, 1fr); }
  .platform-manager-callout button { grid-column: 1 / -1; width: 100%; }
  .platform-dashboard-grid, .platform-chart-grid { grid-template-columns: 1fr; }
  .platform-attention-item-head { gap: 16px; }
  .server-health-list { grid-template-columns: 1fr; }
  .system-service-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .radius-fields { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .alert-summary-grid { grid-template-columns: 1fr; }
  .alert-wizard-review { grid-template-columns: 1fr; }
  .server-history-head { align-items: flex-start; flex-direction: column; }
  .server-history-controls { width: 100%; justify-content: flex-start; flex-wrap: wrap; }
  .server-history-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .capacity-detail-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .capacity-calculator-form { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .capacity-calculate-button { width: 100%; }
  .capacity-estimate-detail { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .collector-metrics { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .user-form { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .client-onboarding-card { grid-template-columns: 54px minmax(0, 1fr); }
  .client-onboarding-button { grid-column: 1 / -1; width: 100%; }
  .client-step-company-layout { grid-template-columns: minmax(0, 1fr) 175px; }
  .company-profile-form { grid-template-columns: 160px minmax(0, 1fr); }
  .company-fields-grid, .company-dialog-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .plan-form { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .platform-email-fields { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .platform-email-test-form { grid-template-columns: minmax(240px, 1fr) auto; }
  .platform-email-test-form .form-feedback { grid-column: 1 / -1; }
  .platform-audit-controls { width: 100%; margin-left: 0; flex-wrap: wrap; }
  .device-form { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .collector-form { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .alert-settings-grid { grid-template-columns: 1fr; }
  .alert-source-options { grid-template-columns: repeat(3, minmax(105px, 1fr)); }
  .user-create-button { width: 100%; }
}

@media (max-width: 900px) and (min-width: 761px) {
  .login-screen { padding: 22px; }
  .login-layout { grid-template-columns: minmax(300px, .88fr) minmax(360px, 1.12fr); }
  .login-intro { padding-right: 34px; padding-left: 34px; }
  .login-card { padding-right: 42px; padding-left: 42px; }
}

@media (max-width: 760px) {
  .login-screen { align-items: start; overflow: auto; padding: 14px; }
  .login-layout { grid-template-columns: 1fr; min-height: 0; }
  .login-intro { min-height: 152px; padding: 23px 26px; }
  .login-brand { width: min(228px, calc(100% + 12px)); height: 69px; margin: -10px 0 0 -12px; }
  .login-intro-copy { margin: 17px 0 0; padding: 0; }
  .login-intro-copy h2 { max-width: 430px; margin-bottom: 0; font-size: 20px; }
  .login-intro-copy > p, .login-intro-copy > span, .login-intro-copy ul { display: none; }
  .login-card { padding: 32px 26px 26px; }
  .login-card-head { margin-bottom: 23px; }
  .login-card h1 { font-size: 26px; }
  .shell { display: block; }
  .sidebar { position: fixed; left: -250px; width: 238px; transition: left .2s; box-shadow: 10px 0 30px rgba(0,0,0,.18); }
  body.menu-open .sidebar { left: 0; }
  .menu-button { display: block; }
  .topbar { min-height: 70px; padding: 0 18px; }
  .tenant-context { margin-left: auto; padding: 6px; }
  .tenant-context > div { display: none; }
  .tenant-context button { padding: 0 8px; }
  .environment { display: none; }
  .content { padding: 23px 16px 36px; }
  .retention-card { display: none; }
  .device-summary { grid-template-columns: 1fr; }
  .collector-summary { grid-template-columns: 1fr; }
  .dashboard-controls { width: 100%; align-items: stretch; flex-direction: column; }
  .dashboard-controls label { align-self: flex-start; }
  .dashboard-controls select, .dashboard-controls button { width: 100%; }
  .dashboard-highlight-grid { grid-template-columns: 1fr; }
  .platform-manager-callout { grid-template-columns: 42px minmax(0, 1fr); padding: 16px; }
  .platform-manager-icon { width: 42px; height: 42px; }
  .platform-dashboard-actions { width: 100%; align-items: stretch; flex-direction: column; }
  .platform-dashboard-actions label { margin-top: 3px; }
  .platform-dashboard-actions select, .platform-dashboard-actions button { width: 100%; }
  .platform-dashboard-summary, .platform-operation-metrics { grid-template-columns: 1fr; }
  .platform-operation-metrics > div { border-right: 0; border-bottom: 1px solid #e4e9ef; }
  .platform-operation-metrics > div:nth-last-child(-n+3) { border-bottom: 1px solid #e4e9ef; }
  .platform-operation-metrics > div:last-child { border-bottom: 0; }
  .platform-volume-panel { overflow-x: auto; }
  .platform-attention-list { padding: 12px; }
  .platform-attention-item-head { align-items: flex-start; flex-direction: column; gap: 12px; margin: 0 15px 0 18px; padding: 15px 0 12px; }
  .platform-attention-summary { width: 100%; justify-content: space-between; gap: 10px; }
  .platform-attention-summary > strong { min-width: 0; text-align: right; }
  .platform-attention-issues { margin: 0 15px 0 18px; }
  .platform-attention-issue { grid-template-columns: 38px minmax(0, 1fr); gap: 10px; }
  .platform-attention-source-icon { width: 38px; height: 38px; }
  .platform-attention-remaining { padding-left: 48px; }
  .server-health-list { padding: 12px; }
  .server-resource-grid { grid-template-columns: 1fr; }
  .server-health-foot { flex-direction: column; gap: 4px; }
  .server-history-controls { align-items: stretch; flex-direction: column; }
  .server-history-controls select { width: 100%; }
  .server-period-picker { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .server-period-picker button { padding: 0 5px; }
  .server-history-content { padding: 14px 12px 12px; }
  .server-history-summary { grid-template-columns: 1fr; }
  .server-history-legend { justify-content: flex-start; flex-wrap: wrap; }
  .server-network-history-head { align-items: flex-start; flex-direction: column; }
  .capacity-detail-grid { grid-template-columns: 1fr; }
  .capacity-tabs { display: grid; grid-template-columns: 1fr 1fr; width: 100%; }
  .capacity-tabs button { padding: 0 8px; }
  .capacity-calculator-form { grid-template-columns: 1fr; }
  .capacity-estimate-detail { grid-template-columns: 1fr; }
  .devices-intro { align-items: flex-start; flex-direction: column; }
  .device-page-actions { width: 100%; }
  .device-page-actions button { flex: 1; }
  .refresh-button { width: 100%; }
  .audit-controls { width: 100%; flex-direction: column; }
  .audit-controls select { width: 100%; }
  .devices-panel-head { align-items: flex-start; flex-direction: column; }
  .device-card { grid-template-columns: 1fr; gap: 16px; }
  .device-metrics { grid-column: auto; }
  .collector-primary { grid-template-columns: 1fr; gap: 16px; }
  .collector-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .alert-investigation-shell { padding: 18px 16px; }
  .alert-investigation-context { grid-template-columns: 1fr; }
  .alert-investigation-section-head { align-items: flex-start; flex-direction: column; }
  .user-form { grid-template-columns: 1fr; }
  .client-onboarding-card { grid-template-columns: 44px minmax(0, 1fr); gap: 14px; padding: 17px; }
  .client-onboarding-icon { width: 44px; height: 44px; }
  .client-onboarding-features { display: none; }
  .client-wizard-dialog { width: calc(100% - 18px); max-height: calc(100vh - 18px); }
  .client-wizard-form { min-height: calc(100vh - 18px); }
  .client-wizard-head { padding: 17px 16px 14px; }
  .client-wizard-head h2 { font-size: 18px; }
  .client-wizard-progress { padding: 13px 16px; }
  .client-wizard-progress li { justify-content: center; }
  .client-wizard-progress li > div { display: none; }
  .client-wizard-progress li:not(:last-child)::after { right: -8px; left: calc(50% + 17px); }
  .client-wizard-body { padding: 19px 16px 22px; }
  .client-step-heading + * { margin-left: 0; }
  .client-step-company-layout, .client-step-fields, .client-address-grid, .client-plan-layout, .client-access-layout { grid-template-columns: 1fr; }
  .client-logo-upload { min-height: 155px; }
  .client-step-tip { margin-left: 0; }
  .client-wizard-footer { flex-wrap: wrap; padding: 12px 16px; }
  .client-wizard-footer .form-feedback { flex: 0 0 100%; order: -1; margin: 0; }
  .client-wizard-footer button { flex: 1; }
  .company-profile-form, .company-fields-grid, .company-dialog-grid, .company-dialog-logo, .client-edit-company-layout { grid-template-columns: 1fr; }
  .integration-target, .integration-save-card { align-items: stretch; flex-direction: column; }
  .integration-page-actions { width: 100%; }
  .integration-page-actions button { flex: 1; min-width: 0; }
  .integration-list-card { grid-template-columns: 72px minmax(0,1fr); padding: 16px; }
  .integration-list-card .integration-provider-mark { width: 48px; height: 48px; }
  .integration-list-card .integration-provider-mark.elleven-logo { width: 70px; font-size: 16px; }
  .integration-list-health, .integration-list-checks, .integration-list-actions { grid-column: 1 / -1; }
  .integration-list-actions { justify-content: stretch; }
  .integration-list-actions button { flex: 1; }
  .platform-integration-card { grid-template-columns: 82px minmax(0, 1fr); gap: 16px; padding: 18px; }
  .platform-integration-usage, .platform-integration-availability { grid-column: 1 / -1; padding: 15px 0 0; border-top: 1px solid #e3e8ef; border-left: 0; }
  .integration-catalog-dialog, .integration-wizard-dialog { width: calc(100% - 18px); height: calc(100dvh - 18px); max-height: calc(100dvh - 18px); }
  .integration-catalog-grid, .integration-review-grid { grid-template-columns: 1fr; padding: 16px; }
  .integration-dialog-head { padding: 17px 16px 14px; }
  .integration-wizard-form { height: 100%; min-height: 0; max-height: none; }
  .integration-wizard-progress { padding: 13px 16px; }
  .integration-wizard-progress li { justify-content: center; }
  .integration-wizard-progress li > div { display: none; }
  .integration-wizard-progress li:not(:last-child)::after { right: -8px; left: calc(50% + 17px); }
  .integration-wizard-body { padding: 18px 16px; }
  .integration-wizard-step .radius-fields, .integration-wizard-step .voalle-database-fields { grid-template-columns: 1fr; }
  .integration-wizard-step .radius-fields > .field,
  .integration-wizard-step .voalle-database-fields > .field { grid-column: 1 / -1; }
  .integration-test-row, .integration-wizard-footer { align-items: stretch; flex-direction: column; }
  .integration-test-row button { width: 100%; }
  .integration-wizard-footer { padding: 12px 16px; }
  .integration-wizard-footer > div { width: 100%; margin-left: 0; }
  .integration-wizard-footer button { flex: 1; min-width: 0; }
  .integration-target label { grid-template-columns: 1fr; }
  .integration-hero { grid-template-columns: 46px minmax(0, 1fr); padding: 17px; }
  .integration-provider-mark { width: 46px; height: 46px; }
  .integration-state-pill { grid-column: 1 / -1; justify-self: start; }
  .integration-progress { grid-template-columns: 1fr; gap: 10px; }
  .integration-progress > i { width: 1px; height: 13px; margin: -4px 0 -4px 14px; }
  .integration-source-card > header { grid-template-columns: 34px minmax(0, 1fr); padding: 15px; }
  .source-test-state { grid-column: 1 / -1; justify-self: start; }
  .integration-mode-row, .radius-fields, .api-fields, .integration-discovery { grid-template-columns: 1fr; padding-right: 15px; padding-left: 15px; }
  .integration-fields .field-wide { grid-column: auto; }
  .integration-source-card > footer { align-items: stretch; flex-direction: column; padding: 13px 15px; }
  .integration-source-card > footer button, .integration-save-card .primary-button { width: 100%; }
  .integration-save-card > div { align-items: stretch; flex-direction: column; }
  dialog.password-dialog.client-edit-dialog { width: calc(100% - 18px); height: calc(100dvh - 18px); max-height: calc(100dvh - 18px); }
  .client-edit-dialog .dialog-head { padding: 18px 17px 15px; }
  .client-edit-body { gap: 12px; padding: 13px; }
  .client-edit-section { padding: 18px 17px 20px; }
  .client-edit-section > .company-dialog-grid, .client-edit-company-layout { margin-left: 0; }
  .client-edit-dialog .company-dialog-grid { grid-template-columns: 1fr; }
  .client-edit-dialog .company-dialog-grid > .field,
  .client-edit-dialog .company-dialog-grid > .field.field-wide,
  .client-contract-grid > .field:nth-child(n),
  .client-address-fields > .field:nth-child(n),
  .client-edit-active { grid-column: 1 / -1; }
  .client-edit-footer { align-items: stretch; flex-direction: column; padding: 13px 17px 15px; }
  .client-edit-footer .secondary-button, .client-edit-dialog .dialog-submit { width: 100%; }
  dialog.password-dialog.client-users-dialog { width: calc(100% - 18px); max-height: calc(100vh - 18px); }
  .client-users-shell { max-height: calc(100vh - 18px); }
  .client-users-head { padding: 18px 17px 15px; }
  .client-users-head h2 { font-size: 18px; }
  .client-users-summary { grid-template-columns: 1fr; padding: 14px 14px 0; }
  .client-users-summary article { display: grid; grid-template-columns: 1fr auto; align-items: center; }
  .client-users-summary strong { grid-column: 2; grid-row: 1 / 3; }
  .client-user-create-card, .client-users-list-card { margin: 12px 14px 0; }
  .client-users-list-card { margin-bottom: 14px; }
  .client-user-create-form { grid-template-columns: 1fr; }
  .client-user-create-submit { width: 100%; }
  .client-users-footer { align-items: stretch; flex-direction: column; padding: 12px 14px; }
  .client-users-footer button { width: 100%; }
  .field-wide { grid-column: auto; }
  .company-profile-actions { align-items: stretch; flex-direction: column; }
  .company-profile-actions button { width: 100%; }
  .official-report-selection { grid-template-columns: repeat(2, 1fr); }
  dialog.password-dialog.allocation-cycle-dialog { width: calc(100% - 18px); max-height: calc(100vh - 18px); }
  .allocation-cycle-content { gap: 16px; padding: 20px 17px; }
  .allocation-cycle-dialog .dialog-head h2 { font-size: 20px; }
  .allocation-cycle-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .allocation-cycle-timeline { grid-template-columns: 1fr; gap: 8px; }
  .allocation-cycle-event { min-height: 0; }
  .allocation-cycle-link { min-height: 35px; }
  .allocation-cycle-link i { top: 0; bottom: 0; left: 50%; width: 1px; height: auto; }
  .allocation-cycle-link i::after { top: auto; right: -3px; bottom: 0; transform: rotate(135deg); }
  .search-row-actions { grid-column: 1 / -1; flex-wrap: wrap; min-width: 0; }
  .search-row-actions::before { flex-basis: 100%; }
  .plan-form { grid-template-columns: 1fr; }
  .platform-email-fields, .platform-email-test-form { grid-template-columns: 1fr; }
  .platform-email-save-row { align-items: stretch; flex-direction: column; }
  .platform-email-save-row button, .platform-email-test-form button { width: 100%; }
  .platform-email-test-form .form-feedback { grid-column: auto; }
  .platform-audit-controls { align-items: stretch; flex-direction: column; }
  .platform-audit-controls select, .platform-audit-controls button { width: 100%; }
  .device-form { grid-template-columns: 1fr; }
  .discovery-start-form, .discovery-candidate { grid-template-columns: 1fr; }
  .collector-form { grid-template-columns: 1fr; }
  .alert-settings-form { padding: 14px; }
  .alert-overview-head { align-items: stretch; flex-direction: column; }
  .alert-overview-actions { display: grid; grid-template-columns: 1fr 1fr; }
  .alert-wizard-dialog { width: calc(100% - 18px); max-height: calc(100vh - 18px); }
  .alert-wizard-form { min-height: calc(100vh - 18px); }
  .alert-wizard-head { padding: 17px 16px 14px; }
  .alert-wizard-progress { padding: 13px 16px; }
  .alert-wizard-progress li { justify-content: center; }
  .alert-wizard-progress li strong { display: none; }
  .alert-wizard-progress li:not(:last-child)::after { right: calc(-50% + 13px); left: calc(50% + 13px); }
  .alert-wizard-body { padding: 18px 16px; }
  .alert-wizard-step[data-alert-step="3"] .alert-source-options { grid-template-columns: 1fr 1fr; }
  .alert-wizard-footer { align-items: stretch; flex-direction: column; padding: 12px 16px; }
  .alert-wizard-footer > div { width: 100%; margin-left: 0; }
  .alert-wizard-footer button { flex: 1; }
  .alert-master-row { align-items: stretch; flex-direction: column; }
  .alert-master-toggle { justify-content: space-between; }
  .alert-channel-grid, .alert-credential-grid, .alert-policy-grid, .alert-severity-options { grid-template-columns: 1fr; }
  .system-service-list { grid-template-columns: 1fr; }
  .alert-source-options { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .alert-settings-footer { align-items: stretch; flex-direction: column; }
  .alert-settings-actions { flex-direction: column; }
  .alert-settings-actions button { width: 100%; }
  .user-create-button { grid-column: 1; }
  .search-panel { grid-template-columns: 1fr; padding: 16px; }
  .erp-toggle, .primary-button { grid-column: 1; }
  .search-panel > .primary-button { grid-column: 1; grid-row: auto; margin-top: 0; }
  .primary-button { width: 100%; }
  .results-header { align-items: flex-start; flex-direction: column; }
  .export-actions { width: 100%; }
  .secondary-button { flex: 1; }
  table, thead, tbody, tr, th, td { display: block; }
  thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
  tbody { padding: 8px 14px; }
  tbody tr { display: grid; grid-template-columns: repeat(2, 1fr); margin: 9px 0; padding: 5px 0; border: 1px solid var(--line); border-radius: 8px; }
  td { padding: 8px 11px; border: 0; white-space: normal; }
  td::before { content: attr(data-label); display: block; margin-bottom: 3px; color: #8792a2; font-size: 8px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; }
  td:nth-child(7) { grid-column: 1 / -1; }
}

@media (max-width: 900px) {
  .continuity-summary, .continuity-components { grid-template-columns: 1fr 1fr; }
  .continuity-settings-overview { grid-template-columns: 1fr; }
  .access-profile-list { grid-template-columns: 1fr; }
  .access-profile-permission-row { grid-template-columns: 1fr; gap: 8px; }
  .firewall-collector-head { align-items: flex-start; flex-direction: column; }
  .firewall-policy-controls { justify-content: flex-start; width: 100%; }
  .firewall-policy-summary { justify-content: flex-start; }
  .firewall-add-origin { grid-template-columns: 1fr; }
  .firewall-authorization-form { grid-template-columns: 1fr 1fr; }
  .firewall-authorization-form button { grid-column: 1 / -1; }
  .firewall-observation { grid-template-columns: 1fr auto; }
  .firewall-observation-activity { grid-column: 1 / -1; grid-row: 2; }
  .firewall-access-card-head { align-items: flex-start; flex-direction: column; }
  .firewall-access-controls { width: 100%; min-width: 0; }
  .firewall-access-states { justify-content: flex-start; }
  .firewall-rules-toolbar { align-items: stretch; flex-direction: column; }
  .firewall-rules-tools { display: grid; grid-template-columns: 1fr 1fr auto; }
  .firewall-rules-tools input { width: 100%; }
  .firewall-service-policies { align-items: stretch; flex-direction: column; }
  .firewall-service-policy { width: 100%; }
}

@media (max-width: 600px) {
  .continuity-command-center { gap: 19px; padding: 20px; }
  .continuity-command-primary { align-items: flex-start; }
  .continuity-command-primary strong { font-size: 21px; }
  .continuity-command-metrics { grid-template-columns: 1fr; }
  .continuity-command-metrics article { padding: 12px 14px; border-top: 1px solid rgba(255,255,255,.1); border-left: 0; }
  .continuity-command-metrics article:first-child { border-top: 0; }
  .continuity-command-updated { position: static; z-index: 1; grid-column: 1 / -1; margin-top: -8px; }
  .continuity-topology { gap: 12px; padding: 12px; }
  .continuity-site-card > header { padding: 16px 15px 13px; }
  .continuity-site-services { padding-right: 14px; padding-left: 14px; }
  .continuity-technical summary small { display: none; }
  .continuity-summary, .continuity-components { grid-template-columns: 1fr; }
  .continuity-settings-head { align-items: stretch; flex-direction: column; }
  .continuity-settings-head .primary-button { width: 100%; }
  .continuity-wizard-grid { grid-template-columns: 1fr; }
  .continuity-wizard-grid .field-wide { grid-column: 1; }
  .access-profile-basics { grid-template-columns: 1fr; padding: 15px; }
  .access-profile-matrix-head { align-items: flex-start; flex-direction: column; padding: 15px 15px 10px; }
  .access-profile-matrix { padding: 0 15px 15px; }
  .access-profile-level-options { grid-template-columns: 1fr; }
  .access-profile-card { grid-template-columns: auto minmax(0, 1fr); }
  .access-profile-card-actions { grid-column: 1 / -1; justify-content: flex-end; }
  .access-profile-dialog-footer { flex-wrap: wrap; padding: 12px 15px; }
  .access-profile-dialog-footer .form-feedback { flex-basis: 100%; }
  .firewall-collector-list { padding: 10px; }
  .firewall-collector-head, .firewall-authorized-section, .firewall-observed-section { padding-right: 14px; padding-left: 14px; }
  .firewall-policy-controls, .firewall-policy-form { width: 100%; min-width: 0; }
  .firewall-policy-form select { flex: 1; min-width: 0; }
  .firewall-authorization-form, .firewall-observation-activity { grid-template-columns: 1fr; }
  .firewall-add-origin { padding: 12px; }
  .firewall-authorization-form button { grid-column: auto; }
  .firewall-observation { grid-template-columns: 1fr; }
  .firewall-observation-activity { grid-column: auto; grid-row: auto; }
  .firewall-source-state { justify-self: start; }
  .firewall-source-authorize { width: 100%; }
  .firewall-local-note { align-items: flex-start; flex-direction: column; }
  .firewall-tabs { grid-template-columns: 1fr; }
  .firewall-access-head { align-items: flex-start; }
  .firewall-current-origin { justify-items: start; }
  .firewall-access-list { padding: 10px; }
  .firewall-access-card-head, .firewall-access-sources { padding-right: 14px; padding-left: 14px; }
  .firewall-access-states { align-items: flex-start; flex-direction: column; }
  .firewall-rules-tools { grid-template-columns: 1fr; }
  .firewall-rules-tools select, .firewall-new-rule { width: 100%; }
  .firewall-service-policy { flex-wrap: wrap; }
  .firewall-service-policy > div { flex: 1; }
}

/* Manual operacional */
.manual-view { max-width: 1440px; }
.manual-hero { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) minmax(360px, .62fr); gap: 42px; align-items: end; overflow: hidden; margin-bottom: 18px; padding: 30px 32px; border-radius: 13px; color: #fff; background: linear-gradient(120deg, #172b4a 0%, #193d5c 70%, #14576a 100%); box-shadow: 0 15px 34px rgba(22, 42, 70, .18); }
.manual-hero::after { position: absolute; top: -110px; right: -40px; width: 320px; height: 320px; border: 48px solid rgba(255,255,255,.035); border-radius: 50%; content: ""; }
.manual-hero-copy, .manual-hero-actions { position: relative; z-index: 1; }
.manual-hero .eyebrow { color: #83d6da; }
.manual-hero h2 { margin: 7px 0 9px; font-size: 28px; letter-spacing: -.025em; }
.manual-hero-copy > p:last-of-type { max-width: 760px; margin: 0; color: #c7d7e6; font-size: 11px; line-height: 1.65; }
.manual-hero-meta { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 18px; }
.manual-hero-meta span { padding: 6px 9px; border: 1px solid rgba(255,255,255,.13); border-radius: 12px; color: #c7d8e6; background: rgba(255,255,255,.05); font-size: 7px; font-weight: 700; }
.manual-hero-actions label { display: block; margin-bottom: 7px; color: #9fb8ca; font-size: 8px; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; }
.manual-hero-actions > div { display: grid; grid-template-columns: minmax(180px, 1fr) auto; gap: 8px; }
.manual-hero-actions input { width: 100%; height: 40px; padding: 0 13px; border: 1px solid rgba(255,255,255,.18); border-radius: 7px; outline: none; color: #fff; background: rgba(6, 20, 37, .34); font-size: 10px; }
.manual-hero-actions input::placeholder { color: #9bb0c3; }
.manual-hero-actions input:focus { border-color: #62c3cd; box-shadow: 0 0 0 3px rgba(98,195,205,.13); }
.manual-hero-actions .secondary-button { height: 40px; border-color: rgba(255,255,255,.24); color: #fff; background: rgba(255,255,255,.07); white-space: nowrap; }
.manual-shell { display: grid; grid-template-columns: 220px minmax(0, 1fr); gap: 18px; align-items: start; }
.manual-index { position: sticky; top: 84px; overflow: hidden; padding: 15px 10px 11px; border: 1px solid #dbe3ec; border-radius: 11px; background: #fff; box-shadow: var(--shadow); }
.manual-index > strong { display: block; padding: 0 10px 10px; color: #8490a0; font-size: 8px; letter-spacing: .08em; }
.manual-index button { display: grid; grid-template-columns: 25px minmax(0, 1fr); align-items: center; gap: 7px; width: 100%; min-height: 34px; padding: 6px 9px; border: 0; border-radius: 6px; color: #58687d; background: transparent; font-size: 9px; text-align: left; }
.manual-index button span { display: grid; place-items: center; width: 22px; height: 22px; border-radius: 6px; color: #8290a2; background: #f0f3f7; font-size: 7px; font-weight: 800; }
.manual-index button:hover { color: #235c98; background: #f3f7fc; }
.manual-index button.active { color: #174f8d; background: #eaf3ff; font-weight: 800; }
.manual-index button.active span { color: #fff; background: #3478c5; }
.manual-document { display: grid; gap: 16px; min-width: 0; }
.manual-section { display: grid; grid-template-columns: 56px minmax(0, 1fr); scroll-margin-top: 88px; overflow: hidden; border: 1px solid #dce4ed; border-radius: 11px; background: #fff; box-shadow: var(--shadow); }
.manual-section-number { padding-top: 27px; color: #a0adbd; background: #f5f8fb; font-size: 11px; font-weight: 800; text-align: center; }
.manual-section-body { min-width: 0; padding: 27px 30px 30px; }
.manual-section-body > .eyebrow { color: #69809d; }
.manual-section-body > h3 { margin: 5px 0 11px; color: #142d4d; font-size: 20px; letter-spacing: -.018em; }
.manual-section-body > h4 { margin: 23px 0 10px; color: #263b55; font-size: 12px; }
.manual-section-body > p { margin: 0 0 14px; color: #66758a; font-size: 10px; line-height: 1.7; }
.manual-purpose-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 9px; margin: 19px 0; }
.manual-purpose-grid article { min-height: 126px; padding: 15px; border: 1px solid #e0e7ef; border-radius: 8px; background: #f9fbfd; }
.manual-purpose-grid article > span { color: #4e83bc; font-size: 8px; font-weight: 800; }
.manual-purpose-grid strong { display: block; margin: 14px 0 6px; color: #263d58; font-size: 11px; }
.manual-purpose-grid p { margin: 0; color: #768499; font-size: 8px; line-height: 1.55; }
.manual-callout { margin-top: 18px; padding: 14px 16px; border-left: 3px solid #4181c3; border-radius: 0 8px 8px 0; background: #f0f6fd; }
.manual-callout strong, .manual-callout p { display: block; }
.manual-callout strong { margin-bottom: 4px; color: #295c91; font-size: 9px; }
.manual-callout p { margin: 0; color: #61758d; font-size: 9px; line-height: 1.6; }
.manual-callout.warning { border-left-color: #d69a27; background: #fff8e9; }
.manual-callout.warning strong { color: #95610e; }
.manual-callout.danger { border-left-color: #d2515b; background: #fff0f1; }
.manual-callout.danger strong { color: #9d3541; }
.manual-flow { display: grid; grid-template-columns: repeat(9, auto); align-items: center; justify-content: center; gap: 9px; margin: 21px 0 23px; padding: 18px 15px; border: 1px solid #dfe7ef; border-radius: 9px; background: #f8fafc; }
.manual-flow > div { display: grid; justify-items: center; min-width: 112px; text-align: center; }
.manual-flow svg { width: 23px; height: 23px; margin-bottom: 9px; fill: none; stroke: #3977b5; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.manual-flow strong { color: #29415e; font-size: 9px; }
.manual-flow small { max-width: 120px; margin-top: 4px; color: #8290a2; font-size: 7px; line-height: 1.4; }
.manual-flow > i { color: #8ea0b3; font-size: 14px; font-style: normal; }
.manual-flow.continuity { grid-template-columns: minmax(160px, 1fr) auto minmax(190px, 1fr) auto minmax(160px, 1fr); }
.manual-flow.continuity > div { padding: 10px; }
.manual-flow.continuity strong { font-size: 10px; }
.manual-table-wrap { overflow-x: auto; border: 1px solid #dfe6ee; border-radius: 8px; }
.manual-table { width: 100%; border-collapse: collapse; }
.manual-table th { padding: 10px 12px; color: #667990; background: #f2f5f8; font-size: 7px; letter-spacing: .06em; text-align: left; text-transform: uppercase; }
.manual-table td { padding: 12px; border-top: 1px solid #e7ebf1; color: #617186; font-size: 8px; line-height: 1.55; vertical-align: top; }
.manual-table td strong, .manual-table td small { display: block; }
.manual-table td strong { color: #293e57; font-size: 9px; }
.manual-table td small { margin-top: 3px; color: #8b96a6; font-size: 7px; }
.manual-steps { display: grid; gap: 0; margin: 18px 0; padding: 0; list-style: none; }
.manual-steps li { display: grid; grid-template-columns: 35px minmax(0, 1fr); gap: 12px; padding: 11px 0; border-bottom: 1px solid #e9edf2; }
.manual-steps li:last-child { border-bottom: 0; }
.manual-steps li > span { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 9px; color: #2e70b7; background: #e9f2fc; font-size: 9px; font-weight: 800; }
.manual-steps strong, .manual-steps p { display: block; }
.manual-steps strong { color: #2a3f58; font-size: 10px; }
.manual-steps p { margin: 4px 0 0; color: #748397; font-size: 8px; line-height: 1.55; }
.manual-steps.compact { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 22px; }
.manual-checklist { display: flex; flex-wrap: wrap; gap: 7px; padding: 14px; border-radius: 8px; background: #edf8f4; }
.manual-checklist strong { flex-basis: 100%; margin-bottom: 3px; color: #246b57; font-size: 9px; }
.manual-checklist span { padding: 5px 8px; border-radius: 10px; color: #28745e; background: #fff; font-size: 7px; font-weight: 700; }
.manual-card-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin: 17px 0; }
.manual-card-grid article { display: grid; grid-template-columns: 38px minmax(0, 1fr); gap: 12px; padding: 15px; border: 1px solid #e0e6ee; border-radius: 8px; background: #fafbfd; }
.manual-card-grid svg { width: 22px; height: 22px; fill: none; stroke: #3f79b5; stroke-width: 1.65; stroke-linecap: round; stroke-linejoin: round; }
.manual-card-grid strong, .manual-card-grid p, .manual-card-grid small { display: block; }
.manual-card-grid strong { color: #2b405a; font-size: 10px; }
.manual-card-grid p { margin: 5px 0; color: #6e7e92; font-size: 8px; line-height: 1.5; }
.manual-card-grid small { color: #929baa; font-size: 7px; line-height: 1.45; }
.manual-comparison { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 11px; margin: 18px 0; }
.manual-comparison article { padding: 18px; border: 1px solid #dfe6ee; border-radius: 9px; background: #fafcfe; }
.manual-comparison article > span { color: #3978b8; font-size: 8px; font-weight: 800; letter-spacing: .08em; }
.manual-comparison h4 { margin: 7px 0; color: #263d57; font-size: 13px; }
.manual-comparison p, .manual-comparison li { color: #6d7d91; font-size: 8px; line-height: 1.55; }
.manual-comparison ul { margin: 10px 0 0; padding-left: 17px; }
.manual-comparison.permissions article:first-child { border-top: 3px solid #7697ba; }
.manual-comparison.permissions article:last-child { border-top: 3px solid #2d9174; }
.manual-definition-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 26px; margin: 15px 0; }
.manual-definition-list > div { padding: 12px 0; border-bottom: 1px solid #e7ecf2; }
.manual-definition-list strong { display: block; color: #2d425c; font-size: 10px; }
.manual-definition-list p { margin: 4px 0 0; color: #748398; font-size: 8px; line-height: 1.55; }
.manual-status-line { display: grid; grid-template-columns: auto 1fr auto 1fr auto 1fr; align-items: center; gap: 8px; margin: 18px 0; padding: 13px; border-radius: 8px; background: #f7f9fb; }
.manual-status-line span { padding: 5px 8px; border-radius: 11px; font-size: 7px; font-weight: 800; text-transform: uppercase; }
.manual-status-line b { color: #758398; font-size: 7px; font-weight: 500; }
.manual-status-line .healthy { color: #197157; background: #def3eb; }
.manual-status-line .attention { color: #9b6410; background: #fff0d2; }
.manual-status-line .critical { color: #a43d48; background: #fae6e9; }
.manual-runbook { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 8px; margin: 15px 0; }
.manual-runbook > div { position: relative; padding: 14px 12px; border: 1px solid #e0e6ed; border-radius: 8px; background: #fafcfe; }
.manual-runbook span { display: grid; place-items: center; width: 22px; height: 22px; margin-bottom: 10px; border-radius: 7px; color: #fff; background: #3c78b7; font-size: 8px; font-weight: 800; }
.manual-runbook strong { color: #2d425b; font-size: 9px; }
.manual-runbook p { margin: 5px 0 0; color: #7b8899; font-size: 7px; line-height: 1.5; }
.manual-routine-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin-top: 17px; }
.manual-routine-grid article { padding: 16px 18px; border: 1px solid #e0e6ee; border-radius: 8px; background: #fafcfe; }
.manual-routine-grid span { color: #3678ba; font-size: 8px; font-weight: 800; letter-spacing: .07em; }
.manual-routine-grid ul { margin: 10px 0 0; padding-left: 17px; color: #68798e; font-size: 8px; line-height: 1.8; }
.manual-glossary { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 9px; margin-top: 17px; }
.manual-glossary > div { padding: 13px 14px; border: 1px solid #e2e7ee; border-radius: 7px; }
.manual-glossary strong { color: #2b425d; font-size: 9px; }
.manual-glossary p { margin: 5px 0 0; color: #7b8899; font-size: 7px; line-height: 1.5; }
.manual-footer-note { display: grid; grid-template-columns: 42px minmax(0, 1fr); gap: 13px; align-items: center; margin-top: 20px; padding: 16px; border-radius: 8px; color: #d4e1ec; background: #1d3653; }
.manual-footer-note svg { width: 25px; height: 25px; fill: none; stroke: #72bcc8; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.manual-footer-note strong { display: block; color: #fff; font-size: 10px; }
.manual-footer-note p { margin: 5px 0 0; font-size: 8px; line-height: 1.5; }
.manual-search-empty { padding: 55px 20px; border: 1px dashed #cad5e2; border-radius: 11px; color: #78879a; background: #fff; text-align: center; }
.manual-search-empty strong, .manual-search-empty span { display: block; }
.manual-search-empty strong { color: #334b66; font-size: 13px; }
.manual-search-empty span { margin-top: 6px; font-size: 9px; }

/* Tipografia confortável para leitura prolongada */
.manual-hero-copy > p:last-of-type { font-size: 13px; }
.manual-hero-meta span { font-size: 9px; }
.manual-hero-actions label { font-size: 9px; }
.manual-hero-actions input, .manual-hero-actions .secondary-button { font-size: 11px; }
.manual-index > strong { font-size: 9px; }
.manual-index button { min-height: 38px; font-size: 10px; }
.manual-index button span { font-size: 8px; }
.manual-section-body > .eyebrow { font-size: 10px; }
.manual-section-body > h3 { font-size: 22px; }
.manual-section-body > h4 { font-size: 14px; }
.manual-section-body > p { font-size: 12px; line-height: 1.75; }
.manual-purpose-grid article > span { font-size: 9px; }
.manual-purpose-grid strong { font-size: 12px; }
.manual-purpose-grid p { font-size: 10px; }
.manual-callout strong { font-size: 11px; }
.manual-callout p { font-size: 10px; }
.manual-flow strong { font-size: 11px; }
.manual-flow small { max-width: 145px; font-size: 9px; }
.manual-flow.continuity strong { font-size: 11px; }
.manual-table th { font-size: 9px; }
.manual-table td { font-size: 10px; }
.manual-table td strong { font-size: 11px; }
.manual-table td small { font-size: 9px; }
.manual-steps strong { font-size: 11px; }
.manual-steps p { font-size: 10px; }
.manual-checklist strong { font-size: 11px; }
.manual-checklist span { font-size: 9px; }
.manual-card-grid strong { font-size: 11px; }
.manual-card-grid p { font-size: 10px; }
.manual-card-grid small { font-size: 9px; }
.manual-comparison article > span { font-size: 9px; }
.manual-comparison h4 { font-size: 14px; }
.manual-comparison p, .manual-comparison li { font-size: 10px; }
.manual-definition-list strong { font-size: 11px; }
.manual-definition-list p { font-size: 10px; }
.manual-status-line span { font-size: 9px; }
.manual-status-line b { font-size: 9px; }
.manual-runbook strong { font-size: 11px; }
.manual-runbook p { font-size: 9px; }
.manual-routine-grid span { font-size: 9px; }
.manual-routine-grid ul { font-size: 10px; }
.manual-glossary strong { font-size: 11px; }
.manual-glossary p { font-size: 9px; }
.manual-footer-note strong { font-size: 11px; }
.manual-footer-note p { font-size: 10px; }
.manual-search-empty strong { font-size: 15px; }
.manual-search-empty span { font-size: 11px; }

@media (max-width: 1180px) {
  .manual-hero { grid-template-columns: 1fr; gap: 24px; }
  .manual-flow { grid-template-columns: 1fr; }
  .manual-flow > i { transform: rotate(90deg); }
  .manual-flow > div { width: 100%; }
  .manual-flow.continuity { grid-template-columns: 1fr; }
  .manual-runbook { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 900px) {
  .manual-shell { grid-template-columns: 1fr; }
  .manual-index { position: static; display: flex; gap: 5px; overflow-x: auto; padding: 10px; }
  .manual-index > strong { display: none; }
  .manual-index button { grid-template-columns: auto auto; flex: 0 0 auto; width: auto; }
  .manual-purpose-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .manual-status-line { grid-template-columns: auto 1fr; }
}

@media (max-width: 600px) {
  .manual-hero { padding: 23px 20px; }
  .manual-hero h2 { font-size: 23px; }
  .manual-hero-actions > div { grid-template-columns: 1fr; }
  .manual-section { grid-template-columns: 1fr; }
  .manual-section-number { padding: 12px 18px; text-align: left; }
  .manual-section-body { padding: 22px 18px 24px; }
  .manual-section-body > h3 { font-size: 17px; }
  .manual-purpose-grid, .manual-card-grid, .manual-comparison, .manual-definition-list, .manual-routine-grid, .manual-glossary, .manual-steps.compact, .manual-runbook { grid-template-columns: 1fr; }
}

@media print {
  body { overflow: visible; background: #fff; }
  .sidebar, .topbar, .manual-hero-actions, .manual-index { display: none !important; }
  .shell, .shell > main, .manual-view { display: block !important; width: 100%; max-width: none; }
  .shell > main > .content:not(#platform-manual-view) { display: none !important; }
  #platform-manual-view { padding: 0; }
  .manual-hero { margin: 0 0 14px; padding: 22px; color: #162e4b; background: #eef3f7; box-shadow: none; }
  .manual-hero .eyebrow, .manual-hero-copy > p:last-of-type, .manual-hero-meta span { color: #425a73; }
  .manual-document { gap: 10px; }
  .manual-section { break-inside: avoid; box-shadow: none; }
  .manual-section[hidden] { display: grid !important; }
}