body.gateway-canvas,
body.gateway-canvas *,
body.gateway-canvas *::before,
body.gateway-canvas *::after { box-sizing: border-box; }

html { min-width: 20rem; }
body {
  margin: 0;
  min-height: 100vh;
  color: var(--hisd-teal-950, #093439);
  font-family: var(--font-sans);
  font-size: var(--text-base);
  line-height: 1.55;
}
body.gateway-canvas { color-scheme: dark light; }

a { color: var(--hisd-teal-700, #045c64); text-underline-offset: .18em; }
a:hover { color: var(--hisd-teal-900, #0b3b41); text-decoration-thickness: .14em; }
.gateway-canvas :focus-visible { outline: 3px solid #f9d04e; outline-offset: 3px; }
.sr-only {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

.gateway-canvas {
  position: relative;
  isolation: isolate;
  display: flex;
  flex-direction: column;
  overflow-x: hidden;
  background: radial-gradient(120% 80% at 50% 0%, #54c7cd 0%, #0b99a2 30%, #05626a 60%, #093439 100%);
}
.gateway-background,
.gateway-background::before,
.gateway-background::after {
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  content: "";
}
.gateway-background {
  background:
    radial-gradient(55% 35% at 50% 6%, rgba(255,255,255,.2), transparent 70%),
    radial-gradient(45% 34% at 90% 74%, rgba(0,0,0,.34), transparent 70%),
    radial-gradient(48% 36% at 6% 92%, rgba(0,0,0,.36), transparent 70%);
}
.gateway-background::before {
  inset: -12%;
  background:
    radial-gradient(circle at 16% 15%, rgba(255,255,255,.12) 0 4%, transparent 16%),
    radial-gradient(circle at 88% 18%, rgba(255,255,255,.1) 0 3%, transparent 15%),
    radial-gradient(circle at 28% 78%, rgba(255,255,255,.07) 0 5%, transparent 18%);
  filter: blur(2rem);
  animation: gateway-specular-drift 19s ease-in-out infinite alternate;
}
.gateway-background::after {
  background:
    radial-gradient(circle at 44% 24%, rgba(229,255,255,.72) 0 1.5px, transparent 5px),
    radial-gradient(circle at 74% 36%, rgba(229,255,255,.58) 0 1px, transparent 4px),
    radial-gradient(circle at 33% 59%, rgba(229,255,255,.55) 0 1px, transparent 4px);
  filter: drop-shadow(0 0 .35rem rgba(217,255,255,.65));
  animation: gateway-particle-drift 13s ease-in-out infinite alternate;
}
@keyframes gateway-specular-drift {
  from { transform: translate3d(-2%, -1%, 0) scale(1.01); }
  to { transform: translate3d(3%, -2%, 0) scale(1.06); }
}
@keyframes gateway-particle-drift {
  from { transform: translate3d(-.35rem, .25rem, 0); opacity: .55; }
  to { transform: translate3d(.7rem, -.8rem, 0); opacity: 1; }
}

.skip-link {
  position: fixed;
  z-index: 100;
  inset: .75rem auto auto .75rem;
  padding: .65rem 1rem;
  border-radius: 999px;
  background: #fff;
  color: #093439;
  transform: translateY(-180%);
}
.skip-link:focus { transform: translateY(0); }

.site-header {
  position: relative;
  z-index: 2;
  color: #fff;
  border-bottom: 1px solid rgba(255,255,255,.14);
  background: linear-gradient(180deg, rgba(3,28,32,.34), rgba(3,24,28,.22));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.14);
  -webkit-backdrop-filter: blur(1.75rem) saturate(150%);
  backdrop-filter: blur(1.75rem) saturate(150%);
}
.header-inner,
.page-shell,
.footer-inner {
  width: min(82.5rem, calc(100% - 4rem));
  margin-inline: auto;
}
.header-inner {
  min-height: 4.2rem;
  display: flex;
  align-items: center;
  gap: 1rem;
  padding-block: .8rem;
}
.brand-link {
  display: flex;
  align-items: center;
  gap: .8rem;
  color: #fff;
  text-decoration: none;
}
.brand-link:hover { color: #fff; text-decoration: none; }
.brand-link img { display: block; width: 2.125rem; height: 2.125rem; }
.product-name {
  color: #fff;
  font: 800 1rem/1 var(--font-display);
  letter-spacing: .12em;
  text-transform: uppercase;
}
.header-sign-in {
  margin-left: auto;
  min-height: 2.75rem;
  display: inline-flex;
  align-items: center;
  padding-inline: .5rem;
  color: rgba(255,255,255,.76);
  font-size: var(--text-xs, .75rem);
  font-weight: 700;
  letter-spacing: .11em;
  text-decoration: none;
  text-transform: uppercase;
}
.header-sign-in:hover { color: #fff; text-decoration: none; }

.page-shell {
  flex: 1 0 auto;
  display: flex;
  flex-direction: column;
  gap: 0;
  padding-block: clamp(2.5rem, 6vw, 5rem) 0;
}
.hero,
.operator-form,
.empty-state {
  border: 1px solid rgba(9,52,57,.1);
  background: #fff;
  box-shadow: 0 1.9rem 4.4rem -2.1rem rgba(0,16,21,.55);
}
.hero {
  max-width: none;
  padding: clamp(2rem, 5vw, 4rem);
  border-radius: 1.5rem;
}
.eyebrow {
  margin: 0 0 .75rem;
  color: #05626a;
  font-size: var(--text-xs, .75rem);
  font-weight: 750;
  letter-spacing: .16em;
  text-transform: uppercase;
}
h1, h2, h3 { font-family: var(--font-display); line-height: 1.12; }
h1 { margin: 0; max-width: 19ch; font-size: clamp(2.15rem, 7vw, 4.4rem); letter-spacing: -.035em; }
.lede { max-width: 52rem; margin: 1.1rem 0 0; color: rgba(9,52,57,.78); font-size: clamp(1.05rem, 2vw, 1.25rem); line-height: 1.6; }

.status-line { display: flex; flex-wrap: wrap; gap: .65rem; margin-top: 1.4rem; }
.status-pill {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  padding: .4rem .75rem;
  border: 1px solid var(--color-success-border);
  border-radius: var(--radius-pill);
  background: var(--color-success-surface);
  color: var(--color-success-strong);
  font-weight: 650;
}
.status-pill::before { content: ""; width: .55rem; height: .55rem; border-radius: 50%; background: var(--color-success); }

.action-row { display: flex; flex-wrap: wrap; gap: .8rem; margin-top: 1.6rem; }
.button {
  min-height: 2.75rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: .7rem 1.15rem;
  border: 2px solid #05626a;
  border-radius: 999px;
  background: #05626a;
  color: #fff;
  font-weight: 750;
  text-decoration: none;
  box-shadow: 0 .75rem 1.6rem -1rem rgba(0,20,26,.85);
}
.button:hover { border-color: #0b3b41; background: #0b3b41; color: #fff; text-decoration: none; }
.button.secondary { background: transparent; color: #05626a; box-shadow: none; }
.button.secondary:hover { background: #d9f4f5; color: #093439; }
.button.danger { border-color: #a5262f; background: #a5262f; color: #fff; }
.button.danger:hover { border-color: #7e1821; background: #7e1821; color: #fff; }

.experience-section {
  margin-top: 1.25rem;
  padding: clamp(1.5rem, 4vw, 2.5rem);
  border: 1px solid rgba(9,52,57,.1);
  border-radius: 1.5rem;
  background: rgba(255,255,255,.96);
  box-shadow: 0 1.9rem 4.4rem -2.1rem rgba(0,16,21,.45);
}
.experience-section > h2 { margin: 0 0 .4rem; font-size: clamp(1.45rem, 3vw, 2rem); }
.section-intro { margin-top: 0; color: rgba(9,52,57,.7); }
.card-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 17rem), 1fr)); gap: 1rem; margin-top: 1.25rem; }
.card {
  position: relative;
  min-height: 11rem;
  padding: 1.35rem;
  border: 1px solid rgba(9,52,57,.12);
  border-radius: 1rem;
  background: #fff;
  box-shadow: 0 .75rem 1.8rem -.9rem rgba(0,32,36,.22);
}
.card h2, .card h3 { margin: 0 0 .55rem; font-size: 1.2rem; }
.card p { margin: 0; color: rgba(9,52,57,.72); }
.card .card-link { display: inline-flex; margin-top: 1rem; font-weight: 750; }
.card .card-link::after { content: "\00a0→"; }
.card[data-state="waiting"] { background: #f5f5f5; box-shadow: none; }
.card-state { display: inline-block; margin-top: 1rem; color: rgba(9,52,57,.58); font-size: var(--text-sm); font-weight: 650; }

.notice {
  max-width: 52rem;
  margin-top: 1.5rem;
  padding: 1rem 1.1rem;
  border: 1px solid var(--color-info-border);
  border-left: .35rem solid var(--color-info);
  border-radius: var(--radius-md);
  background: var(--color-info-surface);
  color: var(--color-info-strong);
}
.error-code { color: rgba(9,52,57,.58); font-weight: 700; }

.policy-card {
  overflow-wrap: anywhere;
  padding-inline: clamp(1.5rem, 5vw, 4rem);
  border: 1px solid rgba(9,52,57,.1);
  border-radius: 1.5rem;
  background: #fff;
  box-shadow: 0 1.9rem 4.4rem -2.1rem rgba(0,16,21,.55);
}
.policy-intro { max-width: 60ch; padding-block: clamp(2.5rem, 5vw, 4rem); }
.policy-intro h1 { max-width: none; font-size: clamp(2.4rem, 6vw, 4rem); }
.policy-meta { display: flex; flex-wrap: wrap; gap: .5rem 1.25rem; margin-top: 1rem; color: rgba(9,52,57,.56); font-size: var(--text-xs, .75rem); }
.policy-section { padding-block: clamp(2rem, 4vw, 2.5rem); border-top: 1px solid rgba(9,52,57,.1); }
.policy-heading { display: flex; align-items: baseline; gap: .75rem; margin-bottom: 1rem; }
.policy-heading > span { flex: none; color: #05626a; font: 750 var(--text-xs, .75rem)/1 var(--font-mono, ui-monospace, monospace); }
.policy-heading h2 { margin: 0; font-size: clamp(1.35rem, 3vw, 1.65rem); letter-spacing: -.02em; }
.policy-section p { max-width: 80ch; margin: 0; color: rgba(9,52,57,.82); line-height: 1.7; }
.policy-section p + p { margin-top: 1rem; }
.policy-section code { padding: .1rem .3rem; border-radius: .25rem; background: #edf7f7; color: #093439; font: .92em/1.4 ui-monospace, monospace; }
.policy-contact {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 1.25rem;
  margin-top: clamp(1rem, 2vw, 1.5rem);
  padding: clamp(1.5rem, 4vw, 2rem) clamp(1.5rem, 5vw, 4rem);
  border: 1px solid rgba(9,52,57,.1);
  border-top: 3px solid #f9d04e;
  border-radius: 1.5rem;
  background: #fff;
  box-shadow: 0 1.9rem 4.4rem -2.1rem rgba(0,16,21,.55);
}
.policy-contact > div { flex: 1 1 18rem; }
.policy-contact h2 { margin: 0 0 .35rem; font-size: 1.25rem; }
.policy-contact p { margin: 0; color: rgba(9,52,57,.78); }

.site-footer { position: relative; z-index: 1; margin-top: 3rem; color: rgba(255,255,255,.62); }
.footer-inner {
  min-height: 6rem;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 1rem 1.5rem;
  padding-block: 1.5rem 2.5rem;
  border-top: 1px solid rgba(255,255,255,.16);
  font-size: var(--text-xs, .75rem);
}
.footer-mark { width: 11rem; height: auto; opacity: .82; filter: brightness(0) invert(1); }
.footer-inner p { margin: 0; }
.footer-links { display: flex; flex-wrap: wrap; gap: 1.25rem; margin-left: auto; }
.footer-links a { min-height: 1.75rem; display: inline-flex; align-items: center; color: rgba(255,255,255,.72); text-decoration: none; }
.footer-links a:hover { color: #fff; text-decoration: underline; }

.hero.compact h1 { font-size: clamp(2rem, 5vw, 3.35rem); }
.vendor-gallery { display: grid; gap: 1rem; margin-top: 1.25rem; }
.vendor-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: .7rem 1.25rem;
  align-items: start;
  padding: 1.25rem;
  border: 1px solid rgba(9,52,57,.12);
  border-radius: 1rem;
  background: #fff;
  box-shadow: 0 .75rem 1.8rem -.9rem rgba(0,32,36,.22);
}
.vendor-card h2 { margin: 0; font-size: 1.3rem; }
.vendor-card .eyebrow { margin-bottom: .25rem; font-size: var(--text-sm); }
.vendor-card > p { grid-column: 1; margin: 0; color: rgba(9,52,57,.72); }
.vendor-card .card-link { grid-column: 1; width: max-content; font-weight: 750; }
.vendor-status {
  display: inline-flex;
  align-items: center;
  width: max-content;
  max-width: 100%;
  padding: .35rem .7rem;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-pill);
  background: var(--color-surface-sunken);
  color: var(--color-text-muted);
  font-size: var(--text-sm);
  font-weight: 700;
}
.status-registered, .status-active, .status-accepted, .status-retrieved { border-color: var(--color-success-border); background: var(--color-success-surface); color: var(--color-success-strong); }
.status-awaiting-registration, .status-invited, .status-awaiting, .status-setup { border-color: var(--color-info-border); background: var(--color-info-surface); color: var(--color-info-strong); }
.status-attention, .status-partial { border-color: var(--color-warning-border); background: var(--color-warning-surface); color: var(--color-warning-strong); }
.vendor-status-count { display: block; margin-top: .4rem; color: var(--color-text-muted); font-size: var(--text-sm); }
.status-identity-required, .status-expired, .status-needs-attention, .status-revocation-needs-attention, .status-reactivation-needs-attention { border-color: var(--color-warning-border); background: var(--color-warning-surface); color: var(--color-warning-strong); }
.status-revoking, .status-reactivating { border-color: var(--color-info-border); background: var(--color-info-surface); color: var(--color-info-strong); }
.status-revoked { border-color: #dda6aa; background: #f9e3e5; color: #7e1821; }
.vendor-table-card {
  overflow: visible;
  border: 1px solid var(--color-border);
  border-radius: .75rem;
  background: var(--color-surface);
  color: var(--color-text);
  box-shadow: 0 1.9rem 4.4rem -2.1rem rgba(0,16,21,.48);
}
.vendor-table-heading {
  min-height: 4.4rem;
  display: flex;
  align-items: center;
  padding: 1rem;
  border-bottom: 1px solid var(--color-border);
}
.vendor-table-heading h1 { margin: 0; font: 750 1.2rem/1.25 var(--font-sans); letter-spacing: 0; }
.sdi-hosted-accounts > .vendor-table-heading { justify-content: space-between; gap: 1rem; flex-wrap: wrap; }
.sdi-hosted-accounts > .vendor-table-heading > a { font-size: .88rem; font-weight: 600; }
.sdi-account-assignments { table-layout: fixed; }
.sdi-hosted-accounts .vendor-table.sdi-account-assignments th,
.sdi-hosted-accounts .vendor-table.sdi-account-assignments td { width: 33.333%; padding: .75rem 1rem; box-sizing: border-box; }
.sdi-hosted-accounts .sdi-account-assignments th:last-child,
.sdi-hosted-accounts .sdi-account-assignments td:last-child { width: 33.333%; padding-right: 1rem; text-align: left; white-space: normal; }
.sdi-account-assignments select { width: 100%; min-width: 0; }
.vendor-table-toolbar {
  min-height: 6.6rem;
  display: flex;
  align-items: center;
  gap: 1rem;
  padding: 1.5rem 1rem;
}
.vendor-search { position: relative; width: min(15.5rem, 100%); }
.vendor-search::before {
  position: absolute;
  inset: 50% auto auto 1rem;
  width: .8rem;
  height: .8rem;
  border: .15rem solid currentColor;
  border-radius: 50%;
  color: var(--color-text-subtle);
  content: "";
  transform: translateY(-62%);
}
.vendor-search::after {
  position: absolute;
  inset: calc(50% + .34rem) auto auto 1.72rem;
  width: .46rem;
  height: .14rem;
  border-radius: 999px;
  background: var(--color-text-subtle);
  content: "";
  transform: rotate(45deg);
  transform-origin: left center;
}
.vendor-search input {
  width: 100%;
  min-height: 2.75rem;
  padding: .65rem .85rem .65rem 3rem;
  border: 1px solid var(--color-border-strong);
  border-radius: .35rem;
  background: var(--color-surface);
  color: var(--color-text);
  font: 500 .9rem/1.2 var(--font-sans);
}
.vendor-add { margin-left: auto; min-height: 2.75rem; gap: .55rem; padding-inline: 1.35rem; box-shadow: none; }
.vendor-add span { font-size: 1.2rem; line-height: 1; }
.vendor-table-scroll { overflow-x: auto; padding-inline: 1rem; }
.vendor-table { width: 100%; border-collapse: collapse; text-align: left; }
.vendor-table th {
  height: 3.4rem;
  padding: .75rem 0;
  border-bottom: 1px dashed var(--color-border);
  color: var(--color-text-subtle);
  font-size: .78rem;
  font-weight: 700;
}
.vendor-table td {
  height: 4.5rem;
  padding: .75rem 0;
  border-bottom: 1px dashed var(--color-border);
  color: var(--color-text);
  font-size: .88rem;
  vertical-align: middle;
}
.vendor-table th + th,
.vendor-table td + td { padding-left: 1.25rem; }
.vendor-table th:nth-child(1) { width: 36%; }
.vendor-table th:nth-child(2) { width: 29%; }
.vendor-table th:nth-child(3) { width: 23%; }
.vendor-table th:last-child,
.vendor-table td:last-child { width: 1%; padding-right: 0; text-align: right; white-space: nowrap; }
.vendor-table td:first-child strong,
.vendor-table td:first-child span { display: block; }
.vendor-table td:first-child strong { font-weight: 650; }
.vendor-table td:first-child span { margin-top: .12rem; color: var(--color-text-subtle); font-size: .75rem; }
.vendor-actions { position: relative; display: inline-flex; align-items: center; min-height: 2.5rem; vertical-align: middle; text-align: left; }
.vendor-actions-trigger, .vendor-actions-fallback {
  min-height: 2.5rem;
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  padding: .55rem .9rem;
  border-radius: 999px;
  background: var(--color-surface-sunken);
  color: var(--color-text);
  border: 0;
  font: inherit;
  font-weight: 650;
  cursor: pointer;
  text-decoration: none;
}
.vendor-actions-trigger[hidden], .vendor-actions-fallback[hidden] { display: none; }
.vendor-actions-trigger:hover, .vendor-actions-trigger[aria-expanded="true"] { background: var(--color-selected); color: var(--color-text-on-selected); }
.vendor-actions-chevron {
  width: .46rem;
  height: .46rem;
  margin-top: -.22rem;
  border-right: 1.5px solid currentColor;
  border-bottom: 1.5px solid currentColor;
  transform: rotate(45deg);
  transform-origin: center;
  flex: 0 0 auto;
}
.vendor-actions-menu {
  position: fixed;
  inset: auto;
  margin: 0;
  min-width: 11rem;
  max-width: calc(100vw - 16px);
  max-height: calc(100vh - 16px);
  overflow: auto;
  padding: .35rem;
  border: 1px solid var(--color-border);
  border-radius: .55rem;
  background: var(--color-surface-raised);
  color: var(--color-text);
  font: 400 .88rem/1.5 var(--font-sans);
  text-align: left;
  box-shadow: var(--shadow-2);
}
.vendor-actions-menu a { min-height: 2.5rem; display: flex; align-items: center; padding: .55rem .7rem; border-radius: .35rem; color: var(--color-text); text-decoration: none; }
.vendor-actions-menu a:hover { background: var(--color-selected); color: var(--color-text-on-selected); text-decoration: none; }
.vendor-actions-menu .vendor-action-danger { color: #a5262f; }
.vendor-actions-menu .vendor-action-danger:hover { background: #f9e3e5; color: #7e1821; }
.vendor-empty-row td { height: 6rem; color: var(--color-text-muted); text-align: center !important; }
.vendor-table-footer {
  min-height: 5rem;
  display: flex;
  align-items: center;
  gap: .75rem;
  padding: 1rem;
  color: var(--color-text-muted);
  font-size: .8rem;
}
.vendor-page-size select {
  min-width: 4.75rem;
  min-height: 2.4rem;
  padding: .4rem .7rem;
  border: 0;
  border-radius: .35rem;
  background: var(--color-surface-sunken);
  color: var(--color-text);
  font: inherit;
}
.vendor-table-footer p { margin: 0; }
.vendor-pagination { display: flex; align-items: center; gap: .45rem; margin-left: auto; }
.vendor-pagination button,
.vendor-pagination span {
  min-width: 2.25rem;
  min-height: 2.25rem;
  display: inline-grid;
  place-items: center;
  border: 0;
  border-radius: .35rem;
  background: transparent;
  color: var(--color-text-muted);
  font: 700 .85rem/1 var(--font-sans);
}
.vendor-pagination span { background: var(--color-action); color: var(--color-on-action); }
.vendor-pagination button { cursor: pointer; }
.vendor-pagination button:disabled { opacity: .4; cursor: default; }
.operator-form {
  display: grid;
  gap: .75rem;
  max-width: 38rem;
  margin-top: 1.25rem;
  padding: 1.5rem;
  border-radius: 1rem;
}
.operator-form label { font-weight: 700; }
.operator-form input {
  width: 100%;
  min-height: 2.9rem;
  padding: .65rem .75rem;
  border: 1px solid #74898c;
  border-radius: .55rem;
  background: #fff;
  color: #093439;
  font: inherit;
}
.operator-form .button { margin-top: .5rem; cursor: pointer; }
.compact-form p { margin: 0 0 .5rem; color: rgba(9,52,57,.72); }
.empty-state { padding: 2rem; border-style: dashed; border-radius: 1rem; }
.empty-state h2, .empty-state p { margin-top: 0; }

/* Gateway-owned Admin operations share the native SFTPGo Admin shell without
 * copying or patching the upstream application bundle. */
@font-face {
  font-family: keenicons-duotone;
  src: url("/assets/native-icons/duotone.woff") format("woff");
  font-style: normal;
  font-weight: 400;
  font-display: block;
}
@font-face {
  font-family: keenicons-solid;
  src: url("/assets/native-icons/solid.woff") format("woff");
  font-style: normal;
  font-weight: 400;
  font-display: block;
}
.admin-workspace {
  --admin-shell-header: var(--sdi-workspace-header-height);
  --admin-sidebar-header: var(--sdi-workspace-sidebar-header-height);
  --admin-shell-sidebar: var(--sdi-workspace-sidebar-width);
  --admin-shell-surface: rgba(255,255,255,.96);
  --admin-shell-text: var(--hisd-teal-950, #093439);
  --admin-shell-muted: rgba(9,52,57,.72);
  font-size: 13px;
  line-height: 1.5;
}
.admin-workspace button,
.admin-workspace input,
.admin-workspace select,
.admin-workspace textarea { font-family: var(--font-sans); }
.admin-header {
  grid-column: 2;
  grid-row: 1;
  position: sticky;
  inset-block-start: 0;
  z-index: 20;
  min-height: var(--admin-shell-header);
  display: flex;
  align-items: center;
  gap: 1rem;
  padding-inline: 42.25px;
  border-bottom: 1px solid rgba(255,255,255,.16);
  background: linear-gradient(180deg, rgba(3,28,32,.58), rgba(3,24,28,.42));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.14), 0 .75rem 2rem rgba(3,28,32,.1);
  -webkit-backdrop-filter: blur(1.75rem) saturate(150%);
  backdrop-filter: blur(1.75rem) saturate(150%);
}
.admin-brand {
  display: inline-flex;
  align-items: center;
  gap: var(--sdi-workspace-lockup-gap);
  color: #fff;
  font: var(--sdi-workspace-lockup-font);
  letter-spacing: var(--sdi-workspace-lockup-letter-spacing);
  text-decoration: none;
  text-transform: uppercase;
}
.admin-brand:hover { color: #fff; text-decoration: none; }
.admin-brand img { width: var(--sdi-workspace-lockup-glyph-size); height: var(--sdi-workspace-lockup-glyph-size); }
.sdi-admin-role-pill {
  flex: 0 0 auto;
  padding: var(--sdi-workspace-role-padding);
  border-radius: 999px;
  background: var(--sdi-workspace-role-admin-background);
  color: #fff;
  font: var(--sdi-workspace-role-font);
  letter-spacing: var(--sdi-workspace-lockup-letter-spacing);
  text-transform: uppercase;
  white-space: nowrap;
  box-shadow: 0 .2rem .75rem rgba(67, 13, 17, .18);
}
.sdi-admin-role-pill-portal { background: var(--sdi-workspace-role-portal-background); }
.admin-header-actions { display: flex; align-items: center; gap: .75rem; margin-left: auto; }
.admin-header-actions a,
.admin-theme-toggle {
  min-height: 2.75rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid transparent;
  border-radius: .65rem;
  background: transparent;
  color: rgba(255,255,255,.84);
  font: 700 var(--text-xs, .75rem)/1 var(--font-sans);
  letter-spacing: .08em;
  text-decoration: none;
  text-transform: uppercase;
}
.admin-header-actions a { width: 2.75rem; }
.admin-theme-toggle { width: 2.75rem; cursor: pointer; }
.admin-user-action span { position: relative; width: 1.1rem; height: 1.1rem; display: block; }
.admin-user-action span::before {
  position: absolute;
  inset: 0 auto auto 50%;
  width: .43rem;
  height: .43rem;
  border-radius: 50%;
  background: currentColor;
  content: "";
  transform: translateX(-50%);
}
.admin-user-action span::after {
  position: absolute;
  inset: .58rem 0 auto;
  height: .5rem;
  border-radius: .55rem .55rem .15rem .15rem;
  background: currentColor;
  content: "";
}
.admin-header-actions a:hover,
.admin-theme-toggle:hover { border-color: rgba(255,255,255,.18); background: rgba(255,255,255,.12); color: #fff; text-decoration: none; }
.admin-layout { flex: 1 0 auto; min-height: 100vh; display: grid; grid-template-columns: var(--admin-shell-sidebar) minmax(0, 1fr); grid-template-rows: var(--admin-shell-header) minmax(0, 1fr); }
.admin-sidebar {
  grid-column: 1;
  grid-row: 1 / -1;
  position: sticky;
  inset-block-start: 0;
  height: 100vh;
  padding: 0 0 1.5rem;
  border-right: 1px solid rgba(255,255,255,.16);
  background: linear-gradient(180deg, rgba(18,31,34,.97), rgba(9,52,57,.98));
  box-shadow: inset -1px 0 0 rgba(255,255,255,.05), .75rem 0 2rem rgba(3,28,32,.12);
  overflow-y: auto;
}
.admin-district-mark {
  min-height: var(--admin-sidebar-header);
  height: var(--admin-sidebar-header);
  display: flex;
  align-items: flex-start;
  justify-content: center;
  box-sizing: border-box;
  padding: 11.578125px 1.65rem 0;
}
.admin-district-mark img { display: block; width: var(--sdi-workspace-district-mark-width); max-width: 100%; height: var(--sdi-workspace-district-mark-height); object-fit: contain; }
.admin-navigation { width: 246.833333px; display: grid; gap: 0; margin: 6.5px 0 0 16.25px; padding: 0 16.25px; box-sizing: border-box; }
.admin-navigation > a,
.admin-navigation > details { margin-block: .15rem; }
.admin-navigation > a,
.admin-navigation summary,
.admin-mobile-navigation nav > a,
.admin-mobile-navigation nav summary {
  min-height: 48.416667px;
  display: flex;
  align-items: center;
  gap: 0;
  padding: 13px 10px;
  border-radius: .55rem;
  color: #fff;
  font-size: 13px;
  font-weight: 650;
  line-height: 1.5;
  text-decoration: none;
}
.admin-navigation summary,
.admin-mobile-navigation nav summary { list-style: none; cursor: pointer; }
.admin-navigation summary::-webkit-details-marker,
.admin-mobile-navigation nav summary::-webkit-details-marker { display: none; }
.admin-navigation > a:hover,
.admin-navigation > a:focus-visible,
.admin-navigation > a.active,
.admin-navigation summary:hover,
.admin-navigation summary:focus-visible,
.admin-mobile-navigation nav > a:hover,
.admin-mobile-navigation nav > a:focus-visible,
.admin-mobile-navigation nav > a.active,
.admin-mobile-navigation nav summary:hover,
.admin-mobile-navigation nav summary:focus-visible { background: rgba(255,255,255,.12); color: #fff; text-decoration: none; }
.admin-nav-group { color: #fff; }
.admin-nav-label { min-width: 0; display: flex; flex: 1 1 auto; }
.admin-nav-chevron {
  position: relative;
  width: 11px;
  height: 11px;
  display: flex;
  flex: 0 0 11px;
  margin-left: 5px;
}
.admin-nav-chevron::after {
  width: 11px;
  height: 11px;
  display: block;
  background-color: #78829d;
  content: " ";
  mask-image: url("data:image/svg+xml,%3csvg xmlns='http:%2f%2fwww.w3.org/2000/svg' viewBox='0 0 6 6' fill='%2378829D'%3e%3cpath d='M3.27989 3.23571L1.53642 4.97917C1.36382 5.15176 1.36383 5.43158 1.53642 5.60417C1.70901 5.77676 1.98882 5.77676 2.16139 5.60417L4.47096 3.29463C4.63371 3.13192 4.63371 2.86809 4.47096 2.70538L2.16139 0.395812C1.98883 0.22325 1.70901 0.22325 1.53642 0.395812C1.36383 0.568437 1.36383 0.84825 1.53642 1.02081L3.27989 2.76429C3.41006 2.89446 3.41006 3.10554 3.27989 3.23571Z'/%3e%3c/svg%3e");
  mask-repeat: no-repeat;
  transform: rotate(90deg);
  transition: transform .3s;
}
.admin-nav-submenu { display: grid; gap: 0; margin-left: 1rem; padding: 0; }
.admin-nav-submenu a { min-height: 42px; display: flex; align-items: center; margin-block: 1.95px; padding: 10px; border-radius: .45rem; color: #fff; font-size: 13px; font-weight: 400; line-height: 1.5; text-decoration: none; }
.admin-nav-bullet { width: 1.25rem; display: flex; flex: 0 0 1.25rem; align-items: center; justify-content: center; margin-right: .5rem; }
.admin-nav-bullet > span { width: 4px; height: 4px; display: block; border-radius: 50%; background: currentColor; opacity: .74; }
.admin-nav-submenu .admin-nav-label { font-weight: 650; }
.admin-nav-submenu a:hover,
.admin-nav-submenu a:focus-visible,
.admin-nav-submenu a.active { background: rgba(255,255,255,.12); color: #fff; text-decoration: none; }
.admin-nav-icon { flex: 0 0 var(--sdi-workspace-nav-icon-slot); width: var(--sdi-workspace-nav-icon-slot); display: inline-flex; align-items: center; justify-content: center; color: #fff; margin-right: var(--sdi-workspace-nav-icon-gap); }
.sdi-nav-credential-icon { display: block; width: var(--sdi-workspace-nav-glyph-size); height: var(--sdi-workspace-nav-glyph-size); flex: 0 0 var(--sdi-workspace-nav-glyph-size); }
.admin-nav-icon .ki-duotone,
.admin-nav-icon .ki-solid { color: #fff; font-size: var(--sdi-workspace-nav-glyph-size); line-height: 0; }
.admin-nav-icon .ki-duotone { position: relative; display: inline-flex; direction: ltr; font-family: keenicons-duotone !important; font-style: normal; font-variant: normal; font-weight: 400; text-transform: none; -webkit-font-smoothing: antialiased; }
.admin-nav-icon .ki-solid { font-family: keenicons-solid !important; font-style: normal; font-variant: normal; font-weight: 400; text-transform: none; -webkit-font-smoothing: antialiased; }
.ki-people .path1::before { content: "\edbe"; }
.ki-people .path2::before { content: "\edbf"; position: absolute; left: 0; }
.ki-people .path3::before { content: "\edc0"; position: absolute; left: 0; opacity: .3; }
.ki-people .path4::before { content: "\edc1"; position: absolute; left: 0; opacity: .3; }
.ki-people .path5::before { content: "\edc2"; position: absolute; left: 0; opacity: .3; }
.ki-profile-user .path1::before { content: "\ede2"; opacity: .3; }
.ki-profile-user .path2::before { content: "\ede3"; position: absolute; left: 0; }
.ki-profile-user .path3::before { content: "\ede4"; position: absolute; left: 0; opacity: .3; }
.ki-profile-user .path4::before { content: "\ede5"; position: absolute; left: 0; }
.ki-folder .path1::before { content: "\ec5e"; opacity: .3; }
.ki-folder .path2::before { content: "\ec5f"; position: absolute; left: 0; }
.ki-key .path1::before { content: "\eb0f"; opacity: .3; }
.ki-key .path2::before { content: "\eb10"; position: absolute; left: 0; }
.ki-briefcase .path1::before { content: "\ea0f"; opacity: .3; }
.ki-briefcase .path2::before { content: "\ea10"; position: absolute; left: 0; }
.ki-arrow-up-down .path1::before { content: "\e9a7"; opacity: .3; }
.ki-arrow-up-down .path2::before { content: "\e9a8"; position: absolute; left: 0; }
.ki-calendar .path1::before { content: "\ea70"; opacity: .3; }
.ki-calendar .path2::before { content: "\ea71"; position: absolute; left: 0; }
.ki-shield::before { content: "\eacf"; }
.ki-setting-3 .path1::before { content: "\ee42"; opacity: .3; }
.ki-setting-3 .path2::before { content: "\ee43"; position: absolute; left: 0; }
.ki-setting-3 .path3::before { content: "\ee44"; position: absolute; left: 0; }
.ki-setting-3 .path4::before { content: "\ee45"; position: absolute; left: 0; }
.ki-setting-3 .path5::before { content: "\ee46"; position: absolute; left: 0; }
.ki-security-user::before { content: "\eac4"; }
.ki-user-tick .path1::before { content: "\ef79"; }
.ki-user-tick .path2::before { content: "\ef7a"; position: absolute; left: 0; }
.ki-user-tick .path3::before { content: "\ef7b"; position: absolute; left: 0; opacity: .3; }
.admin-nav-icon .ki-duotone,
.admin-nav-icon .ki-solid,
.admin-nav-icon .ki-duotone [class^="path"],
.admin-nav-icon .ki-duotone [class*=" path"],
.admin-nav-icon .ki-duotone [class^="path"]::before,
.admin-nav-icon .ki-duotone [class*=" path"]::before {
  color: #fff;
  opacity: 1 !important;
}
.vendor-form-card { overflow: hidden; border: 1px solid rgba(9,52,57,.1); border-radius: .9rem; background: var(--admin-shell-surface); color: var(--admin-shell-text); box-shadow: 0 1.5rem 3.5rem -2.2rem rgba(0,16,21,.46); }
.vendor-form-heading { padding: 1.25rem 1.35rem; border-bottom: 1px solid rgba(9,52,57,.12); }
.vendor-form-heading h1 { margin: 0; font-size: 1.18rem; font-weight: 600; letter-spacing: 0; line-height: 1.2; }
.vendor-onboarding-form { max-width: none; margin: 0; padding: 1.5rem 1.35rem; border: 0; border-radius: 0; background: transparent; box-shadow: none; }
.vendor-form-fields { display: grid; grid-template-columns: minmax(9rem, 12rem) minmax(16rem, 36rem); gap: 1rem 1.25rem; align-items: center; }
.vendor-form-fields > label:not(.contact-email-toggle) { margin: 0; }
.contact-email-toggle { grid-column: 2; display: inline-flex; align-items: center; gap: .65rem; width: fit-content; cursor: pointer; font-weight: 650 !important; }
.contact-email-toggle input { width: 1.1rem; min-height: 1.1rem; margin: 0; accent-color: var(--color-action); }
.conditional-contact-field { grid-column: 1 / -1; display: grid; grid-template-columns: minmax(9rem, 12rem) minmax(16rem, 36rem); gap: 1.25rem; align-items: center; }
.conditional-contact-field[hidden] { display: none; }
.vendor-form-actions { display: flex; gap: .75rem; margin-top: .75rem; padding-top: 1.25rem; border-top: 1px solid rgba(9,52,57,.12); }
.vendor-form-actions .button { margin-top: 0; font-size: 1.1em; font-weight: 650; line-height: 1.5; }
.vendor-infrastructure-danger { display: flex; align-items: center; justify-content: space-between; gap: 1.25rem; margin-top: 1.25rem; padding: 1rem 1.15rem; border: 1px solid var(--color-danger-border, #c74650); border-radius: .65rem; background: var(--color-danger-surface, #f9e3e5); color: var(--color-danger-strong, #7e1821); }
.vendor-infrastructure-danger strong { display: block; font-size: 1.05em; }
.vendor-infrastructure-danger p { margin: .25rem 0 0; color: inherit; }
.vendor-infrastructure-danger code { padding: .08rem .3rem; border-radius: .25rem; background: rgba(126,24,33,.08); color: inherit; font-family: ui-monospace, SFMono-Regular, Consolas, monospace; }
.vendor-infrastructure-danger .button { flex: 0 0 auto; margin-top: 0; }
.vendor-detail-card { overflow: hidden; border: 1px solid rgba(9,52,57,.1); border-radius: .9rem; background: var(--admin-shell-surface); color: var(--admin-shell-text); box-shadow: 0 1.5rem 3.5rem -2.2rem rgba(0,16,21,.46); }
.vendor-detail-body { padding: 1.5rem 1.35rem; }
.vendor-detail-title { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding-bottom: 1.25rem; }
.vendor-detail-title h2 { margin: 0; font-size: 1.15rem; font-weight: 650; line-height: 1.25; }
.vendor-detail-title div > span { display: block; margin-top: .2rem; color: var(--admin-shell-muted); font-size: .82rem; }
.vendor-detail-list { margin: 0; border-top: 1px dashed var(--color-border); }
.vendor-detail-list > div { display: grid; grid-template-columns: minmax(9rem, 12rem) minmax(0, 1fr); gap: 1.25rem; padding: 1rem 0; border-bottom: 1px dashed var(--color-border); }
.vendor-detail-list dt { font-weight: 650; }
.vendor-detail-list dd { margin: 0; color: var(--admin-shell-muted); overflow-wrap: anywhere; }
.vendor-detail-body > p { margin: 1.25rem 0 0; color: var(--admin-shell-muted); }
.vendor-detail-actions { display: flex; align-items: center; gap: .75rem; margin-top: 1.25rem; }
.vendor-detail-actions form { margin: 0; }
.vendor-detail-actions .button { margin-top: 0; }
.credential-recipient-form { display: grid; gap: .75rem; min-width: min(30rem, 100%); }
.credential-recipient-list { display: grid; gap: .45rem; margin: 0; padding: .75rem; border: 1px solid var(--color-border); border-radius: .6rem; }
.credential-recipient-list legend { padding: 0 .3rem; color: var(--admin-shell-muted); font-size: .82rem; font-weight: 700; }
.credential-recipient-option { display: flex; align-items: center; gap: .55rem; color: var(--admin-shell-text); font-size: .88rem; font-weight: 600; }
.credential-recipient-option input { width: 1rem; min-height: 1rem; margin: 0; }
.vendor-members-card { overflow: hidden; margin-top: 1.25rem; border: 1px solid rgba(9,52,57,.1); border-radius: .9rem; background: var(--admin-shell-surface); }
.vendor-members-card .vendor-form-heading h2 { margin: 0; font-size: 1.18rem; font-weight: 600; }
.vendor-members-list { display: grid; }
.vendor-member { display: grid; grid-template-columns: minmax(13rem, 1fr) auto; gap: 1rem 1.25rem; padding: 1.15rem 1.35rem; border-bottom: 1px solid rgba(9,52,57,.12); }
.vendor-member-identity { min-width: 0; }
.vendor-member-identity > strong,
.vendor-member-identity > span { display: block; overflow-wrap: anywhere; }
.vendor-member-identity > span { margin-top: .2rem; color: var(--admin-shell-muted); font-size: .88rem; }
.member-badges { display: flex; flex-wrap: wrap; gap: .4rem; margin-top: .65rem; }
.member-badge { display: inline-flex; align-items: center; min-height: 1.5rem; padding: .15rem .5rem; border: 1px solid color-mix(in srgb, var(--color-action) 45%, transparent); border-radius: 999px; color: var(--admin-shell-muted); font-size: .74rem; font-weight: 650; }
.vendor-member-actions { grid-column: 1 / -1; display: flex; align-items: center; flex-wrap: wrap; gap: .6rem; }
.vendor-member-actions form { margin: 0; }
.vendor-member-actions .button { margin-top: 0; }
.member-permission-form,
.member-permission-options { display: flex; align-items: center; flex-wrap: wrap; gap: .7rem; }
.member-permission-form label,
.member-permission-options label { display: inline-flex; align-items: center; gap: .35rem; margin: 0; color: var(--admin-shell-muted); font-size: .88rem; font-weight: 600; }
.member-permission-form input,
.member-permission-options input { width: 1rem; min-height: 1rem; margin: 0; }
.vendor-member-add { padding: 1rem 1.35rem 1.35rem; }
.vendor-member-add > summary { width: fit-content; cursor: pointer; color: var(--color-action); font-weight: 700; }
.vendor-member-add .vendor-onboarding-form { padding: 1.25rem 0 0; }
.vendor-members-empty { margin: 0; padding: 1.25rem 1.35rem; color: var(--admin-shell-muted); }
/* Remote connections are native-shell content, not a second landing page. */
.vendor-connections-card { --connections-rule: rgba(9,52,57,.16); --connections-gutter: 1.35rem; }
.vendor-connections-card > .vendor-table-heading,
.vendor-connections-card > .vendor-form-heading { padding-inline: var(--connections-gutter); }
.vendor-connections-body { display: grid; gap: 1.25rem; padding: var(--connections-gutter, 1.35rem); }
.vendor-connections-card a:not(.button) { color: var(--admin-shell-text); }
.vendor-connections-card .button.secondary { color: var(--admin-shell-text); border-color: var(--connections-rule); }
.vendor-connections-card .button.secondary:hover { background: var(--sdi-paper-control, rgba(9,52,57,.06)); }
.vendor-connections-card .vendor-section { padding: 1.15rem; border: 1px solid var(--connections-rule); border-radius: .7rem; }
.vendor-connections-card .vendor-section > header { margin-bottom: 1rem; }
.vendor-connections-card .vendor-section h2,
.vendor-connections-card .vendor-empty h2 { margin: 0; font-size: 1.1rem; }
.vendor-connections-card .vendor-section p,
.vendor-connections-card .vendor-empty p { margin: .3rem 0 0; color: var(--admin-shell-muted); }
.vendor-connections-card .vendor-action-panel { border: 1px solid var(--connections-rule); border-radius: .7rem; }
.vendor-connections-card .vendor-action-panel > summary { padding: 1rem 1.15rem; color: var(--admin-shell-text); cursor: pointer; font-weight: 750; }
.vendor-connections-card .vendor-action-panel > summary:hover,
.vendor-connections-card .vendor-action-panel > summary:focus-visible { background: var(--sdi-paper-control, rgba(9,52,57,.06)); }
.vendor-connections-card .vendor-action-panel[open] > summary { border-bottom: 1px solid var(--connections-rule); }
.vendor-connections-card .vendor-onboarding-form { padding: 1.25rem; }
.sdi-portal-connection-form .vendor-onboarding-form { width: 100%; max-width: none; margin: 0; padding: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; }
.sdi-portal-connections-table .vendor-table-heading { justify-content: space-between; gap: 1rem; }
.sdi-portal-connections-table .vendor-table th:last-child,
.sdi-portal-connections-table .vendor-table td:last-child { width: 1%; text-align: right; white-space: nowrap; }
.vendor-table-muted { color: var(--admin-shell-muted); }
.vendor-connections-card .form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.vendor-connections-card .form-grid > label { display: grid; align-content: start; gap: .4rem; margin: 0; color: var(--admin-shell-text); font-weight: 650; }
.vendor-connections-card .form-grid > .form-span { grid-column: 1 / -1; }
.vendor-connections-card .form-grid :is(input:not([type="checkbox"]), select, textarea) { width: 100%; min-width: 0; padding: .7rem .8rem; border: 1px solid var(--connections-rule); border-radius: .5rem; background: var(--admin-shell-surface); color: var(--admin-shell-text); }
.vendor-connections-card .form-grid > label.check { display: flex; align-items: center; gap: .5rem; }
.vendor-connections-card .form-grid input[type="checkbox"] { flex: 0 0 1.1rem; width: 1.1rem; height: 1.1rem; min-height: 1.1rem; margin: 0; padding: 0; accent-color: var(--color-action); }
.vendor-connections-card .form-grid textarea { resize: vertical; }
.vendor-connections-card .form-help { margin: 1rem 0 0; color: var(--admin-shell-muted); }
.vendor-connections-card .vendor-card-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 22rem), 1fr)); gap: 1rem; }
.vendor-connections-card .vendor-card { min-width: 0; background: var(--admin-shell-surface); color: var(--admin-shell-text); box-shadow: none; border-color: var(--connections-rule); }
.vendor-connections-card .vendor-card > header { display: flex; align-items: start; justify-content: space-between; gap: 1rem; grid-column: 1 / -1; }
.vendor-connections-card .vendor-card > header h2 { margin: 0; overflow-wrap: anywhere; }
.vendor-connections-card .vendor-card > header p { margin: 0; color: var(--admin-shell-muted); }
.vendor-connections-card .vendor-summary-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .8rem; grid-column: 1 / -1; margin: 0; }
.vendor-connections-card .vendor-summary-grid div { min-width: 0; }
.vendor-connections-card .vendor-summary-grid dt { color: var(--admin-shell-muted); font-size: .8rem; }
.vendor-connections-card .vendor-summary-grid dd { margin: .2rem 0 0; overflow-wrap: anywhere; font-weight: 650; }
.vendor-connections-card .vendor-card > form,
.vendor-connections-card .vendor-card > details { grid-column: 1 / -1; }
.vendor-connections-card .vendor-empty { padding: 1.5rem; border: 1px dashed var(--connections-rule); border-radius: .7rem; }
.vendor-connections-card .vendor-section fieldset { margin: 1rem 0 0; padding: 1rem; border: 1px solid var(--connections-rule); border-radius: .6rem; }
.vendor-connections-card .vendor-section label.check { display: flex; align-items: center; gap: .45rem; margin-top: .5rem; }
.vendor-connections-card .vendor-section .vendor-card { grid-template-columns: minmax(0, 1fr); gap: .8rem; }
.vendor-connections-card .vendor-section .vendor-card > fieldset { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 15rem), 1fr)); gap: .55rem 1rem; margin-top: 0; }
.vendor-connections-card .vendor-section .vendor-card > fieldset .check { margin: 0; }
.vendor-onboarding-entry .vendor-table-heading { justify-content: space-between; gap: 1rem; }
.vendor-onboarding-entry .vendor-table-heading > a { font-size: .88rem; font-weight: 600; }
.vendor-onboarding-entry .vendor-onboarding-form { max-width: none; }
.vendor-onboarding-entry .vendor-form-actions { justify-content: flex-end; }
.vendor-onboarding-entry .button { min-height: 2.75rem; margin: 0; padding: .65rem 1rem; border-radius: .5rem; box-shadow: none; font-size: .9rem; }
.vendor-onboarding-entry .button:hover { box-shadow: none; transform: none; }
.vendor-key-setups { overflow: hidden; }
.vendor-key-setups .vendor-table-heading { justify-content: space-between; gap: 1rem; }
.vendor-key-setups .vendor-table-heading > a { font-size: .88rem; font-weight: 600; }
.vendor-key-setups .vendor-table-scroll { position: relative; padding-inline: var(--connections-gutter); }
.vendor-key-setups .vendor-table { min-width: 40rem; }
.vendor-key-setups .vendor-table :is(th, td):nth-child(2) { display: table-cell; width: auto; }
.vendor-key-setups .vendor-table th:nth-child(3) { width: auto; }
.vendor-key-setups .vendor-table th:first-child { width: 40%; }
.vendor-key-setups .vendor-table-footer { padding-inline: var(--connections-gutter); }
.vendor-key-setups .vendor-table-footer > nav { display: flex; gap: 1rem; margin-left: auto; }
.vendor-onboarding-stages { grid-template-columns: minmax(0, 1fr) !important; }
.vendor-connections-card .vendor-onboarding-stages .vendor-card { grid-template-columns: minmax(0, 1fr); }
.vendor-onboarding-stages form > label { display: grid; gap: .4rem; margin: .8rem 0; }
.vendor-onboarding-stages form > label select { width: max-content; max-width: 100%; padding: .65rem; border: 1px solid var(--connections-rule); border-radius: .5rem; background: var(--admin-shell-surface); color: var(--admin-shell-text); }
.vendor-key-setup .vendor-detail-list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border-bottom: 1px solid var(--connections-rule); }
.vendor-key-setup .vendor-detail-list > div { display: grid; grid-template-columns: minmax(0, 1fr); align-content: start; gap: .5rem; border: 0; }
.vendor-key-setup .vendor-onboarding-stages .vendor-card { padding: 1.25rem 0 0; border: 0; border-top: 1px solid var(--connections-rule); border-radius: 0; background: transparent; }
.vendor-key-setup .vendor-onboarding-stages .vendor-card > header { margin: 0; }
.vendor-key-setup .vendor-onboarding-form { width: 100%; padding: 0; margin: 0; }
.vendor-key-setup .vendor-onboarding-form .button { justify-self: end; width: auto; margin: .5rem 0 0; padding: .65rem 1rem; border-radius: .5rem; box-shadow: none; font-size: .9rem; }
.admin-main {
  grid-column: 2;
  grid-row: 2;
  min-width: 0;
  padding: 1.25rem 2rem 2rem;
  color: var(--admin-shell-text);
}
.admin-main > .hero,
.admin-main > .operator-form,
.admin-main .vendor-card,
.admin-main .empty-state { background: var(--admin-shell-surface); color: var(--admin-shell-text); }
.admin-main .lede,
.admin-main .vendor-card > p,
.admin-main .compact-form p { color: var(--admin-shell-muted); }
.admin-mobile-navigation { display: none; }

/* The native Client and Portal sidebars share the canonical authenticated
 * workspace geometry. Keep gateway-owned pages aligned to the same mark. */
.client-workspace .admin-district-mark img,
.portal-workspace .admin-district-mark img {
  width: var(--sdi-workspace-district-mark-width);
  height: var(--sdi-workspace-district-mark-height);
}
.client-workspace {
  --sdi-paper: var(--admin-shell-surface);
  --sdi-paper-ink: var(--admin-shell-text);
  --sdi-paper-muted: var(--admin-shell-muted);
  --sdi-paper-rule: rgba(9,52,57,.18);
  --sdi-paper-control: #f2f8f8;
}
.client-workspace .sdi-credential-key {
  border-color: var(--sdi-paper-rule);
  background: var(--sdi-paper-control);
  color: var(--sdi-paper-ink);
}
[data-theme="light"] .client-workspace .sdi-credential-key {
  border-color: rgba(9,52,57,.18) !important;
  background: #f2f8f8 !important;
  color: #173b40 !important;
}
[data-theme="dark"] .client-workspace .sdi-credential-key {
  border-color: rgba(255,255,255,.18) !important;
  background: #24383c !important;
  color: #f3fbfc !important;
}
.client-workspace .sdi-role-pill { margin-left: .15rem; }
.sdi-client-credential-card { width: 100%; }
.sdi-client-credential-card .sdi-credential-content { padding: clamp(1.25rem, 3vw, 2.5rem); }
.sdi-client-credential-card .sdi-auth-helper { margin: 0 0 .45rem; color: var(--admin-shell-muted); text-align: left; letter-spacing: .08em; text-transform: uppercase; }
.sdi-client-credential-card .sdi-auth-recovery-title { margin: 0; color: var(--admin-shell-text); font-size: clamp(1.45rem, 2.4vw, 2rem); }
.sdi-client-credential-card .sdi-auth-copy { color: var(--admin-shell-muted); }
.sdi-client-credential-card .sdi-credential-facts { margin: 1rem 0 0; gap: 0; }
.sdi-client-credential-card .sdi-credential-facts > div { grid-template-columns: minmax(10rem, 15rem) minmax(0, 1fr); align-items: center; padding: .72rem 0; border-bottom: 1px solid var(--sdi-paper-rule); }
.sdi-client-credential-card .sdi-credential-facts dt { color: var(--admin-shell-muted); }
.sdi-client-credential-card .sdi-credential-facts dd { display: flex; align-items: center; gap: .6rem; min-width: 0; color: var(--admin-shell-text); }
.sdi-public-key-admin { margin-top: 1rem; border-top: 1px solid var(--sdi-paper-rule); padding-top: .8rem; }
.sdi-public-key-admin summary { cursor: pointer; font-weight: 700; }
.sdi-public-key-admin .sdi-public-key-form { display: grid; gap: .55rem; width: min(100%, 34rem); }
.sdi-public-key-admin .sdi-public-key-form textarea { width: 100%; min-height: 5rem; resize: vertical; font: .82rem/1.45 ui-monospace, "Cascadia Mono", Consolas, monospace; }
.sdi-public-key-admin .sdi-public-key-form input[type="file"] { max-width: 100%; font: inherit; }
.sdi-client-credential-card details { margin-top: 1.5rem; padding-top: 1rem; border-top: 1px solid var(--sdi-paper-rule); }
.sdi-client-credential-card summary { cursor: pointer; font-weight: 700; }
.sdi-client-credential-card label.sdi-auth-copy { display: block; }
.sdi-client-credential-card input[type="checkbox"] { accent-color: #087e88; }
.sdi-client-public-keys .vendor-table-heading h1 { font-size: 1.18rem; font-weight: 600; letter-spacing: 0; }
.sdi-public-key-record { display: grid; gap: 1.25rem; padding-top: 1.25rem; border-top: 1px solid var(--connections-rule); }
.sdi-public-key-record h2 { margin: 0; font-size: 1.1rem; }
.sdi-public-key-record p { margin: 0; }
.sdi-public-key-record .button { margin: 0; padding: .65rem 1rem; border-radius: .5rem; box-shadow: none; font-size: .9rem; }
.sdi-client-exchange-card { width: 100%; overflow: hidden; background: var(--admin-shell-surface); color: var(--admin-shell-text); }
.sdi-client-exchange-card .vendor-table-heading { min-height: 4rem; padding-inline: 1.875rem; border-color: var(--sdi-paper-rule); }
.sdi-client-exchange-card .vendor-table-heading h1 { font-size: 1.1rem; font-weight: 650; }
.sdi-client-exchange-card .vendor-table-scroll { padding-inline: 1.875rem; }
.sdi-exchange-table th:first-child { width: auto; }
.sdi-exchange-table th:last-child,
.sdi-exchange-table td:last-child { width: 1%; padding-left: 1.25rem; text-align: right; white-space: nowrap; }
.sdi-exchange-table th,
.sdi-exchange-table td { border-color: var(--sdi-paper-rule); }
.sdi-exchange-choice { display: block; color: var(--admin-shell-text); text-decoration: none; }
.sdi-exchange-choice strong,
.sdi-exchange-choice span { display: block; }
.sdi-exchange-choice strong { font-weight: 650; }
.sdi-exchange-choice span { margin-top: .12rem; color: var(--admin-shell-muted); font-size: .75rem; }
.sdi-exchange-choice:hover,
.sdi-exchange-choice:focus-visible,
.sdi-exchange-open:hover,
.sdi-exchange-open:focus-visible { color: #05626a; text-decoration: none; }
.sdi-exchange-open { display: inline-flex; align-items: center; gap: .45rem; color: #087e88; font-weight: 700; text-decoration: none; }
.sdi-exchange-open span { font-size: 1.35rem; line-height: 1; }
.sdi-client-exchange-card .vendor-table-footer { min-height: 4rem; padding: .75rem 1.875rem; border-color: var(--sdi-paper-rule); }

[data-theme="dark"] .admin-workspace {
  --admin-shell-surface: rgba(25,40,44,.97);
  --admin-shell-text: #f6f7f7;
  --admin-shell-muted: #c2c7c8;
}
[data-theme="dark"] .client-workspace {
  --sdi-paper-rule: rgba(255,255,255,.15);
  --sdi-paper-control: #24383c;
}
[data-theme="dark"] .sdi-exchange-open { color: #8cd6db; }
[data-theme="dark"] :is(.sdi-exchange-choice, .sdi-exchange-open):is(:hover, :focus-visible) { color: #56c7cf; }
[data-theme="dark"] .vendor-connections-card { --connections-rule: rgba(255,255,255,.18); --sdi-paper-control: #24383c; }
[data-theme="dark"] .vendor-connections-card .form-grid :is(input:not([type="checkbox"]), select, textarea) { background: #182b2f; }
[data-theme="dark"] .admin-main .operator-form input {
  border-color: #4b5c5f;
  background: #121f22;
  color: #f6f7f7;
}
[data-theme="dark"] .vendor-form-heading,
[data-theme="dark"] .vendor-form-actions,
[data-theme="dark"] .vendor-detail-card,
[data-theme="dark"] .vendor-members-card,
[data-theme="dark"] .vendor-member { border-color: rgba(255,255,255,.12); }
[data-theme="dark"] .status-revoked { border-color: rgba(255,166,174,.45); background: rgba(165,38,47,.22); color: #ffb7bd; }
[data-theme="dark"] .vendor-actions-menu .vendor-action-danger { color: #ffb7bd; }
[data-theme="dark"] .vendor-actions-menu .vendor-action-danger:hover { background: rgba(165,38,47,.24); color: #ffd7da; }
[data-theme="dark"] .vendor-infrastructure-danger { border-color: var(--color-danger-border, #d96364); background: rgba(165,38,47,.2); color: #ffd7da; }
[data-theme="dark"] .admin-main .button.secondary { color: #8cd6db; }
[data-theme="dark"] .admin-main .eyebrow { color: #8cd6db; }

@media (max-width: 42rem) {
  .header-inner, .page-shell, .footer-inner { width: min(100% - 2rem, 82.5rem); }
  .product-name { font-size: .86rem; letter-spacing: .1em; }
  .page-shell { padding-top: 2rem; }
  .policy-card { padding-inline: 1.25rem; }
  .policy-contact { padding: 1.5rem 1.25rem; }
  .policy-contact .button { width: 100%; }
  .vendor-detail-title { align-items: flex-start; }
  .vendor-detail-list > div { grid-template-columns: 1fr; gap: .25rem; }
  .vendor-detail-actions { align-items: stretch; flex-direction: column; }
  .vendor-detail-actions .button { width: 100%; }
  .vendor-member { grid-template-columns: 1fr; }
  .vendor-member > .vendor-status { width: fit-content; }
  .vendor-member-actions { align-items: stretch; flex-direction: column; }
  .vendor-member-actions form,
  .vendor-member-actions .button { width: 100%; }
  .member-permission-form { align-items: flex-start; }
  .vendor-infrastructure-danger { align-items: stretch; flex-direction: column; }
  .vendor-card { grid-template-columns: 1fr; }
  .vendor-card > p, .vendor-card .card-link { grid-column: 1; }
  .vendor-table-toolbar { align-items: stretch; flex-direction: column; }
  .vendor-search { width: 100%; }
  .vendor-add { justify-content: center; margin-left: 0; }
  .vendor-table th:nth-child(2),
  .vendor-table td:nth-child(2) { display: none; }
  .vendor-table-footer { align-items: flex-start; flex-wrap: wrap; }
  .vendor-form-fields,
  .conditional-contact-field { grid-template-columns: 1fr; gap: .5rem; }
  .contact-email-toggle { grid-column: 1; margin-top: .35rem; }
  .conditional-contact-field { grid-column: 1; }
  .vendor-form-actions { flex-wrap: wrap; }
  .vendor-connections-card { --connections-gutter: 1rem; }
  .vendor-connections-card .form-grid,
  .vendor-connections-card .vendor-summary-grid { grid-template-columns: 1fr; }
  .sdi-client-credential-card .sdi-credential-facts > div { grid-template-columns: minmax(0, 1fr); gap: .35rem; }
  .footer-links { flex-basis: 100%; margin-left: 0; }
}

@media (max-width: 61.99rem) {
  .admin-layout { display: block; min-height: 100vh; }
  .admin-sidebar { display: none; }
  .admin-header { min-height: var(--admin-shell-header); padding-inline: 1rem; }
  .admin-mobile-navigation { display: block; margin: 1rem 1rem 0; border: 1px solid rgba(255,255,255,.22); border-radius: .75rem; background: rgba(9,52,57,.94); color: #fff; }
  .admin-mobile-navigation summary { min-height: 3rem; display: flex; align-items: center; padding: .75rem 1rem; cursor: pointer; font-weight: 750; }
  .admin-mobile-navigation nav { display: grid; gap: .25rem; padding: 0 .5rem .5rem; }
  .sdi-client-exchange-card .vendor-table-heading,
  .sdi-client-exchange-card .vendor-table-scroll,
  .sdi-client-exchange-card .vendor-table-footer { padding-inline: 1rem; }
}

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

@media (forced-colors: active) {
  .site-header, .hero, .policy-card, .policy-contact, .card, .vendor-card, .vendor-table-card, .operator-form { border: 2px solid CanvasText; }
}

@media print {
  .gateway-canvas { background: #fff; color: #24383c; }
  .gateway-background, .skip-link, .header-sign-in { display: none; }
  .site-header { background: #fff; color: #24383c; border-bottom: 1px solid #d4d4d5; }
  .brand-link, .product-name { color: #24383c; }
  .brand-link img { filter: brightness(0); }
  .page-shell { width: 100%; padding-block: 1rem; }
  .policy-card, .policy-contact, .hero, .card { box-shadow: none; }
  .site-footer { color: #24383c; }
  .footer-inner { border-top-color: #d4d4d5; }
  .footer-mark { filter: none; }
  .footer-links a { color: #24383c; }
}
