:root {
  --bg: #f3f3f3;
  --card: #ffffff;
  --text: #2c2c2c;
  --muted: #6a6a6a;
  --primary: #f42d35;
  --primary-strong: #d81f28;
  --border: #e4e4e4;
  --danger: #a6131b;
  --warn: #b74a00;
  --font-ui: system-ui, -apple-system, 'Segoe UI', sans-serif;
  --sidebar-width: 280px;
}

.public-network-root .dashboard-block .dashboard-metric {
  font-size: 2rem;
  font-weight: 800;
  margin-top: 8px;
}

.public-network-filters {
  margin-bottom: 14px;
}

.public-network-category-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
  gap: 12px;
  margin: 14px 0;
}

.public-network-category-card {
  align-items: flex-start;
  background: #fff;
  border: 1px solid #e3e6eb;
  border-radius: 8px;
  color: #1f2933;
  display: flex;
  flex-direction: column;
  gap: 6px;
  min-height: 132px;
  padding: 14px;
  text-align: left;
  width: 100%;
}

.public-network-category-card:hover {
  border-color: #d81f28;
  box-shadow: 0 8px 20px rgba(31, 41, 51, 0.08);
}

.public-network-category-card span,
.public-network-category-card em {
  color: #5b6573;
  font-size: 0.86rem;
  font-style: normal;
  line-height: 1.35;
}

.public-network-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 14px;
}

.public-network-tabs .pn-tab {
  flex: 1 1 180px;
}

.public-network-tabs .pn-tab.active {
  background: #fff;
  border: 2px solid var(--primary);
  color: var(--primary-strong);
  box-shadow: 0 4px 14px rgba(216, 31, 40, 0.12);
}

.pn-pane {
  display: none;
}

.pn-pane.active {
  display: block;
}

.public-network-details {
  margin-top: 14px;
}

.public-network-details .attachment-item a {
  color: #b71922;
  font-weight: 700;
  text-decoration: none;
}

.public-network-details .attachment-item a:hover {
  text-decoration: underline;
}

.pn-gov-shell {
  color: #172033;
  display: grid;
  gap: 18px;
}

.pn-gov-header {
  align-items: center;
  background: #fff;
  border: 1px solid #e8eef8;
  border-radius: 8px;
  display: flex;
  justify-content: space-between;
  gap: 18px;
  padding: 18px 20px;
}

.pn-gov-header h2 {
  color: #111827;
  margin: 0 0 4px;
}

.pn-gov-header p {
  color: #4b5563;
  margin: 0;
}

.pn-gov-header-actions {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: flex-end;
}

.pn-light-btn,
.pn-notification-btn,
.pn-manage-btn {
  background: #fff;
  border: 1px solid #dce6f7;
  color: #1d3270;
  font-weight: 700;
}

.pn-notification-btn {
  position: relative;
  width: auto;
}

.pn-notification-badge {
  align-items: center;
  background: #ef3340;
  border-radius: 999px;
  color: #fff;
  display: inline-flex;
  font-size: 0.72rem;
  height: 20px;
  justify-content: center;
  margin-left: 6px;
  min-width: 20px;
  padding: 0 6px;
}

.pn-gov-brand {
  align-items: center;
  display: flex;
  justify-content: flex-end;
  min-width: 170px;
}

.pn-gov-brand img {
  display: block;
  height: auto;
  max-height: 78px;
  max-width: 220px;
  object-fit: contain;
  width: 100%;
}

.pn-gov-layout {
  align-items: start;
  display: grid;
  gap: 18px;
  grid-template-columns: minmax(0, 1fr) minmax(300px, 360px);
}

.pn-gov-main,
.pn-side-rail {
  display: grid;
  gap: 18px;
}

.pn-summary-panel {
  align-items: center;
  background: #f4f8ff;
  border: 1px solid #d8e6ff;
  border-radius: 8px;
  display: grid;
  gap: 16px;
  grid-template-columns: minmax(260px, 1fr) auto minmax(420px, 0.9fr);
  padding: 16px;
}

.pn-summary-info {
  align-items: center;
  display: flex;
  gap: 14px;
}

.pn-summary-info p {
  color: #334155;
  margin: 4px 0 0;
}

.pn-info-icon,
.pn-stat-card > span,
.pn-service-icon,
.pn-recent-icon,
.pn-doc-list span {
  align-items: center;
  border-radius: 999px;
  display: inline-flex;
  font-weight: 800;
  justify-content: center;
  min-width: 42px;
}

.pn-info-icon {
  background: #2f6fed;
  color: #fff;
  height: 42px;
}

.pn-summary-actions {
  display: flex;
  gap: 8px;
}

.pn-summary-actions button {
  min-width: 150px;
  width: auto;
}

.pn-stat-row {
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(3, minmax(130px, 1fr));
}

.pn-stat-card {
  align-items: center;
  background: #fff;
  border: 1px solid #e1e9f7;
  border-radius: 8px;
  display: flex;
  gap: 12px;
  min-height: 78px;
  padding: 12px;
}

.pn-stat-card span {
  height: 44px;
}

.pn-stat-card small {
  color: #334155;
  display: block;
  line-height: 1.25;
}

.pn-stat-card strong {
  display: block;
  font-size: 1.5rem;
  line-height: 1.1;
}

.pn-stat-blue span { background: #dbeafe; color: #2352b8; }
.pn-stat-amber span { background: #fff1d6; color: #b45309; }
.pn-stat-green span { background: #dcfce7; color: #15803d; }

.pn-gov-category-grid {
  display: grid;
  gap: 16px;
  grid-template-columns: repeat(3, minmax(220px, 1fr));
}

.pn-service-card {
  border: 1px solid #e5e9f2;
  border-radius: 8px;
  display: grid;
  gap: 18px;
  min-height: 176px;
  padding: 18px;
}

.pn-service-card-head {
  align-items: flex-start;
  display: flex;
  gap: 14px;
}

.pn-service-card h3 {
  margin: 0 0 8px;
}

.pn-service-card p {
  color: #374151;
  line-height: 1.45;
  margin: 0;
}

.pn-service-icon {
  color: #fff;
  flex: 0 0 58px;
  height: 58px;
}

.pn-service-card-actions {
  align-items: center;
  display: flex;
  gap: 12px;
  justify-content: space-between;
}

.pn-access-btn {
  background: #fff;
  border: 1px solid #d8e1f0;
  color: #1d3270;
  font-weight: 800;
  max-width: 150px;
}

.pn-service-card-actions span {
  background: rgba(255, 255, 255, 0.72);
  border: 1px solid rgba(31, 41, 55, 0.08);
  border-radius: 999px;
  color: #334155;
  font-size: 0.82rem;
  padding: 7px 10px;
  white-space: nowrap;
}

.pn-card-green { background: #f2fbf4; border-color: #d5eedb; }
.pn-card-green .pn-service-icon { background: #11a85b; }
.pn-card-blue { background: #f3f8ff; border-color: #d9e8ff; }
.pn-card-blue .pn-service-icon { background: #3478dd; }
.pn-card-amber { background: #fff9e8; border-color: #f4df9d; }
.pn-card-amber .pn-service-icon { background: #f1ae00; }
.pn-card-purple { background: #faf5ff; border-color: #e8d8ff; }
.pn-card-purple .pn-service-icon { background: #7c3bd1; }
.pn-card-teal { background: #effcf8; border-color: #d0efe7; }
.pn-card-teal .pn-service-icon { background: #059669; }
.pn-card-orange { background: #fff7ed; border-color: #fed7aa; }
.pn-card-orange .pn-service-icon { background: #e66a15; }
.pn-card-rose { background: #fff1f4; border-color: #ffd4df; }
.pn-card-rose .pn-service-icon { background: #df4772; }
.pn-card-cyan { background: #effafa; border-color: #c8eceb; }
.pn-card-cyan .pn-service-icon { background: #0f9c9a; }
.pn-card-violet { background: #f7f2ff; border-color: #e5d8ff; }
.pn-card-violet .pn-service-icon { background: #5b3bb3; }

.pn-overview-grid {
  display: grid;
  gap: 18px;
  grid-template-columns: minmax(0, 1.5fr) minmax(260px, 1fr);
}

.pn-white-card,
.pn-help-card {
  background: #fff;
  border: 1px solid #e6edf7;
  border-radius: 8px;
  box-shadow: 0 8px 24px rgba(15, 23, 42, 0.04);
  padding: 16px;
}

.pn-white-card h3,
.pn-help-card h3 {
  margin-top: 0;
}

.pn-flow-track {
  align-items: stretch;
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(4, minmax(110px, 1fr));
}

.pn-flow-step {
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  color: #1f2937;
  display: grid;
  gap: 5px;
  justify-items: center;
  min-height: 110px;
}

.pn-flow-step span {
  align-items: center;
  border-radius: 999px;
  display: inline-flex;
  font-weight: 800;
  height: 44px;
  justify-content: center;
  width: 44px;
}

.pn-flow-step small {
  color: #64748b;
}

.pn-flow-blue span { background: #dbeafe; color: #2563eb; }
.pn-flow-amber span { background: #fef3c7; color: #b45309; }
.pn-flow-rose span { background: #ffe4e6; color: #be123c; }
.pn-flow-green span { background: #dcfce7; color: #15803d; }

.pn-doc-list,
.pn-recent-list,
.pn-integration-list {
  display: grid;
  gap: 8px;
}

.pn-doc-list button,
.pn-recent-list button,
.pn-integration-list button {
  align-items: center;
  background: #fff;
  border: 1px solid #e5edf8;
  color: #172033;
  display: grid;
  gap: 10px;
  grid-template-columns: auto minmax(0, 1fr) auto;
  min-height: 62px;
  text-align: left;
}

.pn-doc-list span,
.pn-recent-icon {
  background: #dbeafe;
  color: #2563eb;
  height: 40px;
}

.pn-doc-list small,
.pn-recent-list small {
  color: #64748b;
  display: block;
  margin-top: 2px;
}

.pn-doc-list em,
.pn-card-title-row button,
.pn-integration-list em {
  background: #eef4ff;
  border-radius: 8px;
  color: #2854b8;
  font-style: normal;
  font-weight: 800;
  padding: 7px 10px;
  white-space: nowrap;
}

.pn-card-title-row {
  align-items: center;
  display: flex;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 10px;
}

.pn-card-title-row h3 {
  margin: 0;
}

.pn-card-title-row button {
  border: 0;
  width: auto;
}

.pn-status-chip {
  border-radius: 8px;
  font-style: normal;
  font-weight: 800;
  padding: 7px 9px;
}

.pn-status-success { background: #dcfce7; color: #15803d; }
.pn-status-danger { background: #ffe4e6; color: #be123c; }
.pn-status-info { background: #dbeafe; color: #2563eb; }
.pn-status-warn { background: #fef3c7; color: #b45309; }
.pn-status-neutral { background: #f1f5f9; color: #475569; }

.pn-integration-list button {
  grid-template-columns: minmax(0, 1fr) auto;
}

.pn-integration-active { background: #dcfce7; color: #15803d; }
.pn-integration-configured { background: #fef3c7; color: #92400e; }
.pn-integration-inactive { background: #eef2f7; color: #475569; }

.pn-manage-btn {
  margin-top: 12px;
}

.pn-help-card {
  background: #f5fbff;
}

.pn-help-card ol {
  display: grid;
  gap: 10px;
  list-style: none;
  margin: 0 0 14px;
  padding: 0;
}

.pn-help-card li {
  align-items: center;
  color: #334155;
  display: flex;
  gap: 10px;
}

.pn-help-card li span {
  background: #dbeafe;
  border-radius: 6px;
  color: #2563eb;
  font-weight: 800;
  padding: 4px 8px;
}

.pn-help-card button {
  background: transparent;
  border: 0;
  color: #2854b8;
  font-weight: 800;
  padding-left: 0;
  text-align: left;
}

.pn-workspace {
  display: grid;
  gap: 14px;
}

@media (max-width: 1300px) {
  .pn-gov-layout,
  .pn-overview-grid {
    grid-template-columns: 1fr;
  }

  .pn-side-rail {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .pn-summary-panel {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 980px) {
  .pn-gov-header {
    align-items: flex-start;
    flex-direction: column;
  }

  .pn-gov-header-actions {
    justify-content: flex-start;
    width: 100%;
  }

  .pn-gov-category-grid,
  .pn-side-rail {
    grid-template-columns: 1fr;
  }

  .pn-flow-track,
  .pn-stat-row {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 640px) {
  .pn-summary-actions,
  .pn-service-card-actions,
  .pn-gov-header-actions {
    align-items: stretch;
    flex-direction: column;
  }

  .pn-summary-actions button,
  .pn-access-btn,
  .pn-light-btn,
  .pn-notification-btn {
    max-width: none;
    width: 100%;
  }

  .pn-flow-track,
  .pn-stat-row {
    grid-template-columns: 1fr;
  }

  .pn-doc-list button,
  .pn-recent-list button {
    grid-template-columns: auto minmax(0, 1fr);
  }

  .pn-doc-list em,
  .pn-status-chip {
    grid-column: 1 / -1;
    justify-self: start;
  }
}

* { box-sizing: border-box; }
body {
  margin: 0;
  font-family: var(--font-ui);
  color: var(--text);
  background:
    radial-gradient(circle at 10% 0%, #ffe5e6 0%, transparent 33%),
    radial-gradient(circle at 100% 20%, #f8ebeb 0%, transparent 28%),
    var(--bg);
}

.status-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 88px;
  padding: 4px 10px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 700;
  border: 1px solid transparent;
  text-transform: capitalize;
}

.status-pill.is-ok,
.status-pill.is-active {
  background: #e7f8ee;
  color: #17613a;
  border-color: #b8e4c9;
}

.status-pill.is-warning {
  background: #fff4dd;
  color: #8c5a00;
  border-color: #f3d999;
}

.status-pill.is-expired,
.status-pill.is-inactive {
  background: #fde7e8;
  color: #9d1b22;
  border-color: #f1b9bd;
}

.asset-disposal-feedback {
  margin-top: 10px;
  color: var(--muted);
}

.asset-disposal-feedback.is-error {
  color: var(--danger);
  font-weight: 600;
}

.asset-disposal-feedback.is-warning {
  color: var(--warn);
  font-weight: 600;
}

.asset-disposal-feedback.is-success {
  color: #17613a;
  font-weight: 600;
}

.asset-disposal-preview-wrap {
  margin-top: 12px;
}

body.auth-locked #appLayout,
body.auth-locked #dashboardConfigModal,
body.auth-locked #dashboardOccurrenceModal,
body.auth-locked #assetLabelModal,
body.auth-locked #mobileNavBackdrop {
  display: none !important;
  opacity: 0;
  pointer-events: none;
  user-select: none;
  visibility: hidden;
}

.layout {
  display: grid;
  grid-template-columns: var(--sidebar-width) 1fr;
  min-height: 100vh;
}

.sidebar {
  padding: 24px;
  background: linear-gradient(180deg, #f42d35 0%, #cc1f27 100%);
  color: #fff7f7;
  border-right: 1px solid #c71e26;
  position: relative;
  z-index: 1;
}

.mobile-nav-backdrop,
.mobile-topbar,
.mobile-sidebar-header {
  display: none;
}

.mobile-sidebar-title {
  display: block;
  font-size: 16px;
  margin-bottom: 4px;
}

.sidebar h1 {
  margin: 0 0 8px;
  font-size: 24px;
}

.brand-logo {
  width: 100%;
  max-width: 220px;
  display: block;
  margin: 0 0 12px;
  background: rgba(255, 255, 255, 0.92);
  border-radius: 12px;
  padding: 8px;
}

.menu {
  margin-top: 24px;
  display: grid;
  gap: 10px;
}

.menu-item {
  width: 100%;
  text-align: left;
  padding: 12px;
  border-radius: 10px;
  border: 1px solid rgba(255, 255, 255, 0.2);
  background: rgba(255, 255, 255, 0.16);
  color: #fff7f7;
  font-weight: 700;
  cursor: pointer;
}

.menu-item:hover {
  background: rgba(255, 255, 255, 0.16);
  border-color: rgba(255, 255, 255, 0.2);
}

.menu-item.active {
  background: #fff7f7;
  border-color: #fff7f7;
  color: var(--primary-strong);
}

.mobile-menu-toggle,
.mobile-sidebar-close {
  width: auto;
  min-width: 0;
  padding-inline: 14px;
}

.mobile-topbar-copy {
  min-width: 0;
  display: grid;
  gap: 2px;
}

.mobile-topbar-copy strong {
  font-size: 16px;
  line-height: 1.2;
}

.content {
  padding: 24px;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  gap: 24px;
  padding-bottom: 88px;
}

.app-footer {
  margin-top: auto;
  padding: 18px 0 8px;
  border-top: 1px solid var(--border);
  color: var(--muted);
  font-size: 13px;
  text-align: center;
  line-height: 1.5;
}

.app-footer p {
  margin: 0;
}

.app-footer-fixed {
  position: fixed;
  left: calc(var(--sidebar-width) + 24px);
  right: 24px;
  bottom: 0;
  z-index: 15;
  margin-top: 0;
  padding: 12px 0 10px;
  background: rgba(243, 243, 243, 0.96);
  backdrop-filter: blur(6px);
}

.app-footer-overlay {
  position: fixed;
  left: 24px;
  right: 24px;
  bottom: 20px;
  border-top-color: rgba(255, 247, 247, 0.28);
  color: rgba(255, 247, 247, 0.92);
}

.app-footer-overlay p:last-child {
  text-transform: lowercase;
  letter-spacing: 0.02em;
}

.login-overlay {
  position: fixed;
  inset: 0;
  z-index: 40;
  display: grid;
  place-items: center;
  padding: 24px;
  background:
    radial-gradient(circle at center, rgba(255,255,255,0.10), transparent 35%),
    linear-gradient(135deg, #7f1d1d 0%, #991b1b 45%, #450a0a 100%);
  backdrop-filter: blur(8px);
}

.login-card {
  width: min(100%, 440px);
  padding: 36px;
  border-radius: 26px;
  background: linear-gradient(180deg, rgba(255, 253, 252, 0.98) 0%, rgba(255, 249, 248, 0.98) 100%);
  border: 1px solid rgba(255, 255, 255, 0.72);
  box-shadow: 0 28px 70px rgba(53, 10, 10, 0.26);
}

.login-brand {
  display: flex;
  justify-content: center;
  margin: 0 0 18px;
}

.login-logo {
  width: min(100%, 272px);
  display: block;
  border-radius: 12px;
  background: #fff;
  padding: 6px;
  border: 1px solid #f2d9db;
}

.login-eyebrow {
  display: inline-flex;
  align-items: center;
  margin: 0 0 10px;
  padding: 6px 10px;
  border-radius: 999px;
  background: #fee2e2;
  border: 1px solid #fecaca;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--primary-strong);
}

.login-card h2 {
  margin: 0 0 8px;
  font-size: clamp(30px, 4vw, 36px);
  line-height: 1.08;
  color: #341313;
}

.login-subtitle {
  margin: 0 0 4px;
  font-size: 16px;
  font-weight: 700;
  color: #4b1c1c;
}

.login-helper {
  margin: 0 0 18px;
  color: #6f4a4a;
}

.login-form {
  display: grid;
  gap: 12px;
  margin-top: 0;
}

.login-form label {
  color: #4b1c1c;
  font-size: 14px;
  font-weight: 600;
}

.login-form input {
  min-height: 44px;
  padding: 11px 14px;
  border-radius: 10px;
  border-color: #e8cfd1;
  background: #fff;
}

.login-form input:focus {
  border-color: var(--primary);
  box-shadow: 0 0 0 4px rgba(244, 45, 53, 0.14);
}

#loginSubmitBtn {
  min-height: 44px;
  margin-top: 6px;
  border-radius: 10px;
  font-size: 15px;
  font-weight: 700;
  background: linear-gradient(180deg, #f42d35 0%, #d91f28 100%) !important;
  box-shadow: 0 14px 28px rgba(183, 24, 32, 0.22);
}

#loginSubmitBtn:hover,
#loginSubmitBtn:focus {
  background: linear-gradient(180deg, #d91f28 0%, #b71920 100%) !important;
}

#loginSubmitBtn:disabled {
  opacity: 0.68;
  cursor: not-allowed;
  box-shadow: none;
}

.login-message {
  min-height: 0;
  margin-top: 16px;
  padding: 12px 14px;
  border-radius: 10px;
  border: 1px solid transparent;
  font-size: 13px;
  line-height: 1.45;
}

.login-message.hidden {
  display: none !important;
}

.login-message.is-info {
  background: #fff5f5;
  border-color: #f3c8cc;
  color: #7f1d1d;
}

.login-message.is-error {
  background: #fff1f2;
  border-color: #fecdd3;
  color: #a6131b;
}

.password-change-modal {
  position: fixed;
  inset: 0;
  z-index: 1200;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
  background: rgba(15, 23, 42, 0.72);
}

.password-change-dialog {
  width: min(100%, 460px);
  background: #ffffff;
  border-radius: 8px;
  box-shadow: 0 24px 70px rgba(15, 23, 42, 0.35);
  padding: 28px;
}

.password-change-head h2 {
  margin: 4px 0 8px;
  color: #111827;
  font-size: 1.45rem;
}

.password-change-form {
  display: grid;
  gap: 10px;
  margin-top: 18px;
}

.password-change-form label {
  font-weight: 700;
  color: #374151;
}

.password-change-form input {
  width: 100%;
  border: 1px solid #d1d5db;
  border-radius: 8px;
  padding: 11px 12px;
  font-size: 1rem;
}

.password-change-form input:focus {
  outline: none;
  border-color: #b91c1c;
  box-shadow: 0 0 0 3px rgba(185, 28, 28, 0.16);
}

.password-rules {
  color: #4b5563;
}

.password-change-actions {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 10px;
  align-items: center;
  margin-top: 8px;
}

.password-change-actions button {
  min-height: 44px;
}

.session-box {
  margin-top: 16px;
  padding: 12px;
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.12);
  border: 1px solid rgba(255, 255, 255, 0.18);
}

.session-user {
  margin-bottom: 8px;
  font-size: 13px;
  font-weight: 700;
  line-height: 1.4;
}

.session-logout {
  background: rgba(255, 255, 255, 0.16);
  border: 1px solid rgba(255, 255, 255, 0.2);
}

.session-logout:hover {
  background: rgba(255, 255, 255, 0.16);
}

.section { display: none; }
.section.active { display: block; }
.section-head { margin-bottom: 16px; }
.section-head-actions {
  display: flex;
  justify-content: space-between;
  align-items: end;
  gap: 12px;
  flex-wrap: wrap;
}

h2, h3 { margin: 0 0 10px; }
.card {
  background: linear-gradient(180deg, #ffffff 0%, #fcfefc 100%);
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: 16px;
  margin-bottom: 16px;
  box-shadow: 0 10px 24px rgba(140, 20, 26, 0.08);
}

.grid { display: grid; gap: 14px; }
.grid-2 { grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); }
.grid-3 { grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); }
.grid-4 { grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); }
.grid-span-2 { grid-column: span 2; }
.grid-span-3 { grid-column: span 3; }

.triage-identification-card {
  display: grid;
  gap: 16px;
}

.triage-form-groups {
  display: grid;
  gap: 16px;
}

.triage-form-group {
  margin: 0;
  padding: 16px;
  border: 1px solid #f0dcdd;
  border-radius: 14px;
  background: #fffdfd;
}

.triage-form-group legend {
  padding: 0 8px;
  font-weight: 700;
  color: #8b151c;
}

.triage-form-group-full {
  display: grid;
  gap: 12px;
}

.triage-actions-bar {
  align-items: center;
}

input, select, textarea, button {
  width: 100%;
  padding: 10px;
  border-radius: 8px;
  border: 1px solid var(--border);
  font-size: 14px;
  font-family: inherit;
}
input:focus, select:focus, textarea:focus {
  outline: none;
  border-color: #f06a70;
  box-shadow: 0 0 0 3px rgba(244, 45, 53, 0.18);
}

textarea { min-height: 90px; resize: vertical; }

button,
input[type="button"],
input[type="submit"],
input[type="reset"] {
  background: var(--primary) !important;
  background-color: var(--primary) !important;
  background-image: none !important;
  color: #fff !important;
  border: none !important;
  font-weight: 700;
  cursor: pointer;
  appearance: none;
  -webkit-appearance: none;
  box-shadow: none;
  opacity: 1;
}

button:hover,
button:focus,
button:active,
input[type="button"]:hover,
input[type="button"]:focus,
input[type="button"]:active,
input[type="submit"]:hover,
input[type="submit"]:focus,
input[type="submit"]:active,
input[type="reset"]:hover,
input[type="reset"]:focus,
input[type="reset"]:active {
  background: var(--primary) !important;
  background-color: var(--primary) !important;
  background-image: none !important;
  color: #fff !important;
  border: none !important;
}

button.danger,
button.danger:hover,
button.danger:focus,
button.danger:active {
  background: var(--danger) !important;
  background-color: var(--danger) !important;
  background-image: none !important;
  color: #fff !important;
  border: none !important;
}

button.secondary {
  background: #fff4f4;
  color: #9f1c22;
  border: 1px solid #f3c9cc;
}

button.secondary:hover,
button.secondary:focus,
button.secondary:active {
  background: #ffe8ea;
  color: #8f161d;
}

button.tiny {
  width: auto;
  padding: 5px 10px;
  font-size: 12px;
}

.row { display: flex; gap: 8px; }
.row > * { flex: 1; }

.finance-subtabs {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-bottom: 18px;
}

.finance-subtab-btn {
  width: auto;
  min-width: 136px;
  padding-inline: 16px;
  background: #fff4f4;
  color: #9f1c22;
  border: 1px solid #f3c9cc;
}

.finance-subtab-btn:hover,
.finance-subtab-btn:focus,
.finance-subtab-btn:active {
  background: #ffe8ea;
  color: #8f161d;
}

.finance-subtab-btn.active {
  background: var(--primary) !important;
  color: #fff !important;
  border-color: var(--primary) !important;
}

.finance-pane {
  display: none;
}

.finance-pane.active {
  display: block;
}

#triagePrevStepBtn,
#triageNextStepBtn,
#triageSaveNowBtn {
  background: var(--primary) !important;
  color: #fff !important;
  border: none !important;
}

#triagePrevStepBtn:hover,
#triageNextStepBtn:hover,
#triageSaveNowBtn:hover {
  background: var(--primary) !important;
  color: #fff !important;
}

.small { color: var(--muted); font-size: 13px; }
.hidden { display: none !important; }

.badge {
  display: inline-block;
  padding: 3px 8px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 700;
}
.badge.ativo { background: #ffe2e3; color: #b11820; }
.badge.concluido { background: #ffeef0; color: #8a1118; }
.badge.desistente { background: #ffd9dc; color: #7f0f15; }

.permissions-grid {
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  margin-top: 8px;
}

.permission-pill {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 12px;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: #fbfdfc;
  font-size: 13px;
}

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

.table-wrap { overflow-x: auto; }
table { width: 100%; border-collapse: collapse; }
th, td {
  border-bottom: 1px solid var(--border);
  padding: 8px;
  text-align: left;
  vertical-align: top;
}
th { color: var(--muted); font-size: 13px; }

.alert {
  border-left: 4px solid var(--warn);
  background: #fff8e8;
  padding: 10px;
  border-radius: 8px;
  margin-bottom: 8px;
}

.attachment-item {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  padding: 8px 10px;
  border: 1px solid var(--border);
  border-radius: 8px;
  margin-bottom: 6px;
  background: #fbfdfb;
}
.attachment-item a {
  color: #be1a22;
  text-decoration: none;
  font-weight: 700;
}
.attachment-item a:hover { text-decoration: underline; }

.attachment-item-body {
  display: grid;
  gap: 2px;
  min-width: 0;
}

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

.attachment-item-actions {
  display: flex;
  gap: 8px;
  align-items: center;
}

.photo-preview {
  margin-top: 8px;
  min-height: 42px;
}

.photo-preview.small {
  display: grid;
  gap: 8px;
}

.photo-preview img,
.resident-avatar {
  width: 74px;
  height: 74px;
  object-fit: cover;
  border-radius: 14px;
  border: 2px solid #ffd7d9;
  background: #fff;
}

.resident-avatar-placeholder {
  width: 74px;
  height: 74px;
  display: grid;
  place-items: center;
  border-radius: 14px;
  background: linear-gradient(135deg, #ffe2e3 0%, #ffd0d4 100%);
  color: #b11820;
  font-weight: 700;
  border: 2px solid #ffd7d9;
}

.section-attachments-card {
  border-style: dashed;
}

.followups-module {
  display: flex;
  flex-direction: column;
  gap: 18px;
}

.followups-panel {
  border-radius: 10px;
}

.followups-panel .section-head {
  margin-bottom: 14px;
}

.followups-panel textarea {
  min-height: 140px;
}

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

.followups-stat {
  border: 1px solid #dbeafe;
  border-radius: 10px;
  background: #eff6ff;
  padding: 14px;
}

.followups-stat span {
  display: block;
  color: #64748b;
  font-size: 13px;
}

.followups-stat strong {
  display: block;
  margin-top: 4px;
  color: #1d4ed8;
  font-size: 26px;
}

.followups-stat.danger {
  border-color: #fecaca;
  background: #fef2f2;
}

.followups-stat.danger strong {
  color: #b91c1c;
}

.followups-stat.success {
  border-color: #bbf7d0;
  background: #f0fdf4;
}

.followups-stat.success strong {
  color: #15803d;
}

.followups-layout {
  display: grid;
  gap: 18px;
  grid-template-columns: minmax(0, 1fr) minmax(280px, 340px);
  align-items: start;
}

.followups-main {
  display: flex;
  flex-direction: column;
  gap: 18px;
  min-width: 0;
}

.followups-resident-card {
  display: flex;
  gap: 14px;
  align-items: center;
  margin-top: 14px;
  padding: 12px;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  background: #f8fafc;
}

.followups-resident-card img {
  width: 72px;
  height: 72px;
  border-radius: 10px;
  object-fit: cover;
  border: 1px solid #e2e8f0;
  background: #fff;
}

.followups-resident-card h3 {
  margin: 0 0 4px;
  color: #0f172a;
}

.followups-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 8px;
}

.followups-tags span {
  display: inline-flex;
  align-items: center;
  border-radius: 999px;
  background: #e0f2fe;
  color: #075985;
  font-size: 12px;
  font-weight: 700;
  padding: 4px 8px;
}

.followups-choice-grid {
  display: grid;
  gap: 8px;
}

.followups-check {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0;
  padding: 10px;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  background: #fff;
  font-weight: 600;
}

.followups-check input {
  width: auto;
}

.followups-file-box {
  margin-top: 14px;
  padding: 14px;
  border: 2px dashed #cbd5e1;
  border-radius: 10px;
  background: #f8fafc;
}

.followups-history {
  position: sticky;
  top: 18px;
}

.followups-history h3 {
  margin-top: 0;
}

.followups-history-item {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-top: 10px;
  padding: 12px;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  background: #fff;
}

.followups-history-item span {
  display: block;
  color: #475569;
  font-size: 13px;
}

.followups-history-item p {
  margin: 0;
  color: #64748b;
  font-size: 13px;
  line-height: 1.45;
  max-height: 78px;
  overflow: hidden;
}

@media (max-width: 1100px) {
  .followups-layout {
    grid-template-columns: 1fr;
  }

  .followups-history {
    position: static;
  }
}

@media (max-width: 760px) {
  .followups-stat-grid {
    grid-template-columns: 1fr;
  }

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

.report-photo-box {
  margin: 4px 0 10px;
  display: flex;
  align-items: center;
  gap: 10px;
}

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

.report-field {
  border: 1px solid #f0dcdd;
  border-radius: 10px;
  padding: 8px 10px;
  background: #fffdfd;
}

.report-field span {
  display: block;
  color: var(--muted);
  font-size: 12px;
  margin-bottom: 4px;
}

.report-field strong {
  font-size: 14px;
  color: var(--text);
}

.report-history-box {
  border: 1px solid #f0dcdd;
  border-radius: 12px;
  padding: 12px;
  background: #fffdfd;
}

.report-history-box h4 {
  margin: 0 0 8px;
}

.report-history-content {
  line-height: 1.45;
}

.chart-grid canvas {
  width: 100%;
  height: auto;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: #fff;
}

.dashboard-head {
  align-items: flex-start;
}

.dashboard-head-actions {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}

.dashboard-loading {
  display: none;
}

.dashboard-loading.is-visible {
  display: block;
}

.dashboard-block-grid {
  display: grid;
  gap: 16px;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  align-items: start;
}

.dashboard-block {
  grid-column: span 4;
  margin-bottom: 0;
  border: 1px solid #f0dcdd;
  border-top: 4px solid var(--dashboard-accent, var(--primary));
  background: linear-gradient(180deg, #ffffff 0%, #fffdfd 100%);
}

.dashboard-block.is-small { grid-column: span 2; }
.dashboard-block.is-medium { grid-column: span 4; }
.dashboard-block.is-large { grid-column: span 6; }
.dashboard-block.is-full { grid-column: span 12; }

.dashboard-block-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
  margin-bottom: 14px;
}

.dashboard-block-head h3,
.dashboard-block-head h4 {
  margin: 0;
}

.dashboard-block-copy .small,
.dashboard-block-statusline .small {
  margin: 4px 0 0;
}

.dashboard-block-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  border-radius: 14px;
  font-size: 18px;
  font-weight: 700;
  color: var(--dashboard-accent, var(--primary));
  background: color-mix(in srgb, var(--dashboard-accent, var(--primary)) 12%, #fff 88%);
  border: 1px solid color-mix(in srgb, var(--dashboard-accent, var(--primary)) 22%, #fff 78%);
  flex-shrink: 0;
}

.dashboard-block-head-right {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 8px;
}

.dashboard-block-statusline {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  justify-content: flex-end;
}

.dashboard-block-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 10px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  background: #fff4f4;
  color: #8b151c;
}

.dashboard-block-badge.is-highlighted {
  background: #fff3dd;
  color: #8a4c00;
}

.dashboard-block-badge.is-monitoring {
  background: #eef6ff;
  color: #19518f;
}

.dashboard-block-badge.is-paused {
  background: #f2f2f2;
  color: #666;
}

.dashboard-kpi-grid {
  display: contents;
}

.loading-line {
  height: 12px;
  border-radius: 999px;
  margin-bottom: 10px;
  background: linear-gradient(90deg, #f6d4d6 0%, #ffecef 50%, #f6d4d6 100%);
  background-size: 220% 100%;
  animation: dashboard-shimmer 1.4s infinite linear;
}

.loading-line-lg { width: 90%; height: 14px; }
.loading-line-sm { width: 45%; margin-bottom: 0; }

@keyframes dashboard-shimmer {
  from { background-position: 220% 0; }
  to { background-position: -220% 0; }
}

.dashboard-kpi-grid .card {
  margin-bottom: 0;
}

.kpi-card {
  border: 1px solid #f1d5d6;
  background: linear-gradient(180deg, #ffffff 0%, #fff9f9 100%);
  position: relative;
  overflow: hidden;
}

.kpi-card::after {
  content: '';
  position: absolute;
  right: -38px;
  top: -38px;
  width: 110px;
  height: 110px;
  border-radius: 50%;
  background: rgba(244, 45, 53, 0.1);
}

.kpi-card h3 {
  margin: 0;
  font-size: 30px;
  line-height: 1.1;
}

.kpi-label {
  margin: 0 0 8px;
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}

.kpi-trend {
  margin: 8px 0 0;
  font-size: 12px;
  font-weight: 700;
  color: #8a1118;
}

.kpi-finance .kpi-trend { color: #094f2e; }
.kpi-stock .kpi-trend { color: #7f3f07; }
.kpi-social .kpi-trend { color: #6b205e; }

.dashboard-quick-actions .quick-actions-row {
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
}

.quick-action-btn {
  border: none;
  background: var(--primary);
  color: #fff;
}

.quick-action-btn:hover {
  background: var(--primary);
}

.dashboard-operational-grid canvas {
  width: 100%;
  height: auto;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: #fff;
}

.dashboard-insight {
  margin-top: 10px;
}

.timeline-box {
  margin-top: 10px;
  display: grid;
  gap: 8px;
}

.timeline-item {
  border: 1px solid #f2d6d8;
  border-left: 5px solid #dd3a43;
  border-radius: 10px;
  padding: 8px 10px;
  background: #fff8f8;
}

.timeline-item .small {
  margin: 0;
}

.summary-stack {
  display: grid;
  gap: 8px;
}

.summary-chip {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: center;
  border: 1px solid #f0dcdd;
  border-radius: 9px;
  padding: 8px 10px;
  background: #fffdfd;
}

.status-pill {
  display: inline-block;
  border-radius: 999px;
  padding: 3px 9px;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
}

.status-pill.low {
  background: #e9f8ef;
  color: #11653a;
}

.status-pill.medium {
  background: #fff3dd;
  color: #8a4c00;
}

.status-pill.high {
  background: #ffe2e4;
  color: #a6131b;
}

.status-pill.critical {
  background: #a6131b;
  color: #fff;
}

.dashboard-empty-state {
  padding: 16px;
  border-radius: 12px;
  border: 1px dashed #edb8bb;
  background: #fff8f8;
}

.dashboard-kpi-value {
  margin: 0;
  font-size: 30px;
  line-height: 1.1;
}

.dashboard-kpi-subtitle {
  margin: 6px 0 0;
}

.dashboard-kpi-footnote {
  margin: 8px 0 0;
  font-size: 12px;
  font-weight: 700;
  color: #8a1118;
}

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

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

.dashboard-list-item,
.dashboard-alert-item,
.dashboard-pending-item {
  border: 1px solid #f0dcdd;
  border-radius: 12px;
  padding: 10px 12px;
  background: #fffdfd;
}

.dashboard-list-item strong,
.dashboard-alert-item strong,
.dashboard-pending-item strong {
  display: block;
  margin-bottom: 4px;
}

.dashboard-alert-item.is-critical {
  border-left: 5px solid #a6131b;
}

.dashboard-alert-item.is-high {
  border-left: 5px solid #d75d26;
}

.dashboard-alert-item.is-medium {
  border-left: 5px solid #f6a623;
}

.dashboard-alert-item.is-low {
  border-left: 5px solid #2bb673;
}

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

.dashboard-data-table th,
.dashboard-data-table td {
  padding: 10px 8px;
  border-bottom: 1px solid var(--border);
  text-align: left;
  vertical-align: top;
}

.dashboard-data-table th {
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: #666;
}

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

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

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

.dashboard-bar-head {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  font-size: 13px;
}

.dashboard-bar-track {
  width: 100%;
  height: 10px;
  border-radius: 999px;
  background: #f2e6e7;
  overflow: hidden;
}

.dashboard-bar-fill {
  height: 100%;
  border-radius: inherit;
  background: var(--dashboard-accent, var(--primary));
}

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

.dashboard-progress-item {
  display: grid;
  gap: 6px;
}

.dashboard-progress-meta {
  display: flex;
  justify-content: space-between;
  gap: 10px;
}

.dashboard-status-chart {
  display: grid;
  gap: 12px;
}

.dashboard-line-chart {
  width: 100%;
  min-height: 220px;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: #fff;
  overflow: hidden;
}

.dashboard-line-chart svg {
  display: block;
  width: 100%;
  height: 220px;
}

.dashboard-line-chart path.line {
  fill: none;
  stroke: var(--dashboard-accent, var(--primary));
  stroke-width: 3;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.dashboard-line-chart path.area {
  fill: color-mix(in srgb, var(--dashboard-accent, var(--primary)) 18%, #fff 82%);
}

.dashboard-line-chart circle.point {
  fill: var(--dashboard-accent, var(--primary));
}

.dashboard-line-chart text {
  fill: #666;
  font-size: 11px;
}

.dashboard-inline-toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.dashboard-attachment-upload {
  display: grid;
  gap: 12px;
  margin-bottom: 12px;
}

.dashboard-preview-grid {
  pointer-events: none;
}

.dashboard-preview-grid .quick-action-btn {
  pointer-events: none;
}

.dashboard-config-modal {
  position: fixed;
  inset: 0;
  z-index: 55;
  display: none;
  padding: 22px;
  background: rgba(28, 12, 13, 0.74);
  backdrop-filter: blur(7px);
}

.dashboard-config-modal.is-visible {
  display: flex;
  align-items: center;
  justify-content: center;
}

.dashboard-config-dialog,
.dashboard-occurrence-dialog {
  width: min(100%, 1440px);
  max-height: calc(100vh - 44px);
  overflow: auto;
  border-radius: 24px;
  background: #fffdfd;
  border: 1px solid #eadfe0;
  box-shadow: 0 24px 54px rgba(25, 8, 10, 0.32);
  padding: 18px;
}

.dashboard-occurrence-dialog {
  width: min(100%, 860px);
}

.dashboard-config-toolbar,
.dashboard-config-toolbar-actions,
.dashboard-config-editor-head,
.dashboard-config-editor-actions,
.dashboard-config-sidebar-head,
.dashboard-config-preview-head {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
}

.dashboard-config-toolbar,
.dashboard-config-editor-head,
.dashboard-config-sidebar-head,
.dashboard-config-preview-head {
  justify-content: space-between;
  align-items: flex-start;
}

.dashboard-config-layout {
  display: grid;
  gap: 16px;
  grid-template-columns: minmax(300px, 360px) minmax(0, 1fr);
  margin-top: 16px;
}

.dashboard-config-sidebar {
  border: 1px solid #f0dcdd;
  border-radius: 18px;
  background: #fff9f9;
  padding: 14px;
  display: grid;
  gap: 14px;
  align-content: start;
}

.dashboard-config-block-list {
  display: grid;
  gap: 10px;
  max-height: 68vh;
  overflow: auto;
  padding-right: 4px;
}

.dashboard-config-block-item {
  border: 1px solid #efd8da;
  border-radius: 14px;
  padding: 12px;
  background: #fff;
  cursor: pointer;
}

.dashboard-config-block-item.is-active {
  border-color: #d9474f;
  box-shadow: 0 0 0 2px rgba(244, 45, 53, 0.12);
}

.dashboard-config-block-item-head,
.dashboard-config-block-item-actions {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  flex-wrap: wrap;
}

.dashboard-config-block-item-actions {
  margin-top: 10px;
}

.dashboard-config-block-item-actions button {
  width: auto;
  min-width: 116px;
}

.dashboard-config-editor-wrap {
  display: grid;
  gap: 16px;
}

.dashboard-config-editor,
.dashboard-config-preview-card {
  margin-bottom: 0;
}

.dashboard-config-form-grid {
  align-items: end;
}

.dashboard-config-checkbox {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 12px 0;
}

.dashboard-config-checkbox input {
  width: 18px;
  height: 18px;
  margin: 0;
}

.dashboard-config-quick-actions-wrap {
  margin-top: 14px;
}

.dashboard-config-quick-actions-wrap h4 {
  margin-bottom: 6px;
}

.triage-step-panel {
  display: none;
  border: 1px solid #f0dcdd;
  border-radius: 12px;
  padding: 12px;
  background: #fffdfd;
}

.triage-step-panel.active {
  display: block;
}

.triage-step-tabs {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 8px;
  margin-top: 12px;
}

.triage-step-tabs .triage-step-btn {
  width: 100%;
  min-height: 38px;
  padding: 8px 10px;
  border-radius: 8px;
  font-size: 13px;
  line-height: 1.2;
  text-align: center;
  white-space: normal;
}

.triage-step-btn.active {
  background: var(--primary-strong);
  color: #fff;
  border-color: var(--primary-strong);
}

.summary-row {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 0;
  border-bottom: 1px solid var(--border);
}

.summary-row:last-child {
  border-bottom: none;
}

.backup-toolbar {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  justify-content: flex-end;
}

.backup-summary-grid {
  align-items: stretch;
}

.backup-status-card {
  display: flex;
  flex-direction: column;
  gap: 6px;
  min-height: 150px;
}

.backup-status-card .small {
  margin: 0;
}

.backup-status-value {
  display: block;
  font-size: 18px;
  line-height: 1.35;
  color: #8b151c;
  word-break: break-word;
}

.backup-inline-status {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 24px;
  padding: 8px 12px;
  border-radius: 999px;
  background: #fff4f4;
  color: #8b151c;
  font-weight: 700;
}

.vehicle-photo-thumb {
  width: 54px;
  height: 54px;
  object-fit: cover;
  border-radius: 12px;
  border: 1px solid #ffd7d9;
  background: #fff;
}

.vehicle-photo-empty {
  color: var(--muted);
  font-size: 12px;
}

.resident-camera-actions {
  gap: 10px;
  align-items: center;
}

.resident-camera-zoom {
  max-width: 320px;
  margin-bottom: 10px;
}

.resident-camera-zoom label .small {
  margin-left: 8px;
  color: var(--muted);
}

.resident-camera-zoom input[type="range"] {
  width: 100%;
  accent-color: var(--primary);
}

.resident-camera-panel {
  margin-top: 10px;
  position: relative;
  display: inline-flex;
  border: 1px solid #f1d7d9;
  border-radius: 14px;
  padding: 10px;
  background: #ffffff;
  overflow: hidden;
}

.resident-camera-video {
  width: 100%;
  max-width: 320px;
  aspect-ratio: 3 / 4;
  border-radius: 12px;
  background: #ffffff;
  object-fit: cover;
  object-position: center center;
}

.resident-camera-canvas,
.resident-camera-captured {
  width: 100%;
  max-width: 320px;
  aspect-ratio: 3 / 4;
  border-radius: 12px;
  object-fit: cover;
  background: #ffffff;
}

.resident-photo-actions {
  margin-top: 10px;
  gap: 10px;
}

.resident-photo-actions .hidden,
.resident-camera-actions .hidden {
  display: none !important;
}

.backup-inline-status.is-success {
  background: #ecfff0;
  color: #1d6d31;
}

.backup-inline-status.is-warning {
  background: #fff7e6;
  color: #8a4c00;
}

.backup-inline-status.is-error {
  background: #ffe7e9;
  color: #a6131b;
}

.backup-inline-status.is-neutral {
  background: #f5f5f5;
  color: #555;
}

.backup-toggle {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 48px;
  padding: 10px 12px;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: #fffdfd;
  font-weight: 600;
}

.backup-toggle input {
  width: 18px;
  height: 18px;
  margin: 0;
}

.backup-config-note {
  margin-top: 10px;
}

.backup-run-status {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 92px;
  padding: 6px 10px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 700;
  text-transform: capitalize;
}

.backup-run-status.success {
  background: #ecfff0;
  color: #1d6d31;
}

.backup-run-status.partial {
  background: #fff7e6;
  color: #8a4c00;
}

.backup-run-status.failed {
  background: #ffe7e9;
  color: #a6131b;
}

.backup-run-status.running {
  background: #eef4ff;
  color: #1d4f91;
}

.backup-run-meta {
  display: grid;
  gap: 4px;
}

.backup-run-meta strong,
.backup-run-meta span {
  word-break: break-word;
}

.backup-run-actions {
  display: grid;
  gap: 8px;
  grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
}

.support-ftp-status {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 12px 0 8px;
}

.support-status-dot {
  width: 14px;
  height: 14px;
  border-radius: 999px;
  box-shadow: 0 0 0 4px rgba(148, 163, 184, 0.15);
  flex: 0 0 auto;
}

.support-status-dot.is-online,
.support-status-dot.is-success {
  background: #16a34a;
  box-shadow: 0 0 0 4px rgba(22, 163, 74, 0.14);
}

.support-status-dot.is-offline,
.support-status-dot.is-error {
  background: #dc2626;
  box-shadow: 0 0 0 4px rgba(220, 38, 38, 0.14);
}

.support-status-dot.is-warning,
.support-status-dot.is-validating {
  background: #f59e0b;
  box-shadow: 0 0 0 4px rgba(245, 158, 11, 0.16);
}

.support-capacity-list {
  display: grid;
  gap: 12px;
}

.support-capacity-item {
  display: grid;
  gap: 6px;
}

.support-capacity-head {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  font-weight: 700;
}

.support-capacity-meta {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  color: #6b7280;
  font-size: 12px;
}

.support-summary-grid {
  margin-bottom: 16px;
}

.support-summary-card {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.support-summary-card h3 {
  margin: 0;
  font-size: 1rem;
}

.support-summary-value {
  font-size: 1.8rem;
  font-weight: 700;
  color: #1f2937;
}

.support-summary-value.is-ok {
  color: #15803d;
}

.support-summary-value.is-warn {
  color: #b45309;
}

.support-summary-value.is-error {
  color: #b91c1c;
}

.support-resource-grid {
  display: grid;
  gap: 12px;
}

.support-metric-card {
  border: 1px solid #f3d1d5;
  border-radius: 14px;
  padding: 14px;
  background: #fff8f8;
}

.support-metric-card h4 {
  margin: 0 0 8px;
}

.support-metric-meta {
  display: grid;
  gap: 6px;
}

.support-metric-row {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: center;
}

.support-progress {
  width: 100%;
  height: 10px;
  border-radius: 999px;
  background: #f3f4f6;
  overflow: hidden;
}

.support-progress > span {
  display: block;
  height: 100%;
  background: linear-gradient(90deg, #f42d35 0%, #c9181f 100%);
  border-radius: inherit;
}

.support-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  border-radius: 999px;
  padding: 4px 10px;
  font-size: 0.76rem;
  font-weight: 700;
  letter-spacing: 0.03em;
  text-transform: uppercase;
}

.support-badge.is-ok {
  background: #dcfce7;
  color: #166534;
}

.support-badge.is-warn {
  background: #fef3c7;
  color: #92400e;
}

.support-badge.is-error {
  background: #fee2e2;
  color: #991b1b;
}

.support-badge.is-neutral {
  background: #e5e7eb;
  color: #374151;
}

.support-token-mask {
  margin-top: 12px;
  color: #6b7280;
}

.support-log-cell {
  max-width: 420px;
  white-space: normal;
  word-break: break-word;
}

.support-checklist-list {
  margin: 12px 0 0;
  padding-left: 18px;
  display: grid;
  gap: 8px;
}

.support-checklist-item {
  color: #213046;
}

.support-checklist-item strong {
  display: inline-block;
  margin-right: 8px;
}

.asset-table-actions {
  display: grid;
  gap: 8px;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  min-width: 290px;
}

.asset-section-actions {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  justify-content: flex-end;
}

.asset-section-actions button {
  width: auto;
  min-width: 210px;
}

.asset-label-modal {
  position: fixed;
  inset: 0;
  z-index: 50;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 24px;
  background: rgba(34, 18, 18, 0.7);
  backdrop-filter: blur(6px);
}

.asset-label-modal.is-visible {
  display: flex;
}

.asset-label-dialog {
  width: min(100%, 980px);
  padding: 18px;
  border-radius: 24px;
  background: #fffdfd;
  border: 1px solid #eadfe0;
  box-shadow: 0 24px 54px rgba(25, 8, 10, 0.32);
}

.asset-label-toolbar {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 16px;
  flex-wrap: wrap;
  margin-bottom: 16px;
}

.asset-label-toolbar-actions {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}

.asset-label-toolbar-actions button {
  width: auto;
  min-width: 160px;
}

.asset-label-print-area {
  display: flex;
  justify-content: center;
  padding: 30px 0 10px;
  overflow: auto;
}

.asset-label-card {
  width: 70mm;
  height: 20mm;
  min-height: 20mm;
  padding: 1.2mm 1.4mm;
  border-radius: 1.6mm;
  border: 1px solid #aaabad;
  display: grid;
  grid-template-columns: 24mm 1fr;
  gap: 1.2mm;
  align-items: stretch;
  box-sizing: border-box;
  overflow: hidden;
  background:
    radial-gradient(circle at top left, rgba(255, 255, 255, 0.95), transparent 34%),
    linear-gradient(135deg, #aeafb2 0%, #f2f2f3 24%, #d0d1d4 56%, #f6f6f7 78%, #b3b4b7 100%);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.85),
    inset 0 -1px 0 rgba(116, 117, 120, 0.18),
    0 16px 34px rgba(18, 18, 19, 0.28);
}

.asset-label-logo-panel {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0.45mm;
  border-radius: 1mm;
  border: 0.3mm solid #eb2330;
  min-width: 0;
  min-height: 0;
  box-sizing: border-box;
  overflow: hidden;
  background: rgba(255, 255, 255, 0.82);
}

.asset-label-logo {
  display: block;
  width: auto;
  max-width: 100%;
  max-height: 100%;
  height: auto;
  object-fit: contain;
}

.asset-label-content {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  justify-content: center;
  text-align: center;
  color: #111;
}

.asset-label-title {
  width: 100%;
  font-size: 3.3mm;
  line-height: 0.92;
  font-weight: 900;
  letter-spacing: 0.01em;
  margin-bottom: 0.3mm;
}

.asset-label-barcode {
  width: 100%;
  max-width: none;
  height: 5.2mm;
}

.asset-label-code {
  width: 100%;
  margin-top: 0.15mm;
  font-size: 4.1mm;
  line-height: 0.95;
  font-weight: 900;
  letter-spacing: 0.02em;
}

.asset-label-meta {
  width: 100%;
  margin-top: 0.15mm;
  font-size: 1.35mm;
  line-height: 1.05;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.01em;
  color: #2d2d2d;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

@media print {
  @page {
    size: auto;
    margin: 6mm;
  }

  body {
    margin: 0;
    background: #fff !important;
  }

  body > * {
    display: none !important;
  }

  body.asset-label-printing > #assetLabelModal {
    display: block !important;
    position: static !important;
    inset: auto !important;
    padding: 0 !important;
    background: transparent !important;
    backdrop-filter: none !important;
  }

  body.asset-label-printing > #assetLabelModal .asset-label-dialog {
    width: auto !important;
    max-width: none !important;
    padding: 0 !important;
    border: none !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  body.asset-label-printing > #assetLabelModal .asset-label-toolbar {
    display: none !important;
  }

  body.asset-label-printing > #assetLabelModal .asset-label-card {
    width: 70mm !important;
    height: 20mm !important;
    min-height: 20mm !important;
    margin: 0 auto !important;
    padding: 1.2mm 1.4mm !important;
    border-radius: 1.6mm !important;
    grid-template-columns: 24mm 1fr !important;
    gap: 1.2mm !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
    box-shadow: none !important;
    page-break-inside: avoid;
  }

  body.asset-label-printing > #assetLabelModal .asset-label-logo-panel {
    padding: 0.45mm !important;
    border-width: 0.3mm !important;
    border-radius: 1mm !important;
    min-width: 0 !important;
    min-height: 0 !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
  }

  body.asset-label-printing > #assetLabelModal .asset-label-logo {
    display: block !important;
    width: auto !important;
    max-width: 100% !important;
    max-height: 100% !important;
  }

  body.asset-label-printing > #assetLabelModal .asset-label-title {
    font-size: 3.3mm !important;
    margin-bottom: 0.3mm !important;
    letter-spacing: 0.01em !important;
  }

  body.asset-label-printing > #assetLabelModal .asset-label-barcode {
    max-width: none !important;
    height: 5.2mm !important;
  }

  body.asset-label-printing > #assetLabelModal .asset-label-code {
    margin-top: 0.15mm !important;
    font-size: 4.1mm !important;
    letter-spacing: 0.02em !important;
  }

  body.asset-label-printing > #assetLabelModal .asset-label-meta {
    display: block !important;
    margin-top: 0.15mm !important;
    font-size: 1.35mm !important;
    line-height: 1.05 !important;
  }
}

@media (max-width: 900px) {
  body.mobile-nav-open {
    overflow: hidden;
  }

  .layout {
    grid-template-columns: 1fr;
  }

  .mobile-nav-backdrop {
    display: block;
    position: fixed;
    inset: 0;
    background: rgba(44, 44, 44, 0.48);
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.22s ease;
    z-index: 24;
  }

  body.mobile-nav-open .mobile-nav-backdrop {
    opacity: 1;
    pointer-events: auto;
  }

  .sidebar {
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    width: min(86vw, 320px);
    max-width: 320px;
    border-right: 1px solid #c71e26;
    border-bottom: none;
    overflow-y: auto;
    transform: translateX(-100%);
    transition: transform 0.22s ease;
    box-shadow: 0 20px 60px rgba(81, 9, 14, 0.28);
    z-index: 25;
  }

  body.mobile-nav-open .sidebar {
    transform: translateX(0);
  }

  .mobile-sidebar-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 12px;
    margin-bottom: 12px;
  }

  .mobile-sidebar-close {
    background: rgba(255, 255, 255, 0.16) !important;
    border: 1px solid rgba(255, 255, 255, 0.2) !important;
    color: #fff !important;
  }

  .login-card {
    width: min(92%, 440px);
    padding: 26px 22px;
    border-radius: 22px;
  }

  .login-logo {
    width: min(100%, 240px);
  }

  .password-change-modal {
    padding: 16px;
  }

  .password-change-dialog {
    padding: 22px;
  }

  .password-change-actions {
    grid-template-columns: 1fr;
  }

  .mobile-topbar {
    display: flex;
    align-items: center;
    gap: 12px;
    position: sticky;
    top: 0;
    z-index: 18;
    margin: 0 -16px 16px;
    padding: 14px 16px;
    background: rgba(243, 243, 243, 0.96);
    border-bottom: 1px solid var(--border);
    backdrop-filter: blur(6px);
  }

  .mobile-menu-toggle {
    flex-shrink: 0;
  }

  .content {
    min-height: auto;
    padding: 0 16px 104px;
  }

  .app-footer-fixed {
    left: 16px;
    right: 16px;
    padding-bottom: calc(10px + env(safe-area-inset-bottom, 0px));
  }

  .app-footer-overlay {
    left: 16px;
    right: 16px;
    bottom: 16px;
  }

  .kpi-card h3 { font-size: 24px; }

  input, select, textarea, button {
    font-size: 16px;
  }

  .row {
    flex-direction: column;
  }

  .section-head-actions {
    align-items: stretch;
  }

  .section-head-actions > div,
  .section-head-actions > button,
  .dashboard-head-actions,
  .asset-section-actions,
  .backup-toolbar {
    width: 100%;
  }

  .dashboard-head-actions {
    justify-content: flex-start;
  }

  .dashboard-head-actions > * {
    width: 100%;
  }

  .asset-section-actions {
    justify-content: flex-start;
  }

  .section-head-actions button,
  .dashboard-head-actions button,
  .asset-section-actions button,
  .backup-toolbar button,
  .dashboard-config-toolbar-actions button,
  .dashboard-config-editor-actions button,
  .dashboard-config-sidebar-head button,
  .row button,
  .attachment-item button,
  .card button[style*="max-width"] {
    max-width: none !important;
    width: 100%;
  }

  .dashboard-quick-actions .quick-actions-row,
  .quick-actions-row,
  .permissions-grid,
  .asset-table-actions,
  .backup-run-actions,
  .dashboard-summary-grid {
    grid-template-columns: 1fr;
  }

  .asset-table-actions,
  .asset-section-actions button {
    min-width: 0;
  }

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

  .dashboard-block,
  .dashboard-block.is-small,
  .dashboard-block.is-medium,
  .dashboard-block.is-large,
  .dashboard-block.is-full {
    grid-column: span 1;
  }

  .dashboard-config-modal {
    padding: 12px;
  }

  .dashboard-config-dialog,
  .dashboard-occurrence-dialog {
    max-height: calc(100vh - 24px);
    border-radius: 18px;
    padding: 14px;
  }

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

  .dashboard-config-block-list {
    max-height: none;
  }

  .dashboard-config-block-item-actions button {
    width: 100%;
    min-width: 0;
  }

  .dashboard-data-table {
    min-width: 640px;
  }

  .attachment-item,
  .report-photo-box {
    flex-direction: column;
    align-items: flex-start;
  }

  th,
  td {
    padding: 10px 8px;
    font-size: 13px;
  }

  .table-wrap {
    margin-inline: -4px;
    padding-inline: 4px;
  }

  .table-wrap table {
    min-width: 640px;
  }

  .session-box {
    margin-top: 12px;
  }

  .asset-label-print-area {
    justify-content: flex-start;
  }

  .grid-span-2,
  .grid-span-3 {
    grid-column: span 1;
  }
}

/* Rede Publica: layout visual alinhado ao painel Gov.PI de referencia. */
body.public-network-mode {
  background: #ffffff;
}

body.public-network-mode #appLayout {
  display: block;
  min-height: 100vh;
}

body.public-network-mode #appSidebar,
body.public-network-mode .mobile-topbar {
  display: none !important;
}

body.public-network-mode .content {
  background: #ffffff;
  gap: 0;
  padding: 0;
}

body.public-network-mode #publicNetworkSection {
  background: #ffffff;
  color: #151a28;
  min-height: 100vh;
  padding: 0;
}

body.public-network-mode .app-footer {
  background: #ffffff;
  border: 0;
  color: #8b95a7;
  margin-top: 0;
  padding: 16px 0 20px;
}

#publicNetworkRoot .pn-gov-shell {
  background: #ffffff;
  color: #151a28;
  gap: 18px;
  padding: 0 24px 22px;
}

#publicNetworkRoot .pn-gov-shell svg {
  fill: none;
  height: 22px;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 2;
  width: 22px;
}

#publicNetworkRoot .pn-gov-header {
  background: #ffffff;
  border: 0;
  border-bottom: 1px solid #e8edf5;
  border-radius: 0;
  box-shadow: none;
  margin: 0 -24px;
  min-height: 104px;
  padding: 24px 32px 20px;
}

#publicNetworkRoot .pn-gov-header h2 {
  color: #111827;
  font-size: 25px;
  font-weight: 800;
  letter-spacing: 0;
  line-height: 1.15;
}

#publicNetworkRoot .pn-gov-header p {
  color: #1f2937;
  font-size: 15px;
}

#publicNetworkRoot .pn-light-btn,
#publicNetworkRoot .pn-notification-btn {
  align-items: center;
  background: #ffffff;
  border: 0;
  color: #111827;
  display: inline-flex;
  gap: 7px;
  min-height: 38px;
  padding: 8px 10px;
  width: auto;
}

#publicNetworkRoot .pn-light-btn:hover,
#publicNetworkRoot .pn-notification-btn:hover {
  background: #f8fbff;
  color: #1f3f96;
}

#publicNetworkRoot .pn-notification-btn svg,
#publicNetworkRoot .pn-light-btn svg {
  height: 22px;
  width: 22px;
}

#publicNetworkRoot .pn-notification-badge {
  background: #ef3340;
  box-shadow: 0 2px 6px rgba(239, 51, 64, 0.28);
  font-size: 11px;
  height: 18px;
  margin-left: -6px;
  margin-top: -18px;
  min-width: 18px;
}

#publicNetworkRoot .pn-gov-brand {
  align-items: end;
  min-width: 190px;
  text-align: right;
}

#publicNetworkRoot .pn-gov-brand img {
  max-height: 82px;
  max-width: 245px;
}

#publicNetworkRoot .backup-inline-status {
  border-radius: 10px;
  margin: 0;
}

#publicNetworkRoot .pn-gov-layout {
  gap: 20px;
  grid-template-columns: minmax(0, 1fr) 340px;
}

#publicNetworkRoot .pn-gov-main,
#publicNetworkRoot .pn-side-rail {
  gap: 20px;
}

#publicNetworkRoot .pn-summary-panel {
  background: #f5f9ff;
  border: 1px solid #dbeafe;
  border-radius: 10px;
  box-shadow: 0 6px 20px rgba(37, 99, 235, 0.04);
  grid-template-columns: minmax(280px, 1fr) auto minmax(420px, 0.9fr);
  min-height: 108px;
  padding: 14px 16px;
}

#publicNetworkRoot .pn-summary-info strong {
  color: #2548b8;
  font-size: 14px;
}

#publicNetworkRoot .pn-summary-info p {
  color: #111827;
  font-size: 13px;
}

#publicNetworkRoot .pn-info-icon {
  background: #3867df;
  box-shadow: 0 8px 18px rgba(56, 103, 223, 0.24);
  color: #ffffff;
  height: 44px;
  min-width: 44px;
}

#publicNetworkRoot .pn-summary-actions button,
#publicNetworkRoot .pn-access-btn,
#publicNetworkRoot .pn-doc-list em,
#publicNetworkRoot .pn-card-title-row button,
#publicNetworkRoot .pn-manage-btn,
#publicNetworkRoot .pn-help-card button {
  background: #ffffff;
  border: 1px solid #d8e1ee;
  border-radius: 8px;
  box-shadow: 0 2px 7px rgba(15, 23, 42, 0.05);
  color: #1f3f96;
  font-weight: 800;
  min-height: 40px;
}

#publicNetworkRoot .pn-summary-actions button:hover,
#publicNetworkRoot .pn-access-btn:hover,
#publicNetworkRoot .pn-doc-list em:hover,
#publicNetworkRoot .pn-card-title-row button:hover,
#publicNetworkRoot .pn-manage-btn:hover,
#publicNetworkRoot .pn-help-card button:hover {
  background: #f8fbff;
  border-color: #bfd3f6;
  color: #17327f;
}

#publicNetworkRoot .pn-summary-actions button.secondary {
  background: #ffffff;
  color: #1f3f96;
}

#publicNetworkRoot .pn-stat-row {
  gap: 14px;
}

#publicNetworkRoot .pn-stat-card {
  background: #ffffff;
  border: 1px solid #dfe8f7;
  border-radius: 10px;
  box-shadow: 0 6px 18px rgba(15, 23, 42, 0.04);
  min-height: 82px;
  padding: 13px;
}

#publicNetworkRoot .pn-stat-card span {
  border-radius: 999px;
  height: 46px;
  min-width: 46px;
}

#publicNetworkRoot .pn-stat-card small {
  color: #111827;
  font-size: 13px;
}

#publicNetworkRoot .pn-stat-card strong {
  font-size: 22px;
  font-weight: 900;
}

#publicNetworkRoot .pn-stat-blue strong { color: #2f5bd3; }
#publicNetworkRoot .pn-stat-amber strong { color: #f59e0b; }
#publicNetworkRoot .pn-stat-green strong { color: #159447; }

#publicNetworkRoot .pn-gov-category-grid {
  gap: 24px 28px;
  grid-template-columns: repeat(3, minmax(260px, 1fr));
}

#publicNetworkRoot .pn-service-card {
  border-radius: 12px;
  box-shadow: 0 8px 22px rgba(15, 23, 42, 0.04);
  gap: 18px;
  min-height: 178px;
  padding: 18px;
}

#publicNetworkRoot .pn-service-card-head {
  gap: 18px;
}

#publicNetworkRoot .pn-service-icon {
  border-radius: 999px;
  box-shadow: 0 10px 20px rgba(15, 23, 42, 0.12);
  color: #ffffff;
  flex-basis: 72px;
  height: 72px;
  min-width: 72px;
}

#publicNetworkRoot .pn-service-icon svg {
  height: 38px;
  width: 38px;
}

#publicNetworkRoot .pn-service-card h3 {
  color: #111827;
  font-size: 18px;
  font-weight: 900;
}

#publicNetworkRoot .pn-service-card p {
  color: #1f2937;
  font-size: 14px;
}

#publicNetworkRoot .pn-service-card-actions {
  margin-top: auto;
}

#publicNetworkRoot .pn-access-btn {
  max-width: 142px;
  min-height: 42px;
}

#publicNetworkRoot .pn-service-card-actions span {
  background: rgba(255, 255, 255, 0.78);
  border-color: rgba(148, 163, 184, 0.28);
  color: #334155;
  font-size: 13px;
  font-weight: 800;
  padding: 8px 12px;
}

#publicNetworkRoot .pn-card-green { background: #f2fbf5; border-color: #d7f0de; }
#publicNetworkRoot .pn-card-green .pn-service-icon { background: linear-gradient(135deg, #05bd60, #07924d); }
#publicNetworkRoot .pn-card-blue { background: #f3f8ff; border-color: #d9e8ff; }
#publicNetworkRoot .pn-card-blue .pn-service-icon { background: linear-gradient(135deg, #3a82f6, #245fd1); }
#publicNetworkRoot .pn-card-amber { background: #fffbeb; border-color: #f7e3a8; }
#publicNetworkRoot .pn-card-amber .pn-service-icon { background: linear-gradient(135deg, #fbbf24, #e6a000); }
#publicNetworkRoot .pn-card-purple { background: #faf5ff; border-color: #eadcff; }
#publicNetworkRoot .pn-card-purple .pn-service-icon { background: linear-gradient(135deg, #8b3ee6, #6d28d9); }
#publicNetworkRoot .pn-card-teal { background: #effcf8; border-color: #d2f2ea; }
#publicNetworkRoot .pn-card-teal .pn-service-icon { background: linear-gradient(135deg, #0ca678, #05865f); }
#publicNetworkRoot .pn-card-orange { background: #fff7ed; border-color: #fed7aa; }
#publicNetworkRoot .pn-card-orange .pn-service-icon { background: linear-gradient(135deg, #f97316, #d95a0b); }
#publicNetworkRoot .pn-card-rose { background: #fff1f4; border-color: #ffd5df; }
#publicNetworkRoot .pn-card-rose .pn-service-icon { background: linear-gradient(135deg, #ef5b87, #d93667); }
#publicNetworkRoot .pn-card-cyan { background: #f0fdfa; border-color: #c9efea; }
#publicNetworkRoot .pn-card-cyan .pn-service-icon { background: linear-gradient(135deg, #14b8a6, #0f8f86); }
#publicNetworkRoot .pn-card-violet { background: #f7f2ff; border-color: #e6d8ff; }
#publicNetworkRoot .pn-card-violet .pn-service-icon { background: linear-gradient(135deg, #6d4ed6, #5132a8); }

#publicNetworkRoot .pn-overview-grid {
  border: 1px solid #e6edf7;
  border-radius: 12px;
  gap: 0;
  grid-template-columns: minmax(0, 1.35fr) minmax(300px, 0.9fr);
  overflow: hidden;
}

#publicNetworkRoot .pn-overview-grid .pn-white-card {
  border: 0;
  border-radius: 0;
  box-shadow: none;
}

#publicNetworkRoot .pn-overview-grid .pn-white-card + .pn-white-card {
  border-left: 1px solid #e6edf7;
}

#publicNetworkRoot .pn-white-card,
#publicNetworkRoot .pn-help-card {
  border-color: #e6edf7;
  border-radius: 12px;
  box-shadow: 0 8px 22px rgba(15, 23, 42, 0.035);
}

#publicNetworkRoot .pn-white-card h3,
#publicNetworkRoot .pn-help-card h3 {
  color: #1f2a44;
  font-size: 16px;
  font-weight: 900;
}

#publicNetworkRoot .pn-flow-track {
  align-items: start;
  gap: 0;
  position: relative;
}

#publicNetworkRoot .pn-flow-track::before {
  background: repeating-linear-gradient(90deg, #c3cbd8 0 8px, transparent 8px 14px);
  content: "";
  height: 2px;
  left: 13%;
  position: absolute;
  right: 13%;
  top: 36px;
}

#publicNetworkRoot .pn-flow-step {
  background: transparent;
  border: 0;
  box-shadow: none;
  min-height: 112px;
  padding: 0 8px;
  position: relative;
  z-index: 1;
}

#publicNetworkRoot .pn-flow-step span {
  height: 52px;
  width: 52px;
}

#publicNetworkRoot .pn-flow-step strong {
  color: #1f2937;
  font-size: 14px;
}

#publicNetworkRoot .pn-flow-step small {
  color: #475569;
  font-size: 12px;
}

#publicNetworkRoot .pn-doc-list button,
#publicNetworkRoot .pn-recent-list button,
#publicNetworkRoot .pn-integration-list button {
  border: 0;
  border-bottom: 1px solid #edf1f7;
  border-radius: 0;
  box-shadow: none;
  min-height: 66px;
  padding: 10px 0;
}

#publicNetworkRoot .pn-doc-list button:last-child,
#publicNetworkRoot .pn-recent-list button:last-child,
#publicNetworkRoot .pn-integration-list button:last-child {
  border-bottom: 0;
}

#publicNetworkRoot .pn-doc-list span,
#publicNetworkRoot .pn-recent-icon {
  background: #dbeafe;
  border-radius: 10px;
  color: #2f5bd3;
  height: 42px;
  min-width: 42px;
}

#publicNetworkRoot .pn-doc-list svg,
#publicNetworkRoot .pn-recent-icon svg {
  height: 23px;
  width: 23px;
}

#publicNetworkRoot .pn-doc-list strong,
#publicNetworkRoot .pn-recent-list strong,
#publicNetworkRoot .pn-integration-list span {
  color: #1f2937;
  font-size: 14px;
  font-weight: 900;
}

#publicNetworkRoot .pn-doc-list small,
#publicNetworkRoot .pn-recent-list small {
  color: #475569;
  font-size: 12px;
}

#publicNetworkRoot .pn-doc-list em,
#publicNetworkRoot .pn-card-title-row button {
  background: #eaf2ff;
  border: 0;
  box-shadow: none;
  color: #2f5bd3;
  min-height: 30px;
  padding: 7px 12px;
}

#publicNetworkRoot .pn-status-chip,
#publicNetworkRoot .pn-integration-list em {
  border-radius: 7px;
  font-size: 12px;
  min-width: 84px;
  text-align: center;
}

#publicNetworkRoot .pn-integration-list span {
  align-items: center;
  display: flex;
  gap: 9px;
}

#publicNetworkRoot .pn-integration-list i {
  color: #1f2937;
  display: inline-flex;
  font-style: normal;
}

#publicNetworkRoot .pn-integration-list i svg {
  height: 17px;
  width: 17px;
}

#publicNetworkRoot .pn-integration-active { background: #dff8e8; color: #16833f; }
#publicNetworkRoot .pn-integration-configured { background: #eaf2ff; color: #2f5bd3; }
#publicNetworkRoot .pn-integration-inactive { background: #eef2f7; color: #475569; }

#publicNetworkRoot .pn-manage-btn {
  align-items: center;
  display: flex;
  justify-content: center;
  min-height: 42px;
}

#publicNetworkRoot .pn-help-card {
  background: #f7fbff;
}

#publicNetworkRoot .pn-help-card li {
  font-size: 13px;
  font-weight: 700;
}

#publicNetworkRoot .pn-help-card li span {
  background: #dbeafe;
  color: #2f5bd3;
}

#publicNetworkRoot .pn-workspace {
  margin-top: 2px;
}

#publicNetworkRoot .public-network-tabs {
  border-radius: 10px;
}

/* Ajuste de sobriedade: remove vermelho dominante e reduz ruído visual. */
#publicNetworkRoot button,
#publicNetworkRoot input[type="button"],
#publicNetworkRoot input[type="submit"],
#publicNetworkRoot input[type="reset"],
#publicNetworkRoot .pn-access-btn,
#publicNetworkRoot .pn-summary-actions button,
#publicNetworkRoot .pn-manage-btn,
#publicNetworkRoot .pn-help-card button,
#publicNetworkRoot .pn-card-title-row button,
#publicNetworkRoot .pn-doc-list em,
#publicNetworkRoot .pn-integration-list em {
  background: #ffffff !important;
  background-color: #ffffff !important;
  border: 1px solid #d7deea !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  color: #253858 !important;
}

#publicNetworkRoot button:hover,
#publicNetworkRoot button:focus,
#publicNetworkRoot button:active,
#publicNetworkRoot input[type="button"]:hover,
#publicNetworkRoot input[type="button"]:focus,
#publicNetworkRoot input[type="button"]:active,
#publicNetworkRoot input[type="submit"]:hover,
#publicNetworkRoot input[type="submit"]:focus,
#publicNetworkRoot input[type="submit"]:active,
#publicNetworkRoot input[type="reset"]:hover,
#publicNetworkRoot input[type="reset"]:focus,
#publicNetworkRoot input[type="reset"]:active {
  background: #f6f8fb !important;
  background-color: #f6f8fb !important;
  border-color: #bfc9d9 !important;
  color: #172033 !important;
}

#publicNetworkRoot .pn-light-btn,
#publicNetworkRoot .pn-notification-btn {
  border: 1px solid #d7deea !important;
  min-height: 38px;
}

#publicNetworkRoot .pn-notification-badge {
  background: #e5484d !important;
  border: 0 !important;
  color: #ffffff !important;
}

#publicNetworkRoot .pn-gov-brand {
  opacity: 1;
}

#publicNetworkRoot .pn-summary-panel {
  background: #f8fafc;
  border-color: #e3e9f2;
}

#publicNetworkRoot .pn-summary-info strong {
  color: #253858;
}

#publicNetworkRoot .pn-info-icon {
  background: #e8eef8;
  box-shadow: none;
  color: #315a9f;
}

#publicNetworkRoot .pn-stat-card {
  background: #ffffff;
  border-color: #e3e8f0;
  box-shadow: none;
}

#publicNetworkRoot .pn-stat-card span,
#publicNetworkRoot .pn-doc-list span,
#publicNetworkRoot .pn-recent-icon,
#publicNetworkRoot .pn-flow-step span {
  box-shadow: none;
}

#publicNetworkRoot .pn-stat-blue span,
#publicNetworkRoot .pn-stat-amber span,
#publicNetworkRoot .pn-stat-green span,
#publicNetworkRoot .pn-flow-blue span,
#publicNetworkRoot .pn-flow-amber span,
#publicNetworkRoot .pn-flow-rose span,
#publicNetworkRoot .pn-flow-green span,
#publicNetworkRoot .pn-doc-list span,
#publicNetworkRoot .pn-recent-icon {
  background: #f1f5f9;
  color: #4b5f7a;
}

#publicNetworkRoot .pn-stat-blue strong,
#publicNetworkRoot .pn-stat-amber strong,
#publicNetworkRoot .pn-stat-green strong {
  color: #1f2937;
}

#publicNetworkRoot .pn-service-card {
  background: #ffffff !important;
  border-color: #e2e8f0 !important;
  box-shadow: none;
  min-height: 164px;
}

#publicNetworkRoot .pn-service-card h3 {
  color: #111827;
}

#publicNetworkRoot .pn-service-card p {
  color: #435166;
}

#publicNetworkRoot .pn-service-icon {
  box-shadow: none;
  flex-basis: 58px;
  height: 58px;
  min-width: 58px;
}

#publicNetworkRoot .pn-service-icon svg {
  height: 30px;
  width: 30px;
}

#publicNetworkRoot .pn-card-green .pn-service-icon,
#publicNetworkRoot .pn-card-teal .pn-service-icon,
#publicNetworkRoot .pn-card-cyan .pn-service-icon {
  background: #e7f4ef;
  color: #15745b;
}

#publicNetworkRoot .pn-card-blue .pn-service-icon,
#publicNetworkRoot .pn-card-violet .pn-service-icon {
  background: #eaf0fb;
  color: #315a9f;
}

#publicNetworkRoot .pn-card-amber .pn-service-icon,
#publicNetworkRoot .pn-card-orange .pn-service-icon {
  background: #f8f0df;
  color: #9a641b;
}

#publicNetworkRoot .pn-card-purple .pn-service-icon {
  background: #f0eaf8;
  color: #6441a3;
}

#publicNetworkRoot .pn-card-rose .pn-service-icon {
  background: #f8e8ec;
  color: #9b3f5c;
}

#publicNetworkRoot .pn-service-card-actions span {
  background: #ffffff;
  border-color: #d7deea;
  color: #435166;
}

#publicNetworkRoot .pn-white-card,
#publicNetworkRoot .pn-help-card {
  border-color: #e2e8f0;
  box-shadow: none;
}

#publicNetworkRoot .pn-flow-track::before {
  background: repeating-linear-gradient(90deg, #d1d8e3 0 7px, transparent 7px 13px);
}

#publicNetworkRoot .pn-doc-list button,
#publicNetworkRoot .pn-recent-list button,
#publicNetworkRoot .pn-integration-list button {
  background: #ffffff !important;
  border-left: 0 !important;
  border-right: 0 !important;
  border-top: 0 !important;
  border-bottom: 1px solid #edf1f5 !important;
  border-radius: 0 !important;
  color: #253858 !important;
}

#publicNetworkRoot .pn-doc-list button:hover,
#publicNetworkRoot .pn-recent-list button:hover,
#publicNetworkRoot .pn-integration-list button:hover {
  background: #f8fafc !important;
}

#publicNetworkRoot .pn-status-success,
#publicNetworkRoot .pn-integration-active {
  background: #e8f5ee !important;
  color: #176a43 !important;
}

#publicNetworkRoot .pn-status-danger {
  background: #f8e8ec !important;
  color: #8a334c !important;
}

#publicNetworkRoot .pn-status-info,
#publicNetworkRoot .pn-integration-configured {
  background: #eaf0fb !important;
  color: #315a9f !important;
}

#publicNetworkRoot .pn-status-warn {
  background: #f8f0df !important;
  color: #8a5a19 !important;
}

#publicNetworkRoot .pn-status-neutral,
#publicNetworkRoot .pn-integration-inactive {
  background: #f1f5f9 !important;
  color: #4b5f7a !important;
}

#publicNetworkRoot .pn-help-card {
  background: #f8fafc;
}

#publicNetworkRoot .pn-help-card li span {
  background: #eef2f7;
  color: #4b5f7a;
}

#publicNetworkRoot .pn-integration-flow {
  display: grid;
  gap: 8px;
  margin: 12px 0 0;
  padding: 0;
  list-style: none;
}

#publicNetworkRoot .pn-integration-flow li {
  display: grid;
  grid-template-columns: 28px 1fr;
  align-items: start;
  gap: 10px;
  padding: 10px;
  background: #f8fafc;
  border: 1px solid #edf1f5;
  border-radius: 8px;
}

#publicNetworkRoot .pn-integration-flow li > span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  border-radius: 7px;
  background: #eef2f7;
  color: #435166;
  font-weight: 800;
  font-size: 12px;
}

#publicNetworkRoot .pn-integration-flow p {
  margin: 0;
  color: #253858;
}

#publicNetworkRoot .pn-integration-flow small {
  display: block;
  margin-top: 3px;
  color: #64748b;
  line-height: 1.4;
}

/* Correção: Rede Pública deve permanecer dentro do layout padrão das demais abas. */
body.public-network-mode #appLayout {
  display: grid;
  grid-template-columns: var(--sidebar-width) 1fr;
}

body.public-network-mode #appSidebar {
  display: block !important;
}

body.public-network-mode .content {
  background:
    radial-gradient(circle at 10% 0%, #ffe5e6 0%, transparent 33%),
    radial-gradient(circle at 100% 20%, #f8ebeb 0%, transparent 28%),
    var(--bg);
  gap: 24px;
  padding: 24px 24px 88px;
}

body.public-network-mode #publicNetworkSection {
  background: transparent;
  min-height: auto;
  padding: 0;
}

#publicNetworkRoot .pn-gov-shell {
  padding: 0;
}

#publicNetworkRoot .pn-gov-header {
  border: 1px solid #e8edf5;
  border-radius: 8px;
  margin: 0;
  min-height: auto;
  padding: 18px 20px;
}

#publicNetworkRoot .pn-summary-actions button,
#publicNetworkRoot .pn-access-btn,
#publicNetworkRoot .pn-manage-btn {
  background: #e23742 !important;
  background-color: #e23742 !important;
  border-color: #cf2833 !important;
  color: #ffffff !important;
}

#publicNetworkRoot .pn-summary-actions button:hover,
#publicNetworkRoot .pn-summary-actions button:focus,
#publicNetworkRoot .pn-access-btn:hover,
#publicNetworkRoot .pn-access-btn:focus,
#publicNetworkRoot .pn-manage-btn:hover,
#publicNetworkRoot .pn-manage-btn:focus {
  background: #cf2833 !important;
  background-color: #cf2833 !important;
  border-color: #bd202b !important;
  color: #ffffff !important;
}

#publicNetworkRoot .pn-summary-actions button.secondary {
  background: #fff6f7 !important;
  background-color: #fff6f7 !important;
  border-color: #e5b5ba !important;
  color: #9d343d !important;
}

@media (max-width: 1300px) {
  #publicNetworkRoot .pn-gov-layout,
  #publicNetworkRoot .pn-overview-grid {
    grid-template-columns: 1fr;
  }

  #publicNetworkRoot .pn-side-rail {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  #publicNetworkRoot .pn-summary-panel {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 980px) {
  #publicNetworkRoot .pn-gov-category-grid,
  #publicNetworkRoot .pn-side-rail {
    grid-template-columns: 1fr;
  }
}
