a.dash-product-tile--visual .suite-studio__beta-pill {
      font-size: 0.62em;
      vertical-align: 0.08em;
    }

.page-ai-suite {
      display: none;
      width: 100%;
      max-width: 1180px;
      margin-left: auto;
      margin-right: auto;
      padding: 2.65rem 1.25rem 2.75rem;
      box-sizing: border-box;
    }

.page-ai-suite-studio {
      display: none;
      flex: 1 1 auto;
      flex-direction: column;
      width: 100%;
      max-width: none;
      margin: 0;
      padding: 0;
      min-height: 0;
      box-sizing: border-box;
    }

.suite-studio__access-gate {
      display: none;
      width: 100%;
      max-width: 920px;
      margin: 2.2rem auto;
      padding: 1.05rem 1.1rem;
      border: 1px solid var(--hero-border);
      border-radius: 0.8rem;
      background: color-mix(in srgb, var(--bg-elevated) 86%, transparent);
    }

.suite-studio__access-gate h2 {
      margin: 0 0 0.45rem;
      font-size: 1.02rem;
      font-weight: 800;
      color: var(--text);
    }

.suite-studio__access-gate p {
      margin: 0;
      font-size: 0.92rem;
      line-height: 1.6;
      color: var(--text-muted);
    }

.suite-studio__access-gate a {
      color: var(--gold);
      font-weight: 700;
      text-decoration: none;
    }

.suite-studio__access-gate a:hover {
      text-decoration: underline;
    }

.suite-studio {
      display: grid;
      grid-template-columns: minmax(200px, 240px) minmax(0, 1fr) minmax(260px, 320px);
      grid-template-rows: minmax(0, 1fr);
      flex: 1 1 auto;
      width: 100%;
      min-height: calc(100dvh - var(--header-offset));
      align-items: stretch;
    }

.suite-studio__rail {
      display: flex;
      flex-direction: column;
      min-height: 0;
      min-width: 0;
      background: color-mix(in srgb, var(--bg-elevated) 88%, var(--bg-page));
    }

.suite-studio__rail--nav {
      border-right: 1px solid var(--hero-border);
      padding: 0.3rem 0.85rem 1rem;
    }

.suite-studio__rail--settings {
      border-left: 1px solid var(--hero-border);
      padding: 0.3rem 0.9rem 1.25rem;
      overflow: auto;
      position: relative;
    }

.suite-studio__rail-panel-h {
      margin: 0.85rem 0 0.35rem;
      font-size: 0.72rem;
      font-weight: 780;
      letter-spacing: 0.08em;
      text-transform: uppercase;
      color: var(--text-muted);
    }

.suite-studio__rail-settings-mount {
      flex: 1 1 auto;
      min-height: 0;
      overflow: auto;
      padding-right: 0.1rem;
    }

/* Code & chat left rail: billing + chat sidebar stack */
.suite-studio__code-chat-left-col {
      display: flex;
      flex-direction: column;
      gap: 0.55rem;
      min-height: 0;
      flex: 1 1 auto;
    }

.suite-studio__code-chat-left-col .suite-studio__chat-sidebar {
      flex: 1 1 auto;
      min-height: 0;
      overflow-x: hidden;
      overflow-y: auto;
      overscroll-behavior: contain;
    }

.suite-studio__left-billing {
      display: flex;
      flex-direction: column;
      gap: 0.45rem;
      flex-shrink: 0;
      margin: 0 0 0.15rem;
      padding-bottom: 0.65rem;
      border-bottom: 1px solid var(--hero-border);
    }

.suite-studio__left-billing .suite-studio__asset-bar {
      flex-direction: column;
      align-items: stretch;
      gap: 0.35rem;
      margin: 0;
    }

.suite-studio__left-billing .suite-studio__asset-bar-label {
      width: 100%;
      margin: 0;
    }

.suite-studio__left-billing .suite-studio__asset-pop {
      width: 100%;
    }

.suite-studio__left-billing .suite-studio__field--billing-inline {
      margin: 0;
    }

.suite-studio__left-billing .suite-studio__field--billing-inline .suite-studio__fieldset-h {
      margin: 0.1rem 0 0.28rem;
    }

.suite-studio__left-billing .suite-studio__nav-foot--workspace-util {
      display: flex;
      flex-direction: column;
      align-items: stretch;
      gap: 0.28rem;
      margin: 0.15rem 0 0;
      padding-top: 0.45rem;
      border-top: 1px solid var(--hero-border);
    }

.suite-studio__left-billing .suite-studio__asset-menu {
      left: 0;
      right: 0;
      min-width: 0;
      max-width: none;
    }

.suite-studio__speech-left-nav {
      margin: 0.35rem 0 0.5rem;
      padding: 0.35rem 0.25rem 0.5rem;
      border-radius: 0.5rem;
      border: 1px solid var(--hero-border);
      background: color-mix(in srgb, var(--bg-page) 40%, var(--bg-elevated));
    }

.suite-studio__speech-left-nav-h {
      margin: 0 0 0.35rem;
      font-size: 0.68rem;
      font-weight: 780;
      letter-spacing: 0.06em;
      text-transform: uppercase;
      color: var(--text-muted);
    }

.suite-studio__speech-left-nav ul {
      list-style: none;
      margin: 0;
      padding: 0;
      display: flex;
      flex-direction: column;
      gap: 0.15rem;
    }

.suite-studio__speech-left-nav button {
      width: 100%;
      display: flex;
      align-items: center;
      gap: 0.4rem;
      margin: 0;
      padding: 0.38rem 0.45rem;
      border-radius: 0.4rem;
      border: 1px solid transparent;
      background: transparent;
      color: var(--text-muted);
      font: inherit;
      font-size: 0.78rem;
      font-weight: 600;
      text-align: left;
      cursor: default;
    }

.suite-studio__speech-left-nav button.is-active {
      color: var(--text);
      border-color: color-mix(in srgb, var(--cyan) 42%, var(--hero-border));
      background: color-mix(in srgb, var(--cyan) 12%, var(--bg-elevated));
    }

.suite-studio__speech-rail-tabs {
      display: flex;
      gap: 0.25rem;
      margin: 0 0 0.5rem;
    }

.suite-studio__speech-rail-tabs button {
      flex: 1 1 0;
      padding: 0.38rem 0.35rem;
      border-radius: 0.4rem;
      border: 1px solid var(--hero-border);
      background: color-mix(in srgb, var(--bg-page) 50%, var(--bg-elevated));
      color: var(--text-muted);
      font: inherit;
      font-size: 0.72rem;
      font-weight: 700;
      letter-spacing: 0.04em;
      text-transform: uppercase;
      cursor: pointer;
    }

.suite-studio__speech-rail-tabs button[aria-selected="true"] {
      color: var(--text);
      border-color: color-mix(in srgb, var(--cyan) 50%, var(--hero-border));
      background: color-mix(in srgb, var(--cyan) 12%, var(--bg-elevated));
    }

.suite-studio__speech-history-pane {
      font-size: 0.78rem;
      line-height: 1.45;
      color: var(--text-muted);
      padding: 0.35rem 0.15rem 0.75rem;
    }

.suite-studio__visually-hidden {
      position: absolute;
      width: 1px;
      height: 1px;
      padding: 0;
      margin: -1px;
      overflow: hidden;
      clip: rect(0, 0, 0, 0);
      white-space: nowrap;
      border: 0;
    }

.suite-studio__chat-sidebar {
      display: flex;
      flex-direction: column;
      gap: 0.35rem;
      min-height: 0;
    }

.suite-studio__chat-sidebar__new {
      display: flex;
      align-items: center;
      justify-content: flex-start;
      gap: 0.45rem;
      width: 100%;
      padding: 0.5rem 0.55rem;
      border-radius: 0.45rem;
      border: 1px solid var(--hero-border);
      background: color-mix(in srgb, var(--bg-page) 40%, var(--bg-elevated));
      font: inherit;
      font-size: 0.78rem;
      font-weight: 700;
      color: var(--text);
      cursor: pointer;
      text-align: left;
    }

.suite-studio__chat-sidebar__new:hover {
      border-color: color-mix(in srgb, var(--cyan) 35%, var(--hero-border));
      background: color-mix(in srgb, var(--bg-elevated) 70%, var(--bg-page));
    }

.suite-studio__chat-sidebar__search-row {
      display: flex;
      align-items: center;
      gap: 0.45rem;
      width: 100%;
      padding: 0.38rem 0.45rem;
      border: 0;
      border-radius: 0.35rem;
      background: transparent;
      font: inherit;
      font-size: 0.74rem;
      font-weight: 650;
      color: var(--text-muted);
      cursor: pointer;
      text-align: left;
    }

.suite-studio__chat-sidebar__search-row:hover {
      color: var(--text);
      background: color-mix(in srgb, var(--hero-border) 35%, transparent);
    }

.suite-studio__chat-sidebar__ico {
      flex-shrink: 0;
      opacity: 0.9;
    }

.suite-studio__chat-sidebar__search-label {
      position: absolute;
      width: 1px;
      height: 1px;
      overflow: hidden;
      clip: rect(0, 0, 0, 0);
    }

.suite-studio__chat-sidebar__search-input {
      width: 100%;
      box-sizing: border-box;
      padding: 0.42rem 0.5rem;
      border-radius: 0.4rem;
      border: 1px solid var(--hero-border);
      background: color-mix(in srgb, var(--bg-page) 55%, var(--bg-elevated));
      font: inherit;
      font-size: 0.74rem;
      color: var(--text);
    }

.suite-studio__chat-sidebar__search-input::placeholder {
      color: var(--text-muted);
    }

.suite-studio__chat-sidebar__section-h {
      margin: 0.35rem 0 0.15rem;
      font-size: 0.62rem;
      font-weight: 780;
      letter-spacing: 0.1em;
      text-transform: uppercase;
      color: var(--text-muted);
    }

.suite-studio__chat-sidebar__list {
      display: flex;
      flex-direction: column;
      gap: 0.08rem;
      max-height: min(42vh, 22rem);
      overflow-y: auto;
      padding-right: 0.15rem;
      margin-top: 0.1rem;
    }

.suite-studio__chat-sidebar__item {
      display: block;
      width: 100%;
      text-align: left;
      padding: 0.42rem 0.45rem;
      border: 0;
      border-radius: 0.35rem;
      background: transparent;
      font: inherit;
      font-size: 0.74rem;
      font-weight: 550;
      line-height: 1.35;
      color: color-mix(in srgb, var(--text-muted) 25%, var(--text));
      cursor: pointer;
    }

.suite-studio__chat-sidebar__item:hover {
      background: color-mix(in srgb, var(--hero-border) 45%, transparent);
      color: var(--text);
    }

.suite-studio__chat-sidebar__item.is-active {
      background: color-mix(in srgb, #8b5cf6 14%, var(--bg-elevated));
      color: var(--text);
      font-weight: 700;
    }

.suite-studio__img-ctrl {
      display: block;
      width: 100%;
      margin: 0 0 0.55rem;
      padding: 0.5rem 0.55rem 0.55rem;
      border-radius: 0.5rem;
      border: 1px solid var(--hero-border);
      background: color-mix(in srgb, var(--bg-page) 35%, var(--bg-elevated));
      text-align: left;
      cursor: pointer;
      font: inherit;
      color: inherit;
    }

.suite-studio__img-ctrl:focus-visible {
      outline: 2px solid var(--cyan);
      outline-offset: 2px;
    }

.suite-studio__img-ctrl-top {
      display: flex;
      align-items: flex-start;
      justify-content: space-between;
      gap: 0.35rem;
    }

.suite-studio__img-pill {
      display: inline-block;
      font-size: 0.58rem;
      font-weight: 800;
      letter-spacing: 0.08em;
      text-transform: uppercase;
      padding: 0.12rem 0.35rem;
      border-radius: 999px;
      background: color-mix(in srgb, #86efac 55%, var(--bg-page));
      color: #052e16;
    }

.suite-studio__img-ctrl-k {
      display: block;
      font-size: 0.78rem;
      font-weight: 700;
      margin-top: 0.15rem;
    }

.suite-studio__img-ctrl-v {
      display: block;
      font-size: 0.72rem;
      color: var(--text-muted);
      margin-top: 0.08rem;
    }

.suite-studio__img-ctrl-chev {
      flex-shrink: 0;
      opacity: 0.65;
      margin-top: 0.1rem;
    }

.suite-studio__img-ctrl select {
      position: absolute;
      opacity: 0;
      width: 100%;
      height: 100%;
      inset: 0;
      cursor: pointer;
      margin: 0;
    }

.suite-studio__img-ctrl--select {
      position: relative;
    }

.suite-studio__img-aspect-row,
    .suite-studio__img-size-row {
      display: flex;
      flex-wrap: wrap;
      gap: 0.3rem;
      margin-top: 0.35rem;
    }

.suite-studio__img-chip {
      flex: 1 1 0;
      min-width: 2.5rem;
      padding: 0.32rem 0.28rem;
      border-radius: 0.4rem;
      border: 1px solid var(--hero-border);
      background: color-mix(in srgb, var(--bg-page) 45%, var(--bg-elevated));
      font: inherit;
      font-size: 0.68rem;
      font-weight: 700;
      color: var(--text-muted);
      cursor: pointer;
    }

.suite-studio__img-chip[aria-pressed="true"] {
      color: var(--text);
      border-color: color-mix(in srgb, #8b5cf6 55%, var(--cyan));
      box-shadow: 0 0 0 1px color-mix(in srgb, #8b5cf6 35%, transparent);
      background: color-mix(in srgb, #8b5cf6 12%, var(--bg-elevated));
    }

.suite-studio__img-size-row .suite-studio__img-chip {
      flex: 1 1 100%;
      text-align: left;
      font-size: 0.7rem;
      flex-direction: column;
      align-items: flex-start;
      gap: 0.12rem;
      padding: 0.38rem 0.45rem 0.4rem;
    }

.suite-studio__img-chip--aspect {
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: flex-end;
      gap: 0.18rem;
      min-height: 3.35rem;
      padding: 0.35rem 0.22rem 0.3rem;
      font-weight: 800;
    }

.suite-studio__img-aspect-ico {
      width: 2.1rem;
      height: 1.35rem;
      flex-shrink: 0;
      color: color-mix(in srgb, var(--text-muted) 92%, transparent);
    }

.suite-studio__img-chip--aspect[aria-pressed="true"] .suite-studio__img-aspect-ico {
      color: color-mix(in srgb, var(--text) 88%, #8b5cf6);
    }

.suite-studio__img-aspect-lbl {
      font-size: 0.62rem;
      letter-spacing: 0.02em;
      line-height: 1.1;
    }

.suite-studio__img-aspect-row .suite-studio__img-chip--aspect {
      min-width: 3.15rem;
    }

.suite-studio__img-tier-row1 {
      font-size: 0.7rem;
      font-weight: 780;
    }

.suite-studio__img-tier-res {
      font-size: 0.62rem;
      font-weight: 650;
      color: color-mix(in srgb, var(--text-muted) 55%, var(--text));
      letter-spacing: 0.02em;
    }

.suite-studio__img-dim-modal {
      position: fixed;
      inset: 0;
      z-index: 220;
      display: flex;
      align-items: center;
      justify-content: center;
      padding: 1rem;
      box-sizing: border-box;
    }

.suite-studio__img-dim-modal[hidden] {
      display: none !important;
    }

.suite-studio__img-dim-modal__backdrop {
      position: absolute;
      inset: 0;
      background: color-mix(in srgb, #0a0a12 65%, transparent);
      cursor: pointer;
    }

.suite-studio__img-dim-modal__panel {
      position: relative;
      z-index: 1;
      width: 100%;
      max-width: 22rem;
      max-height: min(90vh, 34rem);
      overflow: auto;
      border-radius: 0.55rem;
      border: 1px solid var(--hero-border);
      background: color-mix(in srgb, var(--bg-page) 88%, var(--bg-elevated));
      box-shadow: 0 1rem 2.5rem color-mix(in srgb, #000 45%, transparent);
      padding: 0.85rem 0.95rem 1rem;
    }

.suite-studio__img-dim-modal__head {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 0.5rem;
      margin-bottom: 0.65rem;
    }

.suite-studio__img-dim-modal__head h3 {
      margin: 0;
      font-size: 0.95rem;
      font-weight: 800;
      color: var(--text);
    }

.suite-studio__img-dim-modal__x {
      border: 0;
      background: transparent;
      color: var(--text-muted);
      font-size: 1.35rem;
      line-height: 1;
      cursor: pointer;
      padding: 0.15rem 0.35rem;
      border-radius: 0.25rem;
    }

.suite-studio__img-dim-modal__x:hover {
      color: var(--text);
      background: color-mix(in srgb, var(--hero-border) 40%, transparent);
    }

.suite-studio__img-dim-modal__preview {
      display: flex;
      align-items: center;
      gap: 0.75rem;
      margin-bottom: 0.55rem;
    }

.suite-studio__img-dim-modal__fig {
      position: relative;
      width: 4.5rem;
      height: 4.5rem;
      border-radius: 0.35rem;
      border: 1px dashed color-mix(in srgb, var(--text-muted) 45%, var(--hero-border));
      display: flex;
      align-items: center;
      justify-content: center;
      flex-shrink: 0;
      background: color-mix(in srgb, var(--bg-elevated) 70%, transparent);
    }

.suite-studio__img-dim-modal__fig-inner {
      border: 2px solid color-mix(in srgb, var(--text) 85%, #8b5cf6);
      border-radius: 0.12rem;
      box-sizing: border-box;
      max-width: 86%;
      max-height: 86%;
      aspect-ratio: 16 / 9;
    }

.suite-studio__img-dim-modal__out {
      flex: 1;
      min-width: 0;
    }

.suite-studio__img-dim-modal__out-k {
      font-size: 0.68rem;
      color: var(--text-muted);
      margin-bottom: 0.12rem;
    }

.suite-studio__img-dim-modal__out-v {
      font-size: 0.82rem;
      font-weight: 800;
      color: var(--text);
    }

.suite-studio__img-dim-modal__out-v em {
      font-style: normal;
      color: color-mix(in srgb, #8b5cf6 75%, var(--cyan));
    }

.suite-studio__img-dim-modal__slider {
      display: flex;
      align-items: center;
      gap: 0.45rem;
      margin: 0.5rem 0 0.65rem;
      font-size: 0.62rem;
      font-weight: 700;
      color: var(--text-muted);
    }

.suite-studio__img-dim-modal__slider input[type="range"] {
      flex: 1;
      accent-color: color-mix(in srgb, #8b5cf6 70%, var(--cyan));
    }

.suite-studio__img-dim-modal__grp-h {
      margin: 0.45rem 0 0.28rem;
      font-size: 0.58rem;
      font-weight: 780;
      letter-spacing: 0.08em;
      text-transform: uppercase;
      color: var(--text-muted);
    }

.suite-studio__img-dim-modal__grp-h:first-of-type {
      margin-top: 0.15rem;
    }

.suite-studio__img-dim-preset-row {
      display: flex;
      flex-wrap: wrap;
      gap: 0.3rem;
    }

.suite-studio__img-dim-preset {
      flex: 1 1 auto;
      min-width: 5.2rem;
      padding: 0.38rem 0.45rem;
      border-radius: 0.38rem;
      border: 1px solid var(--hero-border);
      background: color-mix(in srgb, var(--bg-page) 50%, var(--bg-elevated));
      font: inherit;
      font-size: 0.64rem;
      font-weight: 700;
      color: var(--text-muted);
      cursor: pointer;
      text-align: center;
    }

.suite-studio__img-dim-preset[aria-pressed="true"] {
      color: var(--text);
      border-color: color-mix(in srgb, #8b5cf6 55%, var(--cyan));
      box-shadow: 0 0 0 1px color-mix(in srgb, #8b5cf6 35%, transparent);
      background: color-mix(in srgb, #8b5cf6 12%, var(--bg-elevated));
    }

.suite-studio__img-dim-modal__done {
      width: 100%;
      margin-top: 0.75rem;
      padding: 0.45rem;
      border-radius: 0.4rem;
      border: 0;
      font: inherit;
      font-size: 0.75rem;
      font-weight: 800;
      cursor: pointer;
      color: #fff;
      background: linear-gradient(
        135deg,
        color-mix(in srgb, #8b5cf6 88%, #6366f1),
        color-mix(in srgb, var(--cyan) 55%, #8b5cf6)
      );
    }

.suite-studio__img-dim-modal__done:hover {
      filter: brightness(1.06);
    }

.suite-studio__img-dim-h {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 0.35rem;
      margin: 0.5rem 0 0.25rem;
      font-size: 0.72rem;
      font-weight: 780;
      letter-spacing: 0.05em;
      text-transform: uppercase;
      color: var(--text-muted);
    }

.suite-studio__img-dim-val {
      font-weight: 700;
      color: var(--text);
      letter-spacing: 0;
      text-transform: none;
    }

.suite-studio__img-help {
      border: 0;
      background: transparent;
      color: var(--text-muted);
      cursor: help;
      font-size: 0.85rem;
      line-height: 1;
      padding: 0 0.15rem;
    }

.suite-studio__img-details {
      margin-top: 0.45rem;
      border-top: 1px solid var(--hero-border);
      padding-top: 0.35rem;
    }

.suite-studio__img-details > summary {
      cursor: pointer;
      font-size: 0.74rem;
      font-weight: 700;
      color: var(--text-muted);
      list-style: none;
    }

.suite-studio__img-details > summary::-webkit-details-marker {
      display: none;
    }

.suite-studio__img-reset {
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 0.35rem;
      width: 100%;
      margin-top: 0.65rem;
      padding: 0.4rem;
      border-radius: 0.4rem;
      border: 1px dashed var(--hero-border);
      background: transparent;
      font: inherit;
      font-size: 0.72rem;
      font-weight: 700;
      color: var(--text-muted);
      cursor: pointer;
    }

.suite-studio__img-reset:hover {
      color: var(--text);
      border-color: color-mix(in srgb, var(--cyan) 40%, var(--hero-border));
    }

.suite-studio__videos-hub {
      display: flex;
      flex-direction: column;
      align-items: stretch;
      gap: 0.65rem;
      width: 100%;
      flex: 1 1 auto;
      min-height: 0;
    }

.suite-studio__setting-pane[data-suite-setting-pane="videos"] {
      display: flex;
      flex-direction: column;
      flex: 1 1 auto;
      min-height: 0;
      gap: 0.5rem;
      overflow: hidden;
    }

.suite-studio__videos-hub-side--rail {
      flex: 1 1 auto;
      min-height: 0;
      overflow-x: hidden;
      overflow-y: auto;
      overscroll-behavior: contain;
      width: 100%;
      box-sizing: border-box;
      margin: 0;
      border-radius: 0.5rem;
      padding: 0.55rem 0.55rem 0.7rem;
    }

.suite-studio__videos-hub-side--rail .suite-studio__videos-hub-h {
      font-size: 0.92rem;
      margin-bottom: 0.38rem;
    }

.suite-studio__videos-hub-side--rail .suite-studio__videos-hub-tabs button {
      font-size: 0.62rem;
      padding: 0.18rem 0.32rem;
    }

.suite-studio__videos-hub-side--rail .suite-studio__videos-hub-cat-t {
      font-size: 0.76rem;
    }

.suite-studio__videos-hub-side--rail .suite-studio__videos-hub-cat-d {
      font-size: 0.66rem;
    }

.suite-studio__videos-pane-foot {
      flex: 0 0 auto;
      padding-top: 0.35rem;
      border-top: 1px solid var(--hero-border);
    }

.suite-studio__videos-hub-side {
      border: 1px solid var(--hero-border);
      border-radius: 0.55rem;
      padding: 0.65rem 0.65rem 0.85rem;
      background: color-mix(in srgb, var(--bg-page) 40%, var(--bg-elevated));
      min-height: 0;
    }

.suite-studio__videos-hub-h {
      margin: 0 0 0.45rem;
      font-size: 1.05rem;
      font-weight: 800;
      line-height: 1.25;
      letter-spacing: -0.02em;
    }

.suite-studio__videos-hub-search {
      width: 100%;
      margin: 0 0 0.5rem;
      padding: 0.45rem 0.55rem;
      border-radius: 0.45rem;
      border: 1px solid var(--hero-border);
      background: color-mix(in srgb, var(--bg-page) 60%, var(--bg-elevated));
      font: inherit;
      font-size: 0.82rem;
      color: var(--text);
    }

.suite-studio__videos-hub-tabs {
      display: flex;
      flex-wrap: wrap;
      gap: 0.25rem 0.35rem;
      margin: 0 0 0.55rem;
    }

.suite-studio__videos-hub-tabs button {
      margin: 0;
      padding: 0.22rem 0.4rem;
      border: 0;
      border-radius: 999px;
      background: transparent;
      font: inherit;
      font-size: 0.68rem;
      font-weight: 700;
      letter-spacing: 0.04em;
      text-transform: uppercase;
      color: var(--text-muted);
      cursor: pointer;
    }

.suite-studio__videos-hub-tabs button[aria-pressed="true"] {
      color: var(--text);
      background: color-mix(in srgb, var(--cyan) 14%, var(--bg-elevated));
      box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--cyan) 35%, var(--hero-border));
    }

.suite-studio__videos-hub-cats {
      list-style: none;
      margin: 0;
      padding: 0;
      display: flex;
      flex-direction: column;
      gap: 0.2rem;
    }

.suite-studio__videos-hub-cats button {
      width: 100%;
      display: block;
      margin: 0;
      padding: 0.45rem 0.5rem;
      border-radius: 0.45rem;
      border: 1px solid transparent;
      background: transparent;
      text-align: left;
      font: inherit;
      color: inherit;
      cursor: pointer;
    }

.suite-studio__videos-hub-cats button[aria-pressed="true"] {
      border-color: color-mix(in srgb, var(--cyan) 40%, var(--hero-border));
      background: color-mix(in srgb, var(--cyan) 10%, var(--bg-elevated));
    }

.suite-studio__videos-hub-cat-t {
      display: block;
      font-weight: 800;
      font-size: 0.82rem;
    }

.suite-studio__videos-hub-cat-d {
      display: block;
      font-size: 0.72rem;
      color: var(--text-muted);
      margin-top: 0.12rem;
      line-height: 1.35;
    }

.suite-studio__videos-hub-grid {
      display: grid;
      grid-template-columns: repeat(auto-fill, minmax(11.5rem, 1fr));
      gap: 0.55rem;
    }

.suite-studio__videos-hub-card {
      border-radius: 0.5rem;
      border: 1px solid var(--hero-border);
      overflow: hidden;
      background: color-mix(in srgb, var(--bg-page) 50%, var(--bg-elevated));
      text-align: left;
      cursor: pointer;
      padding: 0;
      font: inherit;
      color: inherit;
    }

.suite-studio__videos-hub-card:focus-visible {
      outline: 2px solid var(--cyan);
      outline-offset: 2px;
    }

.suite-studio__videos-hub-card-ph {
      aspect-ratio: 16 / 10;
      background: linear-gradient(135deg, color-mix(in srgb, var(--cyan) 22%, var(--bg-page)), #0f172a);
    }

.suite-studio__videos-hub-card-t {
      font-size: 0.78rem;
      font-weight: 800;
    }

.suite-studio__videos-hub-card-d {
      margin-top: 0.2rem;
      font-size: 0.68rem;
      color: var(--text-muted);
      line-height: 1.35;
    }

.suite-studio__videos-plan {
      margin-top: 0.85rem;
      padding-top: 0.65rem;
      border-top: 1px solid var(--hero-border);
    }

.suite-studio__videos-plan-h {
      margin: 0 0 0.35rem;
      font-size: 0.72rem;
      font-weight: 780;
      letter-spacing: 0.06em;
      text-transform: uppercase;
      color: var(--text-muted);
    }

.suite-studio__preview-resize-handle {
      position: absolute;
      left: -0.45rem;
      top: 0;
      bottom: 0;
      width: 0.9rem;
      z-index: 3;
      cursor: col-resize;
      touch-action: none;
    }

.suite-studio__preview-resize-handle::before {
      content: "";
      position: absolute;
      left: 0.42rem;
      top: 20%;
      bottom: 20%;
      width: 2px;
      border-radius: 999px;
      background: color-mix(in srgb, var(--cyan) 40%, var(--hero-border));
      opacity: 0;
      transition: opacity 0.16s ease;
    }

.suite-studio__preview-resize-handle:hover::before,
    .suite-studio__preview-resize-handle:focus-visible::before,
    .suite-studio__rail--settings.is-resizing .suite-studio__preview-resize-handle::before {
      opacity: 1;
    }

.suite-studio__code-preview-rail {
      flex: 1 1 auto;
      min-height: 0;
      display: flex;
      flex-direction: column;
      margin-top: 0.65rem;
      padding-top: 0.65rem;
      border-top: 1px solid var(--hero-border);
      will-change: transform, opacity;
    }

.suite-studio__code-preview-rail-h {
      margin: 0 0 0.45rem;
      font-size: 0.72rem;
      font-weight: 780;
      letter-spacing: 0.08em;
      text-transform: uppercase;
      color: var(--text-muted);
    }

.suite-studio__code-preview-rail-head {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 0.45rem;
      margin-bottom: 0.2rem;
    }

.suite-studio__code-preview-rail-head .suite-studio__code-preview-rail-h {
      margin-bottom: 0;
    }

.suite-studio__code-preview-rail-actions {
      display: inline-flex;
      align-items: center;
      gap: 0.35rem;
      flex-shrink: 0;
    }

.suite-studio__preview-fullscreen {
      border: 1px solid var(--hero-border);
      border-radius: 0.38rem;
      min-height: 1.65rem;
      padding: 0.2rem 0.55rem;
      background: color-mix(in srgb, var(--bg-page) 55%, var(--bg-elevated));
      color: var(--text-muted);
      font: inherit;
      font-size: 0.68rem;
      font-weight: 700;
      letter-spacing: 0.04em;
      text-transform: uppercase;
      line-height: 1.2;
      cursor: pointer;
      white-space: nowrap;
    }

.suite-studio__preview-fullscreen:hover {
      color: var(--text);
      border-color: color-mix(in srgb, var(--cyan) 46%, var(--hero-border));
    }

a.suite-studio__preview-download {
      border: 1px solid var(--hero-border);
      border-radius: 0.38rem;
      min-height: 1.65rem;
      padding: 0.2rem 0.55rem;
      background: color-mix(in srgb, var(--bg-page) 55%, var(--bg-elevated));
      color: var(--text-muted);
      font: inherit;
      font-size: 0.68rem;
      font-weight: 700;
      letter-spacing: 0.04em;
      text-transform: uppercase;
      line-height: 1.2;
      cursor: pointer;
      white-space: nowrap;
      text-decoration: none;
    }

a.suite-studio__preview-download:hover {
      color: var(--text);
      border-color: color-mix(in srgb, var(--cyan) 46%, var(--hero-border));
    }

.suite-studio__preview-close {
      border: 1px solid var(--hero-border);
      border-radius: 0.38rem;
      min-width: 1.9rem;
      height: 1.65rem;
      padding: 0 0.45rem;
      background: color-mix(in srgb, var(--bg-page) 55%, var(--bg-elevated));
      color: var(--text-muted);
      font: inherit;
      font-size: 0.9rem;
      line-height: 1;
      cursor: pointer;
    }

.suite-studio__preview-close:hover {
      color: var(--text);
      border-color: color-mix(in srgb, var(--cyan) 46%, var(--hero-border));
    }

.suite-studio__preview-tabs {
      display: flex;
      gap: 0.35rem;
      margin-bottom: 0.45rem;
    }

.suite-studio__preview-tab {
      flex: 1 1 0;
      padding: 0.42rem 0.5rem;
      border-radius: 0.4rem;
      border: 1px solid var(--hero-border);
      background: color-mix(in srgb, var(--bg-page) 55%, var(--bg-elevated));
      color: var(--text);
      font: inherit;
      font-size: 0.76rem;
      font-weight: 700;
      cursor: pointer;
      transition: border-color 0.15s ease, background 0.15s ease;
    }

.suite-studio__preview-tab[aria-selected="true"] {
      border-color: color-mix(in srgb, var(--cyan) 58%, var(--hero-border));
      background: color-mix(in srgb, var(--cyan) 14%, var(--bg-elevated));
    }

.suite-studio__preview-pane {
      position: absolute;
      inset: 0;
      display: flex;
      flex-direction: column;
    }

.suite-studio__artifact-frame {
      flex: 1 1 auto;
      width: 100%;
      min-height: 200px;
      border: 0;
      background: #ffffff;
    }

.suite-studio__preview-empty {
      position: absolute;
      inset: 0;
      margin: 0;
      display: flex;
      align-items: center;
      justify-content: center;
      padding: 1rem;
      text-align: center;
      font-size: 0.78rem;
      line-height: 1.45;
      color: var(--text-muted);
      pointer-events: none;
    }

.suite-studio__preview-empty code {
      font-size: 0.85em;
    }

.suite-studio__preview-code {
      position: absolute;
      inset: 0;
      margin: 0;
      padding: 0.65rem;
      overflow: auto;
      font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
      font-size: 0.72rem;
      line-height: 1.45;
      white-space: pre-wrap;
      word-break: break-word;
      background: color-mix(in srgb, var(--bg-page) 88%, var(--bg-elevated));
      color: var(--text);
    }

.suite-studio__brand {
      display: flex;
      align-items: center;
      gap: 0.5rem;
      margin-bottom: 0.45rem;
      padding: 0 0.15rem;
    }

.suite-studio__brand-mark {
      font-weight: 800;
      font-size: 0.72rem;
      letter-spacing: 0.14em;
      text-transform: uppercase;
      color: var(--text-muted);
    }

.suite-studio__nav-list {
      list-style: none;
      margin: 0;
      padding: 0;
      display: flex;
      flex-direction: column;
      gap: 0.2rem;
    }

.suite-studio__nav-list a {
      display: flex;
      align-items: center;
      gap: 0.45rem;
      padding: 0.45rem 0.5rem;
      border-radius: 0.45rem;
      color: var(--text);
      text-decoration: none;
      font-size: 0.86rem;
      font-weight: 600;
      border: 1px solid transparent;
    }

.suite-studio__nav-list a:hover {
      background: color-mix(in srgb, var(--cyan) 10%, transparent);
    }

.suite-studio__nav-list a[aria-current="page"] {
      background: color-mix(in srgb, var(--cyan) 14%, transparent);
      border-color: color-mix(in srgb, var(--cyan) 28%, var(--hero-border));
    }

.suite-studio__nav-list svg {
      width: 1.1rem;
      height: 1.1rem;
      flex-shrink: 0;
      opacity: 0.9;
      color: var(--cyan);
    }

.suite-studio__nav-btn {
      display: flex;
      align-items: center;
      gap: 0.45rem;
      width: 100%;
      margin: 0;
      padding: 0.45rem 0.5rem;
      border-radius: 0.45rem;
      border: 1px solid transparent;
      background: transparent;
      color: var(--text);
      font: inherit;
      font-size: 0.86rem;
      font-weight: 600;
      text-align: left;
      cursor: pointer;
      transition: background 0.15s ease, border-color 0.15s ease;
    }

.suite-studio__nav-btn:hover {
      background: color-mix(in srgb, var(--cyan) 10%, transparent);
    }

.suite-studio__nav-btn:focus-visible {
      outline: 2px solid var(--cyan);
      outline-offset: 2px;
    }

.suite-studio__nav-btn[aria-pressed="true"] {
      background: color-mix(in srgb, var(--cyan) 14%, transparent);
      border-color: color-mix(in srgb, var(--cyan) 28%, var(--hero-border));
    }

.suite-studio__nav-btn svg {
      width: 1.1rem;
      height: 1.1rem;
      flex-shrink: 0;
      opacity: 0.9;
      color: var(--cyan);
    }

.suite-studio__nav-foot {
      margin-top: auto;
      padding-top: 1.25rem;
      border-top: 1px solid var(--hero-border);
      display: flex;
      flex-direction: column;
      gap: 0.35rem;
    }

.suite-studio__nav-foot a,
    .suite-studio__nav-foot button {
      display: inline-flex;
      align-items: center;
      gap: 0.45rem;
      font-size: 0.78rem;
      font-weight: 600;
      color: var(--text-muted);
      text-decoration: none;
      padding: 0.32rem 0.5rem;
      border-radius: 0.35rem;
      border: 0;
      background: transparent;
      text-align: left;
      cursor: pointer;
    }

.suite-studio__nav-foot-ico {
      width: 1.05rem;
      height: 1.05rem;
      flex-shrink: 0;
      opacity: 0.88;
      color: var(--cyan);
    }

.suite-studio__nav-foot a:hover,
    .suite-studio__nav-foot button:hover {
      color: var(--text);
      background: color-mix(in srgb, var(--cyan) 8%, transparent);
    }

.suite-studio__nav-foot a:hover .suite-studio__nav-foot-ico,
    .suite-studio__nav-foot button:hover .suite-studio__nav-foot-ico {
      color: inherit;
      opacity: 1;
    }

.suite-studio__rail-foot-stack {
      display: flex;
      flex-direction: column;
      margin-top: auto;
      flex-shrink: 0;
    }

.suite-studio__rail-foot-stack .suite-studio__nav-foot {
      margin-top: 0;
    }

.suite-studio__asset-bar--workspace-util {
      margin-bottom: 0;
    }

.suite-studio__workspace-top {
      flex-shrink: 0;
      display: flex;
      flex-direction: column;
      gap: 0.55rem;
      margin: 0 0 0.55rem;
      padding-bottom: 0.55rem;
      border-bottom: 1px solid var(--hero-border);
    }

.suite-studio__workspace-util {
      display: flex;
      flex-wrap: wrap;
      align-items: flex-end;
      gap: 0.5rem 1rem;
    }

.suite-studio__workspace-util .suite-studio__asset-bar--nav {
      margin: 0;
    }

.suite-studio__workspace-util .suite-studio__field--billing-inline {
      flex: 1 1 10rem;
      min-width: 0;
      margin: 0;
    }

.suite-studio__workspace-util .suite-studio__field--billing-inline .suite-studio__fieldset-h {
      margin: 0 0 0.28rem;
    }

.suite-studio__workspace-util .suite-studio__nav-foot--workspace-util {
      display: flex;
      flex-direction: row;
      flex-wrap: wrap;
      align-items: center;
      gap: 0.35rem 0.85rem;
      margin: 0;
      margin-left: auto;
      margin-top: 0;
      padding-top: 0;
      border-top: none;
    }

.suite-studio__dedicated-nav[hidden] {
      display: none !important;
    }

.suite-studio__dedicated-nav:not([hidden]) {
      display: flex;
      flex-wrap: wrap;
      align-items: center;
      gap: 0.35rem 0.5rem;
    }

.suite-studio__dedicated-dashboard {
      font-size: 0.78rem;
      font-weight: 780;
      text-decoration: none;
      color: var(--cyan);
      letter-spacing: 0.02em;
      white-space: nowrap;
      padding: 0.32rem 0.15rem;
      margin-right: 0.15rem;
    }

.suite-studio__dedicated-dashboard:hover {
      text-decoration: underline;
    }

.suite-studio__dedicated-tabs {
      list-style: none;
      margin: 0;
      padding: 0;
      display: flex;
      flex-wrap: wrap;
      gap: 0.2rem 0.15rem;
      align-items: center;
    }

.suite-studio__dedicated-tab {
      display: inline-block;
      padding: 0.35rem 0.62rem;
      border-radius: 999px;
      font-size: 0.76rem;
      font-weight: 650;
      letter-spacing: 0.02em;
      text-decoration: none;
      color: var(--text-muted);
      border: 1px solid transparent;
      line-height: 1.2;
    }

.suite-studio__dedicated-tab:hover {
      color: var(--text);
      border-color: color-mix(in srgb, var(--hero-border) 80%, transparent);
      background: color-mix(in srgb, var(--bg-elevated) 55%, transparent);
    }

.suite-studio__dedicated-tab[aria-current="page"] {
      color: var(--text);
      background: color-mix(in srgb, var(--cyan) 16%, transparent);
      border-color: color-mix(in srgb, var(--cyan) 42%, var(--hero-border));
    }

.suite-studio__main {
      display: flex;
      flex-direction: column;
      min-height: 0;
      min-width: 0;
      padding: 1.25rem 1.35rem 1rem;
      background: var(--bg-page);
      overflow: auto;
    }

.suite-studio__main-mid {
      flex: 1 1 auto;
      min-height: 0;
      display: flex;
      flex-direction: column;
      align-items: stretch;
      gap: 0;
    }

.suite-studio__main-hero-cluster {
      display: flex;
      flex-direction: column;
      align-items: stretch;
      flex: 0 1 auto;
      min-height: 0;
      width: 100%;
    }

.suite-studio__main-mid-spacer {
      min-height: 0;
    }

.suite-studio__main-mid-spacer--top {
      flex: 3.25 1 0;
    }

.suite-studio__main-mid:has(.suite-studio__main-hero.is-collapsed) .suite-studio__main-mid-spacer--top {
      flex: 0.2 1 0;
      max-height: min(4vh, 3rem);
    }

.suite-studio__main-mid-spacer--bottom {
      flex: 0.12 1 0;
    }

.suite-studio__main-hero {
      flex: 0 0 auto;
      width: 100%;
      display: flex;
      align-items: center;
      justify-content: center;
      min-height: 0;
      padding: 0 1rem;
      overflow: hidden;
      transition: max-height 0.45s ease, min-height 0.45s ease, opacity 1.8s ease, padding 0.38s ease,
        flex-grow 0.45s ease;
    }

.suite-studio__main-hero-inner {
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      gap: 0.95rem;
      text-align: center;
      max-width: min(24rem, 100%);
      transform: translateY(clamp(0.75rem, 4vh, 2.25rem));
    }

.suite-studio__main-tagline {
      margin: 0;
      font-size: clamp(1.08rem, 2.5vw, 1.38rem);
      font-weight: 680;
      letter-spacing: -0.025em;
      line-height: 1.3;
      color: var(--text);
    }

.suite-studio__tool-switch {
      display: grid;
      grid-template-columns: repeat(5, minmax(0, 1fr));
      gap: 0.45rem;
      margin: 0 0 0.9rem;
    }

.suite-studio__tool-switch--rail {
      grid-template-columns: minmax(0, 1fr);
      margin: 0 0 0.75rem;
    }

.suite-studio__nav-tool-stack {
      display: flex;
      flex-direction: column;
      gap: 0.45rem;
      margin: 0 0 0.75rem;
    }

.suite-studio__nav-tool-stack .suite-studio__tool-switch--rail {
      margin: 0;
    }

.suite-studio__asset-bar--nav {
      margin: 0;
    }

.suite-studio__asset-bar--nav .suite-studio__asset-menu {
      top: auto;
      bottom: calc(100% + 0.28rem);
      right: 0;
      left: 0;
      min-width: 0;
      max-width: none;
    }

@media (max-width: 1200px) {
      .suite-studio__tool-switch {
        grid-template-columns: repeat(3, minmax(0, 1fr));
      }
    }

@media (max-width: 720px) {
      .suite-studio__tool-switch {
        grid-template-columns: repeat(2, minmax(0, 1fr));
      }
    }

.suite-studio__tool-btn {
      display: inline-flex;
      align-items: center;
      gap: 0.48rem;
      justify-content: flex-start;
      border: 1px solid var(--hero-border);
      border-radius: 0.6rem;
      padding: 0.52rem 0.58rem;
      background: color-mix(in srgb, var(--bg-elevated) 84%, transparent);
      color: var(--text);
      cursor: pointer;
      font: inherit;
      font-size: 0.73rem;
      font-weight: 700;
      transition: border-color 0.18s ease, background 0.18s ease, transform 0.16s ease;
      text-align: left;
    }

.suite-studio__tool-switch--rail .suite-studio__tool-btn {
      width: 100%;
      font-size: 0.72rem;
      padding: 0.5rem 0.54rem;
    }

.suite-studio__rail-tool-brief {
      border: 1px solid var(--hero-border);
      border-radius: 0.6rem;
      padding: 0.66rem 0.64rem 0.7rem;
      margin: 0 0 0.8rem;
      background: color-mix(in srgb, var(--bg-page) 72%, transparent);
    }

.suite-studio__rail-tool-h {
      margin: 0 0 0.25rem;
      font-size: 0.8rem;
      font-weight: 780;
      color: var(--text);
    }

.suite-studio__rail-tool-lead {
      margin: 0 0 0.45rem;
      font-size: 0.69rem;
      line-height: 1.38;
      color: var(--text-muted);
    }

.suite-studio__rail-tool-list {
      margin: 0;
      padding-left: 0.95rem;
      display: grid;
      gap: 0.18rem;
      font-size: 0.67rem;
      line-height: 1.34;
      color: var(--text-muted);
    }

.suite-studio__tool-btn svg {
      width: 1.18rem;
      height: 1.18rem;
      color: var(--cyan);
      opacity: 0.95;
      flex-shrink: 0;
    }

.suite-studio__tool-btn:hover {
      border-color: color-mix(in srgb, var(--cyan) 48%, var(--hero-border));
      transform: translateY(-1px);
    }

.suite-studio__tool-btn[aria-pressed="true"] {
      border-color: color-mix(in srgb, var(--cyan) 62%, var(--hero-border));
      background: color-mix(in srgb, var(--cyan) 12%, var(--bg-elevated));
      box-shadow: 0 0 0 1px color-mix(in srgb, var(--cyan) 16%, transparent) inset;
    }

.suite-studio__tool-btn:focus-visible {
      outline: 2px solid var(--cyan);
      outline-offset: 2px;
    }

.suite-studio__beta-pill {
      display: inline-block;
      font-size: 0.7em;
      font-weight: 600;
      margin-left: 0.2em;
      padding: 0.05em 0.3em;
      border-radius: 0.3em;
      border: 1px solid color-mix(in srgb, var(--cyan) 50%, var(--hero-border));
      opacity: 0.9;
    }

.suite-studio__field-lead--muted {
      font-size: 0.8rem;
      opacity: 0.88;
    }

.suite-studio__main-hero.is-collapsed {
      opacity: 0;
      pointer-events: none;
      max-height: 0;
      min-height: 0;
      margin-top: 0;
      padding-block: 0;
      overflow: hidden;
      flex: 0 0 auto;
    }

.suite-studio__main-logo-shell--p5 {
      position: relative;
      width: 100%;
      max-width: none;
      height: min(56vh, 430px);
      min-height: 14.5rem;
      margin: 0 auto;
      background: transparent;
      border: none;
      border-radius: 0;
      box-shadow: none;
      overflow: visible;
      pointer-events: none;
    }

.suite-studio__main-logo-p5-host {
      width: 100%;
      height: 100%;
      position: relative;
      background: transparent;
      pointer-events: none;
    }

.suite-studio__main-logo-p5-host canvas {
      display: block !important;
      width: 100% !important;
      height: 100% !important;
      background: transparent !important;
    }

.suite-studio__main-logo--p5-fallback {
      width: min(36vw, 9rem);
      max-width: 160px;
      height: auto;
      display: block;
      object-fit: contain;
      margin: 0 auto;
    }

.suite-studio__main-logo-shell--p5.is-fallback-active .suite-studio__main-logo-p5-host {
      display: none;
    }

.suite-studio__main-logo-shell--p5.is-fallback-active .suite-studio__main-logo--p5-fallback {
      display: block;
    }

.suite-studio__main-logo-shell--p5:not(.is-fallback-active) .suite-studio__main-logo--p5-fallback {
      display: none;
    }

@media (prefers-reduced-motion: reduce) {
      .suite-studio__main-hero {
        transition: opacity 0.25s ease, max-height 0.3s ease, padding 0.25s ease;
      }
    }

.suite-studio__main-h {
      font-size: clamp(1.25rem, 2.4vw, 1.55rem);
      font-weight: 800;
      letter-spacing: 0.02em;
      margin: 0 0 0.45rem;
      color: var(--text);
    }

.suite-studio__main-lead {
      margin: 0 0 1rem;
      max-width: 42rem;
      font-size: 0.84rem;
      line-height: 1.45;
      color: var(--text-muted);
    }

.suite-studio__main-lead a {
      color: var(--cyan);
      font-weight: 600;
      text-decoration: none;
    }

.suite-studio__main-lead a:hover {
      text-decoration: underline;
    }

.suite-studio__card-grid {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 0.85rem;
      margin-bottom: 1rem;
    }

@media (max-width: 1200px) {
      .suite-studio__card-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
      }
    }

@media (max-width: 640px) {
      .suite-studio__card-grid {
        grid-template-columns: minmax(0, 1fr);
      }
    }

.suite-studio-card {
      display: flex;
      flex-direction: column;
      align-items: flex-start;
      gap: 0.5rem;
      padding: 0.95rem 0.9rem 1rem;
      border-radius: 0.6rem;
      border: 1px solid var(--hero-border);
      background: color-mix(in srgb, var(--bg-elevated) 82%, transparent);
      text-align: left;
      text-decoration: none;
      color: inherit;
      min-height: 7.25rem;
      box-sizing: border-box;
      transition: border-color 0.2s ease, background 0.2s ease, box-shadow 0.2s ease;
    }

a.suite-studio-card:hover {
      border-color: color-mix(in srgb, var(--cyan) 42%, var(--hero-border));
      background: color-mix(in srgb, var(--bg-elevated) 94%, transparent);
    }

a.suite-studio-card:focus-visible {
      outline: 2px solid var(--cyan);
      outline-offset: 2px;
    }

.suite-studio-card__ico {
      display: flex;
      align-items: center;
      justify-content: center;
      width: 2.35rem;
      height: 2.35rem;
      border-radius: 0.45rem;
      flex-shrink: 0;
      font-size: 0.72rem;
      font-weight: 800;
      letter-spacing: 0.04em;
    }

.suite-studio-card__ico--gold {
      background: color-mix(in srgb, var(--gold) 22%, transparent);
      color: var(--gold);
      border: 1px solid color-mix(in srgb, var(--gold) 35%, var(--hero-border));
    }

.suite-studio-card__ico--cyan {
      background: color-mix(in srgb, var(--cyan) 14%, transparent);
      color: var(--cyan);
      border: 1px solid color-mix(in srgb, var(--cyan) 32%, var(--hero-border));
    }

.suite-studio-card__ico--violet {
      background: rgba(167, 139, 250, 0.18);
      color: #a78bfa;
      border: 1px solid rgba(167, 139, 250, 0.35);
    }

.suite-studio-card__ico-svg {
      width: 1.28rem;
      height: 1.28rem;
      display: block;
      flex-shrink: 0;
    }

.suite-studio-card__title {
      font-weight: 700;
      font-size: 0.88rem;
      line-height: 1.28;
      letter-spacing: 0.02em;
      color: var(--text);
    }

.suite-studio-card__desc {
      font-size: 0.74rem;
      line-height: 1.42;
      color: var(--text-muted);
    }

.suite-studio__start-link {
      display: inline-flex;
      align-items: center;
      gap: 0.35rem;
      margin-bottom: 1.15rem;
      font-size: 0.86rem;
      font-weight: 700;
      color: var(--cyan);
      text-decoration: none;
    }

.suite-studio__start-link:hover {
      text-decoration: underline;
    }

.suite-studio__engine-showcase {
      margin: 0 0 0.95rem;
      padding: 0.95rem 1rem 1rem;
      border-radius: 0.72rem;
      border: 1px solid var(--hero-border);
      background: color-mix(in srgb, var(--bg-elevated) 84%, transparent);
      box-shadow:
        0 0 0 1px color-mix(in srgb, var(--cyan) 10%, transparent) inset,
        0 16px 34px rgba(0, 0, 0, 0.16);
    }

.suite-studio__engine-pane[hidden] {
      display: none !important;
    }

.suite-studio__engine-pane-head {
      display: flex;
      align-items: flex-start;
      gap: 0.75rem;
      margin-bottom: 0.8rem;
    }

.suite-studio__engine-pane-ico {
      width: 2.55rem;
      height: 2.55rem;
      border-radius: 0.62rem;
      border: 1px solid color-mix(in srgb, var(--cyan) 35%, var(--hero-border));
      background: color-mix(in srgb, var(--bg-page) 72%, transparent);
      color: var(--cyan);
      display: inline-flex;
      align-items: center;
      justify-content: center;
      flex-shrink: 0;
    }

.suite-studio__engine-pane-ico svg {
      width: 1.45rem;
      height: 1.45rem;
      display: block;
    }

.suite-studio__engine-pane-h {
      margin: 0 0 0.22rem;
      font-size: 0.98rem;
      font-weight: 800;
      letter-spacing: 0.01em;
      color: var(--text);
    }

.suite-studio__engine-pane-lead {
      margin: 0;
      font-size: 0.78rem;
      line-height: 1.45;
      color: var(--text-muted);
      max-width: 56ch;
    }

.suite-studio__engine-pane-grid {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 0.55rem;
    }

@media (max-width: 1120px) {
      .suite-studio__engine-pane-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
      }
    }

@media (max-width: 720px) {
      .suite-studio__engine-pane-grid {
        grid-template-columns: minmax(0, 1fr);
      }
    }

.suite-studio__engine-pill {
      border: 1px solid var(--hero-border);
      border-radius: 0.55rem;
      padding: 0.58rem 0.65rem;
      background: color-mix(in srgb, var(--bg-page) 70%, transparent);
    }

.suite-studio__engine-pill-h {
      margin: 0 0 0.18rem;
      font-size: 0.72rem;
      font-weight: 780;
      color: var(--text);
    }

.suite-studio__engine-pill-p {
      margin: 0;
      font-size: 0.68rem;
      line-height: 1.38;
      color: var(--text-muted);
    }

.suite-studio__engine-workbench {
      margin: 0 0 1rem;
      border-radius: 0.72rem;
      border: 1px solid var(--hero-border);
      background: color-mix(in srgb, var(--bg-elevated) 84%, transparent);
      overflow: hidden;
    }

.suite-studio__workbench-pane[hidden] {
      display: none !important;
    }

.suite-studio__wb-shell {
      padding: 0.9rem;
      display: grid;
      gap: 0.75rem;
    }

.suite-studio__wb-head {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 0.65rem;
      flex-wrap: wrap;
    }

.suite-studio__wb-title {
      margin: 0;
      font-size: 0.82rem;
      font-weight: 780;
      letter-spacing: 0.08em;
      text-transform: uppercase;
      color: color-mix(in srgb, var(--cyan) 75%, var(--text-muted));
    }

.suite-studio__wb-chips {
      display: flex;
      flex-wrap: wrap;
      gap: 0.35rem;
    }

.suite-studio__wb-chip {
      padding: 0.24rem 0.5rem;
      border-radius: 999px;
      border: 1px solid var(--hero-border);
      font-size: 0.64rem;
      font-weight: 700;
      color: var(--text);
      background: color-mix(in srgb, var(--bg-page) 72%, transparent);
    }

.suite-studio__wb-layout {
      display: grid;
      gap: 0.7rem;
      min-height: 0;
    }

.suite-studio__wb-layout--split {
      grid-template-columns: minmax(0, 1.3fr) minmax(0, 0.9fr);
    }

.suite-studio__wb-layout--speech {
      grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr);
    }

@media (max-width: 1100px) {
      .suite-studio__wb-layout--split,
      .suite-studio__wb-layout--speech {
        grid-template-columns: minmax(0, 1fr);
      }
    }

.suite-studio__wb-panel {
      border: 1px solid var(--hero-border);
      border-radius: 0.62rem;
      background: color-mix(in srgb, var(--bg-page) 72%, transparent);
      padding: 0.72rem;
      min-height: 0;
    }

.suite-studio__wb-panel-h {
      margin: 0 0 0.42rem;
      font-size: 0.7rem;
      font-weight: 760;
      letter-spacing: 0.07em;
      text-transform: uppercase;
      color: var(--text);
    }

.suite-studio__wb-stage {
      border-radius: 0.52rem;
      border: 1px dashed color-mix(in srgb, var(--cyan) 30%, var(--hero-border));
      min-height: 180px;
      background:
        radial-gradient(circle at 18% 16%, color-mix(in srgb, var(--cyan) 12%, transparent), transparent 45%),
        color-mix(in srgb, var(--bg-page) 76%, transparent);
      display: flex;
      align-items: center;
      justify-content: center;
      color: var(--text-muted);
      font-size: 0.74rem;
      text-align: center;
      padding: 0.8rem;
    }

.suite-studio__wb-list {
      display: grid;
      gap: 0.42rem;
    }

.suite-studio__wb-list-item {
      border: 1px solid var(--hero-border);
      border-radius: 0.5rem;
      padding: 0.5rem 0.56rem;
      background: color-mix(in srgb, var(--bg-elevated) 82%, transparent);
      font-size: 0.71rem;
      line-height: 1.35;
      color: var(--text-muted);
    }

.suite-studio__wb-list-item strong {
      display: block;
      margin-bottom: 0.12rem;
      color: var(--text);
      font-size: 0.72rem;
    }

.suite-studio__fieldset-h {
      margin: 0.25rem 0 0.35rem;
      font-size: 0.66rem;
      font-weight: 760;
      letter-spacing: 0.08em;
      text-transform: uppercase;
      color: color-mix(in srgb, var(--cyan) 78%, var(--text-muted));
    }

.suite-studio__field-lead {
      margin: -0.12rem 0 0.62rem;
      font-size: 0.69rem;
      line-height: 1.38;
      color: var(--text-muted);
    }

.suite-studio__setting-pane[hidden] {
      display: none !important;
    }

/* Match .suite-studio__setting-pane[hidden]: [hidden] must win over .suite-studio__code-preview-rail { display: flex }. */

.suite-studio__code-preview-rail[hidden],
    #suiteStudioCodePreviewRail[hidden] {
      display: none !important;
    }

.suite-studio__code-chat {
      margin: 0 0 0.82rem;
      flex: 0 0 auto;
      border: none;
      border-radius: 0;
      background: transparent;
      height: clamp(280px, 44vh, 460px);
      min-height: clamp(280px, 44vh, 460px);
      max-height: clamp(280px, 44vh, 460px);
      overflow-y: auto;
      overflow-x: hidden;
      overscroll-behavior: contain;
      padding: 0.25rem 0.1rem 0.35rem;
      display: flex;
      flex-direction: column;
      justify-content: flex-start;
      gap: 0.5rem;
    }

.suite-studio__code-chat[hidden] {
      display: none !important;
    }

/*
      Videos / speech: code-chat is hidden; tool-output must flex like .suite-studio__code-chat
      so the prompt stays at the bottom of the column (same as Code & chat), not vertically centered with a
      giant empty spacer above a short output box.
    */

.suite-studio__projects-workspace {
      display: flex;
      flex-direction: column;
      gap: 0.65rem;
      flex: 1 1 auto;
      min-height: 0;
    }

.suite-studio__projects-head {
      display: flex;
      flex-direction: column;
      gap: 0.45rem;
    }

.suite-studio__projects-head-row {
      display: flex;
      flex-wrap: wrap;
      align-items: center;
      gap: 0.5rem 0.75rem;
    }

.suite-studio__projects-label {
      font-size: 0.78rem;
      font-weight: 600;
      opacity: 0.88;
    }

.suite-studio__projects-select {
      flex: 1 1 220px;
      min-width: 180px;
      max-width: 100%;
    }

.suite-studio__projects-bc {
      font-size: 0.8rem;
      line-height: 1.4;
      opacity: 0.9;
      display: flex;
      flex-wrap: wrap;
      gap: 0.15rem 0.35rem;
      align-items: center;
    }

.suite-studio__projects-bc button {
      background: none;
      border: none;
      padding: 0.1rem 0.2rem;
      color: inherit;
      cursor: pointer;
      text-decoration: underline;
      font: inherit;
    }

.suite-studio__projects-toolbar {
      display: flex;
      flex-wrap: wrap;
      gap: 0.4rem;
      align-items: center;
    }

.suite-studio__projects-list-wrap {
      flex: 1 1 auto;
      min-height: 0;
      border: 1px solid var(--hero-border);
      border-radius: 10px;
      overflow: auto;
      background: rgba(0, 0, 0, 0.12);
    }

.suite-studio__projects-items {
      list-style: none;
      margin: 0;
      padding: 0.35rem 0;
    }

.suite-studio__projects-row {
      display: flex;
      flex-wrap: wrap;
      align-items: center;
      gap: 0.35rem 0.65rem;
      padding: 0.45rem 0.75rem;
      border-bottom: 1px solid rgba(148, 163, 184, 0.12);
      font-size: 0.88rem;
    }

.suite-studio__projects-row:last-child {
      border-bottom: none;
    }

.suite-studio__projects-row-name {
      flex: 1 1 140px;
      min-width: 0;
      word-break: break-word;
    }

.suite-studio__projects-row-meta {
      font-size: 0.75rem;
      opacity: 0.75;
      flex: 0 0 auto;
    }

.suite-studio__projects-row-actions {
      display: flex;
      flex-wrap: wrap;
      gap: 0.25rem;
      margin-left: auto;
    }

.suite-studio__projects-row-actions button {
      font-size: 0.75rem;
      padding: 0.2rem 0.45rem;
      border-radius: 6px;
      border: 1px solid rgba(148, 163, 184, 0.28);
      background: rgba(15, 23, 42, 0.35);
      color: inherit;
      cursor: pointer;
    }

.suite-studio__projects-status {
      margin: 0;
      font-size: 0.78rem;
      opacity: 0.85;
      min-height: 1.1em;
    }

.suite-studio__chat-msg {
      display: inline-block;
      max-width: min(94%, 74ch);
      border: 1px solid var(--hero-border);
      border-radius: 0.62rem;
      padding: 0.56rem 0.62rem;
      font-size: 0.78rem;
      line-height: 1.45;
      white-space: pre-wrap;
      word-break: break-word;
      background: color-mix(in srgb, var(--bg-page) 68%, transparent);
      color: var(--text);
    }

.suite-studio__chat-msg strong {
      display: block;
      margin-bottom: 0.24rem;
      font-size: 0.66rem;
      letter-spacing: 0.08em;
      text-transform: uppercase;
      color: color-mix(in srgb, var(--cyan) 80%, var(--text-muted));
    }

.suite-studio__chat-msg--user {
      align-self: flex-end;
      background: color-mix(in srgb, var(--cyan) 12%, var(--bg-elevated));
      border-color: color-mix(in srgb, var(--cyan) 42%, var(--hero-border));
    }

.suite-studio__chat-msg--assistant {
      align-self: flex-start;
    }

.suite-studio__chat-msg__term-chrome {
      display: flex;
      align-items: center;
      gap: 0.45rem;
      padding: 0.36rem 0.55rem 0.38rem;
      background: rgba(0, 0, 0, 0.42);
      border-bottom: 1px solid rgba(45, 212, 191, 0.22);
    }

.suite-studio__chat-msg__term-leds {
      display: inline-flex;
      align-items: center;
      gap: 0.3rem;
      flex-shrink: 0;
    }

.suite-studio__chat-msg__term-leds span {
      width: 0.52rem;
      height: 0.52rem;
      border-radius: 50%;
      box-shadow: inset 0 -1px 1px rgba(0, 0, 0, 0.35);
    }

.suite-studio__chat-msg__term-leds span:nth-child(1) {
      background: radial-gradient(circle at 30% 30%, #ff8f8f, #ff5f57 55%, #c0392b);
    }

.suite-studio__chat-msg__term-leds span:nth-child(2) {
      background: radial-gradient(circle at 30% 30%, #ffe8a3, #ffbd2e 55%, #c7921a);
    }

.suite-studio__chat-msg__term-leds span:nth-child(3) {
      background: radial-gradient(circle at 30% 30%, #9ff0b0, #28c840 55%, #1a8f32);
    }

.suite-studio__chat-msg__term-title {
      font-family: ui-monospace, "Cascadia Code", "Segoe UI Mono", Menlo, Consolas, monospace;
      font-size: 0.62rem;
      font-weight: 700;
      letter-spacing: 0.06em;
      text-transform: uppercase;
      color: rgba(167, 243, 208, 0.88);
      margin-left: 0.15rem;
    }

.suite-studio__chat-msg--terminal .suite-studio__chat-msg__body {
      display: block;
      padding: 0.62rem 0.72rem 0.72rem;
      font-family: ui-monospace, "Cascadia Code", "Segoe UI Mono", Menlo, Consolas, monospace;
      font-size: 0.74rem;
      line-height: 1.52;
      font-weight: 500;
      color: #6ee7b7;
      text-shadow: 0 0 18px rgba(110, 231, 183, 0.12);
      white-space: pre-wrap;
      word-break: break-word;
      background: repeating-linear-gradient(
        0deg,
        transparent,
        transparent 2px,
        rgba(0, 0, 0, 0.06) 2px,
        rgba(0, 0, 0, 0.06) 3px
      );
    }

.suite-studio__chat-msg--terminal .suite-studio__chat-msg__body--md {
      font-family: ui-sans-serif, system-ui, "Segoe UI", Roboto, "Inter", sans-serif;
      font-size: 0.8rem;
      line-height: 1.55;
      font-weight: 450;
      color: #e2e8f0;
      text-shadow: none;
      white-space: normal;
      background: transparent;
    }

.suite-studio__chat-msg__body--md.prose p {
      margin: 0.12rem 0 0.22rem;
    }

.suite-studio__chat-msg__body--md.prose p:first-child {
      margin-top: 0;
    }

.suite-studio__chat-msg__body--md.prose p:last-child {
      margin-bottom: 0;
    }

.suite-studio__chat-msg__body--md.prose ul,
    .suite-studio__chat-msg__body--md.prose ol {
      margin: 0.35rem 0 0.55rem;
      padding-left: 1.15rem;
    }

.suite-studio__chat-msg__body--md.prose h1,
    .suite-studio__chat-msg__body--md.prose h2,
    .suite-studio__chat-msg__body--md.prose h3 {
      margin: 0.65rem 0 0.4rem;
      font-weight: 750;
      letter-spacing: -0.02em;
      line-height: 1.25;
      color: #f8fafc;
    }

.suite-studio__chat-msg__body--md.prose h1 {
      font-size: 1.05rem;
    }

.suite-studio__chat-msg__body--md.prose h2 {
      font-size: 0.95rem;
    }

.suite-studio__chat-msg__body--md.prose h3 {
      font-size: 0.88rem;
    }

.suite-studio__chat-msg__body--md.prose a {
      color: color-mix(in srgb, var(--cyan) 78%, #fff);
      text-decoration: underline;
      text-underline-offset: 0.12em;
    }

.suite-studio__chat-msg__body--md.prose strong {
      display: inline;
      margin: 0;
      font-size: inherit;
      letter-spacing: normal;
      text-transform: none;
      font-weight: 720;
      color: #f1f5f9;
    }

.suite-studio__chat-msg__body--md.prose code {
      font-family: ui-monospace, "Cascadia Code", "Segoe UI Mono", Menlo, Consolas, monospace;
      font-size: 0.88em;
      padding: 0.12em 0.38em;
      border-radius: 0.32rem;
      background: rgba(15, 23, 42, 0.72);
      border: 1px solid rgba(148, 163, 184, 0.22);
      color: #f8fafc;
    }

.suite-studio__chat-msg__body--md.prose pre {
      position: relative;
      margin: 0.55rem 0 0.65rem;
      padding: 0.72rem 0.78rem 0.82rem;
      border-radius: 0.48rem;
      border: 1px solid rgba(148, 163, 184, 0.22);
      border-left: 3px solid #e10600;
      background: rgba(15, 23, 42, 0.88) !important;
      overflow-x: auto;
      max-height: min(55vh, 28rem);
      overflow-y: auto;
      font-size: 0.74rem;
      line-height: 1.48;
    }

.suite-studio__chat-msg__body--md.prose pre[class*="language-"] {
      border-left-color: #2563eb;
    }

.suite-studio__chat-msg__body--md.prose pre code {
      display: block;
      padding: 0;
      border: 0;
      background: transparent !important;
      font-size: inherit;
      color: inherit;
    }

.suite-studio__chat-msg--streaming .suite-studio__chat-msg__body::after {
      content: "\200b";
      display: inline-block;
      width: 0.45em;
      margin-left: 1px;
      border-left: 2px solid color-mix(in srgb, var(--cyan) 72%, var(--text-muted));
      animation: rise-suite-caret 0.95s steps(1, end) infinite;
      vertical-align: -0.08em;
    }

.suite-studio__chat-msg--terminal.suite-studio__chat-msg--streaming .suite-studio__chat-msg__body::after {
      border-left-color: rgba(167, 243, 208, 0.95);
      box-shadow: 0 0 6px rgba(110, 231, 183, 0.45);
    }

.suite-studio__chat-msg--error {
      align-self: flex-start;
      border-color: color-mix(in srgb, #fb7185 48%, var(--hero-border));
      background: color-mix(in srgb, #fb7185 10%, var(--bg-elevated));
    }

.suite-studio__chat-msg--media {
      width: min(100%, 640px);
    }

.suite-studio__img-gen-card {
      width: 100%;
      max-width: min(56rem, 100%);
      align-self: stretch;
      margin-top: 0.35rem;
      padding: 0.85rem 1rem;
      border-radius: 0.85rem;
      border: 1px solid var(--hero-border);
      background: color-mix(in srgb, var(--bg-elevated) 82%, var(--bg-page));
      box-sizing: border-box;
    }

.suite-studio__img-gen-card__caption {
      margin: 0 0 0.55rem;
      font-size: 0.68rem;
      font-weight: 760;
      letter-spacing: 0.08em;
      text-transform: uppercase;
      color: var(--text-muted);
    }

.suite-studio__img-gen-card__row {
      display: flex;
      flex-direction: row;
      align-items: stretch;
      gap: 1rem;
      min-width: 0;
    }

.suite-studio__img-gen-card__pic {
      flex: 0 0 auto;
      width: min(44vw, 280px);
      max-width: 320px;
      border: 0;
      padding: 0;
      border-radius: 0.65rem;
      overflow: hidden;
      cursor: zoom-in;
      background: color-mix(in srgb, var(--bg-page) 70%, transparent);
    }

.suite-studio__img-gen-card__pic img {
      display: block;
      width: 100%;
      height: auto;
      aspect-ratio: 1 / 1;
      object-fit: cover;
    }

.suite-studio__img-gen-card__meta {
      flex: 1 1 auto;
      min-width: 0;
      display: flex;
      flex-direction: column;
      gap: 0.55rem;
    }

.suite-studio__img-gen-card__prompt {
      margin: 0;
      font-size: 0.95rem;
      font-weight: 650;
      line-height: 1.35;
      color: var(--text);
      word-break: break-word;
    }

.suite-studio__img-gen-card__badges {
      display: flex;
      flex-wrap: wrap;
      gap: 0.35rem;
    }

.suite-studio__img-gen-badge {
      display: inline-flex;
      align-items: center;
      padding: 0.22rem 0.55rem;
      border-radius: 999px;
      font-size: 0.72rem;
      font-weight: 600;
      border: 1px solid var(--hero-border);
      background: color-mix(in srgb, var(--bg-page) 55%, transparent);
      color: var(--text-muted);
    }

.suite-studio__img-gen-card__actions {
      display: flex;
      flex-wrap: wrap;
      gap: 0.45rem;
      margin-top: 0.15rem;
    }

.suite-studio__img-gen-dl {
      font-size: 0.78rem;
      font-weight: 650;
      color: color-mix(in srgb, var(--cyan) 78%, var(--text));
      text-decoration: none;
    }

.suite-studio__img-gen-dl:hover {
      text-decoration: underline;
    }

.suite-studio__img-gen-card__more {
      margin-top: 0.65rem;
    }

@media (max-width: 720px) {
      .suite-studio__img-gen-card__row {
        flex-direction: column;
      }
      .suite-studio__img-gen-card__pic {
        width: 100%;
        max-width: none;
      }
    }

.suite-studio__chat-media-grid {
      margin-top: 0.55rem;
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 0.5rem;
    }

.suite-studio__chat-image-btn {
      border: 1px solid var(--hero-border);
      border-radius: 0.5rem;
      overflow: hidden;
      padding: 0;
      background: color-mix(in srgb, var(--bg-page) 66%, transparent);
      cursor: zoom-in;
    }

.suite-studio__chat-image-btn:focus-visible {
      outline: 2px solid color-mix(in srgb, var(--cyan) 72%, #ffffff);
      outline-offset: 2px;
    }

.suite-studio__chat-image-btn img {
      width: 100%;
      aspect-ratio: 1 / 1;
      object-fit: cover;
      display: block;
    }

@media (max-width: 760px) {
      .suite-studio__chat-media-grid {
        grid-template-columns: minmax(0, 1fr);
      }
    }

.suite-studio__lightbox[hidden] {
      display: none !important;
    }

.suite-studio__lightbox {
      position: fixed;
      inset: 0;
      z-index: 1200;
      display: grid;
      place-items: center;
      padding: 1rem;
      background: rgba(4, 10, 20, 0.84);
      backdrop-filter: blur(4px);
      cursor: zoom-out;
    }

.suite-studio__lightbox-img {
      max-width: min(92vw, 1200px);
      max-height: 88vh;
      border-radius: 0.85rem;
      box-shadow: 0 20px 70px rgba(0, 0, 0, 0.55);
      border: 1px solid color-mix(in srgb, var(--hero-border) 74%, transparent);
      cursor: auto;
    }

.suite-studio__lightbox-close {
      position: fixed;
      top: 0.9rem;
      right: 0.9rem;
      border: 1px solid var(--hero-border);
      background: color-mix(in srgb, var(--bg-elevated) 88%, transparent);
      color: var(--text);
      border-radius: 999px;
      padding: 0.38rem 0.72rem;
      font: inherit;
      font-size: 0.76rem;
      cursor: pointer;
    }

.suite-studio__tool-output {
      margin: 0 0 0.82rem;
      border: none;
      border-radius: 0;
      background: transparent;
      height: clamp(280px, 44vh, 460px);
      min-height: clamp(280px, 44vh, 460px);
      max-height: clamp(280px, 44vh, 460px);
      overflow-y: auto;
      overflow-x: hidden;
      overscroll-behavior: contain;
      padding: 0.25rem 0.1rem 0.35rem;
      display: flex;
      flex-direction: column;
      justify-content: flex-end;
      gap: 0.5rem;
    }

.suite-studio__tool-pane--bare {
      margin: 0;
      padding: 0;
      background: transparent;
      border: none;
      flex: 1 1 auto;
      min-height: 0;
      display: flex;
      flex-direction: column;
      gap: 0.5rem;
    }

.suite-studio__tool-output[hidden] {
      display: none !important;
    }

.suite-studio__tool-pane[hidden] {
      display: none !important;
    }

.suite-studio__tool-pane-h {
      margin: 0 0 0.4rem;
      font-size: 0.8rem;
      font-weight: 780;
      letter-spacing: 0.08em;
      text-transform: uppercase;
      color: color-mix(in srgb, var(--cyan) 78%, var(--text-muted));
    }

.suite-studio__tool-pane-lead {
      margin: 0 0 0.65rem;
      font-size: 0.74rem;
      line-height: 1.4;
      color: var(--text-muted);
    }

.suite-studio__img-grid {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 0.58rem;
    }

@media (max-width: 760px) {
      .suite-studio__img-grid {
        grid-template-columns: minmax(0, 1fr);
      }
    }

.suite-studio__img-card {
      border: 1px solid var(--hero-border);
      border-radius: 0.62rem;
      overflow: hidden;
      background: color-mix(in srgb, var(--bg-page) 74%, transparent);
    }

.suite-studio__img-card img {
      width: 100%;
      aspect-ratio: 1 / 1;
      object-fit: cover;
      display: block;
      background: color-mix(in srgb, var(--bg-page) 60%, transparent);
    }

.suite-studio__img-card-foot {
      display: flex;
      justify-content: space-between;
      align-items: center;
      gap: 0.4rem;
      padding: 0.42rem 0.5rem;
      font-size: 0.66rem;
      color: var(--text-muted);
    }

.suite-studio__img-card-foot a {
      color: var(--cyan);
      text-decoration: none;
      font-weight: 700;
    }

.suite-studio__img-card-foot a:hover {
      text-decoration: underline;
    }

.suite-studio__tool-list {
      display: grid;
      gap: 0.42rem;
      margin: 0;
      padding: 0;
      list-style: none;
    }

.suite-studio__tool-list li {
      border: 1px solid var(--hero-border);
      border-radius: 0.5rem;
      padding: 0.52rem 0.56rem;
      font-size: 0.72rem;
      line-height: 1.38;
      background: color-mix(in srgb, var(--bg-page) 72%, transparent);
      color: var(--text-muted);
    }

.suite-studio__tool-list li strong {
      display: block;
      margin-bottom: 0.1rem;
      color: var(--text);
      font-size: 0.72rem;
    }

.suite-studio__tool-textarea {
      width: 100%;
      border: 1px solid var(--hero-border);
      border-radius: 0.56rem;
      background: color-mix(in srgb, var(--bg-page) 75%, transparent);
      color: var(--text);
      min-height: 140px;
      resize: vertical;
      padding: 0.52rem 0.6rem;
      font: inherit;
      font-size: 0.74rem;
      line-height: 1.42;
      box-sizing: border-box;
    }

.suite-studio__tool-sub {
      margin: 0.62rem 0 0.32rem;
      font-size: 0.67rem;
      font-weight: 760;
      letter-spacing: 0.07em;
      text-transform: uppercase;
      color: color-mix(in srgb, var(--cyan) 78%, var(--text-muted));
    }

.suite-studio__chip-btn[disabled] {
      opacity: 0.55;
      cursor: not-allowed;
    }

.suite-studio__prompt {
      margin-top: auto;
      position: sticky;
      bottom: 0;
      z-index: 5;
      padding-top: 0.6rem;
      padding-bottom: calc(0.1rem + env(safe-area-inset-bottom, 0px));
      background: var(--bg-page);
    }

.suite-studio__prompt-inner {
      display: flex;
      flex-wrap: wrap;
      align-items: center;
      gap: 0.5rem;
      padding: 0.55rem 0.65rem;
      border-radius: 999px;
      border: 1px solid var(--hero-border);
      background: color-mix(in srgb, var(--bg-elevated) 75%, var(--bg-page));
    }

.suite-studio__prompt-input {
      flex: 1 1 12rem;
      min-width: 0;
      border: none;
      background: transparent;
      color: var(--text);
      font: inherit;
      font-size: 0.88rem;
      padding: 0.35rem 0.5rem;
    }

.suite-studio__prompt-input::placeholder {
      color: var(--text-muted);
    }

.suite-studio__prompt-input:focus {
      outline: none;
    }

.suite-studio__prompt-tools {
      display: flex;
      flex-wrap: wrap;
      align-items: center;
      gap: 0.35rem;
    }

.suite-studio__chip-btn {
      padding: 0.35rem 0.65rem;
      border-radius: 999px;
      border: 1px solid var(--hero-border);
      background: color-mix(in srgb, var(--bg-page) 50%, transparent);
      color: var(--text);
      font: inherit;
      font-size: 0.76rem;
      font-weight: 600;
      cursor: pointer;
    }

.suite-studio__chip-btn--icon {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      padding: 0.48rem 0.52rem;
      min-width: 2.65rem;
      min-height: 2.65rem;
    }

.suite-studio__chip-ico {
      width: 1.45rem;
      height: 1.45rem;
      display: block;
    }

.suite-studio__engine-pop {
      position: relative;
      flex: 0 1 auto;
      max-width: min(11.5rem, 42vw);
      min-width: 7.25rem;
    }

.suite-studio__engine-trigger {
      display: inline-flex;
      align-items: center;
      justify-content: space-between;
      gap: 0.4rem;
      width: 100%;
      max-width: 100%;
      padding: 0.35rem 0.45rem 0.35rem 0.65rem;
      border-radius: 999px;
      border: 1px solid var(--hero-border);
      background-color: color-mix(in srgb, var(--bg-page) 50%, transparent);
      color: var(--text);
      font: inherit;
      font-size: 0.76rem;
      font-weight: 600;
      line-height: 1.25;
      cursor: pointer;
      text-align: left;
    }

.suite-studio__engine-trigger-label {
      flex: 1 1 auto;
      min-width: 0;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }

.suite-studio__engine-trigger-chev {
      flex-shrink: 0;
      display: flex;
      align-items: center;
      justify-content: center;
      width: 1.1rem;
      height: 1.1rem;
      opacity: 0.72;
      transition: transform 0.2s ease, opacity 0.15s ease;
    }

.suite-studio__engine-trigger-chev svg {
      width: 0.72rem;
      height: 0.72rem;
      display: block;
    }

.suite-studio__engine-pop.is-open .suite-studio__engine-trigger-chev {
      transform: rotate(180deg);
      opacity: 0.95;
    }

.suite-studio__engine-pop.is-open .suite-studio__engine-trigger {
      border-color: color-mix(in srgb, var(--cyan) 45%, var(--hero-border));
    }

.suite-studio__engine-trigger:focus {
      outline: none;
    }

.suite-studio__engine-trigger:focus-visible {
      outline: 2px solid var(--cyan);
      outline-offset: 2px;
    }

.suite-studio__engine-menu {
      position: absolute;
      bottom: calc(100% + 0.42rem);
      left: 0;
      right: 0;
      z-index: 60;
      margin: 0;
      padding: 0.38rem;
      list-style: none;
      border-radius: 0.55rem;
      border: 1px solid color-mix(in srgb, var(--cyan) 22%, var(--hero-border));
      background: linear-gradient(165deg, color-mix(in srgb, var(--bg-elevated) 88%, #0b1428) 0%, var(--bg-elevated) 100%);
      box-shadow: 0 -14px 42px rgba(0, 0, 0, 0.55), 0 0 0 1px rgba(255, 255, 255, 0.04) inset;
      max-height: min(22rem, 55vh);
      overflow-y: auto;
      -webkit-overflow-scrolling: touch;
    }

.suite-studio__engine-menu li {
      margin: 0;
    }

.suite-studio__engine-opt {
      display: block;
      width: 100%;
      padding: 0.52rem 0.58rem;
      border: none;
      border-radius: 0.42rem;
      background: transparent;
      color: inherit;
      font: inherit;
      font-size: 0.78rem;
      font-weight: 600;
      text-align: left;
      cursor: pointer;
      letter-spacing: 0.01em;
    }

.suite-studio__engine-opt:hover {
      background: color-mix(in srgb, var(--cyan) 12%, transparent);
    }

.suite-studio__engine-opt.is-active {
      background: color-mix(in srgb, var(--cyan) 20%, transparent);
    }

.suite-studio__side-h {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 0.5rem;
      margin: 0 0 1rem;
      font-size: 0.82rem;
      font-weight: 800;
      letter-spacing: 0.06em;
      text-transform: uppercase;
      color: var(--text-muted);
    }

.suite-studio__side-h-actions {
      display: flex;
      align-items: center;
      gap: 0.25rem;
    }

.suite-studio__asset-bar {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 0.5rem;
      margin: 0 0 0.9rem;
    }

.suite-studio__asset-bar-label {
      font-size: 0.65rem;
      font-weight: 800;
      letter-spacing: 0.08em;
      text-transform: uppercase;
      color: var(--text-muted);
      flex-shrink: 0;
    }

.suite-studio__asset-pop {
      position: relative;
      flex: 1 1 auto;
      min-width: 0;
      display: flex;
      justify-content: stretch;
    }

.suite-studio__asset-trigger {
      display: inline-flex;
      align-items: center;
      gap: 0.45rem;
      width: 100%;
      max-width: 100%;
      padding: 0.38rem 0.55rem 0.38rem 0.48rem;
      border-radius: 0.45rem;
      border: 1px solid var(--hero-border);
      background: color-mix(in srgb, var(--bg-page) 50%, var(--bg-elevated));
      color: var(--text);
      font: inherit;
      font-size: 0.76rem;
      font-weight: 700;
      cursor: pointer;
      line-height: 1.2;
    }

.suite-studio__asset-trigger:hover {
      border-color: color-mix(in srgb, var(--cyan) 35%, var(--hero-border));
    }

.suite-studio__asset-pop.is-open .suite-studio__asset-trigger {
      border-color: color-mix(in srgb, var(--cyan) 45%, var(--hero-border));
    }

.suite-studio__asset-trigger-ico {
      display: flex;
      align-items: center;
      justify-content: center;
      flex-shrink: 0;
      width: 1.35rem;
      height: 1.35rem;
    }

.suite-studio__asset-trigger-ico img,
    .suite-studio__asset-trigger-ico svg {
      display: block;
      width: 1.15rem;
      height: 1.15rem;
    }

.suite-studio__asset-trigger-mid {
      display: flex;
      flex-direction: column;
      align-items: flex-start;
      flex: 1 1 auto;
      min-width: 0;
      text-align: left;
    }

.suite-studio__asset-trigger-sym {
      font-weight: 800;
      letter-spacing: 0.02em;
    }

.suite-studio__asset-trigger-usd {
      font-size: 0.66rem;
      font-weight: 650;
      color: var(--text-muted);
    }

.suite-studio__asset-trigger-chevron {
      flex-shrink: 0;
      font-size: 0.55rem;
      opacity: 0.65;
      margin-left: 0.1rem;
      transition: transform 0.16s ease;
    }

.suite-studio__asset-trigger-chevron--opens-up {
      display: inline-block;
      line-height: 1;
      transform: rotate(0deg);
    }

.suite-studio__asset-pop.is-open .suite-studio__asset-trigger-chevron {
      transform: rotate(180deg);
    }

.suite-studio__asset-menu {
      position: absolute;
      top: calc(100% + 0.28rem);
      right: 0;
      z-index: 40;
      min-width: 11.5rem;
      max-width: min(18rem, 92vw);
      margin: 0;
      padding: 0.28rem;
      list-style: none;
      border-radius: 0.5rem;
      border: 1px solid var(--hero-border);
      background: var(--bg-elevated);
      box-shadow: 0 10px 32px rgba(0, 0, 0, 0.35);
    }

.suite-studio__asset-menu li {
      margin: 0;
    }

.suite-studio__asset-opt {
      display: grid;
      grid-template-columns: auto 1fr;
      grid-template-rows: auto auto;
      align-items: center;
      column-gap: 0.45rem;
      row-gap: 0.12rem;
      width: 100%;
      padding: 0.42rem 0.45rem;
      border: none;
      border-radius: 0.38rem;
      background: transparent;
      color: inherit;
      font: inherit;
      font-size: 0.78rem;
      font-weight: 700;
      cursor: pointer;
      text-align: left;
    }

.suite-studio__asset-opt:hover {
      background: color-mix(in srgb, var(--cyan) 12%, transparent);
    }

.suite-studio__asset-opt.is-active {
      background: color-mix(in srgb, var(--cyan) 16%, transparent);
    }

.suite-studio__asset-opt-ico {
      display: flex;
      align-items: center;
      justify-content: center;
      width: 1.35rem;
      height: 1.35rem;
      flex-shrink: 0;
      grid-column: 1;
      grid-row: 1 / span 2;
      align-self: center;
    }

.suite-studio__asset-opt-ico img,
    .suite-studio__asset-opt-ico svg {
      display: block;
      width: 1.15rem;
      height: 1.15rem;
    }

.suite-studio__asset-opt-label {
      grid-column: 2;
      grid-row: 1;
      min-width: 0;
      line-height: 1.2;
    }

.suite-studio__asset-opt-usd {
      grid-column: 2;
      grid-row: 2;
      min-width: 0;
      font-size: 0.68rem;
      font-weight: 650;
      color: var(--text-muted);
      line-height: 1.25;
      white-space: normal;
      word-break: break-word;
    }

.suite-studio__icon-btn {
      display: flex;
      align-items: center;
      justify-content: center;
      width: 2rem;
      height: 2rem;
      padding: 0;
      border: none;
      border-radius: 0.35rem;
      background: transparent;
      color: var(--text-muted);
      cursor: pointer;
    }

.suite-studio__icon-btn:hover {
      color: var(--text);
      background: color-mix(in srgb, var(--cyan) 10%, transparent);
    }

.suite-studio__field {
      margin-bottom: 1rem;
    }

.suite-studio__field label {
      display: block;
      font-size: 0.72rem;
      font-weight: 700;
      letter-spacing: 0.05em;
      text-transform: uppercase;
      color: var(--text-muted);
      margin-bottom: 0.35rem;
    }

.suite-studio__select,
    .suite-studio__textarea {
      width: 100%;
      padding: 0.55rem 0.65rem;
      border-radius: 0.45rem;
      border: 1px solid var(--hero-border);
      background: color-mix(in srgb, var(--bg-page) 55%, var(--bg-elevated));
      color: var(--text);
      font: inherit;
      font-size: 0.84rem;
    }

.suite-studio__textarea {
      min-height: 5.5rem;
      resize: vertical;
    }

.suite-studio__toggle {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 0.75rem;
      padding: 0.45rem 0;
      border-bottom: 1px solid var(--hero-border);
      font-size: 0.82rem;
      font-weight: 600;
      color: var(--text);
    }

.suite-studio__toggle:last-of-type {
      border-bottom: none;
    }

.suite-studio__toggle input {
      width: 2.5rem;
      height: 1.35rem;
      accent-color: var(--cyan);
      cursor: pointer;
    }

.suite-studio__seg-group {
      display: flex;
      flex-wrap: wrap;
      gap: 0.35rem;
    }

.suite-studio__seg-btn {
      flex: 1 1 0;
      min-width: 2.35rem;
      padding: 0.48rem 0.5rem;
      border-radius: 0.4rem;
      border: 1px solid var(--hero-border);
      background: color-mix(in srgb, var(--bg-page) 55%, var(--bg-elevated));
      color: var(--text);
      font: inherit;
      font-size: 0.82rem;
      font-weight: 700;
      cursor: pointer;
      transition: border-color 0.15s ease, background 0.15s ease;
    }

.suite-studio__seg-btn:hover {
      border-color: color-mix(in srgb, var(--cyan) 48%, var(--hero-border));
    }

.suite-studio__seg-btn[aria-pressed="true"] {
      border-color: color-mix(in srgb, var(--cyan) 62%, var(--hero-border));
      background: color-mix(in srgb, var(--cyan) 14%, var(--bg-elevated));
    }

.suite-hub__hero {
      margin-bottom: 2rem;
    }

.suite-hub__title {
      font-size: clamp(1.35rem, 3.2vw, 1.85rem);
      font-weight: 800;
      letter-spacing: 0.02em;
      line-height: 1.15;
      margin: 0 0 0.75rem;
      color: var(--text);
    }

.suite-hub__subtitle {
      margin: 0;
      max-width: 52rem;
      font-size: clamp(0.95rem, 1.6vw, 1.05rem);
      line-height: 1.55;
      color: var(--text-muted);
    }

.suite-hub__strong {
      color: var(--text);
      font-weight: 700;
    }

.suite-hub__prose {
      margin-top: 1.25rem;
      font-size: 0.9rem;
      line-height: 1.65;
      color: var(--text-muted);
      max-width: 48rem;
    }

.suite-hub__section-lead + .suite-hub__prose {
      margin-top: 0;
    }

.suite-hub__prose p {
      margin: 0 0 0.85rem;
    }

.suite-hub__prose p:last-child {
      margin-bottom: 0;
    }

.suite-hub__section {
      position: relative;
      margin-top: 2.25rem;
      padding-top: 2rem;
      border-top: 1px solid var(--hero-border);
    }

.suite-hub__section::after {
      content: "";
      position: absolute;
      left: 0;
      top: -1px;
      width: 100%;
      height: 1px;
      background: linear-gradient(90deg, color-mix(in srgb, var(--cyan) 65%, transparent), transparent 65%);
      transform-origin: left center;
      transform: scaleX(0.12);
      opacity: 0.35;
      transition: transform 0.8s cubic-bezier(0.22, 1, 0.36, 1), opacity 0.6s ease;
    }

.suite-hub__section-title {
      font-size: clamp(1.05rem, 2vw, 1.2rem);
      font-weight: 800;
      margin: 0 0 0.65rem;
      color: var(--text);
    }

.suite-hub__section-lead {
      margin: 0 0 1.25rem;
      font-size: 0.9rem;
      line-height: 1.6;
      color: var(--text-muted);
      max-width: 48rem;
    }

.suite-hub__grid {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 0.85rem;
    }

@media (max-width: 720px) {
      .suite-hub__grid {
        grid-template-columns: minmax(0, 1fr);
      }
    }

.suite-hub__card {
      padding: 1rem 0.95rem 1.05rem;
      border-radius: 0.6rem;
      border: 1px solid var(--hero-border);
      background: color-mix(in srgb, var(--bg-elevated) 82%, transparent);
    }

.suite-hub__card h3 {
      font-size: 0.92rem;
      font-weight: 800;
      margin: 0 0 0.45rem;
      color: var(--text);
      display: flex;
      align-items: flex-start;
      gap: 0.65rem;
    }

.suite-hub__card h3 svg {
      width: 2.2rem;
      height: 2.2rem;
      flex-shrink: 0;
      opacity: 1;
      color: var(--cyan);
    }

.suite-hub__card--lane h3 svg {
      width: 3.6rem;
      height: 3.6rem;
      padding: 0.56rem;
      border-radius: 0.8rem;
      border: 1px solid color-mix(in srgb, var(--cyan) 45%, var(--hero-border));
      background:
        radial-gradient(circle at 30% 24%, color-mix(in srgb, var(--cyan) 28%, transparent), transparent 58%),
        color-mix(in srgb, var(--bg-page) 74%, transparent);
      box-shadow:
        0 18px 32px rgba(0, 0, 0, 0.26),
        0 0 0 1px color-mix(in srgb, var(--cyan) 28%, transparent) inset,
        0 0 34px color-mix(in srgb, var(--cyan) 28%, transparent);
    }

.suite-hub__card p {
      margin: 0;
      font-size: 0.82rem;
      line-height: 1.55;
      color: var(--text-muted);
    }

.suite-hub__list {
      margin: 0.85rem 0 0;
      padding: 0 0 0 1.1rem;
      font-size: 0.86rem;
      line-height: 1.55;
      color: var(--text-muted);
    }

.suite-hub__list li {
      margin-bottom: 0.35rem;
    }

.suite-hub__list li:last-child {
      margin-bottom: 0;
    }

.suite-hub__grid--four {
      grid-template-columns: repeat(4, minmax(0, 1fr));
      gap: 0.75rem;
    }

@media (max-width: 1120px) {
      .suite-hub__grid--four {
        grid-template-columns: repeat(2, minmax(0, 1fr));
      }
    }

@media (max-width: 620px) {
      .suite-hub__grid--four {
        grid-template-columns: minmax(0, 1fr);
      }
    }

.suite-hub__card-label {
      margin: 0 0 0.45rem;
      font-size: 0.64rem;
      font-weight: 850;
      letter-spacing: 0.12em;
      text-transform: uppercase;
      color: color-mix(in srgb, var(--cyan) 72%, var(--text-muted));
    }

.suite-hub__card--persona h3,
    .suite-hub__card--governance h3 {
      gap: 0.55rem;
    }

.suite-hub__card--persona h3 svg,
    .suite-hub__card--governance h3 svg {
      width: 3rem;
      height: 3rem;
      padding: 0.46rem;
      border-radius: 0.74rem;
      border: 1px solid color-mix(in srgb, var(--cyan) 48%, var(--hero-border));
      background:
        radial-gradient(circle at 30% 24%, color-mix(in srgb, var(--cyan) 24%, transparent), transparent 58%),
        color-mix(in srgb, var(--bg-page) 74%, transparent);
      box-shadow:
        0 14px 28px rgba(0, 0, 0, 0.24),
        0 0 0 1px color-mix(in srgb, var(--cyan) 22%, transparent) inset,
        0 0 30px color-mix(in srgb, var(--cyan) 20%, transparent);
    }

.suite-hub__card--persona,
    .suite-hub__card--governance {
      position: relative;
      overflow: hidden;
      background:
        linear-gradient(160deg, color-mix(in srgb, var(--bg-elevated) 86%, transparent) 0%, color-mix(in srgb, var(--bg-page) 82%, transparent) 100%);
    }

.suite-hub__card--persona::after,
    .suite-hub__card--governance::after {
      content: "";
      position: absolute;
      inset: 0 auto auto 0;
      width: 100%;
      height: 2px;
      background: linear-gradient(90deg, color-mix(in srgb, var(--cyan) 70%, transparent), transparent 78%);
      opacity: 0.6;
    }

.suite-hub__stack-grid {
      display: grid;
      grid-template-columns: repeat(4, minmax(0, 1fr));
      gap: 0.8rem;
      margin-top: 0.25rem;
    }

@media (max-width: 1120px) {
      .suite-hub__stack-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
      }
    }

@media (max-width: 620px) {
      .suite-hub__stack-grid {
        grid-template-columns: minmax(0, 1fr);
      }
    }

.suite-hub__stack-card {
      display: block;
      position: relative;
      padding: 0.92rem 0.9rem 0.95rem;
      border-radius: 0.6rem;
      border: 1px solid var(--hero-border);
      background:
        linear-gradient(155deg, color-mix(in srgb, var(--bg-elevated) 84%, transparent), color-mix(in srgb, var(--bg-page) 88%, transparent));
      text-decoration: none;
      color: var(--text);
      transition:
        transform 0.22s ease,
        border-color 0.2s ease,
        box-shadow 0.25s ease;
    }

.suite-hub__stack-card:hover {
      transform: translateY(-3px);
      border-color: color-mix(in srgb, var(--cyan) 52%, var(--hero-border));
      box-shadow:
        0 14px 32px rgba(0, 0, 0, 0.2),
        0 0 0 1px color-mix(in srgb, var(--cyan) 16%, transparent);
    }

.suite-hub__stack-card-step {
      display: inline-flex;
      margin: 0;
      padding: 0.18rem 0.45rem;
      border-radius: 999px;
      font-size: 0.59rem;
      font-weight: 850;
      letter-spacing: 0.12em;
      text-transform: uppercase;
      color: var(--text);
      border: 1px solid color-mix(in srgb, var(--cyan) 40%, var(--hero-border));
      background: color-mix(in srgb, var(--bg-page) 72%, transparent);
    }

.suite-hub__stack-card-head {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 0.5rem;
      margin: 0 0 0.55rem;
    }

.suite-hub__stack-card-icon {
      width: 3.1rem;
      height: 3.1rem;
      padding: 0.5rem;
      border-radius: 0.74rem;
      border: 1px solid color-mix(in srgb, var(--cyan) 48%, var(--hero-border));
      background:
        radial-gradient(circle at 30% 24%, color-mix(in srgb, var(--cyan) 25%, transparent), transparent 58%),
        color-mix(in srgb, var(--bg-page) 74%, transparent);
      color: var(--cyan);
      flex-shrink: 0;
      box-shadow:
        0 15px 30px rgba(0, 0, 0, 0.24),
        0 0 0 1px color-mix(in srgb, var(--cyan) 24%, transparent) inset,
        0 0 30px color-mix(in srgb, var(--cyan) 24%, transparent);
    }

@media (max-width: 720px) {
      .suite-hub__card--lane h3 svg {
        width: 2.9rem;
        height: 2.9rem;
      }
      .suite-hub__card--persona h3 svg,
      .suite-hub__card--governance h3 svg,
      .suite-hub__stack-card-icon {
        width: 2.5rem;
        height: 2.5rem;
      }
    }

.suite-hub__grid--three {
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 0.8rem;
    }

@media (max-width: 980px) {
      .suite-hub__grid--three {
        grid-template-columns: repeat(2, minmax(0, 1fr));
      }
    }

@media (max-width: 620px) {
      .suite-hub__grid--three {
        grid-template-columns: minmax(0, 1fr);
      }
    }

.suite-hub__card--impact {
      border-color: color-mix(in srgb, var(--gold) 32%, var(--hero-border));
      background:
        linear-gradient(160deg, color-mix(in srgb, var(--bg-elevated) 88%, transparent) 0%, color-mix(in srgb, var(--bg-page) 82%, transparent) 100%);
    }

.suite-hub__card--impact h3 svg {
      color: var(--gold);
      border-color: color-mix(in srgb, var(--gold) 46%, var(--hero-border));
      background:
        radial-gradient(circle at 30% 24%, color-mix(in srgb, var(--gold) 24%, transparent), transparent 58%),
        color-mix(in srgb, var(--bg-page) 74%, transparent);
      box-shadow:
        0 16px 30px rgba(0, 0, 0, 0.24),
        0 0 0 1px color-mix(in srgb, var(--gold) 24%, transparent) inset,
        0 0 32px color-mix(in srgb, var(--gold) 24%, transparent);
    }

.suite-hub__stack-card h3 {
      margin: 0 0 0.4rem;
      font-size: 0.9rem;
      font-weight: 800;
      line-height: 1.28;
      color: var(--text);
    }

.suite-hub__stack-card p {
      margin: 0;
      font-size: 0.79rem;
      line-height: 1.5;
      color: var(--text-muted);
    }

.suite-hub__steps {
      counter-reset: suite-step;
      list-style: none;
      padding: 0;
      margin: 0;
      display: flex;
      flex-direction: column;
      gap: 0.85rem;
    }

.suite-hub__steps li {
      counter-increment: suite-step;
      position: relative;
      padding: 0.85rem 0.95rem 0.95rem 2.65rem;
      border-radius: 0.55rem;
      border: 1px solid var(--hero-border);
      background: color-mix(in srgb, var(--bg-elevated) 78%, transparent);
      font-size: 0.86rem;
      line-height: 1.55;
      color: var(--text-muted);
    }

.suite-hub__steps li::before {
      content: counter(suite-step);
      position: absolute;
      left: 0.75rem;
      top: 0.8rem;
      width: 1.45rem;
      height: 1.45rem;
      border-radius: 0.35rem;
      background: color-mix(in srgb, var(--gold) 18%, transparent);
      border: 1px solid color-mix(in srgb, var(--gold) 38%, var(--hero-border));
      color: var(--gold);
      font-weight: 800;
      font-size: 0.72rem;
      display: flex;
      align-items: center;
      justify-content: center;
    }

.suite-hub__steps strong {
      color: var(--text);
      font-weight: 700;
    }

.suite-hub__cta-row {
      display: flex;
      flex-wrap: wrap;
      gap: 0.65rem;
      margin-top: 1.25rem;
    }

.suite-hub__cta {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      padding: 0.55rem 1rem;
      border-radius: 0.5rem;
      font-size: 0.82rem;
      font-weight: 700;
      text-decoration: none;
      border: 1px solid var(--hero-border);
      background: color-mix(in srgb, var(--bg-elevated) 88%, transparent);
      color: var(--text);
      transition: border-color 0.2s, background 0.2s;
    }

.suite-hub__cta:hover {
      border-color: color-mix(in srgb, var(--gold) 45%, var(--hero-border));
      background: color-mix(in srgb, var(--gold) 10%, var(--bg-elevated));
    }

.suite-hub__cta--primary {
      border-color: #00267a;
      background: #00267a;
      color: #ffffff;
    }

.suite-hub__cta--primary:hover {
      border-color: #003d9e;
      background: #003d9e;
      color: #ffffff;
    }

.suite-hub__inline-link {
      color: var(--cyan);
      font-weight: 600;
      text-decoration: none;
    }

.suite-hub__inline-link:hover {
      text-decoration: underline;
    }

.suite-hub__hero.rise-hub-hero {
      margin-bottom: clamp(2rem, 4vw, 2.75rem);
    }

.suite-hub__preview-stage {
      position: relative;
      margin: -0.5rem 0 1.35rem;
      padding: clamp(0.75rem, 2.5vw, 1rem);
      border-radius: 0.75rem;
      border: 1px solid var(--hero-border);
      background:
        linear-gradient(155deg, color-mix(in srgb, var(--bg-elevated) 70%, transparent), color-mix(in srgb, var(--bg-page) 60%, transparent));
      box-shadow:
        0 24px 64px rgba(0, 0, 0, 0.26),
        0 0 0 1px color-mix(in srgb, var(--cyan) 18%, transparent) inset;
      overflow: hidden;
    }

.suite-hub__preview-stage .rise-hub-hero__visual-wrap {
      border-radius: 0.65rem;
      box-shadow:
        0 0 0 1px color-mix(in srgb, var(--cyan) 24%, transparent),
        0 34px 86px rgba(0, 0, 0, 0.35);
    }

.page-ai-suite,
    .page-prediction-markets,
    .page-events-rail {
      max-width: 1280px;
    }

.suite-hub__card {
      transition:
        transform 0.22s ease,
        box-shadow 0.28s ease,
        border-color 0.2s ease;
    }

.suite-hub__card:hover {
      transform: translateY(-3px);
      border-color: color-mix(in srgb, var(--cyan) 42%, var(--hero-border));
      box-shadow:
        0 16px 40px rgba(0, 0, 0, 0.2),
        0 0 0 1px color-mix(in srgb, var(--cyan) 15%, transparent);
    }

.page-ai-suite.suite-fx-ready .suite-fx {
      opacity: 0;
      transform: translateY(26px) scale(0.985);
      filter: blur(8px);
      transition:
        opacity 0.7s cubic-bezier(0.22, 1, 0.36, 1),
        transform 0.7s cubic-bezier(0.22, 1, 0.36, 1),
        filter 0.6s ease;
      transition-delay: calc(var(--suite-stagger, 0) * 1s);
      will-change: opacity, transform;
    }

.page-ai-suite.suite-fx-ready .suite-fx.is-visible {
      opacity: 1;
      transform: translateY(0) scale(1);
      filter: blur(0);
    }

.page-ai-suite.suite-fx-ready .suite-hub__section.suite-fx {
      transform: translateY(32px) scale(0.99);
    }

.page-ai-suite.suite-fx-ready .suite-hub__section.suite-fx.is-visible::after {
      transform: scaleX(1);
      opacity: 0.88;
    }

.page-ai-suite.suite-fx-ready .suite-hub__card.suite-fx {
      transform: translateY(34px) scale(0.97);
    }

.page-ai-suite.suite-fx-ready .suite-hub__card.suite-fx.is-visible {
      transform: translateY(0) scale(1);
    }

.page-ai-suite.suite-fx-ready .suite-hub__steps li.suite-fx,
    .page-ai-suite.suite-fx-ready .suite-hub__list li.suite-fx {
      transform: translateX(-16px);
    }

.page-ai-suite.suite-fx-ready .suite-hub__steps li.suite-fx.is-visible,
    .page-ai-suite.suite-fx-ready .suite-hub__list li.suite-fx.is-visible {
      transform: translateX(0);
    }

@media (prefers-reduced-motion: reduce) {
      .page-ai-suite.suite-fx-ready .suite-fx {
        opacity: 1 !important;
        transform: none !important;
        filter: none !important;
        transition: none !important;
      }
      .suite-hub__section::after {
        transform: none;
        opacity: 0.6;
        transition: none;
      }
    }