/* ═══════════════════════════════════════════════════════════════════════════
   v28-dv2 — Panel Header Standardization v1.3.2 (2026-07-25)
   v1.3.2 — tab bar ID-specificity fix (MCP live-diagnosed 2026-07-25):
     • v1.3.1 WAS baked — live CSSOM showed our 16.5px rule present —
       but computed stayed 15px: 7535 also carries
       #v28m-tabbar .v28m-tabbar-label{font-size:15px!important}
       = (1,1,0), and an ID outranks any pile of classes; our (0,2,2)
       lost. Sole ID-prefixed rule across ALL covered classes (export
       grep verified — nothing else in §1–§9 is ID-gated).
     • Fix: tab-bar size + first-letter selectors now include the ID →
       (1,2,2) > (1,1,0). Same declarations, same 16.5px.
   v1.3.1 — tab bar label bump (MCP live-verified 2026-07-25):
     • v1.3.0 verified live: .v28m-tt-tool-label computes 18px (our
       (0,2,2) rule beats 7537's 15px). Nothing was blocked — TT labels
       only mount while a text object is selected; the idle-screen
       labels are the 7535 BOTTOM TAB BAR, excluded until now for CLS.
     • Exclusion reason voided by live probe: .v28m-tabbar has FIXED
       height:74px (computed, not auto) — label size cannot move the
       bar → zero CLS surface. .v28m-tabbar-label 15→16.5px.
       Held at one bump (not 18px): the 1.5fr 'Add to Cart' CTA column
       is ≈102px at vw375 and 18px risks wrap/clip there.
   v1.3.0 — second +10% label bump for visual review (Gabriel 2026-07-25):
     • §7 sizes raised another ~10% over v1.2.x (≈ +21% vs originals),
       rounded to 0.5px. v1.2.x → v1.3.0: tool 16.5→18, section 14.5→16,
       section-value/color-pill/pill-hex/rename 15.5→17, hex/layer/
       atc-cell 13→14.5, mini/mini-val/preset/PD/SB 12→13, SD section
       14.5→16, SD tile 18→20, ImagesDrawer calc ×1.1→×1.21.
       Titles (§1) untouched at 18px; tab bar untouched (CLS).
       Review bump — easy to walk back to the v1.2.x block if too big.
   v1.2.1 — title first-letter + tt inset (MCP live-verified 2026-07-25):
     • DEFECT (mine): v1.1.0/v1.2.0 put ::first-letter on LABELS only —
       never on the panel TITLES. Live probe on 7543 confirmed v1.2.0
       baked+firing with zero .v28m-tt-title::first-letter rules →
       'outline' rendered lowercase. Fix: ::first-letter uppercase on
       ALL FIVE title classes (§1 set). Injected live and probed:
       getComputedStyle(el,'::first-letter').textTransform = uppercase.
     • .v28m-tt-title padding-left:8px — tt header padding is 0 8px,
       so the de-centred title sat 8px from the edge; +8px = 16px inset,
       matching the drawer header convention.
   v1.2.0 — capitalization sweep + 10% label bump (Gabriel 2026-07-25):
     • Root cause of mixed-case bottom-menu labels: ALL English source
       strings are already Capitalized ('Align','Font','Shapes',… 7537;
       'Product','Text',… 7535) — the lowercase ones are NL/FR/DE WPML
       translations. Fixed at render time via ::first-letter; no string
       or i18n edits.
     • .v28m-tabbar-label (7535 bottom tab bar) added to the
       ::first-letter coverage. Capitalization ONLY — no size or
       alignment change on the tab bar (its height is CLS-sensitive,
       T1 work; labels stay centred under their icons by design).
     • +10% font-size on drawer/panel LABELS (explicit px, old → new,
       rounded to 0.5): TT tool 15→16.5, section 13→14.5, section-value
       14→15.5, color-pill 14→15.5, hex 12→13, mini/mini-val 11→12,
       preset 11→12, layer 12→13; PD section 11→12 (7541); SB filter
       11→12 (7568); SD section 13→14.5, rename 14→15.5, tile
       16.5→18 (7576); ATC size-cell 12→13 (7567); ImagesDrawer
       section calc(var(--v28m-fs-base)*1.1) (7575). Value classes that
       share a row with a bumped label are bumped in lockstep so rows
       stay optically level.
     • UPPERCASE kicker labels (PD/SB/ATC-cell) keep their uppercase —
       they already start with a capital; converting them to sentence
       case would change the design language, not standardise it.
     • Panel titles (§1) stay 18px — already ruled; not re-bumped.
   v1.1.0 — TextTools label pass (Gabriel ruling 2026-07-25):
     • .v28m-tt-title de-centred: static flex child (was absolute 50%/50%),
       text-align:left, flex:1 — title first-in-header (7537 frame order:
       title → badge → optional chip row → X), so flex:1 keeps X right.
       Badge stays absolute right:14px, untouched.
     • All TT labels left-aligned + First-letter capital standard:
       section/tool/preset/layer/color-pill labels get text-align:left and
       ::first-letter uppercase (fixes lowercase-starting NL/FR strings;
       rest of string untouched — NO text-transform:capitalize, which
       would capitalise every word).
     • Uppercase micro-labels (.v28m-tt-mini-label, .v28m-tt-hex-label)
       converted to the same standard: lowercase + ::first-letter
       uppercase (‘HEX’ → ‘Hex’; single-letter W/H unaffected).
     • ::first-letter is valid here: all targets are flex items →
       blockified → pseudo applies. No JS, no string edits, no i18n touch.
   CSS-only override snippet (sibling of 7888 Close Button Standardization).
   WPCode: CSS Snippet · Site Wide Header · priority 10 · auto-insert.
   Toggleable in one click; owns NO markup and NO JS.

   Unifies every panel/drawer/sheet title to ONE spec (Gabriel ruling
   2026-07-25, Option A1):
     font-family : system stack (matches --v28m-font-system, 7533)
     font-size   : 18px
     font-weight : 700
     color       : #0a0a0a
     line-height : 1.2
     letter-spacing : -0.01em (matches --v28m-tracking-tight)

   Covered selectors (audited from 2026-07-25 export — previous values):
     .v28m-drawer-title   7534  17px/600 centred  — Product / Styles /
                                Images / Save / Gallery / Quantities drawers
     .v28m-tt-title       7537  15.5px/700 (+0.3px tracking)
     .v28m-afts-title     7714  20px/700 #111
     .v28m-cp-panel-title 7728  15px/700 #1d2327 (off-palette)
     .v28ip-title         7887  19px/800

   A1 layout: .v28m-drawer-title switches centre -> LEFT, and the left
   balance spacer is collapsed whenever the back button is hidden
   (framework hides it with .v28m-drawer-hidden; spacer is its next
   sibling), so the title starts at the header's own 16px padding.

   Deliberately NOT touched:
     • .v28m-tt-title position:absolute centring (7537 dock structural —
       left controls occupy that space; only typography is standardised).
     • .v28ip-title padding-right:36px (clears its own close X).
     • Desktop .v28d-sq-h2 (uppercase micro-label, different design
       language — excluded per ruling).
     • All close-button geometry (7888 owns it).

   Specificity: html body:is(.tier) .class = (0,2,2) with !important —
   beats every owner rule above (max (0,2,1) !important, incl. 7534's
   B-prefixed rules and all late JS-injected <style> tags; higher
   specificity wins between !important rules regardless of order).
   transition:none per LD #203 (theme transitions beat author !important;
   the colour changes here would otherwise animate/stick on body-mounted
   panels).
   ═══════════════════════════════════════════════════════════════════════ */

/* ── 1. Unified title typography ─────────────────────────────────────── */
html body:is(.v28-dv2-mobile, .v28-dv2-tablet, .v28-dv2-desktop) .v28m-drawer-title,
html body:is(.v28-dv2-mobile, .v28-dv2-tablet, .v28-dv2-desktop) .v28m-tt-title,
html body:is(.v28-dv2-mobile, .v28-dv2-tablet, .v28-dv2-desktop) .v28m-afts-title,
html body:is(.v28-dv2-mobile, .v28-dv2-tablet, .v28-dv2-desktop) .v28m-cp-panel-title,
html body:is(.v28-dv2-mobile, .v28-dv2-tablet, .v28-dv2-desktop) .v28ip-title {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
               "Helvetica Neue", Arial, sans-serif !important;
  font-size: 18px !important;
  font-weight: 700 !important;
  color: #0a0a0a !important;
  line-height: 1.2 !important;
  letter-spacing: -0.01em !important;
  text-transform: none !important;
  transition: none !important; /* LD #203 */
}

/* ── 2. A1 — left-aligned framework drawer titles ────────────────────── */
html body:is(.v28-dv2-mobile, .v28-dv2-tablet, .v28-dv2-desktop) .v28m-drawer-title {
  text-align: left !important;
}

/* Collapse the left balance spacer when the back button is hidden, so a
   left-aligned title isn't indented by a 44px ghost. Framework DOM order
   (7534 ensureRoot): backBtn -> backSpacer -> title. */
html body:is(.v28-dv2-mobile, .v28-dv2-tablet, .v28-dv2-desktop)
  .v28m-drawer-back.v28m-drawer-hidden + .v28m-drawer-spacer {
  display: none !important;
}

/* ── 3. v1.1.0 — TextTools panel titles: de-centred, left, flex child
      v1.2.1 — +padding-left (8px header pad + 8px = 16px inset) ───── */
html body:is(.v28-dv2-mobile, .v28-dv2-tablet, .v28-dv2-desktop) .v28m-tt-title {
  padding-left: 8px !important;
  position: static !important;
  left: auto !important;
  top: auto !important;
  transform: none !important;
  text-align: left !important;
  flex: 1 1 auto !important;
  min-width: 0 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

/* ── 4. v1.1.0 — TextTools labels: left + First-letter capital ─────── */
html body:is(.v28-dv2-mobile, .v28-dv2-tablet, .v28-dv2-desktop) .v28m-tt-section-label,
html body:is(.v28-dv2-mobile, .v28-dv2-tablet, .v28-dv2-desktop) .v28m-tt-tool-label,
html body:is(.v28-dv2-mobile, .v28-dv2-tablet, .v28-dv2-desktop) .v28m-tt-preset-label,
html body:is(.v28-dv2-mobile, .v28-dv2-tablet, .v28-dv2-desktop) .v28m-tt-layer-label,
html body:is(.v28-dv2-mobile, .v28-dv2-tablet, .v28-dv2-desktop) .v28m-tt-color-pill-label {
  text-align: left !important;
}
html body:is(.v28-dv2-mobile, .v28-dv2-tablet, .v28-dv2-desktop) .v28m-tt-section-label::first-letter,
html body:is(.v28-dv2-mobile, .v28-dv2-tablet, .v28-dv2-desktop) .v28m-tt-tool-label::first-letter,
html body:is(.v28-dv2-mobile, .v28-dv2-tablet, .v28-dv2-desktop) .v28m-tt-preset-label::first-letter,
html body:is(.v28-dv2-mobile, .v28-dv2-tablet, .v28-dv2-desktop) .v28m-tt-layer-label::first-letter,
html body:is(.v28-dv2-mobile, .v28-dv2-tablet, .v28-dv2-desktop) .v28m-tt-color-pill-label::first-letter {
  text-transform: uppercase !important;
}

/* ── 5. v1.1.0 — uppercase micro-labels → same First-letter standard ── */
html body:is(.v28-dv2-mobile, .v28-dv2-tablet, .v28-dv2-desktop) .v28m-tt-mini-label,
html body:is(.v28-dv2-mobile, .v28-dv2-tablet, .v28-dv2-desktop) .v28m-tt-hex-label {
  text-transform: lowercase !important;
  text-align: left !important;
}
html body:is(.v28-dv2-mobile, .v28-dv2-tablet, .v28-dv2-desktop) .v28m-tt-mini-label::first-letter,
html body:is(.v28-dv2-mobile, .v28-dv2-tablet, .v28-dv2-desktop) .v28m-tt-hex-label::first-letter {
  text-transform: uppercase !important;
}

/* ── 6. v1.2.0 — bottom tab bar: First-letter capital
      v1.3.1 — +size 15→16.5px (bar height fixed 74px → no CLS) ───── */
html body:is(.v28-dv2-mobile, .v28-dv2-tablet, .v28-dv2-desktop) #v28m-tabbar .v28m-tabbar-label { font-size: 16.5px !important; }
html body:is(.v28-dv2-mobile, .v28-dv2-tablet, .v28-dv2-desktop) #v28m-tabbar .v28m-tabbar-label::first-letter,
html body:is(.v28-dv2-mobile, .v28-dv2-tablet, .v28-dv2-desktop) .v28m-tabbar-label::first-letter {
  text-transform: uppercase !important;
}

/* ── 7. v1.2.0 — +10% label sizes (explicit px; old values in §docblock) */
html body:is(.v28-dv2-mobile, .v28-dv2-tablet, .v28-dv2-desktop) .v28m-tt-tool-label { font-size: 18px !important; }
html body:is(.v28-dv2-mobile, .v28-dv2-tablet, .v28-dv2-desktop) .v28m-tt-section-label { font-size: 16px !important; }
html body:is(.v28-dv2-mobile, .v28-dv2-tablet, .v28-dv2-desktop) .v28m-tt-section-value { font-size: 17px !important; }
html body:is(.v28-dv2-mobile, .v28-dv2-tablet, .v28-dv2-desktop) .v28m-tt-color-pill-label { font-size: 17px !important; }
html body:is(.v28-dv2-mobile, .v28-dv2-tablet, .v28-dv2-desktop) .v28m-tt-color-pill-hex { font-size: 17px !important; }
html body:is(.v28-dv2-mobile, .v28-dv2-tablet, .v28-dv2-desktop) .v28m-tt-hex-label { font-size: 14.5px !important; }
html body:is(.v28-dv2-mobile, .v28-dv2-tablet, .v28-dv2-desktop) .v28m-tt-mini-label { font-size: 13px !important; }
html body:is(.v28-dv2-mobile, .v28-dv2-tablet, .v28-dv2-desktop) .v28m-tt-mini-val { font-size: 13px !important; }
html body:is(.v28-dv2-mobile, .v28-dv2-tablet, .v28-dv2-desktop) .v28m-tt-preset-label { font-size: 13px !important; }
html body:is(.v28-dv2-mobile, .v28-dv2-tablet, .v28-dv2-desktop) .v28m-tt-layer-label { font-size: 14.5px !important; }
html body:is(.v28-dv2-mobile, .v28-dv2-tablet, .v28-dv2-desktop) .v28m-pd-section-label { font-size: 13px !important; }
html body:is(.v28-dv2-mobile, .v28-dv2-tablet, .v28-dv2-desktop) .v28m-sb-filter-label { font-size: 13px !important; }
html body:is(.v28-dv2-mobile, .v28-dv2-tablet, .v28-dv2-desktop) .v28m-sd-section-title { font-size: 16px !important; }
html body:is(.v28-dv2-mobile, .v28-dv2-tablet, .v28-dv2-desktop) .v28m-sd-rename-label { font-size: 17px !important; }
html body:is(.v28-dv2-mobile, .v28-dv2-tablet, .v28-dv2-desktop) .v28m-sd-tile-label { font-size: 20px !important; }
html body:is(.v28-dv2-mobile, .v28-dv2-tablet, .v28-dv2-desktop) .v28m-atc-cell-label { font-size: 14.5px !important; }
html body:is(.v28-dv2-mobile, .v28-dv2-tablet, .v28-dv2-desktop) .v28m-id-section-title { font-size: calc(var(--v28m-fs-base) * 1.21) !important; }

/* ── 8. v1.2.0 — First-letter on remaining sentence-case drawer labels ─ */
html body:is(.v28-dv2-mobile, .v28-dv2-tablet, .v28-dv2-desktop) .v28m-sd-rename-label::first-letter,
html body:is(.v28-dv2-mobile, .v28-dv2-tablet, .v28-dv2-desktop) .v28m-id-section-title::first-letter,
html body:is(.v28-dv2-mobile, .v28-dv2-tablet, .v28-dv2-desktop) .v28m-id-replace-preview-label::first-letter {
  text-transform: uppercase !important;
}

/* ── 9. v1.2.1 — First-letter capital on ALL panel titles (§1 set) ─── */
html body:is(.v28-dv2-mobile, .v28-dv2-tablet, .v28-dv2-desktop) .v28m-drawer-title::first-letter,
html body:is(.v28-dv2-mobile, .v28-dv2-tablet, .v28-dv2-desktop) .v28m-tt-title::first-letter,
html body:is(.v28-dv2-mobile, .v28-dv2-tablet, .v28-dv2-desktop) .v28m-afts-title::first-letter,
html body:is(.v28-dv2-mobile, .v28-dv2-tablet, .v28-dv2-desktop) .v28m-cp-panel-title::first-letter,
html body:is(.v28-dv2-mobile, .v28-dv2-tablet, .v28-dv2-desktop) .v28ip-title::first-letter {
  text-transform: uppercase !important;
}