.admin-expand {
  border: 1px solid #d8e1ea;
  border-radius: var(--radius);
  padding: 10px 12px;
  background: #fbfdff;
}

.admin-expand summary {
  cursor: pointer;
  font-weight: 700;
  color: var(--text);
  margin-bottom: 10px;
}

.admin-expand[open] summary {
  margin-bottom: 12px;
}

.admin-grid-2 {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.admin-grid-3 {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.admin-grid-4 {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}

.page-editor-layout {
  display: grid;
  grid-template-columns: minmax(0, 2.35fr) minmax(260px, 0.68fr);
  gap: 18px;
  align-items: start;
}

.page-editor-main,
.page-editor-side {
  min-width: 0;
}

.page-editor-main .tox-tinymce {
  min-height: 680px;
}

.editor-focus-actions {
  display: flex;
  justify-content: flex-end;
  margin: -4px 0 8px;
}

.editor-focus-actions .chip {
  gap: 6px;
}

.editor-focus-modal-card {
  width: min(1200px, calc(100vw - 48px));
  max-height: min(92vh, 980px);
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
}

.editor-focus-modal-body {
  min-height: 0;
  display: grid;
}

.editor-focus-modal-body .tox-tinymce {
  min-height: min(74vh, 840px);
}

.editor-focus-modal-body textarea {
  min-height: min(74vh, 840px);
}

.page-editor-side {
  display: grid;
  gap: 12px;
}

.page-editor-side-card {
  display: grid;
  gap: 10px;
  padding: 14px;
  border: 1px solid #d8e1ea;
  border-radius: var(--radius);
  background: linear-gradient(180deg, #fbfdff, #f5f9fc);
}

.page-editor-side-card h4 {
  margin: 0;
  font-size: 14px;
}

.page-editor-side-card .inline-form {
  margin: 0;
}

.page-editor-actions {
  justify-content: space-between;
}

.page-editor-actions .inline-form {
  margin: 0;
}

.editor-action-bar {
  position: sticky;
  top: 10px;
  z-index: 12;
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  flex-wrap: wrap;
  padding: 10px 12px;
  margin-bottom: 14px;
  border: 1px solid #d8e1ea;
  border-radius: var(--radius);
  background: rgba(255, 255, 255, 0.94);
  backdrop-filter: blur(10px);
}

.newsletter-admin-monitor {
  position: fixed;
  left: 18px;
  bottom: 18px;
  z-index: 80;
  width: min(360px, calc(100vw - 28px));
  display: grid;
  gap: 10px;
  padding: 14px;
  border: 1px solid #d8e1ea;
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.96);
  box-shadow: 0 18px 48px rgba(15, 23, 42, 0.18);
  backdrop-filter: blur(14px);
  cursor: pointer;
}

.newsletter-admin-monitor.is-finished {
  opacity: 0.6;
}

.newsletter-admin-monitor.is-minimized {
  width: min(300px, calc(100vw - 28px));
  gap: 0;
  padding: 12px 14px;
}

.newsletter-admin-monitor-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.newsletter-admin-monitor-head .inline-form {
  flex-wrap: nowrap;
  gap: 8px;
}

.newsletter-admin-monitor-copy {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.newsletter-admin-monitor-body {
  display: grid;
  gap: 10px;
}

.newsletter-admin-monitor-copy strong,
.newsletter-admin-monitor-copy span,
.newsletter-admin-monitor-stats span {
  overflow-wrap: anywhere;
  word-break: break-word;
}

.newsletter-admin-monitor-copy strong {
  font-size: 14px;
}

.newsletter-admin-monitor-copy span {
  color: var(--muted);
  font-size: 13px;
}

.newsletter-admin-monitor-stats {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px 12px;
  font-size: 12px;
  color: var(--muted);
}

.newsletter-admin-monitor-bar span {
  width: 0;
}

.page-editor-main .helper-text:last-of-type {
  margin-bottom: 0;
}

.compact-field {
  gap: 6px;
  min-width: 0;
}

.media-source-row {
  display: grid;
  gap: 10px;
  min-width: 0;
}

.media-picker-control {
  display: grid;
  gap: 8px;
  min-width: 0;
}

.media-picker-control .inline-form {
  align-items: center;
  flex-wrap: wrap;
}

.media-picker-preview {
  min-height: 48px;
  min-width: 0;
}

.media-picker-preview .hero-preview,
.media-picker-preview .media-picker-empty {
  width: 100%;
}

.media-picker-empty {
  display: grid;
  place-items: center;
  min-height: 64px;
  border: 1px dashed #cfd8df;
  border-radius: var(--radius);
  color: var(--muted);
  font-size: 13px;
  background: #f8fafc;
}

.builder-toolbar {
  align-items: end;
}

.builder-notice {
  border: 1px solid #cfe0ff;
  background: #eef5ff;
  border-radius: var(--radius);
  padding: 12px 14px;
  display: grid;
  gap: 4px;
}

.builder-notice strong {
  font-size: 15px;
  color: #173e74;
}

.builder-notice span {
  font-size: 13px;
  color: #35557d;
}

.builder-action-wrap .chip {
  width: 100%;
}

.dev-site-banner {
  display: grid;
  gap: 4px;
  margin: 0 0 14px;
  padding: 12px 14px;
  border: 1px solid #f3c783;
  border-radius: 12px;
  background: linear-gradient(135deg, #fff8ea 0%, #fff1d7 100%);
}

.dev-site-banner strong {
  font-size: 14px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #7a4512;
}

.dev-site-banner span {
  font-size: 13px;
  color: #92541c;
}

.builder-list {
  display: grid;
  gap: 12px;
}

.gallery-admin-intro {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin: 14px 0 18px;
}

.gallery-admin-tip {
  display: grid;
  gap: 6px;
  padding: 14px;
  border: 1px solid #d7dee5;
  border-radius: var(--radius);
  background: linear-gradient(180deg, #fbfdff, #f4f8fc);
}

.gallery-admin-tip strong {
  font-size: 14px;
}

.gallery-admin-tip span {
  font-size: 13px;
  color: var(--muted);
  line-height: 1.45;
}

.gallery-builder-card,
.gallery-admin-card {
  background: #fff;
}

.gallery-admin-head {
  align-items: flex-start;
  gap: 12px;
}

.gallery-shortcode-row {
  margin: 6px 0 0;
}

.gallery-shortcode-row code,
.gallery-shortcode-preview code {
  display: inline-flex;
  align-items: center;
  padding: 6px 10px;
  border-radius: 999px;
  background: #f5f8fb;
  border: 1px solid #d7dee5;
}

.gallery-shortcode-row code {
  margin-right: 6px;
}

.builder-step {
  border: 1px solid #d8e1ea;
  border-radius: var(--radius);
  padding: 12px;
  background: #fbfdff;
}

.builder-step h4 {
  margin: 0 0 8px;
}

.builder-step p {
  margin: 0 0 10px;
}

.form-preview-modal-card {
  width: min(860px, calc(100vw - 32px));
  max-height: calc(100vh - 40px);
  overflow: hidden;
}

.form-preview-modal-body {
  max-height: calc(100vh - 140px);
  overflow: auto;
  padding-top: 8px;
}

.form-preview-modal-body .cms-form {
  margin: 0;
}

.admin-fieldset-reset {
  margin: 0;
  padding: 0;
  border: 0;
  min-width: 0;
}

.is-disabled-group {
  opacity: 0.58;
}

.admin-wrap {
  width: min(900px, 100%);
  margin: 0 auto;
  padding: 14px;
}

@media (max-width: 980px) {
  .page-editor-layout {
    grid-template-columns: 1fr;
  }
}

.admin-body {
  background: #eef2f5;
}

.admin-layout {
  display: grid;
  grid-template-columns: 212px 1fr;
  min-height: 100vh;
  transition: grid-template-columns 0.2s ease;
}

.admin-layout.sidebar-collapsed {
  grid-template-columns: 68px 1fr;
}

.admin-sidebar {
  background: #1f2933;
  color: #dce3ea;
  padding: 12px 8px;
  overflow: hidden;
}

.admin-dev-instance .admin-sidebar {
  background: linear-gradient(180deg, #562015 0%, #7f2e1e 42%, #9a4325 100%);
  color: #fff0ea;
  box-shadow: inset -1px 0 0 rgba(255, 222, 209, 0.18);
}

.admin-sidebar-brand {
  padding: 8px 10px 14px;
  border-bottom: 1px solid #3a4651;
  margin-bottom: 10px;
}

.admin-dev-instance .admin-sidebar-brand {
  border-bottom-color: rgba(255, 229, 214, 0.22);
}

.admin-sidebar-brand a {
  color: #a9c7ff;
  display: block;
  margin-top: 6px;
}

.admin-dev-instance .admin-sidebar-brand a {
  color: #ffe0b3;
}

.admin-dev-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-top: 8px;
  padding: 4px 8px;
  border-radius: 999px;
  background: rgba(255, 244, 235, 0.14);
  border: 1px solid rgba(255, 230, 214, 0.28);
  color: #fff2e6;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.admin-nav-link {
  display: flex;
  gap: 10px;
  align-items: center;
  color: #dce3ea;
  padding: 9px 10px;
  border-radius: var(--radius);
  margin-bottom: 4px;
  font-size: 13px;
}

.admin-nav-link.active {
  background: #1655a2;
  color: #fff;
}

.admin-dev-instance .admin-nav-link {
  color: #fff0ea;
}

.admin-dev-instance .admin-nav-link:hover {
  background: rgba(255, 245, 237, 0.08);
}

.admin-dev-instance .admin-nav-link.active {
  background: #ffd2ad;
  color: #5c1e11;
}

.admin-nav-divider {
  margin: 10px 10px 6px;
  padding-top: 10px;
  border-top: 1px solid #3a4651;
  color: #9fb1c1;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.admin-dev-instance .admin-nav-divider {
  border-top-color: rgba(255, 229, 214, 0.22);
  color: #ffd7c3;
}

.admin-layout.sidebar-collapsed .admin-sidebar-brand h1,
.admin-layout.sidebar-collapsed .admin-sidebar-brand strong,
.admin-layout.sidebar-collapsed .admin-sidebar-brand p,
.admin-layout.sidebar-collapsed .admin-sidebar-brand .helper-text,
.admin-layout.sidebar-collapsed .admin-sidebar-brand a,
.admin-layout.sidebar-collapsed .admin-nav-link span,
.admin-layout.sidebar-collapsed .admin-subnav,
.admin-layout.sidebar-collapsed .admin-logout {
  display: none;
}

.admin-layout.sidebar-collapsed .admin-sidebar-brand,
.admin-layout.sidebar-collapsed .admin-nav-link,
.admin-layout.sidebar-collapsed .admin-logout {
  justify-content: center;
  text-align: center;
}

.admin-subnav {
  display: grid;
  gap: 4px;
  margin: 4px 0 10px 22px;
}

.admin-subnav-link {
  display: block;
  padding: 6px 10px;
  border-radius: 10px;
  color: #dce3ea;
  text-decoration: none;
  font-size: 12px;
  font-weight: 700;
}

.admin-subnav-link:hover {
  background: rgba(255, 255, 255, 0.06);
}

.admin-subnav-link.active {
  color: #fff;
  background: rgba(255, 255, 255, 0.08);
}

.admin-logout {
  display: inline-block;
  margin-top: 16px;
  color: #ffd6d6;
  padding: 8px 10px;
}

.admin-dev-instance .admin-logout {
  color: #ffe2d3;
}

.admin-main {
  padding: 16px;
  min-width: 0;
}

.admin-main .card {
  margin-bottom: 18px;
}

.menu-sort-list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.menu-sort-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 10px;
  border: 1px solid #d7dee5;
  border-radius: var(--radius);
  margin-bottom: 8px;
  background: #fff;
  cursor: move;
}

.menu-sort-item.menu-depth-1 {
  margin-left: 22px;
  background: #f8fbff;
  border-color: #d3e0ef;
}

.nav-menu-flags {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}

.menu-sort-main {
  display: flex;
  align-items: center;
  gap: 10px;
  flex: 1 1 auto;
  min-width: 0;
}

.menu-sort-copy {
  display: grid;
  gap: 4px;
  flex: 1 1 auto;
  min-width: 0;
}

.menu-item-title-input,
.menu-item-icon-input {
  width: 100%;
  min-width: 0;
}

.menu-item-title-input {
  font-weight: 700;
}

.menu-item-meta {
  font-size: 12px;
  color: var(--muted);
}

.menu-item-preview {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  border: 1px solid #d7dee5;
  border-radius: var(--radius);
  background: #fff;
}

.menu-item-preview-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  border-radius: var(--radius);
  background: #f4f8fc;
  color: var(--accent-2);
  flex: 0 0 auto;
}

.menu-item-preview-copy {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.menu-item-preview-copy strong,
.menu-item-preview-copy span {
  font-size: 12px;
  color: var(--muted);
  overflow-wrap: anywhere;
  word-break: break-word;
}

.menu-item-preview-copy strong {
  font-size: 15px;
  color: var(--text);
}

.layout-snippet-library {
  margin-bottom: 8px;
}

.layout-snippet-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 12px;
}

.layout-snippet-card {
  border: 1px solid #d7dee5;
  border-radius: var(--radius);
  padding: 12px;
  background: #fff;
  display: grid;
  gap: 8px;
}

.layout-snippet-card h4 {
  margin: 0;
  font-size: 18px;
}

.layout-snippet-preview {
  border: 1px dashed #c3ceda;
  border-radius: 4px;
  min-height: 104px;
  padding: 10px;
  display: grid;
  gap: 10px;
  background: linear-gradient(180deg, #f8fbff, #f2f6fb);
}

.layout-snippet-preview-split {
  grid-template-columns: 1fr 1fr;
}

.layout-snippet-preview-split.ratio-30-70 {
  grid-template-columns: 0.7fr 1.3fr;
}

.layout-snippet-preview.cols-1 {
  grid-template-columns: 1fr;
}

.layout-snippet-preview.cols-2 {
  grid-template-columns: 1fr 1fr;
}

.layout-snippet-preview.cols-3 {
  grid-template-columns: 1fr 1fr 1fr;
}

.layout-snippet-column {
  display: grid;
  align-content: start;
  gap: 7px;
  min-height: 72px;
  padding: 8px;
  border: 1px solid #dbe4ee;
  border-radius: 4px;
  background: #ffffff;
}

.layout-snippet-line {
  display: block;
  height: 7px;
  border-radius: 999px;
  background: linear-gradient(90deg, #dcecff, #c9dbf1);
}

.layout-snippet-line-title {
  height: 10px;
  width: 72%;
}

.layout-snippet-line-short {
  width: 58%;
}

.layout-snippet-pane-media {
  display: block;
  min-height: 72px;
  border: 1px solid #dbe4ee;
  border-radius: 4px;
  background: linear-gradient(135deg, #c8d9ef, #a8bfdc);
}

.layout-builder-panel {
  display: grid;
  gap: 12px;
  margin-top: 14px;
  padding: 14px;
  border: 1px solid #d7dee5;
  border-radius: var(--radius);
  background: linear-gradient(180deg, #ffffff, #f8fbff);
}

.layout-builder-panel h4 {
  margin: 0;
}

.layout-builder-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}

.layout-builder-panel textarea[readonly] {
  min-height: 260px;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 12px;
  line-height: 1.5;
}

.menu-source-group {
  min-width: 0;
}

.menu-remove-btn {
  min-width: auto;
}

.menu-sort-item.dragging {
  opacity: 0.55;
}

.admin-edit {
  border: 1px solid #e3e8ec;
  border-radius: var(--radius);
  padding: 12px;
  margin-bottom: 14px;
}

.page-admin-layout {
  display: grid;
  grid-template-columns: minmax(160px, 196px) minmax(0, 1fr);
  gap: 18px;
  align-items: start;
}

.page-admin-layout > * {
  min-width: 0;
}

.page-list {
  display: grid;
  gap: 10px;
}

.page-list-children {
  display: grid;
  gap: 8px;
  margin-top: 10px;
  padding-top: 10px;
  border-top: 1px solid #e7edf2;
}

.page-list-child {
  margin-left: 12px;
  padding: 10px 10px 10px 14px;
  border-left: 3px solid #dbe6f5;
  background: #fbfcfe;
}

.page-list-panel {
  border: 1px solid #d7dee5;
  border-radius: var(--radius);
  background: #fff;
  padding: 10px;
  max-width: 156px;
  transition: max-width 0.2s ease;
  min-width: 0;
}

.page-list-panel[open] {
  max-width: 252px;
}

.page-list-panel-inline,
.page-list-panel-inline[open] {
  max-width: none;
  width: 100%;
}

.page-list-panel-compact {
  margin-top: 12px;
}

.page-list-panel-compact > summary {
  font-size: 15px;
  padding: 9px 12px;
}

.page-list-panel-compact[open] {
  padding-bottom: 10px;
}

.page-list-panel-compact .helper-text {
  margin: 0 12px 10px;
}

.page-list-panel-compact .page-list-panel-toolbar,
.page-list-panel-compact [data-bulk-submit] {
  margin-left: 12px;
  margin-right: 12px;
}

.page-list-panel-compact .page-list {
  max-height: 320px;
  overflow: auto;
  padding: 0 12px 4px;
}

.page-list-panel > summary {
  cursor: pointer;
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-weight: 700;
  list-style: none;
  margin: -12px -12px 0;
  padding: 10px 12px;
}

.page-list-panel > summary::-webkit-details-marker {
  display: none;
}

.page-list-panel > summary span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 28px;
  padding: 2px 8px;
  border-radius: 999px;
  background: #eef5ff;
  color: #1655a2;
  font-size: 12px;
}

.page-list-panel[open] > summary {
  border-bottom: 1px solid #e3e8ec;
  margin-bottom: 10px;
}

.page-list-panel-toolbar {
  display: flex;
  justify-content: flex-start;
  gap: 8px;
  margin-bottom: 10px;
}

.admin-existing-picker {
  min-width: min(320px, 100%);
  margin: 0 0 10px;
}

.admin-existing-picker span {
  font-weight: 700;
}

.table-scroll {
  max-width: 100%;
  overflow: auto;
}

.subscriber-list-table-wrap {
  max-height: 62vh;
  max-width: 100%;
  overflow: auto;
}

.subscriber-list-table th,
.subscriber-list-table td {
  white-space: nowrap;
  vertical-align: middle;
}

.subscriber-list-table td:nth-child(2),
.subscriber-list-table td:nth-child(3),
.subscriber-list-table td:nth-child(7) {
  white-space: normal;
}

.subscriber-list-table tbody tr.is-selected {
  background: rgba(49, 114, 196, 0.08);
}

.newsletter-subscriber-editor {
  position: relative;
  isolation: isolate;
  overflow: hidden;
}

.newsletter-subscriber-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.75fr) minmax(260px, 0.72fr);
  gap: 18px;
  align-items: start;
}

.newsletter-subscriber-layout .page-editor-main,
.newsletter-subscriber-layout .page-editor-side {
  position: relative;
  z-index: 1;
}

.newsletter-subscriber-layout .page-editor-side {
  align-self: start;
}

.page-list-panel-backdrop {
  display: none;
}

.field-list-hint {
  margin: 0 0 10px;
  font-weight: 600;
}

.field-order-button {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  width: auto;
}

.page-list-item {
  border: 1px solid #d7dee5;
  border-radius: var(--radius);
  background: #fff;
  padding: 10px 12px;
  min-width: 0;
  overflow: hidden;
}

.page-list-item.active {
  border-color: #1655a2;
  box-shadow: 0 0 0 2px rgba(22, 85, 162, 0.08);
}

.page-list-item:hover {
  box-shadow: 0 8px 24px rgba(17, 24, 39, 0.06);
}

.page-list-link {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px 12px;
  flex-wrap: wrap;
  color: var(--text);
}

.page-list-link > div:first-child {
  min-width: 0;
  display: grid;
  gap: 2px;
}

.page-list-link strong {
  font-size: 14px;
  line-height: 1.2;
}

.page-list-link span {
  font-size: 12px;
  line-height: 1.2;
  color: var(--muted);
}

.page-list-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 10px;
  margin-top: 4px;
  align-items: center;
  color: var(--muted);
  font-size: 12px;
}

.page-list-meta span {
  max-width: 100%;
  overflow-wrap: anywhere;
  word-break: break-word;
}

.page-list-meta-vertical {
  margin-top: 0;
}

.page-editor {
  min-width: 0;
}

.page-editor-head {
  display: flex;
  justify-content: space-between;
  align-items: start;
  gap: 12px;
  flex-wrap: wrap;
}

.page-editor-head h3 {
  margin: 0;
}

.newsletter-send-runner {
  display: grid;
  gap: 12px;
}

.newsletter-campaign-layout {
  align-items: start;
}

.newsletter-admin-actions {
  display: grid;
  gap: 10px;
}

.newsletter-admin-actions form {
  margin: 0;
  min-width: 0;
}

.newsletter-admin-actions .inline-form {
  flex-wrap: wrap;
  min-width: 0;
}

.newsletter-admin-actions input[type="email"] {
  min-width: 0;
}

.newsletter-preview-head {
  display: grid;
  gap: 8px;
  align-items: start;
}

.newsletter-preview-head h3 {
  margin: 0;
}

.newsletter-preview-head .helper-text {
  display: block;
  min-width: 0;
  max-width: 100%;
  white-space: normal;
  overflow: visible;
  text-overflow: clip;
  overflow-wrap: anywhere;
  word-break: break-word;
}

.newsletter-runner-actions {
  flex-wrap: wrap;
  align-items: center;
}

.newsletter-runner-stats {
  gap: 10px 16px;
}

.newsletter-runner-stats span {
  max-width: 100%;
  overflow-wrap: anywhere;
  word-break: break-word;
}

.newsletter-runner-bar span {
  width: 0;
}

.newsletter-delivery-actions {
  align-items: flex-start;
  flex-wrap: wrap;
}

.newsletter-delivery-actions form {
  margin: 0;
}

.newsletter-campaign-welcome {
  padding-top: 16px;
}

.newsletter-settings-submit {
  justify-content: end;
}

.newsletter-console-toolbar {
  margin-bottom: 14px;
}

.newsletter-campaign-summary {
  margin-bottom: 14px;
}

.newsletter-summary-card .page-list-meta {
  gap: 6px;
}

.newsletter-console-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr);
  gap: 14px;
}

.newsletter-console-grid .newsletter-preview-card {
  min-width: 0;
  overflow: hidden;
}

.newsletter-console-grid table {
  width: 100%;
  table-layout: fixed;
}

.newsletter-console-grid td,
.newsletter-console-grid th {
  overflow-wrap: anywhere;
  word-break: break-word;
  white-space: normal;
}

.newsletter-preview-modal-card {
  width: min(1120px, calc(100vw - 32px));
}

.newsletter-preview-modal-body {
  display: grid;
  gap: 12px;
}

.newsletter-advanced-delivery {
  margin-top: 12px;
  border: 1px solid #d7dee5;
  border-radius: var(--radius);
  background: #fbfdff;
  padding: 12px 14px;
}

.newsletter-advanced-delivery > summary {
  cursor: pointer;
  font-weight: 700;
}

.newsletter-advanced-delivery[open] > summary {
  margin-bottom: 12px;
}

.form-editor-layout {
  align-items: start;
}

.form-editor-workbench {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(260px, 320px);
  gap: 18px;
  align-items: start;
  margin-top: 16px;
}

.form-editor-workbench-main,
.form-editor-workbench-side {
  min-width: 0;
}

.form-editor-workbench-side {
  display: grid;
  gap: 14px;
}

.admin-helper-form {
  display: none !important;
}

.admin-helper-form[hidden] {
  display: none !important;
  position: absolute !important;
  inset: auto !important;
  width: 0 !important;
  height: 0 !important;
  overflow: hidden !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
}

.form-editor-meta-grid {
  margin-top: 14px;
  align-items: start;
}

.form-editor-meta-card {
  min-width: 0;
}

.dashboard-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: 10px;
}

.dashboard-grid.compact {
  grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
}

.dashboard-three-col {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin-top: 12px;
  align-items: start;
}

.dashboard-tip {
  display: grid;
  gap: 6px;
  border: 1px solid #d7dee5;
  border-radius: var(--radius);
  background: linear-gradient(120deg, #f8fcff, #eef4ff);
  padding: 12px;
}

.dashboard-tip-text {
  transition: opacity .22s ease;
}

.db-usage-list {
  display: grid;
  gap: 10px;
  margin-top: 10px;
}

.db-usage-layout {
  display: grid;
  grid-template-columns: minmax(220px, 280px);
  gap: 16px;
  align-items: start;
  margin-top: 16px;
}

.db-usage-chart-card {
  position: relative;
  display: grid;
  place-items: center;
  min-height: 240px;
  padding: 16px;
  border: 1px solid #d7dee5;
  border-radius: calc(var(--radius) + 2px);
  background: linear-gradient(180deg, #fbfdff, #f5f9fc);
}

.db-usage-chart {
  width: min(220px, 100%);
  aspect-ratio: 1 / 1;
  display: grid;
  place-items: center;
}

.db-usage-chart-svg {
  width: 100%;
  height: auto;
  overflow: visible;
  transform: rotate(-90deg);
}

.db-usage-chart-track,
.db-usage-chart-segment {
  fill: none;
  stroke-width: 24;
}

.db-usage-chart-track {
  stroke: #e5ebf2;
}

.db-usage-chart-segment {
  stroke: var(--segment-color, #3b82f6);
  stroke-dasharray: var(--segment-dash, 0) var(--segment-gap, 999);
  stroke-dashoffset: var(--segment-offset, 0);
}

.db-usage-chart-center {
  position: absolute;
  inset: 0;
  display: grid;
  place-content: center;
  gap: 4px;
  text-align: center;
  pointer-events: none;
}

.db-usage-chart-center strong {
  font-size: 18px;
  line-height: 1.1;
}

.db-usage-chart-center span {
  font-size: 12px;
  color: var(--muted);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.db-usage-swatch {
  width: 12px;
  height: 12px;
  margin-top: 3px;
  border-radius: 999px;
  background: var(--db-usage-color, #3b82f6);
}

.db-usage-row {
  display: grid;
  gap: 6px;
}

.db-usage-head {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  font-size: 13px;
}

.db-usage-bar {
  height: 8px;
  border-radius: 999px;
  background: #e5ebf2;
  overflow: hidden;
}

.db-usage-bar span {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: var(--db-usage-color, #2d6ab2);
}

.compact-list {
  display: grid;
  gap: 8px;
  max-height: 280px;
  overflow: auto;
  padding-right: 2px;
}

.stat-card {
  border: 1px solid #d7dee5;
  border-radius: var(--radius);
  background: #fff;
  padding: 10px;
}

.stat-card strong {
  display: block;
  font-size: 20px;
  line-height: 1.1;
  margin-bottom: 8px;
}

.stat-card span {
  color: var(--muted);
  font-size: 12px;
}

.dashboard-about {
  display: grid;
  gap: 12px;
}

.dashboard-about.concise {
  gap: 8px;
}

.dashboard-about p,
.dashboard-about li {
  color: var(--text);
}

.dashboard-about ul {
  margin: 0;
  padding-left: 18px;
  display: grid;
  gap: 6px;
}

.dashboard-onboarding {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.dashboard-onboarding-item {
  display: grid;
  gap: 8px;
  padding: 12px;
  border: 1px solid #d7dee5;
  border-radius: var(--radius);
  background: #fff;
}

.dashboard-onboarding-item strong {
  font-size: 15px;
}

.dashboard-onboarding-item span {
  color: var(--text);
  font-size: 14px;
  line-height: 1.45;
}

.compact-jump-links {
  gap: 6px;
  margin-bottom: 10px;
}

.compact-jump-links .chip {
  padding: 9px 12px;
  font-size: 14px;
}

.compact-jump-links .chip.active {
  background: linear-gradient(135deg, var(--accent), var(--accent-2));
  border-color: transparent;
  color: #fff;
  box-shadow: 0 8px 20px rgba(17, 24, 39, 0.12);
}

.admin-record-browser {
  gap: 10px;
}

.admin-record-item {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  padding: 10px 12px;
}

.admin-record-item.active {
  border-color: #bfd2ea;
  background: linear-gradient(180deg, #fbfdff, #f6f9fc);
}

.admin-record-item-child {
  margin-left: 12px;
}

.admin-record-item-main {
  min-width: 0;
  display: grid;
  gap: 2px;
}

.admin-record-item-head {
  justify-content: space-between;
  align-items: center;
  gap: 8px 12px;
  flex-wrap: wrap;
}

.admin-record-item-titleline {
  align-items: center;
  gap: 4px 10px;
  flex-wrap: wrap;
  min-width: 0;
  line-height: 1.25;
}

.admin-record-item-title {
  color: var(--text);
  text-decoration: none;
}

.admin-record-item-title:hover strong,
.admin-record-item-title:focus-visible strong {
  color: var(--accent-2);
  text-decoration: underline;
}

.admin-record-item-title strong {
  font-size: 14px;
  line-height: 1.2;
}

.admin-record-item-titleline .helper-text {
  margin: 0;
  font-size: 12px;
  line-height: 1.2;
}

.admin-record-item-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 12px;
}

.admin-record-item-select {
  align-self: center;
  white-space: nowrap;
}

.admin-record-children {
  margin: 0 0 2px 8px;
}

.seo-admin-form {
  gap: 12px;
}

.mail-delivery-form {
  margin-top: 16px;
}

.mail-delivery-section {
  display: grid;
  gap: 12px;
  padding: 14px;
  border: 1px solid #d7dee5;
  border-radius: calc(var(--radius) + 2px);
  background: linear-gradient(180deg, #fbfdff, #f5f9fc);
}

.mail-delivery-section-head {
  display: grid;
  gap: 4px;
}

.mail-delivery-section-head h3 {
  margin: 0;
  font-size: 16px;
}

.mail-delivery-section-head .helper-text {
  margin: 0;
}

.mail-delivery-actions {
  margin-top: 4px;
}

.mail-delivery-tools {
  display: grid;
  gap: 12px;
  margin-top: 14px;
}

.mail-delivery-tool-forms {
  display: grid;
  gap: 10px;
}

.mail-delivery-tool-forms .inline-form {
  margin: 0;
}

.media-admin-card {
  overflow: hidden;
}

.media-upload-form {
  gap: 10px;
}

.media-upload-report {
  gap: 10px;
}

.media-library-toolbar {
  display: grid;
  gap: 10px;
  margin-bottom: 14px;
  padding: 12px;
  border: 1px solid #d7dee5;
  border-radius: calc(var(--radius) + 2px);
  background: linear-gradient(180deg, #fbfdff, #f5f9fc);
}

.media-library-filters {
  align-items: end;
  gap: 8px 10px;
  flex-wrap: wrap;
  margin: 0;
}

.media-library-filters label {
  font-size: 12px;
  font-weight: 700;
  color: var(--muted);
}

.media-library-filters select {
  min-width: 170px;
}

.media-library-view-switch {
  justify-content: flex-start;
  margin: 0;
}

.media-library-card .media-grid {
  gap: 12px;
}

.media-library-card .media-card,
.media-form-uploads-card .media-card {
  padding: 12px;
  gap: 10px;
  border-radius: calc(var(--radius) + 2px);
  min-width: 0;
}

.media-library-card .media-grid.media-list .media-card,
.media-form-uploads-card .media-grid.media-list .media-card {
  grid-template-columns: 72px minmax(0, 1fr) auto;
  gap: 12px;
  padding: 12px;
}

.media-library-card .media-grid.media-list .media-thumb,
.media-form-uploads-card .media-grid.media-list .media-thumb {
  width: 64px;
}

.media-library-card .media-meta,
.media-form-uploads-card .media-meta {
  gap: 5px;
}

.media-library-card .media-meta strong,
.media-form-uploads-card .media-meta strong {
  font-size: 15px;
}

.media-library-card .media-meta span,
.media-form-uploads-card .media-meta span {
  font-size: 12px;
  line-height: 1.45;
}

.media-library-card .media-card-actions,
.media-form-uploads-card .media-card-actions {
  gap: 8px;
  padding-top: 8px;
}

.media-library-card .media-card-primary-actions,
.media-library-card .media-card-actions-row,
.media-form-uploads-card .media-card-primary-actions,
.media-form-uploads-card .media-card-actions-row {
  gap: 8px;
}

.media-library-card .media-card-manage {
  padding: 8px 10px;
}

.media-bulk-actions {
  margin-top: 14px;
  padding-top: 14px;
  border-top: 1px solid #e5ebf1;
  gap: 10px;
  flex-wrap: wrap;
}

.media-bulk-actions form {
  margin: 0;
}

.seo-social-grid {
  display: grid;
  gap: 12px;
  align-items: start;
}

.seo-social-controls,
.seo-social-help {
  min-width: 0;
}

.seo-social-help {
  display: grid;
  gap: 8px;
  align-content: start;
  padding: 12px;
  border: 1px solid #d7dee5;
  border-radius: var(--radius);
  background: linear-gradient(180deg, #f9fbfe, #f4f8fc);
}

.seo-social-help p {
  margin: 0;
}

.seo-admin-note {
  display: grid;
  gap: 4px;
  padding: 10px 12px;
  border: 1px solid #d7dee5;
  border-radius: var(--radius);
  background: linear-gradient(180deg, #f9fbfe, #f4f8fc);
}

.seo-admin-note strong {
  font-size: 14px;
}

.gsc-snapshot {
  display: grid;
  gap: 16px;
  padding: 16px;
  border: 1px solid #d7dee5;
  border-radius: calc(var(--radius) + 4px);
  background:
    radial-gradient(circle at top right, rgba(59, 130, 246, 0.08), transparent 34%),
    linear-gradient(180deg, #fbfdff, #f5f9ff);
}

.gsc-snapshot-compact {
  gap: 14px;
  padding: 14px;
}

.gsc-snapshot-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 12px;
}

.gsc-snapshot-head-copy {
  min-width: 0;
  display: grid;
  gap: 6px;
}

.gsc-snapshot-head-copy h3 {
  margin: 0;
}

.gsc-snapshot-eyebrow {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  padding: 4px 10px;
  border-radius: 999px;
  background: rgba(37, 99, 235, 0.1);
  color: #1747a5;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.gsc-snapshot-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 8px;
}

.gsc-meta-pill {
  display: inline-flex;
  align-items: center;
  padding: 6px 10px;
  border-radius: 999px;
  border: 1px solid #d7dee5;
  background: rgba(255, 255, 255, 0.88);
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
}

.gsc-snapshot-stats {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: 10px;
}

.gsc-stat-card {
  display: grid;
  gap: 8px;
  padding: 12px;
  border: 1px solid #d7dee5;
  border-radius: var(--radius);
  background: rgba(255, 255, 255, 0.92);
}

.gsc-stat-card span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.gsc-stat-card strong {
  font-size: 25px;
  line-height: 1.05;
}

.gsc-snapshot-panels {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.gsc-snapshot-panel {
  display: grid;
  gap: 10px;
  padding: 14px;
  border: 1px solid #d7dee5;
  border-radius: var(--radius);
  background: rgba(255, 255, 255, 0.9);
}

.gsc-snapshot-panel-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
}

.gsc-snapshot-panel-head h4 {
  margin: 0;
}

.gsc-snapshot-list {
  display: grid;
  gap: 8px;
}

.gsc-snapshot-row {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 12px;
  padding: 10px 0;
  border-top: 1px solid #ebf0f5;
}

.gsc-snapshot-row:first-child {
  padding-top: 0;
  border-top: 0;
}

.gsc-snapshot-row-main {
  min-width: 0;
  display: grid;
  gap: 4px;
}

.gsc-snapshot-row-main strong {
  font-size: 14px;
  line-height: 1.35;
  word-break: break-word;
}

.gsc-snapshot-row-main span {
  color: var(--muted);
  font-size: 12px;
}

.gsc-page-label {
  font-family: var(--mono-font, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, Liberation Mono, monospace);
  font-size: 13px;
}

.gsc-snapshot-row-side {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 6px;
}

.gsc-stat-pill {
  display: inline-flex;
  align-items: center;
  padding: 4px 8px;
  border-radius: 999px;
  background: #eef4ff;
  color: #1655a2;
  font-size: 12px;
  font-weight: 700;
  white-space: nowrap;
}

.seo-setup-list {
  margin: 4px 0 0;
  padding-left: 18px;
  display: grid;
  gap: 6px;
}

.seo-setup-list li {
  color: var(--text);
  line-height: 1.45;
}

.seo-count-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin-top: -4px;
}

.seo-count-pill {
  display: inline-flex;
  align-items: center;
  padding: 3px 9px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 700;
}

.seo-count-pill-good {
  background: #e7f6ee;
  color: #136447;
}

.seo-count-pill-short,
.seo-count-pill-hint {
  background: #eef4ff;
  color: #1655a2;
}

.seo-count-pill-long,
.seo-count-pill-warn {
  background: #fff3d8;
  color: #8a5700;
}

.seo-count-pill-empty {
  background: #eef1f5;
  color: #5b6470;
}

.seo-aeo-panel {
  margin-top: 8px;
  gap: 8px;
}

.seo-aeo-item {
  padding: 9px 11px;
  border-radius: 4px;
  font-size: 13px;
  border: 1px solid #d7dee5;
  background: #fff;
}

.seo-aeo-item-good {
  border-color: #bfe3cf;
  background: #f4fbf7;
}

.seo-aeo-item-warn {
  border-color: #efd7aa;
  background: #fff9ee;
}

.seo-aeo-item-hint {
  border-color: #cfe0f6;
  background: #f5f9ff;
}

.admin-main > h1 {
  margin-bottom: 14px;
}

.admin-link-wrap {
  text-align: center;
  margin: 6px 0 20px;
}

.admin-link {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  color: var(--muted);
}

.assignment-child-nav {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 8px;
  min-width: 0;
}

.assignment-child-nav .chip.active {
  background: #1655a2;
  color: #fff;
  border-color: #1655a2;
}

.dcc-nav .chip {
  cursor: pointer;
}

.dcc-panel {
  display: grid;
  gap: 10px;
}

.dcc-preview-grid {
  display: grid;
  gap: 12px;
}

.dcc-preview-grid-hero {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.dcc-preview-card {
  display: grid;
  gap: 8px;
  padding: 14px;
  border: 1px solid #d7dee5;
  border-radius: var(--radius);
  background: linear-gradient(180deg, #fbfdff, #f4f8fc);
}

.dcc-preview-card strong {
  font-size: 14px;
}

.dcc-preview-card span {
  font-size: 13px;
  color: var(--muted);
  line-height: 1.45;
}

.dcc-hero-visual {
  min-height: 150px;
  padding: 12px;
  border: 1px dashed #cbd7e6;
  border-radius: 12px;
  background:
    linear-gradient(180deg, rgba(255,255,255,0.72), rgba(246,249,252,0.96)),
    radial-gradient(circle at top, rgba(73,129,215,0.1), transparent 58%);
}

.dcc-hero-visual-frame,
.dcc-page-card-visual,
.dcc-print-page-visual {
  height: 100%;
  border-radius: 12px;
  background: #fff;
  border: 1px solid #dde6ee;
  padding: 12px;
  box-shadow: 0 8px 24px rgba(29, 42, 54, 0.06);
}

.dcc-hero-visual-media,
.dcc-page-hero-visual,
.dcc-print-hero-visual {
  border-radius: 10px;
  background:
    linear-gradient(180deg, rgba(17,24,39,0.2), rgba(17,24,39,0.45)),
    linear-gradient(135deg, #b9c7d4 0%, #8295aa 100%);
}

.dcc-page-card-visual,
.dcc-print-page-visual {
  display: grid;
  grid-template-rows: auto 1fr;
  gap: 10px;
}

.dcc-page-hero-visual {
  width: calc(100% + 24px);
  margin: -12px -12px 0;
  border-radius: var(--radius) var(--radius) 0 0;
}

.dcc-page-hero-visual.is-borderless {
  border-radius: 0;
}

.dcc-print-page-visual {
  background: linear-gradient(180deg, rgba(255,255,255,0.95), rgba(252,252,252,0.98));
}

.dcc-page-copy-lines {
  display: grid;
  align-content: start;
  gap: 7px;
}

.dcc-page-copy-lines span {
  display: block;
  height: 8px;
  border-radius: 999px;
  background: #d8e2ec;
}

.dcc-page-copy-lines span:first-child {
  width: 72%;
}

.dcc-page-copy-lines span:last-child {
  width: 56%;
}

.dcc-addon-item {
  border: 1px solid #d7dee5;
  border-radius: var(--radius);
  background: #fff;
  padding: 10px;
}

.dcc-addon-item > summary {
  cursor: pointer;
  font-weight: 700;
  margin-bottom: 8px;
}

.dcc-addon-jump-wrap {
  align-items: center;
  gap: 10px;
}

.dcc-addon-jump-wrap label {
  margin: 0;
  font-weight: 700;
}

.addon-settings-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 10px;
}

.addon-settings-link {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  min-height: 48px;
  padding: 11px 12px;
  border: 1px solid #d7dee5;
  border-radius: var(--radius);
  background: #fff;
  color: var(--text);
  font-weight: 700;
}

.addon-settings-link:hover,
.addon-settings-link:focus-visible {
  border-color: #bfd0e4;
  background: #f8fbff;
}

.redirect-manager-form,
.redirect-grid,
.redirect-list {
  gap: 10px;
}

.redirect-card {
  margin-bottom: 0;
  padding: 10px;
}

.redirect-card-form {
  gap: 10px;
  margin-bottom: 8px;
}

.redirect-actions {
  justify-content: flex-end;
}

.compact-inline-form {
  align-items: center;
  gap: 8px;
}

.faq-item-card {
  padding: 12px 14px;
  margin-bottom: 12px;
}

.faq-item-card:last-of-type {
  margin-bottom: 0;
}

.faq-item-summary {
  display: flex;
  justify-content: space-between;
  align-items: start;
  gap: 12px;
  flex-wrap: wrap;
}

.faq-item-summary-copy {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.faq-item-summary strong {
  display: block;
  font-size: 16px;
  line-height: 1.35;
}

.faq-item-card.admin-expand summary {
  margin-bottom: 0;
}

.faq-item-card.admin-expand[open] summary {
  margin-bottom: 10px;
}

.faq-item-toolbar {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin-bottom: 10px;
}

.faq-order-actions {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  margin-bottom: 8px;
}

.faq-item-list {
  display: grid;
  gap: 12px;
}

.faq-item-toolbar form {
  margin: 0;
}

.faq-item-editor {
  gap: 10px;
}

.faq-item-editor .tox-tinymce {
  min-height: 260px;
}

.faq-item-actions {
  justify-content: flex-end;
  margin: 0;
}

.faq-item-summary-meta {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.faq-item-card {
  cursor: grab;
}

.faq-item-card.is-dragging {
  opacity: 0.55;
}

.chip-compact {
  min-height: 38px;
  padding: 6px 10px;
}

.submission-hub-list {
  gap: 10px;
}

.submission-hub-item {
  display: grid;
  gap: 8px;
}

.submission-hub-head {
  display: flex;
  justify-content: space-between;
  align-items: start;
  gap: 10px;
  flex-wrap: wrap;
}

.submission-hub-fields {
  display: grid;
  gap: 4px;
}

.submission-hub-fields p {
  margin: 0;
}

.dcc-addon-jump-wrap select {
  min-width: 220px;
  max-width: 100%;
}

.media-crop-modal-card {
  width: min(1100px, calc(100vw - 40px));
}

.media-crop-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.6fr) minmax(300px, 0.9fr);
  gap: 18px;
  align-items: start;
}

.media-crop-stage-wrap {
  border: 1px solid var(--border);
  border-radius: 18px;
  background:
    linear-gradient(135deg, rgba(15, 23, 42, 0.03), rgba(37, 99, 235, 0.06)),
    #f8fafc;
  padding: 16px;
  min-height: 420px;
}

.media-crop-stage {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 388px;
  border-radius: 14px;
  overflow: hidden;
  background:
    linear-gradient(45deg, rgba(148, 163, 184, 0.12) 25%, transparent 25%),
    linear-gradient(-45deg, rgba(148, 163, 184, 0.12) 25%, transparent 25%),
    linear-gradient(45deg, transparent 75%, rgba(148, 163, 184, 0.12) 75%),
    linear-gradient(-45deg, transparent 75%, rgba(148, 163, 184, 0.12) 75%);
  background-size: 22px 22px;
  background-position: 0 0, 0 11px, 11px -11px, -11px 0;
  touch-action: none;
  user-select: none;
  cursor: crosshair;
}

.media-crop-image {
  display: block;
  max-width: 100%;
  max-height: 72vh;
  width: auto;
  height: auto;
  border-radius: 12px;
  box-shadow: 0 24px 50px rgba(15, 23, 42, 0.14);
  pointer-events: none;
}

.media-crop-selection {
  position: absolute;
  z-index: 2;
  border: 2px solid #2563eb;
  border-radius: 12px;
  background: rgba(37, 99, 235, 0.14);
  box-shadow:
    0 0 0 9999px rgba(15, 23, 42, 0.34),
    inset 0 0 0 1px rgba(255, 255, 255, 0.82),
    0 12px 30px rgba(37, 99, 235, 0.18);
}

.media-crop-selection::before {
  content: "";
  position: absolute;
  inset: 10px;
  border: 1px dashed rgba(255, 255, 255, 0.95);
  border-radius: 8px;
}

.media-crop-handle {
  position: absolute;
  width: 18px;
  height: 18px;
  border-radius: 999px;
  background: #fff;
  border: 2px solid #2563eb;
  box-shadow: 0 8px 16px rgba(37, 99, 235, 0.2);
}

.media-crop-handle-nw {
  top: -10px;
  left: -10px;
  cursor: nwse-resize;
}

.media-crop-handle-n {
  top: -10px;
  left: calc(50% - 9px);
  cursor: ns-resize;
}

.media-crop-handle-ne {
  top: -10px;
  right: -10px;
  cursor: nesw-resize;
}

.media-crop-handle-e {
  top: calc(50% - 9px);
  right: -10px;
  cursor: ew-resize;
}

.media-crop-handle-s {
  bottom: -10px;
  left: calc(50% - 9px);
  cursor: ns-resize;
}

.media-crop-handle-w {
  top: calc(50% - 9px);
  left: -10px;
  cursor: ew-resize;
}

.media-crop-handle-sw {
  bottom: -10px;
  left: -10px;
  cursor: nesw-resize;
}

.media-crop-handle-se {
  right: -10px;
  bottom: -10px;
  cursor: nwse-resize;
}

.media-crop-controls {
  display: grid;
  gap: 14px;
  align-content: start;
}

.media-crop-controls .compact-field {
  gap: 8px;
}

.media-crop-controls .compact-field label {
  margin: 0;
}

.media-crop-meta {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
  padding: 12px 14px;
  border: 1px solid var(--border);
  border-radius: 14px;
  background: #f8fafc;
}

.media-crop-meta span {
  font-size: 14px;
  font-weight: 600;
  color: var(--muted);
}

.media-crop-presets {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

.media-crop-presets .media-crop-preset {
  border-style: dashed;
}

.media-crop-manual-grid {
  gap: 10px;
}

.media-crop-manual-grid input {
  min-width: 0;
}

.media-crop-selection {
  cursor: move;
}

.media-crop-save-btn {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  min-width: 160px;
}

.media-crop-save-spinner {
  display: none;
  width: 16px;
  height: 16px;
  border: 2px solid rgba(255, 255, 255, 0.35);
  border-top-color: #fff;
  border-radius: 999px;
  animation: mediaCropSpin .8s linear infinite;
}

.media-crop-layout.is-saving .media-crop-save-spinner {
  display: inline-block;
}

.media-crop-layout.is-saving .media-crop-save-btn {
  opacity: .92;
  pointer-events: none;
}

@keyframes mediaCropSpin {
  to {
    transform: rotate(360deg);
  }
}

@media (max-width: 1200px) {
  .admin-grid-2,
  .admin-grid-3,
  .admin-grid-4 {
    grid-template-columns: 1fr;
  }

  .newsletter-console-grid {
    grid-template-columns: 1fr;
  }

  .layout-builder-grid {
    grid-template-columns: 1fr;
  }

  .dashboard-onboarding {
    grid-template-columns: 1fr;
  }

  .db-usage-layout {
    grid-template-columns: 1fr;
  }

  .media-library-filters select {
    min-width: 0;
  }

  .gsc-snapshot-panels {
    grid-template-columns: 1fr;
  }

  .media-crop-layout {
    grid-template-columns: 1fr;
  }

  .media-crop-stage-wrap {
    min-height: 320px;
  }

  .media-crop-presets {
    flex-direction: column;
  }

  .card-head-inline {
    flex-wrap: wrap;
    align-items: flex-start;
  }

  .compact-jump-links {
    overflow-x: auto;
    flex-wrap: nowrap;
    padding-bottom: 4px;
  }

  .compact-jump-links .chip {
    white-space: nowrap;
  }

  .admin-layout {
    grid-template-columns: 220px 1fr;
  }
}

@media (max-width: 900px) {
  .dcc-preview-grid-hero {
    grid-template-columns: 1fr;
  }

  .dashboard-three-col {
    grid-template-columns: 1fr;
  }

  .db-usage-chart-card {
    min-height: 220px;
  }

  .db-usage-chart {
    width: min(200px, 100%);
  }

  .gsc-snapshot-head,
  .gsc-snapshot-row {
    flex-direction: column;
  }

  .gsc-snapshot-actions,
  .gsc-snapshot-row-side {
    justify-content: flex-start;
  }

  .page-admin-layout {
    grid-template-columns: 1fr;
  }

  .admin-sidebar-toggle {
    position: fixed;
    top: 10px;
    left: 10px;
    z-index: 40;
    width: auto;
    background: #fff;
  }

  .page-list-panel,
  .page-list-panel[open],
  .page-editor,
  .admin-edit,
  .compact-field,
  .media-picker-control {
    min-width: 0;
  }

  .editor-action-bar {
    position: sticky;
    top: 62px;
  }

  .page-list-panel {
    max-width: none;
  }

  .page-list-panel[data-mobile-sheet][open] {
    position: fixed;
    inset: 76px 14px 14px;
    z-index: 70;
    max-width: none;
    overflow: auto;
    box-shadow: 0 20px 48px rgba(15, 23, 42, 0.24);
  }

  .page-list-panel[data-mobile-sheet][open] + .page-list-panel-backdrop {
    display: block;
    position: fixed;
    inset: 0;
    z-index: 60;
    background: rgba(15, 23, 42, 0.35);
  }

  .page-list-meta .status-badge {
    width: fit-content;
  }

  .page-list-child {
    margin-left: 0;
  }

  .menu-sort-item,
  .nav-menu-flags {
    align-items: flex-start;
  }

  .newsletter-admin-monitor {
    left: 12px;
    bottom: 12px;
    width: auto;
  }

  .media-library-toolbar {
    padding: 10px;
  }

  .media-library-filters {
    align-items: stretch;
  }

  .media-library-card .media-grid.media-list .media-card,
  .media-form-uploads-card .media-grid.media-list .media-card {
    grid-template-columns: 1fr;
    justify-items: start;
  }
}

@media (max-width: 1100px) {
  .gallery-admin-intro {
    grid-template-columns: 1fr;
  }

  .admin-layout {
    grid-template-columns: 1fr;
  }

  .admin-sidebar-toggle {
    position: fixed;
    top: 10px;
    left: 10px;
    z-index: 40;
    width: auto;
    background: #fff;
  }

  .admin-sidebar {
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    width: min(84vw, 280px);
    z-index: 30;
    transform: translateX(-105%);
    transition: transform 0.2s ease;
    overflow-y: auto;
  }

  .admin-layout.sidebar-open .admin-sidebar {
    transform: translateX(0);
  }

  .admin-main {
    padding-top: 56px;
  }
}

.admin-sidebar-toggle {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.segmented-control {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 4px;
  border-radius: 999px;
  background: linear-gradient(90deg, #1f9ad7 0%, #245d9d 100%);
  box-shadow: inset 0 0 0 1px rgba(16, 41, 69, 0.2);
}

.segmented-option {
  border: 0;
  background: transparent;
  color: rgba(255, 255, 255, 0.68);
  padding: 9px 18px;
  border-radius: 999px;
  cursor: pointer;
  font-size: 14px;
  line-height: 1;
  font-weight: 800;
  letter-spacing: -0.02em;
  min-width: 96px;
}

.segmented-option.active,
.segmented-option[aria-selected="true"] {
  background: #2ee0d2;
  color: #08131f;
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.4) inset;
}
