:root {
  --mxb-ink: #071a34;
  --mxb-muted: #58708f;
  --mxb-line: rgba(16, 78, 126, .16);
  --mxb-surface: #fff;
  --mxb-soft: #f3f8fd;
  --mxb-blue: #0b8ff3;
  --mxb-green: #1fc999;
  --mxb-shadow: 0 22px 58px rgba(5, 27, 58, .12);
}

[data-mymex-theme="dark"] {
  --mxb-ink: #eef8ff;
  --mxb-muted: #a8bdd2;
  --mxb-line: rgba(76, 198, 255, .2);
  --mxb-surface: #0b2543;
  --mxb-soft: #071b35;
  --mxb-shadow: 0 24px 70px rgba(0, 0, 0, .32);
}

.mymex-blog-studio,
.mymex-blog-public,
.mymex-blog-article {
  min-width: 0;
  max-width: 100%;
  overflow-x: clip;
}

.mymex-blog-hero {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 28px;
  padding: clamp(26px, 4vw, 44px);
  border: 1px solid rgba(45, 192, 255, .28);
  border-radius: 30px;
  color: #f5fbff;
  background:
    radial-gradient(circle at 88% 12%, rgba(54, 215, 255, .2), transparent 32%),
    linear-gradient(130deg, #071a35, #0e4773);
  box-shadow: var(--mxb-shadow);
}

.mymex-blog-hero h1,
.mymex-blog-public-hero h1 {
  margin: 10px 0 16px;
  max-width: 800px;
  font-size: clamp(32px, 4vw, 54px);
  line-height: 1.02;
  letter-spacing: -.045em;
}

.mymex-blog-hero p,
.mymex-blog-public-hero p {
  max-width: 760px;
  margin: 0;
  color: #c7daeb;
  font-size: 16px;
  line-height: 1.7;
}

.mymex-blog-hero-actions {
  display: flex;
  gap: 12px;
  flex: 0 0 auto;
}

.mymex-blog-hero-actions .mymex-notification-icon-action {
  width: 48px;
  height: 48px;
}

.mymex-blog-stats {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 14px;
  margin: 24px 0;
}

.mymex-blog-stats a {
  min-width: 0;
  padding: 22px;
  border: 1px solid var(--mxb-line);
  border-radius: 22px;
  color: var(--mxb-ink);
  background: var(--mxb-surface);
  text-decoration: none;
  box-shadow: 0 12px 34px rgba(5, 28, 56, .07);
}

.mymex-blog-stats small,
.mymex-blog-stats span {
  display: block;
  color: var(--mxb-muted);
}

.mymex-blog-stats strong {
  display: block;
  margin: 8px 0;
  font-size: 34px;
  letter-spacing: -.04em;
}

.mymex-blog-stats .is-review strong { color: #dc8b00; }
.mymex-blog-stats .is-scheduled strong { color: #6b62ec; }
.mymex-blog-stats .is-live strong { color: #0baf7c; }

.mymex-blog-editor,
.mymex-blog-library,
.mymex-blog-revisions {
  margin-top: 24px;
  padding: clamp(20px, 3vw, 34px);
  border-radius: 26px;
}

.mymex-blog-editor > header,
.mymex-blog-library > header,
.mymex-blog-revisions > header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  margin-bottom: 24px;
}

.mymex-blog-editor h2,
.mymex-blog-library h2,
.mymex-blog-revisions h2 {
  margin: 4px 0 0;
  color: var(--mxb-ink);
  font-size: clamp(24px, 3vw, 36px);
}

.mymex-blog-form-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
}

.mymex-blog-form label,
.mymex-blog-filter label,
.mymex-blog-schedule label {
  min-width: 0;
  color: var(--mxb-ink);
  font-weight: 750;
}

.mymex-blog-form label > small {
  display: block;
  margin: 4px 0 8px;
  color: var(--mxb-muted);
  font-weight: 500;
}

.mymex-blog-form .is-wide { grid-column: 1 / -1; }

.mymex-blog-savebar {
  position: sticky;
  top: 12px;
  z-index: 24;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  margin: 0 0 18px;
  padding: 11px 12px 11px 15px;
  border: 1px solid rgba(31, 155, 244, .24);
  border-radius: 16px;
  background: color-mix(in srgb, var(--mxb-surface) 94%, transparent);
  box-shadow: 0 14px 34px rgba(5, 28, 56, .12);
  backdrop-filter: blur(18px);
}
.mymex-blog-savebar > span { display: grid; min-width: 0; gap: 2px; }
.mymex-blog-savebar > span strong { color: var(--mxb-ink); font-size: 13px; }
.mymex-blog-savebar > span small { color: var(--mxb-muted); font-size: 11px; line-height: 1.35; }
.mymex-blog-savebar .tenant-button,
.mymex-blog-form > footer .mymex-blog-save-action {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  flex: 0 0 auto;
  min-height: 42px;
  padding-inline: 16px;
}
.mymex-blog-savebar .tenant-button svg,
.mymex-blog-form > footer .mymex-blog-save-action svg { width: 18px; height: 18px; }

.mymex-blog-jarvis-panel {
  margin: 0 0 24px;
  padding: 20px;
  border: 1px solid rgba(34, 211, 159, .34);
  border-radius: 22px;
  background:
    radial-gradient(circle at 96% 4%, rgba(34, 211, 159, .13), transparent 34%),
    var(--mxb-soft);
}
.mymex-blog-jarvis-panel > header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
  margin-bottom: 18px;
}
.mymex-blog-jarvis-panel h3 {
  margin: 3px 0 0;
  color: var(--mxb-ink);
  font-size: 20px;
}
.mymex-blog-jarvis-panel > header > span {
  flex: 0 0 auto;
  padding: 7px 10px;
  border-radius: 999px;
  color: #087d5e;
  background: rgba(34, 211, 159, .14);
  font-size: 11px;
  font-weight: 850;
}
.mymex-blog-jarvis-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}
.mymex-blog-jarvis-grid .is-wide { grid-column: 1 / -1; }
.mymex-blog-jarvis-action {
  grid-column: 1 / -1;
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
}
.mymex-blog-jarvis-action > span {
  min-width: 0;
  color: var(--mxb-muted);
  font-size: 13px;
  line-height: 1.45;
}
.mymex-blog-rich-field { min-width: 0; color: var(--mxb-ink); }
.mymex-blog-field-label { display: block; font-weight: 800; }
.mymex-blog-rich-field > small {
  display: block;
  margin: 4px 0 10px;
  color: var(--mxb-muted);
}
.mymex-blog-editor-toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  padding: 9px;
  border: 1px solid var(--mxb-line);
  border-bottom: 0;
  border-radius: 16px 16px 0 0;
  background: var(--mxb-surface);
}
.mymex-blog-editor-toolbar label { margin: 0; }
.mymex-blog-editor-toolbar select,
.mymex-blog-editor-toolbar button,
.mymex-blog-editor-toolbar .mymex-blog-colour {
  display: inline-grid;
  place-items: center;
  width: 38px;
  min-width: 38px;
  height: 38px;
  margin: 0;
  padding: 0;
  border: 1px solid var(--mxb-line);
  border-radius: 11px;
  color: var(--mxb-ink);
  background: var(--mxb-soft);
  font: inherit;
  font-weight: 800;
  cursor: pointer;
}
.mymex-blog-editor-toolbar select { width: 132px; padding: 0 10px; }
.mymex-blog-editor-toolbar button svg { width: 18px; }
.mymex-blog-colour { position: relative; overflow: hidden; }
.mymex-blog-colour input {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  margin: 0;
  opacity: 0;
  cursor: pointer;
}
.mymex-blog-colour i {
  font-style: normal;
  text-decoration: underline 3px var(--mxb-blue);
  text-underline-offset: 4px;
}
.mymex-blog-rich-editor,
.mymex-blog-source {
  width: 100%;
  min-height: 430px;
  max-height: 720px;
  overflow-y: auto;
  padding: 24px;
  border: 1px solid var(--mxb-line);
  border-radius: 0 0 16px 16px;
  color: var(--mxb-ink);
  background: var(--mxb-soft);
  font-size: 16px;
  line-height: 1.72;
  outline: none;
}
.mymex-blog-rich-editor:focus,
.mymex-blog-source:focus {
  border-color: rgba(20, 156, 244, .62);
  box-shadow: inset 0 0 0 1px rgba(20, 156, 244, .22), 0 0 0 4px rgba(20, 156, 244, .08);
}
.mymex-blog-rich-editor:empty::before {
  content: attr(data-placeholder);
  color: var(--mxb-muted);
  pointer-events: none;
}
.mymex-blog-rich-editor h1 { font-size: 32px; line-height: 1.12; }
.mymex-blog-rich-editor h2 { font-size: 27px; line-height: 1.16; }
.mymex-blog-rich-editor h3 { font-size: 22px; line-height: 1.2; }
.mymex-blog-rich-editor h4 { font-size: 18px; line-height: 1.25; }
.mymex-blog-rich-editor p { margin: 0 0 15px; }
.mymex-blog-rich-field > footer {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: center;
  padding-top: 8px;
  color: var(--mxb-muted);
  font-size: 12px;
}
.mymex-blog-rich-field > footer button {
  padding: 7px 10px;
  border: 1px solid var(--mxb-line);
  border-radius: 9px;
  color: var(--mxb-ink);
  background: var(--mxb-surface);
  font: inherit;
  font-weight: 750;
  cursor: pointer;
}
.mymex-blog-image-ai {
  display: grid;
  grid-template-columns: minmax(220px, .8fr) minmax(260px, 1.2fr) 44px;
  align-items: end;
  gap: 14px;
  margin-bottom: 18px;
  padding: 16px;
  border: 1px solid rgba(33, 201, 153, .3);
  border-radius: 17px;
  background: rgba(33, 201, 153, .07);
}
.mymex-blog-image-ai > div { display: grid; gap: 3px; }
.mymex-blog-image-ai small { color: var(--mxb-muted); line-height: 1.4; }
.mymex-blog-image-ai label input { margin: 0; }
.mymex-blog-generate-image-action {
  display: inline-flex;
  min-width: 150px;
  min-height: 46px;
  align-items: center;
  justify-content: center;
  gap: 9px;
  padding: 11px 16px;
  border: 1px solid rgba(59, 213, 255, .7);
  border-radius: 14px;
  color: #fff;
  background: linear-gradient(135deg, #0877d1 0%, #13b8ee 100%);
  box-shadow: 0 12px 24px rgba(8, 119, 209, .2);
  font: inherit;
  font-weight: 850;
  cursor: pointer;
  transition: transform .18s ease, box-shadow .18s ease, filter .18s ease;
}
.mymex-blog-generate-image-action:hover {
  transform: translateY(-1px);
  box-shadow: 0 16px 28px rgba(8, 119, 209, .28);
  filter: brightness(1.04);
}
.mymex-blog-generate-image-action:focus-visible {
  outline: 3px solid rgba(59, 213, 255, .34);
  outline-offset: 3px;
}
.mymex-blog-generate-image-action:disabled {
  cursor: wait;
  opacity: .72;
  transform: none;
}
.mymex-blog-generate-image-action svg { width: 19px; height: 19px; flex: 0 0 auto; }

.mymex-blog-form input,
.mymex-blog-form select,
.mymex-blog-form textarea,
.mymex-blog-filter input,
.mymex-blog-filter select,
.mymex-blog-schedule input {
  width: 100%;
  min-width: 0;
  margin-top: 8px;
  border: 1px solid var(--mxb-line);
  border-radius: 14px;
  color: var(--mxb-ink);
  background: var(--mxb-soft);
}

.mymex-blog-form textarea {
  resize: vertical;
  line-height: 1.6;
}

.mymex-blog-form fieldset {
  min-width: 0;
  margin: 24px 0 0;
  padding: 22px;
  border: 1px solid var(--mxb-line);
  border-radius: 20px;
}

.mymex-blog-form legend {
  padding: 0 10px;
  color: var(--mxb-ink);
  font-weight: 850;
}

.mymex-blog-media-layout {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: start;
  gap: 18px;
}

.mymex-blog-upload {
  display: grid;
  min-height: 132px;
  border: 1px dashed rgba(31, 155, 244, .56);
  border-radius: 18px;
  cursor: pointer;
  background: rgba(31, 155, 244, .07);
}

.mymex-blog-upload span {
  display: grid;
  grid-template-columns: 30px 1fr;
  gap: 4px 10px;
  align-content: center;
  padding: 18px;
}

.mymex-blog-upload svg { grid-row: 1 / 3; width: 28px; color: var(--mxb-blue); }
.mymex-blog-upload small { color: var(--mxb-muted); font-weight: 500; }
.mymex-blog-upload input { align-self: end; margin: 0; border-radius: 0 0 18px 18px; }

.mymex-blog-media figure {
  grid-column: 1 / -1;
  margin: 0;
  padding: 12px;
  border-radius: 18px;
  background: var(--mxb-soft);
}

.mymex-blog-media figure img {
  display: block;
  width: 100%;
  height: auto;
  max-height: none;
  object-fit: contain;
  border-radius: 12px;
}

.mymex-blog-media figure figcaption { padding: 8px 4px 0; color: var(--mxb-muted); }

.mymex-blog-search-preview {
  margin-top: 18px;
  padding: 20px;
  border: 1px solid rgba(31, 155, 244, .24);
  border-radius: 18px;
  background: var(--mxb-soft);
}

.mymex-blog-search-preview small,
.mymex-blog-search-preview strong,
.mymex-blog-search-preview p { display: block; }
.mymex-blog-search-preview small { color: #149773; }
.mymex-blog-search-preview strong { margin: 8px 0; color: #1681d5; font-size: 20px; }
.mymex-blog-search-preview p { margin: 0; color: var(--mxb-muted); line-height: 1.5; }

.mymex-blog-form > footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  margin-top: 24px;
}

.mymex-blog-form > footer > span { color: var(--mxb-muted); }
.mymex-blog-form > footer .tenant-button { display: inline-flex; gap: 8px; align-items: center; }
.mymex-blog-form > footer .tenant-button svg { width: 20px; }

.mymex-blog-filter {
  display: grid;
  grid-template-columns: minmax(220px, 1fr) minmax(150px, auto) 44px 44px;
  gap: 10px;
  width: min(680px, 100%);
}

.mymex-blog-list {
  display: grid;
  gap: 14px;
}

.mymex-blog-list > article {
  display: grid;
  grid-template-columns: 128px minmax(0, 1fr) auto;
  gap: 18px;
  align-items: center;
  padding: 14px;
  border: 1px solid var(--mxb-line);
  border-radius: 20px;
  background: var(--mxb-soft);
}

.mymex-blog-list-visual {
  display: grid;
  place-items: center;
  width: 128px;
  height: 96px;
  overflow: hidden;
  border-radius: 15px;
  color: var(--mxb-blue);
  background: rgba(31, 155, 244, .12);
}

.mymex-blog-list-visual img { width: 100%; height: 100%; object-fit: cover; }
.mymex-blog-list-visual svg { width: 34px; }
.mymex-blog-list-copy { min-width: 0; }
.mymex-blog-list-copy small,
.mymex-blog-list-copy span { color: var(--mxb-muted); }
.mymex-blog-list-copy small b { color: var(--mxb-blue); }
.mymex-blog-list-copy h3 { margin: 6px 0; color: var(--mxb-ink); font-size: 20px; }
.mymex-blog-list-copy p { margin: 0 0 7px; color: var(--mxb-muted); line-height: 1.45; }

.mymex-blog-list-actions { display: flex; gap: 8px; }

.mymex-blog-workflow {
  grid-column: 2 / -1;
  display: flex;
  flex-wrap: wrap;
  align-items: end;
  gap: 8px;
  padding-top: 12px;
  border-top: 1px solid var(--mxb-line);
}

.mymex-blog-workflow form { margin: 0; }
.mymex-blog-workflow button {
  min-height: 40px;
  padding: 0 16px;
  border: 1px solid var(--mxb-line);
  border-radius: 12px;
  color: var(--mxb-ink);
  background: var(--mxb-surface);
  font-weight: 800;
  cursor: pointer;
}
.mymex-blog-workflow .mymex-notification-icon-action {
  display: inline-grid;
  width: 42px;
  min-width: 42px;
  height: 42px;
  min-height: 42px;
  padding: 0;
  border-radius: 12px;
}
.mymex-blog-workflow .mymex-notification-icon-action svg { width: 18px; }
.mymex-blog-workflow .is-publish { color: #fff; border-color: #0aa679; background: #0aa679; }
.mymex-blog-workflow .is-danger { color: #b63030; border-color: rgba(196, 47, 47, .28); }
.mymex-blog-schedule { display: grid; grid-template-columns: minmax(190px, 1fr) auto; gap: 8px; align-items: end; }
.mymex-blog-schedule label span { display: block; color: var(--mxb-muted); font-size: 11px; }

.mymex-blog-revisions > div { display: grid; gap: 8px; }
.mymex-blog-revisions article {
  display: flex;
  gap: 14px;
  align-items: center;
  padding: 12px;
  border-radius: 14px;
  background: var(--mxb-soft);
}
.mymex-blog-revisions article b { color: var(--mxb-blue); }
.mymex-blog-revisions article span { display: grid; }
.mymex-blog-revisions article small { color: var(--mxb-muted); }

/* Compact iOS-style density for the protected editorial workspace. */
.mymex-blog-studio {
  font-size: 13px;
  padding-bottom: 108px;
}

.mymex-blog-studio [hidden] {
  display: none !important;
}

.mymex-blog-studio .tenant-eyebrow {
  font-size: 9px;
  letter-spacing: .13em;
}

.mymex-blog-studio .mymex-blog-hero {
  gap: 20px;
  padding: clamp(20px, 3vw, 28px);
  border-radius: 22px;
}

.mymex-blog-studio .mymex-blog-hero h1 {
  margin: 6px 0 9px;
  max-width: 650px;
  font-size: clamp(28px, 3vw, 38px);
  line-height: 1.04;
}

.mymex-blog-studio .mymex-blog-hero p {
  max-width: 680px;
  font-size: 13px;
  line-height: 1.52;
}

.mymex-blog-studio .mymex-blog-hero-actions {
  gap: 8px;
}

.mymex-blog-studio .mymex-blog-hero-actions .mymex-notification-icon-action,
.mymex-blog-studio .mymex-blog-editor > header .mymex-notification-icon-action {
  width: 36px;
  min-width: 36px;
  height: 36px;
  min-height: 36px;
  border-radius: 11px;
}

.mymex-blog-studio .mymex-notification-icon-action svg {
  width: 15px;
  height: 15px;
}

.mymex-blog-studio .mymex-blog-stats {
  gap: 9px;
  margin: 14px 0;
}

.mymex-blog-studio .mymex-blog-stats a {
  padding: 13px 14px;
  border-radius: 16px;
}

.mymex-blog-studio .mymex-blog-stats small,
.mymex-blog-studio .mymex-blog-stats span {
  font-size: 10px;
  line-height: 1.35;
}

.mymex-blog-studio .mymex-blog-stats strong {
  margin: 4px 0;
  font-size: 23px;
}

.mymex-blog-studio .mymex-blog-editor,
.mymex-blog-studio .mymex-blog-library,
.mymex-blog-studio .mymex-blog-revisions {
  margin-top: 14px;
  padding: clamp(16px, 2.2vw, 22px);
  border-radius: 20px;
}

.mymex-blog-studio .mymex-blog-editor > header,
.mymex-blog-studio .mymex-blog-library > header,
.mymex-blog-studio .mymex-blog-revisions > header {
  gap: 12px;
  margin-bottom: 15px;
}

.mymex-blog-studio .mymex-blog-editor h2,
.mymex-blog-studio .mymex-blog-library h2,
.mymex-blog-studio .mymex-blog-revisions h2 {
  margin-top: 2px;
  font-size: clamp(20px, 2vw, 25px);
  line-height: 1.12;
}

.mymex-blog-studio .mymex-blog-form-grid {
  gap: 11px 12px;
}

.mymex-blog-studio .mymex-blog-form label,
.mymex-blog-studio .mymex-blog-filter label,
.mymex-blog-studio .mymex-blog-schedule label,
.mymex-blog-studio .mymex-blog-field-label {
  font-size: 12px;
  font-weight: 720;
}

.mymex-blog-studio .mymex-blog-form label > small,
.mymex-blog-studio .mymex-blog-rich-field > small {
  margin: 3px 0 6px;
  font-size: 10px;
  line-height: 1.4;
}

.mymex-blog-studio .mymex-blog-jarvis-panel {
  margin-bottom: 14px;
  padding: 14px;
  border-radius: 16px;
}

.mymex-blog-studio .mymex-blog-jarvis-panel > header {
  gap: 12px;
  margin-bottom: 11px;
}

.mymex-blog-studio .mymex-blog-jarvis-panel h3 {
  margin-top: 2px;
  font-size: 15px;
  line-height: 1.25;
}

.mymex-blog-studio .mymex-blog-jarvis-panel > header > span {
  padding: 5px 8px;
  font-size: 8px;
}

.mymex-blog-studio .mymex-blog-jarvis-grid {
  gap: 9px 10px;
}

.mymex-blog-studio .mymex-blog-jarvis-action {
  gap: 8px;
}

.mymex-blog-studio .mymex-blog-jarvis-action > span {
  font-size: 10px;
  line-height: 1.4;
}

.mymex-blog-studio .mymex-blog-form input,
.mymex-blog-studio .mymex-blog-form select,
.mymex-blog-studio .mymex-blog-form textarea,
.mymex-blog-studio .mymex-blog-filter input,
.mymex-blog-studio .mymex-blog-filter select,
.mymex-blog-studio .mymex-blog-schedule input {
  min-height: 38px;
  margin-top: 5px;
  padding: 8px 10px;
  border-radius: 11px;
  font-size: 12px;
  line-height: 1.4;
}

.mymex-blog-studio .mymex-blog-form textarea {
  min-height: 74px;
}

.mymex-blog-studio .mymex-blog-editor-toolbar {
  gap: 5px;
  padding: 6px;
  border-radius: 12px 12px 0 0;
}

.mymex-blog-studio .mymex-blog-editor-toolbar select,
.mymex-blog-studio .mymex-blog-editor-toolbar button,
.mymex-blog-studio .mymex-blog-editor-toolbar .mymex-blog-colour {
  width: 32px;
  min-width: 32px;
  height: 32px;
  border-radius: 9px;
  font-size: 11px;
}

.mymex-blog-studio .mymex-blog-editor-toolbar select {
  width: 108px;
  padding: 0 8px;
}

.mymex-blog-studio .mymex-blog-editor-toolbar button svg {
  width: 15px;
}

.mymex-blog-studio .mymex-blog-rich-editor,
.mymex-blog-studio .mymex-blog-source {
  min-height: 320px;
  max-height: 620px;
  padding: 15px;
  border-radius: 0 0 12px 12px;
  font-size: 14px;
  line-height: 1.62;
}

.mymex-blog-studio .mymex-blog-rich-editor h1 { font-size: 27px; }
.mymex-blog-studio .mymex-blog-rich-editor h2 { font-size: 23px; }
.mymex-blog-studio .mymex-blog-rich-editor h3 { font-size: 19px; }
.mymex-blog-studio .mymex-blog-rich-editor h4 { font-size: 16px; }
.mymex-blog-studio .mymex-blog-rich-editor p { margin-bottom: 11px; }

.mymex-blog-studio .mymex-blog-rich-field > footer {
  gap: 8px;
  padding-top: 6px;
  font-size: 9px;
}

.mymex-blog-studio .mymex-blog-rich-field > footer button {
  padding: 5px 8px;
  border-radius: 8px;
  font-size: 9px;
}

.mymex-blog-studio .mymex-blog-form fieldset {
  margin-top: 15px;
  padding: 15px;
  border-radius: 16px;
}

.mymex-blog-studio .mymex-blog-form legend {
  padding: 0 7px;
  font-size: 12px;
}

.mymex-blog-studio .mymex-blog-image-ai {
  grid-template-columns: minmax(180px, .8fr) minmax(220px, 1.2fr) auto;
  gap: 10px;
  margin-bottom: 12px;
  padding: 11px;
  border-radius: 13px;
}

.mymex-blog-studio .mymex-blog-image-ai > div {
  gap: 2px;
}

.mymex-blog-studio .mymex-blog-image-ai strong {
  font-size: 12px;
}

.mymex-blog-studio .mymex-blog-image-ai small {
  font-size: 9px;
  line-height: 1.35;
}

.mymex-blog-studio .mymex-blog-media-layout {
  gap: 11px;
}

.mymex-blog-studio .mymex-blog-upload {
  min-height: 102px;
  border-radius: 14px;
}

.mymex-blog-studio .mymex-blog-upload span {
  grid-template-columns: 24px 1fr;
  gap: 3px 8px;
  padding: 12px;
}

.mymex-blog-studio .mymex-blog-upload svg {
  width: 22px;
}

.mymex-blog-studio .mymex-blog-upload input {
  border-radius: 0 0 14px 14px;
}

.mymex-blog-studio .mymex-blog-media figure {
  padding: 8px;
  border-radius: 14px;
}

.mymex-blog-studio .mymex-blog-media figure img {
  height: auto;
  max-height: none;
  object-fit: contain;
  border-radius: 10px;
}

.mymex-blog-studio .mymex-blog-media figure figcaption {
  padding-top: 6px;
  font-size: 10px;
}

.mymex-blog-studio .mymex-blog-search-preview {
  margin-top: 12px;
  padding: 13px;
  border-radius: 14px;
}

.mymex-blog-studio .mymex-blog-search-preview small {
  font-size: 10px;
}

.mymex-blog-studio .mymex-blog-search-preview strong {
  margin: 5px 0;
  font-size: 16px;
  line-height: 1.25;
}

.mymex-blog-studio .mymex-blog-search-preview p {
  font-size: 12px;
  line-height: 1.45;
}

.mymex-blog-studio .mymex-blog-form > footer {
  gap: 12px;
  margin-top: 14px;
}

.mymex-blog-studio .mymex-blog-form > footer > span {
  font-size: 10px;
  line-height: 1.4;
}

.mymex-blog-studio .mymex-blog-filter {
  grid-template-columns: minmax(190px, 1fr) minmax(130px, auto) 36px 36px;
  gap: 7px;
  width: min(600px, 100%);
}

.mymex-blog-studio .mymex-blog-list {
  gap: 9px;
}

.mymex-blog-studio .mymex-blog-list > article {
  grid-template-columns: 104px minmax(0, 1fr) auto;
  gap: 12px;
  padding: 10px;
  border-radius: 15px;
}

.mymex-blog-studio .mymex-blog-list-visual {
  width: 104px;
  height: 78px;
  border-radius: 11px;
}

.mymex-blog-studio .mymex-blog-list-copy small,
.mymex-blog-studio .mymex-blog-list-copy span {
  font-size: 9px;
}

.mymex-blog-studio .mymex-blog-list-copy h3 {
  margin: 4px 0;
  font-size: 15px;
}

.mymex-blog-studio .mymex-blog-list-copy p {
  margin-bottom: 4px;
  font-size: 11px;
}
.mymex-blog-public-grid article { border: 1px solid var(--mxb-line); box-shadow: 0 18px 44px rgba(7, 29, 57, .09); }
.mymex-blog-public-image { aspect-ratio: 16 / 9; min-height: 0; background: #071d39; }
.mymex-blog-public-image img { width: 100%; height: 100%; object-fit: contain; }
.mymex-blog-public-grid article > div { display: flex; flex-direction: column; min-height: 250px; }
.mymex-blog-public-grid .mymex-blog-read { margin-top: auto; align-self: flex-start; }

.mymex-blog-studio .mymex-blog-list-actions {
  gap: 5px;
}

.mymex-blog-studio .mymex-blog-workflow {
  gap: 6px;
  padding-top: 8px;
}

.mymex-blog-studio .mymex-blog-workflow .mymex-notification-icon-action {
  width: 34px;
  min-width: 34px;
  height: 34px;
  min-height: 34px;
  border-radius: 10px;
}

.mymex-blog-studio .mymex-blog-schedule {
  grid-template-columns: minmax(170px, 1fr) auto;
  gap: 6px;
}

.mymex-blog-studio .mymex-blog-revisions article {
  gap: 10px;
  padding: 9px;
  border-radius: 11px;
  font-size: 11px;
}

.mymex-blog-empty,
.mymex-blog-public-empty {
  display: grid;
  justify-items: center;
  padding: 60px 20px;
  text-align: center;
  color: var(--mxb-ink);
}
.mymex-blog-empty > span svg,
.mymex-blog-public-empty > span svg { width: 48px; color: var(--mxb-blue); }
.mymex-blog-empty p,
.mymex-blog-public-empty p { color: var(--mxb-muted); }
.mymex-blog-public .mxp-primary,
.mymex-blog-public .mxp-secondary,
.mymex-blog-article .mxp-primary,
.mymex-blog-article .mxp-secondary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 46px;
  gap: 8px;
  padding: 0 18px;
  border: 1px solid var(--mxb-line);
  border-radius: 14px;
  color: var(--mxb-ink);
  background: var(--mxb-surface);
  font: inherit;
  font-weight: 850;
  text-decoration: none;
  cursor: pointer;
  box-shadow: 0 12px 28px rgba(5, 27, 58, .1);
}
.mymex-blog-public .mxp-primary,
.mymex-blog-article .mxp-primary {
  color: #fff;
  border-color: #0788eb;
  background: linear-gradient(135deg, #087fe5, #10a7f7);
}
.mymex-blog-public .mxp-primary:hover,
.mymex-blog-public .mxp-secondary:hover,
.mymex-blog-article .mxp-primary:hover,
.mymex-blog-article .mxp-secondary:hover { transform: translateY(-1px); }
.mymex-blog-public-empty > div {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 10px;
  margin-top: 8px;
}

.mymex-blog-public {
  width: min(1240px, calc(100% - 40px));
  margin: 0 auto;
  padding: 150px 0 90px;
}

.mymex-blog-public-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 260px;
  align-items: center;
  gap: 40px;
  padding: clamp(34px, 6vw, 72px);
  border: 1px solid rgba(58, 204, 255, .28);
  border-radius: 36px;
  color: #fff;
  background:
    radial-gradient(circle at 88% 14%, rgba(37, 216, 170, .22), transparent 27%),
    linear-gradient(135deg, #061831, #0b4976);
  box-shadow: var(--mxb-shadow);
}

.mymex-blog-public-hero em { color: #45deb6; font-style: normal; }
.mymex-blog-public-signal { position: relative; display: grid; place-items: center; width: 220px; height: 220px; }
.mymex-blog-public-signal span,
.mymex-blog-public-signal i { position: absolute; inset: 8px; border: 1px solid rgba(72, 219, 255, .32); border-radius: 50%; }
.mymex-blog-public-signal i { inset: 36px; border-color: rgba(57, 228, 175, .38); }
.mymex-blog-public-signal b { display: grid; place-items: center; width: 82px; height: 82px; border-radius: 24px; color: #fff; background: linear-gradient(135deg, #1ad1a1, #149cf4); box-shadow: 0 0 40px rgba(28, 194, 246, .42); }
.mymex-blog-public-signal svg { width: 38px; }

.mymex-blog-categories {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin: 28px 0;
}
.mymex-blog-categories a {
  padding: 10px 15px;
  border: 1px solid var(--mxb-line);
  border-radius: 999px;
  color: var(--mxb-muted);
  background: var(--mxb-surface);
  text-decoration: none;
  font-weight: 750;
}
.mymex-blog-categories a[aria-current="page"] { color: #fff; border-color: var(--mxb-blue); background: var(--mxb-blue); }

.mymex-blog-public-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 22px;
}
.mymex-blog-public-grid article {
  min-width: 0;
  overflow: hidden;
  border: 1px solid var(--mxb-line);
  border-radius: 26px;
  color: var(--mxb-ink);
  background: var(--mxb-surface);
  box-shadow: var(--mxb-shadow);
}
.mymex-blog-public-grid article.is-featured { grid-column: span 2; }
.mymex-blog-public-image { display: grid; place-items: center; min-height: 220px; overflow: hidden; color: var(--mxb-blue); background: linear-gradient(135deg, rgba(20, 156, 244, .12), rgba(33, 211, 157, .14)); }
.mymex-blog-public-image img { width: 100%; height: 260px; object-fit: cover; }
.mymex-blog-public-image svg { width: 58px; }
.mymex-blog-public-grid article > div { padding: 24px; }
.mymex-blog-public-grid small { color: var(--mxb-muted); text-transform: uppercase; letter-spacing: .08em; }
.mymex-blog-public-grid h2 { margin: 10px 0; font-size: 26px; line-height: 1.12; }
.mymex-blog-public-grid h2 a { color: var(--mxb-ink); text-decoration: none; }
.mymex-blog-public-grid p { color: var(--mxb-muted); line-height: 1.6; }
.mymex-blog-read { color: var(--mxb-blue); text-decoration: none; font-weight: 850; }
.mymex-blog-card-engagement { display: flex; gap: 12px; margin: 12px 0; color: var(--mxb-muted); font-size: 13px; }
.mymex-blog-card-engagement b { font-weight: 800; }

.mymex-blog-public-cta {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 22px;
  margin-top: 34px;
  padding: 28px;
  border: 1px solid rgba(38, 203, 156, .3);
  border-radius: 26px;
  color: var(--mxb-ink);
  background: linear-gradient(120deg, rgba(31, 201, 153, .13), rgba(11, 143, 243, .12));
}
.mymex-blog-public-cta > span { color: #0ba97a; font-weight: 850; }
.mymex-blog-public-cta > div { display: grid; gap: 4px; }
.mymex-blog-public-cta small { color: var(--mxb-muted); }

.mymex-blog-preview-banner {
  position: sticky;
  top: 0;
  z-index: 80;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
  padding: 12px 20px;
  color: #1e1730;
  background: #f8d76c;
}
.mymex-blog-preview-banner a { color: inherit; font-weight: 850; }

.mymex-blog-article {
  display: grid;
  grid-template-columns: minmax(0, 820px) minmax(260px, 340px);
  align-items: start;
  gap: 44px;
  width: min(1220px, calc(100% - 40px));
  margin: 0 auto;
  padding: 150px 0 90px;
}
.mymex-blog-article > article {
  min-width: 0;
  overflow: hidden;
  border: 1px solid var(--mxb-line);
  border-radius: 32px;
  color: var(--mxb-ink);
  background: var(--mxb-surface);
  box-shadow: var(--mxb-shadow);
}
.mymex-blog-article > article > header { padding: clamp(28px, 5vw, 58px); }
.mymex-blog-article > article > header > a { display: inline-flex; gap: 8px; align-items: center; color: var(--mxb-blue); text-decoration: none; font-weight: 800; }
.mymex-blog-article > article > header > a svg { width: 18px; transform: rotate(180deg); }
.mymex-blog-article > article > header small { display: block; margin: 26px 0 12px; color: var(--mxb-muted); text-transform: uppercase; letter-spacing: .08em; }
.mymex-blog-article h1 { margin: 0; font-size: clamp(38px, 4.7vw, 60px); font-weight: 760; line-height: 1.04; letter-spacing: -.045em; }
.mymex-blog-article > article > header > p { color: var(--mxb-muted); font-size: 18px; font-weight: 400; line-height: 1.68; }
.mymex-blog-article figure { margin: 30px 0 0; }
.mymex-blog-article figure img { display: block; width: 100%; height: auto; max-height: none; object-fit: contain; border-radius: 22px; }
.mymex-blog-article-content { padding: 0 clamp(28px, 5vw, 58px) 52px; font-size: 18px; line-height: 1.78; }
.mymex-blog-article-content h2 { margin: 48px 0 16px; font-size: 34px; line-height: 1.15; }
.mymex-blog-article-content h3 { margin: 34px 0 12px; font-size: 24px; }
.mymex-blog-article-content p,
.mymex-blog-article-content li { color: var(--mxb-muted); font-weight: 400; }
.mymex-blog-article-content a { color: var(--mxb-blue); }
.mymex-blog-article > article > footer { display: flex; flex-wrap: wrap; gap: 8px; padding: 24px 40px; border-top: 1px solid var(--mxb-line); }
.mymex-blog-article > article > footer span { margin-right: 8px; color: var(--mxb-muted); }
.mymex-blog-article > article > footer b { padding: 6px 10px; border-radius: 999px; color: var(--mxb-blue); background: rgba(11, 143, 243, .1); }
.mymex-blog-article > aside {
  position: sticky;
  top: 120px;
  isolation: isolate;
  overflow: hidden;
  padding: 18px 24px 24px;
  border: 1px solid rgba(73, 239, 188, .42);
  border-radius: 30px;
  color: #f3fbff;
  background:
    radial-gradient(circle at 82% 12%, rgba(44, 238, 182, .18), transparent 30%),
    radial-gradient(circle at 16% 30%, rgba(42, 204, 255, .16), transparent 33%),
    linear-gradient(155deg, #031327 0%, #062c43 58%, #06483f 130%);
  box-shadow: 0 30px 75px rgba(0, 7, 22, .38), inset 0 1px 0 rgba(255, 255, 255, .08), 0 0 45px rgba(32, 218, 162, .08);
}
.mymex-blog-article > aside::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 0;
  opacity: .22;
  background-image: linear-gradient(rgba(104, 234, 205, .14) 1px, transparent 1px), linear-gradient(90deg, rgba(104, 234, 205, .14) 1px, transparent 1px);
  background-size: 32px 32px;
  mask-image: linear-gradient(to bottom, #000, transparent 72%);
}
.mymex-blog-article > aside::after {
  content: "";
  position: absolute;
  z-index: -1;
  right: -70px;
  bottom: -90px;
  width: 210px;
  aspect-ratio: 1;
  border-radius: 50%;
  background: rgba(40, 231, 172, .14);
  filter: blur(30px);
}
.mymex-blog-trial-visual {
  position: relative;
  display: grid;
  place-items: center;
  height: 190px;
  margin: -18px -24px 22px;
  overflow: hidden;
  border-bottom: 1px solid rgba(94, 234, 210, .2);
  background: radial-gradient(circle, rgba(39, 224, 184, .18), transparent 57%);
}
.mymex-blog-trial-visual::before {
  content: "";
  position: absolute;
  width: 145px;
  aspect-ratio: 1;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(52, 238, 190, .28), rgba(22, 174, 217, .1) 48%, transparent 70%);
  animation: mymex-blog-core-pulse 3.2s ease-in-out infinite;
}
.mymex-blog-trial-core {
  position: relative;
  z-index: 2;
  display: grid;
  place-items: center;
  width: 90px;
  aspect-ratio: 1;
  padding: 5px;
  border: 1px solid rgba(102, 249, 207, .72);
  border-radius: 50%;
  background: #021326;
  box-shadow: 0 0 0 7px rgba(30, 217, 168, .08), 0 0 34px rgba(39, 226, 181, .42);
}
.mymex-blog-trial-core img { display: block; width: 100%; height: 100%; object-fit: cover; border-radius: 50%; }
.mymex-blog-trial-orbit { position: absolute; width: 158px; height: 58px; border: 1px solid rgba(55, 229, 191, .66); border-radius: 50%; filter: drop-shadow(0 0 7px rgba(32, 230, 179, .38)); }
.mymex-blog-trial-orbit.is-one { rotate: 18deg; animation: mymex-blog-orbit 8s linear infinite; }
.mymex-blog-trial-orbit.is-two { rotate: 78deg; animation: mymex-blog-orbit 10s linear infinite reverse; }
.mymex-blog-trial-orbit.is-three { rotate: 138deg; animation: mymex-blog-orbit 12s linear infinite; }
.mymex-blog-trial-visual small { position: absolute; right: 16px; bottom: 14px; display: flex; align-items: center; gap: 6px; color: #aef6dd; font-size: 9px; font-weight: 900; letter-spacing: .14em; text-transform: uppercase; }
.mymex-blog-trial-visual small i { width: 7px; height: 7px; border-radius: 50%; background: #37e5a9; box-shadow: 0 0 12px #37e5a9; animation: mymex-blog-status 1.8s ease-in-out infinite; }
.mymex-blog-article > aside .mxp-eyebrow { color: #75efd0; }
.mymex-blog-article > aside h2 { margin: 13px 0 14px; color: #fff; font-size: 30px; line-height: 1.08; letter-spacing: -.035em; }
.mymex-blog-article > aside p { color: #bed3e1; line-height: 1.65; }
.mymex-blog-trial-metrics { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin: 20px 0 10px; }
.mymex-blog-trial-metrics span { display: grid; padding: 12px; border: 1px solid rgba(91, 235, 197, .25); border-radius: 15px; color: #a8d9cd; background: rgba(18, 111, 95, .18); font-size: 10px; font-weight: 800; text-transform: uppercase; letter-spacing: .07em; }
.mymex-blog-trial-metrics strong { color: #fff; font-size: 25px; line-height: 1; letter-spacing: -.04em; }
.mymex-blog-trial-benefits { display: grid; gap: 8px; margin: 20px 0 22px; padding: 0; list-style: none; }
.mymex-blog-trial-benefits li { position: relative; padding-left: 24px; color: #d3f3e9; font-size: 14px; font-weight: 750; }
.mymex-blog-trial-benefits li::before { content: "\2713"; position: absolute; left: 0; top: -1px; color: #40e4ad; font-weight: 950; text-shadow: 0 0 12px rgba(64, 228, 173, .65); }
.mymex-blog-article > aside .mxp-primary,
.mymex-blog-article > aside .mxp-secondary { width: 100%; margin-top: 10px; justify-content: center; }
.mymex-blog-article > aside .mxp-primary { border-color: rgba(84, 245, 199, .45); background: linear-gradient(115deg, #16bd87, #14bad9); box-shadow: 0 17px 38px rgba(15, 196, 151, .22); }
.mymex-blog-article > aside .mxp-secondary { border-color: rgba(91, 232, 199, .28); color: #dffdf5; background: rgba(2, 18, 38, .38); }

@keyframes mymex-blog-orbit { to { transform: rotate(360deg); } }
@keyframes mymex-blog-core-pulse { 0%, 100% { opacity: .58; transform: scale(.88); } 50% { opacity: 1; transform: scale(1.08); } }
@keyframes mymex-blog-status { 50% { opacity: .45; transform: scale(.75); } }

[data-mymex-theme="dark"] .mymex-blog-article > article > header > p,
[data-mymex-theme="dark"] .mymex-blog-article-content p,
[data-mymex-theme="dark"] .mymex-blog-article-content li { color: #bed0e0; }

.mymex-blog-hero .is-loading { animation: mymex-blog-pulse 1s infinite alternate; }
@keyframes mymex-blog-pulse { to { box-shadow: 0 0 28px rgba(35, 208, 255, .6); } }

@media (max-width: 1050px) {
  .mymex-blog-stats { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .mymex-blog-public-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .mymex-blog-article { grid-template-columns: 1fr; }
  .mymex-blog-article > aside { position: static; }
}

@media (max-width: 760px) {
  .mymex-blog-hero { align-items: flex-start; flex-direction: column; border-radius: 24px; }
  .mymex-blog-hero h1 { font-size: 38px; }
  .mymex-blog-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .mymex-blog-form-grid,
  .mymex-blog-media-layout { grid-template-columns: 1fr; }
  .mymex-blog-jarvis-panel > header { flex-direction: column; }
  .mymex-blog-jarvis-grid { grid-template-columns: 1fr; }
  .mymex-blog-jarvis-grid .is-wide,
  .mymex-blog-jarvis-action { grid-column: auto; }
  .mymex-blog-image-ai { grid-template-columns: minmax(0, 1fr); }
  .mymex-blog-image-ai > div { grid-column: 1 / -1; }
  .mymex-blog-generate-image-action { width: 100%; }
  .mymex-blog-rich-editor,
  .mymex-blog-source { min-height: 360px; padding: 18px; }
  .mymex-blog-form .is-wide,
  .mymex-blog-media figure { grid-column: auto; }
  .mymex-blog-form > footer { align-items: stretch; flex-direction: column; }
  .mymex-blog-form > footer .tenant-button { justify-content: center; }
  .mymex-blog-library > header { align-items: stretch; flex-direction: column; }
  .mymex-blog-filter { grid-template-columns: minmax(0, 1fr) 44px 44px; }
  .mymex-blog-filter label:nth-child(2) { grid-column: 1 / -1; grid-row: 2; }
  .mymex-blog-list > article { grid-template-columns: 84px minmax(0, 1fr); align-items: start; }
  .mymex-blog-list-visual { width: 84px; height: 76px; }
  .mymex-blog-list-actions { grid-column: 1 / -1; justify-content: flex-end; }
  .mymex-blog-workflow { grid-column: 1 / -1; }
  .mymex-blog-schedule { grid-template-columns: 1fr; width: 100%; }
  .mymex-blog-schedule button { width: 100%; }
  .mymex-blog-schedule .mymex-notification-icon-action { width: 42px; justify-self: end; }
  .mymex-blog-public { width: min(100% - 24px, 1240px); padding-top: 106px; }
  .mymex-blog-public-hero { grid-template-columns: 1fr; border-radius: 26px; }
  .mymex-blog-public-signal { display: none; }
  .mymex-blog-public-grid { grid-template-columns: 1fr; }
  .mymex-blog-public-grid article.is-featured { grid-column: auto; }
  .mymex-blog-public-cta { grid-template-columns: 1fr; align-items: start; }
  .mymex-blog-article { width: min(100% - 24px, 1220px); padding-top: 106px; }
  .mymex-blog-article > article { border-radius: 24px; }
  .mymex-blog-article h1 { font-size: 42px; overflow-wrap: anywhere; }
  .mymex-blog-article-content { font-size: 16px; }
  .mymex-blog-trial-visual { height: 165px; }
  .mymex-blog-trial-core { width: 78px; }
  .mymex-blog-trial-orbit { width: 138px; height: 50px; }
  .mymex-blog-preview-banner { align-items: flex-start; flex-direction: column; gap: 4px; }

  .mymex-blog-studio .mymex-blog-hero {
    gap: 14px;
    padding: 18px;
    border-radius: 18px;
  }
  .mymex-blog-studio .mymex-blog-hero h1 { font-size: 28px; }
  .mymex-blog-studio .mymex-blog-editor,
  .mymex-blog-studio .mymex-blog-library,
  .mymex-blog-studio .mymex-blog-revisions { padding: 15px; border-radius: 17px; }
  .mymex-blog-studio .mymex-blog-image-ai { grid-template-columns: minmax(0, 1fr); }
  .mymex-blog-studio .mymex-blog-rich-editor,
  .mymex-blog-studio .mymex-blog-source { min-height: 280px; padding: 13px; }
  .mymex-blog-studio .mymex-blog-form > footer {
    align-items: center;
    flex-direction: row;
  }
  .mymex-blog-savebar { top: 8px; gap: 10px; }
  .mymex-blog-savebar > span small { display: none; }
  .mymex-blog-studio .mymex-blog-filter { grid-template-columns: minmax(0, 1fr) 36px 36px; }
  .mymex-blog-studio .mymex-blog-list > article { grid-template-columns: 72px minmax(0, 1fr); }
  .mymex-blog-studio .mymex-blog-list-visual { width: 72px; height: 64px; }
  .mymex-blog-studio .mymex-blog-schedule button { width: 34px; }
  .mymex-blog-studio .mymex-blog-schedule .mymex-notification-icon-action { width: 34px; }
}

@media (prefers-reduced-motion: reduce) {
  .mymex-blog-trial-visual::before,
  .mymex-blog-trial-orbit,
  .mymex-blog-trial-visual small i { animation: none !important; }
}

@media (max-width: 430px) {
  .mymex-blog-stats { grid-template-columns: 1fr; }
  .mymex-blog-form fieldset { padding: 15px; }
  .mymex-blog-filter { grid-template-columns: minmax(0, 1fr) 42px 42px; }
  .mymex-blog-list > article { grid-template-columns: 1fr; }
  .mymex-blog-list-visual { width: 100%; height: 150px; }
  .mymex-blog-workflow button { width: 100%; }
  .mymex-blog-workflow form { width: 100%; }
  .mymex-blog-workflow .mymex-notification-icon-action { width: 42px; }
  .mymex-blog-editor-toolbar { gap: 5px; padding: 7px; }
  .mymex-blog-editor-toolbar select { width: 112px; }
  .mymex-blog-editor-toolbar button,
  .mymex-blog-editor-toolbar .mymex-blog-colour { width: 36px; min-width: 36px; height: 36px; }
  .mymex-blog-image-ai { grid-template-columns: minmax(0, 1fr); }
  .mymex-blog-public-hero { padding: 30px 22px; }
  .mymex-blog-public-hero h1 { font-size: 39px; overflow-wrap: anywhere; }

  .mymex-blog-studio .mymex-blog-stats {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .mymex-blog-studio .mymex-blog-form fieldset { padding: 12px; }
  .mymex-blog-studio .mymex-blog-filter { grid-template-columns: minmax(0, 1fr) 34px 34px; }
  .mymex-blog-studio .mymex-blog-list > article { grid-template-columns: 1fr; }
  .mymex-blog-studio .mymex-blog-list-visual { width: 100%; height: 120px; }
  .mymex-blog-studio .mymex-blog-workflow form { width: 100%; }
  .mymex-blog-studio .mymex-blog-workflow .mymex-blog-action-button {
    width: 100%;
    min-width: 0;
  }
  .mymex-blog-studio .mymex-blog-workflow .mymex-notification-icon-action {
    width: 34px;
    min-width: 34px;
  }
  .mymex-blog-studio .mymex-blog-editor-toolbar { gap: 4px; padding: 5px; }
  .mymex-blog-studio .mymex-blog-editor-toolbar select { width: 102px; }
  .mymex-blog-studio .mymex-blog-editor-toolbar button,
  .mymex-blog-studio .mymex-blog-editor-toolbar .mymex-blog-colour {
    width: 31px;
    min-width: 31px;
    height: 31px;
  }
  .mymex-blog-studio .mymex-blog-image-ai { grid-template-columns: minmax(0, 1fr); }
  .mymex-blog-savebar { align-items: stretch; flex-direction: column; }
  .mymex-blog-savebar .tenant-button { width: 100%; }
}

/* MYMEX BLOG PUBLIC REFINEMENT 20260903 */
.mymex-blog-public-grid {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 360px));
  justify-content: start;
  gap: 18px;
}
.mymex-blog-public-grid article,
.mymex-blog-public-grid article.is-featured { grid-column: auto; border-radius: 20px; }
.mymex-blog-public-image {
  aspect-ratio: 16 / 9;
  min-height: 0;
  padding: 0;
  background: linear-gradient(145deg, #03172e, #0a3550);
}
.mymex-blog-public-image img { width: 100%; height: 100%; object-fit: contain; }
.mymex-blog-public-grid article > div {
  display: flex;
  flex-direction: column;
  min-height: 238px;
  padding: 18px;
}
.mymex-blog-public-grid small { font-size: 10px; font-weight: 800; letter-spacing: .09em; }
.mymex-blog-public-grid h2 { margin: 8px 0 12px; font-size: 20px; font-weight: 720; line-height: 1.18; letter-spacing: -.018em; }
.mymex-blog-card-preview-label { color: #25caa0; font-size: 10px; font-weight: 900; letter-spacing: .11em; text-transform: uppercase; }
.mymex-blog-public-grid p {
  display: -webkit-box;
  overflow: hidden;
  margin: 7px 0 15px;
  color: var(--mxb-muted);
  font-size: 14px;
  line-height: 1.55;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
}
.mymex-blog-public-grid article > div > footer { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: auto; }
.mymex-blog-card-engagement { margin: 0; }
.mymex-blog-read { white-space: nowrap; font-size: 14px; }

.mymex-blog-article {
  grid-template-columns: minmax(0, 900px);
  justify-content: center;
  gap: 18px;
  width: min(980px, calc(100% - 40px));
}
.mymex-blog-article h1 { font-size: clamp(36px, 4.3vw, 52px); font-weight: 720; line-height: 1.06; }
.mymex-blog-article > article > header > p { max-width: 760px; font-size: 17px; line-height: 1.65; }
.mymex-blog-jarvis-summary {
  margin: 0 clamp(28px, 5vw, 58px) 38px;
  overflow: hidden;
  border: 1px solid rgba(55, 226, 179, .34);
  border-radius: 20px;
  color: var(--mxb-ink);
  background: linear-gradient(120deg, rgba(31, 201, 153, .11), rgba(11, 143, 243, .08));
}
.mymex-blog-jarvis-summary summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 13px 16px;
  cursor: pointer;
  list-style: none;
}
.mymex-blog-jarvis-summary summary::-webkit-details-marker { display: none; }
.mymex-blog-jarvis-summary summary > span { display: flex; align-items: center; gap: 10px; }
.mymex-blog-jarvis-summary summary img { width: 36px; height: 36px; border: 1px solid rgba(65, 232, 188, .52); border-radius: 50%; object-fit: cover; box-shadow: 0 0 18px rgba(37, 220, 173, .22); }
.mymex-blog-jarvis-summary summary b { font-size: 15px; }
.mymex-blog-jarvis-summary summary small { color: #119a78; font-size: 10px; font-weight: 900; letter-spacing: .1em; text-transform: uppercase; }
.mymex-blog-jarvis-summary > div { padding: 2px 18px 17px 62px; }
.mymex-blog-jarvis-summary p { margin: 0; color: var(--mxb-muted); font-size: 14px; line-height: 1.58; }
.mymex-blog-jarvis-summary ul { display: flex; flex-wrap: wrap; gap: 7px; margin: 13px 0 0; padding: 0; list-style: none; }
.mymex-blog-jarvis-summary li { padding: 7px 10px; border: 1px solid rgba(19, 179, 139, .24); border-radius: 999px; color: var(--mxb-ink); background: rgba(27, 190, 147, .08); font-size: 11px; font-weight: 750; }

.mymex-blog-trial-strip {
  position: relative;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto auto;
  align-items: center;
  gap: 15px;
  min-height: 68px;
  margin-top: 24px;
  overflow: hidden;
  padding: 10px 12px 10px 14px;
  border: 1px solid rgba(55, 229, 177, .38);
  border-radius: 19px;
  color: #ecfff9;
  background: radial-gradient(circle at 12% 10%, rgba(46, 231, 183, .16), transparent 28%), linear-gradient(118deg, #03152b, #073648 72%, #075345);
  box-shadow: 0 20px 48px rgba(0, 14, 30, .22), inset 0 1px 0 rgba(255,255,255,.06);
  text-decoration: none;
}
.mymex-blog-trial-strip::after { content: ""; position: absolute; right: 14%; bottom: -36px; width: 150px; height: 58px; border: 1px solid rgba(64, 230, 185, .22); border-radius: 50%; transform: rotate(-10deg); }
.mymex-blog-trial-strip-icon { position: relative; z-index: 1; display: grid; place-items: center; width: 44px; height: 44px; padding: 3px; border: 1px solid rgba(68, 240, 193, .55); border-radius: 50%; background: #03172c; box-shadow: 0 0 22px rgba(42, 225, 179, .26); }
.mymex-blog-trial-strip-icon img { display: block; width: 100%; height: 100%; border-radius: 50%; object-fit: cover; }
.mymex-blog-trial-strip-copy { position: relative; z-index: 1; display: grid; gap: 2px; }
.mymex-blog-trial-strip-copy small { color: #55e5bd; font-size: 9px; font-weight: 900; letter-spacing: .12em; text-transform: uppercase; }
.mymex-blog-trial-strip-copy strong { color: #fff; font-size: 14px; line-height: 1.3; }
.mymex-blog-trial-strip-offer { position: relative; z-index: 1; display: flex; gap: 6px; }
.mymex-blog-trial-strip-offer b,
.mymex-blog-trial-strip-offer i { padding: 6px 9px; border: 1px solid rgba(75, 232, 190, .22); border-radius: 999px; color: #bff7e7; background: rgba(37, 189, 148, .11); font-size: 10px; font-style: normal; font-weight: 800; white-space: nowrap; }
.mymex-blog-trial-strip-action { position: relative; z-index: 1; display: inline-flex; align-items: center; gap: 8px; padding: 10px 13px; border-radius: 12px; color: #03251c; background: linear-gradient(110deg, #49e5b7, #24c899); font-size: 12px; font-weight: 900; white-space: nowrap; box-shadow: 0 10px 24px rgba(35, 210, 162, .18); }
.mymex-blog-trial-strip:hover .mymex-blog-trial-strip-action { filter: brightness(1.08); transform: translateY(-1px); }
[data-mymex-theme="dark"] .mymex-blog-jarvis-summary p { color: #c3d7e7; }
[data-mymex-theme="dark"] .mymex-blog-jarvis-summary li { color: #e8f8ff; }

@media (max-width: 760px) {
  .mymex-blog-public-grid { grid-template-columns: 1fr; }
  .mymex-blog-public-grid article > div { min-height: 218px; }
  .mymex-blog-article { width: min(100% - 24px, 900px); }
  .mymex-blog-engagement { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .mymex-blog-engagement button,
  .mymex-blog-engagement a { gap: 5px; padding: 9px 10px; font-size: 14px; }
  .mymex-blog-engagement > button { grid-column: 1 / -1; }
  .mymex-blog-jarvis-summary { margin: 0 18px 30px; }
  .mymex-blog-jarvis-summary > div { padding: 0 15px 15px; }
  .mymex-blog-jarvis-summary ul { display: grid; }
  .mymex-blog-trial-strip { grid-template-columns: auto minmax(0, 1fr) auto; gap: 10px; }
  .mymex-blog-trial-strip-offer { display: none; }
  .mymex-blog-trial-strip-action { padding: 9px 10px; }
  .mymex-blog-trial-strip-action b { display: none; }
}

@media (max-width: 460px) {
  .mymex-blog-trial-strip { grid-template-columns: auto minmax(0, 1fr); }
  .mymex-blog-trial-strip-action { grid-column: 1 / -1; justify-content: center; width: 100%; }
  .mymex-blog-trial-strip-copy strong { font-size: 13px; }
}

/* Public editorial experience 20260911. */
.mymex-blog-public-hero {
  position: relative;
  isolation: isolate;
  grid-template-columns: minmax(0, 1.08fr) minmax(390px, .92fr);
  min-height: 470px;
  overflow: hidden;
  padding: clamp(38px, 5.5vw, 70px);
  background:
    radial-gradient(circle at 84% 20%, rgba(28, 217, 171, .22), transparent 28%),
    radial-gradient(circle at 8% 100%, rgba(25, 145, 247, .2), transparent 34%),
    linear-gradient(132deg, #031328 0%, #07335b 58%, #075565 120%);
  box-shadow: 0 34px 88px rgba(0, 11, 30, .34), inset 0 1px 0 rgba(255, 255, 255, .08);
}
.mymex-blog-public-hero::before {
  content: "";
  position: absolute;
  z-index: -2;
  inset: 0;
  opacity: .3;
  background-image:
    linear-gradient(rgba(97, 220, 255, .13) 1px, transparent 1px),
    linear-gradient(90deg, rgba(97, 220, 255, .13) 1px, transparent 1px);
  background-size: 46px 46px;
  mask-image: linear-gradient(105deg, #000, rgba(0, 0, 0, .42) 58%, transparent 90%);
}
.mymex-blog-public-hero::after {
  content: "";
  position: absolute;
  z-index: -1;
  right: -8%;
  bottom: -45%;
  width: 58%;
  aspect-ratio: 1;
  border: 1px solid rgba(72, 231, 196, .18);
  border-radius: 50%;
  box-shadow: 0 0 80px rgba(31, 209, 181, .12), inset 0 0 90px rgba(17, 160, 241, .1);
}
.mymex-blog-public-hero-copy {
  position: relative;
  z-index: 4;
  animation: mymex-blog-copy-enter .72s cubic-bezier(.2, .72, .2, 1) both;
}
.mymex-blog-public-hero .mxp-eyebrow { color: #77f1d2; }
.mymex-blog-public-hero h1 {
  max-width: 690px;
  margin: 15px 0 20px;
  font-size: clamp(46px, 5.25vw, 72px);
  line-height: .98;
  text-wrap: balance;
}
.mymex-blog-public-hero p { max-width: 640px; color: #cde2ef; font-size: clamp(16px, 1.45vw, 19px); }
.mymex-blog-public-hero em {
  color: transparent;
  background: linear-gradient(105deg, #44e3b1 5%, #2dc5ee 78%);
  background-clip: text;
  -webkit-background-clip: text;
}
.mymex-blog-public-journey {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  margin-top: 32px;
}
.mymex-blog-public-journey > span {
  position: relative;
  display: grid;
  gap: 3px;
  min-width: 0;
  padding: 13px 13px 13px 39px;
  border: 1px solid rgba(105, 226, 247, .18);
  border-radius: 15px;
  background: rgba(1, 18, 40, .36);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .04);
  backdrop-filter: blur(8px);
}
.mymex-blog-public-journey b { position: absolute; top: 13px; left: 12px; color: #4ae2bd; font-size: 10px; letter-spacing: .08em; }
.mymex-blog-public-journey em { color: #fff; background: none; font-size: 12px; font-style: normal; font-weight: 900; letter-spacing: .04em; -webkit-text-fill-color: currentColor; }
.mymex-blog-public-journey small { overflow: hidden; color: #8fb2c9; font-size: 10px; line-height: 1.35; text-overflow: ellipsis; white-space: nowrap; }

.mymex-blog-story-deck {
  position: relative;
  z-index: 3;
  min-width: 0;
  min-height: 350px;
  perspective: 1000px;
}
.mymex-blog-story-orbit {
  position: absolute;
  inset: 3% -10% auto auto;
  width: 335px;
  aspect-ratio: 1;
  border: 1px solid rgba(67, 232, 193, .23);
  border-radius: 50%;
  box-shadow: 0 0 45px rgba(41, 219, 181, .09), inset 0 0 55px rgba(34, 171, 245, .07);
  animation: mymex-blog-orbit-breathe 5.8s ease-in-out infinite;
}
.mymex-blog-story-orbit::before,
.mymex-blog-story-orbit::after { content: ""; position: absolute; border: 1px solid rgba(62, 192, 240, .18); border-radius: 50%; }
.mymex-blog-story-orbit::before { inset: 18%; }
.mymex-blog-story-orbit::after { inset: 35%; background: radial-gradient(circle, rgba(47, 225, 184, .25), transparent 62%); }
.mymex-blog-story-card {
  position: absolute;
  display: grid;
  grid-template-columns: 43% minmax(0, 1fr);
  width: min(100%, 410px);
  min-height: 154px;
  overflow: hidden;
  border: 1px solid rgba(111, 224, 247, .32);
  border-radius: 20px;
  color: #fff;
  background: linear-gradient(145deg, rgba(10, 42, 72, .97), rgba(4, 24, 49, .98));
  box-shadow: 0 24px 50px rgba(0, 7, 24, .38), inset 0 1px 0 rgba(255, 255, 255, .07);
  text-decoration: none;
  transform-origin: 70% 50%;
  transition: border-color .25s ease, box-shadow .25s ease, filter .25s ease;
  backdrop-filter: blur(14px);
}
.mymex-blog-story-card.is-1 { z-index: 4; right: 0; bottom: 45px; animation: mymex-blog-story-float 5.8s .9s ease-in-out infinite, mymex-blog-card-enter-opacity .72s .16s cubic-bezier(.2, .72, .2, 1) backwards; }
.mymex-blog-story-card.is-2 { z-index: 3; top: 26px; right: 44px; filter: brightness(.82) saturate(.88); transform: translate3d(0, 0, -50px) rotate(-2deg) scale(.94); animation: mymex-blog-card-enter-two .76s .25s cubic-bezier(.2, .72, .2, 1) both; }
.mymex-blog-story-card.is-3 { z-index: 2; top: 0; right: 4px; filter: brightness(.62) saturate(.72); transform: translate3d(0, 0, -90px) rotate(3deg) scale(.88); animation: mymex-blog-card-enter-three .8s .34s cubic-bezier(.2, .72, .2, 1) both; }
.mymex-blog-story-card:hover,
.mymex-blog-story-card:focus-visible { z-index: 8; border-color: rgba(87, 241, 205, .85); filter: none; box-shadow: 0 28px 62px rgba(0, 7, 24, .46), 0 0 36px rgba(40, 225, 184, .18); }
.mymex-blog-story-image { position: relative; display: grid; min-width: 0; overflow: hidden; place-items: center; background: linear-gradient(145deg, #06213c, #0b5466); }
.mymex-blog-story-image::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, transparent 64%, rgba(4, 24, 49, .88)); pointer-events: none; }
.mymex-blog-story-image img { width: 100%; height: 100%; min-height: 154px; object-fit: cover; transition: transform .45s ease; }
.mymex-blog-story-image svg { width: 42px; color: #58e8c3; }
.mymex-blog-story-card:hover img,
.mymex-blog-story-card:focus-visible img { transform: scale(1.055); }
.mymex-blog-story-copy { position: relative; display: flex; min-width: 0; padding: 17px 17px 15px 13px; flex-direction: column; justify-content: center; }
.mymex-blog-story-copy small { color: #59e6c1; font-size: 9px; font-weight: 900; letter-spacing: .13em; text-transform: uppercase; }
.mymex-blog-story-copy b { display: -webkit-box; overflow: hidden; margin: 8px 0 12px; color: #fff; font-size: 15px; line-height: 1.25; -webkit-box-orient: vertical; -webkit-line-clamp: 3; }
.mymex-blog-story-copy i { color: #add1e2; font-size: 10px; font-style: normal; font-weight: 800; }
.mymex-blog-story-copy i span { display: inline-block; margin-left: 3px; transition: transform .2s ease; }
.mymex-blog-story-card:hover .mymex-blog-story-copy i span { transform: translateX(4px); }
.mymex-blog-story-status { position: absolute; z-index: 9; right: 7px; bottom: 4px; display: flex; align-items: center; gap: 7px; color: #a8c9d9; font-size: 9px; font-weight: 850; letter-spacing: .12em; text-transform: uppercase; }
.mymex-blog-story-status i { width: 7px; height: 7px; border-radius: 50%; background: #43e6ad; box-shadow: 0 0 14px #43e6ad; animation: mymex-blog-status 1.8s ease-in-out infinite; }

.mymex-blog-library-heading { display: flex; align-items: end; justify-content: space-between; gap: 28px; margin: 48px 0 16px; }
.mymex-blog-library-heading h2 { margin: 8px 0 0; color: var(--mxb-ink); font-size: clamp(30px, 4vw, 48px); line-height: 1; letter-spacing: -.035em; }
.mymex-blog-library-heading > p { margin: 0 0 3px; color: var(--mxb-muted); font-size: 13px; }
.mymex-blog-library-heading > p strong { color: var(--mxb-blue); font-size: 21px; }
.mymex-blog-categories { margin: 0 0 24px; padding: 6px; border: 1px solid var(--mxb-line); border-radius: 18px; background: color-mix(in srgb, var(--mxb-surface) 90%, transparent); box-shadow: 0 14px 34px rgba(3, 26, 54, .08); }
.mymex-blog-categories a { padding: 10px 14px; border-color: transparent; background: transparent; transition: color .2s ease, border-color .2s ease, background .2s ease, transform .2s ease; }
.mymex-blog-categories a:hover { color: var(--mxb-ink); border-color: var(--mxb-line); background: var(--mxb-soft); transform: translateY(-1px); }
.mymex-blog-categories a[aria-current="page"] { box-shadow: 0 9px 22px rgba(11, 143, 243, .23); }

.mymex-blog-public-grid { grid-template-columns: repeat(auto-fit, minmax(min(100%, 340px), 1fr)); gap: 20px; }
.mymex-blog-public-grid article,
.mymex-blog-public-grid article.is-featured {
  position: relative;
  isolation: isolate;
  grid-column: auto;
  border-radius: 23px;
  box-shadow: 0 20px 50px rgba(3, 24, 52, .11);
  transition: transform .28s ease, border-color .28s ease, box-shadow .28s ease;
  animation: mymex-blog-library-card .62s calc(var(--mymex-blog-card-index, 0) * 65ms) cubic-bezier(.2, .72, .2, 1) backwards;
}
.mymex-blog-public-grid article::after { content: ""; position: absolute; z-index: 3; right: 18px; top: 18px; width: 9px; height: 9px; border: 2px solid rgba(255, 255, 255, .9); border-radius: 50%; background: #38dda9; box-shadow: 0 0 0 5px rgba(27, 212, 162, .2), 0 0 20px rgba(27, 212, 162, .7); pointer-events: none; }
.mymex-blog-public-grid article:hover { border-color: rgba(48, 205, 178, .52); box-shadow: 0 30px 68px rgba(3, 24, 52, .18), 0 0 0 1px rgba(48, 205, 178, .08); transform: translateY(-7px); }
.mymex-blog-public-image { position: relative; }
.mymex-blog-public-image::after { content: ""; position: absolute; inset: auto 0 0; height: 42%; background: linear-gradient(transparent, rgba(2, 18, 38, .34)); pointer-events: none; }
.mymex-blog-public-image img { object-fit: cover; transition: transform .5s cubic-bezier(.2, .72, .2, 1), filter .4s ease; }
.mymex-blog-public-grid article:hover .mymex-blog-public-image img { filter: saturate(1.08) contrast(1.03); transform: scale(1.045); }
.mymex-blog-public-grid article > div { min-height: 246px; padding: 22px; }
.mymex-blog-public-grid h2 a { background-image: linear-gradient(currentColor, currentColor); background-position: 0 100%; background-repeat: no-repeat; background-size: 0 1px; transition: background-size .25s ease; }
.mymex-blog-public-grid article:hover h2 a { background-size: 100% 1px; }
.mymex-blog-read { display: inline-flex; align-items: center; gap: 5px; padding: 8px 11px; border-radius: 999px; background: rgba(11, 143, 243, .09); transition: gap .2s ease, background .2s ease; }
.mymex-blog-read:hover { gap: 9px; background: rgba(11, 143, 243, .15); }

@keyframes mymex-blog-copy-enter { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: none; } }
@keyframes mymex-blog-card-enter { from { opacity: 0; transform: translate3d(36px, 18px, 0) rotate(3deg) scale(.94); } to { opacity: 1; transform: none; } }
@keyframes mymex-blog-card-enter-opacity { from { opacity: 0; } to { opacity: 1; } }
@keyframes mymex-blog-card-enter-two { from { opacity: 0; transform: translate3d(56px, -5px, -50px) rotate(4deg) scale(.88); } to { opacity: 1; transform: translate3d(0, 0, -50px) rotate(-2deg) scale(.94); } }
@keyframes mymex-blog-card-enter-three { from { opacity: 0; transform: translate3d(70px, -12px, -90px) rotate(7deg) scale(.82); } to { opacity: 1; transform: translate3d(0, 0, -90px) rotate(3deg) scale(.88); } }
@keyframes mymex-blog-story-float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-7px); } }
@keyframes mymex-blog-orbit-breathe { 0%, 100% { opacity: .58; transform: scale(.95) rotate(-4deg); } 50% { opacity: 1; transform: scale(1.03) rotate(2deg); } }
@keyframes mymex-blog-library-card { from { opacity: 0; transform: translateY(22px); } to { opacity: 1; transform: none; } }

@media (max-width: 980px) {
  .mymex-blog-public-hero { grid-template-columns: minmax(0, 1fr) minmax(330px, .8fr); gap: 24px; padding-inline: 38px; }
  .mymex-blog-public-journey { grid-template-columns: 1fr; max-width: 380px; }
  .mymex-blog-public-journey > span { padding-block: 10px; }
  .mymex-blog-story-card { width: min(100%, 360px); }
}

@media (max-width: 760px) {
  .mymex-blog-public { padding-top: 108px; }
  .mymex-blog-public-hero { grid-template-columns: 1fr; min-height: 0; gap: 32px; padding: 34px 24px 28px; border-radius: 27px; }
  .mymex-blog-public-hero h1 { max-width: 610px; font-size: clamp(40px, 12vw, 58px); }
  .mymex-blog-public-journey { grid-template-columns: repeat(3, minmax(0, 1fr)); max-width: none; margin-top: 24px; }
  .mymex-blog-public-journey > span { padding: 34px 10px 10px; }
  .mymex-blog-public-journey b { top: 10px; left: 10px; }
  .mymex-blog-public-journey small { display: none; }
  .mymex-blog-story-deck { display: flex; gap: 12px; min-height: 0; margin: 0 -24px; padding: 4px 24px 16px; overflow-x: auto; perspective: none; scroll-padding-inline: 24px; scroll-snap-type: x mandatory; scrollbar-width: thin; }
  .mymex-blog-story-orbit,
  .mymex-blog-story-status { display: none; }
  .mymex-blog-story-card,
  .mymex-blog-story-card.is-1,
  .mymex-blog-story-card.is-2,
  .mymex-blog-story-card.is-3 { position: relative; inset: auto; flex: 0 0 min(88%, 390px); width: auto; min-height: 142px; filter: none; transform: none; animation: mymex-blog-library-card .58s both; scroll-snap-align: center; }
  .mymex-blog-story-card.is-2 { animation-delay: .08s; }
  .mymex-blog-story-card.is-3 { animation-delay: .16s; }
  .mymex-blog-story-image img { min-height: 142px; }
  .mymex-blog-library-heading { align-items: flex-start; margin-top: 34px; }
  .mymex-blog-categories { flex-wrap: nowrap; overflow-x: auto; scroll-snap-type: x proximity; }
  .mymex-blog-categories a { flex: 0 0 auto; scroll-snap-align: start; }
}

@media (max-width: 520px) {
  .mymex-blog-public { width: min(100% - 20px, 1240px); }
  .mymex-blog-public-hero { padding: 30px 20px 22px; }
  .mymex-blog-public-hero h1 { font-size: clamp(38px, 12vw, 50px); }
  .mymex-blog-public-hero p { font-size: 15px; }
  .mymex-blog-story-deck { margin-inline: -20px; padding-inline: 20px; scroll-padding-inline: 20px; }
  .mymex-blog-story-card { grid-template-columns: 41% minmax(0, 1fr); }
  .mymex-blog-story-copy { padding: 13px 12px 12px 10px; }
  .mymex-blog-story-copy b { font-size: 13px; -webkit-line-clamp: 3; }
  .mymex-blog-library-heading { display: grid; gap: 8px; }
  .mymex-blog-library-heading > p { margin: 0; }
  .mymex-blog-public-grid article > div { min-height: 224px; padding: 19px; }
}

@media (prefers-reduced-motion: reduce) {
  .mymex-blog-public-hero-copy,
  .mymex-blog-story-card,
  .mymex-blog-story-card.is-1,
  .mymex-blog-story-card.is-2,
  .mymex-blog-story-card.is-3,
  .mymex-blog-story-orbit,
  .mymex-blog-story-status i,
  .mymex-blog-public-grid article { animation: none !important; }
  .mymex-blog-story-card,
  .mymex-blog-public-grid article,
  .mymex-blog-public-image img { transition-duration: .01ms !important; }
}
/* END MYMEX BLOG PUBLIC REFINEMENT 20260903 */

/* Global audience, editorial library and complete article-preview release. */
.mymex-blog-audience-summary {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 18px;
  align-items: center;
  margin-bottom: 18px;
  padding: 14px 16px;
  border: 1px solid rgba(20, 156, 244, .2);
  border-radius: 16px;
  background: linear-gradient(135deg, rgba(20, 156, 244, .08), rgba(33, 211, 157, .08));
}
.mymex-blog-audience-summary span { color: var(--mxb-ink); }
.mymex-blog-audience-summary span strong { color: var(--mxb-blue); font-size: 18px; }
.mymex-blog-audience-summary small { flex: 1 1 320px; color: var(--mxb-muted); }

.mymex-blog-studio .mymex-blog-list {
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 16px;
}
.mymex-blog-studio .mymex-blog-list > article {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 12px;
  min-width: 0;
  padding: 14px;
  border-radius: 20px;
  background: var(--mxb-surface);
  box-shadow: 0 14px 32px rgba(8, 30, 55, .08);
}
.mymex-blog-studio .mymex-blog-list-visual {
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 9;
  border-radius: 15px;
  background: #071d39;
}
.mymex-blog-studio .mymex-blog-list-visual img { width: 100%; height: 100%; object-fit: contain; }
.mymex-blog-studio .mymex-blog-list-copy { display: flex; flex: 1; flex-direction: column; }
.mymex-blog-studio .mymex-blog-list-copy h3 { font-size: 18px; line-height: 1.22; }
.mymex-blog-studio .mymex-blog-list-copy p {
  display: -webkit-box;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  font-size: 12px;
  line-height: 1.55;
}
.mymex-blog-studio .mymex-blog-list-copy span { margin-top: auto; padding-top: 8px; }
.mymex-blog-studio .mymex-blog-list-actions,
.mymex-blog-studio .mymex-blog-workflow {
  display: flex;
  grid-column: auto;
  flex-wrap: wrap;
  justify-content: flex-start;
  gap: 7px;
  width: 100%;
}
.mymex-blog-studio .mymex-blog-list-actions { padding-top: 2px; }
.mymex-blog-action-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-height: 38px;
  padding: 8px 12px;
  border: 1px solid var(--mxb-line);
  border-radius: 11px;
  color: var(--mxb-ink);
  background: var(--mxb-surface);
  font: inherit;
  font-size: 11px;
  font-weight: 850;
  line-height: 1.15;
  text-decoration: none;
  cursor: pointer;
}
.mymex-blog-action-button svg { width: 16px; height: 16px; }
.mymex-blog-action-button.is-primary { color: #fff; border-color: #087cf0; background: #087cf0; }
.mymex-blog-action-button.is-danger { color: #a52626; border-color: rgba(196, 47, 47, .3); background: rgba(254, 226, 226, .55); }

.mymex-blog-updates {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(360px, .85fr);
  gap: clamp(22px, 4vw, 48px);
  align-items: center;
  margin: 28px 0;
  padding: clamp(26px, 5vw, 54px);
  border: 1px solid rgba(42, 198, 174, .24);
  border-radius: 30px;
  color: var(--mxb-ink);
  background: linear-gradient(135deg, rgba(20, 156, 244, .1), rgba(33, 211, 157, .12));
  box-shadow: 0 20px 50px rgba(10, 38, 69, .08);
}
.mymex-blog-updates h2 { margin: 10px 0; font-size: clamp(30px, 4vw, 48px); line-height: 1.04; letter-spacing: -.035em; }
.mymex-blog-updates p { color: var(--mxb-muted); font-size: 16px; line-height: 1.65; }
.mymex-blog-updates form { display: grid; gap: 12px; padding: 20px; border: 1px solid var(--mxb-line); border-radius: 20px; background: var(--mxb-surface); }
.mymex-blog-updates form > div { display: grid; grid-template-columns: 1fr 1.2fr; gap: 10px; }
.mymex-blog-updates label { display: grid; gap: 6px; color: var(--mxb-ink); font-size: 12px; font-weight: 800; }
.mymex-blog-updates input:not([type="checkbox"]) { width: 100%; min-height: 46px; padding: 10px 12px; border: 1px solid var(--mxb-line); border-radius: 12px; color: var(--mxb-ink); background: var(--mxb-soft); }
.mymex-blog-updates-consent { display: flex !important; grid-template-columns: none; align-items: flex-start; }
.mymex-blog-updates-consent input { flex: 0 0 auto; width: 18px; height: 18px; margin: 1px 0 0; }
.mymex-blog-updates button { min-height: 48px; padding: 11px 16px; border: 0; border-radius: 13px; color: #fff; background: linear-gradient(135deg, #0ca77b, #087cf0); font: inherit; font-weight: 900; cursor: pointer; }
.mymex-blog-updates button:disabled { opacity: .62; cursor: not-allowed; }
.mymex-blog-updates form > small { color: var(--mxb-muted); line-height: 1.45; }
.mymex-blog-updates.is-article { margin: 0; border-width: 1px 0 0; border-radius: 0; box-shadow: none; }
.mymex-blog-subscription-notice { margin-top: 14px; padding: 12px 14px; border-radius: 12px; font-weight: 800; }
.mymex-blog-subscription-notice.is-success { color: #09654b; background: #dff9ef; }
.mymex-blog-subscription-notice.is-error { color: #8f2626; background: #fee8e8; }
.mymex-blog-honeypot { position: absolute !important; left: -10000px !important; width: 1px !important; height: 1px !important; overflow: hidden !important; }

.mymex-blog-share-panel {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  margin-top: 14px;
}
.mymex-blog-share-panel > span { flex: 1 1 100%; color: var(--mxb-muted); font-size: 12px; font-weight: 800; }
.mymex-blog-share-panel a,
.mymex-blog-share-panel button {
  display: inline-flex;
  gap: 7px;
  align-items: center;
  min-height: 38px;
  padding: 7px 12px;
  border: 1px solid var(--mxb-line);
  border-radius: 999px;
  color: var(--mxb-ink);
  background: var(--mxb-soft);
  font: inherit;
  text-decoration: none;
}
.mymex-blog-share-panel a:first-of-type,
.mymex-blog-share-panel button:first-of-type { color: #fff; border-color: #0a66c2; background: #0a66c2; }
.mymex-blog-share-panel button:disabled { opacity: .72; }

.mymex-blog-inline-cta {
  margin: 0 clamp(28px, 5vw, 58px) 46px;
  padding: clamp(24px, 4vw, 38px);
  border-radius: 24px;
  color: #fff;
  background: radial-gradient(circle at top right, rgba(42, 213, 255, .25), transparent 34%), linear-gradient(135deg, #061a33, #073d78);
}
.mymex-blog-inline-cta h2 { margin: 10px 0; color: #fff; font-size: clamp(28px, 4vw, 40px); line-height: 1.05; }
.mymex-blog-inline-cta p { max-width: 760px; color: #d6e7f5; line-height: 1.65; }
.mymex-blog-inline-cta .mxp-primary { margin-top: 8px; }

.mymex-blog-subscription-result {
  width: min(100%, 760px);
  margin: 80px auto;
  padding: clamp(28px, 6vw, 58px);
  border: 1px solid var(--mxb-line);
  border-radius: 28px;
  color: var(--mxb-ink);
  background: var(--mxb-surface);
  box-shadow: 0 24px 60px rgba(7, 29, 57, .12);
  text-align: center;
}
.mymex-blog-subscription-result h1 { margin: 14px 0; font-size: clamp(34px, 6vw, 58px); line-height: 1.03; }
.mymex-blog-subscription-result p { color: var(--mxb-muted); font-size: 17px; line-height: 1.65; }
.mymex-blog-subscription-result form { margin: 22px 0 12px; }
.mymex-blog-subscription-result > .mxp-secondary { margin-top: 12px; }

@media (max-width: 800px) {
  .mymex-blog-updates { grid-template-columns: 1fr; border-radius: 24px; }
  .mymex-blog-studio .mymex-blog-list { grid-template-columns: 1fr; }
}
@media (max-width: 520px) {
  .mymex-blog-updates { padding: 22px 16px; }
  .mymex-blog-updates form > div { grid-template-columns: 1fr; }
  .mymex-blog-share-panel a,
  .mymex-blog-share-panel button { flex: 1 1 calc(50% - 8px); justify-content: center; }
  .mymex-blog-inline-cta { margin: 0 16px 34px; }
}

/* Weekly editorial growth: public sharing, reactions and moderated comments. */
.mymex-blog-engagement { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-top: 24px; }
.mymex-blog-engagement form { margin: 0; }
.mymex-blog-engagement button,
.mymex-blog-engagement a { display: inline-flex; min-height: 44px; align-items: center; gap: 8px; padding: 10px 14px; border: 1px solid var(--mxb-line); border-radius: 999px; color: var(--mxb-ink); background: var(--mxb-surface); text-decoration: none; font: inherit; font-weight: 800; cursor: pointer; }
.mymex-blog-engagement button:hover,
.mymex-blog-engagement a:hover { border-color: rgba(11, 143, 243, .55); transform: translateY(-1px); }
.mymex-blog-engagement button.is-liked { color: #c52952; border-color: rgba(197, 41, 82, .38); background: rgba(197, 41, 82, .09); }
.mymex-blog-engagement button span,
.mymex-blog-engagement a span { font-size: 18px; }
.mymex-blog-engagement strong { min-width: 18px; color: var(--mxb-muted); text-align: center; }
.mymex-blog-engagement > span { min-height: 20px; color: var(--mxb-muted); font-size: 13px; font-weight: 750; }

.mymex-blog-conversation { padding: clamp(28px, 5vw, 58px); border-top: 1px solid var(--mxb-line); }
.mymex-blog-conversation > header span { color: var(--mxb-blue); font-size: 12px; font-weight: 900; text-transform: uppercase; letter-spacing: .12em; }
.mymex-blog-conversation > header h2 { margin: 8px 0; font-size: clamp(30px, 4vw, 44px); letter-spacing: -.04em; }
.mymex-blog-conversation > header p,
.mymex-blog-no-comments { color: var(--mxb-muted); line-height: 1.65; }
.mymex-blog-comments { display: grid; gap: 14px; margin: 26px 0; }
.mymex-blog-comments > article { display: grid; grid-template-columns: 44px minmax(0, 1fr); gap: 12px; padding: 18px; border: 1px solid var(--mxb-line); border-radius: 18px; background: rgba(11, 143, 243, .035); }
.mymex-blog-comments > article > span { display: grid; width: 44px; height: 44px; place-items: center; border-radius: 50%; color: #fff; background: linear-gradient(135deg, #0b8ff3, #13b98a); font-weight: 900; }
.mymex-blog-comments header { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.mymex-blog-comments small { color: var(--mxb-muted); }
.mymex-blog-comments p { margin: 8px 0 0; color: var(--mxb-muted); line-height: 1.65; overflow-wrap: anywhere; }
.mymex-blog-comment-form { display: grid; gap: 14px; margin-top: 24px; padding: 22px; border: 1px solid var(--mxb-line); border-radius: 20px; background: rgba(11, 143, 243, .04); }
.mymex-blog-comment-form > div { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.mymex-blog-comment-form label { display: grid; gap: 7px; color: var(--mxb-ink); font-weight: 800; }
.mymex-blog-comment-form input,
.mymex-blog-comment-form textarea { width: 100%; min-width: 0; border: 1px solid var(--mxb-line); border-radius: 12px; padding: 12px 13px; color: var(--mxb-ink); background: var(--mxb-surface); font: inherit; box-sizing: border-box; }
.mymex-blog-comment-form textarea { resize: vertical; line-height: 1.55; }
.mymex-blog-comment-form button { justify-self: start; min-height: 46px; padding: 12px 18px; border: 0; border-radius: 12px; color: #fff; background: linear-gradient(135deg, #0b8ff3, #0870c6); font: inherit; font-weight: 900; cursor: pointer; }
.mymex-blog-comment-consent { grid-template-columns: 20px minmax(0, 1fr); align-items: start; font-size: 13px; line-height: 1.5; }
.mymex-blog-comment-consent input { width: 18px; height: 18px; margin-top: 1px; }
.mymex-blog-honeypot { position: absolute !important; left: -10000px !important; width: 1px !important; height: 1px !important; overflow: hidden !important; }
.mymex-blog-comment-notice { margin: 18px 0; padding: 13px 15px; border: 1px solid #9fe2c9; border-radius: 13px; color: #086948; background: #eafaf4; font-weight: 800; }
.mymex-blog-comment-notice.is-error { border-color: #f0b6b6; color: #972f38; background: #fff0f1; }

@media (max-width: 600px) {
  .mymex-blog-engagement { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .mymex-blog-engagement form,
  .mymex-blog-engagement button,
  .mymex-blog-engagement a { width: 100%; min-width: 0; justify-content: center; box-sizing: border-box; }
  .mymex-blog-engagement > span { grid-column: 1 / -1; }
  .mymex-blog-comment-form > div { grid-template-columns: 1fr; }
  .mymex-blog-comments header { align-items: flex-start; flex-direction: column; gap: 3px; }
}

.mymex-blog-automation,
.mymex-blog-moderation { display: grid; gap: 22px; padding: 26px; }
.mymex-blog-automation > header,
.mymex-blog-moderation > header { display: flex; align-items: flex-start; justify-content: space-between; gap: 24px; }
.mymex-blog-automation > header h2,
.mymex-blog-moderation > header h2 { margin: 4px 0 7px; }
.mymex-blog-automation > header p,
.mymex-blog-moderation > header p { max-width: 820px; margin: 0; color: var(--mxb-muted); line-height: 1.55; }
.mymex-blog-automation > header > strong,
.mymex-blog-moderation > header > strong { flex: 0 0 auto; padding: 8px 11px; border-radius: 999px; color: #7d5a07; background: #fff4cd; font-size: 12px; }
.mymex-blog-automation > header > strong.is-active { color: #087651; background: #e8fbf3; }
.mymex-blog-automation-form { display: grid; gap: 18px; }
.mymex-blog-automation-switch { display: flex; align-items: flex-start; gap: 12px; padding: 16px; border: 1px solid var(--mxb-line); border-radius: 16px; background: rgba(11, 143, 243, .045); }
.mymex-blog-automation-switch input { width: 20px; height: 20px; margin: 2px 0 0; }
.mymex-blog-automation-switch span { display: grid; gap: 3px; }
.mymex-blog-automation-switch small,
.mymex-blog-automation-grid small { color: var(--mxb-muted); line-height: 1.45; }
.mymex-blog-automation-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.mymex-blog-automation-grid label { display: grid; align-content: start; gap: 7px; font-weight: 800; }
.mymex-blog-automation-grid .is-wide { grid-column: 1 / -1; }
.mymex-blog-automation-grid input,
.mymex-blog-automation-grid select,
.mymex-blog-automation-grid textarea { width: 100%; min-width: 0; padding: 11px 12px; border: 1px solid var(--mxb-line); border-radius: 11px; color: var(--mxb-ink); background: var(--mxb-surface); font: inherit; box-sizing: border-box; }
.mymex-blog-automation-form > footer { display: flex; align-items: center; justify-content: space-between; gap: 18px; }
.mymex-blog-automation-form > footer > span { color: var(--mxb-muted); font-size: 13px; }
.mymex-blog-automation-runs { display: grid; gap: 12px; padding-top: 18px; border-top: 1px solid var(--mxb-line); }
.mymex-blog-automation-runs > header { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.mymex-blog-automation-runs > div { display: grid; gap: 8px; }
.mymex-blog-automation-runs article { display: grid; grid-template-columns: 90px minmax(0, 1fr) auto; align-items: center; gap: 12px; padding: 12px; border: 1px solid var(--mxb-line); border-radius: 13px; }
.mymex-blog-automation-runs article > span { color: #8a6110; font-size: 12px; font-weight: 900; text-transform: uppercase; }
.mymex-blog-automation-runs article.is-succeeded > span { color: #087651; }
.mymex-blog-automation-runs article.is-failed > span { color: #972f38; }
.mymex-blog-automation-runs article > div { display: grid; gap: 3px; min-width: 0; }
.mymex-blog-automation-runs article small { color: var(--mxb-muted); }
.mymex-blog-automation-runs article em { color: #972f38; font-size: 12px; overflow-wrap: anywhere; }
.mymex-blog-automation-runs article a { color: var(--mxb-blue); font-weight: 850; }

.mymex-blog-moderation > nav { display: flex; flex-wrap: wrap; gap: 8px; }
.mymex-blog-moderation > nav a { padding: 8px 12px; border: 1px solid var(--mxb-line); border-radius: 999px; color: var(--mxb-muted); text-decoration: none; font-weight: 800; }
.mymex-blog-moderation > nav a[aria-current="page"] { color: #fff; border-color: var(--mxb-blue); background: var(--mxb-blue); }
.mymex-blog-moderation-list { display: grid; gap: 12px; }
.mymex-blog-moderation-list > article { display: grid; gap: 12px; padding: 17px; border: 1px solid var(--mxb-line); border-radius: 16px; }
.mymex-blog-moderation-list > article > header { display: flex; justify-content: space-between; gap: 16px; }
.mymex-blog-moderation-list > article > header > div { display: grid; gap: 3px; }
.mymex-blog-moderation-list small { color: var(--mxb-muted); }
.mymex-blog-moderation-list a { color: var(--mxb-blue); font-weight: 800; }
.mymex-blog-moderation-list p { margin: 0; color: var(--mxb-muted); line-height: 1.55; overflow-wrap: anywhere; }
.mymex-blog-moderation-list footer { display: flex; flex-wrap: wrap; gap: 8px; }

@media (max-width: 760px) {
  .mymex-blog-automation > header,
  .mymex-blog-moderation > header,
  .mymex-blog-automation-form > footer,
  .mymex-blog-moderation-list > article > header { flex-direction: column; align-items: stretch; }
  .mymex-blog-automation-grid { grid-template-columns: 1fr; }
  .mymex-blog-automation-grid .is-wide { grid-column: auto; }
  .mymex-blog-automation-runs article { grid-template-columns: 1fr; }
}

/* Private editorial approval reached from email or the platform notification. */
body:has(.mymex-blog-approval-overlay) { overflow: hidden; }
.mymex-blog-approval-overlay {
  position: fixed;
  inset: 0;
  z-index: 10050;
  display: grid;
  place-items: center;
  padding: clamp(12px, 3vw, 34px);
  background: rgba(2, 11, 24, .78);
  backdrop-filter: blur(16px) saturate(120%);
  box-sizing: border-box;
}
.mymex-blog-approval-dialog {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  width: min(1180px, 100%);
  max-height: calc(100dvh - clamp(24px, 6vw, 68px));
  overflow: hidden;
  border: 1px solid rgba(61, 226, 183, .55);
  border-radius: 28px;
  color: #10243f;
  background: #f6faff;
  box-shadow: 0 32px 90px rgba(0, 7, 20, .48), 0 0 44px rgba(26, 211, 163, .12);
  outline: none;
}
.mymex-blog-approval-dialog > header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 24px;
  padding: clamp(20px, 3vw, 30px);
  color: #fff;
  background:
    radial-gradient(circle at 82% -40%, rgba(48, 234, 185, .4), transparent 42%),
    linear-gradient(130deg, #04172f 0%, #062b4b 58%, #075344 100%);
}
.mymex-blog-approval-dialog > header h2 { margin: 5px 0 8px; color: #fff; font-size: clamp(25px, 3vw, 38px); letter-spacing: -.035em; }
.mymex-blog-approval-dialog > header p { max-width: 780px; margin: 0; color: #cde2ef; line-height: 1.55; }
.mymex-blog-approval-dialog > header .tenant-eyebrow { color: #4bf0c2; }
.mymex-blog-approval-close {
  display: grid;
  flex: 0 0 auto;
  width: 44px;
  height: 44px;
  place-items: center;
  border: 1px solid rgba(255, 255, 255, .26);
  border-radius: 50%;
  color: #fff;
  background: rgba(255, 255, 255, .08);
  font-size: 30px;
  line-height: 1;
  text-decoration: none;
}
.mymex-blog-approval-close:hover,
.mymex-blog-approval-close:focus-visible { border-color: #4bf0c2; background: rgba(75, 240, 194, .15); outline: 3px solid rgba(75, 240, 194, .2); }
.mymex-blog-approval-scroll { min-height: 0; overflow-y: auto; overscroll-behavior: contain; scrollbar-gutter: stable; }
.mymex-blog-approval-preview { width: min(880px, calc(100% - 40px)); margin: 26px auto 38px; overflow: hidden; border: 1px solid #d3e0ec; border-radius: 24px; background: #fff; box-shadow: 0 18px 42px rgba(11, 35, 62, .09); }
.mymex-blog-approval-preview figure { display: grid; margin: 0; padding: 14px; background: #eaf1f7; }
.mymex-blog-approval-preview figure img { display: block; width: 100%; max-height: none; aspect-ratio: 1200 / 630; object-fit: contain; border-radius: 15px; background: #07172c; }
.mymex-blog-approval-copy { padding: clamp(24px, 5vw, 52px); }
.mymex-blog-approval-state { display: inline-flex; margin-bottom: 16px; padding: 7px 11px; border: 1px solid #a9ead7; border-radius: 999px; color: #087354; background: #e9faf4; font-size: 11px; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; }
.mymex-blog-approval-copy > h1 { max-width: 760px; margin: 0; color: #071c38; font-size: clamp(34px, 5vw, 58px); line-height: 1.02; letter-spacing: -.055em; }
.mymex-blog-approval-excerpt { margin: 22px 0 32px; color: #49627c; font-size: clamp(17px, 2vw, 21px); line-height: 1.7; }
.mymex-blog-approval-article { padding-top: 30px; border-top: 1px solid #d8e4ee; color: #29425d; font-size: 17px; line-height: 1.78; }
.mymex-blog-approval-article h1,
.mymex-blog-approval-article h2,
.mymex-blog-approval-article h3,
.mymex-blog-approval-article h4 { margin: 1.25em 0 .45em; color: #071c38; line-height: 1.15; letter-spacing: -.025em; }
.mymex-blog-approval-article h1 { font-size: 35px; }
.mymex-blog-approval-article h2 { font-size: 29px; }
.mymex-blog-approval-article h3 { font-size: 23px; }
.mymex-blog-approval-article p { margin: 0 0 1.25em; }
.mymex-blog-approval-article li { margin: .45em 0; }
.mymex-blog-approval-article a { color: #0876ce; }
.mymex-blog-approval-dialog > footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  padding: 18px clamp(20px, 3vw, 30px);
  border-top: 1px solid #d3e0ec;
  background: #fff;
  box-shadow: 0 -14px 34px rgba(11, 35, 62, .07);
}
.mymex-blog-approval-dialog > footer > div { display: grid; gap: 3px; max-width: 470px; }
.mymex-blog-approval-dialog > footer > div strong { color: #071c38; }
.mymex-blog-approval-dialog > footer > div span { color: #58708a; font-size: 12px; line-height: 1.45; }
.mymex-blog-approval-dialog > footer nav { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 9px; }
.mymex-blog-approval-dialog > footer form { margin: 0; }
.mymex-blog-approval-dialog .mymex-blog-action-button { min-height: 45px; white-space: nowrap; }
.mymex-blog-approval-dialog .mymex-blog-action-button.is-approve { color: #02261b; border-color: #3de2b7; background: linear-gradient(135deg, #50efc5, #25c997); box-shadow: 0 10px 24px rgba(23, 184, 138, .2); }
.mymex-blog-approval-dialog .mymex-blog-action-button.is-approve:hover { filter: brightness(1.04); transform: translateY(-1px); }

@media (max-width: 900px) {
  .mymex-blog-approval-dialog > footer { align-items: stretch; flex-direction: column; }
  .mymex-blog-approval-dialog > footer > div { max-width: none; }
  .mymex-blog-approval-dialog > footer nav { justify-content: stretch; }
  .mymex-blog-approval-dialog > footer nav > a,
  .mymex-blog-approval-dialog > footer nav > form { flex: 1 1 180px; }
  .mymex-blog-approval-dialog > footer form .mymex-blog-action-button,
  .mymex-blog-approval-dialog > footer nav > a { width: 100%; justify-content: center; box-sizing: border-box; }
}
@media (max-width: 600px) {
  .mymex-blog-approval-overlay { padding: 0; place-items: stretch; }
  .mymex-blog-approval-dialog { width: 100%; max-height: 100dvh; border-width: 0; border-radius: 0; }
  .mymex-blog-approval-dialog > header { padding: 18px 16px; }
  .mymex-blog-approval-dialog > header h2 { font-size: 25px; }
  .mymex-blog-approval-dialog > header p { font-size: 13px; }
  .mymex-blog-approval-close { width: 40px; height: 40px; }
  .mymex-blog-approval-preview { width: calc(100% - 24px); margin: 12px auto 24px; border-radius: 18px; }
  .mymex-blog-approval-preview figure { padding: 8px; }
  .mymex-blog-approval-copy { padding: 22px 18px; }
  .mymex-blog-approval-copy > h1 { font-size: 34px; }
  .mymex-blog-approval-article { font-size: 16px; }
  .mymex-blog-approval-dialog > footer { padding: 14px 16px; }
  .mymex-blog-approval-dialog > footer > div { display: none; }
  .mymex-blog-approval-dialog > footer nav { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .mymex-blog-approval-dialog > footer nav > a,
  .mymex-blog-approval-dialog > footer nav > form { min-width: 0; }
  .mymex-blog-approval-dialog > footer nav > form { grid-column: 1 / -1; }
  .mymex-blog-approval-dialog .mymex-blog-action-button { min-width: 0; padding-inline: 10px; white-space: normal; text-align: center; }
}