:root {
  --bg: #edf5fd;
  --panel: #ffffff;
  --panel-strong: #f2f8ff;
  --line: #d9e8f7;
  --text: #173a5e;
  --muted: #6e89a6;
  --accent: #56aee6;
  --accent-deep: #2f7fb8;
  --success: #23a06d;
  --warning: #d79836;
  --danger: #d96a78;
  --shadow: 0 20px 48px rgba(71, 125, 179, 0.12);
  --radius-xl: 28px;
  --radius-lg: 18px;
  --radius-md: 12px;
  --radius-sm: 10px;
  --font-ui: "Bahnschrift", "Segoe UI Variable Display", "Microsoft YaHei UI", sans-serif;
  --font-copy: "Georgia", "Noto Serif SC", "Songti SC", serif;
}

* {
  box-sizing: border-box;
}

html,
body {
  margin: 0;
  min-height: 100%;
  background:
    radial-gradient(circle at top left, rgba(128, 192, 235, 0.28), transparent 24%),
    radial-gradient(circle at right center, rgba(212, 233, 249, 0.5), transparent 34%),
    linear-gradient(180deg, #f8fbff 0%, #edf5fd 100%);
  color: var(--text);
  font-family: var(--font-ui);
}

button,
input,
select,
textarea {
  font: inherit;
}

body {
  min-height: 100vh;
}

a {
  color: inherit;
}

#app {
  min-height: 100vh;
}

.app-shell {
  display: grid;
  grid-template-columns: 280px minmax(0, 1fr);
  min-height: 100vh;
}

.sidebar {
  display: flex;
  flex-direction: column;
  height: 100vh;
  position: sticky;
  top: 0;
  overflow: hidden;
  padding: 28px 22px;
  border-right: 1px solid rgba(217, 232, 247, 0.92);
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.96) 0%, rgba(244, 249, 255, 0.94) 100%);
  backdrop-filter: blur(22px);
}
.sidebar-top { flex: 0 0 auto; }
.sidebar-nav { flex: 1 1 auto; min-height: 0; overflow-y: auto; padding: 6px 0 14px; }
.sidebar-bottom { flex: 0 0 auto; padding-top: 10px; border-top: 1px solid var(--line); }
.sidebar-status-row { display: flex; align-items: center; gap: 8px; margin-top: 10px; flex-wrap: wrap; }
.api-status-badge { display: inline-flex; align-items: center; gap: 4px; padding: 3px 10px; border-radius: 999px; font-size: 11px; font-weight: 700; }
.api-status-badge::before { content: ""; width: 6px; height: 6px; border-radius: 50%; display: inline-block; }
.api-status-badge.is-ok { background: rgba(35,160,109,0.12); color: var(--success); }
.api-status-badge.is-ok::before { background: var(--success); box-shadow: 0 0 0 3px rgba(35,160,109,0.18); }
.api-status-badge.is-down { background: rgba(217,106,120,0.12); color: var(--danger); }
.api-status-badge.is-down::before { background: var(--danger); }

.sidebar-context-card {
  margin-bottom: 18px;
  padding: 14px;
  border: 1px solid rgba(217, 232, 247, 0.96);
  border-radius: 12px;
  background: #ffffff;
  box-shadow: 0 6px 18px rgba(71, 125, 179, 0.08);
}

.sidebar-context-heading { display: flex; align-items: baseline; gap: 8px; min-width: 0; }
.sidebar-context-kicker { flex: 0 0 auto; color: var(--accent-deep); font-size: 11px; font-weight: 800; letter-spacing: 0.08em; }
.sidebar-context-scope { min-width: 0; overflow: hidden; color: var(--text); font-size: 14px; font-weight: 700; text-overflow: ellipsis; white-space: nowrap; }
.sidebar-user-row { display: grid; gap: 2px; margin-top: 12px; }
.sidebar-user-row strong { color: var(--text); font-size: 15px; line-height: 1.3; }
.sidebar-user-row .muted { color: var(--muted); font-size: 12px; }
.sidebar-context-tools { display: flex; align-items: center; gap: 8px; margin-top: 12px; padding-top: 10px; border-top: 1px solid var(--line); }

.sidebar-api-status { display: grid; width: 30px; height: 30px; place-items: center; border: 1px solid rgba(217, 232, 247, 0.96); border-radius: 10px; background: #ffffff; }
.sidebar-api-status i { width: 8px; height: 8px; border-radius: 50%; }
.sidebar-api-status.is-ok i { background: var(--success); box-shadow: 0 0 0 4px rgba(35, 160, 109, 0.12); }
.sidebar-api-status.is-down i { background: var(--danger); box-shadow: 0 0 0 4px rgba(217, 106, 120, 0.12); }

.sidebar-notification summary { position: relative; display: grid; width: 30px; height: 30px; place-items: center; border: 1px solid rgba(217, 232, 247, 0.96); border-radius: 10px; color: var(--accent-deep); background: #ffffff; list-style: none; }
.sidebar-notification summary::-webkit-details-marker { display: none; }
.sidebar-notification summary:focus-visible { outline: 3px solid rgba(47, 127, 184, 0.24); outline-offset: 2px; }
.notification-bell { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.8; }
.notification-count { position: absolute; top: -5px; right: -6px; display: grid; min-width: 16px; height: 16px; place-items: center; padding: 0 4px; border: 2px solid #ffffff; border-radius: 999px; color: #ffffff; background: var(--danger); font-size: 10px; font-weight: 800; line-height: 1; }

.brand-card,
.sidebar-group,
.login-card,
.hero-card,
.panel,
.detail-card,
.metric-card,
.toolbar,
.form-grid,
.empty-card {
  background: var(--panel);
  border: 1px solid rgba(217, 232, 247, 0.92);
  box-shadow: var(--shadow);
}

.brand-card {
  padding: 20px;
  border-radius: var(--radius-xl);
  margin-bottom: 18px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.98) 0%, rgba(244, 249, 255, 0.96) 100%);
}

.brand-kicker {
  font-size: 12px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--accent-deep);
}

.brand-title {
  margin: 8px 0 4px;
  font-size: 16px;
  font-weight: 700;
  font-family: var(--font-copy);
  line-height: 1.3;
}

.brand-subtitle {
  color: var(--muted);
  font-size: 14px;
  line-height: 1.6;
}

.user-chip {
  margin-top: 16px;
  padding-top: 16px;
  border-top: 1px solid var(--line);
  display: grid;
  gap: 4px;
}

.sidebar-group {
  padding: 12px;
  border-radius: 22px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.96) 0%, rgba(247, 251, 255, 0.94) 100%);
}

.nav-label {
  padding: 8px 10px 10px;
  color: var(--muted);
  font-size: 12px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.nav-button,
.ghost-button,
.primary-button,
.status-button,
.danger-button {
  appearance: none;
  border: 0;
  border-radius: 14px;
  padding: 12px 14px;
  cursor: pointer;
  transition: transform 140ms ease, box-shadow 140ms ease, background 140ms ease;
}

.nav-button {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: transparent;
  color: var(--text);
  margin-bottom: 4px;
  font-weight: 500;
  font-size: 13px;
  padding: 10px 14px;
}

.nav-button:hover,
.nav-button.active {
  background: linear-gradient(135deg, #4fa8e4 0%, #8bc8ee 100%);
  color: #ffffff;
  box-shadow: 0 14px 30px rgba(79, 168, 228, 0.24);
  transform: translateY(-1px);
}

.main {
  padding: 28px;
  display: grid;
  gap: 18px;
}

.nav-group + .nav-group {
  margin-top: 10px;
}
.nav-group-header {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 6px 10px 8px;
  cursor: pointer;
  list-style: none;
  user-select: none;
  border-radius: 12px;
  transition: background 0.15s;
}
.nav-group-header::-webkit-details-marker { display: none; }
.nav-group-header::marker { display: none; content: ""; }
.nav-group-header:hover { background: rgba(86, 174, 230, 0.08); }
.nav-group-label {
  flex: 1;
  color: var(--text);
  font-size: 14px;
  font-weight: 700;
}
.nav-group-count {
  color: var(--accent-deep);
  font-size: 11px;
  font-weight: 700;
  background: rgba(86, 174, 230, 0.12);
  padding: 1px 7px;
  border-radius: 999px;
  min-width: 20px;
  text-align: center;
}
.nav-group-arrow {
  font-size: 10px;
  color: var(--muted);
  transition: transform 0.2s;
}
details.nav-group[open] .nav-group-arrow { transform: rotate(180deg); }
.nav-group-body { display: grid; gap: 2px; padding: 4px 0 8px; }

/* Sidebar refresh: keep the same information, but give identity and navigation
   a clearer rhythm than one continuous stack of pale cards. */
.sidebar {
  padding: 24px 18px;
  background:
    radial-gradient(circle at 18% 8%, rgba(139, 205, 239, .2), transparent 21%),
    linear-gradient(180deg, #ffffff 0%, #f3f9ff 58%, #edf6fd 100%);
}
.brand-card {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  margin-bottom: 22px;
  padding: 19px 18px 17px;
  border-color: #cde4f6;
  border-radius: 20px 28px 20px 28px;
  background: linear-gradient(135deg, #ffffff 8%, #eff8ff 100%);
  box-shadow: 0 16px 34px rgba(73, 135, 182, .12);
}
.brand-card::before {
  position: absolute;
  z-index: -1;
  top: -54px;
  right: -46px;
  width: 150px;
  height: 150px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(103, 189, 237, .2), rgba(103, 189, 237, 0) 68%);
  content: "";
}
.brand-card::after {
  position: absolute;
  z-index: -1;
  right: 18px;
  bottom: 0;
  left: 18px;
  height: 3px;
  border-radius: 999px 999px 0 0;
  background: linear-gradient(90deg, var(--accent), rgba(86, 174, 230, .08));
  content: "";
}
.brand-kicker {
  display: inline-flex;
  align-items: center;
  min-height: 22px;
  padding: 0 8px;
  border-radius: 999px;
  color: #257fb8;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .1em;
  background: #eaf6ff;
}
.brand-title { margin: 11px 0 5px; color: #1d4c76; font-size: 18px; letter-spacing: .02em; }
.brand-subtitle { font-size: 13px; }
.user-chip { position: relative; margin-top: 14px; padding-top: 14px; gap: 2px; }
.user-chip::before { position: absolute; top: -1px; left: 0; width: 38px; height: 2px; border-radius: 99px; background: #8fc8ec; content: ""; }
.sidebar-status-row { gap: 7px; margin-top: 12px; }
.api-status-badge { padding: 4px 10px; }
.nav-label { display: flex; align-items: center; gap: 8px; padding: 8px 4px 13px; color: #6a91b2; font-size: 11px; font-weight: 800; letter-spacing: .14em; }
.nav-label::before { width: 22px; height: 3px; border-radius: 99px; background: var(--accent); content: ""; }
.nav-group + .nav-group { margin-top: 5px; }
.nav-group-header {
  position: relative;
  min-height: 46px;
  padding: 10px 10px 10px 13px;
  border: 1px solid transparent;
  border-radius: 12px 18px 12px 18px;
}
.nav-group-header::before { width: 4px; height: 22px; border-radius: 99px; background: var(--accent); content: ""; }
.nav-group:nth-of-type(3) .nav-group-header::before { background: #53b994; }
.nav-group:nth-of-type(4) .nav-group-header::before { background: #7d8fea; }
.nav-group:nth-of-type(5) .nav-group-header::before { background: #d59a4d; }
.nav-group-header:hover, details.nav-group[open] .nav-group-header { border-color: #cfe6f6; background: linear-gradient(90deg, #f0f9ff, rgba(255,255,255,.68)); }
.nav-group-label { color: #244e76; font-size: 15px; letter-spacing: .01em; }
.nav-group-count { display: grid; width: 29px; height: 29px; place-items: center; padding: 0; border: 1px solid #d7eafa; color: #2a83bd; font-size: 12px; background: #eef8ff; box-shadow: inset 0 1px #fff; }
.nav-group-arrow { width: 16px; height: 16px; font-size: 0; }
.nav-group-arrow::before { display: block; width: 6px; height: 6px; margin: 4px; border-right: 2px solid #6d91b2; border-bottom: 2px solid #6d91b2; content: ""; transform: rotate(45deg); }
.nav-group-body { margin: 0 9px 5px 15px; padding: 7px 0 8px 12px; border-left: 1px solid #d8eaf7; }

.page-context {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding: 4px 2px 14px;
  border-bottom: 1px solid var(--line);
}

.page-context .hero-title {
  margin: 4px 0;
}

.page-context .hero-copy {
  margin: 0;
}

.page-kicker {
  color: var(--accent-deep);
  font-size: 12px;
  font-weight: 800;
}

.notification-popover {
  position: relative;
  flex: 0 0 auto;
}

.notification-popover summary {
  cursor: pointer;
  font-weight: 800;
  white-space: nowrap;
}

.notification-list {
  position: absolute;
  z-index: 5;
  top: 30px;
  right: 0;
  width: min(360px, 80vw);
  padding: 12px;
  border-radius: var(--radius-md);
  background: var(--panel);
  box-shadow: var(--shadow);
}

.hero-card {
  padding: 28px;
  border-radius: 30px;
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 18px;
  background:
    radial-gradient(circle at left top, rgba(183, 221, 246, 0.52), transparent 36%),
    linear-gradient(135deg, rgba(223, 240, 252, 0.92), rgba(255, 255, 255, 0.98)),
    var(--panel);
}

.hero-title {
  margin: 0;
  font-size: 34px;
  line-height: 1.08;
  font-family: var(--font-copy);
}

.hero-copy {
  margin: 12px 0 0;
  max-width: 720px;
  color: var(--muted);
  line-height: 1.75;
}

.hero-meta {
  min-width: 220px;
  padding: 16px 18px;
  border-radius: 20px;
  background: rgba(255, 255, 255, 0.9);
  border: 1px solid rgba(205, 225, 243, 0.95);
  box-shadow: 0 10px 26px rgba(108, 160, 204, 0.12);
}

.metric-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 16px;
}

.metric-card {
  padding: 18px;
  border-radius: 22px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.98) 0%, rgba(245, 250, 255, 0.96) 100%);
}

.metric-label {
  color: var(--muted);
  font-size: 13px;
}

.metric-value {
  margin-top: 10px;
  font-size: 34px;
  font-weight: 700;
}

.content-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.3fr) minmax(320px, 0.9fr);
  gap: 18px;
}

.panel,
.detail-card,
.empty-card,
.login-card {
  border-radius: 26px;
}

.panel,
.detail-card,
.empty-card {
  padding: 22px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.99) 0%, rgba(250, 253, 255, 0.97) 100%);
}

.panel-header,
.section-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 16px;
}

.section-title {
  margin: 0;
  font-size: 22px;
}

.section-subtitle {
  color: var(--muted);
  margin-top: 6px;
  font-size: 14px;
}

.toolbar {
  border-radius: 22px;
  padding: 14px;
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-bottom: 16px;
}

.toolbar input,
.toolbar select,
.toolbar textarea,
.form-grid input,
.form-grid select,
.form-grid textarea {
  width: 100%;
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 12px 13px;
  color: var(--text);
  background: #fbfdff;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.7);
}

.toolbar label,
.form-grid label {
  display: grid;
  gap: 8px;
  color: var(--muted);
  font-size: 13px;
}

.toolbar > * {
  flex: 1 1 180px;
}

.primary-button {
  background: linear-gradient(135deg, #4ea7e3 0%, #89c8ef 100%);
  color: #ffffff;
  font-weight: 700;
  box-shadow: 0 12px 24px rgba(79, 168, 228, 0.24);
}

.ghost-button {
  background: linear-gradient(180deg, rgba(226, 240, 251, 0.9) 0%, rgba(236, 246, 253, 0.9) 100%);
  color: var(--accent-deep);
  font-weight: 700;
  border: 1px solid rgba(210, 228, 244, 0.95);
}
.logout-button { width: 100%; margin-top: 10px; }

.danger-button {
  background: rgba(204, 78, 78, 0.12);
  color: var(--danger);
  font-weight: 700;
}

.status-button {
  background: rgba(31, 157, 104, 0.12);
  color: var(--success);
  font-weight: 700;
}

.table-wrap {
  overflow: auto;
  border: 1px solid var(--line);
  border-radius: 20px;
  background: rgba(255, 255, 255, 0.82);
}

table {
  width: 100%;
  border-collapse: collapse;
  min-width: 760px;
}

th,
td {
  padding: 14px 16px;
  border-bottom: 1px solid rgba(215, 227, 240, 0.85);
  text-align: left;
  vertical-align: top;
}

th {
  font-size: 12px;
  letter-spacing: 0.04em;
  color: var(--muted);
  background: #f5faff;
}

tbody tr {
  cursor: pointer;
}

tbody tr:hover,
tbody tr.selected {
  background: rgba(86, 174, 230, 0.08);
}

.tag {
  display: inline-flex;
  align-items: center;
  padding: 6px 10px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 700;
}

.tag.info {
  background: rgba(86, 174, 230, 0.12);
  color: var(--accent-deep);
}

.tag.success {
  background: rgba(35, 160, 109, 0.12);
  color: var(--success);
}

.tag.warning {
  background: rgba(215, 152, 54, 0.14);
  color: var(--warning);
}

.tag.danger {
  background: rgba(217, 106, 120, 0.14);
  color: var(--danger);
}

.tag.neutral {
  background: rgba(107, 128, 150, 0.14);
  color: var(--muted);
}

.stack {
  display: grid;
  gap: 12px;
}

.detail-list,
.card-list {
  display: grid;
  gap: 12px;
}

.detail-item,
.feed-item {
  padding: 14px 15px;
  border-radius: 18px;
  background: linear-gradient(180deg, #f8fbff 0%, #f3f9ff 100%);
  border: 1px solid rgba(217, 232, 247, 0.9);
}

.feed-title {
  font-weight: 700;
  margin-bottom: 6px;
}

.feed-meta,
.muted {
  color: var(--muted);
}

.muted {
  line-height: 1.7;
}

.detail-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 16px;
}

.form-grid {
  padding: 16px;
  border-radius: 22px;
  display: grid;
  gap: 14px;
}

.form-columns {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.permission-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.permission-chip {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: linear-gradient(180deg, #f9fcff 0%, #f3f9ff 100%);
  color: var(--text);
  font-size: 13px;
}

.permission-chip.is-disabled {
  opacity: 0.48;
  background: #f3f6f9;
}

.permission-chip input {
  width: auto;
  margin: 0;
}

.billing-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.12fr) minmax(360px, 0.88fr);
  gap: 18px;
  align-items: start;
}

.billing-main,
.billing-detail {
  min-width: 0;
}

.billing-detail {
  display: grid;
  gap: 16px;
}

.billing-row.is-overdue {
  background: rgba(217, 106, 120, 0.06);
}

.billing-row.is-normal {
  background: rgba(35, 160, 109, 0.035);
}

.billing-negative {
  color: var(--danger);
  font-weight: 700;
}

.billing-positive {
  color: var(--success);
  font-weight: 700;
}

.payment-modal-backdrop {
  position: fixed;
  inset: 0;
  z-index: 30;
  display: grid;
  place-items: center;
  padding: 24px;
  background: rgba(23, 58, 94, 0.28);
  backdrop-filter: blur(8px);
}

.payment-modal {
  width: min(560px, 100%);
  max-height: calc(100vh - 48px);
  overflow: auto;
}

.floor-plan-layout,
.admission-layout {
  align-items: start;
}

.floor-section {
  display: grid;
  gap: 14px;
  margin-top: 18px;
}

.floor-section h3,
.floor-title,
.wizard-panel h3 {
  margin: 0;
}

.floor-block {
  display: grid;
  gap: 12px;
}

.floor-title {
  color: var(--accent-deep);
  font-weight: 800;
}

.floor-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, 200px);
  gap: 14px;
}

.room-card {
  width: 200px;
  min-height: 180px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: linear-gradient(180deg, #ffffff 0%, #f5faff 100%);
}

.room-card-head {
  width: 100%;
  appearance: none;
  border: 0;
  background: transparent;
  color: var(--text);
  display: flex;
  justify-content: space-between;
  gap: 8px;
  padding: 0 0 10px;
  cursor: pointer;
}

.room-card-head span {
  color: var(--muted);
  font-size: 12px;
}

.bed-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 8px;
}

.bed-item {
  width: 60px;
  min-height: 40px;
  appearance: none;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #ffffff;
  color: var(--text);
  display: grid;
  align-content: center;
  gap: 2px;
  cursor: pointer;
}

.bed-item strong {
  font-size: 12px;
}

.bed-item span {
  color: var(--muted);
  font-size: 11px;
}

.bed-item.is-occupied {
  background: rgba(35, 160, 109, 0.14);
  border-color: rgba(35, 160, 109, 0.38);
}

.bed-item.is-empty {
  background: #ffffff;
}

.wizard-steps {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 8px;
  margin-bottom: 16px;
}

.wizard-steps span {
  padding: 10px;
  border-radius: 999px;
  text-align: center;
  background: rgba(226, 240, 251, 0.9);
  color: var(--muted);
  font-weight: 700;
}

.wizard-steps span.active {
  background: linear-gradient(135deg, #4ea7e3 0%, #89c8ef 100%);
  color: #ffffff;
}

.wizard-panel {
  display: grid;
  gap: 12px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.72);
}

.elder-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 12px 0;
}

.elder-tabs span {
  padding: 8px 10px;
  border-radius: 999px;
  background: rgba(226, 240, 251, 0.9);
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
}

.elder-tabs span.active {
  background: rgba(86, 174, 230, 0.16);
  color: var(--accent-deep);
}

.login-shell {
  min-height: 100vh;
  display: grid;
  grid-template-columns: minmax(440px, 1.06fr) minmax(480px, 0.94fr);
  background: #ffffff;
}

.login-experience {
  position: relative;
  min-height: 100vh;
  overflow: hidden;
  color: #ffffff;
  background: #174a78;
}

.login-photo,
.login-photo-wash {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

.login-photo { object-fit: cover; object-position: 42% center; }
.login-photo-wash { background: rgba(10, 47, 81, 0.22); }

.login-story {
  position: absolute;
  z-index: 1;
  left: clamp(32px, 7vw, 112px);
  right: 32px;
  bottom: clamp(42px, 9vh, 116px);
  max-width: 460px;
  text-shadow: 0 2px 20px rgba(8, 31, 53, 0.35);
}

.login-story p,
.login-eyebrow {
  margin: 0 0 14px;
  color: #4e9ee0;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.16em;
  text-transform: uppercase;
}

.login-story p { color: rgba(255, 255, 255, 0.82); }
.login-story h2 { margin: 0; font-family: var(--font-copy); font-size: clamp(38px, 4vw, 62px); font-weight: 600; line-height: 1.14; letter-spacing: 0.02em; }
.login-story span { display: block; max-width: 310px; margin-top: 24px; color: rgba(255, 255, 255, 0.88); font-size: 15px; line-height: 1.8; }

.login-auth {
  display: flex;
  min-height: 100vh;
  flex-direction: column;
  padding: clamp(34px, 7vh, 76px) clamp(32px, 8vw, 116px) 34px;
  color: #163f68;
  background: #ffffff;
}

.login-auth-content { width: min(100%, 420px); margin: auto 0; padding: 56px 0 42px; }
.login-auth-content h1 { margin: 0; color: #163f68; font-family: var(--font-copy); font-size: clamp(37px, 3.4vw, 48px); font-weight: 600; line-height: 1.12; }
.login-eyebrow { color: #2579c0; }
.login-lead { max-width: 360px; margin: 18px 0 0; color: #708ca8; font-size: 15px; line-height: 1.75; }

.login-form { display: grid; gap: 18px; margin-top: 34px; }
.login-field { display: grid; gap: 8px; color: #2e587e; font-size: 13px; font-weight: 700; }
.login-form input { width: 100%; min-height: 51px; border: 1px solid #d6e4f1; border-radius: 10px; padding: 13px 15px; color: #173f68; background: #fbfdff; box-shadow: none; transition: border-color 150ms ease, box-shadow 150ms ease, background 150ms ease; }
.login-form input::placeholder { color: #9aacbd; }
.login-form input:focus { border-color: #2176bf; outline: 0; background: #ffffff; box-shadow: 0 0 0 4px rgba(33, 118, 191, 0.12); }
.login-form .primary-button,
.login-preview-actions .primary-button { min-height: 53px; margin-top: 6px; border-radius: 10px; color: #ffffff; background: #176cc0; box-shadow: 0 12px 24px rgba(23, 108, 192, 0.2); font-weight: 800; }
.login-form .primary-button:hover,
.login-preview-actions .primary-button:hover { background: #115a9f; transform: translateY(-1px); }

.login-preview-actions { display: grid; gap: 12px; margin-top: 34px; }
.login-preview-actions .ghost-button { min-height: 51px; border: 1px solid #d6e4f1; border-radius: 10px; color: #28628e; background: #ffffff; font-weight: 700; }
.login-assistance { margin: 24px 0 0; color: #8098af; font-size: 13px; line-height: 1.7; }
.login-return-preview { margin-top: 22px; padding: 0; color: #2870ae; background: transparent; text-align: left; }
.login-footer { margin-top: auto; padding-top: 24px; border-top: 1px solid #e4edf5; color: #93a6b8; font-size: 12px; letter-spacing: 0.03em; }

.toast {
  position: fixed;
  right: 24px;
  bottom: 24px;
  max-width: 340px;
  padding: 14px 16px;
  border-radius: 16px;
  color: #ffffff;
  background: rgba(24, 50, 74, 0.92);
  box-shadow: var(--shadow);
  z-index: 1000;
}

.toast.success {
  background: rgba(31, 157, 104, 0.94);
}

.toast.error {
  background: rgba(204, 78, 78, 0.94);
}

.inline-note {
  padding: 10px 12px;
  border-radius: 12px;
  background: rgba(45, 156, 219, 0.08);
  color: var(--accent-deep);
  font-size: 13px;
}

.dashboard-app-shell {
  background:
    radial-gradient(circle at top left, rgba(45, 156, 219, 0.22), transparent 22%),
    radial-gradient(circle at top right, rgba(142, 200, 234, 0.28), transparent 24%),
    linear-gradient(180deg, #f6fbff 0%, #eaf3fb 55%, #edf5fc 100%);
}

.dashboard-app-shell .sidebar {
  background: rgba(255, 255, 255, 0.72);
  border-right: 1px solid rgba(215, 227, 240, 0.92);
  backdrop-filter: blur(18px);
}

.dashboard-app-shell .brand-card,
.dashboard-app-shell .sidebar-group {
  background: rgba(255, 255, 255, 0.88);
  border-color: rgba(215, 227, 240, 0.9);
  box-shadow: var(--shadow);
}

.dashboard-app-shell .brand-kicker,
.dashboard-app-shell .nav-label,
.dashboard-app-shell .brand-subtitle,
.dashboard-app-shell .user-chip .muted {
  color: var(--muted);
}

.dashboard-app-shell .brand-title,
.dashboard-app-shell .user-chip strong {
  color: var(--text);
}

.dashboard-app-shell .nav-button {
  color: var(--text);
  border: 1px solid rgba(215, 227, 240, 0.12);
}

.dashboard-app-shell .nav-button:hover,
.dashboard-app-shell .nav-button.active {
  background: linear-gradient(135deg, #2d9cdb 0%, #8ec8ea 100%);
  border-color: rgba(45, 156, 219, 0.24);
  box-shadow: 0 14px 30px rgba(45, 156, 219, 0.22);
}

.dashboard-app-shell .ghost-button {
  background: rgba(45, 156, 219, 0.1);
  color: var(--accent-deep);
}

.dashboard-main {
  padding: 18px;
  gap: 0;
}

.dashboard-screen {
  color: var(--text);
}

.dashboard-topbar {
  display: grid;
  grid-template-columns: 260px minmax(0, 1fr) 260px;
  align-items: center;
  gap: 18px;
  margin-bottom: 14px;
}

.dashboard-topbar-block {
  display: grid;
  gap: 8px;
}

.dashboard-topbar-block.align-end {
  justify-items: end;
}

.dashboard-clock {
  font-size: 28px;
  font-weight: 700;
  color: var(--text);
}

.dashboard-scope {
  color: var(--muted);
  font-size: 14px;
}

.dashboard-center-title {
  position: relative;
  padding: 14px 28px;
  border: 1px solid rgba(215, 227, 240, 0.92);
  border-radius: 18px;
  background:
    linear-gradient(135deg, rgba(45, 156, 219, 0.12), rgba(255, 255, 255, 0.94)),
    rgba(255, 255, 255, 0.92);
  box-shadow: var(--shadow);
  overflow: hidden;
}

.dashboard-center-title::before,
.dashboard-center-title::after {
  content: "";
  position: absolute;
  top: 0;
  width: 90px;
  height: 100%;
  background: linear-gradient(90deg, rgba(45, 156, 219, 0.12), transparent);
  opacity: 1;
}

.dashboard-center-title::before {
  left: -32px;
  transform: skewX(-36deg);
}

.dashboard-center-title::after {
  right: -48px;
  transform: skewX(36deg);
}

.dashboard-center-title h1 {
  margin: 0;
  font-size: 38px;
  color: var(--text);
  letter-spacing: 0.04em;
}

.dashboard-center-title p {
  margin: 8px 0 0;
  color: var(--muted);
  font-size: 14px;
}

.dashboard-api-state {
  padding: 8px 14px;
  border-radius: 999px;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.08em;
}

.dashboard-api-state.is-ok {
  background: rgba(31, 157, 104, 0.12);
  color: var(--success);
  border: 1px solid rgba(31, 157, 104, 0.18);
}

.dashboard-api-state.is-down {
  background: rgba(204, 78, 78, 0.12);
  color: var(--danger);
  border: 1px solid rgba(204, 78, 78, 0.18);
}

.dashboard-refresh-button {
  padding-inline: 18px;
}

.dashboard-kpi-row {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 12px;
  margin-bottom: 14px;
}

.dashboard-module-card {
  position: relative;
  border: 1px solid rgba(215, 227, 240, 0.88);
  border-radius: 18px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(237, 246, 253, 0.92)),
    rgba(255, 255, 255, 0.94);
  box-shadow: var(--shadow);
  padding: 16px 18px;
  overflow: hidden;
  text-align: left;
  cursor: pointer;
  transition: transform 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease;
}

.dashboard-module-card:hover {
  transform: translateY(-2px);
  border-color: rgba(45, 156, 219, 0.32);
  box-shadow: 0 18px 34px rgba(24, 50, 74, 0.12);
}

.dashboard-module-card span,
.dashboard-module-card strong,
.dashboard-module-card em {
  position: relative;
  z-index: 1;
  display: block;
}

.dashboard-module-card span {
  color: var(--muted);
  font-size: 13px;
}

.dashboard-module-card strong {
  margin-top: 10px;
  font-size: 32px;
  color: var(--text);
}

.dashboard-module-card em {
  margin-top: 8px;
  color: var(--accent);
  font-size: 13px;
  font-style: normal;
}

.dashboard-kpi-card,
.dashboard-panel,
.dashboard-stage-panel {
  position: relative;
  border: 1px solid rgba(215, 227, 240, 0.88);
  border-radius: 18px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(237, 246, 253, 0.92)),
    rgba(255, 255, 255, 0.94);
  box-shadow: var(--shadow);
}

.dashboard-kpi-card {
  padding: 16px 18px;
  overflow: hidden;
}

.dashboard-kpi-card::after,
.dashboard-panel::after,
.dashboard-stage-panel::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
  background: linear-gradient(90deg, rgba(45, 156, 219, 0.08), transparent 24%, transparent 76%, rgba(45, 156, 219, 0.05));
  opacity: 1;
}

.dashboard-kpi-card span,
.dashboard-kpi-card em {
  position: relative;
  z-index: 1;
  display: block;
}

.dashboard-kpi-card span {
  color: var(--muted);
  font-size: 13px;
}

.dashboard-kpi-card strong {
  position: relative;
  z-index: 1;
  display: block;
  margin-top: 10px;
  font-size: 34px;
  color: var(--text);
}

.dashboard-kpi-card em {
  margin-top: 8px;
  font-style: normal;
  color: var(--accent);
  font-size: 13px;
}

.dashboard-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.45fr) minmax(320px, 0.85fr);
  gap: 14px;
  align-items: start;
}

.dashboard-platform-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(360px, 0.9fr);
  gap: 14px;
  align-items: start;
}

.dashboard-column,
.dashboard-center-column {
  display: grid;
  gap: 14px;
}

.dashboard-panel,
.dashboard-stage-panel {
  padding: 16px;
  overflow: hidden;
}

.dashboard-stage-panel {
  min-height: 0;
}

.dashboard-panel-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 16px;
}

.dashboard-panel-head h2 {
  margin: 0;
  font-size: 22px;
  color: var(--text);
}

.dashboard-panel-head span {
  color: var(--muted);
  font-size: 13px;
}

.dashboard-customer-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  gap: 12px;
}

.dashboard-customer-card {
  appearance: none;
  width: 100%;
  padding: 16px;
  border-radius: 18px;
  border: 1px solid rgba(215, 227, 240, 0.88);
  background: rgba(255, 255, 255, 0.82);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.75);
  text-align: left;
  cursor: pointer;
  transition: transform 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease;
}

.dashboard-customer-card:hover,
.dashboard-customer-card.selected {
  transform: translateY(-2px);
  border-color: rgba(45, 156, 219, 0.34);
  box-shadow: 0 18px 34px rgba(24, 50, 74, 0.12);
}

.dashboard-customer-card.selected {
  background: linear-gradient(180deg, rgba(232, 245, 255, 0.96), rgba(255, 255, 255, 0.96));
}

.dashboard-customer-head,
.dashboard-detail-inline {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
}

.dashboard-customer-head strong {
  display: block;
  font-size: 17px;
}

.dashboard-customer-code {
  margin-top: 4px;
  color: var(--muted);
  font-size: 12px;
}

.dashboard-customer-metrics,
.dashboard-detail-summary,
.dashboard-inline-stats {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.dashboard-customer-metrics {
  margin-top: 14px;
}

.dashboard-customer-metrics article,
.dashboard-detail-summary article,
.dashboard-inline-stats article {
  padding: 12px 10px;
  border-radius: 14px;
  background: rgba(45, 156, 219, 0.08);
  border: 1px solid rgba(215, 227, 240, 0.82);
}

.dashboard-customer-metrics strong,
.dashboard-detail-summary strong,
.dashboard-inline-stats strong {
  display: block;
  font-size: 24px;
  color: var(--text);
}

.dashboard-customer-metrics span,
.dashboard-detail-summary span,
.dashboard-inline-stats span {
  display: block;
  margin-top: 6px;
  color: var(--muted);
  font-size: 12px;
}

.dashboard-customer-foot {
  margin-top: 14px;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 8px;
  color: var(--muted);
  font-size: 12px;
}

.dashboard-detail-list,
.dashboard-mini-list {
  display: grid;
  gap: 12px;
}

.dashboard-detail-list {
  margin-top: 14px;
}

.dashboard-detail-section {
  position: relative;
  z-index: 1;
  padding: 14px;
  border-radius: 16px;
  border: 1px solid rgba(215, 227, 240, 0.82);
  background: rgba(255, 255, 255, 0.76);
}

.dashboard-detail-section h3 {
  margin: 0 0 12px;
  font-size: 16px;
  color: var(--text);
}

.dashboard-token-list,
.dashboard-detail-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.dashboard-detail-actions {
  position: relative;
  z-index: 1;
  margin-top: 14px;
}

.dashboard-status-grid,
.dashboard-observe-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.dashboard-status-card,
.dashboard-observe-grid article {
  padding: 14px 12px;
  border-radius: 14px;
  background: rgba(45, 156, 219, 0.08);
  border: 1px solid rgba(215, 227, 240, 0.82);
}

.dashboard-status-card strong,
.dashboard-observe-grid strong {
  display: block;
  font-size: 28px;
  color: var(--text);
}

.dashboard-status-card span,
.dashboard-observe-grid span {
  display: block;
  margin-top: 6px;
  color: var(--muted);
  font-size: 12px;
}

.dashboard-chart-wrap {
  margin-top: 14px;
}

.dashboard-sparkline {
  width: 100%;
  height: 88px;
  display: block;
}

.dashboard-chart-note,
.dashboard-item-meta,
.dashboard-chart-empty,
.dashboard-topology-empty,
.dashboard-map-empty {
  color: var(--muted);
  font-size: 13px;
  line-height: 1.7;
}

.dashboard-chart-empty,
.dashboard-topology-empty,
.dashboard-map-empty {
  padding: 14px 0;
}

.dashboard-donut-wrap {
  display: grid;
  grid-template-columns: 150px minmax(0, 1fr);
  gap: 16px;
  align-items: center;
}

.dashboard-donut {
  width: 140px;
  height: 140px;
  border-radius: 50%;
  padding: 14px;
  justify-self: center;
  box-shadow: inset 0 0 0 1px rgba(94, 213, 255, 0.12);
}

.dashboard-donut-core {
  width: 100%;
  height: 100%;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.92);
  color: var(--text);
  text-align: center;
}

.dashboard-donut-core strong {
  display: block;
  font-size: 30px;
}

.dashboard-donut-core span {
  color: var(--muted);
  font-size: 12px;
}

.dashboard-legend {
  display: grid;
  gap: 10px;
}

.dashboard-legend-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.dashboard-legend-row span {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--text);
  font-size: 13px;
}

.dashboard-legend-row i {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  display: inline-block;
}

.dashboard-list {
  display: grid;
  gap: 10px;
}

.dashboard-list.compact .dashboard-list-item {
  padding: 12px 14px;
}

.dashboard-list-item {
  padding: 14px 16px;
  border-radius: 14px;
  border: 1px solid rgba(215, 227, 240, 0.82);
  background: rgba(255, 255, 255, 0.74);
}

.dashboard-list-item strong {
  display: flex;
  align-items: center;
  gap: 8px;
  color: var(--text);
  margin-bottom: 6px;
}

.dashboard-room-tag {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 48px;
  padding: 2px 8px;
  border-radius: 999px;
  background: rgba(45, 156, 219, 0.12);
  color: var(--accent-deep);
  font-size: 11px;
}

.dashboard-alert-hero {
  display: grid;
  place-items: center;
  min-height: 150px;
  margin-bottom: 14px;
  border-radius: 50%;
  width: 150px;
  margin-inline: auto;
  border: 4px solid rgba(45, 156, 219, 0.14);
  box-shadow: 0 0 0 8px rgba(45, 156, 219, 0.12);
  text-align: center;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.94), rgba(233, 243, 255, 0.9));
}

.dashboard-alert-hero strong {
  display: block;
  font-size: 42px;
  color: var(--text);
}

.dashboard-alert-hero span {
  color: var(--muted);
  font-size: 13px;
}

.dashboard-bars {
  display: grid;
  gap: 14px;
}

.dashboard-bar-row {
  display: grid;
  gap: 8px;
}

.dashboard-bar-copy {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  color: var(--text);
}

.dashboard-bar-track {
  height: 10px;
  border-radius: 999px;
  background: rgba(45, 156, 219, 0.12);
  overflow: hidden;
}

.dashboard-bar-fill {
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #4fd1ff, #2d8cff);
}

.dashboard-bar-fill.danger {
  background: linear-gradient(90deg, #ff7767, #ff5858);
}

.dashboard-bar-fill.warning {
  background: linear-gradient(90deg, #ffb55b, #ff8a43);
}

.dashboard-bar-fill.success {
  background: linear-gradient(90deg, #40d5aa, #3bf0c1);
}

.dashboard-map-stage {
  display: grid;
  gap: 14px;
}

.dashboard-map-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
}

.dashboard-map-toolbar-copy {
  display: grid;
  gap: 4px;
}

.dashboard-map-toolbar-copy strong {
  color: var(--text);
  font-size: 16px;
}

.dashboard-map-toolbar-copy span {
  color: var(--muted);
  font-size: 12px;
}

.dashboard-map-zoom-value {
  min-width: 54px;
  text-align: center;
  color: var(--text);
  font-weight: 700;
}

.dashboard-map-summary,
.dashboard-map-hotspots {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}

.dashboard-map-metric,
.dashboard-map-hotspot {
  position: relative;
  z-index: 1;
  padding: 14px 16px;
  border-radius: 16px;
  border: 1px solid rgba(215, 227, 240, 0.82);
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.92), rgba(232, 243, 252, 0.88));
}

.dashboard-map-metric span,
.dashboard-map-metric em {
  display: block;
}

.dashboard-map-metric span {
  color: var(--muted);
  font-size: 12px;
}

.dashboard-map-metric strong {
  display: block;
  margin-top: 8px;
  font-size: 30px;
  color: var(--text);
}

.dashboard-map-metric em {
  margin-top: 6px;
  color: var(--accent);
  font-size: 12px;
  font-style: normal;
}

.dashboard-map-canvas {
  position: relative;
  min-height: 428px;
  padding: 16px;
  border-radius: 24px;
  overflow: hidden;
  border: 1px solid rgba(195, 220, 238, 0.9);
  background:
    radial-gradient(circle at top left, rgba(45, 156, 219, 0.14), transparent 28%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(230, 242, 251, 0.94));
}

.dashboard-map-canvas.dashboard-map-canvas-dark.dashboard-map-canvas-zoomable {
  box-sizing: border-box;
  height: 428px;
  min-height: 428px;
  max-height: 428px;
}

.dashboard-map-viewport {
  position: relative;
  width: 100%;
  height: 392px;
  min-height: 392px;
  max-height: 392px;
  overflow: auto;
  border-radius: 20px;
  overscroll-behavior: contain;
}

.dashboard-map-surface {
  position: relative;
  flex: 0 0 auto;
}

.dashboard-map-scene {
  position: relative;
  width: 1000px;
  height: 520px;
  transform-origin: 0 0;
  will-change: transform;
}

.dashboard-map-wheel-tip {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  min-height: 36px;
  padding: 6px 10px 6px 14px;
  border: 1px solid rgba(178, 211, 235, 0.92);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.86);
  color: #55728d;
  font-size: 13px;
}

.dashboard-map-wheel-tip strong {
  min-width: 50px;
  color: #24587f;
  text-align: right;
}

.dashboard-map-grid {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

.dashboard-map-svg-label {
  fill: #5e89a7;
  font-size: 18px;
  font-weight: 700;
  letter-spacing: 0.04em;
}

.dashboard-map-node {
  position: absolute;
  z-index: 2;
  transform: translate(-50%, -50%);
}

.dashboard-map-node::before {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  transform: translate(-50%, -50%);
  background: currentColor;
  box-shadow: 0 0 0 8px rgba(45, 156, 219, 0.12);
}

.dashboard-map-node::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  transform: translate(-50%, -50%);
  border: 1px solid currentColor;
  opacity: 0.28;
}

.dashboard-map-node-core {
  min-width: 132px;
  padding: 12px 12px 12px 18px;
  margin-left: 16px;
  border-radius: 16px;
  border: 1px solid rgba(215, 227, 240, 0.88);
  background: rgba(255, 255, 255, 0.92);
  box-shadow: 0 16px 36px rgba(24, 50, 74, 0.14);
  backdrop-filter: blur(10px);
}

.dashboard-map-node-core strong,
.dashboard-map-node-core span,
.dashboard-map-node-core em {
  display: block;
}

.dashboard-map-node-core strong {
  color: var(--text);
  font-size: 15px;
}

.dashboard-map-node-core span,
.dashboard-map-node-core em {
  margin-top: 4px;
  font-size: 11px;
}

.dashboard-map-node-core span {
  color: var(--accent-deep);
}

.dashboard-map-node-core em {
  color: var(--muted);
  font-style: normal;
}

.dashboard-map-node.tone-offline,
.dashboard-map-hotspot.tone-offline {
  color: #d95454;
}

.dashboard-map-node.tone-warning,
.dashboard-map-hotspot.tone-warning {
  color: #d48a1f;
}

.dashboard-map-node.tone-monitor,
.dashboard-map-hotspot.tone-monitor {
  color: #2d8cff;
}

.dashboard-map-node.tone-online,
.dashboard-map-hotspot.tone-online {
  color: #1f9d68;
}

.dashboard-map-node.tone-neutral,
.dashboard-map-hotspot.tone-neutral {
  color: #6b8096;
}

.dashboard-map-legend {
  position: absolute;
  left: 30px;
  bottom: 28px;
  z-index: 3;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  padding: 12px 14px;
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.88);
  border: 1px solid rgba(215, 227, 240, 0.88);
  box-shadow: 0 12px 30px rgba(24, 50, 74, 0.1);
}

.dashboard-map-legend span {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--text);
  font-size: 12px;
}

.dashboard-map-legend i {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  display: inline-block;
}

.dashboard-map-legend .tone-offline {
  background: #d95454;
}

.dashboard-map-legend .tone-warning {
  background: #d48a1f;
}

.dashboard-map-legend .tone-monitor {
  background: #2d8cff;
}

.dashboard-map-legend .tone-online {
  background: #1f9d68;
}

.dashboard-map-hotspot strong {
  display: block;
  color: var(--text);
  margin-bottom: 6px;
}

.dashboard-map-hotspot > div:first-of-type {
  font-size: 12px;
}

.dashboard-topology {
  display: grid;
  gap: 14px;
}

.dashboard-floor {
  padding: 14px;
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.58);
  border: 1px solid rgba(215, 227, 240, 0.82);
}

.dashboard-floor-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 12px;
}

.dashboard-floor-name {
  font-size: 18px;
  color: var(--text);
  font-weight: 700;
}

.dashboard-floor-meta {
  color: var(--muted);
  font-size: 12px;
}

.dashboard-room-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
  gap: 10px;
}

.dashboard-room-card {
  padding: 12px;
  border-radius: 14px;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(233, 243, 255, 0.9));
  border: 1px solid rgba(215, 227, 240, 0.82);
  box-shadow: 0 10px 20px rgba(24, 50, 74, 0.08);
}

.dashboard-room-card.is-warning {
  border-color: rgba(212, 138, 31, 0.34);
}

.dashboard-room-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  color: var(--muted);
  font-size: 12px;
}

.dashboard-room-top strong {
  color: var(--text);
  font-size: 18px;
}

.dashboard-room-elders,
.dashboard-room-devices {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 10px;
}

.dashboard-room-elders span,
.dashboard-device-dot {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 8px;
  border-radius: 999px;
  font-size: 11px;
}

.dashboard-room-elders span {
  background: rgba(45, 156, 219, 0.08);
  color: var(--accent-deep);
}

.dashboard-device-dot {
  background: rgba(45, 156, 219, 0.08);
  color: var(--text);
}

.dashboard-device-dot.is-online {
  background: rgba(31, 157, 104, 0.12);
  color: var(--success);
}

.dashboard-device-dot.is-offline {
  background: rgba(204, 78, 78, 0.12);
  color: var(--danger);
}

.dashboard-device-dot.is-warning {
  background: rgba(212, 138, 31, 0.14);
  color: var(--warning);
}

.dashboard-device-dot.is-neutral {
  background: rgba(107, 128, 150, 0.14);
  color: var(--muted);
}

.dashboard-table-panel {
  min-height: 280px;
}

.dashboard-table-wrap {
  overflow: auto;
  border-radius: 14px;
  border: 1px solid rgba(215, 227, 240, 0.82);
}

.dashboard-table {
  min-width: 100%;
  border-collapse: collapse;
}

.dashboard-table th,
.dashboard-table td {
  padding: 12px 14px;
  border-bottom: 1px solid rgba(215, 227, 240, 0.85);
  text-align: left;
  color: var(--text);
  background: transparent;
}

.dashboard-table th {
  color: var(--muted);
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  background: rgba(249, 252, 255, 0.88);
}

.dashboard-table tbody tr:nth-child(odd) {
  background: rgba(45, 156, 219, 0.04);
}

.dashboard-event-route {
  min-width: 76px;
  padding: 7px 10px;
  white-space: nowrap;
}

.dashboard-panel-actions {
  margin-top: 14px;
  display: flex;
  justify-content: flex-end;
}

.dashboard-ops-board,
.dashboard-topology-board {
  display: grid;
  gap: 14px;
}

.dashboard-ops-group,
.dashboard-floor-block {
  padding: 16px;
  border-radius: 18px;
  border: 1px solid rgba(215, 227, 240, 0.88);
  background: rgba(255, 255, 255, 0.7);
}

.dashboard-ops-group-head,
.dashboard-floor-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 14px;
}

.dashboard-ops-group-head h3,
.dashboard-floor-header strong {
  margin: 0;
  font-size: 18px;
  color: var(--text);
}

.dashboard-ops-group-head p,
.dashboard-floor-header span,
.dashboard-room-meta {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.6;
}

.dashboard-staff-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.dashboard-staff-card {
  padding: 14px;
  border-radius: 16px;
  border: 1px solid rgba(215, 227, 240, 0.88);
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(241, 247, 252, 0.92));
}

.dashboard-staff-head,
.dashboard-staff-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.dashboard-staff-head strong {
  display: block;
  color: var(--text);
  font-size: 16px;
}

.dashboard-staff-metrics {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin-top: 12px;
}

.dashboard-staff-metrics div {
  padding: 10px;
  border-radius: 12px;
  background: rgba(45, 156, 219, 0.07);
  border: 1px solid rgba(215, 227, 240, 0.84);
}

.dashboard-staff-metrics span,
.dashboard-staff-metrics strong {
  display: block;
}

.dashboard-staff-metrics span {
  color: var(--muted);
  font-size: 12px;
}

.dashboard-staff-metrics strong {
  margin-top: 4px;
  color: var(--text);
  font-size: 22px;
}

.dashboard-chip-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 12px;
}

.dashboard-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 10px;
  border-radius: 999px;
  background: rgba(45, 156, 219, 0.08);
  color: var(--accent-deep);
  font-size: 12px;
  border: 1px solid rgba(215, 227, 240, 0.82);
}

.dashboard-chip.is-button {
  cursor: pointer;
  background: rgba(255, 255, 255, 0.92);
}

.dashboard-chip.muted {
  color: var(--muted);
}

.dashboard-room-card.is-clickable {
  cursor: pointer;
  text-align: left;
}

.dashboard-room-card.is-clickable:hover {
  border-color: rgba(45, 156, 219, 0.3);
  transform: translateY(-1px);
}

.dashboard-room-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 10px;
}

.dashboard-app-shell {
  background:
    radial-gradient(circle at top center, rgba(42, 166, 255, 0.18), transparent 18%),
    radial-gradient(circle at 20% 20%, rgba(54, 222, 255, 0.14), transparent 22%),
    linear-gradient(180deg, #07162a 0%, #091c31 46%, #081628 100%);
}

.dashboard-app-shell .sidebar {
  background: rgba(6, 19, 35, 0.88);
  border-right: 1px solid rgba(67, 164, 255, 0.2);
}

.dashboard-app-shell .brand-card,
.dashboard-app-shell .sidebar-group {
  background: linear-gradient(180deg, rgba(10, 28, 49, 0.94), rgba(7, 21, 38, 0.9));
  border: 1px solid rgba(55, 160, 255, 0.22);
  box-shadow: 0 18px 45px rgba(0, 0, 0, 0.28);
}

.dashboard-app-shell .brand-title,
.dashboard-app-shell .user-chip strong,
.dashboard-app-shell .nav-button,
.dashboard-screen-reference,
.dashboard-screen-reference .dashboard-panel-head h2,
.dashboard-screen-reference .dashboard-list-item strong,
.dashboard-screen-reference .dashboard-map-metric strong,
.dashboard-screen-reference .dashboard-bar-copy,
.dashboard-screen-reference .dashboard-donut-core strong {
  color: #ecf7ff;
}

.dashboard-app-shell .brand-kicker,
.dashboard-app-shell .nav-label,
.dashboard-app-shell .brand-subtitle,
.dashboard-app-shell .user-chip .muted,
.dashboard-screen-reference .dashboard-item-meta,
.dashboard-screen-reference .dashboard-chart-note,
.dashboard-screen-reference .dashboard-panel-head span,
.dashboard-screen-reference .dashboard-map-svg-label,
.dashboard-screen-reference .dashboard-donut-core span,
.dashboard-screen-reference .dashboard-list-item div,
.dashboard-screen-reference .dashboard-list-item span,
.dashboard-screen-reference .dashboard-customer-code,
.dashboard-screen-reference .dashboard-customer-foot,
.dashboard-screen-reference .dashboard-sparkline-labels,
.dashboard-screen-reference .dashboard-scope {
  color: rgba(187, 223, 255, 0.78);
}

.dashboard-app-shell .nav-button {
  border: 1px solid rgba(66, 174, 255, 0.12);
}

.dashboard-app-shell .nav-button:hover,
.dashboard-app-shell .nav-button.active {
  background: linear-gradient(135deg, rgba(33, 112, 214, 0.92), rgba(42, 206, 255, 0.82));
  color: #f4fbff;
  border-color: rgba(90, 203, 255, 0.38);
  box-shadow: 0 10px 24px rgba(19, 123, 204, 0.32);
}

.dashboard-app-shell .ghost-button {
  background: rgba(28, 112, 194, 0.18);
  color: #8feaff;
}

.dashboard-screen-reference {
  position: relative;
  min-height: 100vh;
  padding: 12px 18px 24px;
  overflow: hidden;
  background:
    radial-gradient(circle at 50% 0%, rgba(49, 153, 255, 0.1), transparent 22%),
    linear-gradient(180deg, rgba(3, 17, 32, 0.9), rgba(6, 23, 40, 0.86));
}

.dashboard-screen-reference::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(90deg, transparent 0 8%, rgba(73, 169, 255, 0.08) 8% 8.2%, transparent 8.2% 91.8%, rgba(73, 169, 255, 0.08) 91.8% 92%, transparent 92%),
    linear-gradient(180deg, rgba(84, 194, 255, 0.05), transparent 140px);
  pointer-events: none;
}

.dashboard-screen-reference .dashboard-topbar-reference {
  grid-template-columns: 280px minmax(0, 1fr) 240px;
  position: relative;
  z-index: 1;
  align-items: center;
  padding: 0 4px 14px;
  border-bottom: 1px solid rgba(66, 164, 255, 0.18);
}

.dashboard-screen-reference .dashboard-topbar-reference::before,
.dashboard-screen-reference .dashboard-topbar-reference::after {
  content: "";
  position: absolute;
  top: 6px;
  width: 220px;
  height: 16px;
  background:
    linear-gradient(90deg, rgba(44, 180, 255, 0.34), rgba(44, 180, 255, 0)),
    linear-gradient(90deg, transparent 0 78%, rgba(80, 206, 255, 0.42) 78% 82%, transparent 82% 100%);
  opacity: 0.78;
}

.dashboard-screen-reference .dashboard-topbar-reference::before {
  left: 0;
}

.dashboard-screen-reference .dashboard-topbar-reference::after {
  right: 0;
  transform: scaleX(-1);
}

.dashboard-screen-reference .dashboard-topbar-block {
  position: relative;
  z-index: 1;
}

.dashboard-screen-reference .dashboard-clock {
  color: #dff7ff;
  font-size: 30px;
  text-shadow: 0 0 12px rgba(66, 212, 255, 0.3);
}

.dashboard-screen-reference .dashboard-topbar-company {
  color: rgba(173, 226, 255, 0.92);
  font-size: 13px;
  letter-spacing: 0.18em;
}

.dashboard-screen-reference .dashboard-center-title-reference {
  position: relative;
  border: 1px solid rgba(68, 167, 255, 0.22);
  background:
    linear-gradient(135deg, rgba(7, 25, 44, 0.96), rgba(11, 37, 63, 0.9)),
    rgba(7, 25, 44, 0.94);
  box-shadow: inset 0 0 0 1px rgba(81, 208, 255, 0.06), 0 20px 50px rgba(0, 0, 0, 0.22);
  clip-path: polygon(4% 0, 96% 0, 100% 36%, 100% 100%, 0 100%, 0 36%);
}

.dashboard-screen-reference .dashboard-center-title-reference::before,
.dashboard-screen-reference .dashboard-center-title-reference::after {
  background: linear-gradient(90deg, rgba(79, 216, 255, 0.2), transparent);
}

.dashboard-screen-reference .dashboard-center-title-reference h1 {
  color: #dff6ff;
  font-size: 36px;
  letter-spacing: 0.08em;
}

.dashboard-command-grid {
  display: grid;
  grid-template-columns: 320px minmax(0, 1fr) 320px;
  gap: 16px;
  align-items: start;
  position: relative;
  z-index: 1;
}

.dashboard-side-stack,
.dashboard-command-main {
  display: grid;
  gap: 16px;
}

.dashboard-tech-panel,
.dashboard-screen-reference .dashboard-module-card-reference,
.dashboard-screen-reference .dashboard-stage-panel-reference,
.dashboard-screen-reference .dashboard-table-panel-reference,
.dashboard-screen-reference .dashboard-panel,
.dashboard-screen-reference .dashboard-status-card,
.dashboard-screen-reference .dashboard-map-hotspot,
.dashboard-screen-reference .dashboard-map-metric,
.dashboard-screen-reference .dashboard-detail-summary article,
.dashboard-screen-reference .dashboard-inline-stats article,
.dashboard-screen-reference .dashboard-customer-card,
.dashboard-screen-reference .dashboard-list-item,
.dashboard-screen-reference .dashboard-detail-section {
  position: relative;
  border-radius: 16px;
  border: 1px solid rgba(65, 163, 255, 0.22);
  background:
    linear-gradient(180deg, rgba(8, 26, 45, 0.94), rgba(6, 19, 35, 0.92)),
    rgba(7, 21, 39, 0.94);
  box-shadow: inset 0 0 0 1px rgba(84, 212, 255, 0.03), 0 16px 40px rgba(0, 0, 0, 0.22);
}

.dashboard-tech-panel::before,
.dashboard-screen-reference .dashboard-stage-panel-reference::before,
.dashboard-screen-reference .dashboard-table-panel-reference::before,
.dashboard-screen-reference .dashboard-panel::before {
  content: "";
  position: absolute;
  top: 0;
  left: 16px;
  width: 108px;
  height: 4px;
  border-radius: 999px;
  background: linear-gradient(90deg, rgba(47, 203, 255, 0.92), rgba(47, 203, 255, 0));
}

.dashboard-tech-panel {
  padding: 16px;
}

.dashboard-tech-title {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin: 0 0 8px;
  padding: 0 22px 0 0;
  font-size: 18px;
  font-weight: 700;
  color: #effbff;
  line-height: 1.2;
  background:
    linear-gradient(90deg, rgba(17, 89, 176, 0.86), rgba(24, 128, 212, 0.38) 72%, transparent 72%);
  min-height: 28px;
}

.dashboard-tech-title::before,
.dashboard-screen-reference .dashboard-panel-head h2::before {
  content: "//";
  color: #29ddff;
  font-size: 20px;
  font-weight: 800;
  letter-spacing: -0.1em;
}

.dashboard-tech-title::after,
.dashboard-screen-reference .dashboard-panel-head h2::after {
  content: "";
  position: absolute;
  right: 4px;
  top: 50%;
  width: 28px;
  height: 12px;
  transform: translateY(-50%) skewX(-40deg);
  background: linear-gradient(90deg, rgba(50, 182, 255, 0.42), rgba(50, 182, 255, 0));
}

.dashboard-tech-meta {
  margin-bottom: 12px;
  color: rgba(187, 223, 255, 0.72);
  font-size: 13px;
}

.dashboard-sparkline-board {
  position: relative;
  padding: 10px 12px 12px;
  border-radius: 14px;
  border: 1px solid rgba(56, 149, 231, 0.18);
  background: linear-gradient(180deg, rgba(7, 23, 40, 0.74), rgba(4, 16, 28, 0.68));
}

.dashboard-sparkline-labels {
  display: flex;
  justify-content: space-between;
  margin-top: 6px;
  font-size: 11px;
}

.dashboard-screen-reference .dashboard-kpi-row-reference {
  margin-bottom: 0;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}
.dashboard-screen-reference .dashboard-kpi-row-reference .dashboard-module-card { padding: 12px 14px; }
.dashboard-screen-reference .dashboard-kpi-row-reference .dashboard-module-card span { font-size: 12px; }
.dashboard-screen-reference .dashboard-kpi-row-reference .dashboard-module-card strong { font-size: 20px; }
.dashboard-screen-reference .dashboard-kpi-row-reference .dashboard-module-card em { font-size: 11px; }
}

.dashboard-screen-reference .dashboard-module-card-reference {
  min-height: 108px;
  padding-top: 18px;
}

.dashboard-screen-reference .dashboard-module-card-reference::before {
  content: "";
  width: 42px;
  height: 42px;
  position: absolute;
  top: 12px;
  right: 14px;
  clip-path: polygon(25% 6%, 75% 6%, 94% 50%, 75% 94%, 25% 94%, 6% 50%);
  border: 1px solid rgba(72, 208, 255, 0.34);
  background:
    radial-gradient(circle at 50% 50%, rgba(76, 221, 255, 0.3), rgba(76, 221, 255, 0.05));
  box-shadow: 0 0 18px rgba(69, 208, 255, 0.14);
}

.dashboard-screen-reference .dashboard-module-card-reference strong {
  color: #65eeff;
  text-shadow: 0 0 14px rgba(78, 226, 255, 0.24);
}

.dashboard-screen-reference .dashboard-module-card-reference em {
  color: rgba(175, 223, 255, 0.82);
}

.dashboard-screen-reference .dashboard-stage-panel-reference,
.dashboard-screen-reference .dashboard-table-panel-reference,
.dashboard-screen-reference .dashboard-panel {
  padding: 16px;
}

.dashboard-screen-reference .dashboard-panel-head {
  align-items: start;
}

.dashboard-screen-reference .dashboard-panel-head h2 {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  min-height: 30px;
  margin: 0;
  padding-right: 34px;
  font-size: 18px;
  background:
    linear-gradient(90deg, rgba(17, 89, 176, 0.86), rgba(24, 128, 212, 0.34) 74%, transparent 74%);
}

.dashboard-screen-reference .dashboard-detail-summary {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.dashboard-screen-reference .dashboard-detail-summary article strong,
.dashboard-screen-reference .dashboard-inline-stats article strong,
.dashboard-screen-reference .dashboard-customer-metrics article strong,
.dashboard-screen-reference .dashboard-status-card strong,
.dashboard-screen-reference .dashboard-map-metric strong {
  color: #59e5ff;
}

.dashboard-screen-reference .dashboard-alert-hero {
  width: 168px;
  min-height: 168px;
  border: 4px solid rgba(58, 176, 255, 0.24);
  box-shadow: 0 0 0 10px rgba(34, 144, 255, 0.08), 0 0 24px rgba(57, 209, 255, 0.18);
  background: radial-gradient(circle at center, rgba(12, 50, 82, 0.96), rgba(7, 23, 38, 0.92));
}

.dashboard-screen-reference .dashboard-alert-hero strong {
  color: #f5fbff;
}

.dashboard-screen-reference .dashboard-bar-track {
  background: rgba(49, 129, 202, 0.16);
}

.dashboard-screen-reference .dashboard-map-canvas-dark {
  min-height: 430px;
  border: 1px solid rgba(66, 163, 255, 0.2);
  background:
    radial-gradient(circle at 50% 50%, rgba(39, 157, 246, 0.1), transparent 42%),
    radial-gradient(circle at 50% 18%, rgba(26, 127, 212, 0.24), transparent 24%),
    linear-gradient(90deg, rgba(23, 95, 164, 0.08) 1px, transparent 1px),
    linear-gradient(rgba(23, 95, 164, 0.08) 1px, transparent 1px),
    radial-gradient(circle at 50% 20%, rgba(26, 127, 212, 0.16), transparent 30%),
    linear-gradient(180deg, rgba(7, 22, 38, 0.94), rgba(5, 18, 31, 0.94));
  background-size: auto, auto, 28px 28px, 28px 28px, auto, auto;
}

.dashboard-screen-reference .dashboard-map-summary {
  gap: 12px;
}

.dashboard-screen-reference .dashboard-map-metric {
  padding: 12px 14px;
  border-radius: 12px;
  background:
    linear-gradient(180deg, rgba(10, 34, 57, 0.92), rgba(8, 24, 41, 0.94)),
    rgba(8, 24, 41, 0.94);
}

.dashboard-screen-reference .dashboard-map-hotspots {
  gap: 12px;
}

.dashboard-screen-reference .dashboard-map-hotspot {
  border-radius: 12px;
  background:
    linear-gradient(180deg, rgba(9, 31, 54, 0.86), rgba(7, 22, 39, 0.92)),
    rgba(7, 22, 39, 0.92);
}

.dashboard-screen-reference .dashboard-map-node {
  color: #7dcfff;
}

.dashboard-screen-reference .dashboard-map-node.is-selected::before {
  width: 22px;
  height: 22px;
  box-shadow: 0 0 0 10px rgba(48, 214, 255, 0.16);
}

.dashboard-screen-reference .dashboard-map-node.is-selected .dashboard-map-node-core {
  border-color: rgba(91, 236, 255, 0.42);
  box-shadow: 0 18px 36px rgba(0, 0, 0, 0.28), 0 0 22px rgba(52, 216, 255, 0.12);
}

.dashboard-screen-reference .dashboard-map-node-core {
  min-width: 152px;
  margin-left: 10px;
  padding: 12px 14px 12px 16px;
  border: 1px solid rgba(67, 164, 255, 0.24);
  border-radius: 18px;
  background:
    linear-gradient(180deg, rgba(13, 40, 67, 0.96), rgba(7, 24, 42, 0.94)),
    rgba(10, 29, 49, 0.94);
  box-shadow: 0 14px 28px rgba(0, 0, 0, 0.22);
}

.dashboard-screen-reference .dashboard-map-node-core strong {
  color: #effbff;
  font-size: 18px;
}

.dashboard-screen-reference .dashboard-map-node-core span,
.dashboard-screen-reference .dashboard-map-node-core em {
  color: rgba(188, 223, 255, 0.74);
}

.dashboard-screen-reference .dashboard-map-node.tone-offline {
  color: #ff626c;
}

.dashboard-screen-reference .dashboard-map-node.tone-warning {
  color: #ffb44d;
}

.dashboard-screen-reference .dashboard-map-node.tone-monitor {
  color: #5ed8ff;
}

.dashboard-screen-reference .dashboard-map-node.tone-online {
  color: #31e4c7;
}

.dashboard-screen-reference .dashboard-table th {
  background: rgba(10, 29, 49, 0.98);
  color: rgba(175, 223, 255, 0.78);
  border-bottom-color: rgba(64, 150, 228, 0.12);
}

.dashboard-screen-reference .dashboard-table td {
  color: #e8f7ff;
  border-bottom-color: rgba(64, 150, 228, 0.1);
}

.dashboard-screen-reference .dashboard-table tbody tr:nth-child(odd) {
  background: rgba(14, 39, 66, 0.42);
}

.dashboard-screen-reference .dashboard-table tbody tr:hover {
  background: rgba(19, 74, 118, 0.42);
}

.dashboard-screen-reference .dashboard-donut {
  box-shadow: inset 0 0 0 1px rgba(94, 213, 255, 0.2), 0 0 18px rgba(39, 195, 255, 0.12);
}

.dashboard-screen-reference .dashboard-donut-core {
  background: rgba(9, 28, 47, 0.94);
}

.dashboard-screen-reference .tag.info,
.dashboard-screen-reference .tag.success,
.dashboard-screen-reference .tag.warning,
.dashboard-screen-reference .tag.danger,
.dashboard-screen-reference .tag.neutral {
  border: 1px solid rgba(255, 255, 255, 0.08);
}

.dashboard-screen-reference .dashboard-customer-card.selected {
  background:
    linear-gradient(180deg, rgba(13, 37, 62, 0.96), rgba(8, 25, 42, 0.94)),
    rgba(8, 25, 42, 0.94);
  border-color: rgba(81, 229, 255, 0.34);
}

.dashboard-app-shell.dashboard-app-shell-soft {
  background:
    radial-gradient(circle at 24% 14%, rgba(167, 214, 246, 0.42), transparent 18%),
    radial-gradient(circle at 76% 18%, rgba(212, 233, 249, 0.4), transparent 18%),
    linear-gradient(180deg, #f8fbff 0%, #edf5fd 42%, #e7f1fb 100%);
}

.dashboard-app-shell.dashboard-app-shell-soft .sidebar {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.94) 0%, rgba(244, 249, 255, 0.92) 100%);
  border-right: 1px solid rgba(217, 232, 247, 0.92);
}

.dashboard-app-shell.dashboard-app-shell-soft .brand-card,
.dashboard-app-shell.dashboard-app-shell-soft .sidebar-group {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.97) 0%, rgba(245, 250, 255, 0.95) 100%);
  border: 1px solid rgba(217, 232, 247, 0.95);
  box-shadow: 0 20px 48px rgba(71, 125, 179, 0.12);
}

.dashboard-app-shell.dashboard-app-shell-soft .brand-title,
.dashboard-app-shell.dashboard-app-shell-soft .user-chip strong,
.dashboard-app-shell.dashboard-app-shell-soft .nav-button {
  color: #243d59;
}

.dashboard-app-shell.dashboard-app-shell-soft .brand-kicker,
.dashboard-app-shell.dashboard-app-shell-soft .nav-label,
.dashboard-app-shell.dashboard-app-shell-soft .brand-subtitle,
.dashboard-app-shell.dashboard-app-shell-soft .user-chip .muted {
  color: #6e89a6;
}

.dashboard-app-shell.dashboard-app-shell-soft .nav-button {
  border: 1px solid rgba(217, 232, 247, 0.95);
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.9) 0%, rgba(248, 252, 255, 0.88) 100%);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.7);
}

.dashboard-app-shell.dashboard-app-shell-soft .nav-button:hover,
.dashboard-app-shell.dashboard-app-shell-soft .nav-button.active {
  background: linear-gradient(135deg, #4ea7e3 0%, #89c8ef 100%);
  color: #ffffff;
  border-color: rgba(135, 196, 234, 0.95);
  box-shadow: 0 12px 24px rgba(79, 168, 228, 0.24);
}

.dashboard-app-shell.dashboard-app-shell-soft .ghost-button {
  background: linear-gradient(180deg, rgba(226, 240, 251, 0.92), rgba(236, 246, 253, 0.9));
  color: #2f7fb8;
  border-color: rgba(210, 228, 244, 0.96);
}

.dashboard-screen-scoped-soft,
.dashboard-screen-scoped-soft .dashboard-panel-head h2,
.dashboard-screen-scoped-soft .dashboard-list-item strong,
.dashboard-screen-scoped-soft .dashboard-map-metric strong,
.dashboard-screen-scoped-soft .dashboard-bar-copy,
.dashboard-screen-scoped-soft .dashboard-donut-core strong {
  color: #213d58;
}

.dashboard-screen-scoped-soft .dashboard-item-meta,
.dashboard-screen-scoped-soft .dashboard-chart-note,
.dashboard-screen-scoped-soft .dashboard-panel-head span,
.dashboard-screen-scoped-soft .dashboard-map-svg-label,
.dashboard-screen-scoped-soft .dashboard-donut-core span,
.dashboard-screen-scoped-soft .dashboard-list-item div,
.dashboard-screen-scoped-soft .dashboard-list-item span,
.dashboard-screen-scoped-soft .dashboard-sparkline-labels,
.dashboard-screen-scoped-soft .dashboard-scope,
.dashboard-screen-scoped-soft .dashboard-tech-meta {
  color: #6c86a1;
}

.dashboard-screen-scoped-soft {
  background:
    radial-gradient(circle at 50% 0%, rgba(196, 227, 248, 0.4), transparent 18%),
    linear-gradient(180deg, rgba(248, 252, 255, 0.9), rgba(237, 245, 253, 0.94));
}

.dashboard-screen-scoped-soft::before {
  background:
    linear-gradient(90deg, transparent 0 8%, rgba(217, 232, 247, 0.5) 8% 8.14%, transparent 8.14% 91.86%, rgba(217, 232, 247, 0.5) 91.86% 92%, transparent 92%),
    linear-gradient(180deg, rgba(223, 238, 249, 0.46), transparent 130px);
}

.dashboard-screen-scoped-soft .dashboard-topbar-reference {
  border-bottom-color: rgba(217, 232, 247, 0.92);
}

.dashboard-screen-scoped-soft .dashboard-topbar-reference::before,
.dashboard-screen-scoped-soft .dashboard-topbar-reference::after {
  background:
    linear-gradient(90deg, rgba(166, 213, 245, 0.56), rgba(166, 213, 245, 0)),
    linear-gradient(90deg, transparent 0 78%, rgba(206, 231, 249, 0.72) 78% 82%, transparent 82% 100%);
}

.dashboard-screen-scoped-soft .dashboard-clock {
  color: #254463;
  text-shadow: none;
}

.dashboard-screen-scoped-soft .dashboard-topbar-company {
  color: #6e89a6;
}

.dashboard-screen-scoped-soft .dashboard-center-title-reference {
  border-color: rgba(217, 232, 247, 0.95);
  background:
    radial-gradient(circle at left top, rgba(183, 221, 246, 0.46), transparent 34%),
    linear-gradient(135deg, rgba(247, 252, 255, 0.98), rgba(237, 245, 253, 0.98)),
    rgba(248, 252, 255, 0.96);
  box-shadow: 0 18px 42px rgba(71, 125, 179, 0.12);
}

.dashboard-screen-scoped-soft .dashboard-center-title-reference::before,
.dashboard-screen-scoped-soft .dashboard-center-title-reference::after {
  background: linear-gradient(90deg, rgba(169, 212, 241, 0.58), transparent);
}

.dashboard-screen-scoped-soft .dashboard-center-title-reference h1 {
  color: #203b57;
}

.dashboard-screen-scoped-soft .dashboard-tech-panel,
.dashboard-screen-scoped-soft .dashboard-module-card-reference,
.dashboard-screen-scoped-soft .dashboard-stage-panel-reference,
.dashboard-screen-scoped-soft .dashboard-table-panel-reference,
.dashboard-screen-scoped-soft .dashboard-panel,
.dashboard-screen-scoped-soft .dashboard-status-card,
.dashboard-screen-scoped-soft .dashboard-map-hotspot,
.dashboard-screen-scoped-soft .dashboard-map-metric,
.dashboard-screen-scoped-soft .dashboard-detail-summary article,
.dashboard-screen-scoped-soft .dashboard-inline-stats article,
.dashboard-screen-scoped-soft .dashboard-list-item,
.dashboard-screen-scoped-soft .dashboard-detail-section {
  border: 1px solid rgba(217, 232, 247, 0.95);
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.97), rgba(242, 248, 255, 0.95)),
    rgba(250, 253, 255, 0.94);
  box-shadow: 0 16px 36px rgba(71, 125, 179, 0.1);
}

.dashboard-screen-scoped-soft .dashboard-tech-panel::before,
.dashboard-screen-scoped-soft .dashboard-stage-panel-reference::before,
.dashboard-screen-scoped-soft .dashboard-table-panel-reference::before,
.dashboard-screen-scoped-soft .dashboard-panel::before {
  background: linear-gradient(90deg, rgba(86, 174, 230, 0.96), rgba(86, 174, 230, 0));
}

.dashboard-screen-scoped-soft .dashboard-tech-title,
.dashboard-screen-scoped-soft .dashboard-panel-head h2 {
  color: #213d58;
}

.dashboard-screen-scoped-soft .dashboard-tech-title {
  background: linear-gradient(90deg, rgba(78, 167, 227, 0.9), rgba(210, 233, 249, 0.76) 72%, transparent 72%);
}

.dashboard-screen-scoped-soft .dashboard-tech-title::before,
.dashboard-screen-scoped-soft .dashboard-panel-head h2::before {
  color: #ffffff;
}

.dashboard-screen-scoped-soft .dashboard-tech-title::after,
.dashboard-screen-scoped-soft .dashboard-panel-head h2::after {
  background: linear-gradient(90deg, rgba(154, 207, 241, 0.74), rgba(154, 207, 241, 0));
}

.dashboard-screen-scoped-soft .dashboard-module-card-reference strong,
.dashboard-screen-scoped-soft .dashboard-detail-summary article strong,
.dashboard-screen-scoped-soft .dashboard-inline-stats article strong,
.dashboard-screen-scoped-soft .dashboard-customer-metrics article strong,
.dashboard-screen-scoped-soft .dashboard-status-card strong,
.dashboard-screen-scoped-soft .dashboard-map-metric strong {
  color: #1f3d59;
  text-shadow: none;
}

.dashboard-screen-scoped-soft .dashboard-module-card-reference em {
  color: #2f7fb8;
}

.dashboard-screen-scoped-soft .dashboard-module-card-reference::before {
  border-color: rgba(178, 217, 243, 0.92);
  background: radial-gradient(circle at 50% 50%, rgba(232, 243, 252, 0.9), rgba(209, 231, 248, 0.68));
  box-shadow: none;
}

.dashboard-screen-scoped-soft .dashboard-sparkline-board {
  border-color: rgba(217, 232, 247, 0.95);
  background: linear-gradient(180deg, rgba(248, 252, 255, 0.94), rgba(237, 245, 253, 0.92));
}

.dashboard-screen-scoped-soft .dashboard-alert-hero {
  border-color: rgba(205, 225, 243, 0.95);
  box-shadow: 0 0 0 10px rgba(232, 242, 250, 0.92);
  background: radial-gradient(circle at center, rgba(255, 255, 255, 0.99), rgba(237, 245, 253, 0.96));
}

.dashboard-screen-scoped-soft .dashboard-alert-hero strong {
  color: #203d58;
}

.dashboard-screen-scoped-soft .dashboard-bar-track {
  background: rgba(217, 232, 247, 0.78);
}

.dashboard-screen-scoped-soft .dashboard-bar-fill {
  background: linear-gradient(90deg, #8bc8ef, #4ea7e3);
}

.dashboard-screen-scoped-soft .dashboard-bar-fill.warning {
  background: linear-gradient(90deg, #f1c069, #d79836);
}

.dashboard-screen-scoped-soft .dashboard-bar-fill.danger {
  background: linear-gradient(90deg, #eb9aa5, #d96a78);
}

.dashboard-screen-scoped-soft .dashboard-bar-fill.success {
  background: linear-gradient(90deg, #7ec8a0, #23a06d);
}

.dashboard-screen-scoped-soft .dashboard-map-canvas-dark {
  border-color: rgba(217, 232, 247, 0.95);
  background:
    radial-gradient(circle at 50% 50%, rgba(226, 241, 252, 0.62), transparent 42%),
    radial-gradient(circle at 50% 18%, rgba(209, 231, 248, 0.72), transparent 24%),
    linear-gradient(90deg, rgba(217, 232, 247, 0.34) 1px, transparent 1px),
    linear-gradient(rgba(217, 232, 247, 0.34) 1px, transparent 1px),
    linear-gradient(180deg, rgba(250, 253, 255, 0.98), rgba(237, 245, 253, 0.98));
  background-size: auto, auto, 28px 28px, 28px 28px, auto;
}

.dashboard-screen-scoped-soft .dashboard-map-metric,
.dashboard-screen-scoped-soft .dashboard-map-hotspot {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.97), rgba(242, 248, 255, 0.95)),
    rgba(250, 253, 255, 0.96);
}

.dashboard-screen-scoped-soft .dashboard-map-node {
  color: #56aee6;
}

.dashboard-screen-scoped-soft .dashboard-map-node.is-selected::before {
  box-shadow: 0 0 0 10px rgba(217, 232, 247, 0.82);
}

.dashboard-screen-scoped-soft .dashboard-map-node.is-selected .dashboard-map-node-core {
  border-color: rgba(169, 212, 241, 0.95);
  box-shadow: 0 14px 28px rgba(71, 125, 179, 0.12);
}

.dashboard-screen-scoped-soft .dashboard-map-node-core {
  border-color: rgba(217, 232, 247, 0.95);
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(242, 248, 255, 0.96)),
    rgba(252, 254, 255, 0.96);
  box-shadow: 0 12px 28px rgba(71, 125, 179, 0.1);
}

.dashboard-screen-scoped-soft .dashboard-map-node-core strong {
  color: #203d58;
}

.dashboard-screen-scoped-soft .dashboard-map-node-core span,
.dashboard-screen-scoped-soft .dashboard-map-node-core em {
  color: #6e89a6;
}

.dashboard-screen-scoped-soft .dashboard-map-node.tone-offline {
  color: #d96a78;
}

.dashboard-screen-scoped-soft .dashboard-map-node.tone-warning {
  color: #d79836;
}

.dashboard-screen-scoped-soft .dashboard-map-node.tone-monitor {
  color: #56aee6;
}

.dashboard-screen-scoped-soft .dashboard-map-node.tone-online {
  color: #23a06d;
}

.dashboard-screen-scoped-soft .dashboard-table th {
  background: rgba(245, 250, 255, 0.98);
  color: #6e89a6;
  border-bottom-color: rgba(217, 232, 247, 0.95);
}

.dashboard-screen-scoped-soft .dashboard-table td {
  color: #223e59;
  border-bottom-color: rgba(217, 232, 247, 0.9);
}

.dashboard-screen-scoped-soft .dashboard-table tbody tr:nth-child(odd) {
  background: rgba(248, 252, 255, 0.92);
}

.dashboard-screen-scoped-soft .dashboard-table tbody tr:hover {
  background: rgba(237, 245, 253, 0.98);
}

.dashboard-screen-scoped-soft .dashboard-donut {
  box-shadow: inset 0 0 0 1px rgba(217, 232, 247, 0.95), 0 12px 28px rgba(71, 125, 179, 0.1);
}

.dashboard-screen-scoped-soft .dashboard-donut-core {
  background: rgba(248, 252, 255, 0.98);
}

.dashboard-screen-scoped-soft .tag.info,
.dashboard-screen-scoped-soft .tag.success,
.dashboard-screen-scoped-soft .tag.warning,
.dashboard-screen-scoped-soft .tag.danger,
.dashboard-screen-scoped-soft .tag.neutral {
  border: 1px solid rgba(217, 232, 247, 0.95);
  background: rgba(250, 253, 255, 0.92);
}

.dashboard-screen-scoped-soft .dashboard-room-tag {
  background: rgba(86, 174, 230, 0.12);
  color: #2f7fb8;
}

.ops-metrics {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 14px;
  margin: 16px 0 14px;
}

.ops-metric-card {
  padding: 18px;
  border: 1px solid rgba(207, 226, 245, 0.82);
  border-radius: 18px;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(238, 247, 255, 0.88));
  box-shadow: 0 12px 26px rgba(27, 68, 105, 0.08);
}

.ops-metric-card span,
.ops-metric-card em {
  display: block;
  color: var(--muted);
  font-size: 12px;
  font-style: normal;
}

.ops-metric-card strong {
  display: block;
  margin: 8px 0 6px;
  color: var(--text);
  font-size: 28px;
  line-height: 1;
}

.ops-alert-bar {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
  margin-bottom: 16px;
}

.ops-alert-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-height: 72px;
  padding: 18px;
  border: 1px solid rgba(207, 226, 245, 0.82);
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.9);
  color: var(--text);
  text-align: left;
  box-shadow: 0 12px 26px rgba(27, 68, 105, 0.07);
}

.ops-alert-card.warning {
  background: rgba(255, 247, 230, 0.94);
  border-color: rgba(212, 138, 31, 0.28);
}

.ops-alert-card.danger {
  background: rgba(255, 235, 235, 0.94);
  border-color: rgba(214, 69, 69, 0.28);
}

.ops-alert-card.neutral {
  background: rgba(238, 247, 255, 0.92);
}

.ops-alert-card span {
  font-size: 15px;
  font-weight: 800;
}

.ops-alert-card em {
  flex-shrink: 0;
  color: var(--muted);
  font-size: 12px;
  font-style: normal;
}

@media (max-width: 1080px) {
  .app-shell,
  .content-grid,
  .billing-grid,
  .form-columns {
    grid-template-columns: 1fr;
  }

  .login-shell { grid-template-columns: 1fr; }
  .login-experience { min-height: 380px; }
  .login-auth { min-height: auto; }

  .dashboard-topbar,
  .dashboard-grid,
  .dashboard-command-grid,
  .dashboard-platform-grid,
  .dashboard-kpi-row,
  .dashboard-status-grid,
  .dashboard-observe-grid,
  .dashboard-detail-summary,
  .dashboard-inline-stats,
  .ops-metrics,
  .ops-alert-bar,
  .permission-grid,
  .dashboard-donut-wrap,
  .dashboard-map-summary,
  .dashboard-map-hotspots {
    grid-template-columns: 1fr;
  }

  .dashboard-staff-grid {
    grid-template-columns: 1fr;
  }

  .dashboard-map-toolbar {
    flex-direction: column;
    align-items: flex-start;
  }

  .dashboard-main {
    padding: 12px;
  }

  .dashboard-map-canvas {
    min-height: 560px;
  }

  .dashboard-map-node {
    transform: translate(-50%, -50%) scale(0.94);
  }

  .dashboard-map-legend {
    right: 18px;
    left: 18px;
  }

  .dashboard-topbar-block.align-end {
    justify-items: start;
  }

  .dashboard-center-title h1 {
    font-size: 28px;
  }

  .sidebar {
    border-right: 0;
    border-bottom: 1px solid var(--line);
  }

  .main {
    padding: 18px;
  }

  .hero-card {
    flex-direction: column;
    align-items: flex-start;
  }

  .page-context {
    align-items: flex-start;
    flex-direction: column;
  }
}

@media (max-width: 720px) {
  .sidebar,
  .hero-card,
  .panel,
  .detail-card,
  .empty-card,
  .login-auth {
    padding: 18px;
  }

  .hero-title,
  .login-experience { min-height: 280px; }
  .login-photo { object-position: 38% 58%; }
  .login-story { right: 24px; left: 24px; bottom: 30px; }
  .login-story p { margin-bottom: 8px; font-size: 10px; }
  .login-story h2 { font-size: 32px; }
  .login-story span { margin-top: 12px; font-size: 13px; line-height: 1.55; }
  .login-auth-content { margin: 0; padding: 54px 0 34px; }
  .login-auth-content h1 { font-size: 36px; }

  .dashboard-clock {
    font-size: 22px;
  }

  .dashboard-kpi-card strong {
    font-size: 28px;
  }
}

.care-worker-strip {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}

.care-avatar {
  display: grid;
  grid-template-columns: 44px 1fr;
  gap: 4px 10px;
  align-items: center;
  min-width: 180px;
  padding: 12px;
  border: 1px dashed #9ed4f3;
  border-radius: 16px;
  background: #f5fbff;
  color: #1f2d3d;
  text-align: left;
}

/* ====== 上门调度 ====== */
.dp-top { display: grid; gap: 14px; margin-bottom: 14px; }
.dp-summary { padding: 22px; border-radius: 26px; background: var(--panel); border: 1px solid var(--line); }
.dp-stats { display: grid; grid-template-columns: repeat(5, 1fr); gap: 10px; margin-top: 14px; }
.dp-stat { padding: 12px; border-radius: 14px; text-align: center; background: rgba(86,174,230,0.04); border: 1px solid var(--line); place-items: center; display: grid; gap: 4px; }
.dp-stat strong { display: block; font-size: 26px; color: var(--text); }
.dp-stat span { font-size: 11px; color: var(--muted); }
.dp-stat.is-pending { border-color: rgba(217,144,47,0.3); background: rgba(217,144,47,0.06); }
.dp-stat.is-pending strong { color: #d9902f; }
.dp-stat.is-active { border-color: rgba(61,184,255,0.3); background: rgba(61,184,255,0.06); }
.dp-stat.is-active strong { color: #3db8ff; }
.dp-stat.is-done { border-color: rgba(35,160,109,0.3); background: rgba(35,160,109,0.06); }
.dp-stat.is-done strong { color: var(--success); }
.dp-hint { font-size: 12px; color: var(--muted); padding: 4px 10px; border-radius: 8px; background: rgba(86,174,230,0.06); white-space: nowrap; }
.dp-workers { padding: 14px 18px; border-radius: 18px; background: var(--panel); border: 1px solid var(--line); }
.dp-workers-label { font-size: 13px; font-weight: 700; color: var(--muted); margin-bottom: 10px; }
.dp-workers-grid { display: flex; gap: 12px; flex-wrap: wrap; }
.dp-worker { appearance: none; border: 2px dashed var(--line); border-radius: 14px; padding: 12px 16px; background: #fff; cursor: pointer; text-align: center; min-width: 120px; display: grid; gap: 2px; }
.dp-worker:hover { border-color: var(--accent); background: rgba(86,174,230,0.04); }
.dp-worker-avatar { width: 36px; height: 36px; border-radius: 50%; background: var(--accent); color: #fff; font-weight: 800; display: grid; place-items: center; margin: 0 auto 6px; font-size: 14px; }
.dp-worker strong { font-size: 13px; color: var(--text); }
.dp-worker span { font-size: 11px; color: var(--muted); }
.dp-board { display: grid; grid-template-columns: repeat(4, minmax(220px, 1fr)); gap: 12px; align-items: start; }
.dp-lane { border-radius: 18px; border: 1px solid var(--line); background: var(--panel); overflow: hidden; }
.dp-lane-head { padding: 12px 16px; }
.dp-lane-head h3 { margin: 0; font-size: 15px; }
.dp-lane-head span { font-size: 12px; color: var(--muted); }
.dp-lane-body { padding: 8px 12px 12px; display: grid; gap: 8px; }
.dp-empty-lane { padding: 24px 12px; text-align: center; color: var(--muted); font-size: 13px; }
.dp-empty-all { grid-column: 1 / -1; text-align: center; padding: 48px 24px; }
.dp-empty-all h3 { margin: 0; color: var(--muted); }
.dp-card { display: grid; gap: 6px; padding: 12px; border: 1px solid var(--line); border-radius: 14px; background: #fff; cursor: grab; }
.dp-card.is-urgent { border-color: rgba(217,106,120,0.5); background: rgba(255,235,238,0.2); }
.dp-card.selected { border-color: var(--accent); box-shadow: 0 0 0 2px rgba(86,174,230,0.15); }
.dp-card-head { display: flex; justify-content: space-between; gap: 8px; }
.dp-card-head strong { font-size: 14px; color: var(--text); display: block; }
.dp-card-head span { font-size: 12px; color: var(--muted); }
.dp-card-body { display: flex; justify-content: space-between; font-size: 12px; color: var(--muted); }
.dp-card-foot { display: flex; justify-content: space-between; align-items: center; }
.dp-assignee { font-size: 12px; color: var(--accent-deep); font-weight: 600; display: flex; align-items: center; gap: 4px; }
.dp-no-assignee { font-size: 12px; color: var(--muted); }
@media (max-width: 980px) { .dp-board { grid-template-columns: 1fr; } .dp-stats { grid-template-columns: repeat(3, 1fr); } }
}


.onboarding-shell {
  max-width: 1180px;
  margin: 0 auto;
  display: grid;
  gap: 18px;
}

.onboarding-header,
.onboarding-footer,
.onboarding-progress,
.onboarding-card {
  border: 1px solid rgba(217, 232, 247, 0.92);
  background: rgba(255, 255, 255, 0.93);
  box-shadow: var(--shadow);
}

.onboarding-header,
.onboarding-footer {
  padding: 18px 22px;
  border-radius: 20px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}

.onboarding-progress {
  padding: 18px;
  border-radius: 20px;
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 8px;
}

.onboarding-progress > div {
  display: grid;
  justify-items: center;
  gap: 7px;
  color: var(--muted);
  font-size: 12px;
}

.onboarding-progress i {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  font-style: normal;
  background: #edf4fa;
  color: var(--muted);
}

.onboarding-progress .active,
.onboarding-progress .done { color: var(--accent-deep); font-weight: 800; }
.onboarding-progress .active i { background: var(--accent); color: #fff; box-shadow: 0 0 0 5px rgba(86, 174, 230, 0.16); }
.onboarding-progress .done i { background: var(--success); color: #fff; }
.onboarding-card { min-height: 410px; padding: 22px; border-radius: 26px; }
.onboarding-card .form-grid { box-shadow: none; border: 0; padding: 0; }
.onboarding-card h2 { margin: 0 0 10px; font-size: 27px; }.onboarding-card h3 { margin: 0 0 12px; }
.onboarding-welcome { min-height: 350px; display: grid; align-content: center; justify-items: center; text-align: center; gap: 16px; }.onboarding-welcome > span { color: var(--accent-deep); font-weight: 800; }.onboarding-welcome h2 { max-width: 620px; margin: 0; font-size: 34px; }.onboarding-welcome p { max-width: 600px; color: var(--muted); line-height: 1.8; margin: 0; }
.onboarding-hero-icon { font-size: 64px; line-height: 1; }
.onboarding-hero-copy { font-size: 16px !important; }
.onboarding-preview-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 12px; max-width: 720px; width: 100%; margin: 20px 0; }
.onboarding-step-card { padding: 16px 12px; border: 1px solid var(--line); border-radius: 16px; background: rgba(86,174,230,0.04); text-align: center; }
.onboarding-step-card i { display: block; font-size: 28px; font-style: normal; line-height: 1; margin-bottom: 8px; }
.onboarding-step-card strong { display: block; font-size: 14px; color: var(--text); }
.onboarding-step-card span { display: block; margin-top: 4px; font-size: 12px; color: var(--muted); }
.onboarding-welcome-actions { display: flex; gap: 12px; justify-content: center; flex-wrap: wrap; margin-top: 8px; }
.onboarding-hint { margin-top: 16px !important; font-size: 12px !important; }
.onboarding-checklist { padding: 18px 20px; border-radius: 18px; background: linear-gradient(180deg, rgba(86,174,230,0.06), rgba(255,255,255,0.6)); border: 1px solid rgba(86,174,230,0.18); margin-bottom: 16px; }
.onboarding-checklist-head { display: flex; justify-content: space-between; align-items: baseline; margin-bottom: 12px; }
.onboarding-checklist-head strong { font-size: 14px; color: var(--text); }
.onboarding-checklist-head span { font-size: 12px; color: var(--accent-deep); font-weight: 600; }
.onboarding-checklist-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 8px; }
.onboarding-check { display: flex; align-items: center; gap: 8px; padding: 8px 10px; border-radius: 10px; background: rgba(255,255,255,0.7); border: 1px solid rgba(217,232,247,0.8); }
.onboarding-check i { width: 22px; height: 22px; border-radius: 50%; display: grid; place-items: center; font-style: normal; font-size: 12px; background: rgba(86,174,230,0.12); color: var(--muted); }
.onboarding-check.is-done { background: rgba(35,160,109,0.08); border-color: rgba(35,160,109,0.3); }
.onboarding-check.is-done i { background: var(--success); color: #fff; }
.onboarding-check span { font-size: 13px; color: var(--text); }
.onboarding-progress > div { display: flex; align-items: center; gap: 8px; }
.onboarding-progress > div i { flex: 0 0 28px; height: 28px; border-radius: 50%; display: grid; place-items: center; background: rgba(86,174,230,0.12); color: var(--accent-deep); font-weight: 700; font-style: normal; font-size: 13px; }
.onboarding-progress > div.active i { background: var(--accent); color: #fff; }
.onboarding-progress > div.done i { background: var(--success); color: #fff; }
.onboarding-progress > div strong { display: block; font-size: 12px; color: var(--text); }
.onboarding-progress > div span { display: block; font-size: 11px; color: var(--muted); }
.onboarding-split { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(260px, 0.8fr); gap: 22px; }.onboarding-preview { padding: 18px; border: 1px solid var(--line); border-radius: 18px; background: var(--panel-strong); max-height: 420px; overflow: auto; }

@media (max-width: 780px) { .onboarding-header, .onboarding-footer { align-items: flex-start; flex-direction: column; }.onboarding-progress { grid-template-columns: repeat(4, 1fr); }.onboarding-split { grid-template-columns: 1fr; }.onboarding-card { padding: 20px; }.onboarding-welcome h2 { font-size: 28px; } }

.import-layout { align-items: start; }
.import-upload-zone { text-align: center; padding: 48px 24px; border: 2px dashed var(--line); border-radius: 20px; background: rgba(86,174,230,0.03); transition: border-color 0.2s, background 0.2s; }
.import-upload-zone:hover { border-color: var(--accent); background: rgba(86,174,230,0.06); }
.import-upload-zone p { margin: 8px 0; font-size: 15px; }
.import-drop-icon { font-size: 48px; line-height: 1; margin-bottom: 8px; }
.import-file-label input { margin-top: 6px; width: 100%; }
.import-template-hint { margin-top: 24px; }
.import-template-hint h3 { margin: 0 0 12px; font-size: 16px; }
.import-columns-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 8px; }
.import-col-item { padding: 10px 14px; border-radius: 12px; background: rgba(86,174,230,0.05); border: 1px solid rgba(217,232,247,0.8); }
.import-col-item strong { display: block; font-size: 13px; color: var(--text); }
.import-col-item span { display: block; margin-top: 2px; font-size: 12px; color: var(--muted); }
.import-panel-header { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 8px; }
.import-panel-header h3 { margin: 0; }
.import-divider { border-top: 1px solid var(--line); margin: 28px 0 20px; }
tr.is-invalid { background: rgba(217,106,120,0.04); }
tr.is-invalid td { color: var(--danger); }
.import-progress { height: 10px; overflow: hidden; border-radius: 999px; background: #e8f1f8; }
.import-progress i { display: block; width: 0; height: 100%; background: linear-gradient(90deg, var(--accent-deep), var(--accent)); transition: width 240ms ease; }
.import-result-metrics { margin-bottom: 16px; }
.import-result-metrics .metric-card { min-width: 0; padding: 14px; }
.import-result-metrics strong { font-size: 28px; }

.elder-card-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 14px; }
.elder-card { border: 1px solid var(--line); border-radius: 20px; background: var(--panel); overflow: hidden; transition: box-shadow 0.2s, border-color 0.2s; }
.elder-card:hover { border-color: rgba(86,174,230,0.3); }
.elder-card.is-expanded { grid-column: 1 / -1; border-color: var(--accent); box-shadow: 0 0 0 2px rgba(86,174,230,0.12); }
.elder-card-head { width: 100%; display: grid; gap: 8px; padding: 16px; border: 0; background: none; text-align: left; cursor: pointer; }
.elder-card-top { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; }
.elder-card-top strong { font-size: 18px; color: var(--text); }
.elder-card-room { color: var(--muted); font-size: 13px; }
.elder-card-meta { display: flex; align-items: center; gap: 10px; font-size: 13px; color: var(--text); }
.elder-card-toggle { font-size: 11px; color: var(--muted); text-align: center; padding-top: 4px; }
.elder-card-body { padding: 0 16px 16px; display: grid; gap: 14px; }
.elder-card-section { padding: 12px; border-radius: 14px; background: rgba(245,250,255,0.8); border: 1px solid rgba(217,232,247,0.7); }
.elder-card-label { font-size: 12px; color: var(--muted); font-weight: 700; margin-bottom: 8px; }
.elder-card-fields { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 6px; }
.elder-field { display: flex; gap: 6px; font-size: 13px; line-height: 1.6; }
.elder-field strong { flex: 0 0 auto; color: var(--muted); font-weight: 400; min-width: 44px; }
.elder-field span { color: var(--text); }
.elder-card.is-create { border-style: dashed; border-color: var(--accent); background: rgba(86,174,230,0.03); }

/* ====== 房态图增强 ====== */
.fp-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(100px, 1fr)); gap: 10px; margin-bottom: 16px; }
.fp-stat { padding: 12px; border-radius: 14px; text-align: center; background: rgba(86,174,230,0.06); border: 1px solid var(--line); }
.fp-stat strong { display: block; font-size: 24px; color: var(--accent-deep); }
.fp-stat span { color: var(--muted); font-size: 12px; margin-top: 4px; display: block; }
.fp-floor-tabs { display: flex; gap: 8px; margin-bottom: 16px; flex-wrap: wrap; }
.fp-floor-tab { padding: 8px 16px; border-radius: 10px; border: 1px solid var(--line); background: var(--panel); cursor: pointer; font-weight: 600; font-size: 13px; color: var(--text); }
.fp-floor-tab:hover { background: rgba(86,174,230,0.08); }
.fp-floor-tab.active { background: var(--accent); color: #fff; border-color: var(--accent); }
.fp-room-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 12px; }
.fp-room { border-radius: 16px; border: 1px solid var(--line); background: var(--panel); overflow: hidden; }
.fp-room.is-full { border-color: rgba(35,160,109,0.35); background: linear-gradient(180deg, #fff 0%, rgba(235,250,243,0.7) 100%); }
.fp-room.is-partial { border-color: rgba(215,152,54,0.3); }
.fp-room.is-empty { border-color: var(--line); }
.fp-room-head { display: flex; justify-content: space-between; align-items: center; padding: 10px 12px; background: rgba(86,174,230,0.05); border-bottom: 1px solid var(--line); }
.fp-room-head strong { font-size: 15px; color: var(--text); }
.fp-room-head span { font-size: 11px; color: var(--muted); }
.fp-room-beds { display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px; padding: 10px; }
.fp-bed { appearance: none; border: 1px solid var(--line); border-radius: 10px; padding: 8px; cursor: pointer; text-align: center; background: #fff; display: grid; gap: 2px; }
.fp-bed.is-occupied { background: rgba(35,160,109,0.1); border-color: rgba(35,160,109,0.3); }
.fp-bed.is-empty { background: #fafcff; }
.fp-bed-name { font-weight: 700; font-size: 13px; color: var(--text); }
.fp-bed-label { font-size: 11px; color: var(--muted); }
.fp-room-foot { padding: 6px 12px; font-size: 11px; color: var(--muted); border-top: 1px solid var(--line); text-align: right; }
.fp-legend { display: flex; gap: 16px; margin-top: 14px; padding: 10px 14px; border-radius: 12px; background: rgba(86,174,230,0.04); }
.fp-legend span { display: flex; align-items: center; gap: 6px; font-size: 12px; color: var(--muted); }
.fp-legend i { width: 14px; height: 14px; border-radius: 4px; display: inline-block; }
.fp-legend i.is-occupied { background: rgba(35,160,109,0.3); border: 1px solid rgba(35,160,109,0.5); }
.fp-legend i.is-empty { background: #f0f5fa; border: 1px solid var(--line); }

/* ====== 客户与机构卡片 ====== */
.tenant-card-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(360px, 1fr)); gap: 14px; }
.tenant-card { border: 1px solid var(--line); border-radius: 20px; background: var(--panel); overflow: hidden; }
.tenant-card-head { padding: 18px; }
.tenant-card-top { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin-bottom: 14px; }
.tenant-card-top strong { font-size: 20px; color: var(--text); }
.tenant-slug { color: var(--muted); font-size: 12px; padding: 2px 8px; border-radius: 6px; background: rgba(86,174,230,0.08); }
.tenant-card-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.tenant-stat { padding: 10px; border-radius: 12px; text-align: center; background: rgba(86,174,230,0.05); border: 1px solid rgba(217,232,247,0.8); }
.tenant-stat strong { display: block; font-size: 22px; color: var(--accent-deep); }
.tenant-stat span { display: block; margin-top: 2px; font-size: 11px; color: var(--muted); }
.tenant-card-orgs { padding: 0 18px 18px; }
.tenant-org-label { font-size: 12px; color: var(--muted); font-weight: 700; margin-bottom: 8px; padding-bottom: 8px; border-bottom: 1px solid var(--line); }
.tenant-org-row { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 10px 0; border-bottom: 1px solid rgba(217,232,247,0.5); }
.tenant-org-row:last-child { border-bottom: 0; }
.tenant-org-info strong { display: block; font-size: 14px; color: var(--text); }
.tenant-org-info span { font-size: 12px; color: var(--muted); }
.tenant-org-meta { display: flex; align-items: center; gap: 10px; font-size: 12px; color: var(--muted); }
.tenant-create-panel { margin: 16px 0; padding: 22px; border: 1px dashed var(--accent); border-radius: 20px; background: rgba(86,174,230,0.03); }
.tenant-create-panel h3 { margin: 0 0 6px; }
.tenant-create-panel .muted { margin: 0 0 14px; }
.tenant-create-panel .form-grid { border: 0; box-shadow: none; padding: 0; }
@media (max-width: 600px) { .tenant-card-grid { grid-template-columns: 1fr; } }

/* ====== 健康管理 ====== */
.hgm-elder-bar { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; margin: 4px 0 8px; padding: 8px 0; }
.hgm-elder-select { display: flex; align-items: baseline; gap: 8px; font-size: 13px; color: var(--muted); }
.hgm-elder-select select { min-width: 200px; padding: 8px 12px; border-radius: 10px; border: 1px solid var(--line); background: var(--panel); font-size: 14px; }
.hgm-elder-info { font-size: 13px; color: var(--text); font-weight: 600; }
.hgm-metric { padding: 14px; border-radius: 14px; text-align: center; background: rgba(86,174,230,0.04); border: 1px solid rgba(217,232,247,0.8); }
.hgm-metric span { display: block; font-size: 12px; color: var(--muted); }
.hgm-metric strong { display: block; font-size: 28px; margin: 6px 0; }
.hgm-metric small { font-size: 12px; color: var(--muted); }
.hgm-metric-grid { grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 10px; }
.hgm-metric-grid .hgm-metric { min-width: 0; padding: 14px 8px; }
.hgm-metric-grid .hgm-metric strong { font-size: clamp(22px, 2.1vw, 28px); }
.hgm-form-panel { margin: 12px 0; padding: 18px; border: 2px solid var(--accent); border-radius: 16px; background: rgba(86,174,230,0.03); }
.hgm-quick-actions { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin: 14px 0 8px; padding: 10px 14px; border-radius: 14px; background: rgba(86,174,230,0.04); border: 1px solid var(--line); }
.hgm-quick-actions > span { font-size: 13px; color: var(--muted); font-weight: 600; }
.hgm-quick-btn { appearance: none; border: 1px solid var(--line); border-radius: 10px; padding: 6px 14px; background: var(--panel); cursor: pointer; font-size: 13px; white-space: nowrap; }
.hgm-quick-btn:hover { border-color: var(--accent); background: rgba(86,174,230,0.06); }
.hgm-risk { margin: 8px 0 12px; padding: 12px 16px; border-radius: 14px; background: rgba(217,106,120,0.06); border: 1px solid rgba(217,106,120,0.25); display: grid; gap: 6px; }
.hgm-risk strong { font-size: 13px; color: var(--danger); }
.hgm-risk-item { display: inline-block; margin-right: 12px; font-size: 13px; color: var(--text); }
.hgm-risk-item::before { content: "•"; color: var(--danger); margin-right: 4px; }
.hgm-trend-panel { min-height: 170px; }
.hgm-trend-empty { min-height: 88px; display: grid; place-items: center; border: 1px dashed var(--line); border-radius: 12px; background: rgba(86,174,230,0.025); color: var(--muted); font-size: 13px; }
.hgm-analysis-summary { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin-bottom: 12px; }
.hgm-analysis-summary > div { min-width: 0; padding: 10px; border: 1px solid rgba(217,232,247,0.8); border-radius: 12px; background: rgba(86,174,230,0.04); text-align: center; }
.hgm-analysis-summary span, .hgm-analysis-summary small { display: block; color: var(--muted); font-size: 11px; }
.hgm-analysis-summary strong { display: inline-block; margin: 4px 3px 0 0; color: var(--accent-deep); font-size: 22px; }
.hgm-analysis-note { margin: 0 0 12px; color: var(--muted); font-size: 12px; line-height: 1.6; }
@media (max-width: 780px) { .hgm-metric-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.fp-guide { margin-top: 16px; }
.fp-guide h3 { margin: 0; }
.fp-guide p { margin: 6px 0 0; font-size: 14px; }
@media (max-width: 600px) { .fp-room-grid { grid-template-columns: 1fr 1fr; } .fp-room-beds { grid-template-columns: 1fr 1fr; } }
.elder-card.is-expanded .elder-card-body .form-grid { border: 0; box-shadow: none; padding: 0; background: none; }
@media (max-width: 600px) { .elder-card-grid { grid-template-columns: 1fr; } }

/* ====== 床头卡风格 ====== */
.elder-card { background: linear-gradient(180deg, #fff 0%, #f5faff 100%); border: 1px solid var(--line); border-radius: 18px; padding: 16px 18px; }
.elder-card.is-expanded { grid-column: 1 / -1; }
.elder-card-top-bar { display: flex; align-items: flex-start; justify-content: space-between; padding-bottom: 10px; border-bottom: 1px solid rgba(217,232,247,0.6); }
.elder-card-top-bar strong { font-size: 22px; color: var(--text); font-weight: 700; display: block; }
.elder-card-top-bar span { font-size: 13px; color: var(--muted); }
.elder-card-call { width: 36px; height: 36px; border-radius: 50%; border: 1px solid var(--line); background: rgba(86,174,230,0.06); cursor: pointer; display: grid; place-items: center; font-size: 16px; }
.elder-card-call:disabled { opacity: 0.4; cursor: not-allowed; }
.elder-card-call:hover:not(:disabled) { background: rgba(86,174,230,0.15); }
.elder-card-main { width: 100%; border: 0; background: none; text-align: left; cursor: pointer; padding: 12px 0 4px; display: grid; gap: 8px; }
.elder-card-status { display: flex; align-items: center; gap: 10px; font-size: 13px; color: var(--text); }
.elder-status-dot { width: 10px; height: 10px; border-radius: 50%; display: inline-block; }
.elder-status-dot.success { background: var(--success); box-shadow: 0 0 0 3px rgba(35,160,109,0.2); }
.elder-status-dot.warning { background: var(--warning); box-shadow: 0 0 0 3px rgba(215,152,54,0.2); }
.elder-status-dot.danger { background: var(--danger); box-shadow: 0 0 0 3px rgba(217,106,120,0.2); animation: elder-pulse 1.5s infinite; }
.elder-status-dot.neutral { background: var(--muted); }
@keyframes elder-pulse { 0%, 100% { box-shadow: 0 0 0 3px rgba(217,106,120,0.2); } 50% { box-shadow: 0 0 0 6px rgba(217,106,120,0.4); } }
.elder-bed { color: var(--muted); font-size: 12px; padding: 2px 8px; border-radius: 6px; background: rgba(86,174,230,0.08); margin-left: auto; }
.elder-card-vitals { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; }
.elder-vital { padding: 10px; border-radius: 12px; background: rgba(255,255,255,0.7); border: 1px solid rgba(217,232,247,0.7); text-align: center; }
.elder-vital-num { display: block; font-size: 26px; font-weight: 700; color: var(--text); }
.elder-card.is-expanded .elder-vital-num { font-size: 26px; }
.elder-vital-label { display: block; font-size: 11px; color: var(--muted); margin-top: 2px; }
.elder-card-update { font-size: 11px; color: var(--muted); }

/* ====== 老人档案全宽列表 ====== */
.elder-records-layout { display: grid; gap: 18px; }
.elder-record-scroll { max-height: min(58vh, 620px); overflow-y: auto; overscroll-behavior: contain; border: 1px solid var(--line); border-radius: 16px; background: var(--panel); }
.elder-record-list-head,
.elder-record-row { display: grid; grid-template-columns: minmax(140px, .8fr) minmax(180px, 1fr) minmax(160px, 1fr) minmax(220px, 1.35fr); gap: 16px; align-items: center; }
.elder-record-list-head { position: sticky; top: 0; z-index: 1; padding: 11px 16px; background: #f4f9fe; border-bottom: 1px solid var(--line); color: var(--muted); font-size: 12px; font-weight: 700; }
.elder-record-row { padding: 16px; border-bottom: 1px solid rgba(217,232,247,.72); transition: background 160ms ease; }
.elder-record-row:last-child { border-bottom: 0; }
.elder-record-row:hover { background: rgba(86,174,230,.045); }
.elder-record-person,
.elder-record-care,
.elder-record-health,
.elder-record-medication { min-width: 0; display: grid; gap: 4px; }
.elder-record-person strong,
.elder-record-care strong { color: var(--text); font-size: 15px; }
.elder-record-person span,
.elder-record-care span,
.elder-record-health > span,
.elder-record-care small,
.elder-record-medication span { overflow: hidden; color: var(--muted); font-size: 12px; line-height: 1.45; text-overflow: ellipsis; white-space: nowrap; }
.elder-record-health .tag { justify-self: start; }
.elder-record-medication b { display: inline-block; width: 32px; color: var(--text); font-weight: 600; }
.elder-record-scroll::-webkit-scrollbar { width: 8px; }
.elder-record-scroll::-webkit-scrollbar-thumb { border: 2px solid var(--panel); border-radius: 999px; background: rgba(86,174,230,.35); }
.elder-create-panel .section-title { margin-bottom: 16px; }
.elder-record-form { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.elder-record-form .form-columns { display: contents; }
.elder-record-form .elder-form-context,
.elder-record-form .elder-form-wide,
.elder-record-form .primary-button { grid-column: 1 / -1; }
@media (max-width: 780px) {
  .elder-record-scroll { max-height: none; overflow: visible; border: 0; border-radius: 0; }
  .elder-record-list-head { display: none; }
  .elder-record-row { grid-template-columns: 1fr 1fr; gap: 14px; padding: 16px 4px; }
  .elder-record-medication { grid-column: 1 / -1; }
  .elder-record-form { grid-template-columns: 1fr; }
}

/* ====== 入住登记 ====== */
.admission-layout { grid-template-columns: minmax(0, 1fr); gap: 18px; }
.admission-layout > .admission-summary-panel { order: -1; display: grid; grid-template-columns: minmax(180px, 0.7fr) minmax(360px, 1.2fr) minmax(240px, 0.8fr); align-items: center; gap: 20px; padding: 18px 22px; }
.admission-summary-panel .adm-summary-head,
.admission-summary-panel .adm-summary-metrics { margin: 0; }
.admission-summary-panel .adm-empty-state { min-height: 64px; padding: 10px 0 10px 20px; border-left: 1px solid var(--line); text-align: left; }
.admission-summary-panel .adm-record-list,
.admission-summary-panel .adm-contracts { grid-column: 1 / -1; }
.adm-wizard { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); align-items: stretch; gap: 8px; margin-bottom: 18px; }
.adm-wizard-step { min-width: 0; display: flex; align-items: center; gap: 8px; padding: 9px 10px; border-radius: 12px; background: rgba(86,174,230,0.04); border: 1px solid var(--line); }
.adm-wizard-step.active { background: rgba(86,174,230,0.1); border-color: var(--accent); }
.adm-wizard-step.done { background: rgba(35,160,109,0.06); border-color: rgba(35,160,109,0.25); }
.adm-wizard-circle { flex: 0 0 26px; height: 26px; border-radius: 50%; display: grid; place-items: center; font-size: 12px; font-weight: 700; background: rgba(86,174,230,0.12); color: var(--accent-deep); }
.adm-wizard-step.active .adm-wizard-circle { background: var(--accent); color: #fff; }
.adm-wizard-step.done .adm-wizard-circle { background: var(--success); color: #fff; }
.adm-wizard-step strong { display: block; font-size: 13px; color: var(--text); white-space: nowrap; }
.adm-wizard-step span { display: none; }
.adm-card { border: 1px solid var(--line); border-radius: 20px; padding: 22px; background: var(--panel); }
.adm-step-body h3 { margin: 0 0 6px; font-size: 20px; }
.adm-step-body > .muted { margin: 0 0 16px; }
.adm-elder-select { display: grid; gap: 8px; max-height: 304px; padding-right: 4px; overflow-y: auto; overscroll-behavior: contain; }
.adm-elder-select::-webkit-scrollbar { width: 7px; }
.adm-elder-select::-webkit-scrollbar-thumb { border-radius: 999px; background: rgba(86,174,230,0.32); }
.adm-elder-option { display: flex; align-items: center; gap: 12px; min-height: 68px; padding: 12px 16px; border: 1px solid var(--line); border-radius: 12px; cursor: pointer; background: var(--panel); }
.adm-elder-option.is-selected { border-color: var(--accent); background: rgba(86,174,230,0.06); }
.adm-elder-option input { margin: 0; width: auto; }
.adm-elder-option strong { display: block; font-size: 15px; color: var(--text); }
.adm-elder-option span { display: block; margin-top: 2px; font-size: 12px; color: var(--muted); }
.adm-score-grid { display: grid; gap: 14px; }
.adm-score-item label { display: flex; justify-content: space-between; font-size: 14px; color: var(--text); margin-bottom: 6px; }
.adm-score-value { color: var(--accent-deep); font-weight: 700; }
.adm-score-item input[type="range"] { width: 100%; accent-color: var(--accent); }
.adm-score-result { display: flex; gap: 16px; margin-top: 20px; }
.adm-score-total, .adm-score-level { flex: 1; padding: 16px; border-radius: 14px; text-align: center; border: 1px solid var(--line); background: rgba(86,174,230,0.04); }
.adm-score-total strong, .adm-score-level strong { display: block; font-size: 32px; color: var(--accent-deep); }
.adm-score-total span, .adm-score-level span { display: block; margin-top: 4px; font-size: 12px; color: var(--muted); }
.adm-bed-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: 10px; }
.adm-bed-card { appearance: none; border: 2px solid var(--line); border-radius: 14px; padding: 14px; text-align: center; cursor: pointer; background: #fff; }
.adm-bed-card:hover { border-color: var(--accent); }
.adm-bed-card.is-selected { border-color: var(--accent); background: rgba(86,174,230,0.08); }
.adm-bed-room { font-size: 16px; font-weight: 700; color: var(--text); }
.adm-bed-label { font-size: 12px; color: var(--muted); margin: 4px 0; }
.adm-bed-building { font-size: 11px; color: var(--muted); }
.adm-confirm-grid { display: grid; gap: 12px; }
.adm-confirm-item { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; padding: 12px 14px; border-radius: 12px; background: rgba(86,174,230,0.04); border: 1px solid rgba(217,232,247,0.8); }
.adm-confirm-item strong { font-size: 13px; color: var(--muted); white-space: nowrap; }
.adm-confirm-item span { font-size: 14px; color: var(--text); text-align: right; }
.adm-step-actions { display: flex; justify-content: space-between; margin-top: 20px; padding-top: 16px; border-top: 1px solid var(--line); }
@media (max-width: 700px) { .adm-wizard { grid-template-columns: 1fr; } .adm-wizard-step span { display: block; } .adm-bed-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 780px) { .admission-layout > .admission-summary-panel { grid-template-columns: 1fr; } .admission-summary-panel .adm-empty-state { padding: 4px 0 0; border-left: 0; text-align: center; } }

.adm-record-list { display: grid; gap: 8px; }
.adm-record-card { padding: 12px; border-radius: 14px; border: 1px solid var(--line); background: rgba(255,255,255,0.7); }
.adm-record-card.is-active { border-color: rgba(35,160,109,0.25); background: rgba(35,160,109,0.04); }
.adm-record-top { display: flex; justify-content: space-between; align-items: center; gap: 8px; }
.adm-record-top strong { font-size: 14px; color: var(--text); }
.adm-record-top .tag { font-size: 11px; padding: 2px 8px; }
.adm-record-info { display: flex; gap: 12px; margin-top: 6px; font-size: 12px; color: var(--muted); }
.adm-discharge-btn { appearance: none; border: 0; background: rgba(217,106,120,0.1); color: var(--danger); font-weight: 700; font-size: 12px; padding: 4px 10px; border-radius: 8px; cursor: pointer; margin-top: 8px; }
.adm-contracts { margin-top: 16px; padding-top: 14px; border-top: 1px solid var(--line); }
.adm-contracts-head { font-size: 13px; font-weight: 700; color: var(--muted); margin-bottom: 8px; }
.adm-contract-row { display: flex; justify-content: space-between; align-items: center; gap: 10px; padding: 10px 0; border-bottom: 1px solid rgba(217,232,247,0.5); }
.adm-contract-row:last-child { border-bottom: 0; }
.adm-contract-row strong { display: block; font-size: 13px; color: var(--text); }
.adm-contract-row span { font-size: 11px; color: var(--muted); }
.adm-contract-fee { font-size: 13px; color: var(--accent-deep); font-weight: 700; white-space: nowrap; }.activity-week { display: grid; grid-template-columns: repeat(7, 1fr); gap: 0; border: 1px solid var(--line); border-radius: 18px; overflow: hidden; }

.adm-summary-head { margin-bottom: 14px; }
.adm-summary-head .section-title { font-size: 20px; }
.adm-summary-metrics { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin-bottom: 18px; }
.adm-summary-metrics > div { min-width: 0; padding: 12px 8px; border: 1px solid rgba(217,232,247,0.8); border-radius: 12px; background: rgba(86,174,230,0.045); text-align: center; }
.adm-summary-metrics strong { display: block; color: var(--accent-deep); font-size: 24px; line-height: 1.15; }
.adm-summary-metrics span { display: block; margin-top: 4px; color: var(--muted); font-size: 11px; white-space: nowrap; }
.adm-empty-state { display: grid; gap: 6px; padding: 18px 6px 4px; color: var(--muted); text-align: center; }
.adm-empty-state strong { color: var(--text); font-size: 14px; }
.adm-empty-state span { font-size: 12px; line-height: 1.6; }
.activity-day { border-right: 1px solid var(--line); }
.activity-day:last-child { border-right: 0; }
.activity-day.is-weekend { background: rgba(86,174,230,0.02); }
.activity-day-head { padding: 10px 6px; text-align: center; border-bottom: 1px solid var(--line); background: rgba(86,174,230,0.04); }
.activity-day-head strong { display: block; font-size: 13px; color: var(--text); }
.activity-day-head span { font-size: 11px; color: var(--muted); }
.activity-day-body { padding: 6px; display: grid; gap: 4px; min-height: 100px; }
.activity-card { padding: 8px; border-radius: 8px; background: #fff; border: 1px solid var(--line); cursor: pointer; display: grid; gap: 2px; }
.activity-card.selected { border-color: var(--accent); box-shadow: 0 0 0 2px rgba(86,174,230,0.15); }
.activity-card-time { font-size: 11px; color: var(--accent-deep); font-weight: 700; }
.activity-card-title { font-size: 13px; color: var(--text); font-weight: 600; }
.activity-card-meta { font-size: 11px; color: var(--muted); }
.activity-card-status { font-size: 10px; }
.activity-day-empty { padding: 20px 0; text-align: center; color: var(--muted); font-size: 16px; }
@media (max-width: 900px) { .activity-week { grid-template-columns: repeat(4, 1fr); } }
@media (max-width: 600px) { .activity-week { grid-template-columns: repeat(2, 1fr); } }
.activity-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 14px; flex-wrap: wrap; }
.activity-nav { display: flex; align-items: center; gap: 6px; }
.activity-nav .ghost-button { padding: 6px 12px; font-size: 13px; }
.activity-date-input { padding: 6px 10px; border-radius: 8px; border: 1px solid var(--line); font-size: 13px; font-family: inherit; background: var(--panel); }
.user-filter-bar { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 12px; }
.user-filter-btn { appearance: none; border: 1px solid var(--line); background: var(--panel); color: var(--text); padding: 6px 14px; border-radius: 999px; font-size: 13px; cursor: pointer; }
.user-filter-btn:hover { border-color: var(--accent); }
.user-filter-btn.active { background: var(--accent); color: #fff; border-color: var(--accent); }
.user-row-actions { display: flex; gap: 6px; }
.user-row-actions .ghost-button { padding: 5px 10px; font-size: 12px; }
.pharmacy-low-stock > td { background: rgba(217, 160, 47, 0.08); border-top: 1px solid rgba(217, 160, 47, 0.55); border-bottom: 1px solid rgba(217, 160, 47, 0.55); }
.pharmacy-low-stock > td:first-child { border-left: 3px solid var(--warning); }
.pharmacy-low-stock > td:last-child { border-right: 1px solid rgba(217, 160, 47, 0.55); }
.duty-week-grid { display: grid; grid-template-columns: repeat(7, minmax(150px, 1fr)); gap: 10px; overflow-x: auto; }
.duty-day-card { min-height: 160px; padding: 12px; border: 1px solid var(--line); border-radius: 10px; background: var(--panel-strong); }
.duty-day-card h3 { margin: 0 0 10px; color: var(--text); font-size: 14px; }
.duty-day-card h3 small { margin-left: 6px; color: var(--muted); font-weight: 500; }
.duty-day-list { display: grid; gap: 7px; }
.duty-shift { display: grid; width: 100%; gap: 3px; padding: 8px; border: 1px solid var(--line); border-radius: 7px; background: var(--panel); color: var(--text); text-align: left; cursor: pointer; font: inherit; }
.duty-shift:hover { border-color: var(--accent); }
.duty-shift span { color: var(--muted); font-size: 12px; }
tr.alarm-critical { border-left: 3px solid var(--danger); }
tr.alarm-critical td:first-child { padding-left: 10px; }
.panel-scroll { max-height: calc(100vh - 220px); overflow-y: auto; display: flex; flex-direction: column; }
.detail-scroll { max-height: calc(100vh - 180px); overflow-y: auto; }
.dashboard-flash-list { display: grid; gap: 8px; padding: 0 4px; }
.dashboard-flash-item { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border: 1px solid rgba(217, 95, 95, 0.3); border-radius: 10px; background: rgba(217, 95, 95, 0.04); }
.dashboard-flash-dot { width: 10px; height: 10px; border-radius: 50%; background: #d95f5f; flex-shrink: 0; }
.dashboard-flash-item.is-flashing .dashboard-flash-dot { animation: dashboard-flash 1.2s ease-in-out infinite; }
.dashboard-flash-item strong { display: block; color: var(--text); font-size: 14px; margin-bottom: 2px; }
.dashboard-flash-item .dashboard-item-meta { font-size: 12px; }
@keyframes dashboard-flash { 0%, 100% { box-shadow: 0 0 0 0 rgba(217, 95, 95, 0.6); } 50% { box-shadow: 0 0 0 6px rgba(217, 95, 95, 0); opacity: 0.5; } }
.dashboard-device-compact { display: flex; align-items: center; gap: 14px; padding: 12px 0; }
.dashboard-device-ring { width: 80px; height: 80px; flex-shrink: 0; display: grid; place-items: center; border-radius: 50%; background: conic-gradient(#2ad6ff 0deg 320deg, rgba(91, 110, 255, 0.1) 320deg 360deg); position: relative; }
.dashboard-device-ring::after { content: ""; position: absolute; inset: 6px; background: var(--panel); border-radius: 50%; }
.dashboard-device-ring strong { font-size: 22px; color: var(--text); position: relative; z-index: 1; line-height: 1; }
.dashboard-device-ring span { font-size: 10px; color: var(--muted); position: relative; z-index: 1; margin-top: 2px; }
.dashboard-device-legend { flex: 1; display: grid; gap: 6px; }
.dashboard-device-legend > div { display: flex; align-items: center; gap: 8px; font-size: 13px; }
.dashboard-device-legend i { width: 8px; height: 8px; border-radius: 50%; flex-shrink: 0; }
.dashboard-device-legend i.is-online { background: #35a66f; }
.dashboard-device-legend i.is-offline { background: #d95f5f; }
.dashboard-device-legend i.is-low { background: #d9a02f; }
.dashboard-device-legend span { color: var(--muted); flex: 1; }
.dashboard-device-legend b { color: var(--text); font-size: 14px; }
.dashboard-dash-row { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 14px; }
.dashboard-dash-card { padding: 14px 16px; border: 1px solid rgba(215, 227, 240, 0.88); border-radius: 14px; background: var(--panel); }
.dashboard-dash-head { display: flex; justify-content: space-between; align-items: baseline; margin-bottom: 8px; }
.dashboard-dash-head span { font-size: 13px; color: var(--muted); }
.dashboard-dash-head strong { font-size: 24px; color: var(--text); }
.dashboard-dash-bar { height: 8px; border-radius: 4px; background: rgba(215, 227, 240, 0.6); overflow: hidden; }
.dashboard-dash-fill { height: 100%; border-radius: 4px; background: var(--accent); transition: width 0.4s ease; }
.dashboard-dash-meta { margin-top: 6px; font-size: 12px; color: var(--muted); }
.dashboard-screen-scoped-soft { max-height: calc(100vh - 56px); overflow: hidden; display: flex; flex-direction: column; }
.dashboard-screen-scoped-soft > .dashboard-command-grid { flex: 1; min-height: 0; overflow: hidden; }
.dashboard-screen-scoped-soft .dashboard-side-stack,
.dashboard-screen-scoped-soft .dashboard-command-main { overflow-y: auto; min-height: 0; }
.dashboard-screen-scoped-soft .dashboard-tech-panel { min-height: auto; }
.dashboard-screen-scoped-soft .dashboard-side-stack { display: flex; flex-direction: column; }
.dashboard-screen-scoped-soft .dashboard-side-stack > .dashboard-tech-panel { flex: 1; min-height: 0; }
.dashboard-customer-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 12px; padding: 14px 0; flex: 1; min-height: 0; overflow-y: auto; align-content: start; }
.dashboard-customer-card { padding: 16px 18px; border: 1px solid var(--line); border-radius: 14px; background: var(--panel); cursor: pointer; display: grid; gap: 10px; transition: border-color 0.15s; }
.dashboard-customer-card:hover { border-color: var(--accent); }
.dashboard-customer-card.is-danger { border-left: 4px solid #d95f5f; background: rgba(217,95,95,0.02); }
.dashboard-customer-card.is-warning { border-left: 4px solid #d9a02f; background: rgba(217,160,47,0.02); }
.dashboard-customer-card.is-success { border-left: 4px solid #35a66f; }
.dashboard-customer-head { display: flex; justify-content: space-between; align-items: flex-start; }
.dashboard-customer-head strong { font-size: 16px; color: var(--text); }
.dashboard-customer-head span { font-size: 12px; color: var(--muted); margin-left: 8px; }
.dashboard-customer-head b { font-size: 13px; color: var(--accent); white-space: nowrap; }
.dashboard-customer-stats { display: flex; gap: 16px; font-size: 13px; color: var(--muted); }
.dashboard-customer-alerts { display: flex; gap: 8px; flex-wrap: wrap; font-size: 13px; }
.dashboard-customer-alerts .is-danger { color: #d95f5f; font-weight: 600; }
.dashboard-customer-alerts .is-warning { color: #d9a02f; font-weight: 600; }
.dashboard-customer-alerts .is-clear { color: #35a66f; }
.dashboard-cross-alerts { display: flex; flex-wrap: wrap; gap: 6px 20px; padding: 10px 0; border-top: 1px solid var(--line); font-size: 13px; color: var(--muted); }
.dashboard-cross-alerts span { white-space: nowrap; }
.dashboard-cross-alerts b { color: var(--text); }
.dashboard-cross-alerts i { margin: 0 4px; color: var(--line); font-style: normal; }

/* Platform operations center: national institution map and aggregated operating health. */
.platform-operations { display: grid; gap: 16px; }
.platform-ops-header { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; padding: 6px 2px 2px; }
.platform-ops-kicker { margin: 0 0 5px; color: #2788c4; font-weight: 700; letter-spacing: .08em; font-size: 13px; }
.platform-ops-header h2 { margin: 0; color: #173e62; font-size: 28px; }
.platform-ops-header p { margin: 7px 0 0; color: var(--muted); }
.platform-ops-header-actions { display: flex; align-items: center; gap: 12px; color: var(--muted); font-size: 13px; }
.platform-ops-metrics { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.platform-ops-metric { min-height: 94px; padding: 14px 15px; border: 1px solid #d8eafa; border-radius: 14px; background: linear-gradient(145deg, #fff, #f0f9ff); text-align: left; cursor: default; }
.platform-ops-metric:nth-child(5), .platform-ops-metric:nth-child(6) { min-height: 78px; }
.platform-ops-metric:not(:disabled) { cursor: pointer; }
.platform-ops-metric:not(:disabled):hover { border-color: #79c2ec; transform: translateY(-1px); }
.platform-ops-metric span, .platform-ops-metric small { display: block; color: #6b8aa4; }
.platform-ops-metric strong { display: block; margin: 7px 0 4px; color: #1d77b3; font-size: 27px; line-height: 1; }
.platform-ops-grid { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 14px; align-items: stretch; }
.platform-ops-actions, .platform-ops-map-panel, .platform-ops-detail, .platform-ops-table-panel, .platform-ops-regions, .platform-ops-empty { border: 1px solid #d5e9f8; border-radius: 16px; background: rgba(255,255,255,.94); box-shadow: 0 10px 25px rgba(54, 128, 177, .06); }
.platform-ops-actions { display: grid; grid-column: 1 / -1; grid-template-columns: 160px repeat(2, minmax(0, 1fr)); grid-template-rows: repeat(2, minmax(58px, auto)); align-items: center; gap: 5px 10px; padding: 12px 14px; }
.platform-ops-actions h3, .platform-ops-detail h3, .platform-ops-table-panel h3, .platform-ops-regions h3 { margin: 0; color: #234b6d; }
.platform-ops-actions h3 { grid-column: 1; grid-row: 1; }
.platform-ops-actions p { grid-column: 1; grid-row: 2; margin: 0; color: #7793aa; font-size: 12px; line-height: 1.45; }
.platform-ops-actions button { display: grid; grid-row: auto; grid-template-columns: auto 1fr; align-items: center; width: 100%; min-height: 56px; gap: 8px; padding: 10px 11px; border: 1px solid #e2edf6; border-left: 3px solid #91c9eb; border-radius: 10px; background: #f8fcff; text-align: left; cursor: pointer; }
.platform-ops-actions button:hover { background: #edf8ff; border-color: #b9dbef; border-left-color: #2d9cdb; }
.platform-ops-actions strong { color: #cf5960; font-size: 22px; line-height: 1; }.platform-ops-actions span { color: #587791; font-size: 13px; }
.platform-ops-map-panel { position: relative; min-height: 610px; overflow: hidden; background: radial-gradient(circle at 50% 44%, #f9fdff, #e8f5fc); }
.platform-ops-filter { display: flex; flex-wrap: wrap; gap: 8px; padding: 12px; border-bottom: 1px solid #dceefa; }
.platform-ops-filter input, .platform-ops-filter select { min-width: 0; padding: 8px 10px; border: 1px solid #cfe4f3; border-radius: 8px; background: #fff; }
.platform-ops-filter input { flex: 1; }
.platform-map-navigation { display: flex; align-items: center; justify-content: space-between; gap: 10px; min-height: 42px; padding: 0 14px; border-bottom: 1px solid #e2f0fa; background: rgba(255,255,255,.6); }
.platform-map-breadcrumb { display: flex; align-items: center; gap: 6px; min-width: 0; overflow: hidden; color: #6e8ba3; font-size: 12px; white-space: nowrap; }
.platform-map-breadcrumb button { overflow: hidden; max-width: 130px; padding: 2px 0; border: 0; background: transparent; color: #367fae; text-overflow: ellipsis; cursor: pointer; }
.platform-map-breadcrumb button:last-child { color: #244d6c; font-weight: 700; }
.platform-map-controls { display: inline-flex; flex: 0 0 auto; gap: 5px; }
.platform-map-controls button { min-width: 29px; height: 29px; padding: 0 8px; border: 1px solid #cfe4f3; border-radius: 7px; background: #fff; color: #397fae; cursor: pointer; }
.platform-map-controls button:hover { border-color: #75bce5; background: #eef9ff; }
.platform-ops-map { position: relative; height: 443px; overflow: hidden; }
.platform-map-stage { position: absolute; inset: 0; transform-origin: 0 0; transform: translate(var(--map-x), var(--map-y)) scale(var(--map-zoom)); transition: transform .25s ease; }
.platform-ops-map svg { width: 100%; height: 100%; display: block; }
.platform-map-provinces path { fill: #d9effb; stroke: #fff; stroke-width: 1.2; vector-effect: non-scaling-stroke; }
.platform-map-provinces path.is-drillable { cursor: pointer; }
.platform-map-provinces path.is-drillable:hover, .platform-map-provinces path.is-drillable:focus { fill: #b9e0f6; outline: none; }
.platform-map-markers { position: absolute; inset: 8px 14px 0; pointer-events: none; }
.platform-map-marker { position: absolute; left: var(--marker-x); top: var(--marker-y); width: 38px; height: 38px; padding: 0; border: 0; background: transparent; cursor: pointer; transform: translate(-50%, -50%); pointer-events: auto; }
.platform-map-marker-pulse, .platform-map-marker-dot { position: absolute; display: block; border-radius: 50%; background: var(--marker-color); }
.platform-map-marker-pulse { inset: 0; opacity: .17; animation: platformMapPulse 2.2s ease-out infinite; }
.platform-map-marker-dot { width: 14px; height: 14px; top: 12px; left: 12px; border: 3px solid #fff; box-sizing: border-box; filter: drop-shadow(0 2px 4px rgba(22, 84, 124, .25)); }
.platform-map-marker:hover .platform-map-marker-dot, .platform-map-marker:focus .platform-map-marker-dot { width: 20px; height: 20px; top: 9px; left: 9px; }
.platform-map-area-labels { position: absolute; inset: 8px 14px 0; pointer-events: none; }
.platform-map-area-label { position: absolute; left: var(--area-x); top: var(--area-y); display: grid; gap: 1px; min-width: 64px; padding: 4px 7px; border: 1px solid rgba(104,170,210,.48); border-radius: 8px; background: rgba(255,255,255,.88); box-shadow: 0 3px 10px rgba(37,104,146,.12); color: #255778; text-align: center; transform: translate(-50%, calc(-100% - 16px)); pointer-events: auto; cursor: pointer; }
.platform-map-area-label strong { font-size: 12px; }.platform-map-area-label span { color: #6d8aa1; font-size: 10px; }.platform-map-area-label:hover { border-color: #2d9cdb; background: #f4fbff; }
@keyframes platformMapPulse { 0% { transform: scale(.65); opacity: .34; } 75%, 100% { transform: scale(1.5); opacity: 0; } }
.platform-map-load-error { display: grid; height: 100%; place-items: center; color: #6d869b; }
.platform-map-source-note { margin: 0; padding: 8px 16px 0; color: #708ca2; font-size: 12px; line-height: 1.5; }
.platform-ops-legend { display: flex; flex-wrap: wrap; gap: 12px; padding: 8px 16px 14px; color: #587791; font-size: 12px; }
.platform-ops-legend span { display: inline-flex; align-items: center; gap: 5px; }
.platform-ops-legend i { width: 9px; height: 9px; border-radius: 50%; background: #93a1af; }
.platform-ops-legend .is-normal { background: #2fa66d; }.platform-ops-legend .is-attention { background: #de9c2a; }.platform-ops-legend .is-risk { background: #df5e63; }.platform-ops-legend .is-unactivated { background: #93a1af; }.platform-ops-legend .is-disabled { background: #667484; }
.platform-ops-detail { align-self: stretch; padding: 17px; background: linear-gradient(180deg, #fff, #f7fbff); }
.platform-ops-detail-head { display: flex; justify-content: space-between; gap: 8px; }.platform-ops-detail-head h3 { margin: 4px 0; font-size: 19px; }.platform-ops-detail-head p { margin: 0; font-size: 13px; color: #667f95; }
.platform-ops-detail-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px; margin: 16px 0; }.platform-ops-detail-grid div { padding: 10px; border-radius: 9px; background: #f3faff; }.platform-ops-detail-grid strong, .platform-ops-detail-grid span { display: block; }.platform-ops-detail-grid strong { color: #207cb9; font-size: 20px; }.platform-ops-detail-grid span { color: #69869d; font-size: 12px; }
.platform-ops-issues { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 15px; }.platform-ops-issues span { padding: 5px 8px; border-radius: 999px; background: #fff4f4; color: #c75258; font-size: 12px; }.platform-ops-issues .is-clear { background: #eefaf3; color: #2a9865; }
.platform-ops-detail-foot { margin: 14px 0 0; color: #7b91a3; font-size: 12px; line-height: 1.6; }
.platform-ops-table-panel, .platform-ops-regions { padding: 16px; }.platform-ops-regions { padding-bottom: 6px; }
.platform-ops-empty { padding: 54px 28px; text-align: center; }.platform-ops-empty h3 { margin: 0; color: #244c6e; }.platform-ops-empty p { color: #718aa0; }.platform-ops-empty .primary-button { margin-top: 10px; }
@media (max-width: 1650px) { .platform-ops-metrics { grid-template-columns: repeat(3, 1fr); }.platform-ops-grid { grid-template-columns: minmax(0, 1fr); }.platform-ops-detail { grid-column: 1; }.platform-ops-detail-grid { grid-template-columns: repeat(4, 1fr); }.platform-ops-actions { grid-template-columns: 150px repeat(2, minmax(0, 1fr)); } }
@media (max-width: 760px) { .platform-ops-header, .platform-ops-header-actions { align-items: flex-start; flex-direction: column; }.platform-ops-metrics { grid-template-columns: repeat(2, 1fr); }.platform-ops-actions { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-rows: auto auto auto; }.platform-ops-actions h3 { grid-column: 1 / -1; grid-row: 1; }.platform-ops-actions p { grid-column: 1 / -1; grid-row: 2; }.platform-ops-actions button { grid-row: auto; }.platform-ops-map-panel { min-height: 520px; }.platform-ops-filter input { flex-basis: 100%; }.platform-map-navigation { align-items: flex-start; flex-direction: column; padding: 8px 12px; }.platform-map-controls { align-self: flex-end; }.platform-ops-detail-grid { grid-template-columns: repeat(2, 1fr); } }

/* Platform cockpit: operational readings take priority over management tables. */
.platform-operations {
  gap: 18px;
  padding: 24px;
  border: 1px solid #153c64;
  border-radius: 22px;
  background:
    radial-gradient(circle at 50% 0%, rgba(21, 114, 177, .24), transparent 31%),
    linear-gradient(rgba(55, 145, 206, .07) 1px, transparent 1px),
    linear-gradient(90deg, rgba(55, 145, 206, .07) 1px, transparent 1px),
    #07182d;
  background-size: auto, 32px 32px, 32px 32px, auto;
  box-shadow: 0 22px 48px rgba(7, 35, 65, .17);
  color: #d9edff;
}
.platform-ops-header { align-items: center; padding: 2px 0 6px; }
.platform-ops-kicker { color: #69cbff; }
.platform-ops-header h2 { color: #f0f8ff; font-size: 30px; letter-spacing: .02em; }
.platform-ops-header p { color: #91b6d4; }
.platform-ops-header-actions { color: #a8c5dc; }
.platform-system-status { display: inline-flex; align-items: center; gap: 7px; color: #8fe1bb; font-weight: 700; }
.platform-system-status i { width: 7px; height: 7px; border-radius: 50%; background: #4dd693; box-shadow: 0 0 0 5px rgba(77, 214, 147, .12); }
.platform-ops-header .primary-button { border-color: #3caee9; background: linear-gradient(135deg, #289fdf, #4bc3ee); box-shadow: 0 9px 22px rgba(28, 161, 225, .22); }
.platform-ops-metrics { grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 10px; }
.platform-ops-metric, .platform-ops-metric:nth-child(5), .platform-ops-metric:nth-child(6) {
  position: relative;
  min-height: 106px;
  padding: 16px;
  overflow: hidden;
  border: 1px solid rgba(105, 190, 243, .2);
  border-radius: 12px;
  background: linear-gradient(135deg, rgba(15, 55, 91, .94), rgba(10, 37, 65, .92));
}
.platform-ops-metric::after { position: absolute; right: -18px; bottom: -27px; width: 86px; height: 86px; border: 1px solid rgba(89, 201, 255, .16); border-radius: 50%; content: ""; }
.platform-ops-metric span, .platform-ops-metric small { position: relative; z-index: 1; color: #8db5d3; }
.platform-ops-metric strong { position: relative; z-index: 1; margin: 10px 0 5px; color: #f4fbff; font-size: 31px; font-variant-numeric: tabular-nums; }
.platform-ops-metric.is-danger strong { color: #ff8f9a; }
.platform-ops-metric.is-warning strong { color: #ffd36b; }
.platform-ops-metric:not(:disabled):hover { border-color: #65c6f7; background: linear-gradient(135deg, #124d7f, #0b355d); }

.platform-cockpit-top { display: grid; grid-template-columns: minmax(205px, .8fr) minmax(520px, 2.15fr) minmax(205px, .8fr); gap: 12px; align-items: stretch; }
.platform-cockpit-panel, .platform-ops-map-panel, .platform-ops-detail, .platform-ops-actions, .platform-ops-table-panel, .platform-ops-regions {
  border: 1px solid rgba(103, 190, 242, .2);
  border-radius: 14px;
  background: linear-gradient(155deg, rgba(10, 43, 74, .94), rgba(6, 29, 53, .95));
  box-shadow: inset 0 1px 0 rgba(175, 229, 255, .06), 0 12px 24px rgba(0, 0, 0, .15);
}
.platform-cockpit-panel { min-width: 0; padding: 15px; }
.platform-cockpit-panel-head, .platform-map-panel-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 9px; padding-bottom: 12px; border-bottom: 1px solid rgba(118, 196, 244, .15); }
.platform-cockpit-panel-head > div > span, .platform-map-panel-head > div > span { display: block; margin-bottom: 4px; color: #69caff; font-size: 11px; font-weight: 700; letter-spacing: .08em; }
.platform-cockpit-panel h3, .platform-map-panel-head h3 { margin: 0; color: #eef8ff; font-size: 16px; }
.platform-cockpit-panel-head small, .platform-map-panel-head p { margin: 3px 0 0; color: #84a9c8; font-size: 11px; white-space: nowrap; }
.platform-cockpit-bars { display: grid; gap: 13px; padding-top: 17px; }
.platform-cockpit-bars button { display: grid; grid-template-columns: minmax(42px, .7fr) minmax(52px, 1fr) 24px; align-items: center; gap: 7px; padding: 0; border: 0; background: transparent; color: #c9e8fb; font-size: 12px; text-align: left; cursor: pointer; }
.platform-cockpit-bars button > i { display: block; height: 6px; overflow: hidden; border-radius: 99px; background: rgba(128, 199, 241, .15); }
.platform-cockpit-bars button > i b { display: block; width: var(--coverage); height: 100%; border-radius: inherit; background: linear-gradient(90deg, #35aff1, #82e6ff); box-shadow: 0 0 10px rgba(80, 211, 255, .5); }
.platform-cockpit-bars button strong { color: #eff9ff; font-size: 15px; text-align: right; }
.platform-cockpit-bars button:hover span { color: #81d5ff; }
.platform-health-main { display: grid; grid-template-columns: 84px 1fr; align-items: center; gap: 13px; padding-top: 19px; }
.platform-health-ring { display: grid; width: 82px; height: 82px; place-content: center; border-radius: 50%; background: radial-gradient(circle, #0a2d4d 56%, transparent 57%), conic-gradient(#52dba4 var(--health-rate), rgba(125, 199, 243, .14) 0); text-align: center; }
.platform-health-ring strong { color: #e8f8ff; font-size: 20px; }.platform-health-ring span { color: #87b2d0; font-size: 10px; }
.platform-health-copy strong, .platform-health-copy span { display: block; }.platform-health-copy strong { color: #f1f9ff; font-size: 26px; }.platform-health-copy span { margin-top: 2px; color: #86b2d2; font-size: 12px; }.platform-health-copy p { margin: 9px 0 0; color: #8eb1cc; font-size: 11px; line-height: 1.6; }

.platform-ops-map-panel { position: relative; min-height: 0; overflow: hidden; background: radial-gradient(circle at 50% 43%, rgba(28, 114, 170, .25), rgba(7, 31, 54, .98) 69%); }
.platform-map-panel-head { padding: 15px 16px 11px; }.platform-map-panel-head p { align-self: flex-end; }
.platform-ops-filter { gap: 6px; padding: 9px 12px; border-bottom-color: rgba(118, 196, 244, .14); }.platform-ops-filter input, .platform-ops-filter select { min-width: 80px; padding: 7px 8px; border-color: rgba(115, 192, 238, .25); border-radius: 7px; background: rgba(2, 24, 44, .65); color: #cceaff; font-size: 12px; }.platform-ops-filter input::placeholder { color: #6d98b8; }.platform-ops-filter .ghost-button { min-height: 31px; padding: 6px 9px; border-color: rgba(115, 192, 238, .3); color: #9ddcff; background: rgba(27, 100, 151, .22); }
.platform-map-navigation { min-height: 38px; padding: 0 13px; border-bottom-color: rgba(118, 196, 244, .12); background: rgba(4, 26, 47, .45); }.platform-map-breadcrumb { color: #79a6c5; }.platform-map-breadcrumb button { color: #76d3ff; }.platform-map-breadcrumb button:last-child { color: #e2f4ff; }.platform-map-controls button { border-color: rgba(115, 192, 238, .3); background: rgba(21, 81, 124, .66); color: #bfe8ff; }.platform-map-controls button:hover { border-color: #69cdf8; background: #145078; }
.platform-ops-map { height: 375px; }.platform-map-provinces path { fill: #164c78; stroke: #2a729e; stroke-width: 1; }.platform-map-provinces path.is-drillable:hover, .platform-map-provinces path.is-drillable:focus { fill: #236b9d; }.platform-map-marker-dot { border-color: #dff6ff; filter: drop-shadow(0 0 7px var(--marker-color)); }.platform-map-area-label { border-color: rgba(112, 215, 255, .5); background: rgba(7, 41, 70, .88); box-shadow: 0 4px 13px rgba(0, 0, 0, .28); color: #d7f3ff; }.platform-map-area-label span { color: #8ebbd7; }.platform-map-area-label:hover { border-color: #71d9ff; background: #0d537e; }
.platform-map-source-note { padding: 7px 14px 0; color: #7ea9c6; }.platform-ops-legend { padding: 7px 14px 12px; color: #9bc2dc; }

.platform-cockpit-bottom { display: grid; grid-template-columns: 1fr 1fr minmax(280px, 1.1fr); gap: 12px; align-items: stretch; }
.platform-risk-matrix { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; padding-top: 14px; }.platform-risk-matrix button { display: grid; min-height: 70px; padding: 10px; border: 1px solid rgba(120, 190, 235, .16); border-left-width: 3px; border-radius: 8px; background: rgba(5, 29, 52, .57); color: #d9eeff; text-align: left; cursor: pointer; }.platform-risk-matrix button:disabled { cursor: default; }.platform-risk-matrix strong { color: #f2f9ff; font-size: 23px; line-height: 1; }.platform-risk-matrix span { margin-top: 6px; font-size: 12px; }.platform-risk-matrix small { margin-top: 3px; color: #85a8c3; font-size: 10px; }.platform-risk-matrix .urgent { border-left-color: #fb6f7b; }.platform-risk-matrix .urgent strong { color: #ff9ba4; }.platform-risk-matrix .follow-up { border-left-color: #f6c75d; }.platform-risk-matrix .follow-up strong { color: #ffdc80; }.platform-risk-matrix .attention { border-left-color: #5fbdfa; }.platform-risk-matrix .stable { border-left-color: #50ca92; }.platform-risk-matrix button:not(:disabled):hover { background: rgba(21, 84, 124, .55); }
.platform-live-dot { color: #88ddb4 !important; }.platform-live-dot::before { display: inline-block; width: 6px; height: 6px; margin-right: 4px; border-radius: 50%; background: currentColor; content: ""; }.platform-live-list { display: grid; padding-top: 5px; }.platform-live-list button { display: grid; grid-template-columns: 9px minmax(0, 1fr) auto; gap: 8px; align-items: center; padding: 10px 0; border: 0; border-bottom: 1px solid rgba(118, 196, 244, .12); background: transparent; color: #dff2ff; text-align: left; cursor: pointer; }.platform-live-list button:last-child { border-bottom: 0; }.platform-live-list i { width: 7px; height: 7px; border-radius: 50%; background: #55cf93; }.platform-live-list i.risk { background: #ff7784; }.platform-live-list i.attention { background: #f6c75d; }.platform-live-list i.unactivated, .platform-live-list i.disabled { background: #7896ad; }.platform-live-list strong, .platform-live-list small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }.platform-live-list strong { font-size: 12px; }.platform-live-list small, .platform-live-list time { margin-top: 3px; color: #82a9c5; font-size: 10px; }.platform-live-list time { max-width: 78px; white-space: nowrap; text-align: right; }.platform-live-list button:hover strong { color: #82d7ff; }
.platform-ops-detail { padding: 15px; background: linear-gradient(150deg, rgba(11, 48, 82, .97), rgba(7, 30, 54, .96)); }.platform-ops-detail h3, .platform-ops-actions h3, .platform-ops-table-panel h3, .platform-ops-regions h3 { color: #eef8ff; }.platform-ops-detail-head p { color: #91b6d0; }.platform-ops-detail-grid div { background: rgba(23, 84, 125, .33); }.platform-ops-detail-grid strong { color: #9bdfff; }.platform-ops-detail-grid span { color: #89adca; }.platform-ops-detail-foot { color: #86a9c4; }.platform-ops-detail .ghost-button, .platform-ops-detail .primary-button { font-size: 12px; }
.platform-ops-actions { display: grid; grid-template-columns: 1.4fr repeat(4, 1fr); grid-template-rows: auto; gap: 10px; padding: 13px; }.platform-ops-actions > div { padding: 3px 7px; }.platform-ops-actions > div > span { color: #6ecbff; font-size: 11px; font-weight: 700; letter-spacing: .08em; }.platform-ops-actions h3 { margin: 4px 0; font-size: 17px; }.platform-ops-actions p { margin: 0; color: #89acc6; font-size: 11px; }.platform-ops-actions button { min-height: 64px; grid-template-columns: auto 1fr; gap: 9px; padding: 11px; border-color: rgba(118, 196, 244, .2); border-left-color: #55bdf4; border-radius: 9px; background: rgba(8, 40, 69, .75); }.platform-ops-actions button strong { color: #dff5ff; font-size: 25px; }.platform-ops-actions button span { color: #a4cbe2; }.platform-ops-actions button.is-danger { border-left-color: #ff7884; }.platform-ops-actions button.is-danger strong { color: #ff9fa8; }.platform-ops-actions button.is-warning { border-left-color: #f6c75d; }.platform-ops-actions button.is-warning strong { color: #ffda7b; }.platform-ops-actions button:hover { border-color: #58c4f7; background: rgba(20, 90, 134, .62); }
.platform-ops-data-row { display: grid; grid-template-columns: minmax(280px, .68fr) minmax(0, 1.32fr); gap: 12px; }.platform-ops-table-panel, .platform-ops-regions { padding: 15px; background: rgba(6, 29, 53, .94); }.platform-ops-table-panel .panel-header { margin-bottom: 6px; }.platform-ops-table-panel .section-subtitle, .platform-ops-regions .muted, .platform-ops-data-row .muted { color: #88abc5; }.platform-ops-data-row table { color: #cbe4f4; }.platform-ops-data-row th { color: #80bbdf; border-bottom-color: rgba(121, 194, 238, .18); }.platform-ops-data-row td { border-bottom-color: rgba(121, 194, 238, .12); }.platform-ops-data-row tr:hover td { background: rgba(41, 122, 170, .13); }.platform-ops-data-row .ghost-button { border-color: rgba(118, 196, 244, .28); color: #a6dcfb; background: rgba(24, 95, 140, .22); }
.platform-ops-empty { border-color: rgba(103, 190, 242, .25); background: rgba(6, 29, 53, .86); }.platform-ops-empty h3 { color: #e7f7ff; }.platform-ops-empty p { color: #93b8d2; }
@media (max-width: 1560px) { .platform-ops-metrics { grid-template-columns: repeat(3, minmax(0, 1fr)); }.platform-cockpit-top { grid-template-columns: minmax(200px, .8fr) minmax(480px, 2fr); }.platform-cockpit-health { grid-column: 1 / -1; }.platform-health-main { max-width: 380px; }.platform-cockpit-bottom { grid-template-columns: 1fr 1fr; }.platform-ops-detail { grid-column: 1 / -1; }.platform-ops-detail-grid { grid-template-columns: repeat(4, 1fr); } }
@media (max-width: 980px) { .platform-operations { padding: 16px; }.platform-cockpit-top, .platform-cockpit-bottom, .platform-ops-data-row { grid-template-columns: 1fr; }.platform-cockpit-health, .platform-ops-detail { grid-column: auto; }.platform-ops-actions { grid-template-columns: repeat(2, minmax(0, 1fr)); }.platform-ops-actions > div { grid-column: 1 / -1; }.platform-ops-map { height: 355px; } }
@media (max-width: 620px) { .platform-operations { padding: 12px; border-radius: 15px; }.platform-ops-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }.platform-ops-metric { min-height: 94px; padding: 12px; }.platform-ops-metric strong { font-size: 26px; }.platform-ops-header-actions { flex-wrap: wrap; }.platform-ops-filter select { max-width: calc(50% - 4px); }.platform-ops-map { height: 315px; }.platform-ops-detail-grid { grid-template-columns: repeat(2, 1fr); }.platform-live-list time { display: none; } }

/* Keep the cockpit inside the product's existing light-blue visual language. */
.platform-operations {
  border-color: #d6eafb;
  background:
    linear-gradient(rgba(116, 187, 233, .10) 1px, transparent 1px),
    linear-gradient(90deg, rgba(116, 187, 233, .10) 1px, transparent 1px),
    linear-gradient(180deg, #f9fdff, #edf7ff);
  background-size: 32px 32px, 32px 32px, auto;
  box-shadow: 0 18px 42px rgba(48, 126, 176, .10);
  color: #244d6d;
}
.platform-ops-kicker { color: #2788c4; }
.platform-ops-header h2 { color: #173e62; }
.platform-ops-header p, .platform-ops-header-actions { color: #6e8ba3; }
.platform-system-status { color: #2b9a69; }.platform-system-status i { background: #42bd84; box-shadow: 0 0 0 5px rgba(66, 189, 132, .12); }
.platform-ops-header .primary-button { border-color: #78c2ea; background: linear-gradient(135deg, #4aaee1, #78c8ef); box-shadow: 0 8px 18px rgba(66, 166, 223, .17); }
.platform-ops-metric, .platform-ops-metric:nth-child(5), .platform-ops-metric:nth-child(6) { border-color: #cfe5f5; background: linear-gradient(145deg, #fff, #eff9ff); }
.platform-ops-metric::after { right: 17px; bottom: 17px; width: 110px; height: 34px; border-color: #a9d8f2; border-radius: 18px; }
.platform-ops-metric span, .platform-ops-metric small { color: #6b8aa4; }
.platform-ops-metric strong { color: #1c77b3; }
.platform-ops-metric.is-danger strong { color: #d85d68; }.platform-ops-metric.is-warning strong { color: #d89b28; }
.platform-ops-metric:not(:disabled):hover { border-color: #76c0e7; background: linear-gradient(145deg, #fff, #e7f6ff); }

/* Compact metric strips: the control itself is the long rounded outline. */
.platform-ops-metrics { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.platform-ops-metric, .platform-ops-metric:nth-child(5), .platform-ops-metric:nth-child(6) {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  grid-template-rows: auto auto;
  align-items: center;
  min-height: 68px;
  padding: 9px 16px;
  border-radius: 16px;
  background: rgba(255,255,255,.86);
}
.platform-ops-metric::after { display: none; }
.platform-ops-metric span { grid-column: 1; grid-row: 1; font-size: 13px; font-weight: 700; }
.platform-ops-metric small { grid-column: 1; grid-row: 2; overflow: hidden; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.platform-ops-metric strong { grid-column: 2; grid-row: 1 / -1; margin: 0; padding-left: 14px; font-size: 29px; }
@media (max-width: 620px) {
  .platform-ops-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .platform-ops-metric strong { padding-left: 8px; font-size: 25px; }
}

/* The map is the cockpit's primary surface; supporting readings sit below it. */
.platform-ops-metrics { grid-template-columns: repeat(6, minmax(0, 1fr)); }
.platform-cockpit-top { display: block; }
.platform-cockpit-top .platform-ops-map-panel { width: 100%; }
.platform-cockpit-top .platform-ops-map { height: 480px; }
.platform-cockpit-bottom { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.platform-cockpit-bottom .platform-cockpit-health { grid-column: auto; }
.platform-institution-list-page .platform-ops-table-panel { padding: 18px; }
.platform-institution-list-page .platform-ops-table-panel .section-title { margin: 0; color: #234b6d; }
.platform-institution-list-page .platform-ops-table-panel .section-subtitle { color: #7795aa; }
.platform-institution-list-page table { color: #456a83; }
.platform-institution-list-page th { color: #5e89a6; border-bottom-color: #dcebf5; }
.platform-institution-list-page td { border-bottom-color: #e6f0f7; }
.platform-institution-list-page tr:hover td { background: #f1f9ff; }
@media (max-width: 980px) {
  .platform-ops-metrics { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 980px) {
  .platform-cockpit-top .platform-ops-map { height: 355px; }
  .platform-cockpit-bottom { grid-template-columns: 1fr; }
}
@media (max-width: 620px) {
  .platform-ops-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

.platform-cockpit-panel, .platform-ops-map-panel, .platform-ops-detail, .platform-ops-actions, .platform-ops-table-panel, .platform-ops-regions { border-color: #d5e9f8; background: rgba(255,255,255,.94); box-shadow: inset 0 1px 0 rgba(255,255,255,.9), 0 10px 22px rgba(54, 128, 177, .06); }
.platform-cockpit-panel-head, .platform-map-panel-head { border-bottom-color: #e1eff9; }
.platform-cockpit-panel-head > div > span, .platform-map-panel-head > div > span { color: #2788c4; }
.platform-cockpit-panel h3, .platform-map-panel-head h3, .platform-ops-detail h3, .platform-ops-actions h3, .platform-ops-table-panel h3, .platform-ops-regions h3 { color: #234b6d; }
.platform-cockpit-panel-head small, .platform-map-panel-head p { color: #7594ac; }
.platform-cockpit-bars button { color: #416783; }.platform-cockpit-bars button > i { background: #e0eff9; }.platform-cockpit-bars button > i b { background: linear-gradient(90deg, #4aaee1, #8bd8f5); box-shadow: 0 0 8px rgba(76, 180, 231, .26); }.platform-cockpit-bars button strong { color: #286b98; }.platform-cockpit-bars button:hover span { color: #2287c0; }
.platform-health-ring { background: radial-gradient(circle, #fff 56%, transparent 57%), conic-gradient(#42b87c var(--health-rate), #e1eff8 0); box-shadow: inset 0 0 0 1px #dcecf7; }.platform-health-ring strong { color: #277aaf; }.platform-health-ring span { color: #7996ac; }.platform-health-copy strong { color: #277aaf; }.platform-health-copy span, .platform-health-copy p { color: #7491a8; }

.platform-ops-map-panel { background: radial-gradient(circle at 50% 43%, #fbfeff, #e8f5fc); }
.platform-map-panel-head { background: rgba(255,255,255,.5); }.platform-ops-filter { border-bottom-color: #dceefa; }.platform-ops-filter input, .platform-ops-filter select { border-color: #cfe4f3; background: #fff; color: #406984; }.platform-ops-filter input::placeholder { color: #90a9ba; }.platform-ops-filter .ghost-button { border-color: #c6e1f1; color: #397fae; background: #f3faff; }
.platform-map-navigation { border-bottom-color: #e2f0fa; background: rgba(255,255,255,.62); }.platform-map-breadcrumb { color: #6e8ba3; }.platform-map-breadcrumb button { color: #367fae; }.platform-map-breadcrumb button:last-child { color: #244d6c; }.platform-map-controls button { border-color: #cfe4f3; background: #fff; color: #397fae; }.platform-map-controls button:hover { border-color: #75bce5; background: #eef9ff; }
.platform-map-provinces path { fill: #d9effb; stroke: #fff; }.platform-map-provinces path.is-drillable:hover, .platform-map-provinces path.is-drillable:focus { fill: #b9e0f6; }.platform-map-marker-dot { border-color: #fff; filter: drop-shadow(0 2px 4px rgba(22, 84, 124, .25)); }.platform-map-area-label { border-color: rgba(104,170,210,.48); background: rgba(255,255,255,.9); box-shadow: 0 3px 10px rgba(37,104,146,.12); color: #255778; }.platform-map-area-label span { color: #6d8aa1; }.platform-map-area-label:hover { border-color: #2d9cdb; background: #f4fbff; }
.platform-map-source-note { color: #708ca2; }.platform-ops-legend { color: #587791; }

.platform-risk-matrix button { border-color: #e1edf5; background: #f8fcff; color: #345e7a; }.platform-risk-matrix strong { color: #286e9e; }.platform-risk-matrix small { color: #7796ac; }.platform-risk-matrix .urgent { border-left-color: #df6971; }.platform-risk-matrix .urgent strong { color: #d85d67; }.platform-risk-matrix .follow-up { border-left-color: #e2ab39; }.platform-risk-matrix .follow-up strong { color: #c88a19; }.platform-risk-matrix .attention { border-left-color: #56b4e8; }.platform-risk-matrix .stable { border-left-color: #43b77d; }.platform-risk-matrix button:not(:disabled):hover { background: #edf8ff; }
.platform-live-dot { color: #2d9b6b !important; }.platform-live-list button { border-bottom-color: #e3eef6; color: #365e79; }.platform-live-list i { background: #41b77e; }.platform-live-list i.risk { background: #df6971; }.platform-live-list i.attention { background: #e3ad39; }.platform-live-list i.unactivated, .platform-live-list i.disabled { background: #8ba2b2; }.platform-live-list small, .platform-live-list time { color: #7895aa; }.platform-live-list button:hover strong { color: #2288c1; }
.platform-ops-detail { background: linear-gradient(180deg, #fff, #f7fbff); }.platform-ops-detail-head p { color: #667f95; }.platform-ops-detail-grid div { background: #f3faff; }.platform-ops-detail-grid strong { color: #207cb9; }.platform-ops-detail-grid span, .platform-ops-detail-foot { color: #69869d; }
.platform-ops-actions { background: rgba(255,255,255,.94); }.platform-ops-actions > div > span { color: #2788c4; }.platform-ops-actions p { color: #7793aa; }.platform-ops-actions button { border-color: #e2edf6; border-left-color: #91c9eb; background: #f8fcff; }.platform-ops-actions button strong { color: #237fb9; }.platform-ops-actions button span { color: #587791; }.platform-ops-actions button.is-danger { border-left-color: #df6971; }.platform-ops-actions button.is-danger strong { color: #d85d67; }.platform-ops-actions button.is-warning { border-left-color: #e2ab39; }.platform-ops-actions button.is-warning strong { color: #c88a19; }.platform-ops-actions button:hover { border-color: #b9dbef; background: #edf8ff; }
.platform-ops-data-row { grid-template-columns: minmax(0, 1fr); }.platform-ops-table-panel, .platform-ops-regions { background: rgba(255,255,255,.94); }.platform-ops-table-panel .section-subtitle, .platform-ops-regions .muted, .platform-ops-data-row .muted { color: #7795aa; }.platform-ops-data-row table { color: #456a83; }.platform-ops-data-row th { color: #5e89a6; border-bottom-color: #dcebf5; }.platform-ops-data-row td { border-bottom-color: #e6f0f7; }.platform-ops-data-row tr:hover td { background: #f1f9ff; }.platform-ops-data-row .ghost-button { border-color: #cfe4f3; color: #397fae; background: #f7fcff; }
.platform-ops-empty { border-color: #d5e9f8; background: rgba(255,255,255,.94); }.platform-ops-empty h3 { color: #244c6e; }.platform-ops-empty p { color: #718aa0; }

/* Scoped customer-operations command center, aligned with the platform's light-blue theme. */
.dashboard-screen-scoped-ops {
  background:
    linear-gradient(rgba(113, 186, 232, 0.10) 1px, transparent 1px),
    linear-gradient(90deg, rgba(113, 186, 232, 0.10) 1px, transparent 1px),
    radial-gradient(circle at 50% -14%, rgba(130, 204, 245, 0.36), transparent 34%),
    linear-gradient(180deg, #f8fcff 0%, #edf7ff 100%);
  background-size: 32px 32px, 32px 32px, auto, auto;
}

.dashboard-screen-scoped-ops::before {
  opacity: 0.52;
}

.dashboard-screen-scoped-ops .dashboard-topbar-reference {
  min-height: 76px;
  padding: 8px 22px;
  border-bottom-color: rgba(125, 190, 232, 0.58);
}

.dashboard-screen-scoped-ops .dashboard-clock {
  font-size: 23px;
  letter-spacing: 0.04em;
  color: #214563;
  white-space: nowrap;
}

.dashboard-screen-scoped-ops .dashboard-center-title-reference {
  min-width: 420px;
  padding: 4px 26px 7px;
  border: 0;
  border-bottom: 2px solid rgba(91, 173, 225, 0.54);
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.dashboard-screen-scoped-ops .dashboard-center-title-reference::before,
.dashboard-screen-scoped-ops .dashboard-center-title-reference::after {
  opacity: 0.85;
}

.dashboard-screen-scoped-ops .dashboard-center-title-reference h1 {
  font-size: clamp(23px, 1.7vw, 32px);
  letter-spacing: 0.08em;
}

.dashboard-screen-scoped-ops .dashboard-center-title-reference p {
  font-size: 12px;
  letter-spacing: 0.04em;
}

.dashboard-screen-scoped-ops .dashboard-command-grid {
  gap: 10px;
  padding: 8px 18px 12px;
  grid-template-rows: auto 122px minmax(385px, 1.25fr) 116px !important;
}

.dashboard-screen-scoped-ops .dashboard-topbar-block {
  gap: 4px;
}

.dashboard-screen-scoped-ops .dashboard-topbar-company {
  font-size: 12px;
}

.dashboard-screen-scoped-ops .dashboard-refresh-button {
  padding: 6px 12px;
}

.dashboard-screen-scoped-ops .dashboard-ops-kpis {
  gap: 8px;
}

.dashboard-screen-scoped-ops .dashboard-ops-kpis .dashboard-module-card {
  min-height: 60px;
  padding: 6px 12px 5px;
  border-color: rgba(135, 197, 235, 0.68);
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.96), rgba(239, 248, 255, 0.88)),
    rgba(248, 252, 255, 0.9);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.92), 0 6px 18px rgba(47, 126, 177, 0.08);
}

.dashboard-screen-scoped-ops .dashboard-ops-kpis .dashboard-module-card::before {
  top: 10px;
  right: 12px;
  width: 30px;
  height: 30px;
  opacity: 0.68;
}

.dashboard-screen-scoped-ops .dashboard-ops-kpis .dashboard-module-card span {
  font-size: 12px;
  color: #6884a0;
}

.dashboard-screen-scoped-ops .dashboard-ops-kpis .dashboard-module-card strong {
  margin-top: 3px;
  font-size: 24px;
  line-height: 1;
  color: #167ec1;
  text-shadow: none;
}

.dashboard-screen-scoped-ops .dashboard-ops-kpis .dashboard-module-card em {
  margin-top: 2px;
  font-size: 12px;
  color: #5f92b8;
}

.dashboard-screen-scoped-ops .dashboard-tech-panel,
.dashboard-screen-scoped-ops .dashboard-table-panel-reference {
  border-color: rgba(136, 199, 237, 0.72);
  border-radius: 9px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.92), rgba(244, 250, 255, 0.88)),
    rgba(248, 252, 255, 0.92);
  box-shadow: 0 8px 22px rgba(54, 128, 177, 0.08);
}

.dashboard-screen-scoped-ops .dashboard-tech-panel::before,
.dashboard-screen-scoped-ops .dashboard-table-panel-reference::before {
  left: 12px;
  width: 72px;
  height: 3px;
  background: linear-gradient(90deg, #39a7e5, rgba(57, 167, 229, 0));
}

.dashboard-screen-scoped-ops .dashboard-tech-title,
.dashboard-screen-scoped-ops .dashboard-panel-head h2 {
  font-size: 16px;
  color: #214563;
}

.dashboard-screen-scoped-ops .dashboard-tech-title {
  min-height: 24px;
  margin-bottom: 5px;
  background: linear-gradient(90deg, rgba(82, 174, 228, 0.26), rgba(220, 242, 255, 0.58) 68%, transparent 68%);
}

.dashboard-screen-scoped-ops .dashboard-tech-title::before {
  color: #2f98d8;
}

.dashboard-screen-scoped-ops .dashboard-sparkline-board {
  padding: 5px 10px 6px;
  border-color: rgba(170, 214, 241, 0.65);
  background: linear-gradient(180deg, rgba(250, 253, 255, 0.95), rgba(238, 248, 255, 0.9));
}

.dashboard-screen-scoped-ops .dashboard-tech-meta {
  margin-bottom: 4px;
}

.dashboard-screen-scoped-ops .dashboard-sparkline {
  height: 48px;
}

.dashboard-screen-scoped-ops .dashboard-sparkline-labels {
  margin-top: 2px;
}

.dashboard-screen-scoped-ops .dashboard-alert-hero {
  display: flex;
  align-items: baseline;
  justify-content: center;
  gap: 8px;
  width: 100%;
  min-height: 40px;
  margin: 0 0 3px;
  border-width: 1px;
  border-radius: 8px;
  border-color: rgba(81, 169, 222, 0.35);
  box-shadow: none;
}

.dashboard-screen-scoped-ops .dashboard-alert-hero strong {
  font-size: 25px;
  color: #d95f5f;
}

.dashboard-screen-scoped-ops .dashboard-alert-hero span {
  font-size: 11px;
}

.dashboard-screen-scoped-ops .dashboard-flash-list {
  gap: 4px;
}

.dashboard-screen-scoped-ops .dashboard-flash-item {
  padding: 5px 8px;
  border-color: rgba(217, 95, 95, 0.24);
  background: rgba(255, 250, 250, 0.72);
}

.dashboard-screen-scoped-ops .dashboard-flash-item strong {
  font-size: 12px;
}

.dashboard-screen-scoped-ops .dashboard-alert-breakdown,
.dashboard-screen-scoped-ops .dashboard-donut-note {
  color: #6c86a1;
  font-size: 11px;
  line-height: 1.4;
}

.dashboard-screen-scoped-ops .dashboard-alert-breakdown {
  margin-bottom: 5px;
  text-align: center;
}

.dashboard-screen-scoped-ops .dashboard-donut-note {
  margin-top: 4px;
  padding: 4px 8px;
  border-radius: 6px;
  background: rgba(255, 174, 66, 0.12);
  color: #a96f12;
  text-align: center;
}

.dashboard-screen-scoped-ops .dashboard-table-panel-reference {
  padding: 10px 12px;
}

.dashboard-screen-scoped-ops .dashboard-table-panel-reference .dashboard-panel-head {
  margin-bottom: 5px;
}

.dashboard-screen-scoped-ops .dashboard-table th,
.dashboard-screen-scoped-ops .dashboard-table td {
  padding: 5px 9px;
  font-size: 12px;
}

.dashboard-screen-scoped-ops .dashboard-table th {
  background: rgba(228, 244, 255, 0.82);
}

.dashboard-screen-scoped-ops .dashboard-donut-wrap {
  gap: 16px;
}

.dashboard-screen-scoped-ops .dashboard-donut {
  width: 96px;
  height: 96px;
  box-shadow: inset 0 0 0 1px rgba(126, 194, 234, 0.72), 0 8px 18px rgba(71, 145, 191, 0.12);
}

.dashboard-screen-scoped-ops .dashboard-donut-core {
  inset: 9px;
  background: #f8fcff;
}

.dashboard-screen-scoped-ops .dashboard-legend-row {
  padding: 5px 0;
  font-size: 12px;
}

.dashboard-screen-scoped-ops .dashboard-ops-shortcuts {
  height: 116px;
  min-height: 0;
  padding: 8px 12px !important;
}

.dashboard-screen-scoped-ops .dashboard-ops-shortcuts .dashboard-panel-head {
  margin-bottom: 6px !important;
}

.dashboard-screen-scoped-ops .dashboard-ops-shortcuts .dashboard-module-card {
  min-height: 52px;
  padding: 6px 10px !important;
  border-radius: 7px;
  border-color: rgba(145, 204, 240, 0.65);
  background: rgba(255, 255, 255, 0.78);
  box-shadow: none;
}

.dashboard-screen-scoped-ops .dashboard-ops-shortcuts .dashboard-module-card::before {
  display: none;
}

.dashboard-screen-scoped-ops .dashboard-ops-shortcuts .dashboard-module-card span {
  font-size: 12px;
}

.dashboard-screen-scoped-ops .dashboard-ops-shortcuts .dashboard-module-card strong {
  margin-top: 4px;
  font-size: 22px;
  color: #167ec1;
}

.dashboard-screen-scoped-ops .dashboard-ops-shortcuts .dashboard-module-card em {
  margin-top: 3px;
  font-size: 11px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

@media (max-height: 860px) {
  .dashboard-screen-scoped-ops {
    overflow-y: auto;
  }

  .dashboard-screen-scoped-ops > .dashboard-command-grid {
    flex: 0 0 auto;
    overflow: visible;
  }
}

/* Customer dashboard rebuilt from the approved light digital operations reference. */
.dashboard-app-shell-scoped-reference {
  display: block;
  min-height: 100vh;
  background: #f6fbff;
}

.dashboard-app-shell-scoped-reference .sidebar {
  display: none;
}

.dashboard-app-shell-scoped-reference .main.dashboard-main {
  min-height: 100vh;
  padding: 0;
}

.dashboard-quick-nav {
  position: sticky;
  top: 0;
  z-index: 20;
  display: flex;
  align-items: center;
  gap: 12px;
  min-height: 50px;
  padding: 8px 20px;
  border-bottom: 1px solid rgba(194, 222, 243, 0.9);
  background: rgba(248, 252, 255, 0.94);
  box-shadow: 0 8px 20px rgba(71, 125, 179, 0.08);
  backdrop-filter: blur(12px);
}

.dashboard-quick-nav > span {
  flex: 0 0 auto;
  color: #31577d;
  font-size: 13px;
  font-weight: 800;
}

.dashboard-quick-nav-actions {
  display: flex;
  flex: 1;
  flex-wrap: wrap;
  gap: 6px;
}

.dashboard-quick-nav .ghost-button {
  min-height: 30px;
  padding: 4px 10px;
  font-size: 12px;
}

.dashboard-quick-nav .ghost-button.active {
  border-color: rgba(80, 168, 228, 0.95);
  background: linear-gradient(135deg, #4ea7e3 0%, #89c8ef 100%);
  color: #ffffff;
}

.dashboard-quick-nav .dashboard-quick-nav-logout {
  margin-left: auto;
}

.dashboard-reference-target {
  min-height: 100vh;
  padding: 12px 20px;
  overflow: hidden;
  color: #173b67;
  background: linear-gradient(180deg, #fcfeff 0%, #f3f9ff 100%);
  font-family: "Microsoft YaHei UI", "PingFang SC", sans-serif;
}

.dashboard-reference-svg {
  display: inline-block;
  width: 1em;
  height: 1em;
  flex: 0 0 auto;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.8;
}

.dashboard-reference-header {
  display: grid;
  grid-template-columns: 1fr minmax(420px, 1.35fr) 1fr;
  align-items: center;
  min-height: 68px;
  margin-bottom: 10px;
}

.dashboard-reference-time {
  align-self: stretch;
  display: grid;
  align-content: center;
  gap: 10px;
  color: #102f57;
}

.dashboard-reference-time > div {
  display: flex;
  align-items: center;
  gap: 14px;
  font-size: 22px;
  line-height: 1;
  white-space: nowrap;
}

.dashboard-reference-time i {
  width: 1px;
  height: 21px;
  background: #7ec8f7;
}

.dashboard-reference-time strong {
  color: #1094e8;
  font-size: 28px;
  letter-spacing: .02em;
}

.dashboard-reference-time small {
  font-size: 15px;
  font-weight: 600;
}

.dashboard-reference-heading {
  position: relative;
  align-self: stretch;
  display: grid;
  place-content: center;
  text-align: center;
  border-bottom: 3px solid #a8d9fb;
}

.dashboard-reference-heading::before,
.dashboard-reference-heading::after {
  content: "";
  position: absolute;
  bottom: -3px;
  width: 68px;
  height: 18px;
  background: #a8d9fb;
  clip-path: polygon(0 0, 100% 100%, 0 100%);
}

.dashboard-reference-heading::before { left: 0; transform: scaleX(-1); }
.dashboard-reference-heading::after { right: 0; }

.dashboard-reference-heading h1 {
  position: relative;
  z-index: 1;
  margin: 0 0 4px;
  color: #12385f;
  font-size: clamp(30px, 2.1vw, 36px);
  line-height: 1.1;
  letter-spacing: .08em;
  transform: translateY(3px);
}

.dashboard-reference-heading p {
  position: relative;
  z-index: 1;
  margin: 0;
  color: #305a82;
  font-size: 15px;
  font-weight: 600;
  transform: translateY(3px);
}

.dashboard-reference-actions {
  display: grid;
  grid-template-columns: auto auto;
  grid-template-rows: repeat(2, 34px);
  column-gap: 8px;
  row-gap: 4px;
  justify-items: end;
  align-content: center;
  color: #31577d;
  font-size: 15px;
  font-weight: 600;
}

.dashboard-reference-actions > span {
  grid-column: 1;
  grid-row: 1;
  white-space: nowrap;
}

.dashboard-reference-api,
.dashboard-reference-actions button {
  min-height: 34px;
  border: 1px solid #d7e9f9;
  border-radius: 6px;
  background: rgba(255, 255, 255, .76);
  color: #238f59;
  font: inherit;
}

.dashboard-reference-api {
  grid-column: 2;
  grid-row: 1;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 0 13px;
}

.dashboard-reference-api i {
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: currentColor;
}

.dashboard-reference-api.is-down { color: #dd5a58; }

.dashboard-reference-actions button {
  grid-column: 2;
  grid-row: 2;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 0 13px;
  color: #177ec8;
  cursor: pointer;
}

.dashboard-reference-actions button:hover,
.dashboard-reference-shortcuts button:hover {
  border-color: #79c3f3;
  background: #f3faff;
}

.dashboard-reference-actions button .dashboard-reference-svg { width: 19px; height: 19px; }

.dashboard-reference-kpis {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
  margin-bottom: 10px;
}

.dashboard-reference-kpi {
  display: flex;
  align-items: center;
  gap: 24px;
  min-height: 88px;
  padding: 10px 28px;
  border: 1px solid #d5e8fb;
  border-radius: 7px;
  background: linear-gradient(135deg, rgba(255, 255, 255, .96), rgba(247, 252, 255, .76));
  box-shadow: 0 2px 12px rgba(80, 163, 221, .035);
}

.dashboard-reference-icon {
  flex: 0 0 auto;
  color: #3aa6ec;
  width: 43px;
  height: 43px;
  stroke-width: 1.9;
}

.dashboard-reference-kpi.is-danger .dashboard-reference-icon,
.dashboard-reference-kpi.is-danger strong { color: #f0524a; }

.dashboard-reference-kpi > div { display: block; min-width: 0; }
.dashboard-reference-kpi > div > span { display: block; margin-bottom: 7px; color: #183e66; font-size: 16px; font-weight: 700; }
.dashboard-reference-kpi strong { display: inline-block; color: #1095e5; font-size: 37px; line-height: 1; }
.dashboard-reference-kpi em { display: inline-block; margin-left: 8px; color: #183e66; font-size: 15px; font-style: normal; font-weight: 700; }

.dashboard-reference-workspace {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(420px, 1fr);
  gap: 10px;
  margin-bottom: 12px;
}

.dashboard-reference-column {
  display: grid;
  grid-template-rows: 294px 256px;
  gap: 10px;
  min-width: 0;
}

.dashboard-reference-summary-column { grid-template-rows: 340px 256px; }

.dashboard-reference-panel {
  min-width: 0;
  overflow: hidden;
  padding: 14px 16px;
  border: 1px solid #d4e8fb;
  border-radius: 7px;
  background: rgba(255, 255, 255, .78);
}

.dashboard-reference-panel > header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 26px;
}

.dashboard-reference-panel h2 {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0;
  color: #173e67;
  font-size: 19px;
}

.dashboard-reference-panel h2::before {
  content: "";
  width: 5px;
  height: 23px;
  background: #47acec;
}

.dashboard-reference-panel header button {
  display: inline-flex;
  align-items: center;
  gap: 2px;
  border: 0;
  background: transparent;
  color: #4a7299;
  font: inherit;
  font-size: 14px;
  cursor: pointer;
}

.dashboard-reference-panel header button:hover { color: #138cde; }
.dashboard-reference-panel header .dashboard-reference-svg { width: 18px; height: 18px; }
.dashboard-reference-expand { padding: 2px; }

.dashboard-reference-trend > p {
  margin: 6px 0 0;
  color: #5f82a6;
  font-size: 14px;
  font-weight: 600;
}

.dashboard-reference-chart-legend {
  display: flex;
  justify-content: center;
  gap: 28px;
  margin: 10px 0 -3px;
  color: #50759b;
  font-size: 13px;
  font-weight: 600;
}

.dashboard-reference-chart-legend span { display: inline-flex; align-items: center; gap: 6px; }
.dashboard-reference-chart-legend i { width: 13px; height: 2px; background: currentColor; position: relative; }
.dashboard-reference-chart-legend i::after { content: ""; position: absolute; width: 7px; height: 7px; top: -3px; left: 3px; border: 2px solid currentColor; border-radius: 50%; background: #fff; }
.dashboard-reference-chart-legend .is-alarm { color: #ff554b; }
.dashboard-reference-chart-legend .is-workorder { color: #1498ec; }

.dashboard-reference-chart { width: 100%; height: 180px; overflow: visible; }
.dashboard-reference-gridline { stroke: #d7e6f5; stroke-width: 1; stroke-dasharray: 3 3; }
.dashboard-reference-axis { fill: #55779d; font-size: 11px; font-family: "Microsoft YaHei UI", sans-serif; }
.dashboard-reference-alarm-line { fill: none; stroke: #ff554b; stroke-width: 2; }
.dashboard-reference-workorder-line { fill: none; stroke: #1498ec; stroke-width: 2; }

.dashboard-reference-reminder-list {
  margin-top: 9px;
  border: 1px solid #d8eafa;
  border-radius: 4px;
  overflow: hidden;
}

.dashboard-reference-reminder-list article {
  display: grid;
  grid-template-columns: 24px minmax(0, 1fr) auto;
  align-items: center;
  gap: 9px;
  min-height: 44px;
  padding: 4px 11px;
  border-bottom: 1px solid #dbeaf8;
}

.dashboard-reference-reminder-list article:last-child { border-bottom: 0; }
.dashboard-reference-warning-icon { width: 22px; height: 22px; color: #f15349; fill: currentColor; stroke: currentColor; stroke-width: 1.5; }
.dashboard-reference-reminder-list article.is-warning > .dashboard-reference-warning-icon { color: #f2a916; }
.dashboard-reference-reminder-list strong { display: block; color: #f15349; font-size: 14px; }
.dashboard-reference-reminder-list article.is-warning strong { color: #e99b11; }
.dashboard-reference-reminder-list small { display: block; overflow: hidden; color: #31587d; font-size: 13px; font-weight: 600; text-overflow: ellipsis; white-space: nowrap; }
.dashboard-reference-reminder-list time { color: #f15349; font-size: 13px; font-variant-numeric: tabular-nums; }
.dashboard-reference-reminder-list article.is-warning time { color: #e99b11; }

.dashboard-reference-table-wrap {
  height: calc(100% - 37px);
  margin-top: 8px;
  overflow: hidden;
  border: 1px solid #dbeafa;
}

.dashboard-reference-table-wrap table { width: 100%; border-collapse: collapse; table-layout: fixed; }
.dashboard-reference-table-wrap th,
.dashboard-reference-table-wrap td {
  overflow: hidden;
  padding: 5px 9px;
  border-right: 1px solid #dceaf8;
  border-bottom: 1px solid #dceaf8;
  color: #31587d;
  font-size: 12px;
  line-height: 1.25;
  text-align: left;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.dashboard-reference-table-wrap th { background: #f0f7ff; color: #4d7297; font-weight: 700; }
.dashboard-reference-table-wrap th:nth-child(1) { width: 13%; }
.dashboard-reference-table-wrap th:nth-child(2) { width: 12%; }
.dashboard-reference-table-wrap th:nth-child(3) { width: 28%; }
.dashboard-reference-table-wrap th:nth-child(4) { width: 22%; }
.dashboard-reference-table-wrap th:nth-child(5) { width: 12%; }
.dashboard-reference-table-wrap th:nth-child(6) { width: 13%; }
.dashboard-reference-table-wrap tr:last-child td { border-bottom: 0; }
.dashboard-reference-table-wrap td.is-danger { color: #f0524a; font-weight: 700; }
.dashboard-reference-table-wrap td.is-info { color: #178ddd; font-weight: 700; }
.dashboard-reference-table-wrap td.is-warning { color: #dd9b16; font-weight: 700; }
.dashboard-reference-table-wrap td.is-success { color: #1da66d; font-weight: 700; }
.dashboard-reference-handle { border: 0; background: transparent; color: #178ddd; font: inherit; font-weight: 700; cursor: pointer; }
.dashboard-reference-handle:hover { text-decoration: underline; }

.dashboard-reference-device-body {
  display: grid;
  grid-template-columns: 210px minmax(0, 1fr);
  align-items: center;
  gap: 20px;
  height: calc(100% - 32px);
}

.dashboard-reference-donut {
  width: 166px;
  height: 166px;
  display: grid;
  place-items: center;
  justify-self: center;
  border-radius: 50%;
  box-shadow: 0 7px 18px rgba(67, 152, 218, .17);
}

.dashboard-reference-donut > div {
  width: 124px;
  height: 124px;
  display: grid;
  place-content: center;
  border-radius: 50%;
  background: #fff;
  text-align: center;
}

.dashboard-reference-donut span { color: #31587d; font-size: 13px; font-weight: 700; }
.dashboard-reference-donut strong { color: #163f68; font-size: 29px; line-height: 1.15; }

.dashboard-reference-device-legend { display: grid; gap: 16px; }
.dashboard-reference-device-legend > div { display: flex; justify-content: space-between; gap: 10px; color: #2f577e; font-size: 15px; font-weight: 700; }
.dashboard-reference-device-legend span { display: inline-flex; align-items: center; gap: 10px; }
.dashboard-reference-device-legend i { width: 13px; height: 13px; border-radius: 50%; background: #38a5ee; }
.dashboard-reference-device-legend i.is-offline { background: #9babbd; }
.dashboard-reference-device-legend i.is-low { background: #f1a615; }
.dashboard-reference-device-legend small { color: #5f82a6; font-size: 13px; }

/* 本客户总览同步采用平台总览的四项视觉规范，只命中对应面板。 */
.dashboard-reference-target .dashboard-reference-reminders:has(.dashboard-tech-title.is-alert) {
  position: relative;
  padding: 13px;
  border-color: rgba(217, 106, 120, 0.4);
  background: linear-gradient(180deg, rgba(217, 106, 120, 0.08), transparent 150px), var(--panel);
}

.dashboard-reference-target .dashboard-reference-reminders:has(.dashboard-tech-title.is-alert)::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 140px;
  height: 3px;
  background: linear-gradient(90deg, rgba(217, 106, 120, 0.96), transparent);
}

.dashboard-reference-target .dashboard-reference-reminders:has(.dashboard-tech-title.is-alert) .dashboard-tech-title.is-alert {
  padding: 6px 14px;
  border-radius: 8px;
  color: #fff;
  background: linear-gradient(90deg, rgba(205, 78, 92, 0.96), rgba(217, 106, 120, 0.84));
}

.dashboard-reference-target .dashboard-reference-reminders:has(.dashboard-tech-title.is-alert) .dashboard-tech-title.is-alert::before {
  width: 7px;
  height: 7px;
  background: #fff;
  animation: alertDotBlink 1.2s ease-in-out infinite;
}

.dashboard-reference-target .dashboard-reference-reminders:has(.dashboard-tech-title.is-alert) .dashboard-tech-title.is-alert::after { display: none; }
.dashboard-reference-target .dashboard-reference-reminders:has(.dashboard-tech-title.is-alert) .dashboard-alert-hero {
  width: 104px;
  min-height: 104px;
  margin: 8px auto;
  border-color: rgba(217, 106, 120, 0.45);
  background: radial-gradient(circle at center, #fff, #fdeef0);
  box-shadow: 0 0 0 8px rgba(217, 106, 120, 0.12), 0 6px 18px rgba(217, 106, 120, 0.2);
  animation: alertHeroPulse 1.6s ease-in-out infinite;
}
.dashboard-reference-target .dashboard-reference-reminders:has(.dashboard-tech-title.is-alert) .dashboard-alert-hero strong { font-size: 34px; line-height: 1; color: var(--danger); }
.dashboard-reference-target .dashboard-reference-reminders:has(.dashboard-tech-title.is-alert) .dashboard-alert-hero span { margin-top: 2px; color: var(--danger); font-size: 11px; }
.dashboard-reference-target .dashboard-reference-reminders .alert-list { border: 0; border-radius: 0; background: transparent; }
.dashboard-reference-target .dashboard-reference-reminders .alert-list article { padding: 10px 12px; border-color: rgba(47, 127, 184, 0.12); background: transparent; }

.dashboard-reference-target .dashboard-reference-reminders:has(.alert-trend-strip) {
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.dashboard-reference-target .dashboard-reference-reminders .alert-trend-strip {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  margin-top: 8px;
  padding-top: 8px;
  border-top: 1px solid var(--line);
}

.dashboard-reference-target .dashboard-reference-reminders .alert-trend-item {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  padding-top: 7px;
}

.dashboard-reference-target .dashboard-reference-reminders .alert-trend-item::before { content: ""; position: absolute; top: 0; right: 10%; left: 10%; height: 3px; background: var(--accent); }
.dashboard-reference-target .dashboard-reference-reminders .alert-trend-item:nth-child(1)::before { background: var(--danger); }
.dashboard-reference-target .dashboard-reference-reminders .alert-trend-item:nth-child(2)::before { background: var(--success); }
.dashboard-reference-target .dashboard-reference-reminders .alert-trend-item strong { color: var(--text); font-size: 20px; line-height: 1; }
.dashboard-reference-target .dashboard-reference-reminders .alert-trend-item span { color: var(--muted); font-size: 11px; white-space: nowrap; }

.dashboard-reference-target .dashboard-device-category { border-color: #d4e8fb; }
.dashboard-reference-target .dashboard-device-category .dashboard-reference-device-legend { gap: 7px; }
.dashboard-reference-target .dashboard-device-category .is-online { background: #56aee6; }
.dashboard-reference-target .dashboard-device-category .is-low { background: #d96a78; }
.dashboard-reference-target .dashboard-device-category .is-offline { background: #d79836; }

@media (prefers-reduced-motion: reduce) {
  .dashboard-reference-target .dashboard-reference-reminders:has(.dashboard-tech-title.is-alert) .dashboard-alert-hero,
  .dashboard-reference-target .dashboard-reference-reminders:has(.dashboard-tech-title.is-alert) .dashboard-tech-title.is-alert::before { animation: none; }
}

.dashboard-reference-shortcuts {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 10px;
}

.dashboard-reference-shortcuts button {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  min-width: 0;
  min-height: 96px;
  padding: 13px 20px;
  border: 1px solid #d6e9fb;
  border-radius: 7px;
  background: rgba(255, 255, 255, .8);
  color: #31587d;
  text-align: left;
  cursor: pointer;
}

.dashboard-reference-shortcuts .dashboard-reference-icon { width: 33px; height: 33px; }
.dashboard-reference-shortcuts div { display: grid; min-width: 0; gap: 5px; }
.dashboard-reference-shortcuts div > span { font-size: 15px; font-weight: 700; white-space: nowrap; }
.dashboard-reference-shortcuts strong { color: #153c67; font-size: 30px; line-height: 1; }
.dashboard-reference-shortcuts em { overflow: hidden; color: #52789f; font-size: 12px; font-style: normal; text-overflow: ellipsis; white-space: nowrap; }

.dashboard-reference-empty { padding: 24px; color: #6b8baa; text-align: center; }

@media (max-width: 1160px) {
  .dashboard-quick-nav { align-items: flex-start; flex-direction: column; }
  .dashboard-quick-nav .dashboard-quick-nav-logout { margin-left: 0; }
  .dashboard-reference-target { overflow-y: auto; }
  .dashboard-reference-header { grid-template-columns: 1fr; gap: 12px; }
  .dashboard-reference-heading { min-height: 74px; order: -1; }
  .dashboard-reference-actions { justify-items: start; grid-auto-flow: column; justify-content: start; }
  .dashboard-reference-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .dashboard-reference-workspace { grid-template-columns: 1fr; }
  .dashboard-reference-column { grid-template-rows: auto; }
  .dashboard-reference-panel { min-height: 250px; }
  .dashboard-reference-shortcuts { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 720px) {
  .dashboard-quick-nav {
    align-items: center;
    flex-direction: row;
    min-height: 44px;
    padding: 6px 12px;
    overflow-x: auto;
  }
  .dashboard-quick-nav > span { display: none; }
  .dashboard-quick-nav-actions {
    flex-wrap: nowrap;
    min-width: max-content;
  }
  .dashboard-quick-nav .ghost-button { flex: 0 0 auto; }
  .dashboard-quick-nav .dashboard-quick-nav-logout { margin-left: 0; }
  .dashboard-reference-target { padding: 10px 12px; }
  .dashboard-reference-kpi { gap: 10px; min-height: 104px; padding: 10px 12px; }
  .dashboard-reference-kpi > div > span { margin-bottom: 6px; font-size: 14px; white-space: nowrap; }
  .dashboard-reference-kpi strong { font-size: 33px; }
  .dashboard-reference-kpi em { margin-left: 5px; font-size: 13px; }
}

.mobile-route-nav { display: none; }

/* 双总览：平台风险介入台与机构日常运营台使用不同的信息层级。 */
.platform-ops-v2 { max-width: 1680px; margin: 0 auto; padding: 24px; color: #19334c; }
.platform-ops-v2-header, .platform-ops-v2-workspace, .platform-ops-v2-header > div:last-child, .platform-ops-v2-queue > header, .platform-ops-v2-map-card > header, .platform-onboarding-queue > header, .platform-intervention-card > header, .institution-overview-header, .institution-overview-grid, .institution-overview-panel > header { display: flex; }
.platform-ops-v2-header { align-items: flex-end; justify-content: space-between; gap: 24px; margin-bottom: 18px; }
.platform-ops-v2-header p, .platform-ops-v2-map-card header span, .platform-ops-v2-queue header span, .platform-onboarding-queue header span, .platform-intervention-card header span, .institution-overview-header p, .institution-overview-panel > header p { margin: 0 0 6px; color: #667c92; font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.platform-ops-v2-header h2, .institution-overview-header h1 { margin: 0; font-size: 28px; letter-spacing: -.025em; }
.platform-ops-v2-header span, .institution-overview-header span { display: block; margin-top: 8px; color: #6b7d90; font-size: 14px; }
.platform-ops-v2-header > div:last-child { align-items: center; gap: 12px; color: #6c7e90; }
.platform-ops-v2-metrics { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 12px; margin-bottom: 16px; }
.platform-ops-v2-metrics article { min-height: 90px; padding: 16px; border: 1px solid #e0e7ef; border-radius: 12px; background: #fff; box-shadow: 0 4px 12px rgba(29, 52, 75, .035); }
.platform-ops-v2-metrics article span, .institution-overview-safety article span, .institution-overview-card-grid article span { display: block; color: #6e8092; font-size: 13px; }
.platform-ops-v2-metrics article strong { display: block; margin-top: 8px; color: #1a3550; font-size: 28px; line-height: 1; }
.platform-ops-v2-metrics .is-danger { border-color: #f1d5d8; background: #fffafb; }.platform-ops-v2-metrics .is-danger strong { color: #bf4853; }
.platform-ops-v2-workspace { align-items: stretch; gap: 16px; min-height: 580px; }
.platform-ops-v2-queue, .platform-ops-v2-map-card, .platform-intervention-card, .platform-onboarding-queue, .institution-overview-panel, .institution-overview-safety article, .institution-overview-card-grid article { border: 1px solid #e0e7ef; border-radius: 14px; background: #fff; box-shadow: 0 5px 18px rgba(29, 52, 75, .04); }
.platform-ops-v2-queue { flex: 0 0 300px; padding: 16px; }.platform-ops-v2-queue > header, .platform-ops-v2-map-card > header, .platform-onboarding-queue > header, .platform-intervention-card > header { align-items: flex-start; justify-content: space-between; gap: 12px; }
.platform-ops-v2-queue h3, .platform-ops-v2-map-card h3, .platform-onboarding-queue h3, .platform-intervention-card h3, .institution-overview-panel h2 { margin: 0; font-size: 17px; }.platform-ops-v2-queue > header > strong { display: grid; width: 28px; height: 28px; place-items: center; border-radius: 50%; color: #a23e48; background: #fbecee; }
.platform-ops-v2-queue > p { margin: 12px 0; color: #718194; font-size: 12px; line-height: 1.55; }
.platform-queue-list { display: grid; gap: 8px; }.platform-queue-row { border: 1px solid #e6ebf0; border-left: 3px solid #9daaba; border-radius: 9px; overflow: hidden; }.platform-queue-row.danger { border-left-color: #d65862; }.platform-queue-row.warning { border-left-color: #d7922c; }
.platform-queue-main { display: flex; width: 100%; gap: 9px; padding: 10px; border: 0; color: inherit; text-align: left; background: transparent; cursor: pointer; }.platform-queue-dot { flex: 0 0 7px; height: 7px; margin-top: 6px; border-radius: 50%; background: currentColor; }.platform-queue-main strong, .platform-queue-main small { display: block; }.platform-queue-main strong { font-size: 13px; }.platform-queue-main small { margin-top: 3px; color: #758598; font-size: 12px; line-height: 1.4; }
.platform-queue-meta { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 0 10px 9px 26px; color: #758598; font-size: 11px; }.platform-queue-meta .ghost-button { min-height: 26px; padding: 3px 8px; font-size: 12px; }
.platform-ops-v2-map-card { flex: 1 1 auto; min-width: 380px; padding: 16px; }.platform-ops-v2-map-card header small { max-width: 190px; color: #718194; font-size: 11px; line-height: 1.45; text-align: right; }
.platform-ops-v2-filter { display: flex; gap: 8px; margin: 14px 0; }.platform-ops-v2-filter input { min-width: 0; flex: 1; }.platform-ops-v2-filter input, .platform-ops-v2-filter select, .platform-followup-form textarea, .platform-followup-form input, .platform-reassign-form select { border: 1px solid #dbe3eb; border-radius: 7px; padding: 8px 9px; font: inherit; }.platform-ops-v2-map { min-height: 400px; }.platform-ops-v2-map-card footer { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 10px; color: #687b8f; font-size: 12px; }.platform-ops-v2-map-card footer span { display: inline-flex; align-items: center; gap: 5px; }.platform-ops-v2-map-card footer i { width: 8px; height: 8px; border-radius: 50%; background: #2fa66d; }.platform-ops-v2-map-card footer .is-risk { background:#df5e63; }.platform-ops-v2-map-card footer .is-attention { background:#de9c2a; }.platform-ops-v2-map-card footer .is-data-stale { background:#6c7f99; }.platform-ops-v2-map-card footer .is-unactivated,.platform-ops-v2-map-card footer .is-disabled { background:#93a1af; }
.platform-intervention-card { flex: 0 0 360px; padding: 16px; overflow: auto; }.platform-intervention-card.is-empty { color: #758598; }.platform-intervention-card header p { margin: 7px 0 0; font-size: 12px; color: #718194; }.platform-intervention-section { padding: 14px 0; border-top: 1px solid #edf1f5; }.platform-intervention-section h4 { margin: 0 0 8px; font-size: 13px; }.platform-reason-list, .platform-followup-log { display: grid; gap: 7px; margin: 0; padding: 0; list-style: none; }.platform-reason-list li { padding: 8px 9px; border-radius: 7px; color: #775f2b; background: #fff8e9; font-size: 12px; }.platform-reason-list li.danger { color:#9f4148; background:#fff0f1; }.platform-reason-list small { display: block; margin-top: 3px; opacity: .75; }.platform-contact-block p { margin: 0 0 4px; }.platform-contact-block small { color:#718194; }.platform-followup-state { display: grid; gap: 4px; color: #66798c; font-size: 12px; }.platform-contact-result { margin: 9px 0; font-size: 12px; line-height: 1.5; }.platform-followup-log li { display: grid; grid-template-columns: 72px 1fr; gap: 3px 8px; color: #6c7e90; font-size: 11px; }.platform-followup-log time { grid-row: span 2; }.platform-followup-log strong { color:#344e67; }.platform-followup-log span { line-height: 1.4; }.platform-intervention-actions { display: flex; flex-wrap: wrap; gap: 8px; }.platform-followup-form { display: grid; gap: 8px; margin-top: 12px; padding-top: 12px; border-top: 1px solid #edf1f5; }.platform-followup-form label { display: grid; gap: 4px; color:#5e7286; font-size: 12px; }.platform-followup-form textarea { min-height: 62px; resize: vertical; }.platform-followup-form .check-line { display:flex; grid-template-columns: auto 1fr; align-items:center; gap:7px; }.platform-reassign-form { display:flex; gap:7px; margin-top:8px; }.platform-reassign-form select { min-width:0; flex:1; }.platform-clear-note { margin:0; color:#487869; font-size:12px; }
.platform-onboarding-queue { margin-top: 16px; padding: 16px; }.platform-onboarding-queue > div { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 8px; margin-top: 12px; }.platform-onboarding-queue > div > button { display:grid; gap:4px; padding:10px; border:1px solid #e6ebf0; border-radius:8px; color:#344e67; text-align:left; background:#fafbfd; cursor:pointer; }.platform-onboarding-queue button span { color:#748598; font-size:12px; }

.institution-overview { max-width: 1420px; margin: 0 auto; padding: 24px; color: #19334c; }.institution-overview-header { align-items:flex-end; justify-content:space-between; gap:18px; margin-bottom:18px; }.institution-overview-safety { display:grid; grid-template-columns:repeat(4, minmax(0, 1fr)); gap:12px; margin-bottom:16px; }.institution-overview-safety article { display:grid; gap:8px; min-height:146px; padding:16px; }.institution-overview-safety strong { font-size:30px; line-height:1; }.institution-overview-safety small { color:#718194; }.institution-overview-safety .is-danger { border-color:#f0d6d9; background:#fffafb; }.institution-overview-safety .is-danger strong { color:#c34a54; }.institution-overview-safety .is-warning strong { color:#aa761f; }.institution-overview-safety .ghost-button { justify-self:start; min-height:28px; padding:4px 8px; font-size:12px; }.institution-overview-grid { gap:16px; align-items:stretch; }.institution-overview-queue { flex:1 1 auto; padding:17px; }.institution-overview-panel > header { align-items:flex-start; justify-content:space-between; margin-bottom:12px; }.institution-overview-panel > header > span { color:#697d90; font-size:12px; }.institution-overview-queue > div { display:grid; gap:7px; }.institution-overview-queue article { display:flex; align-items:center; justify-content:space-between; gap:15px; padding:11px 0; border-top:1px solid #edf1f5; }.institution-overview-queue article > div { display:grid; gap:3px; }.institution-overview-queue article span { color:#a47521; font-size:12px; }.institution-overview-queue article.is-danger span { color:#ba4b54; }.institution-overview-queue article small { color:#738497; }.institution-overview-note { flex:0 0 270px; padding:18px; background:#f7fafc; }.institution-overview-note p { margin:0 0 7px; color:#6d8092; font-size:12px; }.institution-overview-note h2 { margin:0 0 8px; }.institution-overview-note span { color:#708296; font-size:13px; line-height:1.6; }.institution-overview-card-grid { display:grid; grid-template-columns:repeat(4, minmax(0,1fr)); gap:12px; margin-top:16px; }.institution-overview-card-grid article { display:grid; gap:7px; min-height:118px; padding:15px; }.institution-overview-card-grid strong { font-size:24px; }.institution-overview-card-grid button { justify-self:start; padding:0; border:0; color:#39745f; font:inherit; font-size:12px; background:transparent; cursor:pointer; }.institution-overview-readonly { color:#77899a; font-size:12px; white-space:nowrap; }.institution-overview-empty { padding:32px 0; color:#78899a; text-align:center; }.organization-contact-row { display:grid; gap:5px; margin:0 0 12px; }.organization-contact-row small { color:#6f8193; }.organization-contact-form { display:grid; grid-template-columns:repeat(3, minmax(110px, 1fr)) auto; gap:6px; max-width:760px; }.organization-contact-form input { min-width:0; padding:6px 7px; border:1px solid #dbe3eb; border-radius:6px; font:inherit; font-size:12px; }.organization-contact-form .ghost-button { min-height:29px; padding:4px 8px; font-size:12px; }
@media (max-width: 1180px) { .platform-ops-v2-workspace { display:grid; grid-template-columns:minmax(0,1fr) minmax(330px, .8fr); }.platform-ops-v2-queue { grid-column:span 2; flex:auto; }.platform-intervention-card { flex:auto; }.institution-overview-safety,.institution-overview-card-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width: 760px) { .platform-ops-v2,.institution-overview { padding:14px; }.platform-ops-v2-header,.institution-overview-header { align-items:flex-start; flex-direction:column; }.platform-ops-v2-metrics,.institution-overview-safety,.institution-overview-card-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }.platform-ops-v2-workspace { display:grid; grid-template-columns:1fr; }.platform-ops-v2-queue { grid-column:auto; }.platform-ops-v2-map-card { min-width:0; }.platform-ops-v2-map { min-height:300px; }.platform-ops-v2-filter { flex-wrap:wrap; }.platform-ops-v2-filter input { flex-basis:100%; }.institution-overview-grid { flex-direction:column; }.institution-overview-note { flex:auto; }.institution-overview-queue article { align-items:flex-start; flex-direction:column; } }

/* 平台总览采用地图主视觉；信息只围绕机构风险发现、联络与跟进。 */
.platform-visual-shell { min-height:100vh; background:#edf6fc; color:#173a5e; }
.platform-visual-nav { display:grid; grid-template-columns:220px minmax(0,1fr) 260px; align-items:center; min-height:62px; padding:0 28px; border-bottom:1px solid rgba(155,199,229,.62); background:rgba(248,252,255,.94); box-shadow:0 2px 12px rgba(62,120,163,.07); }
.platform-visual-brand { display:flex; align-items:baseline; gap:9px; color:#1a6398; }.platform-visual-brand span { font-size:22px; font-weight:800; letter-spacing:.08em; }.platform-visual-brand small { color:#718ca6; font-size:11px; }
.platform-visual-nav nav { display:flex; align-items:center; justify-content:center; gap:8px; }.platform-visual-nav nav button,.platform-visual-user > button { padding:7px 13px; border:1px solid transparent; border-radius:4px; color:#5e7e99; font-size:13px; background:transparent; cursor:pointer; }.platform-visual-nav nav button:hover,.platform-visual-nav nav button.active { border-color:#a5d2ec; color:#237db2; background:#e8f5fc; }
.platform-visual-user { display:flex; align-items:center; justify-content:flex-end; gap:9px; color:#56758e; font-size:12px; }.platform-visual-user .api-status-badge { padding:2px 7px; }.platform-visual-user > button { padding:5px 0 5px 8px; }
.platform-visual-main { padding:18px 22px 24px; }
.platform-visual-overview { width:min(1710px, 100%); margin:0 auto; }
.platform-visual-title { position:relative; display:grid; grid-template-columns:1fr auto 1fr; align-items:center; min-height:58px; margin-bottom:12px; color:#6790ae; }.platform-visual-title::before,.platform-visual-title::after { content:""; height:1px; background:linear-gradient(90deg, transparent, #b9d9eb); }.platform-visual-title::after { background:linear-gradient(90deg, #b9d9eb, transparent); }.platform-visual-title > span { display:none; }.platform-visual-title h1 { margin:0; padding:0 34px; color:#295575; font-size:25px; font-weight:800; letter-spacing:.16em; text-align:center; }.platform-visual-title time { position:absolute; right:4px; bottom:1px; color:#7690a8; font-size:11px; }
.platform-visual-workspace { display:grid; grid-template-columns:280px minmax(520px, 1fr) 320px; gap:13px; align-items:stretch; min-height:634px; }
.platform-visual-left,.platform-visual-right { display:grid; min-width:0; gap:13px; }.platform-visual-left { grid-template-rows:186px minmax(0,1fr); }.platform-visual-right { grid-template-rows:1fr; }
.platform-visual-panel,.platform-visual-map-card,.platform-visual-intervention,.platform-visual-bottom { border:1px solid #c7e0ef; background:rgba(251,254,255,.9); box-shadow:0 10px 26px rgba(55,114,159,.075), inset 0 1px 0 #fff; }
.platform-visual-panel { padding:15px; overflow:hidden; }.platform-visual-panel > header p,.platform-visual-map-card > header p,.platform-visual-intervention header p,.platform-visual-bottom p { margin:0 0 5px; color:#6b91ad; font-size:11px; letter-spacing:.08em; }.platform-visual-panel > header strong { color:#2d5978; font-size:15px; }.platform-visual-panel > header em { color:#d85d69; font-size:18px; font-style:normal; }
.platform-visual-status-bars { display:grid; gap:10px; margin-top:16px; }.platform-visual-status-bars > div { display:grid; grid-template-columns:72px minmax(0,1fr) 24px; align-items:center; gap:7px; color:#63809a; font-size:12px; }.platform-visual-status-bars i { height:4px; overflow:hidden; background:#deedf5; }.platform-visual-status-bars b { display:block; height:100%; background:#55a3cf; }.platform-visual-status-bars .is-risk { background:#d95e69; }.platform-visual-status-bars .is-attention { background:#d8a036; }.platform-visual-status-bars .is-data_stale { background:#8194a7; }.platform-visual-status-bars .is-normal { background:#50aa85; }.platform-visual-status-bars .is-unactivated,.platform-visual-status-bars .is-disabled { background:#9aa8b5; }.platform-visual-status-bars strong { color:#315a79; font-size:13px; text-align:right; }
.platform-visual-risk-panel { display:grid; grid-template-rows:auto minmax(0,1fr); }.platform-visual-queue-list { display:grid; align-content:start; gap:0; min-height:0; overflow:auto; margin-top:8px; }.platform-visual-queue-row { padding:10px 0; border-top:1px solid #dfedf5; }.platform-visual-queue-row:first-child { border-top:0; }.platform-visual-queue-row > button { display:block; width:100%; padding:0; border:0; color:#274f6c; text-align:left; background:transparent; cursor:pointer; }.platform-visual-queue-row > button > span { display:grid; gap:4px; }.platform-visual-queue-row > button strong { font-size:13px; }.platform-visual-queue-row > button small { overflow:hidden; color:#718ba2; font-size:11px; line-height:1.4; text-overflow:ellipsis; white-space:nowrap; }.platform-visual-queue-row footer { display:flex; align-items:center; justify-content:space-between; gap:6px; margin-top:7px; color:#7e96aa; font-size:10px; }.platform-visual-queue-row footer button { padding:2px 7px; border:1px solid #acd7ed; border-radius:3px; color:#267cac; background:#f5fbfe; font-size:11px; cursor:pointer; }.platform-visual-queue-row.is-danger > button strong { color:#bd4d57; }.platform-visual-queue-row.is-warning > button strong { color:#9c711e; }.platform-visual-empty { padding:28px 0; color:#7892a9; font-size:12px; text-align:center; }
.platform-visual-map-card { position:relative; display:grid; grid-template-rows:auto auto auto minmax(0,1fr) auto; min-width:0; padding:15px 18px 12px; overflow:hidden; background:radial-gradient(ellipse at 50% 58%, rgba(209,238,248,.82), rgba(247,252,255,.92) 60%, rgba(233,246,252,.92)); }.platform-visual-map-card > header { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; }.platform-visual-map-card > header h2 { margin:0; color:#265979; font-size:17px; }.platform-visual-map-card > header small { color:#7692a7; font-size:11px; }
.platform-visual-key-metrics { display:grid; grid-template-columns:repeat(4, minmax(0,1fr)); max-width:640px; gap:0; margin:11px auto 8px; border:1px solid #d2e6f1; background:rgba(255,255,255,.54); }.platform-visual-key-metrics article { min-width:0; padding:8px 12px; border-left:1px solid #d9e9f2; text-align:center; }.platform-visual-key-metrics article:first-child { border-left:0; }.platform-visual-key-metrics span { display:block; overflow:hidden; color:#7791a7; font-size:11px; text-overflow:ellipsis; white-space:nowrap; }.platform-visual-key-metrics strong { display:block; margin-top:3px; color:#26658f; font-size:22px; line-height:1; }.platform-visual-key-metrics .is-danger strong { color:#cf5360; }
.platform-visual-filter { display:flex; justify-content:center; gap:7px; margin:1px auto 3px; }.platform-visual-filter input,.platform-visual-filter select { min-width:0; height:28px; border:1px solid #bfdeed; border-radius:3px; padding:4px 8px; color:#4e718d; background:rgba(252,254,255,.92); font-size:11px; }.platform-visual-filter input { width:190px; }.platform-visual-filter button { height:28px; padding:4px 10px; border:1px solid #b0d9ec; border-radius:3px; color:#277ead; background:#f6fcff; font-size:11px; cursor:pointer; }.platform-visual-map { height:430px; min-height:330px; margin:-4px -18px 0; }.platform-visual-map .platform-map-provinces path { fill:#d9eefa; stroke:#b6d8e9; stroke-width:1.2; }.platform-visual-map .platform-map-provinces path.is-drillable:hover { fill:#a9d7ed; }.platform-visual-map .platform-map-marker-dot { width:10px; height:10px; border:2px solid #fff; box-shadow:0 0 0 4px color-mix(in srgb, var(--marker-color) 18%, transparent), 0 3px 8px rgba(41,91,127,.28); }.platform-visual-map .platform-map-marker-pulse { display:none; }.platform-visual-map .platform-map-area-label { border:1px solid #b6d9eb; border-radius:2px; padding:4px 7px; color:#3c6b89; background:rgba(248,253,255,.9); box-shadow:0 4px 10px rgba(72,125,159,.13); }.platform-visual-map .platform-map-area-label span { color:#7695aa; }.platform-visual-map-legend { display:flex; justify-content:center; flex-wrap:wrap; gap:14px; padding-top:4px; color:#6a8499; font-size:11px; }.platform-visual-map-legend span::before { content:""; display:inline-block; width:7px; height:7px; margin-right:5px; border-radius:50%; background:#50aa85; }.platform-visual-map-legend .is-risk::before { background:#d95e69; }.platform-visual-map-legend .is-attention::before { background:#d8a036; }.platform-visual-map-legend .is-data-stale::before { background:#8194a7; }.platform-visual-map-legend .is-unactivated::before { background:#9aa8b5; }
.platform-visual-intervention { min-height:0; padding:15px; overflow:auto; }.platform-visual-intervention.is-empty { display:grid; align-content:center; padding:25px; color:#7892a8; }.platform-visual-intervention.is-empty h2 { margin:4px 0 7px; color:#446783; font-size:18px; }.platform-visual-intervention.is-empty span { font-size:12px; line-height:1.65; }.platform-visual-intervention > header { display:flex; align-items:flex-start; justify-content:space-between; gap:8px; }.platform-visual-intervention > header h2 { margin:0; color:#274f6d; font-size:18px; }.platform-visual-intervention > header > div > span { display:block; margin-top:4px; color:#718ca2; font-size:11px; }.platform-visual-close { padding:0; border:0; color:#7090a7; background:transparent; font-size:11px; cursor:pointer; }.platform-visual-intervention-metrics { display:grid; grid-template-columns:1fr 1fr; gap:8px; margin:14px 0; }.platform-visual-intervention-metrics article { min-width:0; padding:9px; border:1px solid #d7e9f2; background:#f7fbfe; }.platform-visual-intervention-metrics span { display:block; color:#7893a9; font-size:10px; }.platform-visual-intervention-metrics strong { display:block; overflow:hidden; margin-top:5px; color:#3c6280; font-size:12px; text-overflow:ellipsis; white-space:nowrap; }.platform-visual-intervention-section { padding:11px 0; border-top:1px solid #dbeaf2; }.platform-visual-intervention-section h3 { margin:0 0 7px; color:#52718b; font-size:12px; }.platform-visual-reason-list,.platform-visual-log { display:grid; gap:6px; margin:0; padding:0; list-style:none; }.platform-visual-reason-list li { display:grid; gap:3px; padding-left:8px; border-left:3px solid #8ea7ba; color:#57758e; font-size:11px; }.platform-visual-reason-list li.is-danger { border-color:#d95e69; }.platform-visual-reason-list li.is-high { border-color:#d8a036; }.platform-visual-reason-list li strong { color:#3b5c73; font-size:12px; }.platform-visual-reason-list li small { color:#849aab; }.platform-visual-clear { margin:0; color:#4d8b72; font-size:12px; }.platform-visual-contact { display:grid; gap:4px; margin:0; color:#607e95; font-size:12px; }.platform-visual-contact strong { color:#315775; }.platform-visual-contact small { color:#8298aa; }.platform-visual-followup,.platform-visual-contact-result { margin:0 0 6px; color:#6f879b; font-size:11px; line-height:1.45; }.platform-visual-log li { display:grid; grid-template-columns:86px 1fr; gap:7px; color:#70889c; font-size:10px; line-height:1.45; }.platform-visual-log time { color:#90a4b4; }.platform-visual-intervention-actions { display:flex; flex-wrap:wrap; gap:7px; margin-top:10px; }.platform-visual-intervention-actions button { padding:6px 9px; border:1px solid #acd4e8; border-radius:3px; color:#2e759f; background:#f6fcff; font-size:11px; cursor:pointer; }.platform-visual-intervention-actions .platform-visual-primary { color:#fff; border-color:#4b98c4; background:#4b98c4; }.platform-visual-intervention .platform-followup-form { margin-top:10px; }.platform-visual-intervention .platform-followup-form .primary-button { min-height:30px; padding:5px 8px; font-size:12px; }.platform-visual-intervention .platform-reassign-form { margin-top:8px; }
.platform-visual-bottom { display:flex; align-items:center; justify-content:space-between; gap:18px; min-height:64px; margin-top:13px; padding:10px 16px; }.platform-visual-bottom > div:first-child { display:grid; grid-template-columns:auto auto 1fr; align-items:center; gap:8px 12px; min-width:0; }.platform-visual-bottom p { grid-column:1 / -1; margin:0; }.platform-visual-bottom strong { color:#365f7d; font-size:13px; }.platform-visual-bottom > div:first-child span { overflow:hidden; color:#7891a5; font-size:11px; text-overflow:ellipsis; white-space:nowrap; }.platform-visual-bottom-actions { display:flex; align-items:center; gap:12px; flex:0 0 auto; color:#607d94; font-size:11px; }.platform-visual-bottom-actions button { padding:5px 9px; border:1px solid #afd6e9; border-radius:3px; color:#2b78a6; background:#f6fcff; font-size:11px; cursor:pointer; }
@media (max-width:1200px) { .platform-visual-workspace { grid-template-columns:240px minmax(420px,1fr); }.platform-visual-right { grid-column:span 2; }.platform-visual-left { grid-template-columns:1fr 1fr; grid-template-rows:none; }.platform-visual-risk-panel { max-height:260px; } }
@media (max-width:820px) { .platform-visual-nav { grid-template-columns:1fr auto; padding:0 14px; }.platform-visual-nav nav { display:none; }.platform-visual-user > span,.platform-visual-user .api-status-badge { display:none; }.platform-visual-main { padding:12px; }.platform-visual-title { display:block; padding:9px 0 18px; }.platform-visual-title::before,.platform-visual-title::after { display:none; }.platform-visual-title h1 { padding:0; font-size:19px; letter-spacing:.08em; }.platform-visual-title time { right:0; }.platform-visual-workspace { grid-template-columns:1fr; }.platform-visual-left,.platform-visual-right { grid-column:auto; }.platform-visual-left { grid-template-columns:1fr; grid-template-rows:auto; }.platform-visual-map-card { min-height:530px; }.platform-visual-map { height:360px; }.platform-visual-key-metrics { width:100%; }.platform-visual-key-metrics article { padding:7px 5px; }.platform-visual-key-metrics strong { font-size:18px; }.platform-visual-filter { flex-wrap:wrap; }.platform-visual-filter input { width:100%; flex:0 0 100%; }.platform-visual-bottom { align-items:flex-start; flex-direction:column; }.platform-visual-bottom > div:first-child { grid-template-columns:1fr; gap:5px; }.platform-visual-bottom-actions { flex-wrap:wrap; } }

/* 总览重构：让安全风险和处置流成为第一层信息，弱化大屏式装饰。 */
.dashboard-reference-target {
  max-width: 1680px;
  margin: 0 auto;
  padding: 24px 28px 34px;
  color: #18354f;
  background: #f5f8f8;
}

.dashboard-reference-header {
  grid-template-columns: minmax(180px, .7fr) minmax(360px, 1.6fr) auto;
  gap: 20px;
  min-height: 92px;
  margin-bottom: 20px;
  padding: 18px 22px;
  border: 1px solid #dce9e7;
  border-radius: 18px;
  background: linear-gradient(112deg, #ffffff 0%, #f4fbfa 72%, #eaf6f3 100%);
  box-shadow: 0 10px 30px rgba(30, 74, 71, .06);
}

.dashboard-reference-time {
  gap: 8px;
  color: #6d8586;
}

.dashboard-reference-time small { font-size: 12px; font-weight: 600; }

.dashboard-reference-scope {
  display: flex;
  align-items: center;
  gap: 8px;
  color: #315356;
  font-size: 14px;
  font-weight: 800;
}

.dashboard-live-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #34a07d;
  box-shadow: 0 0 0 4px rgba(52, 160, 125, .12);
}

.dashboard-reference-heading {
  display: block;
  align-self: auto;
  border: 0;
  text-align: left;
}

.dashboard-reference-heading::before,
.dashboard-reference-heading::after { display: none; }

.dashboard-reference-heading h1 {
  margin: 2px 0 6px;
  color: #173d42;
  font-size: clamp(24px, 2vw, 31px);
  letter-spacing: .01em;
  transform: none;
}

.dashboard-reference-heading p {
  color: #668082;
  font-size: 14px;
  font-weight: 500;
  transform: none;
}

.dashboard-reference-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  align-self: center;
  color: #587677;
  font-size: 13px;
}

.dashboard-reference-api,
.dashboard-reference-actions button {
  min-height: 32px;
  border-color: #d9e9e5;
  border-radius: 8px;
}

.dashboard-reference-actions button { color: #25775f; }
.dashboard-reference-actions .dashboard-reference-api,
.dashboard-reference-actions button { grid-column: auto; grid-row: auto; }

.dashboard-reference-kpis {
  gap: 12px;
  margin-bottom: 18px;
}

.dashboard-reference-kpi {
  min-height: 132px;
  gap: 14px;
  padding: 18px 20px;
  border: 1px solid #dde9e7;
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 6px 20px rgba(31, 73, 70, .045);
}

.dashboard-reference-kpi .dashboard-reference-icon {
  width: 34px;
  height: 34px;
  padding: 9px;
  border-radius: 12px;
  color: #298b72;
  background: #e8f5f0;
}

.dashboard-reference-kpi > div > span {
  margin-bottom: 8px;
  color: #617c7e;
  font-size: 13px;
}

.dashboard-reference-kpi strong { color: #193e43; font-size: 32px; }
.dashboard-reference-kpi em { color: #567275; font-size: 13px; }
.dashboard-reference-kpi small { display: block; margin-top: 8px; color: #819597; font-size: 12px; }
.dashboard-reference-kpi.is-danger { border-color: #f2d9d5; background: #fffafa; }
.dashboard-reference-kpi.is-danger .dashboard-reference-icon { color: #c85b55; background: #fbe9e7; }
.dashboard-reference-kpi.is-danger strong { color: #c54842; }
.dashboard-reference-kpi.is-warning .dashboard-reference-icon { color: #bd831c; background: #fff4d9; }
.dashboard-reference-kpi.is-warning strong { color: #a66d0c; }

.dashboard-reference-workspace {
  grid-template-columns: minmax(0, 1.45fr) minmax(340px, .85fr);
  gap: 16px;
  margin-bottom: 18px;
}

.dashboard-reference-column { grid-template-rows: 278px 294px; gap: 16px; }
.dashboard-reference-summary-column { grid-template-rows: 330px 242px; }

.dashboard-reference-panel {
  padding: 18px 20px;
  border-color: #dce9e7;
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 6px 20px rgba(31, 73, 70, .04);
}

.dashboard-reference-panel > header { align-items: flex-start; min-height: 34px; }
.dashboard-reference-panel h2 { color: #23494d; font-size: 17px; }
.dashboard-reference-panel h2::before { width: 3px; height: 18px; border-radius: 4px; background: #38a37f; }
.dashboard-reference-panel header p,
.dashboard-reference-trend > p { margin: 5px 0 0; color: #809394; font-size: 12px; font-weight: 500; }
.dashboard-reference-panel header button { color: #46806f; font-size: 13px; }
.dashboard-reference-chart-legend { justify-content: flex-start; margin: 12px 0 -3px; }
.dashboard-reference-gridline { stroke: #e3ecea; }
.dashboard-reference-axis { fill: #7c9293; }
.dashboard-reference-alarm-line { stroke: #d66b62; stroke-width: 2.4; }
.dashboard-reference-workorder-line { stroke: #36a381; stroke-width: 2.4; }

.dashboard-reference-reminders {
  border-color: #f0d9d5;
  background: linear-gradient(150deg, #fffafa, #fff 66%);
}

.dashboard-reference-target .dashboard-reference-reminders:has(.dashboard-tech-title.is-alert) {
  padding: 18px 20px;
  border-color: #f0d9d5;
  background: linear-gradient(150deg, #fffafa, #fff 66%);
}

.dashboard-reference-target .dashboard-reference-reminders:has(.dashboard-tech-title.is-alert)::before { display: none; }
.dashboard-reference-target .dashboard-reference-reminders:has(.dashboard-tech-title.is-alert) .dashboard-tech-title.is-alert {
  padding: 0;
  border-radius: 0;
  color: #b95751;
  background: transparent;
}
.dashboard-reference-target .dashboard-reference-reminders:has(.dashboard-tech-title.is-alert) .dashboard-tech-title.is-alert::before {
  width: 3px;
  height: 18px;
  margin: 0;
  border-radius: 4px;
  background: #d66b62;
  animation: none;
}

.dashboard-reference-target .dashboard-reference-reminders:has(.dashboard-tech-title.is-alert) .dashboard-alert-hero {
  width: auto;
  min-height: auto;
  display: flex;
  align-items: baseline;
  justify-content: flex-start;
  gap: 9px;
  margin: 16px 0 12px;
  padding: 12px 14px;
  border: 1px solid #f3d8d4;
  border-left: 4px solid #d66b62;
  border-radius: 10px;
  background: #fff;
  box-shadow: none;
  animation: none;
  text-align: left;
}

.dashboard-reference-target .dashboard-reference-reminders:has(.dashboard-tech-title.is-alert) .dashboard-alert-hero strong { color: #bd514b; font-size: 30px; }
.dashboard-reference-target .dashboard-reference-reminders:has(.dashboard-tech-title.is-alert) .dashboard-alert-hero span { color: #8f6c6a; font-size: 13px; }
.dashboard-reference-reminder-list { margin-top: 0; border-color: #f0e2df; border-radius: 10px; }
.dashboard-reference-reminder-list article { min-height: 50px; padding: 7px 10px; border-color: #f3e6e3; }
.dashboard-reference-reminder-list small { color: #61797a; font-weight: 500; }
.dashboard-reference-target .dashboard-reference-reminders .alert-trend-strip { margin-top: 10px; border-color: #f0e3e0; }

.dashboard-reference-device-body { grid-template-columns: 140px minmax(0, 1fr); gap: 16px; }
.dashboard-reference-donut { width: 120px; height: 120px; box-shadow: none; }
.dashboard-reference-donut > div { width: 92px; height: 92px; background: #fff; }
.dashboard-reference-donut strong { font-size: 24px; }
.dashboard-reference-device-legend { gap: 11px; }
.dashboard-reference-device-legend > div { color: #456466; font-size: 13px; }

.dashboard-reference-table-wrap { height: calc(100% - 49px); border-color: #e1ecea; border-radius: 10px; }
.dashboard-reference-table-wrap th,
.dashboard-reference-table-wrap td { padding: 9px; border-color: #e8efee; color: #526d6f; }
.dashboard-reference-table-wrap th { background: #f5f9f8; color: #698183; }
.dashboard-reference-handle { color: #298b72; }

.dashboard-reference-shortcuts {
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 10px;
  padding-top: 12px;
  border-top: 1px solid #e0eae8;
}

.dashboard-reference-shortcuts-title { grid-column: 1 / -1; display: flex; align-items: baseline; gap: 10px; }
.dashboard-reference-shortcuts-title span { color: #345557; font-size: 15px; font-weight: 800; }
.dashboard-reference-shortcuts-title small { color: #87999a; font-size: 12px; }
.dashboard-reference-shortcuts button { min-height: 82px; gap: 10px; padding: 13px; border-color: #dfeae8; border-radius: 12px; background: #fff; }
.dashboard-reference-shortcuts .dashboard-reference-icon { width: 28px; height: 28px; color: #298b72; }
.dashboard-reference-shortcuts div > span { color: #506c6e; font-size: 13px; }
.dashboard-reference-shortcuts strong { color: #25464a; font-size: 23px; }
.dashboard-reference-shortcuts em { color: #829495; font-size: 11px; }

@media (max-width: 1280px) {
  .dashboard-reference-target { padding: 18px; }
  .dashboard-reference-header { grid-template-columns: 1fr auto; }
  .dashboard-reference-heading { grid-column: 1 / -1; grid-row: 1; }
  .dashboard-reference-time { grid-column: 1; grid-row: 2; }
  .dashboard-reference-actions { grid-column: 2; grid-row: 2; }
  .dashboard-reference-workspace { grid-template-columns: 1fr; }
}

@media (max-width: 720px) {
  .dashboard-reference-target { padding: 12px; }
  .dashboard-reference-header { grid-template-columns: 1fr; gap: 14px; padding: 16px; }
  .dashboard-reference-heading,
  .dashboard-reference-time,
  .dashboard-reference-actions { grid-column: auto; grid-row: auto; }
  .dashboard-reference-actions { justify-items: start; }
  .dashboard-reference-kpi { min-height: 116px; padding: 14px; }
  .dashboard-reference-kpi .dashboard-reference-icon { width: 28px; height: 28px; padding: 7px; }
  .dashboard-reference-workspace { gap: 12px; }
  .dashboard-reference-column,
  .dashboard-reference-summary-column { grid-template-rows: auto; gap: 12px; }
  .dashboard-reference-panel { min-height: 0; padding: 16px; }
  .dashboard-reference-trend { min-height: 270px; }
  .dashboard-reference-events { min-height: 330px; }
  .dashboard-reference-table-wrap { overflow-x: auto; }
  .dashboard-reference-table-wrap table { min-width: 650px; }
  .dashboard-reference-shortcuts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* 平台总览：按概览视觉稿仅调整设备分类、待处理提醒与警情分布。 */
.dashboard-screen-scoped-soft .dashboard-side-stack > .dashboard-tech-panel:has(.dashboard-tech-title.is-alert) {
  border-color: rgba(217, 106, 120, 0.4);
  background:
    linear-gradient(180deg, rgba(217, 106, 120, 0.08), transparent 150px),
    var(--panel);
}

.dashboard-screen-scoped-soft .dashboard-side-stack > .dashboard-tech-panel:has(.dashboard-tech-title.is-alert)::before {
  width: 140px;
  background: linear-gradient(90deg, rgba(217, 106, 120, 0.96), transparent);
}

.dashboard-screen-scoped-soft .dashboard-tech-title.is-alert {
  color: #fff;
  background: linear-gradient(90deg, rgba(205, 78, 92, 0.96), rgba(217, 106, 120, 0.84));
  border-radius: 8px;
  padding: 6px 14px;
}

.dashboard-screen-scoped-soft .dashboard-tech-title.is-alert::before {
  content: "";
  display: inline-block;
  width: 7px;
  height: 7px;
  margin-right: 6px;
  border-radius: 50%;
  background: #fff;
  color: transparent;
  vertical-align: middle;
  box-shadow: none;
  animation: alertDotBlink 1.2s ease-in-out infinite;
}

.dashboard-screen-scoped-soft .dashboard-tech-title.is-alert::after {
  display: none;
}

.dashboard-screen-scoped-soft .dashboard-alert-hero {
  width: 168px;
  min-height: 168px;
  margin-bottom: 8px;
  border-color: rgba(217, 106, 120, 0.45);
  background: radial-gradient(circle at center, #ffffff, #fdeef0);
  box-shadow: 0 0 0 8px rgba(217, 106, 120, 0.12), 0 6px 18px rgba(217, 106, 120, 0.2);
  animation: alertHeroPulse 1.6s ease-in-out infinite;
}

.dashboard-screen-scoped-soft .dashboard-alert-hero strong {
  font-size: 34px;
  color: #d96a78;
}

.dashboard-screen-scoped-soft .dashboard-alert-hero span {
  color: #b06c76;
  font-size: 11px;
}

.dashboard-side-stack > .dashboard-tech-panel:has(.dashboard-tech-title.is-alert) .dashboard-list-item {
  padding: 10px 12px;
  border: none;
  border-bottom: 1px solid rgba(47, 127, 184, 0.12);
  border-radius: 0;
  background: transparent;
}

.dashboard-side-stack > .dashboard-tech-panel:has(.dashboard-tech-title.is-alert) .dashboard-list-item:last-child {
  border-bottom: 0;
}

.dashboard-screen-scoped-soft .dashboard-side-stack > .dashboard-tech-panel:has(.alert-trend-strip) {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 13px;
}

.dashboard-screen-scoped-soft .dashboard-side-stack > .dashboard-tech-panel:has(.alert-trend-strip) .dashboard-donut-wrap {
  gap: 12px;
}

.dashboard-screen-scoped-soft .dashboard-side-stack > .dashboard-tech-panel:has(.alert-trend-strip) .dashboard-legend {
  gap: 7px;
}

.dashboard-screen-scoped-soft .alert-trend-strip {
  display: grid;
  grid-column: 1 / -1;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  margin-top: 8px;
  padding-top: 8px;
  border-top: 1px solid var(--line);
}

.dashboard-screen-scoped-soft .alert-trend-item {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  padding: 7px 2px 3px;
}

.dashboard-screen-scoped-soft .alert-trend-item::before {
  content: "";
  position: absolute;
  top: 0;
  right: 10%;
  left: 10%;
  height: 3px;
  border-radius: 2px;
  background: var(--accent);
}

.dashboard-screen-scoped-soft .alert-trend-item:nth-child(1)::before { background: var(--danger); }
.dashboard-screen-scoped-soft .alert-trend-item:nth-child(2)::before { background: var(--success); }
.dashboard-screen-scoped-soft .alert-trend-item strong { color: var(--text); font-size: 20px; font-weight: 700; line-height: 1; font-variant-numeric: tabular-nums; }
.dashboard-screen-scoped-soft .alert-trend-item span { color: var(--muted); font-size: 11px; line-height: 1.2; white-space: nowrap; }
.dashboard-screen-scoped-soft .dashboard-tech-panel { padding: 13px; }
.dashboard-screen-scoped-soft .dashboard-donut-wrap { gap: 12px; }
.dashboard-screen-scoped-soft .dashboard-legend { gap: 7px; }

@keyframes alertHeroPulse {
  0%, 100% { box-shadow: 0 0 0 8px rgba(217, 106, 120, 0.12), 0 6px 18px rgba(217, 106, 120, 0.2); }
  50% { box-shadow: 0 0 0 13px rgba(217, 106, 120, 0.22), 0 6px 24px rgba(217, 106, 120, 0.38); }
}

@keyframes alertDotBlink {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.2; }
}

@media (prefers-reduced-motion: reduce) {
  .dashboard-screen-scoped-soft .dashboard-alert-hero,
  .dashboard-screen-scoped-soft .dashboard-tech-title.is-alert::before {
    animation: none;
  }
}

/* Module pages share the standard sidebar. On narrow screens the same routes
   move into a compact, horizontal task bar so content remains the first view. */
@media (max-width: 720px) {
  .app-shell:not(.dashboard-app-shell-scoped-reference) .sidebar {
    display: none;
  }

  .app-shell:not(.dashboard-app-shell-scoped-reference) .main {
    display: block;
    min-width: 0;
    padding: 0;
    gap: 0;
  }

  .app-shell:not(.dashboard-app-shell-scoped-reference) .content-grid,
  .app-shell:not(.dashboard-app-shell-scoped-reference) .content-grid > * {
    min-width: 0;
  }

  .mobile-route-nav {
    position: sticky;
    z-index: 10;
    top: 0;
    display: flex;
    gap: 6px;
    align-items: center;
    padding: 6px 12px;
    overflow-x: auto;
    background: rgba(248, 252, 255, 0.96);
    border-bottom: 1px solid var(--line);
    backdrop-filter: blur(14px);
  }

  .mobile-route-nav .ghost-button {
    flex: 0 0 auto;
    min-height: 32px;
    padding: 6px 10px;
    white-space: nowrap;
  }

  .mobile-route-nav .ghost-button.active {
    border-color: rgba(80, 168, 228, 0.95);
    background: linear-gradient(135deg, #4ea7e3 0%, #89c8ef 100%);
    color: #ffffff;
  }

  .mobile-route-nav + * {
    min-width: 0;
    margin: 12px;
  }
}

/* Superadmin uses a light command-center frame: reference-like structure,
   but the same calm product palette and real institution data. */
.superadmin-dashboard-shell { min-height: 100vh; padding-bottom: 82px; color: var(--text); background: radial-gradient(circle at 50% 0, rgba(166, 211, 242, .38), transparent 37%), linear-gradient(180deg, #f9fcff 0%, #edf6fd 70%, #f7fbff 100%); }
.superadmin-dashboard-topbar { position: sticky; top: 0; z-index: 30; display: grid; grid-template-columns: minmax(240px, 1fr) minmax(280px, 1.4fr) minmax(240px, 1fr); align-items: center; min-height: 74px; padding: 10px 28px; border-bottom: 1px solid rgba(183, 218, 242, .95); background: rgba(249, 253, 255, .92); box-shadow: 0 8px 24px rgba(69, 124, 173, .08); backdrop-filter: blur(18px); }
.superadmin-dashboard-brand, .superadmin-dashboard-user { display: flex; align-items: center; gap: 11px; min-width: 0; }.superadmin-dashboard-brand > div { display: grid; gap: 2px; }.superadmin-dashboard-brand strong { color: #2e7fb7; font-size: 19px; letter-spacing: .08em; }.superadmin-dashboard-brand span { overflow: hidden; max-width: 180px; color: #7894ad; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }.superadmin-dashboard-title { position: relative; min-width: 0; text-align: center; }.superadmin-dashboard-title::before, .superadmin-dashboard-title::after { content: ""; position: absolute; top: 50%; width: 15%; height: 1px; background: linear-gradient(90deg, transparent, #a8d4ee); }.superadmin-dashboard-title::before { left: 0; }.superadmin-dashboard-title::after { right: 0; transform: scaleX(-1); }.superadmin-dashboard-title small { display: block; color: #75a1c0; font-size: 10px; letter-spacing: .16em; }.superadmin-dashboard-title h1 { margin: 2px 0 0; color: #244d72; font-size: 18px; letter-spacing: .12em; }.superadmin-dashboard-user { justify-content: flex-end; color: #6f8ba4; font-size: 12px; }.superadmin-dashboard-user time { font-variant-numeric: tabular-nums; }.superadmin-dashboard-user details { position: relative; }.superadmin-dashboard-user summary { cursor: pointer; font-weight: 700; list-style: none; }.superadmin-dashboard-user summary::-webkit-details-marker, .superadmin-menu summary::-webkit-details-marker { display: none; }.superadmin-dashboard-user details button { position: absolute; top: 24px; right: 0; min-width: 82px; padding: 8px 10px; border: 1px solid #cfe5f5; border-radius: 9px; color: #3c698d; background: #fff; box-shadow: 0 10px 24px rgba(57, 107, 152, .13); cursor: pointer; }
.superadmin-menu { position: relative; }.superadmin-menu > summary { display: inline-flex; align-items: center; gap: 6px; padding: 8px 10px; border: 1px solid #cde5f6; border-radius: 10px; color: #397ba9; font-size: 12px; font-weight: 800; background: rgba(238, 248, 255, .84); cursor: pointer; list-style: none; }.superadmin-menu > summary > span:first-child { font-size: 17px; line-height: 1; }.superadmin-menu-panel { position: absolute; top: calc(100% + 10px); left: 0; display: grid; grid-template-columns: repeat(2, minmax(190px, 1fr)); gap: 12px; width: min(650px, calc(100vw - 32px)); padding: 16px; border: 1px solid #cfe5f5; border-radius: 16px; background: rgba(255, 255, 255, .98); box-shadow: 0 20px 46px rgba(51, 109, 157, .19); }.superadmin-menu-panel section { min-width: 0; }.superadmin-menu-panel h2 { margin: 0 0 8px; color: #7192aa; font-size: 11px; letter-spacing: .1em; }.superadmin-menu-panel section > div { display: flex; flex-wrap: wrap; gap: 6px; }.superadmin-menu-panel button { padding: 6px 9px; border: 1px solid transparent; border-radius: 8px; color: #365c7b; font: inherit; font-size: 12px; background: #f5faff; cursor: pointer; }.superadmin-menu-panel button:hover, .superadmin-menu-panel button.active { border-color: #a9d7ef; color: #257bb2; background: #eaf7ff; }
.superadmin-dashboard-main { min-width: 0; }.superadmin-command-center { width: min(1640px, 100%); margin: 0 auto; padding: 25px 30px 34px; }.superadmin-command-heading { display: flex; align-items: end; justify-content: space-between; gap: 20px; margin-bottom: 16px; }.superadmin-command-heading p, .superadmin-command-panel header p { margin: 0 0 5px; color: #6a9abd; font-size: 11px; font-weight: 800; letter-spacing: .12em; }.superadmin-command-heading h1 { margin: 0; color: #254a6c; font-size: 29px; letter-spacing: -.03em; }.superadmin-command-heading span { display: block; margin-top: 7px; color: #7892a8; font-size: 13px; }.superadmin-refresh-button, .superadmin-action-button { border: 1px solid #b9dcf1; border-radius: 9px; color: #287db6; font: inherit; font-weight: 700; background: #f4fbff; cursor: pointer; }.superadmin-refresh-button { padding: 9px 13px; }.superadmin-refresh-button:hover, .superadmin-action-button:hover { border-color: #70b9e3; background: #e8f6ff; }.superadmin-command-metrics { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin-bottom: 14px; }.superadmin-command-metrics article, .superadmin-command-panel { border: 1px solid rgba(202, 225, 240, .95); background: rgba(255, 255, 255, .9); box-shadow: 0 10px 26px rgba(78, 130, 171, .07), inset 0 1px 0 rgba(255, 255, 255, .9); }.superadmin-command-metrics article { min-height: 104px; padding: 15px 17px; border-radius: 13px; }.superadmin-command-metrics span, .superadmin-command-metrics small { display: block; color: #6e899f; font-size: 12px; }.superadmin-command-metrics strong { display: block; margin: 7px 0 5px; color: #2d6086; font-size: 30px; line-height: 1; font-variant-numeric: tabular-nums; }.superadmin-command-metrics strong em { margin-left: 3px; font-size: 14px; font-style: normal; }.superadmin-command-metrics article.is-risk { border-color: #efcfd4; background: linear-gradient(135deg, #fffafb 0%, #fff 100%); }.superadmin-command-metrics article.is-risk strong { color: var(--danger); }.superadmin-command-workspace { display: grid; grid-template-columns: minmax(260px, .85fr) minmax(420px, 1.45fr) minmax(260px, .85fr); gap: 14px; align-items: stretch; }.superadmin-command-panel { min-width: 0; border-radius: 15px; }.superadmin-command-panel > header { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }.superadmin-command-panel h2 { margin: 0; color: #264d70; font-size: 18px; }.superadmin-command-panel > header > span { max-width: 150px; color: #8097aa; font-size: 11px; line-height: 1.45; text-align: right; }.superadmin-command-queue { display: flex; flex-direction: column; padding: 17px; }.superadmin-command-queue > header > span { display: grid; width: 28px; height: 28px; place-items: center; border-radius: 50%; color: #a44d58; font-size: 12px; font-weight: 800; background: #fff0f2; }.superadmin-issue-list { display: grid; align-content: start; gap: 0; margin-top: 13px; }.superadmin-issue-list article { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 13px 0; border-top: 1px solid #e7f0f6; }.superadmin-issue-list article > div { display: grid; min-width: 0; gap: 3px; }.superadmin-issue-list article span { color: #ac7823; font-size: 11px; font-weight: 800; }.superadmin-issue-list article.is-danger span { color: #c15460; }.superadmin-issue-list article strong { overflow: hidden; color: #355675; font-size: 14px; text-overflow: ellipsis; white-space: nowrap; }.superadmin-issue-list article small, .superadmin-issue-list article time { overflow: hidden; color: #7890a4; font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }.superadmin-action-button { flex: 0 0 auto; padding: 7px 9px; font-size: 12px; }.superadmin-action-readonly { color: #90a2b2; font-size: 12px; white-space: nowrap; }.superadmin-command-queue footer { margin-top: auto; padding-top: 13px; border-top: 1px solid #e7f0f6; }.superadmin-empty-state { padding: 38px 0; color: #8499aa; font-size: 13px; text-align: center; }
.superadmin-command-stage { display: grid; grid-template-rows: auto auto minmax(0, 1fr); padding: 17px; }.superadmin-safety-hero { display: grid; grid-template-columns: 150px minmax(0, 1fr); gap: 24px; align-items: center; margin: 16px 0; padding: 16px 18px; border: 1px solid #d4e8f5; border-radius: 12px; background: linear-gradient(110deg, #f7fcff 0%, #edf8ff 100%); }.superadmin-safety-hero > div { display: grid; place-items: center; width: 120px; height: 120px; border: 8px solid #9dceea; border-radius: 50%; color: #326a91; background: #fff; box-shadow: inset 0 0 0 1px #e2f0f8; }.superadmin-safety-hero.is-risk > div { border-color: #e8aeb7; color: #c25460; }.superadmin-safety-hero span, .superadmin-safety-hero small { font-size: 11px; }.superadmin-safety-hero strong { font-size: 36px; line-height: 1; font-variant-numeric: tabular-nums; }.superadmin-safety-hero ul { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin: 0; padding: 0; list-style: none; }.superadmin-safety-hero li { display: grid; gap: 6px; padding: 9px 7px; border-left: 1px solid #d5e8f4; }.superadmin-safety-hero li span { color: #7892a6; }.superadmin-safety-hero li strong { color: #345c7c; font-size: 23px; line-height: 1; }.superadmin-trend { min-height: 0; padding-top: 8px; }.superadmin-trend > header { display: flex; align-items: center; justify-content: space-between; gap: 12px; }.superadmin-trend h3 { margin: 0; color: #416983; font-size: 13px; }.superadmin-trend header div { display: flex; gap: 10px; color: #7a92a5; font-size: 11px; }.superadmin-trend header span::before { content: ""; display: inline-block; width: 7px; height: 7px; margin-right: 4px; border-radius: 50%; background: var(--accent); }.superadmin-trend header .is-alarm::before { background: var(--danger); }.superadmin-trend svg { width: 100%; height: 190px; overflow: visible; }.superadmin-trend-grid { stroke: #dcecf6; stroke-dasharray: 3 3; }.superadmin-trend-alarm, .superadmin-trend-workorder { fill: none; stroke-width: 2.4; }.superadmin-trend-alarm { stroke: var(--danger); }.superadmin-trend-workorder { stroke: var(--accent); }.superadmin-trend-axis { fill: #8298aa; font-size: 11px; font-family: var(--font-ui); }
.superadmin-command-side { display: grid; grid-template-rows: 1fr 1fr; gap: 14px; }.superadmin-device-panel, .superadmin-status-panel { padding: 17px; }.superadmin-device-panel header .superadmin-action-button { padding: 6px 8px; }.superadmin-device-ratio { display: flex; align-items: end; gap: 9px; margin: 15px 0 12px; }.superadmin-device-ratio strong { color: #2e6e9a; font-size: 37px; line-height: .9; font-variant-numeric: tabular-nums; }.superadmin-device-ratio small { color: #7f99ad; font-size: 17px; }.superadmin-device-ratio span { margin-bottom: 2px; color: #7892a5; font-size: 12px; }.superadmin-device-panel dl, .superadmin-status-panel dl { display: grid; gap: 8px; margin: 0; }.superadmin-device-panel dl div, .superadmin-status-panel dl div { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding-top: 8px; border-top: 1px solid #e8f0f5; }.superadmin-device-panel dt, .superadmin-status-panel dt { color: #7892a5; font-size: 12px; }.superadmin-device-panel dd, .superadmin-status-panel dd { margin: 0; color: #365b78; font-size: 13px; font-weight: 800; }.superadmin-status-panel dd.is-warning { color: #b47b1f; }.superadmin-side-actions { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 14px; }
.superadmin-dashboard-dock { position: fixed; z-index: 35; right: 50%; bottom: 12px; display: grid; grid-template-columns: repeat(5, minmax(100px, 1fr)); align-items: end; width: min(680px, calc(100vw - 32px)); transform: translateX(50%); padding: 7px 12px; border: 1px solid #c7e4f5; border-radius: 18px; background: rgba(251, 254, 255, .96); box-shadow: 0 15px 36px rgba(65, 122, 167, .18); backdrop-filter: blur(16px); }.superadmin-dashboard-dock button { display: grid; place-items: center; gap: 2px; min-height: 38px; padding: 3px 8px; border: 0; color: #6b8ca5; font: inherit; font-size: 12px; font-weight: 800; background: transparent; cursor: pointer; }.superadmin-dashboard-dock button:hover { color: #247caf; }.superadmin-dashboard-dock button.is-home { min-height: 58px; margin-top: -25px; border: 6px solid #f4fbff; border-radius: 50%; color: #fff; background: linear-gradient(135deg, #4f9fd3, #7ac6ed); box-shadow: 0 8px 18px rgba(58, 143, 199, .28); }.superadmin-dashboard-dock button.is-home span { font-size: 24px; line-height: .8; }.superadmin-dashboard-dock button.is-home:not(.active) { color: #fff; }
@media (max-width: 1180px) { .superadmin-command-workspace { grid-template-columns: minmax(300px, .9fr) minmax(400px, 1.3fr); }.superadmin-command-side { grid-column: 1 / -1; grid-template-columns: 1fr 1fr; grid-template-rows: auto; }.superadmin-dashboard-topbar { grid-template-columns: 1fr auto; }.superadmin-dashboard-title { grid-column: 1 / -1; grid-row: 1; }.superadmin-dashboard-brand { grid-column: 1; grid-row: 2; }.superadmin-dashboard-user { grid-column: 2; grid-row: 2; } }
@media (max-width: 760px) { .superadmin-dashboard-shell { padding-bottom: 72px; }.superadmin-dashboard-topbar { grid-template-columns: 1fr auto; min-height: 104px; padding: 10px 14px; }.superadmin-dashboard-title { text-align: left; }.superadmin-dashboard-title::before, .superadmin-dashboard-title::after { display: none; }.superadmin-dashboard-title h1 { font-size: 16px; letter-spacing: .06em; }.superadmin-dashboard-brand strong { font-size: 16px; }.superadmin-dashboard-brand span { display: none; }.superadmin-dashboard-user .api-status-badge { padding: 3px 7px; }.superadmin-dashboard-user time { display: none; }.superadmin-dashboard-user details summary { max-width: 84px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }.superadmin-menu > summary > span:last-child { display: none; }.superadmin-menu-panel { grid-template-columns: 1fr; max-height: calc(100vh - 130px); overflow-y: auto; }.superadmin-command-center { padding: 18px 12px 24px; }.superadmin-command-heading { align-items: flex-start; flex-direction: column; gap: 12px; }.superadmin-command-heading h1 { font-size: 25px; }.superadmin-command-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }.superadmin-command-metrics article { min-height: 96px; padding: 13px; }.superadmin-command-metrics strong { font-size: 27px; }.superadmin-command-workspace { grid-template-columns: 1fr; }.superadmin-command-side { grid-column: auto; grid-template-columns: 1fr; }.superadmin-command-stage { min-height: 440px; }.superadmin-safety-hero { grid-template-columns: 112px minmax(0, 1fr); gap: 12px; padding: 12px; }.superadmin-safety-hero > div { width: 102px; height: 102px; border-width: 7px; }.superadmin-safety-hero strong { font-size: 31px; }.superadmin-safety-hero ul { grid-template-columns: 1fr; gap: 0; }.superadmin-safety-hero li { padding: 7px 6px; }.superadmin-safety-hero li strong { font-size: 18px; }.superadmin-trend svg { height: 170px; }.superadmin-dashboard-dock { bottom: 8px; grid-template-columns: repeat(5, minmax(0, 1fr)); width: calc(100vw - 16px); padding: 5px 4px; }.superadmin-dashboard-dock button { min-width: 0; padding: 3px 2px; font-size: 10px; white-space: nowrap; }.superadmin-dashboard-dock button.is-home { min-height: 51px; margin-top: -20px; border-width: 5px; }.superadmin-dashboard-dock button.is-home span { font-size: 21px; } }

/* The page title is already carried by the fixed frame; keep the first view
   focused on the safety metrics and working panels. */
.superadmin-top-refresh { padding: 5px 9px; border: 1px solid #c5e2f3; border-radius: 8px; color: #317dae; font: inherit; font-size: 12px; font-weight: 700; background: #f4fbff; cursor: pointer; }
.superadmin-top-refresh:hover { border-color: #7abce1; background: #e9f7ff; }
@media (max-width: 760px) { .superadmin-top-refresh { padding: 4px 7px; font-size: 11px; } }

/* Superadmin dashboard: retain the product palette while adopting the
   reference board's side-towers / centre-stage information architecture. */
.superadmin-template-command-center { max-width: 1720px; padding-top: 18px; }
.superadmin-template-command-center .superadmin-command-board { display: grid; grid-template-columns: minmax(270px, .86fr) minmax(470px, 1.55fr) minmax(270px, .86fr); gap: 16px; align-items: stretch; }
.superadmin-template-command-center .superadmin-board-column { display: grid; grid-template-rows: minmax(208px, 1.04fr) minmax(178px, .88fr) minmax(170px, .82fr); gap: 16px; min-width: 0; }
.superadmin-template-command-center .superadmin-board-right { grid-template-rows: minmax(194px, .92fr) minmax(218px, 1.05fr) minmax(184px, .87fr); }
.superadmin-template-command-center .superadmin-board-panel,
.superadmin-template-command-center .superadmin-board-stage { position: relative; overflow: hidden; border-radius: 12px; }
.superadmin-template-command-center .superadmin-board-panel::before,
.superadmin-template-command-center .superadmin-board-stage::before { position: absolute; top: 0; left: 0; width: 100%; height: 3px; content: ""; background: #8bc7eb; }
.superadmin-template-command-center .superadmin-board-alerts::before { background: #d9818d; }
.superadmin-template-command-center .superadmin-board-panel > header,
.superadmin-template-command-center .superadmin-board-stage > header { align-items: center; min-height: 44px; padding: 13px 15px 11px; border-bottom: 1px solid #e3f0f7; background: linear-gradient(90deg, rgba(238, 248, 255, .95), rgba(255, 255, 255, .82)); }
.superadmin-template-command-center .superadmin-board-panel > header p,
.superadmin-template-command-center .superadmin-board-stage > header p { margin-bottom: 2px; color: #4a92bf; font-size: 10px; letter-spacing: .18em; }
.superadmin-template-command-center .superadmin-board-panel h2,
.superadmin-template-command-center .superadmin-board-stage h2 { font-size: 16px; }
.superadmin-template-command-center .superadmin-board-alerts > header > span { display: grid; width: 30px; height: 30px; place-items: center; border: 1px solid #f0d1d6; border-radius: 50%; color: #b55965; background: #fff7f8; }
.superadmin-template-command-center .superadmin-board-alerts,
.superadmin-template-command-center .superadmin-board-problems { display: flex; flex-direction: column; }
.superadmin-template-command-center .superadmin-board-alerts .superadmin-issue-list,
.superadmin-template-command-center .superadmin-board-problems .superadmin-issue-list { margin: 0 15px; overflow: auto; }
.superadmin-template-command-center .superadmin-board-alerts .superadmin-issue-list article,
.superadmin-template-command-center .superadmin-board-problems .superadmin-issue-list article { padding: 10px 0; }
.superadmin-template-command-center .superadmin-board-alerts .superadmin-issue-list article small,
.superadmin-template-command-center .superadmin-board-alerts .superadmin-issue-list article time,
.superadmin-template-command-center .superadmin-board-problems .superadmin-issue-list article small,
.superadmin-template-command-center .superadmin-board-problems .superadmin-issue-list article time { font-size: 11px; }
.superadmin-template-command-center .superadmin-board-alerts footer { margin-top: auto; padding: 10px 15px; border-top: 1px solid #e5eff5; }
.superadmin-template-command-center .superadmin-board-assets { padding-bottom: 13px; }
.superadmin-template-command-center .superadmin-board-stat-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 9px; padding: 13px 15px 0; }
.superadmin-template-command-center .superadmin-board-stat-grid article { min-width: 0; padding-left: 9px; border-left: 2px solid #c9e7f7; }
.superadmin-template-command-center .superadmin-board-stat-grid article:nth-child(3),
.superadmin-template-command-center .superadmin-board-stat-grid article:nth-child(4) { border-color: #f0ddbc; }
.superadmin-template-command-center .superadmin-board-stat-grid span,
.superadmin-template-command-center .superadmin-board-stat-grid small { display: block; overflow: hidden; color: #7792a8; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.superadmin-template-command-center .superadmin-board-stat-grid strong { display: block; margin: 5px 0 3px; color: #315f83; font-size: 22px; line-height: 1; font-variant-numeric: tabular-nums; }
.superadmin-template-command-center .superadmin-board-stat-grid strong em { color: #7d98ac; font-size: 12px; font-style: normal; }
.superadmin-template-command-center .superadmin-board-stat-grid strong.is-warning { color: #b37c25; }
.superadmin-template-command-center .superadmin-board-duty { padding-bottom: 12px; }
.superadmin-template-command-center .superadmin-board-duty dl,
.superadmin-template-command-center .superadmin-board-monitoring dl { display: grid; gap: 0; margin: 0; padding: 6px 15px 0; }
.superadmin-template-command-center .superadmin-board-duty dl div,
.superadmin-template-command-center .superadmin-board-monitoring dl div { display: flex; justify-content: space-between; gap: 10px; padding: 6px 0; border-bottom: 1px solid #edf3f7; }
.superadmin-template-command-center .superadmin-board-duty dt,
.superadmin-template-command-center .superadmin-board-monitoring dt { color: #7691a7; font-size: 12px; }
.superadmin-template-command-center .superadmin-board-duty dd,
.superadmin-template-command-center .superadmin-board-monitoring dd { margin: 0; color: #375c78; font-size: 12px; font-weight: 800; }
.superadmin-template-command-center dd.is-warning { color: #b47b1f; }
.superadmin-template-command-center .superadmin-board-duty .superadmin-side-actions { margin: 9px 15px 0; }
.superadmin-template-command-center .superadmin-board-stage { align-self: start; display: grid; grid-template-rows: auto minmax(214px, .9fr) minmax(205px, .82fr) auto; min-height: 612px; padding: 0; }
.superadmin-template-command-center .superadmin-board-stage > header { margin: 0; }
.superadmin-template-command-center .superadmin-board-stage > header > span { max-width: 196px; }
.superadmin-template-command-center .superadmin-stage-core { display: grid; grid-template-columns: minmax(155px, .8fr) minmax(0, 1.2fr); align-items: stretch; gap: 13px; margin: 14px 16px 6px; padding: 13px; border: 1px solid #d5e9f5; border-radius: 11px; background: linear-gradient(135deg, #f9fdff, #edf8fe); }
.superadmin-template-command-center .superadmin-stage-core.is-risk { border-color: #efd6da; background: linear-gradient(135deg, #fffafb, #f5fbff); }
.superadmin-template-command-center .superadmin-stage-status { display: grid; align-content: center; justify-items: center; min-height: 144px; padding: 12px; border: 1px solid #cbe6f5; border-radius: 10px; color: #326b92; background: rgba(255, 255, 255, .93); text-align: center; }
.superadmin-template-command-center .superadmin-stage-core.is-risk .superadmin-stage-status { border-color: #efc4cc; color: #be5663; }
.superadmin-template-command-center .superadmin-stage-status span,
.superadmin-template-command-center .superadmin-stage-status small { color: inherit; font-size: 11px; }
.superadmin-template-command-center .superadmin-stage-status strong { margin: 5px 0; font-size: 42px; line-height: .92; font-variant-numeric: tabular-nums; }
.superadmin-template-command-center .superadmin-stage-spokes { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; align-content: center; }
.superadmin-template-command-center .superadmin-stage-spokes article { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 3px 8px; min-height: 61px; padding: 8px 9px; border-left: 2px solid #a6d9f2; background: rgba(255, 255, 255, .65); }
.superadmin-template-command-center .superadmin-stage-spokes span { color: #6e8da5; font-size: 11px; }
.superadmin-template-command-center .superadmin-stage-spokes strong { color: #315e82; font-size: 22px; line-height: 1; font-variant-numeric: tabular-nums; }
.superadmin-template-command-center .superadmin-stage-spokes strong em { font-size: 11px; font-style: normal; }
.superadmin-template-command-center .superadmin-stage-spokes .superadmin-action-button { grid-column: 2; grid-row: 1 / span 2; padding: 5px 7px; font-size: 11px; }
.superadmin-template-command-center .superadmin-trend { margin: 0 16px; padding: 11px 0 0; border-top: 1px solid #e2eff6; }
.superadmin-template-command-center .superadmin-trend svg { height: 185px; }
.superadmin-template-command-center .superadmin-stage-footer { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 16px 13px; color: #7895aa; font-size: 11px; }
.superadmin-template-command-center .superadmin-stage-footer span { min-width: 0; }
.superadmin-template-command-center .superadmin-board-management { padding-bottom: 12px; }
.superadmin-template-command-center .superadmin-management-list { display: grid; gap: 0; padding: 2px 15px 0; }
.superadmin-template-command-center .superadmin-management-list article { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 9px 0; border-bottom: 1px solid #e8f1f6; }
.superadmin-template-command-center .superadmin-management-list article > div { display: grid; min-width: 0; gap: 2px; }
.superadmin-template-command-center .superadmin-management-list span,
.superadmin-template-command-center .superadmin-management-list small { overflow: hidden; color: #7892a8; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.superadmin-template-command-center .superadmin-management-list strong { color: #345f81; font-size: 16px; line-height: 1.1; }
.superadmin-template-command-center .superadmin-board-problems .superadmin-empty-state { padding: 30px 14px; }
.superadmin-template-command-center .superadmin-board-monitoring { padding-bottom: 12px; }
.superadmin-template-command-center .superadmin-board-monitoring .superadmin-device-ratio { margin: 10px 15px 5px; }
.superadmin-template-command-center .superadmin-board-monitoring .superadmin-device-ratio strong { font-size: 32px; }

@media (max-width: 1180px) {
  .superadmin-template-command-center .superadmin-command-board { grid-template-columns: minmax(300px, .9fr) minmax(430px, 1.25fr); }
  .superadmin-template-command-center .superadmin-board-right { grid-column: 1 / -1; grid-template-columns: repeat(3, minmax(0, 1fr)); grid-template-rows: minmax(190px, 1fr); }
}

@media (max-width: 760px) {
  .superadmin-template-command-center { padding-top: 12px; }
  .superadmin-template-command-center .superadmin-command-board { grid-template-columns: 1fr; gap: 12px; }
  .superadmin-template-command-center .superadmin-board-column,
  .superadmin-template-command-center .superadmin-board-right { grid-column: auto; grid-template-columns: 1fr; grid-template-rows: auto; gap: 12px; }
  .superadmin-template-command-center .superadmin-board-panel { min-height: 0; }
  .superadmin-template-command-center .superadmin-board-alerts { min-height: 276px; }
  .superadmin-template-command-center .superadmin-board-stage { min-height: 0; grid-template-rows: auto auto minmax(188px, 1fr) auto; }
  .superadmin-template-command-center .superadmin-stage-core { grid-template-columns: 1fr; gap: 10px; margin: 12px; }
  .superadmin-template-command-center .superadmin-stage-status { min-height: 102px; }
  .superadmin-template-command-center .superadmin-stage-status strong { font-size: 36px; }
  .superadmin-template-command-center .superadmin-stage-spokes article { min-height: 58px; }
  .superadmin-template-command-center .superadmin-trend { margin: 0 12px; }
  .superadmin-template-command-center .superadmin-trend svg { height: 170px; }
  .superadmin-template-command-center .superadmin-stage-footer { padding: 10px 12px 12px; }
  .superadmin-template-command-center .superadmin-stage-footer span { display: none; }
}

/* Refined command-screen geometry: this follows the supplied dashboard's
   full-width frame, three stacked side panels, dominant centre field, and
   bottom home rail while keeping the established light product theme. */
.superadmin-dashboard-shell { background: #eef8ff; }
.superadmin-dashboard-topbar { min-height: 82px; padding-right: 32px; padding-left: 32px; border-top: 3px solid #9ed6f3; border-bottom: 2px solid #b8dff3; box-shadow: 0 4px 16px rgba(53, 116, 160, .09); }
.superadmin-dashboard-title { padding: 2px 50px 5px; }
.superadmin-dashboard-title::before, .superadmin-dashboard-title::after { width: 21%; height: 2px; background: #acd8ef; }
.superadmin-dashboard-title h1 { font-size: 20px; font-weight: 800; letter-spacing: .16em; }
.superadmin-dashboard-title small { font-size: 11px; font-weight: 800; letter-spacing: .22em; }
.superadmin-template-command-center { max-width: 1880px; padding: 16px 28px 28px; }
.superadmin-template-command-center .superadmin-command-board { gap: 20px; grid-template-columns: minmax(280px, .8fr) minmax(540px, 1.62fr) minmax(280px, .8fr); }
.superadmin-template-command-center .superadmin-board-column { gap: 18px; }
.superadmin-template-command-center .superadmin-board-panel,
.superadmin-template-command-center .superadmin-board-stage { border-color: #b7dcef; border-radius: 4px; box-shadow: 0 7px 15px rgba(51, 111, 153, .08), inset 0 1px 0 #ffffff; }
.superadmin-template-command-center .superadmin-board-panel::before,
.superadmin-template-command-center .superadmin-board-stage::before { height: 4px; background: #72bae5; }
.superadmin-template-command-center .superadmin-board-panel > header,
.superadmin-template-command-center .superadmin-board-stage > header { min-height: 51px; padding: 12px 18px 10px; border-top: 1px solid #d8edf9; border-bottom-color: #c8e5f4; background: #eff9ff; }
.superadmin-template-command-center .superadmin-board-panel > header p,
.superadmin-template-command-center .superadmin-board-stage > header p { color: #438ab8; font-size: 11px; letter-spacing: .22em; }
.superadmin-template-command-center .superadmin-board-panel h2,
.superadmin-template-command-center .superadmin-board-stage h2 { color: #234f73; font-size: 18px; letter-spacing: .04em; }
.superadmin-template-command-center .superadmin-board-panel > header::after,
.superadmin-template-command-center .superadmin-board-stage > header::after { width: 62px; height: 2px; margin-left: auto; content: ""; background: #b6deef; }
.superadmin-template-command-center .superadmin-board-alerts::before { background: #d77783; }
.superadmin-template-command-center .superadmin-board-alerts > header { background: #fff9fa; }
.superadmin-template-command-center .superadmin-board-alerts > header::after { background: #edc0c7; }
.superadmin-template-command-center .superadmin-board-alerts > header > span { margin-left: 0; }
.superadmin-template-command-center .superadmin-issue-list article { min-height: 70px; }
.superadmin-template-command-center .superadmin-issue-list article strong { font-size: 15px; }
.superadmin-template-command-center .superadmin-action-button { border-radius: 3px; }
.superadmin-template-command-center .superadmin-board-stat-grid { gap: 12px 14px; padding: 16px 18px 0; }
.superadmin-template-command-center .superadmin-board-stat-grid article { min-height: 57px; padding-left: 12px; border-left-width: 3px; }
.superadmin-template-command-center .superadmin-board-stat-grid strong { font-size: 26px; }
.superadmin-template-command-center .superadmin-board-duty dl,
.superadmin-template-command-center .superadmin-board-monitoring dl { padding: 10px 18px 0; }
.superadmin-template-command-center .superadmin-board-duty dl div,
.superadmin-template-command-center .superadmin-board-monitoring dl div { padding: 8px 0; }
.superadmin-template-command-center .superadmin-board-duty .superadmin-side-actions { margin: 12px 18px 0; }
.superadmin-template-command-center .superadmin-board-stage { align-self: stretch; min-height: 0; grid-template-rows: auto minmax(258px, 1.08fr) minmax(206px, .88fr) auto; }
.superadmin-template-command-center .superadmin-stage-core { gap: 18px; margin: 16px 20px 8px; padding: 16px; border-radius: 3px; border-color: #b9dff2; background: linear-gradient(rgba(247, 252, 255, .42), rgba(247, 252, 255, .42)), url("./assets/superadmin-institution-topology.png") center / cover no-repeat; }
.superadmin-template-command-center .superadmin-stage-core.is-risk { border-color: #eac8ce; background: linear-gradient(rgba(255, 250, 251, .5), rgba(247, 252, 255, .46)), url("./assets/superadmin-institution-topology.png") center / cover no-repeat; }
.superadmin-template-command-center .superadmin-stage-status { min-height: 0; border-width: 2px; border-radius: 3px; background: rgba(255, 255, 255, .86); backdrop-filter: blur(3px); }
.superadmin-template-command-center .superadmin-stage-status strong { font-size: 52px; }
.superadmin-template-command-center .superadmin-stage-spokes { gap: 12px; }
.superadmin-template-command-center .superadmin-stage-spokes article { min-height: 76px; padding: 11px 12px; border-left-width: 3px; background: rgba(255, 255, 255, .87); backdrop-filter: blur(3px); }
.superadmin-template-command-center .superadmin-stage-spokes strong { font-size: 26px; }
.superadmin-template-command-center .superadmin-trend { margin: 0 20px; padding-top: 13px; }
.superadmin-template-command-center .superadmin-trend svg { height: 100%; min-height: 176px; max-height: 220px; }
.superadmin-template-command-center .superadmin-stage-footer { padding: 12px 20px 15px; border-top: 1px solid #e2eff6; }
.superadmin-template-command-center .superadmin-management-list { padding: 5px 18px 0; }
.superadmin-template-command-center .superadmin-management-list article { min-height: 56px; padding: 9px 0; }
.superadmin-template-command-center .superadmin-management-list strong { font-size: 18px; }
.superadmin-template-command-center .superadmin-board-monitoring .superadmin-device-ratio { margin: 14px 18px 8px; }
.superadmin-template-command-center .superadmin-board-monitoring .superadmin-device-ratio strong { font-size: 40px; }
.superadmin-dashboard-dock { bottom: 0; width: min(800px, calc(100vw - 32px)); padding: 7px 28px 4px; border: 1px solid #a9d8ee; border-bottom: 0; border-radius: 14px 14px 0 0; box-shadow: 0 -8px 24px rgba(53, 117, 162, .11); }
.superadmin-dashboard-dock button { min-height: 42px; }
.superadmin-dashboard-dock button.is-home { min-height: 64px; margin-top: -28px; border-width: 6px; }

@media (min-width: 1181px) {
  .superadmin-template-command-center .superadmin-command-board { height: max(690px, calc(100vh - 174px)); max-height: 820px; }
}

@media (max-width: 1180px) {
  .superadmin-template-command-center .superadmin-command-board { gap: 16px; }
}

@media (max-width: 760px) {
  .superadmin-dashboard-topbar { min-height: 104px; padding-right: 14px; padding-left: 14px; }
  .superadmin-dashboard-title { padding: 0; }
  .superadmin-template-command-center { padding-right: 12px; padding-left: 12px; }
  .superadmin-template-command-center .superadmin-command-board { grid-template-columns: minmax(0, 1fr); gap: 12px; }
  .superadmin-template-command-center .superadmin-board-column,
  .superadmin-template-command-center .superadmin-board-right { grid-column: auto; grid-template-columns: minmax(0, 1fr); grid-template-rows: auto; gap: 12px; }
  .superadmin-template-command-center .superadmin-board-panel,
  .superadmin-template-command-center .superadmin-board-stage { border-radius: 7px; }
  .superadmin-template-command-center .superadmin-board-stage { align-self: auto; }
  .superadmin-template-command-center .superadmin-stage-core { margin: 12px; padding: 12px; }
  .superadmin-template-command-center .superadmin-trend { margin: 0 12px; }
  .superadmin-template-command-center .superadmin-stage-footer { padding-right: 12px; padding-left: 12px; }
  .superadmin-dashboard-dock { bottom: 8px; width: calc(100vw - 16px); padding: 5px 4px; border: 1px solid #a9d8ee; border-radius: 14px; }
}

/* Pixel-faithful dark command-screen treatment for the supplied reference.
   Its framework and density are matched while the content remains institution
   scoped and the generated hero stays free of third-party marks or maps. */
.superadmin-dashboard-shell {
  --command-cyan: #25d7ec;
  --command-cyan-soft: #67e7f5;
  --command-blue: #1587d5;
  --command-gold: #f0bd45;
  --command-text: #dafaff;
  --command-muted: #6dbed1;
  color: var(--command-text);
  background: radial-gradient(ellipse at 50% 35%, rgba(13, 109, 134, .45), transparent 44%), linear-gradient(180deg, #021b26 0%, #031721 58%, #02131c 100%);
}
.superadmin-dashboard-shell::before {
  position: fixed; z-index: 0; inset: 0; pointer-events: none; content: "";
  opacity: .28;
  background-image: linear-gradient(rgba(62, 205, 230, .12) 1px, transparent 1px), linear-gradient(90deg, rgba(62, 205, 230, .12) 1px, transparent 1px);
  background-size: 44px 44px;
  mask-image: linear-gradient(to bottom, #000, transparent 78%);
}
.superadmin-dashboard-topbar {
  position: sticky; z-index: 30; min-height: 82px;
  border: 0; border-top: 3px solid #17bfd8; border-bottom: 1px solid rgba(42, 218, 237, .68);
  color: var(--command-text); background: linear-gradient(180deg, rgba(2, 42, 56, .96), rgba(2, 25, 36, .94));
  box-shadow: 0 4px 20px rgba(0, 216, 237, .28), inset 0 -1px 0 rgba(81, 238, 255, .22);
}
.superadmin-dashboard-topbar::before,
.superadmin-dashboard-topbar::after {
  position: absolute; bottom: -6px; width: 20%; height: 5px; content: "";
  background: linear-gradient(90deg, transparent, #24ddec, transparent);
  filter: drop-shadow(0 0 6px #2cf1ff);
}
.superadmin-dashboard-topbar::before { left: 16%; }
.superadmin-dashboard-topbar::after { right: 16%; }
.superadmin-dashboard-brand strong { color: var(--command-cyan-soft); text-shadow: 0 0 11px rgba(61, 230, 246, .6); }
.superadmin-dashboard-brand span, .superadmin-dashboard-user { color: #9ddbe7; }
.superadmin-dashboard-title::before, .superadmin-dashboard-title::after { width: 27%; height: 3px; background: linear-gradient(90deg, transparent, #28dced 35%, #7affff 55%, transparent); box-shadow: 0 0 10px rgba(36, 220, 237, .7); }
.superadmin-dashboard-title h1 { color: #e9ffff; font-size: 23px; letter-spacing: .22em; text-shadow: 0 0 12px rgba(51, 227, 245, .8); }
.superadmin-dashboard-title small { color: #7ae0eb; font-size: 9px; letter-spacing: .32em; }
.superadmin-dashboard-user details button,
.superadmin-menu-panel { border-color: rgba(52, 218, 237, .68); color: #d9faff; background: #042837; box-shadow: 0 14px 30px rgba(0, 0, 0, .45); }
.superadmin-menu > summary { border-color: rgba(64, 224, 241, .68); border-radius: 2px; color: #c8f9ff; background: rgba(5, 69, 86, .78); box-shadow: inset 0 0 12px rgba(27, 222, 241, .14); }
.superadmin-menu-panel button { border: 1px solid rgba(52, 205, 228, .22); border-radius: 1px; color: #bceef5; background: rgba(6, 62, 78, .78); }
.superadmin-menu-panel button:hover, .superadmin-menu-panel button.active { border-color: var(--command-cyan); color: #fff; background: rgba(18, 130, 151, .72); }
.superadmin-top-refresh, .superadmin-action-button { border-color: rgba(84, 226, 240, .72); border-radius: 1px; color: #c6f8ff; background: rgba(4, 83, 103, .74); box-shadow: inset 0 0 9px rgba(40, 216, 234, .13); }
.superadmin-top-refresh:hover, .superadmin-action-button:hover { border-color: #b8ffff; color: #fff; background: rgba(6, 137, 163, .82); box-shadow: 0 0 12px rgba(51, 226, 245, .43); }
.api-status-badge.is-ok { border-color: rgba(87, 239, 202, .6); color: #82f2ca; background: rgba(22, 151, 110, .19); }
.superadmin-dashboard-main { position: relative; z-index: 1; }
.superadmin-template-command-center { max-width: none; padding: 24px 40px 80px; }
.superadmin-template-command-center .superadmin-command-board { gap: 28px; grid-template-columns: minmax(310px, .84fr) minmax(560px, 1.55fr) minmax(310px, .84fr); }
.superadmin-template-command-center .superadmin-board-column { gap: 24px; }
.superadmin-template-command-center .superadmin-board-panel,
.superadmin-template-command-center .superadmin-board-stage {
  border: 1px solid rgba(39, 206, 228, .7); border-radius: 0; color: var(--command-text);
  background: linear-gradient(125deg, rgba(3, 55, 70, .92), rgba(3, 26, 37, .93));
  box-shadow: 0 0 0 1px rgba(38, 143, 176, .26), 0 0 18px rgba(5, 204, 229, .16), inset 0 0 28px rgba(1, 11, 20, .48);
}
.superadmin-template-command-center .superadmin-board-panel::before,
.superadmin-template-command-center .superadmin-board-stage::before { height: 2px; background: linear-gradient(90deg, transparent, #2eeaff 16%, #a4ffff 50%, #2eeaff 84%, transparent); box-shadow: 0 0 8px #27d5e8; }
.superadmin-template-command-center .superadmin-board-panel > header,
.superadmin-template-command-center .superadmin-board-stage > header {
  min-height: 54px; padding: 12px 20px 10px; border-top: 1px solid rgba(87, 232, 247, .22); border-bottom: 1px solid rgba(49, 196, 217, .5);
  background: linear-gradient(90deg, rgba(7, 108, 128, .83), rgba(5, 57, 74, .46) 65%, transparent);
}
.superadmin-template-command-center .superadmin-board-panel > header p,
.superadmin-template-command-center .superadmin-board-stage > header p { color: #7be7f2; font-size: 9px; letter-spacing: .28em; }
.superadmin-template-command-center .superadmin-board-panel h2,
.superadmin-template-command-center .superadmin-board-stage h2 { color: #edffff; font-size: 19px; letter-spacing: .08em; text-shadow: 0 0 9px rgba(76, 226, 240, .54); }
.superadmin-template-command-center .superadmin-board-panel > header::after,
.superadmin-template-command-center .superadmin-board-stage > header::after { width: 90px; background: linear-gradient(90deg, transparent, rgba(80, 225, 241, .9)); }
.superadmin-template-command-center .superadmin-board-alerts { border-color: rgba(224, 175, 57, .78); }
.superadmin-template-command-center .superadmin-board-alerts::before { background: linear-gradient(90deg, transparent, #f1c542 18%, #ffe784 50%, #f1c542 82%, transparent); box-shadow: 0 0 8px rgba(255, 208, 72, .75); }
.superadmin-template-command-center .superadmin-board-alerts > header { background: linear-gradient(90deg, rgba(133, 93, 11, .72), rgba(65, 47, 4, .36) 65%, transparent); }
.superadmin-template-command-center .superadmin-board-alerts > header p { color: #ffd971; }
.superadmin-template-command-center .superadmin-board-alerts > header::after { background: linear-gradient(90deg, transparent, #ffd15a); }
.superadmin-template-command-center .superadmin-board-alerts > header > span { border-color: rgba(252, 210, 94, .73); border-radius: 1px; color: #ffe595; background: rgba(95, 65, 2, .43); }
.superadmin-template-command-center .superadmin-issue-list article { border-color: rgba(43, 182, 204, .25); }
.superadmin-template-command-center .superadmin-issue-list article span { color: #ffc946; }
.superadmin-template-command-center .superadmin-issue-list article.is-danger span { color: #ff737d; }
.superadmin-template-command-center .superadmin-issue-list article strong,
.superadmin-template-command-center .superadmin-management-list strong { color: #d9faff; }
.superadmin-template-command-center .superadmin-issue-list article small,
.superadmin-template-command-center .superadmin-issue-list article time,
.superadmin-template-command-center .superadmin-board-stat-grid span,
.superadmin-template-command-center .superadmin-board-stat-grid small,
.superadmin-template-command-center .superadmin-management-list span,
.superadmin-template-command-center .superadmin-management-list small,
.superadmin-template-command-center .superadmin-board-duty dt,
.superadmin-template-command-center .superadmin-board-monitoring dt { color: #77bfcc; }
.superadmin-template-command-center .superadmin-board-alerts footer { border-color: rgba(49, 194, 213, .37); }
.superadmin-template-command-center .superadmin-board-stat-grid article { border-color: rgba(39, 215, 236, .75); }
.superadmin-template-command-center .superadmin-board-stat-grid article:nth-child(3),
.superadmin-template-command-center .superadmin-board-stat-grid article:nth-child(4) { border-color: rgba(247, 199, 77, .76); }
.superadmin-template-command-center .superadmin-board-stat-grid strong,
.superadmin-template-command-center .superadmin-management-list strong,
.superadmin-template-command-center .superadmin-board-duty dd,
.superadmin-template-command-center .superadmin-board-monitoring dd,
.superadmin-template-command-center .superadmin-device-ratio strong { color: #55e8f7; text-shadow: 0 0 9px rgba(56, 225, 239, .46); }
.superadmin-template-command-center .superadmin-board-stat-grid strong.is-warning,
.superadmin-template-command-center dd.is-warning { color: #ffce58; text-shadow: 0 0 9px rgba(250, 192, 56, .42); }
.superadmin-template-command-center .superadmin-board-duty dl div,
.superadmin-template-command-center .superadmin-board-monitoring dl div,
.superadmin-template-command-center .superadmin-management-list article { border-color: rgba(41, 188, 211, .28); }
.superadmin-template-command-center .superadmin-board-stage { grid-template-rows: auto minmax(290px, 1.2fr) minmax(218px, .85fr) auto; background: rgba(2, 31, 43, .95); }
.superadmin-template-command-center .superadmin-stage-core,
.superadmin-template-command-center .superadmin-stage-core.is-risk {
  position: relative; isolation: isolate; margin: 18px 22px 8px; padding: 16px;
  border: 1px solid rgba(46, 218, 238, .52); border-radius: 0;
  background: linear-gradient(rgba(1, 17, 28, .28), rgba(1, 17, 28, .36)), url("./assets/superadmin-institution-topology-dark.png") center / cover no-repeat;
  box-shadow: inset 0 0 36px rgba(2, 22, 31, .58), 0 0 15px rgba(19, 194, 217, .12);
}
.superadmin-template-command-center .superadmin-stage-core::before { position: absolute; z-index: -1; inset: 6% 12%; border: 1px solid rgba(61, 236, 249, .3); border-radius: 50%; content: ""; box-shadow: 0 0 30px rgba(20, 215, 239, .2), inset 0 0 20px rgba(20, 215, 239, .12); }
.superadmin-template-command-center .superadmin-stage-status { border-color: rgba(255, 204, 90, .86); border-radius: 0; color: #ffe188; background: linear-gradient(145deg, rgba(50, 42, 3, .78), rgba(10, 45, 55, .67)); box-shadow: 0 0 20px rgba(236, 191, 43, .23), inset 0 0 20px rgba(255, 200, 39, .12); }
.superadmin-template-command-center .superadmin-stage-core.is-risk .superadmin-stage-status { border-color: #ff8a72; color: #ffb1a5; }
.superadmin-template-command-center .superadmin-stage-status strong { color: #ffe06c; text-shadow: 0 0 14px rgba(255, 205, 69, .86); }
.superadmin-template-command-center .superadmin-stage-core { grid-template-columns: minmax(138px, .62fr) minmax(0, 1.38fr); }
.superadmin-template-command-center .superadmin-stage-status { background: linear-gradient(145deg, rgba(50, 42, 3, .53), rgba(10, 45, 55, .42)); backdrop-filter: blur(1px); }
.superadmin-template-command-center .superadmin-stage-spokes article { border-left-color: #2be5f2; background: linear-gradient(90deg, rgba(3, 87, 106, .78), rgba(2, 28, 39, .72)); box-shadow: inset 0 0 14px rgba(30, 223, 241, .08); }
.superadmin-template-command-center .superadmin-stage-spokes span { color: #a1dce6; }
.superadmin-template-command-center .superadmin-stage-spokes strong { color: #f2ffff; text-shadow: 0 0 10px rgba(70, 234, 246, .7); }
.superadmin-template-command-center .superadmin-trend { border-color: rgba(41, 199, 221, .42); }
.superadmin-template-command-center .superadmin-trend h3 { color: #b9f6ff; }
.superadmin-template-command-center .superadmin-trend header div { color: #9adbe5; }
.superadmin-template-command-center .superadmin-trend-grid { stroke: rgba(70, 213, 230, .22); }
.superadmin-template-command-center .superadmin-trend-alarm { stroke: #ffbd4b; filter: drop-shadow(0 0 3px rgba(255, 184, 54, .72)); }
.superadmin-template-command-center .superadmin-trend-workorder { stroke: #2de5f3; filter: drop-shadow(0 0 3px rgba(44, 230, 243, .65)); }
.superadmin-template-command-center .superadmin-trend-axis { fill: #73c6d3; }
.superadmin-template-command-center .superadmin-stage-footer { border-color: rgba(41, 199, 221, .4); color: #77c1cd; }
.superadmin-template-command-center .superadmin-board-monitoring .superadmin-device-ratio span { color: #9bd8e2; }
.superadmin-template-command-center .superadmin-board-stage { grid-template-rows: auto minmax(0, 1fr) auto; }
.superadmin-template-command-center .superadmin-stage-core { min-height: 0; margin-bottom: 14px; }
.superadmin-template-command-center .superadmin-board-right { grid-template-rows: minmax(0, .88fr) minmax(0, .94fr) minmax(0, 1.55fr); }
.superadmin-template-command-center .superadmin-board-left { grid-template-rows: minmax(0, 1.15fr) minmax(0, .9fr) minmax(0, .85fr); }
.superadmin-template-command-center .superadmin-board-alerts .superadmin-issue-list article,
.superadmin-template-command-center .superadmin-board-problems .superadmin-issue-list article { min-height: 0; padding-top: 7px; padding-bottom: 7px; }
.superadmin-template-command-center .superadmin-board-alerts .superadmin-issue-list article small,
.superadmin-template-command-center .superadmin-board-problems .superadmin-issue-list article small { display: none; }
.superadmin-template-command-center .superadmin-board-alerts .superadmin-issue-list article time,
.superadmin-template-command-center .superadmin-board-problems .superadmin-issue-list article time { font-size: 10px; }
.superadmin-template-command-center .superadmin-board-monitoring { display: flex; flex-direction: column; }
.superadmin-template-command-center .superadmin-board-monitoring .superadmin-device-ratio { margin-top: 10px; }
.superadmin-template-command-center .superadmin-monitoring-trend { flex: 1 1 auto; min-height: 0; margin: 7px 18px 12px; padding-top: 8px; }
.superadmin-template-command-center .superadmin-monitoring-trend svg { width: 100%; height: calc(100% - 24px); min-height: 76px; max-height: none; }
.superadmin-dashboard-dock {
  z-index: 40; bottom: 0; width: min(860px, calc(100vw - 28px)); padding: 7px 32px 4px;
  border: 1px solid rgba(48, 225, 243, .78); border-bottom: 0; border-radius: 0;
  background: linear-gradient(180deg, rgba(5, 70, 88, .96), rgba(1, 31, 43, .98)); box-shadow: 0 -8px 22px rgba(3, 218, 239, .21), inset 0 1px 0 rgba(111, 246, 255, .28);
}
.superadmin-dashboard-dock button { color: #9edce6; }
.superadmin-dashboard-dock button:hover { color: #ecffff; text-shadow: 0 0 8px #39dbea; }
.superadmin-dashboard-dock button span:empty { display: none; }
.superadmin-dashboard-dock button b { font: inherit; font-weight: 800; }
.superadmin-dashboard-dock button.is-home { border-color: #043a4e; border-radius: 50%; color: #fff; background: radial-gradient(circle at 50% 30%, #55effc, #097dad 66%, #034662); box-shadow: 0 0 0 1px #6cf7ff, 0 0 22px rgba(50, 232, 246, .74); }
.superadmin-dashboard-dock button.is-home span { font-size: 12px; font-weight: 800; letter-spacing: .08em; }
.superadmin-dashboard-dock button.is-home b { display: none; }

@media (min-width: 1181px) {
  /* Desktop command cockpit: all operational panels share one fixed viewport. */
  .superadmin-dashboard-shell { height: 100vh; overflow: hidden; }
  .superadmin-dashboard-topbar { min-height: 72px; }
  .superadmin-dashboard-main { height: calc(100vh - 72px); overflow: hidden; }
  /* The homepage is a work portal rather than the fixed operating cockpit.
     Keep its natural document height so recent visits and notifications are
     always reachable instead of being cropped by the cockpit viewport. */
  .superadmin-dashboard-shell.is-home-portal { height: auto; min-height: 100vh; overflow: visible; }
  .superadmin-dashboard-shell.is-home-portal .superadmin-dashboard-main { height: auto; overflow: visible; }
  .superadmin-template-command-center { height: 100%; box-sizing: border-box; padding: 12px 24px 64px; }
  .superadmin-template-command-center .superadmin-command-board { height: 100%; min-height: 0; max-height: none; gap: 14px; }
  .superadmin-template-command-center .superadmin-board-column { gap: 14px; }
  .superadmin-template-command-center .superadmin-board-column { grid-template-rows: minmax(0, 1.04fr) minmax(0, .88fr) minmax(0, .82fr); min-height: 0; }
  .superadmin-template-command-center .superadmin-board-right { grid-template-rows: minmax(0, .88fr) minmax(0, .94fr) minmax(0, 1.55fr); }
  .superadmin-template-command-center .superadmin-board-left { grid-template-rows: minmax(0, 1.15fr) minmax(0, .9fr) minmax(0, .85fr); }
  .superadmin-template-command-center .superadmin-board-panel,
  .superadmin-template-command-center .superadmin-board-stage { min-height: 0; }
  .superadmin-template-command-center .superadmin-board-panel > header,
  .superadmin-template-command-center .superadmin-board-stage > header { min-height: 44px; padding: 8px 14px; }
  .superadmin-template-command-center .superadmin-board-panel h2,
  .superadmin-template-command-center .superadmin-board-stage h2 { font-size: 17px; }
  .superadmin-template-command-center .superadmin-board-panel > header p,
  .superadmin-template-command-center .superadmin-board-stage > header p { font-size: 8px; }
  .superadmin-template-command-center .superadmin-issue-list article { min-height: 0; }
  .superadmin-template-command-center .superadmin-stage-core { margin: 10px 14px 5px; padding: 10px; }
  .superadmin-template-command-center .superadmin-stage-footer { padding: 7px 14px 9px; }
  .superadmin-template-command-center .superadmin-board-stat-grid { gap: 6px; padding: 9px 12px 0; }
  .superadmin-template-command-center .superadmin-board-stat-grid strong { font-size: 20px; }
  .superadmin-template-command-center .superadmin-board-monitoring dl {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0 12px;
    padding-top: 5px;
  }
  .superadmin-template-command-center .superadmin-board-monitoring dl div {
    display: grid;
    gap: 3px;
    padding: 5px 0 7px;
    border-bottom: 0;
  }
  .superadmin-template-command-center .superadmin-board-monitoring dt,
  .superadmin-template-command-center .superadmin-board-monitoring dd { white-space: nowrap; }
  .superadmin-template-command-center .superadmin-monitoring-trend { margin-top: 3px; }
}
@media (min-width: 761px) and (max-width: 1450px) {
  .superadmin-template-command-center { padding-right: 28px; padding-left: 28px; }
  .superadmin-template-command-center .superadmin-command-board { grid-template-columns: minmax(270px, .84fr) minmax(460px, 1.55fr) minmax(270px, .84fr); gap: 20px; }
  .superadmin-template-command-center .superadmin-board-column { gap: 20px; }
}
@media (max-width: 760px) {
  .superadmin-dashboard-shell { background: #031c27; }
  .superadmin-dashboard-topbar { min-height: 104px; }
  .superadmin-dashboard-title h1 { font-size: 18px; letter-spacing: .11em; }
  .superadmin-dashboard-title::before, .superadmin-dashboard-title::after { display: none; }
  .superadmin-template-command-center { padding: 14px 12px 82px; }
  .superadmin-template-command-center .superadmin-command-board { grid-template-columns: minmax(0, 1fr); gap: 12px; }
  .superadmin-template-command-center .superadmin-board-column,
  .superadmin-template-command-center .superadmin-board-right { grid-template-columns: minmax(0, 1fr); gap: 12px; }
  .superadmin-template-command-center .superadmin-board-stage { grid-template-rows: auto auto auto; }
  .superadmin-template-command-center .superadmin-stage-core { grid-template-columns: 1fr; margin: 12px; }
  .superadmin-template-command-center .superadmin-stage-status { min-height: 118px; }
  .superadmin-dashboard-dock { bottom: 7px; width: calc(100vw - 14px); padding: 5px 4px; border: 1px solid rgba(48, 225, 243, .78); border-radius: 3px; }
}

/* Restore the web platform's shared light-blue system for the superadmin
   command layout.  The dense command composition remains role-specific; its
   palette intentionally inherits the product's normal pages. */
.superadmin-dashboard-shell {
  --command-cyan: var(--accent);
  --command-cyan-soft: #89c8ef;
  --command-blue: var(--accent-deep);
  --command-gold: var(--warning);
  --command-text: var(--text);
  --command-muted: var(--muted);
  color: var(--text);
  background: linear-gradient(180deg, #f8fbff 0%, var(--bg) 58%, #e8f2fb 100%);
}
.superadmin-dashboard-shell::before {
  opacity: .42;
  background-image: linear-gradient(rgba(86, 174, 230, .12) 1px, transparent 1px), linear-gradient(90deg, rgba(86, 174, 230, .12) 1px, transparent 1px);
  mask-image: linear-gradient(to bottom, #000, transparent 86%);
}
.superadmin-dashboard-topbar {
  border-top-color: #8bc8ee;
  border-bottom-color: #cce4f4;
  color: var(--text);
  background: rgba(249, 252, 255, .96);
  box-shadow: 0 4px 18px rgba(72, 135, 181, .1), inset 0 -1px 0 #fff;
}
.superadmin-dashboard-topbar::before,
.superadmin-dashboard-topbar::after {
  background: linear-gradient(90deg, transparent, #73bde9, transparent);
  filter: none;
}
.superadmin-dashboard-brand strong { color: var(--accent-deep); text-shadow: none; }
.superadmin-dashboard-brand span,
.superadmin-dashboard-user { color: var(--muted); }
.superadmin-dashboard-title::before,
.superadmin-dashboard-title::after { background: linear-gradient(90deg, transparent, #83c5ed 42%, #b5e0f5 55%, transparent); box-shadow: none; }
.superadmin-dashboard-title h1 { color: var(--text); text-shadow: none; }
.superadmin-dashboard-title small { color: var(--accent-deep); }
.superadmin-dashboard-user details button,
.superadmin-menu-panel { border-color: #cfe5f5; color: var(--text); background: rgba(255, 255, 255, .98); box-shadow: 0 14px 30px rgba(51, 109, 157, .16); }
.superadmin-menu > summary { border-color: #c3e0f3; border-radius: 8px; color: var(--accent-deep); background: #eef8ff; box-shadow: none; }
.superadmin-menu-panel button { border-color: transparent; border-radius: 8px; color: #365c7b; background: #f5faff; }
.superadmin-menu-panel button:hover,
.superadmin-menu-panel button.active { border-color: #a9d7ef; color: var(--accent-deep); background: #eaf7ff; }
.superadmin-top-refresh,
.superadmin-action-button { border-color: #b9dcf1; border-radius: 8px; color: var(--accent-deep); background: #f4fbff; box-shadow: none; }
.superadmin-top-refresh:hover,
.superadmin-action-button:hover { border-color: #70b9e3; color: var(--accent-deep); background: #e8f6ff; box-shadow: none; }
.api-status-badge.is-ok { border-color: #b9e3d0; color: var(--success); background: #effaf4; }
.superadmin-template-command-center .superadmin-board-panel,
.superadmin-template-command-center .superadmin-board-stage {
  border-color: #cfe4f4;
  color: var(--text);
  background: rgba(255, 255, 255, .93);
  box-shadow: 0 8px 24px rgba(71, 132, 178, .08), inset 0 1px 0 rgba(255, 255, 255, .92);
}
.superadmin-template-command-center .superadmin-board-panel::before,
.superadmin-template-command-center .superadmin-board-stage::before { background: linear-gradient(90deg, transparent, #8bc8ef 16%, #d7effc 50%, #8bc8ef 84%, transparent); box-shadow: none; }
.superadmin-template-command-center .superadmin-board-panel > header,
.superadmin-template-command-center .superadmin-board-stage > header {
  border-top-color: #edf7fd;
  border-bottom-color: #dbeaf5;
  background: linear-gradient(90deg, #f1f9ff, rgba(249, 253, 255, .7) 65%, transparent);
}
.superadmin-template-command-center .superadmin-board-panel > header p,
.superadmin-template-command-center .superadmin-board-stage > header p { color: #5d99c1; }
.superadmin-template-command-center .superadmin-board-panel h2,
.superadmin-template-command-center .superadmin-board-stage h2 { color: #254a6c; text-shadow: none; }
.superadmin-template-command-center .superadmin-board-panel > header::after,
.superadmin-template-command-center .superadmin-board-stage > header::after { background: linear-gradient(90deg, transparent, #9bcdea); }
.superadmin-template-command-center .superadmin-board-alerts { border-color: #efd3a2; }
.superadmin-template-command-center .superadmin-board-alerts::before { background: linear-gradient(90deg, transparent, #e2b35f 18%, #f6d791 50%, #e2b35f 82%, transparent); box-shadow: none; }
.superadmin-template-command-center .superadmin-board-alerts > header { background: linear-gradient(90deg, #fff8eb, rgba(255, 252, 245, .7) 65%, transparent); }
.superadmin-template-command-center .superadmin-board-alerts > header p { color: #bd8a30; }
.superadmin-template-command-center .superadmin-board-alerts > header::after { background: linear-gradient(90deg, transparent, #e4bb70); }
.superadmin-template-command-center .superadmin-board-alerts > header > span { border-color: #edd391; border-radius: 7px; color: #a4731c; background: #fff9ea; }
.superadmin-template-command-center .superadmin-issue-list article,
.superadmin-template-command-center .superadmin-board-duty dl div,
.superadmin-template-command-center .superadmin-board-monitoring dl div,
.superadmin-template-command-center .superadmin-management-list article { border-color: #e7f0f6; }
.superadmin-template-command-center .superadmin-issue-list article span { color: #b67d21; }
.superadmin-template-command-center .superadmin-issue-list article.is-danger span { color: var(--danger); }
.superadmin-template-command-center .superadmin-issue-list article strong,
.superadmin-template-command-center .superadmin-management-list strong { color: #355675; }
.superadmin-template-command-center .superadmin-issue-list article small,
.superadmin-template-command-center .superadmin-issue-list article time,
.superadmin-template-command-center .superadmin-board-stat-grid span,
.superadmin-template-command-center .superadmin-board-stat-grid small,
.superadmin-template-command-center .superadmin-management-list span,
.superadmin-template-command-center .superadmin-management-list small,
.superadmin-template-command-center .superadmin-board-duty dt,
.superadmin-template-command-center .superadmin-board-monitoring dt { color: var(--muted); }
.superadmin-template-command-center .superadmin-board-stat-grid article { border-color: #a8d8f0; }
.superadmin-template-command-center .superadmin-board-stat-grid article:nth-child(3),
.superadmin-template-command-center .superadmin-board-stat-grid article:nth-child(4) { border-color: #efd59b; }
.superadmin-template-command-center .superadmin-board-stat-grid strong,
.superadmin-template-command-center .superadmin-management-list strong,
.superadmin-template-command-center .superadmin-board-duty dd,
.superadmin-template-command-center .superadmin-board-monitoring dd,
.superadmin-template-command-center .superadmin-device-ratio strong { color: #2d6086; text-shadow: none; }
.superadmin-template-command-center .superadmin-board-stat-grid strong.is-warning,
.superadmin-template-command-center dd.is-warning { color: var(--warning); text-shadow: none; }
.superadmin-template-command-center .superadmin-board-stage { background: rgba(255, 255, 255, .94); }
.superadmin-template-command-center .superadmin-stage-core,
.superadmin-template-command-center .superadmin-stage-core.is-risk {
  border-color: #d4e8f5;
  background: linear-gradient(rgba(248, 252, 255, .12), rgba(248, 252, 255, .12)), url("./assets/superadmin-institution-topology.png") center / cover no-repeat;
}
.superadmin-template-command-center .superadmin-stage-core::before { border-color: rgba(86, 174, 230, .22); box-shadow: none; }
.superadmin-template-command-center .superadmin-stage-status,
.superadmin-template-command-center .superadmin-stage-core.is-risk .superadmin-stage-status { border-color: #e7bc8e; border-radius: 8px; color: #a86d2a; background: rgba(255, 252, 246, .83); box-shadow: none; }
.superadmin-template-command-center .superadmin-stage-status strong { color: #b9792b; text-shadow: none; }
.superadmin-template-command-center .superadmin-stage-spokes article { border-left-color: #9ccfe8; background: rgba(255, 255, 255, .82); box-shadow: none; }
.superadmin-template-command-center .superadmin-stage-spokes span { color: var(--muted); }
.superadmin-template-command-center .superadmin-stage-spokes strong { color: #315e82; text-shadow: none; }
.superadmin-template-command-center .superadmin-trend { border-color: #dcecf6; }
.superadmin-template-command-center .superadmin-trend h3 { color: #416983; }
.superadmin-template-command-center .superadmin-trend header div { color: var(--muted); }
.superadmin-template-command-center .superadmin-trend-grid { stroke: #dcecf6; }
.superadmin-template-command-center .superadmin-trend-alarm { stroke: var(--danger); filter: none; }
.superadmin-template-command-center .superadmin-trend-workorder { stroke: var(--accent); filter: none; }
.superadmin-template-command-center .superadmin-trend-axis { fill: #8298aa; }
.superadmin-template-command-center .superadmin-stage-footer { border-color: #dbeaf5; color: var(--muted); }
.superadmin-template-command-center .superadmin-board-monitoring .superadmin-device-ratio span { color: var(--muted); }
.superadmin-dashboard-dock {
  border-color: #c7e4f5; border-bottom: 0;
  background: rgba(251, 254, 255, .97);
  box-shadow: 0 -8px 22px rgba(65, 122, 167, .12), inset 0 1px 0 #fff;
}
.superadmin-dashboard-dock button { color: #6b8ca5; }
.superadmin-dashboard-dock button:hover { color: var(--accent-deep); text-shadow: none; }
.superadmin-dashboard-dock button.is-home {
  border-color: #f4fbff; color: #fff;
  background: linear-gradient(135deg, #4f9fd3, #7ac6ed);
  box-shadow: 0 8px 18px rgba(58, 143, 199, .28);
}
@media (max-width: 760px) {
  .superadmin-dashboard-shell { background: linear-gradient(180deg, #f8fbff 0%, var(--bg) 100%); }
  .superadmin-dashboard-dock { border-color: #c7e4f5; background: rgba(251, 254, 255, .97); }
}

/* Glass refinement for the light institution operations cockpit. */
.superadmin-dashboard-shell {
  background:
    radial-gradient(circle at 14% 14%, rgba(150, 211, 244, .38), transparent 27%),
    radial-gradient(circle at 84% 74%, rgba(183, 220, 245, .46), transparent 29%),
    linear-gradient(180deg, #f9fcff 0%, #edf5fd 58%, #e6f1fb 100%);
}
.superadmin-dashboard-topbar {
  background: rgba(250, 253, 255, .74);
  box-shadow: 0 6px 22px rgba(72, 135, 181, .1), inset 0 1px 0 rgba(255, 255, 255, .94);
  backdrop-filter: blur(20px) saturate(132%);
}
.superadmin-template-command-center .superadmin-board-panel,
.superadmin-template-command-center .superadmin-board-stage {
  background: rgba(255, 255, 255, .68);
  box-shadow: 0 10px 28px rgba(71, 132, 178, .1), inset 0 1px 0 rgba(255, 255, 255, .9);
  backdrop-filter: blur(17px) saturate(125%);
}
.superadmin-template-command-center .superadmin-board-panel > header,
.superadmin-template-command-center .superadmin-board-stage > header {
  background: linear-gradient(90deg, rgba(238, 248, 255, .77), rgba(255, 255, 255, .43) 65%, rgba(255, 255, 255, .15));
  backdrop-filter: blur(12px);
}
.superadmin-template-command-center .superadmin-stage-core,
.superadmin-template-command-center .superadmin-stage-core.is-risk {
  background: linear-gradient(rgba(247, 252, 255, .22), rgba(247, 252, 255, .22)), url("./assets/superadmin-institution-topology.png") center / cover no-repeat;
  box-shadow: inset 0 0 34px rgba(80, 143, 186, .14);
}
.superadmin-template-command-center .superadmin-stage-spokes article {
  background: rgba(255, 255, 255, .54);
  backdrop-filter: blur(10px);
}
.superadmin-template-command-center .superadmin-stage-status,
.superadmin-template-command-center .superadmin-stage-core.is-risk .superadmin-stage-status {
  background: rgba(255, 252, 246, .76);
  backdrop-filter: blur(12px);
}
.superadmin-template-command-center .superadmin-stage-core.is-risk .superadmin-stage-status {
  border-color: rgba(217, 106, 120, .78);
  color: #b54e5b;
  background: rgba(255, 239, 243, .62);
  box-shadow: 0 0 0 1px rgba(217, 106, 120, .16), 0 8px 22px rgba(202, 78, 94, .16);
  animation: superadmin-priority-pulse 2.5s ease-in-out infinite;
}
.superadmin-template-command-center .superadmin-stage-core.is-risk .superadmin-stage-status strong { color: var(--danger); }
.superadmin-dashboard-dock {
  background: rgba(251, 254, 255, .76);
  box-shadow: 0 -8px 22px rgba(65, 122, 167, .1), inset 0 1px 0 rgba(255, 255, 255, .92);
  backdrop-filter: blur(18px) saturate(128%);
}
@keyframes superadmin-priority-pulse {
  0%, 100% { border-color: rgba(217, 106, 120, .68); box-shadow: 0 0 0 1px rgba(217, 106, 120, .13), 0 7px 18px rgba(202, 78, 94, .12); }
  50% { border-color: rgba(213, 75, 94, .98); box-shadow: 0 0 0 6px rgba(217, 106, 120, .1), 0 10px 26px rgba(202, 78, 94, .23); }
}
@media (prefers-reduced-motion: reduce) {
  .superadmin-template-command-center .superadmin-stage-core.is-risk .superadmin-stage-status { animation: none; }
}

/* Care operations: use all of the enlarged panel, keep two full records visible,
   and glide one record at a time. The two cloned rows make the loop seamless. */
@media (min-width: 1181px) {
  .superadmin-template-command-center .superadmin-board-right {
    grid-template-rows: minmax(258px, 1.5fr) minmax(198px, 1.15fr) minmax(126px, .62fr);
  }
  .superadmin-template-command-center .superadmin-board-management {
    display: flex;
    flex-direction: column;
    padding-bottom: 8px;
  }
  .superadmin-template-command-center .superadmin-board-management .superadmin-care-operations-viewport {
    flex: 1 1 auto;
    height: auto;
    min-height: 192px;
    margin: 6px 18px 8px;
    overflow: hidden;
  }
  .superadmin-template-command-center .superadmin-board-management .superadmin-care-operations-list {
    display: grid;
    gap: 0;
    padding: 0 18px;
    animation: superadmin-care-operations-two-row-flow 10s cubic-bezier(.42, 0, .2, 1) infinite;
    will-change: transform;
  }
  .superadmin-template-command-center .superadmin-board-management .superadmin-care-operations-list article {
    height: 96px;
    min-height: 96px;
    box-sizing: border-box;
    padding: 12px 24px 12px 0;
  }
  .superadmin-template-command-center .superadmin-board-problems .superadmin-issue-list { margin: 0 18px; }
  .superadmin-template-command-center .superadmin-board-problems .superadmin-issue-list article { min-height: 45px; padding: 8px 0; }
  .superadmin-template-command-center .superadmin-board-problems .superadmin-issue-list article small { display: none; }
  .superadmin-template-command-center .superadmin-board-monitoring { padding-bottom: 10px; }
  .superadmin-template-command-center .superadmin-board-monitoring .superadmin-device-ratio { margin-top: 6px; }
  .superadmin-template-command-center .superadmin-board-monitoring .superadmin-device-ratio strong { font-size: 32px; }
  .superadmin-template-command-center .superadmin-board-monitoring dl { margin: 4px 18px 0; padding: 0; }
  .superadmin-template-command-center .superadmin-board-monitoring dl div { padding: 5px 0 0; }
}
@keyframes superadmin-care-operations-two-row-flow {
  0%, 16% { transform: translateY(0); }
  24%, 41% { transform: translateY(-96px); }
  49%, 66% { transform: translateY(-192px); }
  74%, 100% { transform: translateY(-288px); }
}
@media (prefers-reduced-motion: reduce) {
  .superadmin-template-command-center .superadmin-board-management .superadmin-care-operations-list { animation: none; }
}

/* The home portal is a light work page, not the dark command-screen canvas.
   Removing the inherited bottom padding also removes the empty dark footer band. */
.superadmin-dashboard-shell.is-home-portal {
  padding-bottom: 0;
  color: #264d75;
  background: #f2f8ff;
}
.superadmin-dashboard-shell.is-home-portal::before { display: none; }

/* Home portal: keep the welcome and quick-handling area in place while the
   lower work feed owns the only scrollable region on desktop. */
@media (min-width: 1181px) {
  .superadmin-dashboard-shell.is-home-portal {
    height: 100vh;
    min-height: 0;
    overflow: hidden;
  }
  .superadmin-dashboard-shell.is-home-portal .superadmin-dashboard-main {
    height: calc(100vh - 76px);
    overflow: hidden;
  }
  .superadmin-dashboard-shell.is-home-portal .home-portal {
    display: grid;
    grid-template-rows: auto auto minmax(0, 1fr);
    gap: 14px;
    height: 100%;
    min-height: 0;
    padding-bottom: 14px;
    box-sizing: border-box;
    overflow: hidden;
  }
  .superadmin-dashboard-shell.is-home-portal .home-portal-section {
    margin-top: 0;
  }
  .superadmin-dashboard-shell.is-home-portal .home-portal-activity {
    min-height: 0;
    margin-top: 0;
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-color: #b6d7ec transparent;
    scrollbar-width: thin;
  }
  .superadmin-dashboard-shell.is-home-portal .home-portal-activity::-webkit-scrollbar { width: 7px; }
  .superadmin-dashboard-shell.is-home-portal .home-portal-activity::-webkit-scrollbar-thumb { border-radius: 999px; background: #b6d7ec; }
}

@media (min-width: 1181px) and (max-height: 900px) {
  .superadmin-dashboard-shell.is-home-portal .home-portal {
    gap: 10px;
    padding-top: 10px;
    padding-bottom: 10px;
  }
  .superadmin-dashboard-shell.is-home-portal .home-portal-hero {
    min-height: 192px;
    height: 192px;
  }
  .superadmin-dashboard-shell.is-home-portal .home-portal-hero-copy { padding: 21px clamp(30px, 4vw, 52px); }
  .superadmin-dashboard-shell.is-home-portal .home-portal-hero-copy h1 { font-size: clamp(25px, 2.2vw, 34px); }
  .superadmin-dashboard-shell.is-home-portal .home-portal-hero-copy > span { margin-top: 9px; font-size: 13px; line-height: 1.5; }
  .superadmin-dashboard-shell.is-home-portal .home-portal-hero-action { margin-top: 12px; padding: 8px 12px; }
  .superadmin-dashboard-shell.is-home-portal .home-portal-section-head { margin-bottom: 7px; }
  .superadmin-dashboard-shell.is-home-portal .home-portal-workbench { min-height: 218px; height: 218px; }
  .superadmin-dashboard-shell.is-home-portal .home-portal-primary-actions { padding-top: 6px; padding-bottom: 6px; }
  .superadmin-dashboard-shell.is-home-portal .home-portal-primary-action { min-height: 0; padding-top: 5px; padding-bottom: 5px; }
  .superadmin-dashboard-shell.is-home-portal .home-portal-primary-icon { width: 60px; height: 60px; }
  .superadmin-dashboard-shell.is-home-portal .home-portal-primary-icon .dashboard-reference-svg { width: 30px; height: 30px; }
  .superadmin-dashboard-shell.is-home-portal .home-portal-action-copy strong { font-size: 16px; }
  .superadmin-dashboard-shell.is-home-portal .home-portal-action-copy small { margin-top: 3px; font-size: 11px; line-height: 1.35; }
  .superadmin-dashboard-shell.is-home-portal .home-portal-primary-cta { margin-top: 5px; padding: 5px 10px; }
  .superadmin-dashboard-shell.is-home-portal .home-portal-supporting-actions { padding-top: 5px; padding-bottom: 5px; }
  .superadmin-dashboard-shell.is-home-portal .home-portal-supporting-action { min-height: 0; padding-top: 4px; padding-bottom: 4px; }
  .superadmin-dashboard-shell.is-home-portal .home-portal-supporting-icon { width: 42px; height: 42px; }
  .superadmin-dashboard-shell.is-home-portal .home-portal-supporting-icon .dashboard-reference-svg { width: 22px; height: 22px; }
  .superadmin-dashboard-shell.is-home-portal .home-portal-supporting-action .home-portal-action-copy strong { font-size: 14px; }
  .superadmin-dashboard-shell.is-home-portal .home-portal-supporting-action .home-portal-action-copy small { font-size: 10px; }
}

/* Reference dashboard: this isolated screen deliberately follows the supplied
   command-centre composition.  Real project data is intentionally wired in a
   later phase; these values are the reference's static display state. */
.superadmin-dashboard-shell:has(.reference-command-center) {
  min-height: 100vh;
  padding: 0;
  color: #d9f7ff;
  background: #02131c;
  overflow-x: hidden;
  overflow-y: auto;
}
.superadmin-dashboard-shell:has(.reference-command-center)::before { display: none; }
.reference-dashboard-topbar {
  display: grid;
  grid-template-columns: 330px minmax(600px, 1fr) 340px;
  align-items: center;
  height: calc(76px * var(--reference-dashboard-scale, 1));
  min-width: 1180px;
  border-top: 2px solid #0c9bad;
  border-bottom: 1px solid #13697a;
  background: #02131c;
  box-shadow: inset 0 -1px 0 rgba(0, 214, 240, .18);
}
.reference-dashboard-brand {
  padding-left: 28px;
  color: #28dcec;
  font-size: calc(25px * var(--reference-dashboard-scale, 1));
  font-weight: 800;
  letter-spacing: .08em;
  text-shadow: 0 0 12px rgba(36, 222, 238, .45);
}
.reference-dashboard-nav { display: flex; justify-content: center; align-self: center; height: 58px; gap: 5px; }
.reference-dashboard-nav button {
  position: relative;
  min-width: calc(100px * var(--reference-dashboard-scale, 1));
  padding: 0 calc(15px * var(--reference-dashboard-scale, 1));
  border: 0;
  color: #e1f8fd;
  font: inherit;
  font-size: calc(14px * var(--reference-dashboard-scale, 1));
  font-weight: 700;
  background: transparent;
  cursor: pointer;
}
.reference-dashboard-nav button:hover, .reference-dashboard-nav button.active { color: #eaffff; background: #063b4d; }
.reference-dashboard-nav button.active { clip-path: polygon(14px 0, 100% 0, calc(100% - 14px) 100%, 0 100%); }
.reference-dashboard-nav button.active::before {
  position: absolute; right: 12px; bottom: 9px; left: 12px; height: 3px; content: "";
  background: #28e0f0; box-shadow: 0 0 9px #28e0f0;
}
.reference-dashboard-status { display: flex; align-items: center; justify-content: flex-end; gap: calc(11px * var(--reference-dashboard-scale, 1)); padding-right: calc(28px * var(--reference-dashboard-scale, 1)); color: #b8d9e3; font-size: calc(12px * var(--reference-dashboard-scale, 1)); white-space: nowrap; }
.reference-dashboard-status i { height: calc(18px * var(--reference-dashboard-scale, 1)); border-left: 1px solid #2a7180; }
.reference-dashboard-status strong { color: #2ee4f3; font-size: calc(18px * var(--reference-dashboard-scale, 1)); letter-spacing: .04em; }
.superadmin-dashboard-main:has(.reference-command-center) { min-width: 0; height: var(--reference-dashboard-content-height, auto); overflow: visible; }
.reference-command-center { width: 1487px; height: 908px; padding: 0; box-sizing: border-box; transform: scale(var(--reference-dashboard-scale, 1)); transform-origin: top left; background: #02131c; }
.reference-command-grid {
  display: grid;
  grid-template-columns: 352px minmax(600px, 1fr) 398px;
  grid-template-rows: 242px 250px 281px 135px;
  gap: 0;
  width: 100%;
  margin: 0 auto;
}
.reference-command-left { display: grid; grid-row: 1 / 4; grid-template-rows: 242px 250px 281px; gap: 0; }
.reference-command-center-column { display: grid; grid-row: 1 / 4; grid-template-rows: 76px 450px 247px; gap: 0; min-width: 0; }
.reference-command-right { display: grid; grid-row: 1 / 4; grid-template-rows: 286px 487px; gap: 0; }
.reference-panel { position: relative; overflow: hidden; border: 1px solid rgba(22, 180, 197, .86); background: #031d28; box-shadow: inset 0 0 28px rgba(0, 150, 177, .1); }
.reference-panel::before, .reference-panel::after { position: absolute; z-index: 2; width: 13px; height: 13px; content: ""; border-color: #3bf1ff; pointer-events: none; }
.reference-panel::before { top: -1px; left: -1px; border-top: 2px solid; border-left: 2px solid; box-shadow: 0 0 7px rgba(33, 228, 242, .35); }
.reference-panel::after { right: -1px; bottom: -1px; border-right: 2px solid; border-bottom: 2px solid; box-shadow: 0 0 7px rgba(33, 228, 242, .35); }
.reference-panel > header { display: flex; align-items: center; justify-content: space-between; min-height: 50px; padding: 0 17px; border-bottom: 1px solid rgba(30, 185, 205, .2); }
.reference-panel h2 { margin: 0; color: #e2f9ff; font-size: 17px; letter-spacing: .03em; }
.reference-panel > header > span { color: #8fc0ce; font-size: 12px; }
.reference-overview-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px 18px; padding: 14px 20px; }
.reference-overview-grid article { display: grid; grid-template-columns: 48px 1fr; gap: 8px; align-items: center; min-width: 0; }
.reference-overview-grid article > div { display: grid; gap: 3px; }
.reference-overview-grid span { color: #b6d5df; font-size: 12px; }
.reference-overview-grid strong { color: #30dcf0; font-size: 25px; line-height: 1; }
.reference-overview-grid strong em, .reference-command-kpis strong em { margin-left: 3px; color: #9bd5e2; font-size: 12px; font-style: normal; }
.reference-overview-grid .is-danger strong { color: #ff5b67; }
.reference-icon { display: block; width: 46px; height: 46px; padding: 11px; box-sizing: border-box; border: 1px solid rgba(19, 190, 215, .25); border-radius: 50%; color: #1dc6db; background: rgba(8, 95, 113, .3); filter: drop-shadow(0 0 5px rgba(14, 199, 217, .32)); }.reference-icon-order { border-radius: 9px; }.reference-overview-grid .is-danger .reference-icon { color: #ff6470; border-color: rgba(255, 94, 107, .27); background: rgba(112, 27, 43, .34); }
.reference-donut-wrap { display: grid; grid-template-columns: 150px 1fr; align-items: center; gap: 16px; padding: 14px 20px; }
.reference-donut { display: grid; width: 128px; height: 128px; place-items: center; border-radius: 50%; background: conic-gradient(#226bd7 0 25%, #0dd3df 25% 63%, #ffb71c 63% 75%, #e74d58 75% 91%, #279fd2 91% 100%); }
.reference-donut > div { display: grid; width: 82px; height: 82px; place-content: center; border-radius: 50%; text-align: center; background: #031d28; }
.reference-donut strong { color: #e5fbff; font-size: 19px; }.reference-donut span { color: #c2e1e9; font-size: 11px; }
.reference-donut-wrap ul { display: grid; gap: 9px; margin: 0; padding: 0; list-style: none; }.reference-donut-wrap li { display: grid; grid-template-columns: 8px minmax(48px, 1fr) 24px 33px; align-items: center; column-gap: 6px; color: #c7e0e7; font-size: 12px; }.reference-donut-wrap li span { min-width: 0; white-space: nowrap; }.reference-donut-wrap li b { margin: 0; color: #d7f3f8; font-variant-numeric: tabular-nums; font-weight: 400; text-align: right; white-space: nowrap; }.reference-donut-wrap li em { display: block; color: #9cbfcc; font-variant-numeric: tabular-nums; font-style: normal; text-align: right; white-space: nowrap; }.service-dot { width: 8px; height: 8px; border-radius: 50%; }.dot-0 { background: #14d4df; }.dot-1 { background: #157ac8; }.dot-2 { background: #1ccbd8; }.dot-3 { background: #e1d38a; }.dot-4 { background: #279fd2; }
.reference-data-pending { display: grid; min-height: 72px; padding: 14px; place-items: center; box-sizing: border-box; color: #6e89a6; font-size: 12px; text-align: center; }.reference-service-panel > .reference-data-pending, .reference-coverage-panel > .reference-data-pending { min-height: 190px; }.reference-map-canvas > .reference-data-pending { position: absolute; inset: 0; min-height: 0; background: rgba(255,255,255,.58); }.reference-service-trend > .reference-data-pending { min-height: 190px; }.reference-health-trend { min-height: 129px; box-sizing: border-box; }.reference-health-trend > .reference-data-pending { min-height: 88px; }.reference-alarm-list > .reference-data-pending { min-height: 180px; }.reference-todo-panel > div > .reference-data-pending { min-height: 84px; }.reference-todo-panel article[data-action] { cursor: pointer; }
.reference-coverage-head { display: grid; grid-template-columns: 74px 1fr 42px; gap: 8px; padding: 8px 20px 7px; color: #91becb; font-size: 11px; }.reference-coverage-head span:last-child { text-align: right; }
.reference-coverage-list { display: grid; gap: 11px; padding: 4px 20px 14px; }.reference-coverage-list article { display: grid; grid-template-columns: 66px 1fr 33px 37px; align-items: center; gap: 8px; color: #d4ebf0; font-size: 12px; }.reference-coverage-list article > div { height: 6px; overflow: hidden; border-radius: 10px; background: #063243; }.reference-coverage-list article > div i { display: block; height: 100%; border-radius: inherit; background: #1e8eeb; }.reference-coverage-list b, .reference-coverage-list em { color: #2acfe4; font-style: normal; }.reference-coverage-list em { text-align: right; }
.reference-command-kpis { display: grid; grid-template-columns: repeat(4, 1fr); align-items: center; border: 1px solid #11b8ce; background: #031d28; }.reference-command-kpis article { display: grid; grid-template-columns: 36px 1fr; align-items: center; gap: 10px; justify-self: center; }.reference-command-kpis article > div { display: grid; gap: 2px; }.reference-command-kpis span { color: #9dc8d3; font-size: 12px; }.reference-command-kpis strong { color: #2bd9ed; font-size: 24px; line-height: 1; }.reference-kpi-icon { display: block; width: 30px; height: 30px; color: #18bdd5; filter: drop-shadow(0 0 5px rgba(12, 203, 223, .25)); }
.reference-map-panel { height: 450px; }.reference-map-canvas { position: absolute; inset: 0; background: url("./assets/command-center-map-layered.png") center / cover no-repeat; }.reference-map-canvas::after { position: absolute; inset: 0; content: ""; background: rgba(0, 16, 25, .045); pointer-events: none; }.reference-map-names span { position: absolute; z-index: 1; color: #edfafd; font-size: 14px; font-weight: 700; text-shadow: 0 0 6px #02141c; }.name-a { top: 48%; left: 23%; }.name-b { top: 22%; left: 44%; }.name-c { top: 37%; right: 18%; }.name-d { bottom: 21%; left: 47%; }

/* Super-admin home portal: a lightweight starting point, separate from the operating cockpit. */
.home-portal { min-height: calc(100vh - 76px); padding: 16px clamp(20px, 3vw, 48px) 28px; background: #f2f8ff; color: #264d75; }
.home-portal-hero { position: relative; min-height: 232px; overflow: hidden; border-radius: 16px; background: #65b1e5 url("./assets/home-care-hero-ultrawide.png") right center / auto 100% no-repeat; box-shadow: 0 14px 32px rgba(48, 126, 185, .16); animation: home-hero-in .55s cubic-bezier(.2, .8, .2, 1) both; }
.home-portal-hero-copy { position: relative; z-index: 1; width: min(56%, 690px); padding: 36px clamp(30px, 4vw, 58px); color: #fff; }
.home-portal-hero-copy p { margin: 0 0 10px; color: rgba(255, 255, 255, .85); font-size: 12px; font-weight: 800; letter-spacing: 1.35px; }
.home-portal-hero-copy h1 { max-width: 620px; margin: 0; font-size: clamp(28px, 2.65vw, 42px); line-height: 1.24; letter-spacing: .02em; }
.home-portal-hero-copy > span { display: block; max-width: 550px; margin-top: 16px; color: rgba(255, 255, 255, .93); font-size: 15px; line-height: 1.75; }
.home-portal-hero-action { position: relative; display: inline-flex; align-items: center; gap: 7px; overflow: hidden; margin-top: 24px; padding: 10px 15px; border: 1px solid rgba(255, 255, 255, .54); border-radius: 8px; color: #fff; background: rgba(255, 255, 255, .12); font: inherit; font-size: 13px; font-weight: 750; cursor: pointer; transition: transform .2s ease, background .2s ease; }
.home-portal-hero-action:hover { transform: translateY(-2px); background: rgba(255, 255, 255, .22); }
.home-portal-hero-action .dashboard-reference-svg { width: 16px; height: 16px; }
.home-portal-section { margin-top: 20px; animation: home-rise .48s .12s ease both; }
.home-portal-section-head, .home-portal-activity article > header { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; }
.home-portal-section-head { margin-bottom: 12px; }
.home-portal-section-head h2, .home-portal-activity h2 { margin: 0; color: #2b527b; font-size: 18px; }
.home-portal-section-head span, .home-portal-activity article > header span { color: #89a1b7; font-size: 12px; }
.home-portal-workbench { position: relative; display: grid; grid-template-columns: minmax(420px, .98fr) minmax(460px, 1fr); min-height: 284px; overflow: hidden; border: 1px solid rgba(211, 230, 244, .92); border-radius: 18px; background: rgba(255, 255, 255, .9); box-shadow: 0 12px 26px rgba(55, 124, 176, .08), inset 0 1px rgba(255, 255, 255, .9); }
.home-portal-workbench::before { position: absolute; z-index: 0; right: 43%; bottom: -44%; width: 58%; height: 96%; content: ""; border-radius: 55% 45% 0 0; background: radial-gradient(ellipse at 56% 55%, rgba(197, 230, 250, .55), rgba(238, 249, 255, .12) 63%, transparent 64%); pointer-events: none; }
.home-portal-primary-actions, .home-portal-supporting-actions { position: relative; z-index: 1; min-width: 0; }
.home-portal-primary-actions { display: grid; grid-template-rows: repeat(2, minmax(0, 1fr)); padding: 14px 36px 14px 22px; }
.home-portal-primary-action, .home-portal-supporting-action { position: relative; overflow: hidden; border: 0; color: #2d5278; background: transparent; font: inherit; text-align: left; cursor: pointer; }
.home-portal-primary-action { display: grid; grid-template-columns: 72px minmax(0, 1fr); grid-template-rows: minmax(0, 1fr) auto; column-gap: 17px; align-items: center; min-height: 124px; padding: 12px 10px 12px 0; animation: home-rise .44s ease both; transition: transform .2s ease, background .2s ease; }
.home-portal-primary-action + .home-portal-primary-action { border-top: 1px solid #e2edf6; }
.home-portal-primary-action:nth-child(1) { animation-delay: .16s; }.home-portal-primary-action:nth-child(2) { animation-delay: .23s; }
.home-portal-primary-action:hover { transform: translateX(3px); }
.home-portal-primary-icon, .home-portal-supporting-icon { display: grid; flex: 0 0 auto; place-items: center; border-radius: 50%; }
.home-portal-primary-icon { grid-row: 1 / 3; width: 72px; height: 72px; color: #247fea; background: radial-gradient(circle at 35% 30%, #f4f9ff, #deebfb); transition: transform .22s cubic-bezier(.2, .85, .25, 1); }
.home-portal-primary-action.is-admission .home-portal-primary-icon { color: #16aaa4; background: radial-gradient(circle at 35% 30%, #f1fffc, #dff5f1); }
.home-portal-primary-icon .dashboard-reference-svg { width: 36px; height: 36px; }
.home-portal-action-copy { display: block; min-width: 0; }
.home-portal-action-copy strong { display: block; color: #294d72; font-size: 18px; line-height: 1.25; }
.home-portal-action-copy small { display: block; margin-top: 7px; color: #7b97af; font-size: 12px; line-height: 1.5; }
.home-portal-primary-cta { display: inline-flex; grid-column: 2; align-items: center; gap: 3px; justify-self: start; margin-top: 10px; padding: 6px 12px; border: 1px solid #a9d4f4; border-radius: 999px; color: #1d86dc; font-size: 12px; font-weight: 750; line-height: 1; transition: color .2s ease, background .2s ease, transform .2s ease; }
.home-portal-primary-cta .dashboard-reference-svg { width: 14px; height: 14px; }
.home-portal-primary-action.is-admission .home-portal-primary-cta { border-color: #9ddfd9; color: #119a95; }
.home-portal-primary-action:hover .home-portal-primary-icon { transform: scale(1.08) rotate(-3deg); }
.home-portal-primary-action:hover .home-portal-primary-cta { color: #fff; background: #248be0; transform: translateX(3px); }
.home-portal-primary-action.is-admission:hover .home-portal-primary-cta { background: #15aaa3; }
.home-portal-supporting-actions { display: grid; align-content: center; padding: 18px 30px 18px 24px; border-left: 1px solid #dfeef8; }
.home-portal-supporting-action { display: grid; grid-template-columns: 52px minmax(0, 1fr) 24px; align-items: center; column-gap: 17px; min-height: 67px; padding: 8px 13px; animation: home-rise .44s ease both; transition: transform .2s ease, background .2s ease; }
.home-portal-supporting-action + .home-portal-supporting-action { border-top: 1px solid #e2edf6; }
.home-portal-supporting-action:nth-child(1) { animation-delay: .22s; }.home-portal-supporting-action:nth-child(2) { animation-delay: .29s; }.home-portal-supporting-action:nth-child(3) { animation-delay: .36s; }.home-portal-supporting-action:nth-child(4) { animation-delay: .43s; }
.home-portal-supporting-action:hover { transform: translateX(3px); background: linear-gradient(90deg, rgba(239, 248, 255, 0), rgba(229, 243, 254, .85), rgba(239, 248, 255, 0)); }
.home-portal-supporting-icon { width: 50px; height: 50px; color: #277ee5; background: #eaf3ff; transition: transform .22s cubic-bezier(.2, .85, .25, 1); }
.home-portal-supporting-action:nth-child(2) .home-portal-supporting-icon { color: #8354df; background: #f0ebff; }.home-portal-supporting-action:nth-child(3) .home-portal-supporting-icon { color: #dd9650; background: #fff3e9; }.home-portal-supporting-action:nth-child(4) .home-portal-supporting-icon { color: #347de3; background: #eaf3ff; }
.home-portal-supporting-icon .dashboard-reference-svg { width: 25px; height: 25px; }
.home-portal-supporting-action:hover .home-portal-supporting-icon { transform: scale(1.08); }
.home-portal-supporting-action .home-portal-action-copy strong { font-size: 15px; }
.home-portal-supporting-action .home-portal-action-copy small { margin-top: 4px; }
.home-portal-action-arrow { width: 19px; height: 19px; color: #315e88; transition: transform .2s ease, color .2s ease; }
.home-portal-supporting-action:hover .home-portal-action-arrow { color: #1889d5; transform: translateX(4px); }
.home-portal-activity { display: grid; grid-template-columns: 1fr 1fr; gap: 28px; margin-top: 20px; padding: 0 4px; animation: home-rise .5s .68s ease both; }
.home-portal-activity article { min-width: 0; }
.home-portal-activity article:first-child { padding-right: 28px; border-right: 1px solid #dceaf6; }
.home-portal-activity article > header { padding-bottom: 11px; border-bottom: 1px solid #dceaf6; }
.home-portal-list button { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) auto 18px; align-items: center; gap: 12px; width: 100%; min-height: 49px; overflow: hidden; padding: 0; border: 0; border-bottom: 1px solid #e5eff8; color: #527596; background: transparent; text-align: left; font: inherit; cursor: pointer; transition: color .18s ease, transform .18s ease; }
.home-portal-list button:hover { transform: translateX(3px); color: #1689ce; }
.home-portal-primary-action:active, .home-portal-supporting-action:active, .home-portal-hero-action:active { transform: translateY(0) scale(.985); }
.home-portal-list button:active { transform: translateX(1px) scale(.99); }
.home-portal-primary-action.is-clicked, .home-portal-supporting-action.is-clicked, .home-portal-hero-action.is-clicked { animation: home-click-press .18s ease-out; }
.home-portal-list button.is-clicked { animation: home-list-click .18s ease-out; }
.home-click-ripple { position: absolute; z-index: 0; top: var(--home-ripple-y); left: var(--home-ripple-x); width: 10px; height: 10px; border-radius: 50%; pointer-events: none; transform: translate(-50%, -50%) scale(0); background: rgba(41, 159, 224, .18); animation: home-click-ripple .42s ease-out forwards; }
.home-portal-hero-action .home-click-ripple { background: rgba(255, 255, 255, .35); }
.home-portal-primary-action > :not(.home-click-ripple), .home-portal-supporting-action > :not(.home-click-ripple), .home-portal-hero-action > :not(.home-click-ripple), .home-portal-list button > :not(.home-click-ripple) { position: relative; z-index: 1; }
.home-portal-list button strong { overflow: hidden; color: inherit; font-size: 13px; font-weight: 650; text-overflow: ellipsis; white-space: nowrap; }
.home-portal-list button small { color: #91a7ba; font-size: 12px; white-space: nowrap; }
.home-portal-list button .dashboard-reference-svg { width: 16px; height: 16px; }
.home-portal-list button i { width: 7px; height: 7px; border-radius: 50%; background: transparent; }
.home-portal-list button i.is-unread { background: #e28b65; box-shadow: 0 0 0 0 rgba(226, 139, 101, .48); animation: home-notice-pulse 2.6s ease infinite; }
.home-portal-empty { padding: 26px 0; color: #93a8ba; font-size: 13px; }
@keyframes home-hero-in { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }
@keyframes home-rise { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }
@keyframes home-notice-pulse { 0%, 72%, 100% { box-shadow: 0 0 0 0 rgba(226, 139, 101, .42); } 80% { box-shadow: 0 0 0 6px rgba(226, 139, 101, 0); } }
@keyframes home-click-ripple { from { opacity: .72; transform: translate(-50%, -50%) scale(0); } to { opacity: 0; transform: translate(-50%, -50%) scale(28); } }
@keyframes home-click-press { 0% { transform: translateY(-3px) scale(1); } 58% { transform: translateY(0) scale(.985); } 100% { transform: translateY(-1px) scale(1); } }
@keyframes home-list-click { 0% { transform: translateX(3px) scale(1); } 58% { transform: translateX(0) scale(.99); } 100% { transform: translateX(2px) scale(1); } }
@media (max-width: 900px) { .home-portal-workbench { grid-template-columns: 1fr; }.home-portal-primary-actions { padding-right: 22px; }.home-portal-supporting-actions { border-top: 1px solid #dfeef8; border-left: 0; }.home-portal-workbench::before { right: 18%; bottom: 28%; width: 80%; } }
@media (max-width: 640px) { .home-portal { padding: 18px 16px 30px; }.home-portal-hero { min-height: 278px; background-position: 63% center; }.home-portal-hero-copy { width: 88%; padding: 31px 25px; }.home-portal-hero-copy h1 { font-size: 28px; }.home-portal-workbench { border-radius: 15px; }.home-portal-primary-actions { padding: 8px 16px; }.home-portal-primary-action { grid-template-columns: 62px minmax(0, 1fr); min-height: 124px; column-gap: 14px; }.home-portal-primary-icon { width: 62px; height: 62px; }.home-portal-primary-icon .dashboard-reference-svg { width: 32px; height: 32px; }.home-portal-supporting-actions { padding: 10px 16px; }.home-portal-supporting-action { grid-template-columns: 43px minmax(0, 1fr) 18px; column-gap: 11px; min-height: 64px; padding-right: 4px; }.home-portal-supporting-icon { width: 42px; height: 42px; }.home-portal-supporting-icon .dashboard-reference-svg { width: 22px; height: 22px; }.home-portal-action-copy strong { font-size: 16px; }.home-portal-supporting-action .home-portal-action-copy strong { font-size: 14px; }.home-portal-action-copy small { font-size: 11px; }.home-portal-activity { grid-template-columns: 1fr; gap: 22px; }.home-portal-activity article:first-child { padding-right: 0; border-right: 0; } }
@media (prefers-reduced-motion: reduce) { .home-portal *, .home-portal *::before, .home-portal *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; } }

.reference-map-pin { position: absolute; z-index: 2; display: grid; width: 23px; height: 23px; padding: 4px; place-items: center; border: 2px solid #0ce4ea; border-radius: 50%; color: #dfffff; background: #076f80; box-shadow: 0 0 11px rgba(24, 229, 239, .78), inset 0 0 8px rgba(24, 229, 239, .3); cursor: pointer; }.reference-map-pin-icon { width: 12px; height: 12px; stroke-width: 2.6; }.reference-map-pin.warning { border-color: #ffc22d; background: #a26a0c; box-shadow: 0 0 11px rgba(255, 184, 36, .76), inset 0 0 8px rgba(255, 184, 36, .3); }.reference-map-pin.danger { border-color: #ff6470; background: #8a2839; box-shadow: 0 0 11px rgba(255, 79, 91, .76), inset 0 0 8px rgba(255, 79, 91, .3); }.pin-a { top: 22%; left: 26%; }.pin-b { top: 30%; left: 36%; }.pin-c { top: 25%; left: 65%; }.pin-d { top: 49%; left: 31%; }.pin-e { top: 63%; left: 47%; }.pin-f { top: 61%; left: 69%; }.pin-g { top: 78%; left: 31%; }.pin-h { top: 42%; left: 57%; }.pin-i { top: 70%; left: 58%; }.pin-j { top: 24%; left: 44%; }
.reference-map-legend { position: absolute; z-index: 3; bottom: 15px; left: 14px; display: grid; gap: 9px; padding: 10px 13px; border: 1px solid #0f3544; background: rgba(2, 21, 31, .83); }.reference-map-legend span { color: #caebef; font-size: 11px; }.reference-map-legend i { display: inline-block; width: 9px; height: 9px; margin-right: 8px; border-radius: 50%; }.reference-map-legend .normal { background: #0ad6d9; }.reference-map-legend .warn { background: #f9bc26; }.reference-map-legend .risk { background: #e9535f; }
.reference-map-tools { position: absolute; z-index: 3; top: 12px; right: 12px; display: grid; overflow: hidden; border: 1px solid #0c5265; background: rgba(2, 22, 32, .84); }.reference-map-tools button, .reference-map-zoom button { min-width: 42px; height: 38px; border: 0; border-bottom: 1px solid #0b4657; color: #cfedf3; font: inherit; font-size: 11px; background: transparent; cursor: pointer; }.reference-map-tools button:last-child { border-bottom: 0; }.reference-map-zoom { position: absolute; z-index: 3; right: 12px; bottom: 15px; display: grid; overflow: hidden; border: 1px solid #0c5265; background: rgba(2, 22, 32, .84); }.reference-map-zoom button { height: 34px; border-bottom: 1px solid #0b4657; color: #d5f9ff; font-size: 26px; line-height: 1; }.reference-map-zoom button:last-child { border-bottom: 0; }
.reference-service-trend { height: 247px; margin-top: 0; }.reference-service-trend > header { min-height: 44px; padding: 0 16px; }.reference-service-trend > header > div { display: flex; gap: 18px; margin-left: 12px; color: #9ac9d3; font-size: 11px; }.reference-service-trend .legend-cyan::before, .reference-service-trend .legend-blue::before { display: inline-block; width: 10px; height: 6px; margin-right: 5px; content: ""; border-radius: 3px; background: #19d3d9; }.reference-service-trend .legend-blue::before { background: #177ee4; }.reference-service-trend nav { display: flex; gap: 6px; margin-left: auto; }.reference-service-trend nav button { padding: 5px 9px; border: 1px solid #1a6074; color: #92c0cb; font: inherit; font-size: 11px; background: transparent; cursor: pointer; }.reference-service-trend nav button.active { border-color: #1bd4e2; color: #d6fdff; background: #063847; }
.reference-chart { display: grid; grid-template-columns: 38px 1fr 32px; height: 192px; padding: 9px 15px 10px; }.reference-y-axis { display: flex; flex-direction: column; justify-content: space-between; padding-bottom: 18px; color: #84b1bd; font-size: 10px; }.reference-y-axis.right { align-items: flex-end; }.reference-chart-plot { position: relative; min-width: 0; }.reference-chart-grid { position: absolute; inset: 0 0 18px; background-image: linear-gradient(rgba(45, 168, 188, .17) 1px, transparent 1px); background-size: 100% 20%; }.reference-bars { position: absolute; right: 15px; bottom: 18px; left: 15px; display: flex; align-items: end; justify-content: space-between; height: calc(100% - 18px); }.reference-bars i { position: relative; width: 23px; min-height: 10px; border: 1px solid rgba(65, 237, 240, .52); border-bottom: 0; background: linear-gradient(180deg, rgba(25, 233, 232, .98), rgba(10, 138, 157, .82)); box-shadow: inset 1px 0 rgba(180, 255, 255, .34), inset -4px 0 rgba(0, 79, 97, .28), 0 0 7px rgba(12, 208, 213, .12); }.reference-bars i b { position: absolute; top: 0; right: 2px; left: 2px; height: 1px; background: rgba(205, 255, 255, .78); }.reference-chart svg { position: absolute; top: 0; right: 15px; bottom: 18px; left: 15px; width: calc(100% - 30px); height: calc(100% - 18px); overflow: visible; }.reference-chart polyline { fill: none; stroke: #1a83ed; stroke-width: 1.65; filter: drop-shadow(0 0 2px rgba(24, 128, 234, .45)); }.reference-service-points circle { fill: #1a83ed; stroke: #77c5ff; stroke-width: .8; }.reference-x-axis { position: absolute; right: 7px; bottom: 0; left: 7px; display: flex; justify-content: space-between; color: #88b4c0; font-size: 10px; }
.reference-health-panel { height: 487px; }.reference-health-panel h2 { display: inline-flex; gap: 9px; align-items: baseline; }.reference-health-panel h2 small { color: #a7d0d8; font-size: 11px; letter-spacing: .06em; }.reference-health-score { display: flex; justify-content: space-between; align-items: end; padding: 15px 18px 9px; }.reference-health-score div { display: grid; gap: 8px; }.reference-health-score span { color: #b1d4dc; font-size: 12px; }.reference-health-score strong { color: #2ce5f2; font-size: 36px; line-height: 1; }.reference-health-score strong em { font-size: 19px; font-style: normal; }.reference-health-score p { margin: 0; color: #9abfc8; font-size: 11px; line-height: 1.6; text-align: right; }.reference-health-score p b { color: #2ce5e8; font-size: 16px; }.reference-health-progress { position: relative; height: 26px; margin: 0 18px; border-bottom: 1px solid #136173; }.reference-health-progress::before { position: absolute; top: 0; right: 0; left: 0; height: 13px; content: ""; border-radius: 2px; background: #083e4c; }.reference-health-progress i { position: absolute; z-index: 1; top: 0; left: 0; width: 98.6%; height: 13px; border-radius: 2px; background: #16cad3; }.reference-health-progress span, .reference-health-progress b { position: absolute; top: 16px; color: #94c1cb; font-size: 10px; font-weight: 400; }.reference-health-progress span { left: 0; }.reference-health-progress b { right: 0; }
.reference-health-trend { padding: 11px 18px 5px; }.reference-health-trend header { display: flex; justify-content: space-between; color: #a8ccd4; font-size: 10px; }.reference-health-trend h3 { margin: 0; color: #cce7ec; font-size: 13px; }.reference-health-trend svg { width: 100%; height: 90px; }.reference-health-grid { stroke: rgba(42, 159, 178, .32); stroke-width: .65; }.reference-health-trend path { fill: rgba(20, 196, 209, .08); }.reference-health-trend polyline { fill: none; stroke: #27d6e5; stroke-width: 2; }.reference-health-points circle { fill: #26d7e6; stroke: #a0fbff; stroke-width: 1; }.reference-health-trend > div { display: flex; justify-content: space-between; color: #85b0bc; font-size: 9px; }.reference-health-list { display: grid; gap: 9px; padding: 19px 18px 12px; }.reference-health-list button { display: grid; grid-template-columns: 12px 112px minmax(0, 1fr) 18px; align-items: center; column-gap: 10px; min-height: 42px; padding: 0 11px; border: 1px solid #115467; color: #ceeef3; font: inherit; line-height: 1; text-align: left; background: #06303e; cursor: pointer; }.reference-health-list button i { width: 9px; height: 9px; border-radius: 50%; }.reference-health-list .online { background: #15d5db; }.reference-health-list .low { background: #ffba1c; }.reference-health-list .offline { background: #f25361; }.reference-health-list button span { align-self: center; white-space: nowrap; }.reference-health-list button strong { align-self: center; color: #43dff0; font-size: 23px; line-height: 1; text-align: left; }.reference-health-list button b { align-self: center; color: #8fd9e4; font-size: 22px; font-weight: 400; line-height: 1; text-align: right; }.reference-health-list button.danger { grid-template-columns: 12px 112px 47px minmax(0, 1fr) 18px; border-color: rgba(235, 82, 96, .36); background: rgba(73, 22, 33, .7); }.reference-health-list button.danger strong { color: #ff6170; }.reference-health-list em { justify-self: start; align-self: center; margin-left: 30px; padding: 4px 6px; border: 1px solid #eb5966; color: #ff6c78; font-size: 11px; font-style: normal; line-height: 1; text-align: center; white-space: nowrap; }
.reference-alarm-panel { height: 286px; }.reference-alarm-panel > header { min-height: 45px; }.reference-alarm-panel header button { border: 0; color: #8ec4cf; font: inherit; font-size: 11px; background: transparent; cursor: pointer; }.reference-alarm-list { display: grid; padding: 4px 17px; }.reference-alarm-list article { display: grid; grid-template-columns: 28px 1fr 38px; align-items: center; gap: 10px; min-height: 46px; border-bottom: 1px solid rgba(25, 130, 149, .18); }.reference-alarm-list article:last-child { border-bottom: 0; }.alarm-type { width: 25px; height: 25px; padding: 5px; box-sizing: border-box; border-radius: 50%; color: #ff6973; background: #4e2231; }.alarm-type.fall, .alarm-type.battery { color: #ffc733; background: #4a3913; }.alarm-type.activity, .alarm-type.offline { color: #11b9f3; background: #06385b; }.reference-alarm-list article > div { display: grid; gap: 3px; min-width: 0; }.reference-alarm-list strong { color: #d5edf1; font-size: 12px; }.reference-alarm-list strong em { display: inline-block; margin-left: 5px; padding: 1px 4px; color: #ff6570; font-size: 10px; font-style: normal; background: #55202c; }.reference-alarm-list .fall em, .reference-alarm-list .battery em { color: #ffd35d; background: #4d3b13; }.reference-alarm-list .activity em, .reference-alarm-list .offline em { color: #2ed6ef; background: #074361; }.reference-alarm-list span { overflow: hidden; color: #91bdc7; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }.reference-alarm-list time { color: #9dc5ce; font-size: 11px; text-align: right; }
.reference-workorder-panel { grid-column: 1 / -1; grid-row: 4; justify-self: start; width: 50%; height: 135px; }.reference-workorder-panel > header, .reference-todo-panel > header { min-height: 40px; }.reference-workorder-panel > div { display: grid; grid-template-columns: repeat(3, 1fr); padding: 12px 32px; }.reference-workorder-panel article { display: grid; grid-template-columns: 44px 1fr; grid-template-rows: 20px 30px; align-items: center; column-gap: 15px; }.reference-workorder-panel article span { color: #a5cbd4; font-size: 12px; }.reference-workorder-panel article strong { color: #39dcee; font-size: 27px; }.workorder-icon { grid-row: 1 / 3; width: 33px; height: 33px; padding: 2px; box-sizing: border-box; color: #13d4e7; }.reference-workorder-panel article:nth-child(2) .workorder-icon { stroke-dasharray: 3 2; }.reference-todo-panel { grid-column: 1 / -1; grid-row: 4; justify-self: end; width: 50%; height: 135px; }.reference-todo-panel > div { padding: 1px 18px; }.reference-todo-panel article { display: grid; grid-template-columns: 1fr 90px 100px; padding: 5px 0; border-bottom: 1px solid rgba(20, 111, 129, .28); color: #c6e8ee; font-size: 12px; }.reference-todo-panel article:last-child { border-bottom: 0; }.reference-todo-panel article span::before { margin-right: 10px; color: #17cbd7; content: "•"; }.reference-todo-panel strong { color: #ff5e68; }.reference-todo-panel strong.yellow { color: #ffc424; }.reference-todo-panel time { color: #9ac3cd; text-align: right; }
@media (max-width: 1180px) { .reference-dashboard-topbar { grid-template-columns: 260px minmax(600px,1fr) 240px; }.reference-dashboard-brand { padding-left: 16px; font-size: 20px; }.reference-dashboard-status { padding-right: 16px; font-size: 10px; }.reference-command-grid { grid-template-columns: 300px minmax(560px,1fr) 330px; }.reference-command-kpis strong { font-size: 20px; }.reference-dashboard-nav button { min-width: auto; padding: 0 10px; } }
@media (max-width: 760px) and (pointer: coarse) { .superadmin-dashboard-shell:has(.reference-command-center) { overflow-x: hidden; }.reference-dashboard-topbar, .superadmin-dashboard-main:has(.reference-command-center) { min-width: 0; }.reference-dashboard-topbar { display: block; height: auto; padding: 12px; }.reference-dashboard-brand { padding: 0; }.reference-dashboard-nav { justify-content: flex-start; margin-top: 10px; overflow-x: auto; }.reference-dashboard-nav button { flex: 0 0 auto; min-height: 38px; }.reference-dashboard-status { display: none; }.reference-command-center { padding: 12px; }.reference-command-grid, .reference-command-left, .reference-command-center-column, .reference-command-right { display: grid; grid-template-columns: minmax(0,1fr); grid-template-rows: auto; }.reference-command-grid { gap: 12px; }.reference-command-left, .reference-command-center-column, .reference-command-right { grid-row: auto; gap: 12px; }.reference-command-kpis { grid-template-columns: repeat(2,1fr); gap: 12px; padding: 12px; }.reference-map-panel { height: 360px; }.reference-service-trend { height: 215px; }.reference-command-right { grid-row: auto; }.reference-health-panel, .reference-alarm-panel { height: auto; }.reference-workorder-panel, .reference-todo-panel { grid-column: auto; height: auto; }.reference-workorder-panel > div { padding: 14px; }.reference-todo-panel article { grid-template-columns: 1fr 65px 80px; } }

/* Command centre colour bridge: reuse the platform's blue-white tokens so this
   high-density view belongs to the same product while preserving its map-led layout. */
.superadmin-dashboard-shell:has(.reference-command-center) { color: var(--text); background: var(--bg); }
.reference-dashboard-topbar { border-top-color: var(--accent); border-bottom-color: var(--line); background: #ffffff; box-shadow: 0 1px 10px rgba(47, 127, 184, .07); }
.reference-dashboard-brand { color: var(--accent-deep); text-shadow: none; }
.reference-dashboard-nav button { color: #55728d; }
.reference-dashboard-nav button:hover, .reference-dashboard-nav button.active { color: var(--accent-deep); background: #eaf5fd; }
.reference-dashboard-nav button.active { clip-path: polygon(14px 0, 100% 0, calc(100% - 14px) 100%, 0 100%); }
.reference-dashboard-nav button.active::before { background: var(--accent); box-shadow: none; }
.reference-dashboard-status { color: var(--muted); }.reference-dashboard-status i { border-left-color: var(--line); }.reference-dashboard-status strong { color: var(--accent-deep); }
.superadmin-dashboard-main:has(.reference-command-center) { background: var(--bg); }
.reference-command-center { background: var(--bg); color: var(--text); }
.reference-panel, .reference-command-kpis { border-color: var(--line); background: #ffffff; box-shadow: 0 5px 16px rgba(47, 127, 184, .055); }
.reference-panel::before, .reference-panel::after { border-color: var(--accent); box-shadow: none; }
.reference-panel > header { border-bottom: 0; }.reference-panel h2 { color: #234b6d; }.reference-panel > header > span { color: var(--muted); }
.reference-overview-grid span, .reference-command-kpis span { color: var(--muted); }.reference-overview-grid strong, .reference-command-kpis strong { color: var(--accent-deep); }.reference-overview-grid strong em, .reference-command-kpis strong em { color: #6e89a6; }.reference-overview-grid .is-danger strong { color: var(--danger); }
.reference-icon { color: var(--accent-deep); border-color: rgba(86, 174, 230, .2); background: #f3f9fe; filter: none; }.reference-overview-grid .is-danger .reference-icon { color: var(--danger); border-color: rgba(217, 106, 120, .22); background: #fff5f6; }
.reference-donut { background: conic-gradient(var(--accent) 0 25%, #7ec8a0 25% 63%, var(--warning) 63% 75%, var(--danger) 75% 91%, #5b6eff 91% 100%); }.reference-donut > div { background: #ffffff; }.reference-donut strong { color: #234b6d; }.reference-donut span, .reference-donut-wrap li { color: var(--muted); }.reference-donut-wrap li b { color: #234b6d; }.reference-donut-wrap li em { color: #6e89a6; }.dot-0 { background: var(--accent); }.dot-1 { background: #5b6eff; }.dot-2 { background: #7ec8a0; }.dot-3 { background: var(--warning); }.dot-4 { background: var(--danger); }
.reference-coverage-head { color: var(--muted); }.reference-coverage-list article { color: #587791; }.reference-coverage-list article > div { background: #e7f1f9; }.reference-coverage-list article > div i { background: var(--accent); }.reference-coverage-list b, .reference-coverage-list em { color: var(--accent-deep); }
.reference-kpi-icon { color: var(--accent-deep); filter: none; }
.reference-map-panel { border-color: #c9dfed; background: #07192b; box-shadow: 0 5px 16px rgba(47, 127, 184, .1); }.reference-map-panel::before, .reference-map-panel::after { border-color: #8bc8ef; }.reference-map-names span { color: #e7f8ff; }
.reference-map-pin { border-color: #8bd0f1; color: #ffffff; background: var(--accent-deep); box-shadow: 0 0 9px rgba(86, 174, 230, .46), inset 0 0 7px rgba(255,255,255,.14); }.reference-map-pin.warning { border-color: #f1c069; background: var(--warning); box-shadow: 0 0 9px rgba(215, 152, 54, .43); }.reference-map-pin.danger { border-color: #eb9aa5; background: var(--danger); box-shadow: 0 0 9px rgba(217, 106, 120, .42); }.reference-map-legend { border-color: rgba(139, 200, 239, .32); background: rgba(8, 31, 51, .8); }.reference-map-legend .normal { background: #7ec8a0; }.reference-map-legend .warn { background: var(--warning); }.reference-map-legend .risk { background: var(--danger); }.reference-map-tools, .reference-map-zoom { border-color: rgba(139, 200, 239, .34); background: rgba(8, 31, 51, .86); }
.reference-service-trend nav button { border-color: #cfe4f3; color: var(--muted); background: #ffffff; }.reference-service-trend nav button.active { border-color: var(--accent); color: var(--accent-deep); background: #eff8fe; }.reference-service-trend > header > div { color: var(--muted); }.reference-service-trend .legend-cyan::before { background: var(--accent); }.reference-service-trend .legend-blue::before { background: #5b6eff; }.reference-chart-grid { background-image: linear-gradient(rgba(104, 170, 210, .18) 1px, transparent 1px); }.reference-y-axis, .reference-x-axis { color: var(--muted); }.reference-bars i { border-color: rgba(86, 174, 230, .55); background: linear-gradient(180deg, #8bc8ef, #4ea7e3); box-shadow: inset 1px 0 rgba(255,255,255,.76), inset -4px 0 rgba(47,127,184,.18), 0 0 6px rgba(86,174,230,.12); }.reference-bars i b { background: rgba(255,255,255,.96); }.reference-chart polyline { stroke: #5b6eff; filter: none; }.reference-service-points circle { fill: #5b6eff; stroke: #d7e7ff; }

/* Bars, dates and trend points use the same seven-column coordinate system. */
.reference-bars { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); justify-content: normal; }
.reference-bars i { justify-self: center; }
.reference-chart svg { shape-rendering: geometricPrecision; }
.reference-chart polyline { stroke-width: 1px; stroke-linecap: round; stroke-linejoin: round; vector-effect: non-scaling-stroke; }
.reference-service-points circle { stroke-width: .75px; vector-effect: non-scaling-stroke; }
.reference-x-axis { right: 15px; left: 15px; display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); justify-content: normal; }
.reference-x-axis span { text-align: center; }
.reference-health-score span, .reference-health-score p, .reference-health-trend header, .reference-health-trend > div { color: var(--muted); }.reference-health-score strong { color: var(--accent-deep); }.reference-health-score p b { color: var(--success); }.reference-health-progress { border-bottom-color: #e0edf6; }.reference-health-progress::before { background: #e7f1f9; }.reference-health-progress i { background: var(--accent); }.reference-health-progress span, .reference-health-progress b { color: var(--muted); }.reference-health-trend h3 { color: #587791; }.reference-health-grid { stroke: rgba(104, 170, 210, .3); }.reference-health-trend path { fill: rgba(86, 174, 230, .11); }.reference-health-trend polyline { stroke: var(--accent); }.reference-health-points circle { fill: var(--accent); stroke: #ffffff; }
.reference-health-list button { border-color: #d9e8f7; color: #587791; background: #f8fcff; }.reference-health-list button strong { color: var(--accent-deep); }.reference-health-list button b { color: #6e89a6; }.reference-health-list .online { background: var(--success); }.reference-health-list .low { background: var(--warning); }.reference-health-list .offline { background: var(--danger); }.reference-health-list button.danger { border-color: rgba(217,106,120,.28); background: #fff7f8; }.reference-health-list button.danger strong, .reference-health-list em { color: var(--danger); }.reference-health-list em { border-color: var(--danger); }
.reference-alarm-list article { border-bottom-color: #e5eff7; }.reference-alarm-list strong { color: #345b7c; }.reference-alarm-list span, .reference-alarm-list time { color: var(--muted); }.alarm-type { color: var(--danger); background: #fff2f4; }.alarm-type.fall, .alarm-type.battery { color: var(--warning); background: #fff8ea; }.alarm-type.activity, .alarm-type.offline { color: var(--accent-deep); background: #eef8fe; }.reference-alarm-list strong em { color: var(--danger); background: #fff0f2; }.reference-alarm-list .fall em, .reference-alarm-list .battery em { color: #bb7e1f; background: #fff5df; }.reference-alarm-list .activity em, .reference-alarm-list .offline em { color: var(--accent-deep); background: #eaf6fe; }
.reference-workorder-panel article span, .reference-todo-panel article { color: #587791; }.reference-workorder-panel article strong { color: var(--accent-deep); }.workorder-icon { color: var(--accent-deep); }.reference-todo-panel article { border-bottom-color: #e5eff7; }.reference-todo-panel article span::before { color: var(--accent); }.reference-todo-panel strong { color: var(--danger); }.reference-todo-panel strong.yellow { color: var(--warning); }.reference-todo-panel time { color: var(--muted); }

/* Platform map layer: light cartographic depth keeps the map in the same colour
   family as the rest of the administration platform. */
.reference-map-panel { background: #edf5fd; }
.reference-map-canvas { background-image: url("./assets/command-center-map-platform.png"); }
.reference-map-canvas::after { background: rgba(237, 245, 253, .02); }
.reference-map-names span { color: #2f628d; text-shadow: 0 1px 0 rgba(255,255,255,.95), 0 0 5px rgba(86,174,230,.18); }
.reference-map-pin { border-color: #ffffff; color: #ffffff; background: var(--accent-deep); box-shadow: 0 3px 8px rgba(47,127,184,.3), 0 0 0 3px rgba(86,174,230,.16); }.reference-map-pin.warning { border-color: #ffffff; background: var(--warning); box-shadow: 0 3px 8px rgba(215,152,54,.28), 0 0 0 3px rgba(215,152,54,.14); }.reference-map-pin.danger { border-color: #ffffff; background: var(--danger); box-shadow: 0 3px 8px rgba(217,106,120,.28), 0 0 0 3px rgba(217,106,120,.14); }
.reference-map-legend { border-color: #d1e4f2; background: rgba(255,255,255,.91); box-shadow: 0 3px 10px rgba(47,127,184,.1); }.reference-map-legend span { color: #587791; }
.reference-map-tools, .reference-map-zoom { border-color: #cfe4f3; background: rgba(255,255,255,.92); box-shadow: 0 3px 10px rgba(47,127,184,.08); }.reference-map-tools button, .reference-map-zoom button { border-bottom-color: #e2eef7; color: #397fae; }.reference-map-zoom button { color: var(--accent-deep); }

/* Overview uses wider text tracks and a stable value/unit baseline so the
   four metrics stay airy at both native and scaled dashboard sizes. */
.reference-overview-panel > header { min-height: 51px; padding: 0 18px; }
.reference-overview-grid { grid-template-rows: repeat(2, minmax(0, 1fr)); gap: 0; height: calc(100% - 51px); padding: 0; box-sizing: border-box; }
.reference-overview-grid article { grid-template-columns: 53px minmax(0, 1fr); gap: 11px; min-height: 0; padding: 0 14px; }
.reference-overview-grid article:nth-child(odd) { border-right: 1px solid #e7f0f8; }
.reference-overview-grid article:nth-child(-n + 2) { border-bottom: 1px solid #e7f0f8; }
.reference-overview-grid article > div { gap: 7px; align-content: center; }
.reference-overview-grid span { line-height: 1; white-space: nowrap; }
.reference-overview-grid strong { display: flex; align-items: baseline; gap: 3px; min-width: 0; font-size: 24px; line-height: 1; letter-spacing: -.02em; white-space: nowrap; }
.reference-overview-grid strong em { margin-left: 0; font-size: 11px; line-height: 1; white-space: nowrap; }
.reference-icon { width: 53px; height: 53px; padding: 13px; }

/* Desktop uses a 1487 × 984 design canvas. Its width drives the scale so the
   cockpit fills wide displays; the dashboard shell scrolls vertically when
   the scaled composition is taller than the viewport. */
@media (hover: hover) {
  .reference-dashboard-topbar {
    position: relative;
    left: 0;
    width: 100%;
    min-width: 0;
    height: calc(76px * var(--reference-dashboard-scale, 1));
    grid-template-columns: calc(330px * var(--reference-dashboard-scale, 1)) minmax(0, 1fr) calc(340px * var(--reference-dashboard-scale, 1));
    transform: none;
  }
  .reference-dashboard-nav { height: calc(58px * var(--reference-dashboard-scale, 1)); }
  .reference-command-center {
    position: relative;
    left: max(0px, calc((100vw - (1487px * var(--reference-dashboard-scale, 1))) / 2));
  }
}

/* Touch-first small screens reflow; a resized desktop keeps the command view. */
@media (max-width: 760px) and (pointer: coarse) {
  .superadmin-dashboard-shell:has(.reference-command-center) { overflow: visible; }
  .superadmin-dashboard-main:has(.reference-command-center) { height: auto; overflow: visible; }
  .reference-dashboard-topbar,
  .reference-command-center {
    position: static;
    width: auto;
    min-width: 0;
    height: auto;
    transform: none;
  }
  .reference-dashboard-topbar {
    display: block;
    padding: 12px;
  }
  .reference-dashboard-brand { padding: 0; font-size: 20px; }
  .reference-dashboard-nav { justify-content: flex-start; margin-top: 10px; overflow-x: auto; }
  .reference-dashboard-nav button { flex: 0 0 auto; min-width: auto; min-height: 38px; padding: 0 12px; font-size: 13px; }
  .reference-dashboard-status { display: none; }
  .reference-command-center { padding: 12px; }
  .reference-command-grid,
  .reference-command-left,
  .reference-command-center-column,
  .reference-command-right { display: grid; grid-template-columns: minmax(0, 1fr); grid-template-rows: auto; }
  .reference-command-grid { gap: 12px; }
  .reference-command-left,
  .reference-command-center-column,
  .reference-command-right { grid-row: auto; gap: 12px; }
  .reference-command-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; padding: 12px; }
  .reference-map-panel { height: 360px; }
  .reference-service-trend { height: 215px; margin-top: 0; }
  .reference-chart { height: 159px; }
  .reference-health-panel,
  .reference-alarm-panel,
  .reference-workorder-panel,
  .reference-todo-panel { grid-column: auto; grid-row: auto; justify-self: stretch; width: auto; height: auto; }
  .reference-workorder-panel > div { padding: 14px; }
  .reference-todo-panel article { grid-template-columns: 1fr 65px 80px; }
}

/* The top navigation is the command centre's visual anchor: keep it light,
   but give each route a shaped surface and a short, purposeful hover response. */
.reference-dashboard-brand {
  position: relative;
  display: flex;
  align-items: center;
  min-height: 42px;
}
.reference-dashboard-brand::before {
  width: 4px;
  height: 25px;
  margin-right: 12px;
  content: "";
  border-radius: 3px;
  background: linear-gradient(180deg, #84c8ef, var(--accent-deep));
  box-shadow: 0 0 0 4px rgba(86, 174, 230, .11);
}
.reference-dashboard-nav {
  gap: 8px;
}
.reference-dashboard-nav button {
  isolation: isolate;
  display: grid;
  min-height: 46px;
  place-items: center;
  overflow: hidden;
  border-radius: 10px 3px 10px 3px;
  background: transparent;
  transition: color .2s ease, transform .2s cubic-bezier(.2, .8, .2, 1), filter .2s ease;
}
.reference-dashboard-nav button::before {
  position: absolute;
  z-index: -1;
  inset: 4px 1px 7px;
  height: auto;
  content: "";
  border-radius: 8px;
  background: linear-gradient(135deg, rgba(126, 200, 240, .09), rgba(86, 174, 230, .025));
  box-shadow: inset 0 0 0 1px rgba(86, 174, 230, .12);
  opacity: 0;
  transform: none;
  transition: opacity .2s ease, background .2s ease, box-shadow .2s ease;
}
.reference-dashboard-nav button::after {
  position: absolute;
  right: 14px;
  bottom: 7px;
  left: 14px;
  height: 2px;
  content: "";
  border-radius: 99px;
  background: linear-gradient(90deg, transparent, var(--accent), #7ec8ef, var(--accent), transparent);
  box-shadow: 0 2px 5px rgba(86, 174, 230, .3);
  opacity: 0;
  transform: scaleX(.25);
  transition: opacity .2s ease, transform .25s cubic-bezier(.2, .8, .2, 1);
}
.reference-dashboard-nav button:hover {
  color: var(--accent-deep);
  background: transparent;
  filter: saturate(1.08);
  transform: translateY(-2px);
}
.reference-dashboard-nav button:hover::before {
  background: linear-gradient(135deg, rgba(126, 200, 240, .34), rgba(86, 174, 230, .1));
  box-shadow: inset 0 0 0 1px rgba(86, 174, 230, .34), 0 5px 12px rgba(47, 127, 184, .1);
  opacity: 1;
}
.reference-dashboard-nav button:hover::after { opacity: .72; transform: scaleX(.7); }
.reference-dashboard-nav button.active {
  clip-path: none;
  color: #55728d;
  background: transparent;
}
.reference-dashboard-nav button.active::before {
  inset: 4px 1px 7px;
  height: auto;
  background: linear-gradient(135deg, rgba(126, 200, 240, .09), rgba(86, 174, 230, .025));
  box-shadow: inset 0 0 0 1px rgba(86, 174, 230, .12);
  opacity: 0;
}
.reference-dashboard-nav button.active::after { opacity: 0; transform: scaleX(.25); }
.reference-dashboard-nav button.active:hover { color: var(--accent-deep); }
.reference-dashboard-nav button.active:hover::before {
  background: linear-gradient(135deg, rgba(126, 200, 240, .34), rgba(86, 174, 230, .1));
  box-shadow: inset 0 0 0 1px rgba(86, 174, 230, .34), 0 5px 12px rgba(47, 127, 184, .1);
  opacity: 1;
}
.reference-dashboard-nav button.active:hover::after { opacity: .72; transform: scaleX(.7); }
.reference-dashboard-nav button:focus-visible {
  outline: 2px solid var(--accent-deep);
  outline-offset: 2px;
}
@media (prefers-reduced-motion: reduce) {
  .reference-dashboard-nav button,
  .reference-dashboard-nav button::before,
  .reference-dashboard-nav button::after { transition: none; }
  .reference-dashboard-nav button:hover { transform: none; }
}

@media (max-width: 1100px), (max-height: 820px) {
  .reference-dashboard-brand { min-height: 0; }
  .reference-dashboard-nav { height: auto; }
  .reference-dashboard-nav button { min-height: 38px; }
}

/* Final dark visual target override — kept at EOF so it supersedes historical
   light-theme refinement passes for the super-admin command center. */
.superadmin-dashboard-shell { color: #e4fbff; background: radial-gradient(ellipse at 50% 30%, rgba(8, 104, 132, .28), transparent 40%), linear-gradient(180deg, #021521 0%, #031d2a 57%, #020f19 100%); }
.superadmin-dashboard-shell::before { opacity: .44; background-image: linear-gradient(rgba(44,197,221,.11) 1px,transparent 1px), linear-gradient(90deg,rgba(44,197,221,.11) 1px,transparent 1px); background-size: 44px 44px; }
.superadmin-dashboard-topbar { border-top: 2px solid #27dcec; border-bottom-color: rgba(45,217,234,.64); color: #e4fbff; background: linear-gradient(180deg,rgba(2,39,53,.97),rgba(2,23,34,.96)); box-shadow: 0 4px 18px rgba(9,222,239,.19), inset 0 -1px 0 rgba(95,236,249,.14); }
.superadmin-dashboard-brand strong { color: #66e9f4; text-shadow: 0 0 10px rgba(65,226,241,.45); }.superadmin-dashboard-brand span,.superadmin-dashboard-user { color: #91ced8; }.superadmin-dashboard-title h1 { color: #e5feff; text-shadow: 0 0 11px rgba(67,222,239,.55); }.superadmin-dashboard-title small { color: #7fe2ee; }.superadmin-dashboard-title::before,.superadmin-dashboard-title::after { background: linear-gradient(90deg,transparent,#23d7e9 40%,transparent); }
.superadmin-menu > summary,.superadmin-menu-panel,.superadmin-dashboard-user details button { border-color: rgba(61,219,237,.54); color: #c5f8fb; background: rgba(3,50,65,.9); }.superadmin-menu-panel button { color: #b8edf3; background: rgba(6,70,86,.72); }.superadmin-menu-panel button:hover,.superadmin-menu-panel button.active { border-color: #52f1ff; color: #fff; background: rgba(10,123,145,.74); }
.superadmin-top-refresh,.superadmin-action-button { border-color: rgba(72,225,240,.62); border-radius: 2px; color: #c9fbff; background: rgba(5,77,96,.72); box-shadow: inset 0 0 9px rgba(36,217,234,.13); }.superadmin-top-refresh:hover,.superadmin-action-button:hover { border-color: #a9fbff; color:#fff; background:rgba(9,129,150,.82); }.api-status-badge.is-ok { border-color: rgba(85,239,191,.62); color:#8af0c8; background:rgba(21,137,103,.2); }
.superadmin-template-command-center { max-width:none; padding:22px 30px 76px; }.superadmin-template-command-center .superadmin-command-board { gap:18px; grid-template-columns:minmax(290px,.83fr) minmax(500px,1.48fr) minmax(290px,.83fr); }.superadmin-template-command-center .superadmin-board-column { gap:18px; }
.superadmin-template-command-center .superadmin-board-panel,.superadmin-template-command-center .superadmin-board-stage { border:1px solid rgba(41,209,231,.65); border-radius:0; color:#e4fbff; background:linear-gradient(135deg,rgba(3,48,62,.92),rgba(2,25,37,.95)); box-shadow:0 0 0 1px rgba(20,128,151,.18),0 0 17px rgba(11,205,229,.12),inset 0 0 26px rgba(0,10,17,.4); }.superadmin-template-command-center .superadmin-board-panel::before,.superadmin-template-command-center .superadmin-board-stage::before { height:2px; background:linear-gradient(90deg,transparent,#2be8f7 16%,#b1ffff 50%,#2be8f7 84%,transparent); box-shadow:0 0 8px #2edbea; }
.superadmin-template-command-center .superadmin-board-panel > header,.superadmin-template-command-center .superadmin-board-stage > header { min-height:50px; border-top:1px solid rgba(71,229,244,.18); border-bottom-color:rgba(45,190,213,.45); background:linear-gradient(90deg,rgba(6,96,116,.78),rgba(4,51,67,.4) 68%,transparent); }.superadmin-template-command-center .superadmin-board-panel > header p,.superadmin-template-command-center .superadmin-board-stage > header p { color:#7ce6f1; }.superadmin-template-command-center .superadmin-board-panel h2,.superadmin-template-command-center .superadmin-board-stage h2 { color:#edffff; text-shadow:0 0 8px rgba(72,227,242,.42); }
.superadmin-template-command-center .superadmin-board-alerts { border-color:rgba(232,179,56,.72); }.superadmin-template-command-center .superadmin-board-alerts::before { background:linear-gradient(90deg,transparent,#f0c13f 24%,#ffe886 50%,#f0c13f 76%,transparent); }.superadmin-template-command-center .superadmin-board-alerts > header { background:linear-gradient(90deg,rgba(126,89,13,.62),rgba(70,48,5,.32) 66%,transparent); }
.superadmin-template-command-center .superadmin-issue-list article,.superadmin-template-command-center .superadmin-management-list article,.superadmin-template-command-center .superadmin-board-duty dl div { border-color:rgba(47,185,206,.25); }.superadmin-template-command-center .superadmin-issue-list article strong,.superadmin-template-command-center .superadmin-management-list strong,.superadmin-template-command-center .superadmin-board-duty dd { color:#e3fcff; }.superadmin-template-command-center .superadmin-issue-list article small,.superadmin-template-command-center .superadmin-issue-list article time,.superadmin-template-command-center .superadmin-management-list span,.superadmin-template-command-center .superadmin-management-list small,.superadmin-template-command-center .superadmin-board-duty dt { color:#82c8d4; }.superadmin-template-command-center .superadmin-issue-list article span { color:#ffcf52; }.superadmin-template-command-center .superadmin-issue-list article.is-danger span { color:#ff7e89; }
.superadmin-template-command-center .superadmin-board-stat-grid article { border-color:#32d5e7; }.superadmin-template-command-center .superadmin-board-stat-grid article:nth-child(3),.superadmin-template-command-center .superadmin-board-stat-grid article:nth-child(4) { border-color:#f5c14a; }.superadmin-template-command-center .superadmin-board-stat-grid span,.superadmin-template-command-center .superadmin-board-stat-grid small { color:#89c7d1; }.superadmin-template-command-center .superadmin-board-stat-grid strong,.superadmin-template-command-center .superadmin-board-duty dd { color:#61e7f5; text-shadow:0 0 8px rgba(63,225,240,.38); }.superadmin-template-command-center .superadmin-board-stat-grid strong.is-warning,.superadmin-template-command-center dd.is-warning { color:#ffd265; text-shadow:0 0 8px rgba(255,204,85,.36); }
.superadmin-template-command-center .superadmin-board-stage { background:rgba(2,29,41,.95); }.superadmin-template-command-center .superadmin-stage-core,.superadmin-template-command-center .superadmin-stage-core.is-risk { border-color:rgba(40,211,234,.48); background:linear-gradient(rgba(0,19,30,.35),rgba(0,21,32,.42)),url("./assets/superadmin-institution-topology-dark.png") center / cover no-repeat; box-shadow:inset 0 0 32px rgba(0,16,25,.6),0 0 13px rgba(17,205,229,.12); }.superadmin-template-command-center .superadmin-stage-status { border-color:rgba(255,202,81,.78); border-radius:0; color:#ffe38d; background:rgba(30,55,55,.55); box-shadow:inset 0 0 18px rgba(255,202,62,.1); }.superadmin-template-command-center .superadmin-stage-core.is-risk .superadmin-stage-status { border-color:#ff8e81; color:#ffbbb3; background:rgba(84,28,38,.42); }.superadmin-template-command-center .superadmin-stage-status strong { color:#ffe16e; text-shadow:0 0 12px rgba(255,209,77,.7); }.superadmin-template-command-center .superadmin-stage-core.is-risk .superadmin-stage-status strong { color:#ff8c83; }.superadmin-template-command-center .superadmin-stage-spokes article { border-left-color:#2be4f3; background:linear-gradient(90deg,rgba(4,91,108,.68),rgba(2,31,43,.7)); }.superadmin-template-command-center .superadmin-stage-spokes span { color:#a4dce4; }.superadmin-template-command-center .superadmin-stage-spokes strong { color:#edffff; text-shadow:0 0 8px rgba(70,232,244,.55); }.superadmin-template-command-center .superadmin-stage-footer { border-color:rgba(40,190,211,.37); color:#82c7d2; }
.superadmin-template-command-center .superadmin-board-monitoring { background:linear-gradient(135deg,rgba(3,57,70,.95),rgba(2,25,37,.97)); }.superadmin-template-command-center .superadmin-device-health-summary span,.superadmin-template-command-center .superadmin-device-health-summary p { color:#93d4de; }.superadmin-template-command-center .superadmin-device-health-summary strong { color:#55e8f7; }.superadmin-template-command-center .superadmin-device-health-list button { border-color:rgba(48,201,220,.28); color:#b6eff4; background:rgba(4,63,77,.63); }.superadmin-template-command-center .superadmin-device-health-list button.is-risk { background:rgba(110,29,42,.45); }
.superadmin-dashboard-dock { border-color:rgba(47,220,240,.72); border-radius:0; background:linear-gradient(180deg,rgba(5,67,84,.97),rgba(1,27,39,.98)); box-shadow:0 -8px 22px rgba(5,206,228,.18),inset 0 1px 0 rgba(111,246,255,.24); }.superadmin-dashboard-dock button { color:#a5dce4; }.superadmin-dashboard-dock button:hover { color:#e8ffff; }.superadmin-dashboard-dock button.is-home { border-color:#046079; color:#fff; background:radial-gradient(circle at 50% 28%,#68effa,#087ba9 66%,#043e5b); box-shadow:0 0 0 1px #70f8ff,0 0 22px rgba(49,231,247,.64); }
@media (max-width: 760px) { .superadmin-dashboard-shell { background:#021723; }.superadmin-template-command-center { padding-right:12px; padding-left:12px; } }

/* Reference hierarchy: device health owns the right-side hero position, with
   follow-up events directly below it; care summaries remain the supporting rail. */
@media (min-width: 1181px) {
  .superadmin-template-command-center .superadmin-board-right {
    grid-template-rows: minmax(238px, 1.3fr) minmax(156px, .84fr) minmax(136px, .7fr);
  }
  .superadmin-template-command-center .superadmin-board-monitoring { order: 1; padding-bottom: 12px; }
  .superadmin-template-command-center .superadmin-board-problems { order: 2; }
  .superadmin-template-command-center .superadmin-board-management { order: 3; }
  .superadmin-template-command-center .superadmin-board-monitoring > header { min-height: 48px; padding: 9px 18px; }
  .superadmin-template-command-center .superadmin-board-monitoring > header p { display: block; }
  .superadmin-template-command-center .superadmin-device-health-summary { margin-top: 12px; }
  .superadmin-template-command-center .superadmin-device-health-summary strong { font-size: 36px; }
  .superadmin-template-command-center .superadmin-device-health-meter { height: 9px; margin-bottom: 11px; }
  .superadmin-template-command-center .superadmin-device-health-list { gap: 7px; }
  .superadmin-template-command-center .superadmin-device-health-list button { min-height: 34px; padding-top: 6px; padding-bottom: 6px; }
  .superadmin-template-command-center .superadmin-board-problems > header { min-height: 40px; padding: 7px 18px; }
  .superadmin-template-command-center .superadmin-board-problems > header p { display: block; }
  .superadmin-template-command-center .superadmin-board-problems .superadmin-issue-list { margin: 0 18px; }
  .superadmin-template-command-center .superadmin-board-problems .superadmin-issue-list article { min-height: 36px; padding-top: 4px; padding-bottom: 4px; }
  .superadmin-template-command-center .superadmin-board-management .superadmin-care-operations-viewport { min-height: 72px; margin: 3px 18px 5px; }
  .superadmin-template-command-center .superadmin-board-management .superadmin-care-operations-list article { height: 72px; min-height: 72px; padding-top: 7px; padding-bottom: 7px; }
}

/* Selected command-center reference: dark operational canvas, illuminated cyan
   panel chrome, and amber/red reserved for actionable exceptions. */
.superadmin-dashboard-shell {
  --command-cyan: #19d6e9;
  --command-cyan-soft: #8af5ff;
  --command-text: #e4fbff;
  --command-muted: #78bfcd;
  color: var(--command-text);
  background: radial-gradient(ellipse at 50% 30%, rgba(8, 104, 132, .26), transparent 40%), linear-gradient(180deg, #021521 0%, #031d2a 57%, #020f19 100%);
}
.superadmin-dashboard-shell::before {
  opacity: .44;
  background-image: linear-gradient(rgba(44, 197, 221, .11) 1px, transparent 1px), linear-gradient(90deg, rgba(44, 197, 221, .11) 1px, transparent 1px);
  background-size: 44px 44px;
}
.superadmin-dashboard-topbar {
  border-top: 2px solid #27dcec;
  border-bottom-color: rgba(45, 217, 234, .64);
  color: var(--command-text);
  background: linear-gradient(180deg, rgba(2, 39, 53, .97), rgba(2, 23, 34, .96));
  box-shadow: 0 4px 18px rgba(9, 222, 239, .19), inset 0 -1px 0 rgba(95, 236, 249, .14);
}
.superadmin-dashboard-brand strong { color: #66e9f4; text-shadow: 0 0 10px rgba(65, 226, 241, .45); }
.superadmin-dashboard-brand span, .superadmin-dashboard-user { color: #91ced8; }
.superadmin-dashboard-title h1 { color: #e5feff; text-shadow: 0 0 11px rgba(67, 222, 239, .55); }
.superadmin-dashboard-title small { color: #7fe2ee; }
.superadmin-dashboard-title::before, .superadmin-dashboard-title::after { background: linear-gradient(90deg, transparent, #23d7e9 40%, transparent); }
.superadmin-menu > summary, .superadmin-menu-panel, .superadmin-dashboard-user details button {
  border-color: rgba(61, 219, 237, .54);
  color: #c5f8fb;
  background: rgba(3, 50, 65, .9);
  box-shadow: inset 0 0 10px rgba(29, 216, 233, .12);
}
.superadmin-menu-panel button { color: #b8edf3; background: rgba(6, 70, 86, .72); }
.superadmin-menu-panel button:hover, .superadmin-menu-panel button.active { border-color: #52f1ff; color: #fff; background: rgba(10, 123, 145, .74); }
.superadmin-top-refresh, .superadmin-action-button {
  border-color: rgba(72, 225, 240, .62);
  border-radius: 2px;
  color: #c9fbff;
  background: rgba(5, 77, 96, .72);
  box-shadow: inset 0 0 9px rgba(36, 217, 234, .13);
}
.superadmin-top-refresh:hover, .superadmin-action-button:hover { border-color: #a9fbff; color: #fff; background: rgba(9, 129, 150, .82); }
.api-status-badge.is-ok { border-color: rgba(85, 239, 191, .62); color: #8af0c8; background: rgba(21, 137, 103, .2); }
.superadmin-template-command-center { max-width: none; padding: 22px 30px 76px; }
.superadmin-template-command-center .superadmin-command-board { gap: 18px; grid-template-columns: minmax(290px, .83fr) minmax(500px, 1.48fr) minmax(290px, .83fr); }
.superadmin-template-command-center .superadmin-board-column { gap: 18px; }
.superadmin-template-command-center .superadmin-board-panel,
.superadmin-template-command-center .superadmin-board-stage {
  border: 1px solid rgba(41, 209, 231, .65);
  border-radius: 0;
  color: var(--command-text);
  background: linear-gradient(135deg, rgba(3, 48, 62, .92), rgba(2, 25, 37, .95));
  box-shadow: 0 0 0 1px rgba(20, 128, 151, .18), 0 0 17px rgba(11, 205, 229, .12), inset 0 0 26px rgba(0, 10, 17, .4);
}
.superadmin-template-command-center .superadmin-board-panel::before,
.superadmin-template-command-center .superadmin-board-stage::before { height: 2px; background: linear-gradient(90deg, transparent, #2be8f7 16%, #b1ffff 50%, #2be8f7 84%, transparent); box-shadow: 0 0 8px #2edbea; }
.superadmin-template-command-center .superadmin-board-panel > header,
.superadmin-template-command-center .superadmin-board-stage > header {
  min-height: 50px;
  border-top: 1px solid rgba(71, 229, 244, .18);
  border-bottom-color: rgba(45, 190, 213, .45);
  background: linear-gradient(90deg, rgba(6, 96, 116, .78), rgba(4, 51, 67, .4) 68%, transparent);
}
.superadmin-template-command-center .superadmin-board-panel > header p,
.superadmin-template-command-center .superadmin-board-stage > header p { color: #7ce6f1; }
.superadmin-template-command-center .superadmin-board-panel h2,
.superadmin-template-command-center .superadmin-board-stage h2 { color: #edffff; text-shadow: 0 0 8px rgba(72, 227, 242, .42); }
.superadmin-template-command-center .superadmin-board-alerts { border-color: rgba(232, 179, 56, .72); }
.superadmin-template-command-center .superadmin-board-alerts::before { background: linear-gradient(90deg, transparent, #f0c13f 24%, #ffe886 50%, #f0c13f 76%, transparent); }
.superadmin-template-command-center .superadmin-board-alerts > header { background: linear-gradient(90deg, rgba(126, 89, 13, .62), rgba(70, 48, 5, .32) 66%, transparent); }
.superadmin-template-command-center .superadmin-issue-list article,
.superadmin-template-command-center .superadmin-management-list article,
.superadmin-template-command-center .superadmin-board-duty dl div { border-color: rgba(47, 185, 206, .25); }
.superadmin-template-command-center .superadmin-issue-list article strong,
.superadmin-template-command-center .superadmin-management-list strong,
.superadmin-template-command-center .superadmin-board-duty dd { color: #e3fcff; }
.superadmin-template-command-center .superadmin-issue-list article small,
.superadmin-template-command-center .superadmin-issue-list article time,
.superadmin-template-command-center .superadmin-management-list span,
.superadmin-template-command-center .superadmin-management-list small,
.superadmin-template-command-center .superadmin-board-duty dt { color: #82c8d4; }
.superadmin-template-command-center .superadmin-issue-list article span { color: #ffcf52; }
.superadmin-template-command-center .superadmin-issue-list article.is-danger span { color: #ff7e89; }
.superadmin-template-command-center .superadmin-board-stat-grid article { border-color: #32d5e7; }
.superadmin-template-command-center .superadmin-board-stat-grid article:nth-child(3),
.superadmin-template-command-center .superadmin-board-stat-grid article:nth-child(4) { border-color: #f5c14a; }
.superadmin-template-command-center .superadmin-board-stat-grid span,
.superadmin-template-command-center .superadmin-board-stat-grid small { color: #89c7d1; }
.superadmin-template-command-center .superadmin-board-stat-grid strong,
.superadmin-template-command-center .superadmin-board-duty dd { color: #61e7f5; text-shadow: 0 0 8px rgba(63, 225, 240, .38); }
.superadmin-template-command-center .superadmin-board-stat-grid strong.is-warning,
.superadmin-template-command-center dd.is-warning { color: #ffd265; text-shadow: 0 0 8px rgba(255, 204, 85, .36); }
.superadmin-template-command-center .superadmin-board-stage { background: rgba(2, 29, 41, .95); }
.superadmin-template-command-center .superadmin-stage-core,
.superadmin-template-command-center .superadmin-stage-core.is-risk {
  border-color: rgba(40, 211, 234, .48);
  background: linear-gradient(rgba(0, 19, 30, .35), rgba(0, 21, 32, .42)), url("./assets/superadmin-institution-topology-dark.png") center / cover no-repeat;
  box-shadow: inset 0 0 32px rgba(0, 16, 25, .6), 0 0 13px rgba(17, 205, 229, .12);
}
.superadmin-template-command-center .superadmin-stage-status { border-color: rgba(255, 202, 81, .78); border-radius: 0; color: #ffe38d; background: rgba(30, 55, 55, .55); box-shadow: inset 0 0 18px rgba(255, 202, 62, .1); }
.superadmin-template-command-center .superadmin-stage-core.is-risk .superadmin-stage-status { border-color: #ff8e81; color: #ffbbb3; background: rgba(84, 28, 38, .42); }
.superadmin-template-command-center .superadmin-stage-status strong { color: #ffe16e; text-shadow: 0 0 12px rgba(255, 209, 77, .7); }
.superadmin-template-command-center .superadmin-stage-core.is-risk .superadmin-stage-status strong { color: #ff8c83; }
.superadmin-template-command-center .superadmin-stage-spokes article { border-left-color: #2be4f3; background: linear-gradient(90deg, rgba(4, 91, 108, .68), rgba(2, 31, 43, .7)); }
.superadmin-template-command-center .superadmin-stage-spokes span { color: #a4dce4; }
.superadmin-template-command-center .superadmin-stage-spokes strong { color: #edffff; text-shadow: 0 0 8px rgba(70, 232, 244, .55); }
.superadmin-template-command-center .superadmin-stage-footer { border-color: rgba(40, 190, 211, .37); color: #82c7d2; }
.superadmin-template-command-center .superadmin-board-monitoring { background: linear-gradient(135deg, rgba(3, 57, 70, .95), rgba(2, 25, 37, .97)); }
.superadmin-template-command-center .superadmin-device-health-summary span,
.superadmin-template-command-center .superadmin-device-health-summary p { color: #93d4de; }
.superadmin-template-command-center .superadmin-device-health-summary strong { color: #55e8f7; }
.superadmin-template-command-center .superadmin-device-health-list button { border-color: rgba(48, 201, 220, .28); color: #b6eff4; background: rgba(4, 63, 77, .63); }
.superadmin-template-command-center .superadmin-device-health-list button.is-risk { background: rgba(110, 29, 42, .45); }
.superadmin-dashboard-dock { border-color: rgba(47, 220, 240, .72); border-radius: 0; background: linear-gradient(180deg, rgba(5, 67, 84, .97), rgba(1, 27, 39, .98)); box-shadow: 0 -8px 22px rgba(5, 206, 228, .18), inset 0 1px 0 rgba(111, 246, 255, .24); }
.superadmin-dashboard-dock button { color: #a5dce4; }
.superadmin-dashboard-dock button:hover { color: #e8ffff; }
.superadmin-dashboard-dock button.is-home { border-color: #046079; color: #fff; background: radial-gradient(circle at 50% 28%, #68effa, #087ba9 66%, #043e5b); box-shadow: 0 0 0 1px #70f8ff, 0 0 22px rgba(49, 231, 247, .64); }
@media (max-width: 760px) {
  .superadmin-dashboard-shell { background: #021723; }
  .superadmin-template-command-center { padding-right: 12px; padding-left: 12px; }
}

/* Device health must retain its complete three-state queue in the final
   desktop cascade, alongside the existing single-screen command layout. */
@media (min-width: 1181px) {
  .superadmin-template-command-center .superadmin-board-right {
    grid-template-rows: 236px 118px minmax(178px, 1fr);
  }
  .superadmin-template-command-center .superadmin-board-management .superadmin-care-operations-viewport {
    min-height: 154px;
    margin-top: 5px;
    margin-bottom: 6px;
  }
  .superadmin-template-command-center .superadmin-board-management .superadmin-care-operations-list article {
    height: 77px;
    min-height: 77px;
    padding-top: 8px;
    padding-bottom: 8px;
  }
  .superadmin-template-command-center .superadmin-board-problems .superadmin-issue-list article {
    min-height: 28px;
    padding-top: 2px;
    padding-bottom: 2px;
  }
  .superadmin-template-command-center .superadmin-board-monitoring { padding-bottom: 8px; }
  .superadmin-template-command-center .superadmin-device-health-summary { margin-top: 7px; margin-bottom: 5px; }
  .superadmin-template-command-center .superadmin-device-health-summary strong { font-size: 28px; }
  .superadmin-template-command-center .superadmin-device-health-meter { margin-bottom: 7px; }
  .superadmin-template-command-center .superadmin-device-health-list { gap: 4px; }
  .superadmin-template-command-center .superadmin-device-health-list button { min-height: 27px; padding-top: 3px; padding-bottom: 3px; }
}

/* Device health must retain its complete three-state queue in the final
   desktop cascade, alongside the existing single-screen command layout. */
@media (min-width: 1181px) {
  .superadmin-template-command-center .superadmin-board-right {
    grid-template-rows: 236px 118px minmax(178px, 1fr);
  }
  .superadmin-template-command-center .superadmin-board-management .superadmin-care-operations-viewport {
    min-height: 154px;
    margin-top: 5px;
    margin-bottom: 6px;
  }
  .superadmin-template-command-center .superadmin-board-management .superadmin-care-operations-list article {
    height: 77px;
    min-height: 77px;
    padding-top: 8px;
    padding-bottom: 8px;
  }
  .superadmin-template-command-center .superadmin-board-problems .superadmin-issue-list article {
    min-height: 28px;
    padding-top: 2px;
    padding-bottom: 2px;
  }
  .superadmin-template-command-center .superadmin-board-monitoring { padding-bottom: 8px; }
  .superadmin-template-command-center .superadmin-device-health-summary { margin-top: 7px; margin-bottom: 5px; }
  .superadmin-template-command-center .superadmin-device-health-summary strong { font-size: 28px; }
  .superadmin-template-command-center .superadmin-device-health-meter { margin-bottom: 7px; }
  .superadmin-template-command-center .superadmin-device-health-list { gap: 4px; }
  .superadmin-template-command-center .superadmin-device-health-list button { min-height: 27px; padding-top: 3px; padding-bottom: 3px; }
}

/* Final device-health rail budget: keep all three live states visible at the
   desktop command-center height instead of clipping the priority row. */
@media (min-width: 1181px) {
  .superadmin-template-command-center .superadmin-board-right {
    grid-template-rows: 236px 118px minmax(178px, 1fr);
  }
  .superadmin-template-command-center .superadmin-board-management .superadmin-care-operations-viewport {
    min-height: 154px;
    margin-top: 5px;
    margin-bottom: 6px;
  }
  .superadmin-template-command-center .superadmin-board-management .superadmin-care-operations-list article {
    height: 77px;
    min-height: 77px;
    padding-top: 8px;
    padding-bottom: 8px;
  }
  .superadmin-template-command-center .superadmin-board-problems .superadmin-issue-list article {
    min-height: 28px;
    padding-top: 2px;
    padding-bottom: 2px;
  }
  .superadmin-template-command-center .superadmin-board-monitoring { padding-bottom: 8px; }
  .superadmin-template-command-center .superadmin-device-health-summary { margin-top: 7px; margin-bottom: 5px; }
  .superadmin-template-command-center .superadmin-device-health-summary strong { font-size: 28px; }
  .superadmin-template-command-center .superadmin-device-health-meter { margin-bottom: 7px; }
  .superadmin-template-command-center .superadmin-device-health-list { gap: 4px; }
  .superadmin-template-command-center .superadmin-device-health-list button { min-height: 27px; padding-top: 3px; padding-bottom: 3px; }
}

/* Device health follows the selected operations-board reference: a clear live
   availability signal and a short action queue, without competing with care. */
.superadmin-template-command-center .superadmin-board-monitoring {
  display: flex;
  flex-direction: column;
  padding-bottom: 14px;
}
.superadmin-template-command-center .superadmin-device-health-summary {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 12px;
  margin: 12px 18px 7px;
}
.superadmin-template-command-center .superadmin-device-health-summary > div { display: grid; gap: 3px; }
.superadmin-template-command-center .superadmin-device-health-summary span {
  color: #759fb2;
  font-size: 11px;
}
.superadmin-template-command-center .superadmin-device-health-summary strong {
  color: #49dff1;
  font-size: 34px;
  line-height: .95;
  font-variant-numeric: tabular-nums;
  text-shadow: 0 0 10px rgba(73, 223, 241, .35);
}
.superadmin-template-command-center .superadmin-device-health-summary strong em {
  margin-left: 2px;
  font-size: 16px;
  font-style: normal;
}
.superadmin-template-command-center .superadmin-device-health-summary p {
  max-width: 128px;
  margin: 0 0 2px;
  color: #91c9d5;
  font-size: 11px;
  line-height: 1.45;
  text-align: right;
}
.superadmin-template-command-center .superadmin-device-health-summary p.is-warning { color: #ffd06a; }
.superadmin-template-command-center .superadmin-device-health-summary p.is-risk { color: #ff8186; }
.superadmin-template-command-center .superadmin-device-health-meter {
  height: 7px;
  margin: 0 18px 10px;
  overflow: hidden;
  border: 1px solid rgba(53, 211, 232, .27);
  background: rgba(4, 37, 49, .64);
  box-shadow: inset 0 0 8px rgba(2, 11, 19, .5);
}
.superadmin-template-command-center .superadmin-device-health-meter i {
  display: block;
  height: 100%;
  min-width: 2px;
  background: linear-gradient(90deg, #1bc5db, #64f1ff);
  box-shadow: 0 0 11px rgba(66, 235, 247, .72);
}
.superadmin-template-command-center .superadmin-device-health-list {
  display: grid;
  gap: 7px;
  margin: 0 18px;
}
.superadmin-template-command-center .superadmin-device-health-list button {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  align-items: center;
  gap: 8px;
  min-height: 34px;
  padding: 6px 9px;
  border: 1px solid rgba(49, 193, 214, .24);
  color: #9edce7;
  font: inherit;
  font-size: 12px;
  background: rgba(3, 47, 61, .53);
  cursor: pointer;
  text-align: left;
}
.superadmin-template-command-center .superadmin-device-health-list button:hover {
  border-color: rgba(84, 233, 247, .7);
  background: rgba(7, 89, 106, .58);
}
.superadmin-template-command-center .superadmin-device-health-list span {
  display: flex;
  align-items: center;
  gap: 7px;
  min-width: 0;
}
.superadmin-template-command-center .superadmin-device-health-list i {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #46e4f2;
  box-shadow: 0 0 7px rgba(70, 228, 242, .62);
}
.superadmin-template-command-center .superadmin-device-health-list i.is-low { background: #ffc64b; box-shadow: 0 0 7px rgba(255, 198, 75, .55); }
.superadmin-template-command-center .superadmin-device-health-list i.is-offline { background: #ff6874; box-shadow: 0 0 7px rgba(255, 104, 116, .55); }
.superadmin-template-command-center .superadmin-device-health-list strong {
  color: #e2ffff;
  font-size: 20px;
  line-height: 1;
  font-variant-numeric: tabular-nums;
}
.superadmin-template-command-center .superadmin-device-health-list b { color: #64dce9; font-size: 20px; font-weight: 400; line-height: .8; }
.superadmin-template-command-center .superadmin-device-health-list em {
  padding: 2px 5px;
  border: 1px solid rgba(255, 104, 116, .5);
  color: #ff9aa1;
  font-size: 10px;
  font-style: normal;
  white-space: nowrap;
}
.superadmin-template-command-center .superadmin-device-health-list button.is-warning { border-color: rgba(255, 194, 74, .38); }
.superadmin-template-command-center .superadmin-device-health-list button.is-warning strong { color: #ffd16a; }
.superadmin-template-command-center .superadmin-device-health-list button.is-risk { border-color: rgba(255, 103, 115, .52); background: rgba(97, 24, 39, .28); }
.superadmin-template-command-center .superadmin-device-health-list button.is-risk strong { color: #ff7d86; }

@media (min-width: 1181px) {
  .superadmin-template-command-center .superadmin-board-right { grid-template-rows: minmax(248px, 1.36fr) minmax(150px, .82fr) minmax(202px, 1.08fr); }
  .superadmin-template-command-center .superadmin-board-monitoring > header { min-height: 42px; padding: 7px 14px; }
  .superadmin-template-command-center .superadmin-board-monitoring > header p { display: block; }
  .superadmin-template-command-center .superadmin-device-health-summary { margin-top: 9px; }
  .superadmin-template-command-center .superadmin-device-health-summary strong { font-size: 30px; }
  .superadmin-template-command-center .superadmin-device-health-list { gap: 5px; }
  .superadmin-template-command-center .superadmin-device-health-list button { min-height: 29px; padding-block: 4px; }
}

@media (max-width: 760px) {
  .superadmin-template-command-center .superadmin-device-health-summary { margin-right: 14px; margin-left: 14px; }
  .superadmin-template-command-center .superadmin-device-health-meter,
  .superadmin-template-command-center .superadmin-device-health-list { margin-right: 14px; margin-left: 14px; }
}

/* Last cascade: keep all device-health metrics visible in the compact rail. */
@media (min-width: 1181px) {
  .superadmin-template-command-center .superadmin-board-right { grid-template-rows: 258px 164px 110px; }
  .superadmin-template-command-center .superadmin-board-monitoring { overflow: hidden; padding-bottom: 3px; }
  .superadmin-template-command-center .superadmin-board-monitoring > header { min-height: 32px; padding: 4px 14px; }
  .superadmin-template-command-center .superadmin-board-monitoring .superadmin-device-ratio { margin-top: 0; }
  .superadmin-template-command-center .superadmin-board-monitoring .superadmin-device-ratio strong { font-size: 22px; }
  .superadmin-template-command-center .superadmin-board-monitoring dl { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin: 2px 18px 0; padding: 0; }
  .superadmin-template-command-center .superadmin-board-monitoring dl div { min-width: 0; padding: 0 0 1px; }
  .superadmin-template-command-center .superadmin-board-monitoring dt { font-size: 10px; white-space: nowrap; }
  .superadmin-template-command-center .superadmin-board-monitoring dd { margin-top: 1px; font-size: 12px; }
}

/* Final restored device metrics: compact but all three operating indicators remain visible. */
@media (min-width: 1181px) {
  .superadmin-template-command-center .superadmin-board-right { grid-template-rows: 258px 164px 110px; }
  .superadmin-template-command-center .superadmin-board-monitoring > header { min-height: 32px; padding: 4px 14px; }
  .superadmin-template-command-center .superadmin-board-monitoring .superadmin-device-ratio { margin-top: 0; }
  .superadmin-template-command-center .superadmin-board-monitoring dl { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin: 2px 18px 0; padding: 0; }
  .superadmin-template-command-center .superadmin-board-monitoring dl div { min-width: 0; padding: 0 0 1px; }
  .superadmin-template-command-center .superadmin-board-monitoring dt { font-size: 10px; white-space: nowrap; }
  .superadmin-template-command-center .superadmin-board-monitoring dd { margin-top: 1px; font-size: 12px; }
}

/* Restore the complete device health summary without taking space from care. */
@media (min-width: 1181px) {
  .superadmin-template-command-center .superadmin-board-right { grid-template-rows: 258px 164px 110px; }
  .superadmin-template-command-center .superadmin-board-monitoring > header { min-height: 32px; padding: 4px 14px; }
  .superadmin-template-command-center .superadmin-board-monitoring .superadmin-device-ratio { margin-top: 0; }
  .superadmin-template-command-center .superadmin-board-monitoring dl { margin-top: 2px; }
  .superadmin-template-command-center .superadmin-board-monitoring dl div { padding-bottom: 1px; }
}

/* Compact device summary in the final 92px rail slot. */
@media (min-width: 1181px) {
  .superadmin-template-command-center .superadmin-board-monitoring dl { display: none; }
  .superadmin-template-command-center .superadmin-board-monitoring .superadmin-device-ratio { margin-top: 1px; }
}

/* Absolute final right-rail budget for the fixed desktop shell. */
@media (min-width: 1181px) {
  .superadmin-template-command-center .superadmin-board-right { grid-template-rows: 258px 182px 92px; }
  .superadmin-template-command-center .superadmin-board-problems { overflow: hidden; }
  .superadmin-template-command-center .superadmin-board-problems > header { min-height: 40px; padding: 6px 14px; }
  .superadmin-template-command-center .superadmin-board-problems > header p { display: none; }
  .superadmin-template-command-center .superadmin-board-problems h2 { font-size: 16px; }
  .superadmin-template-command-center .superadmin-board-problems .superadmin-issue-list { margin: 0 18px; }
  .superadmin-template-command-center .superadmin-board-problems .superadmin-issue-list article { min-height: 38px; padding: 4px 0; }
  .superadmin-template-command-center .superadmin-board-problems .superadmin-issue-list article small { display: none; }
  .superadmin-template-command-center .superadmin-board-problems .superadmin-issue-list article strong { font-size: 13px; }
  .superadmin-template-command-center .superadmin-board-problems .superadmin-issue-list article time { font-size: 10px; }
  .superadmin-template-command-center .superadmin-board-monitoring { overflow: hidden; padding-bottom: 2px; }
  .superadmin-template-command-center .superadmin-board-monitoring > header { min-height: 36px; padding: 5px 14px; }
  .superadmin-template-command-center .superadmin-board-monitoring > header p { display: none; }
  .superadmin-template-command-center .superadmin-board-monitoring h2 { font-size: 16px; }
  .superadmin-template-command-center .superadmin-board-monitoring .superadmin-device-ratio { display: flex; align-items: baseline; gap: 6px; margin: 2px 18px 0; }
  .superadmin-template-command-center .superadmin-board-monitoring .superadmin-device-ratio strong { font-size: 24px; }
  .superadmin-template-command-center .superadmin-board-monitoring dl { margin: 0 18px; padding: 0; }
  .superadmin-template-command-center .superadmin-board-monitoring dl div { padding: 0; }
}

/* Final single-screen budget: 258 + 182 + 92 with the two inter-panel gaps
   exactly fits the usable 572px right rail above the home dock. */
@media (min-width: 1181px) {
  .superadmin-template-command-center .superadmin-board-right {
    grid-template-rows: 258px 170px 104px;
  }
  .superadmin-template-command-center .superadmin-board-problems {
    overflow: hidden;
  }
  .superadmin-template-command-center .superadmin-board-problems > header {
    min-height: 40px;
    padding: 6px 14px;
  }
  .superadmin-template-command-center .superadmin-board-problems > header p { display: none; }
  .superadmin-template-command-center .superadmin-board-problems h2 { font-size: 16px; }
  .superadmin-template-command-center .superadmin-board-problems .superadmin-issue-list { margin: 0 18px; }
  .superadmin-template-command-center .superadmin-board-problems .superadmin-issue-list article {
    min-height: 38px;
    padding: 4px 0;
  }
  .superadmin-template-command-center .superadmin-board-problems .superadmin-issue-list article small { display: none; }
  .superadmin-template-command-center .superadmin-board-problems .superadmin-issue-list article strong { font-size: 13px; }
  .superadmin-template-command-center .superadmin-board-problems .superadmin-issue-list article time { font-size: 10px; }
  .superadmin-template-command-center .superadmin-board-monitoring { overflow: hidden; padding-bottom: 3px; }
  .superadmin-template-command-center .superadmin-board-monitoring > header { min-height: 34px; padding: 4px 14px; }
  .superadmin-template-command-center .superadmin-board-monitoring > header p { display: none; }
  .superadmin-template-command-center .superadmin-board-monitoring h2 { font-size: 16px; }
  .superadmin-template-command-center .superadmin-board-monitoring .superadmin-device-ratio { display: flex; align-items: baseline; gap: 6px; margin: 1px 18px 0; }
  .superadmin-template-command-center .superadmin-board-monitoring .superadmin-device-ratio strong { font-size: 22px; }
  .superadmin-template-command-center .superadmin-board-monitoring dl { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin: 1px 18px 0; padding: 0; }
  .superadmin-template-command-center .superadmin-board-monitoring dl div { min-width: 0; padding: 0; }
  .superadmin-template-command-center .superadmin-board-monitoring dt { font-size: 10px; white-space: nowrap; }
  .superadmin-template-command-center .superadmin-board-monitoring dd { margin-top: 1px; font-size: 12px; }
}

/* Final right-side sizing: follow-up owns the reclaimed height; device health
   remains a concise three-metric summary. Kept last against earlier layout passes. */
@media (min-width: 1181px) {
  .superadmin-template-command-center .superadmin-board-right {
    grid-template-rows: minmax(258px, 1.5fr) minmax(198px, 1.15fr) minmax(126px, .62fr);
  }
  .superadmin-template-command-center .superadmin-board-problems .superadmin-issue-list {
    margin: 0 18px;
  }
  .superadmin-template-command-center .superadmin-board-problems .superadmin-issue-list article {
    min-height: 45px;
    padding: 8px 0;
  }
  .superadmin-template-command-center .superadmin-board-problems .superadmin-issue-list article small { display: none; }
  .superadmin-template-command-center .superadmin-board-monitoring { padding-bottom: 10px; }
  .superadmin-template-command-center .superadmin-board-monitoring .superadmin-device-ratio { margin-top: 6px; }
  .superadmin-template-command-center .superadmin-board-monitoring .superadmin-device-ratio strong { font-size: 32px; }
  .superadmin-template-command-center .superadmin-board-monitoring dl { margin: 4px 18px 0; padding: 0; }
  .superadmin-template-command-center .superadmin-board-monitoring dl div { padding: 5px 0 0; }
}

/* Final right-side sizing: follow-up owns the reclaimed height; device health
   remains a concise three-metric summary. Kept last against earlier layout passes. */
@media (min-width: 1181px) {
  .superadmin-template-command-center .superadmin-board-right {
    grid-template-rows: minmax(258px, 1.5fr) minmax(198px, 1.15fr) minmax(126px, .62fr);
  }
  .superadmin-template-command-center .superadmin-board-problems .superadmin-issue-list {
    margin: 0 18px;
  }
  .superadmin-template-command-center .superadmin-board-problems .superadmin-issue-list article {
    min-height: 45px;
    padding: 8px 0;
  }
  .superadmin-template-command-center .superadmin-board-problems .superadmin-issue-list article small { display: none; }
  .superadmin-template-command-center .superadmin-board-monitoring { padding-bottom: 10px; }
  .superadmin-template-command-center .superadmin-board-monitoring .superadmin-device-ratio { margin-top: 6px; }
  .superadmin-template-command-center .superadmin-board-monitoring .superadmin-device-ratio strong { font-size: 32px; }
  .superadmin-template-command-center .superadmin-board-monitoring dl { margin: 4px 18px 0; padding: 0; }
  .superadmin-template-command-center .superadmin-board-monitoring dl div { padding: 5px 0 0; }
}

/* Right-side density: device health is intentionally concise; follow-up receives
   the reclaimed row space to show three complete actionable records. */
@media (min-width: 1181px) {
  .superadmin-template-command-center .superadmin-board-right {
    grid-template-rows: minmax(258px, 1.5fr) minmax(198px, 1.15fr) minmax(126px, .62fr);
  }
  .superadmin-template-command-center .superadmin-board-problems .superadmin-issue-list {
    margin: 0 18px;
  }
  .superadmin-template-command-center .superadmin-board-problems .superadmin-issue-list article {
    min-height: 45px;
    padding: 8px 0;
  }
  .superadmin-template-command-center .superadmin-board-problems .superadmin-issue-list article small {
    display: none;
  }
  .superadmin-template-command-center .superadmin-board-monitoring {
    padding-bottom: 10px;
  }
  .superadmin-template-command-center .superadmin-board-monitoring .superadmin-device-ratio {
    margin-top: 6px;
  }
  .superadmin-template-command-center .superadmin-board-monitoring .superadmin-device-ratio strong {
    font-size: 32px;
  }
  .superadmin-template-command-center .superadmin-board-monitoring dl {
    margin: 4px 18px 0;
    padding: 0;
  }
  .superadmin-template-command-center .superadmin-board-monitoring dl div {
    padding: 5px 0 0;
  }
}

/* Two-row carousel — final cascade position. */
@media (min-width: 1181px) {
  .superadmin-template-command-center .superadmin-board-right {
    grid-template-rows: 258px 134px 140px;
  }
  .superadmin-template-command-center .superadmin-board-management .superadmin-care-operations-viewport {
    flex: 0 0 164px;
    height: 164px;
    margin: 8px 18px 10px;
  }
  .superadmin-template-command-center .superadmin-board-management .superadmin-care-operations-list {
    padding: 0 18px;
    animation: superadmin-care-operations-two-row-scroll 16s steps(1, end) infinite;
  }
  .superadmin-template-command-center .superadmin-board-management .superadmin-care-operations-list article {
    height: 82px;
    min-height: 82px;
    padding: 10px 0;
  }
}

/* Final care-operations layout: a fuller panel with two complete rows and
   an intentional smooth upward carousel. Kept last to supersede legacy passes. */
@media (min-width: 1181px) {
  .superadmin-template-command-center .superadmin-board-right {
    grid-template-rows: minmax(258px, 1.5fr) minmax(198px, 1.15fr) minmax(126px, .62fr);
  }
  .superadmin-template-command-center .superadmin-board-management {
    display: flex;
    flex-direction: column;
    padding-bottom: 8px;
  }
  .superadmin-template-command-center .superadmin-board-management .superadmin-care-operations-viewport {
    flex: 1 1 auto;
    height: auto;
    min-height: 192px;
    margin: 6px 18px 8px;
    overflow: hidden;
  }
  .superadmin-template-command-center .superadmin-board-management .superadmin-care-operations-list {
    display: grid;
    gap: 0;
    padding: 0 18px;
    animation: superadmin-care-operations-two-row-flow 10s cubic-bezier(.42, 0, .2, 1) infinite;
    will-change: transform;
  }
  .superadmin-template-command-center .superadmin-board-management .superadmin-care-operations-list article {
    height: 96px;
    min-height: 96px;
    box-sizing: border-box;
    padding: 12px 24px 12px 0;
  }
  .superadmin-template-command-center .superadmin-board-monitoring {
    overflow: hidden;
    padding-bottom: 4px;
  }
  .superadmin-template-command-center .superadmin-board-monitoring > header {
    min-height: 38px;
    padding: 6px 14px;
  }
  .superadmin-template-command-center .superadmin-board-monitoring > header p { display: none; }
  .superadmin-template-command-center .superadmin-board-monitoring h2 { font-size: 16px; }
  .superadmin-template-command-center .superadmin-board-monitoring .superadmin-device-ratio {
    display: flex;
    align-items: baseline;
    gap: 7px;
    margin: 3px 18px 0;
  }
  .superadmin-template-command-center .superadmin-board-monitoring .superadmin-device-ratio strong { font-size: 27px; }
  .superadmin-template-command-center .superadmin-board-monitoring dl {
    margin: 2px 18px 0;
    padding: 0;
  }
  .superadmin-template-command-center .superadmin-board-monitoring dl div { padding: 2px 0 0; }
}
@keyframes superadmin-care-operations-two-row-flow {
  0%, 16% { transform: translateY(0); }
  24%, 41% { transform: translateY(-96px); }
  49%, 66% { transform: translateY(-192px); }
  74%, 100% { transform: translateY(-288px); }
}
@media (prefers-reduced-motion: reduce) {
  .superadmin-template-command-center .superadmin-board-management .superadmin-care-operations-list { animation: none; }
}

/* Final desktop priority: two complete care-operation rows. */
@media (min-width: 1181px) {
  .superadmin-template-command-center .superadmin-board-right {
    grid-template-rows: minmax(0, 1.45fr) minmax(0, .85fr) minmax(0, 1.07fr);
  }
  .superadmin-template-command-center .superadmin-board-management .superadmin-care-operations-viewport {
    flex: 0 0 164px;
    height: 164px;
    margin: 8px 18px 10px;
  }
  .superadmin-template-command-center .superadmin-board-management .superadmin-care-operations-list {
    padding: 0 18px;
    animation: superadmin-care-operations-two-row-scroll 16s cubic-bezier(.42, 0, .2, 1) infinite;
  }
  .superadmin-template-command-center .superadmin-board-management .superadmin-care-operations-list article {
    height: 82px;
    min-height: 82px;
    padding: 10px 0;
  }
}

/* Two-row carousel final precedence. */
@media (min-width: 1181px) {
  .superadmin-template-command-center .superadmin-board-management .superadmin-care-operations-viewport {
    flex: 0 0 164px;
    height: 164px;
    margin: 8px 18px 10px;
  }
  .superadmin-template-command-center .superadmin-board-management .superadmin-care-operations-list {
    padding: 0 18px;
    animation: superadmin-care-operations-two-row-scroll 16s cubic-bezier(.42, 0, .2, 1) infinite;
  }
  .superadmin-template-command-center .superadmin-board-management .superadmin-care-operations-list article {
    height: 82px;
    min-height: 82px;
    padding: 10px 0;
  }
}

/* Two-row care-operation carousel: two whole records remain visible while
   the list rises one record at a time through a seamless duplicate row. */
@media (min-width: 1181px) {
  .superadmin-template-command-center .superadmin-board-right {
    grid-template-rows: minmax(0, 1.45fr) minmax(0, .85fr) minmax(0, 1.07fr);
  }
  .superadmin-template-command-center .superadmin-board-management .superadmin-care-operations-viewport {
    flex: 0 0 164px;
    height: 164px;
    margin: 8px 18px 10px;
  }
  .superadmin-template-command-center .superadmin-board-management .superadmin-care-operations-list {
    display: grid;
    gap: 0;
    padding: 0 18px;
    animation: superadmin-care-operations-two-row-scroll 16s cubic-bezier(.42, 0, .2, 1) infinite;
  }
  .superadmin-template-command-center .superadmin-board-management .superadmin-care-operations-list article {
    height: 82px;
    min-height: 82px;
    box-sizing: border-box;
    padding: 10px 0;
  }
  .superadmin-template-command-center .superadmin-care-operations-viewport:hover .superadmin-care-operations-list,
  .superadmin-template-command-center .superadmin-care-operations-viewport:focus-within .superadmin-care-operations-list { animation-play-state: paused; }
}
@keyframes superadmin-care-operations-two-row-scroll {
  0%, 33.32% { transform: translateY(0); }
  33.33%, 66.65% { transform: translateY(-82px); }
  66.66%, 100% { transform: translateY(-164px); }
}
@media (prefers-reduced-motion: reduce) {
  .superadmin-template-command-center .superadmin-board-management .superadmin-care-operations-list { animation: none; }
}

/* The final selector wins over generic management-list spacing. */
@media (min-width: 1181px) {
  .superadmin-template-command-center .superadmin-board-management .superadmin-care-operations-list {
    padding: 0 18px;
    animation: superadmin-care-operations-seamless-scroll 16s cubic-bezier(.42, 0, .2, 1) infinite;
  }
  .superadmin-template-command-center .superadmin-board-management .superadmin-care-operations-list article {
    height: 92px;
    min-height: 92px;
    padding: 14px 0;
  }
}

/* Final seamless scroll: all rows share the viewport baseline; the duplicate
   first row makes the loop reset invisible instead of exposing a cut edge. */
@media (min-width: 1181px) {
  .superadmin-template-command-center .superadmin-care-operations-list {
    display: grid;
    gap: 0;
    padding: 0 18px;
    animation: superadmin-care-operations-seamless-scroll 16s cubic-bezier(.42, 0, .2, 1) infinite;
  }
  .superadmin-template-command-center .superadmin-care-operations-list article {
    height: 92px;
    min-height: 92px;
    box-sizing: border-box;
    padding: 14px 0;
  }
  .superadmin-template-command-center .superadmin-care-operations-loop-clone { pointer-events: none; }
}
@keyframes superadmin-care-operations-seamless-scroll {
  0%, 20% { transform: translateY(0); }
  25%, 45% { transform: translateY(-92px); }
  50%, 70% { transform: translateY(-184px); }
  75%, 100% { transform: translateY(-276px); }
}
@media (prefers-reduced-motion: reduce) {
  .superadmin-template-command-center .superadmin-care-operations-list { animation: none; }
}

@media (min-width: 1181px) {
  .superadmin-template-command-center .superadmin-care-operations-list {
    display: grid;
    gap: 0;
    padding: 0 18px;
    animation: superadmin-care-operations-scroll 16s cubic-bezier(.42, 0, .2, 1) infinite;
  }
  .superadmin-template-command-center .superadmin-care-operations-list article {
    height: 92px;
    min-height: 92px;
    box-sizing: border-box;
    padding: 14px 0;
  }
  .superadmin-template-command-center .superadmin-care-operations-loop-clone { pointer-events: none; }
}

/* Care operations rotates complete summary rows inside its own glass viewport.
   The outer panel never scrolls, clips, or exposes a partial row at rest. */
@media (min-width: 1181px) {
  .superadmin-template-command-center .superadmin-board-management {
    display: flex;
    flex-direction: column;
  }
  .superadmin-template-command-center .superadmin-care-operations-viewport {
    position: relative;
    flex: 0 0 92px;
    min-height: 0;
    height: 92px;
    margin: 10px 18px 16px;
    overflow: hidden;
  }
  .superadmin-template-command-center .superadmin-care-operations-list {
    display: grid;
    gap: 0;
    padding: 0 18px;
    animation: superadmin-care-operations-scroll 12s cubic-bezier(.42, 0, .2, 1) infinite;
  }
  .superadmin-template-command-center .superadmin-care-operations-list article {
    min-height: 0;
    height: 92px;
    box-sizing: border-box;
    padding: 14px 24px 14px 0;
  }
  .superadmin-template-command-center .superadmin-care-operations-viewport:hover .superadmin-care-operations-list,
  .superadmin-template-command-center .superadmin-care-operations-viewport:focus-within .superadmin-care-operations-list { animation-play-state: paused; }
}
@keyframes superadmin-care-operations-scroll {
  0%, 24% { transform: translateY(0); }
  29%, 57% { transform: translateY(-92px); }
  62%, 90% { transform: translateY(-184px); }
  100% { transform: translateY(0); }
}
@media (prefers-reduced-motion: reduce) {
  .superadmin-template-command-center .superadmin-care-operations-list { animation: none; }
}
@media (min-width: 1181px) {
  .superadmin-template-command-center .superadmin-board-left { grid-template-rows: minmax(0, 1.05fr) minmax(0, .82fr) minmax(0, 1.12fr); }
  .superadmin-template-command-center .superadmin-board-right { grid-template-rows: minmax(0, 1.19fr) minmax(0, .76fr) minmax(0, 1.42fr); }
  .superadmin-template-command-center .superadmin-board-duty { padding-bottom: 16px; }
  .superadmin-template-command-center .superadmin-board-duty dl { padding: 10px 18px 0; }
  .superadmin-template-command-center .superadmin-board-duty dl div { padding: 10px 0; }
  .superadmin-template-command-center .superadmin-board-duty .superadmin-side-actions { margin: 14px 18px 0; }
  .superadmin-template-command-center .superadmin-board-management { padding-bottom: 16px; }
  .superadmin-template-command-center .superadmin-management-list { padding: 8px 18px 0; }
  .superadmin-template-command-center .superadmin-management-list article { padding: 12px 0; }
}

/* Priority state is data-driven: zero is a normal platform-blue summary;
   any real pending item promotes the entire card to an urgent red beacon. */
.superadmin-template-command-center .superadmin-stage-core.is-normal .superadmin-stage-status {
  border-color: #a8d8f0;
  color: #397ba9;
  background: rgba(246, 251, 255, .56);
  box-shadow: 0 8px 20px rgba(71, 132, 178, .08);
  animation: none;
}
.superadmin-template-command-center .superadmin-stage-core.is-normal .superadmin-stage-status strong { color: #2f7fb8; }
.superadmin-template-command-center .superadmin-stage-core.is-risk .superadmin-stage-status {
  border-color: rgba(208, 67, 85, .9);
  color: #ad4050;
  background: linear-gradient(145deg, rgba(255, 230, 235, .72), rgba(255, 247, 248, .62));
  box-shadow: 0 0 0 1px rgba(217, 106, 120, .22), 0 10px 26px rgba(202, 78, 94, .2);
  animation: superadmin-priority-flash 1.25s ease-in-out infinite;
}
.superadmin-template-command-center .superadmin-stage-core.is-risk .superadmin-stage-status strong { color: #cf4357; }
@keyframes superadmin-priority-flash {
  0%, 100% { border-color: rgba(208, 67, 85, .78); background: rgba(255, 241, 244, .66); box-shadow: 0 0 0 1px rgba(217, 106, 120, .16), 0 8px 20px rgba(202, 78, 94, .14); }
  50% { border-color: #ca354a; background: rgba(255, 222, 228, .78); box-shadow: 0 0 0 7px rgba(217, 106, 120, .13), 0 12px 30px rgba(202, 78, 94, .3); }
}
@media (prefers-reduced-motion: reduce) {
  .superadmin-template-command-center .superadmin-stage-core.is-risk .superadmin-stage-status { animation: none; }
}

/* Two-row carousel — final cascade position. */
@media (min-width: 1181px) {
  .superadmin-template-command-center .superadmin-board-management {
    display: flex;
    flex-direction: column;
    padding-bottom: 8px;
  }
  .superadmin-template-command-center .superadmin-board-management .superadmin-care-operations-viewport {
    flex: 1 1 auto;
    height: auto;
    min-height: 192px;
    margin: 6px 18px 8px;
    overflow: hidden;
  }
  .superadmin-template-command-center .superadmin-board-management .superadmin-care-operations-list {
    display: grid;
    gap: 0;
    padding: 0 18px;
    animation: superadmin-care-operations-two-row-flow 10s cubic-bezier(.42, 0, .2, 1) infinite;
    will-change: transform;
  }
  .superadmin-template-command-center .superadmin-board-management .superadmin-care-operations-list article {
    height: 96px;
    min-height: 96px;
    box-sizing: border-box;
    padding: 12px 24px 12px 0;
  }
  .superadmin-template-command-center .superadmin-board-problems { overflow: hidden; }
  .superadmin-template-command-center .superadmin-board-problems > header { min-height: 32px; padding: 4px 14px; }
  .superadmin-template-command-center .superadmin-board-problems > header p { display: none; }
  .superadmin-template-command-center .superadmin-board-problems h2 { font-size: 16px; }
  .superadmin-template-command-center .superadmin-board-problems .superadmin-issue-list { margin: 0 18px; }
  .superadmin-template-command-center .superadmin-board-right { grid-template-rows: minmax(238px, 1.3fr) minmax(156px, .84fr) minmax(136px, .7fr); }
  .superadmin-template-command-center .superadmin-board-monitoring { order: 1; }
  .superadmin-template-command-center .superadmin-board-problems { order: 2; }
  .superadmin-template-command-center .superadmin-board-management { order: 3; }
  .superadmin-template-command-center .superadmin-board-problems .superadmin-issue-list article { min-height: 30px; padding: 2px 0; }
  .superadmin-template-command-center .superadmin-board-problems .superadmin-issue-list article small { display: none; }
  .superadmin-template-command-center .superadmin-board-problems .superadmin-issue-list article strong { font-size: 12px; }
  .superadmin-template-command-center .superadmin-board-problems .superadmin-issue-list article time { display: none; }
  .superadmin-template-command-center .superadmin-board-monitoring { overflow: hidden; padding-bottom: 12px; }
  .superadmin-template-command-center .superadmin-board-monitoring > header { min-height: 48px; padding: 9px 18px; }
  .superadmin-template-command-center .superadmin-board-monitoring > header p { display: block; }
  .superadmin-template-command-center .superadmin-board-monitoring h2 { font-size: 17px; }
  .superadmin-template-command-center .superadmin-board-monitoring .superadmin-device-ratio { display: flex; align-items: baseline; gap: 6px; margin: 0 18px; }
  .superadmin-template-command-center .superadmin-board-monitoring .superadmin-device-ratio strong { font-size: 22px; }
  .superadmin-template-command-center .superadmin-board-monitoring dl { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin: 2px 18px 0; padding: 0; }
  .superadmin-template-command-center .superadmin-board-monitoring dl div { min-width: 0; padding: 0 0 1px; }
  .superadmin-template-command-center .superadmin-board-monitoring dt { font-size: 10px; white-space: nowrap; }
  .superadmin-template-command-center .superadmin-board-monitoring dd { margin-top: 1px; font-size: 12px; }
}
@keyframes superadmin-care-operations-two-row-flow {
  0%, 16% { transform: translateY(0); }
  24%, 41% { transform: translateY(-96px); }
  49%, 66% { transform: translateY(-192px); }
  74%, 100% { transform: translateY(-288px); }
}
@media (prefers-reduced-motion: reduce) {
  .superadmin-template-command-center .superadmin-board-management .superadmin-care-operations-list { animation: none; }
}