@charset "UTF-8";
:root {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif;
  color: #24324a;
  background: #f5f7fb;
  font-synthesis: none;
  --ink: #17243d;
  --muted: #6b7890;
  --line: #e7ecf3;
  --blue: #2563eb;
  --blue-light: #edf3ff;
  --red: #c33e47;
  --radius: 12px;
}
* { box-sizing: border-box; }
body { margin: 0; font-size: 14px; line-height: 1.6; }
[hidden] { display: none !important; }
button, input, select { font: inherit; }
button, a, input, select, summary { -webkit-tap-highlight-color: transparent; }
button { cursor: pointer; }
button:disabled { cursor: not-allowed; opacity: .45; }
a { color: inherit; text-decoration: none; }
button:focus-visible, a:focus-visible, summary:focus-visible { outline: 3px solid #8fb5ff; outline-offset: 3px; }
h1, h2, h3, p { margin: 0; }
h1 { color: var(--ink); font-size: 28px; line-height: 1.4; letter-spacing: -.6px; }
h2 { color: var(--ink); font-size: 22px; line-height: 1.5; letter-spacing: -.3px; }
h3 { color: var(--ink); font-size: 15px; }
small, .small { font-size: 12px; }
.muted { color: var(--muted); }
.mono { font-family: "SFMono-Regular", Consolas, "Liberation Mono", monospace; }
.eyebrow { font-size: 10px; letter-spacing: 1.8px; font-weight: 650; color: #8593ab; margin-bottom: 7px; }
.button { display: inline-flex; gap: 8px; justify-content: center; align-items: center; min-height: 40px; border: 1px solid transparent; border-radius: 8px; padding: 9px 15px; font-size: 13px; line-height: 1.45; font-weight: 550; white-space: nowrap; transition: background .12s, box-shadow .12s; }
.button.primary { background: var(--blue); color: #fff; box-shadow: 0 3px 8px #2563eb1a; }
.button.primary:hover:not(:disabled) { background: #1d4ed8; }
.button.secondary { background: #fff; border-color: #dce3ee; color: #43526e; }
.button.secondary:hover:not(:disabled) { background: #f4f7fc; border-color: #c4d1e5; }
.button.danger { background: var(--red); color: #fff; }
.button.danger-outline { background: #fff; border-color: #f0cbd0; color: var(--red); }
.text-button { border: 0; background: transparent; color: var(--blue); padding: 4px 0; font-size: 12px; font-weight: 550; white-space: nowrap; }
.text-button:hover:not(:disabled) { text-decoration: underline; }
.danger-text { color: var(--red); }
.icon-button { display: flex; align-items: center; justify-content: center; border: 0; background: #f2f5fa; border-radius: 7px; color: #738099; width: 32px; height: 32px; font-size: 23px; line-height: 1; flex-shrink: 0; }
.wordmark { display: flex; align-items: center; gap: 10px; font-size: 15px; font-weight: 750; letter-spacing: -.2px; line-height: 1.2; }
.wordmark b { font-size: 12px; font-weight: 550; }
.brand-mark { width: 35px; height: 36px; object-fit: contain; flex-shrink: 0; }
.brand-sub { display: block; font-size: 10px; font-weight: 400; letter-spacing: 1.1px; color: #8794aa; margin-top: 7px; }
.session-loading { min-height: 100vh; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 14px; color: var(--muted); font-size: 13px; }
.login-layout { display: grid; grid-template-columns: 48% 52%; min-height: 100vh; }
.login-story { background: #edf3ff; color: #183b81; padding: 46px 11%; display: flex; flex-direction: column; position: relative; overflow: hidden; border-right: 1px solid #e0e9fa; }
.login-story::after { content: ""; position: absolute; width: 500px; height: 500px; border: 1px solid #d9e5ff; border-radius: 50%; right: -270px; bottom: -240px; box-shadow: 0 0 0 60px #d8e6ff33, 0 0 0 120px #d8e6ff22; pointer-events: none; }
.login-story .wordmark { color: var(--ink); }
.story-body { margin: auto 0; z-index: 1; padding: 65px 0; }
.story-body .eyebrow { color: #6889c9; margin-bottom: 25px; font-size: 10px; }
.story-body h1 { font-size: clamp(30px, 3vw, 46px); letter-spacing: -1px; line-height: 1.55; font-weight: 650; color: #173d85; }
.story-body > p:not(.eyebrow) { color: #6880a8; margin-top: 24px; font-size: 14px; line-height: 2; }
.story-grid { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; margin-top: 40px; font-size: 11px; color: #5b7db8; }
.story-grid span { border: 1px solid #dce6f7; background: #ffffff3d; border-radius: 6px; padding: 7px 10px; white-space: nowrap; }
.story-footer { font-size: 11px; color: #8a9ab6; z-index: 1; }
.login-main { display: flex; align-items: center; justify-content: center; padding: 60px 30px; background: #fff; }
.login-card { width: 370px; max-width: 100%; }
.login-label { display: inline-block; padding: 4px 9px; color: var(--blue); background: var(--blue-light); border-radius: 5px; font-size: 11px; margin-bottom: 18px; }
.login-card h2 { font-size: 30px; margin-bottom: 28px; }
.login-card > .muted { margin-top: 8px; font-size: 13px; }
.health-status { font-size: 11px; color: #44745f; margin: 0 0 24px; display: inline-block; padding: 6px 10px; border: 1px solid #e0ece6; border-radius: 6px; background: #f5faf7; }
.health-status.unavailable { color: #996522; background: #fffbef; border-color: #f3e4c5; }
label { display: flex; flex-direction: column; gap: 8px; font-size: 12px; font-weight: 550; }
input, select { border: 1px solid #dce3ee; border-radius: 7px; padding: 10px 12px; color: #31415f; background: #fff; outline: none; min-width: 0; width: 100%; font-size: 13px; line-height: 1.5; }
input:focus, select:focus { border-color: #739cf1; box-shadow: 0 0 0 3px #2563eb0f; }
input::placeholder { color: #94a0b5; font-size: 12px; }
input[readonly] { background: #f6f8fc; color: #50617e; }
#login-form > label + label { margin-top: 20px; }
.login-submit { width: 100%; margin-top: 27px; justify-content: center; min-height: 46px; }
.login-note { font-size: 11px; color: #8794aa; line-height: 1.9; border-top: 1px solid var(--line); padding-top: 22px; margin-top: 28px; }
.message { border: 1px solid #d6e4fa; background: #f2f7ff; border-radius: 8px; padding: 12px 16px; font-size: 12px; margin: 16px 0; overflow-wrap: anywhere; }
.message.error { background: #fff5f5; border-color: #f1d8db; color: #ab414b; }
.message.success { background: #f0f8f5; border-color: #d5e9df; color: #30715b; }
.workspace { display: grid; grid-template-columns: 222px minmax(0, 1fr); min-height: 100vh; }
.sidebar { background: #fff; color: #243857; border-right: 1px solid var(--line); padding: 28px 16px 22px; display: flex; flex-direction: column; position: sticky; top: 0; height: 100vh; }
.sidebar .wordmark { margin: 0 5px 46px; gap: 9px; }
.sidebar .wordmark b { font-size: 11px; }
.sidebar .brand-sub { font-size: 9px; }
.nav-caption { font-size: 10px; color: #9aa5b8; letter-spacing: 1px; padding: 0 17px; margin-bottom: 14px; }
.sidebar nav { display: flex; flex-direction: column; gap: 7px; }
.nav-item { display: flex; align-items: center; gap: 13px; text-align: left; border: 0; border-radius: 8px; background: transparent; color: #6c7991; padding: 12px 16px; font-size: 13px; }
.nav-item svg { width: 19px; height: 19px; fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; flex-shrink: 0; }
.nav-item:hover { background: #f5f7fb; color: #435b83; }
.nav-item.selected { background: var(--blue-light); color: var(--blue); font-weight: 650; }
.sidebar-bottom { display: flex; align-items: center; gap: 11px; margin-top: auto; border-top: 1px solid var(--line); padding: 22px 8px 0; font-size: 11px; color: #6f809b; }
.sidebar-bottom p { font-size: 10px; color: #9aa6ba; margin-top: 3px; }
.sidebar-symbol { width: 31px; height: 33px; background: #f1f5fc; display: grid; place-items: center; font-size: 24px; color: #7b9fd8; border-radius: 8px; }
.main-column { min-width: 0; }
.topbar { height: 72px; background: #fff; border-bottom: 1px solid var(--line); display: flex; justify-content: space-between; align-items: center; padding: 0 34px; gap: 16px; }
.breadcrumb { font-size: 12px; color: #9aa5b8; white-space: nowrap; }
.breadcrumb > span { padding: 0 13px; color: #ccd4e1; }
.breadcrumb strong { font-weight: 450; color: #65738c; }
.account-menu { display: flex; align-items: center; gap: 10px; font-size: 12px; min-width: 0; }
#session-user { max-width: 190px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.account-avatar { display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; background: #eaf1ff; font-size: 11px; color: #5281d3; }
.admin-tag { color: #6b85af; background: #f0f4fb; border-radius: 4px; font-size: 10px; padding: 2px 6px; }
.account-menu .text-button { border-left: 1px solid var(--line); padding-left: 13px; margin-left: 3px; font-size: 11px; color: #7a879d; }
.content { max-width: 1700px; margin: auto; padding: 30px 34px 20px; }
.page-heading { display: flex; justify-content: space-between; align-items: center; gap: 20px; margin-bottom: 25px; }
.page-heading .muted { font-size: 12px; margin-top: 8px; }
.heading-actions { display: flex; align-items: center; gap: 9px; }
.stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; margin-bottom: 25px; }
.stat { background: #fff; border: 1px solid var(--line); border-radius: var(--radius); padding: 18px 23px; display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 8px; }
.stat > span:first-child { font-size: 12px; color: #7c8ba3; }
.stat strong { grid-column: 1; color: #29426a; font-size: 30px; line-height: 1.3; font-weight: 600; letter-spacing: -.7px; }
.stat strong small { font-size: 14px; color: #9bafcf; vertical-align: top; margin-left: 3px; }
.stat .stat-note { grid-column: 2; grid-row: 2; font-size: 10px; color: #95a3b9; }
.toolbar { display: flex; gap: 12px; margin-bottom: 8px; align-items: center; }
.toolbar > label:not(.search-label) { width: 140px; }
.toolbar select { font-size: 12px; }
.search-label { flex-direction: row; align-items: center; position: relative; flex: 1; max-width: 490px; }
.search-label > span[aria-hidden] { position: absolute; left: 13px; font-size: 22px; font-weight: 400; color: #8191ac; top: 0; }
.search-label input { padding-left: 38px; font-size: 12px; }
.scope-note { color: #8593aa; font-size: 11px; margin: 0 0 16px; line-height: 1.8; }
.data-panel { background: #fff; border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; min-height: 240px; }
.table-caption { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 17px 22px; border-bottom: 1px solid var(--line); font-size: 12px; }
.table-caption strong { font-weight: 550; }
.table-caption > span { font-size: 11px; color: #8c9ab1; }
.table-scroll { overflow: auto; width: 100%; }
table { border-collapse: collapse; width: 100%; font-size: 12px; line-height: 1.6; text-align: left; }
th { background: #f8faff; font-weight: 450; color: #8492a8; font-size: 11px; white-space: nowrap; border-bottom: 1px solid var(--line); padding: 12px 18px; }
td { padding: 17px 18px; border-bottom: 1px solid #edf1f7; vertical-align: middle; }
tbody tr:last-child td { border-bottom: 0; }
tbody tr:hover { background: #fbfcff; }
td strong { font-size: 12px; font-weight: 600; }
td .text-button { font-size: 12px; }
.id { display: inline-block; max-width: 150px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 10px; color: #8c9bb2; vertical-align: middle; }
td > div:has(.id) { line-height: 1.4; margin-top: 4px; }
.truncate { max-width: 165px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.badge { display: inline-flex; align-items: center; gap: 5px; font-size: 10px; font-weight: 500; padding: 3px 8px; border-radius: 5px; background: #f0f3f8; color: #7e8ca3; white-space: nowrap; }
.badge::before { content: ""; width: 4px; height: 4px; background: currentColor; border-radius: 50%; }
.badge.active, .badge.available { background: #edf8f3; color: #36866a; }
.badge.suspended, .badge.expired { background: #fff6e8; color: #ae7c28; }
.badge.revoked, .badge.disabled { background: #fdf0f1; color: #bd626b; }
.badge.redeemed { background: #edf3ff; color: #648bc9; }
.badge.reset { background: #f2f4f8; color: #919aad; }
.table-footer { display: flex; align-items: center; justify-content: space-between; gap: 15px; padding: 15px 21px; border-top: 1px solid var(--line); font-size: 11px; color: #8b99af; min-height: 62px; }
.table-footer .button { min-height: 32px; font-size: 11px; padding: 7px 11px; }
.data-panel .message { margin: 16px 20px; }
.empty-state { text-align: center; padding: 54px 20px; color: #9ba7bb; }
.empty-state > span { font-size: 29px; color: #acc0e4; display: block; margin-bottom: 8px; }
.empty-state h3 { font-size: 13px; font-weight: 550; color: #7488a7; }
.empty-state p { font-size: 11px; margin-top: 8px; }
.empty-state.compact { padding: 28px 18px; border: 1px dashed var(--line); border-radius: 8px; }
.content-footer { font-size: 10px; color: #9aa6b9; display: flex; justify-content: space-between; gap: 15px; padding: 25px 0 0; flex-wrap: wrap; }
.customer-cell { display: flex; align-items: center; gap: 11px; }
.customer-avatar { width: 34px; height: 34px; border-radius: 10px; display: grid; place-items: center; flex-shrink: 0; color: #648ad0; background: #eef4ff; font-size: 13px; font-weight: 650; }
.customer-avatar.large { width: 51px; height: 51px; border-radius: 14px; font-size: 22px; }
.back-link { color: #8291a9; font-size: 11px; margin: -8px 0 15px; }
.customer-hero { display: flex; align-items: center; justify-content: space-between; gap: 18px; background: #fff; border: 1px solid var(--line); border-radius: var(--radius) var(--radius) 0 0; padding: 23px 26px; }
.customer-identity { display: flex; align-items: center; gap: 15px; min-width: 0; }
.customer-identity > div { min-width: 0; }
.customer-name { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.customer-name h2 { font-size: 20px; overflow-wrap: anywhere; }
.customer-identity p { margin-top: 5px; color: #92a0b5; font-size: 10px; overflow-wrap: anywhere; }
.customer-identity p .mono { margin-left: 9px; color: #8495b2; }
.customer-registered { flex-shrink: 0; display: flex; flex-direction: column; align-items: flex-end; gap: 5px; font-size: 11px; color: #9aa7bb; }
.customer-registered strong { font-size: 12px; color: #6a7c99; font-weight: 450; }
.customer-metrics { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)) auto; background: #fff; border: 1px solid var(--line); border-top: 0; border-radius: 0 0 var(--radius) var(--radius); margin-bottom: 24px; padding: 18px 26px; gap: 24px; align-items: center; }
.customer-metrics > div { border-right: 1px solid var(--line); }
.customer-metrics > div > span { display: block; font-size: 11px; color: #8b99b0; }
.customer-metrics strong { display: block; color: #354d74; font-size: 26px; font-weight: 600; line-height: 1.4; margin-top: 3px; }
.customer-metrics small { font-size: 11px; color: #9aa7bd; margin-left: 7px; font-weight: 400; }
.customer-metrics > p { font-size: 10px; color: #a0adc0; line-height: 1.9; }
.customer-layout { display: grid; grid-template-columns: minmax(0, 1fr) 258px; gap: 22px; align-items: start; }
.customer-primary { min-width: 0; }
.tabs { display: flex; gap: 25px; border-bottom: 1px solid #dde5f1; margin-bottom: 17px; }
.tabs button { display: flex; gap: 7px; align-items: center; color: #8593aa; font-size: 12px; padding: 0 1px 13px; background: transparent; border: 0; border-bottom: 2px solid transparent; margin-bottom: -1px; white-space: nowrap; }
.tabs button[aria-selected="true"] { color: var(--blue); border-bottom-color: var(--blue); font-weight: 600; }
.tabs button > span { background: #edf1f7; color: #9aa9bf; min-width: 18px; text-align: center; padding: 0 4px; line-height: 17px; font-size: 10px; border-radius: 4px; }
.tabs button[aria-selected="true"] > span { background: #e8f0ff; color: #638fda; }
.panel-heading { display: flex; justify-content: space-between; align-items: center; gap: 18px; padding: 20px 23px; border-bottom: 1px solid var(--line); }
.panel-heading h2 { font-size: 15px; font-weight: 650; }
.panel-heading p { font-size: 10px; color: #92a0b5; margin-top: 5px; }
.license-picker { width: 245px; max-width: 48%; }
.license-picker select { font-size: 10px; padding: 8px 9px; color: #6e82a2; background: #fafcff; }
.customer-panel > .license-content { padding: 21px 23px; }
.customer-panel > .empty-state { margin: 22px; }
.customer-panel .panel-note { font-size: 11px; color: #8293af; padding: 13px 23px; background: #fafcff; border-bottom: 1px solid var(--line); }
.customer-panel .facts { gap: 17px 22px; }
.customer-panel .device-table .id { max-width: 165px; }
.customer-panel .device-table td { font-size: 11px; }
.customer-panel .device-table th { font-size: 10px; }
.customer-rail { display: flex; flex-direction: column; gap: 18px; padding-top: 48px; min-width: 0; }
.rail-card { padding: 21px; border: 1px solid var(--line); border-radius: var(--radius); background: #fff; }
.rail-card h3 { font-size: 13px; font-weight: 600; }
.rail-facts { margin: 20px 0 0; font-size: 11px; }
.rail-facts > div { display: flex; justify-content: space-between; gap: 14px; margin-top: 14px; }
.rail-facts dt { color: #95a1b5; }
.rail-facts dd { margin: 0; color: #687d9e; text-align: right; }
.rail-note { font-size: 10px; line-height: 1.9; color: #9ba7bc; border-top: 1px solid var(--line); margin-top: 19px; padding-top: 14px; }
.rail-heading { display: flex; justify-content: space-between; align-items: center; gap: 8px; }
.rail-heading > span { font-size: 9px; color: #a0adc1; }
.timeline { list-style: none; margin: 22px 0 0 4px; padding: 0; }
.timeline li { position: relative; padding: 0 0 23px 19px; border-left: 1px solid #e6edf8; }
.timeline li:last-child { padding-bottom: 0; border-left-color: transparent; }
.timeline-dot { position: absolute; left: -4px; top: 6px; width: 7px; height: 7px; border: 2px solid #fff; outline: 1px solid #8fb1ec; border-radius: 50%; background: #8fb1ec; }
.timeline-dot.denied { background: #d89a63; outline-color: #d89a63; }
.timeline-heading { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.timeline-heading strong { font-size: 11px; font-weight: 500; color: #5e7394; }
.timeline-heading > span { font-size: 9px; color: #9eaec3; }
.timeline li p { color: #91a0b7; font-size: 10px; line-height: 1.7; margin-top: 6px; overflow-wrap: anywhere; }
.timeline time { display: block; color: #aab5c7; font-size: 9px; margin-top: 5px; }
.rail-link { width: 100%; border-top: 1px solid var(--line); margin-top: 20px; padding-top: 13px; text-align: center; font-size: 10px; }
.rail-empty { font-size: 11px; color: #94a3b9; padding: 22px 0 3px; }
.customer-scope { margin: 16px 0 0; }
.audit-reason { color: #697d9b; font-size: 11px; margin-bottom: 5px; overflow-wrap: anywhere; max-width: 220px; }
dialog { border: 1px solid #dce5f3; border-radius: 14px; padding: 0; box-shadow: 0 26px 100px #132b5129; color: #354968; width: min(620px, calc(100vw - 32px)); max-height: calc(100dvh - 40px); background: #fff; }
dialog.wide { width: min(930px, calc(100vw - 32px)); }
dialog::backdrop { background: #132a514f; backdrop-filter: blur(3px); }
.dialog-header { display: flex; justify-content: space-between; align-items: flex-start; gap: 20px; padding: 23px 26px 20px; border-bottom: 1px solid var(--line); }
.dialog-header h2 { font-size: 19px; }
.dialog-header p { font-size: 11px; margin-top: 8px; line-height: 1.8; }
.dialog-body { padding: 23px 26px; }
.dialog-body > label + label { margin-top: 18px; }
.dialog-footer { display: flex; justify-content: flex-end; gap: 10px; border-top: 1px solid var(--line); padding: 17px 26px; background: #fafcff; }
.dialog-body .message { margin-bottom: 0; }
.form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.form-grid label { min-width: 0; }
.form-grid + fieldset { margin-top: 22px; }
/* Release registration uses its own layout and controls, including native textareas. */
.releases-layout { display: grid; gap: 24px; min-width: 0; }
.release-editor, .release-list { min-width: 0; min-height: 0; }
.release-editor .panel-heading, .release-list .panel-heading { padding: 20px 24px; }
.release-editor .panel-heading h2, .release-list .panel-heading h2 { font-size: 17px; }
.release-editor .panel-heading p { color: var(--muted); font-size: 13px; }
.release-form-body { padding: 22px 24px 24px; }
.release-guidance { display: flex; align-items: flex-start; gap: 10px; padding: 12px 14px; margin-bottom: 24px; border: 1px solid #e0e9fa; border-radius: 8px; background: #f5f8ff; color: #526c91; font-size: 13px; line-height: 1.7; }
.release-guidance .ui-icon { flex-shrink: 0; margin-top: 3px; }
.release-form-columns { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 32px; align-items: start; }
.release-fields { display: grid; gap: 18px; min-width: 0; }
.release-fields + .release-fields { border-left: 1px solid var(--line); padding-left: 32px; }
.release-fields h3 { color: #2c4364; font-size: 14px; font-weight: 650; }
.release-fields label { min-width: 0; font-size: 14px; gap: 8px; }
.release-field-pair { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.release-fields input, .release-fields select, .release-fields textarea { width: 100%; min-width: 0; min-height: 44px; border: 1px solid var(--control-line, #dce3ee); border-radius: 8px; padding: 10px 12px; background: #fff; color: #31415f; font: inherit; font-size: 14px; font-weight: 400; line-height: 1.6; }
.release-fields textarea { display: block; min-height: 94px; resize: vertical; }
.release-fields input::placeholder, .release-fields textarea::placeholder { color: #8492a9; font-size: 13px; }
.release-fields textarea:focus { outline: none; border-color: #739cf1; box-shadow: 0 0 0 3px #2563eb0f; }
.release-field-hint { color: var(--muted); font-size: 12px; font-weight: 400; line-height: 1.6; }
.release-form-footer { display: flex; justify-content: flex-end; gap: 10px; padding: 16px 24px; border-top: 1px solid var(--line); background: #fafcff; }
.release-count { color: var(--muted); font-size: 13px; }
.release-query { padding: 18px 24px 0; }
.release-query .query-panel { margin-bottom: 16px; }
.release-query .toolbar { flex-wrap: wrap; }
.release-query .search-label { min-width: min(230px, 100%); }
@media (max-width: 760px) { .release-query { padding-inline: 18px; } }
.release-table { min-width: 1040px; table-layout: fixed; }
.release-table th { color: #536781; font-size: 13px; font-weight: 600; }
.release-table td, .release-table td strong { color: #354d6b; font-size: 14px; }
.release-table th:nth-child(1) { width: 158px; }
.release-target { display:block; margin-top:5px; color:#7a8798; font-size:11px; }
.release-table th:nth-child(2) { width: 132px; }
.release-table th:nth-child(4) { width: 105px; }
.release-table th:nth-child(5) { width: 180px; }
.release-table th:nth-child(6) { width: 115px; }
.release-table th:nth-child(7) { width: 222px; }
.release-notes summary { cursor: pointer; list-style: none; }
.release-notes summary::-webkit-details-marker { display: none; }
.release-notes-text { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; white-space: pre-wrap; overflow-wrap: anywhere; }
.release-notes details[open] .release-notes-text { display: block; }
.release-notes-toggle { display: inline-block; margin-top: 5px; color: var(--blue); font-size: 12px; }
.release-notes-toggle::after { content: "展开说明"; }
.release-notes details[open] .release-notes-toggle::after { content: "收起说明"; }
.release-date { font-variant-numeric: tabular-nums; }
.release-row-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; }
.release-list .empty-state { padding: 38px 20px; }
.release-list .empty-state h3 { color: #647b9b; font-size: 14px; }
.release-list .empty-state p { color: #7c8da5; font-size: 13px; }
@media (max-width: 1100px) {
  .release-form-columns { grid-template-columns: minmax(0, 1fr); gap: 24px; }
  .release-fields + .release-fields { border-left: 0; border-top: 1px solid var(--line); padding: 24px 0 0; }
}
@media (max-width: 760px) {
  .releases-layout { gap: 18px; }
  .release-editor .panel-heading, .release-list .panel-heading { padding: 17px 18px; }
  .release-form-body { padding: 18px; }
  .release-guidance { margin-bottom: 20px; }
  .release-form-footer { padding: 15px 18px; }
}
@media (max-width: 480px) {
  .release-field-pair { grid-template-columns: minmax(0, 1fr); gap: 18px; }
}
fieldset { border: 1px solid #e0e7f2; padding: 16px; border-radius: 8px; min-width: 0; }
fieldset legend { font-size: 12px; color: #7589a9; padding: 0 7px; }
fieldset .small { margin-top: 14px; line-height: 1.9; }
.field-label { font-size: 12px; margin-top: 17px; margin-bottom: 12px; font-weight: 550; }
.feature-options { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; }
.check-line { display: flex; flex-direction: row; align-items: flex-start; gap: 8px; font-size: 12px; font-weight: 400; line-height: 1.7; }
.check-line input { width: 15px; height: 15px; padding: 0; accent-color: var(--blue); box-shadow: none; margin: 3px 0 0; flex-shrink: 0; }
.policy-check { margin-top: 23px !important; }
.detail-top { display: flex; align-items: center; gap: 13px; margin-bottom: 18px; font-size: 11px; }
.detail-top .text-button { margin-left: auto; font-size: 10px; }
.facts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; margin: 18px 0 23px; }
.facts div { min-width: 0; }
.facts dt { font-size: 10px; color: #91a0b8; margin-bottom: 5px; }
.facts dd { margin: 0; font-size: 12px; overflow-wrap: anywhere; color: #627796; }
.facts dd small { display: block; font-size: 10px; color: #9baac0; }
.facts dd .text-button { font-size: 12px; }
.feature-list { display: flex; gap: 7px; flex-wrap: wrap; margin-bottom: 23px; }
.feature { background: #eff5ff; border: 1px solid #e3edfd; color: #7094ca; border-radius: 5px; font-size: 10px; padding: 3px 9px; }
.license-actions { display: flex; gap: 8px; flex-wrap: wrap; padding: 18px 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.license-actions .button { min-height: 34px; font-size: 11px; padding: 7px 11px; }
.section-title { display: flex; justify-content: space-between; align-items: center; margin: 23px 0 16px; gap: 12px; }
.section-title h3 { font-size: 14px; }
.section-title h3 small { font-size: 10px; font-weight: 400; color: #9cabc0; margin-left: 8px; }
.section-title .text-button { font-size: 11px; }
.device-table { border: 1px solid var(--line); }
.device-table td { padding: 13px 11px; }
.device-table th { padding: 10px 11px; }
.device-table .id { max-width: 235px; }
.callout { background: #f4f7fd; border-left: 3px solid #c1d4f4; color: #7c91b2; padding: 11px 13px; font-size: 11px; line-height: 1.9; margin-top: 20px; }
.callout.warning { background: #fff5ee; border-color: #e1ba9b; color: #a06e49; }
.dialog-body > .callout:first-child { margin-top: 0; margin-bottom: 20px; }
.success-label { font-size: 12px; color: #438a70; margin-bottom: 14px; }
.secret-code { font-size: 14px; font-weight: 550; padding: 14px 12px; color: #315c9c !important; background: #f2f7ff !important; letter-spacing: .3px; }
#copy-status { margin-top: 7px; }
.dialog-body > .button { margin-top: 14px; }
details summary { color: #7d95b8; font-size: 11px; cursor: pointer; }
pre { background: #f5f8fd; border: 1px solid var(--line); padding: 10px; border-radius: 6px; max-width: 300px; font-size: 10px; overflow: auto; white-space: pre-wrap; overflow-wrap: anywhere; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
@media (min-width: 1550px) {
  .content { padding: 36px 45px 24px; }
  .topbar { padding: 0 45px; }
  .customer-layout { grid-template-columns: minmax(0, 1fr) 290px; gap: 25px; }
  .rail-card { padding: 24px; }
}
@media (max-width: 1200px) {
  .workspace { grid-template-columns: 200px minmax(0, 1fr); }
  .sidebar { padding-inline: 12px; }
  .sidebar .wordmark { gap: 6px; }
  .sidebar .wordmark b { font-size: 10px; }
  .content { padding: 26px 24px 18px; }
  .topbar { padding: 0 24px; }
  .customer-layout { grid-template-columns: minmax(0, 1fr) 226px; gap: 16px; }
  .rail-card { padding: 18px; }
  .customer-panel > .license-content { padding: 20px; }
  .panel-heading { flex-wrap: wrap; gap: 12px; padding: 19px 20px; }
  .license-picker { max-width: 100%; width: 100%; }
  .stat { padding: 18px; }
  .stat .stat-note { display: none; }
  td { padding: 15px 13px; }
  th { padding: 11px 13px; }
  .customer-metrics { gap: 17px; }
  .customer-metrics > p { display: none; }
  .customer-metrics { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .customer-metrics > div:last-of-type { border: 0; }
}
@media (max-width: 1000px) {
  .customer-layout { grid-template-columns: minmax(0, 1fr); }
  .customer-rail { display: grid; grid-template-columns: 1fr 1fr; padding-top: 0; }
  .customer-registered { display: none; }
  .heading-actions .button { font-size: 12px; padding: 9px 12px; }
  .breadcrumb { font-size: 11px; }
  .account-menu { gap: 7px; }
  .account-avatar { display: none; }
}
@media (max-width: 760px) {
  .login-layout { grid-template-columns: 1fr; }
  .login-story { padding: 26px 28px; min-height: 140px; border-right: 0; border-bottom: 1px solid #e0e9fa; }
  .story-body { display: none; }
  .story-footer { margin-top: 20px; font-size: 10px; }
  .login-main { padding: 40px 28px; align-items: flex-start; }
  .workspace { grid-template-columns: 1fr; }
  .sidebar { position: static; height: auto; padding: 20px 18px 0; border-right: 0; border-bottom: 1px solid var(--line); }
  .sidebar .wordmark { margin: 0 2px 22px; gap: 9px; }
  .sidebar .wordmark b { font-size: 12px; }
  .nav-caption, .sidebar-bottom { display: none; }
  .sidebar nav { flex-direction: row; gap: 3px; justify-content: space-between; padding-bottom: 13px; }
  .nav-item { font-size: 12px; padding: 10px 9px; gap: 6px; }
  .nav-item svg { width: 16px; height: 16px; }
  .topbar { height: 52px; padding: 0 19px; }
  .breadcrumb { display: none; }
  .account-menu { margin-left: auto; }
  .account-avatar { display: grid; width: 24px; height: 24px; }
  .content { padding: 24px 18px 15px; }
  .page-heading { align-items: flex-start; gap: 15px; flex-wrap: wrap; margin-bottom: 24px; }
  .page-heading h1 { font-size: 26px; }
  .page-heading .eyebrow { font-size: 9px; }
  .page-heading .muted { font-size: 11px; }
  .heading-actions { width: 100%; justify-content: flex-end; }
  .stats { gap: 9px; margin-bottom: 20px; }
  .stat { padding: 14px 12px; gap: 7px; display: flex; flex-direction: column; align-items: flex-start; }
  .stat > span:first-child { font-size: 10px; }
  .stat strong { font-size: 24px; }
  .table-caption { align-items: flex-start; flex-direction: column; gap: 5px; padding: 15px; }
  .table-caption > span { font-size: 10px; }
  .toolbar { gap: 8px; flex-wrap: wrap; }
  .search-label { flex-basis: calc(100% - 120px); }
  .toolbar > label:not(.search-label) { width: 110px; }
  .toolbar > .button { font-size: 11px; min-height: 32px; padding: 7px 11px; }
  .table-footer { padding: 14px; gap: 10px; flex-wrap: wrap; }
  .table-footer > span { font-size: 10px; }
  .content-footer { padding-top: 20px; gap: 7px; font-size: 9px; }
  .customer-hero { padding: 20px 17px; }
  .customer-identity { gap: 12px; }
  .customer-name { gap: 8px; }
  .customer-name h2 { font-size: 18px; }
  .customer-avatar.large { width: 44px; height: 46px; }
  .customer-identity p { font-size: 9px; }
  .customer-identity p .mono { margin: 3px 0 0; display: block; }
  .customer-metrics { padding: 16px; gap: 12px; }
  .customer-metrics > div > span { font-size: 9px; }
  .customer-metrics strong { font-size: 23px; }
  .customer-metrics small { font-size: 10px; margin-left: 4px; }
  .tabs { gap: 23px; }
  .tabs button { font-size: 12px; gap: 5px; }
  .customer-panel > .license-content { padding: 18px; }
  .panel-heading { padding: 18px; }
  .customer-rail { grid-template-columns: 1fr; gap: 15px; }
  .facts { grid-template-columns: 1fr; gap: 15px; }
  .dialog-header { padding: 21px 20px 18px; }
  .dialog-body { padding: 20px; }
  .dialog-footer { padding: 15px 20px; }
  .dialog-footer .button { font-size: 12px; padding: 9px 11px; }
  .section-title { flex-wrap: wrap; }
  .secret-code { font-size: 12px; letter-spacing: 0; }
  .form-grid { gap: 14px 10px; }
  .feature-options { gap: 10px; }
  .device-table .id { max-width: 160px; }
}
@media (max-width: 380px) {
  .nav-item { padding: 10px 7px; font-size: 11px; }
  .nav-item svg { width: 14px; height: 14px; }
  .tabs { gap: 15px; }
  .tabs button { font-size: 11px; }
}
@media (prefers-reduced-motion: reduce) {
  * { transition: none !important; scroll-behavior: auto !important; }
}
.code-metadata { margin-top: 8px; }
.code-metadata dl { margin: 10px 0 0; min-width: 170px; max-width: 230px; }
.code-metadata dt { font-size: 10px; color: #94a3bb; }
.code-metadata dd { font-size: 10px; margin: 2px 0 8px; color: #7186a7; overflow-wrap: anywhere; }
.table-scroll:focus-visible { outline: 2px solid #8fb5ff; outline-offset: -2px; }
.mobile-table-hint { display: none; }
@media (max-width: 760px) {
  .mobile-table-hint { display: block; font-size: 10px; color: #91a1ba; margin: -6px 0 12px; }
}

/* Shared controls and content components used across every operator workflow. */
:root { --muted: #65758e; --control-line: #d5deec; --surface-soft: #f7f9fd; }
.ui-icon { display: inline-block; width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; flex: 0 0 auto; vertical-align: middle; }
.spinning { animation: operator-spin 1s linear infinite; }
@keyframes operator-spin { to { transform: rotate(360deg); } }
.button { min-height: 42px; font-size: 13px; gap: 8px; border-radius: 8px; }
.button .ui-icon { width: 16px; height: 16px; }
.button.subtle { color: #586c8e; background: #f3f6fc; border-color: #e4eaf4; }
.button.subtle:hover:not(:disabled) { background: #eaf1fc; color: #2563eb; }
.button:disabled { opacity: .5; box-shadow: none; }
.small-button, .button.row-action { min-height: 34px; padding: 6px 10px; font-size: 12px; }
.button.row-action { background: #f1f6ff; border-color: #e1eaff; color: #285fc1; }
.button.row-action .ui-icon { width: 14px; height: 14px; }
.button.row-action:hover:not(:disabled) { background: #e6efff; }
.icon-button { width: 34px; height: 34px; }
.icon-button .ui-icon { width: 17px; height: 17px; }
label { font-size: 13px; color: #40536f; font-weight: 550; }
input, select { min-height: 44px; font-size: 14px; border-color: var(--control-line); border-radius: 8px; padding: 10px 12px; }
input::placeholder { font-size: 12px; color: #8492a9; }
input[aria-invalid="true"], select[aria-invalid="true"] { border-color: #d2636c; background: #fffafa; }
input[aria-invalid="true"]:focus { box-shadow: 0 0 0 3px #d2636c12; }
input[readonly] { color: #546886; background: #f6f8fc; }
input[type="search"]::-webkit-search-cancel-button { cursor: pointer; }
.password-field { display: flex; position: relative; }
#login-form > .remember-password { display:flex; flex-direction:row; justify-content:flex-start; align-items:center; gap:8px; margin-top:18px; color:#405777; font-size:14px; font-weight:400; cursor:pointer; }
#login-form > .remember-password input { flex:none; width:16px; height:16px; min-width:16px; min-height:16px; margin:0; padding:0; accent-color:#2563eb; }
#login-form > .remember-password input:focus { box-shadow:none; }
#login-form > .remember-password input:focus-visible { outline:2px solid #739cf1; outline-offset:3px; }
.remember-password-hint { margin:4px 0 0; color:#667b98; font-size:12px; line-height:1.5; }
.password-field input { padding-right: 65px; }
.password-toggle { border: 0; background: transparent; color: #607ba7; padding: 0 15px; position: absolute; right: 0; inset-block: 1px; display: flex; align-items: center; border-radius: 7px; }
.password-toggle svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.password-toggle[aria-pressed="true"] .eye-slash { display: none; }
.password-toggle:hover { background: #edf3ff; }
.field-hint { display: block; font-size: 11px; font-weight: 400; color: #71829c; line-height: 1.8; }
.field-hint-row { display: flex; justify-content: space-between; gap: 12px; }
.field-counter { font-weight: 400; white-space: nowrap; font-size: 11px; color: #8090a9; }
.input-suffix { display: flex; position: relative; }
.input-suffix input { padding-right: 52px; }
.input-suffix > span { position: absolute; right: 14px; top: 11px; font-size: 12px; color: #7d8da7; font-weight: 400; pointer-events: none; }
.full-field { grid-column: 1 / -1; }
.message { display: flex; align-items: flex-start; gap: 11px; font-size: 12px; border-radius: 10px; border-left-width: 3px; padding: 13px 15px; }
.message > .ui-icon { margin-top: 2px; }
.message > div { min-width: 0; flex: 1; }
.message strong { display: block; font-size: 13px; margin-bottom: 2px; }
.message p { line-height: 1.8; font-size: 12px; }
.message > .button { flex-shrink: 0; margin-top: 0; }
.info-card { display: flex; align-items: flex-start; gap: 11px; background: #f1f6ff; border: 1px solid #dce8fc; border-radius: 9px; padding: 14px 16px; margin-bottom: 20px; color: #486eab; }
.info-card > .ui-icon { margin-top: 2px; }
.info-card > div { min-width: 0; }
.info-card strong { display: block; font-size: 12px; font-weight: 600; margin-bottom: 3px; }
.info-card p { font-size: 12px; line-height: 1.9; overflow-wrap: anywhere; }
.info-card.warning { border-color: #f0dfbf; color: #916929; background: #fffaf0; }
.info-card.error { border-color: #efd2d6; color: #a3434b; background: #fff5f5; }
.info-card.success { border-color: #d5e8de; color: #31765a; background: #f0f8f4; }
.stat { display: flex; align-items: center; gap: 17px; padding: 21px 23px; }
.stat .stat-symbol { display: grid; place-items: center; width: 45px; height: 45px; border-radius: 12px; background: #edf3ff; color: #467ee1; flex-shrink: 0; }
.stat-symbol .ui-icon { width: 22px; height: 22px; }
.stat-label { font-size: 12px; color: #6e7f99; }
.stat strong { display: block; margin: 2px 0; font-size: 29px; color: #263e62; }
.stat .stat-note { display: block; font-size: 11px; color: #8291a8; }
.query-panel { padding: 20px 22px 16px; border: 1px solid var(--line); background: #fff; border-radius: 12px; margin-bottom: 22px; }
.toolbar { align-items: flex-end; gap: 12px; margin: 0; }
.toolbar > .search-label { display: flex; flex-direction: column; align-items: stretch; position: static; max-width: none; flex: 1; min-width: 180px; gap: 8px; }
.field-label-text, .filter-label > span { font-size: 12px; color: #60718c; }
.search-control { position: relative; display: flex; }
.search-control > .ui-icon { position: absolute; left: 13px; top: 13px; width: 17px; height: 17px; color: #899bb6; }
.search-label input { padding-left: 39px; font-size: 13px; }
.toolbar > .filter-label { width: 150px; flex-shrink: 0; }
.toolbar select { font-size: 13px; padding-block: 10px; }
.toolbar > .button { min-height: 44px; }
.query-panel .scope-note { display: flex; gap: 7px; align-items: center; font-size: 11px; color: #7687a1; margin: 12px 0 0; }
.query-panel .scope-note .ui-icon { width: 14px; height: 14px; }
.table-caption { padding: 19px 22px; }
.table-caption > div { display: flex; align-items: center; gap: 11px; }
.table-caption h2 { font-size: 15px; font-weight: 650; }
.table-caption strong { font-size: 11px; color: #6482b1; background: #f0f5ff; padding: 3px 9px; border-radius: 5px; white-space: nowrap; }
.table-caption > span { display: flex; align-items: center; gap: 5px; color: #7688a3; font-size: 11px; }
.table-caption > span .ui-icon { width: 14px; height: 14px; }
#table-region table { min-width: 850px; }
th { padding: 13px 18px; font-size: 12px; font-weight: 500; color: #697d9c; background: #f6f9fe; }
td { font-size: 13px; padding: 20px 18px; color: #4b607f; }
td strong { font-size: 13px; font-weight: 600; color: #324b70; }
.serial { font-size: 12px; overflow-wrap: anywhere; }
.id { font-size: 11px; color: #7e91b1; max-width: 170px; }
.date-cell { font-size: 12px; color: #5d7293; white-space: nowrap; }
.cell-note { display: block; font-size: 11px; color: #7d8fab; margin-top: 4px; line-height: 1.8; max-width: 245px; }
.role-chip, .platform-chip, .type-chip, .revision-chip { display: inline-flex; align-items: center; gap: 5px; font-size: 11px; padding: 3px 8px; border-radius: 5px; background: #f0f4fb; color: #687f9f; }
.platform-chip { margin: 6px 0 1px; }
.type-chip { background: #eff4ff; color: #527bc2; margin-bottom: 4px; }
.type-chip .ui-icon { width: 13px; height: 13px; }
.row-plan { margin-top: 8px; }
.row-plan > span { display: inline-block; font-size: 10px; background: #eef3fa; color: #6f87ad; border-radius: 4px; padding: 1px 6px; }
.row-plan small { display: block; margin-top: 4px; font-size: 11px; color: #7a8fac; max-width: 235px; }
.device-count { display: flex; align-items: center; gap: 6px; color: #7c91b3; }
.device-count .ui-icon { width: 15px; height: 15px; }
.row-actions { display: flex; align-items: flex-start; gap: 7px; flex-wrap: wrap; min-width: 100px; }
.badge { font-size: 11px; padding: 4px 9px; border-radius: 6px; }
.badge.active, .badge.available { color: #28755b; background: #eaf7f0; }
.badge.suspended, .badge.expired { color: #966b22; background: #fff5e3; }
.badge.revoked, .badge.disabled { color: #ae4d59; background: #fceef1; }
.badge.redeemed { color: #3e6db5; background: #edf3ff; }
.badge.reset { color: #718199; background: #eff2f7; }
.table-footer { color: #7486a2; font-size: 11px; padding: 16px 21px; background: #fcfdff; }
.empty-state { padding: 52px 22px; }
.empty-state > .ui-icon { width: 37px; height: 37px; padding: 9px; box-sizing: content-box; color: #8aa9de; background: #f0f5ff; border-radius: 14px; margin-bottom: 15px; }
.empty-state h3 { font-size: 15px; color: #526c93; }
.empty-state p { font-size: 12px; color: #7d8fac; margin-top: 8px; }
.empty-state .button { margin-top: 18px; }
.code-metadata summary { font-size: 11px; color: #567ab2; }
.code-metadata dl { background: #f6f9ff; padding: 12px; border: 1px solid #e4ebf7; border-radius: 8px; min-width: 220px; max-width: 270px; }
.code-metadata dt { color: #7a8dab; font-size: 11px; }
.code-metadata dd { color: #4f6b93; font-size: 11px; }
.event-sequence { display: inline-block; padding: 2px 8px; background: #f0f4fb; color: #6f88ae; border-radius: 5px; margin-bottom: 7px; font-size: 11px; }
.event-action { display: flex; align-items: center; gap: 7px; }
.event-action .ui-icon { color: #7a9bce; width: 16px; height: 16px; }
.audit-identity { display: flex; align-items: center; gap: 8px; margin-top: 3px; }
.audit-identity > span:first-child { font-size: 10px; color: #8b9cb5; width: 32px; }
.audit-reason { font-size: 12px; color: #5b7194; max-width: 225px; margin-bottom: 9px; line-height: 1.8; overflow-wrap: anywhere; }
.customer-panel > .license-content { padding: 24px; }
.customer-panel .facts { gap: 20px 24px; }
.customer-name h2 { font-size: 22px; }
.customer-identity p { color: #788dab; font-size: 11px; }
.customer-identity p .mono { color: #6f89b1; }
.customer-registered { color: #8293ad; }
.customer-metrics > div > span { font-size: 12px; color: #7589a8; }
.customer-metrics small, .customer-metrics > p { color: #8294b0; }
.tabs button { font-size: 13px; color: #6c81a2; }
.tabs button > span { font-size: 11px; }
.panel-heading h2 { font-size: 16px; }
.panel-heading p { font-size: 11px; color: #7c90ae; }
.license-picker select { font-size: 11px; min-height: 36px; }
.detail-top { margin-bottom: 20px; }
.detail-top .button { margin-left: auto; }
.license-overview { display: grid; grid-template-columns: 1.4fr 1fr; gap: 20px; padding: 18px 20px; border: 1px solid #e4ecf8; background: #f7faff; border-radius: 10px; margin-bottom: 23px; }
.license-overview span { display: block; color: #7890b3; font-size: 11px; }
.license-overview strong { display: block; color: #35598c; font-size: 17px; line-height: 1.6; margin-top: 4px; overflow-wrap: anywhere; }
.facts { gap: 20px 24px; margin: 20px 0 25px; }
.facts dt { color: #7b8eaa; font-size: 11px; }
.facts dd { font-size: 13px; color: #4b6388; line-height: 1.8; }
.facts dd.mono { font-size: 11px; }
.facts dd small { color: #7f96b8; font-size: 11px; }
.subsection-heading { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin: 25px 0 12px; }
.subsection-heading h3 { font-size: 13px; }
.subsection-heading > span { font-size: 11px; color: #8496b2; }
.grant-features { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-bottom: 24px; }
.grant-feature { display: flex; justify-content: space-between; align-items: center; gap: 12px; background: #f7f9fc; border: 1px solid #e8edf5; padding: 11px 13px; border-radius: 8px; }
.grant-feature > span { display: flex; gap: 7px; align-items: center; color: #8796ad; font-size: 12px; }
.grant-feature .ui-icon { width: 14px; height: 14px; }
.grant-feature small { font-size: 10px; color: #8d9bb1; white-space: nowrap; }
.grant-feature.enabled { background: #f0f6ff; border-color: #dfeafa; }
.grant-feature.enabled > span { color: #4a74b6; }
.grant-feature.enabled small { color: #7194c6; }
.license-actions { padding: 20px 0; gap: 9px; }
.license-actions .button { font-size: 12px; min-height: 36px; padding: 8px 11px; }
.license-content > .info-card { margin: 22px 0 0; }
.section-title { margin: 27px 0 15px; }
.section-title h3 { display: flex; align-items: center; gap: 7px; font-size: 14px; }
.section-title h3 .ui-icon { color: #7196cf; width: 18px; height: 18px; }
.section-title p { font-size: 11px; color: #7a8fac; margin-top: 5px; }
.device-table { min-width: 635px; border-radius: 8px; }
.device-table td { padding: 16px 12px; font-size: 12px; }
.device-table th { font-size: 11px; padding: 12px; }
.device-name { display: flex; align-items: center; gap: 7px; }
.device-name .ui-icon { width: 16px; height: 16px; color: #8ca8d2; }
.customer-panel .device-table td { font-size: 12px; }
.rail-card h3 { font-size: 14px; }
.rail-facts { font-size: 12px; }
.rail-facts dt, .rail-note { color: #7e91ad; }
.timeline-heading strong { font-size: 12px; }
.timeline li p { font-size: 11px; color: #7a8fae; }
.timeline time { font-size: 10px; color: #8c9eba; }
.rail-link { font-size: 12px; }
.customer-scope { font-size: 11px; color: #798fac; }
/* Dialog headers and footers remain available while long forms scroll. */
dialog { width: min(650px, calc(100vw - 32px)); border-radius: 15px; max-height: calc(100dvh - 48px); }
dialog.wide { width: min(1000px, calc(100vw - 32px)); }
dialog.issue-dialog { width: min(720px, calc(100vw - 32px)); }
#dialog-content { display: flex; flex-direction: column; max-height: calc(100dvh - 48px); min-height: 0; }
#dialog-content > form { display: flex; flex-direction: column; flex: 1; min-height: 0; overflow: hidden; }
.dialog-header { align-items: flex-start; gap: 13px; flex-shrink: 0; padding: 23px 25px 21px; }
.dialog-symbol { display: grid; place-items: center; width: 40px; height: 40px; background: #edf3ff; color: #4e80d8; border-radius: 11px; flex-shrink: 0; }
.dialog-symbol .ui-icon { width: 21px; height: 21px; }
.dialog-symbol.warning { color: #b2843f; background: #fff5e6; }
.dialog-heading { min-width: 0; flex: 1; }
.dialog-header h2 { font-size: 19px; }
.dialog-header p { font-size: 12px; margin-top: 5px; color: #788ca8; }
.dialog-body { flex: 1; min-height: 0; overflow: auto; overscroll-behavior: contain; padding: 25px; }
.dialog-body > label { margin-top: 20px; }
.dialog-body > label:first-child { margin-top: 0; }
.dialog-body > .info-card { margin-bottom: 20px; }
.dialog-footer { flex-shrink: 0; padding: 18px 25px; gap: 10px; background: #fafcff; }
.dialog-footer .button { min-height: 42px; }
.loading-state { text-align: center; padding: 55px 25px; color: #7c91b2; }
.loading-state > .ui-icon { display: block; margin: 0 auto 15px; width: 29px; height: 29px; color: #759bdb; }
.loading-state strong { font-size: 14px; }
.loading-state p { margin-top: 8px; font-size: 12px; }
.form-section { margin-bottom: 25px; }
.form-section:last-child { margin-bottom: 0; }
.form-section-heading { display: flex; align-items: flex-start; gap: 10px; margin-bottom: 17px; }
.form-section-heading > span { color: #7396cc; background: #eef4ff; border: 1px solid #e1eaf9; padding: 2px 5px; font-size: 10px; border-radius: 5px; margin-top: 3px; }
.form-section-heading h3 { font-size: 14px; font-weight: 600; }
.form-section-heading p { font-size: 11px; color: #8295b0; margin-top: 4px; }
.form-grid { gap: 18px 16px; }
.policy-fieldset { padding: 18px; margin-top: 24px; border-color: #e0e8f4; border-radius: 10px; }
.policy-fieldset legend { color: #7288aa; font-size: 11px; padding: 0 8px; }
.policy-fieldset .form-section-heading { margin-bottom: 16px; }
.policy-fieldset > .info-card { margin-top: 17px; margin-bottom: 0; }
.feature-options { gap: 11px; }
.feature-choice { display: flex; align-items: center; flex-direction: row; gap: 10px; border: 1px solid #dfe6f2; border-radius: 9px; padding: 13px; cursor: pointer; background: #fff; position: relative; }
.feature-choice:has(input:checked) { background: #f0f6ff; border-color: #98b9ee; }
.feature-choice:focus-within { outline: 3px solid #b8cff733; }
.feature-choice input { width: 16px; height: 16px; min-height: 0; accent-color: #2563eb; margin: 0; box-shadow: none; padding: 0; flex-shrink: 0; }
.feature-choice-icon { display: none; }
.feature-choice strong { font-size: 12px; font-weight: 550; color: #4e668a; }
.feature-choice small { display: block; font-size: 10px; color: #8a9bb6; font-weight: 400; margin-top: 3px; }
.feature-options + .field-hint { margin-top: 13px; }
.check-line input { min-height: 0; width: 16px; height: 16px; }
.policy-check { padding: 13px; border: 1px solid #e0e8f4; background: #f7faff; border-radius: 8px; color: #637c9f; font-size: 12px; }
.form-review { display: flex; align-items: flex-start; gap: 11px; padding: 15px; border: 1px solid #dce8fc; border-radius: 9px; background: #f2f7ff; margin-top: 22px; color: #6286be; }
.form-review .ui-icon { margin-top: 3px; }
.form-review strong { display: block; font-size: 11px; color: #6381af; }
.form-review p { font-size: 12px; color: #466997; margin-top: 4px; }
.target-card { background: #f6f9ff; border: 1px solid #e1e9f6; border-radius: 9px; padding: 16px; margin-bottom: 20px; overflow-wrap: anywhere; }
.target-card > span { font-size: 11px; color: #7d93b2; display: block; }
.target-card > strong { display: block; font-size: 13px; color: #4b6d9d; margin-top: 6px; }
.target-card > p { font-size: 12px; color: #758eaf; margin-top: 6px; }
.target-card > small { display: block; color: #879dbb; font-size: 10px; margin-top: 8px; }
#renew-target-summary > .target-card { margin: 15px 0 0; }
#renew-target-summary > .field-hint { margin-top: 12px; }
.renewal-context { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px; font-size: 12px; padding: 13px 0 17px; color: #8094af; }
.renewal-context strong { font-weight: 500; color: #537098; }
.lease-note { margin: 0 0 20px; }
.destructive-confirm input { border-color: #e6c7ce; background: #fffbfc; }
.issued-success { display: flex; gap: 12px; align-items: center; margin-bottom: 22px; }
.issued-success > .ui-icon { width: 40px; height: 40px; padding: 9px; color: #3e9270; background: #edf8f1; border-radius: 12px; }
.issued-success h3 { font-size: 15px; color: #3f7e64; }
.issued-success p { font-size: 11px; color: #7d9a8c; margin-top: 3px; }
.secret-panel { border: 1px solid #d6e4fb; border-radius: 10px; padding: 18px; background: #f7faff; }
.secret-code { font-size: 14px; min-height: 50px; background: #fff !important; border-color: #cdddf5; }
.secret-panel > .button { width: 100%; margin-top: 13px; }
.secret-panel > .field-hint { margin-top: 12px; }
.copy-feedback { font-size: 12px; color: #3f8263; margin-top: 10px; }
.copy-feedback:empty { display: none; }
.receipt-facts { padding: 18px; border: 1px solid #e5ebf5; border-radius: 9px; background: #fcfdff; }
.audit-result { display: flex; align-items: center; justify-content: space-between; gap: 10px; font-size: 11px; color: #8397b2; }
.audit-change-card { border: 1px solid #e2eaf6; border-radius: 10px; padding: 18px; }
.audit-change-card h3 { font-size: 13px; margin-bottom: 14px; }
.audit-change-card dl { margin: 0; }
.audit-change-card dl > div { display: grid; grid-template-columns: 115px minmax(0, 1fr); gap: 12px; padding: 10px 0; border-top: 1px solid #edf1f8; }
.audit-change-card dt { font-size: 11px; color: #8094b0; }
.audit-change-card dd { font-size: 12px; color: #4e6b93; margin: 0; overflow-wrap: anywhere; }
.raw-event { margin-top: 19px; border: 1px solid #e2eaf6; padding: 12px 15px; border-radius: 8px; background: #f8faff; }
.raw-event summary { font-size: 11px; color: #6587b8; }
.raw-event pre { max-width: none; margin-bottom: 0; font-size: 11px; color: #5c7396; }
@media (max-width: 1200px) {
  .stat { gap: 12px; padding: 18px; }
  .stat .stat-symbol { width: 37px; height: 39px; border-radius: 10px; }
  .stat strong { font-size: 26px; }
  .toolbar { flex-wrap: wrap; }
  .toolbar > .search-label { flex-basis: 45%; }
}
@media (max-width: 760px) {
  .stat { padding: 15px 12px; gap: 8px; align-items: flex-start; }
  .stat .stat-symbol { width: 29px; height: 29px; border-radius: 8px; }
  .stat-symbol .ui-icon { width: 16px; height: 16px; }
  .stat-label { font-size: 10px; }
  .stat strong { font-size: 23px; margin: 4px 0; }
  .stat .stat-note { font-size: 9px; }
  .query-panel { padding: 17px 15px; margin-bottom: 18px; }
  .toolbar { gap: 13px 9px; }
  .toolbar > .search-label { flex-basis: 100%; width: 100%; max-width: none; }
  .toolbar > .filter-label { width: auto; flex: 1; min-width: 120px; }
  .toolbar > .button { font-size: 12px; padding: 9px 12px; }
  .query-panel .scope-note { align-items: flex-start; font-size: 10px; margin-top: 13px; }
  .query-panel .scope-note .ui-icon { margin-top: 3px; }
  .table-caption { padding: 16px; }
  .table-caption > div { gap: 10px; }
  .table-caption h2 { font-size: 14px; }
  .table-caption > span { font-size: 10px; }
  .customer-panel > .license-content { padding: 18px; }
  .customer-identity p { font-size: 10px; }
  .customer-name h2 { font-size: 19px; }
  .customer-metrics > div > span { font-size: 10px; }
  .tabs { gap: 20px; }
  .tabs button { font-size: 12px; }
  .license-overview { grid-template-columns: 1fr; gap: 15px; padding: 16px; }
  .license-overview strong { font-size: 16px; }
  .facts dd { font-size: 12px; }
  .grant-features { gap: 8px; }
  .grant-feature { flex-direction: column; align-items: flex-start; gap: 4px; padding: 10px; }
  .grant-feature > span { font-size: 11px; }
  .license-actions { gap: 8px; }
  .license-actions .button { font-size: 11px; padding: 8px 10px; }
  .section-title { align-items: flex-start; }
  .section-title > .button { font-size: 11px; }
  .info-card { padding: 13px; gap: 8px; }
  .info-card strong { font-size: 12px; }
  .info-card p { font-size: 11px; }
  .message { flex-wrap: wrap; padding: 12px; gap: 9px; }
  .message > div { flex-basis: calc(100% - 30px); }
  .message > .button { margin-left: 27px; }
  dialog, dialog.wide, dialog.issue-dialog { width: calc(100vw - 20px); max-height: calc(100dvh - 24px); }
  #dialog-content { max-height: calc(100dvh - 24px); }
  .dialog-header { padding: 19px 17px 17px; gap: 10px; }
  .dialog-symbol { width: 33px; height: 35px; border-radius: 9px; }
  .dialog-symbol .ui-icon { width: 18px; height: 18px; }
  .dialog-header h2 { font-size: 17px; }
  .dialog-header p { font-size: 11px; }
  .dialog-body { padding: 19px 17px; }
  .dialog-footer { padding: 15px 17px; gap: 8px; }
  .dialog-footer .button { font-size: 12px; padding: 9px 11px; white-space: normal; }
  .form-grid { gap: 16px 11px; }
  .policy-fieldset { padding: 14px 12px; }
  .feature-choice { padding: 11px 9px; gap: 7px; }
  .feature-choice small { font-size: 9px; }
  .field-hint { font-size: 10px; }
  .field-hint-row { gap: 7px; }
  .field-counter { font-size: 10px; }
  .form-section-heading p { font-size: 10px; }
  .receipt-facts { padding: 15px; }
  .secret-panel { padding: 14px; }
  .secret-code { font-size: 12px; }
  .audit-change-card { padding: 15px; }
  .audit-change-card dl > div { grid-template-columns: 90px minmax(0, 1fr); }
  .audit-result { flex-wrap: wrap; }
}
@media (max-width: 380px) {
  .tabs { gap: 13px; }
  .tabs button { font-size: 11px; }
  .form-grid { grid-template-columns: 1fr; }
  .feature-options { grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce) { .spinning { animation: none; } }
.dialog-footer-note { color: #8295b0; font-size: 11px; margin-right: auto; align-self: center; }
@media (max-width: 760px) { .dialog-footer-note { font-size: 10px; max-width: 160px; } }
@media (max-width: 760px) {
  .list-table-hint { padding: 0 17px; margin: 14px 0 !important; font-size: 10px; color: #7e91af; }
}
.dialog-symbol.danger { background: #fff0f2; color: #c04e60; }

/* Customer list: a clearer reading hierarchy for the dense account table. */
.sidebar .wordmark { align-items: center; }
.sidebar-brand-copy { display: grid; gap: 4px; min-width: 0; line-height: 1.25; letter-spacing: 0; }
.sidebar-brand-copy strong { color: #1c3152; font-size: 15px; font-weight: 700; white-space: nowrap; }
.sidebar .brand-mark { border-radius: 7px; }
#workspace[data-view="users"]:not(.showing-customer) .page-heading .eyebrow { display: none; }
#workspace[data-view="users"]:not(.showing-customer) .page-heading h1 { font-size: 28px; font-weight: 700; letter-spacing: 0; }
#workspace[data-view="users"]:not(.showing-customer) .page-heading .muted { font-size: 14px; color: #65758c; }
#workspace[data-view="users"]:not(.showing-customer) .stat-label { font-size: 13px; color: #5c6e88; }
#workspace[data-view="users"]:not(.showing-customer) .stat strong { color: #1e365a; font-weight: 700; font-variant-numeric: tabular-nums; }
#workspace[data-view="users"]:not(.showing-customer) .stat .stat-note { font-size: 12px; color: #73839a; }
#workspace[data-view="users"]:not(.showing-customer) .field-label-text,
#workspace[data-view="users"]:not(.showing-customer) .filter-label > span { color: #435673; font-size: 13px; }
#workspace[data-view="users"]:not(.showing-customer) .query-panel .scope-note { color: #61738e; font-size: 12px; }
#workspace[data-view="users"]:not(.showing-customer) .table-caption h2 { font-size: 16px; }
#workspace[data-view="users"]:not(.showing-customer) .table-caption > span,
#workspace[data-view="users"]:not(.showing-customer) .table-footer { color: #64758e; font-size: 12px; }
#workspace[data-view="users"]:not(.showing-customer) #table-region table { min-width: 1120px; }
#workspace[data-view="users"]:not(.showing-customer) th { color: #536782; font-size: 12px; font-weight: 600; }
#workspace[data-view="users"]:not(.showing-customer) td { color: #344b69; font-size: 13px; line-height: 1.55; }
#workspace[data-view="users"]:not(.showing-customer) td strong { color: #233c5e; font-size: 14px; }
#workspace[data-view="users"]:not(.showing-customer) .cell-note,
#workspace[data-view="users"]:not(.showing-customer) .id { color: #687b96; font-size: 11px; }
.duration-line { display: flex; gap: 8px; white-space: nowrap; font-variant-numeric: tabular-nums; }
.duration-line > span { color: #72839a; }
.duration-note { display: block; margin-top: 4px; color: #687b96; font-size: 11px; white-space: nowrap; }
@media (max-width: 760px) {
  .sidebar-brand-copy strong { font-size: 14px; }
  #workspace[data-view="users"]:not(.showing-customer) .page-heading h1 { font-size: 25px; }
  #workspace[data-view="users"]:not(.showing-customer) .page-heading .muted { font-size: 13px; }
  #workspace[data-view="users"]:not(.showing-customer) .stat-label { font-size: 12px; }
  #workspace[data-view="users"]:not(.showing-customer) .stat .stat-note { display: none; }
}

/* Customer workspace: keep attention on the account and its records. */
#workspace[data-view="users"] .page-heading .eyebrow,
#workspace[data-view="users"] .page-heading .muted,
.showing-customer .customer-scope,
.showing-customer .rail-note,
.showing-customer .customer-metrics > p { display: none; }
#workspace[data-view="users"] .page-heading { margin-bottom: 22px; }
.showing-customer .back-link { display: inline-flex; margin: 0 0 16px; font-size: 13px; font-weight: 550; color: #486a9f; }
.showing-customer .customer-hero { padding: 24px 28px; }
.showing-customer .customer-name h2 { font-size: 21px; color: #1d3556; }
.showing-customer .customer-identity p { font-size: 12px; color: #697c96; }
.showing-customer .customer-registered { font-size: 12px; color: #6b7d95; }
.showing-customer .customer-registered strong { color: #344b69; font-size: 13px; }
.showing-customer .customer-metrics { grid-template-columns: repeat(3, minmax(0, 1fr)); padding: 20px 28px; }
.showing-customer .customer-metrics > div:last-of-type { border-right: 0; }
.showing-customer .customer-metrics > div > span { color: #61748d; font-size: 13px; }
.showing-customer .customer-metrics strong { color: #233e63; font-size: 25px; }
.showing-customer .customer-metrics small { color: #71849d; font-size: 12px; }
.showing-customer .tabs { gap: 28px; margin-bottom: 18px; overflow-x: auto; }
.showing-customer .tabs { overflow-y: hidden; scrollbar-width: thin; }
.showing-customer .tabs button { font-size: 14px; color: #657894; padding-bottom: 14px; }
.showing-customer .tabs button[aria-selected="true"] { color: #2563eb; }
.showing-customer .panel-heading { padding: 21px 24px; }
.showing-customer .panel-heading h2 { font-size: 16px; }
.showing-customer .panel-heading p { font-size: 12px; color: #697c96; }
.showing-customer .customer-panel > .empty-state { margin: 22px 24px; }
.showing-customer .empty-state.compact { padding: 36px 20px; }
.showing-customer .empty-state h3 { color: #4d6485; font-size: 14px; }
.showing-customer .empty-state p { color: #71839b; font-size: 12px; }
.showing-customer .table-footer { color: #687a93; font-size: 12px; }
.showing-customer .customer-rail { padding-top: 49px; }
.showing-customer .rail-card h3 { color: #263f61; font-size: 15px; }
.showing-customer .rail-facts { margin-top: 16px; font-size: 13px; }
.showing-customer .rail-facts dt { color: #71829b; }
.showing-customer .rail-facts dd { color: #3f5675; }
.showing-customer .rail-empty { color: #71839b; font-size: 12px; }
#workspace[data-view="users"]:not(.showing-customer) .stat .stat-note { display: none; }
.showing-customer .customer-panel > .table-scroll table { min-width: 850px; }
.showing-customer .timeline-heading strong, .showing-customer .timeline li p,
.showing-customer .timeline time { font-size: 12px; }
.showing-customer .timeline li p { color: #61748f; }
@media (max-width: 1400px) { .showing-customer .list-table-hint { display: block; padding: 0 24px; margin: 14px 0; color: #617590; font-size: 12px; } }
.presence-summary { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0; padding: 20px 24px; background: #f8faff; border-bottom: 1px solid var(--line); }
.presence-summary > div { min-width: 0; padding: 0 18px; border-left: 1px solid #e3eaf4; }
.presence-summary > div:first-child { padding-left: 0; border-left: 0; }
.presence-summary span, .presence-summary small { display: block; color: #697d97; font-size: 12px; }
.presence-summary strong { display: block; margin: 5px 0; color: #263f61; font-size: 16px; font-weight: 650; font-variant-numeric: tabular-nums; }
.presence-explanation { padding: 14px 24px; border-bottom: 1px solid var(--line); }
.presence-explanation summary { color: #58739b; font-size: 12px; }
.presence-explanation p { margin-top: 9px; max-width: 800px; color: #62758d; font-size: 12px; line-height: 1.7; }
.presence-section { padding-top: 23px; }
.presence-section h3 { margin: 0 24px 13px; color: #2b4262; font-size: 15px; }
.presence-section h3 span { color: #75869d; font-size: 12px; font-weight: 400; }
.presence-section table { min-width: 670px; }
.presence-section td { font-size: 12px; overflow-wrap: anywhere; }
.presence-section td:first-child { max-width: 300px; }
.presence-empty { padding: 8px 24px 24px; color: #71839b; font-size: 13px; }
@media (max-width: 1000px) { .showing-customer .customer-rail { padding-top: 0; } }
@media (max-width: 760px) {
  .showing-customer .customer-hero { padding: 20px 18px; }
  .showing-customer .customer-metrics { gap: 10px; padding: 18px; }
  .showing-customer .customer-metrics > div > span { font-size: 12px; }
  .showing-customer .customer-metrics strong { font-size: 21px; }
  .showing-customer .tabs { gap: 20px; }
  .showing-customer .tabs button { font-size: 13px; }
  .presence-summary { grid-template-columns: 1fr; gap: 13px; padding: 18px; }
  .presence-summary > div { padding: 0; border: 0; }
  .presence-summary strong { margin: 2px 0; }
  .presence-explanation { padding-inline: 18px; }
  .presence-section h3 { margin-inline: 18px; }
}

/* Consistent typography for management lists and authorization dialogs. */
.workspace .page-heading .eyebrow, .workspace .page-heading .muted { display: none; }
.workspace .page-heading h1 { color: #1d3352; font-size: 28px; font-weight: 700; letter-spacing: 0; }
.workspace .page-heading { margin-bottom: 24px; }
.stats-scope { margin: 0 0 9px; color: #657792; font-size: 12px; }
.workspace .stat-label { color: #5a6e89; font-size: 13px; }
.workspace .stat strong { color: #223c60; font-size: 29px; font-weight: 700; font-variant-numeric: tabular-nums; }
.workspace .field-label-text, .workspace .filter-label > span { color: #435875; font-size: 13px; }
.workspace .table-caption h2 { color: #243c5d; font-size: 16px; }
.workspace #table-region th { color: #536781; font-size: 12px; font-weight: 600; }
.workspace #table-region td { color: #354d6b; font-size: 13px; }
.workspace #table-region td strong { color: #263e5e; font-size: 13px; }
.workspace #table-region .id, .workspace #table-region .cell-note,
.workspace #table-region .row-plan small { color: #687b96; font-size: 12px; }
.workspace #table-region .row-plan > span { color: #516d96; font-size: 12px; }
.workspace #table-region .date-cell { color: #455e7e; font-size: 13px; }
.workspace .table-footer { color: #64768f; font-size: 12px; }

dialog .dialog-header h2 { color: #1e3555; font-size: 20px; line-height: 1.4; }
dialog { overflow: hidden; }
#dialog-content { max-height: calc(100dvh - 50px); }
dialog .dialog-header p { color: #637791; font-size: 13px; line-height: 1.6; }
dialog .dialog-body label { color: #354d6c; font-size: 14px; font-weight: 600; }
dialog .dialog-body input, dialog .dialog-body select { min-height: 44px; color: #2e4667; font-size: 14px; }
dialog .dialog-body input::placeholder { color: #8798ad; font-size: 13px; }
dialog .dialog-body .field-hint, dialog .field-counter { color: #687c96; font-size: 12px; line-height: 1.6; }
dialog .form-section-heading > span, dialog .form-section-heading p { display: none; }
dialog .form-section-heading h3 { color: #253e60; font-size: 15px; font-weight: 650; }
dialog .policy-fieldset legend { color: #5b7190; font-size: 13px; }
dialog .feature-choice strong { color: #405a7b; font-size: 13px; }
dialog .policy-check { color: #4b6587; font-size: 13px; font-weight: 400; }
dialog .dialog-body label.policy-check { font-weight: 400; }
dialog .policy-check input, dialog .feature-choice input { min-height: 0; }
dialog .form-review strong { color: #516e98; font-size: 12px; }
dialog .form-review p { color: #345780; font-size: 13px; }
dialog .target-card > span, dialog .target-card > p, dialog .target-card > small { color: #627a9a; font-size: 12px; }
dialog .target-card > strong { color: #2c4b75; font-size: 14px; }
dialog .info-card strong { font-size: 13px; }
dialog .info-card p { font-size: 13px; line-height: 1.65; }
dialog .license-overview span, dialog .facts dt { color: #667d99; font-size: 13px; }
dialog .license-overview strong { color: #29496f; font-size: 17px; }
dialog .facts dd, dialog .facts dd.mono, dialog .facts dd small { color: #425d7e; font-size: 13px; }
dialog .subsection-heading h3, dialog .section-title h3 { color: #263e5e; font-size: 15px; }
dialog .subsection-heading > span { display: none; }
dialog .grant-feature > span, dialog .grant-feature small { font-size: 13px; }
dialog .license-actions .button, dialog .device-table td, dialog .device-table th { font-size: 13px; }
dialog .device-table .cell-note, dialog .device-table .id, dialog .section-title p { color: #687b96; font-size: 12px; }
@media (max-width: 760px) {
  #dialog-content { max-height: calc(100dvh - 26px); }
  .workspace .page-heading h1 { font-size: 25px; }
  .workspace .stat-label { font-size: 12px; }
  .workspace .stat strong { font-size: 23px; }
  dialog .dialog-header h2 { font-size: 18px; }
  dialog .dialog-body label { font-size: 13px; }
  dialog .dialog-body input, dialog .dialog-body select { font-size: 14px; }
  dialog .info-card p { font-size: 12px; }
  dialog .facts dd, dialog .facts dd.mono { font-size: 12px; }
}

/* Activation-code records stay aligned while details are viewed separately. */
.code-row td { vertical-align: middle; }
.code-row .type-chip { padding: 5px 9px; margin-bottom: 6px; font-size: 12px; }
.code-row .code-record-button { display: inline-flex; align-items: center; gap: 5px; margin-top: 6px; font-size: 12px; font-weight: 550; }
.code-record-button .ui-icon { width: 14px; height: 14px; }
.code-record-status { margin-bottom: 18px; }
.code-record-facts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px 24px; margin: 0; padding: 20px; background: #f7faff; border: 1px solid #e2eaf6; border-radius: 10px; }
.code-record-facts > div { min-width: 0; }
.code-record-facts .full-field { grid-column: 1 / -1; }
.code-record-facts dt { color: #687d98; font-size: 12px; }
.code-record-facts dd { margin: 5px 0 0; color: #304c70; font-size: 14px; line-height: 1.5; overflow-wrap: anywhere; }
.code-record-facts dd.mono { font-size: 12px; }
@media (max-width: 760px) {
  .code-record-facts { gap: 16px; padding: 16px; }
  .code-record-facts dd { font-size: 13px; }
}

/* Audit rows emphasize the event and keep technical identifiers available. */
.audit-row td { vertical-align: middle; padding-block: 17px; }
.audit-row .audit-time { display: block; color: #314c6d; font-size: 13px; font-variant-numeric: tabular-nums; }
.audit-sequence { margin-top: 5px; color: #7587a0; font-size: 12px; }
.audit-row .event-action { gap: 9px; }
.audit-row .event-action strong { color: #263f61; font-size: 14px; }
.audit-row .event-action .ui-icon { color: #7d9bcb; }
.audit-row .audit-identity { gap: 10px; margin-top: 5px; line-height: 1.5; }
.audit-row .audit-identity:first-child { margin-top: 0; }
.audit-row .audit-identity > span:first-child { flex: 0 0 42px; width: auto; color: #71839b; font-size: 12px; }
.audit-row .audit-actor { display: inline-block; max-width: 205px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: #354f71; font-size: 13px; }
.audit-row .audit-identity .id { max-width: 205px; color: #627793; font-size: 12px; }
.audit-row .audit-reason { font-size: 12px; line-height: 1.5; }
.audit-row .row-action { white-space: nowrap; }
.audit-result { color: #627793; font-size: 13px; }
.audit-change-card h3 { color: #294363; font-size: 15px; }
.audit-change-card dt { color: #687d98; font-size: 13px; }
.audit-change-card dd { color: #354f71; font-size: 13px; }
.raw-event summary { color: #466b9f; font-size: 13px; }
.raw-event pre { color: #4d6481; font-size: 12px; }

/* Audit detail: readable facts first, optional event data below. */
.audit-detail-body { display: flex; flex-direction: column; gap: 20px; }
.audit-detail-body .audit-result { margin: 0; font-size: 13px; }
.audit-detail-body .audit-result > span:last-child { color: #647791; font-variant-numeric: tabular-nums; }
.audit-detail-facts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px 28px; margin: 0; padding: 20px; background: #f7faff; border: 1px solid #e2eaf5; border-radius: 10px; }
.audit-detail-facts > div { min-width: 0; }
.audit-detail-facts .full-field { grid-column: 1 / -1; }
.audit-detail-facts dt { color: #687c96; font-size: 13px; }
.audit-detail-facts dd { margin: 6px 0 0; color: #304a6a; font-size: 14px; line-height: 1.55; overflow-wrap: anywhere; }
.audit-detail-facts dd.mono, .audit-detail-facts dd small { font-size: 12px; }
.audit-detail-facts dd small { display: block; margin-top: 4px; color: #6b7f98; overflow-wrap: anywhere; }
.audit-detail-body .audit-change-card { padding: 20px; }
.audit-detail-body .audit-change-card h3 { margin-bottom: 8px; }
.audit-detail-body .audit-change-card dl > div { grid-template-columns: minmax(105px, 145px) minmax(0, 1fr); gap: 16px; padding: 12px 0; line-height: 1.6; }
.audit-detail-body .audit-change-card dt, .audit-detail-body .audit-change-card dd { font-size: 13px; }
.audit-detail-body .raw-event { margin: 0; }
.audit-detail-body .raw-event pre { max-height: 260px; overflow: auto; }
@media (max-width: 760px) {
  .audit-detail-body { gap: 16px; }
  .audit-detail-facts { gap: 16px; padding: 16px; }
  .audit-detail-facts dt { font-size: 12px; }
  .audit-detail-facts dd { font-size: 13px; }
  .audit-detail-body .audit-change-card { padding: 16px; }
  .audit-detail-body .audit-change-card dl > div { grid-template-columns: minmax(80px, 110px) minmax(0, 1fr); gap: 12px; }
}

/* Shared reading scale for navigation, tables, detail panels and dialogs. */
.login-label, .health-status { font-size: 12px; }
.login-story .story-grid { font-size: 12px; }
.sidebar .nav-caption { color: #71829a; font-size: 12px; letter-spacing: .5px; }
.sidebar .nav-item { font-size: 14px; }
.sidebar-bottom { color: #60738f; font-size: 12px; }
.sidebar-bottom p { color: #788ba4; font-size: 12px; }
.breadcrumb, .account-menu, .account-menu .text-button { font-size: 13px; }
.admin-tag { color: #58739b; font-size: 12px; }
.workspace .button, dialog .button { font-size: 13px; }
.workspace .table-caption strong { color: #5375a5; font-size: 12px; }
.workspace .badge, dialog .badge { font-size: 12px; }
.workspace .role-chip, .workspace .platform-chip, .workspace .type-chip,
dialog .platform-chip { font-size: 12px; }
.workspace .table-footer .button { font-size: 12px; }
.workspace .content-footer { color: #73849b; font-size: 12px; }
.workspace .panel-note, .workspace .mobile-table-hint { color: #687d98; font-size: 12px; }
.workspace .customer-panel .facts dt, .workspace .customer-panel .license-overview span,
.workspace .customer-panel .section-title p { color: #647a96; font-size: 12px; }
.workspace .customer-panel .facts dd, .workspace .customer-panel .facts dd.mono,
.workspace .customer-panel .facts dd small { color: #405b7c; font-size: 13px; }
.workspace .customer-panel .grant-feature > span, .workspace .customer-panel .grant-feature small { font-size: 13px; }
.workspace .customer-panel .device-table th, .workspace .customer-panel .device-table td { font-size: 12px; }
.workspace .license-picker select { font-size: 12px; }
.workspace .rail-heading > span, .workspace .timeline-heading > span { color: #72849d; font-size: 12px; }
dialog .issued-success p, dialog .receipt-facts dt, dialog .receipt-facts dd small { font-size: 12px; }
dialog .receipt-facts dd { font-size: 13px; }
dialog .button.small-button { font-size: 12px; }
@media (max-width: 760px) {
  .sidebar .nav-item { font-size: 12px; }
  .workspace .content-footer { font-size: 11px; }
  .workspace .table-footer > span { font-size: 12px; }
  .workspace .customer-panel .grant-feature > span, .workspace .customer-panel .grant-feature small { font-size: 12px; }
}

/* A slightly larger reading scale, while keeping large headings restrained. */
body { font-size: 15px; }
.login-story .wordmark { font-size: 16px; }
.login-story .story-body > p { font-size: 15px; }
.login-story .story-grid, .login-main .health-status { font-size: 13px; }
.login-card h2 { font-size: 31px; }
.login-main label, .login-main input, .login-main .login-submit { font-size: 14px; }
.login-main input::placeholder, .login-main .password-toggle { font-size: 13px; }
.sidebar-brand-copy strong { font-size: 16px; }
.sidebar .nav-caption { font-size: 13px; }
.sidebar .nav-item { font-size: 15px; }
.breadcrumb, .account-menu, .account-menu .text-button { font-size: 14px; }
.admin-tag { font-size: 13px; }
.workspace .button, dialog .button { font-size: 14px; }
.workspace .page-heading h1, #workspace[data-view="users"]:not(.showing-customer) .page-heading h1 { font-size: 29px; }
#workspace .stat-label, #workspace[data-view="users"]:not(.showing-customer) .stat-label { font-size: 14px; }
.workspace .stat strong { font-size: 30px; }
.workspace .field-label-text, .workspace .filter-label > span { font-size: 14px; }
.workspace input, .workspace select { font-size: 14px; }
.workspace input::placeholder { font-size: 13px; }
.workspace .table-caption h2 { font-size: 17px; }
.workspace .table-caption strong, .workspace .badge, .workspace .role-chip,
.workspace .platform-chip, .workspace .type-chip { font-size: 13px; }
#workspace #table-region th { font-size: 13px; }
#workspace #table-region td, #workspace #table-region td strong,
#workspace #table-region .date-cell { font-size: 14px; }
#workspace #table-region .id, #workspace #table-region .cell-note,
#workspace #table-region .row-plan small, #workspace #table-region .row-plan > span,
#workspace .table-footer, #workspace .table-footer .button { font-size: 13px; }
.workspace .audit-row .audit-identity > span:first-child, .audit-sequence,
.workspace .audit-row .audit-identity .id, .workspace .audit-row .audit-reason,
.workspace .code-row .code-record-button, .duration-note { font-size: 13px; }
.workspace .audit-row .audit-actor { font-size: 14px; }
#workspace .role-chip { white-space: nowrap; }
#workspace[data-view="users"]:not(.showing-customer) #table-region table { min-width: 1250px; }
#workspace[data-view="users"]:not(.showing-customer) #table-region .cell-note { white-space: nowrap; }
.showing-customer .back-link, .showing-customer .customer-identity p,
.showing-customer .customer-registered, .showing-customer .customer-metrics small,
.showing-customer .panel-heading p, .workspace .panel-note,
.workspace .mobile-table-hint, .presence-summary span, .presence-summary small,
.presence-explanation summary, .presence-explanation p { font-size: 13px; }
.showing-customer .customer-name h2 { font-size: 22px; }
.showing-customer .customer-metrics > div > span,
.showing-customer .tabs button, .showing-customer .rail-facts { font-size: 14px; }
.showing-customer .panel-heading h2, .showing-customer .rail-card h3,
.presence-section h3 { font-size: 16px; }
.workspace .customer-panel .facts dt, .workspace .customer-panel .license-overview span,
.workspace .customer-panel .section-title p, .workspace .customer-panel .device-table th,
.workspace .customer-panel .device-table td, .workspace .license-picker select,
.workspace .rail-heading > span, .workspace .timeline-heading > span,
.presence-section td { font-size: 13px; }
.workspace .customer-panel .facts dd, .workspace .customer-panel .facts dd.mono,
.workspace .customer-panel .facts dd small, .workspace .customer-panel .grant-feature > span,
.workspace .customer-panel .grant-feature small { font-size: 14px; }
dialog .dialog-header h2 { font-size: 21px; }
dialog .dialog-header p, dialog .dialog-body input::placeholder,
dialog .info-card p, dialog .info-card strong, dialog .facts dt,
dialog .facts dd, dialog .facts dd.mono, dialog .facts dd small,
dialog .grant-feature > span, dialog .grant-feature small,
dialog .license-actions .button, dialog .device-table th, dialog .device-table td { font-size: 14px; }
dialog .dialog-body label, dialog .dialog-body input, dialog .dialog-body select { font-size: 15px; }
dialog .dialog-body .field-hint, dialog .field-counter, dialog .form-review strong,
dialog .target-card > span, dialog .target-card > p, dialog .target-card > small,
dialog .device-table .cell-note, dialog .device-table .id, dialog .section-title p,
dialog .issued-success p, dialog .receipt-facts dt, dialog .receipt-facts dd small,
dialog .button.small-button, .code-record-facts dt, .code-record-facts dd.mono,
.audit-detail-facts dd.mono, .audit-detail-facts dd small, .raw-event pre { font-size: 13px; }
dialog .form-review p, dialog .feature-choice strong, dialog .policy-check,
.audit-detail-body .audit-result, .audit-detail-facts dt,
.audit-detail-body .audit-change-card dt, .audit-detail-body .audit-change-card dd,
.raw-event summary { font-size: 14px; }
.code-record-facts dd, .audit-detail-facts dd { font-size: 15px; }
@media (max-width: 760px) {
  .sidebar-brand-copy strong { font-size: 15px; }
  .sidebar .nav-item { font-size: 13px; padding-inline: 7px; }
  .workspace .page-heading h1, #workspace[data-view="users"]:not(.showing-customer) .page-heading h1 { font-size: 26px; }
  #workspace .stat-label, #workspace[data-view="users"]:not(.showing-customer) .stat-label { font-size: 13px; }
  .workspace .stat strong { font-size: 24px; }
  .showing-customer .customer-metrics > div > span, .showing-customer .tabs button { font-size: 13px; }
  dialog .dialog-header h2 { font-size: 19px; }
  dialog .dialog-body label, dialog .dialog-body input, dialog .dialog-body select { font-size: 14px; }
  dialog .info-card p, dialog .facts dd, dialog .facts dd.mono { font-size: 13px; }
  .audit-detail-facts dt { font-size: 13px; }
  .code-record-facts dd, .audit-detail-facts dd { font-size: 14px; }
}
@media (max-width: 480px) {
  .sidebar nav { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 5px; }
  .sidebar .nav-item { justify-content: center; white-space: nowrap; }
}

/* Keep the customer profile focused on details that are not already on screen. */
.showing-customer .customer-identity > div > p,
.showing-customer #customer-panel[aria-labelledby="tab-licenses"] > .panel-heading > div > p,
.showing-customer .customer-panel .license-content > .facts > .license-owner,
.showing-customer .customer-panel .subsection-heading > span,
.showing-customer #tab-presence > span { display: none; }
.showing-customer .customer-name { gap: 10px; }
.showing-customer .customer-panel .panel-heading { min-height: 72px; }
@media (min-width: 1550px) {
  .showing-customer .customer-panel .license-content > .facts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* Secondary identifiers stay available without dominating detail dialogs. */
.technical-details { border: 1px solid #e2eaf6; border-radius: 9px; background: #f8faff; padding: 12px 16px; }
.technical-details summary { color: #496b9b; font-size: 13px; font-weight: 550; cursor: pointer; }
.technical-details dl { margin: 12px 0 2px; display: grid; gap: 12px; }
.technical-details dl > div { min-width: 0; }
.technical-details dt { color: #687d98; font-size: 12px; }
.technical-details dd { color: #405b7c; font-size: 13px; line-height: 1.5; margin: 4px 0 0; overflow-wrap: anywhere; }
.license-identifiers { margin: 18px 0 0; }
.code-record-detail .technical-details { margin-top: 18px; }
.audit-detail-body .technical-details { margin: 0; }
.license-facts { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.showing-customer .customer-panel .license-content > .license-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.device-id-details { margin-top: 6px; max-width: 290px; }
.device-id-details summary { color: #5576a4; font-size: 12px; }
.device-id-details > span { display: block; margin-top: 5px; color: #60738e; font-size: 12px; overflow-wrap: anywhere; }
@media (max-width: 760px) {
  .license-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .technical-details { padding: 12px; }
}

/* The issuance form keeps its inputs and review information easy to scan. */
.issue-dialog .dialog-header { padding: 22px 26px 19px; }
.issue-dialog .dialog-heading p { margin-top: 4px; }
.issue-dialog .issue-body { padding: 24px 26px; }
.issue-dialog .form-section-heading { margin-bottom: 15px; }
.issue-dialog .form-section-heading h3 { font-size: 16px; }
.issue-dialog .form-grid { gap: 17px 16px; }
.issue-dialog .form-grid label { font-size: 14px; line-height: 1.45; }
.issue-dialog .form-grid input, .issue-dialog .form-grid select { font-size: 15px; }
.issue-dialog .form-grid .field-hint { display: block; margin-top: 7px; font-size: 13px; line-height: 1.5; }
.issue-dialog .policy-fieldset { margin-top: 21px; padding: 17px 18px 18px; background: #fbfcff; }
.issue-dialog .policy-fieldset legend { color: #3f5878; font-size: 14px; font-weight: 600; }
.issue-dialog #renew-target-summary > .target-card { margin-top: 14px; padding: 14px 16px; background: #f1f6ff; }
.issue-dialog #renew-target-summary .target-card > strong { margin-top: 4px; }
.issue-dialog #renew-target-summary .target-card > p { margin-top: 4px; }
.issue-dialog .renew-policy-note { display: flex; align-items: flex-start; gap: 8px; margin: 14px 0 0; color: #587392; font-size: 13px; line-height: 1.65; }
.issue-dialog .renew-policy-note .ui-icon { width: 16px; height: 16px; margin-top: 3px; flex: 0 0 auto; color: #6c91cb; }
.issue-dialog .form-review { margin-top: 20px; padding: 14px 16px; background: #f0f6ff; }
.issue-dialog .form-review strong { color: #365b8a; font-size: 14px; }
.issue-dialog .form-review p { margin-top: 4px; font-size: 14px; line-height: 1.6; }
.issue-dialog .dialog-body > .policy-check { margin-top: 16px; padding: 13px 15px; background: #fff; }
.issue-dialog .dialog-body > .policy-check span { font-size: 14px; line-height: 1.55; }
.issue-dialog .feature-choice { padding: 12px 14px; }
.issue-dialog .feature-choice strong { font-size: 14px; }
.issue-dialog .feature-options + .field-hint { font-size: 13px; line-height: 1.6; }
@media (max-width: 480px) {
  .issue-dialog .dialog-header { padding: 18px; }
  .issue-dialog .issue-body { padding: 20px 18px; }
  .issue-dialog .policy-fieldset { padding: 15px 14px; }
  .issue-dialog .dialog-footer { padding-inline: 18px; }
}