@media screen {
  .crm-ui .catalog-workspace { display: grid; grid-template-columns: 248px minmax(0, 1fr); gap: 0; min-height: 0; align-items: start; overflow: visible; background: var(--surface-data, #f9fafc); border: 1px solid var(--border, #d7dfe8); border-radius: 20px; }
  .crm-ui .catalog-workspace .co-category-panel { width: auto; min-width: 0; padding: 12px; background: transparent; border: 0; border-right: 1px solid #dce3eb; border-radius: 0; }
  .crm-ui .catalog-workspace .co-catalog-main { min-width: 0; padding: 12px; background: transparent; border: 0; }
  .crm-ui .catalog-workspace .co-table-scroll { min-height: 0; max-height: none; background: #fff; border: 1px solid #e0e6ed; border-radius: 12px; }
  .crm-ui .catalog-workspace .co-table { width: 100%; table-layout: auto; }
  .crm-ui .catalog-workspace [data-catalog-column="name"] { min-width: 240px; width: 45%; white-space: normal; }
  .crm-ui .catalog-workspace [data-catalog-column="image"] { width: 76px; }
  .crm-ui .catalog-workspace .co-pagination { position: static; padding: 12px 0 0; background: transparent; }
  .crm-ui .catalog-workspace .co-toolbar { height: auto; min-height: 44px; flex-wrap: wrap; }
  .crm-ui .co-service-drawer .co-form-footer [data-co="cancel"], .crm-ui .co-product-drawer .co-form-footer [data-co="cancel"] { display: inline-flex; }
  .crm-ui .co-service-drawer { width: min(900px, 100vw); }
  .crm-ui .co-service-drawer .co-field textarea[name="name"] { min-height: 44px; height: 64px; }
  .crm-ui .co-category-head { font-size: 12px; }
  .crm-ui .co-category { min-height: 40px; border-radius: 10px; }
  .crm-ui .co-category-name { white-space: normal; overflow-wrap: anywhere; }
  .crm-ui .co-product-drawer .co-form-body { display: block; }
  .crm-ui .co-product-primary { display: grid; grid-template-columns: minmax(0, 1fr) 230px; gap: 24px; margin-bottom: 24px; }
  .crm-ui .co-product-photo { width: auto; max-width: 100%; align-self: start; padding: 16px; background: #f0f4f8; border-radius: 16px; }
  .crm-ui .co-product-photo input[type="file"] { width: 100%; min-width: 0; font-size: 12px; padding: 8px; }
  .crm-ui .co-product-photo .co-photo-native { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; opacity: 0; }
  .crm-ui .co-product-photo .co-photo-choose { width: 100%; white-space: normal; min-height: 44px; }
  .crm-ui .co-product-photo p { font-size: 12px; line-height: 1.5; color: #536173; }
  .crm-ui .co-product-fields { min-width: 0; width: auto; }
  .crm-ui .co-form-section { min-width: 0; padding: 16px; margin-bottom: 16px; border: 1px solid #dfe6ef; border-radius: 16px; background: #fff; }
  .crm-ui .co-form-section > h3 { margin: 0 0 16px; font-size: 16px; }
  .crm-ui .co-form-section .co-field { display: grid; grid-template-columns: 1fr; gap: 6px; margin-bottom: 14px; }
  .crm-ui .co-form-section .co-field > span { width: auto; text-align: left; font-size: 13px; color: #445264; }
  .crm-ui .co-form-section .co-field > div { min-width: 0; }
  .crm-ui .co-product-photo .co-field { display: block; }
  .crm-ui .co-product-photo [data-product-photos] { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .crm-ui .co-service-primary { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
  .crm-ui .co-service-primary > :last-child { grid-column: 1 / -1; }
  .crm-ui .co-service-primary .co-price-table { width: 100%; }
  .crm-ui .co-service-primary .co-inline { flex-wrap: wrap; }
  .crm-ui .co-service-drawer .co-segments { display: inline-flex; flex-wrap: wrap; gap: 4px; padding: 4px; border-radius: 12px; background: #edf1f6; }
  .crm-ui .co-service-drawer .co-segments label { display: inline-flex; align-items: center; justify-content: center; min-height: 40px; padding: 8px 12px; border: 1px solid transparent; border-radius: 8px; box-shadow: none; background: transparent; }
  .crm-ui .co-service-drawer .co-segments label:has(input:checked) { color: #075cbe; border-color: #c5d1e0; background: #fff; }
  .crm-ui .co-service-drawer .co-inline { gap: 8px; align-items: center; flex-wrap: wrap; }
  .crm-ui .co-bundle-drawer { width: min(980px, calc(100vw - 32px)); }
  .crm-ui .co-bundle-drawer #co-components { border: 1px solid #dce3eb; border-radius: 12px; margin: 16px 0; overflow-x: auto; }
  .crm-ui .co-bundle-drawer .co-empty { min-height: 120px; padding: 24px; }
  .crm-ui .co-bundle-drawer .co-empty svg { width: 70px; height: 45px; }
  .crm-ui .co-bundle-extras { border-top: 1px solid #dce3eb; padding-top: 16px; }
  .crm-ui .co-bundle-extras > summary { cursor: pointer; padding: 12px 0; font-weight: 600; }
  .crm-ui .co-metrics { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
  .crm-ui .co-metric { min-height: 140px; padding: 20px; }
  .crm-ui .co-metric p { font-size: 14px; line-height: 1.4; }
  .crm-ui .co-metric strong { font-size: clamp(24px, 2vw, 34px); line-height: 1.3; overflow-wrap: anywhere; }
  .crm-ui .co-metric small { font-size: 12px; line-height: 1.5; }
  .crm-ui .co-charts { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .crm-ui .co-donut { width: 180px; height: 180px; max-width: 100%; }
  .crm-ui .co-chart { min-width: 0; }
  .crm-ui .co-bars { max-width: 580px; }
  .crm-ui .co-bars > div { display: block; margin: 16px 0; }
  .crm-ui .co-bars > div > span { display: block; width: auto; max-width: 100%; white-space: normal; margin-bottom: 6px; }
  .crm-ui .co-bars i { display: block; min-height: 26px; }
  .crm-ui .co-flow-pair { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
  .crm-ui .co-series { min-width: 0; }
  .crm-ui .co-series h4 { margin: 8px 0; font-size: 14px; }
  .crm-ui .co-series .co-flow-svg { height: auto; width: 100%; }
  .crm-ui .co-schedule-scroll { max-width: 100%; overflow: auto; border: 1px solid #d6e0eb; border-radius: 16px; background: #fff; max-height: 65vh; }
  .crm-ui .co-schedule { min-width: max-content; font-size: 14px; }
  .crm-ui .co-schedule td { min-width: max(100px, var(--cell)); height: 76px; padding: 12px; }
  .crm-ui .co-schedule th { min-width: max(100px, var(--cell)); height: 48px; padding: 12px; font-size: 13px; background: #f0f4f9; }
  .crm-ui .co-schedule tr > th:first-child { min-width: 220px; max-width: 260px; position: sticky; left: 0; z-index: 2; white-space: normal; }
  .crm-ui .co-schedule thead th { position: sticky; top: 0; z-index: 3; }
  .crm-ui .co-schedule thead th:first-child { z-index: 4; }
  .crm-ui .co-schedule-tools { flex-wrap: wrap; gap: 12px; }
  @media (max-width: 1100px) {
    .crm-ui .co-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .crm-ui .co-charts { grid-template-columns: 1fr; }
  }
  @media (max-width: 760px) {
    .crm-ui .catalog-workspace { grid-template-columns: 1fr; }
    .crm-ui .catalog-workspace .co-category-panel { max-height: 240px; overflow: auto; border-right: 0; border-bottom: 1px solid #dce3eb; }
    .crm-ui .co-product-primary, .crm-ui .co-service-primary, .crm-ui .co-flow-pair { grid-template-columns: 1fr; }
    .crm-ui .co-product-photo { width: 100%; }
    .crm-ui .co-metric { padding: 14px; min-height: 130px; }
    .crm-ui .co-metric strong { font-size: 24px; }
    .crm-ui .co-schedule tr > th:first-child { min-width: 140px; max-width: 160px; }
    .crm-ui .co-schedule-bottom { flex-wrap: wrap; }
  }
}

@media screen {
  .crm-ui .co-metric-heading { margin: 16px 0 8px; font-size: 15px; color: #526276; }
  .crm-ui .co-daily-metrics, .crm-ui .co-current-metrics { gap: 12px; }
  .crm-ui .co-daily-metrics .co-metric, .crm-ui .co-current-metrics .co-metric { min-height: 108px; padding: 14px 16px; }
  .crm-ui .co-balance-summary { margin: 16px 0; }
  .crm-ui .co-balance-summary .co-metric { display: grid; grid-template-columns: auto auto 1fr; align-items: center; gap: 12px 24px; min-height: 0; padding: 14px 16px; }
  .crm-ui .co-balance-summary .co-metric p, .crm-ui .co-balance-summary .co-metric strong, .crm-ui .co-balance-summary .co-metric small { margin: 0; }
  .crm-ui .co-balance-summary .co-metric strong { font-size: 24px; }
  .crm-ui .co-balance-summary .co-metric small { text-align: right; }
}
@media screen and (max-width: 760px) {
  .crm-ui .co-balance-summary .co-metric { grid-template-columns: 1fr; gap: 6px; }
  .crm-ui .co-balance-summary .co-metric small { text-align: left; }
}

/* Validation details remain readable without horizontal scrolling. */
.crm-ui .co-import-issues { display: grid; gap: 12px; margin-top: 12px; }
.crm-ui .co-import-issue { min-width: 0; padding: 12px; border: 1px solid #dfacb4; border-radius: 12px; background: #fff8f9; overflow-wrap: anywhere; }
.crm-ui .co-import-issue h4, .crm-ui .co-import-issue p { margin: 0 0 8px; }
.crm-ui .co-import-issue dl { margin: 0; }
.crm-ui .co-import-issue dl > div { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 12px; padding: 3px 0; }
.crm-ui .co-import-issue dd { min-width: 0; margin: 0; }