@layer components {
  .cx-field { display: grid; gap: .4rem; min-width: 0; }
  .cx-label { font-weight: 850; color: var(--cx-text); }
  .cx-help { color: var(--cx-muted); font-size: .88rem; }
  .cx-input,
  .cx-select,
  .cx-textarea {
    inline-size: 100%;
    min-height: var(--cx-control-height, 44px);
    border: 1px solid var(--cx-control-border, var(--cx-border));
    border-radius: var(--cx-radius-md);
    background: var(--cx-control-bg, var(--cx-surface));
    color: var(--cx-text);
    padding: .7rem .85rem;
    transition: border-color var(--cx-transition), box-shadow var(--cx-transition), background var(--cx-transition);
  }
  .cx-textarea { min-height: 96px; resize: vertical; }
  .cx-input:hover,
  .cx-select:hover,
  .cx-textarea:hover { border-color: color-mix(in srgb, var(--cx-brand-accent) 30%, var(--cx-control-border, var(--cx-border))); }
  .cx-input:focus,
  .cx-select:focus,
  .cx-textarea:focus { outline: 0; border-color: var(--cx-brand-accent); box-shadow: 0 0 0 4px var(--cx-focus); }
  .cx-field[data-invalid="true"] .cx-input,
  .cx-field[data-invalid="true"] .cx-select,
  .cx-field[data-invalid="true"] .cx-textarea,
  .cx-input[aria-invalid="true"],
  .cx-select[aria-invalid="true"],
  .cx-textarea[aria-invalid="true"] { border-color: var(--cx-sem-loss); box-shadow: 0 0 0 4px var(--cx-sem-loss-soft); }
  .cx-validation-message { color: var(--cx-sem-loss); font-size: .82rem; font-weight: 850; }
  .cx-required-mark { color: var(--cx-sem-loss); margin-inline-start: .2rem; }
  .cx-form-stack { display: grid; gap: var(--cx-space-4); }
  .cx-form-error { padding: .85rem 1rem; border: 1px solid rgba(180,35,24,.24); border-radius: var(--cx-radius-md); background: rgba(180,35,24,.08); color: var(--cx-danger); font-weight: 850; }
  .cx-icon-text { display: inline-flex; align-items: center; gap: .45rem; }

  .cx-search { position: relative; display: flex; align-items: center; min-height: var(--cx-control-height); min-width: min(100%, 220px); }
  .cx-search::before { content: '⌕'; position: absolute; inset-inline-start: .85rem; color: var(--cx-muted); font-weight: 900; pointer-events: none; }
  [dir="rtl"] .cx-search::before { inset-inline-start: auto; inset-inline-end: .85rem; }
  .cx-search .cx-input,
  .cx-search-input { inline-size: 100%; padding-inline-start: 2.35rem; padding-inline-end: 2.4rem; direction: rtl; }
  [dir="rtl"] .cx-search .cx-input,
  [dir="rtl"] .cx-search-input { padding-inline-start: 2.4rem; padding-inline-end: 2.35rem; }
  .cx-search-clear { position: absolute; inset-inline-end: .45rem; inline-size: 2rem; block-size: 2rem; border: 0; border-radius: 999px; background: transparent; color: var(--cx-muted); display: grid; place-items: center; cursor: pointer; }
  [dir="rtl"] .cx-search-clear { inset-inline-end: auto; inset-inline-start: .45rem; }
  .cx-search-clear:hover { background: var(--cx-sem-neutral-soft); color: var(--cx-text); }
  .cx-search[data-loading="true"]::after { content: ''; position: absolute; inset-inline-end: .86rem; inline-size: 1rem; block-size: 1rem; border: 2px solid var(--cx-brand-soft); border-block-start-color: var(--cx-brand-strong); border-radius: 999px; animation: cx-spin 800ms linear infinite; }
  [dir="rtl"] .cx-search[data-loading="true"]::after { inset-inline-end: auto; inset-inline-start: .86rem; }

  .cx-filter-panel,
  .cx-filter-bar {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
    gap: var(--cx-space-4);
    align-items: end;
    border: 1px solid var(--cx-border);
    border-radius: var(--cx-radius-lg);
    background: var(--cx-table-toolbar-bg);
    padding: var(--cx-space-4);
    box-shadow: var(--cx-shadow-soft);
  }
  .cx-filter-bar .cx-search { min-width: 0; }
  .cx-filter-actions { display: flex; align-items: center; justify-content: flex-end; gap: .75rem; flex-wrap: wrap; }
  .cx-no-results { border: 1px dashed var(--cx-border); border-radius: var(--cx-radius-lg); padding: var(--cx-space-5); background: var(--cx-sem-neutral-soft); color: var(--cx-muted); text-align: center; font-weight: 850; }
  .cx-pagination-size .cx-select,
  .cx-pagination-size select { min-width: 86px; text-align: center; font-weight: 900; }

  .cx-scope-filter-card {
    margin-block-end: var(--cx-space-5);
    border: 1px solid color-mix(in srgb, var(--cx-brand-accent) 16%, var(--cx-border));
    border-radius: var(--cx-radius-xl);
    background: var(--cx-panel-bg);
    box-shadow: var(--cx-shadow-soft);
    overflow: visible;
  }
  .cx-scope-filter { display: grid; gap: var(--cx-space-3); padding: var(--cx-space-4); overflow: visible; }
  .cx-scope-filter-fields {
    display: grid;
    grid-template-columns: minmax(270px, 1.5fr) minmax(150px, .85fr) minmax(150px, .85fr) minmax(150px, .85fr) minmax(150px, .85fr);
    gap: var(--cx-space-3);
    align-items: end;
    inline-size: 100%;
  }
  .cx-scope-filter-fields > * { min-width: 0; }
  .cx-scope-field .cx-label,
  .cx-scope-field-label { color: var(--cx-text); font-size: .84rem; font-weight: 950; }
  .cx-scope-filter-actions {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: .65rem;
    flex-wrap: wrap;
    padding-block-start: .85rem;
    border-block-start: 1px solid color-mix(in srgb, var(--cx-border) 72%, transparent);
  }
  .cx-scope-filter-actions .cx-btn { min-inline-size: 112px; min-height: var(--cx-control-height); }
  .cx-scope-filter-meta { margin-inline-start: auto; color: var(--cx-muted); font-size: .84rem; font-weight: 850; }
  .cx-scope-operational-day { color: var(--cx-brand-strong); }

  .cx-branch-multiselect { position: relative; align-self: end; min-width: 0; border: 0; background: transparent; overflow: visible; }
  .cx-branch-multiselect summary::-webkit-details-marker { display: none; }
  .cx-branch-trigger {
    list-style: none;
    min-height: var(--cx-control-height);
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: .75rem;
    cursor: pointer;
    border: 1px solid var(--cx-control-border);
    border-radius: var(--cx-radius-md);
    background: var(--cx-control-bg);
    color: var(--cx-text);
    padding: .62rem .85rem;
    transition: border-color var(--cx-transition), box-shadow var(--cx-transition), background var(--cx-transition);
  }
  .cx-branch-trigger:hover,
  .cx-branch-multiselect[open] .cx-branch-trigger { border-color: color-mix(in srgb, var(--cx-brand-accent) 48%, var(--cx-control-border)); box-shadow: 0 0 0 4px var(--cx-focus); }
  .cx-branch-trigger strong { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--cx-brand-strong); font-size: .94rem; font-weight: 950; text-align: start; }
  .cx-branch-trigger i { color: var(--cx-brand-strong); font-style: normal; transition: transform var(--cx-transition); }
  .cx-branch-multiselect[open] .cx-branch-trigger i { transform: rotate(180deg); }
  .cx-branch-menu {
    position: absolute;
    inset-inline-start: 0;
    inset-block-start: calc(100% + .5rem);
    z-index: 90;
    inline-size: min(380px, calc(100vw - 2rem));
    max-block-size: 390px;
    overflow: auto;
    border: 1px solid color-mix(in srgb, var(--cx-brand-accent) 22%, var(--cx-border));
    border-radius: var(--cx-radius-xl);
    background: var(--cx-panel-bg);
    color: var(--cx-text);
    box-shadow: 0 24px 70px rgba(36, 16, 102, .20);
    padding: .7rem;
  }
  [data-theme="dark"] .cx-branch-menu { box-shadow: 0 26px 80px rgba(0,0,0,.48); }
  .cx-branch-menu-head { padding: .45rem .55rem .7rem; color: var(--cx-muted); font-weight: 950; font-size: .83rem; }
  .cx-branch-list { display: grid; gap: .35rem; padding-block: .35rem; border-block: 1px solid var(--cx-border); margin-block: .35rem; }
  .cx-branch-option { position: relative; display: grid; grid-template-columns: 1.4rem minmax(0, 1fr); align-items: center; gap: .7rem; min-height: 42px; border: 1px solid transparent; border-radius: var(--cx-radius-md); padding: .5rem .6rem; background: transparent; color: var(--cx-text); cursor: pointer; font-weight: 850; transition: background var(--cx-transition), border-color var(--cx-transition), color var(--cx-transition); }
  .cx-branch-option:hover { background: color-mix(in srgb, var(--cx-brand-soft) 62%, transparent); border-color: color-mix(in srgb, var(--cx-brand-accent) 18%, transparent); }
  .cx-branch-option.is-selected { background: linear-gradient(135deg, rgba(91,26,163,.11), rgba(216,59,190,.10)); border-color: rgba(216,59,190,.28); color: var(--cx-brand-strong); }
  .cx-branch-option input { position: absolute; opacity: 0; pointer-events: none; }
  .cx-branch-check { inline-size: 1.08rem; block-size: 1.08rem; border-radius: 999px; border: 2px solid color-mix(in srgb, var(--cx-muted) 36%, transparent); background: var(--cx-surface); display: inline-grid; place-items: center; }
  .cx-branch-option.is-selected .cx-branch-check { border-color: var(--cx-brand-accent); background: linear-gradient(135deg, var(--cx-brand-secondary), var(--cx-brand-accent)); box-shadow: 0 0 0 4px color-mix(in srgb, var(--cx-brand-accent) 14%, transparent); }
  .cx-branch-option.is-selected .cx-branch-check::after { content: '✓'; color: #fff; font-size: .72rem; font-weight: 1000; line-height: 1; }
  .cx-branch-name { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .cx-branch-help { color: var(--cx-muted); font-size: .76rem; line-height: 1.7; padding: .35rem .55rem .15rem; }

  @media (max-width: 1180px) {
    .cx-scope-filter-fields { grid-template-columns: minmax(240px, 1.2fr) repeat(2, minmax(140px, 1fr)); }
  }
  @media (max-width: 760px) {
    .cx-filter-bar { grid-template-columns: 1fr; }
    .cx-filter-actions { justify-content: stretch; }
    .cx-filter-actions .cx-btn { flex: 1 1 auto; }
    .cx-scope-filter { padding: var(--cx-space-3); }
    .cx-scope-filter-fields { grid-template-columns: 1fr; }
    .cx-scope-filter-actions { justify-content: stretch; }
    .cx-scope-filter-actions .cx-btn { flex: 1 1 120px; }
    .cx-scope-filter-meta { margin-inline-start: 0; inline-size: 100%; }
    .cx-branch-menu { inline-size: 100%; max-inline-size: none; }
  }
}


/* B-Design-1 — Form/control contract tokens. */
@layer components {
  .cx-field,
  .cx-input,
  .cx-select,
  .cx-textarea,
  .cx-form-control {
    background: var(--cx-field-bg);
    border-color: var(--cx-field-border);
    color: var(--cx-field-text);
    border-radius: var(--cx-field-radius);
  }
  .cx-field:focus-within,
  .cx-input:focus,
  .cx-select:focus,
  .cx-textarea:focus,
  .cx-form-control:focus {
    outline: none;
    box-shadow: var(--cx-focus-ring);
    border-color: var(--cx-border-strong);
  }
  .cx-filter-bar,
  .cx-form-panel {
    background: var(--cx-surface-panel);
    border: 1px solid var(--cx-border-soft);
    border-radius: var(--cx-radius-lg);
  }
}

/* B4.11-E — Unified Multi Filter UI: reusable checkbox dropdowns for scope extra filters. */
.cx-scope-multiselect { position: relative; align-self: end; min-width: 0; border: 0; background: transparent; overflow: visible; }
.cx-scope-multiselect summary::-webkit-details-marker { display: none; }
.cx-scope-multiselect[open] .cx-scope-multi-trigger { border-color: color-mix(in srgb, var(--cx-brand-accent) 48%, var(--cx-control-border)); box-shadow: 0 0 0 4px var(--cx-focus); }
.cx-scope-multiselect[open] .cx-scope-multi-trigger i { transform: rotate(180deg); }
.cx-scope-multi-trigger { grid-template-columns: auto minmax(0, 1fr) auto; }
.cx-scope-multi-menu { inline-size: min(340px, calc(100vw - 2rem)); }
.cx-scope-choice-list { max-block-size: 235px; overflow: auto; }
.cx-scope-choice-option { user-select: none; }
.cx-scope-choice-option input { position: absolute; opacity: 0; pointer-events: none; }

/* B4.12-I — Unified Filter Design System: all scope filters use the modern dropdown contract. */
@layer components {
  .cx-scope-choice,
  .cx-scope-multiselect,
  .cx-scope-filter-branch,
  .cx-table-page-size-choice {
    inline-size: 100%;
  }

  .cx-scope-choice summary::-webkit-details-marker,
  .cx-table-page-size-choice summary::-webkit-details-marker { display: none; }

  .cx-scope-choice[open] .cx-scope-choice-trigger,
  .cx-table-page-size-choice[open] .cx-table-page-size-trigger {
    border-color: color-mix(in srgb, var(--cx-brand-accent) 48%, var(--cx-control-border));
    box-shadow: 0 0 0 4px var(--cx-focus);
  }

  .cx-scope-choice[open] .cx-scope-choice-trigger i,
  .cx-table-page-size-choice[open] .cx-table-page-size-trigger i { transform: rotate(180deg); }

  .cx-scope-choice-trigger,
  .cx-table-page-size-trigger,
  .cx-scope-multi-trigger,
  .cx-branch-trigger {
    background:
      radial-gradient(circle at 10% 15%, color-mix(in srgb, var(--cx-brand-accent) 8%, transparent), transparent 26%),
      var(--cx-control-bg);
  }

  .cx-scope-choice-menu,
  .cx-table-page-size-menu {
    inline-size: min(340px, calc(100vw - 2rem));
    padding: .65rem;
  }

  .cx-table-page-size-menu { inline-size: min(180px, calc(100vw - 2rem)); }

  .cx-scope-choice-list { border-block: 0; margin-block: 0; padding-block: 0; max-block-size: 250px; overflow: auto; }

  button.cx-scope-choice-option,
  button.cx-table-page-size-option {
    border: 1px solid transparent;
    inline-size: 100%;
    font: inherit;
    text-align: start;
  }

  .cx-scope-choice-option[aria-selected="true"] { background: linear-gradient(135deg, rgba(91,26,163,.11), rgba(216,59,190,.10)); border-color: rgba(216,59,190,.28); color: var(--cx-brand-strong); }

  .cx-scope-input-field .cx-input,
  .cx-scope-field > .cx-input,
  .cx-scope-field > .cx-select,
  .cx-pagination-size .cx-input,
  .cx-pagination-size .cx-select {
    min-height: var(--cx-control-height);
    border-radius: var(--cx-radius-md);
    border-color: var(--cx-control-border);
    background:
      radial-gradient(circle at 10% 15%, color-mix(in srgb, var(--cx-brand-accent) 6%, transparent), transparent 30%),
      var(--cx-control-bg);
    font-weight: 850;
  }

  .cx-pagination-size {
    display:inline-flex;
    align-items:center;
    gap:.32rem;
    inline-size:auto;
    min-width:0;
    white-space:nowrap;
  }

  .cx-pagination-size .cx-table-page-size-choice { inline-size:auto; min-inline-size:58px; max-inline-size:72px; flex:0 0 auto; }
  .cx-pagination-size .cx-table-page-size-trigger { min-height:34px; padding:.32rem .48rem; display:flex; align-items:center; justify-content:center; gap:.32rem; }
  .cx-pagination-size .cx-table-page-size-trigger strong { min-inline-size:2ch; text-align:center; font-weight:1000; font-variant-numeric:tabular-nums; }

  .cx-table-toolbar .cx-pagination-size,
  .reports-table-toolbar .cx-pagination-size { align-items: center; }

  .cx-filter-bar .cx-field,
  .cx-scope-filter-fields .cx-field { align-self: end; }
}

.cx-scope-choice-option.is-disabled {
  opacity: .58;
  pointer-events: none;
}

/* Opt-in Backoffice filter rail; the existing form remains the single scope owner. */
.cx-scope-rail-host .cx-scope-rail-toolbar { display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:.75rem 1rem; }
.cx-scope-rail-toolbar > span { color:var(--cx-muted); font-size:.85rem; overflow-wrap:anywhere; }
dialog.cx-scope-rail { box-sizing:border-box; position:fixed; inset:0 auto 0 0; margin:0; padding:0; width:min(420px, 100vw); max-width:100vw; height:100dvh; max-height:100dvh; border:0; border-inline-start:1px solid var(--cx-border); border-radius:0; background:var(--cx-surface, #fff); color:var(--cx-text); box-shadow:var(--cx-shadow-card); overflow:hidden; }
dialog.cx-scope-rail[open] { display:flex; flex-direction:column; }
dialog.cx-scope-rail::backdrop { background:rgb(20 12 35 / 35%); }
.cx-scope-rail-header { display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:1rem 1.25rem; border-bottom:1px solid var(--cx-border); }
.cx-scope-rail-header h2 { margin:0; font-size:1.1rem; }
dialog.cx-scope-rail .cx-scope-filter { display:flex; flex:1; flex-direction:column; min-height:0; padding:0; margin:0; border:0; border-radius:0; box-shadow:none; background:transparent; }
dialog.cx-scope-rail .cx-scope-filter-fields { display:flex; flex:1; flex-direction:column; gap:1rem; padding:1.25rem; min-height:0; overflow:auto; align-items:stretch; }
dialog.cx-scope-rail .cx-scope-field, dialog.cx-scope-rail .cx-scope-filter-branch { flex:none; width:100%; min-width:0; }
dialog.cx-scope-rail .cx-scope-filter-actions { display:flex; flex-wrap:wrap; gap:.5rem; padding:1rem; border-top:1px solid var(--cx-border); background:var(--cx-surface, #fff); }
dialog.cx-scope-rail .cx-scope-filter-actions .cx-scope-filter-meta { flex-basis:100%; }

/* 2026-09 Dropdown fit contract — shared filter lists stay above page content and within viewport. */
@layer components {
  .cx-branch-menu,
  .cx-scope-multi-menu,
  .cx-scope-choice-menu,
  .cx-table-page-size-menu {
    z-index: var(--cx-z-dropdown, 300);
    max-block-size: min(390px, calc(var(--cx-viewport-block, 100dvh) - 2rem));
    overflow: auto;
    overscroll-behavior: contain;
  }
  .cx-scope-filter-card, .cx-scope-filter, .cx-filter-bar, .cx-field { min-width: 0; }
}


/* 2026-09 Global list/dropdown usability contract — one scroll owner, no nested wheel traps. */
@layer components {
  .cx-branch-menu,.cx-scope-multi-menu,.cx-scope-choice-menu,.cx-table-page-size-menu{overflow:hidden;overscroll-behavior:contain;scrollbar-gutter:stable}
  .cx-branch-menu>.cx-branch-list,.cx-scope-multi-menu>.cx-scope-choice-list,.cx-scope-choice-menu>.cx-scope-choice-list,.cx-table-page-size-menu>.cx-scope-choice-list,[role="listbox"].cx-picker-results,.inventory-suggestion-list,.cx-customer-search-results{max-block-size:min(300px,calc(var(--cx-viewport-block,100dvh) - 9rem));overflow:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;touch-action:pan-y;scrollbar-gutter:stable;scrollbar-width:thin;scrollbar-color:var(--cx-scroll-thumb) transparent}
  .cx-branch-menu>.cx-branch-list::-webkit-scrollbar,.cx-scope-choice-list::-webkit-scrollbar,.cx-picker-results::-webkit-scrollbar,.inventory-suggestion-list::-webkit-scrollbar,.cx-customer-search-results::-webkit-scrollbar{width:9px;height:9px}
  .cx-branch-menu>.cx-branch-list::-webkit-scrollbar-thumb,.cx-scope-choice-list::-webkit-scrollbar-thumb,.cx-picker-results::-webkit-scrollbar-thumb,.inventory-suggestion-list::-webkit-scrollbar-thumb,.cx-customer-search-results::-webkit-scrollbar-thumb{background:var(--cx-scroll-thumb);border:2px solid transparent;background-clip:padding-box;border-radius:999px}
  :where(.cx-card,.cx-kpi,.cx-page-header,.cx-semantic-card,.cx-card-body,.cx-filter-bar,.cx-scope-filter-card):has(.cx-branch-multiselect[open],.cx-picker-results:not([hidden])){overflow:visible;z-index:var(--cx-z-popover,500)}
  .cx-field:has(>>.cx-branch-multiselect[open]){z-index:var(--cx-z-popover,500)}
}

/* 2026-09-13 — Floating dropdown geometry for modal/table pagers.
   Keeps row-count and legacy select menus out of scroll containers. */
@layer components {
  .cx-branch-multiselect[data-cx-floating-dropdown] > :where(.cx-branch-menu, .cx-scope-choice-menu, .cx-scope-multi-menu, .cx-table-page-size-menu),
  details[data-cx-floating-dropdown] > :where(.cx-branch-menu, .cx-scope-choice-menu, .cx-scope-multi-menu, .cx-table-page-size-menu) {
    position: fixed !important;
    inset: auto !important;
    inset-inline-start: auto !important;
    inset-block-start: auto !important;
    left: var(--cx-dropdown-left, 1rem) !important;
    top: var(--cx-dropdown-top, 1rem) !important;
    inline-size: var(--cx-dropdown-width, min(340px, calc(100vw - 2rem))) !important;
    max-inline-size: calc(100vw - 20px) !important;
    max-block-size: var(--cx-dropdown-max-height, min(320px, calc(100dvh - 2rem))) !important;
    z-index: var(--cx-z-dropdown-floating, 2200) !important;
    overflow: hidden !important;
  }
  .cx-branch-multiselect[data-cx-floating-dropdown] > :where(.cx-branch-menu, .cx-scope-choice-menu, .cx-scope-multi-menu, .cx-table-page-size-menu) > .cx-branch-list,
  .cx-branch-multiselect[data-cx-floating-dropdown] > :where(.cx-branch-menu, .cx-scope-choice-menu, .cx-scope-multi-menu, .cx-table-page-size-menu) > .cx-scope-choice-list,
  details[data-cx-floating-dropdown] > :where(.cx-branch-menu, .cx-scope-choice-menu, .cx-scope-multi-menu, .cx-table-page-size-menu) > .cx-branch-list,
  details[data-cx-floating-dropdown] > :where(.cx-branch-menu, .cx-scope-choice-menu, .cx-scope-multi-menu, .cx-table-page-size-menu) > .cx-scope-choice-list {
    max-block-size: calc(var(--cx-dropdown-max-height, 320px) - 1.4rem) !important;
    overflow: auto !important;
  }
  .cx-smart-detail-post-summary {
    margin-block-start: .75rem;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: .35rem .85rem;
    align-items: center;
    padding: .8rem .95rem;
    border: 1px solid color-mix(in srgb, var(--cx-brand-accent) 22%, var(--cx-border));
    border-radius: var(--cx-radius-lg);
    background: color-mix(in srgb, var(--cx-brand-soft) 28%, var(--cx-surface));
  }
  .cx-smart-detail-post-summary > span { font-weight: 950; color: var(--cx-text); }
  .cx-smart-detail-post-summary > strong { font-weight: 1000; color: var(--cx-brand-strong); font-size: 1.05rem; }
  .cx-smart-detail-post-summary > small { grid-column: 1 / -1; color: var(--cx-muted); font-weight: 750; line-height: 1.6; }
}

/* Shared scope date/time controls: only enabled for routes with server temporal filtering. */
.cx-scope-time-row { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:.75rem; padding:.75rem; border:1px solid var(--cx-border); border-radius:var(--cx-radius-md,12px); }
.cx-scope-time-row .cx-help { grid-column:1/-1; line-height:1.6; }
.cx-scope-time-row[data-disabled="1"] { opacity:.68; }
@media (max-width:540px) { .cx-scope-time-row { grid-template-columns:minmax(0,1fr); } }