/* a409mob:begin */
/* [SG-PATCH 2026-11-03 A409 | Felix] Kit 4 of the mobile sweep (Vera's gate on kit 3: M-B, P13, P15; Angelo's phone 03/11: R1-R6 on the
   module lists). A file of its own: zz-mobile.css (kit 2), zz-mobile-2.css (kit 1 v2) and zz-mobile-3.css (kit 3) are frozen.
   skin.helper.php links pages/*.css sorted by name: zz-mobile-2, zz-mobile-3, zz-mobile-4, zz-mobile ("-" sorts before "."). Every rule
   here wins by specificity, never by order. Values are GL-001 section 7.3 tokens (--space-N, --border, --text-muted, --brand-primary-text);
   44px (the touch threshold) is written as --space-10 + --space-1, 42px is the avatar column of the row head (32 + its 10px gap).
   No :has() in this file: every :has() rule in the skin makes a DOM write anywhere recalc ~1,450 elements (A409 measurement, see the
   kit note), so this kit adds none.

   (1) Vera M-B: the Parser save bar IN THE FLOW (end of the form, not .is-fixed) still cut the status select at 421, 1024, 1100 and
       1180px (at 1024 a tap on its centre reached «Pausa»). The three kit 3 rules held only for .is-fixed; the same three without
       .is-fixed (flex-wrap on the row, content width for the status control and the select) now hold in both states.
   (2) Vera P13: the activity volumes table (table-layout: fixed, headers nowrap) let its headers run into each other at 1023-1280px and
       at 768px with text at 130%. From 768px the headers wrap inside their own column (hyphenated, it-IT, or broken when one word is
       wider than the column); the columns and the table width do not change. (A first try with table-layout: auto widened the table
       up to 331px past its box, under the fade: rejected by measurement.)
   (3) Vera P15 (WCAG 1.4.3, dark theme): in the volumes, the accent used as text (#2b69e9: ranked values, «Andamento giornaliero dei
       problemi…») takes --brand-primary-text, fallback #fafafa (A409.1, Vera V4-3 and Iris: the platform accent token is platform
       identity on a customer-facing surface; opt-in registered by Iris in GL-001 section 7.3), and the empty-state line (#64748b)
       takes --text-muted.
   (4) Angelo 03/11 on /e/reactions (412px, dark), the same list component on the other module lists:
       R1 the select ring is 24px (the skin's 24px minimum target) in an 18px grid column: it ran 6px out of its column toward the
          avatar. The column is now 24px (--space-6) on Reactions and Repost rows, under 1024px (from 768px the ring is 18px).
       R2 «4 122 azioni/giorno» sits on the line of the «Attivo» pill, beside it, and wraps under it only when the line is full (it
          keeps 42px clear of the kebab column).
       R3 the counters ran in 3 fixed columns, so a fourth (comments) sat alone on a second line: 4 per line when the row is at least
          256px wide (true from 360px with R6), 2 per line below that. A counter the product leaves out no longer keeps a hole.
       R4 «Processo in background», «Filtri», «Azioni di Massa» (and Repost's «Etichette delle automazioni»): 48px rows 12px apart
          (60px per row, ~28px empty) become 44px rows with no gap, still a 44px tap area (the aside's 12px flex gap is taken back
          by a negative top margin on every section after the first).
       R6 under 1024px (one column: list above, content below) the list container lost its own box where the rows are cards
          (Reactions, Repost, Parser, Noticeboard): the rows are the only cards, as in L2.
       R5 under 1024px the content column's empty state («Seleziona un account dalla lista», 163-312px, under the support bubble)
          is hidden while it is the only thing in that column: zz-mobile-4.js sets .sg-m4-idle on it (no :has()), and takes it off
          as soon as a row's content loads there. */

/* (1) M-B */
html:is([data-skin="sg26"],#sg-skin) body:not(#sg-f1):not(#sg-f2) form.js-parser-schedule-form .rp-schedule-save-bar .rp-schedule-save-bar-content:not(#sg-p0):not(#sg-p1) { flex-wrap: wrap; }
html:is([data-skin="sg26"],#sg-skin) body:not(#sg-f1):not(#sg-f2) form.js-parser-schedule-form .rp-schedule-save-bar .rp-schedule-status-control:not(#sg-p0):not(#sg-p1) { min-width: max-content; }
html:is([data-skin="sg26"],#sg-skin) body:not(#sg-f1):not(#sg-f2) form.js-parser-schedule-form .rp-schedule-save-bar .rp-schedule-status-select:not(#sg-p0):not(#sg-p1) { flex-shrink: 0; min-width: max-content; }

/* (2) P13 */
@media (min-width: 768px) {
  html:is([data-skin="sg26"],#sg-skin) body:not(#sg-f1):not(#sg-f2):not(#sg-f3) #reactions-pro .rp-activity-table thead th:not(#sg-p0):not(#sg-p1) { white-space: normal !important; overflow-wrap: anywhere; hyphens: auto; vertical-align: bottom; }
}

/* (3) P15 */
html:is([data-skin="sg26"],#sg-skin) body.darkside:not(#sg-f1):not(#sg-f2):not(#sg-f3) #reactions-pro .rp-activity-ranking-values .is-ranked strong:not(#sg-p0):not(#sg-p1),
html:is([data-skin="sg26"],#sg-skin) body.darkside:not(#sg-f1):not(#sg-f2):not(#sg-f3) #reactions-pro .rp-activity-issue-trend > summary:not(#sg-p0):not(#sg-p1) { color: var(--brand-primary-text, #fafafa) !important; }
html:is([data-skin="sg26"],#sg-skin) body.darkside:not(#sg-f1):not(#sg-f2):not(#sg-f3) #reactions-pro .rp-activity-empty p:not(#sg-p0):not(#sg-p1) { color: var(--text-muted) !important; }

@media (max-width: 1023.98px) {
  /* (4) R1, under 1024px only (A409.1, Vera V4-1: at every width it cut «Ultimo aggiornamento … fa» at 1280, where the ring is 18px) */
  html:is([data-skin="sg26"],#sg-skin) body:not(#sg-f1):not(#sg-f2):not(#sg-f3) :is(#reactions-pro, .sgp-rp) .aside-list-item > .clearfix:not(#sg-p0):not(#sg-p1) { grid-template-columns: var(--space-6) 32px minmax(0, 1fr) 32px; }

  /* R2 + R3: the row's .sub runs as a wrapping line again (it was a 3-column grid, c1ui): head notes first, then a zero-height line
     break (.sub::before, order 1), then the counters (order 2-7) at 4 or 2 per line, then the rest (order 10, as before). */
  html:is([data-skin="sg26"],#sg-skin) body:not(#sg-f1):not(#sg-f2):not(#sg-f3):not(#sg-f4):not(#sg-f5):not(#sg-f6):not(#sg-f7) #reactions-pro .aside-list-item .sub:not(#sg-p0):not(#sg-p1) {
    display: flex !important; flex-wrap: wrap; align-items: center; row-gap: var(--space-1); column-gap: var(--space-2); container-type: inline-size;
  }
  html:is([data-skin="sg26"],#sg-skin) body:not(#sg-f1):not(#sg-f2):not(#sg-f3):not(#sg-f4):not(#sg-f5):not(#sg-f6):not(#sg-f7) #reactions-pro .aside-list-item .sub:not(#sg-p0):not(#sg-p1)::before {
    content: ""; order: 1; flex: 0 0 100%; height: 0; margin-top: calc(var(--space-1) * -1);
  }
  html:is([data-skin="sg26"],#sg-skin) body:not(#sg-f1):not(#sg-f2):not(#sg-f3):not(#sg-f4):not(#sg-f5):not(#sg-f6):not(#sg-f7) #reactions-pro .aside-list-item .sub > :not(.status, .speed, .follow-speed, .like-speed, .unfollow-speed, .comment-speed, .dm-speed, .welcome-dm-speed):not(#sg-p0):not(#sg-p1) { flex: 0 1 100%; min-width: 0; }
  html:is([data-skin="sg26"],#sg-skin) body:not(#sg-f1):not(#sg-f2):not(#sg-f3):not(#sg-f4):not(#sg-f5):not(#sg-f6):not(#sg-f7) #reactions-pro .aside-list-item .sub > .status:not(#sg-p0):not(#sg-p1) { flex: 0 0 auto; }
  html:is([data-skin="sg26"],#sg-skin) body:not(#sg-f1):not(#sg-f2):not(#sg-f3):not(#sg-f4):not(#sg-f5):not(#sg-f6):not(#sg-f7) #reactions-pro .aside-list-item .sub > .speed:not(#sg-p0):not(#sg-p1) { flex: 0 1 auto; min-width: 0; margin-right: 42px !important; white-space: nowrap; }
  html:is([data-skin="sg26"],#sg-skin) body:not(#sg-f1):not(#sg-f2):not(#sg-f3):not(#sg-f4):not(#sg-f5):not(#sg-f6):not(#sg-f7) #reactions-pro .aside-list-item .sub > .sg-st-next:not(#sg-p0):not(#sg-p1) { order: 1; }
  html:is([data-skin="sg26"],#sg-skin) body:not(#sg-f1):not(#sg-f2):not(#sg-f3):not(#sg-f4):not(#sg-f5):not(#sg-f6):not(#sg-f7) #reactions-pro .aside-list-item .sub > :is(.follow-speed, .like-speed, .unfollow-speed, .comment-speed, .dm-speed, .welcome-dm-speed):not(#sg-p0):not(#sg-p1) {
    flex: 0 0 calc((100% - 3 * var(--space-2)) / 4); min-width: 0;
  }
  html:is([data-skin="sg26"],#sg-skin) body:not(#sg-f1):not(#sg-f2):not(#sg-f3):not(#sg-f4):not(#sg-f5):not(#sg-f6):not(#sg-f7) #reactions-pro .aside-list-item .sub > .follow-speed:not(#sg-p0):not(#sg-p1) { order: 2; }
  html:is([data-skin="sg26"],#sg-skin) body:not(#sg-f1):not(#sg-f2):not(#sg-f3):not(#sg-f4):not(#sg-f5):not(#sg-f6):not(#sg-f7) #reactions-pro .aside-list-item .sub > .like-speed:not(#sg-p0):not(#sg-p1) { order: 3; }
  html:is([data-skin="sg26"],#sg-skin) body:not(#sg-f1):not(#sg-f2):not(#sg-f3):not(#sg-f4):not(#sg-f5):not(#sg-f6):not(#sg-f7) #reactions-pro .aside-list-item .sub > .unfollow-speed:not(#sg-p0):not(#sg-p1) { order: 4; }
  html:is([data-skin="sg26"],#sg-skin) body:not(#sg-f1):not(#sg-f2):not(#sg-f3):not(#sg-f4):not(#sg-f5):not(#sg-f6):not(#sg-f7) #reactions-pro .aside-list-item .sub > .comment-speed:not(#sg-p0):not(#sg-p1) { order: 5; }
  html:is([data-skin="sg26"],#sg-skin) body:not(#sg-f1):not(#sg-f2):not(#sg-f3):not(#sg-f4):not(#sg-f5):not(#sg-f6):not(#sg-f7) #reactions-pro .aside-list-item .sub > .dm-speed:not(#sg-p0):not(#sg-p1) { order: 6; }
  html:is([data-skin="sg26"],#sg-skin) body:not(#sg-f1):not(#sg-f2):not(#sg-f3):not(#sg-f4):not(#sg-f5):not(#sg-f6):not(#sg-f7) #reactions-pro .aside-list-item .sub > .welcome-dm-speed:not(#sg-p0):not(#sg-p1) { order: 7; }
  @container (max-width: 255.98px) {
    html:is([data-skin="sg26"],#sg-skin) body:not(#sg-f1):not(#sg-f2):not(#sg-f3):not(#sg-f4):not(#sg-f5):not(#sg-f6):not(#sg-f7) #reactions-pro .aside-list-item .sub > :is(.follow-speed, .like-speed, .unfollow-speed, .comment-speed, .dm-speed, .welcome-dm-speed):not(#sg-p0):not(#sg-p1) {
      flex-basis: calc((100% - var(--space-2)) / 2);
    }
  }

  /* R4 */
  html:is([data-skin="sg26"],#sg-skin) body:not(#sg-f1):not(#sg-f2):not(#sg-f3) :is(#reactions-pro, .sgp-rp) .skeleton-aside .np-account-section .np-account-section-toggle:not(#sg-p0):not(#sg-p1) {
    min-height: calc(var(--space-10) + var(--space-1)); padding-top: var(--space-3) !important; padding-bottom: var(--space-3) !important; box-sizing: border-box;
  }
  html:is([data-skin="sg26"],#sg-skin) body:not(#sg-f1):not(#sg-f2):not(#sg-f3) :is(#reactions-pro, .sgp-rp) .skeleton-aside .np-account-section ~ .np-account-section:not(#sg-p0):not(#sg-p1) { margin-top: calc(var(--space-3) * -1) !important; }

  /* R6 */
  html:is([data-skin="sg26"],#sg-skin) body:not(#sg-f1):not(#sg-f2):not(#sg-f3) :is(#reactions-pro, .sgp-rp, #parser-pro-schedule, #noticeboard) .skeleton-aside:not(#sg-p0):not(#sg-p1) {
    border: 0 !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; padding-left: 0 !important; padding-right: 0 !important;
  }
  html:is([data-skin="sg26"],#sg-skin) body:not(#sg-f1):not(#sg-f2):not(#sg-f3) :is(#reactions-pro, .sgp-rp, #parser-pro-schedule, #noticeboard) .skeleton-aside:not(#sg-p0):not(#sg-p1)::before,
  html:is([data-skin="sg26"],#sg-skin) body:not(#sg-f1):not(#sg-f2):not(#sg-f3) :is(#reactions-pro, .sgp-rp, #parser-pro-schedule, #noticeboard) .skeleton-aside:not(#sg-p0):not(#sg-p1)::after { display: none !important; }

  /* R5 */
  html:is([data-skin="sg26"],#sg-skin) body:not(#sg-f1):not(#sg-f2):not(#sg-f3) .skeleton-content.sg-m4-idle:not(#sg-p0):not(#sg-p1) { display: none !important; }
}
/* a409mob:end */
