/* ScrimMate v2.2.0 — layout repair + themed refresh. Loaded last.
 * 1. Layout fixes found by the 320/360/390 px audit (pages wider than the screen, floating sticky bars,
 *    touching buttons, clipped leaderboard rows, stretched Home cards).
 * 2. One theme everywhere: the Home / Command Center card look (gold glow, tinted border) on plain
 *    page headings and cards that had no background.
 * 3. Profile hero in the Home style, starter badge tiers and the badge grid, Home extras cards. */

:root { --v220-gold: var(--v211-gold, #f6c445); --v220-line: var(--v211-line, rgb(255 255 255 / .08)); --v220-soft: var(--v211-soft, rgb(255 255 255 / .05));
  --v220-card: var(--v211-card, rgb(255 255 255 / .04)); --v220-blue: #5b8cff; --v220-green: #34d399;
  --v220-glow: radial-gradient(120% 90% at 100% 0%, color-mix(in srgb, var(--v220-gold) 14%, transparent), transparent 62%);
  --v220-glow-soft: radial-gradient(110% 80% at 100% 0%, color-mix(in srgb, var(--v220-gold) 7%, transparent), transparent 60%); }

/* ---------- 1. Layout repair ---------- */
/* Grid pages: an auto track grows to the widest child (the review stepper) and pushes the page off screen. */
.v18-page, .page, .m14-review, .m14-leaderboard, .m14-detail { grid-template-columns: minmax(0, 1fr) !important; min-width: 0; max-width: 100%; }
.v18-page > *, .page > *, .m14-review > *, .m14-detail > * { min-width: 0; max-width: 100%; }
/* Legacy .page wrapper added a second 16 px inset inside the shell (scrim pages looked narrower than the rest). */
#sm-route-content > .page { padding: 0 0 16px !important; }

/* Review / submit steppers: four equal steps that shrink instead of overflowing. */
.rs-rail { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; min-width: 0; max-width: 100%; box-sizing: border-box; }
.rs-rail li { min-width: 0; padding: 6px 2px; gap: 4px; }
.rs-rail__l { min-width: 0; max-width: 100%; display: block; text-align: center; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
@media (max-width: 380px) { .rs-rail li { flex-direction: column; gap: 2px; font-size: .64rem; } .rs-rail li + li::before { top: 14px; } }

/* Sticky action bars inside the scroller: the scroller has ~108 px bottom padding, so a viewport-style
 * offset (86 px) made "Publish result" float ~200 px up over the Screenshots card. Pin them just above the nav. */
.m14-review .rv-submit, .rv-submit, .v210-submit .rs-send, .rs-send, .md-v210 .md-dock { bottom: -24px !important; }
.sm-app-shell:not(.has-no-fab) .m14-review .rv-submit, .sm-app-shell:not(.has-no-fab) .rv-submit,
.sm-app-shell:not(.has-no-fab) .rs-send, .sm-app-shell:not(.has-no-fab) .md-v210 .md-dock { bottom: -32px !important; }
.m14-review .rv-submit, .rs-send, .md-v210 .md-dock { z-index: 6; box-sizing: border-box; max-width: 100%; }
.m14-review .rv-submit .btn, .rs-send .btn { min-width: 0; }
/* Publish result + match action dock sat on top of the cards while scrolling (reported overlap).
 * They now sit in the page flow after the last card: always reachable at the end, never covering content. */
.m14-review .rv-submit, .rv-submit, .md-v210 .md-dock, .md-dock { position: static !important; bottom: auto !important; margin-top: 4px; box-shadow: none; }
.rs-rail li { overflow: hidden; }

/* Touching controls */
.m14-review .v23-evidence .sm-actions, .m14-review details .sm-actions { margin-top: 12px; }
.v20-file + .sm-actions, .v20-file + .btn, label.v20-file + * { margin-top: 10px; }
.sm-lb-view button, .v1-seg button { display: inline-flex !important; align-items: center; justify-content: center; gap: 6px; min-width: 0; }
.sm-lb-view button svg, .v1-seg button svg { flex: none; width: 16px; height: 16px; }
.btn > svg + span, .btn > svg { flex: none; }
.btn:has(> svg) { gap: 6px; }

/* Leaderboard rows: wider team column, one-line subtitles, the "pts behind" on its own line. */
.v18-lb__head, .v18-lb__row { grid-template-columns: 30px minmax(0, 1fr) 34px 38px 42px !important; column-gap: 6px !important; padding-inline: 8px !important; box-sizing: border-box; max-width: 100%; }
.v18-lb { min-width: 0; max-width: 100%; }
.v18-lb__team { min-width: 0; }
.v18-lb__team strong { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.v18-lb__team small { display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size: .7rem; }
.v18-lb__team .v106-gap { display: block; }
.v18-lb__num, .v18-lb__total { text-align: right; font-variant-numeric: tabular-nums; }
.m14-leaderboard .v18-section > h3, .m14-leaderboard .v18-section h3 { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 8px; }
.m14-leaderboard .v18-section h3 small { font-weight: 600; }
@media (max-width: 400px) { .m14-leaderboard .v18-section, .m14-leaderboard .m14-leaderboard-table { padding-inline: 10px; } }

/* Rankings podium: long IGNs wrapped mid-word ("F4xKamiKaze6 / 7"). */
.rk-podium b, .rk-pod b, [class*="podium"] b { overflow-wrap: normal; word-break: normal; }
[class*="podium"] [class*="name"], [class*="podium"] strong { display: block; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* Home hero tiles: four tiles fit in one row (they wrapped 3 + 1). */
.hm-tiles:has(> :nth-child(4):last-child) { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; gap: 6px !important; }
.hm-tiles .hm-tile { min-width: 0; }
.hm-tiles .hm-tile small, .hm-tiles .hm-tile span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 100%; }
@media (max-width: 339px) { .hm-tiles:has(> :nth-child(4):last-child) { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; } }

/* Home "Run your squad" deck: cards stretched to the tallest card, leaving a big empty gap. */
.rd-row { align-items: start !important; }
.rd-card { height: auto !important; }

/* Organization page: the back pill sat inside the hero next to the logo. */
.v220-org-back { align-self: flex-start; justify-self: start; width: auto !important; margin-bottom: 4px; }

/* Squad page: day strip buttons touched each other; wide tables scroll instead of clipping. */
[class*="sq-cal"] button, [class*="week-days"] button, [class*="sqcal"] button { min-width: 0; }
.sm-sq-table, [class*="contrib"] table, [class*="match-log"] table { display: block; overflow-x: auto; max-width: 100%; -webkit-overflow-scrolling: touch; }
.sm-sq-player { flex-wrap: wrap; row-gap: 8px; }

/* Chips and segmented filters never clip their label. */
.seg button, .sm-chip, .chip, .hm-chip { white-space: nowrap; flex: none; }
.seg { max-width: 100%; overflow-x: auto; scrollbar-width: none; }
.seg::-webkit-scrollbar { display: none; }

/* ---------- 2. One theme: Home / Command Center look on plain headings and cards ---------- */
.sm-screen > .sm-screen__heading:not(.v220-plain), header.sm-sqm-head, .v18-page__top {
  position: relative; overflow: hidden; isolation: isolate; padding: 18px; border-radius: 22px;
  border: 1px solid color-mix(in srgb, var(--v220-gold) 26%, var(--v220-line));
  background: radial-gradient(90% 80% at 100% 0%, color-mix(in srgb, var(--v220-gold) 18%, transparent), transparent 62%),
              linear-gradient(160deg, var(--surface-container-high, #1b1d24), var(--surface-container-low, #121318) 78%);
  box-shadow: 0 22px 44px -30px rgb(255 190 50 / .45); }
.sm-screen > .sm-screen__heading:not(.v220-plain)::after, header.sm-sqm-head::after, .v18-page__top::after {
  content: ""; position: absolute; z-index: -1; right: -60px; top: -80px; width: 200px; height: 200px; border-radius: 50%; pointer-events: none;
  background: radial-gradient(circle, color-mix(in srgb, var(--v220-gold) 22%, transparent), transparent 68%); }
.sm-screen > .sm-screen__heading .eyebrow, .v18-page__top .eyebrow, header.sm-sqm-head .eyebrow { color: var(--v220-gold); letter-spacing: .08em; }
.sm-screen > .sm-screen__heading h2 { margin-block: 2px 4px; }
.sm-screen > .sm-screen__heading p:not(.eyebrow) { color: var(--on-surface-variant, #b9bccb); }

/* Plain cards get the deck glow (only a background image; colours and borders stay). */
.v18-section, .sm-surface:not(.sm-state), .sm-org-section-card, .v1-group, .sm-pf-card, .ph-card:not(.ph-hero), .sm-notif-section,
.sm-friend-section, .scrim-card, .sm-card:not(.v23-evidence), .sm-sq-card, .m14-summary {
  background-image: var(--v220-glow-soft); }
.sm-pf-card, .v1-group { border-color: color-mix(in srgb, var(--v220-gold) 14%, var(--v220-line)); }

/* ---------- 3a. Profile hero in the Home style ---------- */
.sm-pf-hero { isolation: isolate; border-radius: 24px; border: 1px solid color-mix(in srgb, var(--v220-gold) 30%, var(--v220-line));
  background: radial-gradient(90% 70% at 100% 0%, color-mix(in srgb, var(--pf-a) 22%, transparent), transparent 60%),
              linear-gradient(160deg, var(--surface-container-high, #1b1d24), var(--surface-container-low, #121318) 75%);
  box-shadow: 0 24px 50px -28px color-mix(in srgb, var(--pf-a) 55%, transparent); }
.sm-pf-hero__banner { height: 64px; opacity: .55; -webkit-mask-image: linear-gradient(#000, transparent); mask-image: linear-gradient(#000, transparent); }
.v220-pf-glow { position: absolute; z-index: -1; inset: -40% -25% auto auto; width: 260px; height: 260px; border-radius: 50%; pointer-events: none;
  background: radial-gradient(circle, color-mix(in srgb, var(--pf-a) 30%, transparent), transparent 68%); animation: v220-drift 9s ease-in-out infinite alternate; }
.v220-pf-eyebrow { position: absolute; top: 14px; left: 18px; margin: 0; font-size: .68rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: var(--v220-gold); }
.sm-pf-hero__body { margin-top: -30px; }
.v220-pf-tiles { width: 100%; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; margin-top: 14px; }
.v220-pf-tile { min-width: 0; display: grid; justify-items: start; gap: 2px; padding: 10px 8px; border-radius: 14px; text-align: left;
  background: var(--v220-soft); border: 1px solid var(--v220-line); }
.v220-pf-tile svg { width: 14px; height: 14px; color: var(--sm-muted, #a8a8b8); }
.v220-pf-tile b { font-size: 1.05rem; font-weight: 900; font-variant-numeric: tabular-nums; line-height: 1.1; max-width: 100%; overflow: hidden; text-overflow: ellipsis; }
.v220-pf-tile small { font-size: .6rem; text-transform: uppercase; letter-spacing: .05em; color: var(--sm-muted, #a8a8b8); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; }
.v220-pf-tile.is-gold { border-color: color-mix(in srgb, var(--v220-gold) 40%, transparent); background: color-mix(in srgb, var(--v220-gold) 10%, var(--v220-soft)); }
.v220-pf-tile.is-gold b, .v220-pf-tile.is-gold svg { color: var(--v220-gold); }
.v220-pf-tile.is-blue { border-color: color-mix(in srgb, var(--v220-blue) 40%, transparent); background: color-mix(in srgb, var(--v220-blue) 10%, var(--v220-soft)); }
.v220-pf-tile.is-blue b, .v220-pf-tile.is-blue svg { color: var(--v220-blue); }
@media (max-width: 339px) { .v220-pf-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.sm-pf-career, .sm-pf-tabs { border-radius: 18px; }
.sm-pf-stat { background-image: var(--v220-glow-soft); }
@keyframes v220-drift { to { transform: translate(-24px, 18px) scale(1.08); } }

/* ---------- 3b. Honours: starter tiers, full-width head, badge grid ---------- */
.ach2-t-rookie { --d: #8fd3a8; --d2: #3ecf8e; }
.ach2-t-bronze { --d: #e0a46e; --d2: #b06a32; }
.ach2-t-silver { --d: #d6dde8; --d2: #8e9bb0; }
.v210-ach-head, .ach2-head.v210-ach-head { display: grid !important; grid-template-columns: minmax(0, 1fr); gap: 10px; }
.v210-ach-head .v210-ach-honour { width: 100%; box-sizing: border-box; }
.v210-ach-head .ach2-tabs { margin: 0; display: grid; grid-template-columns: 1fr 1fr; width: 100%; box-sizing: border-box; border-radius: 14px; }
.v210-ach-head .ach2-tabs button { border-radius: 11px; display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-width: 0; white-space: nowrap; }
.ach2-ladder.v210-ach-ladder { grid-template-columns: repeat(9, minmax(0, 1fr)) !important; gap: 4px; }
.ach2-ladder.v210-ach-ladder small { font-size: .52rem; }
@media (max-width: 420px) { .ach2-ladder.v210-ach-ladder { grid-template-columns: repeat(5, minmax(0, 1fr)) !important; row-gap: 8px; } }
.v220-ach-cap { display: flex; align-items: baseline; justify-content: space-between; margin: 4px 2px -2px; }
.v220-ach-cap b { font-size: .86rem; }
.v220-ach-cap small { color: var(--sm-muted, #a8a8b8); font-variant-numeric: tabular-nums; }
.ach2-row.v220-ach-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; overflow: visible; scroll-snap-type: none; margin: 0; padding: 0; }
.ach2-row.v220-ach-grid .ach2-chip { width: auto; min-width: 0; padding: 10px 4px 8px; border-radius: 16px; background: var(--v220-soft); border: 1px solid var(--v220-line); }
.ach2-row.v220-ach-grid .ach2-chip.is-on { background: radial-gradient(100% 80% at 50% 0%, color-mix(in srgb, var(--d) 18%, transparent), transparent 70%), var(--v220-soft);
  border-color: color-mix(in srgb, var(--d) 35%, var(--v220-line)); }
.ach2-row.v220-ach-grid .ach2-chip b { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: .72rem; }
@media (min-width: 560px) { .ach2-row.v220-ach-grid { grid-template-columns: repeat(auto-fill, minmax(96px, 1fr)); } }
.ach2-grid { grid-template-columns: repeat(auto-fill, minmax(92px, 1fr)); }

/* ---------- 3c. Home extras ---------- */
.v220-hx { display: grid; gap: 12px; }
.v220-hx--loading { grid-template-columns: 1fr; }
.v220-hx--loading i { height: 120px; border-radius: 22px; background: var(--v220-soft); animation: v220-shim 1.2s ease-in-out infinite alternate; }
@keyframes v220-shim { to { opacity: .45; } }
.v220-hx-card { position: relative; overflow: hidden; isolation: isolate; display: grid; gap: 12px; padding: 16px; border-radius: 22px; text-align: left; color: inherit; font: inherit; width: 100%; box-sizing: border-box;
  background: var(--v220-card); border: 1px solid var(--v220-line); --hx: var(--v220-gold); }
.v220-hx-card::before { content: ""; position: absolute; inset: 0; z-index: -1; background: radial-gradient(110% 80% at 100% 0%, color-mix(in srgb, var(--hx) 20%, transparent), transparent 62%); }
button.v220-hx-card { cursor: pointer; transition: transform .15s; }
button.v220-hx-card:active { transform: scale(.985); }
.v220-hx-pulse { --hx: var(--v220-blue); }
.v220-hx-tip { --hx: var(--v220-green); grid-template-columns: auto minmax(0, 1fr); align-items: start; }
.v220-hx-head { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 12px; }
.v220-hx-head > span:nth-child(2), .v220-hx-tip > span:last-child { display: grid; gap: 2px; min-width: 0; }
.v220-hx-card small { font-size: .72rem; color: var(--sm-muted, #a8a8b8); }
.v220-hx-head b { font-size: 1.12rem; font-weight: 900; color: var(--hx); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.v220-hx-ic { width: 40px; height: 40px; border-radius: 14px; display: grid; place-items: center; color: var(--hx);
  background: color-mix(in srgb, var(--hx) 16%, transparent); border: 1px solid color-mix(in srgb, var(--hx) 30%, transparent); }
.v220-hx-ic.is-blue { --hx: var(--v220-blue); color: var(--v220-blue); }
.v220-hx-ic.is-green { color: var(--v220-green); background: color-mix(in srgb, var(--v220-green) 16%, transparent); border-color: color-mix(in srgb, var(--v220-green) 30%, transparent); }
.v220-hx-ic svg { width: 20px; height: 20px; }
.v220-hx-ring { --p: 0; width: 54px; height: 54px; border-radius: 50%; display: grid; place-content: center; text-align: center; line-height: 1;
  background: radial-gradient(closest-side, var(--surface-container-low, #121318) 76%, transparent 78% 100%), conic-gradient(var(--v220-gold) calc(var(--p) * 360deg), var(--v220-soft) 0); }
.v220-hx-ring b { font-size: .95rem; font-weight: 900; }
.v220-hx-ring small { font-size: .58rem !important; }
.v220-hx-medals { display: flex; gap: 8px; flex-wrap: wrap; }
.v220-hx-medal { width: 38px; height: 38px; border-radius: 50%; display: grid; place-items: center; color: var(--d, var(--v220-gold)); font-size: .72rem; font-weight: 900;
  background: radial-gradient(circle at 35% 30%, color-mix(in srgb, var(--d, var(--v220-gold)) 30%, transparent), color-mix(in srgb, var(--d2, var(--v220-gold)) 12%, transparent));
  border: 1.5px solid color-mix(in srgb, var(--d, var(--v220-gold)) 60%, transparent); box-shadow: 0 0 12px -4px var(--d, var(--v220-gold)); }
.v220-hx-medal svg { width: 18px; height: 18px; }
.v220-hx-medal.is-more { color: var(--on-surface, #fff); background: var(--v220-soft); border-color: var(--v220-line); box-shadow: none; }
.v220-hx-next { display: grid; gap: 4px; padding: 10px 12px; border-radius: 14px; background: var(--v220-soft); border: 1px solid var(--v220-line); }
.v220-hx-next b { font-size: .92rem; }
.v220-hx-bar { display: block; height: 6px; border-radius: 6px; background: color-mix(in srgb, var(--on-surface, #fff) 10%, transparent); overflow: hidden; }
.v220-hx-bar i { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--v220-gold), #ff9f43); }
.v220-hx-foot { display: inline-flex; align-items: center; gap: 6px; font-size: .78rem; font-weight: 800; color: var(--v220-gold); }
.v220-hx-foot svg { width: 14px; height: 14px; }
.v220-hx-muted { margin: 0; font-size: .82rem; color: var(--sm-muted, #a8a8b8); }
.v220-hx-stats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; }
.v220-hx-stat { min-width: 0; display: grid; gap: 2px; padding: 9px 8px; border-radius: 12px; background: var(--v220-soft); border: 1px solid var(--v220-line); }
.v220-hx-stat b { font-size: 1rem; font-weight: 900; font-variant-numeric: tabular-nums; }
.v220-hx-stat small { font-size: .6rem !important; text-transform: uppercase; letter-spacing: .04em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.v220-hx-sub { margin: 0; display: flex; align-items: center; gap: 6px; font-size: .78rem; font-weight: 700; color: var(--on-surface-variant, #b9bccb); }
.v220-hx-sub svg { width: 15px; height: 15px; color: #ff9f43; }
.v220-hx-leaders { list-style: none; margin: 0; padding: 0; display: grid; gap: 4px; }
.v220-hx-leaders button { width: 100%; display: grid; grid-template-columns: 22px minmax(0, 1fr) 64px 34px; align-items: center; gap: 8px; padding: 7px 8px; border: 0; border-radius: 10px; background: transparent; color: inherit; font: inherit; text-align: left; cursor: pointer; }
.v220-hx-leaders li.is-me button { background: color-mix(in srgb, var(--v220-gold) 12%, transparent); }
.v220-hx-no { width: 22px; height: 22px; border-radius: 50%; display: grid; place-items: center; font-size: .7rem; font-weight: 900; background: var(--v220-soft); }
.v220-hx-leaders li:first-child .v220-hx-no { background: var(--v220-gold); color: #1a1300; }
.v220-hx-name { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: .86rem; font-weight: 700; }
.v220-hx-lbar { height: 6px; border-radius: 6px; background: var(--v220-soft); overflow: hidden; }
.v220-hx-lbar i { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--v220-blue), #8ab4ff); }
.v220-hx-leaders b { text-align: right; font-variant-numeric: tabular-nums; font-size: .86rem; }
.v220-hx-tip b { font-size: .98rem; }
.v220-hx-tip p { margin: 2px 0 0; font-size: .84rem; line-height: 1.45; color: var(--on-surface-variant, #b9bccb); }

/* ---------- Light theme ---------- */
:root[data-theme="light"] .sm-screen > .sm-screen__heading:not(.v220-plain), :root[data-theme="light"] header.sm-sqm-head, :root[data-theme="light"] .v18-page__top,
:root[data-theme="light"] .sm-pf-hero {
  background: radial-gradient(90% 80% at 100% 0%, color-mix(in srgb, var(--v220-gold) 22%, transparent), transparent 62%), linear-gradient(160deg, #fff, #f6f3ea 80%);
  box-shadow: 0 18px 36px -28px rgb(160 110 0 / .45); }
:root[data-theme="light"] .v220-hx-ring { background: radial-gradient(closest-side, #fff 76%, transparent 78% 100%), conic-gradient(var(--v220-gold) calc(var(--p) * 360deg), rgb(0 0 0 / .08) 0); }
:root[data-theme="light"] .v220-hx-head b, :root[data-theme="light"] .v220-pf-tile.is-gold b, :root[data-theme="light"] .v220-pf-eyebrow { color: #a87200; }

@media (prefers-reduced-motion: reduce) { .v220-pf-glow, .v220-hx--loading i { animation: none; } button.v220-hx-card { transition: none; } }

/* ---------- Manage scrim: four compact team actions in one row (were three + a full-width Ban) ---------- */
.m14-manage .v18-row__side, .v18-row__side:has(> .v20-ban-btn) { display: grid !important; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; width: 100%; }
.v18-row__side:has(> .v20-ban-btn) > .btn { min-height: 34px; padding: 4px 6px; font-size: .72rem; border-radius: 10px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; width: auto !important; margin: 0 !important; }
.v18-row__side:has(> .v20-ban-btn:only-child) { grid-template-columns: minmax(0, 1fr); }
.v18-row__side > .v20-ban-btn { color: var(--danger, #ff6b6b); border-color: color-mix(in srgb, var(--danger, #ff6b6b) 40%, transparent); }

/* ---------- Event hub: stat tiles and KPIs in one even row; map pills never break mid-word ---------- */
.v170-hub__stats:has(> :nth-child(4):last-child), .v210-kpis:has(> :nth-child(4):last-child) { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; gap: 6px; }
.v170-hub__stats > div, .v210-kpi { min-width: 0; }
.v170-hub__stats small, .v210-kpi small { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
[class*="map-pill"], [class*="__map"], .v170-map, .sm-map-chip, [class*="tl-map"] { white-space: nowrap; word-break: keep-all; }
[class*="pill"], .scrim-status-pill, .v18-status { white-space: nowrap; }

/* v2.2.0: 4-across tile labels wrap to two short lines instead of "TO REV…" / "PRACTI…". */
.hm-tiles .hm-tile { padding: 9px 6px !important; }
.hm-tiles .hm-tile span, .v220-pf-tile small { white-space: normal !important; text-overflow: clip !important; overflow-wrap: normal; word-break: normal; letter-spacing: 0 !important; text-transform: none !important; line-height: 1.15; font-size: .62rem !important; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
/* Step labels wrap to two lines ("Add / screenshots") instead of clipping at phone widths. */
@media (max-width: 380px) { .rs-rail__l { white-space: normal !important; line-height: 1.15; overflow-wrap: normal; } .rs-rail li { overflow: visible; } }
/* Submit result: the send bar + its caption sat over the Squad card at phone heights. Same rule as Publish result:
 * it now follows the last step, so nothing is ever covered. */
.rs-send, .v210-submit .rs-send { position: static !important; bottom: auto !important; margin-top: 6px; }
@media (max-width: 340px) { .rs-rail__l { font-size: .56rem; } }