:root {
  --ink: #0b1838;
  --ink-soft: #52607b;
  --navy: #071633;
  --gold: #bd8e3d;
  --gold-pale: #f4ead7;
  --line: #e4e8f0;
  --surface: #ffffff;
  --canvas: #f7f8fb;
  --success: #1c9b69;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color: var(--ink);
  background: var(--canvas);
  font-synthesis: none;
}

* {
  box-sizing: border-box;
}

body {
  min-height: 100vh;
  margin: 0;
  background:
    radial-gradient(circle at 78% 8%, rgb(202 213 246 / 42%), transparent 31rem),
    linear-gradient(180deg, #fff 0, var(--canvas) 72%);
}

.site-header,
main {
  width: min(1180px, calc(100% - 40px));
  margin-inline: auto;
}

.site-header {
  min-height: 92px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: 1px solid var(--line);
}

.brand {
  display: flex;
  align-items: center;
  gap: 18px;
  color: var(--ink);
  text-decoration: none;
  font-size: 13px;
  font-weight: 800;
  letter-spacing: .15em;
}

.brand img {
  display: block;
  width: 190px;
  height: 52px;
  object-fit: contain;
  object-position: left center;
}

.environment-badge {
  padding: 7px 12px;
  border: 1px solid #dfc79d;
  border-radius: 999px;
  background: var(--gold-pale);
  color: #71501d;
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
}

.header-actions {
  display: flex;
  align-items: center;
  gap: 14px;
}

.header-login {
  color: var(--ink);
  font-size: 13px;
  font-weight: 750;
  text-decoration: none;
}

.header-login:hover {
  color: var(--gold);
}

.portal-nav {
  display: flex;
  align-items: center;
  gap: 18px;
}

.portal-nav a,
.header-logout button {
  border: 0;
  background: transparent;
  color: var(--ink-soft);
  font: inherit;
  font-size: 12px;
  font-weight: 750;
  text-decoration: none;
  cursor: pointer;
}

.portal-nav a:hover,
.header-logout button:hover {
  color: var(--gold);
}

.header-logout {
  margin: 0;
}

main {
  padding-block: 72px 96px;
}

.hero {
  max-width: 820px;
}

.eyebrow {
  margin: 0 0 20px;
  color: var(--gold);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .13em;
}

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

h1 {
  max-width: 780px;
  margin-bottom: 24px;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(46px, 7vw, 82px);
  font-weight: 500;
  line-height: .98;
  letter-spacing: -.045em;
}

.lede {
  max-width: 720px;
  color: var(--ink-soft);
  font-size: 18px;
  line-height: 1.75;
}

.architecture-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
  margin-top: 56px;
}

.architecture-grid article,
.status-panel {
  border: 1px solid var(--line);
  border-radius: 18px;
  background: rgb(255 255 255 / 86%);
  box-shadow: 0 18px 60px rgb(8 22 54 / 7%);
}

.architecture-grid article {
  min-height: 250px;
  padding: 28px;
}

.step {
  display: inline-grid;
  width: 42px;
  height: 42px;
  place-items: center;
  margin-bottom: 40px;
  border-radius: 12px;
  background: var(--gold-pale);
  color: #8a6427;
  font-size: 12px;
  font-weight: 800;
}

h2 {
  font-family: Georgia, "Times New Roman", serif;
  font-size: 24px;
  font-weight: 500;
}

.architecture-grid p {
  margin-bottom: 0;
  color: var(--ink-soft);
  font-size: 14px;
  line-height: 1.65;
}

.status-panel {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  margin-top: 20px;
  padding: 24px 28px;
}

.status-panel > div {
  display: flex;
  align-items: center;
  gap: 12px;
}

.status-panel strong {
  margin-right: 8px;
}

.status-panel span:last-child {
  color: var(--ink-soft);
  font-size: 14px;
}

.status-dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: var(--success);
  box-shadow: 0 0 0 6px rgb(28 155 105 / 12%);
}

.status-panel nav {
  display: flex;
  gap: 10px;
}

.status-panel a {
  padding: 10px 15px;
  border: 1px solid var(--line);
  border-radius: 10px;
  color: var(--ink);
  text-decoration: none;
  font-size: 13px;
  font-weight: 700;
}

.status-panel a:hover {
  border-color: var(--gold);
}

.auth-shell {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(360px, .85fr);
  gap: clamp(48px, 8vw, 112px);
  align-items: center;
  min-height: 620px;
}

.auth-story h1,
.mfa-panel h1 {
  font-size: clamp(48px, 6vw, 76px);
}

.auth-capabilities {
  display: grid;
  gap: 14px;
  margin: 38px 0 0;
  padding: 0;
  list-style: none;
}

.auth-capabilities li {
  display: flex;
  align-items: center;
  gap: 14px;
  color: var(--ink-soft);
  font-size: 14px;
}

.auth-capabilities span {
  display: grid;
  width: 34px;
  height: 34px;
  place-items: center;
  border: 1px solid #dfc79d;
  border-radius: 10px;
  color: #8a6427;
  font-size: 10px;
  font-weight: 800;
}

.auth-card {
  position: relative;
  padding: 42px;
  border: 1px solid rgb(219 224 235 / 90%);
  border-radius: 24px;
  background: rgb(255 255 255 / 92%);
  box-shadow: 0 30px 90px rgb(8 22 54 / 13%);
}

.language-switcher {
  position: absolute;
  top: 24px;
  right: 24px;
  display: flex;
  gap: 4px;
  padding: 4px;
  border: 1px solid var(--line);
  border-radius: 10px;
}

.language-switcher a {
  padding: 5px 7px;
  border-radius: 6px;
  color: var(--ink-soft);
  font-size: 10px;
  font-weight: 800;
  text-decoration: none;
}

.language-switcher a[aria-current="page"] {
  background: var(--navy);
  color: #fff;
}

.auth-card-heading {
  display: flex;
  align-items: center;
  gap: 14px;
  margin: 18px 0 30px;
}

.auth-card-heading p {
  margin-bottom: 4px;
  color: var(--gold);
  font-size: 10px;
  font-weight: 850;
  letter-spacing: .14em;
}

.auth-card-heading h2 {
  margin: 0;
  font-size: 28px;
}

.auth-lock {
  display: grid;
  width: 48px;
  height: 48px;
  place-items: center;
  border-radius: 14px;
  background: var(--gold-pale);
  color: #8a6427;
  font-weight: 900;
}

.form-alert {
  margin-bottom: 22px;
  padding: 13px 15px;
  border: 1px solid #f1c9c7;
  border-radius: 10px;
  background: #fff3f2;
  color: #8f2924;
  font-size: 13px;
  line-height: 1.5;
}

.auth-form {
  display: grid;
  gap: 10px;
}

.auth-form label {
  margin-top: 8px;
  font-size: 12px;
  font-weight: 800;
}

.auth-form input {
  width: 100%;
  height: 50px;
  padding: 0 15px;
  border: 1px solid #dbe0eb;
  border-radius: 11px;
  outline: none;
  background: #fff;
  color: var(--ink);
  font: inherit;
}

.auth-form select {
  width: 100%;
  height: 50px;
  padding: 0 42px 0 15px;
  border: 1px solid #dbe0eb;
  border-radius: 11px;
  outline: none;
  background: #fff;
  color: var(--ink);
  font: inherit;
}

.auth-form select:focus {
  border-color: var(--gold);
  box-shadow: 0 0 0 4px rgb(189 142 61 / 11%);
}

.auth-form textarea {
  width: 100%;
  min-height: 100px;
  padding: 14px 15px;
  resize: vertical;
  border: 1px solid #dbe0eb;
  border-radius: 11px;
  outline: none;
  background: #fff;
  color: var(--ink);
  font: inherit;
  line-height: 1.55;
}

.auth-form textarea:focus {
  border-color: var(--gold);
  box-shadow: 0 0 0 4px rgb(189 142 61 / 11%);
}

.auth-form input:focus {
  border-color: var(--gold);
  box-shadow: 0 0 0 4px rgb(189 142 61 / 11%);
}

.auth-form button,
.secondary-button {
  min-height: 50px;
  margin-top: 14px;
  padding: 0 18px;
  border: 0;
  border-radius: 11px;
  background: var(--navy);
  color: #fff;
  font: inherit;
  font-size: 13px;
  font-weight: 800;
  cursor: pointer;
}

.inline-button {
  display: inline-flex;
  align-items: center;
  text-decoration: none;
}

.auth-form button {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.security-note {
  display: flex;
  gap: 9px;
  margin: 22px 0 0;
  color: var(--ink-soft);
  font-size: 11px;
  line-height: 1.55;
}

.security-note span {
  color: var(--gold);
}

.mfa-panel {
  max-width: 780px;
  padding: 54px;
  border: 1px solid var(--line);
  border-radius: 24px;
  background: #fff;
  box-shadow: 0 30px 90px rgb(8 22 54 / 10%);
}

.mfa-auth-card,
.security-overview-card {
  border: 1px solid var(--line);
  border-radius: 24px;
  background: rgb(255 255 255 / 94%);
  box-shadow: 0 30px 90px rgb(8 22 54 / 11%);
}

.mfa-auth-card {
  width: min(100%, 980px);
  margin-inline: auto;
  padding: clamp(28px, 5vw, 58px);
}

.mfa-auth-card--compact {
  width: min(100%, 570px);
}

.mfa-auth-heading {
  max-width: 720px;
  margin-bottom: 34px;
}

.mfa-auth-heading h1,
.security-overview h1 {
  margin-bottom: 18px;
  font-size: clamp(40px, 5vw, 64px);
}

.mfa-auth-heading .lede {
  margin-bottom: 0;
  font-size: 16px;
}

.mfa-setup-grid {
  display: grid;
  grid-template-columns: minmax(280px, .78fr) minmax(320px, 1.22fr);
  gap: clamp(30px, 6vw, 72px);
  align-items: center;
}

.mfa-qr-panel {
  text-align: center;
}

.mfa-qr {
  width: min(100%, 330px);
  margin-inline: auto;
  padding: 18px;
  border: 1px solid #d9dfeb;
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 18px 50px rgb(8 22 54 / 10%);
}

.mfa-qr img {
  display: block;
  width: 100%;
  height: auto;
  image-rendering: pixelated;
}

.mfa-status {
  display: inline-flex;
  margin-top: 16px;
  padding: 7px 11px;
  border-radius: 999px;
  background: #e8f6ef;
  color: #14754f;
  font-size: 11px;
  font-weight: 800;
}

.mfa-qr-panel > p {
  max-width: 330px;
  margin: 13px auto 0;
  color: var(--ink-soft);
  font-size: 12px;
  line-height: 1.55;
}

.mfa-steps {
  display: grid;
  gap: 18px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.mfa-steps li {
  display: grid;
  grid-template-columns: 42px 1fr;
  gap: 14px;
  align-items: start;
}

.mfa-steps li > span {
  display: grid;
  width: 42px;
  height: 42px;
  place-items: center;
  border-radius: 12px;
  background: var(--gold-pale);
  color: #835f27;
  font-size: 12px;
  font-weight: 850;
}

.mfa-steps p {
  margin: 5px 0 0;
  color: var(--ink-soft);
  font-size: 14px;
  line-height: 1.6;
}

.manual-secret {
  margin-top: 25px;
  padding: 18px;
  border: 1px solid var(--line);
  border-radius: 13px;
  background: #fafbfc;
}

.manual-secret summary {
  color: var(--ink);
  font-size: 12px;
  font-weight: 800;
  cursor: pointer;
}

.manual-secret code {
  display: block;
  margin: 15px 0;
  overflow-wrap: anywhere;
  color: #765522;
  font-size: 15px;
  letter-spacing: .13em;
}

.copy-button {
  min-height: 38px;
  padding: 0 14px;
  border: 1px solid #d5dce9;
  border-radius: 9px;
  background: #fff;
  color: var(--ink);
  font: inherit;
  font-size: 11px;
  font-weight: 800;
  cursor: pointer;
}

.mfa-code-form {
  width: min(100%, 520px);
  margin: 36px auto 0;
}

.mfa-code-form input {
  text-align: center;
  font-size: 21px;
  font-weight: 750;
  letter-spacing: .16em;
}

.mfa-shield {
  display: grid;
  width: 62px;
  height: 62px;
  place-items: center;
  margin-bottom: 25px;
  border: 1px solid #dfc79d;
  border-radius: 18px;
  background: var(--gold-pale);
  color: #8a6427;
  font-size: 24px;
  font-weight: 900;
}

.recovery-warning {
  display: grid;
  grid-template-columns: 42px 1fr;
  gap: 14px;
  align-items: center;
  margin-bottom: 28px;
  padding: 18px;
  border: 1px solid #ead4a8;
  border-radius: 13px;
  background: #fffaf0;
}

.recovery-warning > span {
  display: grid;
  width: 42px;
  height: 42px;
  place-items: center;
  border-radius: 12px;
  background: #f3e2bc;
  color: #79571e;
  font-weight: 900;
}

.recovery-warning p {
  margin: 0;
  color: #6c5329;
  font-size: 13px;
  line-height: 1.55;
}

.recovery-code-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 10px;
  padding: 24px;
  border: 1px dashed #c9d0df;
  border-radius: 16px;
  background: #f9fafc;
}

.recovery-code-grid code {
  padding: 13px;
  border: 1px solid var(--line);
  border-radius: 9px;
  background: #fff;
  color: var(--ink);
  text-align: center;
  font-size: 15px;
  font-weight: 750;
  letter-spacing: .08em;
}

.recovery-actions {
  display: flex;
  gap: 9px;
  align-items: center;
  margin-top: 14px;
}

.recovery-confirm-form {
  margin-top: 26px;
}

.confirmation-check {
  display: flex;
  gap: 11px;
  align-items: flex-start;
  color: var(--ink-soft);
  font-size: 13px;
  line-height: 1.5;
}

.confirmation-check input {
  width: 18px;
  height: 18px;
  margin: 1px 0 0;
}

.security-overview {
  max-width: 900px;
  margin-inline: auto;
}

.security-overview-card {
  display: grid;
  grid-template-columns: 72px 1fr;
  gap: 24px;
  padding: 34px;
}

.security-overview-card .mfa-shield {
  margin: 0;
}

.security-overview-card p {
  color: var(--ink-soft);
}

.auth-help-link {
  display: inline-block;
  margin-top: 17px;
  color: #8a6427;
  font-size: 12px;
  font-weight: 750;
  text-decoration: none;
}

.account-flow {
  width: min(100%, 680px);
  margin-inline: auto;
}

.account-flow--wide {
  width: min(100%, 940px);
}

.account-flow-heading {
  margin-bottom: 34px;
}

.account-flow-heading--centered,
.account-flow-card--centered {
  text-align: center;
}

.account-flow h1 {
  margin-bottom: 18px;
  font-size: clamp(40px, 6vw, 64px);
}

.account-flow-card {
  padding: clamp(28px, 5vw, 46px);
  border: 1px solid rgb(219 224 235 / 90%);
  border-radius: 24px;
  background: rgb(255 255 255 / 94%);
  box-shadow: 0 30px 90px rgb(8 22 54 / 11%);
}

.account-flow-card--centered .lede {
  margin-inline: auto;
}

.account-state-icon {
  display: grid;
  width: 62px;
  height: 62px;
  place-items: center;
  margin: 0 auto 24px;
  border: 1px solid #b9dfd1;
  border-radius: 18px;
  background: #ecf8f3;
  color: var(--success);
  font-size: 24px;
  font-weight: 900;
}

.account-state-icon--muted {
  border-color: #e4d2d0;
  background: #fff3f2;
  color: #9d3b34;
}

.invitation-context {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  margin-top: 24px;
  padding: 15px 17px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #fbfcfe;
  color: var(--ink-soft);
  font-size: 13px;
  text-align: left;
}

.invitation-context strong {
  color: #8a6427;
  font-size: 10px;
  letter-spacing: .12em;
}

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

.form-grid > div {
  display: grid;
  gap: 10px;
}

.form-grid-full {
  grid-column: 1 / -1;
}

.form-alert ul {
  margin: 0;
  padding-left: 18px;
}

.primary-action {
  display: inline-flex;
  min-height: 50px;
  align-items: center;
  justify-content: center;
  gap: 12px;
  margin-top: 20px;
  padding: 0 20px;
  border: 0;
  border-radius: 11px;
  background: var(--navy);
  color: #fff;
  font: inherit;
  font-size: 13px;
  font-weight: 800;
  text-decoration: none;
  cursor: pointer;
}

.admin-page h1 {
  margin-bottom: 18px;
  font-size: clamp(42px, 6vw, 70px);
}

.admin-page-heading {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 28px;
  margin-bottom: 38px;
}

.admin-security-mark {
  flex: 0 0 auto;
  margin-bottom: 16px;
  padding: 9px 13px;
  border: 1px solid #dfc79d;
  border-radius: 999px;
  background: var(--gold-pale);
  color: #71501d;
  font-size: 10px;
  font-weight: 850;
  letter-spacing: .11em;
}

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

.admin-card {
  padding: 28px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: rgb(255 255 255 / 92%);
  box-shadow: 0 18px 60px rgb(8 22 54 / 7%);
}

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

.admin-card--table > .empty-state {
  padding-inline: 28px;
}

.admin-card-kicker {
  display: inline-block;
  margin-bottom: 9px;
  color: var(--gold);
  font-size: 9px;
  font-weight: 850;
  letter-spacing: .14em;
}

.admin-card-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  padding: 0 28px 22px;
}

.admin-card-title h2,
.admin-card h2 {
  margin-bottom: 20px;
}

.admin-card-title h2 {
  margin: 0;
}

.admin-card-title > span,
.empty-state,
.table-muted {
  color: var(--ink-soft);
  font-size: 12px;
}

.responsive-table {
  overflow-x: auto;
}

.responsive-table table {
  width: 100%;
  border-collapse: collapse;
  font-size: 12px;
}

.responsive-table th,
.responsive-table td {
  padding: 15px 16px;
  border-top: 1px solid var(--line);
  text-align: left;
  vertical-align: middle;
}

.responsive-table th {
  background: #f9fafc;
  color: var(--ink-soft);
  font-size: 9px;
  letter-spacing: .1em;
  text-transform: uppercase;
}

.responsive-table td:first-child,
.responsive-table th:first-child {
  padding-left: 28px;
}

.responsive-table td:last-child,
.responsive-table th:last-child {
  padding-right: 28px;
}

.responsive-table td small {
  display: block;
  margin-top: 5px;
  color: var(--ink-soft);
  font-size: 9px;
}

.status-pill {
  display: inline-block;
  padding: 6px 8px;
  border-radius: 999px;
  background: #eef1f6;
  color: var(--ink-soft);
  font-size: 9px;
  font-weight: 850;
  text-transform: uppercase;
}

.status-pill--pending {
  background: #fff5df;
  color: #805d1d;
}

.status-pill--accepted {
  background: #e8f7f1;
  color: #187451;
}

.table-actions {
  display: flex;
  gap: 6px;
}

.table-actions button {
  padding: 7px 9px;
  border: 1px solid #d7ddea;
  border-radius: 7px;
  background: #fff;
  color: var(--ink);
  font: inherit;
  font-size: 10px;
  font-weight: 750;
  cursor: pointer;
}

.table-actions a {
  display: inline-flex;
  align-items: center;
  padding: 7px 9px;
  border: 1px solid #d7ddea;
  border-radius: 7px;
  background: #fff;
  color: var(--ink);
  font-size: 10px;
  font-weight: 750;
  text-decoration: none;
}

.membership-table {
  margin-top: 18px;
}

.crm-page,
.crm-form-page {
  width: 100%;
}

.crm-page-heading,
.crm-detail-heading {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 30px;
  margin-bottom: 36px;
}

.crm-page-heading h1,
.crm-detail-heading h1,
.crm-form-heading h1 {
  margin-bottom: 16px;
  font-size: clamp(44px, 6vw, 72px);
}

.crm-page-heading .lede,
.crm-form-heading .lede {
  margin-bottom: 0;
}

.crm-panel,
.crm-form-card {
  border: 1px solid var(--line);
  border-radius: 20px;
  background: rgb(255 255 255 / 92%);
  box-shadow: 0 18px 60px rgb(8 22 54 / 7%);
}

.crm-filter {
  display: grid;
  grid-template-columns: minmax(260px, 1fr) 220px auto;
  gap: 10px;
  padding: 22px 24px;
  border-bottom: 1px solid var(--line);
}

.crm-filter input,
.crm-filter select {
  width: 100%;
  height: 46px;
  border: 1px solid #dbe0eb;
  border-radius: 10px;
  outline: none;
  background: #fff;
  color: var(--ink);
  font: inherit;
  font-size: 12px;
}

.crm-filter select {
  padding-inline: 13px;
}

.crm-filter .secondary-button {
  min-height: 46px;
  margin: 0;
}

.crm-search {
  position: relative;
}

.crm-search span {
  position: absolute;
  top: 50%;
  left: 15px;
  z-index: 1;
  color: var(--ink-soft);
  transform: translateY(-50%);
}

.crm-search input {
  padding: 0 14px 0 42px;
}

.crm-table-wrap {
  overflow-x: auto;
}

.crm-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 12px;
}

.crm-table th,
.crm-table td {
  padding: 17px 18px;
  border-bottom: 1px solid var(--line);
  text-align: left;
  vertical-align: middle;
}

.crm-table th:first-child,
.crm-table td:first-child {
  padding-left: 24px;
}

.crm-table th:last-child,
.crm-table td:last-child {
  padding-right: 24px;
}

.crm-table th {
  background: #fafbfc;
  color: var(--ink-soft);
  font-size: 9px;
  letter-spacing: .1em;
  text-transform: uppercase;
}

.crm-table tbody tr:hover {
  background: #fcfcfd;
}

.crm-identity {
  display: flex;
  align-items: center;
  gap: 12px;
  color: var(--ink);
  text-decoration: none;
}

.crm-identity strong,
.crm-identity small {
  display: block;
}

.crm-identity small {
  margin-top: 4px;
  color: var(--ink-soft);
  font-size: 10px;
}

.company-avatar,
.contact-avatar {
  display: grid;
  width: 38px;
  height: 38px;
  flex: 0 0 auto;
  place-items: center;
  border: 1px solid #e3cfa9;
  border-radius: 11px;
  background: var(--gold-pale);
  color: #805d1d;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 16px;
  font-weight: 700;
}

.company-avatar--large {
  width: 74px;
  height: 74px;
  border-radius: 20px;
  font-size: 30px;
}

.crm-status {
  display: inline-block;
  padding: 6px 9px;
  border-radius: 999px;
  background: #eef1f6;
  color: var(--ink-soft);
  font-size: 9px;
  font-weight: 850;
  white-space: nowrap;
  text-transform: uppercase;
}

.crm-status--active {
  background: #e8f7f1;
  color: #187451;
}

.crm-status--onboarding,
.crm-status--lead {
  background: #fff5df;
  color: #805d1d;
}

.crm-status--on_hold {
  background: #f2ecff;
  color: #63469b;
}

.crm-status--closed {
  background: #f0f1f3;
  color: #697181;
}

.row-arrow {
  color: var(--gold);
  font-size: 18px;
  text-decoration: none;
}

.crm-pagination {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding: 18px 24px;
  color: var(--ink-soft);
  font-size: 11px;
}

.crm-pagination nav {
  display: flex;
  align-items: center;
  gap: 14px;
}

.crm-pagination a {
  color: #805d1d;
  font-weight: 750;
  text-decoration: none;
}

.crm-heading-identity {
  display: flex;
  align-items: center;
  gap: 22px;
}

.crm-heading-identity .eyebrow {
  margin-bottom: 9px;
}

.crm-heading-identity h1 {
  margin-bottom: 7px;
}

.crm-heading-identity p:last-child {
  margin: 0;
  color: var(--ink-soft);
  font-size: 13px;
}

.crm-heading-actions {
  display: flex;
  align-items: center;
  gap: 10px;
  padding-bottom: 8px;
}

.crm-detail-grid {
  display: grid;
  grid-template-columns: 1.1fr .9fr;
  gap: 18px;
}

.crm-info-panel,
.crm-contact-panel,
.crm-activity-panel {
  padding: 28px;
}

.crm-deadline-panel {
  grid-column: 1 / -1;
  overflow: hidden;
  padding-top: 28px;
}

.crm-invoice-panel {
  grid-column: 1 / -1;
}

.crm-appointment-panel {
  grid-column: 1 / -1;
}

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

.client-appointment-row {
  display: grid;
  grid-template-columns: 58px 1fr auto;
  gap: 14px;
  align-items: center;
  padding: 14px;
  border: 1px solid #e7e9f0;
  border-radius: 14px;
}

.client-appointment-row .appointment-date {
  width: 52px;
  height: 52px;
}

.client-appointment-row > span:nth-child(2) {
  display: grid;
  gap: 4px;
}

.client-appointment-row small {
  color: #7b8395;
}

.crm-deadline-panel > .crm-panel-heading {
  padding-inline: 28px;
}

.client-deadline-links {
  display: flex;
  gap: 14px;
}

.client-deadline-complete {
  width: 30px;
  height: 30px;
  border: 1px solid #b9dfd1;
  border-radius: 8px;
  background: #fff;
  color: #187451;
  font-weight: 850;
  cursor: pointer;
}

.crm-panel-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  margin-bottom: 22px;
}

.crm-panel-heading h2 {
  margin: 0;
}

.crm-panel-heading > span,
.crm-panel-heading a {
  color: var(--ink-soft);
  font-size: 10px;
  font-weight: 750;
  text-decoration: none;
}

.crm-panel-heading a {
  color: #805d1d;
}

.crm-detail-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin: 0;
  border-top: 1px solid var(--line);
}

.crm-detail-list > div {
  padding: 17px 0;
  border-bottom: 1px solid var(--line);
}

.crm-detail-list > div:nth-child(odd) {
  padding-right: 18px;
}

.crm-detail-list > div:nth-child(even) {
  padding-left: 18px;
  border-left: 1px solid var(--line);
}

.crm-detail-list .crm-detail-full {
  grid-column: 1 / -1;
  padding-inline: 0;
  border-left: 0;
}

.crm-detail-list dt {
  margin-bottom: 6px;
  color: var(--ink-soft);
  font-size: 9px;
  font-weight: 800;
  letter-spacing: .09em;
  text-transform: uppercase;
}

.crm-detail-list dd {
  margin: 0;
  font-size: 13px;
  line-height: 1.55;
}

.crm-detail-list a {
  color: var(--ink);
}

.crm-contact-list {
  display: grid;
  gap: 4px;
}

.crm-contact-row {
  display: grid;
  grid-template-columns: 42px minmax(120px, 1fr) auto;
  gap: 12px;
  align-items: center;
  padding: 13px 0;
  border-top: 1px solid var(--line);
}

.contact-avatar {
  width: 38px;
  height: 38px;
  border-color: #dce2ef;
  background: #f1f4fa;
  color: var(--ink);
  font-size: 14px;
}

.contact-identity strong,
.contact-identity small {
  display: block;
}

.contact-identity strong {
  font-size: 12px;
}

.contact-identity small {
  margin-top: 4px;
  color: var(--ink-soft);
  font-size: 9px;
}

.contact-actions {
  grid-column: 2 / -1;
  display: flex;
  gap: 9px;
  justify-content: flex-end;
}

.contact-actions a,
.contact-actions button {
  border: 0;
  background: transparent;
  color: var(--ink-soft);
  font: inherit;
  font-size: 9px;
  font-weight: 750;
  text-decoration: none;
  cursor: pointer;
}

.contact-actions button {
  color: #9d3b34;
}

.crm-activity-panel {
  grid-column: 1 / -1;
  overflow: hidden;
  background: linear-gradient(125deg, #071633, #14295a);
  color: #fff;
}

.activity-placeholder {
  display: grid;
  grid-template-columns: 64px 1fr;
  gap: 22px;
  align-items: center;
}

.activity-placeholder > span {
  display: grid;
  width: 64px;
  height: 64px;
  place-items: center;
  border: 1px solid rgb(255 255 255 / 15%);
  border-radius: 18px;
  background: rgb(255 255 255 / 7%);
  color: #e1bd77;
  font-size: 22px;
}

.activity-placeholder h2 {
  margin-bottom: 8px;
  color: #fff;
}

.activity-placeholder p:last-child {
  max-width: 730px;
  margin: 0;
  color: #c7d0e2;
  font-size: 12px;
  line-height: 1.6;
}

.crm-form-page {
  width: min(100%, 900px);
  margin-inline: auto;
}

.crm-form-page--compact {
  width: min(100%, 650px);
}

.crm-form-heading {
  margin-bottom: 30px;
}

.crm-form-card {
  padding: clamp(28px, 5vw, 46px);
}

.crm-form-actions {
  display: flex;
  gap: 10px;
  align-items: center;
  margin-top: 10px;
}

.crm-form-actions .secondary-button {
  margin-top: 14px;
}

.deadline-metrics {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  margin-bottom: 18px;
}

.deadline-metrics article {
  display: flex;
  gap: 14px;
  align-items: center;
  padding: 19px;
  border: 1px solid var(--line);
  border-radius: 15px;
  background: rgb(255 255 255 / 90%);
  box-shadow: 0 12px 36px rgb(8 22 54 / 5%);
}

.deadline-metric-icon {
  display: grid;
  width: 42px;
  height: 42px;
  flex: 0 0 auto;
  place-items: center;
  border-radius: 12px;
  background: var(--gold-pale);
  color: #805d1d;
  font-size: 16px;
  font-weight: 850;
}

.deadline-metrics small,
.deadline-metrics strong {
  display: block;
}

.deadline-metrics small {
  margin-bottom: 4px;
  color: var(--ink-soft);
  font-size: 9px;
  font-weight: 750;
  text-transform: uppercase;
}

.deadline-metrics strong {
  font-family: Georgia, "Times New Roman", serif;
  font-size: 25px;
  font-weight: 500;
}

.deadline-metric--danger .deadline-metric-icon {
  background: #fff0ee;
  color: #a33b33;
}

.deadline-table td > strong,
.deadline-table td > small,
.deadline-table .deadline-overdue small {
  display: block;
}

.deadline-table td > small {
  margin-top: 5px;
  color: var(--ink-soft);
  font-size: 9px;
}

.deadline-table td a {
  color: var(--ink);
  text-decoration: none;
}

.deadline-row--overdue {
  background: #fffdfc;
}

.deadline-overdue {
  color: #a33b33;
  font-weight: 750;
}

.deadline-overdue small {
  margin-top: 5px;
  font-size: 8px;
  font-weight: 850;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.deadline-priority,
.deadline-status {
  display: inline-block;
  padding: 6px 9px;
  border-radius: 999px;
  background: #eef1f6;
  color: var(--ink-soft);
  font-size: 8px;
  font-weight: 850;
  white-space: nowrap;
  text-transform: uppercase;
}

.deadline-priority--critical {
  background: #fff0ee;
  color: #a33b33;
}

.deadline-priority--high {
  background: #fff5df;
  color: #805d1d;
}

.deadline-priority--low {
  background: #eef6ff;
  color: #386994;
}

.deadline-status--completed {
  background: #e8f7f1;
  color: #187451;
}

.deadline-status--in_progress {
  background: #edf1ff;
  color: #445eaa;
}

.deadline-status--waiting_client {
  background: #fff5df;
  color: #805d1d;
}

.deadline-status--cancelled {
  background: #f0f1f3;
  color: #697181;
}

.table-actions .deadline-complete {
  border-color: #b9dfd1;
  color: #187451;
}

.table-actions .danger-action {
  color: #9d3b34;
}

.form-success,
.debug-link {
  margin-bottom: 18px;
  padding: 14px 16px;
  border: 1px solid #b9dfd1;
  border-radius: 11px;
  background: #ecf8f3;
  color: #176546;
  font-size: 13px;
}

.debug-link {
  display: grid;
  gap: 6px;
  overflow-wrap: anywhere;
  border-color: #d9c18e;
  background: #fff8e9;
  color: #71501d;
}

.debug-link a {
  color: inherit;
}

.security-facts {
  display: flex;
  gap: 18px;
  flex-wrap: wrap;
  margin: 22px 0 8px;
  color: var(--ink-soft);
  font-size: 12px;
}

.security-events-card {
  margin-top: 18px;
  padding: 30px 34px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: rgb(255 255 255 / 90%);
  box-shadow: 0 18px 60px rgb(8 22 54 / 7%);
}

.security-events-card > header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
}

.security-events-card h2,
.security-events-card .eyebrow {
  margin-bottom: 0;
}

.security-events-card header > span {
  color: var(--ink-soft);
  font-size: 11px;
}

.security-event-list {
  margin: 24px 0 0;
  padding: 0;
  list-style: none;
}

.security-event-list li {
  display: grid;
  grid-template-columns: 12px 1fr;
  gap: 14px;
  align-items: start;
  padding: 15px 0;
  border-top: 1px solid var(--line);
}

.security-event-list strong,
.security-event-list small {
  display: block;
}

.security-event-list strong {
  margin-bottom: 5px;
  font-size: 13px;
}

.security-event-list small {
  overflow: hidden;
  color: var(--ink-soft);
  font-size: 10px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.security-event-mark {
  width: 8px;
  height: 8px;
  margin-top: 5px;
  border-radius: 50%;
  background: var(--success);
  box-shadow: 0 0 0 4px rgb(28 155 105 / 12%);
}

@media (max-width: 920px) {
  .architecture-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .status-panel {
    align-items: flex-start;
    flex-direction: column;
  }

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

  .mfa-setup-grid {
    grid-template-columns: 1fr;
  }

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

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

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

@media (max-width: 580px) {
  .site-header,
  main {
    width: min(100% - 24px, 1180px);
  }

  .brand span {
    display: none;
  }

  .brand img {
    width: 160px;
  }

  .environment-badge {
    display: none;
  }

  .portal-nav {
    display: none;
  }

  .auth-card,
  .mfa-panel,
  .mfa-auth-card {
    padding: 28px 22px;
  }

  .recovery-code-grid {
    grid-template-columns: 1fr;
    padding: 14px;
  }

  .security-overview-card {
    grid-template-columns: 1fr;
    padding: 24px;
  }

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

  .form-grid-full {
    grid-column: auto;
  }

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

  .crm-page-heading,
  .crm-detail-heading {
    align-items: flex-start;
    flex-direction: column;
  }

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

  .crm-heading-identity {
    align-items: flex-start;
  }

  .company-avatar--large {
    width: 54px;
    height: 54px;
    border-radius: 15px;
    font-size: 22px;
  }

  .crm-heading-actions {
    padding-bottom: 0;
  }

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

  .crm-detail-list > div,
  .crm-detail-list > div:nth-child(odd),
  .crm-detail-list > div:nth-child(even) {
    padding-inline: 0;
    border-left: 0;
  }

  .activity-placeholder {
    grid-template-columns: 1fr;
  }

  .crm-pagination {
    align-items: flex-start;
    flex-direction: column;
  }

  .deadline-metrics {
    grid-template-columns: 1fr;
  }

  main {
    padding-top: 48px;
  }

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

  .architecture-grid article {
    min-height: auto;
  }

  .status-panel > div {
    align-items: flex-start;
    flex-wrap: wrap;
  }
}

@media print {
  .site-header,
  .mfa-auth-heading,
  .recovery-warning,
  .recovery-actions,
  .recovery-confirm-form {
    display: none;
  }

  body,
  .mfa-auth-card {
    background: #fff;
    box-shadow: none;
  }

  main {
    padding: 0;
  }
}

/* ECQ NEXT billing */
.billing-page,.billing-detail-page,.billing-form-page{width:min(1440px,calc(100% - 48px));margin:0 auto;padding:44px 0 72px}.billing-metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1px;margin:26px 0;background:#e8e9f0;border:1px solid #e8e9f0;border-radius:18px;overflow:hidden;box-shadow:0 16px 40px rgba(15,27,63,.06)}.billing-metrics article{display:flex;align-items:center;gap:16px;min-height:118px;padding:24px;background:#fff}.billing-metric-icon{display:grid;place-items:center;width:44px;height:44px;border-radius:14px;background:#f1f0ff;color:#5546cc;font-size:22px;font-weight:700}.billing-metrics div{display:grid;gap:4px}.billing-metrics small{color:#747c91}.billing-metrics strong{color:#101b42;font-size:22px}.billing-metric--danger .billing-metric-icon{background:#fff0ee;color:#c7463a}.billing-table td{vertical-align:middle}.billing-number{color:#14204a;font-weight:800}.billing-row--overdue{background:#fffaf9}.billing-overdue{color:#b33b32;font-weight:700}.billing-overdue small{display:block;margin-top:3px;color:#c95147}.billing-status{display:inline-flex;align-items:center;padding:6px 10px;border-radius:999px;background:#eff1f6;color:#596176;font-size:12px;font-weight:800;white-space:nowrap}.billing-status--draft{background:#f0f1f5;color:#5d6575}.billing-status--review{background:#f2efff;color:#6755ca}.billing-status--approved{background:#eaf7f1;color:#16865b}.billing-status--sent{background:#eaf3ff;color:#326fbb}.billing-status--paid{background:#e7f8ef;color:#087e4c}.billing-status--overdue{background:#fff0ee;color:#b73c34}.billing-status--void{background:#292f3e;color:#fff}.billing-detail-heading{margin-bottom:26px}.invoice-paper{padding:42px 46px;background:#fff;border:1px solid #e5e7ef;border-radius:20px;box-shadow:0 24px 70px rgba(17,28,64,.09)}.invoice-paper-head{display:grid;grid-template-columns:1fr 1fr;gap:40px;padding-bottom:34px}.invoice-paper-head p,.invoice-customer p{color:#667087;line-height:1.65}.invoice-product-mark{display:inline-flex;gap:6px;margin-bottom:16px;color:#14204a;font-size:21px;letter-spacing:.08em}.invoice-product-mark b{color:#b5893e}.invoice-customer{text-align:right}.invoice-customer span,.invoice-paper-foot span{color:#a87c31;font-size:11px;font-weight:800;letter-spacing:.1em}.invoice-customer h2{margin:8px 0;color:#111d45;font-family:Georgia,serif;font-size:27px}.invoice-meta-grid{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid #e9eaf0;border-radius:14px;overflow:hidden}.invoice-meta-grid div{display:grid;gap:7px;padding:18px 20px;border-right:1px solid #e9eaf0}.invoice-meta-grid div:last-child{border:0}.invoice-meta-grid span{color:#7a8295;font-size:12px}.invoice-meta-grid strong{color:#17214a}.invoice-line-table{margin-top:32px}.invoice-paper-foot{display:grid;grid-template-columns:1fr minmax(300px,38%);gap:48px;margin-top:28px;padding-top:26px;border-top:1px solid #e7e9f0}.invoice-paper-foot p{max-width:620px;color:#697186;white-space:pre-line}.invoice-paper-foot small{display:block;margin-top:22px;color:#8990a0}.invoice-paper-foot dl{margin:0}.invoice-paper-foot dl div{display:flex;justify-content:space-between;padding:9px 0;color:#586177}.invoice-paper-foot dd{margin:0;font-weight:700}.invoice-paper-foot .invoice-grand-total{margin-top:8px;padding-top:17px;border-top:1px solid #dfe1e9;color:#101b42;font-size:20px}.einvoice-assessment{display:flex;gap:18px;margin-top:20px;padding:24px 28px;border:1px solid #efd8a9;border-radius:17px;background:#fffaf0}.einvoice-assessment--ready{border-color:#bce4d0;background:#effbf5}.einvoice-icon{display:grid;place-items:center;flex:0 0 40px;height:40px;border-radius:12px;background:#bd8a31;color:#fff;font-weight:900}.einvoice-assessment--ready .einvoice-icon{background:#16865b}.einvoice-assessment h2{margin:0 0 5px;color:#17214a;font-size:17px}.einvoice-assessment p,.einvoice-assessment li,.einvoice-assessment small{color:#697186}.einvoice-assessment ul{margin:10px 0;padding-left:20px}.invoice-editor{display:grid;gap:20px}.invoice-lines-editor{padding-bottom:20px}.invoice-edit-lines{display:grid;gap:12px;margin-top:22px}.invoice-edit-line{display:grid;grid-template-columns:minmax(250px,2fr) repeat(3,minmax(110px,.7fr)) 100px 36px;gap:12px;align-items:end;padding:16px;border:1px solid #e6e8f0;border-radius:14px;background:#fafbfe}.invoice-edit-line label{display:grid;gap:7px}.invoice-edit-line label span{color:#6f778b;font-size:12px;font-weight:700}.invoice-edit-line input{width:100%;min-height:43px;padding:9px 11px;border:1px solid #dfe2eb;border-radius:9px;background:#fff}.invoice-edit-line output{display:grid;place-items:center;min-height:43px;color:#17214a;font-weight:800}.invoice-line-remove{display:grid;place-items:center;width:36px;height:36px;margin-bottom:4px;border:0;border-radius:10px;background:#fff0ee;color:#b73c34;font-size:20px;cursor:pointer}.invoice-editor-total{display:flex;justify-content:flex-end;align-items:baseline;gap:18px;margin-top:20px;padding:20px 12px 4px;color:#687187}.invoice-editor-total strong{color:#111d45;font-size:25px}
@media (max-width:1000px){.billing-metrics{grid-template-columns:repeat(2,1fr)}.invoice-edit-line{grid-template-columns:1fr 1fr}.invoice-line-description{grid-column:1/-1}.invoice-paper{padding:30px}.invoice-paper-foot{grid-template-columns:1fr}}
@media (max-width:720px){.billing-page,.billing-detail-page,.billing-form-page{width:min(100% - 28px,1440px);padding-top:28px}.billing-metrics{grid-template-columns:1fr}.invoice-paper-head,.invoice-meta-grid{grid-template-columns:1fr}.invoice-customer{text-align:left}.invoice-meta-grid div{border-right:0;border-bottom:1px solid #e9eaf0}.invoice-edit-line{grid-template-columns:1fr}.invoice-line-description{grid-column:auto}.invoice-line-remove{justify-self:end}.invoice-paper{padding:22px}}

/* ECQ NEXT appointments */
.appointment-page,.appointment-form-page{width:min(1440px,calc(100% - 48px));margin:0 auto;padding:44px 0 72px}.appointment-metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin:26px 0}.appointment-metrics article{display:flex;align-items:center;gap:15px;min-height:104px;padding:21px 23px;border:1px solid #e5e7ef;border-radius:17px;background:#fff;box-shadow:0 15px 38px rgba(15,27,63,.05)}.appointment-metrics article>span{display:grid;place-items:center;width:42px;height:42px;border-radius:13px;background:#f0efff;color:#5d4dca;font-size:19px;font-weight:900}.appointment-metrics div{display:grid;gap:3px}.appointment-metrics small{color:#747c91}.appointment-metrics strong{color:#111d45;font-size:23px}.appointment-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;padding:24px}.appointment-card{display:flex;flex-direction:column;min-height:350px;padding:22px;border:1px solid #e5e7ef;border-radius:17px;background:linear-gradient(145deg,#fff,#fbfbfe);box-shadow:0 14px 34px rgba(17,28,64,.055)}.appointment-card>header{display:flex;justify-content:space-between;align-items:flex-start}.appointment-date{display:grid;place-items:center;width:67px;height:67px;border-radius:15px;background:#f5f1e9;color:#9a7131}.appointment-date strong{font-size:26px;line-height:1}.appointment-date small{font-size:10px;font-weight:800;text-transform:uppercase}.appointment-status{display:inline-flex;padding:6px 10px;border-radius:999px;background:#f0f1f5;color:#60697a;font-size:11px;font-weight:800}.appointment-status--requested{background:#fff5df;color:#9b6d17}.appointment-status--confirmed{background:#e9f4ff;color:#286eb6}.appointment-status--completed{background:#e8f8ef;color:#087d4b}.appointment-status--cancelled,.appointment-status--no_show{background:#fff0ee;color:#b63e35}.appointment-card-main{flex:1;padding:22px 2px 12px}.appointment-card-main h2{margin:7px 0 8px;color:#111d45;font-family:Georgia,serif;font-size:22px}.appointment-card-main>p:last-child,.appointment-card-main a{color:#687187}.appointment-card dl{display:grid;gap:10px;margin:0;padding:15px 0;border-top:1px solid #eaebf1}.appointment-card dl div{display:grid;grid-template-columns:72px 1fr;gap:10px}.appointment-card dt{color:#8a91a1;font-size:12px}.appointment-card dd{margin:0;color:#35405d;font-weight:700}.appointment-card dd small{display:block;margin-top:3px;color:#8a91a1;font-weight:500}.appointment-card footer{display:flex;justify-content:space-between;min-height:30px;padding-top:13px;border-top:1px solid #eaebf1}.appointment-card footer a{color:#4e43bb;font-size:13px;font-weight:800}.appointment-empty{grid-column:1/-1}.appointment-editor{display:grid;gap:20px}
@media (max-width:1050px){.appointment-grid{grid-template-columns:repeat(2,1fr)}.appointment-metrics{grid-template-columns:repeat(2,1fr)}}
@media (max-width:720px){.appointment-page,.appointment-form-page{width:min(100% - 28px,1440px);padding-top:28px}.appointment-grid,.appointment-metrics{grid-template-columns:1fr}.appointment-grid{padding:14px}.appointment-card{min-height:0}}

/* ECQ NEXT operational dashboard */
.dashboard-page{width:min(1440px,calc(100% - 8px));margin:0 auto}.dashboard-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:36px;margin-bottom:28px}.dashboard-heading h1{max-width:850px;margin-bottom:14px;font-size:clamp(39px,5vw,65px)}.dashboard-heading>div>p:last-child{max-width:720px;margin:0;color:var(--ink-soft);line-height:1.65}.dashboard-actions{display:flex;flex:0 0 auto;gap:10px}.dashboard-actions a,.light-button{display:inline-flex;align-items:center;justify-content:center;min-height:45px;padding:0 17px;border-radius:10px;font-size:12px;font-weight:800;text-decoration:none}.primary-button{border:1px solid var(--navy);background:var(--navy);color:#fff}.secondary-button{border:1px solid #d9c18e;background:#fff;color:var(--ink)}.dashboard-metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1px;margin:0 0 18px;border:1px solid var(--line);border-radius:18px;overflow:hidden;background:var(--line);box-shadow:0 15px 40px rgba(8,22,54,.06)}.dashboard-metrics article{display:flex;gap:15px;min-height:128px;padding:23px;background:rgba(255,255,255,.96)}.dashboard-metrics article>span{display:grid;width:43px;height:43px;flex:0 0 43px;place-items:center;border-radius:13px;background:var(--gold-pale);color:#805d1d;font-weight:900}.dashboard-metrics div{display:flex;min-width:0;flex-direction:column;align-items:flex-start;gap:5px}.dashboard-metrics small{color:var(--ink-soft);font-size:10px;font-weight:750;text-transform:uppercase}.dashboard-metrics strong{color:var(--ink);font-size:20px}.dashboard-metrics a,.dashboard-metrics em{margin-top:auto;color:#5a6480;font-size:10px;font-style:normal;font-weight:750;text-decoration:none}.dashboard-metric--danger>span{background:#fff0ee!important;color:#a33b33!important}.dashboard-metric--danger em{color:#a33b33}.dashboard-layout{display:grid;grid-template-columns:minmax(0,2fr) minmax(310px,1fr);gap:18px}.dashboard-panel{min-width:0;padding:27px;border:1px solid var(--line);border-radius:18px;background:rgba(255,255,255,.94);box-shadow:0 18px 55px rgba(8,22,54,.06)}.dashboard-panel--wide{grid-column:1}.dashboard-panel>header{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;margin-bottom:20px}.dashboard-panel h2{margin:0;color:var(--ink);font-size:23px}.dashboard-panel .eyebrow{margin-bottom:7px;font-size:9px}.dashboard-panel>header>a{color:#52607b;font-size:11px;font-weight:800;text-decoration:none}.dashboard-table{width:100%;border-collapse:collapse}.dashboard-table th{padding:11px 12px;border-bottom:1px solid var(--line);color:#8a91a1;font-size:9px;text-align:left;text-transform:uppercase}.dashboard-table td{padding:15px 12px;border-bottom:1px solid #edf0f5;color:#3a4662;font-size:11px}.dashboard-table td a{color:var(--ink);text-decoration:none}.dashboard-table td small{display:block;margin-top:4px;color:#8a91a1;font-size:9px}.dashboard-row--danger{background:#fffaf9}.dashboard-row--danger td:nth-child(3){color:#a33b33;font-weight:800}.dashboard-empty{padding:28px!important;color:#8a91a1!important;text-align:center!important}.dashboard-timeline{display:grid}.dashboard-timeline>a{display:grid;grid-template-columns:50px 1fr;gap:13px;align-items:center;padding:14px 0;border-top:1px solid #edf0f5;color:var(--ink);text-decoration:none}.dashboard-timeline>a>span{display:grid;width:46px;height:50px;place-items:center;border-radius:12px;background:#f6f1e7;color:#8c6526}.dashboard-timeline>a>span strong{font-size:17px;line-height:1}.dashboard-timeline>a>span small{font-size:8px;font-weight:850;text-transform:uppercase}.dashboard-timeline>a>div strong,.dashboard-timeline>a>div small{display:block}.dashboard-timeline>a>div strong{font-size:12px}.dashboard-timeline>a>div small{margin-top:5px;color:#7c8497;font-size:9px}.dashboard-activity{grid-column:1}.dashboard-activity ul{margin:0;padding:0;list-style:none}.dashboard-activity li{display:grid;grid-template-columns:9px 1fr;gap:13px;padding:12px 0;border-top:1px solid #edf0f5}.dashboard-activity li>span{width:8px;height:8px;margin-top:5px;border-radius:50%;background:var(--success);box-shadow:0 0 0 4px rgba(28,155,105,.1)}.dashboard-activity strong,.dashboard-activity small{display:block}.dashboard-activity strong{font-size:11px}.dashboard-activity small{margin-top:4px;color:#858c9c;font-size:9px}.dashboard-next-card{grid-column:2;grid-row:2/span 2;background:linear-gradient(145deg,#071633,#162a58);color:#fff}.dashboard-next-card h2{max-width:280px;color:#fff;font-size:29px}.dashboard-next-card>p:not(.eyebrow){color:#c7d0e2;font-size:12px;line-height:1.65}.light-button{margin-top:20px;border:1px solid rgba(255,255,255,.22);color:#fff}.dashboard-calendar{grid-column:2;grid-row:1}.table-wrap{overflow-x:auto}
@media (max-width:1050px){.dashboard-heading{align-items:flex-start;flex-direction:column}.dashboard-metrics{grid-template-columns:repeat(2,1fr)}.dashboard-layout{grid-template-columns:1fr}.dashboard-panel,.dashboard-panel--wide,.dashboard-calendar,.dashboard-activity,.dashboard-next-card{grid-column:1;grid-row:auto}}
@media (max-width:650px){.dashboard-page{width:100%}.dashboard-actions{width:100%;flex-wrap:wrap}.dashboard-metrics{grid-template-columns:1fr}.dashboard-panel{padding:19px}.dashboard-heading h1{font-size:40px}}

/* ECQ NEXT System Administration */
.system-admin-page{width:min(1440px,calc(100% - 8px));margin:0 auto}.system-admin-hero,.admin-page-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:32px;margin-bottom:30px}.system-admin-hero h1,.admin-page-heading h1,.system-user-edit h1{margin-bottom:14px;font-size:clamp(40px,5vw,64px)}.system-admin-hero>div>p:last-child,.admin-page-heading>div>p:last-child,.system-user-edit header>p:last-child{max-width:760px;margin:0;color:var(--ink-soft);line-height:1.65}.system-admin-hero>a,.admin-page-heading>a{flex:0 0 auto;padding:14px 18px;text-decoration:none}.system-metrics{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:1px;margin-bottom:18px;border:1px solid var(--line);border-radius:18px;overflow:hidden;background:var(--line);box-shadow:0 15px 40px rgba(8,22,54,.06)}.system-metrics article{display:flex;gap:14px;min-height:122px;padding:21px;background:rgba(255,255,255,.97)}.system-metrics article>span{display:grid;width:42px;height:42px;flex:0 0 42px;place-items:center;border-radius:13px;background:var(--gold-pale);color:#805d1d;font-weight:900}.system-metrics div{display:flex;min-width:0;flex-direction:column;align-items:flex-start;gap:4px}.system-metrics small{color:var(--ink-soft);font-size:9px;font-weight:800;text-transform:uppercase}.system-metrics strong{font-size:22px}.system-metrics em{margin-top:auto;color:#7b8394;font-size:9px;font-style:normal}.system-metric--danger>span{background:#fff0ee!important;color:#a33b33!important}.system-metric--danger em{color:#a33b33}.system-admin-layout{display:grid;grid-template-columns:minmax(0,2fr) minmax(300px,.8fr);gap:18px}.system-section{min-width:0;padding:28px;border:1px solid var(--line);border-radius:18px;background:rgba(255,255,255,.95);box-shadow:0 18px 55px rgba(8,22,54,.06)}.system-section>header{display:flex;align-items:flex-start;justify-content:space-between;gap:22px;margin-bottom:22px}.system-section>header h2{margin:0}.system-section>header>p{max-width:340px;color:var(--ink-soft);font-size:11px;line-height:1.6}.system-section>header>a{color:#52607b;font-size:11px;font-weight:800;text-decoration:none}.system-section .eyebrow{margin-bottom:7px;font-size:9px}.system-modules{grid-column:1}.system-module-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.system-module-grid>a{display:grid;grid-template-columns:38px 1fr 18px;gap:12px;align-items:center;min-height:86px;padding:14px;border:1px solid #e7e9ef;border-radius:13px;color:var(--ink);text-decoration:none;transition:border-color .15s,transform .15s}.system-module-grid>a:hover{border-color:#d4b77f;transform:translateY(-1px)}.system-module-grid>a>span{display:grid;width:36px;height:36px;place-items:center;border-radius:10px;background:#f5efe3;color:#8a6427;font-size:9px;font-weight:850}.system-module-grid strong,.system-module-grid small{display:block}.system-module-grid strong{margin-bottom:5px;font-size:12px}.system-module-grid small{color:#7a8294;font-size:9px;line-height:1.45}.system-module-grid i{color:#94703b;font-style:normal}.system-admin-side{grid-column:2}.runtime-row{display:grid;grid-template-columns:10px 1fr;gap:13px;align-items:center;padding:14px 0;border-top:1px solid #edf0f5}.runtime-row strong,.runtime-row small{display:block}.runtime-row strong{font-size:12px}.runtime-row small{margin-top:4px;color:#81899a;font-size:9px}.runtime-dot{width:9px;height:9px;border-radius:50%;background:#9ca3b1;box-shadow:0 0 0 4px rgba(120,130,150,.1)}.runtime-dot--ok{background:#1c9b69;box-shadow:0 0 0 4px rgba(28,155,105,.11)}.runtime-dot--unavailable,.runtime-dot--stale{background:#c7473d;box-shadow:0 0 0 4px rgba(199,71,61,.1)}.runtime-queue{display:flex;justify-content:space-between;gap:15px;margin-top:15px;padding:15px;border-radius:11px;background:#f6f7fa;color:#687187;font-size:10px}.runtime-queue strong{color:var(--ink)}.system-events{grid-column:auto}.system-events ul{margin:0;padding:0;list-style:none}.system-events li{display:grid;grid-template-columns:9px 1fr;gap:13px;padding:12px 0;border-top:1px solid #edf0f5}.system-events li>span{width:8px;height:8px;margin-top:5px;border-radius:50%;background:var(--gold);box-shadow:0 0 0 4px rgba(189,142,61,.1)}.system-events li>.security-mark{background:#5e55c6;box-shadow:0 0 0 4px rgba(94,85,198,.1)}.system-events strong,.system-events small{display:block}.system-events strong{font-size:11px}.system-events small{margin-top:4px;color:#858c9c;font-size:9px}.system-empty{padding:28px!important;color:#858c9c!important;text-align:center!important}.system-filter{display:grid;grid-template-columns:minmax(250px,1fr) 180px 180px auto;gap:10px;margin-bottom:18px;padding:17px;border:1px solid var(--line);border-radius:15px;background:rgba(255,255,255,.94);box-shadow:0 12px 35px rgba(8,22,54,.05)}.system-filter--audit{grid-template-columns:minmax(280px,1fr) minmax(220px,.6fr) auto}.system-filter input,.system-filter select{min-height:44px;padding:0 13px;border:1px solid #dfe3eb;border-radius:9px;background:#fff;color:var(--ink);font:inherit;font-size:11px}.system-filter button{padding:0 18px;border:0;border-radius:9px;background:var(--navy);color:#fff;font-size:11px;font-weight:800;cursor:pointer}.system-table-card{padding:0;overflow:hidden}.system-table{width:100%;border-collapse:collapse}.system-table th{padding:15px 17px;border-bottom:1px solid var(--line);background:#fafbfc;color:#858d9f;font-size:9px;text-align:left;text-transform:uppercase}.system-table td{padding:16px 17px;border-bottom:1px solid #edf0f5;color:#414c65;font-size:10px;vertical-align:middle}.system-table td>strong,.system-table td>small{display:block}.system-table td>strong{color:var(--ink);font-size:11px}.system-table td>small{margin-top:4px;color:#8990a0;font-size:9px}.system-table td>a{color:#584db8;font-weight:800;text-decoration:none}.system-role,.system-state{display:inline-flex;padding:6px 9px;border-radius:999px;background:#eef0f5;color:#5e6678;font-size:8px;font-weight:850;text-transform:uppercase}.system-role--admin{background:#ecebff;color:#5348b6}.system-role--manager{background:#edf3ff;color:#3a68a5}.system-role--accountant{background:#fff4df;color:#8b641d}.system-state--active{background:#e9f7f0;color:#167451}.system-state--inactive{background:#fff0ee;color:#a33b33}.system-pagination{display:flex;align-items:center;justify-content:space-between;padding:17px 20px;color:#80889a;font-size:10px}.system-pagination nav{display:flex;gap:10px}.system-pagination a{padding:8px 11px;border:1px solid var(--line);border-radius:8px;color:var(--ink);font-weight:750;text-decoration:none}.system-user-identity{display:flex;gap:14px;align-items:center;margin-bottom:25px;padding-bottom:22px;border-bottom:1px solid var(--line)}.system-user-identity>span{display:grid;width:48px;height:48px;place-items:center;border-radius:13px;background:var(--gold-pale);color:#805d1d;font-size:18px;font-weight:900}.system-user-identity strong,.system-user-identity small{display:block}.system-user-identity small{margin-top:5px;color:#7f8798;font-size:10px}.checkbox-row{display:flex!important;gap:10px;align-items:center;margin:16px 0!important}.checkbox-row input{width:17px!important;height:17px!important}.checkbox-row span{font-size:12px}.system-user-edit .primary-button{min-height:44px;padding:0 17px;border:0}.system-user-edit .secondary-button{min-height:44px;padding:13px 17px;text-decoration:none}
@media(max-width:1120px){.system-metrics{grid-template-columns:repeat(3,1fr)}.system-admin-layout{grid-template-columns:1fr}.system-modules,.system-admin-side,.system-events{grid-column:1}.system-filter{grid-template-columns:1fr 1fr}.system-filter button{min-height:44px}}
@media(max-width:700px){.system-admin-page{width:100%}.system-admin-hero,.admin-page-heading{align-items:flex-start;flex-direction:column}.system-metrics,.system-module-grid,.system-filter,.system-filter--audit{grid-template-columns:1fr}.system-section{padding:19px}.system-table-card{padding:0}.system-admin-hero h1,.admin-page-heading h1{font-size:40px}}