/* ============================================================
   Flexus Studio — Visual System
   "Playful precision" — Author: Mauro Gashfix
   --------------------------------------------------------
   Crisp white canvas · deep indigo ink var(--color-midnight-ink, #171526) · loud magenta
   brand accent var(--color-notion-blue, #fa2f62) · electric violet var(--color-lavender, #794dff) for billboards
   · ink pill CTAs · near-black navy islands var(--color-midnight-brand, #03061a) with lime
   #97f675 sparks · geometric grotesque type (Rethink Sans).

   Loaded only when the Studio visual theme is active.
   Every rule is scoped to body.fx-theme-studio so Classic
   remains untouched. Covers: design tokens, global chrome
   (navbar/footer/buttons/forms), marketing surfaces, client
   area shell, order form shell and the Studio homepage (st-*).
   ============================================================ */

/* ------------------------------------------------------------
   1. DESIGN TOKENS
   Color values come from FlexusThemeTokens (admin Colors tab).
   This block only locks Studio shape / type / shadow language.
   ------------------------------------------------------------ */
body.fx-theme-studio {
  /* Shape / shadow only — font families & weights come from ThemeTokens. */

  /* Shape — rounder everything, pill CTAs */
  --radius-md: 6px;
  --radius-lg: 10px;
  --radius-xl: 14px;
  --radius-2xl: 18px;
  --radius-2xl-2: 22px;
  --radius-cards: 14px;
  --radius-largecards: 20px;
  --radius-inputs: 12px;
  --radius-buttons: 999px;

  /* Shadows — soft ink */
  --shadow-subtle: 0 1px 2px rgba(23, 21, 38, 0.04), 0 4px 14px rgba(23, 21, 38, 0.05);
  --shadow-sm: 0 4px 14px rgba(23, 21, 38, 0.07);
  --shadow-sm-2: 0 6px 18px rgba(23, 21, 38, 0.08);
  --shadow-subtle-2: 0 6px 18px rgba(23, 21, 38, 0.08);
  --shadow-md: 0 12px 28px -6px rgba(23, 21, 38, 0.1);
  --shadow-lg: 0 24px 48px -10px rgba(23, 21, 38, 0.16);
}

/* ------------------------------------------------------------
   2. BASE
   ------------------------------------------------------------ */
body.fx-theme-studio {
  background: var(--surface-page, var(--color-paper-warmth, #ffffff));
  color: var(--color-midnight-ink, #171526);
  font-family: var(--font-inter);
  font-weight: var(--font-weight-ui, 400);
}
body.fx-theme-studio ::selection { background: var(--color-notion-blue, #fa2f62); color: #ffffff; }

body.fx-theme-studio h1,
body.fx-theme-studio h2,
body.fx-theme-studio h3,
body.fx-theme-studio h4,
body.fx-theme-studio h5 {
  font-family: var(--font-inter);
  font-weight: var(--font-weight-ui, 500);
  color: var(--color-midnight-ink, #171526);
  letter-spacing: -0.022em;
}
body.fx-theme-studio h1, body.fx-theme-studio h2 { font-weight: var(--font-weight-ui, 500); }

body.fx-theme-studio a { color: var(--color-notion-blue, #fa2f62); }
body.fx-theme-studio a:hover { color: var(--color-deep-sapphire, #d1114b); }

/* Serif role — editorial / supporting copy */
body.fx-theme-studio .st-hero__sub,
body.fx-theme-studio .stv-hero__sub,
body.fx-theme-studio .sts-hero__sub,
body.fx-theme-studio .st-statement__text,
body.fx-theme-studio .sto-config__lead,
body.fx-theme-studio .sto-domain__lead,
body.fx-theme-studio .sto-cart__lead,
body.fx-theme-studio .sto-checkout__lead,
body.fx-theme-studio .sto-complete__lead,
body.fx-theme-studio #order-flexus_cart .fx-notion-domain__lead {
  font-family: var(--font-serif);
  font-weight: var(--font-weight-serif, 400);
}

/* Italic accent words inside display type */
body.fx-theme-studio .st-hero__title em,
body.fx-theme-studio .st-statement__text em,
body.fx-theme-studio .st-h2 em,
body.fx-theme-studio .st-finale__tag em {
  font-style: italic; color: var(--color-notion-blue, #fa2f62);
}
body.fx-theme-studio .st-em--violet { color: var(--color-lavender, #794dff) !important; }

/* ------------------------------------------------------------
   3. BUTTONS — ink pills
   ------------------------------------------------------------ */
body.fx-theme-studio .btn { padding: 11px 22px; font-weight: 600; }
body.fx-theme-studio .btn-sm, body.fx-theme-studio .btn-group-sm > .btn { padding: 7px 16px; }
body.fx-theme-studio .btn-lg { padding: 14px 28px; }

body.fx-theme-studio .btn-primary {
  background: var(--color-midnight-brand, #03061a); border-color: var(--color-midnight-brand, #03061a); color: #ffffff;
  box-shadow: 0 6px 16px -6px rgba(23, 21, 38, 0.4);
  transition: background .2s ease, transform .2s ease, box-shadow .2s ease;
}
body.fx-theme-studio .btn-primary:hover,
body.fx-theme-studio .btn-primary:focus {
  background: var(--color-midnight-brand, #03061a); border-color: var(--color-midnight-brand, #03061a); color: #fff;
  transform: translateY(-1px);
  box-shadow: 0 10px 22px -8px rgba(23, 21, 38, 0.45);
}
body.fx-theme-studio .btn-default,
body.fx-theme-studio .btn-outline-primary {
  background: var(--color-pure-white, #ffffff); color: var(--color-midnight-ink, #171526); border-color: var(--color-smoke, #d9d7e6);
}
body.fx-theme-studio .btn-default:hover,
body.fx-theme-studio .btn-outline-primary:hover {
  border-color: var(--color-midnight-brand, #03061a); color: var(--color-midnight-ink, #171526); background: var(--color-pure-white, #ffffff);
}

/* ------------------------------------------------------------
   4. FORMS
   ------------------------------------------------------------ */
body.fx-theme-studio .form-control,
body.fx-theme-studio select.form-control,
body.fx-theme-studio textarea.form-control {
  border-radius: 12px;
  border-color: var(--color-ash-solid, #e7e5f2);
  color: var(--color-midnight-ink, #171526);
}
body.fx-theme-studio .form-control:focus {
  border-color: var(--color-midnight-brand, #03061a);
  box-shadow: 0 0 0 3px rgba(23, 21, 38, 0.1);
}

/* ------------------------------------------------------------
   5. NAVBAR — floating pill + clean Studio mega panels
   ------------------------------------------------------------ */
body.fx-theme-studio .fx-navwrap,
body.fx-theme-studio .st-navwrap {
  top: 14px;
  padding-inline: 16px;
}
body.fx-theme-studio .fx-navbar,
body.fx-theme-studio .st-navbar {
  max-width: 1080px;
  height: 60px;
  border-radius: 999px;
  border: 1px solid var(--color-ash-solid, #eceaf6);
  background: rgba(255, 255, 255, 0.92);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  padding-inline: 18px 14px;
  box-shadow: 0 1px 2px rgba(23, 21, 38, 0.04), 0 12px 32px rgba(23, 21, 38, 0.07);
}
body.fx-theme-studio .fx-navbar__brand b {
  font-family: var(--font-inter);
  font-weight: 800;
  letter-spacing: -0.02em;
  color: var(--color-midnight-ink, #171526);
}
body.fx-theme-studio .fx-navbar__brand i { color: var(--color-notion-blue, #fa2f62); }
body.fx-theme-studio .fx-navbar .btn-primary,
body.fx-theme-studio .st-nav-cta { box-shadow: none; }

body.fx-theme-studio .st-nm .fx-nm-trigger {
  font-family: var(--font-inter);
  font-size: 14px; font-weight: 600;
  color: #3f3d52;
  border-radius: 999px;
  padding: 8px 14px;
}
body.fx-theme-studio .st-nm .fx-nm-trigger:hover,
body.fx-theme-studio .st-nm .fx-nm-trigger:focus-visible {
  background: var(--color-paper-mist, #f2f3f7); color: var(--color-midnight-ink, #171526);
}
body.fx-theme-studio .st-nm .fx-nm-trigger[aria-expanded="true"],
body.fx-theme-studio .st-nm .fx-nm-trigger.is-active {
  background: var(--color-sky-tint, #ffe9ef); color: var(--color-deep-sapphire, #d1114b);
}
body.fx-theme-studio .st-nm .fx-nm-trigger .fx-caret { color: #8b899c; }

body.fx-theme-studio .st-navbar__cluster .fx-btn-outline,
body.fx-theme-studio .st-nav-login {
  border-radius: 999px; border-color: var(--color-ash-solid, #eceaf6); color: var(--color-midnight-ink, #171526);
  font-weight: 600; background: transparent;
}
body.fx-theme-studio .st-navbar__cluster .fx-btn-outline:hover,
body.fx-theme-studio .st-nav-login:hover {
  background: var(--color-paper-mist, #f2f3f7); border-color: #e0deeb;
}
body.fx-theme-studio .st-navbar__cluster .fx-btn-primary,
body.fx-theme-studio .st-nav-cta {
  border-radius: 999px; background: var(--color-midnight-brand, #03061a); border-color: var(--color-midnight-brand, #03061a);
  color: #ffffff; font-weight: 700;
}
body.fx-theme-studio .st-navbar__cluster .fx-btn-primary:hover,
body.fx-theme-studio .st-nav-cta:hover {
  background: #2a2740; border-color: #2a2740;
}
body.fx-theme-studio .st-navbar .fx-burger {
  color: var(--color-midnight-ink, #171526); border-radius: 999px;
}
body.fx-theme-studio .st-navbar .fx-burger:hover { background: var(--color-paper-mist, #f2f3f7); }

/* Mega panels */
body.fx-theme-studio .st-nm-viewport {
  top: calc(100% + 10px);
}
body.fx-theme-studio .st-nav-panel.fx-nm-panel {
  width: min(920px, calc(100vw - 32px));
  border-radius: 24px;
  border: 1px solid var(--color-ash-solid, #eceaf6);
  background: var(--color-pure-white, #ffffff);
  box-shadow: 0 24px 60px -20px rgba(23, 21, 38, 0.28);
  backdrop-filter: none;
  overflow: hidden;
}
body.fx-theme-studio .st-nav-products {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 6px;
  padding: 14px;
}
body.fx-theme-studio .st-nav-item {
  display: flex; align-items: center; gap: 12px;
  padding: 12px 14px;
  border-radius: 16px;
  text-decoration: none;
  color: var(--color-midnight-ink, #171526);
  border: 1px solid transparent;
  transition: background .18s ease, border-color .18s ease, transform .18s ease;
}
body.fx-theme-studio .st-nav-item:hover {
  background: var(--color-paper-mist, #f8faff);
  border-color: var(--color-ash-solid, #eceaf6);
}
body.fx-theme-studio .st-nav-item__icon {
  width: 40px; height: 40px; flex-shrink: 0;
  border-radius: 12px;
  display: inline-flex; align-items: center; justify-content: center;
  background: var(--color-paper-mist, #f2f3f7); color: var(--color-midnight-ink, #171526); font-size: 15px;
  transition: background .18s ease, color .18s ease;
}
body.fx-theme-studio .st-nav-item:hover .st-nav-item__icon {
  background: var(--color-sky-tint, #ffe9ef); color: var(--color-notion-blue, #fa2f62);
}
body.fx-theme-studio .st-nav-item__body {
  display: flex; flex-direction: column; gap: 2px; min-width: 0; flex: 1;
}
body.fx-theme-studio .st-nav-item__title {
  display: inline-flex; align-items: center; gap: 8px;
  font-family: var(--font-inter);
  font-size: 14.5px; font-weight: 650; letter-spacing: -0.01em; color: var(--color-midnight-ink, #171526);
}
body.fx-theme-studio .st-nav-item__badge {
  font-style: normal; font-size: 10px; font-weight: 700;
  text-transform: uppercase; letter-spacing: 0.04em;
  padding: 2px 7px; border-radius: 999px;
  background: var(--color-sky-tint, #ffe9ef); color: var(--color-deep-sapphire, #d1114b);
}
body.fx-theme-studio .st-nav-item__desc {
  font-size: 12.5px; line-height: 1.4; color: #6b6980;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  text-transform: none;
}
body.fx-theme-studio .st-nav-item__desc::first-letter {
  text-transform: uppercase;
}
body.fx-theme-studio .st-nav-item__go {
  font-size: 11px; color: #b0aec0; opacity: 0;
  transform: translateX(-4px);
  transition: opacity .18s ease, transform .18s ease, color .18s ease;
}
body.fx-theme-studio .st-nav-item:hover .st-nav-item__go {
  opacity: 1; transform: translateX(0); color: var(--color-notion-blue, #fa2f62);
}
body.fx-theme-studio .st-nav-panel__foot {
  border-top: 1px solid #f0eef8;
  padding: 10px 14px 12px;
}
body.fx-theme-studio .st-nav-footlink {
  display: inline-flex; align-items: center; gap: 8px;
  font-size: 13.5px; font-weight: 700; color: var(--color-midnight-ink, #171526);
  text-decoration: none; padding: 8px 10px; border-radius: 10px;
}
body.fx-theme-studio .st-nav-footlink:hover { background: var(--color-paper-mist, #f2f3f7); color: var(--color-notion-blue, #fa2f62); }
body.fx-theme-studio .st-nav-footlink i { font-size: 11px; }

/* Company panel */
body.fx-theme-studio .st-nav-company {
  display: grid; grid-template-columns: 1.15fr 0.85fr; gap: 0;
}
body.fx-theme-studio .st-nav-company__col {
  padding: 16px 14px;
  display: flex; flex-direction: column; gap: 4px;
}
body.fx-theme-studio .st-nav-company__col + .st-nav-company__col {
  border-left: 1px solid var(--color-ash-solid, #f0eef8);
  background: var(--color-paper-mist, #fbfbfe);
}
body.fx-theme-studio .st-nav-company__label {
  margin: 0 0 8px 10px;
  font-size: 11px; font-weight: 700; letter-spacing: 0.08em;
  text-transform: uppercase; color: #8b899c;
}
body.fx-theme-studio .st-nav-item--row .st-nav-item__desc { white-space: normal; }

/* Mobile sheet — full Studio treatment + visible descriptions */
body.fx-theme-studio .st-sheet.fx-sheet {
  background: var(--color-pure-white, #ffffff);
  border-left: 1px solid var(--color-ash-solid, #eceaf6);
  box-shadow: -24px 0 60px rgba(23, 21, 38, 0.16);
  backdrop-filter: none;
  max-width: 400px;
}
body.fx-theme-studio .st-sheet__head {
  height: 64px;
  justify-content: space-between;
  padding-inline: 18px;
  border-bottom: 1px solid #f0eef8;
}
body.fx-theme-studio .st-sheet__brand {
  font-family: var(--font-inter);
  font-size: 17px; font-weight: 800; letter-spacing: -0.02em; color: var(--color-midnight-ink, #171526);
}
body.fx-theme-studio .st-sheet .fx-sheet__close {
  background: var(--color-paper-mist, #f2f3f7); color: var(--color-midnight-ink, #171526); border-radius: 999px;
}
body.fx-theme-studio .st-sheet .fx-sheet__close:hover { background: var(--color-sky-tint, #ffe9ef); color: var(--color-notion-blue, #fa2f62); }
body.fx-theme-studio .st-sheet .fx-acc__content {
  overflow: hidden;
  transition: max-height .25s ease;
}
body.fx-theme-studio .st-sheet .fx-acc__item[data-open="true"] > .fx-acc__content {
  max-height: 2400px;
}
body.fx-theme-studio .st-sheet-acc .fx-acc__item {
  border-bottom: 1px solid #f0eef8;
}
body.fx-theme-studio .st-sheet .fx-acc__trigger {
  font-family: var(--font-inter);
  font-size: 15px; font-weight: 700; color: var(--color-midnight-ink, #171526);
  text-transform: none; letter-spacing: 0; padding: 16px 4px;
}
body.fx-theme-studio .st-sheet .fx-acc__trigger i { color: #8b899c; }
body.fx-theme-studio .st-sheet-profile {
  display: flex; align-items: center; gap: 12px;
  padding: 12px 14px; margin-bottom: 8px;
  border-radius: 16px; background: var(--color-paper-mist, #f8faff); border: 1px solid var(--color-ash-solid, #eceaf6);
}
body.fx-theme-studio .st-sheet-profile img {
  width: 44px; height: 44px; border-radius: 999px; object-fit: cover;
}
body.fx-theme-studio .st-sheet-profile b {
  display: block; font-size: 14.5px; font-weight: 700; color: var(--color-midnight-ink, #171526);
}
body.fx-theme-studio .st-sheet-profile small {
  display: block; font-size: 12.5px; color: #6b6980;
}

body.fx-theme-studio .st-sheet-section {
  margin: 0 0 18px;
}
body.fx-theme-studio .st-sheet-section__label {
  margin: 0 4px 10px;
  font-family: var(--font-inter);
  font-size: 12px; font-weight: 700; letter-spacing: 0.06em;
  text-transform: uppercase; color: #8b899c;
}
body.fx-theme-studio .st-moblist {
  display: grid; gap: 6px; list-style: none; margin: 0; padding: 0;
}
body.fx-theme-studio .st-mobitem {
  display: flex; align-items: flex-start; gap: 12px;
  padding: 12px 12px;
  border-radius: 16px;
  border: 1px solid transparent;
  text-decoration: none; color: var(--color-midnight-ink, #171526);
  text-transform: none;
  transition: background .18s ease, border-color .18s ease;
}
body.fx-theme-studio .st-mobitem:hover,
body.fx-theme-studio .st-mobitem:active {
  background: var(--color-paper-mist, #f8faff); border-color: var(--color-ash-solid, #eceaf6);
}
body.fx-theme-studio .st-mobitem__icon {
  width: 42px; height: 42px; flex-shrink: 0;
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: 12px; background: var(--color-paper-mist, #f2f3f7); color: var(--color-midnight-ink, #171526); font-size: 15px;
  transition: background .18s ease, color .18s ease;
}
body.fx-theme-studio .st-mobitem:hover .st-mobitem__icon {
  background: var(--color-sky-tint, #ffe9ef); color: var(--color-notion-blue, #fa2f62);
}
body.fx-theme-studio .st-mobitem__body {
  display: flex; flex-direction: column; gap: 3px;
  min-width: 0; flex: 1; padding-top: 1px;
  text-transform: none;
}
body.fx-theme-studio .st-mobitem__title {
  display: inline-flex; align-items: center; flex-wrap: wrap; gap: 7px;
  font-family: var(--font-inter);
  font-size: 14.5px; font-weight: 700; letter-spacing: -0.01em; color: var(--color-midnight-ink, #171526);
  line-height: 1.25;
  text-transform: none;
}
body.fx-theme-studio .st-mobitem__badge {
  font-style: normal; font-size: 10px; font-weight: 700;
  text-transform: uppercase; letter-spacing: 0.04em;
  padding: 2px 7px; border-radius: 999px;
  background: var(--color-sky-tint, #ffe9ef); color: var(--color-deep-sapphire, #d1114b);
}
body.fx-theme-studio .st-mobitem__desc {
  display: block;
  font-size: 12.5px; line-height: 1.45; color: #6b6980;
  font-weight: 500;
  white-space: normal; overflow: visible; text-overflow: unset;
  text-transform: none;
  opacity: 1; max-height: none;
}
body.fx-theme-studio .st-mobitem__desc::first-letter {
  text-transform: uppercase;
}

body.fx-theme-studio .st-sheet-pricing {
  display: flex; flex-direction: column; gap: 3px;
  margin: 10px 0 0; padding: 14px 16px; border-radius: 16px;
  text-decoration: none; background: var(--color-paper-mist, #f2f3f7); border: 1px solid transparent;
}
body.fx-theme-studio .st-sheet-pricing:hover {
  background: var(--color-sky-tint, #ffe9ef); border-color: #ffd0dc;
}
body.fx-theme-studio .st-sheet-pricing .st-mobitem__title { color: var(--color-midnight-ink, #171526); }
body.fx-theme-studio .st-sheet-pricing:hover .st-mobitem__title { color: var(--color-deep-sapphire, #d1114b); }
body.fx-theme-studio .st-sheet-pricing .st-mobitem__desc { color: #6b6980; }

body.fx-theme-studio .st-sheet__cta {
  gap: 10px; padding: 14px 16px 18px; border-top: 1px solid #f0eef8;
  background: var(--color-pure-white, #ffffff);
}
body.fx-theme-studio .st-sheet__cta .fx-btn {
  min-height: 46px; justify-content: center; font-weight: 700;
}
body.fx-theme-studio .st-sheet__cta .fx-btn-primary {
  border-radius: 999px; background: var(--color-midnight-brand, #03061a); border-color: var(--color-midnight-brand, #03061a); color: #ffffff;
}
body.fx-theme-studio .st-sheet__cta .fx-btn-outline {
  border-radius: 999px; border-color: var(--color-ash-solid, #eceaf6); color: var(--color-midnight-ink, #171526); background: var(--color-pure-white, #ffffff);
}

/* ---- Bottom mobile dock (the floating pill) ---- */
body.fx-theme-studio {
  --component-active-color-default: var(--color-notion-blue, #fa2f62);
  --component-active-bg: var(--color-sky-tint, #ffe9ef);
  --component-inactive-color: #8b899c;
  --component-bg: #ffffff;
  --component-shadow: var(--color-ash-solid, #eceaf6);
}
body.fx-theme-studio .fx-mobile-menu-dock .menu {
  border-color: var(--color-ash-solid, #eceaf6);
  background: rgba(255, 255, 255, 0.96);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  box-shadow: 0 2px 8px rgba(23, 21, 38, 0.06), 0 12px 32px rgba(23, 21, 38, 0.12);
  padding: 8px 6px;
}
body.fx-theme-studio .fx-mobile-menu-dock .menu__item {
  gap: 4px;
  padding: 8px 4px 10px;
  color: #8b899c;
  font-family: var(--font-inter);
}
body.fx-theme-studio .fx-mobile-menu-dock .menu__item.active {
  color: var(--color-notion-blue, #fa2f62);
  background: var(--color-sky-tint, #ffe9ef);
}
body.fx-theme-studio .fx-mobile-menu-dock .menu__text {
  /* Always visible — don't wait for click */
  opacity: 1 !important;
  max-height: 18px !important;
  margin-top: 2px !important;
  overflow: visible;
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: -0.01em;
  text-transform: none !important;
  color: inherit;
}
body.fx-theme-studio .fx-mobile-menu-dock .menu__text::first-letter {
  text-transform: uppercase;
}
body.fx-theme-studio .fx-mobile-menu-dock .menu__text.active::after {
  background: var(--color-notion-blue, #fa2f62);
  bottom: -4px;
  height: 2px;
  border-radius: 2px;
}

/* Submenus above the dock */
body.fx-theme-studio .fx-mobile-submenu__panel {
  border-color: var(--color-ash-solid, #eceaf6);
  border-radius: 24px;
  box-shadow: 0 8px 30px rgba(23, 21, 38, 0.16);
}
body.fx-theme-studio .fx-mobile-submenu__head {
  background: var(--color-paper-mist, #f8faff);
  border-bottom-color: #f0eef8;
}
body.fx-theme-studio .fx-mobile-submenu__head strong {
  font-family: var(--font-inter);
  font-weight: 800;
  text-transform: none;
  color: var(--color-midnight-ink, #171526);
}
body.fx-theme-studio .fx-mobile-submenu__link {
  border-radius: 14px;
  gap: 12px;
  padding: 12px;
}
body.fx-theme-studio .fx-mobile-submenu__link:hover {
  background: var(--color-paper-mist, #f8faff);
}
body.fx-theme-studio .fx-mobile-submenu__link > i {
  width: 36px; height: 36px;
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: 12px; background: var(--color-paper-mist, #f2f3f7); color: var(--color-midnight-ink, #171526); margin-top: 0;
}
body.fx-theme-studio .fx-mobile-submenu__link:hover > i {
  background: var(--color-sky-tint, #ffe9ef); color: var(--color-notion-blue, #fa2f62);
}
body.fx-theme-studio .fx-mobile-submenu__link b {
  font-family: var(--font-inter);
  font-weight: 700; color: var(--color-midnight-ink, #171526); text-transform: none;
}
body.fx-theme-studio .fx-mobile-submenu__link small {
  display: block;
  color: #6b6980;
  text-transform: none;
  opacity: 1;
  max-height: none;
}
body.fx-theme-studio .fx-mobile-submenu__link small::first-letter {
  text-transform: uppercase;
}

@media (max-width: 720px) {
  body.fx-theme-studio .st-nav-products { grid-template-columns: 1fr; }
  body.fx-theme-studio .st-nav-company { grid-template-columns: 1fr; }
  body.fx-theme-studio .st-nav-company__col + .st-nav-company__col {
    border-left: 0; border-top: 1px solid #f0eef8;
  }
}

/* ------------------------------------------------------------
   6. EYEBROWS, BADGES, CHIPS
   ------------------------------------------------------------ */
body.fx-theme-studio .fx-eyebrow-pill { background: var(--color-sky-tint, #ffe9ef); border-color: transparent; color: #4f4d63; }
body.fx-theme-studio .fx-eyebrow-pill i { color: var(--color-notion-blue, #fa2f62); }
body.fx-theme-studio .fx-badge--success { background: #d5fced; color: #043422; }
body.fx-theme-studio .fx-badge--info { background: #e4dbff; color: #3c1e99; }

/* ------------------------------------------------------------
   7. MARKETING SURFACES
   ------------------------------------------------------------ */
/* Accent panels — saturated billboards instead of warm hues */
body.fx-theme-studio .fx-accent-panel--marigold { background: var(--color-lavender, #794dff); }
body.fx-theme-studio .fx-accent-panel--coral { background: var(--color-notion-blue, #fa2f62); }
body.fx-theme-studio .fx-accent-panel--sky { background: #0099ff; }
body.fx-theme-studio .fx-accent-panel--tint { background: var(--color-sky-tint, #ffe9ef); }
body.fx-theme-studio .fx-accent-panel--peach { background: var(--color-peach, #fed7e1); }
body.fx-theme-studio .fx-accent-panel--mist { background: var(--color-paper-mist, #f8faff); }
body.fx-theme-studio .fx-accent-panel--midnight { background: var(--color-midnight-brand, #03061a); }
body.fx-theme-studio .fx-accent-panel--marigold figcaption,
body.fx-theme-studio .fx-accent-panel--sky figcaption { color: rgba(255, 255, 255, 0.72); }

body.fx-theme-studio .bg-canvas,
body.fx-theme-studio .bg-background { background-color: var(--color-pure-white, #ffffff); }

/* Service cards */
body.fx-theme-studio .fx-svc { border-radius: 16px; }
body.fx-theme-studio .fx-svc:hover { border-color: rgba(23, 21, 38, 0.3); box-shadow: 0 12px 28px -8px rgba(23, 21, 38, 0.12); }
body.fx-theme-studio .fx-svc__icon { background: var(--color-paper-mist, #f8faff); border-radius: 12px; }
body.fx-theme-studio .fx-svc:hover .fx-svc__icon { background: var(--color-sky-tint, #ffe9ef); color: var(--color-notion-blue, #fa2f62); }
body.fx-theme-studio .fx-svc:hover .fx-svc__go { color: var(--color-notion-blue, #fa2f62); }

/* Dark navy island: domain band + lime sparks */
body.fx-theme-studio .fx-domainband { background: var(--color-midnight-brand, #03061a); border-radius: 22px; }
body.fx-theme-studio .fx-domainband::after {
  background: radial-gradient(closest-side, rgba(121, 77, 255, 0.4), transparent 70%);
}
body.fx-theme-studio .fx-domainband__form input { border-radius: 999px; padding-inline: 22px; }
body.fx-theme-studio .fx-domainband__form input:focus { border-color: #97f675; }
body.fx-theme-studio .fx-domainband__tld b { color: #97f675; }

body.fx-theme-studio .fx-checklist li i { color: var(--color-notion-blue, #fa2f62); }

/* ------------------------------------------------------------
   8. MEGA FOOTER — light, magenta hits
   ------------------------------------------------------------ */
body.fx-theme-studio .fx-footer { background: var(--color-pure-white, #ffffff); border-top: 1px solid var(--color-ash-solid, #eceaf6); }
body.fx-theme-studio .fx-footer__col h6 { color: var(--color-midnight-ink, #171526); }
body.fx-theme-studio .fx-footer__col a { color: #75738c; }
body.fx-theme-studio .fx-footer__col a:hover { color: var(--color-notion-blue, #fa2f62); }
body.fx-theme-studio .fx-footer__brandblurb { color: #75738c; }
body.fx-theme-studio .fx-footer__bottom { border-top-color: var(--color-ash-solid, #eceaf6); color: #75738c; }
body.fx-theme-studio .fx-footer__bottom a { color: #75738c; }
body.fx-theme-studio .fx-footer__bottom a:hover { color: var(--color-midnight-ink, #171526); }
body.fx-theme-studio .fx-footer__social a { color: var(--color-notion-blue, #fa2f62); }
body.fx-theme-studio .fx-footer__social a:hover { color: var(--color-deep-sapphire, #d1114b); }

/* ------------------------------------------------------------
   9. CLIENT AREA — app shell on a cool wash
   ------------------------------------------------------------ */
body.fx-theme-studio.fx-portal-active { background: var(--color-paper-mist, #f8faff); }
body.fx-theme-studio .fx-side {
  background: var(--color-pure-white, #ffffff);
  border: 1px solid var(--color-ash-solid, #eceaf6);
  border-radius: 20px;
  box-shadow: 0 1px 2px rgba(23, 21, 38, 0.03), 0 8px 24px rgba(23, 21, 38, 0.04);
}
body.fx-theme-studio .fx-side__link { border-radius: 999px; }
body.fx-theme-studio .fx-side__link.is-active { background: var(--color-sky-tint, #ffe9ef); color: var(--color-deep-sapphire, #d1114b); }
body.fx-theme-studio .fx-side__link.is-active i { color: var(--color-notion-blue, #fa2f62); }
body.fx-theme-studio .fx-side__profile { border-radius: 16px; }

body.fx-theme-studio .fx-stat,
body.fx-theme-studio .card {
  border-color: var(--color-ash-solid, #eceaf6);
  border-radius: 16px;
}
body.fx-theme-studio .fx-dash-pill { border-radius: 999px; }

/* ------------------------------------------------------------
   10. ALERTS & PANELS
   ------------------------------------------------------------ */
body.fx-theme-studio .alert { border-radius: 14px; }
body.fx-theme-studio .alert-info { background: #e4dbff; color: #3c1e99; border-color: transparent; }
body.fx-theme-studio .alert-success { background: #d5fced; color: #043422; border-color: transparent; }

/* ------------------------------------------------------------
   11. STUDIO HOMEPAGE (st-*)
   ------------------------------------------------------------ */

/* --- Hero: split copy + photo with floating activity cards --- */
body.fx-theme-studio .st-hero { padding: clamp(40px, 7vh, 88px) 0 clamp(24px, 4vh, 48px); overflow: hidden; }
body.fx-theme-studio .st-hero__grid {
  display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr);
  gap: clamp(32px, 5vw, 72px); align-items: center;
}
body.fx-theme-studio .st-hero__badge {
  display: inline-flex; align-items: center; gap: 10px;
  background: var(--color-pure-white, #ffffff); border: 1px solid var(--color-ash-solid, #e7e5f2); border-radius: 999px;
  padding: 7px 16px; font-size: 13.5px; font-weight: 600; color: #4f4d63;
  margin-bottom: 24px; text-decoration: none;
  box-shadow: 0 1px 2px rgba(23, 21, 38, 0.04);
  transition: border-color .2s ease;
}
body.fx-theme-studio .st-hero__badge:hover { border-color: var(--color-notion-blue, #fa2f62); color: #4f4d63; }
body.fx-theme-studio .st-hero__badge-dot {
  width: 8px; height: 8px; border-radius: 50%; background: #2fbf71;
  animation: st-pulse 2.2s ease-out infinite;
}
@keyframes st-pulse {
  0% { box-shadow: 0 0 0 0 rgba(47, 191, 113, 0.45); }
  70% { box-shadow: 0 0 0 9px rgba(47, 191, 113, 0); }
  100% { box-shadow: 0 0 0 0 rgba(47, 191, 113, 0); }
}
body.fx-theme-studio .st-hero__title {
  font-size: clamp(36px, 4.9vw, 64px); line-height: 1.06; letter-spacing: -0.03em;
  font-weight: 500; color: var(--color-midnight-ink, #171526); margin: 0 0 20px;
}
body.fx-theme-studio .st-hero__sub {
  font-size: clamp(15px, 1.5vw, 18px); line-height: 1.62; color: #56546b;
  max-width: 54ch; margin: 0 0 28px;
}
body.fx-theme-studio .st-hero__actions { display: flex; gap: 22px; align-items: center; flex-wrap: wrap; }
body.fx-theme-studio .st-hero__alt {
  font-size: 15px; font-weight: 700; color: var(--color-midnight-ink, #171526);
  text-decoration: underline; text-underline-offset: 4px; text-decoration-thickness: 1.5px;
}
body.fx-theme-studio .st-hero__alt:hover { color: var(--color-notion-blue, #fa2f62); }

body.fx-theme-studio .st-hero__visual { position: relative; }
body.fx-theme-studio .st-hero__photo {
  width: 100%; aspect-ratio: 4 / 4.4; object-fit: cover; display: block;
  border-radius: 24px;
}
body.fx-theme-studio .st-hero__mock {
  position: absolute; z-index: 2; left: 16px; right: 16px; bottom: 16px;
  pointer-events: none;
}
body.fx-theme-studio .st-hero__mock .sth-score,
body.fx-theme-studio .st-hero__mock .stw-admin,
body.fx-theme-studio .st-hero__mock .stm-inbox,
body.fx-theme-studio .st-hero__mock .sta-console,
body.fx-theme-studio .st-hero__mock .stv-term {
  box-shadow: 0 18px 40px -12px rgba(23, 21, 38, 0.4);
}
body.fx-theme-studio .st-hero__mock--score .sth-score__rings { padding: 16px 12px 14px; gap: 8px; }
body.fx-theme-studio .st-hero__mock--score .sth-ring svg { width: 56px; height: 56px; }
body.fx-theme-studio .st-hero__mock--score .sth-ring b { top: 16px; font-size: 15px; }
body.fx-theme-studio .st-hero__mock--score .sth-score__meta { display: none; }
body.fx-theme-studio .st-hero__mock--term .stv-term__body,
body.fx-theme-studio .st-hero__mock--term .stv-term__body code {
  min-height: 0; padding: 14px 16px; font-size: 11.5px; line-height: 1.55;
  max-height: 168px; overflow: hidden; background: #0b0e1c !important;
}
body.fx-theme-studio .st-hero__mock--admin .stw-admin__body { padding: 6px; }
body.fx-theme-studio .st-hero__mock--admin .stw-admin__row { padding: 10px 12px; }
body.fx-theme-studio .st-hero__mock--inbox .stm-inbox__foot { display: none; }
body.fx-theme-studio .st-hero__mock--console .sta-console__body,
body.fx-theme-studio .st-hero__mock--console .sta-console__body code {
  min-height: 0; padding: 14px 16px; font-size: 11.5px; line-height: 1.55;
  max-height: 168px; overflow: hidden; background: var(--color-midnight-brand, #03061a) !important;
}
body.fx-theme-studio .stv-hero__visual .st-hero__photo {
  border: 1px solid rgba(255, 255, 255, 0.1);
  box-shadow: 0 30px 60px -20px rgba(0, 0, 0, 0.55);
}
body.fx-theme-studio .st-float {
  position: absolute; z-index: 3; display: inline-flex; align-items: center; gap: 10px;
  background: var(--color-pure-white, #ffffff); border: 1px solid var(--color-ash-solid, #eceaf6); border-radius: 14px;
  padding: 10px 14px; white-space: nowrap; font-size: 13px; color: #56546b;
  box-shadow: 0 10px 30px -8px rgba(23, 21, 38, 0.18);
  animation: st-float 5.5s ease-in-out infinite;
}
body.fx-theme-studio .st-float--1 { left: -34px; top: 10%; }
body.fx-theme-studio .st-float--2 { left: -52px; top: 44%; animation-delay: 1.4s; }
body.fx-theme-studio .st-float--3 { left: -28px; top: 78%; animation-delay: 2.8s; }
@keyframes st-float {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-8px); }
}
body.fx-theme-studio .st-ticker__ava {
  width: 32px; height: 32px; border-radius: 50%; display: inline-flex;
  align-items: center; justify-content: center; font-size: 13px; flex-shrink: 0;
}
body.fx-theme-studio .st-ticker__ava--lav { background: #e4dbff; color: #5f33e6; }
body.fx-theme-studio .st-ticker__ava--blush { background: var(--color-peach, #fed7e1); color: #c9184a; }
body.fx-theme-studio .st-ticker__ava--mint { background: #d5fced; color: #00744f; }
body.fx-theme-studio .st-ticker__who b { color: var(--color-midnight-ink, #171526); font-weight: 700; }
body.fx-theme-studio .st-ticker__pill {
  background: var(--color-paper-mist, #f2f3f7); border-radius: 999px; padding: 3px 10px;
  font-weight: 800; font-size: 12.5px; color: var(--color-midnight-ink, #171526);
}
body.fx-theme-studio .st-ticker__pill small { font-weight: 600; color: #75738c; }

/* --- Pill buttons --- */
body.fx-theme-studio .st-btn {
  display: inline-flex; align-items: center; gap: 10px;
  border-radius: 999px; padding: 13px 26px;
  font-size: 15px; font-weight: 700; text-decoration: none;
  transition: transform .2s ease, box-shadow .2s ease, background .2s ease, border-color .2s ease, color .2s ease;
}
body.fx-theme-studio .st-btn i { font-size: 12px; transition: transform .2s ease; }
body.fx-theme-studio .st-btn:hover i { transform: translateX(3px); }
body.fx-theme-studio .st-btn--primary {
  background: var(--color-midnight-brand, #03061a); color: #ffffff;
  box-shadow: 0 8px 20px -8px rgba(23, 21, 38, 0.5);
}
body.fx-theme-studio .st-btn--primary:hover { background: var(--color-midnight-brand, #03061a); color: #ffffff; transform: translateY(-2px); }
body.fx-theme-studio .st-btn--ghost { background: var(--color-pure-white, #ffffff); color: var(--color-midnight-ink, #171526); border: 1px solid var(--color-smoke, #d9d7e6); }
body.fx-theme-studio .st-btn--ghost:hover { border-color: var(--color-midnight-brand, #03061a); color: var(--color-midnight-ink, #171526); }
body.fx-theme-studio .st-btn--outline { background: transparent; color: #ffffff; border: 1.5px solid rgba(255, 255, 255, 0.75); }
body.fx-theme-studio .st-btn--outline:hover { background: var(--color-pure-white, #ffffff); color: var(--color-midnight-ink, #171526); border-color: #ffffff; }
body.fx-theme-studio .st-btn--lime { background: #97f675; color: #043422; }
body.fx-theme-studio .st-btn--lime:hover { background: #aef98f; color: #043422; transform: translateY(-2px); }

/* --- Product motion stage (under hero) --- */
body.fx-theme-studio .st-motion {
  position: relative;
  margin-top: clamp(-36px, -4vw, -16px);
  padding: clamp(4px, 1.5vw, 16px) 0 clamp(48px, 7vw, 88px);
  overflow: hidden;
  isolation: isolate;
}
body.fx-theme-studio .st-motion__wash {
  position: absolute; inset: 0;
  background:
    radial-gradient(85% 65% at 50% 35%, color-mix(in srgb, var(--color-lavender, #794dff) 12%, transparent) 0%, transparent 62%),
    radial-gradient(55% 45% at 12% 80%, color-mix(in srgb, var(--color-sky-tint, #ffe9ef) 55%, transparent) 0%, transparent 55%),
    radial-gradient(50% 40% at 88% 75%, color-mix(in srgb, var(--color-notion-blue, #fa2f62) 10%, transparent) 0%, transparent 50%),
    linear-gradient(180deg, var(--surface-page, var(--color-paper-warmth, #ffffff)) 0%, var(--color-paper-mist, #f8faff) 50%, var(--surface-page, var(--color-paper-warmth, #ffffff)) 100%);
  z-index: 0;
  pointer-events: none;
}
body.fx-theme-studio .st-motion__orb {
  position: absolute; border-radius: 50%;
  filter: blur(56px); opacity: 0.5;
  z-index: 0; pointer-events: none;
  animation: st-motion-drift 14s ease-in-out infinite alternate;
}
body.fx-theme-studio .st-motion__orb--a {
  width: min(48vw, 420px); height: min(48vw, 420px);
  left: 4%; top: 22%;
  background: rgba(121, 77, 255, 0.28);
}
body.fx-theme-studio .st-motion__orb--b {
  width: min(40vw, 360px); height: min(40vw, 360px);
  right: 6%; bottom: 8%;
  background: rgba(250, 47, 98, 0.2);
  animation-delay: -5s;
}
@keyframes st-motion-drift {
  from { transform: translate3d(0, 0, 0) scale(1); }
  to { transform: translate3d(22px, -18px, 0) scale(1.08); }
}
body.fx-theme-studio .st-motion__inner {
  position: relative; z-index: 1;
  display: flex; justify-content: center;
  width: 100%;
  perspective: 1200px;
}
body.fx-theme-studio .st-motion__stage {
  --p: var(--st-motion-p, 0);
  position: relative;
  width: calc(78% + 22% * var(--p));
  max-width: 1120px;
  margin-inline: auto;
  aspect-ratio: 16 / 9;
  border-radius: calc(40px - 14px * var(--p));
  overflow: hidden;
  background: #0e0c18;
  box-shadow:
    0 calc(28px + 12px * var(--p)) calc(60px + 20px * var(--p)) calc(-32px - 4px * var(--p)) rgba(23, 21, 38, 0.42),
    0 12px 32px -16px rgba(121, 77, 255, calc(0.18 + 0.12 * var(--p)));
  transform: scale(calc(0.92 + 0.08 * var(--p))) translate3d(0, calc(28px - 28px * var(--p)), 0);
  transform-origin: center center;
  will-change: transform, width, border-radius;
}
body.fx-theme-studio .st-motion__stage::after {
  content: "";
  position: absolute; inset: 0; z-index: 2;
  pointer-events: none;
  background: linear-gradient(180deg, rgba(255,255,255,0.06) 0%, transparent 18%, transparent 78%, rgba(255,255,255,0.35) 100%);
  opacity: calc(0.55 + 0.45 * var(--p));
}
body.fx-theme-studio .st-motion__video {
  position: absolute;
  inset: 0;
  display: block;
  /* Beat base.css `video { max-width:100%; height:auto }` letterboxing */
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  object-fit: cover;
  object-position: center center;
  background: #0e0c18;
  /* Zoom out the footage as the stage opens */
  transform: scale(calc(1.28 - 0.28 * var(--p)));
  transform-origin: center center;
  will-change: transform;
}
@media (prefers-reduced-motion: reduce) {
  body.fx-theme-studio .st-motion__stage,
  body.fx-theme-studio .st-motion__video {
    transform: none !important;
    width: 100% !important;
    border-radius: 28px !important;
  }
}

/* --- Staggered logo card marquee (Upmind-style) --- */
body.fx-theme-studio .st-logos {
  position: relative;
  padding: clamp(28px, 4vw, 48px) 0 clamp(40px, 6vw, 72px);
  background: #f4f3f8;
  overflow: hidden;
}
body.fx-theme-studio .st-logos__kicker {
  text-align: center;
  margin: 0 0 clamp(22px, 3vw, 32px);
  font-size: 14px;
  font-weight: 600;
  color: #75738c;
}
body.fx-theme-studio .st-logos__stage {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding-block: 4px;
  -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 8%, #000 92%, transparent 100%);
  mask-image: linear-gradient(90deg, transparent 0%, #000 8%, #000 92%, transparent 100%);
}
body.fx-theme-studio .st-logos__row {
  overflow: hidden;
  width: 100%;
}
body.fx-theme-studio .st-logos__track {
  display: flex;
  flex-wrap: nowrap;
  gap: 12px;
  width: max-content;
  will-change: transform;
  animation: st-logos-marquee 48s linear infinite;
}
body.fx-theme-studio .st-logos__row.is-rtl .st-logos__track {
  animation-name: st-logos-marquee-rtl;
  animation-duration: 56s;
}
body.fx-theme-studio .st-logos__row:nth-child(3) .st-logos__track { animation-duration: 52s; }
body.fx-theme-studio .st-logos__row:nth-child(4) .st-logos__track { animation-duration: 60s; }
body.fx-theme-studio .st-logos__stage:hover .st-logos__track {
  animation-play-state: paused;
}
@keyframes st-logos-marquee {
  from { transform: translate3d(0, 0, 0); }
  to { transform: translate3d(-50%, 0, 0); }
}
@keyframes st-logos-marquee-rtl {
  from { transform: translate3d(-50%, 0, 0); }
  to { transform: translate3d(0, 0, 0); }
}
body.fx-theme-studio .st-logos__card {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  flex: 0 0 auto;
  min-width: 168px;
  height: 64px;
  padding: 0 20px;
  background: var(--color-pure-white, #ffffff);
  border: 1px solid rgba(23, 21, 38, 0.04);
  border-radius: 16px;
  box-shadow: 0 8px 20px -14px rgba(23, 21, 38, 0.28);
  color: var(--color-midnight-ink, #171526);
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}
body.fx-theme-studio .st-logos__card:hover {
  transform: translateY(-2px);
  box-shadow: 0 14px 28px -16px rgba(23, 21, 38, 0.32);
}
body.fx-theme-studio .st-logos__mark {
  width: 28px;
  height: 28px;
  object-fit: contain;
  flex-shrink: 0;
  filter: grayscale(1) contrast(1.05);
  opacity: 0.85;
}
body.fx-theme-studio .st-logos__card:hover .st-logos__mark {
  filter: none;
  opacity: 1;
}
body.fx-theme-studio .st-logos__name {
  font-size: 14px;
  font-weight: 600;
  letter-spacing: -0.015em;
  white-space: nowrap;
  color: #4f4d63;
}
body.fx-theme-studio .st-logos__card:hover .st-logos__name { color: var(--color-midnight-ink, #171526); }
@media (max-width: 720px) {
  body.fx-theme-studio .st-logos__card {
    min-width: 148px;
    height: 56px;
    padding: 0 16px;
    gap: 10px;
  }
  body.fx-theme-studio .st-logos__track { gap: 10px; }
}
@media (prefers-reduced-motion: reduce) {
  body.fx-theme-studio .st-logos__track { animation: none !important; }
}

/* Legacy mock helpers (kept for other pages if referenced) */
body.fx-theme-studio .st-mock { padding-block: clamp(16px, 3vw, 40px); }
body.fx-theme-studio .st-mock__frame {
  border: 1px solid var(--color-ash-solid, #eceaf6); border-radius: 20px; overflow: hidden;
  background: var(--color-pure-white, #ffffff);
  box-shadow: 0 30px 70px -30px rgba(23, 21, 38, 0.25);
}
body.fx-theme-studio .st-mock__body { display: grid; grid-template-columns: 200px 1fr; }
body.fx-theme-studio .st-mock__nav {
  border-right: 1px solid #f0eef8; padding: 18px 12px;
  display: flex; flex-direction: column; gap: 4px;
}
body.fx-theme-studio .st-mock__nav span {
  display: flex; align-items: center; gap: 10px;
  font-size: 13px; font-weight: 600; color: #75738c;
  padding: 9px 12px; border-radius: 999px;
}
body.fx-theme-studio .st-mock__nav span.is-active { background: var(--color-sky-tint, #ffe9ef); color: var(--color-deep-sapphire, #d1114b); }
body.fx-theme-studio .st-mock__nav i { width: 16px; text-align: center; font-size: 12px; }
body.fx-theme-studio .st-mock__main { padding: 22px; display: flex; flex-direction: column; gap: 18px; }
body.fx-theme-studio .st-mock__stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
body.fx-theme-studio .st-mock__stat {
  border: 1px solid #f0eef8; border-radius: 14px; padding: 14px 16px;
  display: flex; flex-direction: column; gap: 3px;
}
body.fx-theme-studio .st-mock__stat small { font-size: 11.5px; font-weight: 600; color: #75738c; }
body.fx-theme-studio .st-mock__stat b { font-size: 22px; font-weight: 800; letter-spacing: -0.02em; color: var(--color-midnight-ink, #171526); }
body.fx-theme-studio .st-mock__stat span { font-size: 11.5px; color: #75738c; }
body.fx-theme-studio .st-mock__stat span.is-up { color: #00966e; font-weight: 600; }
body.fx-theme-studio .st-mock__chart {
  display: flex; align-items: flex-end; gap: 8px; height: 120px;
  border: 1px solid #f0eef8; border-radius: 14px; padding: 14px;
}
body.fx-theme-studio .st-mock__chart i {
  flex: 1; height: var(--h, 40%); border-radius: 6px 6px 3px 3px;
  background: linear-gradient(180deg, var(--color-lavender, #794dff), var(--color-mocha, #b39bff));
}
body.fx-theme-studio .st-mock__chart i:nth-child(3n) { background: linear-gradient(180deg, var(--color-notion-blue, #fa2f62), var(--color-sky-wash, #ff86a5)); }
body.fx-theme-studio .st-mock__chart i:last-child { background: linear-gradient(180deg, var(--color-midnight-ink, #171526), #4f4d63); }

/* --- Shared section scaffolding --- */
body.fx-theme-studio .st-statement,
body.fx-theme-studio .st-features,
body.fx-theme-studio .st-services,
body.fx-theme-studio .st-quotes,
body.fx-theme-studio .st-dark,
body.fx-theme-studio .st-resources,
body.fx-theme-studio .st-faq,
body.fx-theme-studio .st-finale { padding-block: clamp(48px, 8vw, 104px); }

body.fx-theme-studio .st-kicker {
  display: inline-flex; align-items: center; gap: 8px;
  background: var(--color-sky-tint, #ffe9ef); color: var(--color-deep-sapphire, #d1114b); border-radius: 999px;
  padding: 6px 16px; font-size: 13px; font-weight: 700;
  letter-spacing: 0.01em; margin-bottom: 18px;
}
body.fx-theme-studio .st-kicker::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: currentColor; }
body.fx-theme-studio .st-kicker--lime {
  background: rgba(151, 246, 117, 0.12); color: #97f675;
  font-family: var(--font-geist-mono); font-weight: var(--font-weight-mono, 500);
}
body.fx-theme-studio .st-head { text-align: center; max-width: 780px; margin: 0 auto clamp(36px, 5vw, 56px); }
body.fx-theme-studio .st-head--dark { margin-bottom: clamp(32px, 4vw, 48px); }
body.fx-theme-studio .st-h2 {
  font-size: clamp(30px, 4.4vw, 52px); line-height: 1.1; letter-spacing: -0.026em;
  font-weight: 500; color: var(--color-midnight-ink, #171526); margin: 0 0 16px;
}
body.fx-theme-studio .st-lead { font-size: clamp(15px, 1.5vw, 18px); line-height: 1.6; color: #56546b; margin: 0 0 20px; }

/* --- Statement --- */
body.fx-theme-studio .st-statement { text-align: center; }
body.fx-theme-studio .st-statement__text {
  font-size: clamp(26px, 3.8vw, 46px); line-height: 1.22; letter-spacing: -0.022em;
  font-weight: 500; color: var(--color-midnight-ink, #171526); max-width: 32ch; margin: 0 auto;
}

/* --- Feature grid: white cards + saturated billboards --- */
body.fx-theme-studio .st-features__grid {
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px;
}
body.fx-theme-studio .st-fcard {
  display: flex; flex-direction: column; gap: 12px;
  border-radius: 20px; padding: 30px;
  background: var(--color-pure-white, #ffffff); border: 1px solid var(--color-ash-solid, #eceaf6);
  text-decoration: none; color: var(--color-midnight-ink, #171526); position: relative;
  transition: transform .25s cubic-bezier(.16,1,.3,1), box-shadow .25s ease;
}
body.fx-theme-studio .st-fcard:hover { transform: translateY(-4px); box-shadow: 0 16px 32px -10px rgba(23, 21, 38, 0.14); }
body.fx-theme-studio .st-fcard__icon {
  width: 46px; height: 46px; border-radius: 14px; display: inline-flex;
  align-items: center; justify-content: center; font-size: 18px;
  background: var(--color-paper-mist, #f2f3f7); color: var(--color-midnight-ink, #171526);
}
body.fx-theme-studio .st-fcard h3 { font-size: 21px; font-weight: 600; letter-spacing: -0.015em; margin: 0; color: inherit; }
body.fx-theme-studio .st-fcard p { font-size: 15px; line-height: 1.55; color: var(--color-slate, #56546b); margin: 0; flex: 1; }
body.fx-theme-studio .st-fcard__go { font-size: 14px; font-weight: 700; color: inherit; display: inline-flex; align-items: center; gap: 8px; }
body.fx-theme-studio .st-fcard__go i { font-size: 11px; transition: transform .2s ease; }
body.fx-theme-studio .st-fcard:hover .st-fcard__go i { transform: translateX(3px); }

body.fx-theme-studio .st-fcard--violet { background: var(--color-lavender, #794dff); border-color: var(--color-lavender, #794dff); color: #ffffff; }
body.fx-theme-studio .st-fcard--pink { background: var(--color-notion-blue, #fa2f62); border-color: var(--color-notion-blue, #fa2f62); color: #ffffff; }
body.fx-theme-studio .st-fcard--ink { background: var(--color-midnight-brand, #03061a); border-color: var(--color-midnight-brand, #03061a); color: #ffffff; }
body.fx-theme-studio .st-fcard--violet p,
body.fx-theme-studio .st-fcard--pink p,
body.fx-theme-studio .st-fcard--ink p { color: rgba(255, 255, 255, 0.78); }
body.fx-theme-studio .st-fcard--violet .st-fcard__icon,
body.fx-theme-studio .st-fcard--pink .st-fcard__icon,
body.fx-theme-studio .st-fcard--ink .st-fcard__icon { background: rgba(255, 255, 255, 0.16); color: #ffffff; }

body.fx-theme-studio .st-fcard--wide {
  grid-column: 1 / -1; flex-direction: row; align-items: center; gap: 28px;
  background: var(--color-midnight-brand, #03061a); border-color: var(--color-midnight-brand, #03061a); color: #ffffff; flex-wrap: wrap;
}
body.fx-theme-studio .st-fcard--wide h3 { color: #ffffff; font-size: 24px; font-weight: 500; }
body.fx-theme-studio .st-fcard--wide p { color: rgba(255, 255, 255, 0.68); flex: 1 1 320px; font-size: 16px; }
body.fx-theme-studio .st-fcard--wide .st-btn { flex-shrink: 0; }

/* --- Service billboards: sticky stack + people cutouts (Upmind-style) --- */
body.fx-theme-studio .st-bills {
  --st-bill-stack: 18px;
  --st-bill-nav: 88px;
  display: flex; flex-direction: column; gap: 28px;
  margin-bottom: 8px; padding-bottom: 48px;
}
body.fx-theme-studio .st-bill {
  display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr);
  align-items: stretch;
  border-radius: 28px; overflow: hidden; text-decoration: none;
  min-height: clamp(340px, 52vh, 480px);
  box-shadow: 0 28px 60px -28px rgba(23, 21, 38, 0.45);
}
body.fx-theme-studio .st-bills > .st-bill {
  --st-i: 0;
  position: sticky;
  top: calc(var(--st-bill-nav) + (var(--st-i) * var(--st-bill-stack)));
  z-index: calc(20 + var(--st-i));
  min-height: clamp(360px, 58vh, 520px);
}
body.fx-theme-studio .st-bill--ink { background: var(--color-midnight-brand, #03061a); }
body.fx-theme-studio .st-bill--pink { background: var(--color-notion-blue, #fa2f62); }
body.fx-theme-studio .st-bill--violet { background: var(--color-lavender, #794dff); }
body.fx-theme-studio .st-bill--teal { background: #0f766e; }
body.fx-theme-studio .st-bill--plum { background: #5b21b6; }
body.fx-theme-studio .st-bill--navy { background: #1e3a5f; }
body.fx-theme-studio .st-bill--coral { background: #e85d4c; }
body.fx-theme-studio .st-bill--slate { background: #2f3542; }
body.fx-theme-studio .st-bill__copy {
  position: relative; z-index: 2;
  padding: clamp(28px, 4vw, 56px);
  display: flex; flex-direction: column; justify-content: center; gap: 14px;
}
body.fx-theme-studio .st-bill__kicker {
  font-size: 13px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.08em;
  color: rgba(255, 255, 255, 0.65);
}
body.fx-theme-studio .st-bill h3 {
  font-size: clamp(26px, 3.2vw, 42px); line-height: 1.08; letter-spacing: -0.028em;
  font-weight: 500; color: #ffffff; margin: 0; max-width: 14ch;
}
body.fx-theme-studio .st-bill p {
  font-size: 15.5px; line-height: 1.6; color: rgba(255, 255, 255, 0.78); margin: 0; max-width: 42ch;
}
body.fx-theme-studio .st-bill__cta {
  display: inline-flex; align-items: center; justify-content: center;
  align-self: flex-start; margin-top: 8px;
  min-height: 46px; padding: 0 22px;
  border-radius: 999px; border: 1.5px solid rgba(255, 255, 255, 0.85);
  font-size: 14.5px; font-weight: 600; color: #ffffff;
  background: transparent; transition: background .2s ease, color .2s ease, border-color .2s ease;
}
body.fx-theme-studio .st-bill:hover .st-bill__cta {
  background: var(--color-pure-white, #ffffff); color: var(--color-midnight-ink, #171526); border-color: #ffffff;
}
body.fx-theme-studio .st-bill__go {
  display: inline-flex; align-items: center; gap: 10px; margin-top: 6px;
  font-size: 15px; font-weight: 700; color: #ffffff;
}
body.fx-theme-studio .st-bill__go i { font-size: 12px; transition: transform .2s ease; }
body.fx-theme-studio .st-bill:hover .st-bill__go i { transform: translateX(4px); }
body.fx-theme-studio .st-bill > img { width: 100%; height: 100%; object-fit: cover; display: block; }
body.fx-theme-studio .st-bill__visual {
  position: relative; z-index: 1;
  display: flex; align-items: flex-end; justify-content: center;
  min-height: 280px; overflow: hidden; pointer-events: none;
}
body.fx-theme-studio .st-bill__blob {
  position: absolute; inset: auto -8% -28% 8%;
  width: 120%; height: 90%; border-radius: 48% 52% 42% 58% / 58% 42% 58% 42%;
  background: rgba(0, 0, 0, 0.18); filter: blur(2px);
}
body.fx-theme-studio .st-bill--ink .st-bill__blob { background: rgba(255, 255, 255, 0.06); }
body.fx-theme-studio .st-bill__person {
  position: relative; z-index: 1;
  display: block; width: auto; max-width: min(100%, 480px);
  height: clamp(320px, 56vh, 560px);
  object-fit: contain; object-position: bottom center;
  filter: drop-shadow(0 22px 36px rgba(0, 0, 0, 0.28)) saturate(1.12) contrast(1.04);
  transform: translateY(3%);
  image-rendering: -webkit-optimize-contrast;
}

/* --- Small service cards --- */
body.fx-theme-studio .st-services__grid {
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px;
}
body.fx-theme-studio .st-svc {
  display: flex; flex-direction: column;
  background: var(--color-pure-white, #ffffff); border: 1px solid var(--color-ash-solid, #eceaf6); border-radius: 20px;
  overflow: hidden; text-decoration: none;
  transition: transform .25s cubic-bezier(.16,1,.3,1), border-color .25s ease, box-shadow .25s ease;
}
body.fx-theme-studio .st-svc:hover { transform: translateY(-4px); border-color: rgba(23, 21, 38, 0.3); box-shadow: 0 16px 36px -12px rgba(23, 21, 38, 0.14); }
body.fx-theme-studio .st-svc img { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; display: block; }
body.fx-theme-studio .st-svc__body { padding: 22px 24px 24px; position: relative; }
body.fx-theme-studio .st-svc__body h3 { font-size: 20px; font-weight: 600; letter-spacing: -0.015em; color: var(--color-midnight-ink, #171526); margin: 0 0 6px; }
body.fx-theme-studio .st-svc__body p { font-size: 14.5px; line-height: 1.55; color: #56546b; margin: 0; padding-right: 44px; }
body.fx-theme-studio .st-svc__go {
  position: absolute; right: 20px; bottom: 20px;
  width: 36px; height: 36px; border-radius: 50%;
  display: inline-flex; align-items: center; justify-content: center;
  background: var(--color-paper-mist, #f2f3f7); color: var(--color-midnight-ink, #171526); font-size: 13px;
  transition: background .2s ease, color .2s ease, transform .2s ease;
}
body.fx-theme-studio .st-svc:hover .st-svc__go { background: var(--color-midnight-brand, #03061a); color: #ffffff; transform: translate(2px, -2px); }

/* --- Testimonial marquee --- */
body.fx-theme-studio .st-quotes .st-head { margin-bottom: clamp(28px, 4vw, 44px); }
body.fx-theme-studio .st-quotes__track { gap: 18px; animation-duration: 58s; align-items: stretch; }
body.fx-theme-studio .st-quote {
  width: clamp(300px, 34vw, 420px); flex-shrink: 0; margin: 0;
  background: var(--color-pure-white, #ffffff); border: 1px solid var(--color-ash-solid, #eceaf6); border-radius: 20px;
  padding: 26px 28px; display: flex; flex-direction: column; gap: 18px;
  box-shadow: 0 1px 2px rgba(23, 21, 38, 0.03);
}
body.fx-theme-studio .st-quote blockquote {
  margin: 0; border: 0; padding: 0;
  font-size: 16.5px; line-height: 1.55; color: var(--color-midnight-ink, #171526); font-weight: 500;
  white-space: normal;
}
body.fx-theme-studio .st-quote figcaption { display: flex; flex-direction: column; gap: 2px; font-size: 14px; }
body.fx-theme-studio .st-quote figcaption b { color: var(--color-midnight-ink, #171526); font-weight: 700; }
body.fx-theme-studio .st-quote figcaption span { color: #75738c; }

/* --- Developer island: dark, violet cards, lime mono --- */
body.fx-theme-studio .st-dark__panel {
  background: var(--color-midnight-brand, #03061a); border-radius: 28px;
  padding: clamp(36px, 6vw, 72px);
  position: relative; overflow: hidden;
}
body.fx-theme-studio .st-dark__panel::after {
  content: ""; position: absolute; right: -140px; top: -140px;
  width: 420px; height: 420px; border-radius: 50%; pointer-events: none;
  background: radial-gradient(closest-side, rgba(121, 77, 255, 0.35), transparent 70%);
}
body.fx-theme-studio .st-dark .st-h2 { color: #ffffff; }
body.fx-theme-studio .st-dark .st-lead { color: rgba(255, 255, 255, 0.62); }
body.fx-theme-studio .st-dark__grid {
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px;
  position: relative; z-index: 1;
}
body.fx-theme-studio .st-dark__card {
  background: rgba(255, 255, 255, 0.045); border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 18px; padding: 26px; display: flex; flex-direction: column; gap: 10px;
}
body.fx-theme-studio .st-dark__card--violet {
  background: rgba(121, 77, 255, 0.22); border-color: rgba(121, 77, 255, 0.42);
}
body.fx-theme-studio .st-dark__label {
  font-family: var(--font-geist-mono);
  font-size: 12px; letter-spacing: 0.08em; text-transform: uppercase;
  color: #97f675; margin: 0;
}
body.fx-theme-studio .st-dark__card h3 { color: #ffffff; font-size: 20px; font-weight: 600; letter-spacing: -0.015em; margin: 0; }
body.fx-theme-studio .st-dark__card p { color: rgba(255, 255, 255, 0.62); font-size: 14.5px; line-height: 1.6; margin: 0; flex: 1; }
body.fx-theme-studio .st-dark__code {
  font-family: var(--font-geist-mono); font-size: 12.5px;
  color: #97f675; background: rgba(151, 246, 117, 0.08);
  border: 1px solid rgba(151, 246, 117, 0.16);
  border-radius: 10px; padding: 10px 14px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}

/* --- Resources --- */
body.fx-theme-studio .st-resources__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
body.fx-theme-studio .st-rcard {
  display: flex; flex-direction: column; gap: 12px;
  background: var(--color-pure-white, #ffffff); border: 1px solid var(--color-ash-solid, #eceaf6); border-radius: 20px;
  padding: 28px; text-decoration: none; color: var(--color-midnight-ink, #171526);
  transition: transform .25s cubic-bezier(.16,1,.3,1), border-color .25s ease, box-shadow .25s ease;
}
body.fx-theme-studio .st-rcard:hover { transform: translateY(-4px); border-color: rgba(23, 21, 38, 0.3); box-shadow: 0 14px 30px -12px rgba(23, 21, 38, 0.12); }
body.fx-theme-studio .st-rcard h3 { font-size: 19px; font-weight: 600; margin: 0; color: var(--color-midnight-ink, #171526); }
body.fx-theme-studio .st-rcard p { font-size: 14.5px; line-height: 1.55; color: #56546b; margin: 0; flex: 1; }
body.fx-theme-studio .st-rcard__icon {
  width: 46px; height: 46px; border-radius: 14px; display: inline-flex;
  align-items: center; justify-content: center; font-size: 18px;
}
body.fx-theme-studio .st-rcard__icon--pink { background: var(--color-sky-tint, #ffe9ef); color: var(--color-deep-sapphire, #d1114b); }
body.fx-theme-studio .st-rcard__icon--mint { background: #d5fced; color: #00744f; }
body.fx-theme-studio .st-rcard__icon--violet { background: #e4dbff; color: #5f33e6; }

/* --- FAQ --- */
body.fx-theme-studio .st-faq__grid {
  display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.45fr);
  gap: clamp(28px, 5vw, 64px); align-items: start;
}
body.fx-theme-studio .st-faq .st-h2 { font-size: clamp(28px, 3.4vw, 42px); }
body.fx-theme-studio .st-faq__acc { display: flex; flex-direction: column; gap: 12px; }
body.fx-theme-studio .st-faq__acc .fx-acc__item {
  background: var(--color-paper-mist, #f8faff); border: 1px solid var(--color-ash-solid, #eceaf6); border-radius: 16px;
  padding: 0 22px; transition: border-color .2s ease, background .2s ease;
}
body.fx-theme-studio .st-faq__acc .fx-acc__item[data-open="true"] { background: var(--color-pure-white, #ffffff); border-color: rgba(250, 47, 98, 0.4); }
body.fx-theme-studio .st-faq__acc .fx-acc__trigger {
  font-size: 16px; font-weight: 600; color: var(--color-midnight-ink, #171526);
  text-transform: none; padding: 18px 0; text-align: left; gap: 16px;
}
body.fx-theme-studio .st-faq__acc .fx-acc__trigger i { color: var(--color-notion-blue, #fa2f62); font-size: 12px; flex-shrink: 0; }
body.fx-theme-studio .st-faq__acc .fx-acc__content p { font-size: 14.5px; line-height: 1.6; color: var(--color-slate, #56546b); margin: 0; padding: 0 0 18px; }

/* --- Finale: photo + ink panel --- */
body.fx-theme-studio .st-finale__panel {
  display: grid; grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
  border-radius: 28px; overflow: hidden; min-height: 380px;
}
body.fx-theme-studio .st-finale__photo { width: 100%; height: 100%; object-fit: cover; display: block; }
body.fx-theme-studio .st-finale__copy {
  background: linear-gradient(140deg, var(--color-midnight-brand, #03061a) 0%, #000000 100%);
  padding: clamp(36px, 5vw, 72px);
  display: flex; flex-direction: column; justify-content: center; align-items: flex-start; gap: 18px;
}
body.fx-theme-studio .st-finale__copy h2 {
  font-size: clamp(30px, 4vw, 52px); line-height: 1.08; letter-spacing: -0.028em;
  font-weight: 500; color: #ffffff; margin: 0; max-width: 16ch;
}
body.fx-theme-studio .st-finale__copy p { font-size: clamp(15px, 1.5vw, 17px); line-height: 1.6; color: rgba(255, 255, 255, 0.68); max-width: 46ch; margin: 0; }
body.fx-theme-studio .st-finale__tag {
  text-align: center; margin: 32px 0 0;
  font-size: clamp(18px, 2.2vw, 26px); font-weight: 500; letter-spacing: -0.018em; color: var(--color-midnight-ink, #171526);
}

/* --- Responsive --- */
@media (max-width: 1000px) {
  body.fx-theme-studio .st-hero__grid { grid-template-columns: 1fr; }
  body.fx-theme-studio .st-hero__visual { max-width: 560px; margin-inline: auto; }
  body.fx-theme-studio .st-float--1 { left: 8px; }
  body.fx-theme-studio .st-float--2 { left: -6px; }
  body.fx-theme-studio .st-float--3 { left: 12px; }
  body.fx-theme-studio .st-features__grid,
  body.fx-theme-studio .st-services__grid,
  body.fx-theme-studio .st-resources__grid,
  body.fx-theme-studio .st-dark__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  body.fx-theme-studio .st-faq__grid { grid-template-columns: 1fr; }
  body.fx-theme-studio .st-bills { --st-bill-stack: 12px; --st-bill-nav: 72px; gap: 20px; }
  body.fx-theme-studio .st-bill {
    grid-template-columns: 1fr; min-height: 0;
  }
  body.fx-theme-studio .st-bills > .st-bill { min-height: 0; }
  body.fx-theme-studio .st-bill > img { aspect-ratio: 16 / 9; height: auto; order: -1; }
  body.fx-theme-studio .st-bill__visual {
    min-height: 220px; order: -1; max-height: 280px;
  }
  body.fx-theme-studio .st-bill__person {
    height: 260px; max-width: 280px; transform: translateY(6%);
  }
  body.fx-theme-studio .st-bill__copy { padding: 28px 24px 32px; }
  body.fx-theme-studio .st-bill h3 { max-width: none; }
  body.fx-theme-studio .st-finale__panel { grid-template-columns: 1fr; }
  body.fx-theme-studio .st-finale__photo { aspect-ratio: 16 / 9; height: auto; }
  body.fx-theme-studio .st-mock__body { grid-template-columns: 1fr; }
  body.fx-theme-studio .st-mock__nav { flex-direction: row; overflow-x: auto; border-right: 0; border-bottom: 1px solid #f0eef8; }
}
@media (max-width: 620px) {
  body.fx-theme-studio .st-features__grid,
  body.fx-theme-studio .st-services__grid,
  body.fx-theme-studio .st-resources__grid,
  body.fx-theme-studio .st-dark__grid,
  body.fx-theme-studio .st-mock__stats { grid-template-columns: 1fr; }
  body.fx-theme-studio .st-fcard--wide { flex-direction: column; align-items: flex-start; }
  body.fx-theme-studio .st-float { display: none; }
}

/* ------------------------------------------------------------
   12. DARK MODE COMBO
   ------------------------------------------------------------ */
body.fx-theme-studio.flexus-dark {
  --color-paper-warmth: #0b0a14;
  --color-pure-white: #14121f;
  --color-canvas-white: #14121f;
  --color-paper-mist: #1b1929;
  --color-charcoal: #f2f1f7;
  --color-midnight-ink: #f2f1f7;
  --color-graphite: #b4b2c4;
  --color-slate: #a5a3b8;
  --color-fog: #8b899e;
  --color-ash: rgba(255, 255, 255, 0.09);
  --color-ash-solid: #262336;
  --color-primary-action-fill: var(--color-notion-blue, #fa2f62);
  --color-deep-sapphire: var(--color-deep-sapphire, #d1114b);
  --surface-page: #0b0a14;
  --surface-canvas: #0b0a14;
  --surface-paper: #14121f;
  --surface-card: #14121f;
  background: #0b0a14;
  color: #f2f1f7;
}
body.fx-theme-studio.flexus-dark.fx-portal-active { background: #0b0a14; }
body.fx-theme-studio.flexus-dark .fx-side { background: #14121f; border-color: #262336; }
body.fx-theme-studio.flexus-dark .fx-navbar,
body.fx-theme-studio.flexus-dark .st-navbar {
  background: rgba(20, 18, 31, 0.92); border-color: #262336;
}
body.fx-theme-studio.flexus-dark .fx-side__link.is-active { background: rgba(250, 47, 98, 0.16); color: var(--color-sky-wash, #ff86a5); }
body.fx-theme-studio.flexus-dark .fx-footer { background: #0b0a14; border-top-color: #262336; }
body.fx-theme-studio.flexus-dark .fx-footer__col h6 { color: #f2f1f7; }

@media (prefers-color-scheme: dark) {
  body.fx-theme-studio.flexus-auto {
    --color-paper-warmth: #0b0a14;
    --color-pure-white: #14121f;
    --color-canvas-white: #14121f;
    --color-paper-mist: #1b1929;
    --color-charcoal: #f2f1f7;
    --color-midnight-ink: #f2f1f7;
    --color-graphite: #b4b2c4;
    --color-slate: #a5a3b8;
    --color-fog: #8b899e;
    --color-ash: rgba(255, 255, 255, 0.09);
    --color-ash-solid: #262336;
    --color-primary-action-fill: var(--color-notion-blue, #fa2f62);
    --color-deep-sapphire: var(--color-deep-sapphire, #d1114b);
    --surface-page: #0b0a14;
    --surface-canvas: #0b0a14;
    --surface-paper: #14121f;
    --surface-card: #14121f;
    background: #0b0a14;
    color: #f2f1f7;
  }
  body.fx-theme-studio.flexus-auto.fx-portal-active { background: #0b0a14; }
  body.fx-theme-studio.flexus-auto .fx-side { background: #14121f; border-color: #262336; }
  body.fx-theme-studio.flexus-auto .fx-navbar,
  body.fx-theme-studio.flexus-auto .st-navbar { background: rgba(20, 18, 31, 0.92); border-color: #262336; }
}

/* ============================================================
   13. SHARED LANDING PRICING (st-plans) — token-driven
   ============================================================ */
body.fx-theme-studio .st-pricing { padding-block: clamp(48px, 8vw, 104px); }
body.fx-theme-studio .st-pricing .st-head {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0;
}
body.fx-theme-studio .st-pricing__switch,
body.fx-theme-studio .st-pricing .fx-host-switch {
  margin: 18px 0 8px;
}
body.fx-theme-studio .st-plans {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 20px;
  align-items: stretch;
  margin-top: 28px;
  overflow: visible;
}
body.fx-theme-studio .st-plan {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 0;
  background: var(--surface-card, var(--color-pure-white, #ffffff));
  border: 1px solid var(--color-ash-solid, var(--color-ash, #e5e3dc));
  border-radius: 16px;
  padding: 28px 28px 24px;
  box-shadow: none;
  color: var(--color-midnight-ink, #171526);
  overflow: visible;
  z-index: 1;
}
body.fx-theme-studio .st-plan:hover,
body.fx-theme-studio .st-plan:focus-within {
  z-index: 5;
}
body.fx-theme-studio .st-plan--hot {
  border-color: var(--color-notion-blue, #0075de);
  box-shadow: 0 14px 36px -18px color-mix(in srgb, var(--color-notion-blue, #0075de) 45%, transparent);
}
body.fx-theme-studio .st-plan__flag {
  position: absolute;
  top: -11px;
  right: 20px;
  background: var(--color-notion-blue, #0075de);
  color: var(--color-pure-white, #ffffff);
  border-radius: 6px;
  padding: 4px 10px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.02em;
  text-transform: uppercase;
}
body.fx-theme-studio .st-plan__name {
  margin: 0 0 14px;
  font-size: clamp(22px, 2.2vw, 28px);
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: -0.02em;
  color: var(--color-midnight-ink, #171526);
}
body.fx-theme-studio .st-plan__desc {
  margin: -6px 0 14px;
  font-size: 14px;
  line-height: 1.45;
  color: var(--color-fog, #6b6980);
}
body.fx-theme-studio .st-plan__deal {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  margin-bottom: 8px;
}
body.fx-theme-studio .st-plan__save {
  display: inline-flex;
  align-items: center;
  padding: 4px 10px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--color-lavender, #c7b9ff) 42%, var(--surface-card, #fff));
  color: color-mix(in srgb, var(--color-lavender, #794dff) 55%, var(--color-midnight-ink, #171526));
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.02em;
  text-transform: uppercase;
}
body.fx-theme-studio .st-plan__was {
  font-size: 15px;
  color: var(--color-silver, var(--color-fog, #9b98ab));
  text-decoration: line-through;
}
body.fx-theme-studio .st-plan__price {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 4px 6px;
  margin: 0 0 6px;
  font-family: inherit;
}
body.fx-theme-studio .st-plan__currency {
  font-family: inherit;
  font-size: clamp(22px, 2.2vw, 28px);
  font-weight: 800;
  letter-spacing: -0.02em;
  line-height: 1;
  color: var(--color-midnight-ink, #171526);
}
body.fx-theme-studio .st-plan__amount {
  font-family: inherit;
  font-size: clamp(34px, 3.4vw, 42px);
  font-weight: 800;
  letter-spacing: -0.03em;
  line-height: 1;
  color: var(--color-midnight-ink, #171526);
}
body.fx-theme-studio .st-plan__amount.is-flip { opacity: 0.35; transform: translateY(2px); transition: opacity .15s ease, transform .15s ease; }
body.fx-theme-studio .st-plan__period {
  font-family: var(--font-geist-mono, ui-monospace, monospace);
  font-size: 15px;
  font-weight: 600;
  color: var(--color-fog, #6b6980);
}
body.fx-theme-studio .st-plan__note {
  margin: 0 0 18px;
  font-size: 13px;
  line-height: 1.4;
  color: var(--color-fog, #6b6980);
}
body.fx-theme-studio .st-plan__buy {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 48px;
  margin: 0 0 22px;
  padding: 0 18px;
  border-radius: 999px;
  background: var(--color-notion-blue, #0075de);
  color: var(--color-pure-white, #ffffff) !important;
  text-decoration: none !important;
  font-size: 15px;
  font-weight: 700;
  border: 1px solid var(--color-notion-blue, #0075de);
  box-shadow: 0 10px 24px -12px color-mix(in srgb, var(--color-notion-blue, #0075de) 55%, transparent);
  transition: filter .15s ease, transform .15s ease, background .15s ease;
}
body.fx-theme-studio .st-plan__buy:hover {
  filter: brightness(1.06);
  transform: translateY(-1px);
  color: var(--color-pure-white, #ffffff) !important;
}
body.fx-theme-studio .st-plan--hot .st-plan__buy {
  background: var(--color-notion-blue, #0075de);
  border-color: var(--color-notion-blue, #0075de);
}
body.fx-theme-studio .st-plan__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 12px;
  flex: 1;
}
body.fx-theme-studio .st-plan__list li {
  display: flex;
  gap: 12px;
  align-items: flex-start;
  font-size: 14.5px;
  line-height: 1.4;
  color: var(--color-midnight-ink, #171526);
}
body.fx-theme-studio .st-plan__ico {
  flex: 0 0 28px;
  width: 28px;
  height: 28px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid color-mix(in srgb, var(--color-notion-blue, #0075de) 18%, var(--color-ash-solid, #e5e3dc));
  border-radius: 8px;
  background: color-mix(in srgb, var(--color-notion-blue, #0075de) 8%, var(--surface-card, #fff));
  color: var(--color-notion-blue, #0075de);
  margin-top: 0;
}
body.fx-theme-studio .st-plan__ico i {
  font-size: 12px;
  color: var(--color-notion-blue, #0075de);
  margin: 0;
}
body.fx-theme-studio .st-plan__feat {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  min-width: 0;
  padding-top: 4px;
}
body.fx-theme-studio .st-plan__tip-wrap {
  position: relative;
  display: inline-flex;
  align-items: center;
  flex: 0 0 auto;
}
body.fx-theme-studio .st-plan__tip {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 16px;
  height: 16px;
  padding: 0;
  border-radius: 999px;
  border: 1px solid var(--color-ash-solid, var(--color-ash, #ccc));
  background: transparent;
  color: var(--color-fog, #777);
  font-size: 10px;
  font-weight: 700;
  line-height: 1;
  cursor: pointer;
  transition: border-color .15s ease, color .15s ease, background .15s ease;
}
body.fx-theme-studio .st-plan__tip:hover,
body.fx-theme-studio .st-plan__tip:focus-visible,
body.fx-theme-studio .st-plan__tip-wrap.is-open .st-plan__tip {
  border-color: var(--color-notion-blue, #0075de);
  color: var(--color-notion-blue, #0075de);
  background: color-mix(in srgb, var(--color-notion-blue, #0075de) 8%, transparent);
  outline: none;
}
body.fx-theme-studio .st-plan__tip-pop {
  position: absolute;
  bottom: calc(100% + 8px);
  left: 50%;
  transform: translateX(-50%) translateY(4px);
  width: max-content;
  max-width: min(240px, 70vw);
  padding: 8px 10px;
  border-radius: 8px;
  background: var(--color-midnight-ink, #171526);
  color: var(--color-pure-white, #ffffff);
  font-size: 12px;
  font-weight: 500;
  line-height: 1.4;
  text-align: left;
  white-space: normal;
  box-shadow: 0 10px 24px -12px rgba(23, 21, 38, 0.45);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  z-index: 40;
  transition: opacity .15s ease, transform .15s ease, visibility .15s ease;
}
body.fx-theme-studio .st-plan__tip-pop::after {
  content: '';
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%);
  border: 5px solid transparent;
  border-top-color: var(--color-midnight-ink, #171526);
}
body.fx-theme-studio .st-plan__tip-wrap:hover .st-plan__tip-pop,
body.fx-theme-studio .st-plan__tip-wrap:focus-within .st-plan__tip-pop,
body.fx-theme-studio .st-plan__tip-wrap.is-open .st-plan__tip-pop {
  opacity: 1;
  visibility: visible;
  transform: translateX(-50%) translateY(0);
}
body.fx-theme-studio .st-plan .st-btn { display: none; }
body.fx-theme-studio .st-pricing__fine {
  margin-top: 22px;
  font-size: 13px;
  color: var(--color-fog, #6b6980);
}
body.fx-theme-studio .st-pricing__fine a {
  color: var(--color-notion-blue, #0075de);
  text-decoration: none;
  font-weight: 600;
}
body.fx-theme-studio .st-pricing__fine a:hover { text-decoration: underline; }

@media (max-width: 980px) {
  body.fx-theme-studio .st-plans { grid-template-columns: 1fr; max-width: 420px; margin-inline: auto; }
}

/* ============================================================
   14. WEB HOSTING (sth-*) — speed score + comparison bars
   ============================================================ */
body.fx-theme-studio .sth-hero__visual { position: relative; }
body.fx-theme-studio .sth-score {
  background: var(--color-pure-white, #ffffff); border: 1px solid var(--color-ash-solid, #eceaf6); border-radius: 22px;
  overflow: hidden; box-shadow: 0 24px 48px -20px rgba(23, 21, 38, 0.2);
}
body.fx-theme-studio .sth-score__bar {
  display: flex; align-items: center; gap: 7px;
  padding: 12px 16px; border-bottom: 1px solid #f0eef8;
}
body.fx-theme-studio .sth-score__bar span { width: 10px; height: 10px; border-radius: 50%; background: var(--color-ash-solid, #e7e5f2); }
body.fx-theme-studio .sth-score__bar span:first-child { background: var(--color-peach, #fed7e1); }
body.fx-theme-studio .sth-score__bar span:nth-child(2) { background: #ffffef; border: 1px solid var(--color-ash-solid, #eceaf6); }
body.fx-theme-studio .sth-score__bar span:nth-child(3) { background: #d5fced; }
body.fx-theme-studio .sth-score__bar b {
  margin-inline: auto; font-family: var(--font-geist-mono);
  font-size: 12px; font-weight: 500; color: #75738c;
}
body.fx-theme-studio .sth-score__rings {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; padding: 28px 20px 18px; text-align: center;
}
body.fx-theme-studio .sth-ring { position: relative; display: flex; flex-direction: column; align-items: center; gap: 4px; }
body.fx-theme-studio .sth-ring svg { width: 72px; height: 72px; transform: rotate(-90deg); }
body.fx-theme-studio .sth-ring circle { fill: none; stroke: #f0eef8; stroke-width: 6; }
body.fx-theme-studio .sth-ring circle.is-fill {
  stroke: var(--color-lavender, #794dff); stroke-dasharray: 213.6; stroke-dashoffset: calc(213.6 - (213.6 * var(--p) / 100));
  stroke-linecap: round;
}
body.fx-theme-studio .sth-ring:nth-child(2) circle.is-fill { stroke: var(--color-notion-blue, #fa2f62); }
body.fx-theme-studio .sth-ring:nth-child(3) circle.is-fill { stroke: #00966e; }
body.fx-theme-studio .sth-ring b {
  position: absolute; top: 22px; font-size: 18px; font-weight: 700; color: var(--color-midnight-ink, #171526);
}
body.fx-theme-studio .sth-ring small { font-size: 11px; color: #75738c; font-weight: 600; }
body.fx-theme-studio .sth-score__meta {
  display: flex; flex-wrap: wrap; gap: 10px 16px; justify-content: center;
  padding: 14px 16px 20px; border-top: 1px solid #f0eef8;
  font-size: 12.5px; font-weight: 600; color: #56546b;
}
body.fx-theme-studio .sth-score__meta i { color: var(--color-notion-blue, #fa2f62); margin-right: 4px; }

body.fx-theme-studio .sth-speed { padding-block: clamp(48px, 8vw, 96px); }
body.fx-theme-studio .sth-speed__panel {
  background: var(--color-paper-mist, #f8faff); border: 1px solid var(--color-ash-solid, #eceaf6); border-radius: 22px; padding: clamp(24px, 4vw, 40px);
}
body.fx-theme-studio .sth-speed__row {
  display: grid; grid-template-columns: minmax(140px, 220px) 1fr auto;
  gap: 16px; align-items: center; margin-bottom: 16px;
}
body.fx-theme-studio .sth-speed__label { font-size: 14px; font-weight: 600; color: #4f4d63; }
body.fx-theme-studio .sth-speed__track {
  height: 14px; background: var(--color-pure-white, #ffffff); border: 1px solid var(--color-ash-solid, #eceaf6); border-radius: 999px; overflow: hidden;
}
body.fx-theme-studio .sth-speed__track i {
  display: block; height: 100%; width: var(--w, 40%); border-radius: 999px; background: var(--color-smoke, #d9d7e6);
}
body.fx-theme-studio .sth-speed__track i.is-us {
  background: linear-gradient(90deg, var(--color-lavender, #794dff), var(--color-notion-blue, #fa2f62));
}
body.fx-theme-studio .sth-speed__val {
  font-family: var(--font-geist-mono);
  font-size: 15px; font-weight: 600; color: var(--color-midnight-ink, #171526); min-width: 3.5ch; text-align: right;
}
body.fx-theme-studio .sth-speed__note {
  margin: 18px 0 0; font-size: 13.5px; color: #75738c; display: flex; gap: 8px; align-items: flex-start;
}
body.fx-theme-studio .sth-speed__note i { color: var(--color-lavender, #794dff); margin-top: 3px; }

body.fx-theme-studio .sth-features { padding-top: 0; }
body.fx-theme-studio .sth-migrate { padding-block: clamp(24px, 4vw, 48px) clamp(48px, 8vw, 96px); }
body.fx-theme-studio .sth-migrate .st-bill { text-decoration: none; cursor: default; }
body.fx-theme-studio .sth-migrate .st-bill__go { cursor: pointer; }

@media (max-width: 700px) {
  body.fx-theme-studio .sth-speed__row { grid-template-columns: 1fr auto; }
  body.fx-theme-studio .sth-speed__label { grid-column: 1 / -1; }
}

/* ============================================================
   15. CLOUD VPS (stv-*) — dark hero + SSH terminal + spec table
   ============================================================ */
body.fx-theme-studio .stv-hero {
  background: var(--color-midnight-brand, #03061a); padding: clamp(48px, 8vh, 96px) 0 clamp(40px, 6vh, 72px);
  position: relative; overflow: hidden;
}
body.fx-theme-studio .stv-hero::after {
  content: ""; position: absolute; right: -160px; top: -160px;
  width: 480px; height: 480px; border-radius: 50%; pointer-events: none;
  background: radial-gradient(closest-side, rgba(121, 77, 255, 0.35), transparent 70%);
}
body.fx-theme-studio .stv-hero .flexus-container { position: relative; z-index: 1; }
body.fx-theme-studio .stv-hero__title { color: #ffffff; }
body.fx-theme-studio .stv-hero__sub { color: rgba(255, 255, 255, 0.62); }
body.fx-theme-studio .stv-hero__alt { color: rgba(255, 255, 255, 0.85); }
body.fx-theme-studio .stv-hero__alt:hover { color: #97f675; }
body.fx-theme-studio .stv-hero__chips {
  display: flex; flex-wrap: wrap; gap: 8px; margin-top: 28px;
}
body.fx-theme-studio .stv-hero__chips span {
  display: inline-flex; align-items: center; gap: 8px;
  background: rgba(255, 255, 255, 0.06); border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 999px; padding: 7px 14px;
  font-size: 13px; font-weight: 600; color: rgba(255, 255, 255, 0.78);
}
body.fx-theme-studio .stv-hero__chips i { color: #97f675; font-size: 11px; }

body.fx-theme-studio .stv-term {
  background: #0b0e1c; border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 18px; overflow: hidden;
  box-shadow: 0 30px 60px -20px rgba(0, 0, 0, 0.5);
}
body.fx-theme-studio .stv-term__bar {
  display: flex; align-items: center; gap: 7px;
  padding: 12px 16px; border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}
body.fx-theme-studio .stv-term__bar span { width: 10px; height: 10px; border-radius: 50%; background: rgba(255,255,255,0.15); }
body.fx-theme-studio .stv-term__bar span:first-child { background: var(--color-notion-blue, #fa2f62); }
body.fx-theme-studio .stv-term__bar span:nth-child(2) { background: #ffffef; }
body.fx-theme-studio .stv-term__bar span:nth-child(3) { background: #97f675; }
body.fx-theme-studio .stv-term__bar b {
  margin-inline: auto; font-family: var(--font-geist-mono);
  font-size: 12px; font-weight: 500; color: rgba(255, 255, 255, 0.45);
}
body.fx-theme-studio .stv-term__body,
body.fx-theme-studio .stv-term__body code {
  margin: 0; padding: 20px 22px; min-height: 280px;
  font-family: var(--font-geist-mono); font-size: 13px; line-height: 1.7;
  color: rgba(255, 255, 255, 0.82); white-space: pre-wrap; overflow: auto;
  background: #0b0e1c !important; border: 0; box-shadow: none;
}
body.fx-theme-studio .stv-term__body code { display: block; padding: 0; min-height: 0; }
body.fx-theme-studio .stv-term__body i { color: #97f675; font-style: normal; }
body.fx-theme-studio .stv-term__body em { color: #97f675; font-style: normal; }
body.fx-theme-studio .stv-term__body small { color: rgba(255, 255, 255, 0.45); }
body.fx-theme-studio .stv-term__body b { color: #97f675; font-weight: 600; }
body.fx-theme-studio .stv-cursor {
  display: inline-block; width: 8px; height: 14px; background: #97f675;
  vertical-align: text-bottom; animation: stv-blink 1s step-end infinite;
}
@keyframes stv-blink { 50% { opacity: 0; } }

body.fx-theme-studio .stv-regions { padding-block: 28px; background: var(--color-paper-mist, #f8faff); border-bottom: 1px solid var(--color-ash-solid, #eceaf6); }
body.fx-theme-studio .stv-regions__row {
  display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 12px;
}
body.fx-theme-studio .stv-region {
  display: flex; flex-direction: column; gap: 4px;
  background: var(--color-pure-white, #ffffff); border: 1px solid var(--color-ash-solid, #eceaf6); border-radius: 14px; padding: 14px;
  font-size: 12.5px; color: #56546b; position: relative; overflow: hidden;
}
body.fx-theme-studio .stv-region b {
  font-family: var(--font-geist-mono);
  font-size: 14px; font-weight: 700; color: var(--color-midnight-ink, #171526);
}
body.fx-theme-studio .stv-region small { color: #00966e; font-weight: 700; }
body.fx-theme-studio .stv-region i {
  position: absolute; left: 0; bottom: 0; height: 3px; width: var(--p, 40%);
  background: linear-gradient(90deg, var(--color-lavender, #794dff), var(--color-notion-blue, #fa2f62)); border-radius: 0 2px 0 0;
}
body.fx-theme-studio .stv-regions__note {
  margin: 16px 0 0; font-size: 13px; color: #75738c; text-align: center;
}

body.fx-theme-studio .stv-specs { padding-block: clamp(48px, 8vw, 96px); }
body.fx-theme-studio .stv-specs .st-pricing__switch,
body.fx-theme-studio .stv-specs .fx-host-switch {
  margin: 18px 0 8px;
}
body.fx-theme-studio .stv-plans.st-plans {
  margin-top: 28px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
@media (max-width: 980px) {
  body.fx-theme-studio .stv-plans.st-plans {
    grid-template-columns: 1fr;
    max-width: 420px;
    margin-inline: auto;
  }
}
body.fx-theme-studio .stv-table {
  border: 1px solid var(--color-ash-solid, #eceaf6); border-radius: 18px; overflow: hidden; background: var(--color-pure-white, #ffffff);
  margin-top: 28px;
}
body.fx-theme-studio .stv-table__head,
body.fx-theme-studio .stv-table__row {
  display: grid;
  grid-template-columns: 1.4fr repeat(4, 0.9fr) 0.9fr 48px;
  gap: 8px; align-items: center; padding: 16px 22px;
}
body.fx-theme-studio .stv-table__head {
  background: var(--color-paper-mist, #f8faff); font-size: 12px; font-weight: 700; text-transform: uppercase;
  letter-spacing: 0.06em; color: #75738c; border-bottom: 1px solid var(--color-ash-solid, #eceaf6);
}
body.fx-theme-studio .stv-table__row {
  text-decoration: none; color: var(--color-midnight-ink, #171526); border-bottom: 1px solid #f0eef8;
  font-size: 14.5px; transition: background .2s ease;
}
body.fx-theme-studio .stv-table__row:last-child { border-bottom: 0; }
body.fx-theme-studio .stv-table__row:hover { background: var(--color-paper-mist, #f8faff); }
body.fx-theme-studio .stv-table__row.is-hot { background: color-mix(in srgb, var(--color-notion-blue, #fa2f62) 8%, #fff); }
body.fx-theme-studio .stv-table__row b { font-weight: 700; }
body.fx-theme-studio .stv-table__row em {
  font-style: normal; font-size: 11px; font-weight: 700;
  background: var(--color-notion-blue, #fa2f62); color: #fff; border-radius: 999px; padding: 2px 8px; margin-left: 8px;
}
body.fx-theme-studio .stv-price {
  font-family: var(--font-geist-mono); font-weight: var(--font-weight-mono, 500); font-size: 16px;
  display: inline-flex; align-items: baseline; gap: 2px; flex-wrap: wrap;
}
body.fx-theme-studio .stv-price__cur { font-weight: 600; }
body.fx-theme-studio .stv-price__period {
  font-size: 13px; font-weight: 600; color: var(--color-fog, #6b6980); margin-left: 2px;
}
body.fx-theme-studio .stv-table__go {
  width: 32px; height: 32px; border-radius: 50%; display: inline-flex;
  align-items: center; justify-content: center; background: var(--color-paper-mist, #f2f3f7); color: var(--color-midnight-ink, #171526); font-size: 12px;
}
body.fx-theme-studio .stv-table__row:hover .stv-table__go { background: var(--color-midnight-brand, #03061a); color: #fff; }
body.fx-theme-studio .stv-specs__note {
  margin: 18px 0 0; font-size: 13.5px; color: #75738c; text-align: center;
}
body.fx-theme-studio .stv-specs__note a { color: var(--color-notion-blue, #fa2f62); font-weight: 600; }

@media (max-width: 900px) {
  body.fx-theme-studio .stv-regions__row { grid-template-columns: repeat(3, 1fr); }
  body.fx-theme-studio .stv-table__head { display: none; }
  body.fx-theme-studio .stv-table__row {
    grid-template-columns: 1fr 1fr; gap: 10px; padding: 18px;
  }
  body.fx-theme-studio .stv-table__row span[data-th]::before {
    content: attr(data-th) ": "; font-size: 11px; font-weight: 700;
    text-transform: uppercase; letter-spacing: 0.04em; color: #75738c;
  }
  body.fx-theme-studio .stv-table__go { grid-column: 2; justify-self: end; }
}
@media (max-width: 560px) {
  body.fx-theme-studio .stv-regions__row { grid-template-columns: repeat(2, 1fr); }
}

/* ============================================================
   16. WORDPRESS (stw-*) — blush hero + care timeline
   ============================================================ */
body.fx-theme-studio .stw-hero {
  background: linear-gradient(180deg, #fff5f8 0%, #ffffff 70%);
  padding: clamp(40px, 7vh, 88px) 0 clamp(24px, 4vh, 48px);
}
body.fx-theme-studio .stw-admin {
  background: var(--color-pure-white, #ffffff); border: 1px solid var(--color-ash-solid, #eceaf6); border-radius: 20px; overflow: hidden;
  box-shadow: 0 24px 48px -20px rgba(250, 47, 98, 0.18);
}
body.fx-theme-studio .stw-admin__bar {
  display: flex; align-items: center; gap: 7px;
  padding: 12px 16px; border-bottom: 1px solid #f0eef8; background: #fff5f8;
}
body.fx-theme-studio .stw-admin__bar span { width: 10px; height: 10px; border-radius: 50%; background: var(--color-ash-solid, #e7e5f2); }
body.fx-theme-studio .stw-admin__bar span:first-child { background: var(--color-notion-blue, #fa2f62); }
body.fx-theme-studio .stw-admin__bar span:nth-child(2) { background: var(--color-peach, #fed7e1); }
body.fx-theme-studio .stw-admin__bar span:nth-child(3) { background: #d5fced; }
body.fx-theme-studio .stw-admin__bar b {
  margin-inline: auto; font-family: var(--font-geist-mono);
  font-size: 12px; font-weight: 500; color: #75738c;
}
body.fx-theme-studio .stw-admin__body { padding: 8px; display: flex; flex-direction: column; gap: 6px; }
body.fx-theme-studio .stw-admin__row {
  display: grid; grid-template-columns: 28px 1fr auto; gap: 12px; align-items: center;
  padding: 12px 14px; border-radius: 12px;
}
body.fx-theme-studio .stw-admin__row.is-done { background: var(--color-paper-mist, #f8faff); }
body.fx-theme-studio .stw-admin__row.is-done i { color: #00966e; }
body.fx-theme-studio .stw-admin__row.is-live { background: var(--color-sky-tint, #ffe9ef); }
body.fx-theme-studio .stw-admin__row.is-live i { color: var(--color-notion-blue, #fa2f62); }
body.fx-theme-studio .stw-admin__row b { display: block; font-size: 14px; font-weight: 600; color: var(--color-midnight-ink, #171526); }
body.fx-theme-studio .stw-admin__row small { font-size: 12px; color: #75738c; }
body.fx-theme-studio .stw-admin__row > span { font-size: 12px; color: #a5a3b8; font-family: var(--font-geist-mono); }

body.fx-theme-studio .stw-care { padding-block: clamp(48px, 8vw, 96px); }
body.fx-theme-studio .stw-steps {
  list-style: none; margin: 0; padding: 0;
  display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px;
  counter-reset: none;
}
body.fx-theme-studio .stw-step {
  background: var(--color-pure-white, #ffffff); border: 1px solid var(--color-ash-solid, #eceaf6); border-radius: 18px; padding: 24px;
  position: relative;
}
body.fx-theme-studio .stw-step__num {
  display: inline-flex; align-items: center; justify-content: center;
  width: 36px; height: 36px; border-radius: 50%;
  background: var(--color-sky-tint, #ffe9ef); color: var(--color-deep-sapphire, #d1114b); font-size: 14px; font-weight: 700; margin-bottom: 14px;
}
body.fx-theme-studio .stw-step--rollback .stw-step__num { background: var(--color-midnight-brand, #03061a); color: #97f675; }
body.fx-theme-studio .stw-step h3 { font-size: 17px; font-weight: 600; margin: 0 0 8px; color: var(--color-midnight-ink, #171526); }
body.fx-theme-studio .stw-step p { font-size: 14px; line-height: 1.55; color: #56546b; margin: 0; }

body.fx-theme-studio .stw-duo { padding-block: 0 clamp(48px, 8vw, 96px); }
body.fx-theme-studio .stw-duo__grid {
  display: grid; grid-template-columns: 1fr 1fr; gap: 18px;
}
body.fx-theme-studio .stw-duo__card {
  border-radius: 22px; padding: clamp(28px, 4vw, 44px);
  display: flex; flex-direction: column; gap: 12px; align-items: flex-start;
}
body.fx-theme-studio .stw-duo__card--blush { background: var(--color-peach, #fed7e1); }
body.fx-theme-studio .stw-duo__card--paper { background: var(--color-paper-mist, #f8faff); border: 1px solid var(--color-ash-solid, #eceaf6); }
body.fx-theme-studio .stw-duo__card h3 {
  font-size: clamp(22px, 2.4vw, 30px); font-weight: 500; letter-spacing: -0.02em;
  color: var(--color-midnight-ink, #171526); margin: 0; max-width: 18ch;
}
body.fx-theme-studio .stw-duo__card p { font-size: 15px; line-height: 1.6; color: rgba(23, 21, 38, 0.7); margin: 0; }

@media (max-width: 900px) {
  body.fx-theme-studio .stw-steps { grid-template-columns: 1fr 1fr; }
  body.fx-theme-studio .stw-duo__grid { grid-template-columns: 1fr; }
}
@media (max-width: 560px) {
  body.fx-theme-studio .stw-steps { grid-template-columns: 1fr; }
}

/* ============================================================
   17. GAME SERVERS (stg-*) — magenta billboard + game picker
   ============================================================ */
body.fx-theme-studio .stg-hero { padding: clamp(32px, 5vh, 64px) 0 clamp(24px, 4vh, 48px); }
body.fx-theme-studio .stg-hero__panel {
  display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr);
  background: var(--color-notion-blue, #fa2f62); border-radius: 28px; overflow: hidden; min-height: 420px;
}
body.fx-theme-studio .stg-hero__copy {
  padding: clamp(32px, 5vw, 64px);
  display: flex; flex-direction: column; justify-content: center; gap: 16px;
}
body.fx-theme-studio .stg-hero__copy h1 {
  font-size: clamp(32px, 4.2vw, 52px); font-weight: 500; letter-spacing: -0.028em;
  line-height: 1.08; color: #ffffff; margin: 0; max-width: 16ch;
}
body.fx-theme-studio .stg-hero__copy h1 em { color: #ffffef; font-style: italic; }
body.fx-theme-studio .stg-hero__copy p {
  font-size: 16px; line-height: 1.6; color: rgba(255, 255, 255, 0.82); margin: 0; max-width: 46ch;
}
body.fx-theme-studio .stg-hero__alt {
  font-size: 15px; font-weight: 700; color: #ffffff;
  text-decoration: underline; text-underline-offset: 4px;
}
body.fx-theme-studio .stg-hero__pings {
  display: flex; flex-wrap: wrap; gap: 10px 18px; margin-top: 8px;
  font-size: 13px; font-weight: 600; color: rgba(255, 255, 255, 0.85);
}
body.fx-theme-studio .stg-hero__pings i {
  display: inline-block; width: 8px; height: 8px; border-radius: 50%;
  background: #97f675; margin-right: 6px; vertical-align: middle;
  box-shadow: 0 0 0 0 rgba(151, 246, 117, 0.5); animation: st-pulse 2.2s ease-out infinite;
}
body.fx-theme-studio .stg-hero__media { position: relative; }
body.fx-theme-studio .stg-hero__media img { width: 100%; height: 100%; object-fit: cover; display: block; }
body.fx-theme-studio .stg-hero__float { left: -28px; top: 72%; }

body.fx-theme-studio .stg-games { padding-block: clamp(48px, 8vw, 96px); }
body.fx-theme-studio .stg-games__grid {
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px;
}
body.fx-theme-studio .stg-game {
  display: flex; flex-direction: column; gap: 10px;
  background: var(--color-pure-white, #ffffff); border: 1px solid var(--color-ash-solid, #eceaf6); border-radius: 18px;
  padding: 24px; text-decoration: none; color: var(--color-midnight-ink, #171526);
  transition: transform .25s cubic-bezier(.16,1,.3,1), border-color .2s ease, box-shadow .25s ease;
}
body.fx-theme-studio .stg-game:hover {
  transform: translateY(-4px); border-color: var(--tone, #fa2f62);
  box-shadow: 0 16px 32px -12px color-mix(in srgb, var(--tone, #fa2f62) 35%, transparent);
}
body.fx-theme-studio .stg-game__icon {
  width: 48px; height: 48px; border-radius: 14px; display: inline-flex;
  align-items: center; justify-content: center; font-size: 20px;
  background: color-mix(in srgb, var(--tone, #fa2f62) 14%, white); color: var(--tone, #fa2f62);
}
body.fx-theme-studio .stg-game h3 { font-size: 18px; font-weight: 600; margin: 0; }
body.fx-theme-studio .stg-game p { font-size: 14px; line-height: 1.5; color: #56546b; margin: 0; flex: 1; }
body.fx-theme-studio .stg-game b { font-size: 14px; font-weight: 700; color: var(--tone, #fa2f62); }

body.fx-theme-studio .stg-tiers { padding-block: clamp(24px, 4vw, 48px) clamp(48px, 8vw, 96px); }
body.fx-theme-studio .stg-tiers__row {
  display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px;
}
body.fx-theme-studio .stg-tier {
  position: relative; display: flex; flex-direction: column; gap: 10px;
  background: var(--color-pure-white, #ffffff); border: 1px solid var(--color-ash-solid, #eceaf6); border-radius: 18px;
  padding: 24px 20px; text-decoration: none; color: var(--color-midnight-ink, #171526); text-align: center;
  transition: transform .25s ease, border-color .2s ease;
}
body.fx-theme-studio .stg-tier:hover { transform: translateY(-3px); border-color: var(--color-midnight-brand, #03061a); }
body.fx-theme-studio .stg-tier.is-hot { border-color: var(--color-midnight-brand, #03061a); background: var(--color-midnight-brand, #03061a); color: #ffffff; }
body.fx-theme-studio .stg-tier.is-hot span { color: rgba(255, 255, 255, 0.65); }
body.fx-theme-studio .stg-tier.is-hot em { color: #97f675; }
body.fx-theme-studio .stg-tier b { font-size: 28px; font-weight: 700; letter-spacing: -0.02em; }
body.fx-theme-studio .stg-tier span { font-size: 13px; line-height: 1.45; color: #75738c; }
body.fx-theme-studio .stg-tier em {
  font-style: normal; font-size: 22px; font-weight: 700; color: var(--color-midnight-ink, #171526); margin-top: 4px;
}
body.fx-theme-studio .stg-tier em small { font-size: 13px; font-weight: 600; color: inherit; opacity: 0.6; }

@media (max-width: 1000px) {
  body.fx-theme-studio .stg-hero__panel { grid-template-columns: 1fr; }
  body.fx-theme-studio .stg-hero__media { aspect-ratio: 16 / 9; }
  body.fx-theme-studio .stg-games__grid { grid-template-columns: repeat(2, 1fr); }
  body.fx-theme-studio .stg-tiers__row { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 560px) {
  body.fx-theme-studio .stg-games__grid,
  body.fx-theme-studio .stg-tiers__row { grid-template-columns: 1fr; }
}

/* ============================================================
   18. BUSINESS EMAIL (stm-*) — mint hero + inbox + vs strip
   ============================================================ */
body.fx-theme-studio .stm-hero {
  background: linear-gradient(180deg, #edfcf5 0%, #ffffff 70%);
  padding: clamp(40px, 7vh, 88px) 0 clamp(24px, 4vh, 48px);
}
body.fx-theme-studio .stm-kicker { background: #d5fced; color: #00744f; }
body.fx-theme-studio .stm-inbox {
  background: var(--color-pure-white, #ffffff); border: 1px solid var(--color-ash-solid, #eceaf6); border-radius: 20px; overflow: hidden;
  box-shadow: 0 24px 48px -20px rgba(0, 150, 110, 0.18);
}
body.fx-theme-studio .stm-inbox__bar {
  display: flex; align-items: center; gap: 7px;
  padding: 12px 16px; border-bottom: 1px solid #f0eef8; background: #edfcf5;
}
body.fx-theme-studio .stm-inbox__bar span { width: 10px; height: 10px; border-radius: 50%; background: var(--color-ash-solid, #e7e5f2); }
body.fx-theme-studio .stm-inbox__bar span:first-child { background: var(--color-notion-blue, #fa2f62); }
body.fx-theme-studio .stm-inbox__bar span:nth-child(2) { background: #ffffef; border: 1px solid var(--color-ash-solid, #eceaf6); }
body.fx-theme-studio .stm-inbox__bar span:nth-child(3) { background: #97f675; }
body.fx-theme-studio .stm-inbox__bar b {
  margin-inline: auto; font-family: var(--font-geist-mono);
  font-size: 12px; font-weight: 500; color: #75738c;
}
body.fx-theme-studio .stm-inbox__list { display: flex; flex-direction: column; }
body.fx-theme-studio .stm-mail {
  display: grid; grid-template-columns: 40px 1fr auto; gap: 12px; align-items: center;
  padding: 14px 16px; border-bottom: 1px solid #f0eef8;
}
body.fx-theme-studio .stm-mail.is-unread { background: var(--color-paper-mist, #f8faff); }
body.fx-theme-studio .stm-mail > i {
  width: 40px; height: 40px; border-radius: 50%; display: inline-flex;
  align-items: center; justify-content: center; font-style: normal;
  font-size: 13px; font-weight: 700; background: #e4dbff; color: #5f33e6;
}
body.fx-theme-studio .stm-mail > i.is-brand { background: var(--color-midnight-brand, #03061a); color: #97f675; }
body.fx-theme-studio .stm-mail b { display: block; font-size: 14px; font-weight: 600; color: var(--color-midnight-ink, #171526); }
body.fx-theme-studio .stm-mail small { font-size: 12.5px; color: #75738c; }
body.fx-theme-studio .stm-mail > span { font-size: 12px; color: #a5a3b8; }
body.fx-theme-studio .stm-inbox__foot {
  padding: 12px 16px; font-size: 12.5px; font-weight: 600; color: #00744f;
  background: #edfcf5; display: flex; align-items: center; gap: 8px;
}

body.fx-theme-studio .stm-vs { padding-block: clamp(48px, 8vw, 96px); }
body.fx-theme-studio .stm-vs__row {
  display: grid; grid-template-columns: 1fr auto 1fr; gap: 18px; align-items: center;
}
body.fx-theme-studio .stm-vs__card {
  border-radius: 20px; padding: 28px; border: 1px solid var(--color-ash-solid, #eceaf6); background: var(--color-pure-white, #ffffff);
}
body.fx-theme-studio .stm-vs__card.is-them { opacity: 0.85; }
body.fx-theme-studio .stm-vs__card.is-us {
  background: #edfcf5; border-color: #b6f0d4;
}
body.fx-theme-studio .stm-vs__tag {
  display: inline-block; font-size: 12px; font-weight: 700; text-transform: uppercase;
  letter-spacing: 0.06em; color: #75738c; margin-bottom: 12px;
}
body.fx-theme-studio .stm-vs__card.is-us .stm-vs__tag { color: #00744f; }
body.fx-theme-studio .stm-vs__addr {
  font-family: var(--font-geist-mono);
  font-size: 15px; font-weight: 600; color: var(--color-midnight-ink, #171526); margin: 0 0 18px;
  word-break: break-all;
}
body.fx-theme-studio .stm-vs__card ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 10px; }
body.fx-theme-studio .stm-vs__card li { font-size: 14.5px; color: #4f4d63; display: flex; gap: 10px; align-items: center; }
body.fx-theme-studio .stm-vs__card.is-them li i { color: var(--color-notion-blue, #fa2f62); }
body.fx-theme-studio .stm-vs__card.is-us li i { color: #00966e; }
body.fx-theme-studio .stm-vs__arrow {
  width: 44px; height: 44px; border-radius: 50%; background: var(--color-midnight-brand, #03061a); color: #fff;
  display: inline-flex; align-items: center; justify-content: center;
}

@media (max-width: 800px) {
  body.fx-theme-studio .stm-vs__row { grid-template-columns: 1fr; }
  body.fx-theme-studio .stm-vs__arrow { transform: rotate(90deg); margin-inline: auto; }
}

/* ============================================================
   19. WEB APPS (sta-*) — deploy console + pipeline
   ============================================================ */
body.fx-theme-studio .sta-hero {
  background: linear-gradient(180deg, #f3efff 0%, #ffffff 65%);
  padding: clamp(40px, 7vh, 88px) 0 clamp(24px, 4vh, 48px);
}
body.fx-theme-studio .sta-hero__stack {
  display: flex; flex-wrap: wrap; gap: 8px; margin-top: 24px;
}
body.fx-theme-studio .sta-hero__stack span {
  display: inline-flex; align-items: center; gap: 8px;
  background: var(--color-pure-white, #ffffff); border: 1px solid var(--color-ash-solid, #eceaf6); border-radius: 999px;
  padding: 7px 14px; font-size: 13px; font-weight: 600; color: #4f4d63;
}
body.fx-theme-studio .sta-hero__stack i { color: var(--color-lavender, #794dff); }

body.fx-theme-studio .sta-console {
  background: var(--color-midnight-brand, #03061a); border-radius: 18px; overflow: hidden;
  box-shadow: 0 30px 60px -20px rgba(121, 77, 255, 0.35);
}
body.fx-theme-studio .sta-console__bar {
  display: flex; align-items: center; gap: 7px;
  padding: 12px 16px; border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}
body.fx-theme-studio .sta-console__bar span { width: 10px; height: 10px; border-radius: 50%; background: rgba(255,255,255,0.15); }
body.fx-theme-studio .sta-console__bar span:first-child { background: var(--color-notion-blue, #fa2f62); }
body.fx-theme-studio .sta-console__bar span:nth-child(2) { background: #ffffef; }
body.fx-theme-studio .sta-console__bar span:nth-child(3) { background: #97f675; }
body.fx-theme-studio .sta-console__bar b {
  margin-inline: auto; font-family: var(--font-geist-mono);
  font-size: 12px; font-weight: 500; color: rgba(255, 255, 255, 0.45);
}
body.fx-theme-studio .sta-console__body,
body.fx-theme-studio .sta-console__body code {
  margin: 0; padding: 20px 22px; min-height: 260px;
  font-family: var(--font-geist-mono); font-size: 13px; line-height: 1.7;
  color: rgba(255, 255, 255, 0.82); white-space: pre-wrap;
  background: var(--color-midnight-brand, #03061a) !important; border: 0; box-shadow: none;
}
body.fx-theme-studio .sta-console__body code { display: block; padding: 0; min-height: 0; }
body.fx-theme-studio .sta-console__body i { color: var(--color-mocha, #b39bff); font-style: normal; }
body.fx-theme-studio .sta-console__body em { color: #97f675; font-style: normal; }
body.fx-theme-studio .sta-console__body b { color: #97f675; font-weight: 600; }
body.fx-theme-studio .sta-cursor {
  display: inline-block; width: 8px; height: 14px; background: var(--color-mocha, #b39bff);
  vertical-align: text-bottom; animation: stv-blink 1s step-end infinite;
}

body.fx-theme-studio .sta-pipe { padding-block: clamp(48px, 8vw, 96px); }
body.fx-theme-studio .sta-pipe__steps {
  list-style: none; margin: 0; padding: 0;
  display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px;
}
body.fx-theme-studio .sta-pipe__steps li {
  background: var(--color-pure-white, #ffffff); border: 1px solid var(--color-ash-solid, #eceaf6); border-radius: 18px; padding: 24px;
}
body.fx-theme-studio .sta-pipe__num {
  display: block; font-family: var(--font-geist-mono);
  font-size: 13px; font-weight: 600; color: var(--color-lavender, #794dff); margin-bottom: 12px;
}
body.fx-theme-studio .sta-pipe__steps h3 {
  font-size: 17px; font-weight: 600; margin: 0 0 8px; color: var(--color-midnight-ink, #171526);
}
body.fx-theme-studio .sta-pipe__steps p {
  font-size: 14px; line-height: 1.55; color: #56546b; margin: 0;
}

@media (max-width: 900px) {
  body.fx-theme-studio .sta-pipe__steps { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 560px) {
  body.fx-theme-studio .sta-pipe__steps { grid-template-columns: 1fr; }
}

/* ============================================================
   20. ORDER SERVICES / STORE (sts-*) — catalog + sticky rail
   ============================================================ */
body.fx-theme-studio .sts-hero {
  padding: clamp(40px, 7vh, 88px) 0 clamp(24px, 4vh, 48px);
}
body.fx-theme-studio .sts-hero__title {
  font-size: clamp(36px, 4.9vw, 64px); font-weight: 500; letter-spacing: -0.03em;
  line-height: 1.06; color: var(--color-midnight-ink, #171526); max-width: 16ch; margin: 0 0 18px;
}
body.fx-theme-studio .sts-hero__sub {
  font-size: clamp(15px, 1.5vw, 18px); line-height: 1.6; color: #56546b;
  max-width: 54ch; margin: 0 0 28px;
}
body.fx-theme-studio .sts-hero__actions {
  display: flex; gap: 22px; align-items: center; flex-wrap: wrap;
}

body.fx-theme-studio .sts-catalog { padding-block: 0 clamp(48px, 8vw, 96px); }
body.fx-theme-studio .sts-catalog__grid {
  display: grid; grid-template-columns: 200px minmax(0, 1fr); gap: 28px; align-items: start;
}
body.fx-theme-studio .sts-rail {
  position: sticky; top: 88px;
  display: flex; flex-direction: column; gap: 4px;
  background: var(--color-pure-white, #ffffff); border: 1px solid var(--color-ash-solid, #eceaf6); border-radius: 18px; padding: 10px;
}
body.fx-theme-studio .sts-rail a {
  display: flex; align-items: center; gap: 10px;
  padding: 10px 14px; border-radius: 999px;
  font-size: 14px; font-weight: 600; color: #56546b; text-decoration: none;
  transition: background .2s ease, color .2s ease;
}
body.fx-theme-studio .sts-rail a i { width: 16px; text-align: center; font-size: 13px; }
body.fx-theme-studio .sts-rail a:hover { background: var(--color-paper-mist, #f8faff); color: var(--color-midnight-ink, #171526); }
body.fx-theme-studio .sts-rail a.is-active { background: var(--color-sky-tint, #ffe9ef); color: var(--color-deep-sapphire, #d1114b); }

body.fx-theme-studio .sts-tiles {
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px;
}
body.fx-theme-studio .sts-tile {
  display: flex; flex-direction: column; gap: 10px;
  background: var(--color-pure-white, #ffffff); border: 1px solid var(--color-ash-solid, #eceaf6); border-radius: 20px;
  padding: 28px; text-decoration: none; color: var(--color-midnight-ink, #171526); min-height: 220px;
  transition: transform .25s cubic-bezier(.16,1,.3,1), box-shadow .25s ease;
}
body.fx-theme-studio .sts-tile:hover {
  transform: translateY(-4px); box-shadow: 0 18px 36px -14px rgba(23, 21, 38, 0.16);
}
body.fx-theme-studio .sts-tile--ink { background: var(--color-midnight-brand, #03061a); border-color: var(--color-midnight-brand, #03061a); color: #ffffff; }
body.fx-theme-studio .sts-tile--violet { background: var(--color-lavender, #794dff); border-color: var(--color-lavender, #794dff); color: #ffffff; }
body.fx-theme-studio .sts-tile--pink { background: var(--color-notion-blue, #fa2f62); border-color: var(--color-notion-blue, #fa2f62); color: #ffffff; }
/* base.css sets h3 { color: charcoal } — force light type on tinted tiles */
body.fx-theme-studio .sts-tile--ink h3,
body.fx-theme-studio .sts-tile--ink p,
body.fx-theme-studio .sts-tile--ink .sts-tile__kicker,
body.fx-theme-studio .sts-tile--ink .sts-tile__meta,
body.fx-theme-studio .sts-tile--violet h3,
body.fx-theme-studio .sts-tile--violet p,
body.fx-theme-studio .sts-tile--violet .sts-tile__kicker,
body.fx-theme-studio .sts-tile--violet .sts-tile__meta,
body.fx-theme-studio .sts-tile--pink h3,
body.fx-theme-studio .sts-tile--pink p,
body.fx-theme-studio .sts-tile--pink .sts-tile__kicker,
body.fx-theme-studio .sts-tile--pink .sts-tile__meta {
  color: #ffffff;
}
body.fx-theme-studio .sts-tile--ink p,
body.fx-theme-studio .sts-tile--violet p,
body.fx-theme-studio .sts-tile--pink p {
  opacity: 0.82;
}
body.fx-theme-studio .sts-tile__kicker {
  font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.08em;
  opacity: 0.65;
}
body.fx-theme-studio .sts-tile h3 {
  font-size: clamp(20px, 2.2vw, 26px); font-weight: 500; letter-spacing: -0.02em;
  margin: 0; line-height: 1.15; max-width: 16ch;
}
body.fx-theme-studio .sts-tile p {
  font-size: 14.5px; line-height: 1.55; margin: 0; flex: 1; opacity: 0.78;
}
body.fx-theme-studio .sts-tile:not([class*="sts-tile--"]) p { color: #56546b; opacity: 1; }
body.fx-theme-studio .sts-tile__meta {
  display: flex; align-items: center; justify-content: space-between;
  font-size: 14px; font-weight: 700; margin-top: 8px;
}
body.fx-theme-studio .sts-tile__meta i { font-size: 12px; transition: transform .2s ease; }
body.fx-theme-studio .sts-tile:hover .sts-tile__meta i { transform: translateX(3px); }

body.fx-theme-studio .sts-how { padding-block: clamp(32px, 5vw, 64px) clamp(48px, 8vw, 96px); }
body.fx-theme-studio .sts-how__row {
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px;
}
body.fx-theme-studio .sts-how__step {
  background: var(--color-paper-mist, #f8faff); border: 1px solid var(--color-ash-solid, #eceaf6); border-radius: 18px; padding: 28px;
}
body.fx-theme-studio .sts-how__step > span {
  display: inline-flex; align-items: center; justify-content: center;
  width: 36px; height: 36px; border-radius: 50%;
  background: var(--color-midnight-brand, #03061a); color: #ffffff; font-size: 14px; font-weight: 700; margin-bottom: 14px;
}
body.fx-theme-studio .sts-how__step h3 {
  font-size: 18px; font-weight: 600; margin: 0 0 8px; color: var(--color-midnight-ink, #171526);
}
body.fx-theme-studio .sts-how__step p {
  font-size: 14.5px; line-height: 1.55; color: #56546b; margin: 0;
}

@media (max-width: 1000px) {
  body.fx-theme-studio .sts-catalog__grid { grid-template-columns: 1fr; }
  body.fx-theme-studio .sts-rail {
    position: static; flex-direction: row; overflow-x: auto; gap: 4px;
  }
  body.fx-theme-studio .sts-rail a { white-space: nowrap; }
}
@media (max-width: 700px) {
  body.fx-theme-studio .sts-tiles,
  body.fx-theme-studio .sts-how__row { grid-template-columns: 1fr; }
}

/* ------------------------------------------------------------
   Shared depth sections — quick links, stats, spotlight, OS,
   pricing fine print, hero trust line (used across landings)
   ------------------------------------------------------------ */

/* --- Quick links row --- */
body.fx-theme-studio .st-quick {
  padding-block: clamp(20px, 3vw, 36px) clamp(32px, 5vw, 56px);
}
body.fx-theme-studio .st-quick__kicker {
  text-align: center;
  font-size: 13px; font-weight: 700; letter-spacing: 0.04em;
  text-transform: uppercase; color: #75738c;
  margin: 0 0 18px;
}
body.fx-theme-studio .st-quick__row {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 12px;
}
body.fx-theme-studio .st-quick__card {
  display: flex; flex-direction: column; align-items: flex-start; gap: 12px;
  background: var(--color-paper-mist, #f8faff); border: 1px solid var(--color-ash-solid, #eceaf6); border-radius: 18px;
  padding: 18px 18px 20px; text-decoration: none; color: var(--color-midnight-ink, #171526);
  min-height: 110px;
  transition: transform .2s ease, box-shadow .2s ease, background .2s ease, border-color .2s ease;
}
body.fx-theme-studio .st-quick__card i {
  font-size: 18px; color: var(--color-lavender, #794dff);
}
body.fx-theme-studio .st-quick__card span {
  font-size: 14px; font-weight: 600; line-height: 1.35; letter-spacing: -0.01em;
}
body.fx-theme-studio .st-quick__card:hover {
  transform: translateY(-3px);
  box-shadow: 0 14px 28px -12px rgba(23, 21, 38, 0.14);
  background: var(--color-pure-white, #ffffff); border-color: #e0dceb;
}
body.fx-theme-studio .st-quick__card--ink {
  background: var(--color-midnight-brand, #03061a); border-color: var(--color-midnight-brand, #03061a); color: #ffffff;
}
body.fx-theme-studio .st-quick__card--ink i { color: #97f675; }
body.fx-theme-studio .st-quick__card--ink:hover {
  background: #221f35; border-color: #221f35;
}

/* --- Stats strip --- */
body.fx-theme-studio .st-stats {
  padding-block: clamp(28px, 4vw, 48px);
  background: var(--color-paper-mist, #f8faff); border-block: 1px solid var(--color-ash-solid, #eceaf6);
}
body.fx-theme-studio .st-stats__row {
  display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px;
  text-align: center;
}
body.fx-theme-studio .st-stats__row > div {
  display: flex; flex-direction: column; gap: 6px;
  padding: 8px 12px;
}
body.fx-theme-studio .st-stats__row b {
  font-size: clamp(28px, 3.2vw, 40px); font-weight: 500;
  letter-spacing: -0.03em; color: var(--color-midnight-ink, #171526); line-height: 1;
}
body.fx-theme-studio .st-stats__row span {
  font-size: 13.5px; font-weight: 600; color: #75738c;
}

/* --- Spotlight trio --- */
body.fx-theme-studio .st-spotlight {
  padding-block: clamp(48px, 8vw, 104px);
}
body.fx-theme-studio .st-spotlight__grid {
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px;
}
body.fx-theme-studio .st-spot {
  display: flex; flex-direction: column; gap: 12px;
  border-radius: 22px; padding: 28px 28px 30px;
  background: var(--color-paper-mist, #f8faff); border: 1px solid var(--color-ash-solid, #eceaf6); color: var(--color-midnight-ink, #171526);
}
body.fx-theme-studio .st-spot__icon {
  display: inline-flex; align-items: center; justify-content: center;
  width: 44px; height: 44px; border-radius: 14px;
  background: rgba(23, 21, 38, 0.06); color: var(--color-midnight-ink, #171526); font-size: 18px;
}
body.fx-theme-studio .st-spot h3 {
  font-size: 22px; font-weight: 500; letter-spacing: -0.02em;
  margin: 0; line-height: 1.2;
}
body.fx-theme-studio .st-spot > p {
  font-size: 15px; line-height: 1.55; color: #56546b; margin: 0;
}
body.fx-theme-studio .st-spot ul {
  list-style: none; margin: 8px 0 0; padding: 0;
  display: flex; flex-direction: column; gap: 8px;
}
body.fx-theme-studio .st-spot ul li {
  position: relative; padding-left: 16px;
  font-size: 13.5px; font-weight: 600; color: #4f4d63;
}
body.fx-theme-studio .st-spot ul li::before {
  content: ""; position: absolute; left: 0; top: 0.55em;
  width: 6px; height: 6px; border-radius: 50%; background: var(--color-notion-blue, #fa2f62);
}

body.fx-theme-studio .st-spot--lav {
  background: #f3eeff; border-color: #e4d9ff;
}
body.fx-theme-studio .st-spot--lav .st-spot__icon {
  background: rgba(121, 77, 255, 0.14); color: var(--color-lavender, #794dff);
}
body.fx-theme-studio .st-spot--lav ul li::before { background: var(--color-lavender, #794dff); }

body.fx-theme-studio .st-spot--ink {
  background: var(--color-midnight-brand, #03061a); border-color: var(--color-midnight-brand, #03061a); color: #ffffff;
}
body.fx-theme-studio .st-spot--ink .st-spot__icon {
  background: rgba(255, 255, 255, 0.12); color: #97f675;
}
body.fx-theme-studio .st-spot--ink h3 { color: #ffffff; }
body.fx-theme-studio .st-spot--ink > p { color: rgba(255, 255, 255, 0.72); }
body.fx-theme-studio .st-spot--ink ul li { color: rgba(255, 255, 255, 0.78); }
body.fx-theme-studio .st-spot--ink ul li::before { background: #97f675; }

body.fx-theme-studio .st-spot--blush {
  background: var(--color-sky-tint, #ffe9ef); border-color: #ffd0db;
}
body.fx-theme-studio .st-spot--blush .st-spot__icon {
  background: rgba(250, 47, 98, 0.14); color: var(--color-notion-blue, #fa2f62);
}
body.fx-theme-studio .st-spot--blush ul li::before { background: var(--color-notion-blue, #fa2f62); }

body.fx-theme-studio .st-spot--mint {
  background: #edfbf5; border-color: #c8f0df;
}
body.fx-theme-studio .st-spot--mint .st-spot__icon {
  background: rgba(0, 150, 110, 0.12); color: #00966e;
}
body.fx-theme-studio .st-spot--mint ul li::before { background: #00966e; }

body.fx-theme-studio .st-spot--peach {
  background: #fff4ed; border-color: #ffd9c2;
}
body.fx-theme-studio .st-spot--peach .st-spot__icon {
  background: rgba(232, 112, 46, 0.14); color: #c2410c;
}
body.fx-theme-studio .st-spot--peach ul li::before { background: #e8702e; }

/* --- Hero trust line --- */
body.fx-theme-studio .sth-hero__trust {
  display: inline-flex; align-items: center; gap: 8px;
  margin: 18px 0 0; font-size: 13.5px; font-weight: 600; color: #56546b;
}
body.fx-theme-studio .sth-hero__trust i { color: #00966e; font-size: 13px; }

/* --- Pricing fine print --- */
body.fx-theme-studio .st-pricing__fine {
  text-align: center; margin: 28px auto 0; max-width: 58ch;
  font-size: 13.5px; line-height: 1.55; color: #75738c;
}
body.fx-theme-studio .st-pricing__fine a {
  color: var(--color-notion-blue, #fa2f62); font-weight: 700; text-decoration: none;
}
body.fx-theme-studio .st-pricing__fine a:hover { text-decoration: underline; }

/* --- VPS OS picker --- */
body.fx-theme-studio .stv-os {
  padding-block: clamp(40px, 6vw, 80px);
}
body.fx-theme-studio .stv-os__grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}
body.fx-theme-studio .stv-os__card {
  display: flex; flex-direction: column; gap: 4px;
  background: var(--color-pure-white, #ffffff); border: 1px solid var(--color-ash-solid, #eceaf6); border-radius: 16px;
  padding: 18px 20px; color: var(--color-midnight-ink, #171526);
  transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
body.fx-theme-studio .stv-os__card:hover {
  transform: translateY(-2px);
  box-shadow: 0 12px 24px -12px rgba(23, 21, 38, 0.14);
  border-color: #e0dceb;
}
body.fx-theme-studio .stv-os__card b {
  font-size: 15px; font-weight: 700; letter-spacing: -0.01em;
}
body.fx-theme-studio .stv-os__card span {
  font-size: 13px; font-weight: 600; color: #75738c;
}
body.fx-theme-studio .stv-os__card--custom {
  background: var(--color-midnight-brand, #03061a); border-color: var(--color-midnight-brand, #03061a); color: #ffffff;
}
body.fx-theme-studio .stv-os__card--custom span { color: rgba(255, 255, 255, 0.65); }
body.fx-theme-studio .stv-os__card--custom:hover {
  background: #221f35; border-color: #221f35;
}

@media (max-width: 1100px) {
  body.fx-theme-studio .st-quick__row { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  body.fx-theme-studio .stv-os__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 800px) {
  body.fx-theme-studio .st-spotlight__grid,
  body.fx-theme-studio .st-stats__row { grid-template-columns: 1fr 1fr; }
  body.fx-theme-studio .st-quick__row { grid-template-columns: 1fr 1fr; }
  body.fx-theme-studio .stv-os__grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 560px) {
  body.fx-theme-studio .st-spotlight__grid,
  body.fx-theme-studio .st-stats__row,
  body.fx-theme-studio .st-quick__row,
  body.fx-theme-studio .stv-os__grid { grid-template-columns: 1fr; }
}

/* ============================================================
   21. DOMAIN REGISTER / TRANSFER (std-*) — Studio orderform
   ============================================================ */
body.fx-theme-studio .std-page { background: var(--surface-page, var(--color-pure-white, #ffffff)); }
body.fx-theme-studio .std-hero {
  padding: clamp(40px, 7vh, 88px) 0 clamp(24px, 4vh, 48px);
}
body.fx-theme-studio .std-hero--transfer {
  background: linear-gradient(
    180deg,
    var(--color-paper-mist, #f8faff) 0%,
    var(--surface-page, var(--color-pure-white, #ffffff)) 70%
  );
}
body.fx-theme-studio .std-search { display: flex; flex-direction: column; gap: 12px; margin: 8px 0 18px; max-width: 540px; }
body.fx-theme-studio .std-search__row { display: flex; gap: 10px; flex-wrap: wrap; }
body.fx-theme-studio .std-search__field {
  flex: 1; min-width: 220px; display: flex; align-items: center; gap: 10px;
  background: var(--color-pure-white, #ffffff); border: 1.5px solid var(--color-ash-solid, #eceaf6); border-radius: 999px;
  padding: 4px 4px 4px 18px; position: relative;
}
body.fx-theme-studio .std-search__field:focus-within { border-color: var(--color-midnight-brand, #03061a); box-shadow: 0 0 0 4px rgba(23, 21, 38, 0.08); }
body.fx-theme-studio .std-search__field > i { color: #a5a3b8; font-size: 14px; }
body.fx-theme-studio .std-search__input,
body.fx-theme-studio .std-search .fx-domain-page__input {
  flex: 1; border: 0 !important; background: transparent !important; box-shadow: none !important;
  padding: 12px 8px !important; font-size: 15px; color: var(--color-midnight-ink, #171526); outline: none; width: 100%;
  border-radius: 0 !important;
}
body.fx-theme-studio .std-search__row .st-btn { flex-shrink: 0; }
body.fx-theme-studio .std-search__help {
  width: 36px; height: 36px; border-radius: 50%; border: 0; background: var(--color-paper-mist, #f2f3f7);
  color: #56546b; cursor: pointer; display: inline-flex; align-items: center; justify-content: center;
  margin-right: 4px;
}
body.fx-theme-studio .std-search__help-panel {
  background: var(--color-paper-mist, #f8faff); border: 1px solid var(--color-ash-solid, #eceaf6); border-radius: 14px;
  padding: 12px 14px; font-size: 13.5px; line-height: 1.5; color: #56546b;
}
body.fx-theme-studio .std-search__more { font-size: 13.5px; color: #56546b; }
body.fx-theme-studio .std-search__more summary { cursor: pointer; font-weight: 600; color: var(--color-midnight-ink, #171526); }
body.fx-theme-studio .std-search__more-body { margin-top: 12px; display: flex; flex-direction: column; gap: 12px; }
body.fx-theme-studio .std-tld-picks, body.fx-theme-studio .std-tld-row {
  display: flex; flex-wrap: wrap; gap: 8px;
}
body.fx-theme-studio .std-chip {
  display: inline-flex; align-items: center; gap: 6px;
  background: var(--color-paper-mist, #f8faff); border: 1px solid var(--color-ash-solid, #eceaf6); border-radius: 999px;
  padding: 8px 14px; font-size: 13px; font-weight: 600; color: var(--color-midnight-ink, #171526); cursor: pointer;
}
body.fx-theme-studio .std-chip.is-active, body.fx-theme-studio .std-chip:hover {
  background: var(--color-midnight-brand, #03061a); color: #ffffff; border-color: var(--color-midnight-brand, #03061a);
}
body.fx-theme-studio .std-chip--price { flex-direction: column; align-items: flex-start; gap: 2px; border-radius: 14px; padding: 10px 14px; }
body.fx-theme-studio .std-chip--price span { font-size: 11.5px; font-weight: 500; color: #75738c; }
body.fx-theme-studio .std-chip--price.is-active span, body.fx-theme-studio .std-chip--price:hover span { color: rgba(255,255,255,0.7); }
body.fx-theme-studio .std-search__filters {
  display: flex; flex-wrap: wrap; gap: 12px; align-items: center; font-size: 13px; color: #56546b;
}
body.fx-theme-studio .std-search__select {
  border: 1px solid var(--color-ash-solid, #eceaf6); border-radius: 10px; padding: 8px 12px; background: var(--color-pure-white, #ffffff);
}
body.fx-theme-studio .std-hero__alt { margin: 10px 0 0; }
body.fx-theme-studio .std-hero__note { margin: 8px 0 0; font-size: 12.5px; color: #a5a3b8; }
body.fx-theme-studio .std-hero__results { pointer-events: auto; }
body.fx-theme-studio .std-avail,
body.fx-theme-studio .std-timeline {
  background: var(--color-pure-white, #ffffff); border: 1px solid var(--color-ash-solid, #eceaf6); border-radius: 18px; overflow: hidden;
  box-shadow: 0 18px 40px -12px rgba(23, 21, 38, 0.28);
}
body.fx-theme-studio .std-avail__bar,
body.fx-theme-studio .std-timeline__bar {
  display: flex; align-items: center; gap: 10px;
  padding: 12px 16px; border-bottom: 1px solid #f0eef8;
  font-size: 13px; font-weight: 600; color: #56546b; background: var(--color-paper-mist, #f8faff);
}
body.fx-theme-studio .std-avail__hint { margin: 0; padding: 18px 16px; font-size: 13.5px; color: #75738c; line-height: 1.5; }
body.fx-theme-studio .std-timeline ul {
  list-style: none; margin: 0; padding: 8px; display: flex; flex-direction: column; gap: 4px;
}
body.fx-theme-studio .std-timeline li {
  display: flex; align-items: center; gap: 10px;
  padding: 10px 12px; border-radius: 12px; font-size: 13.5px; color: #4f4d63;
}
body.fx-theme-studio .std-timeline li i { color: #00966e; width: 16px; text-align: center; }
body.fx-theme-studio .std-timeline li .fa-clock { color: var(--color-lavender, #794dff); }
body.fx-theme-studio .std-steps { padding-block: clamp(48px, 8vw, 96px); }
body.fx-theme-studio .std-steps__grid {
  list-style: none; margin: 0; padding: 0;
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px;
}
body.fx-theme-studio .std-steps__grid li {
  background: var(--color-pure-white, #ffffff); border: 1px solid var(--color-ash-solid, #eceaf6); border-radius: 18px; padding: 24px;
}
body.fx-theme-studio .std-steps__grid span {
  display: inline-flex; align-items: center; justify-content: center;
  width: 36px; height: 36px; border-radius: 50%;
  background: var(--color-sky-tint, #ffe9ef); color: var(--color-deep-sapphire, #d1114b); font-size: 13px; font-weight: 700; margin-bottom: 14px;
}
body.fx-theme-studio .std-steps__grid h3 {
  font-size: 18px; font-weight: 500; margin: 0 0 8px; color: var(--color-midnight-ink, #171526);
}
body.fx-theme-studio .std-steps__grid p { margin: 0; font-size: 14.5px; line-height: 1.55; color: #56546b; }
body.fx-theme-studio .std-pricing { padding-block: clamp(24px, 4vh, 48px) clamp(48px, 8vw, 96px); }
body.fx-theme-studio .std-pricing__card {
  background: var(--color-pure-white, #ffffff); border: 1px solid var(--color-ash-solid, #eceaf6); border-radius: 22px;
  padding: clamp(16px, 3vw, 28px); overflow: auto;
}
@media (max-width: 900px) {
  body.fx-theme-studio .std-steps__grid { grid-template-columns: 1fr; }
  body.fx-theme-studio .std-search__row .st-btn { width: 100%; justify-content: center; }
}

/* ============================================================
   22. AUTH — login / register / password reset (st-auth*)
   ============================================================ */
body.fx-theme-studio .st-auth {
  min-height: 100dvh; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  background: var(--color-pure-white, #ffffff);
}
body.fx-theme-studio .st-auth__form {
  display: flex; align-items: center; justify-content: center;
  padding: clamp(32px, 6vw, 72px) clamp(24px, 4vw, 56px);
}
body.fx-theme-studio .st-auth__form-inner { width: 100%; max-width: 440px; }
body.fx-theme-studio .st-auth__aside {
  position: relative; padding: 20px; display: flex;
}
body.fx-theme-studio .st-auth__media {
  position: relative; flex: 1; border-radius: 28px; overflow: hidden;
  background: var(--color-paper-mist, #f8faff);
}
body.fx-theme-studio .st-auth__photo {
  width: 100%; height: 100%; object-fit: cover; display: block; min-height: calc(100dvh - 40px);
}
body.fx-theme-studio .st-auth-panel .st-auth-title,
body.fx-theme-studio .st-auth-title {
  font-family: var(--font-inter);
  font-size: clamp(34px, 4.5vw, 48px); font-weight: 500; letter-spacing: -0.03em;
  line-height: 1.08; color: var(--color-midnight-ink, #171526); margin: 0;
}
body.fx-theme-studio .st-auth-title em { color: var(--color-notion-blue, #fa2f62); font-style: italic; }
body.fx-theme-studio .st-auth-sub {
  font-size: 15.5px; line-height: 1.6; color: #56546b; margin: 0;
}
body.fx-theme-studio .st-auth-back {
  display: inline-flex; align-items: center; gap: 8px;
  font-size: 13.5px; font-weight: 600; color: #56546b; text-decoration: none;
}
body.fx-theme-studio .st-auth-back:hover { color: var(--color-notion-blue, #fa2f62); }
body.fx-theme-studio .st-auth-link { color: var(--color-notion-blue, #fa2f62) !important; font-weight: 600; }
body.fx-theme-studio .st-auth-link:hover { color: var(--color-deep-sapphire, #d1114b) !important; }
body.fx-theme-studio .st-auth-check { accent-color: var(--color-midnight-ink, #171526); transform: scale(1.1); }

body.fx-theme-studio .st-auth-panel .glass-input-wrapper {
  border-radius: 999px; border: 1.5px solid var(--color-ash-solid, #eceaf6); background: var(--color-pure-white, #ffffff);
}
body.fx-theme-studio .st-auth-panel .glass-input-wrapper:focus-within {
  border-color: var(--color-midnight-brand, #03061a); background: var(--color-pure-white, #ffffff);
  box-shadow: 0 0 0 4px rgba(23, 21, 38, 0.08);
}
body.fx-theme-studio .st-auth-panel .glass-input-wrapper input,
body.fx-theme-studio .st-auth-panel .glass-input-wrapper select {
  padding: 14px 18px; font-size: 15px; color: var(--color-midnight-ink, #171526);
}
/* StatesDropdown swaps the text input for #stateselect.custom-select.
   Bootstrap pins a short height; Studio padding was clipping the label. */
body.fx-theme-studio .st-auth-panel #stateWrapper {
  overflow: visible; min-height: 50px;
}
body.fx-theme-studio .st-auth-panel #stateselect,
body.fx-theme-studio .st-auth-panel .glass-input-wrapper select.custom-select {
  display: block; width: 100%; height: auto !important; min-height: 50px;
  padding: 14px 40px 14px 18px !important; line-height: 1.35;
  font-size: 15px; font-weight: 500; color: var(--color-midnight-ink, #171526) !important;
  background-color: var(--color-pure-white, #ffffff) !important; border: 0 !important;
  border-radius: 999px; box-shadow: none;
  -webkit-appearance: menulist; appearance: menulist;
  cursor: pointer;
}
body.fx-theme-studio .st-auth-panel #stateinput[style*="display: none"],
body.fx-theme-studio .st-auth-panel #stateinput[style*="display:none"] {
  display: none !important;
}
body.fx-theme-studio .st-auth-panel .fx-signin-primary {
  background: var(--color-midnight-brand, #03061a); color: #ffffff; border-radius: 999px;
  font-weight: 600; padding: 15px 0; font-size: 15px;
}
body.fx-theme-studio .st-auth-panel .fx-signin-primary:hover { background: #2a2740; }
body.fx-theme-studio .st-auth-panel .fx-google-btn,
body.fx-theme-studio .st-auth-panel .fx-social-btn__face {
  border-radius: 999px; border-color: var(--color-ash-solid, #eceaf6); padding: 14px;
}
body.fx-theme-studio .st-auth-panel .fx-google-btn:hover,
body.fx-theme-studio .st-auth-panel .fx-social-btn:hover .fx-social-btn__face {
  background: var(--color-paper-mist, #f8faff);
}
body.fx-theme-studio .st-auth-panel .fx-social-btn {
  min-height: 52px;
  border-radius: 999px;
}
body.fx-theme-studio .st-auth-panel .fx-divider span { color: #a5a3b8; }
body.fx-theme-studio .st-auth-panel .fx-divider::before,
body.fx-theme-studio .st-auth-panel .fx-divider::after { background: var(--color-ash-solid, #eceaf6); }

body.fx-theme-studio .st-auth-panel .fx-stepper__item.is-active { color: var(--color-midnight-ink, #171526); }
body.fx-theme-studio .st-auth-panel .fx-stepper__item.is-active .fx-stepper__num {
  background: var(--color-midnight-brand, #03061a); color: #fff; border-color: var(--color-midnight-brand, #03061a);
}
body.fx-theme-studio .st-auth-panel .fx-stepper__item.is-done .fx-stepper__num {
  background: #00966e; border-color: #00966e;
}
body.fx-theme-studio .st-auth-panel .fx-section-title {
  font-family: var(--font-inter);
  font-weight: 500; color: var(--color-midnight-ink, #171526);
}
body.fx-theme-studio .st-auth-panel .fx-phone-group {
  border-radius: 999px; border-color: var(--color-ash-solid, #eceaf6); overflow: visible;
}
body.fx-theme-studio .st-auth-panel .fx-phone-group:focus-within { border-color: var(--color-midnight-brand, #03061a); }
body.fx-theme-studio .st-auth-panel .fx-phone-select { position: relative; z-index: 5; }
body.fx-theme-studio .st-auth-panel .fx-phone-dropdown {
  z-index: 40; border-radius: 16px; border-color: var(--color-ash-solid, #eceaf6);
  box-shadow: 0 18px 40px -12px rgba(23, 21, 38, 0.28);
}
body.fx-theme-studio .st-auth-panel .fx-phone-select__trigger {
  border-right-color: var(--color-ash-solid, #eceaf6);
}
body.fx-theme-studio .st-auth__form-inner { overflow: visible; }
body.fx-theme-studio .st-auth-panel .fx-terms a { color: var(--color-notion-blue, #fa2f62); }
body.fx-theme-studio .st-auth-panel .fx-terms input,
body.fx-theme-studio .st-auth-panel input[type=checkbox] { accent-color: var(--color-midnight-ink, #171526); }
body.fx-theme-studio .st-auth-panel .fx-pw-meter__bar { background: var(--color-notion-blue, #fa2f62); }
body.fx-theme-studio .st-auth-panel .text-violet-400 { color: var(--color-notion-blue, #fa2f62) !important; }

@media (max-width: 960px) {
  body.fx-theme-studio .st-auth { grid-template-columns: 1fr; }
  body.fx-theme-studio .st-auth__aside { display: none; }
  body.fx-theme-studio .st-auth__form { min-height: 100dvh; }
}

/* ============================================================
   23. ORDERFORM — shared tokens + Classic leftovers under Studio
   Dedicated Studio orderform markup uses .sto-* (section 24).
   ============================================================ */
body.fx-theme-studio.page-flexus-cart,
body.fx-theme-studio.page-flexus-domain {
  background: var(--surface-page, var(--color-paper-warmth, #f7f5ff));
}

body.fx-theme-studio .fx-cart-page,
body.fx-theme-studio .fx-domain-page,
body.fx-theme-studio .fx-product-domain-page,
body.fx-theme-studio .fx-products-page,
body.fx-theme-studio .fx-confproduct-page,
body.fx-theme-studio .fx-checkout-page {
  background: var(--color-pure-white, #ffffff);
}

/* Hero / bento card */
body.fx-theme-studio #order-flexus_cart .fx-notion-domain__card {
  background: var(--color-pure-white, #ffffff);
  border: 1px solid var(--color-ash-solid, #eceaf6);
  border-radius: 28px;
  box-shadow: 0 18px 40px -20px rgba(23, 21, 38, 0.14);
}
body.fx-theme-studio #order-flexus_cart .fx-notion-domain__kicker {
  color: var(--color-notion-blue, #fa2f62);
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  font-size: 12px;
}
body.fx-theme-studio #order-flexus_cart .fx-notion-domain__title {
  font-family: var(--font-inter);
  font-weight: 500;
  letter-spacing: -0.03em;
  color: var(--color-midnight-ink, #171526);
}
body.fx-theme-studio #order-flexus_cart .fx-notion-domain__title em {
  color: var(--color-notion-blue, #fa2f62);
  font-style: italic;
}
body.fx-theme-studio #order-flexus_cart .fx-notion-domain__lead {
  color: #56546b;
}
body.fx-theme-studio #order-flexus_cart .fx-notion-circle-btn {
  background: var(--color-midnight-brand, #03061a);
  color: #ffffff;
  border: 0;
}
body.fx-theme-studio #order-flexus_cart .fx-notion-circle-btn:hover {
  background: #2a2740;
  color: #ffffff;
}
body.fx-theme-studio #order-flexus_cart .fx-cart-page__count {
  background: var(--color-notion-blue, #fa2f62);
}

/* Buttons */
body.fx-theme-studio #order-flexus_cart .fx-btn-primary,
body.fx-theme-studio #order-flexus_cart .btn-primary,
body.fx-theme-studio #order-flexus_cart button.btn-primary,
body.fx-theme-studio #order-flexus_cart .fx-host-plan__cta,
body.fx-theme-studio #order-flexus_cart .fx-signin-primary {
  background: var(--color-midnight-brand, #03061a) !important;
  border-color: var(--color-midnight-brand, #03061a) !important;
  color: #ffffff !important;
  border-radius: 999px !important;
  font-weight: 600;
}
body.fx-theme-studio #order-flexus_cart .fx-btn-primary:hover,
body.fx-theme-studio #order-flexus_cart .btn-primary:hover,
body.fx-theme-studio #order-flexus_cart .fx-host-plan__cta:hover {
  background: #2a2740 !important;
  border-color: #2a2740 !important;
}
body.fx-theme-studio #order-flexus_cart .fx-btn-outline,
body.fx-theme-studio #order-flexus_cart .fx-btn-tint {
  border-radius: 999px;
  border-color: var(--color-ash-solid, #eceaf6);
  color: var(--color-midnight-ink, #171526);
  background: var(--color-pure-white, #ffffff);
}
body.fx-theme-studio #order-flexus_cart .fx-btn-outline:hover,
body.fx-theme-studio #order-flexus_cart .fx-btn-tint:hover {
  border-color: var(--color-midnight-brand, #03061a);
  background: var(--color-paper-mist, #f8faff);
}
body.fx-theme-studio #order-flexus_cart .fx-notion-domain__link {
  color: var(--color-notion-blue, #fa2f62);
  font-weight: 600;
}

/* Category / currency chips */
body.fx-theme-studio #order-flexus_cart .fx-products-cats__chip,
body.fx-theme-studio #order-flexus_cart .fx-products-currency__chip,
body.fx-theme-studio #order-flexus_cart .fx-product-domain-modes a,
body.fx-theme-studio #order-flexus_cart .fx-product-domain-modes button {
  border-radius: 999px;
  border: 1px solid var(--color-ash-solid, #eceaf6);
  background: var(--color-paper-mist, #f8faff);
  color: var(--color-midnight-ink, #171526);
  font-weight: 600;
}
body.fx-theme-studio #order-flexus_cart .fx-products-cats__chip.is-active,
body.fx-theme-studio #order-flexus_cart .fx-products-currency__chip.is-active,
body.fx-theme-studio #order-flexus_cart .fx-product-domain-modes .is-active,
body.fx-theme-studio #order-flexus_cart .fx-product-domain-modes a.is-active {
  background: var(--color-midnight-brand, #03061a);
  border-color: var(--color-midnight-brand, #03061a);
  color: #ffffff;
}

/* Product plan cards */
body.fx-theme-studio #order-flexus_cart .fx-host-plan,
body.fx-theme-studio #order-flexus_cart .fx-host-plans .product {
  background: var(--color-pure-white, #ffffff);
  border: 1px solid var(--color-ash-solid, #eceaf6);
  border-radius: 22px;
  box-shadow: none;
}
body.fx-theme-studio #order-flexus_cart .fx-host-plan:hover,
body.fx-theme-studio #order-flexus_cart .fx-host-plan.is-featured {
  border-color: var(--color-midnight-brand, #03061a);
  box-shadow: 0 18px 40px -18px rgba(23, 21, 38, 0.22);
}
body.fx-theme-studio #order-flexus_cart .fx-host-plan__flag {
  background: var(--color-notion-blue, #fa2f62);
  color: #ffffff;
  border-radius: 999px;
}
body.fx-theme-studio #order-flexus_cart .fx-host-plan h3,
body.fx-theme-studio #order-flexus_cart .fx-host-plan__title-row h3 {
  font-family: var(--font-inter);
  font-weight: 500;
  color: var(--color-midnight-ink, #171526);
}
body.fx-theme-studio #order-flexus_cart .fx-host-plan__amount {
  color: var(--color-midnight-ink, #171526);
}

/* Studio catalog — st-plan cards use landing pricing tokens (not fx-host-plan / sto-plan) */
body.fx-theme-studio #order-flexus_cart.sto-products .st-pricing {
  padding-block: clamp(48px, 8vw, 104px);
  background: transparent;
}
body.fx-theme-studio #order-flexus_cart.sto-products .st-plans.products {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 20px;
  align-items: stretch;
  margin-top: 28px;
}
body.fx-theme-studio #order-flexus_cart.sto-products .st-plan.product {
  padding: 28px 28px 24px;
  margin: 0;
  float: none;
  width: auto;
  height: auto;
  background: var(--surface-card, var(--color-pure-white, #ffffff));
  border: 1px solid var(--color-ash-solid, var(--color-ash, #e5e3dc));
  border-radius: 16px;
  box-shadow: none;
}
body.fx-theme-studio #order-flexus_cart.sto-products .st-plan.product .product-pricing,
body.fx-theme-studio #order-flexus_cart.sto-products .st-plan.product .product-desc {
  float: none;
  width: auto;
  margin: 0;
  padding: 0;
  background: transparent;
  border: 0;
}
body.fx-theme-studio #order-flexus_cart.sto-products .st-plan--hot {
  border-color: var(--color-notion-blue, #0075de);
  box-shadow: 0 14px 36px -18px color-mix(in srgb, var(--color-notion-blue, #0075de) 45%, transparent);
}
body.fx-theme-studio #order-flexus_cart.sto-products .st-plan__flag {
  background: var(--color-notion-blue, #0075de);
  color: var(--color-pure-white, #ffffff);
}
body.fx-theme-studio #order-flexus_cart.sto-products .st-plan__buy.btn-order-now {
  background: var(--color-notion-blue, #0075de) !important;
  border-color: var(--color-notion-blue, #0075de) !important;
  color: var(--color-pure-white, #ffffff) !important;
  box-shadow: 0 10px 24px -12px color-mix(in srgb, var(--color-notion-blue, #0075de) 55%, transparent);
}
body.fx-theme-studio #order-flexus_cart.sto-products .st-plan__buy.btn-order-now:hover {
  filter: brightness(1.06);
  background: var(--color-notion-blue, #0075de) !important;
  border-color: var(--color-notion-blue, #0075de) !important;
  color: var(--color-pure-white, #ffffff) !important;
}
body.fx-theme-studio #order-flexus_cart.sto-products .st-plan__ico {
  border-color: color-mix(in srgb, var(--color-notion-blue, #0075de) 18%, var(--color-ash-solid, #e5e3dc));
  background: color-mix(in srgb, var(--color-notion-blue, #0075de) 8%, var(--surface-card, #fff));
  color: var(--color-notion-blue, #0075de);
}
body.fx-theme-studio #order-flexus_cart.sto-products .st-plan__ico i {
  color: var(--color-notion-blue, #0075de);
}
body.fx-theme-studio #order-flexus_cart.sto-products .fx-host-switch {
  background: var(--color-paper-mist, #f8faff);
  border-color: var(--color-ash-solid, #eceaf6);
}
body.fx-theme-studio #order-flexus_cart.sto-products .fx-host-switch__pill {
  background: var(--color-notion-blue, #0075de);
  box-shadow: 0 4px 14px color-mix(in srgb, var(--color-notion-blue, #0075de) 35%, transparent);
}
body.fx-theme-studio #order-flexus_cart.sto-products .fx-host-switch__btn:not(.is-active) .fx-host-switch__label em {
  background: var(--color-sky-tint, #ede9fe);
  color: var(--color-notion-blue, #0075de);
}
@media (max-width: 980px) {
  body.fx-theme-studio #order-flexus_cart.sto-products .st-plans.products {
    grid-template-columns: 1fr;
    max-width: 420px;
    margin-inline: auto;
  }
}

/* Configure product — billing cycles & options */
body.fx-theme-studio #order-flexus_cart .fx-confproduct-block__title,
body.fx-theme-studio #order-flexus_cart .fx-checkout-block__title,
body.fx-theme-studio #order-flexus_cart .fx-checkout-section__title {
  font-family: var(--font-inter);
  font-weight: 500;
  color: var(--color-midnight-ink, #171526);
}
body.fx-theme-studio #order-flexus_cart .fx-billing-cycle__card,
body.fx-theme-studio #order-flexus_cart .fx-config-opt,
body.fx-theme-studio #order-flexus_cart .fx-os-card {
  border: 1px solid var(--color-ash-solid, #eceaf6);
  border-radius: 18px;
  background: var(--color-pure-white, #ffffff);
}
body.fx-theme-studio #order-flexus_cart .fx-billing-cycle__card.is-selected,
body.fx-theme-studio #order-flexus_cart .fx-config-opt.is-selected,
body.fx-theme-studio #order-flexus_cart .fx-os-card.is-selected,
body.fx-theme-studio #order-flexus_cart .fx-billing-cycle__card[aria-checked="true"] {
  border-color: var(--color-midnight-brand, #03061a);
  box-shadow: 0 0 0 3px rgba(23, 21, 38, 0.08);
}
body.fx-theme-studio #order-flexus_cart .fx-billing-cycle__badge {
  background: var(--color-notion-blue, #fa2f62);
  color: #ffffff;
}
body.fx-theme-studio #order-flexus_cart .fx-billing-cycle__check,
body.fx-theme-studio #order-flexus_cart .fx-config-opt .is-check {
  background: var(--color-ash-solid, #eceaf6);
  color: transparent;
}
body.fx-theme-studio #order-flexus_cart .fx-billing-cycle__card.is-selected .fx-billing-cycle__check,
body.fx-theme-studio #order-flexus_cart .fx-config-opt.is-selected .is-check {
  background: var(--color-midnight-brand, #03061a);
  color: #97f675;
}
body.fx-theme-studio #order-flexus_cart .fx-confproduct-summary,
body.fx-theme-studio #order-flexus_cart #orderSummary,
body.fx-theme-studio #order-flexus_cart .fx-cart-summary,
body.fx-theme-studio #order-flexus_cart .fx-checkout-rail-aside {
  background: var(--color-paper-mist, #f8faff);
  border: 1px solid var(--color-ash-solid, #eceaf6);
  border-radius: 22px;
}

/* Domain search (product domain step) */
body.fx-theme-studio #order-flexus_cart .fx-notion-domain__field,
body.fx-theme-studio #order-flexus_cart .fx-domain-page__input {
  border-radius: 999px;
  border-color: var(--color-ash-solid, #eceaf6);
}
body.fx-theme-studio #order-flexus_cart .fx-notion-domain__field:focus-within,
body.fx-theme-studio #order-flexus_cart .fx-domain-page__input:focus {
  border-color: var(--color-midnight-brand, #03061a);
  box-shadow: 0 0 0 4px rgba(23, 21, 38, 0.08);
}
body.fx-theme-studio #order-flexus_cart .fx-notion-domain__tld,
body.fx-theme-studio #order-flexus_cart .fx-domain-more__summary {
  border-radius: 999px;
  border-color: var(--color-ash-solid, #eceaf6);
}
body.fx-theme-studio #order-flexus_cart .fx-notion-domain__tld.is-active,
body.fx-theme-studio #order-flexus_cart .fx-notion-domain__tld:hover {
  background: var(--color-midnight-brand, #03061a);
  border-color: var(--color-midnight-brand, #03061a);
  color: #ffffff;
}

/* Cart stack */
body.fx-theme-studio #order-flexus_cart .fx-cart-stack {
  border-color: var(--color-ash-solid, #eceaf6);
  border-radius: 22px;
  background: var(--color-pure-white, #ffffff);
}
body.fx-theme-studio #order-flexus_cart .fx-cart-stack__item {
  border-color: #f0eef8;
}
body.fx-theme-studio #order-flexus_cart .fx-cart-stack__item:hover {
  background: var(--color-paper-mist, #f8faff);
}
body.fx-theme-studio #order-flexus_cart .fx-cart-summary__total,
body.fx-theme-studio #order-flexus_cart .fx-summary-row--total b {
  color: var(--color-midnight-ink, #171526);
}
body.fx-theme-studio #order-flexus_cart .fx-cart-summary__checkout,
body.fx-theme-studio #order-flexus_cart .fx-checkout-submit .fx-btn-primary,
body.fx-theme-studio #order-flexus_cart #btnCompleteOrder,
body.fx-theme-studio #order-flexus_cart .btn-checkout {
  background: var(--color-midnight-brand, #03061a) !important;
  border-radius: 999px !important;
}

/* Checkout stepper + forms */
body.fx-theme-studio #order-flexus_cart .fx-checkout-stepper__item.is-active {
  color: var(--color-midnight-ink, #171526);
}
body.fx-theme-studio #order-flexus_cart .fx-checkout-stepper__item.is-active .fx-checkout-stepper__num,
body.fx-theme-studio #order-flexus_cart .fx-checkout-stepper__item.is-done .fx-checkout-stepper__num {
  background: var(--color-midnight-brand, #03061a);
  color: #ffffff;
  border-color: var(--color-midnight-brand, #03061a);
}
body.fx-theme-studio #order-flexus_cart .fx-checkout-stepper__item.is-done .fx-checkout-stepper__num {
  background: #00966e;
  border-color: #00966e;
}
body.fx-theme-studio #order-flexus_cart .fx-checkout-auth {
  background: var(--color-paper-mist, #f8faff);
  border: 1px solid var(--color-ash-solid, #eceaf6);
  border-radius: 18px;
}
body.fx-theme-studio #order-flexus_cart .fx-checkout-auth__badge {
  background: var(--color-sky-tint, #ffe9ef);
  color: var(--color-deep-sapphire, #d1114b);
  border-radius: 999px;
}
body.fx-theme-studio #order-flexus_cart .form-control,
body.fx-theme-studio #order-flexus_cart .custom-select,
body.fx-theme-studio #order-flexus_cart input[type="text"],
body.fx-theme-studio #order-flexus_cart input[type="email"],
body.fx-theme-studio #order-flexus_cart input[type="password"],
body.fx-theme-studio #order-flexus_cart input[type="tel"],
body.fx-theme-studio #order-flexus_cart select,
body.fx-theme-studio #order-flexus_cart textarea {
  border-radius: 14px;
  border-color: var(--color-ash-solid, #eceaf6);
  color: var(--color-midnight-ink, #171526);
}
body.fx-theme-studio #order-flexus_cart .form-control:focus,
body.fx-theme-studio #order-flexus_cart input:focus,
body.fx-theme-studio #order-flexus_cart select:focus,
body.fx-theme-studio #order-flexus_cart textarea:focus {
  border-color: var(--color-midnight-brand, #03061a);
  box-shadow: 0 0 0 3px rgba(23, 21, 38, 0.1);
}
body.fx-theme-studio #order-flexus_cart .glass-input-wrapper {
  border-radius: 999px;
  border-color: var(--color-ash-solid, #eceaf6);
  background: var(--color-pure-white, #ffffff);
}
body.fx-theme-studio #order-flexus_cart .glass-input-wrapper:focus-within {
  border-color: var(--color-midnight-brand, #03061a);
  box-shadow: 0 0 0 4px rgba(23, 21, 38, 0.08);
}

/* Quick row / stats / finale under cart */
body.fx-theme-studio #order-flexus_cart .fx-notion-quick__card {
  border-radius: 18px;
  border-color: var(--color-ash-solid, #eceaf6);
}
body.fx-theme-studio #order-flexus_cart .fx-notion-quick__card--dark {
  background: var(--color-midnight-brand, #03061a);
  border-color: var(--color-midnight-brand, #03061a);
  color: #ffffff;
}
body.fx-theme-studio #order-flexus_cart .fx-statstrip__value {
  color: var(--color-midnight-ink, #171526);
  font-weight: 700;
}
body.fx-theme-studio #order-flexus_cart .fx-statstrip__value em,
body.fx-theme-studio #order-flexus_cart .fx-highlight-pill {
  color: var(--color-notion-blue, #fa2f62);
}
body.fx-theme-studio #order-flexus_cart .fx-finale h2,
body.fx-theme-studio #order-flexus_cart .fx-notion-display {
  font-family: var(--font-inter);
  font-weight: 500;
  color: var(--color-midnight-ink, #171526);
}

/* Visual mock panels in cart heroes */
body.fx-theme-studio #order-flexus_cart .fx-notion-ui {
  background: var(--color-paper-mist, #f8faff);
  border: 1px solid var(--color-ash-solid, #eceaf6);
  border-radius: 18px;
}
body.fx-theme-studio #order-flexus_cart .fx-notion-ui__searchbar {
  background: var(--color-pure-white, #ffffff);
  border-bottom: 1px solid #f0eef8;
}

/* Cart extras (promo / tax) + empty state */
body.fx-theme-studio #order-flexus_cart .fx-cart-extras__card {
  background: var(--color-pure-white, #ffffff);
  border: 1px solid var(--color-ash-solid, #eceaf6);
  border-radius: 18px;
}
body.fx-theme-studio #order-flexus_cart .fx-cart-extras__title {
  color: var(--color-midnight-ink, #171526);
  font-weight: 600;
}
body.fx-theme-studio #order-flexus_cart .fx-cart-stack__empty h2 {
  font-family: var(--font-inter);
  font-weight: 500;
  color: var(--color-midnight-ink, #171526);
}

/* Checkout payment methods */
body.fx-theme-studio #order-flexus_cart .payment-methods,
body.fx-theme-studio #order-flexus_cart .gateway-container,
body.fx-theme-studio #order-flexus_cart .cc-input-container {
  border: 1px solid var(--color-ash-solid, #eceaf6);
  border-radius: 18px;
  background: var(--color-pure-white, #ffffff);
}
body.fx-theme-studio #order-flexus_cart .payment-methods:hover,
body.fx-theme-studio #order-flexus_cart .payment-methods.checked,
body.fx-theme-studio #order-flexus_cart .payment-methods.active {
  border-color: var(--color-midnight-brand, #03061a);
  box-shadow: 0 0 0 3px rgba(23, 21, 38, 0.08);
}


/* ============================================================
   24. ORDERFORM STUDIO — sto-* layouts (catalog → checkout)
   ============================================================ */
body.fx-theme-studio .sto-page {
  background: transparent;
  color: var(--color-midnight-ink, #171526);
}
body.fx-theme-studio .sto-hero {
  padding: clamp(36px, 6vh, 72px) 0 clamp(20px, 3vh, 36px);
}
body.fx-theme-studio .sto-hero--compact {
  padding-bottom: 12px;
}
body.fx-theme-studio .sto-hero__mock {
  position: absolute;
  left: 6%;
  right: 6%;
  bottom: 8%;
}
body.fx-theme-studio .sto-mock {
  background: var(--color-pure-white, #ffffff);
  border: 1px solid var(--color-ash-solid, #eceaf6);
  border-radius: 18px;
  box-shadow: 0 18px 40px -18px rgba(23, 21, 38, 0.28);
  overflow: hidden;
}
body.fx-theme-studio .sto-mock__bar {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 12px 14px;
  border-bottom: 1px solid #f0eef8;
  font-size: 13px;
  font-weight: 600;
  color: var(--color-midnight-ink, #171526);
}
body.fx-theme-studio .sto-mock__list {
  list-style: none;
  margin: 0;
  padding: 10px 14px 14px;
}
body.fx-theme-studio .sto-mock__list li {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  padding: 8px 0;
  font-size: 13px;
  color: #56546b;
  border-bottom: 1px solid #f6f5fb;
}
body.fx-theme-studio .sto-mock__list li:last-child { border-bottom: 0; }
body.fx-theme-studio .sto-mock__list li i { color: var(--color-lavender, #794dff); margin-top: 2px; }
body.fx-theme-studio .sto-mock__list li.is-ok i { color: #00966e; }

body.fx-theme-studio .sto-cats .st-quick__card.is-active {
  background: var(--color-midnight-brand, #03061a);
  color: #ffffff;
  border-color: var(--color-midnight-brand, #03061a);
}
body.fx-theme-studio .sto-currency {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 16px;
}
body.fx-theme-studio .sto-currency__chip {
  display: inline-flex;
  align-items: center;
  padding: 6px 14px;
  border-radius: 999px;
  border: 1px solid var(--color-ash-solid, #eceaf6);
  background: var(--color-paper-mist, #f8faff);
  color: var(--color-midnight-ink, #171526);
  font-size: 12px;
  font-weight: 700;
  text-decoration: none;
}
body.fx-theme-studio .sto-currency__chip.is-active,
body.fx-theme-studio .sto-currency__chip:hover {
  background: var(--color-midnight-brand, #03061a);
  border-color: var(--color-midnight-brand, #03061a);
  color: #ffffff;
}

body.fx-theme-studio .sto-plans { padding: clamp(28px, 5vh, 64px) 0; }
body.fx-theme-studio .sto-plans__grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 20px;
  margin-top: 28px;
}
body.fx-theme-studio .sto-plan {
  position: relative;
  background: var(--surface-card, var(--color-pure-white, #fff));
  border: 1px solid var(--color-ash-solid, var(--color-ash, #e5e3dc));
  border-radius: 16px;
  padding: 28px 28px 24px;
  display: flex;
  flex-direction: column;
  gap: 0;
  box-shadow: none;
  transition: border-color .15s ease, box-shadow .15s ease;
}
body.fx-theme-studio .sto-plan:hover,
body.fx-theme-studio .sto-plan.is-featured {
  border-color: var(--color-notion-blue, #0075de);
  box-shadow: 0 14px 36px -18px color-mix(in srgb, var(--color-notion-blue, #0075de) 45%, transparent);
  transform: none;
}
body.fx-theme-studio .sto-plan__head { display: flex; flex-direction: column; gap: 0; }
body.fx-theme-studio .sto-plan__title-row {
  display: block;
  margin-bottom: 14px;
}
body.fx-theme-studio .sto-plan__title-row h3 {
  margin: 0;
  font-family: inherit;
  font-weight: 700;
  font-size: clamp(22px, 2.2vw, 28px);
  letter-spacing: -0.02em;
  line-height: 1.2;
  color: var(--color-midnight-ink, #171526);
}
body.fx-theme-studio .sto-plan__flag {
  position: absolute;
  top: -11px;
  right: 20px;
  background: var(--color-notion-blue, #0075de);
  color: var(--color-pure-white, #ffffff);
  border-radius: 6px;
  font-size: 11px;
  font-weight: 700;
  padding: 4px 10px;
  text-transform: uppercase;
  letter-spacing: 0.02em;
}
body.fx-theme-studio .sto-plan__desc { color: var(--color-fog, #6b6980); margin: -6px 0 14px; min-height: 0; font-size: 14px; }
body.fx-theme-studio .sto-plan__qty { margin: 0 0 8px; font-size: 12px; color: var(--color-silver, var(--color-fog, #9b98ab)); }
body.fx-theme-studio .sto-plan__price {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 4px 6px;
  margin: 0 0 6px;
  font-family: inherit;
}
body.fx-theme-studio .sto-plan__amount {
  font-family: inherit;
  font-size: clamp(34px, 3.4vw, 42px);
  font-weight: 800;
  letter-spacing: -0.03em;
  line-height: 1;
  color: var(--color-midnight-ink, #171526);
}
body.fx-theme-studio .sto-plan__currency {
  font-family: inherit;
  font-weight: 800;
  font-size: clamp(34px, 3.4vw, 42px);
  letter-spacing: -0.03em;
  color: var(--color-midnight-ink, #171526);
}
body.fx-theme-studio .sto-plan__period {
  font-family: var(--font-geist-mono, ui-monospace, monospace);
  font-size: 15px;
  font-weight: 600;
  color: var(--color-fog, #6b6980);
}
body.fx-theme-studio .sto-plan__from,
body.fx-theme-studio .sto-plan__setup { font-family: inherit; color: var(--color-fog, #6b6980); font-size: 13px; width: 100%; }
body.fx-theme-studio .sto-plan__actions {
  display: grid;
  gap: 10px;
  margin: 12px 0 22px;
}
body.fx-theme-studio .sto-plan__cta,
body.fx-theme-studio .sto-plan__actions .st-btn--primary {
  justify-content: center;
  width: 100%;
  min-height: 48px;
  border-radius: 999px;
  background: var(--color-notion-blue, #0075de) !important;
  border-color: var(--color-notion-blue, #0075de) !important;
  color: var(--color-pure-white, #ffffff) !important;
  font-weight: 700;
  box-shadow: 0 10px 24px -12px color-mix(in srgb, var(--color-notion-blue, #0075de) 55%, transparent);
}
body.fx-theme-studio .sto-plan__actions .st-btn--ghost { display: none; }
body.fx-theme-studio .sto-plan__highlights,
body.fx-theme-studio .sto-plan__features {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
body.fx-theme-studio .sto-plan__highlights li,
body.fx-theme-studio .sto-plan__features li {
  display: flex;
  gap: 12px;
  align-items: flex-start;
  font-size: 14.5px;
  color: var(--color-midnight-ink, #171526);
}
body.fx-theme-studio .sto-plan__highlights li > i,
body.fx-theme-studio .sto-plan__features li > i {
  flex: 0 0 28px;
  width: 28px;
  height: 28px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid color-mix(in srgb, var(--color-notion-blue, #0075de) 18%, var(--color-ash-solid, #e5e3dc));
  border-radius: 8px;
  background: color-mix(in srgb, var(--color-notion-blue, #0075de) 8%, var(--surface-card, #fff));
  color: var(--color-notion-blue, #0075de);
  font-size: 12px;
  margin: 0;
}
body.fx-theme-studio .sto-plan__includes { margin-top: 16px; }
body.fx-theme-studio .sto-plan__includes-label {
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--color-silver, var(--color-fog, #9b98ab));
  margin: 0 0 10px;
}

body.fx-theme-studio .sto-empty {
  text-align: center;
  padding: 48px 20px;
  border: 1px dashed var(--color-ash-solid, #eceaf6);
  border-radius: 22px;
}
body.fx-theme-studio .sto-empty h2 {
  font-family: var(--font-inter);
  font-weight: 500;
  color: var(--color-midnight-ink, #171526);
}

/* Configure / domain / cart / checkout shells */
body.fx-theme-studio .sto-config-section,
body.fx-theme-studio .sto-domain-section,
body.fx-theme-studio .sto-cart-section,
body.fx-theme-studio .sto-checkout-section,
body.fx-theme-studio .sto-complete-section {
  padding: 8px 0 40px;
}

/* ---- Configure: kill Classic #order-standard_cart layout bleed ---- */
body.fx-theme-studio .sto-configure #order-standard_cart {
  margin: 0 !important;
  padding: 0 !important;
  font-size: inherit !important;
}
body.fx-theme-studio .sto-configure #order-standard_cart .cart-sidebar,
body.fx-theme-studio .sto-configure #order-standard_cart .cart-body,
body.fx-theme-studio .sto-configure #order-standard_cart .secondary-cart-body,
body.fx-theme-studio .sto-configure #order-standard_cart .secondary-cart-sidebar {
  float: none !important;
  width: auto !important;
  padding: 0 !important;
  margin: 0 !important;
}
body.fx-theme-studio .sto-configure .fx-confproduct-form {
  display: block;
  margin: 0;
  max-width: none;
}
body.fx-theme-studio .sto-configure .sto-config__card {
  display: grid !important;
  /* Same proportion as hero / view-cart: full flexus-container width */
  grid-template-columns: minmax(0, 1fr) minmax(280px, 340px);
  gap: 28px;
  align-items: start;
  max-width: none;
  width: 100%;
  margin: 0;
  background: var(--color-pure-white, #ffffff);
  border: 1px solid var(--color-ash-solid, #eceaf6);
  border-radius: 24px;
  padding: 22px;
  box-shadow: 0 18px 40px -22px rgba(23, 21, 38, 0.14);
  overflow: visible;
}
body.fx-theme-studio .sto-configure .sto-config__main {
  display: flex;
  flex-direction: column;
  gap: 0;
  min-width: 0;
  max-width: none;
  padding: 0;
  border: 0;
  float: none !important;
  width: auto !important;
}
body.fx-theme-studio .sto-configure .sto-config__rail,
body.fx-theme-studio .sto-configure #scrollingPanelContainer {
  display: flex !important;
  flex-direction: column;
  gap: 14px;
  min-width: 0;
  width: auto !important;
  max-width: none;
  float: none !important;
  position: static !important; /* never follow scroll */
  top: auto !important;
  align-self: start;
  background: transparent !important;
  min-height: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
}
body.fx-theme-studio .sto-configure #orderSummary,
body.fx-theme-studio .sto-configure #order-standard_cart .order-summary,
body.fx-theme-studio .sto-configure #order-standard_cart .sto-summary {
  margin: 0 !important;
  margin-top: 0 !important; /* kill Classic sticky JS */
  padding: 16px !important;
  background: var(--color-paper-mist, #f8faff) !important;
  border: 1px solid var(--color-ash-solid, #eceaf6) !important;
  border-bottom: 1px solid var(--color-ash-solid, #eceaf6) !important;
  border-radius: 18px !important;
  box-shadow: none !important;
  width: 100% !important;
  color: var(--color-midnight-ink, #171526) !important;
  position: static !important;
  top: auto !important;
  transform: none !important;
}
body.fx-theme-studio .sto-configure #order-standard_cart .summary-container,
body.fx-theme-studio .sto-configure #producttotal {
  margin: 0 0 4px !important;
  padding: 0 !important;
  min-height: 0 !important;
  background: transparent !important;
  border-radius: 0 !important;
  font-size: 14px !important;
  color: var(--color-midnight-ink, #171526) !important;
}
body.fx-theme-studio .sto-configure #orderSummaryLoader.loader,
body.fx-theme-studio .sto-configure #order-standard_cart .order-summary .loader {
  position: absolute !important;
  inset: 0 !important;
  top: 0 !important;
  height: auto !important;
  padding: 0 !important;
  display: none;
  align-items: center;
  justify-content: center;
  background: rgba(248, 250, 255, 0.86) !important;
  border-radius: inherit;
  color: var(--color-midnight-ink, #171526) !important;
  text-align: center;
  z-index: 2;
}
body.fx-theme-studio .sto-configure #orderSummaryLoader.loader:not([style*="display: none"]) {
  display: flex;
}

body.fx-theme-studio .sto-domain__card,
body.fx-theme-studio .sto-cart__card,
body.fx-theme-studio .sto-checkout__card,
body.fx-theme-studio .sto-complete__card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(280px, 340px);
  gap: 28px;
  align-items: start;
  background: var(--color-pure-white, #ffffff);
  border: 1px solid var(--color-ash-solid, #eceaf6);
  border-radius: 24px;
  padding: 22px;
  box-shadow: 0 18px 40px -22px rgba(23, 21, 38, 0.14);
}
@media (max-width: 960px) {
  body.fx-theme-studio .sto-configure .sto-config__card,
  body.fx-theme-studio .sto-domain__card,
  body.fx-theme-studio .sto-cart__card,
  body.fx-theme-studio .sto-checkout__card,
  body.fx-theme-studio .sto-complete__card {
    grid-template-columns: 1fr;
    max-width: none;
  }
  body.fx-theme-studio .sto-configure .sto-config__rail,
  body.fx-theme-studio .sto-configure #scrollingPanelContainer {
    position: static;
    width: 100% !important;
    max-width: none;
  }
}
body.fx-theme-studio .sto-config__title,
body.fx-theme-studio .sto-domain__title,
body.fx-theme-studio .sto-cart__title,
body.fx-theme-studio .sto-checkout__title,
body.fx-theme-studio .sto-complete__title {
  font-family: var(--font-inter);
  font-weight: 500;
  letter-spacing: -0.02em;
  color: var(--color-midnight-ink, #171526);
  margin: 4px 0 6px;
  font-size: 22px;
}
body.fx-theme-studio .sto-config__lead,
body.fx-theme-studio .sto-domain__lead,
body.fx-theme-studio .sto-cart__lead,
body.fx-theme-studio .sto-checkout__lead,
body.fx-theme-studio .sto-complete__lead {
  color: #56546b;
  margin: 0;
  max-width: none;
}
body.fx-theme-studio .sto-config__head,
body.fx-theme-studio .sto-domain__head,
body.fx-theme-studio .sto-cart__head,
body.fx-theme-studio .sto-checkout__head {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: flex-start;
  margin-bottom: 8px;
}
body.fx-theme-studio .sto-configure .sto-config__head {
  display: none; /* hero already carries the title */
}
body.fx-theme-studio .sto-icon-btn {
  width: 42px;
  height: 42px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--color-midnight-brand, #03061a);
  color: #ffffff;
  text-decoration: none;
  flex-shrink: 0;
}
body.fx-theme-studio .sto-icon-btn:hover { background: #2a2740; color: #ffffff; }

body.fx-theme-studio .sto-summary,
body.fx-theme-studio .sto-checklist,
body.fx-theme-studio .sto-avail {
  background: var(--color-paper-mist, #f8faff);
  border: 1px solid var(--color-ash-solid, #eceaf6);
  border-radius: 18px;
  padding: 16px;
  position: relative;
}
body.fx-theme-studio .sto-summary__bar,
body.fx-theme-studio .sto-avail__bar,
body.fx-theme-studio .sto-checklist__title,
body.fx-theme-studio .sto-summary__title {
  display: flex;
  align-items: center;
  gap: 8px;
  font-weight: 700;
  color: var(--color-midnight-ink, #171526);
  margin: 0 0 12px;
  font-size: 14px;
}
body.fx-theme-studio .sto-summary__cta {
  width: 100%;
  justify-content: center;
  margin-top: 14px;
}
body.fx-theme-studio .sto-summary__link {
  display: inline-flex;
  margin-top: 12px;
  color: var(--color-notion-blue, #fa2f62);
  font-weight: 600;
  text-decoration: none;
}
body.fx-theme-studio .sto-summary__link:hover { color: var(--color-deep-sapphire, #d1114b); }
body.fx-theme-studio .sto-checklist__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 8px;
  color: #56546b;
  font-size: 14px;
}
body.fx-theme-studio .sto-checklist__list .is-done { color: #00966e; }

body.fx-theme-studio .sto-block__title {
  font-family: var(--font-inter);
  font-weight: 500;
  color: var(--color-midnight-ink, #171526);
  margin: 22px 0 12px;
  font-size: 18px;
  display: flex;
  align-items: center;
  gap: 8px;
}
body.fx-theme-studio .sto-configure .fx-confproduct-block + .fx-confproduct-block {
  padding-top: 18px;
  margin-top: 4px;
  border-top: 1px solid #f0eef8;
}

/* Billing / options / server — Studio tokens (override Classic blue) */
body.fx-theme-studio .sto-configure .fx-billing-cycle__grid {
  grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
  gap: 10px;
}
body.fx-theme-studio .sto-configure .fx-billing-cycle__card {
  min-height: 0;
  padding: 14px 36px 14px 14px;
  border: 1px solid var(--color-ash-solid, #eceaf6);
  border-radius: 16px;
  background: var(--color-pure-white, #ffffff);
  box-shadow: none;
  transform: none;
}
body.fx-theme-studio .sto-configure .fx-billing-cycle__card:hover {
  border-color: var(--color-midnight-brand, #03061a);
  box-shadow: none;
  transform: none;
  background: var(--color-paper-mist, #f8faff);
}
body.fx-theme-studio .sto-configure .fx-billing-cycle__card.is-selected {
  border-color: var(--color-midnight-brand, #03061a);
  background: var(--color-pure-white, #ffffff);
  box-shadow: 0 0 0 3px rgba(23, 21, 38, 0.08);
}
body.fx-theme-studio .sto-configure .fx-billing-cycle__badge {
  background: var(--color-notion-blue, #fa2f62);
  color: #ffffff;
}
body.fx-theme-studio .sto-configure .fx-billing-cycle__check,
body.fx-theme-studio .sto-configure .fx-config-opt__check {
  background: var(--color-ash-solid, #eceaf6);
  color: transparent;
}
body.fx-theme-studio .sto-configure .fx-billing-cycle__card.is-selected .fx-billing-cycle__check,
body.fx-theme-studio .sto-configure .fx-config-opt__card.is-selected .fx-config-opt__check {
  background: var(--color-midnight-brand, #03061a);
  color: #97f675;
}
body.fx-theme-studio .sto-configure .fx-billing-cycle__orb {
  background: #f0eef8;
  color: var(--color-midnight-ink, #171526);
}
body.fx-theme-studio .sto-configure .fx-billing-cycle__card.is-selected .fx-billing-cycle__orb {
  background: var(--color-midnight-brand, #03061a);
  color: #ffffff;
}
body.fx-theme-studio .sto-configure .fx-config-opt__card,
body.fx-theme-studio .sto-configure .fx-os-card {
  border: 1px solid var(--color-ash-solid, #eceaf6);
  border-radius: 14px;
  background: var(--color-pure-white, #ffffff);
}
body.fx-theme-studio .sto-configure .fx-config-opt__card.is-selected,
body.fx-theme-studio .sto-configure .fx-os-card.is-selected {
  border-color: var(--color-midnight-brand, #03061a);
  box-shadow: 0 0 0 3px rgba(23, 21, 38, 0.08);
}

/* Server fields — fill the (already capped) left column */
body.fx-theme-studio .sto-configure .fx-server-panel__stack {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px 16px;
  width: 100%;
  max-width: none;
}
body.fx-theme-studio .sto-configure .fx-server-panel__stack > .fx-server-field {
  min-width: 0;
}
body.fx-theme-studio .sto-configure .fx-server-panel__ns {
  grid-column: 1 / -1;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px 16px;
  max-width: none;
  width: 100%;
}
body.fx-theme-studio .sto-configure .fx-server-field__control {
  min-height: 46px;
  padding: 0 14px;
  background: var(--color-pure-white, #ffffff);
  border: 1px solid var(--color-ash-solid, #eceaf6);
  border-radius: 12px !important;
  max-width: 100%;
  width: 100%;
  box-sizing: border-box;
}
body.fx-theme-studio .sto-configure .fx-server-field__control:focus-within {
  border-color: var(--color-midnight-brand, #03061a);
  background: var(--color-pure-white, #ffffff);
  box-shadow: 0 0 0 3px rgba(23, 21, 38, 0.1);
}
body.fx-theme-studio .sto-configure .fx-server-field__control > i {
  color: var(--color-lavender, #794dff);
}
body.fx-theme-studio .sto-configure .fx-server-field__control .form-control,
body.fx-theme-studio .sto-configure .fx-server-field__control input {
  border-radius: 0 !important;
  max-width: 100%;
}
body.fx-theme-studio .sto-configure .fx-server-field__label {
  color: var(--color-midnight-ink, #171526);
  font-weight: 600;
  font-size: 13px;
}
body.fx-theme-studio .sto-configure .fx-server-panel .fx-pw-meter {
  margin-top: 8px;
  max-width: 100%;
}
body.fx-theme-studio .sto-configure .fx-server-panel .fx-pw-hint {
  margin: 6px 0 0;
  font-size: 12px;
  color: #56546b;
}
@media (max-width: 640px) {
  body.fx-theme-studio .sto-configure .fx-server-panel__stack,
  body.fx-theme-studio .sto-configure .fx-server-panel__ns {
    grid-template-columns: 1fr;
  }
}
body.fx-theme-studio .sto-configure .fx-confproduct-help-contact {
  margin-top: 20px;
  color: #56546b;
  font-size: 14px;
}
body.fx-theme-studio .sto-configure .fx-confproduct-help-contact a {
  color: var(--color-notion-blue, #fa2f62);
  font-weight: 600;
}

body.fx-theme-studio .sto-configure .fx-confproduct-grid,
body.fx-theme-studio .sto-configure .product-configurable-options,
body.fx-theme-studio .sto-configure .fx-confproduct-field,
body.fx-theme-studio .sto-configure .fx-confproduct-field--full,
body.fx-theme-studio .sto-configure .fx-billing-cycle,
body.fx-theme-studio .sto-configure .fx-server-panel,
body.fx-theme-studio .sto-configure .fx-confproduct-block {
  max-width: none;
  width: 100%;
}
body.fx-theme-studio .sto-configure .fx-confproduct-select,
body.fx-theme-studio .sto-configure .fx-confproduct-field .form-control,
body.fx-theme-studio .sto-configure .fx-confproduct-field input[type="text"],
body.fx-theme-studio .sto-configure .fx-confproduct-field input[type="password"],
body.fx-theme-studio .sto-configure .fx-confproduct-field input[type="number"],
body.fx-theme-studio .sto-configure .fx-confproduct-field textarea,
body.fx-theme-studio .sto-configure .fx-confproduct-field select {
  border-radius: 12px !important;
  max-width: 100%;
  width: 100%;
}
body.fx-theme-studio .sto-configure .fx-billing-cycle__grid {
  width: 100%;
  grid-template-columns: repeat(auto-fill, minmax(148px, 1fr));
}
body.fx-theme-studio .sto-configure .fx-os-picker,
body.fx-theme-studio .sto-configure .fx-os-picker__grid {
  width: 100%;
  max-width: none;
}

/* Summary totals inside Studio rail */
body.fx-theme-studio .sto-configure #producttotal .clearfix,
body.fx-theme-studio .sto-configure #producttotal .fx-summary-row {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: baseline;
  padding: 6px 0;
  border-bottom: 1px solid #f0eef8;
  float: none !important;
}
body.fx-theme-studio .sto-configure #producttotal .pull-left,
body.fx-theme-studio .sto-configure #producttotal .pull-right,
body.fx-theme-studio .sto-configure #producttotal .float-left,
body.fx-theme-studio .sto-configure #producttotal .float-right {
  float: none !important;
}
body.fx-theme-studio .sto-configure #producttotal .total-due-today {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 2px;
  padding-top: 10px;
  border-bottom: 0;
}
body.fx-theme-studio .sto-configure #producttotal .total-due-today .amt {
  font-size: 28px;
  font-weight: 700;
  letter-spacing: -0.03em;
  color: var(--color-midnight-ink, #171526);
}

/* OS picker — Studio ink/magenta instead of Classic blue */
body.fx-theme-studio .sto-configure .fx-os-picker__cats {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
body.fx-theme-studio .sto-configure .fx-os-picker__cat {
  border: 1px solid var(--color-ash-solid, #eceaf6);
  border-radius: 999px;
  background: var(--color-paper-mist, #f8faff);
  color: var(--color-midnight-ink, #171526);
}
body.fx-theme-studio .sto-configure .fx-os-picker__cat:hover {
  border-color: var(--color-midnight-brand, #03061a);
}
body.fx-theme-studio .sto-configure .fx-os-picker__cat.is-active {
  background: var(--color-notion-blue, #fa2f62);
  border-color: var(--color-notion-blue, #fa2f62);
  color: #ffffff;
}
body.fx-theme-studio .sto-configure .fx-os-picker__cat.is-active em {
  color: #ffffff;
}
body.fx-theme-studio .sto-configure .fx-os-picker__grid {
  grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
  gap: 10px;
}

body.fx-theme-studio .sto-modes {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 16px;
}
body.fx-theme-studio .sto-modes__item {
  border: 1px solid var(--color-ash-solid, #eceaf6);
  background: var(--color-paper-mist, #f8faff);
  border-radius: 999px;
  padding: 8px 14px;
  font-weight: 600;
  cursor: pointer;
}
body.fx-theme-studio .sto-modes__item:has(input:checked),
body.fx-theme-studio .sto-modes__item.is-active {
  background: var(--color-midnight-brand, #03061a);
  border-color: var(--color-midnight-brand, #03061a);
  color: #ffffff;
}
body.fx-theme-studio .sto-search__row {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: stretch;
}
body.fx-theme-studio .sto-search__field {
  flex: 1;
  min-width: 180px;
  display: flex;
  align-items: center;
  gap: 10px;
  border: 1px solid var(--color-ash-solid, #eceaf6);
  border-radius: 999px;
  padding: 10px 16px;
  background: var(--color-pure-white, #ffffff);
}
body.fx-theme-studio .sto-search__field:focus-within {
  border-color: var(--color-midnight-brand, #03061a);
  box-shadow: 0 0 0 4px rgba(23, 21, 38, 0.08);
}
body.fx-theme-studio .sto-search__field input,
body.fx-theme-studio .sto-search__field select {
  border: 0;
  outline: 0;
  width: 100%;
  background: transparent;
  color: var(--color-midnight-ink, #171526);
}
body.fx-theme-studio .sto-perks {
  list-style: none;
  margin: 18px 0 0;
  padding: 0;
  display: grid;
  gap: 8px;
  color: #56546b;
  font-size: 14px;
}
body.fx-theme-studio .sto-domain__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  margin-top: 16px;
}

/* ============================================================
   25. STUDIO CART — sto-stack / summary (no Classic fx-cart bleed)
   ============================================================ */
body.fx-theme-studio .sto-cart .sto-cart__card {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(280px, 340px);
  gap: 28px;
  align-items: start;
  max-width: none;
  width: 100%;
  margin: 0;
  background: var(--color-pure-white, #ffffff);
  border: 1px solid var(--color-ash-solid, #eceaf6);
  border-radius: 24px;
  padding: 22px;
  box-shadow: 0 18px 40px -22px rgba(23, 21, 38, 0.14);
}
body.fx-theme-studio .sto-cart .sto-cart__main {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 14px;
}
body.fx-theme-studio .sto-cart .sto-cart__toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 4px;
}
body.fx-theme-studio .sto-cart .sto-cart__headmeta {
  display: flex;
  align-items: center;
  gap: 10px;
}
body.fx-theme-studio .sto-cart .sto-cart__count {
  min-width: 32px;
  height: 32px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  background: var(--color-notion-blue, #fa2f62);
  color: #ffffff;
  font-size: 13px;
  font-weight: 700;
}
body.fx-theme-studio .sto-cart .sto-cart__rail,
body.fx-theme-studio .sto-cart .sto-cart__aside,
body.fx-theme-studio .sto-cart #scrollingPanelContainer {
  display: flex;
  flex-direction: column;
  gap: 14px;
  min-width: 0;
  float: none !important;
  position: static !important;
  width: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
}
body.fx-theme-studio .sto-cart #orderSummary,
body.fx-theme-studio .sto-cart .sto-summary.order-summary {
  margin: 0 !important;
  margin-top: 0 !important;
  padding: 16px !important;
  background: var(--color-paper-mist, #f8faff) !important;
  border: 1px solid var(--color-ash-solid, #eceaf6) !important;
  border-radius: 18px !important;
  box-shadow: none !important;
  width: 100% !important;
  color: var(--color-midnight-ink, #171526) !important;
  position: static !important;
}
body.fx-theme-studio .sto-cart #orderSummary .summary-container {
  margin: 0 !important;
  padding: 0 !important;
  min-height: 0 !important;
  background: transparent !important;
}

/* Stack items */
body.fx-theme-studio .sto-cart .sto-stack {
  display: flex;
  flex-direction: column;
  border: 1px solid var(--color-ash-solid, #eceaf6);
  border-radius: 18px;
  background: var(--color-pure-white, #ffffff);
  overflow: hidden;
}
body.fx-theme-studio .sto-cart .sto-stack__item {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  gap: 12px;
  align-items: center;
  padding: 14px 16px;
  border-bottom: 1px solid #f0eef8;
  background: transparent;
}
body.fx-theme-studio .sto-cart .sto-stack__item:last-child { border-bottom: 0; }
body.fx-theme-studio .sto-cart .sto-stack__item:hover { background: var(--color-paper-mist, #f8faff); }
body.fx-theme-studio .sto-cart .sto-stack__item--addon {
  border-bottom-style: dashed;
  background: #faf9ff;
}
body.fx-theme-studio .sto-cart .sto-stack__info {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
}
body.fx-theme-studio .sto-cart .sto-stack__title {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 2px;
}
body.fx-theme-studio .sto-cart .sto-stack__kicker {
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--color-notion-blue, #fa2f62);
}
body.fx-theme-studio .sto-cart .sto-stack__item--domain .sto-stack__kicker { color: #b45309; }
body.fx-theme-studio .sto-cart .sto-stack__item--addon .sto-stack__kicker { color: var(--color-lavender, #794dff); }
body.fx-theme-studio .sto-cart .sto-stack__name {
  font-family: var(--font-inter);
  font-weight: 500;
  font-size: 16px;
  color: var(--color-midnight-ink, #171526);
  line-height: 1.3;
  word-break: break-word;
}
body.fx-theme-studio .sto-cart .sto-stack__name--mono {
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 14px;
}
body.fx-theme-studio .sto-cart .sto-stack__domain {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  color: #56546b;
}
body.fx-theme-studio .sto-cart .sto-stack__opts {
  list-style: none;
  margin: 4px 0 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 6px 12px;
  font-size: 12px;
  color: #56546b;
}
body.fx-theme-studio .sto-cart .sto-stack__opts li {
  display: inline-flex;
  gap: 4px;
  align-items: baseline;
}
body.fx-theme-studio .sto-cart .sto-stack__links a {
  font-size: 13px;
  font-weight: 600;
  color: var(--color-notion-blue, #fa2f62);
  text-decoration: none;
}
body.fx-theme-studio .sto-cart .sto-stack__links a:hover { color: var(--color-deep-sapphire, #d1114b); }
body.fx-theme-studio .sto-cart .sto-stack__qty {
  display: flex;
  flex-direction: column;
  gap: 6px;
  align-items: center;
}
body.fx-theme-studio .sto-cart .sto-stack__qty .sto-input {
  width: 72px;
  text-align: center;
  border: 1px solid var(--color-ash-solid, #eceaf6);
  border-radius: 12px;
  padding: 6px 8px;
  color: var(--color-midnight-ink, #171526);
}
body.fx-theme-studio .sto-cart .sto-stack__qty-btn {
  border: 0;
  background: transparent;
  color: var(--color-notion-blue, #fa2f62);
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
  padding: 0;
}
body.fx-theme-studio .sto-cart .sto-stack__price {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 2px;
  text-align: right;
  min-width: 88px;
  font-family: var(--font-geist-mono);
}
body.fx-theme-studio .sto-cart .sto-stack__price b {
  font-family: var(--font-geist-mono);
  font-size: 15px;
  font-weight: var(--font-weight-mono, 700);
  color: var(--color-midnight-ink, #171526);
}
body.fx-theme-studio .sto-cart .sto-stack__price span,
body.fx-theme-studio .sto-cart .sto-stack__price small {
  font-family: var(--font-geist-mono);
  font-size: 12px;
  color: #56546b;
}
body.fx-theme-studio .sto-cart .sto-stack__remove {
  width: 32px;
  height: 32px;
  border: 0;
  border-radius: 999px;
  background: var(--color-paper-mist, #f8faff);
  color: #56546b;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
body.fx-theme-studio .sto-cart .sto-stack__remove:hover {
  background: var(--color-sky-tint, #ffe9ef);
  color: var(--color-deep-sapphire, #d1114b);
}
body.fx-theme-studio .sto-cart .sto-stack__empty {
  text-align: center;
  padding: 48px 24px;
}
body.fx-theme-studio .sto-cart .sto-stack__empty h2 {
  font-family: var(--font-inter);
  font-weight: 500;
  color: var(--color-midnight-ink, #171526);
}
body.fx-theme-studio .sto-cart .sto-stack__empty-orbs {
  display: inline-flex;
  gap: 8px;
  margin-bottom: 16px;
}
body.fx-theme-studio .sto-cart .sto-stack__empty-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: center;
  margin-top: 18px;
}
body.fx-theme-studio .sto-cart .sto-cart__tools {
  margin-top: 10px;
}
body.fx-theme-studio .sto-cart .sto-cart__clear {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  border: 0;
  background: transparent;
  color: #56546b;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  padding: 0;
}
body.fx-theme-studio .sto-cart .sto-cart__clear:hover { color: var(--color-deep-sapphire, #d1114b); }

/* Summary rows */
body.fx-theme-studio .sto-cart .sto-summary__row {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  padding: 8px 0;
  border-bottom: 1px solid #f0eef8;
  font-size: 14px;
  color: #56546b;
}
body.fx-theme-studio .sto-cart .sto-summary__row--recurring {
  align-items: flex-start;
}
body.fx-theme-studio .sto-cart .sto-summary__due {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 2px;
  padding-top: 12px;
}
body.fx-theme-studio .sto-cart .sto-summary__due-label {
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: #56546b;
}
body.fx-theme-studio .sto-cart .sto-summary__due-amt {
  font-size: 28px;
  font-weight: 700;
  letter-spacing: -0.03em;
  color: var(--color-midnight-ink, #171526);
}
body.fx-theme-studio .sto-cart .sto-summary__trust {
  list-style: none;
  margin: 14px 0 0;
  padding: 0;
  display: grid;
  gap: 6px;
  font-size: 12px;
  color: #56546b;
}
body.fx-theme-studio .sto-cart .sto-summary__trust li {
  display: flex;
  gap: 8px;
  align-items: flex-start;
}
body.fx-theme-studio .sto-cart .sto-summary__trust i { color: #00966e; margin-top: 2px; }
body.fx-theme-studio .sto-cart .sto-input {
  border: 1px solid var(--color-ash-solid, #eceaf6);
  border-radius: 12px;
  padding: 10px 12px;
  color: var(--color-midnight-ink, #171526);
  background: var(--color-pure-white, #ffffff);
  width: 100%;
}
body.fx-theme-studio .sto-cart .sto-input:focus {
  outline: 0;
  border-color: var(--color-midnight-brand, #03061a);
  box-shadow: 0 0 0 3px rgba(23, 21, 38, 0.1);
}
body.fx-theme-studio .sto-cart .sto-extras__promo-form,
body.fx-theme-studio .sto-cart .sto-extras__tax-form {
  display: grid;
  gap: 10px;
}
body.fx-theme-studio .sto-cart .sto-extras__promo-form {
  grid-template-columns: 1fr auto;
}
body.fx-theme-studio .sto-cart .sto-extras__tax-fields {
  display: grid;
  gap: 10px;
}
body.fx-theme-studio .sto-cart .sto-extras__tax-fields label {
  display: grid;
  gap: 6px;
  font-size: 12px;
  font-weight: 600;
  color: var(--color-midnight-ink, #171526);
}
body.fx-theme-studio .sto-cart .sto-extras__promo-remove {
  border: 0;
  background: transparent;
  color: var(--color-deep-sapphire, #d1114b);
  font-weight: 600;
  font-size: 13px;
  cursor: pointer;
  padding: 0;
}
@media (max-width: 960px) {
  body.fx-theme-studio .sto-cart .sto-cart__card {
    grid-template-columns: 1fr;
  }
  body.fx-theme-studio .sto-cart .sto-stack__item {
    grid-template-columns: minmax(0, 1fr) auto;
  }
}

/* ============================================================
   STUDIO CART — CONFIGURE DOMAINS (confdomains)
   ============================================================ */
body.fx-theme-studio .sto-confdomains__card {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(280px, 340px);
  gap: 28px;
  align-items: start;
  max-width: none;
  width: 100%;
  margin: 0;
  background: var(--color-pure-white, #ffffff);
  border: 1px solid var(--color-ash-solid, #eceaf6);
  border-radius: 24px;
  padding: 22px;
  box-shadow: 0 18px 40px -22px rgba(23, 21, 38, 0.14);
}
body.fx-theme-studio .sto-confdomains__main {
  display: flex;
  flex-direction: column;
  gap: 18px;
  min-width: 0;
}
body.fx-theme-studio .sto-confdomains__rail {
  display: flex;
  flex-direction: column;
  gap: 14px;
  min-width: 0;
}
body.fx-theme-studio .sto-confdomains__block {
  padding: 18px 0;
  border-bottom: 1px solid var(--color-ash-solid, #eceaf6);
}
body.fx-theme-studio .sto-confdomains__block:first-of-type {
  padding-top: 0;
}
body.fx-theme-studio .sto-confdomains__block:last-of-type {
  border-bottom: 0;
  padding-bottom: 0;
}
body.fx-theme-studio .sto-confdomains__domain {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  grid-template-areas:
    "orb copy"
    "meta meta";
  gap: 12px 14px;
  align-items: center;
  margin-bottom: 16px;
}
body.fx-theme-studio .sto-confdomains__orb {
  grid-area: orb;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 46px;
  height: 46px;
  border-radius: 14px;
  background: var(--color-paper-mist, #f8faff);
  border: 1px solid var(--color-ash-solid, #eceaf6);
}
body.fx-theme-studio .sto-confdomains__domain-copy {
  grid-area: copy;
  min-width: 0;
}
body.fx-theme-studio .sto-confdomains__domain-meta {
  grid-area: meta;
  display: flex;
  flex-wrap: wrap;
  gap: 10px 16px;
  align-items: center;
  font-size: 13px;
  color: #56546b;
}
body.fx-theme-studio .sto-confdomains__has-hosting {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: #00966e;
  font-weight: 600;
}
body.fx-theme-studio .sto-confdomains__no-hosting {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: var(--color-deep-sapphire, #d1114b);
  font-weight: 600;
  text-decoration: none;
}
body.fx-theme-studio .sto-confdomains__no-hosting:hover {
  text-decoration: underline;
}
body.fx-theme-studio .sto-confdomains__label,
body.fx-theme-studio .sto-confdomains__field-label,
body.fx-theme-studio .sto-confdomains__ns-field > span {
  display: block;
  margin-bottom: 8px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #56546b;
}
body.fx-theme-studio .sto-confdomains__help,
body.fx-theme-studio .sto-confdomains__ns-lead {
  margin: 8px 0 0;
  font-size: 13px;
  line-height: 1.5;
  color: #56546b;
}
body.fx-theme-studio .sto-confdomains__epp {
  margin-bottom: 16px;
}
body.fx-theme-studio .sto-confdomains__addons {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 12px;
  margin-bottom: 16px;
}
body.fx-theme-studio .sto-confdomains__addon-cell {
  min-width: 0;
}
body.fx-theme-studio .sto-confdomains .panel-addon {
  height: 100%;
  margin: 0;
  border: 1px solid var(--color-ash-solid, #eceaf6);
  border-radius: 16px;
  background: var(--color-pure-white, #fff);
  box-shadow: none;
  cursor: pointer;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
body.fx-theme-studio .sto-confdomains .panel-addon:hover {
  border-color: rgba(121, 77, 255, 0.35);
  box-shadow: 0 10px 24px -18px rgba(23, 21, 38, 0.25);
}
body.fx-theme-studio .sto-confdomains .panel-addon.panel-addon-selected {
  border-color: var(--color-lavender, #794dff);
  box-shadow: 0 0 0 1px rgba(121, 77, 255, 0.18);
}
body.fx-theme-studio .sto-confdomains .panel-addon .panel-body {
  padding: 14px 14px 8px;
}
body.fx-theme-studio .sto-confdomains .panel-addon .panel-body label {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  margin: 0;
  font-size: 14px;
  font-weight: 700;
  color: var(--color-midnight-ink, #171526);
  cursor: pointer;
}
body.fx-theme-studio .sto-confdomains .panel-addon .panel-body p {
  margin: 8px 0 0;
  font-size: 13px;
  line-height: 1.45;
  color: #56546b;
}
body.fx-theme-studio .sto-confdomains .panel-addon .panel-price {
  padding: 0 14px 8px;
  font-size: 13px;
  font-weight: 700;
  color: var(--color-deep-sapphire, #d1114b);
}
body.fx-theme-studio .sto-confdomains .panel-addon .panel-add {
  padding: 10px 14px 14px;
  font-size: 12px;
  font-weight: 700;
  color: #56546b;
}
body.fx-theme-studio .sto-confdomains .panel-addon.panel-addon-selected .panel-add {
  color: var(--color-lavender, #794dff);
}
body.fx-theme-studio .sto-confdomains__fields {
  display: grid;
  gap: 12px;
}
body.fx-theme-studio .sto-confdomains__field-row {
  display: grid;
  grid-template-columns: minmax(140px, 220px) minmax(0, 1fr);
  gap: 12px;
  align-items: start;
}
body.fx-theme-studio .sto-confdomains__field-input .field,
body.fx-theme-studio .sto-confdomains__field-input select,
body.fx-theme-studio .sto-confdomains__field-input input {
  width: 100%;
}
body.fx-theme-studio .sto-confdomains__ns {
  margin-top: 8px;
  padding-top: 18px;
  border-top: 1px solid var(--color-ash-solid, #eceaf6);
}
body.fx-theme-studio .sto-confdomains__ns-title {
  margin: 0 0 6px;
  font-family: var(--font-inter);
  font-size: 18px;
  font-weight: 600;
  color: var(--color-midnight-ink, #171526);
}
body.fx-theme-studio .sto-confdomains__ns-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  margin-top: 14px;
}
body.fx-theme-studio .sto-confdomains__actions {
  margin-top: 18px;
}
body.fx-theme-studio .sto-confdomains__checklist {
  border: 1px solid var(--color-ash-solid, #eceaf6);
  border-radius: 18px;
  overflow: hidden;
  background: var(--color-paper-mist, #f8faff);
}
body.fx-theme-studio .sto-confdomains__checklist-bar {
  padding: 12px 14px;
  font-size: 13px;
  font-weight: 700;
  color: var(--color-midnight-ink, #171526);
  border-bottom: 1px solid var(--color-ash-solid, #eceaf6);
}
body.fx-theme-studio .sto-confdomains__checklist-list {
  margin: 0;
  padding: 12px 14px 14px;
  list-style: none;
  display: grid;
  gap: 10px;
}
body.fx-theme-studio .sto-confdomains__checklist-list li {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  color: #56546b;
}
body.fx-theme-studio .sto-confdomains__tip {
  padding: 14px 16px;
  border: 1px solid var(--color-ash-solid, #eceaf6);
  border-radius: 16px;
  background: var(--color-pure-white, #fff);
}
body.fx-theme-studio .sto-confdomains__tip-title {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0 0 8px;
  font-size: 14px;
  font-weight: 700;
  color: var(--color-midnight-ink, #171526);
}
body.fx-theme-studio .sto-confdomains__tip-text {
  margin: 0;
  font-size: 13px;
  line-height: 1.5;
  color: #56546b;
}
body.fx-theme-studio .sto-confdomains__tip-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-top: 10px;
  font-size: 13px;
  font-weight: 700;
  color: var(--color-deep-sapphire, #d1114b);
  text-decoration: none;
}
body.fx-theme-studio .sto-confdomains__tip-link:hover {
  text-decoration: underline;
}
@media (max-width: 960px) {
  body.fx-theme-studio .sto-confdomains__card {
    grid-template-columns: 1fr;
  }
  body.fx-theme-studio .sto-confdomains__domain {
    grid-template-columns: auto minmax(0, 1fr);
  }
  body.fx-theme-studio .sto-confdomains__ns-grid,
  body.fx-theme-studio .sto-confdomains__field-row {
    grid-template-columns: 1fr;
  }
}

/* ============================================================
   STUDIO CART — ORDER COMPLETE
   ============================================================ */
body.fx-theme-studio .sto-complete__main {
  display: flex;
  flex-direction: column;
  gap: 16px;
  min-width: 0;
}
body.fx-theme-studio .sto-complete__toolbar {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
}
body.fx-theme-studio .sto-complete__lead {
  margin: 0;
  font-size: 14px;
  color: #56546b;
  max-width: 48ch;
  line-height: 1.5;
}
body.fx-theme-studio .sto-complete__orderid {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 10px 14px;
  padding: 16px 18px;
  border-radius: 16px;
  border: 1px solid var(--color-ash-solid, #eceaf6);
  background: var(--color-paper-mist, #f8faff);
}
body.fx-theme-studio .sto-complete__orderid span {
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #56546b;
}
body.fx-theme-studio .sto-complete__orderid b {
  font-family: ui-monospace, "SF Mono", Menlo, monospace;
  font-size: clamp(22px, 2.4vw, 30px);
  font-weight: 500;
  letter-spacing: -0.03em;
  color: var(--color-midnight-ink, #171526);
}
body.fx-theme-studio .sto-complete__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 4px;
}
body.fx-theme-studio .sto-complete__addon {
  padding: 12px 0;
}
body.fx-theme-studio .sto-complete__rail {
  display: flex;
  flex-direction: column;
  gap: 14px;
  min-width: 0;
}
body.fx-theme-studio .sto-complete__status {
  background: var(--color-midnight-brand, #03061a);
  color: #ffffff;
  border-radius: 18px;
  padding: 18px;
}
body.fx-theme-studio .sto-complete__status .st-kicker {
  color: #97f675;
  margin: 0 0 14px;
}
body.fx-theme-studio .sto-complete__steps {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 12px;
}
body.fx-theme-studio .sto-complete__steps li {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 14px;
  font-weight: 500;
  color: rgba(255, 255, 255, 0.55);
}
body.fx-theme-studio .sto-complete__steps li i {
  width: 18px;
  text-align: center;
  font-size: 14px;
}
body.fx-theme-studio .sto-complete__steps li.is-done {
  color: #ffffff;
}
body.fx-theme-studio .sto-complete__steps li.is-done i { color: #97f675; }
body.fx-theme-studio .sto-complete__steps li.is-active {
  color: rgba(255, 255, 255, 0.9);
}
body.fx-theme-studio .sto-complete__steps li.is-pending i { color: #f5a623; }
body.fx-theme-studio .sto-complete__note {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin: 0 0 12px;
  font-size: 14px;
  color: var(--color-midnight-ink, #171526);
}
body.fx-theme-studio .sto-complete .sto-status {
  display: inline-flex;
  align-items: center;
  height: 24px;
  padding: 0 10px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 700;
  border: 1px solid var(--color-ash-solid, #eceaf6);
  background: var(--color-paper-mist, #f8faff);
  color: #56546b;
}
body.fx-theme-studio .sto-complete .sto-status--paid {
  color: #00966e;
  background: #edfbf5;
  border-color: #c8f0df;
}
body.fx-theme-studio .sto-complete .sto-status--unpaid {
  color: #b45309;
  background: #fff7ed;
  border-color: #fed7aa;
}
body.fx-theme-studio .sto-complete .fx-alert {
  display: flex;
  gap: 12px;
  align-items: flex-start;
  padding: 14px 16px;
  border-radius: 16px;
  border: 1px solid var(--color-ash-solid, #eceaf6);
  background: var(--color-paper-mist, #f8faff);
  font-size: 13px;
  color: var(--color-midnight-ink, #171526);
  line-height: 1.45;
}
body.fx-theme-studio .sto-complete .fx-alert a {
  color: var(--color-notion-blue, #fa2f62);
  font-weight: 600;
  text-decoration: none;
}
body.fx-theme-studio .sto-complete .fx-alert a:hover { text-decoration: underline; }
body.fx-theme-studio .sto-complete .fx-alert__icon { flex-shrink: 0; margin-top: 1px; }
body.fx-theme-studio .sto-complete .fx-alert--success {
  background: #edfbf5;
  border-color: #c8f0df;
  color: #00744f;
}
body.fx-theme-studio .sto-complete .fx-alert--warning {
  background: #fff7ed;
  border-color: #fed7aa;
  color: #b45309;
}
body.fx-theme-studio .sto-complete .fx-alert--danger {
  background: #fff1f4;
  border-color: #fecdd3;
  color: #c81e4a;
}
body.fx-theme-studio .sto-complete .fx-alert--info {
  background: #eef6ff;
  border-color: #d3e7ff;
  color: #1d4f91;
}
body.fx-theme-studio .sto-complete-reco {
  padding: 0 0 56px;
}
body.fx-theme-studio .sto-complete-reco__card {
  background: var(--color-pure-white, #ffffff);
  border: 1px solid var(--color-ash-solid, #eceaf6);
  border-radius: 24px;
  padding: 22px;
  box-shadow: 0 18px 40px -22px rgba(23, 21, 38, 0.14);
}
body.fx-theme-studio .sto-complete-reco .fx-reco__head h4 {
  margin: 0 0 4px;
  font-family: var(--font-inter);
  font-weight: 500;
  font-size: 20px;
  color: var(--color-midnight-ink, #171526);
}
body.fx-theme-studio .sto-complete-reco .fx-reco__head small {
  color: #56546b;
  font-size: 13px;
}
body.fx-theme-studio .sto-complete-reco .fx-reco-card {
  border: 1px solid var(--color-ash-solid, #eceaf6);
  border-radius: 16px;
  background: var(--color-pure-white, #ffffff);
}
body.fx-theme-studio .sto-complete-reco .fx-reco-card__add {
  background: var(--color-midnight-brand, #03061a) !important;
  border-color: var(--color-midnight-brand, #03061a) !important;
  color: #ffffff !important;
  border-radius: 999px;
}

body.fx-theme-studio .sto-extras { display: grid; gap: 14px; margin-top: 0; }
body.fx-theme-studio .sto-extras__card {
  background: var(--color-pure-white, #ffffff);
  border: 1px solid var(--color-ash-solid, #eceaf6);
  border-radius: 18px;
  padding: 16px;
}
body.fx-theme-studio .sto-extras__title {
  margin: 0 0 10px;
  font-weight: 700;
  color: var(--color-midnight-ink, #171526);
}

body.fx-theme-studio .sto-auth {
  background: var(--color-paper-mist, #f8faff);
  border: 1px solid var(--color-ash-solid, #eceaf6);
  border-radius: 18px;
  padding: 16px 18px;
  margin-bottom: 18px;
}
body.fx-theme-studio .sto-stepper {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin-bottom: 18px;
}
body.fx-theme-studio .sto-page .fx-checkout-stepper__item.is-active .fx-checkout-stepper__num,
body.fx-theme-studio .sto-page .fx-checkout-stepper__item.is-done .fx-checkout-stepper__num {
  background: var(--color-midnight-brand, #03061a);
  border-color: var(--color-midnight-brand, #03061a);
  color: #ffffff;
}
body.fx-theme-studio .sto-page .form-control,
body.fx-theme-studio .sto-page .custom-select,
body.fx-theme-studio .sto-page input[type="text"],
body.fx-theme-studio .sto-page input[type="email"],
body.fx-theme-studio .sto-page input[type="password"],
body.fx-theme-studio .sto-page input[type="tel"],
body.fx-theme-studio .sto-page select,
body.fx-theme-studio .sto-page textarea {
  border-radius: 14px;
  border-color: var(--color-ash-solid, #eceaf6);
  color: var(--color-midnight-ink, #171526);
}
body.fx-theme-studio .sto-page .form-control:focus,
body.fx-theme-studio .sto-page input:focus,
body.fx-theme-studio .sto-page select:focus,
body.fx-theme-studio .sto-page textarea:focus {
  border-color: var(--color-midnight-brand, #03061a);
  box-shadow: 0 0 0 3px rgba(23, 21, 38, 0.1);
}
body.fx-theme-studio .sto-page .payment-methods,
body.fx-theme-studio .sto-page .cc-input-container {
  border: 1px solid var(--color-ash-solid, #eceaf6);
  border-radius: 18px;
  background: var(--color-pure-white, #ffffff);
}
body.fx-theme-studio .sto-page .st-btn.is-disabled,
body.fx-theme-studio .sto-page a.is-disabled {
  opacity: 0.45;
  pointer-events: none;
}
body.fx-theme-studio .sto-alert-wrap { padding: 0 0 12px; }

/* ============================================================
   26. STUDIO CHECKOUT — rail + card (no Classic fx-cart bleed)
   ============================================================ */
body.fx-theme-studio .sto-checkout .sto-checkout__card {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(280px, 340px);
  gap: 28px;
  align-items: start;
  max-width: none;
  width: 100%;
  margin: 0;
  background: var(--color-pure-white, #ffffff);
  border: 1px solid var(--color-ash-solid, #eceaf6);
  border-radius: 24px;
  padding: 22px;
  box-shadow: 0 18px 40px -22px rgba(23, 21, 38, 0.14);
  float: none !important;
}
body.fx-theme-studio .sto-checkout .sto-checkout__main {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 14px;
  float: none !important;
  width: auto !important;
}
body.fx-theme-studio .sto-checkout .sto-checkout__rail,
body.fx-theme-studio .sto-checkout .sto-checkout__aside {
  display: flex !important;
  flex-direction: column;
  gap: 14px;
  min-width: 0;
  width: auto !important;
  max-width: none;
  float: none !important;
  position: static !important;
  top: auto !important;
  align-self: start;
  background: transparent !important;
  padding: 0 !important;
  margin: 0 !important;
}
body.fx-theme-studio .sto-checkout #checkoutOrderSummary,
body.fx-theme-studio .sto-checkout .sto-summary.order-summary {
  margin: 0 !important;
  padding: 16px !important;
  background: var(--color-paper-mist, #f8faff) !important;
  border: 1px solid var(--color-ash-solid, #eceaf6) !important;
  border-radius: 18px !important;
  box-shadow: none !important;
  width: 100% !important;
  color: var(--color-midnight-ink, #171526) !important;
  position: static !important;
  top: auto !important;
  transform: none !important;
}
body.fx-theme-studio .sto-checkout #checkoutOrderSummary .summary-container {
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
}
body.fx-theme-studio .sto-checkout #checkoutOrderSummaryLoader.loader {
  position: absolute !important;
  inset: 0 !important;
  display: none;
  align-items: center;
  justify-content: center;
  background: rgba(248, 250, 255, 0.86) !important;
  border-radius: inherit;
  z-index: 2;
}
body.fx-theme-studio .sto-checkout #checkoutOrderSummaryLoader.loader:not(.w-hidden) {
  display: flex;
}

/* Rail line items — same stack language as cart, 2-col (info + price) */
body.fx-theme-studio .sto-checkout .sto-stack--rail {
  display: flex;
  flex-direction: column;
  background: var(--color-pure-white, #ffffff);
  border: 1px solid var(--color-ash-solid, #eceaf6);
  border-radius: 18px;
  overflow: hidden;
}
body.fx-theme-studio .sto-checkout .sto-stack--rail .sto-stack__item {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: start;
  padding: 12px 14px;
  border-bottom: 1px solid #f0eef8;
  background: transparent;
}
body.fx-theme-studio .sto-checkout .sto-stack--rail .sto-stack__item:last-child { border-bottom: 0; }
body.fx-theme-studio .sto-checkout .sto-stack--rail .sto-stack__item--addon {
  border-bottom-style: dashed;
  background: #faf9ff;
}
body.fx-theme-studio .sto-checkout .sto-stack__info {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
}
body.fx-theme-studio .sto-checkout .sto-stack__title {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 2px;
}
body.fx-theme-studio .sto-checkout .sto-stack__kicker {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--color-notion-blue, #fa2f62);
}
body.fx-theme-studio .sto-checkout .sto-stack__item--domain .sto-stack__kicker { color: #b45309; }
body.fx-theme-studio .sto-checkout .sto-stack__item--addon .sto-stack__kicker { color: var(--color-lavender, #794dff); }
body.fx-theme-studio .sto-checkout .sto-stack__name {
  font-weight: 600;
  color: var(--color-midnight-ink, #171526);
  font-size: 14px;
  line-height: 1.3;
  word-break: break-word;
}
body.fx-theme-studio .sto-checkout .sto-stack__name--mono {
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 13px;
}
body.fx-theme-studio .sto-checkout .sto-stack__domain {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: #56546b;
  font-size: 12px;
}
body.fx-theme-studio .sto-checkout .sto-stack__opts {
  list-style: none;
  margin: 4px 0 0;
  padding: 0;
  display: grid;
  gap: 2px;
  font-size: 12px;
  color: #56546b;
}
body.fx-theme-studio .sto-checkout .sto-stack__opts li {
  display: flex;
  justify-content: space-between;
  gap: 8px;
}
body.fx-theme-studio .sto-checkout .sto-stack__price {
  text-align: right;
  display: flex;
  flex-direction: column;
  gap: 2px;
  white-space: nowrap;
}
body.fx-theme-studio .sto-checkout .sto-stack__price b {
  color: var(--color-midnight-ink, #171526);
  font-size: 14px;
}
body.fx-theme-studio .sto-checkout .sto-stack__price span {
  color: #56546b;
  font-size: 11px;
}

body.fx-theme-studio .sto-checkout .sto-summary__row {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  padding: 6px 0;
  font-size: 13px;
  color: #56546b;
}
body.fx-theme-studio .sto-checkout .sto-summary__row--recurring {
  border-top: 1px dashed var(--color-ash-solid, #eceaf6);
  margin-top: 4px;
  padding-top: 10px;
}
body.fx-theme-studio .sto-checkout .sto-summary__due {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 12px;
  margin-top: 10px;
  padding-top: 12px;
  border-top: 1px solid var(--color-ash-solid, #eceaf6);
}
body.fx-theme-studio .sto-checkout .sto-summary__due-label {
  font-weight: 700;
  color: var(--color-midnight-ink, #171526);
  font-size: 13px;
}
body.fx-theme-studio .sto-checkout .sto-summary__due-amt {
  font-weight: 700;
  font-size: 22px;
  color: var(--color-midnight-ink, #171526);
  letter-spacing: -0.02em;
}
body.fx-theme-studio .sto-checkout .sto-summary__trust {
  list-style: none;
  margin: 14px 0 0;
  padding: 0;
  display: grid;
  gap: 8px;
  font-size: 12px;
  color: #56546b;
}
body.fx-theme-studio .sto-checkout .sto-summary__trust li {
  display: flex;
  gap: 8px;
  align-items: flex-start;
}
body.fx-theme-studio .sto-checkout .sto-summary__trust i { color: #00966e; margin-top: 2px; }

body.fx-theme-studio .sto-checkout .sto-checklist__list li {
  display: flex;
  align-items: center;
  gap: 8px;
}
body.fx-theme-studio .sto-checkout .sto-checklist__list i {
  width: 16px;
  text-align: center;
  color: var(--color-lavender, #794dff);
}

/* Kill Classic floats / notion wrappers that may still leak */
body.fx-theme-studio .sto-checkout .fx-notion-domain__visual,
body.fx-theme-studio .sto-checkout .fx-cart-page__rail,
body.fx-theme-studio .sto-checkout .fx-checkout-page__rail {
  float: none !important;
  width: auto !important;
  position: static !important;
}
body.fx-theme-studio .sto-checkout .already-registered.clearfix::after,
body.fx-theme-studio .sto-checkout .pull-right,
body.fx-theme-studio .sto-checkout .float-right {
  float: none !important;
}

@media (max-width: 960px) {
  body.fx-theme-studio .sto-checkout .sto-checkout__card {
    grid-template-columns: 1fr;
  }
}


/* ============================================================
   27. STUDIO CLIENT AREA — ink shell + white canvas
   ============================================================ */
body.fx-theme-studio.sto-portal {
  --sto-ink: var(--color-midnight-ink, #171526);
  --sto-ink-2: var(--color-graphite, #2a2740);
  --sto-magenta: var(--color-notion-blue, #fa2f62);
  --sto-violet: var(--color-lavender, #794dff);
  --sto-lime: #97f675;
  --sto-canvas: var(--surface-page, var(--color-paper-warmth, #ffffff));
  --sto-card: var(--surface-card, var(--color-pure-white, #ffffff));
  --sto-mist: var(--color-paper-mist, #f8faff);
  --sto-line: var(--color-ash-solid, #eceaf6);
  --sto-mute: var(--color-slate, #56546b);
  /* Sidebar stays a dark island in both light + dark palettes */
  --sto-side-bg: var(--color-midnight-brand, #03061a);
  --sto-side-fg: #ffffff;
  background: var(--sto-canvas) !important;
  color: var(--sto-ink);
  font-family: var(--font-inter);
}

body.fx-theme-studio.sto-portal .sto-app {
  display: grid;
  grid-template-columns: 260px minmax(0, 1fr);
  min-height: 100vh;
  width: 100%;
  max-width: none;
  background: var(--sto-canvas);
}

body.fx-theme-studio.sto-portal .sto-app__aside {
  position: sticky;
  top: 0;
  align-self: start;
  height: 100vh;
  overflow: auto;
  background: var(--sto-side-bg);
  color: var(--sto-side-fg);
  border-right: 0;
  z-index: 40;
}

body.fx-theme-studio.sto-portal .sto-app__stage {
  display: flex;
  flex-direction: column;
  min-width: 0;
  width: 100%;
  max-width: none;
  min-height: 100vh;
  background: var(--sto-canvas);
}

body.fx-theme-studio.sto-portal .sto-app__main,
body.fx-theme-studio.sto-portal #main-body.sto-app__main {
  flex: 1;
  min-width: 0;
  width: 100%;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

body.fx-theme-studio.sto-portal .sto-app__page {
  width: 100%;
  max-width: none;
  padding: 8px 28px 40px;
  box-sizing: border-box;
}

/* ---- Sidebar ---- */
body.fx-theme-studio.sto-portal .sto-side {
  display: flex;
  flex-direction: column;
  gap: 18px;
  padding: 20px 16px 28px;
  min-height: 100%;
}

body.fx-theme-studio.sto-portal .sto-side__brand {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: #ffffff;
  text-decoration: none;
  font-weight: 600;
  padding: 4px 8px 12px;
}
body.fx-theme-studio.sto-portal .sto-side__brand img {
  max-height: 28px;
  width: auto;
  filter: brightness(0) invert(1);
}
body.fx-theme-studio.sto-portal .sto-side__mark {
  width: 28px;
  height: 28px;
  border-radius: 9px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--sto-magenta);
  color: #fff;
  font-weight: 700;
}

body.fx-theme-studio.sto-portal .sto-side__profile {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 10px;
  align-items: center;
  padding: 10px;
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.06);
  color: #ffffff;
  text-decoration: none;
  margin-bottom: 4px;
}
body.fx-theme-studio.sto-portal .sto-side__avatar-wrap {
  position: relative;
  width: 36px;
  height: 36px;
}
body.fx-theme-studio.sto-portal .sto-side__avatar {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  object-fit: cover;
  display: block;
}
body.fx-theme-studio.sto-portal .sto-side__initials {
  position: absolute;
  inset: 0;
  display: none;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: var(--sto-violet);
  font-size: 12px;
  font-weight: 700;
}
body.fx-theme-studio.sto-portal .sto-side__profile-meta {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}
body.fx-theme-studio.sto-portal .sto-side__profile-meta b {
  font-size: 13px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
body.fx-theme-studio.sto-portal .sto-side__profile-meta small {
  color: rgba(255, 255, 255, 0.55);
  font-size: 11px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

body.fx-theme-studio.sto-portal .sto-side__group { display: grid; gap: 6px; }
body.fx-theme-studio.sto-portal .sto-side__group--foot { margin-top: auto; padding-top: 12px; }
body.fx-theme-studio.sto-portal .sto-side__label {
  margin: 0 8px 4px;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.38);
}
body.fx-theme-studio.sto-portal .sto-side__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 2px;
}
body.fx-theme-studio.sto-portal .sto-side__link {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 9px 12px;
  border-radius: 12px;
  color: rgba(255, 255, 255, 0.78);
  text-decoration: none;
  font-size: 13px;
  font-weight: 500;
}
body.fx-theme-studio.sto-portal .sto-side__link i {
  width: 16px;
  text-align: center;
  opacity: 0.85;
}
body.fx-theme-studio.sto-portal .sto-side__link:hover {
  background: rgba(255, 255, 255, 0.08);
  color: #ffffff;
}
body.fx-theme-studio.sto-portal .sto-side__link.is-active {
  background: var(--color-pure-white, #ffffff);
  color: var(--sto-ink);
}
body.fx-theme-studio.sto-portal .sto-side__link.is-active i { color: var(--sto-magenta); }
body.fx-theme-studio.sto-portal .sto-side__link--muted { color: rgba(255, 255, 255, 0.45); }

/* ---- Topbar ---- */
body.fx-theme-studio.sto-portal .sto-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  width: 100%;
  max-width: none;
  padding: 16px 28px 8px;
  background: var(--sto-canvas);
  border-bottom: 1px solid transparent;
  position: sticky;
  top: 0;
  z-index: 30;
  box-sizing: border-box;
}
body.fx-theme-studio.sto-portal .sto-top__left {
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
}
body.fx-theme-studio.sto-portal .sto-top__menu {
  display: none;
  width: 40px;
  height: 40px;
  border: 1px solid var(--sto-line);
  border-radius: 12px;
  background: var(--sto-card, var(--color-pure-white, #ffffff));
  color: var(--sto-ink);
}
body.fx-theme-studio.sto-portal .sto-top__kicker {
  display: block;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--sto-magenta);
}
body.fx-theme-studio.sto-portal .sto-top__heading {
  margin: 0;
  font-family: var(--font-inter);
  font-weight: 500;
  font-size: 22px;
  letter-spacing: -0.02em;
  color: var(--sto-ink);
  line-height: 1.2;
}
body.fx-theme-studio.sto-portal .sto-top__actions {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-shrink: 0;
}
body.fx-theme-studio .fx-navbar-locale-form .fx-locale-picker__trigger {
  border-color: var(--color-ash-solid, #e7e5f2);
  background: var(--surface-card, var(--color-pure-white, #ffffff));
  color: var(--color-midnight-ink, #171526);
}
body.fx-theme-studio.fx-palette-dark .fx-navbar-locale-form .fx-locale-picker__trigger {
  border-color: rgba(255, 255, 255, 0.12);
  background: var(--surface-card, #141414);
  color: var(--color-midnight-ink, #f2f0fa);
}
body.fx-theme-studio.sto-portal .sto-top__cart {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  height: 40px;
  padding: 0 12px;
  border-radius: 999px;
  background: var(--sto-mist);
  border: 1px solid var(--sto-line);
  color: var(--sto-ink);
  text-decoration: none;
  font-weight: 600;
  font-size: 13px;
}
body.fx-theme-studio.sto-portal .sto-top__cta {
  height: 40px;
  padding-inline: 14px;
}

/* ---- Shared CA chrome ---- */
body.fx-theme-studio.sto-portal .sto-dash__head,
body.fx-theme-studio.sto-portal .sto-list-top {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: flex-start;
  margin-bottom: 18px;
}
body.fx-theme-studio.sto-portal .sto-dash__head {
  display: block;
  margin-bottom: 16px;
}
body.fx-theme-studio.sto-portal .sto-dash__tools,
body.fx-theme-studio.sto-portal .sto-dash__date {
  display: none !important;
}
body.fx-theme-studio.sto-portal .sto-ca-home__alerts {
  display: grid;
  gap: 10px;
  margin: 0 0 18px;
}
body.fx-theme-studio.sto-portal .sto-ca-home__alert {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 12px 14px;
  align-items: center;
  padding: 14px 16px;
  border-radius: 16px;
  border: 1px solid color-mix(in srgb, var(--color-saffron, #e89d01) 40%, transparent);
  background: color-mix(in srgb, var(--color-saffron, #e89d01) 16%, var(--sto-card));
  color: var(--color-charcoal, #9a3412);
}
body.fx-theme-studio.sto-portal .sto-ca-home__alert > i {
  color: var(--color-saffron, #b45309);
  font-size: 16px;
}
body.fx-theme-studio.sto-portal .sto-ca-home__alert-body {
  min-width: 0;
  font-size: 14px;
  line-height: 1.45;
}
body.fx-theme-studio.sto-portal .sto-ca-home__alert-body p { margin: 0; }
body.fx-theme-studio.sto-portal .sto-ca-home__alert-cta {
  flex-shrink: 0;
  white-space: nowrap;
}
@media (max-width: 720px) {
  body.fx-theme-studio.sto-portal .sto-ca-home__alert {
    grid-template-columns: auto minmax(0, 1fr);
  }
  body.fx-theme-studio.sto-portal .sto-ca-home__alert-cta {
    grid-column: 2;
    justify-self: start;
  }
}
body.fx-theme-studio.sto-portal .sto-list-top {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  gap: 14px;
  align-items: stretch;
}
body.fx-theme-studio.sto-portal .sto-dash__title,
body.fx-theme-studio.sto-portal .sto-ca-tile__title {
  font-family: var(--font-inter);
  font-weight: 500;
  letter-spacing: -0.03em;
  color: var(--sto-ink);
  margin: 0;
}
body.fx-theme-studio.sto-portal .sto-dash__sub,
body.fx-theme-studio.sto-portal .sto-ca-tile__lead {
  color: var(--sto-mute);
  margin: 6px 0 0;
}
body.fx-theme-studio.sto-portal .sto-ca-tile__kicker,
body.fx-theme-studio.sto-portal .sto-stat__kicker {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--sto-magenta);
}

body.fx-theme-studio.sto-portal .sto-ca-tile,
body.fx-theme-studio.sto-portal .sto-stat {
  background: var(--sto-card);
  border: 1px solid var(--sto-line);
  border-radius: 20px;
  padding: 18px;
  box-shadow: 0 14px 32px -24px rgba(23, 21, 38, 0.18);
}
body.fx-theme-studio.sto-portal .sto-stat {
  text-decoration: none;
  color: inherit;
  display: flex;
  flex-direction: column;
  gap: 8px;
  position: relative;
  overflow: hidden;
  min-height: 140px;
}
body.fx-theme-studio.sto-portal .sto-stat--dark {
  background: var(--sto-side-bg);
  color: #ffffff;
  border-color: var(--sto-side-bg);
}
body.fx-theme-studio.sto-portal .sto-stat--dark .sto-stat__kicker,
body.fx-theme-studio.sto-portal .sto-stat--dark .sto-stat__hint,
body.fx-theme-studio.sto-portal .sto-stat--dark .sto-stat__updated {
  color: rgba(255, 255, 255, 0.55);
}
body.fx-theme-studio.sto-portal .sto-stat__value {
  font-family: var(--font-inter);
  font-weight: 500;
  font-size: 34px;
  letter-spacing: -0.03em;
  margin: 0;
  color: inherit;
}
body.fx-theme-studio.sto-portal .sto-stat__top {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
body.fx-theme-studio.sto-portal .sto-stat__mark {
  width: 34px;
  height: 34px;
  border-radius: 11px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--sto-mist);
  color: var(--sto-ink);
}
body.fx-theme-studio.sto-portal .sto-stat--dark .sto-stat__mark {
  background: rgba(255, 255, 255, 0.1);
  color: #fff;
}
body.fx-theme-studio.sto-portal .sto-stat__row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}
body.fx-theme-studio.sto-portal .sto-stat__hint,
body.fx-theme-studio.sto-portal .sto-stat__updated,
body.fx-theme-studio.sto-portal .sto-stat__foot {
  font-family: var(--font-inter);
}
body.fx-theme-studio.sto-portal .sto-stat__hint,
body.fx-theme-studio.sto-portal .sto-stat__updated {
  font-size: 12px;
  color: var(--sto-mute);
}
body.fx-theme-studio.sto-portal .sto-stat.is-warn {
  border-color: color-mix(in srgb, var(--color-coral, #f64932) 35%, transparent);
  background: color-mix(in srgb, var(--color-coral, #f64932) 12%, var(--sto-card));
  color: var(--color-vermillion, #9f1239);
}
body.fx-theme-studio.sto-portal .sto-stat.is-warn .sto-stat__kicker,
body.fx-theme-studio.sto-portal .sto-stat.is-warn .sto-stat__value,
body.fx-theme-studio.sto-portal .sto-stat.is-warn .sto-stat__foot {
  color: var(--color-vermillion, #9f1239);
}
body.fx-theme-studio.sto-portal .sto-stat.is-warn .sto-stat__hint,
body.fx-theme-studio.sto-portal .sto-stat.is-warn .sto-stat__updated {
  color: color-mix(in srgb, var(--color-vermillion, #9f1239) 72%, transparent);
}
body.fx-theme-studio.sto-portal .sto-stat.is-warn .sto-stat__mark {
  background: color-mix(in srgb, var(--color-coral, #f64932) 18%, var(--sto-mist));
  color: var(--color-vermillion, #9f1239);
}
body.fx-theme-studio.sto-portal .sto-ca-tile--stat.is-warn,
body.fx-theme-studio.sto-portal .sto-list-top__stat.is-warn {
  background: color-mix(in srgb, var(--color-coral, #f64932) 12%, var(--sto-card));
  border-color: color-mix(in srgb, var(--color-coral, #f64932) 35%, transparent);
  color: var(--color-vermillion, #9f1239);
}
body.fx-theme-studio.sto-portal .sto-ca-tile--stat.is-warn .sto-ca-tile__kicker,
body.fx-theme-studio.sto-portal .sto-ca-tile--stat.is-warn .sto-ca-tile__mega,
body.fx-theme-studio.sto-portal .sto-ca-tile--stat.is-warn .sto-ca-tile__meta,
body.fx-theme-studio.sto-portal .sto-list-top__stat.is-warn .sto-ca-tile__kicker,
body.fx-theme-studio.sto-portal .sto-list-top__stat.is-warn .sto-ca-tile__mega,
body.fx-theme-studio.sto-portal .sto-list-top__stat.is-warn .sto-ca-tile__meta {
  color: inherit;
}

body.fx-theme-studio.sto-portal .sto-dash-pill,
body.fx-theme-studio.sto-portal .sto-ca-home__pill,
body.fx-theme-studio.sto-portal .sto-ca-home__badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 10px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 700;
  background: var(--sto-mist);
  color: var(--sto-ink);
  border: 1px solid var(--sto-line);
}
body.fx-theme-studio.sto-portal .sto-dash-pill--ok,
body.fx-theme-studio.sto-portal .sto-ca-home__badge--ok,
body.fx-theme-studio.sto-portal .sto-ca-home__badge--active {
  color: var(--color-vivid-green, #00966e);
  background: var(--color-soft-mint, #edfbf5);
  border-color: color-mix(in srgb, var(--color-vivid-green, #00966e) 28%, transparent);
}
body.fx-theme-studio.sto-portal .sto-dash-pill--warn,
body.fx-theme-studio.sto-portal .sto-ca-home__badge--warn,
body.fx-theme-studio.sto-portal .sto-ca-home__badge--pending {
  color: var(--color-saffron, #b45309);
  background: color-mix(in srgb, var(--color-saffron, #e89d01) 16%, var(--sto-card));
  border-color: color-mix(in srgb, var(--color-saffron, #e89d01) 35%, transparent);
}
body.fx-theme-studio.sto-portal .sto-dash-pill--danger,
body.fx-theme-studio.sto-portal .sto-ca-home__badge--danger,
body.fx-theme-studio.sto-portal .sto-ca-home__badge--suspended {
  color: var(--color-vermillion, #c81e4a);
  background: color-mix(in srgb, var(--color-coral, #f64932) 14%, var(--sto-card));
  border-color: color-mix(in srgb, var(--color-coral, #f64932) 32%, transparent);
}
body.fx-theme-studio.sto-portal .sto-dash-pill--invert { background: rgba(255,255,255,0.12); color: #fff; border-color: transparent; }
body.fx-theme-studio.sto-portal .sto-ca-home__pill.is-on {
  background: var(--sto-side-bg);
  color: #fff;
  border-color: var(--sto-side-bg);
}

body.fx-theme-studio.sto-portal .sto-ca-home__grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 16px;
}
body.fx-theme-studio.sto-portal .sto-ca-home__grid > .sto-stat { grid-column: span 1; }
body.fx-theme-studio.sto-portal .sto-dash-chart { grid-column: span 2; }
body.fx-theme-studio.sto-portal .sto-dash-svc { grid-column: span 2; }
body.fx-theme-studio.sto-portal .sto-dash-chart {
  display: flex;
  flex-direction: column;
  gap: 12px;
  min-height: 280px;
}
body.fx-theme-studio.sto-portal .sto-dash-chart__head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
}
body.fx-theme-studio.sto-portal .sto-dash-chart__value {
  margin: 4px 0 2px;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  font-size: clamp(22px, 2.4vw, 30px);
  font-weight: 600;
  letter-spacing: -0.03em;
  line-height: 1;
  color: var(--sto-ink);
}
body.fx-theme-studio.sto-portal .sto-dash-chart__hint {
  margin: 0;
  font-size: 12px;
  color: var(--sto-mute);
}
body.fx-theme-studio.sto-portal .sto-dash-chart__hint a {
  color: var(--sto-magenta);
  text-decoration: none;
}
body.fx-theme-studio.sto-portal .sto-dash-chart__plot {
  flex: 1;
  min-height: 200px;
}
body.fx-theme-studio.sto-portal .sto-dash-chart__plot svg { display: block; }
body.fx-theme-studio.sto-portal .sto-dash-chart__plot .fx-chartgrid {
  stroke: var(--color-ash-solid, #eceaf6);
  stroke-width: 1;
}
body.fx-theme-studio.sto-portal .sto-dash-chart__plot .fx-chartline {
  fill: none;
  stroke: var(--sto-magenta);
  stroke-width: 2.5;
  stroke-linecap: round;
}
body.fx-theme-studio.sto-portal .sto-ca-home__pills {
  display: inline-flex;
  gap: 6px;
  flex-wrap: wrap;
}
body.fx-theme-studio.sto-portal .sto-ca-tile__head--pills-only {
  justify-content: flex-start;
  margin-bottom: 10px;
}
body.fx-theme-studio.sto-portal .sto-ca-home__pill {
  border: 1px solid var(--sto-line);
  background: var(--sto-card, var(--color-pure-white, #ffffff));
  color: var(--sto-mute);
  border-radius: 999px;
  padding: 6px 12px;
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
  box-shadow: none;
  transition: background .15s ease, color .15s ease, border-color .15s ease, box-shadow .15s ease;
}
body.fx-theme-studio.sto-portal .sto-ca-home__pill:hover {
  border-color: color-mix(in srgb, var(--sto-magenta) 40%, var(--sto-line));
  color: var(--sto-ink);
}
body.fx-theme-studio.sto-portal .sto-ca-home__pill.is-on {
  background: var(--sto-side-bg);
  color: #fff;
  border-color: var(--sto-side-bg);
  box-shadow: 0 0 0 1px var(--sto-side-bg), 0 0 0 3px color-mix(in srgb, var(--sto-side-bg) 22%, transparent);
}
body.fx-theme-studio.sto-portal .sto-ca-home__pill:focus-visible {
  outline: 2px solid var(--sto-magenta);
  outline-offset: 2px;
}
body.fx-theme-studio.sto-portal .sto-ca-home__svc-panel[hidden] { display: none !important; }
body.fx-theme-studio.sto-portal .sto-ca-tile--half { grid-column: span 2; }
body.fx-theme-studio.sto-portal .sto-ca-tile--domain,
body.fx-theme-studio.sto-portal .sto-dash-domain { grid-column: 1 / -1; }

body.fx-theme-studio.sto-portal .sto-ca-tile__head {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: center;
  margin-bottom: 12px;
}
body.fx-theme-studio.sto-portal .sto-ca-tile__heading {
  margin: 0;
  font-size: 16px;
  font-weight: 600;
  color: var(--sto-ink);
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
body.fx-theme-studio.sto-portal .sto-ca-home__list,
body.fx-theme-studio.sto-portal .sto-ca-home__feed {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 0;
}
body.fx-theme-studio.sto-portal .sto-ca-home__list > li,
body.fx-theme-studio.sto-portal .sto-ca-home__list > .sto-svc-row,
body.fx-theme-studio.sto-portal .sto-ca-home__feed > li {
  border-bottom: 1px solid var(--sto-line);
}
body.fx-theme-studio.sto-portal .sto-ca-home__list > li:last-child,
body.fx-theme-studio.sto-portal .sto-ca-home__list > .sto-svc-row:last-child,
body.fx-theme-studio.sto-portal .sto-ca-home__feed > li:last-child {
  border-bottom: 0;
}
body.fx-theme-studio.sto-portal .sto-ca-home__list-link,
body.fx-theme-studio.sto-portal .sto-ca-home__feed-link {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: center;
  padding: 12px 4px;
  border-radius: 0;
  color: inherit;
  border: 0;
}
body.fx-theme-studio.sto-portal .sto-ca-home__list-link:hover,
body.fx-theme-studio.sto-portal .sto-ca-home__feed-link:hover {
  background: var(--sto-mist);
  border-color: transparent;
}
body.fx-theme-studio.sto-portal .sto-ca-home__list-text,
body.fx-theme-studio.sto-portal .sto-ca-home__feed-main {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}
body.fx-theme-studio.sto-portal .sto-ca-home__list-text b,
body.fx-theme-studio.sto-portal .sto-ca-home__feed-main b {
  color: var(--sto-ink);
  font-size: 14px;
}
body.fx-theme-studio.sto-portal .sto-ca-home__list-main small,
body.fx-theme-studio.sto-portal .sto-ca-home__feed-main small,
body.fx-theme-studio.sto-portal .sto-ca-home__muted {
  color: var(--sto-mute);
  font-size: 12px;
}
body.fx-theme-studio.sto-portal .sto-ca-home__list-actions {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  flex-shrink: 0;
}
body.fx-theme-studio.sto-portal .sto-ca-home__detail-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 28px;
  padding: 0 10px;
  border-radius: 999px;
  border: 1px solid var(--sto-line);
  background: var(--sto-card);
  color: var(--sto-ink);
  font-size: 11px;
  font-weight: 600;
  text-decoration: none;
  transition: border-color .15s ease, color .15s ease, background .15s ease;
}
body.fx-theme-studio.sto-portal .sto-ca-home__detail-btn:hover {
  border-color: color-mix(in srgb, var(--sto-magenta) 40%, var(--sto-line));
  color: var(--sto-magenta);
}
body.fx-theme-studio.sto-portal .sto-ca-link {
  color: var(--sto-magenta);
  font-weight: 600;
  text-decoration: none;
}
body.fx-theme-studio.sto-portal .sto-ca-home__domain-inner {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(220px, 0.8fr);
  gap: 20px;
  align-items: center;
}
body.fx-theme-studio.sto-portal .sto-ca-home__domain-title {
  font-family: var(--font-inter);
  font-weight: 500;
  font-size: 28px;
  letter-spacing: -0.03em;
  margin: 4px 0 8px;
}
body.fx-theme-studio.sto-portal .sto-ca-home__domain-form {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  margin: 14px 0;
}
body.fx-theme-studio.sto-portal .sto-domain__field {
  flex: 1;
  min-width: 220px;
  display: flex;
  align-items: center;
  gap: 8px;
  border: 1px solid var(--sto-line);
  border-radius: 14px;
  padding: 0 14px;
  background: var(--sto-mist, var(--color-paper-mist, #f8faff));
  height: 48px;
}
body.fx-theme-studio.sto-portal .sto-domain__field input {
  border: 0;
  outline: 0;
  width: 100%;
  background: transparent;
  color: var(--sto-ink);
}
body.fx-theme-studio.sto-portal .sto-ca-home__domain-tlds {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 8px;
}
body.fx-theme-studio.sto-portal .sto-ca-home__domain-tlds li {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  padding: 8px 0;
  border-bottom: 1px solid var(--sto-line);
  font-size: 13px;
}
body.fx-theme-studio.sto-portal .sto-ui {
  background: var(--sto-mist);
  border: 1px solid var(--sto-line);
  border-radius: 16px;
  padding: 14px;
}

/* ---- List pages / tables ---- */
body.fx-theme-studio.sto-portal .sto-ca-home__grid.sto-svc-page__grid,
body.fx-theme-studio.sto-portal .sto-svc-page__grid,
body.fx-theme-studio.sto-portal .sto-dom-page .sto-ca-home__grid,
body.fx-theme-studio.sto-portal .sto-inv-page .sto-ca-home__grid,
body.fx-theme-studio.sto-portal .sto-tkt-page .sto-ca-home__grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 260px;
  gap: 16px;
}
body.fx-theme-studio.sto-portal .sto-list-top { grid-column: 1 / -1; }
body.fx-theme-studio.sto-portal .sto-svc-page__stack,
body.fx-theme-studio.sto-portal .sto-dom-page__stack,
body.fx-theme-studio.sto-portal .sto-inv-page__stack,
body.fx-theme-studio.sto-portal .sto-tkt-page__stack { grid-column: 1; }
body.fx-theme-studio.sto-portal .sto-svc-page__aside,
body.fx-theme-studio.sto-portal .sto-dom-page__aside,
body.fx-theme-studio.sto-portal .sto-inv-page__aside,
body.fx-theme-studio.sto-portal .sto-tkt-page__aside { grid-column: 2; align-self: start; }

body.fx-theme-studio.sto-portal .sto-tkt-page__empty .fx-btn-primary {
  background: var(--sto-lime) !important;
  border-color: var(--sto-lime) !important;
  color: #043422 !important;
}
body.fx-theme-studio.sto-portal .sto-tkt-page__empty .fx-btn-primary:hover {
  background: #aef98f !important;
  border-color: #aef98f !important;
  color: #043422 !important;
}

body.fx-theme-studio.sto-portal .sto-ca-tile--hero {
  background: var(--sto-mist);
}
body.fx-theme-studio.sto-portal .sto-ca-tile__title {
  font-size: 28px;
}
body.fx-theme-studio.sto-portal .sto-ca-tile__mega {
  font-family: var(--font-inter);
  font-weight: 500;
  font-size: 36px;
  letter-spacing: -0.03em;
  color: var(--sto-ink);
  display: block;
  margin: 6px 0;
}
body.fx-theme-studio.sto-portal .sto-ca-tile__actions {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 8px;
}
body.fx-theme-studio.sto-portal .sto-ca-tile__actions a {
  display: flex;
  align-items: center;
  gap: 8px;
  color: var(--sto-ink);
  text-decoration: none;
  font-weight: 600;
  font-size: 13px;
}
body.fx-theme-studio.sto-portal .sto-ca-tile__actions a:hover { color: var(--sto-magenta); }

body.fx-theme-studio.sto-portal .sto-table,
body.fx-theme-studio.sto-portal table.dataTable {
  width: 100% !important;
  border-collapse: separate;
  border-spacing: 0;
}
body.fx-theme-studio.sto-portal .sto-table thead th,
body.fx-theme-studio.sto-portal table.dataTable thead th {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--sto-mute);
  border-bottom: 1px solid var(--sto-line) !important;
  padding: 10px 12px !important;
  background: transparent !important;
}
body.fx-theme-studio.sto-portal .sto-table tbody td,
body.fx-theme-studio.sto-portal table.dataTable tbody td {
  padding: 14px 12px !important;
  border-bottom: 1px solid var(--sto-line) !important;
  vertical-align: middle;
  color: var(--sto-ink);
}
body.fx-theme-studio.sto-portal .sto-table tbody tr:hover td,
body.fx-theme-studio.sto-portal table.dataTable tbody tr:hover td {
  background: var(--sto-mist) !important;
}
body.fx-theme-studio.sto-portal .sto-svc-table__name,
body.fx-theme-studio.sto-portal .sto-dom-table__name {
  display: block;
  font-weight: 600;
}
body.fx-theme-studio.sto-portal .sto-svc-table__domain,
body.fx-theme-studio.sto-portal .sto-svc-table__cycle,
body.fx-theme-studio.sto-portal .sto-svc-table__due {
  display: block;
  font-size: 12px;
  color: var(--sto-mute);
}
body.fx-theme-studio.sto-portal .sto-status {
  display: inline-flex;
  padding: 4px 10px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 700;
  background: var(--sto-mist);
  border: 1px solid var(--sto-line);
}
body.fx-theme-studio.sto-portal .sto-status--active { color: var(--color-vivid-green, #00966e); background: var(--color-soft-mint, #edfbf5); border-color: color-mix(in srgb, var(--color-vivid-green, #00966e) 28%, transparent); }
body.fx-theme-studio.sto-portal .sto-status--pending { color: var(--color-saffron, #b45309); background: color-mix(in srgb, var(--color-saffron, #e89d01) 16%, var(--sto-card)); border-color: color-mix(in srgb, var(--color-saffron, #e89d01) 35%, transparent); }
body.fx-theme-studio.sto-portal .sto-status--suspended,
body.fx-theme-studio.sto-portal .sto-status--terminated,
body.fx-theme-studio.sto-portal .sto-status--cancelled { color: var(--color-vermillion, #c81e4a); background: color-mix(in srgb, var(--color-coral, #f64932) 14%, var(--sto-card)); border-color: color-mix(in srgb, var(--color-coral, #f64932) 32%, transparent); }
body.fx-theme-studio.sto-portal .sto-status--unpaid { color: var(--color-saffron, #b45309); background: color-mix(in srgb, var(--color-saffron, #e89d01) 16%, var(--sto-card)); border-color: color-mix(in srgb, var(--color-saffron, #e89d01) 35%, transparent); }
body.fx-theme-studio.sto-portal .sto-status--paid { color: var(--color-vivid-green, #00966e); background: var(--color-soft-mint, #edfbf5); border-color: color-mix(in srgb, var(--color-vivid-green, #00966e) 28%, transparent); }
body.fx-theme-studio.sto-portal .sto-status--overdue,
body.fx-theme-studio.sto-portal .sto-status--collections { color: var(--color-vermillion, #c81e4a); background: color-mix(in srgb, var(--color-coral, #f64932) 14%, var(--sto-card)); border-color: color-mix(in srgb, var(--color-coral, #f64932) 32%, transparent); }
body.fx-theme-studio.sto-portal .sto-status--refunded,
body.fx-theme-studio.sto-portal .sto-status--paymentpending,
body.fx-theme-studio.sto-portal .sto-status--expired,
body.fx-theme-studio.sto-portal .sto-status--grace,
body.fx-theme-studio.sto-portal .sto-status--redemption { color: var(--sto-mute); background: var(--sto-mist); border-color: var(--sto-line); }
body.fx-theme-studio.sto-portal .sto-status--open,
body.fx-theme-studio.sto-portal .sto-status--answered { color: var(--color-vivid-green, #00966e); background: var(--color-soft-mint, #edfbf5); border-color: color-mix(in srgb, var(--color-vivid-green, #00966e) 28%, transparent); }
body.fx-theme-studio.sto-portal .sto-status--customer-reply,
body.fx-theme-studio.sto-portal .sto-status--on-hold,
body.fx-theme-studio.sto-portal .sto-status--in-progress { color: var(--color-saffron, #b45309); background: color-mix(in srgb, var(--color-saffron, #e89d01) 16%, var(--sto-card)); border-color: color-mix(in srgb, var(--color-saffron, #e89d01) 35%, transparent); }
body.fx-theme-studio.sto-portal .sto-status--closed { color: var(--sto-mute); background: var(--sto-mist); border-color: var(--sto-line); }
body.fx-theme-studio.sto-portal .sto-status--draft { color: var(--sto-mute); background: var(--sto-mist); border-color: var(--sto-line); }
body.fx-theme-studio.sto-portal .sto-status--delivered { color: var(--color-saffron, #b45309); background: color-mix(in srgb, var(--color-saffron, #e89d01) 16%, var(--sto-card)); border-color: color-mix(in srgb, var(--color-saffron, #e89d01) 35%, transparent); }
body.fx-theme-studio.sto-portal .sto-status--accepted { color: var(--color-vivid-green, #00966e); background: var(--color-soft-mint, #edfbf5); border-color: color-mix(in srgb, var(--color-vivid-green, #00966e) 28%, transparent); }
body.fx-theme-studio.sto-portal .sto-status--lost,
body.fx-theme-studio.sto-portal .sto-status--dead { color: var(--color-vermillion, #c81e4a); background: color-mix(in srgb, var(--color-coral, #f64932) 14%, var(--sto-card)); border-color: color-mix(in srgb, var(--color-coral, #f64932) 32%, transparent); }

body.fx-theme-studio.sto-portal .sto-dt-top,
body.fx-theme-studio.sto-portal .dataTables_wrapper .dataTables_filter,
body.fx-theme-studio.sto-portal .dataTables_wrapper .dataTables_length {
  margin-bottom: 12px;
}
body.fx-theme-studio.sto-portal .dataTables_filter input,
body.fx-theme-studio.sto-portal .dataTables_length select,
body.fx-theme-studio.sto-portal .sto-app__page .form-control,
body.fx-theme-studio.sto-portal .sto-app__page select,
body.fx-theme-studio.sto-portal .sto-app__page textarea,
body.fx-theme-studio.sto-portal .sto-app__page input[type="text"],
body.fx-theme-studio.sto-portal .sto-app__page input[type="email"],
body.fx-theme-studio.sto-portal .sto-app__page input[type="password"],
body.fx-theme-studio.sto-portal .sto-app__page input[type="tel"],
body.fx-theme-studio.sto-portal .sto-app__page input[type="number"] {
  border-radius: 14px !important;
  border-color: var(--sto-line) !important;
  color: var(--sto-ink) !important;
  background: var(--sto-card, var(--color-pure-white, #ffffff)) !important;
}
body.fx-theme-studio.sto-portal .sto-app__page .form-control:focus,
body.fx-theme-studio.sto-portal .sto-app__page input:focus,
body.fx-theme-studio.sto-portal .sto-app__page select:focus,
body.fx-theme-studio.sto-portal .sto-app__page textarea:focus {
  border-color: var(--sto-side-bg) !important;
  box-shadow: 0 0 0 3px rgba(23, 21, 38, 0.1) !important;
}

/* Details / tabs / forms */
body.fx-theme-studio.sto-portal .nav-tabs {
  border-bottom: 1px solid var(--sto-line);
  gap: 4px;
}
body.fx-theme-studio.sto-portal .nav-tabs .nav-link {
  border: 0;
  border-radius: 999px;
  color: var(--sto-mute);
  font-weight: 600;
  padding: 8px 14px;
}
body.fx-theme-studio.sto-portal .nav-tabs .nav-link.active {
  background: var(--sto-side-bg);
  color: #fff;
}
body.fx-theme-studio.sto-portal .tab-content,
body.fx-theme-studio.sto-portal .sto-pd-page .panel,
body.fx-theme-studio.sto-portal .sto-dd-page .panel,
body.fx-theme-studio.sto-portal .sto-ad-page .panel,
body.fx-theme-studio.sto-portal .sto-ticket-page .panel {
  background: var(--color-pure-white, #ffffff);
  border: 1px solid var(--sto-line);
  border-radius: 18px;
  padding: 16px;
}

body.fx-theme-studio.sto-portal .st-quick {
  margin-top: 24px;
}
body.fx-theme-studio.sto-portal .st-quick__row {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}
body.fx-theme-studio.sto-portal .st-quick__card,
body.fx-theme-studio.sto-portal a.st-quick__card {
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 16px;
  border-radius: 18px;
  border: 1px solid var(--sto-line);
  background: var(--color-pure-white, #ffffff);
  text-decoration: none;
  color: var(--sto-ink);
  min-height: 110px;
}
body.fx-theme-studio.sto-portal .st-quick__card--ink,
body.fx-theme-studio.sto-portal .st-quick__card--dark {
  background: var(--sto-side-bg);
  color: #fff;
  border-color: var(--sto-side-bg);
}
body.fx-theme-studio.sto-portal .st-quick__label {
  font-weight: 600;
  font-size: 14px;
  margin-top: auto;
}

body.fx-theme-studio.sto-portal .sto-alert {
  border-radius: 14px;
  padding: 12px 14px;
  margin-bottom: 14px;
  border: 1px solid var(--sto-line);
  background: var(--sto-mist);
}
body.fx-theme-studio.sto-portal .sto-alert--error,
body.fx-theme-studio.sto-portal .sto-alert--danger {
  background: #fff1f4;
  border-color: #fecdd3;
  color: #c81e4a;
}
body.fx-theme-studio.sto-portal .sto-alert--warning {
  background: #fff7ed;
  border-color: #fed7aa;
  color: #b45309;
}
body.fx-theme-studio.sto-portal .sto-alert--success {
  background: #edfbf5;
  border-color: #c8f0df;
  color: #00966e;
}

/* Hide Classic portal chrome leftovers inside Studio portal */
body.fx-theme-studio.sto-portal .fx-navwrap,
body.fx-theme-studio.sto-portal .fx-app,
body.fx-theme-studio.sto-portal .fx-footer { display: none !important; }

/* Kill Classic portal max-width bleed on Studio main */
body.fx-theme-studio.sto-portal.fx-portal-active #main-body,
body.fx-theme-studio.sto-portal.page-clientareahome #main-body,
body.fx-theme-studio.sto-portal .flexus-container.pt-4 {
  max-width: none !important;
  width: 100% !important;
  margin-inline: 0 !important;
  padding-inline: 28px !important;
}

/* Mobile — 2-col stat row on dashboard home only (not list/form pages sharing .sto-ca-home__grid) */
@media (max-width: 1100px) {
  body.fx-theme-studio.sto-portal .sto-ca-home > .sto-ca-home__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  body.fx-theme-studio.sto-portal .sto-dash-chart,
  body.fx-theme-studio.sto-portal .sto-dash-svc,
  body.fx-theme-studio.sto-portal .sto-ca-tile--half,
  body.fx-theme-studio.sto-portal .sto-ca-tile--domain { grid-column: 1 / -1; }
  body.fx-theme-studio.sto-portal .sto-svc-page__stack,
  body.fx-theme-studio.sto-portal .sto-dom-page__stack,
  body.fx-theme-studio.sto-portal .sto-inv-page__stack,
  body.fx-theme-studio.sto-portal .sto-tkt-page__stack,
  body.fx-theme-studio.sto-portal .sto-svc-page__aside,
  body.fx-theme-studio.sto-portal .sto-dom-page__aside,
  body.fx-theme-studio.sto-portal .sto-inv-page__aside,
  body.fx-theme-studio.sto-portal .sto-tkt-page__aside {
    grid-column: auto;
  }
  body.fx-theme-studio.sto-portal .sto-ca-home__grid.sto-svc-page__grid,
  body.fx-theme-studio.sto-portal .sto-svc-page__grid,
  body.fx-theme-studio.sto-portal .sto-dom-page .sto-ca-home__grid,
  body.fx-theme-studio.sto-portal .sto-inv-page .sto-ca-home__grid,
  body.fx-theme-studio.sto-portal .sto-tkt-page .sto-ca-home__grid {
    grid-template-columns: 1fr;
  }
  body.fx-theme-studio.sto-portal .sto-list-top {
    grid-template-columns: 1fr;
  }
  body.fx-theme-studio.sto-portal .st-quick__row {
    grid-template-columns: 1fr 1fr;
  }
}
@media (max-width: 900px) {
  body.fx-theme-studio.sto-portal .sto-app {
    grid-template-columns: 1fr;
  }
  body.fx-theme-studio.sto-portal .sto-app__aside {
    position: fixed;
    inset: 0 auto 0 0;
    width: min(280px, 86vw);
    transform: translateX(-105%);
    transition: transform 0.2s ease;
    box-shadow: 18px 0 40px rgba(23, 21, 38, 0.25);
  }
  body.fx-theme-studio.sto-portal .sto-app.is-side-open .sto-app__aside {
    transform: translateX(0);
  }
  body.fx-theme-studio.sto-portal .sto-top__menu { display: inline-flex; align-items: center; justify-content: center; }
  body.fx-theme-studio.sto-portal .sto-app__page,
  body.fx-theme-studio.sto-portal .sto-top { padding-inline: 16px; }
  body.fx-theme-studio.sto-portal .sto-ca-home > .sto-ca-home__grid { grid-template-columns: 1fr; }
  body.fx-theme-studio.sto-portal .sto-ca-home__domain-inner { grid-template-columns: 1fr; }
  body.fx-theme-studio.sto-portal .st-quick__row { grid-template-columns: 1fr; }
  body.fx-theme-studio.sto-portal .sto-top__cta { display: none; }
}

/* ============================================================
   28. STUDIO CA — LIST PAGES (services / domains / invoices / tickets)
   ============================================================ */
body.fx-theme-studio.sto-portal .sto-list-top {
  grid-template-columns: minmax(0, 1fr) 200px 200px;
  align-items: stretch;
  margin-bottom: 0;
}
body.fx-theme-studio.sto-portal .sto-list-top__hero {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  background: var(--sto-side-bg);
  border-color: var(--sto-side-bg);
  color: #ffffff;
  padding: 24px;
}
body.fx-theme-studio.sto-portal .sto-list-top__hero .sto-ca-tile__kicker { color: var(--sto-lime); }
body.fx-theme-studio.sto-portal .sto-list-top__hero .sto-ca-tile__title {
  color: #ffffff;
  font-size: clamp(24px, 2.6vw, 32px);
  margin: 4px 0 6px;
}
body.fx-theme-studio.sto-portal .sto-list-top__hero .sto-ca-tile__lead {
  color: rgba(255, 255, 255, 0.7);
  margin: 0;
  max-width: 46ch;
}
body.fx-theme-studio.sto-portal .sto-ca-tile__hero-cta { flex-shrink: 0; }

body.fx-theme-studio.sto-portal .sto-ca-tile--stat {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 2px;
  text-decoration: none;
  color: var(--sto-ink);
}
body.fx-theme-studio.sto-portal .sto-ca-tile--stat:hover { border-color: var(--sto-ink); }
body.fx-theme-studio.sto-portal .sto-ca-tile--stat-mint {
  background: color-mix(in srgb, var(--color-soft-mint, #d5fced) 78%, var(--sto-card));
  border-color: color-mix(in srgb, var(--color-vivid-green, #00966e) 22%, var(--sto-line));
}
body.fx-theme-studio.sto-portal .sto-ca-tile--stat-sky {
  background: color-mix(in srgb, var(--color-sky-tint, #f5f2ff) 78%, var(--sto-card));
  border-color: color-mix(in srgb, var(--color-lavender, #794dff) 22%, var(--sto-line));
}
body.fx-theme-studio.sto-portal .sto-ca-tile__mega--sm { font-size: 30px; margin: 2px 0; }
body.fx-theme-studio.sto-portal .sto-ca-tile__meta {
  font-size: 12px;
  color: var(--sto-mute);
}
body.fx-theme-studio.sto-portal .sto-ca-tile--peach {
  background: var(--sto-mist);
}
body.fx-theme-studio.sto-portal .sto-ca-home__domain-visual {
  padding: 18px;
  background: linear-gradient(
    160deg,
    color-mix(in srgb, var(--color-peach, #fed7e1) 45%, var(--sto-mist)) 0%,
    color-mix(in srgb, var(--color-saffron, #fef3c7) 35%, var(--sto-mist)) 100%
  );
  border-radius: 0 20px 20px 0;
  display: flex;
  align-items: center;
  justify-content: center;
}
body.fx-theme-studio.sto-portal .sto-ca-home__domain-ui {
  width: 100%;
  max-width: 240px;
}
body.fx-theme-studio.sto-portal .sto-ca-tile__note {
  color: var(--sto-mute);
  font-size: 13px;
  margin: 0;
}

/* Toolbar + Classic filter button inside Studio portal */
body.fx-theme-studio.sto-portal .fx-portal-filters .fx-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  height: 36px;
  padding: 0 14px;
  border-radius: 999px;
  border: 1px solid var(--sto-line);
  background: var(--sto-card, var(--color-pure-white, #ffffff));
  color: var(--sto-ink);
  font-size: 12px;
  font-weight: 600;
}
body.fx-theme-studio.sto-portal .fx-portal-filters .dropdown-menu {
  border-radius: 14px;
  border: 1px solid var(--sto-line);
  box-shadow: 0 18px 40px -22px rgba(23, 21, 38, 0.25);
  padding: 6px;
}
body.fx-theme-studio.sto-portal .fx-portal-filters .dropdown-item {
  border-radius: 10px;
  font-size: 13px;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 10px;
  color: var(--sto-ink);
}
body.fx-theme-studio.sto-portal .fx-portal-filters .dropdown-item.active,
body.fx-theme-studio.sto-portal .fx-portal-filters .dropdown-item:hover {
  background: var(--sto-mist);
  color: var(--sto-ink);
}

/* DataTables chrome */
body.fx-theme-studio.sto-portal .sto-dt-top,
body.fx-theme-studio.sto-portal .fx-dt-top {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
  margin-bottom: 12px;
}
body.fx-theme-studio.sto-portal .dataTables_length label,
body.fx-theme-studio.sto-portal .dataTables_filter label {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin: 0;
  font-size: 12px;
  color: var(--sto-mute);
}
body.fx-theme-studio.sto-portal .dataTables_length select {
  height: 36px;
  padding: 0 10px;
}
body.fx-theme-studio.sto-portal .dataTables_filter input {
  height: 36px;
  padding: 0 14px;
  min-width: 210px;
}
body.fx-theme-studio.sto-portal .dataTables_filter input::placeholder { color: var(--sto-mute); }
body.fx-theme-studio.sto-portal .sto-dt-bottom,
body.fx-theme-studio.sto-portal .fx-dt-bottom {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
  margin-top: 14px;
}
body.fx-theme-studio.sto-portal .dataTables_info {
  font-size: 12px;
  color: var(--sto-mute);
}
body.fx-theme-studio.sto-portal .dataTables_paginate {
  display: inline-flex;
  gap: 4px;
}
body.fx-theme-studio.sto-portal .dataTables_paginate .paginate_button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 32px;
  height: 32px;
  padding: 0 10px;
  border-radius: 999px !important;
  border: 1px solid var(--sto-line) !important;
  background: var(--color-pure-white, #ffffff) !important;
  color: var(--sto-ink) !important;
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
  box-shadow: none !important;
}
body.fx-theme-studio.sto-portal .dataTables_paginate .paginate_button.current {
  background: var(--sto-side-bg) !important;
  border-color: var(--sto-side-bg) !important;
  color: #ffffff !important;
}
body.fx-theme-studio.sto-portal .dataTables_paginate .paginate_button.disabled {
  opacity: 0.4;
  pointer-events: none;
}
body.fx-theme-studio.sto-portal table.dataTable thead .sorting:before,
body.fx-theme-studio.sto-portal table.dataTable thead .sorting:after,
body.fx-theme-studio.sto-portal table.dataTable thead .sorting_asc:before,
body.fx-theme-studio.sto-portal table.dataTable thead .sorting_asc:after,
body.fx-theme-studio.sto-portal table.dataTable thead .sorting_desc:before,
body.fx-theme-studio.sto-portal table.dataTable thead .sorting_desc:after {
  color: var(--sto-magenta);
}

/* Services list — Studio rows (no DataTables) */
body.fx-theme-studio.sto-portal .sto-svc-list__bar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
  margin-bottom: 16px;
}
body.fx-theme-studio.sto-portal .sto-svc-tabs {
  display: inline-flex;
  gap: 6px;
  flex-wrap: wrap;
}
body.fx-theme-studio.sto-portal .sto-svc-tabs__pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  height: 34px;
  padding: 0 14px;
  border-radius: 999px;
  border: 1px solid var(--sto-line);
  background: var(--color-pure-white, #ffffff);
  color: var(--sto-mute);
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
  transition: color 0.15s ease, border-color 0.15s ease, background 0.15s ease;
}
body.fx-theme-studio.sto-portal .sto-svc-tabs__pill span {
  font-size: 11px;
  padding: 1px 7px;
  border-radius: 999px;
  background: var(--sto-mist);
  border: 1px solid var(--sto-line);
  color: var(--sto-mute);
}
body.fx-theme-studio.sto-portal .sto-svc-tabs__pill:hover { color: var(--sto-ink); border-color: var(--sto-ink); }
body.fx-theme-studio.sto-portal .sto-svc-tabs__pill.is-active {
  background: var(--sto-side-bg);
  border-color: var(--sto-side-bg);
  color: #ffffff;
}
body.fx-theme-studio.sto-portal .sto-svc-tabs__pill.is-active span {
  background: rgba(255, 255, 255, 0.14);
  border-color: transparent;
  color: var(--sto-lime);
}
body.fx-theme-studio.sto-portal .sto-svc-list__search {
  position: relative;
  margin: 0;
}
body.fx-theme-studio.sto-portal .sto-svc-list__search i {
  position: absolute;
  left: 14px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 12px;
  color: var(--sto-mute);
  pointer-events: none;
}
body.fx-theme-studio.sto-portal .sto-svc-list__search input {
  height: 38px;
  padding: 0 16px 0 36px;
  min-width: 240px;
  border-radius: 999px;
  border: 1px solid var(--sto-line);
  background: var(--color-pure-white, #ffffff);
  font-size: 13px;
  color: var(--sto-ink);
}
body.fx-theme-studio.sto-portal .sto-svc-list__search input:focus {
  outline: none;
  border-color: var(--sto-ink);
}
body.fx-theme-studio.sto-portal .sto-svc-list {
  display: grid;
  gap: 10px;
}
body.fx-theme-studio.sto-portal .sto-svc-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto 110px 32px;
  align-items: center;
  gap: 18px;
  padding: 16px 18px;
  border: 1px solid var(--sto-line);
  border-radius: 18px;
  background: var(--color-pure-white, #ffffff);
  text-decoration: none;
  color: var(--sto-ink);
  transition: border-color 0.15s ease, box-shadow 0.15s ease, transform 0.15s ease;
}
body.fx-theme-studio.sto-portal .sto-svc-row:hover {
  border-color: var(--sto-ink);
  box-shadow: 0 16px 34px -26px rgba(23, 21, 38, 0.4);
  transform: translateY(-1px);
}
/* display:grid would defeat the hidden attribute used by the list filter */
body.fx-theme-studio.sto-portal .sto-svc-row[hidden] { display: none !important; }

/* Services page: reuse home list aesthetic (badge + Ver detalhes) */
body.fx-theme-studio.sto-portal .sto-ca-home__list.sto-svc-list {
  gap: 0;
}
body.fx-theme-studio.sto-portal .sto-ca-home__list > .sto-svc-row {
  display: block;
  padding: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  transform: none;
  grid-template-columns: none;
  /* keep the service divider; override old card border */
  border-top: 0;
  border-left: 0;
  border-right: 0;
  border-bottom: 1px solid var(--sto-line);
}
body.fx-theme-studio.sto-portal .sto-ca-home__list > .sto-svc-row:last-child {
  border-bottom: 0;
}
body.fx-theme-studio.sto-portal .sto-ca-home__list > .sto-svc-row:hover {
  box-shadow: none;
  transform: none;
}
body.fx-theme-studio.sto-portal .sto-svc-page__stack .sto-ca-home__pills.sto-svc-tabs {
  display: inline-flex;
}
body.fx-theme-studio.sto-portal .sto-svc-row__main { min-width: 0; }
body.fx-theme-studio.sto-portal .sto-svc-row__name {
  display: block;
  font-weight: 600;
  font-size: 14px;
}
body.fx-theme-studio.sto-portal .sto-svc-row__domain {
  display: block;
  font-size: 12px;
  color: var(--sto-mute);
  margin-top: 2px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
body.fx-theme-studio.sto-portal .sto-svc-row__price {
  text-align: right;
}
body.fx-theme-studio.sto-portal .sto-svc-row__price strong {
  display: block;
  font-weight: 600;
  font-size: 14px;
}
body.fx-theme-studio.sto-portal .sto-svc-row__price small,
body.fx-theme-studio.sto-portal .sto-svc-row__due small {
  display: block;
  font-size: 11px;
  color: var(--sto-mute);
}
body.fx-theme-studio.sto-portal .sto-svc-row__due {
  text-align: right;
}
body.fx-theme-studio.sto-portal .sto-svc-row__due span {
  display: block;
  font-size: 13px;
  font-weight: 500;
}
body.fx-theme-studio.sto-portal .sto-svc-row .sto-status { justify-self: center; }
body.fx-theme-studio.sto-portal .sto-svc-row__go {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  border-radius: 999px;
  background: var(--sto-mist);
  border: 1px solid var(--sto-line);
  color: var(--sto-ink);
  font-size: 11px;
  opacity: 0;
  transition: opacity 0.15s ease, background 0.15s ease;
}
body.fx-theme-studio.sto-portal .sto-svc-row:hover .sto-svc-row__go {
  opacity: 1;
  background: var(--sto-lime);
  border-color: var(--sto-lime);
}
body.fx-theme-studio.sto-portal .sto-svc-list__none {
  text-align: center;
  color: var(--sto-mute);
  font-size: 13px;
  padding: 22px 0 8px;
  margin: 0;
}
/* Row variants: domains (checkbox) and tickets (no price column) */
body.fx-theme-studio.sto-portal .sto-svc-row--check {
  grid-template-columns: auto minmax(0, 1fr) auto auto 110px 32px;
  cursor: pointer;
}
body.fx-theme-studio.sto-portal .sto-svc-row--tkt {
  grid-template-columns: minmax(0, 1fr) auto 110px 32px;
}
body.fx-theme-studio.sto-portal .sto-svc-row--qt {
  grid-template-columns: minmax(0, 1fr) auto 110px auto;
  cursor: pointer;
}
body.fx-theme-studio.sto-portal .sto-svc-row__dl { margin: 0; }
body.fx-theme-studio.sto-portal .sto-svc-row__check {
  width: 16px;
  height: 16px;
  accent-color: var(--sto-ink);
  cursor: pointer;
}
body.fx-theme-studio.sto-portal .sto-svc-row__name--mono {
  font-family: ui-monospace, "SF Mono", "Cascadia Code", Menlo, monospace;
  letter-spacing: -0.01em;
}
body.fx-theme-studio.sto-portal .sto-svc-row__name.is-unread { font-weight: 700; }
body.fx-theme-studio.sto-portal .sto-svc-row__name .sto-dot { margin-right: 4px; }
body.fx-theme-studio.sto-portal .sto-svc-row__chip {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  margin-top: 4px;
  padding: 1px 9px;
  border-radius: 999px;
  border: 1px solid var(--sto-line);
  background: var(--sto-mist);
  font-size: 11px;
  color: var(--sto-mute);
}
body.fx-theme-studio.sto-portal .sto-svc-row__chip i { font-size: 9px; }
body.fx-theme-studio.sto-portal .sto-svc-row__chip.is-on {
  color: #00966e;
  background: #edfbf5;
  border-color: #c8f0df;
}
body.fx-theme-studio.sto-portal .sto-dom-page__bulk {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 14px;
}

@media (max-width: 860px) {
  body.fx-theme-studio.sto-portal .sto-svc-row,
  body.fx-theme-studio.sto-portal .sto-svc-row--check,
  body.fx-theme-studio.sto-portal .sto-svc-row--tkt {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px 16px;
  }
  body.fx-theme-studio.sto-portal .sto-svc-row__main { flex: 1 1 55%; min-width: 0; }
  body.fx-theme-studio.sto-portal .sto-svc-row .sto-status { margin-left: auto; }
  body.fx-theme-studio.sto-portal .sto-svc-row__price,
  body.fx-theme-studio.sto-portal .sto-svc-row__due { text-align: left; }
  body.fx-theme-studio.sto-portal .sto-svc-row__go { display: none; }
  /* Keep home-style service rows as block list items on small screens */
  body.fx-theme-studio.sto-portal .sto-ca-home__list > .sto-svc-row {
    display: block;
    flex-wrap: unset;
    gap: 0;
  }
  body.fx-theme-studio.sto-portal .sto-ca-home__list > .sto-svc-row[hidden] {
    display: none !important;
  }
  body.fx-theme-studio.sto-portal .sto-ca-home__list > .sto-svc-row .sto-ca-home__list-link {
    flex-wrap: wrap;
    align-items: flex-start;
  }
  body.fx-theme-studio.sto-portal .sto-ca-home__list > .sto-svc-row .sto-ca-home__list-actions {
    width: 100%;
    justify-content: flex-start;
  }
}

/* Empty state (shared portal include) inside Studio */
body.fx-theme-studio.sto-portal .fx-empty-state,
body.fx-theme-studio.sto-portal .sto-svc-page__empty {
  text-align: center;
  padding: 32px 16px;
  color: var(--sto-mute);
}

@media (max-width: 1100px) {
  body.fx-theme-studio.sto-portal .sto-list-top {
    grid-template-columns: 1fr 1fr;
  }
  body.fx-theme-studio.sto-portal .sto-list-top__hero {
    grid-column: 1 / -1;
    flex-direction: column;
    align-items: flex-start;
  }
}
@media (max-width: 640px) {
  body.fx-theme-studio.sto-portal .sto-list-top { grid-template-columns: 1fr; }
  body.fx-theme-studio.sto-portal .sto-svc-list__bar {
    flex-direction: column;
    align-items: stretch;
  }
  body.fx-theme-studio.sto-portal .sto-svc-list__search input {
    width: 100%;
    min-width: 0;
  }
}

/* ============================================================
   29. STUDIO CA — HOSTING PERSONALITY (dashboard)
   ============================================================ */
body.fx-theme-studio.sto-portal .sto-dash__head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}

/* Status dot + pulse */
@keyframes sto-pulse {
  0% { box-shadow: 0 0 0 0 rgba(16, 185, 129, 0.45); }
  70% { box-shadow: 0 0 0 6px rgba(16, 185, 129, 0); }
  100% { box-shadow: 0 0 0 0 rgba(16, 185, 129, 0); }
}
body.fx-theme-studio.sto-portal .sto-dot {
  display: inline-block;
  width: 8px;
  height: 8px;
  border-radius: 999px;
  flex-shrink: 0;
}
body.fx-theme-studio.sto-portal .sto-dot--ok {
  background: #10b981;
  animation: sto-pulse 2.2s ease-out infinite;
}
body.fx-theme-studio.sto-portal .sto-dot--warn { background: #f59e0b; }
body.fx-theme-studio.sto-portal .sto-dot--danger { background: var(--color-notion-blue, #fa2f62); }

body.fx-theme-studio.sto-portal .sto-sys-status {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  height: 36px;
  padding: 0 16px;
  border-radius: 999px;
  border: 1px solid color-mix(in srgb, var(--color-vivid-green, #00966e) 28%, transparent);
  background: var(--color-soft-mint, #edfbf5);
  color: var(--color-vivid-green, #00966e);
  font-size: 12px;
  font-weight: 600;
  text-decoration: none;
  transition: border-color 0.15s ease;
}
body.fx-theme-studio.sto-portal .sto-sys-status:hover {
  border-color: var(--color-vivid-green, #10b981);
  color: var(--color-vivid-green, #00966e);
}
body.fx-theme-studio.sto-portal .sto-sys-status i { font-size: 10px; }

/* Stat card footer link line (replaces "last updated") */
body.fx-theme-studio.sto-portal .sto-stat__foot {
  margin: 10px 0 0;
  font-size: 12px;
  font-weight: 600;
  color: var(--sto-mute);
  display: flex;
  align-items: center;
  gap: 6px;
}
body.fx-theme-studio.sto-portal .sto-stat__foot i {
  font-size: 10px;
  transition: transform 0.15s ease;
}
body.fx-theme-studio.sto-portal a.sto-stat:hover .sto-stat__foot { color: var(--sto-ink); }
body.fx-theme-studio.sto-portal a.sto-stat:hover .sto-stat__foot i { transform: translateX(3px); }
body.fx-theme-studio.sto-portal .sto-stat--dark .sto-stat__foot { color: rgba(255, 255, 255, 0.55); }
body.fx-theme-studio.sto-portal a.sto-stat--dark:hover .sto-stat__foot { color: var(--sto-lime); }

/* "running" pill on the dark stack card */
body.fx-theme-studio.sto-portal .sto-dash-pill--live {
  background: rgba(151, 246, 117, 0.14);
  color: var(--sto-lime);
  border-color: transparent;
}

/* Service list rows: status dot + monospace domain */
body.fx-theme-studio.sto-portal .sto-ca-home__list-main {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
}
body.fx-theme-studio.sto-portal .sto-ca-home__list-text small {
  font-family: ui-monospace, "SF Mono", "Cascadia Code", Menlo, monospace;
  font-size: 11px;
  letter-spacing: 0;
}

/* Deploy band */
body.fx-theme-studio.sto-portal .sto-deploy { grid-column: 1 / -1; }
body.fx-theme-studio.sto-portal .sto-deploy__kicker {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--sto-magenta);
  margin: 0 0 10px;
}
body.fx-theme-studio.sto-portal .sto-deploy__row {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}
body.fx-theme-studio.sto-portal .sto-deploy__card {
  display: grid;
  gap: 2px;
  padding: 16px 18px;
  border: 1px dashed var(--sto-line);
  border-radius: 18px;
  background: transparent;
  text-decoration: none;
  color: var(--sto-ink);
  transition: border-color 0.15s ease, background 0.15s ease, transform 0.15s ease;
}
body.fx-theme-studio.sto-portal .sto-deploy__card i {
  font-size: 16px;
  color: var(--sto-mute);
  margin-bottom: 6px;
  transition: color 0.15s ease;
}
body.fx-theme-studio.sto-portal .sto-deploy__card b {
  font-size: 13px;
  font-weight: 600;
}
body.fx-theme-studio.sto-portal .sto-deploy__card small {
  font-size: 11px;
  color: var(--sto-mute);
}
body.fx-theme-studio.sto-portal .sto-deploy__card:hover {
  border: 1px solid var(--sto-ink);
  background: var(--color-pure-white, #ffffff);
  transform: translateY(-2px);
}
body.fx-theme-studio.sto-portal .sto-deploy__card:hover i { color: var(--sto-magenta); }

@media (max-width: 1100px) {
  body.fx-theme-studio.sto-portal .sto-deploy__row { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 640px) {
  body.fx-theme-studio.sto-portal .sto-deploy__row { grid-template-columns: 1fr; }
  body.fx-theme-studio.sto-portal .sto-sys-status { height: 32px; padding: 0 12px; }
}

/* ============================================================
   30. STUDIO CA — FORM PAGES (addfunds / details / contacts / security / status)
   ============================================================ */

/* Standalone hero tiles (outside .sto-list-top) — same ink band as list pages */
body.fx-theme-studio.sto-portal .fx-af-page__hero,
body.fx-theme-studio.sto-portal .sto-ad-page__hero,
body.fx-theme-studio.sto-portal .fx-sec-page__hero,
body.fx-theme-studio.sto-portal .fx-ct-page__hero,
body.fx-theme-studio.sto-portal .fx-fwd-page__hero,
body.fx-theme-studio.sto-portal .fx-aff-page__hero,
body.fx-theme-studio.sto-portal .fx-upgrade-page__hero {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  flex-wrap: wrap;
  padding: 24px;
  margin-bottom: 16px;
  background: var(--sto-side-bg);
  border-color: var(--sto-ink);
}
body.fx-theme-studio.sto-portal .fx-af-page__hero .sto-ca-tile__kicker,
body.fx-theme-studio.sto-portal .sto-ad-page__hero .sto-ca-tile__kicker,
body.fx-theme-studio.sto-portal .fx-sec-page__hero .sto-ca-tile__kicker,
body.fx-theme-studio.sto-portal .fx-ct-page__hero .sto-ca-tile__kicker,
body.fx-theme-studio.sto-portal .fx-fwd-page__hero .sto-ca-tile__kicker,
body.fx-theme-studio.sto-portal .fx-aff-page__hero .sto-ca-tile__kicker,
body.fx-theme-studio.sto-portal .fx-upgrade-page__hero .sto-ca-tile__kicker { color: var(--sto-lime); }
body.fx-theme-studio.sto-portal .fx-af-page__hero .sto-ca-tile__title,
body.fx-theme-studio.sto-portal .sto-ad-page__hero .sto-ca-tile__title,
body.fx-theme-studio.sto-portal .fx-sec-page__hero .sto-ca-tile__title,
body.fx-theme-studio.sto-portal .fx-ct-page__hero .sto-ca-tile__title,
body.fx-theme-studio.sto-portal .fx-fwd-page__hero .sto-ca-tile__title,
body.fx-theme-studio.sto-portal .fx-aff-page__hero .sto-ca-tile__title,
body.fx-theme-studio.sto-portal .fx-upgrade-page__hero .sto-ca-tile__title {
  color: #ffffff;
  font-size: clamp(24px, 2.6vw, 32px);
  margin: 4px 0 6px;
}
body.fx-theme-studio.sto-portal .fx-af-page__hero .sto-ca-tile__lead,
body.fx-theme-studio.sto-portal .sto-ad-page__hero .sto-ca-tile__lead,
body.fx-theme-studio.sto-portal .fx-sec-page__hero .sto-ca-tile__lead,
body.fx-theme-studio.sto-portal .fx-ct-page__hero .sto-ca-tile__lead,
body.fx-theme-studio.sto-portal .fx-fwd-page__hero .sto-ca-tile__lead,
body.fx-theme-studio.sto-portal .fx-aff-page__hero .sto-ca-tile__lead,
body.fx-theme-studio.sto-portal .fx-upgrade-page__hero .sto-ca-tile__lead {
  color: rgba(255, 255, 255, 0.7);
  margin: 0;
  max-width: 52ch;
}
/* Ghost buttons legible on the ink hero */
body.fx-theme-studio.sto-portal .fx-af-page__hero .st-btn--ghost,
body.fx-theme-studio.sto-portal .sto-ad-page__hero .st-btn--ghost,
body.fx-theme-studio.sto-portal .fx-sec-page__hero .st-btn--ghost,
body.fx-theme-studio.sto-portal .fx-ct-page__hero .st-btn--ghost,
body.fx-theme-studio.sto-portal .fx-fwd-page__hero .st-btn--ghost,
body.fx-theme-studio.sto-portal .fx-aff-page__hero .st-btn--ghost,
body.fx-theme-studio.sto-portal .fx-upgrade-page__hero .st-btn--ghost,
body.fx-theme-studio.sto-portal .sto-list-top__hero .st-btn--ghost {
  background: transparent;
  color: #ffffff;
  border-color: rgba(255, 255, 255, 0.35);
}
body.fx-theme-studio.sto-portal .fx-af-page__hero .st-btn--ghost:hover,
body.fx-theme-studio.sto-portal .sto-ad-page__hero .st-btn--ghost:hover,
body.fx-theme-studio.sto-portal .fx-sec-page__hero .st-btn--ghost:hover,
body.fx-theme-studio.sto-portal .fx-ct-page__hero .st-btn--ghost:hover,
body.fx-theme-studio.sto-portal .fx-fwd-page__hero .st-btn--ghost:hover,
body.fx-theme-studio.sto-portal .fx-aff-page__hero .st-btn--ghost:hover,
body.fx-theme-studio.sto-portal .fx-upgrade-page__hero .st-btn--ghost:hover,
body.fx-theme-studio.sto-portal .sto-list-top__hero .st-btn--ghost:hover {
  border-color: var(--sto-lime);
  color: var(--sto-lime);
  background: transparent;
}
/* Primary CTA on ink hero: lime pill so label never blends into theme accent */
body.fx-theme-studio.sto-portal .sto-ca-tile__hero-cta .st-btn--primary,
body.fx-theme-studio.sto-portal .sto-ca-tile__hero-cta .st-btn--lime,
body.fx-theme-studio.sto-portal .sto-list-top__hero .st-btn--primary,
body.fx-theme-studio.sto-portal .sto-ca-tile--hero .st-btn--primary {
  background: var(--sto-lime) !important;
  border: 1px solid var(--sto-lime) !important;
  color: #043422 !important;
  box-shadow: none;
}
body.fx-theme-studio.sto-portal .sto-ca-tile__hero-cta .st-btn--primary:hover,
body.fx-theme-studio.sto-portal .sto-ca-tile__hero-cta .st-btn--lime:hover,
body.fx-theme-studio.sto-portal .sto-list-top__hero .st-btn--primary:hover,
body.fx-theme-studio.sto-portal .sto-ca-tile--hero .st-btn--primary:hover {
  background: #aef98f !important;
  border-color: #aef98f !important;
  color: #043422 !important;
  transform: translateY(-1px);
}
body.fx-theme-studio.sto-portal .sto-ca-tile__hero-cta .st-btn--primary i,
body.fx-theme-studio.sto-portal .sto-ca-tile__hero-cta .st-btn--lime i,
body.fx-theme-studio.sto-portal .sto-list-top__hero .st-btn--primary i,
body.fx-theme-studio.sto-portal .sto-ca-tile--hero .st-btn--primary i {
  color: inherit !important;
}
body.fx-theme-studio.sto-portal .sto-ca-tile__hero-cta {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  flex-shrink: 0;
}

/* ---- Form primitives (override Classic portal.css skin) ---- */
body.fx-theme-studio.sto-portal .fx-input-group {
  display: grid;
  gap: 6px;
  align-content: start;
}
body.fx-theme-studio.sto-portal .fx-label {
  font-size: 12px;
  font-weight: 600;
  color: var(--sto-mute);
  letter-spacing: 0.01em;
  margin: 0;
}
body.fx-theme-studio.sto-portal .fx-input,
body.fx-theme-studio.sto-portal .sto-ad-page__select select,
body.fx-theme-studio.sto-portal .sto-ad-page__custom input[type="text"],
body.fx-theme-studio.sto-portal .sto-ad-page__custom select,
body.fx-theme-studio.sto-portal .sto-ad-page__custom textarea {
  width: 100%;
  height: 42px;
  padding: 0 14px;
  border-radius: 12px;
  border: 1px solid var(--sto-line);
  background: var(--color-pure-white, #ffffff);
  color: var(--sto-ink);
  font-size: 14px;
  font-family: inherit;
  box-shadow: none;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
body.fx-theme-studio.sto-portal textarea.fx-input,
body.fx-theme-studio.sto-portal .sto-ad-page__custom textarea {
  height: auto;
  min-height: 96px;
  padding: 10px 14px;
}
body.fx-theme-studio.sto-portal .fx-input:focus,
body.fx-theme-studio.sto-portal .sto-ad-page__select select:focus,
body.fx-theme-studio.sto-portal .sto-ad-page__custom input:focus,
body.fx-theme-studio.sto-portal .sto-ad-page__custom select:focus {
  outline: none;
  border-color: var(--sto-ink);
  box-shadow: 0 0 0 3px rgba(23, 21, 38, 0.08);
}
body.fx-theme-studio.sto-portal .fx-input:disabled {
  background: var(--sto-mist);
  color: var(--sto-mute);
  cursor: not-allowed;
}
body.fx-theme-studio.sto-portal select.fx-input,
body.fx-theme-studio.sto-portal .sto-ad-page__select select {
  appearance: none;
  -webkit-appearance: none;
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%2356546b' stroke-width='1.6' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 14px center;
  padding-right: 36px;
}
body.fx-theme-studio.sto-portal .fx-checkbox {
  width: 16px;
  height: 16px;
  accent-color: var(--sto-ink);
}

/* Shared field grids */
body.fx-theme-studio.sto-portal .sto-ad-page__fields {
  display: grid;
  gap: 14px;
}
body.fx-theme-studio.sto-portal .sto-ad-page__fields--2 {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}
body.fx-theme-studio.sto-portal .sto-ad-page__span-2 { grid-column: 1 / -1; }
body.fx-theme-studio.sto-portal .sto-ad-page__checks {
  display: grid;
  gap: 10px;
}
body.fx-theme-studio.sto-portal .sto-ad-page__check {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 0;
  padding: 10px 14px;
  border: 1px solid var(--sto-line);
  border-radius: 12px;
  background: var(--color-pure-white, #ffffff);
  font-size: 13px;
  color: var(--sto-ink);
  cursor: pointer;
  transition: border-color 0.15s ease;
}
body.fx-theme-studio.sto-portal .sto-ad-page__check:hover { border-color: var(--sto-ink); }
body.fx-theme-studio.sto-portal .sto-ad-page__req { color: var(--sto-magenta); }

/* Action rows */
body.fx-theme-studio.sto-portal .sto-ad-page__actions,
body.fx-theme-studio.sto-portal .fx-ct-page__actions,
body.fx-theme-studio.sto-portal .fx-af-page__actions,
body.fx-theme-studio.sto-portal .fx-sec-page__inline-actions {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  align-items: center;
}
body.fx-theme-studio.sto-portal .sto-ad-page__actions,
body.fx-theme-studio.sto-portal .fx-ct-page__actions { grid-column: 1 / -1; }
body.fx-theme-studio.sto-portal .st-btn.st-btn-danger {
  color: #c81e4a;
  border-color: #fecdd3;
}
body.fx-theme-studio.sto-portal .st-btn.st-btn-danger:hover {
  background: #fff1f4;
  border-color: #c81e4a;
}

/* ---- Add funds ---- */
body.fx-theme-studio.sto-portal .sto-ca-tile__heading i { color: var(--sto-magenta); }
body.fx-theme-studio.sto-portal a.fx-af-page__stat {
  background: var(--sto-side-bg);
  border-color: var(--sto-ink);
}
body.fx-theme-studio.sto-portal a.fx-af-page__stat .sto-ca-tile__kicker { color: var(--sto-lime); }
body.fx-theme-studio.sto-portal a.fx-af-page__stat .sto-ca-tile__mega { color: #ffffff; }
body.fx-theme-studio.sto-portal a.fx-af-page__stat .sto-ca-tile__meta { color: rgba(255, 255, 255, 0.6); }
body.fx-theme-studio.sto-portal div.fx-af-page__stat { background: var(--sto-mist); }
body.fx-theme-studio.sto-portal .fx-af-page__panel--form { grid-column: 1 / span 3; }
body.fx-theme-studio.sto-portal .fx-af-page__aside { grid-column: 4; align-self: start; }
body.fx-theme-studio.sto-portal .fx-af-page__form .sto-ad-page__fields {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: end;
}
body.fx-theme-studio.sto-portal .fx-af-page__actions,
body.fx-theme-studio.sto-portal .fx-af-page__note { grid-column: 1 / -1; }
body.fx-theme-studio.sto-portal .fx-af-page__note {
  font-size: 12px;
  color: var(--sto-mute);
  margin: 4px 0 0;
}
body.fx-theme-studio.sto-portal .fx-af-page__limit { font-size: 24px; }

/* ---- Account details ---- */
body.fx-theme-studio.sto-portal .sto-ca-home__grid.sto-ad-page__grid,
body.fx-theme-studio.sto-portal .sto-ad-page__grid {
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) 300px;
}
@media (min-width: 1101px) {
  body.fx-theme-studio.sto-portal .sto-ad-page__aside { grid-column: 3; grid-row: 1; align-self: start; }
  body.fx-theme-studio.sto-portal .sto-ad-page__panel--billing,
  body.fx-theme-studio.sto-portal .sto-ad-page__panel--extra,
  body.fx-theme-studio.sto-portal .sto-ad-page__panel--emails,
  body.fx-theme-studio.sto-portal .sto-ad-page__panel--marketing { grid-column: span 2; }
}

/* ---- Contacts ---- */
body.fx-theme-studio.sto-portal .fx-ct-page__panel--profile,
body.fx-theme-studio.sto-portal .fx-ct-page__panel--address,
body.fx-theme-studio.sto-portal .sto-ad-page__panel--profile,
body.fx-theme-studio.sto-portal .sto-ad-page__panel--address,
body.fx-theme-studio.sto-portal .fx-sec-page__panel--questions-lead {
  grid-column: auto;
}
body.fx-theme-studio.sto-portal .fx-ct-page__picker { margin-bottom: 16px; }
body.fx-theme-studio.sto-portal .fx-ct-page__picker-row {
  display: flex;
  gap: 10px;
  align-items: center;
}
body.fx-theme-studio.sto-portal .fx-ct-page__picker-row select { flex: 1; }
body.fx-theme-studio.sto-portal .sto-ca-home__grid.fx-ct-page__grid,
body.fx-theme-studio.sto-portal .fx-ct-page__grid {
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) 300px;
}
@media (min-width: 1101px) {
  body.fx-theme-studio.sto-portal .fx-ct-page__aside { grid-column: 3; grid-row: 1; align-self: start; }
  body.fx-theme-studio.sto-portal .fx-ct-page__panel--emails { grid-column: span 2; }
}

/* ---- Change password ---- */
body.fx-theme-studio.sto-portal .sto-pw-page .progress {
  height: 8px;
  border-radius: 999px;
  background: var(--sto-mist);
  border: 1px solid var(--sto-line);
  margin-top: 8px;
  overflow: hidden;
}
body.fx-theme-studio.sto-portal .sto-pw-page .progress-bar {
  height: 100%;
  width: 0%;
  border-radius: 999px;
  background: transparent;
  transition: width 0.25s ease, background-color 0.25s ease;
}
body.fx-theme-studio.sto-portal .sto-pw-page .progress-bar.bg-danger { background: #e5484d; }
body.fx-theme-studio.sto-portal .sto-pw-page .progress-bar.bg-warning { background: #f5a623; }
body.fx-theme-studio.sto-portal .sto-pw-page .progress-bar.bg-success { background: #2fbf71; }
body.fx-theme-studio.sto-portal .sto-pw-page .fx-input.is-invalid { border-color: #e5484d; }
body.fx-theme-studio.sto-portal .sto-pw-page .fx-input.is-warning { border-color: #f5a623; }
body.fx-theme-studio.sto-portal .sto-pw-page .fx-input.is-valid { border-color: #2fbf71; }
body.fx-theme-studio.sto-portal .sto-pw-page .progress .sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
}

/* Password field with show/hide eye */
body.fx-theme-studio.sto-portal .fx-pw-field { position: relative; }
body.fx-theme-studio.sto-portal .fx-pw-field .fx-input {
  width: 100%;
  padding-right: 46px;
}
body.fx-theme-studio.sto-portal .fx-pw-eye {
  position: absolute;
  top: 50%;
  right: 8px;
  transform: translateY(-50%);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border: 0;
  border-radius: 10px;
  background: transparent;
  color: var(--sto-mute);
  cursor: pointer;
}
body.fx-theme-studio.sto-portal .sto-pw-gen-hint {
  margin: 0;
  padding: 10px 12px;
  border-radius: 12px;
  border: 1px solid rgba(245, 166, 35, 0.35);
  background: rgba(245, 166, 35, 0.1);
  color: var(--sto-ink);
  font-size: 12.5px;
  font-weight: 500;
}
body.fx-theme-studio.sto-portal .sto-pw-gen-hint[hidden] { display: none !important; }
body.fx-theme-studio.sto-portal .sto-pw-page #inputNewPassword2Msg {
  font-size: 12px;
  margin-top: 6px;
}
body.fx-theme-studio.sto-portal .sto-pw-page .fx-input-group br { display: none; }
body.fx-theme-studio.sto-portal .sto-pw-page .alert {
  border-radius: 14px;
  border: 1px solid var(--sto-line);
  background: var(--sto-mist);
  color: var(--sto-mute);
  padding: 12px 14px;
  margin: 0;
}
body.fx-theme-studio.sto-portal .sto-pw-page .alert i { color: var(--sto-magenta); }

/* Generate password modal (Studio skin) */
body.fx-theme-studio.sto-portal .modal-content {
  border-radius: 18px;
  border: 1px solid var(--sto-line);
  box-shadow: 0 30px 80px -30px rgba(23, 21, 38, 0.45);
}
body.fx-theme-studio.sto-portal .modal-header,
body.fx-theme-studio.sto-portal .modal-footer { border-color: var(--sto-line); }
body.fx-theme-studio.sto-portal .modal-title { font-weight: 600; color: var(--sto-ink); }
body.fx-theme-studio.sto-portal #modalGeneratePassword .progress {
  height: 8px;
  border-radius: 999px;
  background: var(--sto-mist);
  border: 1px solid var(--sto-line);
  overflow: hidden;
}
body.fx-theme-studio.sto-portal #modalGeneratePassword #generatedPassword {
  font-family: ui-monospace, "SF Mono", "Cascadia Code", Menlo, monospace;
  text-align: center;
}
body.fx-theme-studio.sto-portal .modal-footer .btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  height: 40px;
  padding: 0 18px;
  border-radius: 999px;
  font-size: 13px;
  font-weight: 600;
  border: 1px solid var(--sto-line);
  background: var(--color-pure-white, #ffffff);
  color: var(--sto-ink);
}
body.fx-theme-studio.sto-portal .modal-footer .btn-primary {
  background: var(--sto-side-bg);
  border-color: var(--sto-side-bg);
  color: #ffffff;
}

/* ---- User security ---- */
body.fx-theme-studio.sto-portal .sto-ca-home__grid.fx-sec-page__grid,
body.fx-theme-studio.sto-portal .fx-sec-page__grid {
  grid-template-columns: minmax(0, 1fr) 260px;
  gap: 16px;
  align-items: start;
}
body.fx-theme-studio.sto-portal .fx-sec-page .sto-sec-check {
  grid-column: 1 / -1;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
}
body.fx-theme-studio.sto-portal .fx-sec-page__panel,
body.fx-theme-studio.sto-portal .fx-sec-page__panel--2fa,
body.fx-theme-studio.sto-portal .fx-sec-page__panel--questions,
body.fx-theme-studio.sto-portal .fx-sec-page__panel--questions-lead,
body.fx-theme-studio.sto-portal .fx-sec-page__panel--linked {
  grid-column: 1;
  overflow: visible;
  padding: 0;
}
body.fx-theme-studio.sto-portal .sto-pw-page .fx-sec-page__grid {
  grid-template-columns: minmax(0, 1fr) 260px;
}
body.fx-theme-studio.sto-portal .sto-pw-page .fx-sec-page__panel { grid-column: 1; }
@media (min-width: 1101px) {
  body.fx-theme-studio.sto-portal .fx-sec-page__aside {
    grid-column: 2;
    grid-row: 2;
    align-self: start;
  }
  body.fx-theme-studio.sto-portal .fx-sec-page__panel--questions,
  body.fx-theme-studio.sto-portal .fx-sec-page__panel--linked {
    grid-column: 1 / -1;
  }
  body.fx-theme-studio.sto-portal .sto-pw-page .fx-sec-page__aside {
    grid-column: 2;
    grid-row: 1;
  }
}
body.fx-theme-studio.sto-portal .fx-sec-page__body { display: grid; gap: 12px; }
body.fx-theme-studio.sto-portal .fx-sec-page__lead {
  margin: 0;
  font-size: 14px;
  color: var(--sto-mute);
}
body.fx-theme-studio.sto-portal .fx-sec-page__lead strong { color: var(--sto-ink); }
body.fx-theme-studio.sto-portal .fx-sec-page__linked-table { overflow-x: auto; }

/* ---- Server status ---- */
body.fx-theme-studio.sto-portal .fx-ss-page__banner {
  grid-column: 1 / -1;
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 14px 18px;
  border-radius: 16px;
  font-size: 14px;
  font-weight: 500;
}
body.fx-theme-studio.sto-portal .fx-ss-page__banner--ok {
  background: #edfbf5;
  border: 1px solid #c8f0df;
  color: #00966e;
}
body.fx-theme-studio.sto-portal .fx-ss-page__banner--info {
  background: var(--sto-mist);
  border: 1px solid var(--sto-line);
  color: var(--sto-ink);
}
body.fx-theme-studio.sto-portal .fx-ss-page__banner .st-btn { margin-left: auto; }
body.fx-theme-studio.sto-portal .fx-ss-page__stack { grid-column: 1 / -1; }
body.fx-theme-studio.sto-portal .fx-ss-page__issues { grid-column: 1 / span 3; }
body.fx-theme-studio.sto-portal .fx-ss-page__aside { grid-column: 4; align-self: start; }
body.fx-theme-studio.sto-portal .fx-ss-page__views {
  display: inline-flex;
  gap: 6px;
  flex-wrap: wrap;
}
body.fx-theme-studio.sto-portal .fx-ss-page__view {
  display: inline-flex;
  align-items: center;
  height: 34px;
  padding: 0 14px;
  border-radius: 999px;
  border: 1px solid var(--sto-line);
  background: var(--color-pure-white, #ffffff);
  color: var(--sto-mute);
  font-size: 12px;
  font-weight: 600;
  text-decoration: none;
  transition: color 0.15s ease, border-color 0.15s ease, background 0.15s ease;
}
body.fx-theme-studio.sto-portal .fx-ss-page__view:hover { color: var(--sto-ink); border-color: var(--sto-ink); }
body.fx-theme-studio.sto-portal .fx-ss-page__view.is-active {
  background: var(--sto-side-bg);
  border-color: var(--sto-side-bg);
  color: #ffffff;
}
body.fx-theme-studio.sto-portal .fx-ss-table__name {
  font-family: ui-monospace, "SF Mono", "Cascadia Code", Menlo, monospace;
  font-size: 13px;
  font-weight: 500;
}
body.fx-theme-studio.sto-portal .fx-ss-table__link { color: var(--sto-magenta); text-decoration: none; }
body.fx-theme-studio.sto-portal .fx-ss-issue {
  padding: 16px 0;
  border-top: 1px solid var(--sto-line);
}
body.fx-theme-studio.sto-portal .fx-ss-issue:first-child { border-top: 0; padding-top: 0; }
body.fx-theme-studio.sto-portal .fx-ss-issue__head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 12px;
}
body.fx-theme-studio.sto-portal .fx-ss-issue__title {
  margin: 0;
  font-size: 15px;
  font-weight: 600;
  color: var(--sto-ink);
}
body.fx-theme-studio.sto-portal .fx-ss-issue__status {
  font-weight: 500;
  color: var(--sto-mute);
}
body.fx-theme-studio.sto-portal .fx-ss-issue__affecting {
  margin: 6px 0 0;
  font-size: 13px;
  color: var(--sto-mute);
}
body.fx-theme-studio.sto-portal .fx-ss-issue__meta {
  display: flex;
  gap: 16px;
  flex-wrap: wrap;
  list-style: none;
  margin: 8px 0 0;
  padding: 0;
  font-size: 12px;
  color: var(--sto-mute);
}
body.fx-theme-studio.sto-portal .fx-ss-issue__body {
  margin-top: 10px;
  font-size: 14px;
  line-height: 1.55;
  color: var(--sto-ink);
}
body.fx-theme-studio.sto-portal .fx-ss-page__empty {
  text-align: center;
  padding: 32px 16px;
  color: var(--sto-mute);
}
body.fx-theme-studio.sto-portal .fx-ss-page__empty i {
  display: block;
  font-size: 26px;
  color: #10b981;
  margin-bottom: 10px;
}
body.fx-theme-studio.sto-portal .fx-ss-page__pager {
  display: flex;
  gap: 8px;
  margin-top: 14px;
}
body.fx-theme-studio.sto-portal .fx-ss-page__pager .is-disabled {
  opacity: 0.4;
  pointer-events: none;
}

@media (max-width: 1100px) {
  body.fx-theme-studio.sto-portal .sto-ca-home__grid.sto-ad-page__grid,
  body.fx-theme-studio.sto-portal .sto-ca-home__grid.fx-sec-page__grid,
  body.fx-theme-studio.sto-portal .sto-ca-home__grid.fx-ct-page__grid,
  body.fx-theme-studio.sto-portal .sto-ca-home__grid.fx-af-page__grid,
  body.fx-theme-studio.sto-portal .sto-ca-home__grid.fx-ss-page__grid,
  body.fx-theme-studio.sto-portal .sto-ad-page__grid,
  body.fx-theme-studio.sto-portal .fx-ct-page__grid,
  body.fx-theme-studio.sto-portal .fx-sec-page__grid,
  body.fx-theme-studio.sto-portal .sto-pw-page .fx-sec-page__grid {
    grid-template-columns: minmax(0, 1fr);
  }
  body.fx-theme-studio.sto-portal .sto-ca-home__grid.sto-ad-page__grid > *,
  body.fx-theme-studio.sto-portal .sto-ca-home__grid.fx-sec-page__grid > *,
  body.fx-theme-studio.sto-portal .sto-ca-home__grid.fx-ct-page__grid > *,
  body.fx-theme-studio.sto-portal .sto-ca-home__grid.fx-af-page__grid > *,
  body.fx-theme-studio.sto-portal .sto-ca-home__grid.fx-ss-page__grid > * {
    grid-column: 1 / -1;
    grid-row: auto;
  }
  body.fx-theme-studio.sto-portal .sto-ad-page__aside,
  body.fx-theme-studio.sto-portal .fx-ct-page__aside,
  body.fx-theme-studio.sto-portal .fx-af-page__aside,
  body.fx-theme-studio.sto-portal .fx-sec-page__aside,
  body.fx-theme-studio.sto-portal .sto-pw-page .fx-sec-page__aside,
  body.fx-theme-studio.sto-portal .fx-ss-page__aside,
  body.fx-theme-studio.sto-portal .sto-ad-page__panel--billing,
  body.fx-theme-studio.sto-portal .sto-ad-page__panel--extra,
  body.fx-theme-studio.sto-portal .sto-ad-page__panel--emails,
  body.fx-theme-studio.sto-portal .sto-ad-page__panel--marketing,
  body.fx-theme-studio.sto-portal .fx-ct-page__panel--emails,
  body.fx-theme-studio.sto-portal .fx-af-page__panel--form,
  body.fx-theme-studio.sto-portal .fx-sec-page__panel,
  body.fx-theme-studio.sto-portal .fx-sec-page__panel--2fa,
  body.fx-theme-studio.sto-portal .fx-sec-page__panel--questions,
  body.fx-theme-studio.sto-portal .fx-sec-page__panel--questions-lead,
  body.fx-theme-studio.sto-portal .fx-sec-page__panel--linked,
  body.fx-theme-studio.sto-portal .fx-ss-page__issues {
    grid-column: 1 / -1;
    grid-row: auto;
  }
}

/* Reveal tiles must stay visible on form pages (no scroll-trigger dependency) */
body.fx-theme-studio.sto-portal .sto-ad-page .fx-reveal,
body.fx-theme-studio.sto-portal .fx-sec-page .fx-reveal,
body.fx-theme-studio.sto-portal .fx-ct-page .fx-reveal,
body.fx-theme-studio.sto-portal .fx-af-page .fx-reveal,
body.fx-theme-studio.sto-portal .fx-ss-page .fx-reveal {
  opacity: 1;
  transform: none;
}
@media (max-width: 640px) {
  body.fx-theme-studio.sto-portal .sto-ad-page__fields--2 { grid-template-columns: 1fr; }
  body.fx-theme-studio.sto-portal .fx-ct-page__picker-row { flex-direction: column; align-items: stretch; }
}

/* ============================================================
   31. STUDIO CA — REWORKED FORM PAGE COMPONENTS
   ============================================================ */

/* Add funds: quick amount pills */
body.fx-theme-studio.sto-portal .fx-af-page__quick {
  display: grid;
  gap: 8px;
  margin-bottom: 16px;
}
body.fx-theme-studio.sto-portal .fx-af-page__quick-row {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
}
body.fx-theme-studio.sto-portal a.sto-svc-tabs__pill {
  text-decoration: none;
}

/* Hero identity (account details) */
body.fx-theme-studio.sto-portal .sto-hero-id {
  display: flex;
  align-items: center;
  gap: 18px;
  min-width: 0;
}
body.fx-theme-studio.sto-portal .sto-hero-orb {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 56px;
  height: 56px;
  border-radius: 999px;
  background: var(--sto-lime);
  color: #043422;
  font-family: var(--font-inter);
  font-size: 20px;
  font-weight: 600;
  letter-spacing: 0;
  flex-shrink: 0;
}
body.fx-theme-studio.sto-portal .sto-hero-chips {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  margin-top: 8px;
}
body.fx-theme-studio.sto-portal .sto-hero-chip {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 4px 12px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.1);
  border: 1px solid rgba(255, 255, 255, 0.14);
  color: rgba(255, 255, 255, 0.85);
  font-size: 12px;
}
body.fx-theme-studio.sto-portal .sto-hero-chip i {
  font-size: 10px;
  color: var(--sto-lime);
}

/* Contacts picker pills */
body.fx-theme-studio.sto-portal .sto-ct-picker {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  margin-bottom: 16px;
}
body.fx-theme-studio.sto-portal .sto-ct-picker__new {
  border-style: dashed;
}
body.fx-theme-studio.sto-portal .sto-ct-picker__new i { font-size: 10px; }

/* Security checklist strip */
body.fx-theme-studio.sto-portal .sto-sec-check {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}
body.fx-theme-studio.sto-portal .sto-sec-check__item {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 14px 18px;
  border: 1px solid var(--sto-line);
  border-radius: 18px;
  background: var(--color-pure-white, #ffffff);
  text-decoration: none;
  color: var(--sto-ink);
  box-shadow: 0 14px 32px -24px rgba(23, 21, 38, 0.18);
  transition: border-color 0.15s ease;
}
body.fx-theme-studio.sto-portal a.sto-sec-check__item:hover { border-color: var(--sto-ink); }
body.fx-theme-studio.sto-portal .sto-sec-check__text b {
  display: block;
  font-size: 13px;
  font-weight: 600;
}
body.fx-theme-studio.sto-portal .sto-sec-check__text small {
  font-size: 12px;
  color: var(--sto-mute);
}
body.fx-theme-studio.sto-portal .sto-sec-check__text small i { font-size: 9px; }

/* Server status rows */
body.fx-theme-studio.sto-portal .sto-srv-list {
  display: grid;
  gap: 10px;
}
body.fx-theme-studio.sto-portal .sto-srv-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) repeat(5, auto) auto;
  align-items: center;
  gap: 18px;
  padding: 14px 18px;
  border: 1px solid var(--sto-line);
  border-radius: 18px;
  background: var(--color-pure-white, #ffffff);
}
body.fx-theme-studio.sto-portal .sto-srv-row__name {
  display: flex;
  align-items: center;
  gap: 10px;
  font-family: ui-monospace, "SF Mono", "Cascadia Code", Menlo, monospace;
  font-size: 13px;
  font-weight: 500;
  color: var(--sto-ink);
  min-width: 0;
}
body.fx-theme-studio.sto-portal .sto-srv-row__cell {
  display: grid;
  gap: 2px;
  text-align: center;
}
body.fx-theme-studio.sto-portal .sto-srv-row__cell small {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--sto-mute);
}
body.fx-theme-studio.sto-portal .sto-srv-row__val {
  font-size: 13px;
  color: var(--sto-ink);
}
body.fx-theme-studio.sto-portal .sto-srv-row__php {
  font-size: 12px;
  font-weight: 600;
  color: var(--sto-magenta);
  text-decoration: none;
  white-space: nowrap;
}
body.fx-theme-studio.sto-portal .sto-srv-row__php i { font-size: 9px; }

@media (max-width: 1100px) {
  body.fx-theme-studio.sto-portal .sto-sec-check { grid-template-columns: 1fr; }
}
@media (max-width: 860px) {
  body.fx-theme-studio.sto-portal .sto-srv-row {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  body.fx-theme-studio.sto-portal .sto-srv-row__name { grid-column: 1 / -1; }
  body.fx-theme-studio.sto-portal .sto-srv-row__php { grid-column: 1 / -1; justify-self: start; }
}

/* ============================================================
   32. STUDIO CA — SUBMIT TICKET
   ============================================================ */
body.fx-theme-studio.sto-portal .sto-tkt-submit__meta {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
@media (max-width: 860px) {
  body.fx-theme-studio.sto-portal .sto-tkt-submit__meta {
    grid-template-columns: 1fr;
  }
}
body.fx-theme-studio.sto-portal .sto-tkt-submit__confirm-hero {
  grid-column: 1 / -1;
}
body.fx-theme-studio.sto-portal .sto-tkt-submit .sto-ca-tile__lead strong {
  color: #ffffff;
  font-weight: 600;
}
body.fx-theme-studio.sto-portal textarea.fx-input--area,
body.fx-theme-studio.sto-portal .sto-tkt-submit textarea.fx-input {
  min-height: 160px;
  resize: vertical;
  line-height: 1.5;
  padding-top: 12px;
  padding-bottom: 12px;
}

/* Department picker rows */
body.fx-theme-studio.sto-portal .sto-dept-list {
  display: grid;
  gap: 10px;
}
body.fx-theme-studio.sto-portal .sto-dept-row {
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr) auto;
  align-items: center;
  gap: 14px;
  padding: 14px 16px;
  border: 1px solid var(--sto-line);
  border-radius: 18px;
  background: var(--color-pure-white, #ffffff);
  text-decoration: none;
  color: var(--sto-ink);
  transition: border-color 0.15s ease, transform 0.15s ease;
}
body.fx-theme-studio.sto-portal .sto-dept-row:hover {
  border-color: var(--sto-ink);
  transform: translateY(-1px);
}
body.fx-theme-studio.sto-portal .sto-dept-row__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  border-radius: 14px;
  background: var(--sto-mist);
  color: var(--sto-magenta);
  font-size: 16px;
}
body.fx-theme-studio.sto-portal .sto-dept-row__main {
  display: grid;
  gap: 2px;
  min-width: 0;
}
body.fx-theme-studio.sto-portal .sto-dept-row__name {
  font-size: 15px;
  font-weight: 600;
}
body.fx-theme-studio.sto-portal .sto-dept-row__desc {
  font-size: 13px;
  color: var(--sto-mute);
}
body.fx-theme-studio.sto-portal .sto-dept-row__desc.is-muted { opacity: 0.7; }
body.fx-theme-studio.sto-portal .sto-dept-row__go {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border-radius: 999px;
  background: var(--sto-mist);
  color: var(--sto-ink);
  font-size: 12px;
}
body.fx-theme-studio.sto-portal .sto-dept-row:hover .sto-dept-row__go {
  background: var(--sto-side-bg);
  color: #ffffff;
}

/* Attachments */
body.fx-theme-studio.sto-portal .sto-tkt-attach__row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}
body.fx-theme-studio.sto-portal .sto-tkt-attach__file {
  position: relative;
  flex: 1 1 220px;
  min-width: 0;
}
body.fx-theme-studio.sto-portal .sto-tkt-attach__file .custom-file-label {
  display: flex;
  align-items: center;
  height: 44px;
  padding: 0 14px;
  border: 1px solid var(--sto-line);
  border-radius: 14px;
  background: var(--color-pure-white, #ffffff);
  color: var(--sto-mute);
  font-size: 13px;
  cursor: pointer;
  margin: 0;
}
body.fx-theme-studio.sto-portal .sto-tkt-attach__file .custom-file-input {
  position: absolute;
  inset: 0;
  opacity: 0;
  cursor: pointer;
  width: 100%;
  height: 100%;
}
body.fx-theme-studio.sto-portal .sto-tkt-attach__hint {
  margin: 6px 0 0;
  font-size: 12px;
  color: var(--sto-mute);
}

/* Custom fields from WHMCS (form-control markup) */
body.fx-theme-studio.sto-portal .sto-tkt-custom .form-control,
body.fx-theme-studio.sto-portal .sto-tkt-custom input[type="text"],
body.fx-theme-studio.sto-portal .sto-tkt-custom input[type="email"],
body.fx-theme-studio.sto-portal .sto-tkt-custom input[type="number"],
body.fx-theme-studio.sto-portal .sto-tkt-custom select,
body.fx-theme-studio.sto-portal .sto-tkt-custom textarea {
  width: 100%;
  height: 44px;
  padding: 0 14px;
  border: 1px solid var(--sto-line);
  border-radius: 14px;
  background: var(--color-pure-white, #ffffff);
  color: var(--sto-ink);
  font-size: 14px;
}
body.fx-theme-studio.sto-portal .sto-tkt-custom textarea {
  height: auto;
  min-height: 96px;
  padding-top: 12px;
  padding-bottom: 12px;
}

/* KB suggestions injected by WHMCS */
body.fx-theme-studio.sto-portal .sto-tkt-kb:not(.w-hidden) {
  display: grid;
  gap: 8px;
  padding: 14px;
  border: 1px solid var(--sto-line);
  border-radius: 16px;
  background: var(--sto-mist);
}
body.fx-theme-studio.sto-portal .sto-tkt-kb a {
  color: var(--sto-ink);
  font-weight: 500;
  text-decoration: none;
}
body.fx-theme-studio.sto-portal .sto-tkt-kb a:hover { color: var(--sto-magenta); }

@media (max-width: 1100px) {
  body.fx-theme-studio.sto-portal .sto-tkt-submit__panel {
    grid-column: auto;
  }
}
@media (max-width: 640px) {
  body.fx-theme-studio.sto-portal .sto-dept-row {
    grid-template-columns: 40px minmax(0, 1fr);
  }
  body.fx-theme-studio.sto-portal .sto-dept-row__go { display: none; }
}

/* ============================================================
   33. STUDIO CA — VIEW TICKET
   ============================================================ */
body.fx-theme-studio.sto-portal .sto-view-ticket__alerts {
  grid-column: 1 / -1;
  display: grid;
  gap: 10px;
}
body.fx-theme-studio.sto-portal .sto-view-ticket__thread-panel {
  grid-column: 1;
}
body.fx-theme-studio.sto-portal .sto-view-ticket__reply {
  grid-column: 1 / -1;
}
body.fx-theme-studio.sto-portal .sto-view-ticket .sto-ca-tile__lead {
  max-width: 52ch;
}
body.fx-theme-studio.sto-portal .sto-view-ticket .sto-hero-chips {
  margin-top: 12px;
}

/* Thread messages */
body.fx-theme-studio.sto-portal .sto-view-ticket__thread {
  display: grid;
  gap: 12px;
}
body.fx-theme-studio.sto-portal .sto-msg {
  display: grid;
  gap: 12px;
  padding: 16px 18px;
  border: 1px solid var(--sto-line);
  border-radius: 18px;
  background: var(--color-pure-white, #ffffff);
}
body.fx-theme-studio.sto-portal .sto-msg.is-staff {
  background: #f7f8fc;
  border-color: #e4e7f0;
}
body.fx-theme-studio.sto-portal .sto-msg__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
}
body.fx-theme-studio.sto-portal .sto-msg__author {
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
}
body.fx-theme-studio.sto-portal .sto-msg__orb {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: 14px;
  background: var(--sto-side-bg);
  color: #ffffff;
  font-size: 14px;
  font-weight: 600;
  flex-shrink: 0;
}
body.fx-theme-studio.sto-portal .sto-msg.is-staff .sto-msg__orb {
  background: var(--sto-magenta);
}
body.fx-theme-studio.sto-portal .sto-view-ticket .fx-view-ticket__avatar,
body.fx-theme-studio.sto-portal .sto-view-ticket .fx-view-ticket__avatar-img {
  width: 40px;
  height: 40px;
  border-radius: 14px;
  object-fit: cover;
  flex-shrink: 0;
}
body.fx-theme-studio.sto-portal .sto-msg__who {
  display: grid;
  gap: 2px;
  min-width: 0;
}
body.fx-theme-studio.sto-portal .sto-msg__who strong {
  font-size: 14px;
  color: var(--sto-ink);
}
body.fx-theme-studio.sto-portal .sto-msg__who .posted-on {
  font-size: 12px;
  color: var(--sto-mute);
}
body.fx-theme-studio.sto-portal .sto-msg__badge {
  display: inline-flex;
  align-items: center;
  height: 26px;
  padding: 0 10px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  background: var(--sto-mist);
  color: var(--sto-mute);
  border: 1px solid var(--sto-line);
}
body.fx-theme-studio.sto-portal .sto-msg.is-staff .sto-msg__badge {
  background: rgba(232, 72, 152, 0.1);
  border-color: rgba(232, 72, 152, 0.25);
  color: var(--sto-magenta);
}
body.fx-theme-studio.sto-portal .sto-msg__body {
  font-size: 14px;
  line-height: 1.6;
  color: var(--sto-ink);
  overflow-wrap: anywhere;
}
body.fx-theme-studio.sto-portal .sto-msg__body p { margin: 0 0 0.75em; }
body.fx-theme-studio.sto-portal .sto-msg__body p:last-child { margin-bottom: 0; }
body.fx-theme-studio.sto-portal .sto-msg__ip {
  margin: 12px 0 0;
  font-size: 12px;
  color: var(--sto-mute);
}
body.fx-theme-studio.sto-portal .sto-msg__rating { margin-top: 12px; }
body.fx-theme-studio.sto-portal .sto-msg__rating .star {
  display: inline-block;
  width: 16px;
  height: 16px;
  margin-right: 2px;
  cursor: pointer;
  background: currentColor;
  color: #d4d4d8;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2l3.09 6.26L22 9.27l-5 4.87L18.18 22 12 18.56 5.82 22 7 14.14 2 9.27l6.91-1.01L12 2z'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2l3.09 6.26L22 9.27l-5 4.87L18.18 22 12 18.56 5.82 22 7 14.14 2 9.27l6.91-1.01L12 2z'/%3E%3C/svg%3E") center / contain no-repeat;
}
body.fx-theme-studio.sto-portal .sto-msg__rating .star.active,
body.fx-theme-studio.sto-portal .sto-msg__rating .rating:hover .star,
body.fx-theme-studio.sto-portal .sto-msg__rating .star:hover,
body.fx-theme-studio.sto-portal .sto-msg__rating .star:hover ~ .star {
  color: #f5a623;
}
body.fx-theme-studio.sto-portal .sto-msg__attach {
  padding-top: 10px;
  border-top: 1px solid var(--sto-line);
  font-size: 13px;
}
body.fx-theme-studio.sto-portal .sto-msg__attach strong {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: var(--sto-ink);
}
body.fx-theme-studio.sto-portal .sto-msg__attach-gone { color: var(--sto-mute); }
body.fx-theme-studio.sto-portal .sto-msg__attach .attachment-list {
  list-style: none;
  margin: 8px 0 0;
  padding: 0;
  display: grid;
  gap: 6px;
}
body.fx-theme-studio.sto-portal .sto-msg__attach a {
  color: var(--sto-magenta);
  text-decoration: none;
  font-weight: 500;
}
body.fx-theme-studio.sto-portal .sto-msg__attach a:hover { text-decoration: underline; }

/* Aside meta */
body.fx-theme-studio.sto-portal .sto-view-ticket__meta {
  list-style: none;
  margin: 0 0 14px;
  padding: 0;
  display: grid;
  gap: 10px;
}
body.fx-theme-studio.sto-portal .sto-view-ticket__meta li {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  font-size: 13px;
  color: var(--sto-ink);
}
body.fx-theme-studio.sto-portal .sto-view-ticket__meta i {
  width: 14px;
  margin-top: 2px;
  color: var(--sto-mute);
  text-align: center;
}
body.fx-theme-studio.sto-portal .sto-view-ticket__meta small {
  display: block;
  color: var(--sto-mute);
  font-size: 11px;
  margin-top: 2px;
}

/* CC block inside Studio */
body.fx-theme-studio.sto-portal .sto-view-ticket__cc-wrap {
  padding-top: 12px;
  border-top: 1px solid rgba(23, 21, 38, 0.08);
}
body.fx-theme-studio.sto-portal .sto-view-ticket .fx-view-ticket__panel-title {
  margin: 0 0 10px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--sto-mute);
}
body.fx-theme-studio.sto-portal .sto-view-ticket .fx-view-ticket__cc-list {
  display: grid;
  gap: 6px;
  margin-bottom: 10px;
}
body.fx-theme-studio.sto-portal .sto-view-ticket .ticket-cc-item,
body.fx-theme-studio.sto-portal .sto-view-ticket .list-group-item {
  padding: 0;
  border: 0;
  background: transparent;
}
body.fx-theme-studio.sto-portal .sto-view-ticket .ticket-cc-email {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 8px 10px;
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.55);
  border: 1px solid rgba(23, 21, 38, 0.08);
  font-size: 12px;
}
body.fx-theme-studio.sto-portal .sto-view-ticket .fx-view-ticket__cc-add {
  display: flex;
  gap: 6px;
}
body.fx-theme-studio.sto-portal .sto-view-ticket #inputAddCcEmail,
body.fx-theme-studio.sto-portal .sto-view-ticket .fx-contact-field__input {
  flex: 1;
  min-width: 0;
  height: 40px;
  padding: 0 12px;
  border: 1px solid var(--sto-line);
  border-radius: 12px;
  background: var(--color-pure-white, #ffffff);
  font-size: 13px;
}
body.fx-theme-studio.sto-portal .sto-view-ticket #btnAddCcEmail {
  height: 40px;
  padding: 0 14px;
  border-radius: 999px;
  border: 1px solid var(--sto-line);
  background: var(--color-pure-white, #ffffff);
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
}

/* Reply-as chip */
body.fx-theme-studio.sto-portal .sto-view-ticket__reply-as {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 14px;
  border-radius: 14px;
  border: 1px solid var(--sto-line);
  background: var(--sto-mist);
}
body.fx-theme-studio.sto-portal .sto-view-ticket__reply-as-label {
  display: block;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--sto-mute);
}
body.fx-theme-studio.sto-portal .sto-view-ticket__reply-as strong {
  display: block;
  font-size: 14px;
  color: var(--sto-ink);
}
body.fx-theme-studio.sto-portal .sto-view-ticket__reply-as small {
  font-size: 12px;
  color: var(--sto-mute);
}

/* Status variants used on tickets */
body.fx-theme-studio.sto-portal .sto-status--closed,
body.fx-theme-studio.sto-portal .sto-status--answered { opacity: 0.85; }
body.fx-theme-studio.sto-portal .sto-dot--mute {
  background: #a1a1aa;
  box-shadow: 0 0 0 4px rgba(161, 161, 170, 0.15);
}

@media (max-width: 1100px) {
  body.fx-theme-studio.sto-portal .sto-view-ticket__thread-panel,
  body.fx-theme-studio.sto-portal .sto-view-ticket__reply {
    grid-column: auto;
  }
}



/* ============================================================
   32b. STUDIO CA — AFFILIATES
   ============================================================ */
body.fx-theme-studio.sto-portal .sto-aff-page .sto-ca-home__grid,
body.fx-theme-studio.sto-portal .sto-aff-page__grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 260px;
  gap: 16px;
  align-items: start;
}
body.fx-theme-studio.sto-portal .sto-aff-page .sto-list-top,
body.fx-theme-studio.sto-portal .sto-aff-page__alerts {
  grid-column: 1 / -1;
}
body.fx-theme-studio.sto-portal .sto-aff-page__link { grid-column: 1; }
body.fx-theme-studio.sto-portal .sto-aff-page__balance { grid-column: 2; }
body.fx-theme-studio.sto-portal .sto-aff-page__stack { grid-column: 1; }
body.fx-theme-studio.sto-portal .sto-aff-page__aside {
  grid-column: 2;
  align-self: start;
}
body.fx-theme-studio.sto-portal .sto-aff-page--signup .sto-aff-page__stack { grid-column: 1; }
body.fx-theme-studio.sto-portal .sto-aff-page__link-field {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
}
body.fx-theme-studio.sto-portal .sto-aff-page__link-field .fx-input {
  flex: 1 1 220px;
  min-width: 0;
  font-family: ui-monospace, "SF Mono", Menlo, monospace;
  font-size: 13px;
}
body.fx-theme-studio.sto-portal .sto-aff-page__withdraw {
  margin-top: 14px;
}
body.fx-theme-studio.sto-portal .sto-aff-page__withdraw .st-btn {
  width: 100%;
  justify-content: center;
}
body.fx-theme-studio.sto-portal .sto-aff-page__withdraw .st-btn.is-disabled,
body.fx-theme-studio.sto-portal .sto-aff-page__withdraw .st-btn:disabled {
  opacity: 0.45;
  pointer-events: none;
}
body.fx-theme-studio.sto-portal .sto-aff-page__empty {
  padding: 8px 0 4px;
}
body.fx-theme-studio.sto-portal .sto-aff-page__empty p { margin: 0 0 6px; }
body.fx-theme-studio.sto-portal .sto-aff-page__product { font-weight: 500; }
body.fx-theme-studio.sto-portal .sto-aff-page__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 8px;
}
body.fx-theme-studio.sto-portal .sto-aff-page__bullets {
  margin: 0 0 16px;
  padding: 0 0 0 18px;
  display: grid;
  gap: 8px;
  font-size: 14px;
  color: var(--sto-ink);
  line-height: 1.45;
}
body.fx-theme-studio.sto-portal .sto-aff-page__aside .sto-ca-tile__note {
  margin: 0 0 12px;
  font-size: 13px;
  color: var(--sto-mute);
  line-height: 1.45;
}
body.fx-theme-studio.sto-portal .sto-aff-page__banners {
  font-size: 13px;
  color: var(--sto-ink);
  line-height: 1.45;
  overflow: auto;
}
body.fx-theme-studio.sto-portal .sto-aff-page__banners img {
  max-width: 100%;
  height: auto;
  border-radius: 12px;
}
@media (max-width: 1100px) {
  body.fx-theme-studio.sto-portal .sto-aff-page .sto-ca-home__grid,
  body.fx-theme-studio.sto-portal .sto-aff-page__grid {
    grid-template-columns: 1fr;
  }
  body.fx-theme-studio.sto-portal .sto-aff-page__link,
  body.fx-theme-studio.sto-portal .sto-aff-page__balance,
  body.fx-theme-studio.sto-portal .sto-aff-page__stack,
  body.fx-theme-studio.sto-portal .sto-aff-page__aside {
    grid-column: auto;
  }
}


/* ============================================================
   33a. STUDIO CA — CANCEL SERVICE
   ============================================================ */
body.fx-theme-studio.sto-portal .sto-cancel-page .sto-ca-home__grid,
body.fx-theme-studio.sto-portal .sto-cancel-page__grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 260px;
  gap: 16px;
  align-items: start;
}
body.fx-theme-studio.sto-portal .sto-cancel-page .sto-list-top {
  grid-column: 1 / -1;
}
body.fx-theme-studio.sto-portal .sto-cancel-page__stack { grid-column: 1; }
body.fx-theme-studio.sto-portal .sto-cancel-page__aside {
  grid-column: 2;
  align-self: start;
}
body.fx-theme-studio.sto-portal .sto-cancel-page__form {
  display: grid;
  gap: 18px;
}
body.fx-theme-studio.sto-portal .sto-cancel-page__fields {
  display: grid;
  gap: 16px;
}
body.fx-theme-studio.sto-portal .sto-cancel-page__types {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}
body.fx-theme-studio.sto-portal .sto-cancel-page__type {
  display: block;
  margin: 0;
  cursor: pointer;
}
body.fx-theme-studio.sto-portal .sto-cancel-page__type input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}
body.fx-theme-studio.sto-portal .sto-cancel-page__type-card {
  display: grid;
  gap: 6px;
  min-height: 110px;
  padding: 16px;
  border: 1px solid var(--sto-line);
  border-radius: 16px;
  background: var(--color-pure-white, #ffffff);
  transition: border-color 0.15s ease, box-shadow 0.15s ease, background 0.15s ease;
}
body.fx-theme-studio.sto-portal .sto-cancel-page__type-card i {
  font-size: 14px;
  color: var(--sto-magenta);
}
body.fx-theme-studio.sto-portal .sto-cancel-page__type-card b {
  font-size: 14px;
  font-weight: 600;
  color: var(--sto-ink);
}
body.fx-theme-studio.sto-portal .sto-cancel-page__type-card small {
  font-size: 12px;
  color: var(--sto-mute);
  line-height: 1.4;
}
body.fx-theme-studio.sto-portal .sto-cancel-page__type:hover .sto-cancel-page__type-card {
  border-color: var(--sto-ink);
}
body.fx-theme-studio.sto-portal .sto-cancel-page__type input:checked + .sto-cancel-page__type-card {
  border-color: var(--sto-ink);
  box-shadow: 0 0 0 1px var(--sto-ink);
  background: var(--sto-mist);
}
body.fx-theme-studio.sto-portal .sto-cancel-page__domain-warn {
  padding: 14px 16px;
  border-radius: 16px;
  border: 1px solid rgba(245, 166, 35, 0.35);
  background: rgba(245, 166, 35, 0.1);
  display: grid;
  gap: 10px;
}
body.fx-theme-studio.sto-portal .sto-cancel-page__domain-warn-head {
  display: flex;
  align-items: center;
  gap: 8px;
  color: #b45309;
  font-size: 13px;
}
body.fx-theme-studio.sto-portal .sto-cancel-page__domain-warn p {
  margin: 0;
  font-size: 13px;
  color: var(--sto-ink);
  line-height: 1.45;
}
body.fx-theme-studio.sto-portal .sto-cancel-page__check {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  font-size: 13px;
  font-weight: 500;
  color: var(--sto-ink);
  cursor: pointer;
}
body.fx-theme-studio.sto-portal .sto-cancel-page__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 4px;
}
body.fx-theme-studio.sto-portal .sto-cancel-page__aside .sto-ca-tile__note {
  margin: 0 0 12px;
  font-size: 13px;
  color: var(--sto-mute);
  line-height: 1.45;
}
body.fx-theme-studio.sto-portal .sto-cancel-page__tips {
  list-style: none;
  margin: 0 0 14px;
  padding: 0;
  display: grid;
  gap: 10px;
}
body.fx-theme-studio.sto-portal .sto-cancel-page__tips li {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  font-size: 13px;
  color: var(--sto-ink);
  line-height: 1.4;
}
body.fx-theme-studio.sto-portal .sto-cancel-page__tips i {
  margin-top: 2px;
  color: var(--sto-magenta);
  font-size: 12px;
}
body.fx-theme-studio.sto-portal .sto-cancel-page__tips a {
  color: var(--sto-magenta);
  font-weight: 600;
  text-decoration: none;
}
body.fx-theme-studio.sto-portal .sto-cancel-page__tips a:hover { text-decoration: underline; }
@media (max-width: 1100px) {
  body.fx-theme-studio.sto-portal .sto-cancel-page .sto-ca-home__grid,
  body.fx-theme-studio.sto-portal .sto-cancel-page__grid {
    grid-template-columns: 1fr;
  }
  body.fx-theme-studio.sto-portal .sto-cancel-page__stack,
  body.fx-theme-studio.sto-portal .sto-cancel-page__aside {
    grid-column: auto;
  }
}
@media (max-width: 640px) {
  body.fx-theme-studio.sto-portal .sto-cancel-page__types {
    grid-template-columns: 1fr;
  }
}


/* ============================================================
   33b. STUDIO CA — UPGRADE / CONFIG OPTIONS
   ============================================================ */
body.fx-theme-studio.sto-portal .sto-up-page .sto-ca-home__grid,
body.fx-theme-studio.sto-portal .sto-up-page__grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 16px;
  align-items: start;
}
body.fx-theme-studio.sto-portal .sto-up-page .sto-list-top,
body.fx-theme-studio.sto-portal .sto-up-page__alerts,
body.fx-theme-studio.sto-portal .sto-up-page__stack,
body.fx-theme-studio.sto-portal .sto-up-page__packages {
  grid-column: 1 / -1;
}
body.fx-theme-studio.sto-portal .sto-up-page__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 8px;
}
body.fx-theme-studio.sto-portal .sto-up-page__packages {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 16px;
}
body.fx-theme-studio.sto-portal .sto-up-card {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 14px;
}
body.fx-theme-studio.sto-portal .sto-up-card--sky { background: #eef6ff; border-color: #d3e7ff; }
body.fx-theme-studio.sto-portal .sto-up-card--mint { background: #f0fdf1; border-color: #d3f6d8; }
body.fx-theme-studio.sto-portal .sto-up-card--lilac { background: #f5f0ff; border-color: #e4d9ff; }
body.fx-theme-studio.sto-portal .sto-up-card--peach { background: #fff4e8; border-color: #f3d9bf; }
body.fx-theme-studio.sto-portal .sto-up-card__kicker {
  display: block;
  margin: 0 0 4px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--sto-mute);
}
body.fx-theme-studio.sto-portal .sto-up-card__title {
  margin: 0;
  font-size: 20px;
  font-weight: 500;
  letter-spacing: -0.02em;
  color: var(--sto-ink);
}
body.fx-theme-studio.sto-portal .sto-up-card__desc {
  font-size: 13px;
  color: var(--sto-mute);
  line-height: 1.45;
}
body.fx-theme-studio.sto-portal .sto-up-card__form {
  display: grid;
  gap: 14px;
  margin-top: auto;
}
body.fx-theme-studio.sto-portal .sto-up-card__price {
  display: grid;
  gap: 2px;
}
body.fx-theme-studio.sto-portal .sto-up-card__price b {
  font-size: 24px;
  font-weight: 500;
  letter-spacing: -0.03em;
  color: var(--sto-ink);
}
body.fx-theme-studio.sto-portal .sto-up-card__price span {
  font-size: 12px;
  color: var(--sto-mute);
}

/* Config options rows (current → new) */
body.fx-theme-studio.sto-portal .sto-up-config {
  display: grid;
  gap: 18px;
}
body.fx-theme-studio.sto-portal .sto-up-config__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 12px;
}
body.fx-theme-studio.sto-portal .sto-up-config__row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 28px minmax(0, 1fr);
  gap: 14px;
  align-items: center;
  padding: 16px 18px;
  border: 1px solid var(--sto-line);
  border-radius: 18px;
  background: var(--color-pure-white, #ffffff);
}
body.fx-theme-studio.sto-portal .sto-up-config__meta {
  display: grid;
  gap: 6px;
  min-width: 0;
}
body.fx-theme-studio.sto-portal .sto-up-config__meta b {
  font-size: 14px;
  font-weight: 600;
  color: var(--sto-ink);
}
body.fx-theme-studio.sto-portal .sto-up-config__current {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  max-width: 100%;
  padding: 4px 10px;
  border-radius: 999px;
  background: var(--sto-mist);
  border: 1px solid var(--sto-line);
  font-size: 12px;
  font-weight: 500;
  color: var(--sto-mute);
  word-break: break-word;
}
body.fx-theme-studio.sto-portal .sto-up-config__arrow {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--sto-mute);
  font-size: 12px;
}
body.fx-theme-studio.sto-portal .sto-up-config__new {
  display: grid;
  gap: 6px;
  min-width: 0;
}
body.fx-theme-studio.sto-portal .sto-up-config__new .fx-input,
body.fx-theme-studio.sto-portal .sto-up-config__new select.fx-input {
  width: 100%;
  max-width: none;
}
body.fx-theme-studio.sto-portal .sto-up-config__check {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 14px;
  border: 1px solid var(--sto-line);
  border-radius: 14px;
  background: var(--sto-mist);
  font-size: 13px;
  font-weight: 500;
  color: var(--sto-ink);
  cursor: pointer;
}
body.fx-theme-studio.sto-portal .sto-up-config__check:has(input:checked) {
  border-color: var(--sto-ink);
  background: var(--color-pure-white, #ffffff);
}
body.fx-theme-studio.sto-portal .sto-up-config__qty {
  display: flex;
  align-items: center;
  gap: 10px;
}
body.fx-theme-studio.sto-portal .sto-up-config__qty .fx-input {
  width: 96px;
  flex: 0 0 96px;
}
body.fx-theme-studio.sto-portal .sto-up-config__qty span {
  font-size: 13px;
  color: var(--sto-mute);
}
body.fx-theme-studio.sto-portal .sto-up-card.is-recommended {
  border-color: var(--sto-ink);
  box-shadow: 0 0 0 1px var(--sto-ink);
}
body.fx-theme-studio.sto-portal .sto-up-card.is-current { opacity: 0.92; }
body.fx-theme-studio.sto-portal .sto-up-card__badge {
  position: absolute;
  top: 14px;
  right: 14px;
  padding: 4px 10px;
  border-radius: 999px;
  background: var(--sto-side-bg);
  color: #ffffff;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
body.fx-theme-studio.sto-portal .sto-up-card__badge--mute {
  background: var(--sto-mist);
  color: var(--sto-mute);
  border: 1px solid var(--sto-line);
}
body.fx-theme-studio.sto-portal .sto-up-card__features {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 0;
}
body.fx-theme-studio.sto-portal .sto-up-card__features li {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  padding: 8px 0;
  border-bottom: 1px solid rgba(23, 21, 38, 0.08);
  font-size: 13px;
  color: var(--sto-ink);
}
body.fx-theme-studio.sto-portal .sto-up-card__features li:last-child { border-bottom: 0; }
body.fx-theme-studio.sto-portal .sto-up-card__features span { color: var(--sto-mute); }
body.fx-theme-studio.sto-portal .sto-up-card__features i.fa-check { color: #00966e; }
body.fx-theme-studio.sto-portal .sto-up-card__features i.fa-times { color: #c81e4a; }

/* Billing cycle picker on upgrade cards */
body.fx-theme-studio.sto-portal .sto-up-page .fx-billing-cycle__grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
  gap: 8px;
}
body.fx-theme-studio.sto-portal .sto-up-page .fx-upgrade-card__cycle-label {
  display: block;
  margin: 0 0 8px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--sto-mute);
}
body.fx-theme-studio.sto-portal .sto-up-page .fx-billing-cycle__card {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
  min-height: 96px;
  padding: 12px 32px 12px 12px;
  border: 1px solid var(--sto-line);
  border-radius: 14px;
  background: var(--color-pure-white, #ffffff);
  cursor: pointer;
  text-align: left;
  font: inherit;
  color: inherit;
  appearance: none;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
body.fx-theme-studio.sto-portal .sto-up-page .fx-billing-cycle__card:hover {
  border-color: var(--sto-ink);
}
body.fx-theme-studio.sto-portal .sto-up-page .fx-billing-cycle__card.is-selected {
  border-color: var(--sto-ink);
  box-shadow: 0 0 0 1px var(--sto-ink);
  background: var(--color-pure-white, #ffffff);
}
body.fx-theme-studio.sto-portal .sto-up-page .fx-billing-cycle__card.is-disabled {
  opacity: 0.45;
  pointer-events: none;
}
body.fx-theme-studio.sto-portal .sto-up-page .fx-billing-cycle__check {
  position: absolute;
  top: 10px;
  right: 10px;
  width: 18px;
  height: 18px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 9px;
  color: transparent;
  background: var(--sto-mist);
  border: 1px solid var(--sto-line);
}
body.fx-theme-studio.sto-portal .sto-up-page .fx-billing-cycle__card.is-selected .fx-billing-cycle__check {
  background: var(--sto-side-bg);
  border-color: var(--sto-side-bg);
  color: #ffffff;
}
body.fx-theme-studio.sto-portal .sto-up-page .fx-billing-cycle__orb {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 11px;
  color: var(--sto-mute);
}
body.fx-theme-studio.sto-portal .sto-up-page .fx-billing-cycle__orb em {
  font-style: normal;
  font-weight: 700;
  color: var(--sto-ink);
}
body.fx-theme-studio.sto-portal .sto-up-page .fx-billing-cycle__copy {
  display: grid;
  gap: 2px;
}
body.fx-theme-studio.sto-portal .sto-up-page .fx-billing-cycle__copy b {
  font-size: 13px;
  font-weight: 600;
  color: var(--sto-ink);
}
body.fx-theme-studio.sto-portal .sto-up-page .fx-billing-cycle__copy small {
  font-size: 12px;
  font-weight: 600;
  color: var(--sto-mute);
  font-family: ui-monospace, "SF Mono", Menlo, monospace;
}
body.fx-theme-studio.sto-portal .sto-up-page .fx-billing-cycle__badge {
  position: absolute;
  top: -8px;
  left: 10px;
  padding: 2px 8px;
  border-radius: 999px;
  background: var(--sto-magenta);
  color: #ffffff;
  font-size: 9px;
  font-weight: 700;
  text-transform: uppercase;
}

/* Upgrade summary */
body.fx-theme-studio.sto-portal .sto-up-page--summary .sto-up-page__grid {
  grid-template-columns: minmax(0, 1fr) 280px;
}
body.fx-theme-studio.sto-portal .sto-up-page--summary .sto-list-top,
body.fx-theme-studio.sto-portal .sto-up-page--summary .sto-up-page__alerts {
  grid-column: 1 / -1;
}
body.fx-theme-studio.sto-portal .sto-up-summary__stack { grid-column: 1; }
body.fx-theme-studio.sto-portal .sto-up-summary__aside {
  grid-column: 2;
  display: grid;
  gap: 14px;
  align-content: start;
}
body.fx-theme-studio.sto-portal .sto-up-summary__lines,
body.fx-theme-studio.sto-portal .sto-up-summary__totals {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 0;
}
body.fx-theme-studio.sto-portal .sto-up-summary__lines li,
body.fx-theme-studio.sto-portal .sto-up-summary__totals li {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 16px;
  padding: 12px 0;
  border-bottom: 1px solid var(--sto-line);
  font-size: 14px;
  color: var(--sto-ink);
}
body.fx-theme-studio.sto-portal .sto-up-summary__lines li:last-child,
body.fx-theme-studio.sto-portal .sto-up-summary__totals li:last-child { border-bottom: 0; }
body.fx-theme-studio.sto-portal .sto-up-summary__lines i {
  margin: 0 6px;
  font-size: 11px;
  color: var(--sto-mute);
}
body.fx-theme-studio.sto-portal .sto-up-summary__totals {
  margin-top: 8px;
  padding-top: 4px;
  border-top: 1px solid var(--sto-line);
}
body.fx-theme-studio.sto-portal .sto-up-summary__totals li span { color: var(--sto-mute); }
body.fx-theme-studio.sto-portal .sto-up-summary__totals li.is-due {
  padding-top: 14px;
  font-size: 15px;
  font-weight: 600;
}
body.fx-theme-studio.sto-portal .sto-up-summary__totals li.is-due b {
  font-size: 22px;
  font-weight: 500;
  letter-spacing: -0.03em;
}
body.fx-theme-studio.sto-portal .sto-up-summary__note {
  margin: 12px 0 0;
  font-size: 12px;
  color: var(--sto-mute);
  line-height: 1.45;
}
body.fx-theme-studio.sto-portal .sto-up-summary__promo-row {
  display: grid;
  gap: 10px;
}
body.fx-theme-studio.sto-portal .sto-up-summary__pay {
  display: grid;
  gap: 14px;
}
body.fx-theme-studio.sto-portal .sto-up-summary__pay .st-btn--primary {
  width: 100%;
  justify-content: center;
}
@media (max-width: 1100px) {
  body.fx-theme-studio.sto-portal .sto-up-page--summary .sto-up-page__grid {
    grid-template-columns: 1fr;
  }
  body.fx-theme-studio.sto-portal .sto-up-summary__stack,
  body.fx-theme-studio.sto-portal .sto-up-summary__aside {
    grid-column: auto;
  }
}
@media (max-width: 720px) {
  body.fx-theme-studio.sto-portal .sto-up-config__row {
    grid-template-columns: 1fr;
    gap: 10px;
  }
  body.fx-theme-studio.sto-portal .sto-up-config__arrow {
    transform: rotate(90deg);
    justify-self: start;
  }
}


/* ============================================================
   34. STUDIO CA — DOMAIN DETAILS
   ============================================================ */
body.fx-theme-studio.sto-portal .sto-dd-page .sto-ca-home__grid,
body.fx-theme-studio.sto-portal .sto-dd-page__grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 260px;
  gap: 16px;
  align-items: start;
}
body.fx-theme-studio.sto-portal .sto-dd-page__stack { grid-column: 1; }
body.fx-theme-studio.sto-portal .sto-dd-aside {
  grid-column: 2;
  align-self: start;
}
body.fx-theme-studio.sto-portal .sto-dd-page .sto-list-top,
body.fx-theme-studio.sto-portal .sto-dd-page .sto-view-ticket__alerts {
  grid-column: 1 / -1;
}

body.fx-theme-studio.sto-portal .sto-dd-domain {
  font-family: ui-monospace, "SF Mono", "Cascadia Code", Menlo, monospace;
  font-size: clamp(22px, 2.4vw, 30px);
  letter-spacing: -0.02em;
  word-break: break-all;
}
body.fx-theme-studio.sto-portal .sto-pd-back {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: inherit;
  text-decoration: none;
  opacity: 0.75;
}
body.fx-theme-studio.sto-portal .sto-pd-back:hover { opacity: 1; }
body.fx-theme-studio.sto-portal .sto-pd-mono {
  font-family: ui-monospace, "SF Mono", "Cascadia Code", Menlo, monospace;
}

/* Tabs */
body.fx-theme-studio.sto-portal .sto-pd-page__tabs-head {
  flex-wrap: wrap;
  gap: 12px;
  align-items: center !important;
  border-bottom: 1px solid var(--sto-line);
  padding-bottom: 14px !important;
  margin-bottom: 4px;
}
body.fx-theme-studio.sto-portal .sto-pd-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  list-style: none;
  margin: 0;
  padding: 0;
  width: 100%;
}
body.fx-theme-studio.sto-portal .sto-pd-tabs .nav-item { margin: 0; }
body.fx-theme-studio.sto-portal .sto-pd-tabs__link {
  display: inline-flex;
  align-items: center;
  height: 32px;
  padding: 0 12px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 600;
  color: var(--sto-mute);
  text-decoration: none;
  border: 1px solid transparent;
  background: transparent;
}
body.fx-theme-studio.sto-portal .sto-pd-tabs__link:hover {
  background: var(--sto-mist);
  color: var(--sto-ink);
}
body.fx-theme-studio.sto-portal .sto-pd-tabs__link.active {
  background: var(--sto-side-bg);
  color: #ffffff;
  border-color: var(--sto-side-bg);
}

/* Force tab panes */
body.fx-theme-studio.sto-portal .sto-dd-page .tab-pane { display: none !important; }
body.fx-theme-studio.sto-portal .sto-dd-page .tab-pane.active { display: block !important; }

body.fx-theme-studio.sto-portal .sto-pd-section {
  display: grid;
  gap: 14px;
  padding-top: 8px;
}
body.fx-theme-studio.sto-portal .sto-pd-section__title {
  margin: 0 0 8px;
  font-size: 14px;
  font-weight: 600;
  color: var(--sto-ink);
}
body.fx-theme-studio.sto-portal .sto-pd-muted {
  margin: 0;
  font-size: 13px;
  color: var(--sto-mute);
  line-height: 1.5;
}

/* Definition list */
body.fx-theme-studio.sto-portal .sto-pd-dl {
  display: grid;
  gap: 0;
  margin: 0;
}
body.fx-theme-studio.sto-portal .sto-pd-dl > div {
  display: grid;
  grid-template-columns: minmax(120px, 38%) 1fr;
  gap: 12px;
  padding: 11px 0;
  border-bottom: 1px solid var(--sto-line);
}
body.fx-theme-studio.sto-portal .sto-pd-dl > div:last-child { border-bottom: 0; }
body.fx-theme-studio.sto-portal .sto-pd-dl dt {
  margin: 0;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--sto-mute);
  padding-top: 2px;
}
body.fx-theme-studio.sto-portal .sto-pd-dl dd {
  margin: 0;
  font-size: 14px;
  color: var(--sto-ink);
  word-break: break-word;
}
body.fx-theme-studio.sto-portal .sto-pd-dl dd a {
  color: var(--sto-magenta);
  text-decoration: none;
  font-weight: 500;
}
body.fx-theme-studio.sto-portal .sto-pd-dl dd a:hover { text-decoration: underline; }

body.fx-theme-studio.sto-portal .sto-dd-today {
  margin-top: 8px;
  padding-top: 14px;
  border-top: 1px solid var(--sto-line);
}
body.fx-theme-studio.sto-portal .sto-dd-statusline {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin: 0;
  font-size: 14px;
  color: var(--sto-ink);
}
body.fx-theme-studio.sto-portal .sto-dd-radio {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 14px;
  border: 1px solid var(--sto-line);
  border-radius: 14px;
  background: var(--color-pure-white, #ffffff);
  font-size: 13px;
  font-weight: 500;
  cursor: pointer;
}
body.fx-theme-studio.sto-portal .sto-dd-radio:has(input:checked) {
  border-color: var(--sto-ink);
  background: var(--sto-mist);
}
body.fx-theme-studio.sto-portal .sto-dd-ns-form {
  display: grid;
  gap: 12px;
  max-width: 520px;
}
body.fx-theme-studio.sto-portal .sto-pd-form {
  display: grid;
  gap: 12px;
  max-width: 520px;
}
body.fx-theme-studio.sto-portal .sto-dd-addon-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}

/* Addon cards */
body.fx-theme-studio.sto-portal .sto-pd-cards {
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
}
body.fx-theme-studio.sto-portal .sto-pd-card {
  display: grid;
  gap: 10px;
  padding: 16px;
  border: 1px solid var(--sto-line);
  border-radius: 18px;
  background: var(--color-pure-white, #ffffff);
}
body.fx-theme-studio.sto-portal .sto-pd-card__head h4 {
  margin: 0;
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  font-weight: 600;
  color: var(--sto-ink);
}
body.fx-theme-studio.sto-portal .sto-pd-card__head i { color: var(--sto-magenta); }
body.fx-theme-studio.sto-portal .sto-pd-card p {
  margin: 0;
  font-size: 13px;
  color: var(--sto-mute);
  line-height: 1.45;
}

/* Alert bar (unpaid invoice) */
body.fx-theme-studio.sto-portal .sto-pd-alertbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
body.fx-theme-studio.sto-portal .sto-alert {
  padding: 14px 16px;
  border-radius: 16px;
  border: 1px solid var(--sto-line);
  background: var(--sto-mist);
  font-size: 13px;
}
body.fx-theme-studio.sto-portal .sto-alert--warning {
  background: rgba(245, 166, 35, 0.1);
  border-color: rgba(245, 166, 35, 0.35);
}
body.fx-theme-studio.sto-portal .sto-alert--error {
  background: rgba(229, 72, 77, 0.08);
  border-color: rgba(229, 72, 77, 0.3);
}

@media (max-width: 1100px) {
  body.fx-theme-studio.sto-portal .sto-dd-page .sto-ca-home__grid,
  body.fx-theme-studio.sto-portal .sto-dd-page__grid {
    grid-template-columns: 1fr;
  }
  body.fx-theme-studio.sto-portal .sto-dd-page__stack,
  body.fx-theme-studio.sto-portal .sto-dd-aside {
    grid-column: auto;
    grid-row: auto;
  }
}
@media (max-width: 640px) {
  body.fx-theme-studio.sto-portal .sto-pd-dl > div {
    grid-template-columns: 1fr;
    gap: 4px;
  }
}

/* Domain addon confirm */
body.fx-theme-studio.sto-portal .sto-dd-addons__price {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 8px 12px;
  padding: 16px 18px;
  border-radius: 16px;
  border: 1px solid var(--sto-line);
  background: var(--sto-mist);
}
body.fx-theme-studio.sto-portal .sto-dd-addons__price-label {
  width: 100%;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--sto-mute);
}
body.fx-theme-studio.sto-portal .sto-dd-addons__price strong {
  font-size: 28px;
  font-weight: 500;
  letter-spacing: -0.03em;
  color: var(--sto-ink);
}
body.fx-theme-studio.sto-portal .sto-dd-addons__price small {
  font-size: 13px;
  color: var(--sto-mute);
}
body.fx-theme-studio.sto-portal .sto-dd-addons .sto-ca-tile__lead .sto-dd-domain {
  color: #ffffff;
  font-family: ui-monospace, "SF Mono", "Cascadia Code", Menlo, monospace;
}


/* ============================================================
   34b. STUDIO CA — PRODUCT / SERVICE DETAILS
   ============================================================ */
body.fx-theme-studio.sto-portal .sto-pd-page .sto-ca-home__grid,
body.fx-theme-studio.sto-portal .sto-pd-page__grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 260px;
  gap: 16px;
  align-items: start;
}
body.fx-theme-studio.sto-portal .sto-pd-page .sto-list-top,
body.fx-theme-studio.sto-portal .sto-pd-page .sto-view-ticket__alerts {
  grid-column: 1 / -1;
}
body.fx-theme-studio.sto-portal .sto-pd-module-tile {
  grid-column: 1;
  padding: 0;
  overflow: hidden;
  min-height: 0;
  display: flex;
  flex-direction: column;
}
body.fx-theme-studio.sto-portal .sto-pd-module-tile:not(:has(iframe, #virtualizor_manager, .vortexus-container)) {
  min-height: min(58vh, 640px);
}
body.fx-theme-studio.sto-portal .sto-pd-module-tile > .sto-ca-tile__head {
  padding: 16px 18px 0;
  margin-bottom: 0;
}
body.fx-theme-studio.sto-portal .sto-pd-aside {
  grid-column: 2;
  grid-row: 2 / span 2;
  align-self: start;
}
body.fx-theme-studio.sto-portal .sto-pd-page .sto-view-ticket__alerts ~ .sto-pd-aside {
  grid-row: 3 / span 2;
}
body.fx-theme-studio.sto-portal .sto-pd-secondary {
  grid-column: 1;
  padding: 18px 20px;
  overflow: hidden;
}
body.fx-theme-studio.sto-portal .sto-pd-page .sto-list-top__hero .sto-ca-tile__lead a {
  color: rgba(255, 255, 255, 0.85);
  text-decoration: underline;
  text-underline-offset: 2px;
}
body.fx-theme-studio.sto-portal .sto-pd-page .sto-list-top__hero .sto-ca-tile__lead a:hover {
  color: #ffffff;
}

/* Module control strip */
body.fx-theme-studio.sto-portal .sto-pd-controls {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  padding: 12px 18px;
  border-bottom: 1px solid var(--sto-line);
  background: var(--sto-mist);
}
body.fx-theme-studio.sto-portal .sto-pd-controls__btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 12px;
  border-radius: 12px;
  border: 1px solid var(--sto-line);
  background: var(--color-pure-white, #ffffff);
  color: var(--sto-ink);
  font-size: 12px;
  font-weight: 500;
  text-decoration: none;
  transition: border-color 0.12s ease, background 0.12s ease;
}
body.fx-theme-studio.sto-portal .sto-pd-controls__btn:hover {
  border-color: var(--sto-ink);
  background: var(--sto-mist);
  color: var(--sto-ink);
}
body.fx-theme-studio.sto-portal .sto-pd-controls__btn i {
  color: var(--sto-magenta);
  font-size: 12px;
}
body.fx-theme-studio.sto-portal .sto-pd-controls__btn.is-disabled {
  opacity: 0.45;
  pointer-events: none;
}

/* Virtualizor / module mount — iframe is sibling of #domain inside #tab1 */
body.fx-theme-studio.sto-portal .sto-pd-mount {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  min-height: 0;
  padding: 0;
  background: var(--color-pure-white, #ffffff);
}
body.fx-theme-studio.sto-portal .sto-pd-mount > #domain {
  flex: 0 0 auto;
  min-height: 0;
}
body.fx-theme-studio.sto-portal .sto-pd-mount:has(iframe, #virtualizor_manager) > #domain {
  padding: 0;
  margin: 0;
  min-height: 0;
  height: auto;
}
body.fx-theme-studio.sto-portal .sto-pd-mount:has(iframe, #virtualizor_manager) > #domain .moduleoutput {
  display: none !important;
  min-height: 0 !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
}
body.fx-theme-studio.sto-portal .sto-pd-module {
  padding: 16px 18px;
  text-align: left;
  min-height: 0;
}
body.fx-theme-studio.sto-portal .sto-pd-module:has(.vortexus-container),
body.fx-theme-studio.sto-portal .sto-pd-module:has(iframe),
body.fx-theme-studio.sto-portal .sto-pd-module:has([class*="module-"]),
body.fx-theme-studio.sto-portal .sto-pd-module:has([id*="manager"]) {
  padding: 0;
}
body.fx-theme-studio.sto-portal .sto-pd-mount > iframe,
body.fx-theme-studio.sto-portal .sto-pd-mount > #virtualizor_manager,
body.fx-theme-studio.sto-portal .sto-pd-module iframe,
body.fx-theme-studio.sto-portal .sto-pd-module .vortexus-container {
  flex: 1 1 auto;
  width: 100% !important;
  max-width: 100%;
}
body.fx-theme-studio.sto-portal .sto-pd-module .vortexus-container {
  min-height: min(52vh, 560px);
  border-radius: 0 0 22px 22px;
}
body.fx-theme-studio.sto-portal .sto-pd-module > * { max-width: 100%; }
body.fx-theme-studio.sto-portal .sto-pd-module iframe,
body.fx-theme-studio.sto-portal .sto-pd-mount iframe,
body.fx-theme-studio.sto-portal .sto-pd-module iframe#virtualizor_manager,
body.fx-theme-studio.sto-portal .sto-pd-mount iframe#virtualizor_manager {
  min-height: min(52vh, 560px);
  border: 0 !important;
  background: var(--color-pure-white, #ffffff);
  border-radius: 0 0 22px 22px;
}
body.fx-theme-studio.sto-portal #virtualizor_load_div {
  flex: 0 0 auto;
  min-height: 0;
  padding: 0 18px;
}
body.fx-theme-studio.sto-portal .sto-pd-mount__empty {
  padding: 28px 18px;
  color: var(--sto-mute);
  font-size: 13px;
}
body.fx-theme-studio.sto-portal .sto-pd-hook { padding: 12px 18px; }

/* Aside facts */
body.fx-theme-studio.sto-portal .sto-pd-aside > .sto-ca-tile__kicker { margin-bottom: 6px; }
body.fx-theme-studio.sto-portal .sto-pd-aside__block {
  margin-top: 16px;
  padding-top: 12px;
  border-top: 1px solid var(--sto-line);
}
body.fx-theme-studio.sto-portal .sto-pd-aside__links { margin-top: 16px; }
body.fx-theme-studio.sto-portal .sto-pd-aside__upgrade-opts { margin-top: 10px; }
body.fx-theme-studio.sto-portal .sto-pd-dl--aside > div {
  grid-template-columns: 1fr;
  gap: 2px;
  padding: 10px 0;
}

/* Secondary tabs panel */
body.fx-theme-studio.sto-portal .sto-pd-page .tab-pane { display: none !important; }
body.fx-theme-studio.sto-portal .sto-pd-page .tab-pane.active { display: block !important; }
body.fx-theme-studio.sto-portal .sto-pd-form {
  display: grid;
  gap: 12px;
  width: 100%;
  max-width: 560px;
  justify-items: stretch;
}
body.fx-theme-studio.sto-portal .sto-pd-form__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 4px;
}

/* Product details — change password (same pattern as sto-pw-page) */
body.fx-theme-studio.sto-portal .sto-pd-pw {
  max-width: 440px;
}
body.fx-theme-studio.sto-portal .sto-pd-pw__form,
body.fx-theme-studio.sto-portal .sto-pd-pw__fields {
  width: 100%;
  display: grid;
  gap: 14px;
}
body.fx-theme-studio.sto-portal .sto-pd-pw .fx-input-group {
  margin: 0;
  width: 100%;
}
body.fx-theme-studio.sto-portal .sto-pd-pw .fx-pw-field,
body.fx-theme-studio.sto-portal .sto-pd-pw .fx-input {
  width: 100%;
  max-width: none;
}
body.fx-theme-studio.sto-portal .sto-pd-pw .progress {
  height: 8px;
  border-radius: 999px;
  background: var(--sto-mist);
  border: 1px solid var(--sto-line);
  overflow: hidden;
  margin: 8px 0 0;
}
body.fx-theme-studio.sto-portal .sto-pd-pw .progress-bar {
  height: 100%;
  width: 0%;
  border-radius: 999px;
  background: transparent;
  transition: width 0.2s ease, background 0.2s ease;
}
body.fx-theme-studio.sto-portal .sto-pd-pw .progress-bar.bg-danger { background: #e5484d; }
body.fx-theme-studio.sto-portal .sto-pd-pw .progress-bar.bg-warning { background: #f5a623; }
body.fx-theme-studio.sto-portal .sto-pd-pw .progress-bar.bg-success { background: #2fbf71; }
body.fx-theme-studio.sto-portal .sto-pd-pw .fx-input.is-invalid { border-color: #e5484d; }
body.fx-theme-studio.sto-portal .sto-pd-pw .fx-input.is-warning { border-color: #f5a623; }
body.fx-theme-studio.sto-portal .sto-pd-pw .fx-input.is-valid { border-color: #2fbf71; }
body.fx-theme-studio.sto-portal .sto-pd-pw .progress .sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
}
body.fx-theme-studio.sto-portal .sto-pd-pw .fx-input-group br { display: none; }
body.fx-theme-studio.sto-portal .sto-pd-pw #inputNewPassword2Msg {
  font-size: 12px;
  margin-top: 6px;
}
body.fx-theme-studio.sto-portal .sto-pd-pw .alert {
  border-radius: 14px;
  border: 1px solid var(--sto-line);
  background: var(--sto-mist);
  color: var(--sto-mute);
  padding: 12px 14px;
  margin: 8px 0 0;
}
body.fx-theme-studio.sto-portal .sto-pd-pw .alert i { color: var(--sto-magenta); }
body.fx-theme-studio.sto-portal .sto-pd-pw .fx-sec-page__inline-actions {
  margin-top: 4px;
}

body.fx-theme-studio.sto-portal .sto-pd-usage {
  display: flex;
  flex-wrap: wrap;
  gap: 24px;
}
body.fx-theme-studio.sto-portal .sto-pd-usage__item {
  text-align: center;
}
body.fx-theme-studio.sto-portal .sto-pd-usage__item h4 {
  margin: 0 0 8px;
  font-size: 13px;
  font-weight: 600;
  color: var(--sto-ink);
}
body.fx-theme-studio.sto-portal .sto-pd-usage__item p {
  margin: 8px 0 0;
  font-size: 12px;
  color: var(--sto-mute);
}
body.fx-theme-studio.sto-portal .sto-pd-page .st-btn.is-disabled {
  opacity: 0.45;
  pointer-events: none;
}

@media (min-width: 1101px) {
  body.fx-theme-studio.sto-portal .sto-ca-home__grid.sto-svc-page__grid,
  body.fx-theme-studio.sto-portal .sto-svc-page__grid,
  body.fx-theme-studio.sto-portal .sto-pd-page .sto-ca-home__grid,
  body.fx-theme-studio.sto-portal .sto-pd-page__grid {
    grid-template-columns: minmax(0, 1fr) 260px;
  }
}

@media (max-width: 1100px) {
  body.fx-theme-studio.sto-portal .sto-pd-page .sto-ca-home__grid,
  body.fx-theme-studio.sto-portal .sto-pd-page__grid {
    grid-template-columns: 1fr;
  }
  body.fx-theme-studio.sto-portal .sto-pd-module-tile,
  body.fx-theme-studio.sto-portal .sto-pd-aside,
  body.fx-theme-studio.sto-portal .sto-pd-secondary {
    grid-column: auto;
    grid-row: auto;
  }
}


/* ============================================================
   35. STUDIO — VIEW INVOICE (standalone)
   ============================================================ */
body.fx-theme-studio.page-sto-invoice {
  margin: 0;
  min-height: 100vh;
  background: #f7f7fb;
  color: var(--sto-ink, #171526);
  font-family: var(--font-inter);
  -webkit-font-smoothing: antialiased;
}
/* Standalone invoice has no flexus.js — never leave reveal tiles invisible */
body.fx-theme-studio.page-sto-invoice .fx-reveal {
  opacity: 1 !important;
  transform: none !important;
}
body.fx-theme-studio.page-sto-invoice a { color: inherit; }

.sto-inv-shell { min-height: 100vh; display: flex; flex-direction: column; }
.sto-inv-wrap {
  width: min(1120px, calc(100% - 32px));
  margin-inline: auto;
}
.sto-inv-top {
  position: sticky;
  top: 0;
  z-index: 40;
  background: rgba(247, 247, 251, 0.88);
  backdrop-filter: blur(12px);
  border-bottom: 1px solid var(--sto-line, #e4e2ef);
}
.sto-inv-top .sto-inv-wrap,
.sto-inv-top__brand,
.sto-inv-top__actions {
  display: flex;
  align-items: center;
}
.sto-inv-top .sto-inv-wrap {
  justify-content: space-between;
  gap: 16px;
  padding: 14px 0;
}
.sto-inv-top__brand {
  gap: 10px;
  font-weight: 600;
  font-size: 15px;
  text-decoration: none;
  color: var(--sto-ink, #171526);
}
.sto-inv-top__brand img { max-height: 28px; width: auto; display: block; }
.sto-inv-top__actions { flex-wrap: wrap; gap: 8px; }

.sto-inv-main { flex: 1; padding: clamp(20px, 3vw, 36px) 0 clamp(40px, 6vw, 72px); }

.sto-inv-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 280px;
  gap: 16px;
  align-items: start;
}
.sto-inv-topband {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) repeat(2, minmax(160px, 1fr));
  gap: 16px;
  align-items: stretch;
}
.sto-inv-alerts { grid-column: 1 / -1; }
.sto-inv-stack {
  grid-column: 1;
  display: grid;
  gap: 16px;
}
.sto-inv-aside {
  grid-column: 2;
  display: grid;
  gap: 14px;
  align-content: start;
}

/* Reuse CA tiles on standalone invoice (no .sto-portal) */
body.fx-theme-studio.page-sto-invoice .sto-ca-tile {
  background: var(--color-pure-white, #ffffff);
  border: 1px solid var(--sto-line, #e4e2ef);
  border-radius: 22px;
  padding: 18px 20px;
  box-shadow: 0 14px 32px -24px rgba(23, 21, 38, 0.18);
}
body.fx-theme-studio.page-sto-invoice .sto-ca-tile--hero {
  background: var(--sto-ink, #171526);
  border-color: transparent;
  color: #ffffff;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 18px;
  align-items: flex-end;
}
body.fx-theme-studio.page-sto-invoice .sto-ca-tile--peach {
  background: #fff4e8;
  border-color: #f3d9bf;
}
body.fx-theme-studio.page-sto-invoice .sto-ca-tile--stat-mint { background: #f0fdf1; border-color: #d3f6d8; }
body.fx-theme-studio.page-sto-invoice .sto-ca-tile--stat-sky { background: #eef6ff; border-color: #d3e7ff; }
body.fx-theme-studio.page-sto-invoice .sto-ca-tile__kicker {
  margin: 0 0 6px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--sto-mute, #7a7790);
}
body.fx-theme-studio.page-sto-invoice .sto-ca-tile--hero .sto-ca-tile__kicker { color: #97f675; }
body.fx-theme-studio.page-sto-invoice .sto-ca-tile__title {
  margin: 0;
  font-size: clamp(26px, 3vw, 34px);
  font-weight: 500;
  letter-spacing: -0.03em;
  line-height: 1.1;
  color: var(--sto-ink, #171526);
}
body.fx-theme-studio.page-sto-invoice .sto-ca-tile--hero .sto-ca-tile__title {
  color: #ffffff;
}
body.fx-theme-studio.page-sto-invoice .sto-ca-tile__lead {
  margin: 8px 0 0;
  font-size: 14px;
  max-width: 48ch;
  color: var(--sto-mute, #7a7790);
}
body.fx-theme-studio.page-sto-invoice .sto-ca-tile--hero .sto-ca-tile__lead {
  color: rgba(255, 255, 255, 0.72);
}
body.fx-theme-studio.page-sto-invoice .sto-ca-tile__mega {
  display: block;
  font-size: 28px;
  font-weight: 500;
  letter-spacing: -0.03em;
  color: var(--sto-ink, #171526);
}
body.fx-theme-studio.page-sto-invoice .sto-ca-tile__meta {
  display: block;
  margin-top: 4px;
  font-size: 12px;
  color: var(--sto-mute, #7a7790);
}
body.fx-theme-studio.page-sto-invoice .sto-ca-tile__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 12px;
}
body.fx-theme-studio.page-sto-invoice .sto-ca-tile__heading {
  margin: 0;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 15px;
  font-weight: 600;
}
body.fx-theme-studio.page-sto-invoice .sto-ca-tile__hero-cta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
body.fx-theme-studio.page-sto-invoice .sto-ca-tile--hero .st-btn--ghost {
  background: transparent;
  color: #ffffff;
  border-color: rgba(255,255,255,0.35);
}
body.fx-theme-studio.page-sto-invoice .sto-ca-tile--hero .st-btn--ghost:hover {
  background: var(--color-pure-white, #ffffff);
  color: var(--sto-ink, #171526);
  border-color: #ffffff;
}
body.fx-theme-studio.page-sto-invoice .sto-hero-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 14px;
}
body.fx-theme-studio.page-sto-invoice .sto-hero-chip {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  height: 30px;
  padding: 0 12px;
  border-radius: 999px;
  background: rgba(255,255,255,0.1);
  border: 1px solid rgba(255,255,255,0.16);
  font-size: 12px;
  font-weight: 500;
}
body.fx-theme-studio.page-sto-invoice .sto-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  display: inline-block;
}
body.fx-theme-studio.page-sto-invoice .sto-dot--ok { background: #2fbf71; }
body.fx-theme-studio.page-sto-invoice .sto-dot--warn { background: #f59e0b; }
body.fx-theme-studio.page-sto-invoice .sto-dot--danger { background: var(--color-notion-blue, #fa2f62); }
body.fx-theme-studio.page-sto-invoice .sto-dot--mute { background: #a1a1aa; }
body.fx-theme-studio.page-sto-invoice .sto-pd-mono {
  font-family: ui-monospace, "SF Mono", Menlo, monospace;
}
body.fx-theme-studio.page-sto-invoice .fx-input-group { display: grid; gap: 6px; margin-bottom: 12px; }
body.fx-theme-studio.page-sto-invoice .fx-label {
  font-size: 12px;
  font-weight: 600;
  color: var(--sto-mute, #7a7790);
}
body.fx-theme-studio.page-sto-invoice .fx-input {
  height: 44px;
  padding: 0 14px;
  border: 1px solid var(--sto-line, #e4e2ef);
  border-radius: 14px;
  background: var(--color-pure-white, #ffffff);
  font: inherit;
  color: var(--sto-ink, #171526);
  width: 100%;
}
body.fx-theme-studio.page-sto-invoice .sto-pd-muted {
  margin: 0 0 12px;
  font-size: 13px;
  color: var(--sto-mute, #7a7790);
  line-height: 1.5;
}

/* Alerts */
.sto-inv-alert {
  padding: 14px 16px;
  border-radius: 16px;
  border: 1px solid var(--sto-line, #e4e2ef);
  background: var(--color-pure-white, #ffffff);
  font-size: 13px;
}
.sto-inv-alert--success { background: #edfbf5; border-color: #c8f0df; color: #00966e; }
.sto-inv-alert--info { background: #eef6ff; border-color: #d3e7ff; color: #1d4ed8; }
.sto-inv-alert--error { background: rgba(229,72,77,.08); border-color: rgba(229,72,77,.3); color: #c81e1e; }
.sto-inv-alert--warning { background: rgba(245,166,35,.1); border-color: rgba(245,166,35,.35); }

/* Line items */
.sto-inv-hint { font-size: 12px; color: var(--sto-mute, #7a7790); }
.sto-inv-rows {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
}
.sto-inv-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 16px;
  padding: 12px 0;
  border-bottom: 1px solid var(--sto-line, #e4e2ef);
  font-size: 14px;
}
.sto-inv-row:last-child { border-bottom: 0; }
.sto-inv-row__desc { color: var(--sto-ink, #171526); overflow-wrap: anywhere; }
.sto-inv-row__amt {
  font-family: ui-monospace, "SF Mono", Menlo, monospace;
  font-weight: 500;
  white-space: nowrap;
}
.sto-inv-row--foot { color: var(--sto-mute, #7a7790); font-size: 13px; }
.sto-inv-row--total {
  margin-top: 4px;
  padding-top: 14px;
  border-top: 1px solid var(--sto-ink, #171526);
  border-bottom: 0;
  font-weight: 600;
}
.sto-inv-row--ledger {
  grid-template-columns: 90px minmax(0, 1.2fr) minmax(0, 1fr) auto;
}
.sto-inv-row__meta { font-size: 12px; color: var(--sto-mute, #7a7790); }
.sto-inv-mute { color: var(--sto-mute, #7a7790); }
.sto-inv-empty {
  padding: 18px 0;
  text-align: center;
  color: var(--sto-mute, #7a7790);
  font-size: 13px;
}
.sto-inv-addr {
  font-size: 13px;
  line-height: 1.55;
  color: var(--sto-ink, #171526);
}
.sto-inv-paycard__total {
  display: block;
  font-size: 32px;
  font-weight: 500;
  letter-spacing: -0.03em;
  margin: 4px 0 14px;
  color: var(--sto-ink, #171526);
}
.sto-inv-facts {
  display: grid;
  gap: 10px;
  margin: 0 0 14px;
}
.sto-inv-facts > div { display: grid; gap: 2px; }
.sto-inv-facts dt {
  margin: 0;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--sto-mute, #7a7790);
}
.sto-inv-facts dd { margin: 0; font-size: 13px; font-weight: 500; }
.sto-inv-gateway { margin-bottom: 12px; }
.sto-inv-paybtn { display: grid; gap: 8px; }
.sto-inv-paybtn .btn,
.sto-inv-paybtn input[type="submit"],
.sto-inv-paybtn button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 44px;
  padding: 0 18px;
  border-radius: 999px;
  border: 0;
  background: var(--sto-ink, #171526);
  color: #ffffff;
  font: inherit;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
}
.sto-inv-credit { display: grid; gap: 4px; }

@media (max-width: 900px) {
  .sto-inv-grid { grid-template-columns: 1fr; }
  .sto-inv-topband {
    grid-template-columns: 1fr;
  }
  .sto-inv-stack,
  .sto-inv-aside,
  .sto-inv-alerts {
    grid-column: auto;
    grid-row: auto;
  }
  .sto-inv-row--ledger {
    grid-template-columns: 1fr 1fr;
  }
  .sto-inv-row--ledger .sto-inv-row__amt { grid-column: 2; justify-self: end; }
}
@media print {
  .sto-inv-top,
  .d-print-none { display: none !important; }
  body.fx-theme-studio.page-sto-invoice { background: var(--color-pure-white, #ffffff); }
  .sto-ca-tile { box-shadow: none !important; }
}

/* ============================================================
   35. CONTACT (stc-*) — public Studio contact.php
   ============================================================ */
body.fx-theme-studio .stc-page { background: var(--color-pure-white, #ffffff); }

body.fx-theme-studio .stc-form-section {
  padding: clamp(8px, 2vw, 24px) 0 clamp(48px, 7vw, 88px);
}
body.fx-theme-studio .stc-form__card {
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) minmax(260px, 0.7fr);
  gap: 22px;
  align-items: start;
  background: var(--color-pure-white, #ffffff);
  border: 1px solid var(--color-ash-solid, #eceaf6);
  border-radius: 28px;
  padding: clamp(22px, 3vw, 36px);
  box-shadow: 0 18px 40px -24px rgba(23, 21, 38, 0.18);
}
body.fx-theme-studio .stc-form__main { min-width: 0; }
body.fx-theme-studio .stc-form__head { margin-bottom: 22px; }
body.fx-theme-studio .stc-form__head .st-h2 { margin-bottom: 10px; }
body.fx-theme-studio .stc-form__head .st-lead { margin: 0; max-width: 48ch; }

body.fx-theme-studio .stc-form {
  display: grid;
  gap: 14px;
}
body.fx-theme-studio .stc-form__row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
}
body.fx-theme-studio .stc-page .fx-input-group {
  display: grid;
  gap: 6px;
  margin: 0;
}
body.fx-theme-studio .stc-page .fx-label {
  font-size: 12px;
  font-weight: 600;
  color: #75738c;
  letter-spacing: 0.01em;
  margin: 0;
}
body.fx-theme-studio .stc-page .fx-input {
  width: 100%;
  height: 46px;
  padding: 0 16px;
  border-radius: 14px;
  border: 1.5px solid var(--color-ash-solid, #eceaf6);
  background: var(--color-pure-white, #ffffff);
  color: var(--color-midnight-ink, #171526);
  font-size: 15px;
  font-family: inherit;
  box-shadow: none;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
body.fx-theme-studio .stc-page textarea.fx-input,
body.fx-theme-studio .stc-page .fx-input--area {
  height: auto;
  min-height: 140px;
  padding: 14px 16px;
  resize: vertical;
}
body.fx-theme-studio .stc-page .fx-input:focus {
  outline: none;
  border-color: var(--color-midnight-brand, #03061a);
  box-shadow: 0 0 0 4px rgba(23, 21, 38, 0.08);
}
body.fx-theme-studio .stc-page .fx-input::placeholder {
  color: #a09eb3;
}

body.fx-theme-studio .stc-form__captcha {
  padding: 12px 14px;
  border-radius: 16px;
  background: var(--color-paper-mist, #f8faff);
  border: 1px solid var(--color-ash-solid, #eceaf6);
}
body.fx-theme-studio .stc-form__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
  margin-top: 4px;
}

body.fx-theme-studio .stc-form__aside {
  display: grid;
  gap: 14px;
  position: sticky;
  top: 24px;
}
body.fx-theme-studio .stc-aside-card {
  border-radius: 20px;
  padding: 22px 22px 24px;
  background: var(--color-paper-mist, #f8faff);
  border: 1px solid var(--color-ash-solid, #eceaf6);
  color: var(--color-midnight-ink, #171526);
}
body.fx-theme-studio .stc-aside-card .st-kicker { margin-bottom: 14px; }
body.fx-theme-studio .stc-aside-card--ink {
  background: var(--color-midnight-brand, #03061a);
  border-color: var(--color-midnight-brand, #03061a);
  color: #ffffff;
}
body.fx-theme-studio .stc-aside-card--ink .st-kicker {
  background: rgba(151, 246, 117, 0.12);
  color: #97f675;
}
body.fx-theme-studio .stc-aside-card__list,
body.fx-theme-studio .stc-aside-card__links {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 10px;
}
body.fx-theme-studio .stc-aside-card__list li {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 14px;
  font-weight: 600;
  color: rgba(255, 255, 255, 0.82);
}
body.fx-theme-studio .stc-aside-card__list li i { color: rgba(255, 255, 255, 0.45); width: 1.1em; text-align: center; }
body.fx-theme-studio .stc-aside-card__list li.is-ok i { color: #97f675; }
body.fx-theme-studio .stc-aside-card__links a {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 14px;
  font-weight: 600;
  color: var(--color-midnight-ink, #171526);
  text-decoration: none;
  padding: 8px 10px;
  margin: 0 -10px;
  border-radius: 12px;
  transition: background 0.15s ease;
}
body.fx-theme-studio .stc-aside-card__links a:hover { background: var(--color-pure-white, #ffffff); }
body.fx-theme-studio .stc-aside-card__links a i {
  width: 1.1em;
  text-align: center;
  color: var(--color-notion-blue, #fa2f62);
}

body.fx-theme-studio .stc-page .st-stats__row b em {
  font-style: normal;
  color: var(--color-notion-blue, #fa2f62);
  font-weight: 500;
}

@media (max-width: 960px) {
  body.fx-theme-studio .stc-form__card {
    grid-template-columns: 1fr;
    padding: 22px;
  }
  body.fx-theme-studio .stc-form__aside { position: static; }
}
@media (max-width: 640px) {
  body.fx-theme-studio .stc-form__row { grid-template-columns: 1fr; }
  body.fx-theme-studio .stc-form__actions .st-btn { width: 100%; justify-content: center; }
}

/* ============================================================
   36. ANNOUNCEMENTS (san-*) — public Studio announcements
   ============================================================ */
body.fx-theme-studio .san-page { background: var(--color-pure-white, #ffffff); }

body.fx-theme-studio .san-hero--article .st-hero__title {
  font-size: clamp(28px, 3.8vw, 44px);
}
body.fx-theme-studio .san-article__meta {
  display: flex; flex-wrap: wrap; gap: 14px 22px;
  font-size: 14px; font-weight: 600; color: #56546b;
}
body.fx-theme-studio .san-article__meta i { color: var(--color-lavender, #794dff); margin-right: 6px; }
body.fx-theme-studio .san-article__tweet { margin-top: 14px; }

body.fx-theme-studio .san-feed-section {
  padding: clamp(8px, 2vw, 24px) 0 clamp(48px, 7vw, 88px);
}
body.fx-theme-studio .san-feed__card {
  display: grid;
  grid-template-columns: minmax(0, 1.45fr) minmax(240px, 0.65fr);
  gap: 22px;
  align-items: start;
  background: var(--color-pure-white, #ffffff);
  border: 1px solid var(--color-ash-solid, #eceaf6);
  border-radius: 28px;
  padding: clamp(22px, 3vw, 36px);
  box-shadow: 0 18px 40px -24px rgba(23, 21, 38, 0.18);
}
body.fx-theme-studio .san-feed__main { min-width: 0; }
body.fx-theme-studio .san-feed__head { margin-bottom: 22px; }
body.fx-theme-studio .san-feed__head .st-h2 { margin-bottom: 10px; }
body.fx-theme-studio .san-feed__head .st-lead { margin: 0; max-width: 52ch; }

body.fx-theme-studio .san-list {
  display: grid;
  gap: 14px;
}
body.fx-theme-studio .san-item {
  display: grid;
  gap: 10px;
  padding: 22px 22px 20px;
  border-radius: 20px;
  border: 1px solid var(--color-ash-solid, #eceaf6);
  background: var(--color-paper-mist, #f8faff);
  transition: border-color .15s ease, box-shadow .15s ease, transform .15s ease;
}
body.fx-theme-studio .san-item:hover {
  border-color: #e0dceb;
  background: var(--color-pure-white, #ffffff);
  box-shadow: 0 14px 28px -18px rgba(23, 21, 38, 0.16);
  transform: translateY(-1px);
}
body.fx-theme-studio .san-item__meta time {
  display: inline-flex; align-items: center; gap: 8px;
  font-size: 13px; font-weight: 700; color: var(--color-lavender, #794dff);
}
body.fx-theme-studio .san-item__title {
  margin: 0;
  font-size: clamp(20px, 2.4vw, 26px);
  font-weight: 500;
  letter-spacing: -0.02em;
  line-height: 1.2;
}
body.fx-theme-studio .san-item__title a {
  color: var(--color-midnight-ink, #171526); text-decoration: none;
}
body.fx-theme-studio .san-item__title a:hover { color: var(--color-notion-blue, #fa2f62); }
body.fx-theme-studio .san-item__excerpt {
  font-size: 15px; line-height: 1.55; color: #56546b;
}
body.fx-theme-studio .san-item__excerpt p:last-child { margin-bottom: 0; }
body.fx-theme-studio .san-item__actions {
  display: flex; flex-wrap: wrap; gap: 8px; margin-top: 4px;
}

body.fx-theme-studio .san-empty {
  display: grid; place-items: center; gap: 10px;
  padding: 48px 20px; text-align: center;
  border-radius: 20px; border: 1px dashed #e0dceb; background: var(--color-paper-mist, #f8faff);
  color: #75738c;
}
body.fx-theme-studio .san-empty i { font-size: 28px; color: var(--color-lavender, #794dff); }
body.fx-theme-studio .san-empty p { margin: 0; font-size: 15px; font-weight: 600; color: var(--color-midnight-ink, #171526); }

body.fx-theme-studio .san-pagination {
  display: flex; flex-wrap: wrap; gap: 8px;
  margin-top: 22px;
}
body.fx-theme-studio .san-pagination__link {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 40px; height: 40px; padding: 0 14px;
  border-radius: 999px; border: 1px solid var(--color-ash-solid, #eceaf6);
  background: var(--color-pure-white, #ffffff); color: var(--color-midnight-ink, #171526);
  font-size: 13px; font-weight: 700; text-decoration: none;
  transition: border-color .15s ease, background .15s ease, color .15s ease;
}
body.fx-theme-studio .san-pagination__link:hover {
  border-color: var(--color-midnight-brand, #03061a);
}
body.fx-theme-studio .san-pagination__link.is-active {
  background: var(--color-midnight-brand, #03061a); border-color: var(--color-midnight-brand, #03061a); color: #ffffff;
}
body.fx-theme-studio .san-pagination__link.is-disabled {
  opacity: 0.4; pointer-events: none;
}

body.fx-theme-studio .san-feed__aside {
  display: grid; gap: 14px;
  position: sticky; top: 24px;
}
body.fx-theme-studio .san-aside-card {
  border-radius: 20px;
  padding: 22px 22px 24px;
  background: var(--color-paper-mist, #f8faff);
  border: 1px solid var(--color-ash-solid, #eceaf6);
  color: var(--color-midnight-ink, #171526);
}
body.fx-theme-studio .san-aside-card .st-kicker { margin-bottom: 14px; }
body.fx-theme-studio .san-aside-card--ink {
  background: var(--color-midnight-brand, #03061a); border-color: var(--color-midnight-brand, #03061a); color: #ffffff;
}
body.fx-theme-studio .san-aside-card--ink .st-kicker {
  background: rgba(151, 246, 117, 0.12); color: #97f675;
}
body.fx-theme-studio .san-aside-card__list,
body.fx-theme-studio .san-aside-card__links {
  list-style: none; margin: 0; padding: 0;
  display: grid; gap: 10px;
}
body.fx-theme-studio .san-aside-card__list li {
  display: flex; align-items: center; gap: 10px;
  font-size: 14px; font-weight: 600;
  color: rgba(255, 255, 255, 0.82);
}
body.fx-theme-studio .san-aside-card__list li i {
  color: rgba(255, 255, 255, 0.45); width: 1.1em; text-align: center;
}
body.fx-theme-studio .san-aside-card__list li.is-ok i { color: #97f675; }
body.fx-theme-studio .san-aside-card__links a {
  display: flex; align-items: center; gap: 10px;
  font-size: 14px; font-weight: 600; color: var(--color-midnight-ink, #171526);
  text-decoration: none; padding: 8px 10px; margin: 0 -10px;
  border-radius: 12px; transition: background .15s ease, color .15s ease;
}
body.fx-theme-studio .san-aside-card__links a:hover,
body.fx-theme-studio .san-aside-card__links a.is-active {
  background: var(--color-pure-white, #ffffff); color: var(--color-notion-blue, #fa2f62);
}
body.fx-theme-studio .san-aside-card__links a i {
  width: 1.1em; text-align: center; color: var(--color-notion-blue, #fa2f62);
}

body.fx-theme-studio .san-article__body {
  font-size: 16px; line-height: 1.65; color: #4f4d63;
}
body.fx-theme-studio .san-article__body h2,
body.fx-theme-studio .san-article__body h3 {
  color: var(--color-midnight-ink, #171526); letter-spacing: -0.02em; margin-top: 1.4em;
}
body.fx-theme-studio .san-article__body a { color: var(--color-notion-blue, #fa2f62); }
body.fx-theme-studio .san-article__body img {
  max-width: 100%; height: auto; border-radius: 16px;
}
body.fx-theme-studio .san-article__social { margin-top: 24px; }
body.fx-theme-studio .san-article__foot {
  display: flex; flex-wrap: wrap; gap: 10px; margin-top: 28px;
}

body.fx-theme-studio .san-comments {
  padding: 0 0 clamp(32px, 5vw, 64px);
}
body.fx-theme-studio .san-comments__card {
  border: 1px solid var(--color-ash-solid, #eceaf6); border-radius: 24px;
  padding: clamp(18px, 3vw, 28px); background: var(--color-pure-white, #ffffff);
}

body.fx-theme-studio .san-page .st-stats__row b em {
  font-style: normal; color: var(--color-notion-blue, #fa2f62); font-weight: 500;
}

@media (max-width: 960px) {
  body.fx-theme-studio .san-feed__card {
    grid-template-columns: 1fr;
    padding: 22px;
  }
  body.fx-theme-studio .san-feed__aside { position: static; }
}
@media (max-width: 640px) {
  body.fx-theme-studio .san-item { padding: 18px; }
  body.fx-theme-studio .san-item__actions .st-btn { width: 100%; justify-content: center; }
}


/* ============================================================
   37. KNOWLEDGEBASE (skb-*) — public Studio KB
   ============================================================ */
body.fx-theme-studio .skb-page { background: var(--color-pure-white, #ffffff); }

body.fx-theme-studio .skb-hero--article .st-hero__title,
body.fx-theme-studio .skb-hero--compact .st-hero__title {
  font-size: clamp(28px, 3.8vw, 44px);
}
body.fx-theme-studio .skb-article__meta {
  display: flex; flex-wrap: wrap; gap: 12px 20px;
  font-size: 14px; font-weight: 600; color: #56546b;
}
body.fx-theme-studio .skb-article__meta i { color: var(--color-lavender, #794dff); margin-right: 6px; }
body.fx-theme-studio .skb-article__meta a {
  color: #56546b; text-decoration: none;
}
body.fx-theme-studio .skb-article__meta a:hover { color: var(--color-notion-blue, #fa2f62); }

body.fx-theme-studio .skb-main-section {
  padding: clamp(8px, 2vw, 24px) 0 clamp(48px, 7vw, 88px);
}
body.fx-theme-studio .skb-main__card {
  display: grid;
  grid-template-columns: minmax(0, 1.45fr) minmax(240px, 0.65fr);
  gap: 22px;
  align-items: start;
  background: var(--color-pure-white, #ffffff);
  border: 1px solid var(--color-ash-solid, #eceaf6);
  border-radius: 28px;
  padding: clamp(22px, 3vw, 36px);
  box-shadow: 0 18px 40px -24px rgba(23, 21, 38, 0.18);
}
body.fx-theme-studio .skb-main__body { min-width: 0; }
body.fx-theme-studio .skb-main__head { margin-bottom: 22px; }
body.fx-theme-studio .skb-main__head .st-h2 { margin-bottom: 10px; }
body.fx-theme-studio .skb-main__head .st-lead { margin: 0; max-width: 48ch; }

body.fx-theme-studio .skb-search {
  display: flex; flex-wrap: wrap; gap: 12px;
  align-items: flex-end;
  margin-bottom: 22px;
}
body.fx-theme-studio .skb-search__field { flex: 1; min-width: 220px; margin: 0; }
body.fx-theme-studio .skb-page .fx-input-group { display: grid; gap: 6px; }
body.fx-theme-studio .skb-page .fx-label {
  font-size: 12px; font-weight: 600; color: #75738c; margin: 0;
}
body.fx-theme-studio .skb-search__control { position: relative; }
body.fx-theme-studio .skb-search__control > i {
  position: absolute; left: 16px; top: 50%; transform: translateY(-50%);
  color: #a09eb3; font-size: 14px; pointer-events: none;
}
body.fx-theme-studio .skb-page .fx-input {
  width: 100%; height: 48px; padding: 0 16px 0 42px;
  border-radius: 14px; border: 1.5px solid var(--color-ash-solid, #eceaf6);
  background: var(--color-pure-white, #ffffff); color: var(--color-midnight-ink, #171526); font: inherit; font-size: 15px;
  box-shadow: none; transition: border-color .15s ease, box-shadow .15s ease;
}
body.fx-theme-studio .skb-page .fx-input:focus {
  outline: none; border-color: var(--color-midnight-brand, #03061a);
  box-shadow: 0 0 0 4px rgba(23, 21, 38, 0.08);
}
body.fx-theme-studio .skb-search .st-btn { height: 48px; }

body.fx-theme-studio .skb-cats {
  display: grid; gap: 10px; margin-bottom: 28px;
}
body.fx-theme-studio .skb-cat {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 14px; align-items: center;
  padding: 16px 18px;
  border-radius: 18px; border: 1px solid var(--color-ash-solid, #eceaf6);
  background: var(--color-paper-mist, #f8faff); color: var(--color-midnight-ink, #171526); text-decoration: none;
  transition: border-color .15s ease, box-shadow .15s ease, transform .15s ease, background .15s ease;
}
body.fx-theme-studio .skb-cat:hover {
  background: var(--color-pure-white, #ffffff); border-color: #e0dceb;
  box-shadow: 0 12px 24px -16px rgba(23, 21, 38, 0.16);
  transform: translateY(-1px);
}
body.fx-theme-studio .skb-cat__icon {
  display: inline-flex; align-items: center; justify-content: center;
  width: 42px; height: 42px; border-radius: 14px;
  background: rgba(121, 77, 255, 0.12); color: var(--color-lavender, #794dff); font-size: 16px;
}
body.fx-theme-studio .skb-cat__meta { display: grid; gap: 2px; min-width: 0; }
body.fx-theme-studio .skb-cat__meta b {
  font-size: 16px; font-weight: 600; letter-spacing: -0.01em;
}
body.fx-theme-studio .skb-cat__meta small {
  font-size: 13px; color: #75738c; line-height: 1.4;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
body.fx-theme-studio .skb-cat__count {
  font-size: 12px; font-weight: 700; color: #75738c;
  white-space: nowrap;
}

body.fx-theme-studio .skb-popular { margin-top: 8px; }
body.fx-theme-studio .skb-popular__title {
  display: flex; align-items: center; gap: 10px;
  margin: 0 0 14px;
  font-size: 18px; font-weight: 600; letter-spacing: -0.015em; color: var(--color-midnight-ink, #171526);
}
body.fx-theme-studio .skb-popular__title i { color: var(--color-notion-blue, #fa2f62); }

body.fx-theme-studio .skb-list {
  list-style: none; margin: 0; padding: 0; display: grid; gap: 8px;
}
body.fx-theme-studio .skb-list__row {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 14px; align-items: center;
  padding: 14px 16px;
  border-radius: 16px; border: 1px solid var(--color-ash-solid, #eceaf6);
  background: var(--color-pure-white, #ffffff); color: var(--color-midnight-ink, #171526); text-decoration: none;
  transition: border-color .15s ease, background .15s ease;
}
body.fx-theme-studio .skb-list__row:hover {
  border-color: #e0dceb; background: var(--color-paper-mist, #f8faff);
}
body.fx-theme-studio .skb-list__icon {
  display: inline-flex; align-items: center; justify-content: center;
  width: 36px; height: 36px; border-radius: 12px;
  background: rgba(250, 47, 98, 0.1); color: var(--color-notion-blue, #fa2f62); font-size: 14px;
}
body.fx-theme-studio .skb-list__meta { display: grid; gap: 2px; min-width: 0; }
body.fx-theme-studio .skb-list__meta b {
  font-size: 15px; font-weight: 600; letter-spacing: -0.01em;
}
body.fx-theme-studio .skb-list__meta small {
  font-size: 13px; color: #75738c; line-height: 1.4;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
body.fx-theme-studio .skb-list__go { color: #a09eb3; font-size: 12px; }
body.fx-theme-studio .skb-list__row:hover .skb-list__go { color: var(--color-notion-blue, #fa2f62); }
body.fx-theme-studio .skb-list__empty {
  padding: 22px; text-align: center; color: #75738c;
  border: 1px dashed #e0dceb; border-radius: 16px; background: var(--color-paper-mist, #f8faff);
  font-size: 14px; font-weight: 600;
}

body.fx-theme-studio .skb-main__aside {
  display: grid; gap: 14px; position: sticky; top: 24px;
}
body.fx-theme-studio .skb-aside-card {
  border-radius: 20px; padding: 22px 22px 24px;
  background: var(--color-paper-mist, #f8faff); border: 1px solid var(--color-ash-solid, #eceaf6); color: var(--color-midnight-ink, #171526);
}
body.fx-theme-studio .skb-aside-card .st-kicker { margin-bottom: 14px; }
body.fx-theme-studio .skb-aside-card--ink {
  background: var(--color-midnight-brand, #03061a); border-color: var(--color-midnight-brand, #03061a); color: #ffffff;
}
body.fx-theme-studio .skb-aside-card--ink .st-kicker {
  background: rgba(151, 246, 117, 0.12); color: #97f675;
}
body.fx-theme-studio .skb-aside-card__list,
body.fx-theme-studio .skb-aside-card__links {
  list-style: none; margin: 0; padding: 0; display: grid; gap: 10px;
}
body.fx-theme-studio .skb-aside-card__list li {
  display: flex; align-items: center; gap: 10px;
  font-size: 14px; font-weight: 600; color: rgba(255,255,255,0.82);
}
body.fx-theme-studio .skb-aside-card__list li i {
  width: 1.1em; text-align: center; color: rgba(255,255,255,0.45);
}
body.fx-theme-studio .skb-aside-card__list li.is-ok i { color: #97f675; }
body.fx-theme-studio .skb-aside-card__links a {
  display: flex; align-items: center; gap: 10px;
  font-size: 14px; font-weight: 600; color: var(--color-midnight-ink, #171526);
  text-decoration: none; padding: 8px 10px; margin: 0 -10px;
  border-radius: 12px; transition: background .15s ease, color .15s ease;
}
body.fx-theme-studio .skb-aside-card__links a:hover { background: var(--color-pure-white, #ffffff); color: var(--color-notion-blue, #fa2f62); }
body.fx-theme-studio .skb-aside-card__links a i {
  width: 1.1em; text-align: center; color: var(--color-notion-blue, #fa2f62); flex-shrink: 0;
}

body.fx-theme-studio .skb-article__body {
  font-size: 16px; line-height: 1.65; color: #4f4d63;
}
body.fx-theme-studio .skb-article__body h2,
body.fx-theme-studio .skb-article__body h3 {
  color: var(--color-midnight-ink, #171526); letter-spacing: -0.02em; margin-top: 1.4em;
}
body.fx-theme-studio .skb-article__body a { color: var(--color-notion-blue, #fa2f62); }
body.fx-theme-studio .skb-article__body img {
  max-width: 100%; height: auto; border-radius: 16px;
}
body.fx-theme-studio .skb-article__body pre,
body.fx-theme-studio .skb-article__body code {
  font-family: var(--font-geist-mono);
}
body.fx-theme-studio .skb-article__body pre {
  background: var(--color-midnight-brand, #03061a); color: #f8faff; border-radius: 14px;
  padding: 16px 18px; overflow-x: auto;
}
body.fx-theme-studio .skb-article__vote {
  margin-top: 32px; padding-top: 24px; border-top: 1px solid var(--color-ash-solid, #eceaf6);
}
body.fx-theme-studio .skb-article__vote h4 {
  margin: 0 0 12px; font-size: 16px; font-weight: 600; color: var(--color-midnight-ink, #171526);
}
body.fx-theme-studio .skb-article__vote-actions {
  display: flex; flex-wrap: wrap; gap: 10px;
}
body.fx-theme-studio .skb-foot {
  display: flex; flex-wrap: wrap; gap: 10px; margin-top: 28px;
}

body.fx-theme-studio .skb-page .st-stats__row b em {
  font-style: normal; color: var(--color-notion-blue, #fa2f62); font-weight: 500;
}

@media (max-width: 960px) {
  body.fx-theme-studio .skb-main__card {
    grid-template-columns: 1fr; padding: 22px;
  }
  body.fx-theme-studio .skb-main__aside { position: static; }
}
@media (max-width: 640px) {
  body.fx-theme-studio .skb-cat {
    grid-template-columns: auto minmax(0, 1fr);
  }
  body.fx-theme-studio .skb-cat__count {
    grid-column: 2; justify-self: start;
  }
  body.fx-theme-studio .skb-search .st-btn { width: 100%; justify-content: center; }
}


/* ============================================================
   38. DOWNLOADS (sdl-*) — public Studio downloads library
   ============================================================ */
body.fx-theme-studio .sdl-page { background: var(--color-pure-white, #ffffff); }

body.fx-theme-studio .sdl-hero--compact .st-hero__title {
  font-size: clamp(28px, 3.8vw, 44px);
}

body.fx-theme-studio .sdl-main-section {
  padding: clamp(8px, 2vw, 24px) 0 clamp(48px, 7vw, 88px);
}
body.fx-theme-studio .sdl-main__card {
  display: grid;
  grid-template-columns: minmax(0, 1.45fr) minmax(240px, 0.65fr);
  gap: 22px;
  align-items: start;
  background: var(--color-pure-white, #ffffff);
  border: 1px solid var(--color-ash-solid, #eceaf6);
  border-radius: 28px;
  padding: clamp(22px, 3vw, 36px);
  box-shadow: 0 18px 40px -24px rgba(23, 21, 38, 0.18);
}
body.fx-theme-studio .sdl-main__body { min-width: 0; }
body.fx-theme-studio .sdl-main__head { margin-bottom: 22px; }
body.fx-theme-studio .sdl-main__head .st-h2 { margin-bottom: 10px; }
body.fx-theme-studio .sdl-main__head .st-lead { margin: 0; max-width: 48ch; }

body.fx-theme-studio .sdl-search {
  display: flex; flex-wrap: wrap; gap: 12px;
  align-items: flex-end;
  margin-bottom: 22px;
}
body.fx-theme-studio .sdl-search__field { flex: 1; min-width: 220px; margin: 0; }
body.fx-theme-studio .sdl-page .fx-input-group { display: grid; gap: 6px; }
body.fx-theme-studio .sdl-page .fx-label {
  font-size: 12px; font-weight: 600; color: #75738c; margin: 0;
}
body.fx-theme-studio .sdl-search__control { position: relative; }
body.fx-theme-studio .sdl-search__control > i {
  position: absolute; left: 16px; top: 50%; transform: translateY(-50%);
  color: #a09eb3; font-size: 14px; pointer-events: none;
}
body.fx-theme-studio .sdl-page .fx-input {
  width: 100%; height: 48px; padding: 0 16px 0 42px;
  border-radius: 14px; border: 1.5px solid var(--color-ash-solid, #eceaf6);
  background: var(--color-pure-white, #ffffff); color: var(--color-midnight-ink, #171526); font: inherit; font-size: 15px;
  box-shadow: none; transition: border-color .15s ease, box-shadow .15s ease;
}
body.fx-theme-studio .sdl-page .fx-input:focus {
  outline: none; border-color: var(--color-midnight-brand, #03061a);
  box-shadow: 0 0 0 4px rgba(23, 21, 38, 0.08);
}
body.fx-theme-studio .sdl-search .st-btn { height: 48px; }

body.fx-theme-studio .sdl-cats {
  display: grid; gap: 10px; margin-bottom: 28px;
}
body.fx-theme-studio .sdl-cat {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 14px; align-items: center;
  padding: 16px 18px;
  border-radius: 18px; border: 1px solid var(--color-ash-solid, #eceaf6);
  background: var(--color-paper-mist, #f8faff); color: var(--color-midnight-ink, #171526); text-decoration: none;
  transition: border-color .15s ease, box-shadow .15s ease, transform .15s ease, background .15s ease;
}
body.fx-theme-studio .sdl-cat:hover {
  background: var(--color-pure-white, #ffffff); border-color: #e0dceb;
  box-shadow: 0 12px 24px -16px rgba(23, 21, 38, 0.16);
  transform: translateY(-1px);
}
body.fx-theme-studio .sdl-cat__icon {
  display: inline-flex; align-items: center; justify-content: center;
  width: 42px; height: 42px; border-radius: 14px;
  background: rgba(121, 77, 255, 0.12); color: var(--color-lavender, #794dff); font-size: 16px;
}
body.fx-theme-studio .sdl-cat__meta { display: grid; gap: 2px; min-width: 0; }
body.fx-theme-studio .sdl-cat__meta b {
  font-size: 16px; font-weight: 600; letter-spacing: -0.01em;
}
body.fx-theme-studio .sdl-cat__meta small {
  font-size: 13px; color: #75738c; line-height: 1.4;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
body.fx-theme-studio .sdl-cat__count {
  font-size: 12px; font-weight: 700; color: #75738c; white-space: nowrap;
}

body.fx-theme-studio .sdl-popular { margin-top: 8px; }
body.fx-theme-studio .sdl-popular__title {
  display: flex; align-items: center; gap: 10px;
  margin: 0 0 14px;
  font-size: 18px; font-weight: 600; letter-spacing: -0.015em; color: var(--color-midnight-ink, #171526);
}
body.fx-theme-studio .sdl-popular__title i { color: var(--color-notion-blue, #fa2f62); }

body.fx-theme-studio .sdl-list {
  list-style: none; margin: 0; padding: 0; display: grid; gap: 8px;
}
body.fx-theme-studio .sdl-list__row {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 14px; align-items: center;
  padding: 14px 16px;
  border-radius: 16px; border: 1px solid var(--color-ash-solid, #eceaf6);
  background: var(--color-pure-white, #ffffff); color: var(--color-midnight-ink, #171526); text-decoration: none;
  transition: border-color .15s ease, background .15s ease;
}
body.fx-theme-studio .sdl-list__row:hover {
  border-color: #e0dceb; background: var(--color-paper-mist, #f8faff);
}
body.fx-theme-studio .sdl-list__icon {
  display: inline-flex; align-items: center; justify-content: center;
  width: 36px; height: 36px; border-radius: 12px;
  background: rgba(0, 150, 110, 0.12); color: #00966e; font-size: 14px;
}
body.fx-theme-studio .sdl-list__meta { display: grid; gap: 2px; min-width: 0; }
body.fx-theme-studio .sdl-list__meta b {
  font-size: 15px; font-weight: 600; letter-spacing: -0.01em;
  display: flex; flex-wrap: wrap; align-items: center; gap: 8px;
}
body.fx-theme-studio .sdl-list__meta small {
  font-size: 13px; color: #75738c; line-height: 1.4;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
body.fx-theme-studio .sdl-list__lock {
  display: inline-flex; align-items: center; gap: 5px;
  font-size: 11px; font-weight: 700; color: #c2410c;
  background: #fff4ed; border-radius: 999px; padding: 3px 8px;
}
body.fx-theme-studio .sdl-list__go { color: #a09eb3; font-size: 12px; }
body.fx-theme-studio .sdl-list__row:hover .sdl-list__go { color: var(--color-notion-blue, #fa2f62); }
body.fx-theme-studio .sdl-list__empty {
  padding: 22px; text-align: center; color: #75738c;
  border: 1px dashed #e0dceb; border-radius: 16px; background: var(--color-paper-mist, #f8faff);
  font-size: 14px; font-weight: 600;
}

body.fx-theme-studio .sdl-main__aside {
  display: grid; gap: 14px; position: sticky; top: 24px;
}
body.fx-theme-studio .sdl-aside-card {
  border-radius: 20px; padding: 22px 22px 24px;
  background: var(--color-paper-mist, #f8faff); border: 1px solid var(--color-ash-solid, #eceaf6); color: var(--color-midnight-ink, #171526);
}
body.fx-theme-studio .sdl-aside-card .st-kicker { margin-bottom: 14px; }
body.fx-theme-studio .sdl-aside-card--ink {
  background: var(--color-midnight-brand, #03061a); border-color: var(--color-midnight-brand, #03061a); color: #ffffff;
}
body.fx-theme-studio .sdl-aside-card--ink .st-kicker {
  background: rgba(151, 246, 117, 0.12); color: #97f675;
}
body.fx-theme-studio .sdl-aside-card__list,
body.fx-theme-studio .sdl-aside-card__links {
  list-style: none; margin: 0; padding: 0; display: grid; gap: 10px;
}
body.fx-theme-studio .sdl-aside-card__list li {
  display: flex; align-items: center; gap: 10px;
  font-size: 14px; font-weight: 600; color: rgba(255,255,255,0.82);
}
body.fx-theme-studio .sdl-aside-card__list li i {
  width: 1.1em; text-align: center; color: rgba(255,255,255,0.45);
}
body.fx-theme-studio .sdl-aside-card__list li.is-ok i { color: #97f675; }
body.fx-theme-studio .sdl-aside-card__links a {
  display: flex; align-items: center; gap: 10px;
  font-size: 14px; font-weight: 600; color: var(--color-midnight-ink, #171526);
  text-decoration: none; padding: 8px 10px; margin: 0 -10px;
  border-radius: 12px; transition: background .15s ease, color .15s ease;
}
body.fx-theme-studio .sdl-aside-card__links a:hover { background: var(--color-pure-white, #ffffff); color: var(--color-notion-blue, #fa2f62); }
body.fx-theme-studio .sdl-aside-card__links a i {
  width: 1.1em; text-align: center; color: var(--color-notion-blue, #fa2f62); flex-shrink: 0;
}

body.fx-theme-studio .sdl-foot {
  display: flex; flex-wrap: wrap; gap: 10px; margin-top: 28px;
}

body.fx-theme-studio .sdl-page .st-stats__row b em {
  font-style: normal; color: var(--color-notion-blue, #fa2f62); font-weight: 500;
}

@media (max-width: 960px) {
  body.fx-theme-studio .sdl-main__card {
    grid-template-columns: 1fr; padding: 22px;
  }
  body.fx-theme-studio .sdl-main__aside { position: static; }
}
@media (max-width: 640px) {
  body.fx-theme-studio .sdl-cat {
    grid-template-columns: auto minmax(0, 1fr);
  }
  body.fx-theme-studio .sdl-cat__count {
    grid-column: 2; justify-self: start;
  }
  body.fx-theme-studio .sdl-search .st-btn { width: 100%; justify-content: center; }
}


/* ============================================================
   39. PUBLIC TICKET SUBMIT (stk-*) — guest Studio submitticket
   ============================================================ */
body.fx-theme-studio .stk-page { background: var(--color-pure-white, #ffffff); }

body.fx-theme-studio .stk-hero--compact .st-hero__title {
  font-size: clamp(28px, 3.8vw, 44px);
}

body.fx-theme-studio .stk-main-section {
  padding: clamp(8px, 2vw, 24px) 0 clamp(48px, 7vw, 88px);
}
body.fx-theme-studio .stk-main__card {
  display: grid;
  grid-template-columns: minmax(0, 1.45fr) minmax(240px, 0.65fr);
  gap: 22px;
  align-items: start;
  background: var(--color-pure-white, #ffffff);
  border: 1px solid var(--color-ash-solid, #eceaf6);
  border-radius: 28px;
  padding: clamp(22px, 3vw, 36px);
  box-shadow: 0 18px 40px -24px rgba(23, 21, 38, 0.18);
}
body.fx-theme-studio .stk-main__body { min-width: 0; }
body.fx-theme-studio .stk-main__head { margin-bottom: 22px; }
body.fx-theme-studio .stk-main__head .st-h2 { margin-bottom: 10px; }
body.fx-theme-studio .stk-main__head .st-lead { margin: 0; max-width: 48ch; }

body.fx-theme-studio .stk-depts { display: grid; gap: 10px; }
body.fx-theme-studio .stk-dept {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 14px; align-items: center;
  padding: 16px 18px;
  border-radius: 18px; border: 1px solid var(--color-ash-solid, #eceaf6);
  background: var(--color-paper-mist, #f8faff); color: var(--color-midnight-ink, #171526); text-decoration: none;
  transition: border-color .15s ease, box-shadow .15s ease, transform .15s ease, background .15s ease;
}
body.fx-theme-studio .stk-dept:hover {
  background: var(--color-pure-white, #ffffff); border-color: #e0dceb;
  box-shadow: 0 12px 24px -16px rgba(23, 21, 38, 0.16);
  transform: translateY(-1px);
}
body.fx-theme-studio .stk-dept__icon {
  display: inline-flex; align-items: center; justify-content: center;
  width: 42px; height: 42px; border-radius: 14px;
  background: rgba(250, 47, 98, 0.1); color: var(--color-notion-blue, #fa2f62); font-size: 16px;
}
body.fx-theme-studio .stk-dept__meta { display: grid; gap: 2px; min-width: 0; }
body.fx-theme-studio .stk-dept__meta b {
  font-size: 16px; font-weight: 600; letter-spacing: -0.01em;
}
body.fx-theme-studio .stk-dept__meta small {
  font-size: 13px; color: #75738c; line-height: 1.4;
}
body.fx-theme-studio .stk-dept__go { color: #a09eb3; font-size: 12px; }
body.fx-theme-studio .stk-dept:hover .stk-dept__go { color: var(--color-notion-blue, #fa2f62); }

body.fx-theme-studio .stk-form { display: grid; gap: 14px; }
body.fx-theme-studio .stk-form__row {
  display: grid; grid-template-columns: 1fr 1fr; gap: 14px;
}
body.fx-theme-studio .stk-form__row--3 {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
body.fx-theme-studio .stk-page .fx-input-group {
  display: grid; gap: 6px; margin: 0;
}
body.fx-theme-studio .stk-page .fx-label {
  font-size: 12px; font-weight: 600; color: #75738c; margin: 0;
}
body.fx-theme-studio .stk-page .fx-input,
body.fx-theme-studio .stk-page select.fx-input {
  width: 100%; height: 46px; padding: 0 16px;
  border-radius: 14px; border: 1.5px solid var(--color-ash-solid, #eceaf6);
  background: var(--color-pure-white, #ffffff); color: var(--color-midnight-ink, #171526); font: inherit; font-size: 15px;
  box-shadow: none; transition: border-color .15s ease, box-shadow .15s ease;
}
body.fx-theme-studio .stk-page select.fx-input {
  appearance: none; -webkit-appearance: none;
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%2356546b' stroke-width='1.6' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 14px center;
  padding-right: 36px;
}
body.fx-theme-studio .stk-page textarea.fx-input,
body.fx-theme-studio .stk-page .fx-input--area {
  height: auto; min-height: 160px; padding: 14px 16px; resize: vertical;
}
body.fx-theme-studio .stk-page .fx-input:focus,
body.fx-theme-studio .stk-page select.fx-input:focus {
  outline: none; border-color: var(--color-midnight-brand, #03061a);
  box-shadow: 0 0 0 4px rgba(23, 21, 38, 0.08);
}

body.fx-theme-studio .stk-attach__row {
  display: flex; flex-wrap: wrap; gap: 10px; align-items: center;
}
body.fx-theme-studio .stk-attach__file {
  position: relative; flex: 1; min-width: 200px;
}
body.fx-theme-studio .stk-attach__file .custom-file-label {
  display: flex; align-items: center;
  height: 46px; padding: 0 16px;
  border-radius: 14px; border: 1.5px solid var(--color-ash-solid, #eceaf6);
  background: var(--color-paper-mist, #f8faff); color: #56546b;
  font-size: 14px; font-weight: 600; cursor: pointer;
  overflow: hidden; white-space: nowrap; text-overflow: ellipsis;
}
body.fx-theme-studio .stk-attach__file .custom-file-input {
  position: absolute; inset: 0; opacity: 0; cursor: pointer;
}
body.fx-theme-studio .stk-attach__hint {
  margin: 8px 0 0; font-size: 12px; color: #75738c; line-height: 1.45;
}
body.fx-theme-studio .stk-form__captcha {
  padding: 12px 14px; border-radius: 16px;
  background: var(--color-paper-mist, #f8faff); border: 1px solid var(--color-ash-solid, #eceaf6);
}
body.fx-theme-studio .stk-form__actions {
  display: flex; flex-wrap: wrap; gap: 10px; align-items: center; margin-top: 4px;
}

body.fx-theme-studio .stk-main__aside {
  display: grid; gap: 14px; position: sticky; top: 24px;
}
body.fx-theme-studio .stk-aside-card {
  border-radius: 20px; padding: 22px 22px 24px;
  background: var(--color-paper-mist, #f8faff); border: 1px solid var(--color-ash-solid, #eceaf6); color: var(--color-midnight-ink, #171526);
}
body.fx-theme-studio .stk-aside-card .st-kicker { margin-bottom: 14px; }
body.fx-theme-studio .stk-aside-card--ink {
  background: var(--color-midnight-brand, #03061a); border-color: var(--color-midnight-brand, #03061a); color: #ffffff;
}
body.fx-theme-studio .stk-aside-card--ink .st-kicker {
  background: rgba(151, 246, 117, 0.12); color: #97f675;
}
body.fx-theme-studio .stk-aside-card__list,
body.fx-theme-studio .stk-aside-card__links {
  list-style: none; margin: 0; padding: 0; display: grid; gap: 10px;
}
body.fx-theme-studio .stk-aside-card__list li {
  display: flex; align-items: center; gap: 10px;
  font-size: 14px; font-weight: 600; color: rgba(255,255,255,0.82);
}
body.fx-theme-studio .stk-aside-card__list li i {
  width: 1.1em; text-align: center; color: rgba(255,255,255,0.45);
}
body.fx-theme-studio .stk-aside-card__list li.is-ok i { color: #97f675; }
body.fx-theme-studio .stk-aside-card__links a {
  display: flex; align-items: center; gap: 10px;
  font-size: 14px; font-weight: 600; color: var(--color-midnight-ink, #171526);
  text-decoration: none; padding: 8px 10px; margin: 0 -10px;
  border-radius: 12px; transition: background .15s ease, color .15s ease;
}
body.fx-theme-studio .stk-aside-card__links a:hover { background: var(--color-pure-white, #ffffff); color: var(--color-notion-blue, #fa2f62); }
body.fx-theme-studio .stk-aside-card__links a i {
  width: 1.1em; text-align: center; color: var(--color-notion-blue, #fa2f62); flex-shrink: 0;
}

body.fx-theme-studio .stk-confirm { display: grid; gap: 12px; }
body.fx-theme-studio .stk-confirm__badge {
  display: inline-flex; align-items: center; gap: 8px; width: fit-content;
  background: #edfbf5; color: #00966e; border-radius: 999px;
  padding: 6px 14px; font-size: 13px; font-weight: 700;
}
body.fx-theme-studio .stk-confirm .st-h2 { margin: 0; }
body.fx-theme-studio .stk-confirm .st-lead { margin: 0; }

body.fx-theme-studio .stk-page .st-stats__row b em {
  font-style: normal; color: var(--color-notion-blue, #fa2f62); font-weight: 500;
}

@media (max-width: 960px) {
  body.fx-theme-studio .stk-main__card {
    grid-template-columns: 1fr; padding: 22px;
  }
  body.fx-theme-studio .stk-main__aside { position: static; }
  body.fx-theme-studio .stk-form__row--3 { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 640px) {
  body.fx-theme-studio .stk-form__row,
  body.fx-theme-studio .stk-form__row--3 { grid-template-columns: 1fr; }
  body.fx-theme-studio .stk-form__actions .st-btn { width: 100%; justify-content: center; }
}


/* ------------------------------------------------------------
   DARK PALETTE — readable surfaces when admin dark presets are active
   body.fx-palette-dark is set from the active color preset mode.
   ------------------------------------------------------------ */
body.fx-theme-studio.fx-palette-dark {
  background: var(--surface-page, #0a0a0a);
  color: var(--color-midnight-ink, #fafafa);
}

/* Pastel “light island” cards: keep tint but force dark ink */
body.fx-theme-studio.fx-palette-dark .sto-ca-tile--stat-mint,
body.fx-theme-studio.fx-palette-dark .sto-ca-tile--stat-sky {
  color: #14121c;
}
body.fx-theme-studio.fx-palette-dark .sto-ca-tile--stat-mint .sto-ca-tile__mega,
body.fx-theme-studio.fx-palette-dark .sto-ca-tile--stat-sky .sto-ca-tile__mega,
body.fx-theme-studio.fx-palette-dark .sto-ca-tile--stat-mint .sto-ca-tile__meta,
body.fx-theme-studio.fx-palette-dark .sto-ca-tile--stat-sky .sto-ca-tile__meta,
body.fx-theme-studio.fx-palette-dark .sto-ca-tile--stat-mint .sto-ca-tile__kicker,
body.fx-theme-studio.fx-palette-dark .sto-ca-tile--stat-sky .sto-ca-tile__kicker {
  color: inherit;
}

/* Prefer darkened pastels so they match the dark shell */
body.fx-theme-studio.fx-palette-dark .sto-ca-tile--stat-mint {
  background: #14301c;
  border-color: #1e4a2c;
  color: #ecfdf5;
}
body.fx-theme-studio.fx-palette-dark .sto-ca-tile--stat-sky {
  background: #1a1528;
  border-color: #2e2550;
  color: #efeaff;
}

/* Unpaid / warn cards — dark rose, never chalk pink + white type */
body.fx-theme-studio.fx-palette-dark .sto-stat.is-warn,
body.fx-theme-studio.fx-palette-dark .sto-ca-tile--stat.is-warn,
body.fx-theme-studio.fx-palette-dark .sto-list-top__stat.is-warn {
  background: #2a1218;
  border-color: #6b1f32;
  color: #fecdd3;
}
body.fx-theme-studio.fx-palette-dark .sto-stat.is-warn .sto-stat__kicker,
body.fx-theme-studio.fx-palette-dark .sto-stat.is-warn .sto-stat__value,
body.fx-theme-studio.fx-palette-dark .sto-stat.is-warn .sto-stat__foot,
body.fx-theme-studio.fx-palette-dark .sto-ca-tile--stat.is-warn .sto-ca-tile__kicker,
body.fx-theme-studio.fx-palette-dark .sto-ca-tile--stat.is-warn .sto-ca-tile__mega,
body.fx-theme-studio.fx-palette-dark .sto-ca-tile--stat.is-warn .sto-ca-tile__meta,
body.fx-theme-studio.fx-palette-dark .sto-list-top__stat.is-warn .sto-ca-tile__kicker,
body.fx-theme-studio.fx-palette-dark .sto-list-top__stat.is-warn .sto-ca-tile__mega,
body.fx-theme-studio.fx-palette-dark .sto-list-top__stat.is-warn .sto-ca-tile__meta {
  color: #fecdd3;
}
body.fx-theme-studio.fx-palette-dark .sto-stat.is-warn .sto-stat__hint,
body.fx-theme-studio.fx-palette-dark .sto-stat.is-warn .sto-stat__updated {
  color: rgba(254, 205, 211, 0.72);
}
body.fx-theme-studio.fx-palette-dark .sto-stat.is-warn .sto-stat__mark {
  background: rgba(254, 205, 211, 0.14);
  color: #fecdd3;
}
body.fx-theme-studio.fx-palette-dark a.sto-stat.is-warn:hover .sto-stat__foot {
  color: #fda4af;
}

/* Status pills / alerts on dark */
body.fx-theme-studio.fx-palette-dark .sto-status--pending,
body.fx-theme-studio.fx-palette-dark .sto-status--unpaid,
body.fx-theme-studio.fx-palette-dark .sto-status--in-progress,
body.fx-theme-studio.fx-palette-dark .sto-status--delivered,
body.fx-theme-studio.fx-palette-dark .sto-dash-pill--warn,
body.fx-theme-studio.fx-palette-dark .sto-ca-home__badge--warn,
body.fx-theme-studio.fx-palette-dark .sto-ca-home__badge--pending {
  background: #3b2110;
  border-color: #7c3f12;
  color: #fdba74;
}
body.fx-theme-studio.fx-palette-dark .sto-status--cancelled,
body.fx-theme-studio.fx-palette-dark .sto-status--suspended,
body.fx-theme-studio.fx-palette-dark .sto-status--overdue,
body.fx-theme-studio.fx-palette-dark .sto-status--collections,
body.fx-theme-studio.fx-palette-dark .sto-dash-pill--danger,
body.fx-theme-studio.fx-palette-dark .sto-ca-home__badge--danger,
body.fx-theme-studio.fx-palette-dark .sto-ca-home__badge--suspended {
  background: #3b1219;
  border-color: #7f1d1d;
  color: #fecdd3;
}
body.fx-theme-studio.fx-palette-dark .sto-status--active,
body.fx-theme-studio.fx-palette-dark .sto-status--paid,
body.fx-theme-studio.fx-palette-dark .sto-status--open,
body.fx-theme-studio.fx-palette-dark .sto-status--answered,
body.fx-theme-studio.fx-palette-dark .sto-dash-pill--ok,
body.fx-theme-studio.fx-palette-dark .sto-ca-home__badge--ok,
body.fx-theme-studio.fx-palette-dark .sto-ca-home__badge--active {
  background: #0f2e22;
  border-color: #166534;
  color: #86efac;
}
body.fx-theme-studio.fx-palette-dark .sto-alert--warning {
  background: rgba(245, 166, 35, 0.14);
  border-color: rgba(245, 166, 35, 0.4);
  color: #fdba74;
}
body.fx-theme-studio.fx-palette-dark .sto-alert--error,
body.fx-theme-studio.fx-palette-dark .sto-alert--danger {
  background: rgba(229, 72, 77, 0.14);
  border-color: rgba(229, 72, 77, 0.4);
  color: #fecdd3;
}

/* Ghost / outline on dark canvas */
body.fx-theme-studio.fx-palette-dark .st-btn--ghost,
body.fx-theme-studio.fx-palette-dark .btn-default,
body.fx-theme-studio.fx-palette-dark .btn-outline-primary {
  background: transparent;
  border-color: rgba(255, 255, 255, 0.22);
  color: var(--color-midnight-ink, #fafafa);
}
body.fx-theme-studio.fx-palette-dark .st-btn--ghost:hover,
body.fx-theme-studio.fx-palette-dark .btn-default:hover,
body.fx-theme-studio.fx-palette-dark .btn-outline-primary:hover {
  border-color: var(--color-notion-blue, #a3e635);
  color: var(--color-notion-blue, #a3e635);
  background: transparent;
}

/* Primary pills: accent fill + dark label on dark palettes */
body.fx-theme-studio.fx-palette-dark .st-btn--primary,
body.fx-theme-studio.fx-palette-dark .btn-primary,
body.fx-theme-studio.fx-palette-dark .fx-btn-primary {
  background: var(--color-primary-action-fill, var(--color-notion-blue));
  border-color: var(--color-primary-action-fill, var(--color-notion-blue));
  color: #0a0a0a;
}
body.fx-theme-studio.fx-palette-dark .st-btn--primary:hover,
body.fx-theme-studio.fx-palette-dark .btn-primary:hover,
body.fx-theme-studio.fx-palette-dark .fx-btn-primary:hover {
  background: var(--color-sky-wash, var(--color-notion-blue));
  border-color: var(--color-sky-wash, var(--color-notion-blue));
  color: #0a0a0a;
}

/* Bright accent billboards need dark type on dark palettes (lime/cyan/etc) */
body.fx-theme-studio.fx-palette-dark .st-fcard--violet,
body.fx-theme-studio.fx-palette-dark .st-fcard--pink {
  color: #0a0a0a;
}
body.fx-theme-studio.fx-palette-dark .st-fcard--violet p,
body.fx-theme-studio.fx-palette-dark .st-fcard--pink p {
  color: rgba(10, 10, 10, 0.72);
}
body.fx-theme-studio.fx-palette-dark .st-fcard--violet .st-fcard__icon,
body.fx-theme-studio.fx-palette-dark .st-fcard--pink .st-fcard__icon {
  background: rgba(0, 0, 0, 0.12);
  color: #0a0a0a;
}

/* FAQ / accordion / testimonial style light bars → card surface */
body.fx-theme-studio.fx-palette-dark .st-faq__item,
body.fx-theme-studio.fx-palette-dark .st-quote,
body.fx-theme-studio.fx-palette-dark .st-stack-card,
body.fx-theme-studio.fx-palette-dark .st-keep__card,
body.fx-theme-studio.fx-palette-dark .st-fcard:not([class*="--"]),
body.fx-theme-studio.fx-palette-dark .st-svc,
body.fx-theme-studio.fx-palette-dark .st-panel,
body.fx-theme-studio.fx-palette-dark .st-card {
  color: var(--color-midnight-ink, #fafafa);
}

/* Soft light islands that remain pastel: force dark readable ink */
body.fx-theme-studio.fx-palette-dark [class*="st-"][style*="background"],
body.fx-theme-studio.fx-palette-dark .st-fcard--paper,
body.fx-theme-studio.fx-palette-dark .st-fcard--soft {
  color: var(--color-midnight-ink);
}

/* Borders + surfaces — kill harsh white outlines on dark palettes */
body.fx-theme-studio.fx-palette-dark {
  --sto-line: rgba(255, 255, 255, 0.08);
  --color-ash-solid: rgba(255, 255, 255, 0.08);
  --color-smoke: rgba(255, 255, 255, 0.1);
  --color-pebble: rgba(255, 255, 255, 0.14);
  --shadow-subtle: 0 1px 2px rgba(0, 0, 0, 0.35);
  --shadow-sm: 0 8px 24px rgba(0, 0, 0, 0.35);
}

/* Motion stage: no white halo / wash plate */
body.fx-theme-studio.fx-palette-dark .st-motion__wash {
  background:
    radial-gradient(80% 60% at 50% 30%, color-mix(in srgb, var(--color-notion-blue, #22d3ee) 14%, transparent) 0%, transparent 60%),
    radial-gradient(50% 40% at 15% 85%, color-mix(in srgb, var(--color-lavender, #a3e635) 10%, transparent) 0%, transparent 55%),
    linear-gradient(180deg, var(--surface-page, #0a0a0a) 0%, var(--surface-page, #0a0a0a) 100%);
}
body.fx-theme-studio.fx-palette-dark .st-motion__stage {
  box-shadow:
    0 28px 60px -28px rgba(0, 0, 0, 0.75),
    0 0 0 1px rgba(255, 255, 255, 0.06),
    0 12px 40px -16px color-mix(in srgb, var(--color-notion-blue, #22d3ee) 28%, transparent);
}
body.fx-theme-studio.fx-palette-dark .st-motion__stage::after {
  background: linear-gradient(180deg, rgba(255,255,255,0.04) 0%, transparent 22%, transparent 78%, rgba(0,0,0,0.35) 100%);
}

/* Soft hairlines instead of chalk-white card frames */
body.fx-theme-studio.fx-palette-dark .st-fcard,
body.fx-theme-studio.fx-palette-dark .st-quote,
body.fx-theme-studio.fx-palette-dark .st-svc,
body.fx-theme-studio.fx-palette-dark .st-panel,
body.fx-theme-studio.fx-palette-dark .st-card,
body.fx-theme-studio.fx-palette-dark .st-faq__acc .fx-acc__item,
body.fx-theme-studio.fx-palette-dark .st-float,
body.fx-theme-studio.fx-palette-dark .st-ticker,
body.fx-theme-studio.fx-palette-dark .st-logo-card,
body.fx-theme-studio.fx-palette-dark .st-nav-panel.fx-nm-panel,
body.fx-theme-studio.fx-palette-dark .st-navbar,
body.fx-theme-studio.fx-palette-dark .st-nav-item,
body.fx-theme-studio.fx-palette-dark .fx-footer,
body.fx-theme-studio.fx-palette-dark .sto-ca-tile,
body.fx-theme-studio.fx-palette-dark .sto-stat,
body.fx-theme-studio.fx-palette-dark .sto-table tbody td,
body.fx-theme-studio.fx-palette-dark table.dataTable tbody td {
  border-color: rgba(255, 255, 255, 0.08) !important;
}

body.fx-theme-studio.fx-palette-dark .st-navbar,
body.fx-theme-studio.fx-palette-dark .st-nav-panel.fx-nm-panel,
body.fx-theme-studio.fx-palette-dark .st-float,
body.fx-theme-studio.fx-palette-dark .st-fcard:not([class*="st-fcard--"]),
body.fx-theme-studio.fx-palette-dark .st-quote,
body.fx-theme-studio.fx-palette-dark .st-faq__acc .fx-acc__item {
  box-shadow: 0 10px 28px -18px rgba(0, 0, 0, 0.65);
}

body.fx-theme-studio.fx-palette-dark .fx-footer {
  background: var(--surface-page, #0a0a0a);
  border-top-color: rgba(255, 255, 255, 0.08);
}
body.fx-theme-studio.fx-palette-dark .fx-footer__bottom {
  border-top-color: rgba(255, 255, 255, 0.08);
}

/* Navbar pill — frosted dark, not chalk white */
body.fx-theme-studio.fx-palette-dark .fx-navbar,
body.fx-theme-studio.fx-palette-dark .st-navbar {
  background: rgba(18, 18, 22, 0.88);
  border-color: rgba(255, 255, 255, 0.1);
  box-shadow: 0 8px 28px rgba(0, 0, 0, 0.45);
}
body.fx-theme-studio.fx-palette-dark .fx-navbar__brand b,
body.fx-theme-studio.fx-palette-dark .st-nm .fx-nm-trigger {
  color: var(--color-midnight-ink, #fafafa);
}
body.fx-theme-studio.fx-palette-dark .st-nm .fx-nm-trigger:hover,
body.fx-theme-studio.fx-palette-dark .st-nm .fx-nm-trigger:focus-visible,
body.fx-theme-studio.fx-palette-dark .st-nm .fx-nm-trigger[aria-expanded="true"] {
  background: rgba(255, 255, 255, 0.08);
  color: #fff;
}
body.fx-theme-studio.fx-palette-dark .st-nav-panel.fx-nm-panel {
  background: #141418;
  border-color: rgba(255, 255, 255, 0.1);
}
body.fx-theme-studio.fx-palette-dark .st-nav-item:hover {
  background: rgba(255, 255, 255, 0.05);
  border-color: rgba(255, 255, 255, 0.1);
}
body.fx-theme-studio.fx-palette-dark .st-nav-login,
body.fx-theme-studio.fx-palette-dark .st-navbar__cluster .fx-btn-outline {
  background: transparent;
  border-color: rgba(255, 255, 255, 0.18);
  color: var(--color-midnight-ink, #fafafa);
}

/* Hero float chips */
body.fx-theme-studio.fx-palette-dark .st-float {
  background: rgba(20, 20, 24, 0.92);
  border-color: rgba(255, 255, 255, 0.1);
  color: var(--color-midnight-ink, #fafafa);
}

/* Logo wall / small grid chips */
body.fx-theme-studio.fx-palette-dark .st-logos,
body.fx-theme-studio.fx-palette-dark .st-logo-card,
body.fx-theme-studio.fx-palette-dark .st-logos__card {
  border-color: rgba(255, 255, 255, 0.08);
  background: var(--surface-card, #141414);
}
body.fx-theme-studio.fx-palette-dark .st-logos__name {
  color: rgba(255, 255, 255, 0.55);
}
body.fx-theme-studio.fx-palette-dark .st-logos__card:hover .st-logos__name {
  color: #fff;
}
body.fx-theme-studio.fx-palette-dark .st-logos__mark {
  filter: brightness(0) invert(1);
  opacity: 0.7;
}

/* Portal list hairlines */
body.fx-theme-studio.fx-palette-dark.sto-portal .sto-table tbody td,
body.fx-theme-studio.fx-palette-dark.sto-portal table.dataTable tbody td {
  border-bottom-color: rgba(255, 255, 255, 0.06) !important;
}
body.fx-theme-studio.fx-palette-dark.sto-portal .sto-side__link:hover {
  background: rgba(255, 255, 255, 0.06);
}

/* Client area surfaces that stayed chalk-white under dark / tinted palettes */
body.fx-theme-studio.fx-palette-dark.sto-portal .sto-ca-home__domain-visual {
  background: linear-gradient(
    160deg,
    color-mix(in srgb, var(--color-peach, #365314) 35%, var(--sto-mist)) 0%,
    color-mix(in srgb, var(--color-saffron, #facc15) 14%, var(--sto-mist)) 100%
  );
}
body.fx-theme-studio.fx-palette-dark.sto-portal .sto-ca-home__domain-ui,
body.fx-theme-studio.fx-palette-dark.sto-portal .sto-domain__field,
body.fx-theme-studio.fx-palette-dark.sto-portal .sto-ca-home__pill,
body.fx-theme-studio.fx-palette-dark.sto-portal .fx-portal-filters .fx-btn {
  background: var(--sto-card);
  border-color: var(--sto-line);
  color: var(--sto-ink);
}
body.fx-theme-studio.fx-palette-dark.sto-portal .sto-top__menu,
body.fx-theme-studio.fx-palette-dark.sto-portal .sto-top__cart {
  background: var(--sto-mist);
  border-color: var(--sto-line);
  color: var(--sto-ink);
}
body.fx-theme-studio.fx-palette-dark.sto-portal .sto-deploy__card:hover {
  background: var(--sto-card);
  border-color: color-mix(in srgb, var(--sto-magenta) 40%, var(--sto-line));
}
body.fx-theme-studio.fx-palette-dark.sto-portal .sto-sys-status {
  background: var(--color-soft-mint, #0f2e22);
  border-color: color-mix(in srgb, var(--color-vivid-green, #34d399) 35%, transparent);
  color: var(--color-vivid-green, #86efac);
}

/* Domain transfer / register — kill chalk hero wash on dark presets */
body.fx-theme-studio.fx-palette-dark .std-page {
  background: var(--surface-page, #0a0a0a);
}
body.fx-theme-studio.fx-palette-dark .std-hero--transfer {
  background: linear-gradient(
    180deg,
    var(--surface-card, #141414) 0%,
    var(--surface-page, #0a0a0a) 72%
  );
}
body.fx-theme-studio.fx-palette-dark .std-search__field {
  background: var(--surface-card, #141414);
  border-color: rgba(255, 255, 255, 0.12);
}
body.fx-theme-studio.fx-palette-dark .std-search__field:focus-within {
  border-color: var(--color-notion-blue, #fa2f62);
  box-shadow: 0 0 0 4px rgba(250, 47, 98, 0.18);
}
body.fx-theme-studio.fx-palette-dark .std-search__input,
body.fx-theme-studio.fx-palette-dark .std-search .fx-domain-page__input {
  color: var(--color-midnight-ink, #fafafa);
}
body.fx-theme-studio.fx-palette-dark .std-search__help {
  background: rgba(255, 255, 255, 0.06);
  color: rgba(255, 255, 255, 0.7);
}
body.fx-theme-studio.fx-palette-dark .std-search__help-panel,
body.fx-theme-studio.fx-palette-dark .std-chip:not(.is-active),
body.fx-theme-studio.fx-palette-dark .std-avail__bar,
body.fx-theme-studio.fx-palette-dark .std-timeline__bar {
  background: var(--surface-card, #141414);
  border-color: rgba(255, 255, 255, 0.1);
  color: var(--color-midnight-ink, #fafafa);
}
body.fx-theme-studio.fx-palette-dark .std-search__more,
body.fx-theme-studio.fx-palette-dark .std-search__more summary,
body.fx-theme-studio.fx-palette-dark .std-hero__note,
body.fx-theme-studio.fx-palette-dark .std-avail__hint {
  color: rgba(255, 255, 255, 0.62);
}
body.fx-theme-studio.fx-palette-dark .std-timeline li {
  border-color: rgba(255, 255, 255, 0.08);
  color: var(--color-midnight-ink, #fafafa);
}

/* Studio mega → Company: second column was chalk #fbfbfe */
body.fx-theme-studio.fx-palette-dark .st-nav-company__col + .st-nav-company__col {
  background: rgba(255, 255, 255, 0.03);
  border-left-color: rgba(255, 255, 255, 0.08);
}
body.fx-theme-studio.fx-palette-dark .st-nav-company__label {
  color: rgba(255, 255, 255, 0.45);
}
body.fx-theme-studio.fx-palette-dark .st-nav-panel__foot {
  border-top-color: rgba(255, 255, 255, 0.08);
  background: transparent;
}
body.fx-theme-studio.fx-palette-dark .st-nav-footlink:hover {
  background: rgba(255, 255, 255, 0.06);
}
body.fx-theme-studio.fx-palette-dark .st-nav-item__icon {
  background: rgba(255, 255, 255, 0.06);
  color: var(--color-midnight-ink, #fafafa);
}
body.fx-theme-studio.fx-palette-dark .st-nav-item__title {
  color: var(--color-midnight-ink, #fafafa);
}
body.fx-theme-studio.fx-palette-dark .st-nav-item__desc {
  color: rgba(255, 255, 255, 0.55);
}

/* License gate — Studio surface */
body.fx-theme-studio .fx-license-gate--studio {
  padding: clamp(40px, 8vw, 96px) 24px;
}
body.fx-theme-studio .fx-license-gate--studio .fx-license-gate__card {
  border-radius: 28px;
  border: 1px solid var(--sto-line, #eceaf6);
  box-shadow: 0 24px 60px rgba(23, 21, 38, 0.08);
  background: var(--color-pure-white, #ffffff);
}
body.fx-theme-studio .fx-license-gate--studio .fx-license-gate__title {
  font-family: var(--font-inter);
  font-weight: 500;
  color: var(--color-midnight-ink, #171526);
}
body.fx-theme-studio .fx-license-gate--studio .fx-license-gate__lead {
  color: var(--color-steel, #615d59);
}
body.fx-theme-studio .fx-license-gate--studio .fx-license-gate__kicker {
  color: var(--color-fog, #787774);
}
body.fx-theme-studio .fx-license-gate--studio .fx-license-gate__note {
  color: var(--color-fog, #787774);
}
body.fx-theme-studio .fx-license-gate--studio .fx-license-gate__option {
  border-radius: 18px;
  border: 1px solid var(--sto-line, #eceaf6);
  background: var(--sto-mist, #f8f7fc);
}
body.fx-theme-studio .fx-license-gate--studio .fx-license-gate__option-title {
  color: var(--color-midnight-ink, #171526);
  font-weight: 650;
  letter-spacing: -0.01em;
}
body.fx-theme-studio .fx-license-gate--studio .fx-license-gate__option-body {
  color: var(--color-steel, #615d59);
}
body.fx-theme-studio .fx-license-gate--studio .fx-license-gate__option-icon {
  background: var(--color-pure-white, #fff);
  border: 1px solid var(--sto-line, #eceaf6);
  color: var(--color-midnight-ink, #171526);
}
body.fx-theme-studio .fx-license-gate--studio .fx-license-gate__badge {
  border-radius: 18px;
  background: #fff7ed;
  border: 1px solid #fed7aa;
  color: #b45309;
}
body.fx-theme-studio.sto-portal .fx-license-notice .sto-alert {
  margin-bottom: 0;
}
body.fx-theme-studio .sto-alert.fx-license-notice {
  display: flex;
  gap: 10px;
  align-items: flex-start;
}
body.fx-theme-studio .sto-alert__icon {
  flex-shrink: 0;
  margin-top: 2px;
}

/* Studio dark palette — keep option cards on-theme (no white islands) */
body.fx-theme-studio.fx-palette-dark .fx-license-gate--studio .fx-license-gate__card {
  background: rgba(255, 255, 255, 0.04);
  border-color: rgba(255, 255, 255, 0.1);
  box-shadow: 0 24px 80px rgba(0, 0, 0, 0.35);
}
body.fx-theme-studio.fx-palette-dark .fx-license-gate--studio .fx-license-gate__title {
  color: #fafafa;
}
body.fx-theme-studio.fx-palette-dark .fx-license-gate--studio .fx-license-gate__lead,
body.fx-theme-studio.fx-palette-dark .fx-license-gate--studio .fx-license-gate__note {
  color: rgba(255, 255, 255, 0.58);
}
body.fx-theme-studio.fx-palette-dark .fx-license-gate--studio .fx-license-gate__kicker {
  color: rgba(255, 255, 255, 0.45);
}
body.fx-theme-studio.fx-palette-dark .fx-license-gate--studio .fx-license-gate__option {
  background: rgba(255, 255, 255, 0.06);
  border-color: rgba(255, 255, 255, 0.12);
}
body.fx-theme-studio.fx-palette-dark .fx-license-gate--studio .fx-license-gate__option-title {
  color: #fafafa;
}
body.fx-theme-studio.fx-palette-dark .fx-license-gate--studio .fx-license-gate__option-body {
  color: rgba(255, 255, 255, 0.62);
}
body.fx-theme-studio.fx-palette-dark .fx-license-gate--studio .fx-license-gate__option-icon {
  background: rgba(255, 255, 255, 0.08);
  border-color: rgba(255, 255, 255, 0.14);
  color: #fafafa;
}
body.fx-theme-studio.fx-palette-dark .fx-license-gate--studio .fx-license-gate__badge {
  background: rgba(251, 191, 36, 0.12);
  border-color: rgba(251, 191, 36, 0.28);
  color: #fcd34d;
}
body.fx-theme-studio.fx-palette-dark .fx-license-gate--studio .st-btn--ghost {
  border-color: rgba(255, 255, 255, 0.18);
  color: rgba(255, 255, 255, 0.88);
  background: rgba(255, 255, 255, 0.04);
}
body.fx-theme-studio.fx-palette-dark .fx-license-gate--studio .st-btn--ghost:hover {
  background: rgba(255, 255, 255, 0.08);
  color: #fff;
}

body.fx-license-gate-active .sto-app__page > *:not(.fx-license-gate):not(.fx-license-notice):not(.sto-alert-wrap) {
  display: none !important;
}