.app-page {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  padding-bottom: calc(var(--dock-height) + 12px);
}

.app-page.has-topbar {
  padding-top: var(--topbar-height);
}

.app-page.dashboard-page.has-topbar {
  padding-top: 0;
}

.app-page::before {
  content: "";
  position: fixed;
  inset: 82px 0 auto 0;
  z-index: -1;
  height: 42vh;
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.42), rgba(78, 115, 255, 0.12) 48%, rgba(178, 151, 255, 0.18));
  clip-path: polygon(0 0, 100% 0, 100% 58%, 0 100%);
  pointer-events: none;
}

.app-shell {
  width: min(1600px, calc(100% - 32px));
  margin: 0 auto;
  padding: var(--space-6) 0;
}

.app-main {
  flex: 1;
  width: min(1600px, calc(100% - 32px));
  margin: 0 auto;
  padding: 44px 0 34px;
}

.app-main.narrow {
  width: min(760px, calc(100% - 32px));
}

.app-topbar {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 100;
  height: 82px;
  display: grid;
  align-items: center;
  padding: 10px 32px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.60);
  background: rgba(245, 247, 250, 0.58);
  backdrop-filter: blur(24px) saturate(150%);
  box-shadow: 0 18px 48px rgba(59, 78, 132, 0.10);
}

:root[data-contrast="high"] .app-topbar {
  background: rgba(17, 24, 39, 0.95);
  border-bottom-color: var(--color-border);
}

:root.theme-dark .app-topbar {
  border-bottom-color: rgba(255, 255, 255, 0.08);
  background: rgba(20, 28, 48, 0.72);
  box-shadow: 0 18px 48px rgba(0, 0, 0, 0.26);
}

.app-topbar-inner {
  width: 100%;
  min-height: 62px;
  margin: 0;
  display: grid;
  grid-template-columns: 220px minmax(0, 1fr) 180px;
  gap: 20px;
  align-items: center;
}

.app-logo {
  display: inline-flex;
  align-items: center;
  gap: var(--space-3);
  min-width: 0;
  color: var(--color-text);
  text-decoration: none;
  font-weight: 750;
  padding-left: 4px;
}

.app-logo img {
  width: 146px;
  height: 46px;
  object-fit: contain;
}

.app-logo span {
  white-space: nowrap;
}

.app-nav {
  display: flex;
  gap: 10px;
  align-items: center;
  overflow-x: auto;
  padding: 0;
  scrollbar-width: thin;
  justify-content: center;
}

.icon-nav {
  overflow: visible;
}

.app-menu-icons {
  justify-content: center;
}

.menu-cluster {
  position: relative;
  flex: 0 0 auto;
}

.nav-icon-button {
  position: relative;
  width: 66px;
  height: 62px;
  display: grid;
  grid-template-rows: 1fr auto;
  place-items: center;
  border: 1px solid rgba(255, 255, 255, 0.58);
  border-radius: 17px;
  color: var(--color-text);
  background: rgba(255, 255, 255, 0.54);
  box-shadow: 0 12px 28px rgba(59, 78, 132, 0.12);
  cursor: pointer;
  backdrop-filter: blur(18px) saturate(150%);
  transition: transform 160ms ease, box-shadow 160ms ease, background 160ms ease, border-color 160ms ease;
  overflow: hidden;
}

:root.theme-dark .nav-icon-button {
  border-color: rgba(255, 255, 255, 0.12);
  color: #f5f7ff;
  background: rgba(22, 31, 53, 0.68);
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.22);
}

.app-menu-icon {
  flex: 0 0 auto;
}

.nav-icon-button:hover,
.nav-icon-button:focus-visible,
.nav-icon-button[aria-current="page"],
.menu-cluster.is-open .nav-icon-button {
  border-color: rgba(78, 115, 255, 0.36);
  background: rgba(231, 240, 255, 0.82);
  box-shadow: 0 18px 40px rgba(78, 115, 255, 0.20);
  transform: translateY(-2px);
}

.nav-icon-button[aria-current="page"],
.menu-cluster.is-open .nav-icon-button {
  color: #2f63f5;
}

:root.theme-dark .nav-icon-button:hover,
:root.theme-dark .nav-icon-button:focus-visible,
:root.theme-dark .nav-icon-button[aria-current="page"],
:root.theme-dark .menu-cluster.is-open .nav-icon-button {
  border-color: rgba(110, 139, 255, 0.42);
  color: #f5f7ff;
  background: rgba(42, 58, 94, 0.82);
  box-shadow: 0 18px 42px rgba(0, 0, 0, 0.30);
}

.nav-icon {
  width: 30px;
  height: 30px;
  display: grid;
  place-items: center;
  font-size: 1.45rem;
  line-height: 1;
  transform: translateY(0);
  transition: transform 160ms ease;
}

.ui-svg-icon {
  width: 22px;
  height: 22px;
  display: block;
  object-fit: contain;
}

.nav-icon .ui-svg-icon {
  width: 30px;
  height: 30px;
}

.nav-icon-label {
  max-width: 62px;
  color: var(--color-text);
  font-size: 0.66rem;
  font-weight: 750;
  line-height: 1.1;
  text-align: center;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
  opacity: 1;
  transition: opacity 160ms ease, transform 160ms ease;
  transform: translateY(0);
}

.nav-icon-button:hover .nav-icon,
.nav-icon-button:focus-visible .nav-icon,
.menu-cluster.is-open .nav-icon-button .nav-icon {
  transform: translateY(-2px) scale(1.03);
}

.nav-icon-button:hover .nav-icon-label,
.nav-icon-button:focus-visible .nav-icon-label,
.menu-cluster.is-open .nav-icon-button .nav-icon-label {
  opacity: 1;
  transform: translateY(0);
}

.menu-dropdown {
  position: absolute;
  top: calc(100% + 16px);
  left: 50%;
  z-index: 10;
  min-width: 240px;
  display: none;
  padding: var(--space-3);
  border: 1px solid var(--color-border);
  border-radius: 22px;
  background: var(--color-glass-strong);
  box-shadow: var(--shadow-soft);
  backdrop-filter: blur(26px) saturate(145%);
  transform: translateX(-50%);
}

:root.theme-dark .menu-dropdown {
  background: rgba(24, 35, 60, 0.94);
}

.menu-cluster.is-open .menu-dropdown {
  display: grid;
  gap: var(--space-2);
}

.menu-dropdown a {
  min-height: 40px;
  display: flex;
  align-items: center;
  padding: 0 var(--space-3);
  border-radius: var(--radius-sm);
  color: var(--color-text);
  text-decoration: none;
  font-size: 0.9rem;
}

.menu-dropdown a:hover,
.menu-dropdown a:focus-visible {
  color: #2f63f5;
  background: #e7f0ff;
}

.app-user {
  display: flex;
  gap: 10px;
  align-items: center;
  justify-content: flex-end;
  min-width: 0;
}

.topbar-actions {
  display: inline-flex;
  gap: 10px;
  align-items: center;
}

.topbar-action {
  width: 42px;
  height: 42px;
  display: inline-grid;
  place-items: center;
  border: 1px solid rgba(255, 255, 255, 0.58);
  border-radius: 999px;
  color: var(--color-text);
  background: rgba(255, 255, 255, 0.54);
  box-shadow: 0 10px 26px rgba(59, 78, 132, 0.12);
  cursor: pointer;
  transition: transform 160ms ease, background 160ms ease, box-shadow 160ms ease;
}

:root.theme-dark .topbar-action {
  border-color: rgba(255, 255, 255, 0.12);
  background: rgba(22, 31, 53, 0.72);
}

.topbar-action:hover,
.topbar-action:focus-visible,
.topbar-action[aria-expanded="true"] {
  background: rgba(231, 240, 255, 0.86);
  box-shadow: 0 14px 34px rgba(78, 115, 255, 0.18);
  transform: translateY(-1px);
}

:root.theme-dark .topbar-action:hover,
:root.theme-dark .topbar-action:focus-visible,
:root.theme-dark .topbar-action[aria-expanded="true"] {
  background: rgba(42, 58, 94, 0.88);
}

.topbar-action .ui-svg-icon {
  width: 20px;
  height: 20px;
}

:root.theme-dark .topbar-action .ui-svg-icon,
:root.theme-dark .input-action-button .ui-svg-icon {
  filter: invert(1) brightness(1.45);
}

.topbar-avatar {
  width: 36px;
  height: 36px;
  display: inline-grid;
  flex: 0 0 auto;
  place-items: center;
  border-radius: 999px;
  color: #ffffff;
  background: linear-gradient(135deg, var(--color-primary), #6f8cff);
  box-shadow: 0 10px 24px rgba(15, 98, 254, 0.18);
  font-size: 0.78rem;
  font-weight: 850;
}

.app-user-meta {
  min-width: 0;
  text-align: right;
}

.app-user-name {
  margin: 0;
  font-weight: 700;
  line-height: 1.2;
  max-width: 92px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.app-user-role {
  margin: 0;
  color: var(--color-muted);
  font-size: 0.82rem;
}

.profile-popover {
  position: fixed;
  top: 92px;
  right: 24px;
  z-index: 120;
  width: min(320px, calc(100vw - 32px));
  display: grid;
  gap: var(--space-4);
  padding: var(--space-5);
  border: 1px solid var(--color-border);
  border-radius: 24px;
  color: var(--color-text);
  background: var(--color-glass-strong);
  box-shadow: var(--shadow-soft);
  backdrop-filter: blur(24px) saturate(145%);
}

.profile-popover h2 {
  margin: 0;
  font-size: 1.2rem;
}

.profile-details {
  display: grid;
  grid-template-columns: 82px minmax(0, 1fr);
  gap: 8px 12px;
  margin: 0;
}

.profile-details dt {
  color: var(--color-muted);
  font-weight: 800;
}

.profile-details dd {
  margin: 0;
  min-width: 0;
  overflow-wrap: anywhere;
  font-weight: 700;
}

.profile-close {
  justify-self: end;
}

.app-card {
  border: 1px solid var(--color-border);
  border-radius: 28px;
  background: var(--color-glass);
  box-shadow: var(--shadow-subtle);
  backdrop-filter: blur(22px) saturate(140%);
}

:root.theme-dark .app-card {
  background: rgba(22, 31, 53, 0.72);
}

.app-card.padded {
  padding: var(--space-6);
}

.hero-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(320px, 0.9fr);
  gap: var(--space-7);
  align-items: center;
  min-height: calc(100vh - 128px);
}

.hero-copy {
  display: grid;
  gap: var(--space-5);
}

.brand-mark {
  width: min(220px, 70vw);
  padding: 10px 14px;
  border: 1px solid rgba(255, 255, 255, 0.72);
  border-radius: 20px;
  background: rgba(255, 255, 255, 0.94);
  box-shadow: 0 14px 34px rgba(59, 78, 132, 0.12);
}

.eyebrow {
  margin: 0;
  color: var(--color-primary-strong);
  font-weight: 700;
  letter-spacing: 0;
}

h1,
h2,
h3,
p {
  margin-top: 0;
}

.page-title {
  margin-bottom: var(--space-4);
  font-size: clamp(2rem, 5vw, 4.6rem);
  line-height: 1.02;
  letter-spacing: 0;
}

.section-title {
  margin-bottom: var(--space-3);
  font-size: clamp(1.6rem, 3vw, 2.6rem);
  line-height: 1.08;
}

.lead {
  max-width: 64ch;
  color: var(--color-muted);
  font-size: 1.14rem;
  line-height: 1.7;
}

.login-card {
  padding: var(--space-6);
  background: linear-gradient(145deg, rgba(255, 255, 255, 0.82), rgba(255, 255, 255, 0.54));
}

:root.theme-dark .login-card {
  background: linear-gradient(145deg, rgba(22, 31, 53, 0.86), rgba(24, 35, 60, 0.66));
}

.form-stack {
  display: grid;
  gap: var(--space-4);
}

.field-group {
  display: grid;
  gap: var(--space-2);
}

.field-group label {
  font-weight: 700;
}

.field-group input {
  width: 100%;
  min-height: 48px;
  padding: 0 var(--space-4);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  color: var(--color-text);
  background: var(--color-surface);
}

:root.theme-dark .field-group input {
  border-color: rgba(255, 255, 255, 0.14);
  background: rgba(15, 23, 42, 0.62);
}

.input-action-wrap {
  position: relative;
}

.input-action-wrap input {
  padding-right: 52px;
}

.input-action-button {
  position: absolute;
  top: 50%;
  right: 8px;
  width: 36px;
  height: 36px;
  display: inline-grid;
  place-items: center;
  border: 1px solid transparent;
  border-radius: 999px;
  color: var(--color-text);
  background: transparent;
  cursor: pointer;
  transform: translateY(-50%);
}

.input-action-button:hover,
.input-action-button:focus-visible {
  background: #e7f0ff;
}

:root.theme-dark .input-action-button:hover,
:root.theme-dark .input-action-button:focus-visible {
  background: rgba(42, 58, 94, 0.84);
}

.input-action-button[hidden] {
  display: none;
}

.input-action-button .ui-svg-icon {
  width: 18px;
  height: 18px;
}

.login-visual-loop {
  min-height: 220px;
  display: grid;
  place-items: end start;
  padding: var(--space-5);
  overflow: hidden;
  border-radius: 30px;
  color: var(--color-text);
  background:
    radial-gradient(circle at 78% 18%, rgba(122, 183, 255, 0.30), transparent 15rem),
    radial-gradient(circle at 18% 86%, rgba(184, 166, 255, 0.24), transparent 14rem),
    linear-gradient(145deg, rgba(255, 255, 255, 0.82), rgba(255, 255, 255, 0.42));
  box-shadow: var(--shadow-subtle);
}

:root.theme-dark .login-visual-loop {
  background:
    radial-gradient(circle at 78% 18%, rgba(110, 139, 255, 0.24), transparent 15rem),
    radial-gradient(circle at 18% 86%, rgba(111, 76, 255, 0.18), transparent 14rem),
    linear-gradient(145deg, rgba(38, 52, 79, 0.86), rgba(22, 31, 53, 0.62));
}

.login-visual-loop.has-login-image {
  background-size: cover;
  background-position: center;
}

.login-visual-caption {
  max-width: 22rem;
  padding: var(--space-3) var(--space-4);
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.72);
  backdrop-filter: blur(16px);
}

:root.theme-dark .login-visual-caption {
  background: rgba(22, 31, 53, 0.78);
}

.login-visual-caption strong {
  display: block;
  margin-bottom: 4px;
}

.login-visual-caption span {
  color: var(--color-muted);
  font-size: 0.9rem;
}

.app-button,
.app-button-secondary,
.app-button-danger {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 0 var(--space-5);
  border: 1px solid transparent;
  border-radius: 999px;
  cursor: pointer;
  text-decoration: none;
  font-weight: 700;
}

.app-button {
  color: #ffffff;
  background: linear-gradient(135deg, var(--color-primary), #7f94ff);
  box-shadow: 0 12px 28px rgba(78, 115, 255, 0.24);
}

.app-button:hover {
  background: var(--color-primary-strong);
}

.app-button-secondary {
  color: var(--color-text);
  background: rgba(255, 255, 255, 0.74);
  border-color: var(--color-border);
}

:root.theme-dark .app-button-secondary {
  background: rgba(22, 31, 53, 0.70);
}

.app-button-danger {
  color: #ffffff;
  background: var(--color-danger);
}

.app-button[disabled],
.app-button-secondary[disabled],
.app-button-danger[disabled] {
  cursor: not-allowed;
  opacity: 0.58;
}

.status-badge {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: 0 var(--space-3);
  border-radius: 999px;
  color: var(--color-primary-strong);
  background: rgba(15, 98, 254, 0.10);
  font-size: 0.82rem;
  font-weight: 700;
}

.status-badge.success {
  color: var(--color-success);
  background: rgba(16, 124, 65, 0.12);
}

.status-badge.warning {
  color: var(--color-warning);
  background: rgba(183, 121, 31, 0.14);
}

.status-badge.danger {
  color: var(--apple-red, #ff3b30);
  background: rgba(255, 59, 48, 0.12);
}

.status-badge.black {
  color: #ffffff;
  background: #000000;
}


.message-area {
  min-height: 28px;
  color: var(--color-muted);
  line-height: 1.5;
}

.message-area.error {
  color: var(--color-danger);
}

.message-area.success {
  color: var(--color-success);
}

.dashboard-header {
  display: flex;
  gap: var(--space-4);
  align-items: flex-end;
  justify-content: space-between;
  margin-bottom: var(--space-6);
}

.dashboard-main {
  width: min(1220px, calc(100% - 40px));
  margin: 126px auto 64px;
  display: grid;
  gap: 22px;
  padding: 0;
}

.dashboard-overview {
  display: grid;
  grid-template-columns: minmax(0, 1.12fr) minmax(360px, 0.82fr);
  gap: 22px;
  align-items: stretch;
  margin-bottom: 0;
}

.dashboard-hero-card {
  min-height: 300px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 180px;
  gap: 28px;
  align-items: center;
  padding: 34px;
  overflow: hidden;
  border-radius: 30px;
  background:
    radial-gradient(circle at 88% 18%, rgba(126, 158, 255, 0.30), transparent 17rem),
    linear-gradient(145deg, rgba(255, 255, 255, 0.86), rgba(255, 255, 255, 0.60));
}

:root.theme-dark .dashboard-hero-card {
  background:
    radial-gradient(circle at 88% 18%, rgba(110, 139, 255, 0.24), transparent 17rem),
    linear-gradient(145deg, rgba(31, 43, 70, 0.88), rgba(22, 31, 53, 0.70));
}

.dashboard-hero-copy {
  display: grid;
  gap: var(--space-4);
}

.dashboard-title {
  margin: 0;
  max-width: 15ch;
  font-size: clamp(36px, 4vw, 56px);
  line-height: 1.02;
  letter-spacing: -1.6px;
}

.dashboard-actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-3);
  align-items: center;
}

.dashboard-hero-visual {
  display: grid;
  place-items: center;
}

.hero-app-icon {
  width: 160px;
  aspect-ratio: 1;
  display: grid;
  place-items: center;
  border: 1px solid rgba(255, 255, 255, 0.7);
  border-radius: 36px;
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.86), rgba(255, 255, 255, 0.36)),
    linear-gradient(135deg, rgba(78, 115, 255, 0.90), rgba(127, 148, 255, 0.80));
  box-shadow: 0 34px 70px rgba(78, 115, 255, 0.24);
}

:root.theme-dark .hero-app-icon {
  border-color: rgba(255, 255, 255, 0.14);
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.10), rgba(255, 255, 255, 0.04)),
    linear-gradient(135deg, rgba(110, 139, 255, 0.90), rgba(127, 116, 255, 0.78));
}

.hero-app-icon span {
  width: 78px;
  height: 78px;
  display: grid;
  place-items: center;
  border-radius: 999px;
  color: #ffffff;
  background: linear-gradient(135deg, var(--color-primary), #6f8cff);
  font-size: 3.15rem;
  font-weight: 900;
}

.hero-app-icon span .ui-svg-icon {
  width: 54px;
  height: 54px;
}

.daily-summary {
  display: grid;
  gap: 18px;
  align-content: start;
  min-height: 300px;
  padding: 26px;
  color: #ffffff;
  border-radius: 30px;
  background:
    radial-gradient(circle at 82% 18%, rgba(122, 183, 255, 0.32), transparent 14rem),
    linear-gradient(145deg, rgba(22, 30, 46, 0.96), rgba(37, 48, 69, 0.88));
}

:root.theme-dark .daily-summary {
  background:
    radial-gradient(circle at 82% 18%, rgba(110, 139, 255, 0.26), transparent 14rem),
    linear-gradient(145deg, #26344f, #2f3e59);
}

.daily-summary .eyebrow,
.daily-summary dt {
  color: rgba(255, 255, 255, 0.72);
}

.daily-summary h2 {
  margin: 0;
  font-size: 1.55rem;
}

.summary-list {
  display: grid;
  gap: 12px;
  margin: 0;
}

.summary-list div {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-4);
  min-height: 58px;
  padding: 10px 12px;
  border: 1px solid rgba(255, 255, 255, 0.10);
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.06);
}

.summary-list div:last-child {
  padding: 10px 12px;
  border: 1px solid rgba(255, 255, 255, 0.10);
}

.summary-list dt {
  font-weight: 700;
}

.summary-list dd {
  margin: 0;
  display: grid;
  gap: 2px;
  text-align: right;
}

.summary-list dd strong {
  font-size: 1.45rem;
  font-weight: 850;
}

.summary-list dd span {
  color: rgba(255, 255, 255, 0.66);
  font-size: 0.78rem;
  font-weight: 700;
}

.kpi-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
  margin-bottom: 0;
}

.kpi-card {
  position: relative;
  min-height: 124px;
  display: grid;
  grid-template-columns: 52px minmax(0, 1fr);
  grid-template-areas:
    "icon label"
    "icon value"
    "spark text";
  align-items: center;
  column-gap: 14px;
  row-gap: 4px;
  padding: 18px;
  overflow: hidden;
  border-radius: 26px;
}

:root.theme-dark .kpi-card,
:root.theme-dark .data-panel {
  border-color: rgba(255, 255, 255, 0.12);
  background: rgba(22, 31, 53, 0.72);
}

.kpi-icon {
  grid-area: icon;
  width: 52px;
  height: 52px;
  display: grid;
  place-items: center;
  border-radius: 14px;
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.82), rgba(255, 255, 255, 0.42)),
    linear-gradient(135deg, rgba(15, 98, 254, 0.18), rgba(111, 140, 255, 0.14));
  box-shadow: 0 12px 26px rgba(23, 32, 51, 0.10);
  font-size: 1.25rem;
}

:root.theme-dark .kpi-icon,
:root.theme-dark .module-icon {
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.10), rgba(255, 255, 255, 0.04)),
    linear-gradient(135deg, rgba(110, 139, 255, 0.22), rgba(127, 116, 255, 0.12));
}

.kpi-label {
  grid-area: label;
  color: var(--color-muted);
  font-size: 0.86rem;
  font-weight: 800;
  text-transform: uppercase;
}

.kpi-card strong {
  grid-area: value;
  font-size: 2.05rem;
  line-height: 1;
}

.kpi-card p {
  grid-area: text;
  margin: 0;
  color: var(--color-muted);
  font-size: 0.86rem;
}

.kpi-sparkline {
  grid-area: spark;
  width: 52px;
  height: 18px;
  border-radius: 999px;
  background:
    linear-gradient(135deg, transparent 0 20%, rgba(15, 98, 254, 0.28) 20% 34%, transparent 34% 48%, rgba(111, 140, 255, 0.34) 48% 64%, transparent 64% 78%, rgba(15, 98, 254, 0.18) 78% 100%);
}

.dashboard-panels {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 18px;
}

.data-panel {
  padding: 24px;
  border-radius: 30px;
}

.panel-heading {
  display: flex;
  gap: var(--space-4);
  align-items: start;
  justify-content: space-between;
  margin-bottom: var(--space-4);
}

.panel-heading h2 {
  margin: 0;
  font-size: 1.35rem;
}

.panel-link {
  display: inline-flex;
  margin-top: var(--space-4);
  color: var(--color-primary-strong);
  font-weight: 800;
  text-decoration: none;
}


.panel-link:hover,
.panel-link:focus-visible {
  text-decoration: underline;
}

.metric-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-4);
}

.metric-card {
  padding: var(--space-5);
}

.metric-card strong {
  display: block;
  margin-top: var(--space-2);
  font-size: 2rem;
}

.metric-card span,
.dock-item span {
  color: var(--color-muted);
  font-size: 0.84rem;
  font-weight: 700;
}

.dashboard-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-4);
}

.module-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: var(--space-4);
}

.module-card {
  display: grid;
  gap: var(--space-4);
  min-height: 210px;
  padding: var(--space-5);
  color: var(--color-text);
  text-decoration: none;
}

.module-card:hover {
  transform: translateY(-2px);
  box-shadow: var(--shadow-soft);
}

.app-dock {
  position: fixed;
  inset: auto 0 0 0;
  z-index: 45;
  width: 100%;
  height: 30px;
  min-height: 30px;
  display: grid;
  grid-template-columns: 260px minmax(0, 1fr) 260px;
  gap: var(--space-2);
  align-items: center;
  margin: 0;
  padding: 3px var(--space-4);
  border-top: 1px solid rgba(255, 255, 255, 0.18);
  border-radius: 0;
  color: #f8fafc;
  background: rgba(15, 23, 42, 0.76);
  box-shadow: 0 -8px 28px rgba(23, 32, 51, 0.08);
  backdrop-filter: blur(22px) saturate(140%);
}

.status-dock {
  grid-template-columns: 260px minmax(0, 1fr) 260px;
}

.dock-item {
  display: inline-flex;
  gap: 6px;
  align-items: center;
  min-width: 0;
  padding: 0;
  border-radius: 0;
  background: transparent;
  font-size: 0.76rem;
}

.app-dock .dock-item span {
  color: rgba(248, 250, 252, 0.78);
}

.dock-user {
  justify-content: start;
}

.dock-brand {
  justify-content: center;
}

.dock-date {
  justify-content: end;
}

.dock-avatar {
  width: 20px;
  height: 20px;
  display: inline-grid;
  place-items: center;
  border-radius: 999px;
  color: #ffffff;
  background: linear-gradient(135deg, var(--color-primary), #6f8cff);
  font-size: 0.62rem;
  font-weight: 850;
}

.dock-brand a {
  color: #dbeafe;
  font-weight: 850;
  text-decoration: none;
}

.dock-brand a:hover,
.dock-brand a:focus-visible {
  text-decoration: underline;
}

.dock-item strong {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.module-icon {
  width: 48px;
  height: 48px;
  display: grid;
  place-items: center;
  border-radius: var(--radius-md);
  background: var(--color-surface-muted);
  font-size: 1.35rem;
}

.module-card h2 {
  margin-bottom: 0;
  font-size: 1.25rem;
}

.module-card p {
  margin-bottom: 0;
  color: var(--color-muted);
  line-height: 1.55;
}

.placeholder-table-wrap {
  overflow-x: auto;
  overflow-y: auto;
  max-height: 650px;
}

.placeholder-table {
  width: 100%;
  min-width: 620px;
  border-collapse: collapse;
}

.placeholder-table th,
.placeholder-table td {
  padding: var(--space-3) var(--space-4);
  border-bottom: 1px solid rgba(217, 226, 238, 0.72);
  text-align: left;
}

.placeholder-table th {
  color: var(--color-muted);
  font-size: 0.82rem;
  text-transform: uppercase;
  position: sticky;
  top: 0;
  z-index: 10;
  background-color: var(--color-surface);
}

.placeholder-table td {
  color: var(--color-text);
}

.page-actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-3);
  margin-top: var(--space-4);
}

.empty-state,
.loading-state,
.access-denied-state {
  padding: var(--space-6);
  text-align: center;
}

.empty-state p,
.loading-state p,
.access-denied-state p {
  color: var(--color-muted);
}

.content-stack {
  display: grid;
  gap: var(--space-5);
}

.info-list {
  display: grid;
  gap: var(--space-3);
  padding-left: 1.2rem;
  line-height: 1.7;
}

.app-footer {
  width: min(1120px, calc(100% - 32px));
  margin: auto auto 0;
  padding: var(--space-6) 0;
  color: var(--color-muted);
  font-size: 0.92rem;
  text-align: center;
}

.app-footer a {
  color: var(--color-primary-strong);
  font-weight: 700;
}

.accessibility-toggle {
  position: fixed;
  right: var(--space-4);
  bottom: calc(var(--dock-height) + 28px);
  z-index: 80;
  width: 52px;
  height: 52px;
  border: 1px solid rgba(255, 255, 255, 0.62);
  border-radius: 999px;
  color: var(--color-text);
  background: var(--color-glass-strong);
  box-shadow: var(--shadow-soft);
  cursor: pointer;
  display: grid;
  place-items: center;
  backdrop-filter: blur(18px) saturate(145%);
}

.accessibility-toggle .ui-svg-icon {
  width: 24px;
  height: 24px;
}

:root.theme-dark .accessibility-toggle .ui-svg-icon {
  filter: invert(1) brightness(1.35);
}

.accessibility-panel {
  position: fixed;
  right: var(--space-4);
  bottom: calc(var(--dock-height) + 92px);
  z-index: 80;
  width: min(320px, calc(100vw - 32px));
  padding: var(--space-4);
  border: 1px solid rgba(255, 255, 255, 0.62);
  border-radius: var(--radius-lg);
  background: var(--color-glass-strong);
  box-shadow: var(--shadow-soft);
}

.accessibility-panel[hidden] {
  display: none;
}

.accessibility-panel-header {
  display: grid;
  gap: var(--space-2);
  margin-bottom: var(--space-3);
}

.accessibility-panel-logo {
  width: 150px;
  max-height: 42px;
  object-fit: contain;
  filter: drop-shadow(0 8px 18px rgba(59, 78, 132, 0.16));
}

:root.theme-dark .accessibility-panel-logo {
  filter: drop-shadow(0 0 12px rgba(255, 255, 255, 0.20)) drop-shadow(0 10px 18px rgba(0, 0, 0, 0.25));
}

.accessibility-panel h2 {
  margin-bottom: 0;
  font-size: 1rem;
}

.accessibility-actions {
  display: grid;
  gap: var(--space-2);
}

.accessibility-actions button,
.accessibility-actions a {
  min-height: 40px;
  padding: var(--space-2) var(--space-3);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  color: var(--color-text);
  background: var(--color-surface);
  text-align: left;
  text-decoration: none;
  cursor: pointer;
}

.accessibility-actions button[aria-pressed="true"] {
  border-color: var(--color-primary);
  background: rgba(15, 98, 254, 0.10);
}

:root[data-reduce-transparency="on"] .app-card,
:root[data-reduce-transparency="on"] .app-topbar,
:root[data-reduce-transparency="on"] .accessibility-panel,
:root[data-reduce-transparency="on"] .app-dock,
:root[data-reduce-transparency="on"] .login-card,
:root[data-reduce-transparency="on"] .topbar-action,
:root[data-reduce-transparency="on"] .nav-icon-button {
  backdrop-filter: none;
  background: var(--color-surface);
}

:root.theme-dark[data-reduce-transparency="on"] .app-card,
:root.theme-dark[data-reduce-transparency="on"] .app-topbar,
:root.theme-dark[data-reduce-transparency="on"] .accessibility-panel,
:root.theme-dark[data-reduce-transparency="on"] .login-card,
:root.theme-dark[data-reduce-transparency="on"] .topbar-action,
:root.theme-dark[data-reduce-transparency="on"] .nav-icon-button {
  background: #161f35;
}

:root[data-menu-names="off"] .nav-icon-label {
  opacity: 0;
}

/* Correção 210P: reconstrução visual pelo modelo aprovado. */
.app-topbar {
  height: 88px;
  padding: 12px 34px;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.68), rgba(232, 240, 255, 0.48));
  border-bottom: 1px solid rgba(255, 255, 255, 0.64);
  box-shadow: 0 18px 50px rgba(59, 78, 132, 0.10);
}

:root.theme-dark .app-topbar {
  background:
    linear-gradient(135deg, rgba(20, 28, 48, 0.82), rgba(26, 35, 61, 0.66));
  border-bottom-color: rgba(255, 255, 255, 0.08);
}

.app-topbar-inner {
  grid-template-columns: 228px minmax(0, 1fr) 176px;
  gap: 18px;
}

.app-logo {
  width: 172px;
  min-height: 54px;
  justify-content: center;
  padding: 7px 12px;
  border: 1px solid rgba(255, 255, 255, 0.70);
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.92);
  box-shadow: 0 12px 30px rgba(59, 78, 132, 0.12);
}

:root.theme-dark .app-logo {
  border-color: rgba(255, 255, 255, 0.78);
  background: rgba(255, 255, 255, 0.96);
  box-shadow: 0 14px 34px rgba(0, 0, 0, 0.24);
}

.app-logo img {
  width: 142px;
  height: 40px;
}

.app-nav {
  gap: 10px;
}

.nav-icon-button {
  width: 76px;
  height: 64px;
  grid-template-rows: 34px 18px;
  padding: 7px 6px 6px;
  border-radius: 19px;
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.78), rgba(255, 255, 255, 0.46));
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.72),
    0 12px 30px rgba(59, 78, 132, 0.13);
}

:root.theme-dark .nav-icon-button {
  background:
    linear-gradient(145deg, rgba(35, 48, 79, 0.82), rgba(20, 29, 50, 0.70));
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.09),
    0 14px 32px rgba(0, 0, 0, 0.24);
}

.nav-icon-button:hover,
.nav-icon-button:focus-visible,
.menu-cluster.is-open .nav-icon-button {
  width: 76px;
  background:
    linear-gradient(145deg, rgba(231, 240, 255, 0.98), rgba(255, 255, 255, 0.72));
}

.nav-icon-button[aria-current="page"] {
  width: 76px;
  color: #ffffff;
  border-color: rgba(78, 115, 255, 0.52);
  background:
    radial-gradient(circle at 26% 14%, rgba(255, 255, 255, 0.36), transparent 1.8rem),
    linear-gradient(145deg, #4e73ff, #7f94ff);
}

.nav-icon-button[aria-current="page"] .nav-icon-label {
  color: #ffffff;
}

:root.theme-dark .nav-icon-button:hover,
:root.theme-dark .nav-icon-button:focus-visible,
:root.theme-dark .menu-cluster.is-open .nav-icon-button {
  background:
    linear-gradient(145deg, rgba(50, 67, 108, 0.94), rgba(30, 43, 74, 0.84));
}

:root.theme-dark .nav-icon-button[aria-current="page"] {
  color: #ffffff;
  background:
    radial-gradient(circle at 26% 14%, rgba(255, 255, 255, 0.18), transparent 1.8rem),
    linear-gradient(145deg, #5f7cff, #7f74ff);
}

.nav-icon {
  width: 28px;
  height: 28px;
}

.nav-icon .ui-svg-icon {
  width: 27px;
  height: 27px;
}

.nav-icon-label {
  width: 100%;
  max-width: 68px;
  min-width: 0;
  color: var(--color-text);
  font-size: 0.6rem;
  font-weight: 850;
  letter-spacing: 0;
  line-height: 1;
  text-align: center;
}

.menu-dropdown {
  top: calc(100% + 14px);
  border-radius: 20px;
  box-shadow: 0 24px 70px rgba(59, 78, 132, 0.20);
}

:root.theme-dark .menu-dropdown a:hover,
:root.theme-dark .menu-dropdown a:focus-visible {
  color: #b8c7ff;
  background: rgba(78, 115, 255, 0.20);
}

.topbar-actions {
  justify-content: flex-end;
}

.topbar-action {
  width: 44px;
  height: 44px;
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.78), rgba(255, 255, 255, 0.48));
}

:root.theme-dark .topbar-action {
  background:
    linear-gradient(145deg, rgba(35, 48, 79, 0.82), rgba(20, 29, 50, 0.72));
}

.dashboard-main {
  width: min(1240px, calc(100% - 36px));
  margin: 128px auto 66px;
  gap: 24px;
}

.dashboard-overview {
  grid-template-columns: minmax(0, 1.16fr) minmax(365px, 0.84fr);
  gap: 24px;
}

.dashboard-hero-card {
  min-height: 326px;
  grid-template-columns: minmax(0, 1fr) 210px;
  padding: 36px;
  border-radius: 32px;
  background:
    radial-gradient(circle at 86% 18%, rgba(78, 115, 255, 0.22), transparent 16rem),
    radial-gradient(circle at 8% 94%, rgba(180, 151, 255, 0.16), transparent 15rem),
    linear-gradient(145deg, rgba(255, 255, 255, 0.88), rgba(255, 255, 255, 0.58));
  box-shadow: 0 26px 72px rgba(59, 78, 132, 0.15);
}

:root.theme-dark .dashboard-hero-card {
  background:
    radial-gradient(circle at 86% 18%, rgba(110, 139, 255, 0.20), transparent 16rem),
    radial-gradient(circle at 8% 94%, rgba(127, 116, 255, 0.14), transparent 15rem),
    linear-gradient(145deg, rgba(31, 43, 70, 0.90), rgba(22, 31, 53, 0.72));
}

.dashboard-hero-copy {
  gap: 18px;
}

.dashboard-title {
  max-width: 17ch;
  font-size: clamp(40px, 4.4vw, 62px);
  line-height: 0.98;
}

.dashboard-hero-card .lead {
  max-width: 48ch;
  font-size: 1.03rem;
  line-height: 1.6;
}

.dashboard-actions .app-button,
.dashboard-actions .app-button-secondary {
  min-height: 42px;
  box-shadow: 0 12px 28px rgba(78, 115, 255, 0.16);
}

.hero-app-icon {
  width: 188px;
  border-radius: 42px;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.64),
    0 34px 76px rgba(78, 115, 255, 0.28);
}

.hero-app-icon span {
  width: 88px;
  height: 88px;
  font-size: 3.35rem;
}

.daily-summary {
  min-height: 326px;
  padding: 28px;
  border-radius: 32px;
  box-shadow: 0 28px 76px rgba(17, 24, 39, 0.24);
}

.daily-summary h2 {
  font-size: 1.68rem;
}

.summary-list {
  gap: 14px;
}

.summary-list div {
  min-height: 64px;
  padding: 12px 14px;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.10), rgba(255, 255, 255, 0.045));
}

.kpi-grid {
  gap: 18px;
}

.kpi-card {
  min-height: 142px;
  grid-template-columns: 58px minmax(0, 1fr) 54px;
  grid-template-areas:
    "icon label spark"
    "icon value spark"
    "icon text spark";
  padding: 20px;
  border-radius: 28px;
}

.kpi-card::after {
  content: "";
  position: absolute;
  right: -34px;
  bottom: -40px;
  width: 122px;
  height: 122px;
  border: 18px solid rgba(78, 115, 255, 0.10);
  border-radius: 999px;
}

:root.theme-dark .kpi-card::after {
  border-color: rgba(110, 139, 255, 0.13);
}

.kpi-icon {
  width: 58px;
  height: 58px;
  border-radius: 18px;
}

.kpi-icon .ui-svg-icon,
.module-icon .ui-svg-icon {
  width: 30px;
  height: 30px;
}

.kpi-label {
  font-size: 0.78rem;
  letter-spacing: 0;
}

.kpi-card strong {
  font-size: 2.28rem;
}

.kpi-sparkline {
  justify-self: end;
  width: 46px;
  height: 76px;
  border-radius: 999px;
  background:
    linear-gradient(180deg, rgba(78, 115, 255, 0.32), rgba(127, 148, 255, 0.08));
}

.dashboard-panels {
  gap: 20px;
}

.data-panel {
  padding: 26px;
  border-radius: 32px;
  box-shadow: 0 18px 50px rgba(59, 78, 132, 0.12);
}

:root.theme-dark .data-panel {
  box-shadow: 0 18px 54px rgba(0, 0, 0, 0.24);
}

.placeholder-table th,
.placeholder-table td {
  padding: 13px 16px;
}

:root.theme-dark .placeholder-table th,
:root.theme-dark .placeholder-table td {
  border-bottom-color: rgba(255, 255, 255, 0.10);
}

.login-card,
.login-visual-loop {
  border: 1px solid var(--color-border);
  box-shadow: 0 24px 70px rgba(59, 78, 132, 0.14);
}

:root.theme-dark .login-card,
:root.theme-dark .login-visual-loop {
  box-shadow: 0 24px 70px rgba(0, 0, 0, 0.26);
}

@media (max-width: 1100px) {
  .app-topbar-inner {
    grid-template-columns: 180px minmax(0, 1fr) 220px;
    padding: var(--space-3) 0;
  }

  .hero-grid {
    grid-template-columns: 1fr;
    min-height: auto;
  }

  .dashboard-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .dashboard-overview,
  .dashboard-hero-card,
  .dashboard-panels {
    grid-template-columns: 1fr;
  }

  .dashboard-hero-card {
    min-height: auto;
  }

  .dashboard-hero-visual {
    justify-content: start;
  }

  .module-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .dashboard-hero,
  .metric-grid {
    grid-template-columns: 1fr;
  }

  .app-dock {
    grid-template-columns: 220px minmax(0, 1fr) 220px;
  }
}

@media (max-width: 900px) {
  .app-topbar {
    height: auto;
    min-height: 82px;
  }

  .app-topbar-inner {
    grid-template-columns: 1fr;
  }

  .app-page.has-topbar {
    padding-top: 148px;
  }

  .app-page.dashboard-page.has-topbar {
    padding-top: 0;
  }

  .dashboard-main {
    margin-top: 166px;
  }

  .app-user {
    justify-content: space-between;
  }

  .kpi-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 600px) {
  :root {
    --topbar-height: 64px;
  }

  .app-main,
  .app-shell,
  .app-footer {
    width: min(100% - 24px, 1120px);
  }

  .app-page.has-topbar {
    padding-top: 156px;
  }

  .app-page.dashboard-page.has-topbar {
    padding-top: 0;
  }

  .dashboard-main {
    width: min(100% - 24px, 1180px);
    margin-top: 172px;
  }

  .login-card,
  .app-card.padded {
    padding: var(--space-5);
  }

  .dashboard-header {
    display: grid;
    align-items: start;
  }

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

  .dashboard-hero-card {
    padding: var(--space-5);
  }

  .dashboard-title {
    font-size: clamp(2.2rem, 12vw, 3.6rem);
  }

  .dashboard-actions,
  .dashboard-actions .app-button,
  .dashboard-actions .app-button-secondary {
    width: 100%;
  }

  .hero-app-icon {
    width: 128px;
    border-radius: 32px;
  }

  .hero-app-icon span {
    width: 62px;
    height: 62px;
    font-size: 2.6rem;
  }

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

  .panel-heading {
    display: grid;
  }

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

  .app-dock {
    grid-template-columns: 1fr;
    justify-items: center;
    min-height: auto;
    padding: 4px var(--space-3);
  }

  .dock-item {
    font-size: 0.72rem;
  }

  .dock-user,
  .dock-brand,
  .dock-date {
    justify-content: center;
  }

  .menu-dropdown {
    left: 0;
    transform: none;
  }

  .app-logo span {
    white-space: normal;
  }

  .app-user-meta {
    text-align: left;
  }
}

/* ========================================================================== 
   PADRAO VISUAL SMART3LAB — adaptado aos portais Certifique e Safeweb
   Referencia validada em 21/08/2026: tipografia, cabecalho, cartoes e formularios.
   ========================================================================== */
:root {
  --smart-bg: #f5f5f7;
  --smart-surface: #ffffff;
  --smart-surface-muted: #f4f5f6;
  --smart-text: #17232d;
  --smart-muted: #5f6d78;
  --smart-primary: #1f7599;
  --smart-primary-strong: #185f7e;
  --smart-primary-soft: #e9f2f6;
  --smart-border: #d9e0e5;
  --smart-border-strong: #aebbc5;
  --smart-shadow: 0 16px 42px rgba(23, 35, 45, 0.07);
  --smart-shadow-login: 0 28px 70px rgba(23, 35, 45, 0.15);
  --font-system: Inter, "Segoe UI", Roboto, Arial, sans-serif;
  --color-bg: var(--smart-bg);
  --color-surface: var(--smart-surface);
  --color-surface-muted: var(--smart-surface-muted);
  --color-text: var(--smart-text);
  --color-muted: var(--smart-muted);
  --color-primary: var(--smart-primary);
  --color-primary-strong: var(--smart-primary-strong);
  --color-border: var(--smart-border);
  --color-focus: #087dad;
  --radius-md: 12px;
  --radius-lg: 20px;
  --radius-button: 10px;
  --topbar-height: 72px;
}

body:not(.login-screen),
:root.theme-dim body:not(.login-screen) {
  background: var(--smart-bg) !important;
}

body:not(.login-screen)::before,
.app-page::before,
:root.theme-dim body:not(.login-screen)::before,
:root.theme-dark body:not(.login-screen)::before {
  display: none !important;
}

.app-page.has-topbar,
.app-page.dashboard-page.has-topbar {
  padding-top: var(--topbar-height) !important;
}

.app-main,
.app-shell,
.dashboard-main {
  width: min(1420px, calc(100% - 40px));
}

.app-main,
.dashboard-main {
  margin-top: 0 !important;
  padding-top: 28px;
}

.app-topbar {
  position: fixed;
  inset: 0 0 auto 0 !important;
  width: 100% !important;
  max-width: none !important;
  height: var(--topbar-height);
  padding: 0 28px;
  border: 0 !important;
  border-bottom: 1px solid #e5e8eb !important;
  border-radius: 0 !important;
  background: rgba(255, 255, 255, 0.96) !important;
  box-shadow: none !important;
  backdrop-filter: blur(18px) saturate(130%);
  transform: none !important;
}

.app-topbar-inner {
  width: min(1500px, 100%);
  min-height: var(--topbar-height);
  margin: 0 auto;
  display: grid;
  grid-template-columns: 190px minmax(0, 1fr) 210px !important;
  gap: 20px;
  align-items: center;
}

.app-logo {
  width: 176px;
  padding: 0;
  justify-self: start;
}

.app-logo img {
  width: 170px;
  height: 48px;
  object-fit: contain;
  object-position: left center;
}

.app-topbar .brand-logo--glow::before,
.login-screen .brand-logo--glow::before {
  display: none !important;
}

.app-nav {
  position: static !important;
  max-width: 100% !important;
  justify-self: center;
  justify-content: center;
  gap: 3px;
  overflow: visible !important;
  transform: none !important;
}

.menu-cluster {
  min-height: 42px;
  display: inline-flex;
  align-items: center;
  gap: 2px;
  padding: 4px 8px;
  border-radius: 10px;
  transition: background-color 160ms ease;
}

.menu-cluster:hover,
.menu-cluster:focus-within,
.menu-cluster.is-open,
.menu-cluster:has(.nav-icon-button[aria-current="page"]) {
  background: var(--smart-primary-soft);
}

.nav-icon-button {
  width: 24px !important;
  height: 28px !important;
  min-width: 24px;
  display: inline-grid;
  place-items: center;
  border: 0 !important;
  border-radius: 7px !important;
  color: var(--smart-muted) !important;
  background: transparent !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  transform: none !important;
}

.nav-icon,
.nav-icon-button .nav-icon {
  width: 19px !important;
  height: 19px !important;
  transform: none !important;
}

.nav-icon .ui-svg-icon {
  width: 19px !important;
  height: 19px !important;
}

.nav-icon-label {
  max-width: 88px !important;
  min-height: 0;
  color: var(--smart-text) !important;
  font-size: 0.77rem !important;
  font-weight: 650 !important;
  line-height: 1.1;
  opacity: 1 !important;
  transform: none !important;
}

.menu-cluster:has(.nav-icon-button[aria-current="page"]) .nav-icon-label,
.menu-cluster.is-open .nav-icon-label {
  color: var(--smart-primary-strong) !important;
  font-weight: 750 !important;
}

.menu-dropdown {
  top: calc(100% + 10px);
  left: 0;
  min-width: 250px;
  padding: 8px;
  border: 1px solid var(--smart-border);
  border-radius: 14px;
  background: #ffffff;
  box-shadow: 0 18px 44px rgba(23, 35, 45, 0.14);
  backdrop-filter: none;
  transform: none;
}

.menu-dropdown a {
  min-height: 40px;
  border-radius: 9px;
  font-size: 0.88rem;
  font-weight: 550;
}

.menu-dropdown a:hover,
.menu-dropdown a:focus-visible {
  color: var(--smart-primary-strong);
  background: var(--smart-primary-soft);
}

.app-user {
  justify-self: end;
}

.topbar-action {
  width: 38px;
  height: 38px;
  border: 1px solid var(--smart-border) !important;
  border-radius: 10px;
  background: #ffffff !important;
  box-shadow: none !important;
}

.topbar-action:hover,
.topbar-action:focus-visible,
.topbar-action[aria-expanded="true"] {
  background: var(--smart-primary-soft) !important;
  transform: none !important;
}

.topbar-avatar {
  background: var(--smart-primary);
  box-shadow: none;
}

.app-user-name {
  max-width: 125px;
  font-size: 0.86rem;
}

.app-user-role {
  font-size: 0.74rem;
}

.profile-popover,
.accessibility-panel {
  border: 1px solid var(--smart-border) !important;
  border-radius: 18px !important;
  background: #ffffff !important;
  box-shadow: 0 20px 48px rgba(23, 35, 45, 0.14) !important;
  backdrop-filter: none !important;
}

.app-card,
.data-panel,
.kpi-card,
.daily-summary,
.dashboard-hero-card,
.ios-calendar-widget,
.agenda-ios-card {
  border: 1px solid #e7eaed !important;
  border-radius: 18px !important;
  background: #ffffff !important;
  box-shadow: var(--smart-shadow) !important;
  backdrop-filter: none !important;
}

.dashboard-overview,
.dashboard-panels,
.kpi-grid {
  gap: 18px;
}

.dashboard-hero-card {
  min-height: 280px;
  padding: 28px;
}

.dashboard-title,
.page-title {
  max-width: none;
  color: var(--smart-text);
  font-size: clamp(2rem, 3.2vw, 3rem);
  line-height: 1.04;
  letter-spacing: -0.035em;
}

.section-title {
  color: var(--smart-text);
  font-size: clamp(1.35rem, 2vw, 1.8rem);
  letter-spacing: -0.025em;
}

.eyebrow,
.kpi-label {
  color: var(--smart-muted);
  font-size: 0.76rem;
  font-weight: 750;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.lead {
  color: var(--smart-muted);
  font-size: 0.98rem;
  line-height: 1.55;
}

.kpi-card {
  min-height: 124px;
  padding: 18px !important;
  border-left-width: 4px !important;
}

.kpi-card::after,
.hero-app-icon {
  display: none !important;
}

.kpi-card strong {
  font-size: 2rem;
}

.data-panel,
.app-card.padded {
  padding: 22px;
}

.app-button,
.app-button-secondary,
.app-button-danger {
  min-height: 42px;
  padding-inline: 18px;
  border-radius: 10px;
  box-shadow: none !important;
  font-weight: 700;
}

.app-button {
  border-color: var(--smart-primary) !important;
  background: var(--smart-primary) !important;
}

.app-button:hover,
.app-button:focus-visible {
  background: var(--smart-primary-strong) !important;
}

.app-button-secondary {
  color: var(--smart-text);
  border-color: var(--smart-border) !important;
  background: #ffffff !important;
}

.app-button-secondary:hover,
.app-button-secondary:focus-visible {
  border-color: var(--smart-border-strong) !important;
  background: var(--smart-surface-muted) !important;
}

input:not([type="checkbox"]):not([type="radio"]),
select,
textarea,
.field-group input {
  min-height: 46px;
  border: 1px solid var(--smart-border-strong) !important;
  border-radius: 11px !important;
  color: var(--smart-text) !important;
  background: #ffffff !important;
  box-shadow: none !important;
}

input:not([type="checkbox"]):not([type="radio"]):focus,
select:focus,
textarea:focus {
  border-color: var(--smart-primary) !important;
  box-shadow: 0 0 0 3px rgba(31, 117, 153, 0.12) !important;
}

.field-group label,
label > span:first-child {
  color: #3f4f5c;
  font-size: 0.85rem;
  font-weight: 650;
}

.placeholder-table,
.agenda-dia-table,
.table-scroll,
.table-responsive,
[class*="table-wrapper"] {
  max-width: 100%;
}

.table-scroll,
.table-responsive,
[class*="table-wrapper"] {
  overflow: auto;
}

.placeholder-table th,
.agenda-dia-table th {
  padding: 12px 14px !important;
  color: #536371 !important;
  background: #f4f5f6 !important;
  border-bottom: 1px solid #dfe4e8 !important;
  font-size: 0.74rem;
  font-weight: 750;
  letter-spacing: 0.045em;
  text-transform: uppercase;
}

.placeholder-table td,
.agenda-dia-table td {
  padding: 12px 14px !important;
  color: var(--smart-text) !important;
  background: #ffffff;
  border-bottom: 1px solid #eceff1 !important;
}

.placeholder-table tbody tr:hover td,
.agenda-dia-table tbody tr:hover td {
  background: #f8fafb;
}

/* Login com a composicao da referencia e fotos rotativas preservadas. */
.login-screen {
  background: #eef2f4 !important;
}

.login-background {
  opacity: 0;
  filter: saturate(0.72) contrast(0.92);
  transition: opacity 700ms ease !important;
}

.login-background.is-visible {
  opacity: 1;
}

.login-background::after {
  background: rgba(239, 243, 245, 0.82) !important;
}

.login-page .app-main {
  width: min(1180px, calc(100% - 40px));
  min-height: 100vh;
  display: grid;
  align-items: center;
  padding: 48px 0 64px;
}

.login-screen .hero-grid {
  min-height: 700px;
  grid-template-columns: minmax(0, 42%) minmax(0, 58%);
  gap: 0;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, 0.72);
  border-radius: 26px;
  background: rgba(255, 255, 255, 0.96);
  box-shadow: var(--smart-shadow-login);
}

.login-screen .hero-copy {
  position: relative;
  align-content: start;
  gap: 28px;
  padding: 56px 54px;
  overflow: hidden;
  color: #ffffff;
  background:
    linear-gradient(145deg, rgba(18, 72, 96, 0.92), rgba(20, 104, 135, 0.86)),
    rgba(20, 86, 112, 0.9);
}

.login-screen .hero-copy::after {
  content: "";
  position: absolute;
  width: 340px;
  height: 340px;
  top: -190px;
  right: -170px;
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 50%;
  box-shadow: 0 0 0 46px rgba(255, 255, 255, 0.035);
  pointer-events: none;
}

.login-screen .brand-mark {
  width: min(230px, 100%);
  padding: 12px 16px;
  border: 1px solid rgba(255, 255, 255, 0.26);
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.96);
  box-shadow: none;
}

.login-screen .hero-copy .eyebrow {
  color: rgba(255, 255, 255, 0.76);
}

.login-hero-title {
  max-width: 9ch;
  margin: 16px 0 22px;
  color: #ffffff;
  font-size: clamp(2.65rem, 4vw, 3.75rem);
  line-height: 0.98;
  letter-spacing: -0.055em;
}

.login-screen .hero-copy .lead {
  color: rgba(255, 255, 255, 0.88);
  font-size: 1rem;
  line-height: 1.55;
}

.login-feature-list {
  display: grid;
  gap: 12px;
  margin: auto 0 0;
  padding: 0;
  list-style: none;
}

.login-feature-list li {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr);
  gap: 12px;
  align-items: center;
  color: rgba(255, 255, 255, 0.92);
  font-size: 0.85rem;
  font-weight: 650;
}

.login-feature-list li::before {
  content: "✓";
  width: 34px;
  height: 34px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(255, 255, 255, 0.25);
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.08);
}

.login-card {
  align-self: center;
  width: min(470px, calc(100% - 64px));
  margin: 0 auto;
  padding: 42px 0;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.login-secure-label {
  margin-bottom: 14px;
  color: var(--smart-muted);
  font-size: 0.76rem;
  font-weight: 750;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.login-card .section-title {
  margin-bottom: 8px;
  font-size: clamp(2.2rem, 4vw, 3rem);
}

.login-card .form-stack {
  margin-top: 28px;
  gap: 16px;
}

.login-card .app-button {
  min-height: 48px;
}

.forgot-password-link {
  color: var(--smart-primary-strong);
  background: transparent !important;
  font-size: 0.86rem;
  font-weight: 650;
}

.login-theme-toggle {
  top: 24px;
  right: 28px;
}

/* Tema escuro conserva a mesma hierarquia, sem o efeito de vidro antigo. */
:root.theme-dark {
  --smart-bg: #111821;
  --smart-surface: #18222d;
  --smart-surface-muted: #202d39;
  --smart-text: #f3f6f8;
  --smart-muted: #aebbc5;
  --smart-primary: #56a8ca;
  --smart-primary-strong: #7ec1dd;
  --smart-primary-soft: #223b49;
  --smart-border: #32424f;
  --smart-border-strong: #536673;
}

:root.theme-dark body:not(.login-screen) {
  background: var(--smart-bg) !important;
}

:root.theme-dark .app-topbar,
:root.theme-dark .app-card,
:root.theme-dark .data-panel,
:root.theme-dark .kpi-card,
:root.theme-dark .dashboard-hero-card,
:root.theme-dark .daily-summary,
:root.theme-dark .profile-popover,
:root.theme-dark .accessibility-panel,
:root.theme-dark .menu-dropdown {
  border-color: var(--smart-border) !important;
  background: var(--smart-surface) !important;
  box-shadow: none !important;
}

:root.theme-dark input:not([type="checkbox"]):not([type="radio"]),
:root.theme-dark select,
:root.theme-dark textarea,
:root.theme-dark .app-button-secondary,
:root.theme-dim input:not([type="checkbox"]):not([type="radio"]),
:root.theme-dim select,
:root.theme-dim textarea {
  color: var(--smart-text) !important;
  border-color: var(--smart-border-strong) !important;
  background: var(--smart-surface) !important;
}

:root.theme-dark .placeholder-table th,
:root.theme-dark .agenda-dia-table th {
  color: var(--smart-muted) !important;
  background: var(--smart-surface-muted) !important;
}

:root.theme-dark .placeholder-table td,
:root.theme-dark .agenda-dia-table td {
  color: var(--smart-text) !important;
  background: var(--smart-surface) !important;
}

@media (max-width: 1220px) {
  .app-topbar-inner {
    grid-template-columns: 160px minmax(0, 1fr) 180px !important;
    gap: 10px;
  }

  .app-logo,
  .app-logo img {
    width: 150px;
  }

  .menu-cluster {
    padding-inline: 5px;
  }

  .nav-icon-label {
    font-size: 0.7rem !important;
  }
}

@media (max-width: 960px) {
  .app-topbar {
    height: 66px;
    padding-inline: 18px;
  }

  .app-topbar-inner {
    min-height: 66px;
    grid-template-columns: auto minmax(0, 1fr) auto !important;
  }

  .app-nav {
    display: none !important;
  }

  .app-logo {
    grid-column: auto;
    justify-self: start;
  }

  .app-user {
    grid-column: auto;
    justify-self: end;
  }

  .app-hamburger-menu {
    display: inline-grid;
  }

  .app-page.has-topbar,
  .app-page.dashboard-page.has-topbar {
    padding-top: 66px !important;
  }

  .login-screen .hero-grid {
    grid-template-columns: 1fr;
  }

  .login-screen .hero-copy {
    min-height: 320px;
    padding: 38px;
  }

  .login-feature-list {
    display: none;
  }

  .login-card {
    width: min(520px, calc(100% - 48px));
  }
}

@media (max-width: 600px) {
  .app-main,
  .app-shell,
  .dashboard-main {
    width: min(100% - 24px, 1420px);
  }

  .login-page .app-main {
    width: min(100% - 20px, 1180px);
    padding: 12px 0 28px;
  }

  .login-screen .hero-grid {
    min-height: auto;
    border-radius: 20px;
  }

  .login-screen .hero-copy {
    min-height: 250px;
    gap: 18px;
    padding: 28px 24px;
  }

  .login-hero-title {
    max-width: 12ch;
    margin: 10px 0 14px;
    font-size: 2.2rem;
  }

  .login-screen .hero-copy .lead {
    font-size: 0.9rem;
  }

  .login-card {
    width: calc(100% - 40px);
    padding: 34px 0;
  }

  .login-card .section-title {
    font-size: 2rem;
  }

  .login-theme-toggle {
    top: 18px;
    right: 18px;
  }
}

/* Correção 210Q: assets reais do usuário, logo transparente e sparklines SVG. */
.app-logo {
  width: 178px;
  min-height: 54px;
  justify-content: flex-start;
  padding: 0 0 0 4px;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

:root.theme-dark .app-logo {
  border-color: transparent;
  background: transparent;
  box-shadow: none;
}

.app-logo img {
  width: 160px;
  height: 46px;
  object-fit: contain;
  filter: drop-shadow(0 10px 22px rgba(59, 78, 132, 0.16));
}

:root.theme-dark .app-logo img {
  filter: drop-shadow(0 0 12px rgba(255, 255, 255, 0.22)) drop-shadow(0 12px 24px rgba(0, 0, 0, 0.30));
}

.brand-mark {
  width: min(220px, 70vw);
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  filter: drop-shadow(0 10px 22px rgba(59, 78, 132, 0.16));
}

:root.theme-dark .brand-mark {
  filter: drop-shadow(0 0 14px rgba(255, 255, 255, 0.22)) drop-shadow(0 12px 24px rgba(0, 0, 0, 0.26));
}

.nav-icon .ui-svg-icon {
  width: 31px;
  height: 31px;
  border-radius: 10px;
}

.kpi-sparkline {
  position: relative;
  z-index: 1;
  justify-self: end;
  width: 76px;
  height: 56px;
  display: grid;
  place-items: center;
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.34);
}

.kpi-sparkline img {
  width: 70px;
  height: 48px;
  opacity: 0.82;
}

:root.theme-dark .kpi-sparkline {
  background: rgba(255, 255, 255, 0.055);
}

/* Correção 210R: login com imagem grande, logo transparente e acessibilidade elevada. */
.hero-grid {
  grid-template-columns: minmax(0, 1.08fr) minmax(360px, 0.82fr);
  gap: clamp(28px, 4vw, 56px);
}

.login-visual-loop {
  min-height: clamp(320px, 46vh, 520px);
  width: 100%;
  place-items: end start;
  border-radius: 34px;
  background-size: cover;
  background-position: center;
  box-shadow: 0 28px 78px rgba(59, 78, 132, 0.18);
}

.login-visual-loop.has-login-image {
  background-size: cover;
  background-position: center;
}

.login-visual-caption {
  margin: 0;
  max-width: min(28rem, calc(100% - 24px));
  background: rgba(255, 255, 255, 0.76);
  box-shadow: 0 14px 34px rgba(59, 78, 132, 0.12);
}

:root.theme-dark .login-visual-loop {
  box-shadow: 0 28px 78px rgba(0, 0, 0, 0.34);
}

:root.theme-dark .login-visual-caption {
  background: rgba(18, 26, 49, 0.78);
  box-shadow: 0 14px 34px rgba(0, 0, 0, 0.24);
}

.brand-mark {
  width: min(240px, 70vw);
}

@media (max-width: 900px) {
  .login-visual-loop {
    min-height: 300px;
  }
}

/* Correção 210S: login com fundo em loop e painel de acessibilidade padronizado. */
.login-screen {
  position: relative;
  overflow-x: hidden;
  background: #0f172a;
}

.login-background {
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background:
    radial-gradient(circle at 16% 12%, rgba(78, 115, 255, 0.28), transparent 30rem),
    linear-gradient(125deg, #eaf1ff, #eef3ff 48%, #f1eeff);
  background-size: cover;
  background-position: center;
  transition: background-image 600ms ease, filter 300ms ease;
}

.login-background::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(90deg, rgba(234, 241, 255, 0.78), rgba(238, 243, 255, 0.42) 52%, rgba(241, 238, 255, 0.70)),
    radial-gradient(circle at 30% 20%, rgba(255, 255, 255, 0.38), transparent 28rem);
}

:root.theme-dark .login-background::after {
  background:
    linear-gradient(90deg, rgba(15, 23, 42, 0.78), rgba(18, 26, 49, 0.46) 52%, rgba(23, 20, 51, 0.74)),
    radial-gradient(circle at 30% 20%, rgba(110, 139, 255, 0.18), transparent 28rem);
}

.login-theme-toggle {
  position: fixed;
  top: 22px;
  right: 24px;
  z-index: 90;
}

.login-page {
  position: relative;
  z-index: 1;
  background: transparent;
}

.forgot-password-link {
  justify-self: center;
  min-height: 36px;
  padding: 0 var(--space-3);
  border: 0;
  border-radius: 999px;
  color: var(--color-primary-strong);
  background: transparent;
  cursor: pointer;
  font-weight: 800;
}

.forgot-password-link:hover,
.forgot-password-link:focus-visible {
  background: rgba(231, 240, 255, 0.84);
}

:root.theme-dark .forgot-password-link:hover,
:root.theme-dark .forgot-password-link:focus-visible {
  background: rgba(78, 115, 255, 0.16);
}

.login-dialog-backdrop {
  position: fixed;
  inset: 0;
  z-index: 130;
  display: grid;
  place-items: center;
  padding: var(--space-5);
  background: rgba(15, 23, 42, 0.42);
  backdrop-filter: blur(10px);
}

.login-dialog-backdrop[hidden] {
  display: none;
}

.login-dialog {
  width: min(420px, 100%);
}

.accessibility-toggle {
  bottom: 72px;
  color: #0f172a;
  background: rgba(255, 255, 255, 0.86);
}

:root.theme-dark .accessibility-toggle {
  color: #f5f7ff;
  background: rgba(22, 31, 53, 0.86);
}

.accessibility-panel {
  bottom: 138px;
  width: min(360px, calc(100vw - 32px));
  padding: 0;
  overflow: hidden;
}

.accessibility-panel-header {
  grid-template-columns: 36px 1fr 34px;
  align-items: center;
  gap: var(--space-3);
  margin: 0;
  padding: var(--space-4);
  border-bottom: 1px solid var(--color-border);
}

.accessibility-panel-icon {
  width: 36px;
  height: 36px;
  display: grid;
  place-items: center;
  border-radius: 999px;
  color: #2f63f5;
  background: #e7f0ff;
}

.accessibility-panel-icon .ui-svg-icon {
  width: 22px;
  height: 22px;
}

.accessibility-close {
  width: 34px;
  height: 34px;
  border: 1px solid var(--color-border);
  border-radius: 999px;
  color: var(--color-text);
  background: var(--color-glass);
  cursor: pointer;
  font-weight: 900;
}

.accessibility-actions {
  gap: 0;
}

.accessibility-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: var(--space-3);
  align-items: center;
  padding: var(--space-4);
  border-bottom: 1px solid rgba(217, 226, 238, 0.72);
}

:root.theme-dark .accessibility-row {
  border-bottom-color: rgba(255, 255, 255, 0.10);
}

.accessibility-row:last-child {
  border-bottom: 0;
}

.accessibility-row-copy {
  display: grid;
  gap: 4px;
}

.accessibility-row-copy strong {
  font-size: 0.92rem;
}

.accessibility-row-copy span {
  color: var(--color-muted);
  font-size: 0.78rem;
  line-height: 1.35;
}

.accessibility-font-buttons {
  display: inline-flex;
  gap: 6px;
}

.accessibility-actions button {
  min-height: 34px;
  padding: 0 12px;
  border-radius: 999px;
  white-space: nowrap;
  text-align: center;
}

.accessibility-font-buttons button {
  min-width: 42px;
  padding: 0 10px;
  font-weight: 900;
}

.accessibility-page-actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-3);
  order: -1;
}

.accessibility-page-icon {
  width: 56px;
  height: 56px;
  display: grid;
  place-items: center;
  border-radius: 20px;
  color: #2f63f5;
  background: #e7f0ff;
}

.accessibility-page-icon .ui-svg-icon {
  width: 34px;
  height: 34px;
}

/* Correção 210T: ajustes finos do login. */
.login-background {
  opacity: 0;
  transition: opacity 2200ms ease-in-out, filter 600ms ease;
}

.login-background.is-visible {
  opacity: 1;
}

/* CRM 2026-08: superfícies objetivas, rolagem segura e formulários densos. */
.app-card,
.schema-panel {
  border-radius: 18px;
  border-color: color-mix(in srgb, var(--color-border) 82%, transparent);
  box-shadow: 0 14px 38px rgba(15, 23, 42, 0.07);
}

.module-workspace,
.table-responsive,
.table-scroll,
.ios-table-wrapper,
.data-table-container,
.preview-table-container {
  max-width: 100%;
  overflow: auto;
  scrollbar-gutter: stable;
  overscroll-behavior: contain;
}

.module-workspace table,
.table-responsive table,
.table-scroll table,
.ios-table-wrapper table,
.data-table-container table,
.preview-table-container table { min-width: max-content; }

.pedido-field { display:grid; gap:5px; margin-top:9px; }
.pedido-field input { width:100%; }

@media (prefers-reduced-motion: reduce) {
  .login-background { transition: none !important; }
}

.brand-mark {
  width: min(240px, 70vw);
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  filter: none;
}

:root.theme-dark .brand-mark {
  filter: drop-shadow(0 0 10px rgba(255, 255, 255, 0.18));
}

/* Correção 210U: login sem card interno de imagem. */
.login-screen .hero-copy {
  align-content: center;
  max-width: 620px;
}

.login-screen .hero-copy .lead {
  max-width: 46rem;
}

/* Correção 210U: glow LED do logo Certifique no modo dark. */
.brand-logo {
  position: relative;
  isolation: isolate;
  display: inline-flex;
  align-items: center;
  width: fit-content;
}

.brand-logo--glow::before {
  content: "";
  position: absolute;
  inset: -16px -24px;
  z-index: -1;
  border-radius: 999px;
  pointer-events: none;
  background:
    radial-gradient(circle at 34% 48%, rgba(210, 230, 255, 0.18), transparent 58%),
    radial-gradient(circle at 62% 52%, rgba(70, 115, 255, 0.14), transparent 66%);
  filter: blur(18px);
  opacity: 0.18;
  transform: translateZ(0);
}

:root.theme-dark .brand-logo--glow::before {
  inset: -20px -30px;
  background:
    radial-gradient(circle at 32% 48%, rgba(210, 230, 255, 0.45), transparent 58%),
    radial-gradient(circle at 62% 52%, rgba(70, 115, 255, 0.65), transparent 68%);
  filter: blur(24px);
  opacity: 0.9;
}

.brand-logo--glow img {
  position: relative;
  z-index: 1;
}

:root.theme-dark .brand-logo--glow img {
  filter:
    drop-shadow(0 0 12px rgba(210, 230, 255, 0.42))
    drop-shadow(0 0 24px rgba(70, 115, 255, 0.46));
}

.login-brand-logo {
  margin-bottom: 2px;
}

/* Correção 210V: logo maior no login e na topbar, sem título duplicado. */
.login-screen .brand-mark {
  width: clamp(520px, 42vw, 720px);
  max-width: min(92vw, 720px);
}

.login-screen .hero-copy {
  gap: clamp(18px, 3vw, 34px);
}

.login-screen .eyebrow {
  margin-bottom: var(--space-3);
  font-size: 0.92rem;
  font-weight: 850;
  letter-spacing: 0.08em;
}

.app-topbar-inner {
  grid-template-columns: 260px minmax(0, 1fr) 250px;
}

.app-logo {
  width: 230px;
  min-height: 62px;
}

.app-logo img {
  width: 216px;
  height: 58px;
}

@media (max-width: 1100px) {
  .app-topbar-inner {
    grid-template-columns: 220px minmax(0, 1fr) 220px;
  }

  .app-logo {
    width: 204px;
  }

  .app-logo img {
    width: 196px;
    height: 54px;
  }
}

@media (max-width: 760px) {
  .login-screen .brand-mark {
    width: min(86vw, 360px);
  }
}

/* Correção 210Y: seletor real do logo no login com tamanho efetivo. */
.login-screen .login-brand-logo {
  width: min(100%, 720px);
  max-width: min(92vw, 720px);
}

.login-screen .login-hero-logo {
  display: block;
  width: clamp(520px, 42vw, 720px);
  max-width: min(92vw, 720px);
  height: auto;
  object-fit: contain;
}

@media (max-width: 760px) {
  .login-screen .login-brand-logo {
    max-width: min(92vw, 420px);
  }

  .login-screen .login-hero-logo {
    width: min(92vw, 420px);
    max-width: min(92vw, 420px);
  }
}

/* Correção 210Z: respiro entre logo e card e azul institucional no login. */
.login-screen .hero-grid {
  grid-template-columns: minmax(0, 1.12fr) minmax(380px, 0.72fr);
  column-gap: clamp(112px, 10vw, 184px);
}

.login-screen .hero-copy {
  justify-self: start;
  max-width: min(700px, 100%);
}

.login-screen .hero-copy .lead {
  max-width: 42rem;
  color: #1f2a44;
  font-weight: 560;
  text-shadow: 0 1px 12px rgba(255, 255, 255, 0.24);
}

.login-screen .eyebrow {
  color: #262789;
  text-shadow: 0 1px 10px rgba(38, 39, 137, 0.12);
}

:root.theme-dark .login-screen .eyebrow {
  color: #cfd7ff;
  text-shadow:
    0 0 12px rgba(210, 230, 255, 0.30),
    0 0 22px rgba(70, 115, 255, 0.26);
}

:root.theme-dark .login-screen .hero-copy .lead {
  color: rgba(235, 241, 255, 0.88);
  text-shadow: 0 1px 18px rgba(0, 0, 0, 0.30);
}

/* Correção 210U: card interno de imagem removido e glow LED refinado. */
.login-screen .login-visual-loop,
.login-screen .login-visual-caption {
  display: none;
}

.login-screen .brand-logo--glow::before,
.app-topbar .brand-logo--glow::before {
  inset: -18px -28px;
  background:
    radial-gradient(circle at 32% 48%, rgba(210, 230, 255, 0.20), transparent 58%),
    radial-gradient(circle at 62% 52%, rgba(70, 115, 255, 0.16), transparent 68%);
  filter: blur(20px);
  opacity: 0.22;
}

:root.theme-dark .login-screen .brand-logo--glow::before,
:root.theme-dark .app-topbar .brand-logo--glow::before {
  inset: -24px -36px;
  background:
    radial-gradient(circle at 31% 48%, rgba(210, 230, 255, 0.52), transparent 58%),
    radial-gradient(circle at 64% 52%, rgba(70, 115, 255, 0.72), transparent 70%);
  filter: blur(28px);
  opacity: 0.96;
}

:root.theme-dark .login-screen .brand-logo--glow img,
:root.theme-dark .app-topbar .brand-logo--glow img {
  filter:
    drop-shadow(0 0 10px rgba(230, 242, 255, 0.46))
    drop-shadow(0 0 24px rgba(70, 115, 255, 0.52))
    drop-shadow(0 0 42px rgba(70, 115, 255, 0.28));
}

@media (max-width: 1100px) {
  .login-screen .hero-grid {
    grid-template-columns: 1fr;
    column-gap: 0;
    row-gap: clamp(28px, 5vw, 48px);
  }

  .login-screen .hero-copy {
    justify-self: center;
  }
}

/* Correção 210ZD: aplicação do modelo HTML de referência descrito. */
body:not(.login-screen) {
  background:
    radial-gradient(ellipse at 12% 8%, rgba(78, 115, 255, 0.20), transparent 34rem),
    radial-gradient(ellipse at 88% 12%, rgba(180, 160, 255, 0.22), transparent 28rem),
    linear-gradient(135deg, #edf4ff 0%, #f7f9ff 46%, #eef1ff 100%);
}

body:not(.login-screen)::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background:
    linear-gradient(156deg, transparent 0 46%, rgba(255, 255, 255, 0.48) 46.2% 57%, transparent 57.2%),
    radial-gradient(circle at 50% 105%, rgba(78, 115, 255, 0.10), transparent 34rem);
}

:root.theme-dark body:not(.login-screen) {
  background:
    radial-gradient(ellipse at 12% 8%, rgba(76, 126, 255, 0.22), transparent 34rem),
    radial-gradient(ellipse at 88% 12%, rgba(126, 102, 255, 0.16), transparent 30rem),
    linear-gradient(135deg, #0d1325 0%, #111a31 52%, #16122c 100%);
}

:root.theme-dark body:not(.login-screen)::before {
  background:
    linear-gradient(156deg, transparent 0 45%, rgba(255, 255, 255, 0.045) 45.2% 57%, transparent 57.2%),
    radial-gradient(circle at 50% 105%, rgba(110, 139, 255, 0.12), transparent 34rem);
}

/* Correção 210U-A: reforço final contra card interno de imagem no login. */
.login-screen .login-visual-loop,
.login-screen .login-visual-caption,
.login-screen [data-login-visual-card] {
  display: none !important;
}

.login-screen .brand-logo--glow,
.app-topbar .brand-logo--glow {
  background: transparent;
  box-shadow: none;
}

.login-screen .brand-logo--glow::before,
.app-topbar .brand-logo--glow::before {
  background:
    radial-gradient(circle at 34% 48%, rgba(210, 230, 255, 0.18), transparent 58%),
    radial-gradient(circle at 62% 52%, rgba(70, 115, 255, 0.14), transparent 68%);
  opacity: 0.18;
}

:root.theme-dark .login-screen .brand-logo--glow::before,
:root.theme-dark .app-topbar .brand-logo--glow::before {
  background:
    radial-gradient(circle at 32% 48%, rgba(210, 230, 255, 0.52), transparent 58%),
    radial-gradient(circle at 64% 52%, rgba(70, 115, 255, 0.72), transparent 70%);
  filter: blur(30px);
  opacity: 0.96;
}

:root.theme-dark .login-screen .brand-logo--glow img,
:root.theme-dark .app-topbar .brand-logo--glow img {
  filter:
    drop-shadow(0 0 10px rgba(230, 242, 255, 0.46))
    drop-shadow(0 0 24px rgba(70, 115, 255, 0.52))
    drop-shadow(0 0 42px rgba(70, 115, 255, 0.28));
}

.app-card,
.data-panel,
.kpi-card,
.daily-summary,
.dashboard-hero-card {
  border: 1px solid rgba(255, 255, 255, 0.62);
  background-color: rgba(255, 255, 255, 0.58);
  box-shadow: 0 24px 70px rgba(59, 78, 132, 0.14);
  backdrop-filter: blur(28px) saturate(150%);
}

:root.theme-dark .app-card,
:root.theme-dark .data-panel,
:root.theme-dark .kpi-card,
:root.theme-dark .dashboard-hero-card {
  border-color: rgba(255, 255, 255, 0.12);
  background-color: rgba(20, 29, 51, 0.66);
  box-shadow: 0 26px 80px rgba(0, 0, 0, 0.30);
}

.app-topbar {
  top: 16px;
  left: 50%;
  right: auto;
  width: min(1240px, calc(100% - 32px));
  height: 84px;
  padding: 10px 18px;
  border-radius: 30px;
  border: 1px solid rgba(255, 255, 255, 0.68);
  background: rgba(255, 255, 255, 0.54);
  transform: translateX(-50%);
}

:root.theme-dark .app-topbar {
  background: rgba(16, 25, 46, 0.72);
}

.app-topbar-inner {
  grid-template-columns: 250px minmax(0, 1fr) 190px;
  gap: 16px;
}

.app-logo {
  width: 236px;
}

.app-logo img {
  width: 224px;
  height: 62px;
}

.app-nav {
  gap: 12px;
}

.menu-cluster {
  display: grid;
  justify-items: center;
  gap: 5px;
}

.nav-icon-button {
  width: 54px;
  height: 50px;
  grid-template-rows: 1fr;
  border-radius: 18px;
}

.nav-icon-button .nav-icon {
  width: 30px;
  height: 30px;
}

.nav-icon-label {
  max-width: 78px;
  min-height: 14px;
  color: rgba(24, 35, 61, 0.82);
  font-size: 0.66rem;
  font-weight: 800;
  line-height: 1;
  text-align: center;
}

:root.theme-dark .nav-icon-label {
  color: rgba(245, 247, 255, 0.82);
}

.menu-cluster.is-open .nav-icon-label,
.nav-icon-button[aria-current="page"] + .nav-icon-label {
  color: var(--color-primary-strong);
}

.nav-icon-button:hover .nav-icon-label,
.nav-icon-button:focus-visible .nav-icon-label,
.menu-cluster.is-open .nav-icon-button .nav-icon-label {
  transform: none;
}

.menu-dropdown {
  top: calc(100% + 14px);
}

.dashboard-main {
  width: min(1180px, calc(100% - 40px));
  margin-top: 132px;
  margin-bottom: 72px;
}

.dashboard-overview {
  grid-template-columns: minmax(0, 1.12fr) minmax(340px, 0.78fr);
  gap: 20px;
}

.dashboard-hero-card {
  min-height: 326px;
  border-radius: 28px;
  background:
    radial-gradient(circle at 86% 20%, rgba(78, 115, 255, 0.26), transparent 18rem),
    radial-gradient(circle at 12% 90%, rgba(180, 160, 255, 0.18), transparent 16rem),
    rgba(255, 255, 255, 0.58);
}

.daily-summary {
  border-radius: 28px;
}

.kpi-grid {
  gap: 18px;
}

.kpi-card {
  min-height: 136px;
  border-radius: 24px;
}

.dashboard-panels {
  gap: 20px;
}

.data-panel {
  min-height: 268px;
  border-radius: 28px;
}

.app-dock {
  left: 50%;
  right: auto;
  bottom: 12px;
  width: min(1180px, calc(100% - 40px));
  border-radius: 999px;
  transform: translateX(-50%);
}

.app-footer {
  padding-bottom: calc(var(--dock-height) + 18px);
}

.accessibility-toggle {
  bottom: 58px;
}

@media (max-width: 1100px) {
  .app-topbar {
    top: 10px;
    width: min(100% - 20px, 760px);
    height: auto;
  }

  .app-topbar-inner {
    grid-template-columns: 1fr;
    justify-items: center;
  }

  .app-user {
    justify-content: center;
  }

  .dashboard-main {
    margin-top: 210px;
  }
}

/* Correção 210ZE: acessibilidade completa, submenus por label e menu centralizado. */
.app-topbar-inner {
  grid-template-columns: minmax(220px, 1fr) auto minmax(220px, 1fr);
  justify-items: stretch;
}

.app-logo {
  justify-self: start;
}

.app-nav {
  justify-self: center;
  justify-content: center;
}

.app-user {
  justify-self: end;
}

.nav-icon-label {
  cursor: pointer;
  user-select: none;
}

.nav-icon-label:focus-visible {
  outline: 3px solid rgba(38, 39, 137, 0.42);
  outline-offset: 5px;
  border-radius: 999px;
}

:root[data-menu-names="off"] .nav-icon-label {
  visibility: hidden;
  opacity: 0;
}

.dock-brand a,
.app-footer a {
  color: var(--color-primary-strong);
  font-weight: 900;
  text-decoration: none;
}

.dock-brand a:hover,
.app-footer a:hover,
.dock-brand a:focus-visible,
.app-footer a:focus-visible {
  text-decoration: underline;
}

.accessibility-toggle {
  right: 22px;
  bottom: 70px;
  box-shadow: 0 18px 42px rgba(38, 39, 137, 0.24);
}

.accessibility-panel {
  right: 22px;
  bottom: 136px;
  width: min(390px, calc(100vw - 32px));
  padding: 18px;
  border: 1px solid rgba(255, 255, 255, 0.66);
  border-radius: 24px;
  background: rgba(255, 255, 255, 0.86);
  box-shadow: 0 24px 70px rgba(31, 42, 68, 0.22);
  backdrop-filter: blur(26px) saturate(150%);
}

:root.theme-dark .accessibility-panel {
  border-color: rgba(255, 255, 255, 0.14);
  background: rgba(18, 26, 47, 0.92);
  box-shadow: 0 26px 74px rgba(0, 0, 0, 0.40);
}

.accessibility-panel-header {
  display: grid;
  grid-template-columns: 44px 1fr 36px;
  align-items: center;
  gap: 10px;
  margin-bottom: 14px;
}

.accessibility-panel-header h2 {
  margin: 0;
  font-size: 1rem;
  font-weight: 900;
  letter-spacing: 0;
}

.accessibility-panel-header .accessibility-panel-icon {
  width: 42px;
  height: 42px;
  border-radius: 16px;
  display: grid;
  place-items: center;
  background: rgba(38, 39, 137, 0.10);
}

:root.theme-dark .accessibility-panel-header .accessibility-panel-icon {
  background: rgba(135, 166, 255, 0.16);
}

.accessibility-panel-header .ui-svg-icon {
  width: 25px;
  height: 25px;
}

.accessibility-close {
  width: 34px;
  height: 34px;
  border: 0;
  border-radius: 999px;
  background: rgba(31, 42, 68, 0.08);
  color: var(--color-text);
  cursor: pointer;
  font-size: 1rem;
  font-weight: 900;
}

:root.theme-dark .accessibility-close {
  background: rgba(255, 255, 255, 0.10);
  color: rgba(245, 247, 255, 0.92);
}

.accessibility-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 14px;
  padding: 13px 0;
  border-top: 1px solid rgba(31, 42, 68, 0.10);
}

:root.theme-dark .accessibility-row {
  border-top-color: rgba(255, 255, 255, 0.10);
}

.accessibility-row-copy {
  display: grid;
  gap: 4px;
}

.accessibility-row-copy strong {
  color: var(--color-text);
  font-size: 0.92rem;
  font-weight: 900;
}

.accessibility-row-copy span {
  color: var(--color-muted);
  font-size: 0.78rem;
  line-height: 1.35;
}

.accessibility-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 8px;
}

.accessibility-actions button {
  min-width: 44px;
  border: 1px solid rgba(38, 39, 137, 0.18);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.72);
  color: var(--color-text);
  cursor: pointer;
  font-weight: 900;
}

.accessibility-actions button[aria-pressed="true"] {
  border-color: rgba(38, 39, 137, 0.48);
  background: var(--color-primary);
  color: #fff;
}

:root.theme-dark .accessibility-actions button {
  border-color: rgba(255, 255, 255, 0.16);
  background: rgba(255, 255, 255, 0.08);
  color: rgba(245, 247, 255, 0.92);
}

:root.theme-dark .accessibility-actions button[aria-pressed="true"] {
  background: #8ea6ff;
  color: #081229;
}

@media (max-width: 1100px) {
  .app-topbar-inner {
    grid-template-columns: 1fr;
  }

  .app-logo,
  .app-nav,
  .app-user {
    justify-self: center;
  }
}

@media (max-width: 640px) {
  .accessibility-toggle {
    right: 14px;
    bottom: 82px;
  }

  .accessibility-panel {
    right: 14px;
    bottom: 148px;
  }

  .accessibility-row {
    grid-template-columns: 1fr;
    align-items: start;
  }

  .accessibility-actions {
    justify-content: flex-start;
  }
}

/* Correção 210ZG: topbar alinhada ao mesmo container do dashboard. */
:root {
  --app-shell-max-width: 1560px;
  --app-shell-padding: 40px;
  --app-shell-width: min(var(--app-shell-max-width), calc(100% - var(--app-shell-padding)));
}

.dashboard-main,
.app-topbar,
.app-dock {
  width: var(--app-shell-width);
  max-width: var(--app-shell-max-width);
  margin-inline: auto;
}

.dashboard-main {
  margin-left: auto;
  margin-right: auto;
}

.app-topbar {
  left: 50%;
  right: auto;
  box-sizing: border-box;
  transform: translateX(-50%);
}

.app-topbar-inner {
  width: 100%;
  grid-template-columns: minmax(230px, 1fr) auto minmax(230px, 1fr);
}

.app-nav {
  max-width: 100%;
  overflow-x: auto;
  overflow-y: visible;
  scrollbar-width: thin;
}

.app-dock {
  left: 50%;
  right: auto;
  transform: translateX(-50%);
}

@media (max-width: 1100px) {
  :root {
    --app-shell-padding: 28px;
  }

  .app-topbar {
    width: var(--app-shell-width);
    max-width: var(--app-shell-max-width);
  }

  .app-topbar-inner {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 640px) {
  :root {
    --app-shell-padding: 20px;
  }
}

/* Correção 210ZH: menu superior centralizado sem barra de rolagem. */
.app-topbar-inner {
  position: relative;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
}

.app-logo {
  grid-column: 1;
  z-index: 2;
}

.app-user {
  grid-column: 2;
  z-index: 2;
}

.app-nav {
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 1;
  max-width: none;
  justify-content: center;
  gap: 10px;
  overflow: visible;
  overflow-x: visible;
  overflow-y: visible;
  scrollbar-width: auto;
  transform: translate(-50%, -50%);
}

.nav-icon-button {
  width: 52px;
}

.nav-icon-label {
  max-width: 72px;
  font-size: 0.62rem;
}

@media (max-width: 1100px) {
  .app-topbar-inner {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  }

  .app-logo {
    justify-self: start;
  }

  .app-user {
    justify-self: end;
  }
}

@media (max-width: 960px) {
  .app-topbar-inner {
    grid-template-columns: 1fr;
    justify-items: center;
    row-gap: 10px;
  }

  .app-logo,
  .app-user {
    grid-column: 1;
    justify-self: center;
  }

  .app-nav {
    position: static;
    max-width: 100%;
    flex-wrap: wrap;
    transform: none;
  }
}

/* Correção 210ZI: parte inferior e barra inferior alinhadas ao dashboard. */
.dashboard-panels {
  width: 100%;
  margin-inline: auto;
}

.dashboard-main {
  margin-bottom: calc(var(--dock-height, 40px) + 96px);
  padding-bottom: 20px;
}

.app-dock {
  left: 0;
  right: 0;
  bottom: 12px;
  width: 100%;
  max-width: none;
  height: auto;
  min-height: 0;
  display: block;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  backdrop-filter: none;
  transform: none;
}

.app-dock-inner {
  width: var(--app-shell-width);
  max-width: var(--app-shell-max-width);
  min-height: 34px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  align-items: center;
  gap: 16px;
  margin-inline: auto;
  padding: 5px 16px;
  border: 1px solid rgba(255, 255, 255, 0.18);
  border-radius: 999px;
  color: #f8fafc;
  background: rgba(15, 23, 42, 0.82);
  box-shadow: 0 14px 42px rgba(23, 32, 51, 0.18);
  backdrop-filter: blur(22px) saturate(140%);
}

.dock-user {
  justify-self: start;
  justify-content: flex-start;
  max-width: 100%;
}

.dock-brand {
  justify-self: center;
  justify-content: center;
  text-align: center;
  white-space: nowrap;
}

.dock-date {
  justify-self: end;
  justify-content: flex-end;
  white-space: nowrap;
}

.dock-date strong,
.dock-date span {
  display: inline-flex;
}

.dock-item strong {
  min-width: 0;
}

.accessibility-toggle {
  bottom: 76px;
}

.accessibility-panel {
  bottom: 142px;
}

@media (max-width: 760px) {
  .dashboard-main {
    margin-bottom: calc(var(--dock-height, 40px) + 132px);
  }

  .app-dock-inner {
    grid-template-columns: 1fr;
    justify-items: center;
    gap: 4px;
    padding: 8px 14px;
    border-radius: 22px;
  }

  .dock-user,
  .dock-brand,
  .dock-date {
    justify-self: center;
    justify-content: center;
    text-align: center;
  }

  .dock-brand {
    white-space: normal;
  }
}

/* Correção 210ZJ: barras superior e inferior de ponta a ponta. */
.app-topbar {
  top: 0;
  left: 0;
  right: 0;
  width: 100%;
  max-width: none;
  height: 82px;
  padding: 0;
  border-radius: 0;
  border-width: 0 0 1px;
  border-color: rgba(255, 255, 255, 0.58);
  overflow: visible;
  background: rgba(245, 247, 250, 0.72);
  box-shadow: 0 12px 34px rgba(59, 78, 132, 0.12);
  transform: none;
}

:root.theme-dark .app-topbar {
  border-bottom-color: rgba(255, 255, 255, 0.10);
  background: rgba(16, 25, 46, 0.82);
  box-shadow: 0 14px 38px rgba(0, 0, 0, 0.28);
}

.app-topbar-inner {
  width: 100%;
  min-height: 82px;
  display: grid;
  grid-template-columns: 260px minmax(0, 1fr) 260px;
  align-items: center;
  gap: 14px;
  padding: 10px 24px;
  position: relative;
}

.app-logo {
  grid-column: 1;
  justify-self: start;
}

.app-user {
  grid-column: 3;
  justify-self: end;
}

.app-nav {
  position: static;
  grid-column: 2;
  justify-self: center;
  max-width: 100%;
  gap: 8px;
  flex-wrap: nowrap;
  overflow: visible;
  overflow-x: visible;
  overflow-y: visible;
  scrollbar-width: auto;
  transform: none;
}

.topbar-actions {
  justify-content: flex-end;
}

.app-dock {
  left: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  max-width: none;
  display: block;
  padding: 0;
  background: rgba(15, 23, 42, 0.84);
  border-top: 1px solid rgba(255, 255, 255, 0.16);
  border-radius: 0;
  box-shadow: 0 -10px 28px rgba(23, 32, 51, 0.14);
  backdrop-filter: blur(22px) saturate(140%);
  transform: none;
}

.app-dock-inner {
  width: 100%;
  max-width: none;
  min-height: 34px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  align-items: center;
  gap: 16px;
  margin: 0;
  padding: 6px 24px;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  backdrop-filter: none;
}

.app-footer {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 40;
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 7px 24px;
  display: flex;
  justify-content: center;
  border-top: 1px solid rgba(255, 255, 255, 0.16);
  color: #f8fafc;
  background: rgba(15, 23, 42, 0.84);
  box-shadow: 0 -10px 28px rgba(23, 32, 51, 0.14);
  backdrop-filter: blur(22px) saturate(140%);
  font-size: 0.76rem;
  font-weight: 800;
}

.dashboard-main {
  margin-top: 126px;
  margin-bottom: calc(var(--dock-height, 40px) + 74px);
  padding-bottom: 18px;
}

.dock-user {
  justify-self: start;
  justify-content: flex-start;
}

.dock-brand {
  justify-self: center;
  justify-content: center;
  text-align: center;
}

.dock-date {
  justify-self: end;
  justify-content: flex-end;
}

.tenant-badge {
  display: inline-flex;
  align-items: center;
  min-height: 20px;
  padding: 2px 8px;
  border: 1px solid rgba(255, 255, 255, 0.22);
  border-radius: 999px;
  color: rgba(248, 250, 252, 0.86);
  font-size: 0.64rem;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.tenant-ar-field {
  display: grid;
  gap: 8px;
  margin: 18px 0;
  padding: 16px;
  border: 1px solid rgba(75, 85, 99, 0.16);
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.62);
  box-shadow: 0 14px 34px rgba(15, 23, 42, 0.08);
}

.tenant-ar-field[hidden] {
  display: none !important;
}

.tenant-ar-field label {
  color: var(--color-text);
  font-size: 0.78rem;
  font-weight: 900;
  text-transform: uppercase;
}

.tenant-ar-field select,
.tenant-ar-field input {
  min-height: 42px;
  width: min(100%, 420px);
  padding: 0 14px;
  border: 1px solid rgba(75, 85, 99, 0.22);
  border-radius: 12px;
  color: var(--color-text);
  background: rgba(255, 255, 255, 0.82);
  font: inherit;
  font-weight: 700;
}

.tenant-ar-field p {
  max-width: 620px;
  margin: 0;
  color: var(--color-muted);
  font-size: 0.86rem;
}

.theme-dark .tenant-ar-field {
  border-color: rgba(148, 163, 184, 0.2);
  background: rgba(15, 23, 42, 0.58);
}

.theme-dark .tenant-ar-field select,
.theme-dark .tenant-ar-field input {
  border-color: rgba(148, 163, 184, 0.24);
  background: rgba(15, 23, 42, 0.82);
  color: #f8fafc;
}

.schema-flow,
.schema-grid,
.schema-field-grid {
  display: grid;
  gap: 14px;
}

.schema-flow {
  grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
  margin: 18px 0;
}

.schema-step,
.schema-panel {
  border: 1px solid rgba(75, 85, 99, 0.14);
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.7);
  box-shadow: 0 16px 38px rgba(15, 23, 42, 0.08);
}

.schema-step {
  padding: 16px;
}

.schema-step strong,
.schema-panel h3 {
  color: var(--color-text);
}

.schema-step span {
  display: inline-grid;
  place-items: center;
  width: 28px;
  height: 28px;
  margin-bottom: 10px;
  border-radius: 999px;
  color: #ffffff;
  background: #2563eb;
  font-weight: 900;
}

.schema-panel {
  padding: 18px;
}

.schema-panel h3 {
  margin: 0 0 12px;
  font-size: 1rem;
}

.schema-field-grid {
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
}

.readonly-field {
  min-height: 70px;
  padding: 12px;
  border: 1px solid rgba(75, 85, 99, 0.16);
  border-radius: 12px;
  background: rgba(248, 250, 252, 0.76);
}

.readonly-field span {
  display: block;
  margin-bottom: 6px;
  color: var(--color-muted);
  font-size: 0.72rem;
  font-weight: 900;
  text-transform: uppercase;
}

.masked-value {
  color: var(--color-text);
  font-weight: 900;
}

.integration-warning {
  margin: 16px 0;
  padding: 14px 16px;
  border: 1px solid rgba(245, 158, 11, 0.28);
  border-radius: 14px;
  color: #92400e;
  background: rgba(254, 243, 199, 0.72);
  font-weight: 800;
}

.disabled-action,
.disabled-action:disabled {
  cursor: not-allowed;
  opacity: 0.68;
}

.theme-dark .schema-step,
.theme-dark .schema-panel {
  border-color: rgba(148, 163, 184, 0.18);
  background: rgba(15, 23, 42, 0.62);
}

.theme-dark .readonly-field {
  border-color: rgba(148, 163, 184, 0.2);
  background: rgba(15, 23, 42, 0.72);
}

.theme-dark .integration-warning {
  color: #fde68a;
  border-color: rgba(251, 191, 36, 0.32);
  background: rgba(113, 63, 18, 0.36);
}

.accessibility-toggle {
  bottom: 58px;
}

.accessibility-panel {
  bottom: 124px;
}

@media (max-width: 1100px) {
  .app-topbar {
    top: 0;
    width: 100%;
    max-width: none;
    height: auto;
  }

  .app-topbar-inner {
    grid-template-columns: 220px minmax(0, 1fr) 190px;
    min-height: 82px;
    padding-inline: 16px;
  }

  .app-nav {
    gap: 6px;
  }

  .nav-icon-button {
    width: 48px;
  }

  .nav-icon-label {
    max-width: 66px;
    font-size: 0.58rem;
  }
}

@media (max-width: 900px) {
  .app-topbar-inner {
    grid-template-columns: 1fr;
    justify-items: center;
    row-gap: 10px;
    padding-block: 10px;
  }

  .app-logo,
  .app-user,
  .app-nav {
    grid-column: 1;
    justify-self: center;
  }

  .app-nav {
    flex-wrap: wrap;
  }

  .dashboard-main {
    margin-top: 190px;
  }
}

@media (max-width: 760px) {
  .app-dock-inner {
    grid-template-columns: 1fr;
    justify-items: center;
    gap: 4px;
    padding: 8px 14px;
  }

  .dock-user,
  .dock-brand,
  .dock-date {
    justify-self: center;
    justify-content: center;
    text-align: center;
  }

  .dashboard-main {
    margin-bottom: calc(var(--dock-height, 40px) + 132px);
  }

  .accessibility-toggle {
    bottom: 92px;
  }

  .accessibility-panel {
    bottom: 158px;
  }
}

/* ==========================================================================
   Apple iOS Style Modal, Switches and Elements
   ========================================================================== */

.ios-modal-backdrop {
  position: fixed;
  inset: 0;
  z-index: 2000;
  display: grid;
  place-items: center;
  padding: 20px;
  background-color: rgba(0, 0, 0, 0.4);
  backdrop-filter: blur(16px) saturate(190%);
  animation: iosFadeIn 250ms ease-out;
}

[hidden] {
  display: none !important;
}

:root.theme-dark .ios-modal-backdrop {
  background-color: rgba(0, 0, 0, 0.65);
}

.ios-modal-sheet {
  width: min(500px, 100%);
  background: var(--color-surface);
  border-radius: 14px;
  border: 1px solid var(--color-border);
  box-shadow: 0 24px 60px rgba(0, 0, 0, 0.15);
  display: flex;
  flex-direction: column;
  overflow: hidden;
  max-height: 90vh;
  animation: iosSlideUp 300ms cubic-bezier(0.16, 1, 0.3, 1);
}

:root.theme-dark .ios-modal-sheet {
  box-shadow: 0 24px 60px rgba(0, 0, 0, 0.45);
}

.ios-modal-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 16px 20px;
  border-bottom: 0.5px solid var(--color-border);
  background: var(--color-surface);
}

.ios-modal-header h2 {
  margin: 0;
  font-size: 1.15rem;
  font-weight: 600;
  color: var(--color-text);
  letter-spacing: -0.3px;
}

.ios-modal-close-btn {
  background: none;
  border: none;
  font-size: 1.6rem;
  line-height: 1;
  cursor: pointer;
  color: var(--color-muted);
  padding: 4px;
  display: grid;
  place-items: center;
  transition: color 150ms;
}

.ios-modal-close-btn:hover {
  color: var(--color-text);
}

.ios-modal-sheet form {
  padding: 20px;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.ios-modal-sheet form > * {
  flex-shrink: 0;
}

.ios-grouped-section {
  background: var(--color-bg);
  border-radius: 10px;
  border: 1px solid var(--color-border);
  overflow: hidden;
  display: flex;
  flex-direction: column;
}

.ios-grouped-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 11px 16px;
  gap: 12px;
  border-bottom: 0.5px solid var(--color-border);
}

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

.ios-grouped-row label {
  font-size: 0.95rem;
  font-weight: 500;
  color: var(--color-text);
  min-width: 100px;
  flex-shrink: 0;
  text-align: left;
}

.ios-grouped-row input[type="text"],
.ios-grouped-row input[type="email"],
.ios-grouped-row input[type="password"],
.ios-grouped-row select {
  flex: 1;
  border: none;
  background: transparent;
  color: var(--color-text);
  font-size: 0.95rem;
  padding: 4px 0;
  outline: none;
  text-align: right;
  -webkit-appearance: none;
  appearance: none;
}

.ios-grouped-row select {
  cursor: pointer;
  padding-right: 12px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238e8e93' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='8 9 12 13 16 9'%3E%3C/polyline%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right center;
  background-size: 14px;
}

.ios-grouped-row input::placeholder {
  color: var(--color-muted);
  opacity: 0.8;
}

.ios-switch-row {
  min-height: 48px;
  padding-block: 8px;
}

.ios-switch-label-wrap {
  display: flex;
  flex-direction: column;
  gap: 1px;
  text-align: left;
  flex: 1;
}

.ios-switch-title {
  font-size: 0.95rem;
  font-weight: 500;
  color: var(--color-text);
}

.ios-switch-desc {
  font-size: 0.75rem;
  color: var(--color-muted);
}

/* UISwitch Estilização */
.ios-switch {
  position: relative;
  display: inline-block;
  width: 51px;
  height: 31px;
  flex-shrink: 0;
}

.ios-switch input {
  opacity: 0;
  width: 0;
  height: 0;
}

.ios-switch-slider {
  position: absolute;
  cursor: pointer;
  inset: 0;
  background-color: var(--color-surface-muted);
  border-radius: 34px;
  transition: background-color 200ms, border-color 200ms;
  border: 1px solid var(--color-border);
}

.ios-switch-slider::before {
  content: "";
  position: absolute;
  height: 27px;
  width: 27px;
  left: 1px;
  bottom: 1px;
  background-color: white;
  border-radius: 50%;
  transition: transform 200ms cubic-bezier(0.25, 0.8, 0.25, 1);
  box-shadow: 0 3px 8px rgba(0, 0, 0, 0.12), 0 1px 3px rgba(0, 0, 0, 0.04);
}

.ios-switch input:checked + .ios-switch-slider {
  background-color: var(--color-success);
  border-color: var(--color-success);
}

.ios-switch input:checked + .ios-switch-slider::before {
  transform: translateX(20px);
}

.ios-switch input:disabled + .ios-switch-slider {
  opacity: 0.5;
  cursor: not-allowed;
}

.ios-modal-footer {
  display: flex;
  gap: 12px;
  justify-content: flex-end;
  margin-top: 10px;
}

.ios-btn-primary,
.ios-btn-secondary {
  font-size: 0.95rem;
  font-weight: 600;
  padding: 10px 20px;
  border-radius: 8px;
  border: none;
  cursor: pointer;
  transition: opacity 150ms, background-color 150ms;
}

.ios-btn-primary {
  background-color: var(--color-primary);
  color: white;
}

.ios-btn-primary:hover:not(:disabled) {
  opacity: 0.9;
}

.ios-btn-primary:disabled {
  opacity: 0.4;
  cursor: not-allowed;
}

.ios-btn-secondary {
  background-color: var(--color-surface-muted);
  color: var(--color-text);
}

.ios-btn-secondary:hover {
  background-color: var(--color-border);
}

/* Toast de Simulação */
.ios-toast {
  position: fixed;
  inset: 0;
  z-index: 3000;
  display: grid;
  place-items: center;
  padding: 20px;
  background-color: rgba(0, 0, 0, 0.5);
  backdrop-filter: blur(8px);
  animation: iosFadeIn 200ms ease-out;
}

.ios-toast-content {
  width: min(420px, 100%);
  background: var(--color-surface);
  border-radius: 14px;
  border: 1px solid var(--color-border);
  padding: 20px;
  display: flex;
  flex-direction: column;
  gap: 14px;
  box-shadow: 0 30px 70px rgba(0, 0, 0, 0.25);
  text-align: center;
  animation: iosScaleUp 250ms cubic-bezier(0.16, 1, 0.3, 1);
}

.ios-toast-content strong {
  font-size: 1.1rem;
  font-weight: 600;
  color: var(--color-text);
}

.ios-toast-content pre {
  text-align: left;
  background: var(--color-bg);
  padding: 12px;
  border-radius: 8px;
  border: 0.5px solid var(--color-border);
  font-family: monospace;
  font-size: 0.82rem;
  overflow-x: auto;
  color: var(--color-text);
  margin: 0;
}

.ios-toast-content .ios-btn-primary.small {
  padding: 8px 16px;
  align-self: center;
}

/* Animações */
@keyframes iosFadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}

@keyframes iosSlideUp {
  from { transform: translateY(30px); opacity: 0; }
  to { transform: translateY(0); opacity: 1; }
}

@keyframes iosScaleUp {
  from { transform: scale(0.95); opacity: 0; }
  to { transform: scale(1); opacity: 1; }
}

/* ==========================================================================
   Apple iOS Style Mobile Drawer & Responsive Sizing Enhancements
   ========================================================================== */

/* Hamburger menu button */
.app-hamburger-menu {
  display: none;
  width: 44px;
  height: 44px;
  place-items: center;
  border: 1px solid rgba(255, 255, 255, 0.58);
  border-radius: 12px;
  color: var(--color-text);
  background: rgba(255, 255, 255, 0.54);
  box-shadow: 0 10px 26px rgba(59, 78, 132, 0.12);
  cursor: pointer;
  transition: transform 160ms ease, background 160ms ease, box-shadow 160ms ease;
}

:root.theme-dark .app-hamburger-menu {
  border-color: rgba(255, 255, 255, 0.12);
  background: rgba(22, 31, 53, 0.72);
  color: #f5f7ff;
}

.app-hamburger-menu:hover,
.app-hamburger-menu:focus-visible {
  background: rgba(231, 240, 255, 0.86);
  box-shadow: 0 14px 34px rgba(78, 115, 255, 0.18);
  transform: scale(1.02);
}

:root.theme-dark .app-hamburger-menu:hover,
:root.theme-dark .app-hamburger-menu:focus-visible {
  background: rgba(42, 58, 94, 0.88);
}

.app-hamburger-menu svg {
  width: 22px;
  height: 22px;
}

/* Mobile drawer backdrop */
.ios-menu-drawer-backdrop {
  position: fixed;
  inset: 0;
  z-index: 2400;
  background: rgba(0, 0, 0, 0.35);
  backdrop-filter: blur(8px);
  opacity: 0;
  pointer-events: none;
  transition: opacity 300ms ease;
}

.ios-menu-drawer-backdrop.is-open {
  opacity: 1;
  pointer-events: auto;
}

/* Mobile drawer */
.ios-menu-drawer {
  position: fixed;
  top: 0;
  left: 0;
  bottom: 0;
  width: min(290px, 85vw);
  z-index: 2500;
  background: var(--color-glass-strong);
  backdrop-filter: blur(28px) saturate(155%);
  border-right: 0.5px solid var(--color-border);
  box-shadow: 0 0 50px rgba(0, 0, 0, 0.18);
  padding: var(--space-4);
  transform: translateX(-100%);
  transition: transform 320ms cubic-bezier(0.16, 1, 0.3, 1);
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
}

:root.theme-dark .ios-menu-drawer {
  background: rgba(24, 35, 60, 0.94);
  box-shadow: 0 0 50px rgba(0, 0, 0, 0.45);
}

.ios-menu-drawer.is-open {
  transform: translateX(0);
}

.ios-drawer-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding-bottom: var(--space-3);
  border-bottom: 0.5px solid var(--color-border);
}

.ios-drawer-close-btn {
  background: none;
  border: none;
  color: var(--color-muted);
  cursor: pointer;
  padding: var(--space-2);
  display: grid;
  place-items: center;
  border-radius: 999px;
  transition: background 150ms, color 150ms;
}

.ios-drawer-close-btn:hover {
  color: var(--color-text);
  background: rgba(0, 0, 0, 0.05);
}

:root.theme-dark .ios-drawer-close-btn:hover {
  background: rgba(255, 255, 255, 0.08);
}

.ios-drawer-nav {
  flex: 1;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
  padding-right: var(--space-1);
}

/* Accordion item style inside drawer */
.ios-drawer-item-container {
  display: flex;
  flex-direction: column;
  border-bottom: 0.5px solid var(--color-border);
  padding-bottom: var(--space-2);
}

.ios-drawer-accordion-btn {
  width: 100%;
  background: none;
  border: none;
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 8px;
  cursor: pointer;
  text-align: left;
  border-radius: 10px;
  transition: background-color 150ms;
}

.ios-drawer-accordion-btn:hover,
.ios-drawer-accordion-btn:focus-visible {
  background-color: rgba(78, 115, 255, 0.08);
}

.ios-drawer-item-icon-wrap {
  display: grid;
  place-items: center;
  width: 32px;
  height: 32px;
  border-radius: 8px;
  background: rgba(15, 98, 254, 0.08);
}

:root.theme-dark .ios-drawer-item-icon-wrap {
  background: rgba(110, 139, 255, 0.12);
}

.ios-drawer-item-icon-wrap img {
  width: 18px;
  height: 18px;
}

.ios-drawer-item-text {
  flex: 1;
  font-weight: 600;
  font-size: 0.95rem;
  color: var(--color-text);
}

.ios-drawer-item-chevron {
  color: var(--color-muted);
  transition: transform 250ms ease;
  display: flex;
  align-items: center;
}

.ios-drawer-accordion-btn[aria-expanded="true"] .ios-drawer-item-chevron {
  transform: rotate(90deg);
}

/* Submenu items list */
.ios-drawer-submenu-list {
  display: grid;
  grid-template-rows: 0fr;
  transition: grid-template-rows 250ms ease, padding 250ms ease;
  overflow: hidden;
  padding-left: 44px;
}

.ios-drawer-submenu-list.is-open {
  grid-template-rows: 1fr;
  padding-top: var(--space-1);
  padding-bottom: var(--space-2);
}

.ios-drawer-submenu-link {
  min-height: 36px;
  display: flex;
  align-items: center;
  color: var(--color-muted);
  text-decoration: none;
  font-size: 0.88rem;
  font-weight: 500;
  border-radius: 6px;
  padding: 0 10px;
  transition: color 150ms, background-color 150ms;
}

.ios-drawer-submenu-link:hover,
.ios-drawer-submenu-link:focus-visible {
  color: var(--color-primary-strong);
  background-color: rgba(78, 115, 255, 0.06);
}

.ios-drawer-submenu-link.is-active {
  color: var(--color-primary-strong);
  font-weight: 700;
  background-color: rgba(78, 115, 255, 0.10);
}

/* Media query updates */
@media (max-width: 900px) {
  .app-hamburger-menu {
    display: inline-grid;
  }
  .app-nav {
    display: none !important;
  }
  .app-topbar-inner {
    grid-template-columns: auto minmax(0, 1fr) auto !important;
    gap: 16px;
    padding: var(--space-2) 0;
  }
  .app-logo img {
    height: 36px;
    width: auto;
  }
  .app-page.has-topbar {
    padding-top: 100px;
  }
  .app-main {
    padding-top: var(--space-4);
  }
}

@media (max-width: 600px) {
  .app-topbar {
    padding: 8px 16px;
  }
  .app-user-meta {
    display: none; /* Hide role and name to save space on mobile */
  }
  .topbar-actions {
    gap: 6px;
  }
  .topbar-action {
    width: 38px;
    height: 38px;
  }
  .app-logo img {
    height: 32px;
  }
}

/* theme-dim overrides to support 1/2 Dark theme */
:root.theme-dim body:not(.login-screen) {
  background:
    radial-gradient(ellipse at 12% 8%, rgba(99, 102, 241, 0.14), transparent 34rem),
    radial-gradient(ellipse at 88% 12%, rgba(129, 140, 248, 0.10), transparent 28rem),
    linear-gradient(135deg, #242730 0%, #2d3139 52%, #353a44 100%) !important;
}

:root.theme-dim body:not(.login-screen)::before {
  background:
    linear-gradient(156deg, transparent 0 45%, rgba(255, 255, 255, 0.04) 45.2% 57%, transparent 57.2%),
    radial-gradient(circle at 50% 105%, rgba(99, 102, 241, 0.10), transparent 34rem) !important;
}

:root.theme-dark .app-page::before {
  background: linear-gradient(135deg, rgba(22, 31, 53, 0.42), rgba(78, 115, 255, 0.06) 48%, rgba(111, 76, 255, 0.08)) !important;
}

:root.theme-dim .app-page::before {
  background: linear-gradient(135deg, rgba(58, 63, 75, 0.42), rgba(99, 102, 241, 0.06) 48%, rgba(129, 140, 248, 0.08)) !important;
}

:root.theme-dim .app-topbar {
  border-bottom-color: rgba(255, 255, 255, 0.08) !important;
  background: rgba(45, 49, 57, 0.72) !important;
  box-shadow: 0 18px 48px rgba(0, 0, 0, 0.20) !important;
}

:root.theme-dim .nav-icon-button {
  border-color: rgba(255, 255, 255, 0.08) !important;
  color: #f3f4f6 !important;
  background: rgba(58, 63, 75, 0.68) !important;
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.18) !important;
}

:root.theme-dim .nav-icon-button:hover,
:root.theme-dim .nav-icon-button:focus-visible,
:root.theme-dim .nav-icon-button[aria-current="page"],
:root.theme-dim .menu-cluster.is-open .nav-icon-button {
  border-color: rgba(129, 140, 248, 0.42) !important;
  color: #f3f4f6 !important;
  background: rgba(77, 84, 100, 0.82) !important;
  box-shadow: 0 18px 42px rgba(0, 0, 0, 0.24) !important;
}

:root.theme-dim .app-card,
:root.theme-dim .data-panel,
:root.theme-dim .kpi-card,
:root.theme-dim .daily-summary,
:root.theme-dim .dashboard-hero-card {
  border-color: rgba(255, 255, 255, 0.08) !important;
  background-color: rgba(45, 49, 57, 0.85) !important;
  background:
    radial-gradient(circle at 88% 18%, rgba(99, 102, 241, 0.16), transparent 17rem),
    linear-gradient(145deg, rgba(58, 63, 75, 0.90), rgba(45, 49, 57, 0.75)) !important;
  box-shadow: 0 24px 70px rgba(0, 0, 0, 0.22) !important;
  color: #f3f4f6 !important;
}

:root.theme-dim .app-card p,
:root.theme-dim .data-panel p,
:root.theme-dim .kpi-card p,
:root.theme-dim .daily-summary p,
:root.theme-dim .dashboard-hero-card p {
  color: #e5e7eb !important;
}

:root.theme-dim .kpi-label,
:root.theme-dim .readonly-field span,
:root.theme-dim label span {
  color: #9ca3af !important;
}

:root.theme-dim .placeholder-table th {
  color: #f3f4f6 !important;
  border-bottom-color: rgba(255, 255, 255, 0.08) !important;
  font-weight: 700 !important;
}

:root.theme-dim .placeholder-table td {
  color: #e5e7eb !important;
  border-bottom-color: rgba(255, 255, 255, 0.08) !important;
}

:root.theme-dim .nav-icon-label {
  color: rgba(243, 244, 246, 0.82) !important;
}

/* Brand logo backlight glow overrides for 1/2 Dark */
:root.theme-dim .brand-logo--glow::before {
  inset: -20px -30px !important;
  background:
    radial-gradient(circle at 32% 48%, rgba(210, 230, 255, 0.45), transparent 58%),
    radial-gradient(circle at 62% 52%, rgba(70, 115, 255, 0.65), transparent 68%) !important;
  filter: blur(24px) !important;
  opacity: 0.9 !important;
}

:root.theme-dim .brand-logo--glow img {
  filter:
    drop-shadow(0 0 12px rgba(210, 230, 255, 0.42))
    drop-shadow(0 0 24px rgba(70, 115, 255, 0.46)) !important;
}

:root.theme-dim .login-screen .brand-logo--glow::before,
:root.theme-dim .app-topbar .brand-logo--glow::before {
  inset: -24px -36px !important;
  background:
    radial-gradient(circle at 31% 48%, rgba(210, 230, 255, 0.52), transparent 58%),
    radial-gradient(circle at 64% 52%, rgba(70, 115, 255, 0.72), transparent 70%) !important;
  filter: blur(28px) !important;
  opacity: 0.96 !important;
}

:root.theme-dim .login-screen .brand-logo--glow img,
:root.theme-dim .app-topbar .brand-logo--glow img {
  filter:
    drop-shadow(0 0 10px rgba(230, 242, 255, 0.46))
    drop-shadow(0 0 24px rgba(70, 115, 255, 0.52))
    drop-shadow(0 0 42px rgba(70, 115, 255, 0.28)) !important;
}

/* Additional overrides for 1/2 Dark (theme-dim) and theme-dark legibility */
:root.theme-dim .readonly-field,
:root.theme-dark .readonly-field {
  border-color: rgba(255, 255, 255, 0.12) !important;
  background: rgba(45, 49, 57, 0.50) !important;
}

:root.theme-dim .app-button-secondary,
:root.theme-dark .app-button-secondary {
  color: #ffffff !important;
  background: rgba(255, 255, 255, 0.08) !important;
  border-color: rgba(255, 255, 255, 0.16) !important;
}

:root.theme-dim .app-button-secondary:hover,
:root.theme-dark .app-button-secondary:hover {
  background: rgba(255, 255, 255, 0.16) !important;
}

:root.theme-dim input,
:root.theme-dim select,
:root.theme-dim textarea,
:root.theme-dark input,
:root.theme-dark select,
:root.theme-dark textarea {
  background-color: rgba(255, 255, 255, 0.06) !important;
  color: #ffffff !important;
  border-color: rgba(255, 255, 255, 0.14) !important;
}

:root.theme-dim .week-day-col,
:root.theme-dark .week-day-col {
  background-color: rgba(45, 49, 57, 0.65) !important;
  border-color: rgba(255, 255, 255, 0.08) !important;
}

:root.theme-dim .slot-detail-text {
  color: #ccc !important;
}

:root.theme-dim .schema-step,
:root.theme-dim .schema-panel,
:root.theme-dark .schema-step,
:root.theme-dark .schema-panel {
  border-color: rgba(255, 255, 255, 0.08) !important;
  background: rgba(58, 63, 75, 0.62) !important;
}




/* ==========================================
   AJUSTES DE TABELA (DIVISÓRIAS SUAVES) E LAYOUT OVERFLOW
   ========================================== */
.placeholder-table th,
.placeholder-table td,
table.placeholder-table tr td,
table.placeholder-table tr th,
.agenda-dia-table td,
.agenda-dia-table th {
  border-bottom: 1px solid rgba(0, 0, 0, 0.09) !important;
}

:root.theme-dark .placeholder-table th,
:root.theme-dark .placeholder-table td,
:root.theme-dark table.placeholder-table tr td,
:root.theme-dark table.placeholder-table tr th,
:root.theme-dark .agenda-dia-table td,
:root.theme-dark .agenda-dia-table th,
:root.theme-dim .placeholder-table th,
:root.theme-dim .placeholder-table td,
:root.theme-dim table.placeholder-table tr td,
:root.theme-dim table.placeholder-table tr th,
:root.theme-dim .agenda-dia-table td,
:root.theme-dim .agenda-dia-table th {
  border-bottom: 1px solid rgba(255, 255, 255, 0.15) !important;
}

/* Prevenção de estouro de campos em filtros de busca */
.readonly-field,
.filter-item,
.filter-group,
.ios-filter-box,
.schema-field-grid label {
  box-sizing: border-box !important;
  max-width: 100% !important;
  overflow: hidden !important;
}

.readonly-field input,
.readonly-field select,
.readonly-field textarea,
.filter-item input,
.filter-item select,
.filter-group input,
.filter-group select,
input[type="text"],
input[type="search"],
input[type="email"],
select {
  box-sizing: border-box !important;
  max-width: 100% !important;
  width: 100% !important;
  text-overflow: ellipsis !important;
}





/* ==========================================================================
   DARK AND DIM THEME INPUT FOCUS AND AUTOFILL FIX
   ========================================================================== */
:root.theme-dim input:focus,
:root.theme-dim select:focus,
:root.theme-dim textarea:focus,
:root.theme-dark input:focus,
:root.theme-dark select:focus,
:root.theme-dark textarea:focus {
  background-color: rgba(15, 23, 42, 0.9) !important;
  color: #ffffff !important;
  border-color: #007aff !important;
}

:root.theme-dim input:-webkit-autofill,
:root.theme-dark input:-webkit-autofill {
  -webkit-text-fill-color: #ffffff !important;
  transition: background-color 5000s ease-in-out 0s;
  -webkit-box-shadow: 0 0 0px 1000px rgba(15, 23, 42, 0.9) inset !important;
}

.ios-modal-sheet-large {
  width: 96% !important;
  max-width: 1350px !important;
}

/* Smart3Lab: camada final contra regressao por regras legadas. */
.login-screen .hero-grid{grid-template-columns:minmax(0,42%) minmax(0,58%)!important;gap:0!important;overflow:hidden!important;border-radius:26px!important;background:rgba(255,255,255,.97)!important;box-shadow:var(--smart-shadow-login)!important}
.login-screen .hero-copy{width:auto!important;min-width:0!important;max-width:none!important;padding:56px 54px!important;color:#fff!important;background:linear-gradient(145deg,rgba(18,72,96,.94),rgba(20,104,135,.90))!important}
.login-screen .brand-mark,.login-screen .login-brand-logo{width:min(230px,100%)!important;max-width:230px!important;min-height:0!important;padding:12px 16px!important;border-radius:14px!important;background:rgba(255,255,255,.97)!important}
.login-screen .login-hero-logo{width:100%!important;height:auto!important;max-height:92px!important;object-fit:contain!important}
.login-screen .hero-copy .lead{width:auto!important;max-width:38ch!important;color:rgba(255,255,255,.88)!important;font-size:1rem!important;line-height:1.55!important;white-space:normal!important;overflow-wrap:anywhere}
.login-screen .login-card{width:min(470px,calc(100% - 64px))!important;min-width:0!important;max-width:470px!important;margin:0 auto!important;padding:42px 0!important;border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important}
.login-screen .login-card .lead{color:var(--smart-muted)!important}
.app-topbar{inset:0 0 auto 0!important;width:100%!important;max-width:none!important;height:72px!important;border-radius:0!important;background:rgba(255,255,255,.96)!important;box-shadow:none!important;transform:none!important}
.app-topbar-inner{width:min(1500px,100%)!important;min-height:72px!important;margin-inline:auto!important;grid-template-columns:190px minmax(0,1fr) 210px!important}
.app-nav{position:static!important;justify-self:center!important;overflow:visible!important;transform:none!important}
.menu-cluster{display:inline-flex!important;align-items:center!important}
.app-card,.data-panel,.kpi-card,.daily-summary,.dashboard-hero-card{border-color:#e7eaed!important;border-radius:18px!important;background:#fff!important;box-shadow:var(--smart-shadow)!important;backdrop-filter:none!important}
.table-scroll,.table-responsive,[class*="table-wrapper"],.app-card:has(> table),.data-panel:has(> table){max-width:100%!important;overflow-x:auto!important;overscroll-behavior-inline:contain;scrollbar-gutter:stable}
.placeholder-table,.agenda-dia-table,.data-panel table,.app-card table{width:100%;min-width:max-content;border-collapse:separate;border-spacing:0}
.placeholder-table thead th,.agenda-dia-table thead th,.data-panel table thead th,.app-card table thead th{position:sticky;top:0;z-index:2;color:#536371!important;background:#f4f5f6!important;border-bottom:1px solid #dfe4e8!important}
@media(max-width:960px){.app-topbar-inner{grid-template-columns:auto minmax(0,1fr) auto!important}.login-screen .hero-grid{grid-template-columns:1fr!important}}
@media(max-width:600px){.login-screen .hero-copy{padding:28px 24px!important}.login-screen .login-card{width:calc(100% - 40px)!important;padding:34px 0!important}}

/* Smart3Lab: tres niveis de tema e maior presenca das fotos no login. */
.login-background::after{background:rgba(235,240,243,.46)!important}
.login-screen .hero-grid{min-height:700px!important;max-height:760px;background:rgba(255,255,255,.94)!important}
.login-screen .hero-copy{background:linear-gradient(145deg,rgba(15,67,91,.90),rgba(18,105,137,.86))!important}

:root.theme-dim{--smart-bg:#303841;--smart-surface:#3a4550;--smart-surface-muted:#424e5a;--smart-text:#f3f6f8;--smart-muted:#c1cbd2;--smart-primary:#67b0cf;--smart-primary-strong:#8bc7df;--smart-primary-soft:#465a67;--smart-border:#52606c;--smart-border-strong:#71808c;--color-text:var(--smart-text);--color-muted:var(--smart-muted);--color-primary:var(--smart-primary);--color-primary-strong:var(--smart-primary-strong);--color-border:var(--smart-border)}
:root.theme-dim body:not(.login-screen){background:var(--smart-bg)!important;color:var(--smart-text)!important}
:root.theme-dim .app-topbar{border-bottom-color:#4b5965!important;background:rgba(52,63,73,.97)!important}
:root.theme-dim .app-card,:root.theme-dim .data-panel,:root.theme-dim .kpi-card,:root.theme-dim .daily-summary,:root.theme-dim .dashboard-hero-card,:root.theme-dim .profile-popover,:root.theme-dim .accessibility-panel,:root.theme-dim .menu-dropdown,:root.theme-dim .ios-calendar-widget,:root.theme-dim .agenda-ios-card{border-color:var(--smart-border)!important;background:var(--smart-surface)!important;color:var(--smart-text)!important;box-shadow:0 12px 34px rgba(0,0,0,.18)!important}
:root.theme-dim .nav-icon-label,:root.theme-dim .app-user-name,:root.theme-dim .section-title,:root.theme-dim .page-title,:root.theme-dim .dashboard-title{color:var(--smart-text)!important}
:root.theme-dim .topbar-action,:root.theme-dim .app-button-secondary,:root.theme-dim input:not([type="checkbox"]):not([type="radio"]),:root.theme-dim select,:root.theme-dim textarea{border-color:var(--smart-border-strong)!important;background:var(--smart-surface-muted)!important;color:var(--smart-text)!important}
:root.theme-dim .placeholder-table th,:root.theme-dim .agenda-dia-table th,:root.theme-dim .data-panel table thead th,:root.theme-dim .app-card table thead th{color:#d2dbe1!important;background:#46525e!important;border-bottom-color:#5b6873!important}
:root.theme-dim .placeholder-table td,:root.theme-dim .agenda-dia-table td,:root.theme-dim .data-panel table td,:root.theme-dim .app-card table td{color:var(--smart-text)!important;background:var(--smart-surface)!important;border-bottom-color:#4c5964!important}
:root.theme-dim .login-background::after{background:rgba(27,35,42,.58)!important}
:root.theme-dim .login-screen .hero-grid{background:rgba(52,63,73,.95)!important}
:root.theme-dim .login-screen .login-card .section-title,:root.theme-dim .login-screen .login-card label{color:#f3f6f8!important}
:root.theme-dim .login-screen .login-card .lead,:root.theme-dim .login-secure-label{color:#c1cbd2!important}

:root.theme-dark{--smart-bg:#0d141b;--smart-surface:#151f28;--smart-surface-muted:#1d2a34;--smart-text:#f4f7f9;--smart-muted:#aab8c2;--smart-primary:#65b4d4;--smart-primary-strong:#91cee5;--smart-primary-soft:#203b49;--smart-border:#2b3b47;--smart-border-strong:#526672;--color-text:var(--smart-text);--color-muted:var(--smart-muted);--color-primary:var(--smart-primary);--color-primary-strong:var(--smart-primary-strong);--color-border:var(--smart-border)}
:root.theme-dark body:not(.login-screen){background:var(--smart-bg)!important;color:var(--smart-text)!important}
:root.theme-dark .app-topbar{border-bottom-color:#263641!important;background:rgba(16,25,33,.98)!important}
:root.theme-dark .app-card,:root.theme-dark .data-panel,:root.theme-dark .kpi-card,:root.theme-dark .daily-summary,:root.theme-dark .dashboard-hero-card,:root.theme-dark .profile-popover,:root.theme-dark .accessibility-panel,:root.theme-dark .menu-dropdown,:root.theme-dark .ios-calendar-widget,:root.theme-dark .agenda-ios-card{border-color:var(--smart-border)!important;background:var(--smart-surface)!important;color:var(--smart-text)!important;box-shadow:none!important}
:root.theme-dark .nav-icon-label,:root.theme-dark .app-user-name,:root.theme-dark .section-title,:root.theme-dark .page-title,:root.theme-dark .dashboard-title{color:var(--smart-text)!important}
:root.theme-dark .topbar-action,:root.theme-dark .app-button-secondary,:root.theme-dark input:not([type="checkbox"]):not([type="radio"]),:root.theme-dark select,:root.theme-dark textarea{border-color:var(--smart-border-strong)!important;background:var(--smart-surface-muted)!important;color:var(--smart-text)!important}

/* Agenda: ação única de compra no item 5 */
.purchase-link-action {
  align-items: center;
  margin-top: 4px;
}

.purchase-link-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  min-height: 48px;
  padding: 7px 18px 7px 10px;
  border-radius: 12px;
  text-decoration: none;
  font-weight: 750;
}

.purchase-link-button img {
  width: 34px;
  height: 34px;
  flex: 0 0 34px;
  object-fit: contain;
}

/* Login responsivo: todo o conteúdo funcional em uma única tela. */
html:has(body.login-screen),
body.login-screen,
.login-screen .login-page {
  width: 100%;
  height: 100dvh;
  min-height: 0 !important;
  overflow: hidden !important;
}

.login-screen .login-page .app-main {
  width: min(1180px, calc(100% - 32px)) !important;
  height: 100dvh !important;
  min-height: 0 !important;
  padding: 12px 0 !important;
  box-sizing: border-box;
}

.login-screen .hero-grid {
  width: 100%;
  height: min(760px, calc(100dvh - 24px)) !important;
  min-height: 0 !important;
  max-height: calc(100dvh - 24px) !important;
}

.login-screen .hero-copy,
.login-screen .login-card {
  min-height: 0 !important;
}

@media (max-height: 760px) and (min-width: 701px) {
  .login-screen .hero-copy {
    gap: 14px !important;
    padding: 24px 38px !important;
  }

  .login-screen .brand-mark,
  .login-screen .login-brand-logo {
    max-width: 190px !important;
    padding: 8px 12px !important;
  }

  .login-screen .login-hero-logo {
    max-height: 68px !important;
  }

  .login-screen .login-hero-title {
    margin: 9px 0 12px !important;
    font-size: clamp(2rem, 3.2vw, 2.65rem) !important;
    line-height: 1 !important;
  }

  .login-screen .hero-copy .lead {
    font-size: .86rem !important;
    line-height: 1.38 !important;
  }

  .login-screen .login-feature-list {
    gap: 5px !important;
  }

  .login-screen .login-feature-list li {
    grid-template-columns: 28px minmax(0, 1fr) !important;
    gap: 8px !important;
    font-size: .74rem !important;
  }

  .login-screen .login-feature-list li::before {
    width: 28px !important;
    height: 28px !important;
    border-radius: 8px !important;
  }

  .login-screen .login-card {
    padding: 20px 0 !important;
  }

  .login-screen .login-card .section-title {
    font-size: clamp(1.8rem, 3vw, 2.35rem) !important;
  }

  .login-screen .login-card .form-stack {
    margin-top: 18px !important;
    gap: 11px !important;
  }

  .login-screen .login-secure-label {
    margin-bottom: 8px !important;
  }
}

@media (max-width: 700px) {
  .login-screen .login-page .app-main {
    width: calc(100% - 16px) !important;
    padding: 8px 0 !important;
  }

  .login-screen .hero-grid {
    grid-template-columns: 1fr !important;
    grid-template-rows: auto minmax(0, 1fr) !important;
    height: calc(100dvh - 16px) !important;
    max-height: calc(100dvh - 16px) !important;
    border-radius: 20px !important;
  }

  .login-screen .hero-copy {
    display: flex !important;
    justify-content: center !important;
    padding: 10px 18px !important;
  }

  .login-screen .hero-copy > div,
  .login-screen .login-feature-list {
    display: none !important;
  }

  .login-screen .brand-mark,
  .login-screen .login-brand-logo {
    width: min(180px, 70vw) !important;
    padding: 6px 10px !important;
  }

  .login-screen .login-hero-logo {
    max-height: 58px !important;
  }

  .login-screen .login-card {
    align-self: center;
    width: calc(100% - 36px) !important;
    padding: 14px 0 !important;
  }

  .login-screen .login-card .section-title {
    font-size: clamp(1.65rem, 8vw, 2.15rem) !important;
  }

  .login-screen .login-card .form-stack {
    margin-top: 14px !important;
    gap: 9px !important;
  }

  .login-screen .login-theme-toggle {
    top: 12px !important;
    right: 14px !important;
  }
}
:root.theme-dark .placeholder-table th,:root.theme-dark .agenda-dia-table th,:root.theme-dark .data-panel table thead th,:root.theme-dark .app-card table thead th{color:#cbd6dd!important;background:#1d2a34!important;border-bottom-color:#354651!important}
:root.theme-dark .placeholder-table td,:root.theme-dark .agenda-dia-table td,:root.theme-dark .data-panel table td,:root.theme-dark .app-card table td{color:var(--smart-text)!important;background:var(--smart-surface)!important;border-bottom-color:#2a3944!important}
:root.theme-dark .login-background::after{background:rgba(4,10,15,.70)!important}
:root.theme-dark .login-screen .hero-grid{background:rgba(17,26,34,.97)!important}
:root.theme-dark .login-screen .login-card .section-title,:root.theme-dark .login-screen .login-card label{color:#f4f7f9!important}
:root.theme-dark .login-screen .login-card .lead,:root.theme-dark .login-secure-label{color:#aab8c2!important}

.login-screen .hero-grid{min-height:780px!important;max-height:800px!important}
.login-screen .hero-copy{padding:42px 54px!important;gap:20px!important}
.login-screen .login-hero-title{font-size:clamp(2.55rem,3.5vw,3.35rem)!important}
.login-screen .login-feature-list{gap:8px!important}
.login-screen .login-feature-list li{font-size:.82rem!important}
.login-screen .forgot-password-link{color:var(--smart-primary-strong)!important;opacity:1!important}
.login-screen .login-hero-logo{filter:none!important;opacity:1!important}
:root.theme-dim .login-screen .login-card,:root.theme-dark .login-screen .login-card{border:0!important;background:transparent!important;box-shadow:none!important}
:root.theme-dim .login-screen .forgot-password-link,:root.theme-dark .login-screen .forgot-password-link{color:var(--smart-primary-strong)!important}
@media(max-width:600px){.login-screen .hero-grid{min-height:auto!important;max-height:none!important}.login-screen .hero-copy{padding:28px 24px!important}}

/* Smart3Lab: alinhamento definitivo do menu superior com todos os modulos. */
.app-topbar-inner{grid-template-columns:170px minmax(0,1fr) 150px!important;gap:12px!important}
.app-hamburger-menu{grid-row:1!important}
.app-logo{grid-column:1!important;grid-row:1!important;width:158px!important}
.app-logo img{width:150px!important;height:46px!important}
.app-nav{grid-column:2!important;grid-row:1!important;width:100%!important;gap:1px!important}
.app-user{grid-column:3!important;grid-row:1!important}
.menu-cluster{gap:1px!important;padding:4px 5px!important}
.nav-icon-button{width:19px!important;min-width:19px!important}
.nav-icon,.nav-icon-button .nav-icon,.nav-icon .ui-svg-icon{width:16px!important;height:16px!important}
.nav-icon-label{max-width:76px!important;font-size:.72rem!important}
@media(max-width:1100px){.app-topbar-inner{grid-template-columns:auto minmax(0,1fr) auto!important}.app-hamburger-menu{display:inline-grid!important;grid-column:1!important}.app-logo{grid-column:2!important;justify-self:start!important}.app-user{grid-column:3!important}.app-nav{display:none!important}}

/* Regra final do login: remove alturas legadas que geravam rolagem. */
html:has(body.login-screen),body.login-screen,.login-screen .login-page{height:100dvh!important;min-height:0!important;overflow:hidden!important}
.login-screen .login-page .app-main{height:100dvh!important;min-height:0!important;padding:12px 0!important;box-sizing:border-box}
.login-screen .hero-grid{height:min(760px,calc(100dvh - 24px))!important;min-height:0!important;max-height:calc(100dvh - 24px)!important}
@media(max-width:700px){
  .login-screen .login-page .app-main{padding:8px 0!important}
  .login-screen .hero-grid{height:calc(100dvh - 16px)!important;min-height:0!important;max-height:calc(100dvh - 16px)!important}
  .login-screen .hero-copy{padding:10px 18px!important}
}
@media(max-height:640px) and (min-width:701px){
  .login-screen .hero-grid{height:calc(100dvh - 54px)!important;max-height:calc(100dvh - 54px)!important}
  .login-screen .hero-copy{gap:6px!important;padding:10px 28px!important}
  .login-screen .brand-mark,.login-screen .login-brand-logo{max-width:160px!important;padding:5px 8px!important}
  .login-screen .login-hero-logo{max-height:50px!important}
  .login-screen .login-hero-title{margin:4px 0 6px!important;font-size:1.85rem!important;line-height:1!important}
  .login-screen .hero-copy .lead{font-size:.72rem!important;line-height:1.28!important}
  .login-screen .login-feature-list{gap:3px!important}
  .login-screen .login-feature-list li{grid-template-columns:23px minmax(0,1fr)!important;gap:6px!important;font-size:.65rem!important;line-height:1.15!important}
  .login-screen .login-feature-list li::before{width:23px!important;height:23px!important;border-radius:7px!important}
  .login-screen .login-card{padding:10px 0!important}
  .login-screen .login-card .section-title{font-size:1.75rem!important}
  .login-screen .login-card .form-stack{margin-top:10px!important;gap:8px!important}
}

/* O painel permanece integralmente acessível sem devolver rolagem à página. */
.accessibility-panel{max-height:calc(100dvh - 156px);overflow-y:auto;overscroll-behavior:contain;scrollbar-gutter:stable}
.login-screen .accessibility-panel{top:16px!important;bottom:auto!important;max-height:calc(100dvh - 32px)!important;overflow-y:auto!important}
:root[data-contrast="high"] body{background:#05070a!important;color:#fff!important}
:root[data-contrast="high"] .login-background::after{background:rgba(0,0,0,.90)!important}
:root[data-contrast="high"] .login-screen .hero-grid{border:2px solid #fff!important;background:#05070a!important;box-shadow:none!important}
:root[data-contrast="high"] .login-screen .hero-copy{background:#000!important;color:#fff!important}
:root[data-contrast="high"] .login-screen .login-card,:root[data-contrast="high"] .login-screen .login-card .section-title,:root[data-contrast="high"] .login-screen .login-card label{color:#fff!important}

/* Menu principal: ícone destacado com o nome centralizado abaixo. */
.app-topbar-inner{grid-template-columns:190px minmax(0,1fr) 150px!important;gap:8px!important}
.app-logo{width:178px!important;max-width:178px!important}
.app-logo img{width:170px!important;max-width:170px!important}
.app-nav{align-items:stretch!important;justify-content:center!important}
.menu-cluster{min-width:58px!important;display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;gap:2px!important;padding:3px!important}
.nav-icon-button{width:34px!important;min-width:34px!important;height:34px!important;min-height:34px!important;padding:4px!important;display:grid!important;place-items:center!important}
.nav-icon,.nav-icon-button .nav-icon,.nav-icon .ui-svg-icon{width:24px!important;height:24px!important}
.nav-icon-label{width:100%!important;max-width:74px!important;min-height:12px!important;font-size:calc(.62rem * var(--menu-font-scale,1))!important;line-height:1.05!important;text-align:center!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
:root[data-icon-size="large"] .nav-icon-button{width:40px!important;min-width:40px!important;height:40px!important;min-height:40px!important}
:root[data-icon-size="xlarge"] .nav-icon-button{width:44px!important;min-width:44px!important;height:44px!important;min-height:44px!important}
:root[data-menu-names="off"] .nav-icon-label{display:none!important}
@media(max-width:1100px){.app-topbar-inner{grid-template-columns:auto minmax(0,1fr) auto!important}.app-logo{width:178px!important;max-width:178px!important}}

/* Login consolidado: cartão compacto, sem áreas vazias ou regras concorrentes. */
.login-screen .login-page .app-main{width:min(1160px,calc(100% - 32px))!important;height:100dvh!important;padding:24px 0!important;place-items:center!important}
.login-screen .hero-grid{width:100%!important;height:min(680px,calc(100dvh - 48px))!important;min-height:0!important;max-height:680px!important;grid-template-columns:minmax(360px,44%) minmax(0,56%)!important;align-items:stretch!important;gap:0!important;border-radius:26px!important;overflow:hidden!important}
.login-screen .hero-copy{align-self:stretch!important;height:100%!important;display:flex!important;flex-direction:column!important;justify-content:center!important;gap:18px!important;padding:36px 46px!important;overflow:hidden!important}
.login-screen .hero-copy>div{display:block!important}
.login-screen .brand-mark,.login-screen .login-brand-logo{width:min(205px,100%)!important;max-width:205px!important;padding:9px 13px!important}
.login-screen .login-hero-logo{max-height:70px!important}
.login-screen .login-hero-title{display:block!important;max-width:11ch!important;margin:8px 0 12px!important;font-size:clamp(2.1rem,3.2vw,2.8rem)!important;line-height:1!important}
.login-screen .hero-copy .lead{max-width:36ch!important;font-size:.88rem!important;line-height:1.45!important}
.login-screen .login-feature-list{display:grid!important;gap:7px!important;margin:2px 0 0!important}
.login-screen .login-feature-list li{grid-template-columns:28px minmax(0,1fr)!important;gap:9px!important;font-size:.75rem!important;line-height:1.2!important}
.login-screen .login-feature-list li::before{width:28px!important;height:28px!important;border-radius:8px!important}
.login-screen .login-card{align-self:center!important;width:min(430px,calc(100% - 64px))!important;max-width:430px!important;padding:28px 0!important}
.login-screen .login-card .section-title{font-size:clamp(2rem,3vw,2.55rem)!important}
.login-screen .login-card .form-stack{margin-top:22px!important;gap:13px!important}
:root[data-font-size="xlarge"] .login-screen .hero-copy{gap:10px!important;padding:24px 40px!important}
:root[data-font-size="xlarge"] .login-screen .brand-mark,
:root[data-font-size="xlarge"] .login-screen .login-brand-logo{max-width:185px!important;padding:7px 11px!important}
:root[data-font-size="xlarge"] .login-screen .login-hero-title{margin:5px 0 8px!important;font-size:2.2rem!important;line-height:1.02!important}
:root[data-font-size="xlarge"] .login-screen .hero-copy .lead{font-size:.82rem!important;line-height:1.35!important}
:root[data-font-size="xlarge"] .login-screen .login-feature-list{gap:5px!important;margin-top:0!important}
:root[data-font-size="xlarge"] .login-screen .login-feature-list li{font-size:.72rem!important;line-height:1.15!important}
@media(max-height:640px) and (min-width:821px){
  .login-screen .login-page .app-main{padding:18px 0 36px!important}
  .login-screen .hero-grid{height:calc(100dvh - 54px)!important;max-height:calc(100dvh - 54px)!important}
  .login-screen .hero-copy{gap:7px!important;padding:12px 30px!important}
  .login-screen .brand-mark,.login-screen .login-brand-logo{max-width:155px!important;padding:5px 8px!important}
  .login-screen .login-hero-logo{max-height:48px!important}
  .login-screen .login-hero-title{margin:3px 0 5px!important;font-size:1.7rem!important}
  .login-screen .hero-copy .lead{font-size:.68rem!important;line-height:1.25!important}
  .login-screen .login-feature-list{gap:3px!important}
  .login-screen .login-feature-list li{grid-template-columns:22px minmax(0,1fr)!important;gap:6px!important;font-size:.6rem!important}
  .login-screen .login-feature-list li::before{width:22px!important;height:22px!important}
  .login-screen .login-card{padding:10px 0!important}
  .login-screen .login-card .form-stack{margin-top:10px!important;gap:8px!important}
}
@media(max-width:820px){
  .login-screen .login-page .app-main{width:calc(100% - 16px)!important;padding:8px 0!important}
  .login-screen .hero-grid{height:calc(100dvh - 16px)!important;max-height:calc(100dvh - 16px)!important;grid-template-columns:1fr!important;grid-template-rows:auto minmax(0,1fr)!important;border-radius:20px!important}
  .login-screen .hero-copy{height:auto!important;min-height:0!important;display:flex!important;align-items:center!important;padding:10px 18px!important}
  .login-screen .hero-copy>div,.login-screen .login-feature-list{display:none!important}
  .login-screen .brand-mark,.login-screen .login-brand-logo{width:min(180px,70vw)!important;max-width:180px!important}
  .login-screen .login-card{width:calc(100% - 36px)!important;padding:14px 0!important}
}
:root[data-contrast="high"] .login-screen .hero-grid{border:2px solid #fff!important;background:#05070a!important}
:root[data-contrast="high"] .login-screen .hero-copy{background:#000!important}

/* Marca no menu: contraste consistente sobre os três temas. */
.app-topbar-inner{grid-template-columns:206px minmax(0,1fr) 150px!important}
.app-topbar .app-logo{width:190px!important;max-width:190px!important;min-height:62px!important;padding:2px 11px!important;box-sizing:border-box!important;justify-content:center!important;border:1px solid rgba(255,255,255,.72)!important;border-radius:13px!important;background:rgba(255,255,255,.96)!important;box-shadow:0 7px 18px rgba(7,27,45,.18)!important;overflow:hidden!important}
.app-topbar .app-logo img{width:166px!important;max-width:166px!important;height:58px!important;object-fit:contain!important;filter:none!important;opacity:1!important}
.app-topbar .brand-logo--glow::before{display:none!important}
@media(max-width:1100px){.app-topbar-inner{grid-template-columns:auto minmax(0,1fr) auto!important}.app-topbar .app-logo{width:190px!important;max-width:190px!important}}