/* Public account cabinet. Uses --pk-* / --ed-* tokens. Do not import landing.css. */

body.account-body {
  min-width: 0;
  --acc-hairline: color-mix(in srgb, var(--ed-border) 70%, transparent);
  --acc-surface-work: var(--ed-surface);
  --acc-surface-silver: color-mix(in srgb, var(--ed-surface-muted) 82%, #dfe3ea);
  --acc-surface-silver-end: color-mix(in srgb, var(--ed-surface-muted) 70%, #d4d9e2);
  --acc-geo-dot: color-mix(in srgb, var(--ed-border-strong, var(--ed-border)) 55%, transparent);
  --acc-accent-bar: var(--ed-accent);
}

/* Light cabinet page ground — same stack as landing body (landing.css; landing untouched).
   One fixed layer so header blur and main read the same surface (no seam / restart). */
html[data-theme="light"] body.account-body {
  --acc-lp-bg: #f7f7f9;
  --acc-lp-bg-deep: #f1f2f5;
  --acc-page-ground:
    radial-gradient(1100px 520px at 82% 2%, rgba(222, 90, 27, 0.035), transparent 62%),
    radial-gradient(860px 420px at 4% 0%, rgba(20, 22, 26, 0.028), transparent 58%),
    linear-gradient(180deg, #fbfbfc 0%, var(--acc-lp-bg) 24%, var(--acc-lp-bg-deep) 100%);
  isolation: isolate;
  background: transparent;
}

html[data-theme="light"] body.account-body::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background: var(--acc-page-ground);
}

html[data-theme="light"] body.account-body > .editorial-workspace {
  position: relative;
  z-index: 1;
  background: transparent;
}

html[data-theme="light"] body.account-body .account-main {
  background: transparent;
}

/* At rest, match landing header chrome (transparent edge; no drop shadow band). */
html[data-theme="light"] body.account-body .editorial-header {
  background: var(--pk-header-bg, rgba(250, 250, 252, 0.86));
  border-bottom-color: transparent;
  box-shadow: none;
}

.account-shell {
  min-width: 0;
  min-height: 100vh;
}

.account-main {
  flex: 1 1 auto;
  width: var(--ed-header-shell);
  max-width: 100%;
  min-width: 0;
  margin: 0 auto;
  padding: 1.5rem 0 2.5rem;
}

/* Shared cabinet canvas: balanced at 1440/1024/390 (~56–64rem band). */
.account-canvas {
  --account-canvas: min(60rem, 100%);
  --account-form-read: min(42rem, 100%);
  width: var(--account-canvas);
  max-width: 100%;
  margin-inline: auto;
  min-width: 0;
}

/* One rhythm for Overview, Profile, Notifications and Security. */
.account-page {
  --acc-pad: 1.15rem;
  --account-gap: 1.35rem;
  --account-section-gap: 1.15rem;
  display: grid;
  gap: var(--account-gap);
  min-width: 0;
}

.account-page__intro {
  display: grid;
  gap: 0.3rem;
  min-width: 0;
}

.account-stack {
  display: grid;
  gap: var(--account-section-gap);
  min-width: 0;
}

/* Every section opens the same way: name of the area, then one line of why. */
.account-page-head__title {
  margin: 0;
  font-size: clamp(1.25rem, 1.15rem + 0.45vw, 1.375rem);
  font-weight: 600;
  letter-spacing: -0.028em;
  line-height: 1.2;
  color: var(--ed-text);
}

.account-page-head__lead {
  margin: 0;
  max-width: 46rem;
  font-size: 0.875rem;
  line-height: 1.55;
  color: var(--ed-muted);
}

.account-page-head__row {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.75rem;
  min-width: 0;
}

.account-page-head__row > div {
  display: grid;
  gap: 0.3rem;
  min-width: 0;
}

.account-page-head .account-flash {
  margin: 0.85rem 0 0;
}

/* Profile settings grid — full canvas panel, readable controls on the right. */
.account-profile-settings__form {
  display: grid;
  gap: 0;
  min-width: 0;
}

.account-settings-flash {
  margin: 1rem var(--acc-pad) 0;
}

.account-settings-grid {
  display: grid;
  min-width: 0;
}

.account-settings-row {
  display: grid;
  gap: 0.65rem 1.25rem;
  align-items: start;
  min-width: 0;
  padding: 1.05rem var(--acc-pad);
  border-bottom: 1px solid var(--acc-hairline);
}

.account-settings-row:last-child {
  border-bottom: 0;
}

.account-settings-row__title {
  margin: 0;
  font-size: 0.9375rem;
  font-weight: 600;
  letter-spacing: -0.01em;
}

.account-settings-row__desc {
  margin: 0.35rem 0 0;
  font-size: 0.8125rem;
  color: var(--ed-muted);
  line-height: 1.45;
}

.account-settings-row__control {
  min-width: 0;
}

.account-profile-settings .account-field {
  margin-bottom: 0;
}

.account-profile-settings .account-settings-row__control .editorial-input,
.account-profile-settings .account-settings-row__control .editorial-select {
  width: 100%;
  max-width: 100%;
}

.account-profile-email-value {
  margin: 0;
  font-weight: 500;
  color: var(--ed-text);
}

.account-settings-footer {
  padding: 0.95rem var(--acc-pad) 1.05rem;
  border-top: 1px solid var(--acc-hairline);
  background: var(--ed-surface-muted);
}

.account-settings-footer__actions {
  margin: 0;
}

.account-settings-confirm-wrap {
  padding: 0 var(--acc-pad) 1.05rem;
  border-top: 1px solid var(--acc-hairline);
  background: var(--ed-surface-muted);
}

.account-settings-confirm {
  margin: 0;
}

@media (min-width: 720px) {
  .account-settings-row {
    grid-template-columns: minmax(0, 0.35fr) minmax(0, 0.65fr);
    gap: 1rem 1.5rem;
    padding-block: 1.1rem;
  }

  .account-settings-row__control .editorial-input,
  .account-settings-row__control .editorial-select {
    max-width: var(--account-form-read);
  }

  .account-settings-footer {
    display: grid;
    grid-template-columns: minmax(0, 0.35fr) minmax(0, 0.65fr);
    gap: 0 1.5rem;
    padding-block: 1rem;
  }

  .account-settings-footer__actions {
    grid-column: 2;
  }

  .account-settings-confirm-wrap {
    display: grid;
    grid-template-columns: minmax(0, 0.35fr) minmax(0, 0.65fr);
    gap: 0 1.5rem;
    padding-block: 0 1rem;
    margin-top: -0.35rem;
    border-top: 0;
  }

  .account-settings-confirm {
    grid-column: 2;
  }
}

.account-body .editorial-page-title {
  margin-bottom: 0.25rem;
}

.account-body .editorial-lead {
  margin-bottom: 0;
}

.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.account-body .editorial-nav-mobile__toggle {
  list-style: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  min-height: 2.25rem;
  padding: 0 0.7rem;
  line-height: 1;
}

.account-header__space {
  display: none;
  margin: 0;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--ed-text);
  font-size: 0.92rem;
  font-weight: 600;
  letter-spacing: -0.02em;
  line-height: 1.2;
}

.account-body .editorial-theme-toggle {
  width: 2.5rem;
  height: 2.25rem;
}

.account-body--auth .editorial-user-bar {
  display: flex;
}

.account-body--auth .editorial-header__inner {
  grid-template-columns: minmax(0, 1fr) auto;
}

.account-link-quiet {
  color: var(--ed-muted);
  text-decoration: none;
  font-size: 0.8125rem;
}

.account-link-quiet:hover {
  color: var(--ed-accent-ink);
}

.account-kicker {
  margin: 0 0 0.35rem;
  font-family: var(--ed-mono);
  font-size: 0.6875rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--ed-accent-ink);
}

.account-title {
  margin: 0 0 0.4rem;
  font-size: 1.25rem;
  font-weight: 600;
  letter-spacing: -0.02em;
  line-height: 1.25;
  overflow-wrap: anywhere;
}

.account-kicker {
  margin: 0 0 0.35rem;
  font-family: var(--ed-mono);
  font-size: 0.6875rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--ed-accent-ink);
}

.account-title {
  margin: 0 0 0.4rem;
  font-size: clamp(1.35rem, 2.4vw, 1.75rem);
  font-weight: 600;
  letter-spacing: -0.03em;
  line-height: 1.2;
  overflow-wrap: anywhere;
}

.account-lead,
.account-hint {
  margin: 0;
  color: var(--ed-muted);
  font-size: 0.875rem;
}

.account-hint {
  margin-top: 0.45rem;
}

.account-legal-links {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem 1rem;
  margin: 0 0 1rem;
  min-width: 0;
  font-size: 0.875rem;
}

.account-legal-links a {
  color: var(--ed-text-secondary);
  text-decoration: underline;
  text-underline-offset: 0.15em;
}

.account-legal-links a:hover {
  color: var(--ed-text);
}

.account-legal-links a:focus-visible {
  outline: var(--pk-focus-ring);
  outline-offset: var(--pk-focus-offset);
}

.account-card {
  min-width: 0;
  padding: 1rem 1.05rem;
  background: var(--ed-surface);
  border: 1px solid var(--ed-border);
  border-radius: var(--ed-radius);
}

.account-card--muted {
  background: var(--ed-surface-muted);
}

.account-card__title {
  margin: 0 0 0.75rem;
  font-size: 1rem;
  font-weight: 600;
  letter-spacing: -0.02em;
}

.account-subtitle {
  margin: 0.15rem 0 0.55rem;
  font-size: 0.75rem;
  font-weight: 500;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--ed-muted);
}

.account-meta {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(10rem, 1fr));
  gap: 0.75rem 1.25rem;
  margin: 0 0 0.85rem;
}

.account-meta dt {
  margin: 0;
  font-size: 0.75rem;
  color: var(--ed-muted);
}

.account-meta dd {
  margin: 0.15rem 0 0;
}

.account-break {
  overflow-wrap: anywhere;
  word-break: break-word;
}

.account-status {
  margin: 0;
  font-weight: 500;
}

.account-status--quiet {
  color: var(--ed-text-secondary);
}

.account-empty {
  padding: 0.15rem 0 0.35rem;
}

.account-empty__title {
  margin: 0 0 0.3rem;
  font-weight: 500;
}

.account-empty__hint,
.account-card p {
  margin: 0;
  color: var(--ed-text-secondary);
}

.account-card p + p,
.account-card p + .account-form__actions,
.account-card .account-hint + p,
.account-form__actions {
  margin-top: 0.85rem;
}

.account-list,
.account-session-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 0.65rem;
}

.account-list li,
.account-session {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.5rem 1rem;
  min-width: 0;
  padding: 0.55rem 0;
  border-bottom: 1px solid var(--ed-border);
}

.account-list li {
  flex-direction: column;
}

.account-stream-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 0.5rem;
}

.account-stream {
  display: grid;
  gap: 0.2rem;
  min-width: 0;
  padding: 0.65rem 0.8rem;
  background: var(--ed-surface-muted);
  border: 1px solid var(--ed-border);
  border-radius: var(--ed-radius);
  cursor: default;
}

.account-stream__name {
  font-weight: 500;
  overflow-wrap: anywhere;
  word-break: break-word;
}

.account-stream__desc {
  color: var(--ed-muted);
  font-size: 0.8125rem;
  overflow-wrap: anywhere;
  word-break: break-word;
}

.account-pill--warn {
  color: var(--ed-text);
  border-color: var(--ed-warning-line, var(--ed-border));
  background: color-mix(in srgb, var(--ed-warning, #b54708) 12%, var(--ed-surface));
}

.account-identity-list,
.account-session-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 0.75rem;
}

.account-identity,
.account-session {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem 1rem;
  align-items: flex-start;
  justify-content: space-between;
  padding: 0.7rem 0;
  border-bottom: 1px solid var(--ed-border);
  min-width: 0;
}

.account-identity__body,
.account-identity__label {
  margin: 0;
  min-width: 0;
}

.account-identity__label {
  font-weight: 600;
}

.account-identity__body p {
  margin: 0.15rem 0 0;
  font-size: 0.8125rem;
}

.account-identity-actions {
  margin-top: 1.15rem;
  display: grid;
  gap: 0.65rem;
}

.account-card__subtitle {
  margin: 0;
  font-size: 0.95rem;
}

.account-identity-actions__row {
  display: grid;
  gap: 0.65rem;
  min-width: 0;
}

.account-email-link {
  display: grid;
  gap: 0.5rem;
  min-width: 0;
}

.account-confirm {
  min-width: 0;
}

.account-confirm > summary {
  cursor: pointer;
  list-style: none;
}

.account-confirm > summary::-webkit-details-marker {
  display: none;
}

.account-confirm[open] > summary {
  margin-bottom: 0.5rem;
}

.account-confirm__form {
  display: grid;
  gap: 0.5rem;
  max-width: 22rem;
}

.account-confirm__form p {
  margin: 0;
  font-size: 0.8125rem;
}

.account-otp-form {
  margin-top: 0.85rem;
}

.account-session.is-current {
  background: transparent;
}

.account-session__label {
  margin: 0 0 0.2rem;
  font-weight: 600;
}

.account-session__body {
  min-width: 0;
  flex: 1 1 12rem;
}

.account-session__body p {
  margin: 0;
  font-size: 0.8125rem;
}

.account-session__action {
  margin: 0;
}

.account-field {
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
  margin-bottom: 1rem;
  min-width: 0;
}

.account-field label {
  font-size: 0.75rem;
  font-weight: 500;
  color: var(--ed-text-secondary);
}

.account-field-error {
  margin: 0;
  color: var(--ed-danger);
  font-size: 0.8125rem;
}

.account-choice {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin: 0.35rem 0;
  min-width: 0;
}

.account-flash {
  margin: 0 0 0.85rem;
  padding: 0.65rem 0.85rem;
  border-radius: var(--ed-radius);
  border: 1px solid var(--ed-success-line);
  background: var(--ed-success-bg);
  color: var(--ed-text);
}

.account-flash--error {
  border-color: var(--ed-danger, #b42318);
  background: color-mix(in srgb, var(--ed-danger, #b42318) 12%, var(--ed-surface));
}

.account-header__inner--auth {
  grid-template-columns: minmax(0, 1fr) auto;
}

.account-header__inner--auth .account-link-quiet {
  display: inline;
}

html:has(body.account-body--auth) {
  overflow-x: clip;
}

.account-body--auth {
  overflow-x: clip;
}

.account-body--auth .account-shell {
  min-height: 100dvh;
}

.account-main--auth {
  width: var(--ed-header-shell);
  max-width: 100%;
  min-width: 0;
  margin: 0 auto;
  padding: 1.5rem 1rem 2.5rem;
}

.account-main.account-main--login {
  --account-login-max: 70rem;
  --account-login-gap: 2rem;
  --account-login-control-h: 3.375rem;
  --account-login-radius: 1rem;
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  width: min(var(--account-login-max), calc(100% - 2.5rem));
  max-width: 70rem;
  margin-inline: auto;
  padding: 0.7rem 0 0.9rem;
  min-height: 0;
  min-width: 0;
}

.account-page--auth {
  width: var(--account-canvas, min(60rem, 100%));
  max-width: 100%;
  min-width: 0;
}

.account-page--auth .account-page-head {
  max-width: 36rem;
}

.account-login-stage {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: var(--account-login-gap);
  align-items: stretch;
  width: 100%;
  min-width: 0;
  flex: 1 1 auto;
  min-height: calc(100dvh - var(--ed-header-h) - 1.6rem);
}

.account-login-stage__form,
.account-login-stage__visual {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 0;
  min-height: 0;
}

.account-login-stage__form {
  position: relative;
  z-index: 2;
}

.account-login-stage__visual {
  pointer-events: none;
  z-index: 1;
}

.account-login-pane {
  width: min(27.5rem, 100%);
  display: grid;
  gap: 0;
}

.account-login-pane__title {
  margin: 0 0 0.7rem;
  font-size: clamp(1.85rem, 1.45rem + 1.05vw, 2.35rem);
  font-weight: 700;
  letter-spacing: -0.046em;
  line-height: 1.12;
  color: var(--pk-ink);
}

.account-login-pane__lead {
  margin: 0 0 1.7rem;
  font-size: 0.975rem;
  line-height: 1.5;
  color: var(--pk-ink-soft);
  max-width: 34em;
  text-wrap: pretty;
}

.account-login-form,
.account-login-pane .account-form,
.account-login-pane .account-form__actions {
  display: grid;
  gap: 1.05rem;
  margin: 0;
}

.account-login-pane .account-field {
  display: grid;
  gap: 0.45rem;
}

.account-login-pane .account-field label {
  font-size: 0.8125rem;
  font-weight: 500;
  color: var(--pk-ink);
}

.account-main--login .account-login-pane .editorial-input {
  width: 100%;
  height: var(--account-login-control-h);
  min-height: var(--account-login-control-h);
  padding: 0.85rem 1.05rem;
  border: 1px solid transparent;
  border-radius: var(--account-login-radius);
  background: #f3f4f6;
  font-size: 0.9375rem;
}

.account-main--login .account-login-pane .editorial-input::placeholder {
  color: #9aa0a8;
}

.account-main--login .account-login-pane .editorial-input:hover {
  border-color: var(--pk-line-strong);
}

.account-main--login .account-login-pane .editorial-input:focus,
.account-main--login .account-login-pane .editorial-input:focus-visible {
  border-color: var(--pk-accent);
  background: #fff;
  box-shadow: 0 0 0 3px rgba(222, 90, 27, 0.16);
}

.account-login-pane .account-flash,
.account-login-pane .account-hint {
  margin: 0 0 1rem;
}

.account-main--login .account-login-pane .account-auth-btn {
  display: flex;
  width: 100%;
  height: var(--account-login-control-h);
  min-height: var(--account-login-control-h);
  justify-content: center;
  border-radius: var(--account-login-radius);
  font-size: 0.9375rem;
}

.account-login-pane .account-auth-btn:disabled,
.account-login-pane .account-auth-btn[aria-busy="true"] {
  pointer-events: none;
}

.account-login-or {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  gap: 0.85rem;
  align-items: center;
  margin: 0.15rem 0;
  color: var(--pk-ink-faint);
  font-size: 0.75rem;
}

.account-login-or::before,
.account-login-or::after {
  content: "";
  height: 1px;
  background: var(--pk-line);
}

.account-login-yandex {
  gap: 0.6rem;
  background: #fff;
  border: 1px solid var(--pk-line-strong);
  color: var(--ed-text);
  font-weight: 600;
}

.account-login-yandex:hover {
  background: var(--ed-hover);
  border-color: var(--ed-text-secondary);
  color: var(--ed-text);
}

.account-login-yandex__mark {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.15rem;
  height: 1.15rem;
  border-radius: 0.28rem;
  background: #111;
  color: #fff;
  font-size: 0.7rem;
  font-weight: 700;
  line-height: 1;
}

.account-login-consents {
  display: grid;
  gap: 0.5rem;
}

.account-check {
  display: flex;
  gap: 0.5rem;
  align-items: flex-start;
  font-size: 0.75rem;
  line-height: 1.45;
  color: var(--ed-text-secondary);
}

.account-check input {
  margin-top: 0.15rem;
  flex: 0 0 auto;
}

.account-check span {
  min-width: 0;
  overflow-wrap: anywhere;
}

.account-check a {
  color: var(--ed-text);
  text-underline-offset: 0.15em;
}

.account-check--optional {
  margin: 0.2rem 0 0;
  padding: 0.75rem 0 0;
  border-top: 1px solid var(--acc-hairline);
  color: var(--ed-muted);
}

.account-check__optional {
  display: inline;
  font-weight: 600;
  color: var(--ed-text-secondary);
}

.account-login-aside {
  margin: 1.25rem 0 0;
  font-size: 0.8125rem;
  line-height: 1.45;
  color: var(--pk-ink-faint);
}

.account-login-backwrap {
  margin: 0.15rem 0 0;
}

.account-login-pane .account-login-form + .account-login-secondary {
  margin-top: 0.9rem;
}

.account-login-back,
.account-auth-textbtn {
  display: inline-flex;
  align-items: center;
  min-height: 2.75rem;
  padding: 0;
  border: 0;
  background: none;
  color: var(--ed-muted);
  font: inherit;
  font-size: 0.8125rem;
  text-decoration: none;
  cursor: pointer;
}

.account-login-back:hover,
.account-auth-textbtn:hover {
  color: var(--ed-accent-ink);
}

.account-login-secondary {
  display: grid;
  gap: 0.45rem;
}

.account-login-resend {
  display: grid;
  gap: 0;
}

.account-otp-resend-status {
  margin: 0;
  min-height: 1.35rem;
  font-size: 0.75rem;
  line-height: 1.35rem;
  color: var(--pk-ink-faint);
}

.account-otp {
  position: relative;
}

.account-otp-cells {
  display: none;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: clamp(0.28rem, 1.2vw, 0.5rem);
  width: 100%;
  min-width: 0;
}

.account-otp.is-enhanced .account-otp-cells {
  display: grid;
}

.account-otp.is-enhanced .account-otp-input {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.account-otp-cell {
  box-sizing: border-box;
  width: 100%;
  min-width: 0;
  max-width: 3.5rem;
  height: clamp(2.5rem, 12vw, 3.5rem);
  margin: 0 auto;
  padding: 0;
  border: 1px solid var(--pk-line);
  border-radius: var(--account-login-radius);
  background: #f3f4f6;
  color: var(--pk-ink);
  font-family: inherit;
  font-size: clamp(1.15rem, 3.6vw, 1.45rem);
  font-variant-numeric: tabular-nums;
  font-weight: 600;
  line-height: 1;
  text-align: center;
  caret-color: var(--pk-accent);
}

.account-otp-cell.is-filled {
  background: #f3f4f6;
  border-color: var(--pk-line-strong);
}

.account-otp-cell:hover {
  border-color: var(--pk-line-strong);
}

.account-otp-cell:focus,
.account-otp-cell:focus-visible {
  outline: none;
  border-color: var(--pk-accent);
  background: #fff;
  box-shadow: 0 0 0 3px rgba(222, 90, 27, 0.16);
}

.account-otp-input {
  letter-spacing: 0.32em;
  font-variant-numeric: tabular-nums;
  font-size: 1.2rem;
  text-align: center;
}

.account-auth-form,
.account-auth-inline {
  margin: 0;
  display: grid;
  gap: 0.9rem;
}

.account-login-pane .account-login-form.account-auth-form {
  gap: 1.05rem;
}

.account-auth-btn.is-busy,
.account-auth-btn[aria-busy="true"] {
  opacity: 0.65;
}

.account-login-visual {
  --login-visual-max-h: calc(100dvh - var(--ed-header-h) - 1.7rem);
  --login-visual-inset: 1.5rem;
  position: relative;
  width: min(100%, calc(var(--login-visual-max-h) * 2 / 3));
  aspect-ratio: 2 / 3;
  max-height: var(--login-visual-max-h);
  overflow: hidden;
  border-radius: 1.75rem;
  background: #eef0f3;
}

.account-login-visual picture,
.account-login-visual__image {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
}

.account-login-visual__image {
  object-fit: contain;
  object-position: center;
}

.account-login-visual__title,
.account-login-visual__body {
  position: absolute;
  left: 0;
  right: auto;
  z-index: 1;
  margin: 0;
  pointer-events: none;
  color: var(--pk-ink);
  text-align: left;
  text-wrap: pretty;
  overflow-wrap: break-word;
  padding-left: var(--login-visual-inset);
  padding-right: 0;
  box-sizing: border-box;
}

.account-login-visual__title {
  top: 0;
  width: 78%;
  max-width: 78%;
  padding-top: var(--login-visual-inset);
  padding-bottom: 2.5rem;
  font-size: clamp(1.12rem, 0.95rem + 0.7vw, 1.42rem);
  font-weight: 600;
  letter-spacing: -0.034em;
  line-height: 1.3;
  background: linear-gradient(180deg, rgba(238, 240, 243, 0.72) 0%, rgba(238, 240, 243, 0.18) 72%, transparent 100%);
}

.account-login-visual__body {
  bottom: 0;
  width: 78%;
  max-width: 78%;
  padding-top: 2.4rem;
  padding-bottom: var(--login-visual-inset);
  font-size: 0.9rem;
  line-height: 1.58;
  color: var(--pk-ink-mid);
  background: linear-gradient(0deg, rgba(238, 240, 243, 0.74) 0%, rgba(238, 240, 243, 0.16) 70%, transparent 100%);
}

@media (prefers-reduced-motion: no-preference) {
  .account-login-pane,
  .account-login-visual {
    animation: account-login-enter 0.42s var(--pk-ease) both;
  }

  .account-login-visual {
    animation-delay: 0.06s;
  }
}

@media (prefers-reduced-motion: reduce) {
  .account-login-pane,
  .account-login-visual {
    animation: none;
  }
}

@keyframes account-login-enter {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

@media (max-width: 1100px) {
  .account-main.account-main--login {
    --account-login-gap: 1.5rem;
    width: min(var(--account-login-max), calc(100% - 2rem));
  }

  .account-login-pane {
    width: min(26.5rem, 100%);
  }

  .account-login-visual {
    --login-visual-inset: 1.4rem;
  }
}

@media (max-width: 860px) {
  .account-main.account-main--login {
    width: min(26.5rem, calc(100% - 1.5rem));
    padding: 0.9rem 0 1.25rem;
  }

  .account-login-stage {
    grid-template-columns: minmax(0, 1fr);
    min-height: 0;
    gap: 1.25rem;
  }

  .account-login-stage__form {
    align-items: stretch;
  }

  .account-login-pane {
    width: 100%;
  }

  .account-login-pane__title {
    font-size: clamp(1.7rem, 8vw, 2.05rem);
  }

  .account-login-visual {
    --login-visual-max-h: 22.5rem;
    --login-visual-inset: 1.25rem;
    width: 100%;
    aspect-ratio: 4 / 5;
  }

  .account-login-visual__image {
    object-fit: cover;
    object-position: center;
  }

  .account-login-visual__title,
  .account-login-visual__body {
    width: 80%;
    max-width: 80%;
  }
}

@media (max-width: 390px) {
  .account-login-visual {
    --login-visual-max-h: 21.25rem;
    --login-visual-inset: 1.2rem;
  }

  .account-login-visual__title {
    font-size: 1.05rem;
    line-height: 1.32;
    padding-bottom: 2rem;
  }

  .account-login-visual__body {
    font-size: 0.84rem;
    line-height: 1.55;
    padding-top: 1.85rem;
  }
}

@media (max-width: 320px) {
  .account-main.account-main--login {
    width: calc(100% - 1.25rem);
  }

  .account-login-stage {
    gap: 1rem;
  }

  .account-login-visual {
    --login-visual-max-h: 18.75rem;
    --login-visual-inset: 1.1rem;
  }

  .account-login-visual__title {
    font-size: 1rem;
    padding-bottom: 1.7rem;
  }

  .account-login-visual__body {
    font-size: 0.8rem;
    padding-top: 1.6rem;
  }
}

#account-connect-capability {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  letter-spacing: 0.04em;
}

.account-form .editorial-input,
.account-form .editorial-select {
  max-width: 100%;
}

.account-telegram-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem 0.75rem;
  align-items: flex-start;
  margin-top: 0;
  min-width: 0;
}

.account-panel__actions.account-telegram-actions {
  align-items: flex-start;
}

.account-telegram-link-wrap {
  min-width: 0;
}

.account-telegram-link-wrap a {
  max-width: 100%;
  overflow-wrap: anywhere;
}

.account-confirm__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
}

.trial-resume-review__form {
  margin: 1rem 0 0;
  min-width: 0;
}

.trial-resume-review__form .btn {
  min-height: 2.5rem;
}

.account-body .btn:focus-visible,
.account-body a:focus-visible,
.account-body input:focus-visible,
.account-body select:focus-visible,
.account-body summary:focus-visible,
.account-body button:focus-visible {
  outline: none;
  box-shadow: 0 0 0 1px var(--ed-accent);
}

.account-pair {
  display: grid;
  gap: 1rem;
  min-width: 0;
}

.account-inline-status {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem 0.85rem;
  align-items: center;
  margin-top: 0.55rem;
}

.account-card p.account-inline-status,
.account-card p.account-card__action {
  margin-top: 0.55rem;
}

.account-card .account-row__body p + p {
  margin-top: 0.15rem;
}

.account-profile-bar {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem 1.25rem;
  align-items: baseline;
  min-width: 0;
  padding: 0.65rem 0 0;
  border-top: 1px solid var(--ed-border);
  font-size: 0.8125rem;
}

.account-profile-bar p {
  margin: 0;
}

.account-profile-bar__label {
  color: var(--ed-muted);
  margin-right: 0.3rem;
}

.account-card__head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.75rem;
  margin-bottom: 0.35rem;
}

.account-card__head .account-card__title {
  margin: 0;
}

.account-card__action {
  margin-top: 0.75rem;
}

.account-badge {
  display: inline-flex;
  align-items: center;
  min-height: 1.75rem;
  padding: 0.3rem 0.7rem;
  border: 1px solid var(--ed-border);
  border-radius: 999px;
  background: var(--ed-surface-muted);
  color: var(--ed-text-secondary);
  font-size: 0.75rem;
  font-weight: 500;
  line-height: 1.45;
}

.account-badge--ok {
  border-color: var(--ed-success-line);
  background: var(--ed-success-bg);
  color: var(--ed-text);
}

.account-badge--quiet {
  color: var(--ed-muted);
}

.account-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  list-style: none;
  margin: 0.55rem 0 0;
  padding: 0;
}

.account-chip {
  padding: 0.28rem 0.6rem;
  border: 1px solid var(--ed-chip-border, var(--ed-border));
  border-radius: 999px;
  background: var(--ed-chip-bg, var(--ed-surface-muted));
  color: var(--ed-chip-text, var(--ed-text));
  font-size: 0.8125rem;
  max-width: 100%;
}

.account-project-name {
  margin: 0;
  font-weight: 600;
}

.account-rows {
  list-style: none;
  margin: 0;
  padding: 0;
}

.account-row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem 1rem;
  align-items: flex-start;
  justify-content: space-between;
  min-width: 0;
  padding: 0.7rem 0;
  border-bottom: 1px solid var(--ed-border);
}

.account-row:last-child {
  border-bottom: 0;
  padding-bottom: 0;
}

.account-row__title {
  margin: 0;
  font-weight: 600;
}

.account-row__body p {
  margin: 0.15rem 0 0;
  font-size: 0.8125rem;
}

.account-row__action {
  margin: 0;
}

.account-email-block,
.account-facts {
  min-width: 0;
}

.account-email-block {
  padding-top: 0.35rem;
  border-top: 1px solid var(--ed-border);
}

.account-email-list {
  list-style: none;
  margin: 0 0 0.35rem;
  padding: 0;
  display: grid;
  gap: 0.45rem;
}

.account-confirm-timezone {
  margin: 0;
}

.account-logout-row {
  margin: 0;
}

.account-notice {
  margin-top: 0.55rem;
  padding: 0.55rem 0.7rem;
  border: 1px solid var(--ed-border);
  border-radius: var(--ed-radius);
  background: var(--ed-surface-muted);
  color: var(--ed-text-secondary);
  font-size: 0.8125rem;
}

.account-help {
  position: relative;
  flex: 0 0 auto;
}

.account-help__toggle {
  list-style: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2rem;
  height: 2rem;
  padding: 0;
  border: 1px solid var(--ed-border);
  border-radius: 999px;
  background: var(--ed-surface);
  color: var(--ed-text-secondary);
  cursor: pointer;
}

.account-help__toggle::-webkit-details-marker {
  display: none;
}

.account-help__glyph {
  display: flex;
}

.account-help[open] {
  z-index: 12;
}

.account-help__panel {
  position: absolute;
  right: 0;
  z-index: 8;
  width: min(18rem, calc(100vw - 3rem));
  margin-top: 0.35rem;
  padding: 0.7rem 0.8rem;
  border: 1px solid var(--ed-border);
  border-radius: var(--ed-radius);
  background: var(--ed-surface);
  color: var(--ed-text-secondary);
  font-size: 0.8125rem;
  line-height: 1.5;
  overflow-wrap: anywhere;
  box-shadow: var(--ed-shadow-panel);
}

.account-help__panel.is-placed {
  position: fixed;
  right: auto;
  margin-top: 0;
  z-index: 40;
}

.account-help--plan .account-help__toggle {
  width: 1.15rem;
  height: 1.15rem;
  border: 0;
  background: transparent;
  color: var(--ed-muted);
  box-shadow: none;
}

.account-help--plan .account-help__toggle:hover {
  color: var(--ed-text-secondary);
}

.account-help--plan .account-help__toggle:focus-visible {
  outline: 2px solid var(--ed-accent, #c4552a);
  outline-offset: 2px;
}

.account-help--plan .account-help__panel {
  width: min(22rem, calc(100vw - 1.5rem));
}

.account-pill {
  display: inline-flex;
  align-items: center;
  padding: 0.1rem 0.45rem;
  border: 1px solid var(--ed-border);
  border-radius: 999px;
  font-size: 0.75rem;
}

/* ── Overview: "editorial desk" composition ──────────────────────────────
   Page-level hero on the canvas, contained panels for grouped content.
   One line system (hairlines), one accent (orange), one radius scale:
   panels 12px, controls 6px, badges/chips pill.                          */

.account-panel {
  display: flex;
  flex-direction: column;
  min-width: 0;
  background: var(--ed-surface);
  border: 1px solid var(--ed-border);
  border-radius: var(--pk-radius-card);
  box-shadow: var(--ed-shadow-panel);
}

.account-panel__head {
  padding: 1rem var(--acc-pad) 0.85rem;
  border-bottom: 1px solid var(--acc-hairline);
}

.account-panel__headline {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.45rem 0.7rem;
  min-width: 0;
}

.account-panel__title {
  margin: 0;
  font-size: 1.0625rem;
  font-weight: 600;
  letter-spacing: -0.022em;
  line-height: 1.3;
  color: var(--ed-text);
}

.account-panel__note {
  margin: 0.3rem 0 0;
  max-width: 44rem;
  font-size: 0.8125rem;
  line-height: 1.5;
  color: var(--ed-muted);
}

.account-panel__body {
  min-width: 0;
  padding: 1rem var(--acc-pad) 1.15rem;
}

.account-panel__body > * {
  margin: 0;
}

.account-panel__body > * + * {
  margin-top: 0.85rem;
}

.account-panel__copy {
  max-width: 46rem;
  font-size: 0.9375rem;
  line-height: 1.6;
  color: var(--ed-text-secondary);
}

.account-panel__body > .account-panel__action {
  margin-top: 1.2rem;
}

.account-panel__body > .account-sublabel {
  margin-top: 1.6rem;
}

.account-panel__action {
  margin: 1.2rem 0 0;
}

.account-panel__empty,
.account-stream-tabs__empty {
  margin: 0;
  font-size: 0.875rem;
  line-height: 1.55;
  color: var(--ed-muted);
}

.account-panel__footnote {
  margin: 0;
  padding: 0.85rem var(--acc-pad) 1rem;
  border-top: 1px solid var(--acc-hairline);
  font-size: 0.8125rem;
  line-height: 1.55;
  color: var(--ed-text-secondary);
}

/* Panels whose children paint their own background to the panel edge. */
.account-panel--flush {
  overflow: hidden;
}

.account-panel__actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.6rem 0.75rem;
  margin: 0;
  padding: 0.9rem var(--acc-pad);
  border-top: 1px solid var(--acc-hairline);
}

.account-panel__actions--split {
  justify-content: space-between;
}

.account-panel__actions-note {
  margin: 0;
  flex: 1 1 14rem;
  min-width: 0;
  font-size: 0.8125rem;
  line-height: 1.5;
  color: var(--ed-muted);
}

.account-panel__actions > div {
  flex: 1 1 16rem;
  min-width: 0;
}

.account-panel__actions > div > .account-panel__actions-note {
  margin-top: 0.3rem;
}

/* A panel that is nothing but one decision needs no second line above it. */
.account-logout-panel > .account-panel__actions {
  border-top: 0;
  padding-block: 1rem;
}

/* Quota / supporting facts read as card metadata, not as capabilities. */
.account-panel__meta {
  margin-top: auto;
  padding: 1rem var(--acc-pad);
  border-top: 1px solid var(--acc-hairline);
  background: var(--ed-surface-muted);
  border-radius: 0 0 calc(var(--pk-radius-card) - 1px) calc(var(--pk-radius-card) - 1px);
}

/* Supporting facts attached to the bottom of a column (trial quota). */
.account-metablock {
  margin-top: auto;
  padding-top: 1.15rem;
  border-top: 1px solid var(--acc-hairline);
}

.account-metablock__head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.45rem 0.7rem;
  min-width: 0;
}

.account-metablock__title {
  margin: 0;
  font-size: 0.875rem;
  font-weight: 600;
  letter-spacing: -0.01em;
  color: var(--ed-text);
}

.account-metablock__copy {
  margin: 0.5rem 0 0;
  font-size: 0.8125rem;
  line-height: 1.55;
  color: var(--ed-text-secondary);
}

.account-metrics {
  display: grid;
  gap: 0.55rem;
  margin: 0.85rem 0 0;
}

.account-metrics__item {
  display: grid;
  gap: 0.05rem;
  min-width: 0;
}

.account-metrics dt {
  margin: 0;
  font-size: 0.75rem;
  font-weight: 600;
  color: var(--ed-text-secondary);
}

.account-metrics dd {
  margin: 0;
  font-size: 0.8125rem;
  line-height: 1.5;
  color: var(--ed-muted);
  overflow-wrap: anywhere;
}

.account-metrics__nums {
  font-family: var(--ed-mono);
  font-size: 0.75rem;
  font-variant-numeric: tabular-nums;
}

/* Editorial container: name + primary action on one line, statuses as a
   metadata band below. One finished object instead of a half-empty header. */
.account-editorial-card__head {
  display: grid;
  gap: 0.9rem;
  align-items: start;
  padding: 1.1rem var(--acc-pad);
}

.account-editorial-card__name {
  margin: 0;
  font-size: clamp(1.35rem, 1.1rem + 1.05vw, 1.7rem);
  font-weight: 600;
  letter-spacing: -0.032em;
  line-height: 1.18;
  color: var(--ed-text);
}

.account-editorial-card__copy {
  margin: 0.45rem 0 0;
  max-width: 44rem;
  font-size: 0.9375rem;
  line-height: 1.55;
  color: var(--ed-text-secondary);
}

.account-editorial-card__note {
  margin: 0.4rem 0 0;
  max-width: 44rem;
  font-size: 0.8125rem;
  line-height: 1.55;
  color: var(--ed-muted);
}

.account-editorial-card__action {
  margin: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 0.6rem;
}

.account-cta-tariff {
  text-decoration: none;
}

/* Trial compare: silver frame + two inner cards (see --trial-framed). */
.account-compare {
  min-width: 0;
}

.account-compare--trial-framed {
  border-radius: inherit;
}

.account-compare__deck {
  position: relative;
  z-index: 1;
  display: grid;
  gap: 0.78rem;
  min-width: 0;
  padding: 0.88rem var(--acc-pad) 1rem;
}

.account-compare--trial-framed .account-compare__col {
  display: flex;
  flex-direction: column;
  min-width: 0;
  padding: 1rem 1.05rem 1.12rem;
  border: 1px solid color-mix(in srgb, var(--ed-border) 78%, transparent);
  border-radius: 12px;
  background: linear-gradient(
    168deg,
    color-mix(in srgb, var(--ed-surface) 96%, #fff) 0%,
    color-mix(in srgb, var(--ed-surface-muted) 42%, var(--ed-surface)) 100%
  );
  box-shadow:
    inset 0 1px 0 color-mix(in srgb, #fff 75%, transparent),
    0 10px 26px color-mix(in srgb, #000 7%, transparent);
}

.account-compare--trial-framed .account-compare__col + .account-compare__col {
  border-top: 0;
}

.account-compare--trial-framed .account-compare__col--offer {
  background: linear-gradient(
    168deg,
    color-mix(in srgb, var(--ed-accent) 6.5%, var(--ed-surface)) 0%,
    color-mix(in srgb, var(--ed-accent) 2.5%, var(--ed-surface-muted)) 100%
  );
  border-color: color-mix(in srgb, var(--ed-accent) 14%, var(--ed-border));
  box-shadow:
    inset 0 1px 0 color-mix(in srgb, var(--ed-accent) 8%, #fff),
    0 10px 28px color-mix(in srgb, var(--ed-accent) 6%, transparent);
}

.account-compare__col {
  display: flex;
  flex-direction: column;
  min-width: 0;
}

.account-compare__head {
  padding-bottom: 0.92rem;
  border-bottom: 1px solid var(--acc-hairline);
}

.account-compare__status {
  margin: 0 0 0.45rem;
}

.account-compare__status-tag {
  display: inline-flex;
  align-items: center;
  gap: 0.38rem;
  font-size: 0.6875rem;
  font-weight: 600;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: color-mix(in srgb, var(--ed-muted) 88%, var(--ed-text-secondary));
}

.account-compare__status-tag::before {
  content: "";
  flex: 0 0 auto;
  width: 0.4rem;
  height: 0.4rem;
  border-radius: 999px;
  background: color-mix(in srgb, var(--ed-accent) 62%, #c4b8ae);
  box-shadow: 0 0 9px color-mix(in srgb, var(--ed-accent) 22%, transparent);
}

.account-compare__body {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  min-width: 0;
  padding-top: 1.05rem;
}

.account-compare__col + .account-compare__col {
  border-top: 0;
}

.account-compare__col--offer {
  background: transparent;
}

.account-compare__title {
  margin: 0;
  font-size: 1.0625rem;
  font-weight: 600;
  letter-spacing: -0.022em;
  line-height: 1.3;
  color: var(--ed-text);
}

.account-compare__note {
  margin: 0.3rem 0 0;
  max-width: 40rem;
  font-size: 0.8125rem;
  line-height: 1.5;
  color: var(--ed-muted);
}

.account-compare__list {
  margin-top: 0;
}

.account-compare__action {
  margin: 0;
  padding-top: 1.25rem;
  margin-top: auto;
}

.account-compare__action--pair {
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem;
  align-items: stretch;
}

.account-compare__action--pair .btn {
  flex: 1 1 11rem;
  justify-content: center;
}

.account-feature-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 0.95rem;
  max-width: 46rem;
}

.account-feature-list li {
  display: grid;
  gap: 0.15rem;
  min-width: 0;
}

.account-feature-list__title {
  font-size: 0.9375rem;
  font-weight: 600;
  letter-spacing: -0.01em;
  line-height: 1.35;
  color: var(--ed-text);
}

.account-feature-list__detail {
  font-size: 0.8125rem;
  line-height: 1.55;
  color: var(--ed-muted);
}

.account-stream-tabs {
  min-width: 0;
}

.account-stream-tabs__list {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 0.2rem;
  max-width: 100%;
  margin: 0 0 1rem;
  padding: 0.25rem;
  background: var(--ed-surface-muted);
  border: 1px solid var(--ed-border);
  border-radius: 9px;
}

.account-stream-tabs__tab {
  min-height: 2.125rem;
  padding: 0.35rem 0.85rem;
  border: 1px solid transparent;
  border-radius: var(--ed-radius);
  background: transparent;
  color: var(--ed-text-secondary);
  font: inherit;
  font-size: 0.8125rem;
  font-weight: 500;
  line-height: 1.3;
  cursor: pointer;
  transition: background-color 0.15s ease, color 0.15s ease;
}

.account-stream-tabs__tab:hover {
  color: var(--ed-text);
}

.account-stream-tabs__tab.is-active {
  background: var(--ed-surface);
  border-color: color-mix(in srgb, var(--ed-accent) 24%, var(--ed-border));
  color: var(--ed-text);
  box-shadow: 0 1px 2px rgba(20, 22, 26, 0.07);
}

.account-stream-tabs__tab:focus-visible {
  outline: none;
  box-shadow: 0 0 0 2px var(--ed-accent);
}

.account-stream-tabs__panel {
  min-width: 0;
}

.account-stream-tabs__panel[hidden] {
  display: none;
}

.account-stream-tabs__panel:focus-visible {
  outline: none;
  border-radius: var(--ed-radius);
  box-shadow: 0 0 0 2px var(--ed-accent);
}

.account-stream-tabs__desc {
  margin: 0;
  max-width: 52rem;
  font-size: 0.875rem;
  line-height: 1.6;
  color: var(--ed-text-secondary);
}

.account-stream-tabs__topics-label {
  margin: 1.05rem 0 0.5rem;
  font-family: var(--ed-mono);
  font-size: 0.6875rem;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  color: var(--ed-text-faint);
}

.account-chips--static {
  margin: 0;
  gap: 0.35rem;
}

.account-chips--static .account-chip {
  padding: 0.3rem 0.65rem;
  border-color: transparent;
  background: var(--ed-surface-muted);
  color: var(--ed-text-secondary);
  font-size: 0.75rem;
  line-height: 1.4;
  cursor: default;
}

/* Shared fact grid: editorial statuses, account readiness, notification
   types, login methods. Label / value / detail / action, hairline dividers. */
.account-factgrid {
  display: grid;
  min-width: 0;
}

.account-fact {
  display: grid;
  gap: 0.25rem;
  align-content: start;
  min-width: 0;
  padding: 0.95rem 0;
  border-top: 1px solid var(--acc-hairline);
}

.account-fact:first-child {
  padding-top: 0;
  border-top: 0;
}

.account-fact:last-child {
  padding-bottom: 0;
}

.account-fact__label {
  margin: 0;
  font-family: var(--ed-mono);
  font-size: 0.6875rem;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  color: var(--ed-text-faint);
}

.account-fact__value {
  margin: 0.15rem 0 0;
  min-width: 0;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.4rem;
}

.account-fact__text {
  font-size: 0.9375rem;
  font-weight: 600;
  letter-spacing: -0.01em;
  color: var(--ed-text);
}

.account-fact__detail {
  margin: 0.2rem 0 0;
  font-size: 0.8125rem;
  line-height: 1.5;
  color: var(--ed-muted);
}

.account-fact__action {
  margin: 0.45rem 0 0;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.4rem;
  font-size: 0.8125rem;
}

.account-fact__sep {
  color: var(--ed-text-faint);
}

/* Login methods: one row per method, ready for e-mail / Google / several at
   once. Rows keep their shape whether or not an action is available. */
.account-methods {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  min-width: 0;
}

.account-method {
  display: grid;
  gap: 0.6rem 1.5rem;
  align-items: start;
  min-width: 0;
  padding: 0.95rem 0;
  border-top: 1px solid var(--acc-hairline);
}

.account-method:first-child {
  padding-top: 0;
  border-top: 0;
}

.account-method:last-child {
  padding-bottom: 0;
}

.account-method__body {
  display: grid;
  gap: 0.3rem;
  min-width: 0;
}

.account-method__name {
  margin: 0;
  font-size: 0.9375rem;
  font-weight: 600;
  letter-spacing: -0.01em;
  color: var(--ed-text);
}

.account-method__value {
  margin: 0;
  font-size: 0.875rem;
  color: var(--ed-text-secondary);
}

.account-method__badges {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  margin: 0.1rem 0 0;
}

.account-method__hint {
  margin: 0;
  max-width: 44rem;
  font-size: 0.8125rem;
  line-height: 1.5;
  color: var(--ed-muted);
}

.account-method__action {
  margin: 0;
  min-width: 0;
}

.account-methods--future {
  margin-top: 0.75rem;
}

.account-methods--future .account-method {
  padding-block: 0.7rem;
}

.account-methods--future .account-method__name {
  font-weight: 500;
  color: var(--ed-text-secondary);
}

@media (min-width: 560px) {
  .account-method {
    grid-template-columns: minmax(0, 1fr) auto;
  }
}

/* Sessions: the current one is a fact, the rest are one compact line each —
   a long list must not turn the page into an admin table. */
.account-sublabel {
  margin: 0;
  font-family: var(--ed-mono);
  font-size: 0.6875rem;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  color: var(--ed-text-faint);
}

.account-sessions {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  min-width: 0;
}

.account-session-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem 1rem;
  min-width: 0;
  padding: 0.6rem 0;
  border-top: 1px solid var(--acc-hairline);
}

.account-session-row:first-child {
  padding-top: 0;
  border-top: 0;
}

.account-session-row:last-child {
  padding-bottom: 0;
}

.account-session-row__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 0.1rem 1.1rem;
  min-width: 0;
  margin: 0;
  font-size: 0.8125rem;
  color: var(--ed-muted);
}

.account-session-row__time {
  font-family: var(--ed-mono);
  font-size: 0.75rem;
  font-variant-numeric: tabular-nums;
  color: var(--ed-text-secondary);
}

.account-session-row__action {
  margin: 0;
  flex: 0 0 auto;
}

/* One button scale for the whole cabinet: primary, secondary and destructive
   differ in colour only. Controls sit one step taller than buttons. */
.account-body .btn {
  min-height: 2.25rem;
  padding: 0.5rem 1.05rem;
  border-radius: var(--ed-radius);
  font-size: 0.8125rem;
  font-weight: 600;
  line-height: 1.25;
}

.account-body .btn-sm {
  min-height: 2rem;
  padding: 0.35rem 0.8rem;
  font-size: 0.75rem;
}

.account-body .btn:active {
  transform: translateY(1px);
}

.account-body .editorial-input,
.account-body .editorial-select {
  min-height: 2.5rem;
}

@media (prefers-reduced-motion: reduce) {
  .account-stream-tabs__tab {
    transition: none;
  }

  .account-body .btn:active {
    transform: none;
  }
}

@media (min-width: 720px) {
  .account-page {
    --acc-pad: 1.35rem;
    --account-gap: 1.6rem;
    --account-section-gap: 1.4rem;
  }

  .account-editorial-card__head {
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 1rem 1.75rem;
    align-items: center;
  }

  .account-factgrid--2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .account-factgrid--3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .account-factgrid--2 > .account-fact,
  .account-factgrid--3 > .account-fact {
    padding: 0 1.25rem;
    border-top: 0;
    border-left: 1px solid var(--acc-hairline);
  }

  .account-factgrid--2 > .account-fact:first-child,
  .account-factgrid--3 > .account-fact:first-child {
    padding-left: 0;
    border-left: 0;
  }

  .account-factgrid--2 > .account-fact:last-child,
  .account-factgrid--3 > .account-fact:last-child {
    padding-right: 0;
  }
}

@media (min-width: 820px) {
  .account-compare__deck {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 0.85rem 1rem;
    align-items: stretch;
  }
}

@media (max-width: 1199px) {
  .account-body .editorial-header__inner {
    column-gap: 0.4rem;
  }

  .account-body .editorial-header__tools {
    gap: 0.35rem;
  }

  .account-body .editorial-nav-mobile__toggle {
    min-height: 2.25rem;
    min-width: 2.25rem;
    padding: 0 0.65rem;
    line-height: 1;
  }

  .account-body .editorial-nav-mobile__panel a,
  .account-body .editorial-nav-mobile__action {
    min-height: 2.5rem;
    display: flex;
    align-items: center;
  }

  .account-main {
    padding-top: 1rem;
  }
}

/* Shown only when full lockup caption is hidden (see pnp-brand.css @ 899px). */
@media (max-width: 899px) {
  .account-header__space {
    display: block;
  }
}

@media (max-width: 359px) {
  .account-header__space {
    font-size: 0.84rem;
  }

  .account-body .editorial-header__inner {
    column-gap: 0.28rem;
  }

  .account-body .editorial-header__tools {
    gap: 0.25rem;
  }

  .account-body .editorial-theme-toggle {
    width: 2.25rem;
  }
}

.account-editorial__body {
  min-width: 0;
}

@media (min-width: 900px) {
  .account-pair {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    align-items: start;
  }

  .account-pair:has(> :only-child) {
    grid-template-columns: minmax(0, 1fr);
  }

  .account-editorial:has(> .account-card__action) {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 0.75rem 1.5rem;
    align-items: end;
  }

  .account-editorial:has(> .account-card__action) > .account-card__action {
    margin-top: 0;
  }
}

/* Value story: full-width disclosure under Trial / paid comparison. */
.account-value-story {
  padding: 1.15rem var(--acc-pad) 1.25rem;
}

.account-value-story[hidden] {
  display: none;
}

.account-value-story__intro {
  display: grid;
  gap: 1.15rem 2rem;
  min-width: 0;
}

.account-value-story__copy {
  min-width: 0;
  max-width: 36rem;
}

.account-value-story__title {
  margin: 0;
  font-size: 1.0625rem;
  font-weight: 600;
  letter-spacing: -0.022em;
  line-height: 1.3;
  color: var(--ed-text);
}

.account-value-story__copy p,
.account-value-story__close > p,
.account-value-story__list {
  margin: 0.45rem 0 0;
  font-size: 0.875rem;
  line-height: 1.6;
  color: var(--ed-text-secondary);
}

.account-value-story__list {
  padding: 0 0 0 1.15rem;
}

.account-value-story__list li {
  overflow-wrap: anywhere;
}

.account-value-story__list li + li {
  margin-top: 0.35rem;
}

.account-value-story__accent {
  margin: 1.15rem 0 0;
  max-width: 46rem;
  font-size: 0.9375rem;
  font-weight: 600;
  letter-spacing: -0.018em;
  line-height: 1.45;
  color: var(--ed-text);
}

.account-value-story__accent--quiet {
  font-weight: 600;
  color: var(--ed-accent-ink);
}

.account-journey-block {
  margin-top: 1.35rem;
  padding-top: 1.15rem;
  border-top: 1px solid var(--acc-hairline);
}

.account-journey-block__head .account-panel__title {
  margin: 0;
}

.account-journey-block__head .account-panel__note {
  margin-top: 0.3rem;
}

.account-journey__legend {
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem 1.15rem;
  margin: 0.85rem 0 0;
  font-size: 0.75rem;
  color: var(--ed-muted);
}

.account-journey__key {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
}

.account-journey__swatch {
  width: 0.7rem;
  height: 0.7rem;
  border-radius: 999px;
  border: 1px dashed var(--ed-border);
  background: var(--ed-surface-muted);
}

.account-journey__swatch--decision {
  border-color: color-mix(in srgb, var(--ed-accent) 55%, var(--ed-border));
  background: color-mix(in srgb, var(--ed-accent) 8%, var(--ed-surface));
}

.account-journey-wrap {
  --journey-rail: 0.85rem;
  position: relative;
  container-type: inline-size;
  container-name: account-journey;
  margin-top: 1rem;
  min-width: 0;
  padding-inline: var(--journey-rail);
}

.account-journey__path {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  overflow: visible;
  z-index: 0;
  color: color-mix(in srgb, var(--ed-accent) 62%, var(--ed-border));
}

.account-journey {
  --journey-cols: 1;
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(var(--journey-cols), minmax(0, 1fr));
  column-gap: 1.1rem;
  row-gap: 1.5rem;
  position: relative;
  z-index: 1;
}

.account-journey__step {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  min-width: 0;
}

.account-journey__track {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  height: 1.75rem;
  margin-bottom: 0.55rem;
}

.account-journey__marker {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.75rem;
  height: 1.75rem;
  border-radius: 999px;
  border: 1px dashed var(--ed-border);
  background: var(--ed-surface);
  color: var(--ed-text-secondary);
  font-family: var(--ed-mono);
  font-size: 0.6875rem;
  font-weight: 600;
  line-height: 1;
  flex-shrink: 0;
  position: relative;
  z-index: 1;
}

.account-journey__step--decision .account-journey__marker {
  border-color: color-mix(in srgb, var(--ed-accent) 55%, var(--ed-border));
  background: color-mix(in srgb, var(--ed-accent) 10%, var(--ed-surface));
  color: var(--ed-accent-ink);
}

.account-journey__content {
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
  min-width: 0;
}

.account-journey__title {
  font-size: 0.875rem;
  font-weight: 600;
  letter-spacing: -0.01em;
  line-height: 1.35;
  color: var(--ed-text);
}

.account-journey__detail {
  font-size: 0.75rem;
  line-height: 1.5;
  color: var(--ed-muted);
}

.account-value-story__close {
  margin-top: 1.35rem;
  padding-top: 1.15rem;
  border-top: 1px solid var(--acc-hairline);
}

.account-value-story__close .account-value-story__title {
  max-width: 36rem;
}

.account-value-story__close > p {
  max-width: 46rem;
}

.account-value-story__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem;
  align-items: stretch;
  margin-top: 1.05rem;
}

.account-value-story__actions .btn {
  flex: 1 1 11rem;
  justify-content: center;
}

@container account-journey (max-width: 17.99rem) {
  .account-journey__step {
    display: grid;
    grid-template-columns: 1.75rem minmax(0, 1fr);
    column-gap: 0.7rem;
    row-gap: 0.15rem;
  }

  .account-journey__track {
    grid-row: 1 / -1;
    height: auto;
    min-height: 1.75rem;
    margin-bottom: 0;
    align-items: flex-start;
  }
}

@container account-journey (min-width: 18rem) {
  .account-journey {
    --journey-cols: 2;
  }
}

@container account-journey (min-width: 40rem) {
  .account-journey {
    --journey-cols: 3;
  }
}

@media (min-width: 720px) {
  .account-value-story {
    padding: 1.35rem var(--acc-pad) 1.45rem;
  }

  .account-value-story__intro {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    column-gap: 2.25rem;
  }

  .account-value-story__intro > .account-value-story__copy + .account-value-story__copy {
    padding-left: 2.25rem;
    border-left: 1px solid var(--acc-hairline);
  }
}

.account-page-head__back {
  margin: 0 0 0.65rem;
}

.account-plan-grid {
  display: grid;
  gap: 1rem;
  min-width: 0;
}

.account-plan-card {
  min-width: 0;
}

.account-plan-card--current {
  box-shadow: inset 0 0 0 1px var(--ed-accent, #2f6fed);
}

.account-plan-card .account-feature-list {
  margin: 0 0 0.85rem;
}

.account-plan-card__action {
  margin: 0.85rem 0 0;
}

.account-plan-card__action .btn[disabled],
.account-plan-card__action .btn[aria-disabled="true"] {
  cursor: not-allowed;
  opacity: 0.65;
}

@media (min-width: 720px) {
  .account-plan-grid {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  }
}

.account-setup,
.account-capabilities,
.account-plans,
.account-plan {
  min-width: 0;
  max-width: 100%;
}

.account-setup__step {
  margin: 0.35rem 0 0;
  color: var(--ed-muted);
  font-size: 0.82rem;
}

.account-setup__stack {
  min-width: 0;
}

.account-setup__hint {
  margin: 0;
  max-width: 46rem;
}

.account-setup .account-settings-row__control .account-settings-confirm {
  display: flex;
  margin: 0.75rem 0 0;
  max-width: var(--account-form-read, 100%);
}

.account-setup .account-telegram-open {
  width: auto;
  justify-content: center;
  min-height: 2.6rem;
}

.account-setup .account-telegram-actions--primary {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  gap: 0.55rem;
  align-items: center;
}

.account-telegram-actions--primary .account-telegram-link-wrap {
  display: flex;
  margin: 0;
  align-items: center;
}

.account-telegram-followup {
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem;
  align-items: center;
}

.account-telegram-followup[hidden] {
  display: none !important;
}

.account-setup .account-telegram-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem;
  align-items: center;
}

.account-setup .account-telegram-actions .btn {
  min-height: 2.35rem;
}

.account-preview-tools {
  margin: 0.85rem 0 0;
  padding: 0.75rem 0.85rem;
  border: 1px dashed var(--ed-border);
  border-radius: var(--ed-radius);
  background: var(--ed-surface-muted);
  color: var(--ed-muted);
  font-size: 0.82rem;
}

.account-preview-tools__kicker {
  margin: 0 0 0.35rem;
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--ed-muted);
}

.account-preview-tools__body {
  margin: 0 0 0.55rem;
  line-height: 1.45;
}

@media (max-width: 390px) {
  .account-setup .account-telegram-actions--primary .account-telegram-open {
    width: 100%;
  }
}

.account-setup [data-setup-telegram-check].is-idle {
  opacity: 0.55;
}

.account-setup :focus-visible,
.account-plan__cta .btn:focus-visible,
.account-capabilities a:focus-visible {
  outline: 2px solid var(--ed-accent, #c4552a);
  outline-offset: 3px;
}

.account-capabilities__grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 0.75rem;
  margin: 0;
  padding: 1.05rem var(--acc-pad) 1.2rem;
  list-style: none;
}

.account-capabilities__item {
  min-width: 0;
  padding: 1rem 1.05rem 1.05rem;
  border: 1px solid color-mix(in srgb, var(--ed-border) 78%, transparent);
  border-radius: 10px;
  background: color-mix(in srgb, var(--ed-surface) 88%, transparent);
}

.account-capabilities__item .account-feature-list__title,
.account-capabilities__item .account-feature-list__detail {
  display: block;
  overflow-wrap: anywhere;
}

.account-capabilities__item .account-feature-list__detail {
  margin-top: 0.2rem;
}

@media (min-width: 560px) {
  .account-capabilities__grid {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  }
}

.account-plan-current {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem 0.75rem;
  align-items: baseline;
  margin: 0;
}

.account-plan-current__detail {
  color: var(--ed-muted);
  font-size: 0.92rem;
}

.account-page--subscription .account-page-head__title-row {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.55rem 1rem;
  min-width: 0;
}

.account-page--subscription .account-page-head__title-row .account-page-head__title {
  margin: 0;
  flex: 1 1 auto;
  min-width: min(100%, 10rem);
}

.account-page--subscription .account-subscription-notice {
  margin: 0;
  flex: 0 0 auto;
  max-width: 100%;
  padding: 0;
  border: 0;
  background: none;
  color: var(--ed-accent-ink, var(--ed-accent, #c4552a));
  font-size: 0.84rem;
  font-weight: 500;
  line-height: 1.3;
  white-space: nowrap;
  align-self: center;
}

.account-page--subscription .account-page-head {
  gap: 0.45rem;
}

.account-subscription-intro {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 0.75rem 1.35rem;
  min-width: 0;
  padding: 0.95rem 1.1rem;
  border: 1px solid var(--acc-hairline);
  border-radius: var(--pk-radius-card, 0.9rem);
  background: linear-gradient(180deg, #fafbfc 0%, #f3f6fa 100%);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.85),
    0 1px 2px rgba(24, 30, 39, 0.04);
}

.account-subscription-intro__lead,
.account-subscription-intro__features {
  margin: 0;
  min-width: 0;
  color: var(--ed-text-secondary);
  font-size: 0.84rem;
  line-height: 1.52;
  overflow-wrap: anywhere;
}

.account-subscription-intro__lead {
  color: var(--ed-text);
  font-weight: 500;
}

.account-plan-shared {
  margin: 0;
  max-width: 46rem;
  color: var(--ed-text-secondary);
  font-size: 0.875rem;
  line-height: 1.55;
  overflow-wrap: anywhere;
}

.account-subscription-start {
  --account-sub-start-dark: #181e27;
  --account-sub-start-dark-2: #0f141b;
  --account-sub-start-dark-end: #0b0f15;
  position: relative;
  isolation: isolate;
  overflow: hidden;
  width: 100%;
  max-width: none;
  margin: 0.35rem 0 0;
  padding: 1.15rem 1.25rem 1.2rem;
  border: 1px solid rgba(255, 255, 255, 0.06);
  border-radius: var(--pk-radius-card, 0.9rem);
  background:
    radial-gradient(420px 140px at 78% 42%, rgba(222, 90, 27, 0.1), transparent 66%),
    linear-gradient(
      142deg,
      var(--account-sub-start-dark) 0%,
      var(--account-sub-start-dark-2) 68%,
      var(--account-sub-start-dark-end) 100%
    );
  box-shadow: inset 0 1px 0 rgba(232, 236, 242, 0.08);
}

.account-subscription-start__ambient {
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  opacity: 0.88;
}

.account-subscription-start__ambient .account-subscription-start-ambient {
  display: block;
  width: 100%;
  height: 100%;
}

.account-subscription-start__content {
  position: relative;
  z-index: 1;
  min-width: 0;
  max-width: 52rem;
}

.account-subscription-start__title {
  margin: 0;
  color: #f7f8f9;
  font-size: 0.95rem;
  font-weight: 600;
  line-height: 1.35;
  letter-spacing: -0.01em;
}

.account-subscription-start__text {
  margin: 0.5rem 0 0;
  color: #c7cbd1;
  font-size: 0.84rem;
  line-height: 1.55;
  overflow-wrap: anywhere;
}

@media (max-width: 720px) {
  .account-page--subscription .account-subscription-notice {
    flex: 1 1 100%;
    margin-top: 0.2rem;
    align-self: flex-start;
    white-space: normal;
  }

  .account-subscription-intro {
    grid-template-columns: minmax(0, 1fr);
    gap: 0.55rem;
    padding: 0.85rem 0.95rem;
  }
}

.account-plan-intro-note {
  margin: 0;
  max-width: 46rem;
  color: var(--ed-muted);
  font-size: 0.82rem;
  line-height: 1.55;
  overflow-wrap: anywhere;
}

.account-plan-switch {
  display: none;
  width: 100%;
  max-width: 100%;
  margin: 0;
  padding: 0.2rem;
  background: color-mix(in srgb, var(--ed-text) 4%, var(--ed-surface));
  border: 1px solid var(--ed-border);
  border-radius: 999px;
  gap: 0.15rem;
}

.account-plan-switch__tab {
  flex: 1 1 0;
  min-width: 0;
  min-height: 2.125rem;
  padding: 0.35rem 0.7rem;
  border: 0;
  border-radius: 999px;
  background: transparent;
  color: var(--ed-text-secondary);
  font: inherit;
  font-size: 0.8125rem;
  font-weight: 500;
  line-height: 1.3;
  cursor: pointer;
  overflow-wrap: anywhere;
}

.account-plan-switch__tab:hover {
  color: var(--ed-text);
}

.account-plan-switch__tab.is-active {
  background: var(--ed-surface);
  color: var(--ed-text);
  font-weight: 600;
}

.account-plan-switch__tab:focus-visible {
  outline: none;
  box-shadow: 0 0 0 2px var(--ed-accent);
}

.account-plans {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 1rem;
  min-width: 0;
  overflow: visible;
}

.account-plan {
  display: flex;
  flex-direction: column;
  min-width: 0;
  overflow: visible;
  padding: 0;
  background: var(--ed-surface);
  border: 1px solid var(--acc-hairline);
  border-radius: var(--pk-radius-card, 0.9rem);
  transition: border-color 0.18s ease, box-shadow 0.18s ease;
}

.account-plan:hover,
.account-plan:focus-within {
  border-color: var(--ed-border-strong, var(--ed-border));
}

.account-plan.is-open,
.account-plan.is-open:hover,
.account-plan.is-open:focus-within {
  border-color: var(--ed-accent, #c4552a);
  box-shadow: 0 0 0 1px var(--ed-accent, #c4552a);
}

.account-plan__head {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: 0.3rem 0.85rem;
  padding: 1.05rem 1.25rem 0.95rem;
  text-align: left;
  background: color-mix(in srgb, var(--ed-accent, #c4552a) 6%, var(--ed-surface));
  border-bottom: 1px solid var(--acc-hairline);
  border-radius: var(--pk-radius-card, 0.9rem) var(--pk-radius-card, 0.9rem) 0 0;
}

/* Basic plan — premium graphite (calmer sibling to Pro) */
#account-plan-card-basic {
  --account-basic-dark: #181e27;
  --account-basic-dark-2: #0f141b;
  --account-basic-dark-end: #0b0f15;
  --account-basic-panel: #f8fafc;
  --account-basic-panel-end: #f3f6fa;
  --account-basic-panel-ink: #1a2433;
  --account-basic-panel-muted: #5c6778;
  --account-basic-panel-secondary: #4a5564;
  background: var(--account-basic-panel);
}

#account-plan-card-basic .account-plan__head {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  border-bottom: 1px solid rgba(255, 255, 255, 0.07);
  background: linear-gradient(
    165deg,
    var(--account-basic-dark) 0%,
    var(--account-basic-dark-2) 52%,
    var(--account-basic-dark-end) 100%
  );
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

#account-plan-card-basic .account-plan__head-flow {
  position: absolute;
  inset: -10% 0;
  z-index: 0;
  pointer-events: none;
  opacity: 0.91;
  -webkit-mask-image: linear-gradient(
    180deg,
    rgba(0, 0, 0, 0.35) 0%,
    #000 38%,
    #000 100%
  );
  mask-image: linear-gradient(
    180deg,
    rgba(0, 0, 0, 0.35) 0%,
    #000 38%,
    #000 100%
  );
}

#account-plan-card-basic .account-plan__head-flow .account-basic-head-flow {
  display: block;
  width: 100%;
  height: 100%;
}

#account-plan-card-basic .account-plan__head .account-plan__name {
  position: relative;
  z-index: 1;
  color: #f7f8f9;
  font-weight: 700;
  letter-spacing: -0.01em;
  text-shadow: 0 1px 14px rgba(0, 0, 0, 0.38);
}

#account-plan-card-basic .account-plan__head .account-plan__flag {
  position: relative;
  z-index: 1;
  color: #b8bcc4;
  font-weight: 600;
  text-shadow: 0 1px 12px rgba(0, 0, 0, 0.32);
  background: none;
  border: 0;
}

#account-plan-card-basic .account-plan__body {
  position: relative;
  color: var(--account-basic-panel-ink);
  background: linear-gradient(
    180deg,
    var(--account-basic-panel) 0%,
    var(--account-basic-panel-end) 96%,
    #eef1f5 100%
  );
  box-shadow: inset 0 -10px 14px -12px rgba(24, 30, 39, 0.06);
}

#account-plan-card-basic .account-plan__position {
  color: var(--account-basic-panel-ink);
}

#account-plan-card-basic .account-plan__offer,
#account-plan-card-basic .account-plan__price-period,
#account-plan-card-basic .account-plan__renewal,
#account-plan-card-basic .account-plan__hint {
  color: var(--account-basic-panel-muted);
}

#account-plan-card-basic .account-plan__price-block,
#account-plan-card-basic .account-plan__benefits,
#account-plan-card-basic .account-plan__benefits li {
  border-color: rgba(26, 36, 51, 0.1);
}

#account-plan-card-basic .account-plan__cta {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  margin-top: auto;
  padding: 1.55rem 1.25rem 1.12rem;
  border-top: 1px solid rgba(24, 30, 39, 0.1);
  border-radius: 0 0 var(--pk-radius-card, 0.9rem) var(--pk-radius-card, 0.9rem);
  background: linear-gradient(
    180deg,
    var(--account-basic-dark-2) 0%,
    var(--account-basic-dark) 52%,
    var(--account-basic-dark-end) 100%
  );
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05);
}

#account-plan-card-basic .account-plan__cta-ambient {
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  opacity: 0.91;
  -webkit-mask-image:
    linear-gradient(
      180deg,
      transparent 0%,
      rgba(0, 0, 0, 0.16) 6%,
      #000 14%,
      #000 72%,
      rgba(0, 0, 0, 0.55) 86%,
      rgba(0, 0, 0, 0.22) 100%
    );
  mask-image: linear-gradient(
    180deg,
    transparent 0%,
    rgba(0, 0, 0, 0.16) 6%,
    #000 14%,
    #000 72%,
    rgba(0, 0, 0, 0.55) 86%,
    rgba(0, 0, 0, 0.22) 100%
  );
}

#account-plan-card-basic .account-plan__cta-ambient .account-basic-cta-ambient {
  display: block;
  width: 100%;
  height: 100%;
}

#account-plan-card-basic .account-plan__cta > form,
#account-plan-card-basic .account-plan__cta > .btn,
#account-plan-card-basic .account-plan__cta > .account-plan__more {
  position: relative;
  z-index: 1;
}

#account-plan-card-basic .account-plan__more {
  color: #dce1e8;
}

#account-plan-card-basic .account-plan__more:hover {
  color: #f2f4f7;
}

#account-plan-card-basic .account-plan__more[aria-expanded="true"] {
  color: #f08a45;
}

@media (max-width: 799px) {
  #account-plan-card-basic .account-plan__head-flow {
    inset: -8% 0;
    opacity: 0.82;
  }
}

/* Pro plan — premium composition (lp-ctaband palette; experimental) */
#account-plan-card-pro {
  --account-pro-dark: #181e27;
  --account-pro-dark-2: #0f141b;
  --account-pro-dark-end: #0b0f15;
  --account-pro-ember: rgba(222, 90, 27, 0.2);
  --account-pro-panel: #f8fafc;
  --account-pro-panel-end: #f3f6fa;
  --account-pro-panel-ink: #1a2433;
  --account-pro-panel-muted: #5c6778;
  --account-pro-panel-secondary: #4a5564;
  background: var(--account-pro-panel);
}

#account-plan-card-pro .account-plan__head {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  border-bottom: 1px solid rgba(255, 255, 255, 0.07);
  background:
    radial-gradient(360px 120px at 72% 58%, var(--account-pro-ember), transparent 68%),
    radial-gradient(280px 100px at 88% 22%, rgba(240, 138, 69, 0.08), transparent 70%),
    linear-gradient(140deg, var(--account-pro-dark) 0%, var(--account-pro-dark-2) 68%, var(--account-pro-dark-end) 100%);
  box-shadow:
    inset 0 1px 0 rgba(232, 236, 242, 0.14),
    inset 0 2px 12px rgba(180, 192, 208, 0.04);
}

#account-plan-card-pro .account-plan__head::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  border-radius: inherit;
  background: linear-gradient(
    118deg,
    rgba(214, 222, 232, 0.11) 0%,
    rgba(200, 210, 222, 0.04) 16%,
    transparent 34%
  );
}

#account-plan-card-pro .account-plan__head-flow {
  position: absolute;
  inset: -4% 0;
  z-index: 0;
  pointer-events: none;
  opacity: 0.88;
  -webkit-mask-image: linear-gradient(90deg, transparent 0%, rgba(0, 0, 0, 0.2) 14%, #000 30%, #000 100%);
  mask-image: linear-gradient(90deg, transparent 0%, rgba(0, 0, 0, 0.2) 14%, #000 30%, #000 100%);
}

#account-plan-card-pro .account-plan__head-flow .account-pro-head-flow {
  display: block;
  width: 100%;
  height: 100%;
}

#account-plan-card-pro .account-plan__head .account-plan__name {
  position: relative;
  z-index: 1;
  color: #f7f8f9;
  font-weight: 700;
  letter-spacing: -0.01em;
}

#account-plan-card-pro .account-plan__head .account-plan__flag {
  position: relative;
  z-index: 1;
  color: #f0a463;
  font-weight: 500;
}

#account-plan-card-pro .account-plan__body {
  position: relative;
  color: var(--account-pro-panel-ink);
  background: linear-gradient(
    180deg,
    var(--account-pro-panel) 0%,
    var(--account-pro-panel-end) 96%,
    #eef1f5 100%
  );
  box-shadow: inset 0 -10px 14px -12px rgba(24, 30, 39, 0.07);
}

#account-plan-card-pro .account-plan__position {
  color: var(--account-pro-panel-ink);
}

#account-plan-card-pro .account-plan__offer,
#account-plan-card-pro .account-plan__price-period,
#account-plan-card-pro .account-plan__renewal,
#account-plan-card-pro .account-plan__hint {
  color: var(--account-pro-panel-muted);
}

#account-plan-card-pro .account-plan__price-was {
  color: var(--account-pro-panel-secondary);
}

#account-plan-card-pro .account-plan__price-block,
#account-plan-card-pro .account-plan__benefits,
#account-plan-card-pro .account-plan__benefits li {
  border-color: rgba(26, 36, 51, 0.1);
}

#account-plan-card-pro .account-plan__cta {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  margin-top: auto;
  padding: 1.55rem 1.25rem 1.12rem;
  border-top: 1px solid rgba(24, 30, 39, 0.1);
  border-radius: 0 0 var(--pk-radius-card, 0.9rem) var(--pk-radius-card, 0.9rem);
  background:
    radial-gradient(340px 130px at 58% 8%, rgba(222, 90, 27, 0.13), transparent 62%),
    radial-gradient(280px 120px at 50% 46%, rgba(224, 127, 49, 0.1), transparent 66%),
    radial-gradient(220px 100px at 88% 52%, rgba(240, 164, 94, 0.09), transparent 68%),
    linear-gradient(
      180deg,
      var(--account-pro-dark-2) 0%,
      var(--account-pro-dark) 52%,
      var(--account-pro-dark-end) 100%
    );
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05);
}

#account-plan-card-pro .account-plan__cta::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background: linear-gradient(165deg, rgba(240, 138, 69, 0.07) 0%, transparent 42%);
}

#account-plan-card-pro .account-plan__cta-ambient {
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  opacity: 0.92;
}

#account-plan-card-pro .account-plan__cta-ambient .account-pro-cta-ambient {
  display: block;
  width: 100%;
  height: 100%;
}

#account-plan-card-pro .account-plan__cta > form,
#account-plan-card-pro .account-plan__cta > .btn,
#account-plan-card-pro .account-plan__cta > .account-plan__more {
  position: relative;
  z-index: 1;
}

#account-plan-card-pro .account-plan__more {
  color: #dce1e8;
}

#account-plan-card-pro .account-plan__more:hover {
  color: #f2f4f7;
}

#account-plan-card-pro .account-plan__more[aria-expanded="true"] {
  color: #f08a45;
}

@media (max-width: 799px) {
  #account-plan-card-pro .account-plan__head-flow {
    inset: -8% 0;
    opacity: 0.82;
    -webkit-mask-image: linear-gradient(90deg, transparent 0%, rgba(0, 0, 0, 0.15) 10%, #000 26%, #000 100%);
    mask-image: linear-gradient(90deg, transparent 0%, rgba(0, 0, 0, 0.15) 10%, #000 26%, #000 100%);
  }
}

/* Subscription page — dark theme (light theme unchanged) */
html[data-theme="dark"] .account-page--subscription .account-subscription-intro {
  border-color: rgba(232, 230, 225, 0.09);
  background: linear-gradient(180deg, #232221 0%, #1f1e1d 100%);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.04),
    0 1px 2px rgba(0, 0, 0, 0.22);
}

html[data-theme="dark"] .account-page--subscription .account-subscription-intro__lead {
  color: #e8e6e1;
}

html[data-theme="dark"] .account-page--subscription .account-subscription-intro__features {
  color: #b4b1aa;
}

html[data-theme="dark"] .account-page--subscription .account-plan {
  border-color: rgba(232, 230, 225, 0.1);
}

html[data-theme="dark"] .account-page--subscription .account-plan:hover,
html[data-theme="dark"] .account-page--subscription .account-plan:focus-within {
  border-color: rgba(232, 230, 225, 0.14);
}

html[data-theme="dark"] .account-page--subscription #account-plan-card-basic,
html[data-theme="dark"] .account-page--subscription #account-plan-card-pro {
  background: #2e3034;
}

html[data-theme="dark"] .account-page--subscription #account-plan-card-basic .account-plan__body,
html[data-theme="dark"] .account-page--subscription #account-plan-card-pro .account-plan__body {
  color: #eceae6;
  background:
    radial-gradient(120% 70% at 50% 0%, rgba(229, 106, 42, 0.035), transparent 58%),
    linear-gradient(180deg, #303238 0%, #2d2f33 55%, #292b2f 100%);
  box-shadow: none;
}

html[data-theme="dark"] .account-page--subscription #account-plan-card-basic .account-plan__position,
html[data-theme="dark"] .account-page--subscription #account-plan-card-pro .account-plan__position,
html[data-theme="dark"] .account-page--subscription #account-plan-card-basic .account-plan__price-now,
html[data-theme="dark"] .account-page--subscription #account-plan-card-pro .account-plan__price-now {
  color: #f5f3ef;
}

html[data-theme="dark"] .account-page--subscription #account-plan-card-basic .account-plan__offer,
html[data-theme="dark"] .account-page--subscription #account-plan-card-pro .account-plan__offer,
html[data-theme="dark"] .account-page--subscription #account-plan-card-basic .account-plan__price-period,
html[data-theme="dark"] .account-page--subscription #account-plan-card-pro .account-plan__price-period,
html[data-theme="dark"] .account-page--subscription #account-plan-card-basic .account-plan__renewal,
html[data-theme="dark"] .account-page--subscription #account-plan-card-pro .account-plan__renewal,
html[data-theme="dark"] .account-page--subscription #account-plan-card-basic .account-plan__hint,
html[data-theme="dark"] .account-page--subscription #account-plan-card-pro .account-plan__hint {
  color: #b4b1aa;
}

html[data-theme="dark"] .account-page--subscription #account-plan-card-pro .account-plan__price-was,
html[data-theme="dark"] .account-page--subscription #account-plan-card-basic .account-plan__price-was {
  color: #94918b;
}

html[data-theme="dark"] .account-page--subscription #account-plan-card-basic .account-plan__price-block,
html[data-theme="dark"] .account-page--subscription #account-plan-card-pro .account-plan__price-block,
html[data-theme="dark"] .account-page--subscription #account-plan-card-basic .account-plan__benefits,
html[data-theme="dark"] .account-page--subscription #account-plan-card-pro .account-plan__benefits,
html[data-theme="dark"] .account-page--subscription #account-plan-card-basic .account-plan__benefits li,
html[data-theme="dark"] .account-page--subscription #account-plan-card-pro .account-plan__benefits li {
  border-color: rgba(232, 230, 225, 0.11);
}

html[data-theme="dark"] .account-page--subscription #account-plan-card-basic .account-plan__cta,
html[data-theme="dark"] .account-page--subscription #account-plan-card-pro .account-plan__cta {
  border-top-color: rgba(232, 230, 225, 0.08);
}

html[data-theme="dark"] .account-page--subscription .account-help--plan .account-help__toggle {
  color: #94918b;
}

html[data-theme="dark"] .account-page--subscription .account-help--plan .account-help__toggle:hover {
  color: #d4d0c8;
}

html[data-theme="dark"] .account-page--subscription .account-subscription-start {
  border-color: rgba(232, 230, 225, 0.1);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.05),
    0 10px 28px rgba(0, 0, 0, 0.28);
}

html[data-theme="dark"] .account-page--subscription .account-subscription-start__text {
  color: #c9c7c2;
}

.account-plan__name {
  flex: 1 1 auto;
  min-width: 7rem;
  margin: 0;
  font-size: 1.35rem;
  line-height: 1.2;
  text-align: left;
}

.account-plan__flag {
  flex: 0 1 auto;
  display: block;
  margin: 0;
  max-width: 100%;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: none;
  color: var(--ed-accent-ink, var(--ed-accent));
  font-size: 0.78rem;
  font-weight: 600;
  line-height: 1.35;
  text-align: right;
  overflow-wrap: anywhere;
}

.account-plan__body {
  --account-plan-body-pad-x: 1.25rem;
  --account-plan-section-gap: 1rem;
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  gap: 0;
  min-width: 0;
  padding: 1.1rem var(--account-plan-body-pad-x) 0.35rem;
  background: var(--ed-surface);
}

.account-plan__position {
  margin: var(--account-plan-section-gap) 0 0;
  color: var(--ed-text);
  font-size: 0.925rem;
  font-weight: 600;
  line-height: 1.38;
  letter-spacing: -0.01em;
  overflow-wrap: anywhere;
}

.account-plan__price-block {
  display: flex;
  flex-direction: column;
  gap: 0.12rem;
  padding: 0 0 1.05rem;
  margin: 0;
  border-bottom: 1px solid var(--acc-hairline);
}

.account-plan__price-regular {
  margin: 0;
  line-height: 1.3;
}

.account-plan__price-was {
  color: var(--ed-text-secondary);
  font-size: 0.84rem;
  font-weight: 500;
  text-decoration: line-through;
  text-decoration-thickness: 1px;
}

.account-plan__price-intro {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 0.28rem 0.45rem;
  margin: 0.1rem 0 0;
}

.account-plan__price-now {
  font-size: 1.62rem;
  font-weight: 700;
  line-height: 1.12;
  letter-spacing: -0.025em;
}

.account-plan__price-period {
  color: var(--ed-muted);
  font-size: 0.8rem;
  font-weight: 500;
  line-height: 1.35;
}

.account-plan__discount {
  display: block;
  margin: 0;
  padding: 0;
  border-radius: 0;
  background: none;
  color: var(--ed-accent-ink, var(--ed-accent));
  font-size: 0.76rem;
  font-weight: 600;
  line-height: 1.35;
  letter-spacing: 0.01em;
  max-width: 100%;
  overflow-wrap: anywhere;
}

.account-plan__renewal {
  margin: 0.18rem 0 0;
  color: var(--ed-text-secondary);
  font-size: 0.8rem;
  line-height: 1.42;
  overflow-wrap: anywhere;
}

.account-plan__offer {
  margin: 0.38rem 0 0;
  color: var(--ed-muted);
  font-size: 0.84rem;
  line-height: 1.48;
  overflow-wrap: anywhere;
}

.account-plan__benefits {
  flex: 1 1 auto;
  margin: 0.78rem 0 1.1rem;
  padding: 0 0 0.15rem;
  list-style: none;
  background: transparent;
  border-top: 1px solid var(--acc-hairline);
  border-bottom: 1px solid var(--acc-hairline);
}

.account-plan__benefits li {
  position: relative;
  display: flex;
  align-items: flex-start;
  gap: 0.45rem;
  margin: 0;
  padding: 0.5rem 0 0.5rem 1.12rem;
  border-top: 1px solid var(--acc-hairline);
  font-size: 0.875rem;
  line-height: 1.42;
  overflow: visible;
}

.account-plan__benefits li:first-child {
  border-top: 0;
}

.account-plan__benefit-text {
  flex: 1 1 auto;
  min-width: 0;
  overflow-wrap: anywhere;
}

.account-plan__benefits li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.88rem;
  width: 0.4rem;
  height: 0.4rem;
  border-radius: 50%;
  background: var(--ed-accent, #c4552a);
}

.account-plan__benefit--stream .account-help {
  margin-top: 0.05rem;
}

.account-plan__hint {
  margin: 0.65rem 0 0;
  color: var(--ed-muted);
  font-size: 0.82rem;
  line-height: 1.45;
}

.account-plan__cta {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 0.7rem;
  margin-top: auto;
  padding: 1.1rem 1.25rem 1.2rem;
}

.account-plan__cta form {
  min-width: 0;
  width: 100%;
}

.account-plan__cta .btn {
  width: 100%;
  min-width: 0;
  justify-content: center;
}

.account-plan__more {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  align-self: center;
  min-height: 2.25rem;
  margin: 0;
  padding: 0.25rem 0.45rem;
  border: 0;
  background: transparent;
  color: var(--ed-text-secondary);
  font: inherit;
  font-size: 0.875rem;
  font-weight: 500;
  line-height: 1.4;
  text-decoration: none;
  cursor: pointer;
}

.account-plan__more::after {
  content: "";
  width: 0.38rem;
  height: 0.38rem;
  margin: -0.12rem 0 0 0.4rem;
  border-right: 1.5px solid currentColor;
  border-bottom: 1.5px solid currentColor;
  transform: rotate(45deg);
}

.account-plan__more:hover {
  color: var(--ed-text);
}

.account-plan__more[aria-expanded="true"] {
  color: var(--ed-accent-ink, var(--ed-accent));
}

.account-plan__more[aria-expanded="true"]::after {
  margin-top: 0.15rem;
  transform: rotate(225deg);
}

.account-plan__more:focus-visible {
  outline: 2px solid var(--ed-accent, #c4552a);
  outline-offset: 3px;
}

@media (max-width: 420px) {
  .account-plan__flag {
    flex-basis: 100%;
    text-align: left;
  }

}

.account-plan-footnote {
  margin: 0.35rem 0 0;
  max-width: 36rem;
  color: var(--ed-muted);
  font-size: 0.82rem;
  line-height: 1.5;
}

@media (min-width: 800px) {
  .account-plan-switch {
    display: none;
  }

  .account-plans {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    align-items: stretch;
    overflow: visible;
  }

  .account-plan {
    height: 100%;
  }
}

@media (max-width: 799px) {
  .account-plan-switch {
    display: flex;
  }

  .account-plans[data-visible-plan="basic"] .account-plan:not([data-plan-id="basic"]),
  .account-plans[data-visible-plan="pro"] .account-plan:not([data-plan-id="pro"]) {
    display: none;
  }

  .account-plan {
    height: auto;
  }

  .account-plan__body {
    padding-bottom: 0.2rem;
  }

  .account-plan__position {
    margin-top: 0.9rem;
  }

  .account-plan__benefits {
    flex: 0 0 auto;
    margin: 0.65rem 0 0.95rem;
  }

  .account-plan__benefits li {
    padding: 0.42rem 0 0.42rem 1.12rem;
  }

  .account-plan__cta {
    margin-top: 0;
  }
}

.account-page--subscription .account-value-story {
  min-width: 0;
}

.account-page--subscription .account-value-story__actions form {
  min-width: 0;
}

.account-page--subscription .account-value-story__actions .btn {
  flex: 0 1 auto;
  min-width: 10.5rem;
  max-width: 100%;
}

@media (max-width: 399px) {
  .account-page--subscription .account-value-story__actions,
  .account-page--subscription .account-value-story__actions form {
    width: 100%;
  }

  .account-page--subscription .account-value-story__actions .btn {
    width: 100%;
    min-width: 0;
  }
}

/* ── Cabinet surfaces v3: brand flow / calm silver / rare accent ─────── */

html[data-theme="dark"] .account-body {
  --acc-canvas: var(--ed-bg);
  --acc-section: color-mix(in srgb, var(--ed-surface) 88%, #14171c);
  --acc-section-end: color-mix(in srgb, var(--ed-surface-muted) 82%, #101318);
  --acc-card: color-mix(in srgb, var(--ed-surface) 72%, #262c35);
  --acc-card-raised: color-mix(in srgb, var(--ed-surface) 78%, #2c323c);
  --acc-card-muted: color-mix(in srgb, var(--ed-surface-muted) 80%, #1a1f27);
  --acc-muted-surface: color-mix(in srgb, var(--ed-surface-muted) 65%, #151920);
  --acc-hairline: color-mix(in srgb, var(--ed-border) 58%, transparent);
  --acc-border-section: color-mix(in srgb, var(--ed-border) 72%, #2a2e36);
  --acc-shadow-section: 0 1px 0 color-mix(in srgb, #000 28%, transparent);
  --acc-shadow-card: 0 1px 2px color-mix(in srgb, #000 32%, transparent);
  --acc-surface-silver: color-mix(in srgb, var(--ed-surface-muted) 52%, #242b34);
  --acc-surface-silver-end: color-mix(in srgb, var(--ed-surface-muted) 42%, #1a2129);
  --acc-surface-accent: color-mix(in srgb, var(--ed-surface-muted) 48%, #2a313a);
  --acc-surface-accent-end: color-mix(in srgb, var(--ed-surface-muted) 38%, #222830);
  --acc-hero-border: color-mix(in srgb, var(--pk-dark, #181e27) 42%, #3a3632);
  --acc-hero-bg: linear-gradient(
    168deg,
    color-mix(in srgb, var(--pk-dark, #181e27) 94%, #1c2128) 0%,
    color-mix(in srgb, var(--pk-dark, #181e27) 90%, #14181e) 48%,
    color-mix(in srgb, var(--pk-dark, #181e27) 88%, #0f1216) 100%
  );
  --acc-hero-glow: 0 1px 0 color-mix(in srgb, #fff 5%, transparent),
    0 10px 24px color-mix(in srgb, #000 38%, transparent);
}

html[data-theme="dark"] body.account-body::before {
  content: none;
  display: none;
}

.account-surface {
  position: relative;
  isolation: isolate;
}

.account-surface--work {
  background: var(--acc-surface-work);
}

.account-surface--brand-calm {
  overflow: hidden;
  border-color: color-mix(in srgb, var(--ed-border) 82%, transparent);
  background: linear-gradient(
    168deg,
    color-mix(in srgb, var(--acc-surface-silver) 92%, var(--ed-surface)) 0%,
    var(--acc-surface-silver-end) 100%
  );
  box-shadow: inset 0 1px 0 color-mix(in srgb, var(--ed-surface) 65%, transparent);
}

.account-surface--brand-flow {
  overflow: hidden;
  border-color: color-mix(in srgb, var(--ed-border-strong, var(--ed-border)) 75%, transparent);
  background: linear-gradient(
    158deg,
    color-mix(in srgb, var(--acc-surface-silver) 88%, #e8ebf0) 0%,
    var(--acc-surface-silver) 42%,
    var(--acc-surface-silver-end) 100%
  );
  box-shadow:
    inset 0 1px 0 color-mix(in srgb, var(--ed-surface) 80%, transparent),
    0 1px 0 color-mix(in srgb, var(--ed-border) 35%, transparent);
}

.account-surface--brand-streams {
  overflow: hidden;
  background: linear-gradient(
    172deg,
    color-mix(in srgb, var(--acc-surface-silver) 90%, var(--ed-surface)) 0%,
    color-mix(in srgb, var(--acc-surface-silver-end) 85%, #d8dce4) 100%
  );
}

.account-surface--brand-accent {
  overflow: hidden;
  border-color: color-mix(in srgb, var(--pk-dark, #181e27) 12%, var(--ed-border));
  background: linear-gradient(
    155deg,
    color-mix(in srgb, var(--acc-surface-accent, var(--acc-surface-silver)) 70%, #dfe3ea) 0%,
    var(--acc-surface-silver) 38%,
    var(--acc-surface-silver-end) 100%
  );
}

.account-surface--brand-assistant {
  overflow: hidden;
  margin: 0 var(--acc-pad) 1.15rem;
  padding: 1.05rem 1.1rem 1.12rem;
  border: 1px solid color-mix(in srgb, var(--ed-border-strong, var(--ed-border)) 78%, transparent);
  border-radius: 12px;
  background: linear-gradient(
    165deg,
    color-mix(in srgb, var(--acc-surface-silver) 86%, var(--ed-surface)) 0%,
    color-mix(in srgb, var(--acc-surface-silver-end) 80%, #e4e8ee) 100%
  );
}

.account-surface__ambient {
  position: absolute;
  z-index: 0;
  pointer-events: none;
  overflow: hidden;
}

.account-surface__ambient svg {
  display: block;
  width: 100%;
  height: 100%;
}

.account-surface__ambient--editorial {
  inset: -8% -6% -4% -4%;
  opacity: 0.88;
  -webkit-mask-image: linear-gradient(
    115deg,
    transparent 0%,
    transparent 38%,
    rgba(0, 0, 0, 0.35) 52%,
    #000 68%,
    #000 100%
  );
  mask-image: linear-gradient(
    115deg,
    transparent 0%,
    transparent 38%,
    rgba(0, 0, 0, 0.35) 52%,
    #000 68%,
    #000 100%
  );
}

.account-surface__ambient--capabilities {
  inset: -12% -10% auto -10%;
  height: 42%;
  opacity: 0.52;
  -webkit-mask-image: linear-gradient(180deg, #000 0%, #000 55%, transparent 100%);
  mask-image: linear-gradient(180deg, #000 0%, #000 55%, transparent 100%);
}

.account-surface__ambient--streams {
  inset: -6% -12% -6% -18%;
  opacity: 0.62;
  -webkit-mask-image: linear-gradient(
    90deg,
    #000 0%,
    #000 32%,
    rgba(0, 0, 0, 0.4) 48%,
    transparent 62%
  );
  mask-image: linear-gradient(
    90deg,
    #000 0%,
    #000 32%,
    rgba(0, 0, 0, 0.4) 48%,
    transparent 62%
  );
}

.account-surface__ambient--assistant {
  inset: auto -8% -28% -8%;
  height: 72%;
  opacity: 0.48;
  -webkit-mask-image: linear-gradient(0deg, transparent 0%, rgba(0, 0, 0, 0.35) 35%, #000 58%);
  mask-image: linear-gradient(0deg, transparent 0%, rgba(0, 0, 0, 0.35) 35%, #000 58%);
}

.account-surface__ambient--telegram {
  inset: -10% -14% -10% 35%;
  opacity: 0.78;
  -webkit-mask-image: linear-gradient(
    90deg,
    transparent 0%,
    rgba(0, 0, 0, 0.25) 42%,
    #000 58%,
    #000 100%
  );
  mask-image: linear-gradient(
    90deg,
    transparent 0%,
    rgba(0, 0, 0, 0.25) 42%,
    #000 58%,
    #000 100%
  );
}

.account-surface--brand-flow > .account-panel__head,
.account-surface--brand-flow > .account-editorial-card__head,
.account-surface--brand-flow > .account-panel__meta,
.account-surface--brand-flow > .account-panel__body,
.account-surface--brand-calm > .account-panel__head,
.account-surface--brand-calm > .account-panel__body,
.account-surface--brand-streams > .account-panel__head,
.account-surface--brand-streams > .account-panel__body,
.account-surface--brand-streams > .account-panel__footnote,
.account-surface--brand-accent > .account-panel__head,
.account-surface--brand-accent > .account-panel__body,
.account-surface--brand-accent > .account-telegram-hero__status,
.account-surface--brand-accent > .account-telegram-actions,
.account-surface--brand-accent > .account-preview-tools,
.account-capabilities > .account-capabilities__grid,
.account-capabilities > .account-assistant-announce,
.account-assistant-announce__copy,
.account-compare--trial-framed > .account-compare__deck {
  position: relative;
  z-index: 1;
}

.account-editorial-card {
  padding-bottom: 0.15rem;
}

.account-editorial-card__head,
.account-editorial-card__name,
.account-editorial-card__copy {
  position: relative;
  z-index: 1;
}

.account-editorial-card .account-panel__meta--work {
  margin: 0 var(--acc-pad) 1.05rem;
  padding: 0.85rem 1rem;
  border: 1px solid color-mix(in srgb, var(--ed-border) 80%, transparent);
  border-radius: 10px;
  background: var(--ed-surface);
  box-shadow: 0 1px 0 color-mix(in srgb, var(--ed-border) 45%, transparent);
}

.account-page-head__title {
  font-size: clamp(1.35rem, 1.15rem + 0.7vw, 1.6rem);
}

.account-capabilities__item {
  background: var(--ed-surface);
  box-shadow: 0 1px 0 color-mix(in srgb, var(--ed-border) 40%, transparent);
}

.account-assistant-announce__head {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.55rem 1rem;
}

.account-assistant-announce__title {
  margin: 0;
  max-width: 34rem;
  font-size: 0.98rem;
  font-weight: 600;
  letter-spacing: -0.018em;
  line-height: 1.35;
}

.account-assistant-announce__lead {
  margin: 0.65rem 0 0;
  max-width: 44rem;
  font-size: 0.875rem;
  line-height: 1.55;
  color: var(--ed-text);
}

.account-assistant-announce__note {
  margin: 0.5rem 0 0;
  max-width: 44rem;
  font-size: 0.8125rem;
  line-height: 1.5;
  color: var(--ed-muted);
}

.account-stream-sheet {
  min-width: 0;
  padding: 1.05rem 1.1rem 1.15rem;
  border: 1px solid color-mix(in srgb, var(--ed-border) 80%, transparent);
  border-radius: 12px;
  background: var(--ed-surface);
  box-shadow: 0 1px 0 color-mix(in srgb, var(--ed-border) 38%, transparent);
}

.account-stream-sheet__name {
  margin: 0 0 0.4rem;
  font-size: 1.05rem;
  font-weight: 600;
  letter-spacing: -0.02em;
}

.account-stream-empty {
  margin-top: 0.85rem;
  padding: 0.85rem 0.9rem;
  border-radius: 9px;
  background: color-mix(in srgb, var(--ed-surface-muted) 55%, var(--ed-surface));
}

.account-stream-empty__title {
  margin: 0;
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--ed-text);
}

.account-stream-empty .account-stream-tabs__empty {
  margin: 0.3rem 0 0;
}

.account-readiness-card {
  display: grid;
  gap: 0.85rem;
  min-width: 0;
}

.account-readiness-card__intro {
  display: grid;
  gap: 0.25rem;
  min-width: 0;
}

.account-status-grid {
  gap: 0.75rem;
}

.account-status-card {
  min-width: 0;
  padding: 0.95rem 1rem 1rem;
  border: 1px solid color-mix(in srgb, var(--ed-border) 80%, transparent);
  border-radius: 12px;
}

.account-readiness-card .account-status-card.account-surface--brand-calm {
  background: linear-gradient(
    168deg,
    color-mix(in srgb, var(--acc-surface-silver) 55%, var(--ed-surface)) 0%,
    color-mix(in srgb, var(--acc-surface-silver-end) 40%, var(--ed-surface)) 100%
  );
}

.account-readiness-card .account-status-card .account-fact__action {
  margin-top: 0.7rem;
}

.account-telegram-hero__status {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.45rem 1rem;
  margin: 0 var(--acc-pad);
  padding: 0.75rem 0.95rem;
  border: 1px solid color-mix(in srgb, var(--ed-border) 80%, transparent);
  border-radius: 10px;
  background: var(--ed-surface);
  box-shadow: 0 1px 0 color-mix(in srgb, var(--ed-border) 40%, transparent);
}

.account-telegram-hero .account-panel__body {
  position: relative;
  z-index: 1;
}

.account-notify-kinds .account-status-card {
  background: var(--ed-surface);
  box-shadow: 0 1px 0 color-mix(in srgb, var(--ed-border) 38%, transparent);
}

.account-settings-row--readonly.account-surface--brand-calm {
  padding: 0.75rem 0.85rem;
  border-radius: 10px;
  background: linear-gradient(
    168deg,
    color-mix(in srgb, var(--acc-surface-silver) 50%, var(--ed-surface)) 0%,
    color-mix(in srgb, var(--acc-surface-silver-end) 35%, var(--ed-surface)) 100%
  );
}

.account-identity-future.account-surface--brand-calm {
  padding: 0.85rem 0.95rem;
  border-radius: 10px;
  background: linear-gradient(
    168deg,
    color-mix(in srgb, var(--acc-surface-silver) 45%, var(--ed-surface-muted)) 0%,
    color-mix(in srgb, var(--acc-surface-silver-end) 30%, var(--ed-surface-muted)) 100%
  );
}

.account-settings-group {
  min-width: 0;
}

.account-tz-suggest:not([hidden]) {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.45rem 0.7rem;
  margin-top: 0.55rem;
  padding: 0.65rem 0.75rem;
  border: 1px solid color-mix(in srgb, var(--ed-accent) 28%, var(--ed-border));
  border-radius: 9px;
  background: color-mix(in srgb, var(--ed-accent) 7%, var(--ed-surface));
  color: var(--ed-text);
}

.account-settings-footer__note {
  margin: 0 0 0.65rem;
  max-width: 24rem;
  font-size: 0.8125rem;
  line-height: 1.45;
  color: var(--ed-muted);
}

.account-settings-footer .btn[data-profile-save]:disabled {
  opacity: 0.52;
  filter: saturate(0.75);
}

.account-settings-footer .btn[data-profile-save]:not(:disabled) {
  min-width: 8.5rem;
}

.account-session-current {
  padding: 0.85rem 0.95rem;
  border: 1px solid var(--acc-hairline);
  border-radius: 10px;
  background: var(--ed-surface-muted);
}

.account-identity-future {
  opacity: 0.88;
}

.account-method--unavailable {
  background: transparent;
}

.account-logout-panel {
  background: var(--acc-surface-work);
}

@media (min-width: 720px) {
  .account-status-grid.account-factgrid--3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .account-status-grid.account-factgrid--3 > .account-fact,
  .account-readiness-card .account-status-grid > .account-fact {
    padding: 0.95rem 1rem 1rem;
    border-left: 0;
    border-top: 1px solid color-mix(in srgb, var(--ed-border) 80%, transparent);
  }

  .account-settings-footer__note {
    margin: 0;
    grid-column: 1;
    align-self: center;
  }
}

@media (max-width: 719px) {
  .account-editorial-card__head {
    display: grid;
    gap: 0.85rem;
  }

  .account-editorial-card__action .btn {
    width: 100%;
    justify-content: center;
  }

  .account-stream-tabs__list {
    width: 100%;
  }

  .account-assistant-announce {
    margin-inline: var(--acc-pad);
  }
}

/* Overview-only calibration: stronger brand ambient vs landing-derived SVG density */
.account-page--overview .account-surface__ambient--editorial {
  inset: -6% -4% -10% 22%;
  opacity: 1;
  -webkit-mask-image: linear-gradient(
    108deg,
    transparent 0%,
    transparent 42%,
    rgba(0, 0, 0, 0.2) 54%,
    #000 66%,
    #000 100%
  );
  mask-image: linear-gradient(
    108deg,
    transparent 0%,
    transparent 42%,
    rgba(0, 0, 0, 0.2) 54%,
    #000 66%,
    #000 100%
  );
}

.account-page--overview .account-surface__ambient--trial-compare {
  inset: -14% -5% -16% -5%;
  height: auto;
  opacity: 0.94;
  -webkit-mask-image: linear-gradient(
    180deg,
    #000 0%,
    #000 28%,
    rgba(0, 0, 0, 0.72) 46%,
    rgba(0, 0, 0, 0.38) 58%,
    rgba(0, 0, 0, 0.2) 68%,
    transparent 84%
  );
  mask-image: linear-gradient(
    180deg,
    #000 0%,
    #000 28%,
    rgba(0, 0, 0, 0.72) 46%,
    rgba(0, 0, 0, 0.38) 58%,
    rgba(0, 0, 0, 0.2) 68%,
    transparent 84%
  );
}

@media (min-width: 820px) {
  .account-page--overview .account-surface__ambient--trial-compare {
    -webkit-mask-image: linear-gradient(
      90deg,
      #000 0%,
      #000 18%,
      rgba(0, 0, 0, 0.35) 44%,
      rgba(0, 0, 0, 0.55) 50%,
      rgba(0, 0, 0, 0.35) 56%,
      #000 82%,
      #000 100%
    );
    mask-image: linear-gradient(
      90deg,
      #000 0%,
      #000 18%,
      rgba(0, 0, 0, 0.35) 44%,
      rgba(0, 0, 0, 0.55) 50%,
      rgba(0, 0, 0, 0.35) 56%,
      #000 82%,
      #000 100%
    );
  }
}

.account-page--overview .account-surface__ambient--capabilities {
  inset: -8% -6% -18% -6%;
  height: auto;
  opacity: 0.96;
  -webkit-mask-image: linear-gradient(
    180deg,
    #000 0%,
    #000 22%,
    rgba(0, 0, 0, 0.55) 48%,
    rgba(0, 0, 0, 0.25) 62%,
    transparent 78%
  );
  mask-image: linear-gradient(
    180deg,
    #000 0%,
    #000 22%,
    rgba(0, 0, 0, 0.55) 48%,
    rgba(0, 0, 0, 0.25) 62%,
    transparent 78%
  );
}

.account-page--overview .account-surface__ambient--streams {
  inset: -4% -8% -4% -14%;
  opacity: 0.92;
  -webkit-mask-image: linear-gradient(
    90deg,
    #000 0%,
    #000 36%,
    rgba(0, 0, 0, 0.45) 50%,
    transparent 64%
  );
  mask-image: linear-gradient(
    90deg,
    #000 0%,
    #000 36%,
    rgba(0, 0, 0, 0.45) 50%,
    transparent 64%
  );
}

.account-page--overview .account-surface__ambient--assistant {
  inset: auto -6% -16% 28%;
  height: 78%;
  opacity: 0.94;
  -webkit-mask-image: linear-gradient(
    0deg,
    transparent 0%,
    rgba(0, 0, 0, 0.25) 28%,
    #000 52%,
    #000 100%
  );
  mask-image: linear-gradient(
    0deg,
    transparent 0%,
    rgba(0, 0, 0, 0.25) 28%,
    #000 52%,
    #000 100%
  );
}

.account-page--overview .account-readiness-card .account-status-card.account-surface--brand-calm {
  border-color: color-mix(in srgb, var(--ed-border) 88%, transparent);
  box-shadow: inset 0 1px 0 color-mix(in srgb, var(--ed-surface) 70%, transparent);
}

/* Overview hierarchy: graphite editorial hero + soft work surfaces */
.account-page--overview .account-editorial-card {
  padding-bottom: 0;
  overflow: hidden;
  background: color-mix(in srgb, var(--acc-surface-silver-end) 28%, var(--ed-surface));
}

.account-page--overview .account-editorial-card__hero {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  background: linear-gradient(
    162deg,
    color-mix(in srgb, var(--pk-dark, #181e27) 92%, #1f2630) 0%,
    var(--pk-dark, #181e27) 46%,
    color-mix(in srgb, var(--pk-dark, #181e27) 88%, #0e1218) 100%
  );
  box-shadow: inset 0 1px 0 color-mix(in srgb, #fff 9%, transparent);
}

.account-page--overview .account-editorial-card__hero-flow {
  position: absolute;
  inset: -32% -8% -38% 8%;
  z-index: 0;
  pointer-events: none;
  opacity: 1;
  -webkit-mask-image: linear-gradient(
    102deg,
    transparent 0%,
    transparent 30%,
    rgba(0, 0, 0, 0.35) 42%,
    #000 52%,
    #000 100%
  );
  mask-image: linear-gradient(
    102deg,
    transparent 0%,
    transparent 30%,
    rgba(0, 0, 0, 0.35) 42%,
    #000 52%,
    #000 100%
  );
}

.account-page--overview .account-editorial-card__hero-flow svg {
  display: block;
  width: 100%;
  height: 100%;
}

.account-page--overview .account-editorial-card__hero .account-editorial-card__head {
  position: relative;
  z-index: 1;
}

.account-page--overview .account-editorial-card__hero .account-editorial-card__name {
  color: #f5f6f8;
  text-shadow: 0 1px 12px rgba(0, 0, 0, 0.35);
}

.account-page--overview .account-editorial-card__hero .account-editorial-card__copy {
  color: #c4c9d0;
}

.account-page--overview .account-editorial-card__hero .account-editorial-card__note {
  color: #a3aab4;
}

.account-page--overview .account-page-head--status-only {
  margin-bottom: 0.35rem;
  padding-bottom: 0;
}

.account-page--overview .account-page-head--status-only .account-flash {
  margin: 0 0 0.65rem;
}

.account-page--overview .account-editorial-card__foot.account-panel__meta {
  position: relative;
  margin-top: 0;
  padding: 0.95rem var(--acc-pad) 1.1rem;
  border-top: 1px solid color-mix(in srgb, var(--pk-dark, #181e27) 7%, var(--ed-border));
  border-radius: 0 0 calc(var(--pk-radius-card) - 1px) calc(var(--pk-radius-card) - 1px);
  background: linear-gradient(
    168deg,
    color-mix(in srgb, var(--acc-surface-silver) 90%, var(--ed-surface)) 0%,
    color-mix(in srgb, var(--acc-surface-silver) 84%, #e2e8ee) 42%,
    var(--acc-surface-silver-end) 100%
  );
  box-shadow:
    inset 0 1px 0 color-mix(in srgb, #fff 74%, transparent),
    inset 0 -1px 0 color-mix(in srgb, var(--ed-border) 28%, transparent);
}

.account-page--overview .account-editorial-card__foot-bridge {
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  overflow: hidden;
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--pk-dark, #181e27) 6%, transparent) 0%,
    transparent 24%
  );
}

.account-page--overview .account-editorial-card__foot .account-factgrid--2 > .account-fact {
  border-left-color: color-mix(in srgb, var(--ed-border) 78%, #c5ccd6);
}

.account-page--overview .account-editorial-card__foot .account-factgrid {
  position: relative;
  z-index: 1;
}

.account-page--overview .account-capabilities__grid--matrix {
  margin: 0 var(--acc-pad) 1.05rem;
  padding: 0;
  gap: 0;
  border: 1px solid color-mix(in srgb, var(--ed-border) 78%, #cfd5df);
  border-radius: 11px;
  background: color-mix(in srgb, var(--acc-surface-silver) 48%, var(--ed-surface));
  box-shadow: inset 0 1px 0 color-mix(in srgb, #fff 58%, transparent);
  overflow: hidden;
}

.account-page--overview .account-capabilities__grid--matrix .account-capabilities__item {
  position: relative;
  min-width: 0;
  padding: 1rem 1.05rem 1.02rem;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.account-page--overview .account-capabilities__grid--matrix .account-capabilities__item::before {
  content: "";
  position: absolute;
  inset: 0.28rem 0.45rem;
  border-radius: 7px;
  background: color-mix(in srgb, var(--ed-surface) 42%, transparent);
  opacity: 0.38;
  pointer-events: none;
}

.account-page--overview .account-capabilities__grid--matrix .account-capabilities__item > * {
  position: relative;
  z-index: 1;
}

.account-page--overview .account-capabilities__grid--matrix .account-capabilities__item:not(:last-child) {
  border-bottom: 1px solid color-mix(in srgb, var(--ed-border) 72%, #d0d6e0);
}

@media (min-width: 560px) {
  .account-page--overview .account-capabilities__grid--matrix .account-capabilities__item {
    border-bottom: 1px solid color-mix(in srgb, var(--ed-border) 72%, #d0d6e0);
    border-right: 1px solid color-mix(in srgb, var(--ed-border) 72%, #d0d6e0);
  }

  .account-page--overview .account-capabilities__grid--matrix .account-capabilities__item:nth-child(2n) {
    border-right: 0;
  }

  .account-page--overview .account-capabilities__grid--matrix .account-capabilities__item:nth-child(n + 5) {
    border-bottom: 0;
  }
}

.account-page--overview .account-surface__ambient--capabilities {
  opacity: 0.82;
  -webkit-mask-image: linear-gradient(
    180deg,
    transparent 0%,
    transparent 14%,
    rgba(0, 0, 0, 0.35) 26%,
    #000 42%,
    #000 68%,
    rgba(0, 0, 0, 0.35) 82%,
    transparent 94%
  );
  mask-image: linear-gradient(
    180deg,
    transparent 0%,
    transparent 14%,
    rgba(0, 0, 0, 0.35) 26%,
    #000 42%,
    #000 68%,
    rgba(0, 0, 0, 0.35) 82%,
    transparent 94%
  );
}

.account-page--overview .account-assistant-announce {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  margin: 0 var(--acc-pad) 1.15rem;
  padding: 1.08rem 1.12rem 1.14rem;
  border: 1px solid color-mix(in srgb, var(--ed-border) 86%, #cfd5df);
  border-radius: 12px;
  background: linear-gradient(
    168deg,
    color-mix(in srgb, var(--ed-surface) 90%, #f0f3f8) 0%,
    color-mix(in srgb, var(--acc-surface-silver) 42%, var(--ed-surface)) 55%,
    color-mix(in srgb, var(--acc-surface-silver-end) 32%, var(--ed-surface)) 100%
  );
  box-shadow:
    inset 0 1px 0 color-mix(in srgb, #fff 78%, transparent),
    0 1px 0 color-mix(in srgb, var(--ed-border) 26%, transparent),
    0 10px 28px color-mix(in srgb, var(--pk-dark, #181e27) 4%, transparent);
}

.account-page--overview .account-assistant-announce .account-surface__ambient--assistant {
  inset: auto -2% -18% 38%;
  height: 62%;
  opacity: 0.58;
  -webkit-mask-image: linear-gradient(
    0deg,
    transparent 0%,
    rgba(0, 0, 0, 0.2) 22%,
    #000 48%,
    #000 88%,
    transparent 100%
  );
  mask-image: linear-gradient(
    0deg,
    transparent 0%,
    rgba(0, 0, 0, 0.2) 22%,
    #000 48%,
    #000 88%,
    transparent 100%
  );
}

.account-page--overview .account-stream-tabs__list {
  position: relative;
  z-index: 1;
  background: color-mix(in srgb, var(--ed-surface-muted) 70%, #e6eaef);
  border-color: color-mix(in srgb, var(--ed-border) 85%, #d0d6e0);
}

.account-page--overview .account-stream-tabs__tab.is-active {
  background: color-mix(in srgb, var(--ed-surface) 78%, #eef1f6);
  border-color: color-mix(in srgb, var(--ed-accent) 22%, var(--ed-border));
  box-shadow:
    inset 0 1px 0 color-mix(in srgb, #fff 65%, transparent),
    0 1px 2px color-mix(in srgb, var(--pk-dark, #181e27) 6%, transparent);
}

.account-page--overview .account-streams-panel .account-panel__body {
  position: relative;
  z-index: 1;
}

.account-page--overview .account-stream-tabs__list {
  margin-bottom: 0.65rem;
}

.account-page--overview .account-stream-tabs__tab.is-active {
  position: relative;
  z-index: 2;
}

.account-page--overview .account-stream-sheet {
  position: relative;
  z-index: 1;
  isolation: isolate;
  overflow: hidden;
  margin-top: 0.15rem;
  background: linear-gradient(
    168deg,
    color-mix(in srgb, var(--ed-surface) 82%, #eef2f7) 0%,
    color-mix(in srgb, var(--ed-surface) 70%, #e4eaf0) 48%,
    color-mix(in srgb, var(--acc-surface-silver) 38%, var(--ed-surface)) 100%
  );
  border-color: color-mix(in srgb, var(--ed-border) 80%, #ccd3de);
  box-shadow:
    inset 0 1px 0 color-mix(in srgb, #fff 74%, transparent),
    inset 0 0 0 1px color-mix(in srgb, #fff 35%, transparent);
}

.account-page--overview .account-stream-sheet__accent {
  position: absolute;
  right: -1%;
  bottom: -6%;
  z-index: 0;
  width: min(42%, 11.5rem);
  height: min(38%, 7.5rem);
  pointer-events: none;
  opacity: 0.72;
  -webkit-mask-image: linear-gradient(
    125deg,
    transparent 0%,
    transparent 38%,
    rgba(0, 0, 0, 0.35) 52%,
    #000 68%,
    #000 100%
  );
  mask-image: linear-gradient(
    125deg,
    transparent 0%,
    transparent 38%,
    rgba(0, 0, 0, 0.35) 52%,
    #000 68%,
    #000 100%
  );
}

.account-page--overview .account-stream-sheet__accent svg {
  display: block;
  width: 100%;
  height: 100%;
}

.account-page--overview .account-stream-sheet > :not(.account-stream-sheet__accent) {
  position: relative;
  z-index: 1;
}

.account-page--overview .account-stream-sheet .account-chips--static {
  max-width: 100%;
}

@media (max-width: 40rem) {
  .account-page--overview .account-stream-sheet__accent {
    right: 0;
    bottom: 0;
    width: min(34%, 6.5rem);
    height: min(24%, 4.75rem);
    opacity: 0.42;
  }
}

.account-page--overview .account-surface__ambient--streams {
  inset: -10% -8% -12% -8%;
  height: auto;
  opacity: 0.9;
  -webkit-mask-image: linear-gradient(
    180deg,
    transparent 0%,
    transparent 16%,
    rgba(0, 0, 0, 0.35) 24%,
    #000 34%,
    #000 48%,
    rgba(0, 0, 0, 0.25) 58%,
    transparent 68%
  );
  mask-image: linear-gradient(
    180deg,
    transparent 0%,
    transparent 16%,
    rgba(0, 0, 0, 0.35) 24%,
    #000 34%,
    #000 48%,
    rgba(0, 0, 0, 0.25) 58%,
    transparent 68%
  );
}

.account-page--overview .account-readiness-card--graphite {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  margin-top: 0.15rem;
  padding: 0;
  border: 1px solid color-mix(in srgb, var(--pk-dark, #181e27) 88%, #2a313c);
  border-radius: var(--pk-radius-card);
  background: linear-gradient(
    158deg,
    color-mix(in srgb, var(--pk-dark, #181e27) 94%, #1f2630) 0%,
    var(--pk-dark, #181e27) 52%,
    color-mix(in srgb, var(--pk-dark, #181e27) 90%, #0e1218) 100%
  );
  box-shadow:
    inset 0 1px 0 color-mix(in srgb, #fff 8%, transparent),
    0 12px 32px color-mix(in srgb, var(--pk-dark, #181e27) 14%, transparent);
}

.account-page--overview .account-readiness-card--graphite::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background:
    radial-gradient(220px 80px at 8% 8%, rgba(212, 85, 24, 0.07), transparent 74%),
    radial-gradient(200px 72px at 92% 10%, rgba(212, 85, 24, 0.055), transparent 72%),
    radial-gradient(240px 88px at 88% 92%, rgba(212, 85, 24, 0.06), transparent 76%);
  opacity: 0.95;
}

.account-page--overview .account-readiness-card__ambient {
  position: absolute;
  inset: 0 -2% -6%;
  z-index: 0;
  pointer-events: none;
  opacity: 0.97;
  overflow: hidden;
  -webkit-mask-image:
    linear-gradient(
      180deg,
      #000 0%,
      #000 16%,
      rgba(0, 0, 0, 0.55) 24%,
      transparent 32%,
      transparent 76%,
      rgba(0, 0, 0, 0.55) 82%,
      rgba(0, 0, 0, 0.9) 88%,
      #000 94%,
      #000 100%
    ),
    linear-gradient(
      98deg,
      transparent 0%,
      transparent 40%,
      rgba(0, 0, 0, 0.45) 48%,
      #000 56%,
      #000 100%
    );
  mask-image:
    linear-gradient(
      180deg,
      #000 0%,
      #000 16%,
      rgba(0, 0, 0, 0.55) 24%,
      transparent 32%,
      transparent 76%,
      rgba(0, 0, 0, 0.55) 82%,
      rgba(0, 0, 0, 0.9) 88%,
      #000 94%,
      #000 100%
    ),
    linear-gradient(
      98deg,
      transparent 0%,
      transparent 40%,
      rgba(0, 0, 0, 0.45) 48%,
      #000 56%,
      #000 100%
    );
  -webkit-mask-composite: source-in;
  mask-composite: intersect;
}

.account-page--overview .account-readiness-card__ambient svg {
  display: block;
  width: 100%;
  height: 100%;
}

.account-page--overview .account-readiness-card__shell {
  position: relative;
  z-index: 1;
  min-width: 0;
  padding: 1.15rem var(--acc-pad) 1.2rem;
}

.account-page--overview .account-readiness-card__title {
  margin: 0;
  font-size: 1.0625rem;
  font-weight: 600;
  letter-spacing: -0.022em;
  line-height: 1.3;
  color: #f2f4f7;
}

.account-page--overview .account-readiness-card__lead {
  margin: 0.35rem 0 0;
  max-width: 44rem;
  font-size: 0.8125rem;
  line-height: 1.5;
  color: #b8bec8;
}

.account-page--overview .account-readiness-card__grid {
  margin-top: 1rem;
  gap: 0.7rem;
}

.account-page--overview .account-readiness-card .account-status-card.account-surface--brand-calm {
  background: linear-gradient(
    168deg,
    color-mix(in srgb, var(--ed-surface) 68%, #e6eaf0) 0%,
    color-mix(in srgb, var(--acc-surface-silver) 52%, var(--ed-surface)) 100%
  );
  border-color: color-mix(in srgb, var(--ed-border) 82%, #d0d6e0);
  box-shadow:
    inset 0 1px 0 color-mix(in srgb, #fff 72%, transparent),
    0 1px 0 color-mix(in srgb, var(--pk-dark, #181e27) 8%, transparent);
}

.account-page--overview .account-readiness-card .account-fact__label::before {
  content: "";
  display: inline-block;
  width: 0.42rem;
  height: 0.42rem;
  margin-right: 0.4rem;
  border-radius: 50%;
  background: color-mix(in srgb, var(--ed-accent) 55%, #9aa4ae);
  vertical-align: 0.08em;
  opacity: 0.75;
}

.account-page--overview .account-readiness-card .account-badge--ok {
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--ed-accent) 12%, transparent);
}

@media (min-width: 720px) {
  .account-page--overview .account-readiness-card__grid.account-factgrid--3 > .account-fact {
    border-top: 0;
    padding: 0.95rem 1rem 1rem;
  }
}

@media (max-width: 719px) {
  .account-page--overview .account-readiness-card__shell {
    padding: 1.12rem 1.12rem 1.45rem;
  }

  .account-page--overview .account-readiness-card__grid {
    gap: 0.78rem;
    margin-top: 0.95rem;
    padding-bottom: 0.2rem;
  }

  .account-page--overview .account-readiness-card .account-status-card.account-surface--brand-calm {
    padding: 1rem 1.08rem 1.18rem;
  }

  .account-page--overview .account-readiness-card .account-fact__action {
    margin-top: 0.78rem;
  }

  .account-page--overview .account-readiness-card__ambient {
    inset: 0 -4% -4%;
    -webkit-mask-image:
      linear-gradient(
        180deg,
        #000 0%,
        #000 17%,
        rgba(0, 0, 0, 0.45) 24%,
        transparent 30%,
        transparent 84%,
        rgba(0, 0, 0, 0.65) 90%,
        #000 96%,
        #000 100%
      ),
      linear-gradient(
        98deg,
        transparent 0%,
        transparent 50%,
        rgba(0, 0, 0, 0.42) 58%,
        #000 66%,
        #000 100%
      );
    mask-image:
      linear-gradient(
        180deg,
        #000 0%,
        #000 17%,
        rgba(0, 0, 0, 0.45) 24%,
        transparent 30%,
        transparent 84%,
        rgba(0, 0, 0, 0.65) 90%,
        #000 96%,
        #000 100%
      ),
      linear-gradient(
        98deg,
        transparent 0%,
        transparent 50%,
        rgba(0, 0, 0, 0.42) 58%,
        #000 66%,
        #000 100%
      );
    -webkit-mask-composite: source-in;
    mask-composite: intersect;
  }

  .account-page--overview .account-editorial-card__hero-flow {
    inset: -30% -6% -36% 4%;
  }
}

/* ── Profile: silver composition (capabilities rhythm) ───────────────── */

.account-page--profile .account-page__intro {
  display: none;
}

.account-page--profile .account-profile-page {
  display: grid;
  gap: 0.85rem;
  min-width: 0;
}

.account-page--profile .account-profile-form {
  display: grid;
  gap: 0.85rem;
  min-width: 0;
}

.account-page--profile .account-profile-form__flash {
  margin: 0;
}

.account-page--profile .account-profile-form__confirm.account-settings-confirm-wrap {
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
}

/* Main silver block */
.account-page--profile .account-profile-main {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  box-shadow: 0 1px 0 color-mix(in srgb, var(--ed-border) 28%, transparent);
}

.account-page--profile .account-profile-main > .account-panel__head.account-profile-head-card,
.account-page--profile .account-profile-main__workspace {
  position: relative;
  z-index: 1;
}

.account-page--profile .account-profile-main > .account-panel__head.account-profile-head-card {
  background: transparent;
  border-bottom: 0;
}

.account-page--profile .account-profile-main .account-page-head__title {
  font-size: clamp(1.2rem, 1.05rem + 0.55vw, 1.45rem);
}

.account-page--profile .account-profile-main__workspace {
  display: grid;
  gap: 0;
  min-width: 0;
}

.account-page--profile .account-profile-main__workspace > .account-profile-main__forms,
.account-page--profile .account-profile-main__workspace > .account-profile-save-footer {
  position: relative;
  z-index: 1;
}

.account-page--profile .account-profile-main > .account-surface__ambient--profile-main {
  inset: 0 -14% -12% -14%;
  opacity: 0.46;
  -webkit-mask-image: linear-gradient(
    180deg,
    rgba(0, 0, 0, 0.2) 0%,
    rgba(0, 0, 0, 0.2) 28%,
    rgba(0, 0, 0, 0.48) 38%,
    #000 48%,
    #000 86%,
    transparent 100%
  );
  mask-image: linear-gradient(
    180deg,
    rgba(0, 0, 0, 0.2) 0%,
    rgba(0, 0, 0, 0.2) 28%,
    rgba(0, 0, 0, 0.48) 38%,
    #000 48%,
    #000 86%,
    transparent 100%
  );
}

.account-page--profile .account-profile-main__forms {
  position: relative;
  z-index: 1;
  display: grid;
  gap: 0.72rem;
  min-width: 0;
  padding: 0.82rem var(--acc-pad) 0.72rem;
}

.account-page--profile .account-profile-main__field-row {
  display: grid;
  gap: 0.72rem;
  min-width: 0;
}

.account-page--profile .account-profile-work-card {
  min-width: 0;
  padding: 0.92rem 1rem 0.98rem;
  border: 1px solid color-mix(in srgb, var(--ed-border) 78%, transparent);
  border-radius: 11px;
  background: color-mix(in srgb, var(--ed-surface) 88%, transparent);
  box-shadow: 0 1px 0 color-mix(in srgb, var(--ed-border) 40%, transparent);
}

.account-page--profile .account-profile-work-card .account-settings-row__title {
  margin: 0;
  font-size: 0.9rem;
}

.account-page--profile .account-profile-work-card .account-settings-row__desc {
  margin: 0.28rem 0 0;
  max-width: 36rem;
  font-size: 0.8125rem;
  line-height: 1.45;
}

.account-page--profile .account-profile-work-card__control {
  margin-top: 0.72rem;
  min-width: 0;
}

.account-page--profile .account-profile-work-card .account-field {
  margin: 0;
}

.account-page--profile .account-profile-hints-card.account-profile-hints-block {
  display: grid;
  gap: 0.75rem 1.25rem;
  align-items: start;
  padding: 1rem 1.05rem 1.06rem;
}

.account-page--profile .account-profile-hints-block__intro {
  min-width: 0;
}

.account-page--profile .account-profile-hints-block__intro .account-settings-row__desc {
  max-width: 42rem;
}

.account-page--profile .account-profile-hints-block__control {
  min-width: 0;
}

.account-page--profile .account-profile-hints-block .account-check {
  margin: 0;
}

/* Save footer inside main block */
.account-page--profile .account-profile-main .account-profile-save-footer.account-settings-footer {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.42rem;
  min-height: 0;
  margin: 0;
  padding: 0.62rem var(--acc-pad) 0.88rem;
  border: 0;
  border-top: 1px solid color-mix(in srgb, var(--ed-border) 68%, #c8ced8);
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.account-page--profile .account-profile-save-footer .account-profile-save-card__note {
  margin: 0;
  max-width: 30rem;
  font-size: 0.8125rem;
  line-height: 1.45;
  text-align: center;
  color: var(--ed-muted);
}

.account-page--profile .account-profile-save-footer .account-profile-save-card__actions {
  display: flex;
  justify-content: center;
  width: 100%;
  margin: 0;
}

@media (min-width: 720px) {
  .account-page--profile .account-profile-main .account-profile-save-footer.account-settings-footer {
    display: flex;
    flex-direction: column;
    grid-template-columns: unset;
    gap: 0.42rem;
    padding-block: 0.62rem 0.88rem;
  }

  .account-page--profile .account-profile-save-footer .account-settings-footer__actions,
  .account-page--profile .account-profile-save-footer .account-profile-save-card__actions {
    grid-column: unset;
  }
}

.account-page--profile .account-tz-suggest:not([hidden]) {
  margin-top: 0.55rem;
  padding: 0.58rem 0.68rem;
  border: 1px solid color-mix(in srgb, var(--ed-accent) 16%, var(--ed-border));
  border-radius: 9px;
  background: linear-gradient(
    165deg,
    color-mix(in srgb, var(--acc-surface-silver) 38%, var(--ed-surface)) 0%,
    color-mix(in srgb, var(--ed-accent) 5%, var(--ed-surface)) 100%
  );
  box-shadow: inset 0 1px 0 color-mix(in srgb, #fff 62%, transparent);
  font-size: 0.8125rem;
  line-height: 1.45;
}

.account-page--profile .account-tz-suggest .btn-sm {
  flex-shrink: 0;
  border-color: color-mix(in srgb, var(--ed-accent) 22%, var(--ed-border));
  background: color-mix(in srgb, var(--ed-surface) 88%, #fff);
}

.account-page--profile .account-profile-save-card .btn[data-profile-save]:disabled {
  opacity: 1;
  filter: none;
  cursor: not-allowed;
  border-color: color-mix(in srgb, var(--ed-border) 88%, transparent);
  background: color-mix(in srgb, var(--ed-surface-muted) 72%, var(--ed-surface));
  color: color-mix(in srgb, var(--ed-muted) 88%, var(--ed-text));
  box-shadow: none;
}

.account-page--profile .account-profile-save-card .btn[data-profile-save]:not(:disabled) {
  box-shadow: 0 1px 0 color-mix(in srgb, var(--pk-dark, #181e27) 12%, transparent);
}

/* Email silver block */
.account-page--profile .account-profile-email-card {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  padding: 0.72rem var(--acc-pad) 0.82rem;
  box-shadow: 0 1px 0 color-mix(in srgb, var(--ed-border) 26%, transparent);
}

.account-page--profile .account-surface__ambient--profile-email {
  inset: -50% -10% -50% -10%;
  opacity: 0.46;
  -webkit-mask-image: linear-gradient(90deg, transparent 4%, #000 24%, #000 76%, transparent 96%);
  mask-image: linear-gradient(90deg, transparent 4%, #000 24%, #000 76%, transparent 96%);
}

.account-page--profile .account-profile-email-card__work {
  position: relative;
  z-index: 1;
  min-width: 0;
  padding: 0.78rem 0.95rem 0.82rem;
  border: 1px solid color-mix(in srgb, var(--ed-border) 78%, transparent);
  border-radius: 10px;
  background: color-mix(in srgb, var(--ed-surface) 88%, transparent);
  box-shadow: 0 1px 0 color-mix(in srgb, var(--ed-border) 40%, transparent);
}

.account-page--profile .account-profile-email-card__head {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 0.35rem 0.75rem;
  min-width: 0;
}

.account-page--profile .account-profile-email-card__label {
  margin: 0;
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--ed-muted);
}

.account-page--profile .account-profile-email-card__value {
  font-size: 0.9375rem;
  font-weight: 500;
  color: var(--ed-text);
}

.account-page--profile .account-profile-email-card__desc {
  margin: 0.38rem 0 0;
  max-width: 44rem;
  font-size: 0.8125rem;
  line-height: 1.45;
  color: var(--ed-muted);
}

.account-page--profile .account-profile-email-card__link {
  color: var(--ed-text-secondary);
}

.account-page--profile .account-profile-email-card__link:hover {
  color: var(--ed-text);
}

.account-page--profile .account-profile-email-card__provider {
  display: block;
  margin-top: 0.2rem;
}

@media (min-width: 768px) {
  .account-page--profile .account-profile-main__field-row {
    grid-template-columns: minmax(0, 0.38fr) minmax(0, 0.62fr);
    align-items: stretch;
    gap: 0.72rem;
  }
}

@media (min-width: 720px) {
  .account-page--profile .account-profile-hints-card.account-profile-hints-block {
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 1rem 1.5rem;
    padding: 1.02rem 1.1rem 1.06rem;
  }

  .account-page--profile .account-profile-hints-block__control {
    justify-self: end;
    padding-top: 0.1rem;
  }
}

@media (min-width: 560px) {
  .account-page--profile .account-profile-email-card__provider {
    display: inline;
    margin-top: 0;
  }

  .account-page--profile .account-profile-email-card__provider::before {
    content: "·";
    margin: 0 0.35rem;
    color: color-mix(in srgb, var(--ed-muted) 55%, transparent);
  }
}

@media (max-width: 719px) {
  .account-page--profile .account-profile-hints-card.account-profile-hints-block {
    padding: 0.95rem 0.92rem 1rem;
  }

  .account-page--profile .account-profile-save-footer {
    padding: 0.68rem 0.95rem 0.82rem;
  }

  .account-page--profile .account-profile-save-footer .account-profile-save-card__actions .btn {
    width: 100%;
    max-width: 20rem;
    justify-content: center;
  }

  .account-page--profile .account-profile-email-card__head {
    flex-direction: column;
    align-items: flex-start;
    gap: 0.2rem;
  }

  .account-page--profile .account-profile-main > .account-surface__ambient--profile-main {
    opacity: 0.44;
  }

}

/* ── Notifications: graphite hero + silver kinds ─────────────────────── */

.account-page--notifications {
  min-width: 0;
}

.account-page--notifications .account-notifications-stack {
  gap: 0.85rem;
}

.account-notifications-graphite {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  min-width: 0;
  padding: 0.95rem var(--acc-pad) 1rem;
  border: 1px solid color-mix(in srgb, var(--pk-dark, #181e27) 22%, #2a3340);
  border-radius: 16px;
  background: linear-gradient(
    168deg,
    color-mix(in srgb, var(--pk-dark, #181e27) 92%, #1f2630) 0%,
    var(--pk-dark, #181e27) 48%,
    color-mix(in srgb, var(--pk-dark, #181e27) 88%, #0e1218) 100%
  );
  color: color-mix(in srgb, #f4f6f8 94%, #e8ecf0);
  box-shadow:
    0 1px 0 color-mix(in srgb, #fff 6%, transparent),
    0 12px 28px color-mix(in srgb, var(--pk-dark, #181e27) 18%, transparent);
}

.account-notifications-graphite__ambient {
  position: absolute;
  inset: -12% -8% -20% -8%;
  z-index: 0;
  pointer-events: none;
  opacity: 0.86;
  -webkit-mask-image: linear-gradient(
    180deg,
    rgba(0, 0, 0, 0.15) 0%,
    #000 14%,
    #000 72%,
    rgba(0, 0, 0, 0.25) 88%,
    transparent 100%
  );
  mask-image: linear-gradient(
    180deg,
    rgba(0, 0, 0, 0.15) 0%,
    #000 14%,
    #000 72%,
    rgba(0, 0, 0, 0.25) 88%,
    transparent 100%
  );
}

.account-notifications-graphite__ambient svg {
  display: block;
  width: 100%;
  height: 100%;
}

.account-notifications-graphite__help-zone {
  position: absolute;
  top: 0.85rem;
  right: 0.85rem;
  z-index: 4;
  display: flex;
  align-items: flex-start;
  justify-content: flex-end;
  min-width: 2.5rem;
  min-height: 2.5rem;
  padding: 0.15rem;
  pointer-events: none;
}

.account-notifications-graphite__help-zone .account-help {
  pointer-events: auto;
}

.account-notifications-graphite__help {
  margin: 0;
}

.account-notifications-graphite__top {
  position: relative;
  z-index: 2;
  display: grid;
  gap: 0.75rem 1.25rem;
  align-items: end;
  min-width: 0;
  margin-bottom: 0.8rem;
  padding-right: 2.75rem;
}

.account-notifications-graphite__intro {
  min-width: 0;
}

.account-notifications-graphite__title {
  margin: 0;
  font-size: clamp(1.28rem, 1.1rem + 0.6vw, 1.55rem);
  font-weight: 650;
  letter-spacing: -0.02em;
  line-height: 1.2;
  color: #f6f8fa;
}

.account-notifications-graphite__lead {
  margin: 0.38rem 0 0;
  max-width: 28rem;
  font-size: 0.9375rem;
  line-height: 1.5;
  color: color-mix(in srgb, #e8ecf0 88%, #b8c0c8);
}

.account-notifications-graphite__channel {
  min-width: 0;
  max-width: 22rem;
  justify-self: end;
  text-align: left;
}

.account-notifications-graphite__channel-accent {
  display: flex;
  align-items: center;
  gap: 0.48rem;
  margin: 0;
  font-size: 0.875rem;
  line-height: 1.45;
  font-weight: 500;
  color: color-mix(in srgb, var(--ed-accent, #c4552a) 74%, #e8c4b0);
}

.account-notifications-graphite__channel-node {
  flex: 0 0 auto;
  width: 0.42rem;
  height: 0.42rem;
  border-radius: 999px;
  background: color-mix(in srgb, var(--ed-accent, #c4552a) 68%, #e8a070);
  box-shadow: 0 0 10px color-mix(in srgb, var(--ed-accent, #c4552a) 26%, transparent);
}

.account-notifications-graphite__channel-future {
  margin: 0.32rem 0 0 0.9rem;
  font-size: 0.8125rem;
  line-height: 1.45;
  color: color-mix(in srgb, #c8d0d8 72%, #8a939c);
}

.account-notifications-graphite__panel {
  position: relative;
  z-index: 1;
  min-width: 0;
}

.account-page--notifications .account-help--notifications {
  position: relative;
  z-index: 3;
  flex: 0 0 auto;
}

.account-help--notifications .account-help__glyph svg path:first-of-type {
  display: none;
}

.account-help--notifications .account-help__toggle {
  width: 2rem;
  height: 2rem;
  border: 1px solid color-mix(in srgb, #fff 14%, #4a5564);
  background: color-mix(in srgb, var(--pk-dark, #181e27) 55%, #2a3340);
  color: color-mix(in srgb, #e8ecf0 90%, #b8c0c8);
  box-shadow: none;
}

.account-help--notifications .account-help__toggle:hover {
  border-color: color-mix(in srgb, #fff 22%, #5a6574);
  color: #f6f8fa;
}

.account-help--notifications .account-help__toggle:focus-visible {
  outline: 2px solid color-mix(in srgb, var(--ed-accent, #c4552a) 75%, #fff);
  outline-offset: 2px;
}

.account-page--notifications .account-telegram-hero--notifications {
  position: relative;
  z-index: 1;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
}

.account-notifications-telegram-panel {
  position: relative;
  z-index: 1;
  min-width: 0;
  padding: 0.78rem 1rem 0.82rem;
  border: 1px solid color-mix(in srgb, var(--ed-border) 78%, transparent);
  border-radius: 12px;
  background: color-mix(in srgb, var(--ed-surface) 62%, #f8fafc);
  box-shadow:
    0 1px 0 color-mix(in srgb, var(--ed-border) 40%, transparent),
    0 8px 22px color-mix(in srgb, #000 10%, transparent);
}

.account-notifications-telegram-panel__row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.65rem 1.1rem;
  min-width: 0;
}

.account-notifications-telegram-panel__lead {
  flex: 1 1 14rem;
  min-width: 0;
}

.account-notifications-telegram-panel__lead .account-panel__title {
  margin: 0;
  font-size: 0.98rem;
  font-weight: 600;
  letter-spacing: -0.01em;
  color: var(--ed-text);
}

.account-notifications-telegram-panel__note {
  margin: 0.28rem 0 0;
  font-size: 0.8125rem;
  line-height: 1.42;
  color: var(--ed-muted);
}

.account-notifications-telegram-panel__rail {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 0.5rem 0.75rem;
  flex: 0 1 auto;
  min-width: 0;
}

.account-notifications-telegram-panel__status {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 0.4rem 0.55rem;
  min-width: 0;
}

.account-notifications-telegram-panel__contact {
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--ed-text-secondary);
}

.account-page--notifications .account-notifications-telegram-panel__actions {
  margin: 0;
  padding: 0;
  border: 0;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 0.4rem;
}

.account-page--notifications .account-notifications-telegram-panel__actions .btn {
  white-space: nowrap;
}

.account-notifications-telegram-panel__details {
  margin-top: 0.65rem;
  padding-top: 0.6rem;
  border-top: 1px solid color-mix(in srgb, var(--ed-border) 38%, transparent);
}

.account-notifications-telegram-panel__details .account-panel__copy {
  margin: 0;
  font-size: 0.8125rem;
  line-height: 1.45;
  color: var(--ed-text-secondary);
}

.account-notifications-telegram-panel__details .account-flash,
.account-notifications-telegram-panel__details .account-factgrid,
.account-notifications-telegram-panel__details .account-telegram-actions--primary,
.account-notifications-telegram-panel__details .account-hint {
  margin-top: 0.5rem;
}

.account-notifications-telegram-panel:not(.account-notifications-telegram-panel--expanded) .account-notifications-telegram-panel__details {
  display: none;
}

.account-page--notifications .account-telegram-hero--notifications .account-preview-tools {
  margin-top: 0.85rem;
  padding: 0.75rem 0.9rem;
  border-radius: 10px;
  border: 1px dashed color-mix(in srgb, #fff 12%, #4a5564);
  background: color-mix(in srgb, var(--pk-dark, #181e27) 40%, transparent);
  color: color-mix(in srgb, #e0e6ec 85%, #9aa4ae);
}

.account-page--notifications .account-notifications-kinds {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  box-shadow: 0 1px 0 color-mix(in srgb, var(--ed-border) 28%, transparent);
}

.account-page--notifications .account-surface__ambient--notifications-kinds {
  inset: -8% -14% -10% -14%;
  opacity: 0.55;
  -webkit-mask-image: linear-gradient(
    180deg,
    transparent 0%,
    #000 12%,
    #000 88%,
    transparent 100%
  );
  mask-image: linear-gradient(
    180deg,
    transparent 0%,
    #000 12%,
    #000 88%,
    transparent 100%
  );
}

.account-page--notifications .account-notifications-kinds > .account-panel__head,
.account-page--notifications .account-notifications-kinds > .account-panel__body {
  position: relative;
  z-index: 1;
}

.account-page--notifications .account-notifications-kinds__grid {
  gap: 0.72rem;
}

.account-page--notifications .account-notifications-kinds .account-status-card.account-fact {
  padding: 1.05rem 1.12rem 1.1rem;
  border-top: 0;
  gap: 0.3rem;
  overflow: visible;
  height: auto;
  min-height: 0;
  background: color-mix(in srgb, var(--ed-surface) 88%, transparent);
  border-color: color-mix(in srgb, var(--ed-border) 78%, transparent);
  box-shadow: 0 1px 0 color-mix(in srgb, var(--ed-border) 40%, transparent);
}

.account-page--notifications .account-notifications-kinds .account-fact__value {
  margin-top: 0.4rem;
}

.account-page--notifications .account-notifications-kinds .account-fact__detail {
  margin-top: 0.55rem;
}

@media (max-width: 719px) {
  .account-notifications-graphite {
    padding: 0.9rem 0.95rem 0.95rem;
    border-radius: 14px;
  }

  .account-notifications-graphite__help-zone {
    top: 0.75rem;
    right: 0.75rem;
  }

  .account-notifications-graphite__top {
    grid-template-columns: 1fr;
    align-items: start;
    padding-right: 2.5rem;
    margin-bottom: 0.72rem;
  }

  .account-notifications-graphite__channel {
    justify-self: start;
    max-width: none;
  }

  .account-notifications-graphite__channel-future {
    margin-left: 0.9rem;
  }

  .account-notifications-graphite__ambient {
    inset: -18% -14% -22% -10%;
    opacity: 0.72;
  }

  .account-notifications-telegram-panel {
    padding: 0.75rem 0.88rem 0.8rem;
  }

  .account-notifications-telegram-panel__row {
    flex-direction: column;
    align-items: stretch;
  }

  .account-notifications-telegram-panel__lead {
    flex: 0 0 auto;
  }

  .account-notifications-telegram-panel__rail {
    justify-content: flex-start;
    width: 100%;
  }

  .account-notifications-telegram-panel__status {
    justify-content: flex-start;
  }

  .account-page--notifications .account-notifications-telegram-panel__actions {
    justify-content: flex-start;
    width: 100%;
  }

  .account-page--notifications .account-notifications-telegram-panel__actions .btn {
    width: 100%;
    max-width: 20rem;
    justify-content: center;
  }

  .account-page--notifications .account-surface__ambient--notifications-kinds {
    opacity: 0.44;
  }
}

@media (min-width: 720px) {
  .account-notifications-graphite__top {
    grid-template-columns: minmax(0, 1.15fr) minmax(0, 0.85fr);
  }
}

/* ── Security: silver surfaces + graphite logout ─────────────────────── */

.account-page--security .account-security-stack {
  gap: 0.85rem;
}

.account-page--security .account-security-identities,
.account-page--security .account-security-sessions {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  box-shadow: 0 1px 0 color-mix(in srgb, var(--ed-border) 28%, transparent);
}

.account-page--security .account-security-identities > .account-panel__head,
.account-page--security .account-security-sessions > .account-panel__head,
.account-page--security .account-security-sessions > .account-panel__body,
.account-page--security .account-security-sessions > .account-panel__actions {
  position: relative;
  z-index: 1;
}

.account-page--security .account-security-identities__head {
  background: transparent;
  border-bottom-color: color-mix(in srgb, var(--ed-border) 72%, #c8ced8);
}

.account-page--security .account-security-identities__head .account-flash {
  margin-top: 0.55rem;
}

.account-page--security .account-security-identities__workspace {
  position: relative;
  z-index: 0;
  isolation: isolate;
  min-width: 0;
}

.account-page--security .account-surface__ambient--security-identities {
  inset: -6% -14% -10% -14%;
  opacity: 0.42;
  -webkit-mask-image: linear-gradient(
    180deg,
    transparent 0%,
    #000 10%,
    #000 88%,
    transparent 100%
  );
  mask-image: linear-gradient(
    180deg,
    transparent 0%,
    #000 10%,
    #000 88%,
    transparent 100%
  );
}

.account-page--security .account-security-identities__inner {
  position: relative;
  z-index: 1;
  min-width: 0;
  padding: 0 var(--acc-pad) 1.05rem;
}

.account-page--security .account-security-identities__subhead {
  padding: 0.75rem 0 0;
  background: transparent;
}

.account-page--security .account-security-identities__body {
  padding: 0.55rem 0 0;
}

.account-page--security .account-security-methods {
  gap: 0.72rem;
}

.account-page--security .account-security-work-card {
  min-width: 0;
  padding: 0.92rem 1rem 0.98rem;
  border: 1px solid color-mix(in srgb, var(--ed-border) 78%, transparent);
  border-radius: 12px;
  background: color-mix(in srgb, var(--ed-surface) 88%, transparent);
  box-shadow: 0 1px 0 color-mix(in srgb, var(--ed-border) 40%, transparent);
}

.account-page--security .account-security-work-card.account-method {
  border-top: 1px solid color-mix(in srgb, var(--ed-border) 78%, #cfd5df);
  padding: 0.92rem 1rem 0.98rem;
}

.account-page--security .account-security-work-card.account-method:first-child {
  border-top: 1px solid color-mix(in srgb, var(--ed-border) 78%, #cfd5df);
  padding-top: 0.92rem;
}

.account-page--security .account-security-reauth,
.account-page--security .account-security-link-actions,
.account-page--security .account-security-otp {
  margin-top: 0.72rem;
}

.account-page--security .account-security-email-card__main {
  display: grid;
  gap: 0.85rem 1.25rem;
  align-items: start;
  min-width: 0;
}

.account-page--security .account-security-email-card__identity,
.account-page--security .account-security-email-card__aside {
  min-width: 0;
}

.account-page--security .account-security-email-card__identity {
  display: grid;
  gap: 0.3rem;
  align-content: start;
}

.account-page--security .account-security-email-card__aside .account-sublabel {
  margin: 0 0 0.35rem;
}

.account-page--security .account-security-email-card__aside .account-method__hint {
  margin: 0;
}

.account-page--security .account-security-email-card__aside .account-method__hint + .account-method__hint,
.account-page--security .account-security-email-card__unlink {
  margin-top: 0.55rem;
}

.account-page--security .account-security-oauth-card {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.65rem 1rem;
}

.account-page--security .account-security-oauth-card--link {
  margin-top: 0.72rem;
}

.account-page--security .account-security-oauth-card__otp,
.account-page--security .account-security-oauth-card--otp {
  flex: 1 1 100%;
  min-width: 0;
}

.account-page--security .account-security-oauth-card__otp .account-security-otp,
.account-page--security .account-security-oauth-card--otp .account-security-otp {
  margin-top: 0.35rem;
}

@media (min-width: 720px) {
  .account-page--security .account-security-email-card__main {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  }

  .account-page--security .account-security-email-card__aside {
    padding-left: 1.1rem;
    border-left: 1px solid color-mix(in srgb, var(--ed-border) 70%, #cfd5df);
  }
}

.account-page--security .account-security-identities__footnote {
  margin-top: 0.75rem;
  padding: 0;
}

.account-page--security .account-security-future-card {
  margin-top: 0.72rem;
  padding: 0.78rem 0.92rem 0.82rem;
  border: 1px solid color-mix(in srgb, var(--ed-border) 65%, #d4dae2);
  border-radius: 11px;
  background: color-mix(in srgb, var(--acc-surface-silver) 22%, var(--ed-surface-muted));
}

.account-page--security .account-security-future-card .account-methods--future {
  margin-top: 0.55rem;
}

.account-page--security .account-security-future-card .account-method {
  padding-block: 0.55rem;
  border-top-color: color-mix(in srgb, var(--ed-border) 55%, transparent);
}

.account-page--security .account-surface__ambient--security-sessions {
  inset: -8% -14% -12% -14%;
  opacity: 0.48;
  -webkit-mask-image: linear-gradient(
    180deg,
    transparent 0%,
    #000 14%,
    #000 86%,
    transparent 100%
  );
  mask-image: linear-gradient(
    180deg,
    transparent 0%,
    #000 14%,
    #000 86%,
    transparent 100%
  );
}

.account-page--security .account-security-sessions__head,
.account-page--security .account-security-sessions__body {
  position: relative;
  z-index: 1;
}

.account-page--security .account-security-session-current {
  margin-bottom: 0.72rem;
  padding: 0.9rem 1rem;
  font-weight: 500;
}

.account-page--security .account-security-session-current .account-fact__text {
  font-weight: 600;
}

.account-page--security .account-security-session-now {
  margin-left: 0.4rem;
  font-size: 0.78rem;
  font-weight: 600;
  letter-spacing: 0.02em;
  text-transform: lowercase;
  color: color-mix(in srgb, var(--ed-accent, #c4552a) 88%, #8a3d1f);
}

.account-page--security .account-security-sessions__sublabel {
  margin: 0 0 0.45rem;
}

.account-page--security .account-security-sessions-list {
  padding: 0.35rem 1rem 0.45rem;
}

.account-page--security .account-security-sessions-list .account-session-row {
  padding: 0.62rem 0;
}

.account-page--security .account-security-sessions__footer {
  position: relative;
  z-index: 1;
}

.account-page--security .account-security-revoke-others {
  font-weight: 600;
}

.account-page--security .account-security-logout {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  margin: 0;
  padding: 0.95rem var(--acc-pad) 1rem;
  border: 1px solid color-mix(in srgb, var(--pk-dark, #181e27) 22%, #2a3340);
  border-radius: 16px;
  background: linear-gradient(
    168deg,
    color-mix(in srgb, var(--pk-dark, #181e27) 92%, #1f2630) 0%,
    var(--pk-dark, #181e27) 48%,
    color-mix(in srgb, var(--pk-dark, #181e27) 88%, #0e1218) 100%
  );
  box-shadow:
    0 1px 0 color-mix(in srgb, #fff 6%, transparent),
    0 10px 24px color-mix(in srgb, var(--pk-dark, #181e27) 16%, transparent);
}

.account-page--security .account-security-logout__ambient {
  position: absolute;
  inset: -20% -10% -30% -8%;
  z-index: 0;
  pointer-events: none;
  opacity: 0.9;
  -webkit-mask-image: linear-gradient(
    90deg,
    transparent 0%,
    rgba(0, 0, 0, 0.2) 12%,
    #000 28%,
    #000 72%,
    rgba(0, 0, 0, 0.25) 88%,
    transparent 100%
  );
  mask-image: linear-gradient(
    90deg,
    transparent 0%,
    rgba(0, 0, 0, 0.2) 12%,
    #000 28%,
    #000 72%,
    rgba(0, 0, 0, 0.25) 88%,
    transparent 100%
  );
}

.account-page--security .account-security-logout__ambient svg {
  display: block;
  width: 100%;
  height: 100%;
}

.account-page--security .account-security-logout__row {
  position: relative;
  z-index: 1;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem 1.25rem;
  min-width: 0;
}

.account-page--security .account-security-logout__copy {
  flex: 1 1 14rem;
  min-width: 0;
}

.account-page--security .account-security-logout__title {
  margin: 0;
  color: #f6f8fa;
}

.account-page--security .account-security-logout__note {
  margin: 0.35rem 0 0;
  max-width: 28rem;
  color: color-mix(in srgb, #e0e6ec 78%, #9aa4ae);
}

.account-page--security .account-security-logout__form {
  margin: 0;
  flex: 0 0 auto;
}

.account-page--security .account-security-logout.account-logout-panel {
  background: linear-gradient(
    168deg,
    color-mix(in srgb, var(--pk-dark, #181e27) 92%, #1f2630) 0%,
    var(--pk-dark, #181e27) 48%,
    color-mix(in srgb, var(--pk-dark, #181e27) 88%, #0e1218) 100%
  );
}

.account-page--security .account-security-logout .account-panel__actions-note {
  color: color-mix(in srgb, #e0e6ec 78%, #9aa4ae);
}

@media (max-width: 719px) {
  .account-page--security .account-security-identities__inner {
    padding-left: 0.95rem;
    padding-right: 0.95rem;
  }

  .account-page--security .account-security-email-card__aside {
    padding-top: 0.75rem;
    border-top: 1px solid color-mix(in srgb, var(--ed-border) 70%, #cfd5df);
  }

  .account-page--security .account-security-logout {
    padding: 0.9rem 0.95rem 0.95rem;
    border-radius: 14px;
  }

  .account-page--security .account-security-logout__row {
    flex-direction: column;
    align-items: stretch;
  }

  .account-page--security .account-security-logout__form .btn {
    width: 100%;
    max-width: 20rem;
    justify-content: center;
  }

  .account-page--security .account-surface__ambient--security-identities,
  .account-page--security .account-surface__ambient--security-sessions {
    opacity: 0.4;
  }
}

/* ── Dark cabinet: unified surface contract (overview / profile / notify / security) ── */

html[data-theme="dark"] .account-body .account-panel {
  background: linear-gradient(168deg, var(--acc-section) 0%, var(--acc-section-end) 100%);
  border-color: var(--acc-border-section);
  box-shadow: var(--acc-shadow-section);
}

html[data-theme="dark"] .account-body .account-surface--brand-calm,
html[data-theme="dark"] .account-body .account-surface--brand-flow,
html[data-theme="dark"] .account-body .account-surface--brand-streams {
  border-color: var(--acc-border-section);
  background: linear-gradient(168deg, var(--acc-section) 0%, var(--acc-section-end) 100%);
  box-shadow:
    inset 0 1px 0 color-mix(in srgb, #fff 4%, transparent),
    var(--acc-shadow-section);
}

html[data-theme="dark"] .account-body .account-surface--brand-accent {
  border-color: var(--acc-border-section);
  background: linear-gradient(
    168deg,
    var(--acc-surface-silver) 0%,
    var(--acc-surface-silver-end) 100%
  );
  box-shadow: var(--acc-shadow-card);
}

html[data-theme="dark"] .account-body .account-panel__head {
  border-bottom-color: var(--acc-hairline);
}

html[data-theme="dark"] .account-body .account-capabilities__item,
html[data-theme="dark"] .account-body .account-stream-sheet,
html[data-theme="dark"] .account-body .account-status-card {
  background: var(--acc-card);
  border-color: var(--acc-hairline);
  box-shadow: var(--acc-shadow-card);
}

html[data-theme="dark"] .account-body .account-readiness-card .account-status-card.account-surface--brand-calm {
  background: linear-gradient(
    168deg,
    color-mix(in srgb, var(--acc-card) 88%, var(--acc-section)) 0%,
    color-mix(in srgb, var(--acc-card-muted) 90%, var(--acc-section-end)) 100%
  );
}

/* Overview: streams + capabilities (remove light #e6eaef / #eef2f7 stacks) */
html[data-theme="dark"] .account-page--overview .account-stream-tabs__list {
  background: color-mix(in srgb, var(--acc-card-muted) 90%, #1c222a);
  border-color: var(--acc-hairline);
}

html[data-theme="dark"] .account-page--overview .account-stream-tabs__tab.is-active {
  background: var(--acc-card-raised);
  border-color: color-mix(in srgb, var(--ed-accent) 28%, var(--acc-hairline));
  box-shadow:
    inset 0 1px 0 color-mix(in srgb, #fff 6%, transparent),
    var(--acc-shadow-card);
}

html[data-theme="dark"] .account-page--overview .account-stream-sheet {
  background: linear-gradient(
    168deg,
    var(--acc-card-raised) 0%,
    color-mix(in srgb, var(--acc-card) 82%, var(--acc-card-muted)) 100%
  );
  border-color: var(--acc-hairline);
  box-shadow: inset 0 1px 0 color-mix(in srgb, #fff 5%, transparent);
}

html[data-theme="dark"] .account-page--overview .account-editorial-card__foot.account-panel__meta {
  background: linear-gradient(
    168deg,
    color-mix(in srgb, var(--acc-card-muted) 92%, var(--acc-section)) 0%,
    var(--acc-surface-silver-end) 100%
  );
  border-color: var(--acc-hairline);
}

html[data-theme="dark"] .account-page--overview .account-capabilities__grid--matrix {
  border-color: var(--acc-hairline);
  background: color-mix(in srgb, var(--acc-card-muted) 55%, var(--acc-section));
}

html[data-theme="dark"] .account-page--overview .account-readiness-card--graphite,
html[data-theme="dark"] .account-notifications-graphite,
html[data-theme="dark"] .account-page--security .account-security-logout,
html[data-theme="dark"] .account-page--security .account-security-logout.account-logout-panel {
  border-color: var(--acc-hero-border);
  background: var(--acc-hero-bg);
  box-shadow: var(--acc-hero-glow);
}

/* Profile: inner work cards vs section */
html[data-theme="dark"] .account-page--profile .account-profile-work-card,
html[data-theme="dark"] .account-page--profile .account-profile-email-card__work,
html[data-theme="dark"] .account-page--profile .account-profile-hints-card.account-profile-hints-block {
  background: var(--acc-card);
  border-color: var(--acc-hairline);
  box-shadow: var(--acc-shadow-card);
}

html[data-theme="dark"] .account-page--profile .account-profile-main .account-profile-save-footer.account-settings-footer {
  border-top-color: var(--acc-hairline);
}

html[data-theme="dark"] .account-page--profile .account-tz-suggest:not([hidden]) {
  background: linear-gradient(
    165deg,
    color-mix(in srgb, var(--acc-card-muted) 80%, var(--acc-section)) 0%,
    color-mix(in srgb, var(--ed-accent) 8%, var(--acc-card)) 100%
  );
  border-color: color-mix(in srgb, var(--ed-accent) 22%, var(--acc-hairline));
  box-shadow: inset 0 1px 0 color-mix(in srgb, #fff 5%, transparent);
}

html[data-theme="dark"] .account-page--profile .account-tz-suggest .btn-sm {
  background: var(--acc-card-raised);
  border-color: color-mix(in srgb, var(--ed-accent) 18%, var(--acc-hairline));
}

html[data-theme="dark"] .account-page--profile .account-profile-work-card .editorial-input,
html[data-theme="dark"] .account-page--profile .account-profile-work-card select.editorial-input {
  background: var(--acc-muted-surface);
  border-color: var(--acc-hairline);
}

/* Notifications: telegram panel off silver system (was #f8fafc) */
html[data-theme="dark"] .account-notifications-telegram-panel {
  background: var(--acc-card);
  border-color: var(--acc-hairline);
  box-shadow: var(--acc-shadow-card);
}

html[data-theme="dark"] .account-page--notifications .account-notifications-kinds .account-status-card.account-fact {
  background: var(--acc-card);
  border-color: var(--acc-hairline);
}

html[data-theme="dark"] .account-page--notifications .account-telegram-hero__status {
  background: var(--acc-card-muted);
  border-color: var(--acc-hairline);
}

/* Security: work cards + sessions */
html[data-theme="dark"] .account-page--security .account-security-work-card,
html[data-theme="dark"] .account-page--security .account-security-future-card,
html[data-theme="dark"] .account-page--security .account-security-session-current,
html[data-theme="dark"] .account-body .account-session-current {
  background: var(--acc-card);
  border-color: var(--acc-hairline);
  box-shadow: var(--acc-shadow-card);
}

html[data-theme="dark"] .account-page--security .account-security-identities__head {
  border-bottom-color: var(--acc-hairline);
}

html[data-theme="dark"] .account-page--security .account-security-email-card__aside {
  border-left-color: var(--acc-hairline);
}

html[data-theme="dark"] .account-body .account-settings-row--readonly.account-surface--brand-calm,
html[data-theme="dark"] .account-body .account-identity-future.account-surface--brand-calm {
  background: linear-gradient(
    168deg,
    color-mix(in srgb, var(--acc-card-muted) 85%, var(--acc-section)) 0%,
    var(--acc-card) 100%
  );
}

html[data-theme="dark"] .account-body .account-stream-empty {
  background: var(--acc-muted-surface);
}

html[data-theme="dark"] .account-page--overview .account-compare--trial-framed .account-compare__col {
  background: linear-gradient(
    168deg,
    var(--acc-card-raised) 0%,
    color-mix(in srgb, var(--acc-card) 88%, var(--acc-card-muted)) 100%
  );
  border-color: var(--acc-hairline);
  box-shadow: var(--acc-shadow-card);
}

html[data-theme="dark"] .account-page--overview .account-compare--trial-framed .account-compare__col--offer {
  background: linear-gradient(
    168deg,
    color-mix(in srgb, var(--ed-accent) 11%, var(--acc-card-raised)) 0%,
    color-mix(in srgb, var(--acc-card) 82%, var(--acc-card-muted)) 100%
  );
  border-color: color-mix(in srgb, var(--ed-accent) 18%, var(--acc-hairline));
  box-shadow:
    inset 0 1px 0 color-mix(in srgb, var(--ed-accent) 10%, transparent),
    var(--acc-shadow-card);
}

html[data-theme="dark"] .account-page--overview .account-surface__ambient--trial-compare {
  opacity: 0.72;
}

