:root {
  --bs-primary: #0076f9;
  --bs-primary-rgb: 0, 118, 249;
  --bs-link-color: #0069df;
  --bs-link-hover-color: #0054b5;
  --bs-primary-base: var(--portal-brand);
  --bs-primary-fg: var(--portal-brand-solid);
  --bs-primary-fg-emphasis: var(--portal-brand-dark);
  --bs-primary-bg: var(--portal-brand-solid);
  --bs-primary-bg-subtle: var(--portal-brand-soft);
  --bs-primary-bg-muted: #c3ddff;
  --bs-primary-border: #9dc8ff;
  --bs-primary-focus-ring: rgba(0, 118, 249, .3);
  --bs-primary-contrast: #fff;
  --portal-brand: #0076f9;
  --portal-brand-solid: #0069df;
  --portal-brand-active: #0054b5;
  --portal-brand-dark: #063a75;
  --portal-brand-deep: #031f42;
  --portal-brand-soft: #e2efff;
  --portal-brand-faint: #f2f7ff;
  --portal-success: #22a561;
  --portal-success-soft: #e1f5e9;
  --portal-success-line: #b9e4ca;
  --portal-ink: #172033;
  --portal-muted: #637083;
  --portal-line: #dbe4ef;
  --portal-canvas: #f4f7fb;
  --portal-sidebar: 15.75rem;
  --portal-radius: .9rem;
  --portal-card-padding: 1rem;
  --portal-shadow: 0 14px 40px rgba(8, 45, 91, .08);
}

:root, :host {
  scrollbar-gutter: auto;
}

* {
  box-sizing: border-box;
}

body.portal-body {
  min-height: 100vh;
  margin: 0;
  color: var(--portal-ink);
  background: var(--portal-canvas);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  -webkit-font-smoothing: antialiased;
}

.portal-body a,
.portal-body button,
.portal-body input {
  transition: border-color 140ms ease, box-shadow 140ms ease, background-color 140ms ease, color 140ms ease;
}

.portal-body .btn-primary {
  --bs-btn-bg: var(--portal-brand-solid);
  --bs-btn-color: #fff;
  --bs-btn-border-color: var(--portal-brand-solid);
  --bs-btn-hover-bg: var(--portal-brand-active);
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-border-color: var(--portal-brand-active);
  --bs-btn-active-bg: var(--portal-brand-dark);
  --bs-btn-active-color: #fff;
  --bs-btn-active-border-color: var(--portal-brand-dark);
  --bs-btn-disabled-bg: var(--portal-brand-solid);
  --bs-btn-disabled-color: #fff;
  --bs-btn-disabled-border-color: var(--portal-brand-solid);
}

.portal-body .card-body {
  padding: var(--portal-card-padding);
}

.portal-body .form-control {
  border-color: #cdd8e6;
  border-radius: .7rem;
}

.portal-body .form-control-sm {
  border-radius: var(--bs-btn-input-sm-border-radius);
}

.portal-body .form-control:focus {
  border-color: var(--portal-brand);
  box-shadow: 0 0 0 .22rem rgba(0, 118, 249, .16);
}

.portal-search-select { min-width: 0; }
.portal-search-select-toggle { width: 100%; gap: .5rem; text-align: start; }
.portal-search-select-toggle .combobox-value { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.portal-search-select-caret { flex: 0 0 auto; width: .45rem; height: .45rem; margin-inline: auto .15rem; border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; transform: translateY(-.1rem) rotate(45deg); }
.portal-search-select-menu { min-width: 0; max-width: calc(100vw - 1.5rem); max-height: min(20rem, calc(100dvh - 2rem)); overflow-y: auto; overscroll-behavior: contain; border-color: var(--portal-line); box-shadow: var(--portal-shadow); font-size: .8rem; }
.portal-search-select-menu .combobox-search { position: sticky; top: 0; z-index: 1; background: var(--bs-body-bg, #fff); padding: .4rem; }
.portal-search-select-menu .menu-item { width: 100%; padding: .4rem .65rem; font-size: .8rem; white-space: normal; overflow-wrap: anywhere; text-align: start; }
.portal-search-select-menu .menu-item.selected { color: var(--portal-brand-dark); background: var(--portal-brand-soft); }
.portal-search-select-menu--multiple .menu-item { display: flex; align-items: flex-start; gap: .5rem; }
.portal-search-select-menu--multiple .menu-item::before { content: ""; flex: 0 0 .85rem; width: .85rem; height: .85rem; margin-top: .15rem; border: 1px solid var(--portal-muted); border-radius: .2rem; }
.portal-search-select-menu--multiple .menu-item.selected::before { border-color: var(--portal-brand); background: var(--portal-brand); box-shadow: inset 0 0 0 2px var(--bs-body-bg, #fff); }
.portal-search-select-menu .menu-item:focus-visible { outline: 2px solid var(--portal-brand); outline-offset: -2px; }
.portal-search-select-menu .combobox-no-results { padding: .5rem .65rem; color: var(--portal-muted); }
.portal-search-select-error { margin-top: .25rem; color: var(--bs-danger, #b42318); font-size: .75rem; }

.portal-body--guest {
  background:
    radial-gradient(circle at 6% 8%, rgba(0, 118, 249, .16), transparent 32rem),
    linear-gradient(140deg, #edf5ff 0%, #fafcff 52%, #eaf2fc 100%);
}

.auth-shell {
  display: grid;
  grid-template-columns: minmax(19rem, .85fr) minmax(30rem, 1.15fr);
  min-height: 100vh;
}

.auth-brand {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-height: 100%;
  padding: clamp(2.5rem, 7vw, 7rem);
  overflow: hidden;
  color: #fff;
  background:
    linear-gradient(160deg, rgba(6, 58, 117, .94), rgba(3, 31, 66, .99)),
    repeating-linear-gradient(135deg, rgba(255,255,255,.03) 0 1px, transparent 1px 16px);
}

.auth-brand::after {
  content: "";
  position: absolute;
  right: -8rem;
  bottom: -10rem;
  width: 27rem;
  height: 27rem;
  border: 1px solid rgba(255, 255, 255, .14);
  border-radius: 50%;
  box-shadow: 0 0 0 4rem rgba(255,255,255,.025), 0 0 0 8rem rgba(255,255,255,.02);
}

.brand-mark {
  display: grid;
  place-items: center;
  width: 4.25rem;
  height: 4.25rem;
  margin-bottom: 2rem;
  border: 1px solid rgba(255, 255, 255, .26);
  border-radius: 1.2rem;
  color: #fff;
  background: var(--portal-brand);
  font-size: 1.75rem;
  font-weight: 800;
  box-shadow: 0 16px 38px rgba(0, 0, 0, .18);
}

.platform-logo { display: block; height: auto; max-width: 100%; object-fit: contain; }
.sidebar-brand-link { display: block; min-width: 0; flex: 1; max-width: 10.5rem; }
.platform-logo--sidebar { width: 100%; }
.platform-brand-link { display: block; width: min(100%, 22rem); margin-bottom: 1.5rem; position: relative; z-index: 1; }
.platform-logo--auth { width: 100%; }

.brand-mark--small {
  width: 2.35rem;
  height: 2.35rem;
  margin: 0;
  border-radius: .7rem;
  font-size: 1rem;
  box-shadow: none;
}

.brand-kicker,
.page-eyebrow {
  margin: 0 0 .45rem;
  color: var(--portal-brand-solid);
  font-size: .7rem;
  font-weight: 800;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.auth-brand .brand-kicker {
  color: #83c0ff;
}

.auth-brand h1 {
  max-width: 10ch;
  margin: 0;
  font-size: clamp(2.55rem, 5vw, 5rem);
  font-weight: 750;
  letter-spacing: -.055em;
  line-height: .96;
}

.auth-brand__copy {
  max-width: 28rem;
  margin: 1.5rem 0 0;
  color: rgba(255, 255, 255, .68);
  font-size: 1.05rem;
  line-height: 1.65;
}

.auth-brand__status,
.sidebar-foot,
.phase-badge {
  display: flex;
  align-items: center;
  gap: .6rem;
}

.auth-brand__status {
  position: absolute;
  bottom: 3rem;
  left: clamp(2.5rem, 7vw, 7rem);
  color: rgba(255,255,255,.72);
  font-size: .8rem;
  font-weight: 650;
}

.status-dot {
  width: .52rem;
  height: .52rem;
  flex: 0 0 auto;
  border-radius: 50%;
  background: var(--portal-success);
  box-shadow: 0 0 0 .24rem rgba(34, 165, 97, .16);
}

.auth-panel {
  display: grid;
  place-content: center;
  padding: 2rem;
}

.auth-card {
  width: min(100%, 29rem);
  padding: clamp(1.35rem, 3vw, 2rem);
  border: 1px solid rgba(205, 216, 230, .9);
  border-radius: 1.2rem;
  background: rgba(255, 255, 255, .92);
  box-shadow: var(--portal-shadow);
  backdrop-filter: blur(1rem);
}

.auth-card__header h2 {
  margin: 0;
  font-size: clamp(1.75rem, 3vw, 2.25rem);
  font-weight: 740;
  letter-spacing: -.035em;
}

.auth-card__header > p:last-child,
.auth-card__intro {
  margin: .7rem 0 0;
  color: var(--portal-muted);
}

.auth-form {
  display: grid;
  gap: 1rem;
  margin-top: 1.5rem;
}

.activation-mfa-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
}

.activation-mfa-grid > div {
  min-width: 0;
}

@media (min-width: 1200px) {
  .auth-shell--activation-mfa {
    grid-template-columns: minmax(19rem, .65fr) minmax(0, 1.35fr);
  }

  .auth-shell--activation-mfa .auth-panel {
    grid-template-columns: minmax(0, 1fr);
    justify-items: center;
  }

  .auth-card--activation-mfa {
    width: min(100%, 52rem);
  }

  .activation-mfa-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: start;
    gap: 2rem;
    margin-top: 1.1rem;
  }

  .activation-mfa-grid .auth-card__intro,
  .activation-mfa-grid .auth-form {
    margin-top: 0;
  }
}

.form-label {
  margin-bottom: .45rem;
  font-size: .82rem;
  font-weight: 720;
}

.form-hint {
  color: var(--portal-muted);
  font-size: .72rem;
}

.password-field {
  position: relative;
}

.password-field .form-control {
  padding-right: 4.4rem;
}

.password-toggle {
  position: absolute;
  top: 50%;
  right: .75rem;
  padding: .2rem .35rem;
  border: 0;
  color: var(--portal-brand-solid);
  background: transparent;
  font-size: .76rem;
  font-weight: 750;
  transform: translateY(-50%);
}

.auth-notice {
  display: grid;
  gap: .2rem;
  margin-top: 1.1rem;
  padding: .75rem .85rem;
  border: 1px solid #d4e3f5;
  border-radius: .75rem;
  color: var(--portal-muted);
  background: var(--portal-brand-faint);
  font-size: .75rem;
  line-height: 1.5;
}

.auth-notice strong {
  color: var(--portal-brand-dark);
}

.auth-footer {
  margin: 1.25rem 0 0;
  color: var(--portal-muted);
  font-size: .72rem;
  text-align: center;
}

.verification-code {
  text-align: center;
  letter-spacing: .45em;
  font-variant-numeric: tabular-nums;
}

.otp-digit-group {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: .5rem;
  direction: ltr;
}

.otp-digit-group[hidden] {
  display: none;
}

.portal-body .otp-digit {
  width: 100%;
  min-width: 0;
  height: 3.25rem;
  padding: .4rem 0;
  border-radius: .65rem;
  font-size: 1.5rem;
  font-weight: 750;
  font-variant-numeric: tabular-nums;
  line-height: 1;
  text-align: center;
}

.portal-body .otp-digit.is-filled {
  border-color: #9dc8ff;
  background: var(--portal-brand-faint);
}

.otp-help {
  margin: .65rem 0 0;
}

.otp-status {
  min-height: 1.1rem;
  margin: .35rem 0 0;
  color: var(--portal-muted);
  font-size: .72rem;
}

.setup-secret {
  display: grid;
  gap: .45rem;
  margin-top: 1.1rem;
  padding: .8rem;
  border: 1px solid #cfe1f7;
  border-radius: .8rem;
  background: var(--portal-brand-faint);
}

.setup-qr {
  display: grid;
  justify-items: center;
  gap: .75rem;
  margin-top: 1.1rem;
  padding: .8rem;
  border: 1px solid var(--portal-line);
  border-radius: .9rem;
  background: #fff;
}

.setup-qr p {
  margin: 0;
  color: var(--portal-muted);
  font-size: .78rem;
  font-weight: 650;
  text-align: center;
}

.setup-qr img {
  display: block;
  width: min(100%, 20rem);
  height: auto;
  aspect-ratio: 1;
  image-rendering: pixelated;
}

.setup-secret > span {
  color: var(--portal-muted);
  font-size: .68rem;
  font-weight: 760;
  letter-spacing: .06em;
  text-transform: uppercase;
}

.setup-secret > code {
  display: block;
  margin-bottom: .5rem;
  color: var(--portal-brand-dark);
  font-size: .94rem;
  font-weight: 750;
  letter-spacing: .08em;
  overflow-wrap: anywhere;
}


.portal-shell {
  display: grid;
  grid-template-columns: var(--portal-sidebar) minmax(0, 1fr);
  min-height: 100vh;
}

.portal-sidebar {
  position: sticky;
  top: 0;
  display: flex;
  flex-direction: column;
  height: 100vh;
  padding: 1.15rem;
  color: #dceaff;
  background: var(--portal-brand-deep);
  z-index: 10;
}

.sidebar-brand {
  display: flex;
  align-items: center;
  gap: .8rem;
  padding: .25rem .25rem 1.4rem;
  border-bottom: 1px solid rgba(255,255,255,.09);
}

.sidebar-brand strong,
.sidebar-brand small {
  display: block;
}

.sidebar-brand strong {
  color: #fff;
  font-size: .9rem;
  letter-spacing: .05em;
}

.sidebar-brand small {
  color: rgba(255,255,255,.48);
  font-size: .68rem;
}

.sidebar-close {
  display: none;
  place-items: center;
  width: 2.2rem;
  height: 2.2rem;
  margin-left: auto;
  padding: 0;
  border: 1px solid rgba(255, 255, 255, .16);
  border-radius: .6rem;
  color: #fff;
  background: rgba(255, 255, 255, .07);
  font-size: 1.35rem;
  line-height: 1;
}

.sidebar-close:hover,
.sidebar-close:focus-visible {
  border-color: rgba(255, 255, 255, .34);
  background: rgba(255, 255, 255, .14);
}

.sidebar-backdrop {
  display: none;
}

html.sidebar-is-open {
  overflow: hidden;
  overscroll-behavior: none;
}

.portal-body.sidebar-is-open {
  position: fixed;
  top: var(--sidebar-scroll-top, 0);
  inset-inline: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  overscroll-behavior: none;
}

.sidebar-nav {
  display: grid;
  gap: .25rem;
  margin-top: 1.1rem;
}

.nav-section {
  margin: 1rem .7rem .25rem;
  color: rgba(255,255,255,.36);
  font-size: .62rem;
  font-weight: 800;
  letter-spacing: .14em;
  text-transform: uppercase;
}

.nav-item {
  display: grid;
  grid-template-columns: 1.8rem 1fr auto;
  align-items: center;
  min-height: 2.75rem;
  padding: .55rem .7rem;
  border-radius: .65rem;
  color: rgba(255,255,255,.68);
  font-size: .8rem;
  font-weight: 620;
  text-decoration: none;
}

.nav-item:hover,
.nav-item.is-active {
  color: #fff;
  background: rgba(255,255,255,.09);
}

.nav-item.is-active {
  box-shadow: inset 3px 0 var(--portal-brand);
}

.nav-item.is-disabled {
  cursor: default;
  opacity: .62;
}

.nav-item small {
  padding: .13rem .35rem;
  border-radius: 999px;
  color: #9acbff;
  background: rgba(0, 118, 249, .14);
  font-size: .58rem;
  text-transform: uppercase;
}

.nav-symbol {
  color: rgba(255,255,255,.35);
  font-size: .62rem;
  font-variant-numeric: tabular-nums;
}

.sidebar-foot {
  margin-top: auto;
  padding: .9rem .6rem .25rem;
  border-top: 1px solid rgba(255,255,255,.09);
  color: rgba(255,255,255,.48);
  font-size: .68rem;
}

.portal-main {
  min-width: 0;
}

.portal-topbar {
  position: sticky;
  top: 0;
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  min-height: 5rem;
  padding: .85rem clamp(1rem, 3vw, 2rem);
  border-bottom: 1px solid var(--portal-line);
  background: rgba(255,255,255,.92);
  backdrop-filter: blur(14px);
  z-index: 8;
}

.portal-heading {
  grid-column: 1 / 3;
  min-width: 0;
}

.portal-topbar h1 {
  margin: 0;
  font-size: 1.35rem;
  font-weight: 740;
  letter-spacing: -.025em;
}

.portal-topbar .page-eyebrow {
  margin-bottom: .15rem;
  font-size: .58rem;
}

.sidebar-toggle {
  display: none;
  width: 2.5rem;
  height: 2.5rem;
  margin-right: .8rem;
  border: 1px solid var(--portal-line);
  border-radius: .6rem;
  background: #fff;
}

.user-menu {
  display: flex;
  grid-column: 3;
  align-items: center;
  justify-self: end;
  gap: .7rem;
  margin-left: auto;
}

.user-menu form {
  margin: 0;
}

.sign-out-button {
  white-space: nowrap;
}

.user-avatar {
  display: grid;
  place-items: center;
  width: 2.2rem;
  height: 2.2rem;
  border-radius: .65rem;
  color: var(--portal-brand-dark);
  background: var(--portal-brand-soft);
  font-size: .78rem;
  font-weight: 800;
}

.user-meta strong,
.user-meta small {
  display: block;
  max-width: 14rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.user-meta strong {
  font-size: .76rem;
}

.user-meta small {
  color: var(--portal-muted);
  font-size: .64rem;
}

.portal-content {
  padding: clamp(1rem, 2vw, 1.5rem);
}

.welcome-strip {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 2rem;
  margin-bottom: 1.4rem;
}

.welcome-strip h2 {
  margin: 0;
  font-size: clamp(1.55rem, 3vw, 2.15rem);
  font-weight: 750;
  letter-spacing: -.04em;
}

.welcome-strip p:last-child {
  max-width: 47rem;
  margin: .5rem 0 0;
  color: var(--portal-muted);
  font-size: .86rem;
}

.phase-badge {
  flex: 0 0 auto;
  padding: .55rem .75rem;
  border: 1px solid #cfe1f7;
  border-radius: 999px;
  color: var(--portal-brand-dark);
  background: var(--portal-brand-faint);
  font-size: .68rem;
  font-weight: 720;
}

.phase-badge .status-dot {
  background: var(--portal-brand);
  box-shadow: 0 0 0 .24rem rgba(0, 118, 249, .14);
}

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

.metric-card,
.panel-card {
  border: 1px solid var(--portal-line);
  border-radius: var(--portal-radius);
  background: #fff;
  box-shadow: 0 8px 24px rgba(8, 45, 91, .04);
}

.metric-card {
  display: grid;
  min-height: 7.6rem;
  padding: var(--portal-card-padding);
}

.metric-card strong {
  align-self: end;
  font-size: 1.75rem;
  line-height: 1;
  font-variant-numeric: tabular-nums;
}

.metric-card > span {
  margin-top: .35rem;
  color: var(--portal-muted);
  font-size: .67rem;
}

.metric-card--accent {
  color: #fff;
  border-color: var(--portal-brand-dark);
  background: linear-gradient(145deg, var(--portal-brand-dark), var(--portal-brand-deep));
}

.metric-card--accent > span,
.metric-card--accent .metric-label {
  color: rgba(255,255,255,.6);
}

.metric-label {
  color: var(--portal-muted);
  font-size: .67rem;
  font-weight: 760;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.content-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.65fr) minmax(17rem, .75fr);
  gap: .75rem;
  margin-top: .75rem;
}

.panel-card {
  padding: var(--portal-card-padding);
}

.panel-card--table {
  padding: 0;
  overflow: hidden;
}

.panel-card--table > .table-responsive {
  /* Keep absolutely positioned accessibility helpers inside the scroll area. */
  position: relative;
}

.card-padding {
  padding: var(--portal-card-padding);
}

/* Align table edges with card content while retaining compact inner cells. */
.portal-body .table > :is(thead, tbody, tfoot) > tr > :is(th, td):first-child {
  padding-inline-start: 1rem;
}

.portal-body .table > :is(thead, tbody, tfoot) > tr > :is(th, td):last-child {
  padding-inline-end: 1rem;
}

.panel-card__header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  padding-bottom: .75rem;
  border-bottom: 1px solid var(--portal-line);
}

.panel-card h3 {
  margin: 0;
  font-size: 1.1rem;
  font-weight: 730;
}

#create-workspace-title {
  margin-bottom: .5rem;
}

.panel-card--dark {
  color: #fff;
  border-color: var(--portal-brand-deep);
  background: var(--portal-brand-deep);
}

.panel-card--dark .page-eyebrow {
  color: #83c0ff;
}

.readiness-list {
  display: grid;
}

.readiness-item {
  display: grid;
  grid-template-columns: 2.25rem 1fr;
  gap: .85rem;
  padding: .75rem .1rem;
  border-bottom: 1px solid var(--portal-line);
}

.readiness-item:last-child {
  border-bottom: 0;
}

.readiness-item > span {
  display: grid;
  place-items: center;
  width: 2rem;
  height: 2rem;
  border: 1px solid var(--portal-line);
  border-radius: .55rem;
  color: var(--portal-muted);
  font-size: .62rem;
  font-weight: 800;
}

.readiness-item.is-complete > span {
  color: #137844;
  border-color: var(--portal-success-line);
  background: var(--portal-success-soft);
}

.readiness-item strong,
.readiness-item small {
  display: block;
}

.readiness-item strong {
  font-size: .8rem;
}

.readiness-item small {
  margin-top: .2rem;
  color: var(--portal-muted);
  font-size: .68rem;
}

.context-list {
  display: grid;
  gap: .8rem;
  margin: 1.1rem 0;
}

.context-list div {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  padding-bottom: .7rem;
  border-bottom: 1px solid rgba(255,255,255,.1);
}

.context-list dt,
.context-list dd {
  margin: 0;
  font-size: .72rem;
}

.context-list dt {
  color: rgba(255,255,255,.48);
}

.context-list dd {
  font-weight: 700;
  text-transform: capitalize;
}

.context-note {
  margin: 0;
  color: rgba(255,255,255,.5);
  font-size: .7rem;
  line-height: 1.6;
}

.audit-heading {
  margin-bottom: .85rem;
}

.audit-results-region {
  position: relative;
  margin-top: .75rem;
  min-width: 0;
}

.audit-live-results {
  min-width: 0;
}

.audit-loading-overlay {
  position: absolute;
  inset: 0;
  z-index: 2;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  padding: 1rem;
  border: 1px solid var(--portal-line);
  border-radius: var(--portal-radius);
  background: rgba(244, 247, 251, .78);
  cursor: progress;
}

.audit-loading-overlay[hidden] {
  display: none;
}

.audit-loading-indicator {
  position: sticky;
  top: 6rem;
  display: flex;
  align-items: center;
  gap: .7rem;
  max-width: 100%;
  padding: .8rem 1rem;
  border: 1px solid #9dc8ff;
  border-radius: .75rem;
  color: var(--portal-brand-dark);
  background: #fff;
  box-shadow: var(--portal-shadow);
  font-size: .8rem;
}

.audit-loading-indicator .spinner-border {
  flex: 0 0 auto;
  width: 1.25rem;
  height: 1.25rem;
  color: var(--portal-brand);
}

.audit-update-status {
  min-height: 1.1rem;
  margin: .45rem 0 0;
  color: var(--portal-muted);
  font-size: .72rem;
}

.audit-live-results[aria-busy="true"] .audit-results-header {
  background: var(--portal-brand-faint);
}

.audit-live-results .alert {
  margin-bottom: .75rem;
}

.audit-filter-card {
  padding: .75rem;
}

.audit-filter-card .panel-card__header {
  padding-bottom: .5rem;
}

.audit-filter-card .panel-card__header h3 {
  font-size: 1rem;
}

.audit-filter-card .page-eyebrow {
  margin-bottom: .2rem;
  font-size: .6rem;
}

.audit-filter-form {
  margin-top: .55rem;
}

.audit-filter-grid {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: .5rem;
}

.audit-filter-grid > * {
  min-width: 0;
}

.audit-filter-wide {
  grid-column: span 2;
}

.audit-filter-card .form-label {
  margin-bottom: .2rem;
  font-size: .68rem;
  font-weight: 700;
}

.audit-filter-card .form-control {
  min-width: 0;
  max-width: 100%;
  min-height: 2rem;
  padding: .25rem .5rem;
  border-radius: .5rem;
  font-size: .75rem;
  line-height: 1.35;
}

.audit-filter-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  align-self: end;
  justify-content: flex-end;
  grid-column: span 3;
  gap: .55rem;
  min-height: 2rem;
}

.audit-error-list {
  margin: .45rem 0 0;
  padding-left: 1.2rem;
}

.audit-results-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  border-bottom: 1px solid var(--portal-line);
}

.audit-results-header h3 {
  margin: 0;
  font-size: 1.1rem;
  font-weight: 730;
}

.audit-result-count {
  margin: 0;
  color: var(--portal-muted);
  font-size: .72rem;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

.audit-table {
  min-width: 60rem;
  margin: 0;
  vertical-align: middle;
}

.audit-table > :not(caption) > * > * {
  border-color: var(--portal-line);
}

.audit-table thead th {
  color: var(--portal-muted);
  background: var(--portal-brand-faint);
  font-size: .62rem;
  font-weight: 780;
  letter-spacing: .06em;
  text-transform: uppercase;
  white-space: nowrap;
}

.audit-table tbody td {
  color: var(--portal-ink);
  font-size: .72rem;
}

.audit-time,
.audit-monospace {
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
  font-variant-numeric: tabular-nums;
}

.audit-time time,
.audit-time small,
.audit-cell-stack strong,
.audit-cell-stack small {
  display: block;
}

.audit-time time,
.audit-cell-stack strong {
  font-size: .7rem;
  font-weight: 700;
}

.audit-time small,
.audit-cell-stack small,
.audit-muted {
  margin-top: .18rem;
  color: var(--portal-muted);
  font-size: .62rem;
}

.audit-details-cell {
  width: 1%;
  text-align: right;
  white-space: nowrap;
}

.audit-view-button {
  min-height: 1.65rem;
  padding: .25rem .55rem;
  border-radius: .5rem;
  font-size: .66rem;
  font-weight: 740;
}

.audit-event-dialog {
  --bs-dialog-width: 46rem;
  --bs-dialog-padding: 1rem;
  --bs-dialog-header-padding: .85rem 1rem;
  --bs-dialog-footer-padding: .75rem 1rem;
  --bs-dialog-backdrop-bg: rgba(3, 20, 42, .5);
  --bs-dialog-backdrop-blur: 2px;
  border: 1px solid var(--portal-line);
  border-radius: var(--portal-radius);
  color: var(--portal-ink);
  background: #fff;
  box-shadow: var(--portal-shadow);
}

.audit-event-dialog:not([open]) {
  display: none;
}

.audit-event-dialog .dialog-header {
  gap: 1rem;
}

.audit-event-dialog .page-eyebrow {
  margin-bottom: .25rem;
}

.audit-detail-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .75rem 1rem;
  margin: 0;
}

.audit-detail-list div {
  min-width: 0;
}

.audit-detail-list dt {
  color: var(--portal-muted);
  font-size: .65rem;
  font-weight: 780;
  letter-spacing: .05em;
  text-transform: uppercase;
}

.audit-detail-list dd {
  margin: .15rem 0 0;
  font-size: .78rem;
  overflow-wrap: anywhere;
}

.audit-detail-wide {
  grid-column: 1 / -1;
}

.audit-metadata {
  display: grid;
  gap: .35rem;
  margin-top: .75rem;
}

.audit-metadata > span {
  color: var(--portal-muted);
  font-size: .58rem;
  font-weight: 780;
  letter-spacing: .05em;
  text-transform: uppercase;
}

.audit-metadata pre {
  max-height: 16rem;
  margin: 0;
  padding: .7rem;
  overflow: auto;
  border: 1px solid #d4e3f5;
  border-radius: .55rem;
  color: #d9e8fb;
  background: var(--portal-brand-deep);
  font-size: .65rem;
  line-height: 1.5;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}

.audit-empty {
  padding: 2.5rem 1rem;
  text-align: center;
}

.audit-empty strong {
  display: block;
  font-size: .9rem;
}

.audit-empty p {
  max-width: 34rem;
  margin: .4rem auto 0;
  color: var(--portal-muted);
  font-size: .72rem;
}

.audit-pagination {
  display: flex;
  justify-content: flex-end;
  padding-top: .8rem;
  border-top: 1px solid var(--portal-line);
}

.audit-pagination .pagination {
  margin: 0;
}

@media (max-width: 1050px) {
  .metric-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

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

  .audit-filter-wide,
  .audit-filter-actions {
    grid-column: span 1;
  }
}

@media (max-width: 820px) {
  .auth-shell {
    grid-template-columns: 1fr;
  }

  .auth-brand {
    min-height: 18rem;
    padding: 2rem;
  }

  .auth-brand h1 {
    max-width: none;
    font-size: 2.5rem;
  }

  .auth-brand__copy {
    margin-top: .8rem;
  }

  .auth-brand__status {
    display: none;
  }

  .auth-panel {
    padding: 1.25rem;
  }

  .portal-shell {
    grid-template-columns: 1fr;
  }

  .portal-sidebar {
    position: fixed;
    left: 0;
    transform: translateX(-105%);
    width: var(--portal-sidebar);
    height: 100vh;
    height: 100dvh;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    box-shadow: 18px 0 50px rgba(0,0,0,.22);
    transition: transform 170ms ease;
  }

  .portal-sidebar > * {
    flex-shrink: 0;
  }

  .portal-sidebar.is-open {
    transform: translateX(0);
  }

  .sidebar-close {
    display: grid;
  }

  .sidebar-backdrop {
    position: fixed;
    inset: 0;
    display: block;
    visibility: hidden;
    opacity: 0;
    background: rgba(3, 20, 42, .5);
    backdrop-filter: blur(2px);
    pointer-events: none;
    touch-action: none;
    overscroll-behavior: none;
    transition: opacity 170ms ease, visibility 170ms ease;
    z-index: 9;
  }

  .sidebar-backdrop.is-active {
    visibility: visible;
    opacity: 1;
    pointer-events: auto;
  }

  .portal-heading {
    grid-column: 2;
  }

  .sidebar-toggle {
    display: inline-grid;
    grid-column: 1;
    place-items: center;
  }

  .user-menu {
    grid-column: 3;
  }

  .user-meta {
    display: none;
  }

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

@media (max-width: 560px) {
  .portal-topbar {
    padding-inline: .75rem;
  }

  .user-avatar {
    display: none;
  }

  .portal-content {
    padding: 1rem;
  }

  .welcome-strip {
    align-items: flex-start;
    flex-direction: column;
    gap: 1rem;
  }

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

  .audit-filter-grid {
    grid-template-columns: 1fr;
  }

  .audit-filter-wide {
    grid-column: auto;
  }

  .audit-filter-actions {
    align-items: stretch;
    flex-direction: column;
    grid-column: auto;
  }

  .audit-filter-actions .btn {
    width: 100%;
  }

  .audit-results-header {
    align-items: flex-start;
    flex-direction: column;
    gap: .4rem;
  }

  .audit-detail-list {
    grid-template-columns: 1fr;
  }
}

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

.management-form-actions { grid-column: 1 / -1; }
.technician-assignment-layout { row-gap: 1rem; }
.technician-assignment-layout > div { min-width: 0; }
[data-technician-assignments] [hidden] { display: none; }
[data-assignment-result][aria-busy="true"] { opacity: .55; }
.job-actions-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 20rem), 1fr)); gap: .75rem; }
[data-job-tab-navigation][hidden], .job-tab-dirty[hidden], .job-form-dirty[hidden], [data-job-draft-status][hidden] { display: none; }
.job-section-navigation { margin-top: .75rem; margin-bottom: 1rem; }
.alert.job-assignment-notice { display: block; }
.job-tabs { flex-wrap: wrap; gap: .35rem; padding: .4rem; border: 1px solid var(--portal-line); border-radius: .6rem; background: #fff; }
.job-tabs .nav-link { display: inline-flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: .3rem; min-height: 2.25rem; padding: .4rem .65rem; border: 0; border-radius: .35rem; color: var(--portal-ink); font-size: .8rem; font-weight: 600; line-height: 1.3; }
.job-tabs .nav-link.active { background: var(--portal-brand-solid); color: #fff; }
.job-tabs .nav-link:focus-visible { outline: 2px solid var(--portal-brand-solid); outline-offset: 2px; }
.job-tab-count { font-weight: 400; }
.job-tab-dirty { padding: .1rem .3rem; border-radius: .25rem; background: #fff1c2; color: #704b00; font-size: .65rem; font-weight: 650; }
.job-draft-status { margin: 0 0 1rem; padding: .5rem .75rem; border-inline-start: 3px solid #d99500; background: #fff9e6; color: #704b00; font-size: .8rem; }
.job-form-dirty { display: block; color: #925f00; font-size: .75rem; }
.job-tab-pane { min-width: 0; scroll-margin-top: 6rem; }
[data-job-page]:not([data-job-tabs-ready]) .job-tab-pane + .job-tab-pane { margin-top: 1rem; }
@media (max-width: 575.98px) { .job-tabs .nav-link { flex: 1 1 calc(50% - .35rem); } }
.job-text { white-space: pre-wrap; overflow-wrap: anywhere; }
.job-work-section { scroll-margin-top: 1rem; }
#job-photos { scroll-margin-top: 1rem; }
#job-photos [hidden], .job-photo-dialog:not([open]) { display: none; }
.job-photo-heading, .job-photo-dialog-heading { display: flex; justify-content: space-between; align-items: center; gap: .75rem; }
.job-photo-upload-details { margin-top: .75rem; }
.job-photo-upload-details > summary { cursor: pointer; color: var(--portal-brand-dark); font-size: .85rem; font-weight: 650; }
.job-photo-filters { align-items: end; }
.job-photo-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 13rem), 1fr)); gap: .75rem; }
.job-photo-card { min-width: 0; border: 1px solid var(--portal-line); border-radius: .6rem; overflow: hidden; background: #fff; }
.job-photo-thumbnail { display: grid; place-items: center; height: 10rem; background: var(--portal-canvas); }
.job-photo-thumbnail img { display: block; width: 100%; height: 100%; object-fit: contain; }
.job-photo-card-content { padding: .65rem; }
.job-photo-caption { margin: .4rem 0 0; font-size: .8rem; white-space: pre-wrap; overflow-wrap: anywhere; }
.job-photo-full { display: block; max-width: 100%; width: auto; height: auto; max-height: 70dvh; margin-inline: auto; object-fit: contain; }
.job-photo-preview-details { margin-top: .75rem; }
.job-photo-dialog { position: fixed; width: min(60rem, calc(100vw - 2rem)); max-height: calc(100dvh - 2rem); padding: 1rem; border: 1px solid var(--portal-line); border-radius: .75rem; background: #fff; color: var(--portal-ink); overflow: auto; overscroll-behavior: contain; }
html:has(.job-photo-dialog[open]), body:has(.job-photo-dialog[open]) { overflow: hidden; }
.job-photo-dialog::backdrop { background: rgba(8, 20, 40, .65); }
.job-photo-dialog-heading { margin-bottom: .75rem; }
.job-photo-dialog-heading h2 { margin: 0; font-size: 1.1rem; }
[data-photo-upload-progress] progress { display: block; width: 100%; height: .75rem; accent-color: var(--portal-brand-solid); }
.job-photo-upload-results { margin: .4rem 0 0; padding-inline-start: 1.2rem; font-size: .8rem; overflow-wrap: anywhere; }
.job-work-heading { margin-bottom: .75rem; }
.job-work-heading h3 { margin-bottom: .25rem; }
.management-table.job-work-table { min-width: 32rem; }
.job-work-editor > summary, .job-work-retained > summary, .job-work-dimensions > summary { cursor: pointer; color: var(--portal-brand-dark); font-size: .8rem; font-weight: 650; }
.job-work-editor[open] > summary { margin-bottom: .75rem; }
.job-work-retained > .panel-card { box-shadow: none; }
.job-work-retained > .panel-card:last-child { margin-bottom: 0; }
.job-work-editor:target { scroll-margin-top: 1rem; }
.job-status-badge {
  --bs-theme-fg: #475569;
  --bs-theme-bg-subtle: #edf1f5;
  --bs-badge-border-color: #d4dce6;
  --bs-badge-border-radius: .35rem;
  --bs-badge-font-size: .75rem;
  max-width: 100%;
  white-space: normal;
  line-height: 1.25;
}
.job-status-badge--new { --bs-theme-fg: #0e596c; --bs-theme-bg-subtle: #e0f5fb; --bs-badge-border-color: #b6e4f2; }
.job-status-badge--assigned { --bs-theme-fg: #063a75; --bs-theme-bg-subtle: #e2efff; --bs-badge-border-color: #bfd8fb; }
.job-status-badge--in-progress { --bs-theme-fg: #704b00; --bs-theme-bg-subtle: #fff3cc; --bs-badge-border-color: #f0d88b; }
.job-status-badge--quote-required { --bs-theme-fg: #8a3a0a; --bs-theme-bg-subtle: #ffeadb; --bs-badge-border-color: #f6ceb0; }
.job-status-badge--proceed-with-repair { --bs-theme-fg: #5b3391; --bs-theme-bg-subtle: #f0e8fb; --bs-badge-border-color: #d9c5ef; }
.job-status-badge--completed { --bs-theme-fg: #14633b; --bs-theme-bg-subtle: #e1f5e9; --bs-badge-border-color: #b9e4ca; }
.job-status-summary, .job-status-transition { display: flex; flex-wrap: wrap; align-items: center; gap: .4rem; }
[data-job-repair-category][hidden] { display: none; }
.welcome-strip > div { min-width: 0; }
.welcome-strip h2 { overflow-wrap: anywhere; }
[data-job-technician-picker] [hidden] { display: none; }
.job-technician-layout { row-gap: 1rem; }
.job-technician-layout > div, .job-technician-details { min-width: 0; }
.job-technician-heading { margin: 0 0 .5rem; font-size: .85rem; font-weight: 700; }
.job-technician-assigned { display: grid; gap: .4rem; max-height: 21rem; margin: 0; padding: 0; overflow-y: auto; overscroll-behavior: contain; list-style: none; }
.job-technician-row { display: flex; align-items: center; justify-content: space-between; gap: .75rem; min-width: 0; padding: .5rem .65rem; border: 1px solid var(--portal-line); border-radius: .4rem; font-size: .8rem; }
.job-technician-details { overflow-wrap: anywhere; }
.job-technician-row .btn { flex: 0 0 auto; }
.job-history-table td:last-child { min-width: 16rem; max-width: 42rem; }
.management-form-grid .form-label { margin-bottom: .25rem; font-size: .75rem; }
.management-table { min-width: 44rem; margin-bottom: 0; }
.management-table > :not(caption) > * > * { vertical-align: middle; overflow-wrap: anywhere; }
.management-table th { color: var(--portal-muted); font-size: .75rem; }
.management-secondary { display: block; color: var(--portal-muted); margin-top: .2rem; overflow-wrap: anywhere; }
.management-actions { display: flex; flex-wrap: wrap; align-items: center; gap: .4rem; }
.management-actions form { margin: 0; }
.management-action-select { width: auto; max-width: 13rem; }
.company-filter-card, .management-filter-card { padding: .75rem; }
.company-filter-form, .management-filter-form { display: flex; flex-wrap: wrap; align-items: end; gap: .5rem; }
.company-filter-form > div, .management-filter-form > div { flex: 1 1 10rem; min-width: 0; }
.company-filter-form .company-filter-search, .management-filter-form .management-filter-search { flex: 2 1 16rem; }
.company-filter-form > .management-actions, .management-filter-form > .management-actions { flex: 0 1 auto; }
.company-filter-form .form-label, .management-filter-form .form-label, .company-profile-form .form-label, .company-assignment-form .form-label { margin-bottom: .25rem; font-size: .75rem; }
.workspace-selection-table { min-width: 36rem; }
.workspace-users-heading { min-width: 0; }
.workspace-users-heading h2 { overflow-wrap: anywhere; }
.company-profile-form { display: grid; gap: 1rem; }
.company-logo-layout { display: flex; flex-wrap: wrap; align-items: center; gap: .75rem 1rem; min-width: 0; }
.company-logo-preview { display: flex; justify-content: center; align-items: center; width: min(100%, 15rem); min-height: 5rem; padding: .5rem; border: 1px solid var(--portal-line); border-radius: .5rem; background: #fff; color: #183153; text-align: center; overflow-wrap: anywhere; }
.company-logo-preview img { display: block; max-width: 100%; max-height: 7rem; width: auto; height: auto; object-fit: contain; }
.company-logo-preview [hidden], .company-logo [data-logo-clear][hidden], .company-logo [data-logo-error][hidden] { display: none; }
.company-logo-controls { flex: 1 1 18rem; min-width: 0; max-width: 100%; }
.company-address-lookup { position: relative; }
.company-address-suggestions { position: absolute; inset-inline: 0; top: 100%; z-index: 7; border: 1px solid var(--portal-line); border-radius: .5rem; background: #fff; box-shadow: var(--portal-shadow); overflow: hidden; }
.company-address-suggestions[hidden], .company-address-details[hidden], .company-address-map-panel[hidden], [data-property-field][hidden] { display: none; }
.company-address-results { max-height: 16rem; overflow-y: auto; margin: 0; padding: .2rem 0; list-style: none; }
.company-address-option { display: block; width: 100%; border: 0; padding: .5rem .7rem; color: var(--portal-ink); background: #fff; font: inherit; font-size: .8rem; text-align: start; white-space: normal; overflow-wrap: anywhere; }
.company-address-option:hover, .company-address-option[aria-selected="true"] { color: var(--portal-brand-dark); background: var(--portal-brand-soft); }
.company-address-attribution { display: flex; flex-wrap: wrap; justify-content: space-between; gap: .4rem; padding: .3rem .7rem; border-top: 1px solid var(--portal-line); color: #5e5e5e; font: normal 400 .75rem/1.5 Arial, sans-serif; letter-spacing: normal; white-space: nowrap; }
.company-address-status { min-height: 1.1rem; margin: .4rem 0 .7rem; }
.company-address-details { min-width: 0; margin: 0; padding: 0; border: 0; }
.company-address-section + .company-address-section { margin-top: .75rem; padding-top: .75rem; border-top: 1px solid var(--portal-line); }
.company-address-property-fields { display: grid; gap: .75rem; min-width: 0; }
.company-address-property-fields:not(:has(> [data-property-field]:not([hidden]))) { display: none; }
.company-address-wide { grid-column: 1 / -1; }
.company-address-map-panel { margin-top: .75rem; }
.company-address-map-stage { position: relative; overflow: hidden; border: 1px solid var(--portal-line); border-radius: .75rem; background: var(--portal-canvas); }
.company-address-map { height: 340px; width: 100%; font-family: Arial, sans-serif; }
.company-address-map .gm-style { font-family: Arial, sans-serif; }
.company-address-pin { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -100%); pointer-events: none; filter: drop-shadow(0 2px 2px rgba(0,0,0,.25)); }
.company-fieldset { min-width: 0; margin: 0; padding: 0; border: 0; }
.company-fieldset + .company-fieldset { padding-top: 1rem; border-top: 1px solid var(--portal-line); }
.company-fieldset legend { float: none; width: auto; margin: 0 0 .65rem; font-size: 1rem; font-weight: 730; }
.company-assignment-form { display: flex; flex-wrap: wrap; align-items: end; gap: .5rem; }
.company-assignment-form > div { flex: 1 1 16rem; max-width: 30rem; min-width: 0; }
.company-read-group + .company-read-group { margin-top: 1rem; padding-top: 1rem; border-top: 1px solid var(--portal-line); }
.company-profile-details { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 15rem), 1fr)); gap: .75rem 1rem; margin: .75rem 0 0; }
.company-profile-details dt { color: var(--portal-muted); font-size: .75rem; }
.company-profile-details dd { margin: .15rem 0 0; font-size: .85rem; overflow-wrap: anywhere; }
.company-table, .company-assignment-table { min-width: 40rem; }
.management-pagination { display: flex; gap: .75rem; align-items: center; font-size: .8rem; }

.panel-card__header .email-heading-copy { margin: .5rem 0 0; }
.email-settings { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem 1rem; margin: .75rem 0 0; }
.email-settings dt { color: var(--portal-muted); font-size: .75rem; }
.email-settings dd { margin: .15rem 0 0; font-size: .85rem; overflow-wrap: anywhere; }
.email-result-table { margin-bottom: 0; }

:is(.nav-email-group, .nav-disclosure-group) > summary { list-style: none; cursor: pointer; }
:is(.nav-email-group, .nav-disclosure-group) > summary::-webkit-details-marker { display: none; }
:is(.nav-email-group, .nav-disclosure-group) > summary:focus-visible { outline: 2px solid #9acbff; outline-offset: 2px; }
.nav-chevron {
  display: block;
  width: .5rem;
  height: .5rem;
  margin-inline-end: .15rem;
  justify-self: end;
  border-inline-end: 2px solid currentColor;
  border-block-end: 2px solid currentColor;
  transform: rotate(-45deg);
}
:is(.nav-email-group, .nav-disclosure-group)[open] > summary .nav-chevron { transform: rotate(45deg); }
.nav-submenu { display: grid; gap: .2rem; padding-top: .2rem; }
.nav-submenu .nav-subitem {
  grid-template-columns: minmax(0, 1fr);
  min-width: 0;
  padding-inline-start: 2.6rem;
  font-size: .76rem;
  white-space: normal;
  overflow-wrap: break-word;
}
.email-preview-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 1rem; align-items: start; }
.email-preview-editor, .email-preview-result { min-width: 0; }
.email-preview-result { width: 100%; max-width: 800px; justify-self: center; }
.email-preview-form { display: grid; gap: .75rem; }
.email-preview-fields { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 16rem), 1fr)); gap: .75rem 1rem; }
.email-preview-fields > div { min-width: 0; }
.email-preview-field--wide { grid-column: 1 / -1; }
.email-preview-form .form-label { margin-bottom: .25rem; font-size: .75rem; }
.email-preview-envelope { border-bottom: 1px solid var(--portal-line); font-size: .76rem; }
.email-preview-envelope p { margin: 0 0 .3rem; overflow-wrap: anywhere; }
.email-preview-envelope p:last-child { margin-bottom: 0; }
.email-preview-envelope strong { display: inline-block; min-width: 3.5rem; color: var(--portal-muted); }
.email-preview-frame { display: block; width: 100%; max-width: 800px; height: 860px; margin-inline: auto; border: 0; background: #f3f6fb; }
.email-plain-preview { border-top: 1px solid var(--portal-line); font-size: .78rem; }
.email-plain-preview summary { cursor: pointer; color: var(--portal-brand-dark); }
.email-plain-preview pre { white-space: pre-wrap; overflow-wrap: anywhere; margin: .75rem 0 0; font-size: .75rem; }

@media (max-width: 560px) {
  .management-form-grid { grid-template-columns: minmax(0, 1fr); }
  .email-settings { grid-template-columns: minmax(0, 1fr); }
}

.costing-summary { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 10rem), 1fr)); gap: .5rem; }
.costing-summary .panel-card { padding: .65rem .85rem; }
.costing-amount { display: block; margin-top: .2rem; font-size: 1.05rem; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.costing-subline { display: block; font-size: .75rem; color: var(--portal-muted, #64748b); }
.costing-table td { vertical-align: top; }
.costing-table td:first-child { min-width: 12rem; overflow-wrap: anywhere; }
.costing-table .management-actions { flex-wrap: wrap; }
.costing-type-action { display: flex; align-items: end; }
.costing-preview { padding: .65rem .75rem; border: 1px solid #c7ddfa; border-radius: .4rem; background: #f0f6ff; font-size: .82rem; line-height: 1.6; }
.costing-loss { color: #a42621; }
.costing-history-values { margin: .65rem 0 0; font-size: .8rem; }
.costing-history-values dt { font-weight: 600; }
.costing-history-values dd { margin: 0 0 .45rem; }
.quote-preview-frame { display: block; width: 100%; max-width: 900px; height: 75vh; min-height: 28rem; margin-inline: auto; border: 1px solid var(--portal-line); border-radius: .5rem; background: #fff; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    scroll-behavior: auto !important;
    transition-duration: .01ms !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
  }
}