:root {
  --portal-bg: #f3f4f6;
  --portal-surface: #ffffff;
  --portal-soft: #f7f8fa;
  --portal-ink: #17181b;
  --portal-muted: #70747c;
  --portal-line: #e2e4e8;
  --portal-line-strong: #d2d5da;
  --portal-accent: #137d72;
  --portal-accent-soft: #eaf6f2;
  --portal-blue: #426b94;
  --portal-blue-soft: #edf3f8;
  --portal-warn: #a55b2e;
  --portal-warn-soft: #fff2e8;
  --portal-danger: #af453f;
  --portal-danger-soft: #fff0ef;
  --portal-radius: 18px;
  --portal-control-radius: 12px;
  --portal-shadow: 0 22px 60px rgba(18, 20, 24, .08);
}

body.portal-page {
  min-height: 100dvh;
  color: var(--portal-ink);
  background: var(--portal-bg);
}

.portal-page .topbar,
.ops-page .topbar {
  height: 64px;
  border-color: var(--portal-line);
  padding-inline: clamp(18px, 3vw, 40px);
  background: rgba(255, 255, 255, .92);
  backdrop-filter: blur(18px) saturate(.9);
}

.portal-brand-copy strong,
.portal-brand-copy small { display: block; }
.portal-brand-copy strong { color: #121316; font-size: 15px; line-height: 1.2; }
.portal-brand-copy small { margin-top: 2px; color: var(--portal-muted); font-size: 10px; line-height: 1.25; }

.portal-top-actions { display: flex; align-items: center; gap: 8px; }
.portal-top-actions .header-link { min-height: 38px; border-color: var(--portal-line); border-radius: 12px; color: #383b41; background: #fff; }
.portal-top-actions .header-link:hover { border-color: var(--portal-line-strong); background: var(--portal-soft); }
.portal-owner-chip { min-height: 34px; display: inline-flex; align-items: center; gap: 7px; border: 1px solid #d7e9e4; border-radius: 999px; padding: 0 11px; color: #166b62; background: #f0f8f5; font-size: 10px; font-weight: 600; }
.portal-owner-chip svg { width: 14px; height: 14px; }

.portal-shell {
  width: min(calc(100% - 36px), 1460px);
  min-height: calc(100dvh - 100px);
  display: grid;
  grid-template-columns: 232px minmax(0, 1fr);
  margin: 18px auto;
  overflow: hidden;
  border: 1px solid var(--portal-line);
  border-radius: 24px;
  background: var(--portal-surface);
  box-shadow: var(--portal-shadow);
}

.portal-sidebar {
  min-width: 0;
  display: flex;
  flex-direction: column;
  border-right: 1px solid var(--portal-line);
  padding: 22px 14px 16px;
  background: #fafafa;
}

.portal-identity { display: flex; align-items: center; gap: 11px; margin: 0 5px 24px; }
.portal-avatar { width: 42px; height: 42px; flex: 0 0 42px; display: grid; place-items: center; border-radius: 14px; color: #fff; background: #1f2429; font-size: 14px; font-weight: 600; }
.portal-identity > span:last-child { min-width: 0; }
.portal-identity strong,
.portal-identity small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.portal-identity strong { font-size: 12px; }
.portal-identity small { margin-top: 3px; color: var(--portal-muted); font-size: 10px; }

.portal-nav-label { margin: 0 10px 8px; color: #979ba2; font-size: 9px; font-weight: 700; }
.portal-nav { display: grid; gap: 4px; }
.portal-nav-button {
  width: 100%;
  min-height: 42px;
  display: flex;
  align-items: center;
  gap: 10px;
  border: 0;
  border-radius: 12px;
  padding: 0 11px;
  color: #62666d;
  background: transparent;
  font-size: 11px;
  font-weight: 600;
  text-align: left;
  cursor: pointer;
}
.portal-nav-button svg { width: 17px; height: 17px; flex: 0 0 17px; }
.portal-nav-button:hover { color: var(--portal-ink); background: #f0f1f3; }
.portal-nav-button.active { color: #0c665d; background: var(--portal-accent-soft); }
.portal-sidebar-foot { display: grid; gap: 5px; margin-top: auto; border-top: 1px solid var(--portal-line); padding-top: 14px; }
.portal-sidebar-foot a { min-height: 38px; display: flex; align-items: center; gap: 9px; border-radius: 11px; padding: 0 10px; color: #6b6f76; font-size: 10px; font-weight: 600; text-decoration: none; }
.portal-sidebar-foot a:hover { color: var(--portal-ink); background: #f0f1f3; }
.portal-sidebar-foot svg { width: 15px; height: 15px; }

.portal-main { min-width: 0; padding: 34px clamp(26px, 4vw, 54px) 52px; }
.portal-page-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 24px; margin-bottom: 28px; }
.portal-page-heading h1 { color: #121316; font-size: clamp(25px, 3vw, 34px); line-height: 1.25; }
.portal-page-heading p:not(.eyebrow) { max-width: 650px; margin-top: 7px; color: var(--portal-muted); font-size: 12px; line-height: 1.7; }
.portal-page-heading .eyebrow { color: var(--portal-accent); letter-spacing: 0; }
.portal-heading-status { flex: 0 0 auto; min-height: 36px; display: inline-flex; align-items: center; gap: 8px; border: 1px solid #d6e8e3; border-radius: 12px; padding: 0 12px; color: #17665e; background: #f2f8f6; font-size: 10px; font-weight: 600; }
.portal-heading-status::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: #2f8c63; box-shadow: 0 0 0 4px rgba(47, 140, 99, .1); }

.portal-panel[hidden] { display: none; }
.portal-summary-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border: 1px solid var(--portal-line); border-radius: var(--portal-radius); background: #fff; }
.portal-summary-item { min-width: 0; padding: 20px; }
.portal-summary-item + .portal-summary-item { border-left: 1px solid var(--portal-line); }
.portal-summary-item span,
.portal-summary-item strong,
.portal-summary-item small { display: block; }
.portal-summary-item span { color: var(--portal-muted); font-size: 10px; }
.portal-summary-item strong { margin-top: 8px; overflow: hidden; color: #1a1b1e; font-size: 21px; line-height: 1.25; text-overflow: ellipsis; white-space: nowrap; }
.portal-summary-item small { margin-top: 5px; color: #8b8f96; font-size: 9px; line-height: 1.5; }

.portal-section { margin-top: 28px; }
.portal-section-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 18px; margin-bottom: 13px; }
.portal-section-heading > div { min-width: 0; }
.portal-section-heading h2 { font-size: 17px; line-height: 1.4; }
.portal-section-heading p { margin-top: 4px; color: var(--portal-muted); font-size: 10px; }
.portal-section-heading .text-button { min-height: 32px; }

.portal-content-grid { display: grid; grid-template-columns: minmax(0, 1.45fr) minmax(280px, .75fr); gap: 18px; }
.portal-block { min-width: 0; border: 1px solid var(--portal-line); border-radius: var(--portal-radius); padding: 21px; background: #fff; }
.portal-block.soft { background: var(--portal-soft); }
.portal-block-title { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 18px; }
.portal-block-title > span:first-child { display: flex; align-items: center; gap: 9px; }
.portal-block-title svg { width: 17px; height: 17px; color: var(--portal-accent); }
.portal-block-title strong { font-size: 13px; }
.portal-block-title small { color: var(--portal-muted); font-size: 9px; }

.portal-form { display: grid; gap: 15px; }
.portal-field-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.portal-field { min-width: 0; }
.portal-field label { display: block; margin-bottom: 7px; color: #62666d; font-size: 10px; font-weight: 600; }
.portal-field input,
.portal-field select { width: 100%; min-height: 44px; border: 1px solid var(--portal-line-strong); border-radius: var(--portal-control-radius); padding: 0 13px; color: var(--portal-ink); background: #fff; }
.portal-field input[readonly] { color: #73777e; background: #f5f6f7; }
.portal-form-actions { display: flex; justify-content: flex-end; gap: 9px; border-top: 1px solid var(--portal-line); padding-top: 16px; }
.portal-primary,
.portal-secondary,
.portal-danger-button { min-height: 40px; display: inline-flex; align-items: center; justify-content: center; gap: 8px; border-radius: 12px; padding: 0 15px; font-size: 11px; font-weight: 600; cursor: pointer; }
.portal-primary { border: 1px solid #17191c; color: #fff; background: #17191c; }
.portal-primary:hover { background: #303238; }
.portal-secondary { border: 1px solid var(--portal-line-strong); color: #373a40; background: #fff; }
.portal-secondary:hover { background: var(--portal-soft); }
.portal-danger-button { border: 1px solid #eccac7; color: var(--portal-danger); background: var(--portal-danger-soft); }
.portal-primary:disabled,
.portal-secondary:disabled,
.portal-danger-button:disabled { opacity: .56; cursor: wait; }

.portal-message { margin-top: 12px; border-radius: 10px; padding: 9px 11px; color: #596069; background: #f2f3f5; font-size: 10px; }
.portal-message.success { color: #17665e; background: var(--portal-accent-soft); }
.portal-message.error { color: var(--portal-danger); background: var(--portal-danger-soft); }

.account-status-list { display: grid; }
.account-status-row { display: grid; grid-template-columns: 34px minmax(0, 1fr) auto; align-items: center; gap: 11px; min-height: 62px; border-top: 1px solid var(--portal-line); }
.account-status-row:first-child { border-top: 0; }
.account-status-icon { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 11px; color: var(--portal-accent); background: var(--portal-accent-soft); }
.account-status-icon.blue { color: var(--portal-blue); background: var(--portal-blue-soft); }
.account-status-icon svg { width: 16px; height: 16px; }
.account-status-row strong,
.account-status-row small { display: block; }
.account-status-row strong { font-size: 11px; }
.account-status-row small { margin-top: 3px; color: var(--portal-muted); font-size: 9px; }
.portal-state { flex: 0 0 auto; border-radius: 999px; padding: 4px 8px; color: #17665e; background: var(--portal-accent-soft); font-size: 9px; font-weight: 600; }
.portal-state.neutral { color: #676b72; background: #eff0f2; }
.portal-state.warning { color: var(--portal-warn); background: var(--portal-warn-soft); }
.portal-state.success { color: #17665e; background: var(--portal-accent-soft); }
.portal-state.queued { color: #5f6672; background: #eef0f3; }
.portal-state.running { color: #275f86; background: #eaf3f9; }
.portal-state.refunded { color: #705d2d; background: #f7f1df; }

.payment-layout { align-items: start; }
.payment-current-balance { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; border-bottom: 1px solid var(--portal-line); padding: 0 0 17px; }
.payment-current-balance span { color: var(--portal-muted); font-size: 10px; }
.payment-current-balance strong { font-size: 18px; }
.payment-fieldset { min-width: 0; margin: 18px 0 0; border: 0; padding: 0; }
.payment-fieldset legend { margin-bottom: 9px; color: #62666d; font-size: 10px; font-weight: 600; }
.payment-package-list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.payment-choice { min-width: 0; min-height: 68px; border: 1px solid var(--portal-line-strong); border-radius: 8px; padding: 10px; color: var(--portal-ink); background: #fff; cursor: pointer; }
.payment-choice:hover { background: var(--portal-soft); }
.payment-choice.active { border-color: #239b8c; outline: 1px solid #239b8c; background: var(--portal-accent-soft); }
.payment-choice strong,
.payment-choice small { display: block; overflow-wrap: anywhere; }
.payment-choice strong { font-size: 13px; }
.payment-choice small { margin-top: 5px; color: var(--portal-muted); font-size: 9px; }
.payment-method-list { display: flex; gap: 8px; }
.payment-method { min-height: 38px; flex: 1 1 0; border: 1px solid var(--portal-line-strong); border-radius: 8px; padding: 0 12px; color: #4d5158; background: #fff; font-size: 10px; font-weight: 600; cursor: pointer; }
.payment-method:hover { background: var(--portal-soft); }
.payment-method.active { border-color: #239b8c; color: #17665e; background: var(--portal-accent-soft); }
.payment-empty { grid-column: 1 / -1; color: var(--portal-muted); font-size: 10px; }
.payment-actions { margin-top: 19px; }
.payment-order-state { display: grid; grid-template-columns: 34px minmax(0, 1fr) auto; align-items: center; gap: 11px; }
.payment-order-state strong,
.payment-order-state small { display: block; overflow-wrap: anywhere; }
.payment-order-state strong { font-size: 11px; }
.payment-order-state small { margin-top: 4px; color: var(--portal-muted); font-size: 9px; line-height: 1.55; }
.payment-checkout { display: grid; justify-items: center; gap: 12px; border-top: 1px solid var(--portal-line); margin-top: 18px; padding-top: 18px; }
.payment-checkout img { width: min(220px, 100%); aspect-ratio: 1; object-fit: contain; border: 1px solid var(--portal-line); background: #fff; }

.security-score { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: 16px; }
.security-score-ring { width: 76px; height: 76px; display: grid; place-items: center; border: 8px solid #dceee9; border-top-color: var(--portal-accent); border-radius: 50%; color: #155f57; font-size: 17px; font-weight: 600; transform: rotate(-35deg); }
.security-score-ring span { transform: rotate(35deg); }
.security-score strong,
.security-score small { display: block; }
.security-score small { margin-top: 5px; color: var(--portal-muted); font-size: 10px; line-height: 1.6; }

.portal-list { display: grid; border: 1px solid var(--portal-line); border-radius: var(--portal-radius); background: #fff; }
.portal-list-empty { padding: 34px 20px; color: var(--portal-muted); font-size: 11px; text-align: center; }
.portal-list-row { min-width: 0; display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 18px; border-top: 1px solid var(--portal-line); padding: 15px 18px; }
.portal-list-row:first-child { border-top: 0; }
.portal-list-row > div:first-child { min-width: 0; }
.portal-list-row strong,
.portal-list-row small { display: block; }
.portal-list-row strong { overflow: hidden; font-size: 11px; line-height: 1.5; text-overflow: ellipsis; white-space: nowrap; }
.portal-list-row small { margin-top: 3px; color: var(--portal-muted); font-size: 9px; line-height: 1.55; }
.portal-list-meta { display: flex; align-items: center; gap: 8px; }
.portal-list-meta time { color: #8c9097; font-size: 9px; white-space: nowrap; }

.member-list-row { width: 100%; grid-template-columns: 40px minmax(170px, 1.1fr) minmax(130px, .7fr) minmax(140px, .8fr) auto; border: 0; border-top: 1px solid var(--portal-line); padding: 14px 17px; color: inherit; background: #fff; text-align: left; cursor: pointer; }
.member-list-row:first-child { border-top: 0; }
.member-list-row:hover { background: #fafbfb; }
.member-mini-avatar { width: 36px; height: 36px; display: grid; place-items: center; border-radius: 12px; color: #fff; background: #42474e; font-size: 11px; font-weight: 600; }
.member-cell { min-width: 0; }
.member-cell strong,
.member-cell small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.member-cell strong { font-size: 11px; }
.member-cell small { margin-top: 3px; color: var(--portal-muted); font-size: 9px; }
.member-row-arrow { color: #999da4; font-size: 18px; }

.portal-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 13px; }
.portal-search { width: min(320px, 100%); min-height: 40px; border: 1px solid var(--portal-line-strong); border-radius: 12px; padding: 0 13px; background: #fff; font-size: 11px; }

.portal-drawer-backdrop { position: fixed; z-index: 90; inset: 0; display: flex; justify-content: flex-end; background: rgba(17, 19, 22, .34); backdrop-filter: blur(3px); }
.portal-drawer { width: min(440px, 100%); min-height: 100%; overflow-y: auto; padding: 24px; background: #fff; box-shadow: -18px 0 50px rgba(19, 20, 24, .14); }
.portal-drawer-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; border-bottom: 1px solid var(--portal-line); padding-bottom: 18px; }
.portal-drawer-heading h2 { font-size: 19px; }
.portal-drawer-heading p { margin-top: 5px; color: var(--portal-muted); font-size: 10px; }
.portal-icon-button { width: 34px; height: 34px; display: grid; place-items: center; border: 1px solid var(--portal-line); border-radius: 11px; color: #555960; background: #fff; font-size: 19px; cursor: pointer; }
.portal-drawer-section { margin-top: 24px; }
.portal-drawer-section h3 { margin-bottom: 12px; font-size: 12px; }
.portal-definition-list { display: grid; border: 1px solid var(--portal-line); border-radius: 14px; }
.portal-definition-row { display: flex; align-items: center; justify-content: space-between; gap: 16px; border-top: 1px solid var(--portal-line); padding: 11px 13px; }
.portal-definition-row:first-child { border-top: 0; }
.portal-definition-row span { color: var(--portal-muted); font-size: 9px; }
.portal-definition-row strong { max-width: 65%; overflow: hidden; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }

.usage-bars { display: grid; gap: 13px; }
.usage-bar-row { display: grid; grid-template-columns: 110px minmax(0, 1fr) 90px; align-items: center; gap: 12px; }
.usage-bar-row span,
.usage-bar-row strong { font-size: 9px; }
.usage-bar-row strong { text-align: right; }
.usage-bar-track { height: 7px; overflow: hidden; border-radius: 999px; background: #eceef0; }
.usage-bar-track i { height: 100%; display: block; border-radius: inherit; background: var(--portal-accent); }

.portal-dialog { width: min(440px, calc(100% - 28px)); border: 1px solid var(--portal-line); border-radius: 20px; padding: 0; background: #fff; box-shadow: 0 28px 80px rgba(17, 19, 22, .22); }
.portal-dialog::backdrop { background: rgba(17, 19, 22, .36); backdrop-filter: blur(4px); }
.portal-dialog form { padding: 24px; }
.portal-dialog-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; margin-bottom: 20px; }
.portal-dialog-heading h2 { font-size: 19px; }
.portal-dialog-heading p { margin-top: 5px; color: var(--portal-muted); font-size: 10px; }

.portal-loading { min-height: 360px; display: grid; place-items: center; color: var(--portal-muted); font-size: 11px; }
.portal-loading > span { display: flex; align-items: center; gap: 10px; }
.portal-loading i { width: 18px; height: 18px; border: 2px solid #d9dcdf; border-top-color: var(--portal-accent); border-radius: 50%; animation: portal-spin .8s linear infinite; }
@keyframes portal-spin { to { transform: rotate(360deg); } }

.ops-page .admin-workspace { padding: 22px 18px 42px; background: var(--portal-bg); }
.ops-page .admin-panel { width: min(1460px, 100%); border-color: var(--portal-line); border-radius: 24px; padding: 34px clamp(22px, 3vw, 42px); background: #fff; box-shadow: var(--portal-shadow); backdrop-filter: none; }
.ops-page .admin-heading { border-bottom: 1px solid var(--portal-line); padding-bottom: 24px; }
.ops-page .admin-heading h1 { color: #121316; }
.ops-page .admin-console-tabs,
.ops-page .admin-section-tabs,
.ops-page .usage-view-tabs { border-color: var(--portal-line); background: #f5f6f7; }
.ops-page .admin-console-tab.active,
.ops-page .admin-section-tab.active,
.ops-page .usage-view-tab.active { color: #111316; background: #fff; box-shadow: 0 4px 12px rgba(16, 18, 22, .07); }
.ops-page .team-wallet,
.ops-page .owner-team-tools,
.ops-page .team-block,
.ops-page .model-row,
.ops-page .model-form,
.ops-page .release-current,
.ops-page .release-row { border-color: var(--portal-line); background: #fff; box-shadow: none; }

.ops-page #employeeList { gap: 9px; }
.employee-account-row { min-width: 0; display: grid; grid-template-columns: minmax(260px, 1fr) auto; align-items: center; gap: 14px 20px; border: 1px solid var(--portal-line); border-radius: 16px; padding: 15px 17px; background: #fff; }
.employee-account-summary { min-width: 0; display: flex; align-items: center; gap: 12px; }
.employee-account-avatar { width: 40px; height: 40px; flex: 0 0 40px; display: grid; place-items: center; border-radius: 13px; color: #fff; background: #373b41; font-size: 12px; font-weight: 600; }
.employee-account-copy { min-width: 0; }
.employee-account-copy strong,
.employee-account-copy small,
.employee-account-copy p { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.employee-account-copy strong { font-size: 12px; }
.employee-account-copy small { margin-top: 2px; color: var(--portal-muted); font-size: 9px; }
.employee-account-copy p { margin-top: 4px; color: #858990; font-size: 9px; }
.employee-account-state { display: flex; align-items: center; justify-content: flex-end; gap: 8px; }
.employee-role-chip { border: 1px solid var(--portal-line); border-radius: 999px; padding: 4px 8px; color: #5d6168; background: #f7f8f9; font-size: 9px; font-weight: 600; }
.employee-manage-details { grid-column: 1 / -1; border-top: 1px solid var(--portal-line); padding-top: 10px; }
.employee-manage-details > summary { width: max-content; display: flex; align-items: center; gap: 7px; border-radius: 9px; padding: 5px 8px; color: #64686f; font-size: 9px; font-weight: 600; list-style: none; cursor: pointer; }
.employee-manage-details > summary::-webkit-details-marker { display: none; }
.employee-manage-details > summary:hover,
.employee-manage-details[open] > summary { color: #17191c; background: #f1f2f4; }
.employee-manage-details[open] > summary span { transform: rotate(180deg); }
.employee-manage-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin-top: 11px; border-radius: 13px; padding: 14px; background: #f7f8f9; }
.employee-manage-field { min-width: 0; display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: end; gap: 7px; }
.employee-manage-field > label { grid-column: 1 / -1; color: #73777e; font-size: 9px; font-weight: 600; }
.employee-manage-field select,
.employee-manage-field input { width: 100%; min-width: 0; min-height: 36px; border: 1px solid var(--portal-line-strong); border-radius: 10px; padding: 0 9px; background: #fff; font-size: 9px; }
.employee-manage-field .text-button { min-height: 34px; border: 1px solid var(--portal-line-strong); border-radius: 10px; padding-inline: 9px; background: #fff; white-space: nowrap; }
.employee-manage-danger { grid-column: 1 / -1; display: flex; align-items: center; justify-content: space-between; gap: 14px; border-top: 1px solid var(--portal-line); padding-top: 12px; }
.employee-manage-danger strong,
.employee-manage-danger small { display: block; }
.employee-manage-danger strong { font-size: 10px; }
.employee-manage-danger small { margin-top: 3px; color: var(--portal-muted); font-size: 9px; }
.employee-manage-danger .employee-toggle { color: var(--portal-danger); }

@media (max-width: 1060px) {
  .portal-summary-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .portal-summary-item:nth-child(3) { border-top: 1px solid var(--portal-line); border-left: 0; }
  .portal-summary-item:nth-child(4) { border-top: 1px solid var(--portal-line); }
  .portal-content-grid { grid-template-columns: 1fr; }
  .member-list-row { grid-template-columns: 38px minmax(150px, 1fr) minmax(120px, .7fr) auto; }
  .member-list-row .member-usage-cell { display: none; }
}

@media (max-width: 760px) {
  .portal-page .topbar,
  .ops-page .topbar { height: 58px; padding-inline: 14px; }
  .portal-brand-copy small,
  .portal-owner-chip,
  .portal-top-actions .header-link span { display: none; }
  .portal-shell { width: 100%; min-height: calc(100dvh - 58px); display: block; margin: 0; border: 0; border-radius: 0; box-shadow: none; }
  .portal-sidebar { position: sticky; z-index: 15; top: 58px; display: block; overflow-x: auto; border-right: 0; border-bottom: 1px solid var(--portal-line); padding: 8px 14px; background: rgba(250, 250, 250, .96); backdrop-filter: blur(16px); }
  .portal-identity,
  .portal-nav-label,
  .portal-sidebar-foot { display: none; }
  .portal-nav { display: flex; width: max-content; gap: 5px; }
  .portal-nav-button { width: auto; min-height: 38px; flex: 0 0 auto; padding: 0 11px; }
  .portal-nav-button svg { width: 15px; height: 15px; }
  .portal-main { padding: 25px 16px 44px; }
  .portal-page-heading { display: block; margin-bottom: 22px; }
  .portal-page-heading h1 { font-size: 25px; }
  .portal-heading-status { margin-top: 13px; }
  .portal-summary-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .portal-summary-item { padding: 16px; }
  .portal-summary-item strong { font-size: 18px; }
  .portal-content-grid { gap: 14px; }
  .portal-block { padding: 17px; }
  .portal-field-row { grid-template-columns: 1fr; }
  .portal-list-row { align-items: flex-start; grid-template-columns: 1fr; gap: 8px; }
  .portal-list-meta { justify-content: space-between; }
  .member-list-row { grid-template-columns: 36px minmax(0, 1fr) auto; gap: 10px; }
  .member-list-row .member-role-cell,
  .member-list-row .member-usage-cell { display: none; }
  .portal-toolbar { align-items: stretch; flex-direction: column; }
  .portal-search { width: 100%; }
  .usage-bar-row { grid-template-columns: 80px minmax(0, 1fr); }
  .usage-bar-row strong { grid-column: 1 / -1; text-align: left; }
  .ops-page .admin-workspace { padding: 0; }
  .ops-page .admin-panel { border: 0; border-radius: 0; padding: 25px 16px 44px; box-shadow: none; }
  .employee-account-row { grid-template-columns: minmax(0, 1fr); gap: 11px; }
  .employee-account-state { justify-content: flex-start; padding-left: 52px; }
  .employee-manage-grid { grid-template-columns: 1fr; }
  .employee-manage-danger { grid-column: auto; align-items: flex-start; flex-direction: column; }
}

@media (max-width: 420px) {
  .portal-summary-grid { grid-template-columns: 1fr; }
  .portal-summary-item + .portal-summary-item { border-top: 1px solid var(--portal-line); border-left: 0; }
  .portal-summary-item:nth-child(4) { border-left: 0; }
  .portal-nav-button { padding-inline: 9px; }
  .payment-package-list { grid-template-columns: 1fr; }
  .payment-order-state { grid-template-columns: 34px minmax(0, 1fr); }
  .payment-order-state .portal-state { grid-column: 2; justify-self: start; }
}

@media (prefers-reduced-motion: reduce) {
  .portal-loading i { animation: none; }
}

/* The operations console owns its layout here so legacy workbench rules cannot widen the page. */
.ops-page {
  width: 100%;
  min-width: 0;
  overflow-x: clip;
  color: var(--portal-ink);
  background: var(--portal-bg);
}

.ops-page::before,
.ops-page::after { content: none; }

.ops-page > .topbar {
  width: 100%;
  min-width: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  justify-content: initial;
  gap: 20px;
  box-sizing: border-box;
  border-bottom-color: var(--portal-line);
  color: var(--portal-ink);
  background: rgba(255, 255, 255, .94);
  box-shadow: 0 8px 28px rgba(18, 20, 24, .05);
}

.ops-page > .topbar .brand {
  min-width: 0;
  overflow: hidden;
  color: var(--portal-ink);
}

.ops-page > .topbar .brand-mark { flex: 0 0 auto; }
.ops-page > .topbar .portal-brand-copy { min-width: 0; overflow: hidden; }
.ops-page > .topbar .portal-brand-copy strong,
.ops-page > .topbar .portal-brand-copy small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ops-page > .topbar .portal-top-actions { min-width: 0; justify-self: end; }

.ops-page > .topbar .portal-top-actions .header-link {
  flex: 0 0 auto;
  border-color: var(--portal-line);
  color: #383b41;
  background: #fff;
  box-shadow: none;
  opacity: 1;
}

.ops-page > .topbar .portal-top-actions .header-link:hover {
  border-color: var(--portal-line-strong);
  color: #17191c;
  background: var(--portal-soft);
}

.ops-page .admin-workspace {
  width: 100%;
  min-width: 0;
  min-height: calc(100dvh - 64px);
  display: block;
  box-sizing: border-box;
  padding: 22px 18px 42px;
  background: var(--portal-bg);
}

.ops-page .admin-panel {
  width: 100%;
  max-width: 1460px;
  min-width: 0;
  box-sizing: border-box;
  margin-inline: auto;
}

.ops-page .admin-panel.admin-locked {
  width: min(880px, 100%);
  min-height: 0;
}

.ops-page .admin-panel.admin-locked .admin-heading { margin-bottom: 0; }
.ops-page .admin-panel.admin-locked .admin-session-check { padding: 36px 0 26px; }

.ops-page .key-manager,
.ops-page .admin-console-panel,
.ops-page .admin-section-panel,
.ops-page .employee-management,
.ops-page .team-wallet,
.ops-page .owner-team-tools,
.ops-page .team-grid,
.ops-page .team-block,
.ops-page .admin-list,
.ops-page .model-manager,
.ops-page .model-list,
.ops-page .model-form,
.ops-page .release-list,
.ops-page .history-table-wrap {
  min-width: 0;
  max-width: 100%;
  box-sizing: border-box;
}

.ops-page .admin-console-tabs,
.ops-page .admin-section-tabs,
.ops-page .usage-view-tabs {
  max-width: 100%;
  overflow-x: auto;
  overflow-y: hidden;
  flex-wrap: nowrap;
  scrollbar-width: thin;
}

.ops-page .admin-console-tab,
.ops-page .admin-section-tab,
.ops-page .usage-view-tab { flex: 0 0 auto; white-space: nowrap; }
.ops-page .history-table-wrap { overflow-x: auto; overflow-y: hidden; overscroll-behavior-inline: contain; }

@media (max-width: 1180px) {
  .ops-page .team-wallet-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ops-page .employee-manage-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ops-page .model-manager { grid-template-columns: minmax(260px, 320px) minmax(0, 1fr); gap: 20px; }
}

@media (max-width: 960px) {
  .ops-page .team-grid { grid-template-columns: minmax(0, 1fr); }
  .ops-page .team-projects { grid-column: 1; }
  .ops-page .model-manager { grid-template-columns: minmax(0, 1fr); }
  .ops-page .model-manager > .section-heading,
  .ops-page .model-manager > #resetModelButton { grid-column: 1; grid-row: auto; }
}

@media (max-width: 760px) {
  .ops-page > .topbar { grid-template-columns: minmax(0, 1fr) auto; gap: 10px; }
  .ops-page > .topbar .portal-top-actions { gap: 5px; }
  .ops-page > .topbar .portal-top-actions .header-link { width: 36px; min-height: 36px; justify-content: center; padding: 0; }
  .ops-page .admin-workspace { min-height: calc(100dvh - 58px); padding: 0; }
  .ops-page .admin-panel { width: 100%; max-width: none; padding: 24px 16px 40px; }
  .ops-page .admin-panel.admin-locked { width: 100%; }
  .ops-page .admin-panel.admin-locked .admin-session-check { padding: 30px 0 22px; }
  .ops-page .admin-heading { gap: 12px; padding-bottom: 20px; }
  .ops-page .admin-heading h1 { font-size: 25px; }
  .ops-page .admin-lead { font-size: 11px; }
  .ops-page .team-wallet-summary,
  .ops-page .employee-manage-grid { grid-template-columns: minmax(0, 1fr); }
  .ops-page .employee-account-state { padding-left: 52px; }
  .ops-page .console-heading,
  .ops-page .section-heading { align-items: flex-start; }
}

@media (max-width: 420px) {
  .ops-page > .topbar .portal-brand-copy strong { font-size: 13px; }
  .ops-page .admin-panel { padding-inline: 13px; }
  .ops-page .admin-console-tab,
  .ops-page .admin-section-tab,
  .ops-page .usage-view-tab { padding-inline: 11px; }
  .ops-page .employee-account-state { padding-left: 0; }
  .ops-page .admin-project-row summary { align-items: flex-start; flex-direction: column; }
}
