/* ScrimMate v2.1.1: Google sign-in progress, Super Admin edit/remove tools, segmented pickers, result editor,
 * stats totals, role home cards, graphics styles, and a safety net so no button ever falls back to browser styling.
 * Loaded last. Dark + light + reduced motion. */

:root { --v211-gold: var(--v210-gold, #f6c445); --v211-line: var(--v210-line, rgb(255 255 255 / .08)); --v211-soft: var(--v210-soft, rgb(255 255 255 / .05)); --v211-card: var(--v210-card, rgb(255 255 255 / .04)); --v211-red: #ff6b6b; --v211-green: #34d399; --v211-blue: #5b8cff; }
:root[data-theme="light"] { --v211-line: rgb(0 0 0 / .09); --v211-soft: rgb(0 0 0 / .04); --v211-card: #fff; }

/* ---------- safety net: no default browser buttons, links or selects ---------- */
:where(button) { font: inherit; color: inherit; -webkit-tap-highlight-color: transparent; }
:where(button:not([class])) { background: transparent; border: 0; padding: 0; cursor: pointer; border-radius: 10px; }
:where(button:not([class])):focus-visible, :where(.text-btn):focus-visible { outline: 2px solid var(--v211-gold); outline-offset: 2px; }
:where(select) { font: inherit; color: inherit; background-color: var(--v211-soft); border: 1px solid var(--v211-line); border-radius: 12px; min-height: 44px; padding: 8px 12px; }
:where(#app a:not([class])) { color: var(--v211-gold); text-underline-offset: 3px; }
/* the plain "← Back" text buttons become small pills */
.sm-back-btn, .md-back, .text-btn.sm-back-btn { display: inline-flex; align-items: center; gap: 6px; min-height: 34px; padding: 6px 12px 6px 10px !important; border-radius: 999px; font-weight: 750; font-size: .84rem;
  background: var(--v211-soft); border: 1px solid var(--v211-line); color: inherit; text-decoration: none; transition: background .15s, transform .15s; }
.sm-back-btn:active, .md-back:active { transform: scale(.97); }
.sm-back-btn:hover, .md-back:hover { background: color-mix(in srgb, var(--v211-gold) 12%, var(--v211-soft)); }
/* leaderboard match chooser: horizontal scrolling pills instead of a stacked radio list */
.m14-leaderboard .sm-choice-list { display: flex; gap: 8px; overflow-x: auto; scrollbar-width: none; padding: 2px 2px 8px; margin: 6px -2px 8px; scroll-snap-type: x proximity; }
.m14-leaderboard .sm-choice-list::-webkit-scrollbar { display: none; }
.m14-leaderboard .sm-choice { flex: 0 0 auto; scroll-snap-align: start; position: relative; }
.m14-leaderboard .sm-choice input { position: absolute; opacity: 0; inset: 0; margin: 0; cursor: pointer; }
.m14-leaderboard .sm-choice span { display: inline-flex; align-items: center; white-space: nowrap; }
.m14-leaderboard .sm-choice input:focus-visible + span { outline: 2px solid var(--v211-gold); outline-offset: 2px; }

/* ---------- Google sign-in progress ---------- */
.v211-authp { position: fixed; inset: 0; z-index: 9999; display: grid; place-items: center; padding: 24px; background: rgb(6 6 10 / .72); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); opacity: 0; transition: opacity .22s ease; }
.v211-authp.is-in { opacity: 1; }
:root[data-theme="light"] .v211-authp { background: rgb(246 246 248 / .78); }
.v211-authp__card { width: min(360px, 100%); padding: 26px 22px 20px; border-radius: 26px; text-align: center; background: var(--v210-card-solid, #15151c); border: 1px solid color-mix(in srgb, var(--v211-gold) 26%, var(--v211-line)); box-shadow: 0 30px 80px rgb(0 0 0 / .45); transform: translateY(10px) scale(.98); transition: transform .3s cubic-bezier(.2, .9, .3, 1.2); }
:root[data-theme="light"] .v211-authp__card { background: #fff; box-shadow: 0 30px 80px rgb(0 0 0 / .14); }
.v211-authp.is-in .v211-authp__card { transform: none; }
.v211-authp__ring { position: relative; width: 74px; height: 74px; margin: 0 auto 14px; display: grid; place-items: center; }
.v211-authp__ring i { position: absolute; inset: 0; border-radius: 50%; background: conic-gradient(#4285f4 0 25%, #34a853 0 50%, #fbbc05 0 75%, #ea4335 0); -webkit-mask: radial-gradient(farthest-side, transparent calc(100% - 5px), #000 calc(100% - 4px)); mask: radial-gradient(farthest-side, transparent calc(100% - 5px), #000 calc(100% - 4px)); animation: v211-spin 1.1s linear infinite; }
.v211-authp__ring b { font-size: 1.7rem; font-weight: 900; color: #4285f4; }
.v211-authp h2 { margin: 0 0 4px; font-size: 1.15rem; font-weight: 850; letter-spacing: -.01em; }
.v211-authp p { margin: 0 0 14px; color: var(--sm-muted, #a8a8b8); font-size: .86rem; }
.v211-authp__steps { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; text-align: left; }
.v211-authp__steps li { display: flex; align-items: center; gap: 10px; padding: 9px 12px; border-radius: 14px; background: var(--v211-soft); font-size: .86rem; font-weight: 650; color: var(--sm-muted, #a8a8b8); transition: color .2s, background .2s; }
.v211-authp__steps li span { width: 20px; height: 20px; flex: 0 0 auto; border-radius: 50%; border: 2px solid var(--v211-line); display: grid; place-items: center; font-size: .7rem; }
.v211-authp__steps li span svg { width: 14px; height: 14px; }
.v211-authp__steps li.is-now { color: inherit; background: color-mix(in srgb, var(--v211-gold) 12%, var(--v211-soft)); }
.v211-authp__steps li.is-now span { border-color: var(--v211-gold); border-top-color: transparent; animation: v211-spin .8s linear infinite; }
.v211-authp__steps li.is-done { color: inherit; }
.v211-authp__steps li.is-done span { border-color: var(--v211-green); background: var(--v211-green); color: #04120c; }
.v211-authp.is-error .v211-authp__ring i { animation: none; background: var(--v211-red); }
.v211-authp.is-error .v211-authp__ring b { color: var(--v211-red); }
@keyframes v211-spin { to { transform: rotate(360deg); } }

/* ---------- Super Admin tools ---------- */
.v211-admin-note { display: flex; gap: 10px; align-items: flex-start; margin: 0 0 12px; padding: 10px 12px; border-radius: 14px; font-size: .84rem; line-height: 1.45;
  background: color-mix(in srgb, var(--v211-gold) 10%, transparent); border: 1px solid color-mix(in srgb, var(--v211-gold) 30%, transparent); }
.v211-admin-note svg { width: 18px; height: 18px; flex: 0 0 auto; color: var(--v211-gold); margin-top: 1px; }
.v211-admin-row { display: flex; gap: 10px; margin-top: 12px; }
.v211-admin-row .btn { flex: 1 1 0; justify-content: center; }
.v211-admin-danger { display: grid; gap: 2px; margin: 0 0 10px; padding: 12px 14px; border-radius: 16px; background: color-mix(in srgb, var(--v211-red) 10%, transparent); border: 1px solid color-mix(in srgb, var(--v211-red) 35%, transparent); }
.v211-admin-danger span { font-size: .82rem; color: var(--sm-muted, #a8a8b8); }
.v211-admin-bar { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 12px; padding: 10px; border-radius: 18px; background: color-mix(in srgb, var(--v211-gold) 7%, var(--v211-soft)); border: 1px dashed color-mix(in srgb, var(--v211-gold) 40%, transparent); }
.v211-admin-bar__tag { display: inline-flex; align-items: center; gap: 6px; margin-right: auto; font-size: .72rem; font-weight: 850; letter-spacing: .06em; text-transform: uppercase; color: var(--v211-gold); }
.v211-admin-bar__tag svg { width: 15px; height: 15px; }
.v211-admin-bar .btn { min-height: 36px; padding: 6px 12px; font-size: .82rem; }
.md-result .md-remove-result { margin-top: 8px; margin-left: 6px; }
.md-owner .btn svg, .v211-admin-bar .btn svg, .v211-res-form .btn svg { width: 17px; height: 17px; }

/* segmented radio picker (map / status) */
.v211-seg { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 4px; }
.v211-seg__opt { position: relative; flex: 1 1 auto; }
.v211-seg__opt input { position: absolute; opacity: 0; inset: 0; margin: 0; cursor: pointer; }
.v211-seg__opt span { display: flex; align-items: center; justify-content: center; min-height: 40px; padding: 6px 12px; border-radius: 12px; font-weight: 700; font-size: .84rem; background: var(--v211-soft); border: 1px solid var(--v211-line); transition: background .15s, border-color .15s, color .15s; }
.v211-seg__opt input:checked + span { background: color-mix(in srgb, var(--v211-gold) 22%, transparent); border-color: var(--v211-gold); color: var(--on-surface, #fff); font-weight: 850; box-shadow: inset 0 0 0 1px var(--v211-gold); }
.v211-seg__opt input:focus-visible + span { outline: 2px solid var(--v211-gold); outline-offset: 2px; }

/* public result editor */
.v211-res-list { display: grid; gap: 10px; max-height: min(56vh, 520px); overflow: auto; padding-right: 2px; }
.v211-res-team { margin: 0; padding: 10px 12px 12px; border-radius: 16px; border: 1px solid var(--v211-line); background: var(--v211-soft); display: grid; grid-template-columns: 90px 1fr; gap: 8px 12px; align-items: start; min-width: 0; }
.v211-res-team legend { grid-column: 1 / -1; display: flex; align-items: center; gap: 8px; padding: 0; font-size: .9rem; min-width: 0; }
.v211-res-team legend b { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.v211-res-team__slot { flex: 0 0 auto; padding: 2px 8px; border-radius: 999px; font-size: .7rem; font-weight: 800; background: color-mix(in srgb, var(--v211-gold) 16%, transparent); color: var(--v211-gold); }
.v211-res-num, .v211-res-player { display: grid; gap: 4px; font-size: .72rem; color: var(--sm-muted, #a8a8b8); min-width: 0; }
.v211-res-num input, .v211-res-player input { width: 100%; min-height: 40px; padding: 6px 10px; border-radius: 10px; font: inherit; font-size: .95rem; font-weight: 750; color: var(--sm-text, inherit); background: var(--v211-card); border: 1px solid var(--v211-line); }
.v211-res-players { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.v211-res-player span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.v211-res-player em { font-style: normal; font-size: .64rem; padding: 0 5px; border-radius: 6px; background: var(--v211-line); }
@media (max-width: 360px) { .v211-res-team { grid-template-columns: 1fr; } }

/* ---------- stats totals ---------- */
.v211-tot__hero { display: grid; grid-template-columns: repeat(auto-fit, minmax(130px, 1fr)); gap: 10px; margin: 6px 0 12px; }
.v211-tot__hero > div { position: relative; overflow: hidden; padding: 14px; border-radius: 18px; background: radial-gradient(120% 120% at 100% 0%, color-mix(in srgb, var(--v211-gold) 22%, transparent), transparent 60%), var(--v211-soft); border: 1px solid color-mix(in srgb, var(--v211-gold) 26%, var(--v211-line)); }
.v211-tot__hero b { display: block; font-size: 2rem; font-weight: 900; letter-spacing: -.03em; line-height: 1; font-variant-numeric: tabular-nums; }
.v211-tot__hero small { display: block; margin-top: 6px; color: var(--sm-muted, #a8a8b8); font-size: .76rem; font-weight: 650; }
.v211-tot__h { margin: 14px 0 6px; font-size: .82rem; letter-spacing: .04em; text-transform: uppercase; color: var(--sm-muted, #a8a8b8); }
.v211-tot .ds-grid, .v211-tot__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(96px, 1fr)); gap: 8px; }
.v211-alltime-h { margin-top: 14px; }
.v211-alltime-h h3 { font-size: .82rem; letter-spacing: .04em; text-transform: uppercase; color: var(--sm-muted, #a8a8b8); }
.v211-alltime > * { background: radial-gradient(120% 120% at 100% 0%, color-mix(in srgb, var(--v211-gold) 14%, transparent), transparent 65%), var(--v211-soft); }

/* ---------- reduced motion ---------- */
@media (prefers-reduced-motion: reduce) {
  .v211-authp, .v211-authp__card { transition: none; }
  .v211-authp__ring i, .v211-authp__steps li.is-now span { animation: none; }
}

/* ---------- Home role deck ---------- */
.rd-row { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(290px, 88%); gap: 12px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; padding: 2px 2px 6px; margin: 0 -2px; }
.rd-row::-webkit-scrollbar { display: none; }
.rd-row:has(> .rd-card:only-child) { grid-auto-columns: 100%; }
@media (min-width: 760px) { .rd-row { grid-auto-flow: row; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); overflow: visible; } }
.rd-card { scroll-snap-align: start; position: relative; overflow: hidden; isolation: isolate; display: flex; flex-direction: column; gap: 12px; padding: 16px; border-radius: 22px; background: var(--v211-card); border: 1px solid var(--v211-line); animation: rd-in .45s cubic-bezier(.2, .8, .2, 1) both; }
.rd-card::before { content: ""; position: absolute; inset: 0; z-index: -1; opacity: .9; background: radial-gradient(110% 80% at 100% 0%, color-mix(in srgb, var(--rd-c, var(--v211-gold)) 22%, transparent), transparent 62%); }
.rd-card--player { --rd-c: var(--v211-gold); }
.rd-card--owner { --rd-c: var(--v211-blue); animation-delay: .05s; }
.rd-card--host { --rd-c: #a78bfa; animation-delay: .1s; }
.rd-card--admin { --rd-c: var(--v211-red); }
.rd-card header { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; flex-wrap: wrap; }
.rd-card h3 { display: inline-flex; align-items: center; gap: 8px; margin: 0; font-size: 1.02rem; font-weight: 850; letter-spacing: -.01em; }
.rd-card h3 svg { width: 20px; height: 20px; color: var(--rd-c); }
.rd-card header small { color: var(--sm-muted, #a8a8b8); font-size: .76rem; }
.rd-tiles { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.rd-tiles--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.rd-tiles--4 .rd-tile { grid-template-columns: auto 1fr; grid-template-rows: auto auto; column-gap: 8px; align-items: center; }
.rd-tiles--4 .rd-tile__ic { grid-row: 1 / 3; }
@media (min-width: 760px) { .rd-tiles--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.rd-tile { min-width: 0; padding: 10px; border-radius: 16px; background: var(--v211-soft); border: 1px solid var(--v211-line); display: grid; gap: 2px; }
.rd-tile__ic svg { width: 16px; height: 16px; color: var(--rd-c); }
.rd-tile b { font-size: 1.3rem; font-weight: 900; letter-spacing: -.02em; line-height: 1.1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-variant-numeric: tabular-nums; }
.rd-tile small { font-size: .7rem; color: var(--sm-muted, #a8a8b8); line-height: 1.25; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.rd-tile.is-gold { background: color-mix(in srgb, var(--v211-gold) 14%, var(--v211-soft)); border-color: color-mix(in srgb, var(--v211-gold) 40%, transparent); }
.rd-tile.is-alert { background: color-mix(in srgb, var(--v211-red) 12%, var(--v211-soft)); border-color: color-mix(in srgb, var(--v211-red) 40%, transparent); }
.rd-tile.is-alert b { color: var(--v211-red); }
.rd-form { display: flex; gap: 6px; }
.rd-dot { flex: 1 1 0; min-width: 0; text-align: center; padding: 6px 0; border-radius: 10px; font-size: .78rem; font-weight: 850; background: var(--v211-soft); border: 1px solid var(--v211-line); }
.rd-dot.is-win { background: linear-gradient(135deg, #f6c445, #e69b00); color: #1b1300; border-color: transparent; }
.rd-dot.is-top3 { background: color-mix(in srgb, var(--v211-gold) 24%, transparent); }
.rd-dot.is-top10 { background: color-mix(in srgb, var(--v211-green) 18%, transparent); }
.rd-dot.is-low { color: var(--sm-muted, #a8a8b8); }
.rd-gos { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; margin-top: auto; }
.rd-go { display: flex; align-items: center; gap: 8px; min-height: 42px; padding: 8px 10px; border-radius: 14px; font: inherit; font-size: .8rem; font-weight: 750; color: inherit; cursor: pointer; background: var(--v211-soft); border: 1px solid var(--v211-line); transition: transform .15s, background .15s; min-width: 0; }
.rd-go span { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rd-go svg { flex: 0 0 auto; width: 18px; height: 18px; color: var(--rd-c); }
.rd-go:active { transform: scale(.95); }
.rd-go:hover { background: color-mix(in srgb, var(--rd-c) 12%, var(--v211-soft)); }
.rd-go:focus-visible { outline: 2px solid var(--rd-c); outline-offset: 2px; }
.rd-gos--big .rd-go { min-height: 52px; }
.rd-spark { display: flex; align-items: flex-end; gap: 2px; height: 34px; }
.rd-spark i { flex: 1 1 0; height: calc(8% + var(--v, 0) * 92%); border-radius: 3px 3px 1px 1px; background: linear-gradient(to top, color-mix(in srgb, var(--rd-c) 50%, transparent), var(--rd-c)); opacity: .85; }
.rd-muted { margin: 0; font-size: .78rem; color: var(--sm-muted, #a8a8b8); }
@keyframes rd-in { from { opacity: 0; transform: translateY(10px); } }
@media (prefers-reduced-motion: reduce) { .rd-card { animation: none; } }

/* ---------- ghost / text buttons: tonal surfaces instead of bare browser-looking text ---------- */
.btn.ghost { background: var(--v211-soft); border: 1px solid var(--v211-line); }
.btn.ghost:hover { background: color-mix(in srgb, var(--v211-gold) 10%, var(--v211-soft)); }
.btn.ghost:active { transform: scale(.98); }
.text-btn { display: inline-flex; align-items: center; gap: 6px; min-height: 32px; padding: 4px 10px; border: 1px solid transparent; background: color-mix(in srgb, var(--primary, var(--v211-gold)) 9%, transparent); color: var(--primary, var(--v211-gold)); font-weight: 700; font-size: .84rem; cursor: pointer; transition: background .15s, transform .15s; }
.text-btn:hover { background: color-mix(in srgb, var(--primary, var(--v211-gold)) 16%, transparent); }
.text-btn:active { transform: scale(.97); }
.scrim-back-btn, .sm-org-back-btn { display: inline-flex; }
.sm-ts .v1-table td:first-child .text-btn { background: transparent; padding: 0; min-height: 0; }
/* match detail owner row: Manage + Edit side by side, Delete full width */
.md-owner { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.md-owner .btn { justify-content: center; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.md-owner .btn.danger { grid-column: 1 / -1; }
.md-owner .btn:only-child { grid-column: 1 / -1; }
:root[data-theme="light"] .v211-seg__opt input:checked + span { color: #3a2a00; }
.v211-seg__opt span { color: var(--on-surface, inherit); }

/* ---------- v2.1.1 card styles: theme swatches + backdrop chips (studio + image viewer) ---------- */
.sm-cs-sw { display: flex; gap: 8px; overflow-x: auto; padding: 4px 2px 6px; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
.sm-cs-sw::-webkit-scrollbar, .sm-cs-pat::-webkit-scrollbar { display: none; }
.sm-cs-sw > button { flex: 0 0 auto; display: grid; justify-items: center; gap: 4px; min-width: 56px; padding: 6px 4px; border-radius: 14px; border: 1px solid transparent; background: transparent; color: inherit; font: 700 11px/1.1 inherit; cursor: pointer; transition: transform .16s ease, border-color .16s ease, background .16s ease; }
.sm-cs-sw > button i { width: 34px; height: 34px; border-radius: 50%; background: radial-gradient(circle at 70% 25%, var(--sw-a) 0 26%, transparent 27%), linear-gradient(135deg, var(--sw-b), var(--sw-c)); box-shadow: inset 0 0 0 2px color-mix(in srgb, var(--sw-a) 55%, transparent), 0 2px 8px rgba(0,0,0,.25); transition: box-shadow .16s ease, transform .16s ease; }
.sm-cs-sw > button span { opacity: .78; }
.sm-cs-sw > button.is-on { border-color: color-mix(in srgb, var(--sw-a) 60%, transparent); background: color-mix(in srgb, var(--sw-a) 12%, transparent); }
.sm-cs-sw > button.is-on i { box-shadow: inset 0 0 0 2px var(--sw-a), 0 0 0 3px color-mix(in srgb, var(--sw-a) 35%, transparent), 0 4px 14px rgba(0,0,0,.3); transform: scale(1.06); }
.sm-cs-sw > button.is-on span { opacity: 1; }
.sm-cs-sw > button:active { transform: scale(.94); }
.sm-cs-pat { display: flex; gap: 6px; overflow-x: auto; padding: 2px 2px 4px; scrollbar-width: none; }
.sm-cs-pat > button { flex: 0 0 auto; min-height: 32px; padding: 0 14px; border-radius: 999px; border: 1px solid color-mix(in srgb, currentColor 18%, transparent); background: color-mix(in srgb, currentColor 6%, transparent); color: inherit; font: 700 12px/1 inherit; cursor: pointer; transition: background .16s ease, border-color .16s ease, color .16s ease; }
.sm-cs-pat > button.is-on { background: var(--v211-gold, #F6C445); border-color: var(--v211-gold, #F6C445); color: #1A1405; }
.sm-cs-strip { display: grid; gap: 4px; padding: 8px 14px 4px; color: #fff; background: linear-gradient(180deg, transparent, rgba(0,0,0,.45)); }
.sm-cs-strip > small { font: 800 10px/1 inherit; letter-spacing: .12em; text-transform: uppercase; opacity: .6; padding-left: 2px; }
.v1-gs [data-gs-key="theme"], .v1-gs [data-gs-key="pattern"] { margin-bottom: 4px; }
@media (prefers-reduced-motion: reduce) { .sm-cs-sw > button, .sm-cs-sw > button i, .sm-cs-pat > button { transition: none; } }
.sm-iv:has(.sm-cs-strip) { grid-template-rows: auto 1fr auto auto auto; }
.sm-iv .sm-cs-sw, .sm-iv .sm-cs-pat { touch-action: pan-x; }
.sm-iv .sm-cs-pat > button.is-on { color: #1A1405; }
/* Role deck buttons: labels wrap to two lines instead of being cut ("Review re…"). */
.rd-go span { white-space: normal; line-height: 1.15; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; overflow-wrap: anywhere; hyphens: auto; text-align: left; }
.rd-go { min-width: 0; }
.rd-note { display: flex; align-items: center; gap: 8px; margin: 0; padding: 8px 10px; border-radius: 12px; font-size: .8rem; background: color-mix(in srgb, var(--rd-c, var(--v211-gold)) 9%, transparent); }
.rd-note svg { flex: 0 0 auto; width: 16px; height: 16px; color: var(--rd-c, var(--v211-gold)); }
.rd-tiles.is-loading i { display: block; height: 52px; border-radius: 14px; background: linear-gradient(90deg, var(--v211-soft), color-mix(in srgb, var(--v211-gold) 8%, var(--v211-soft)), var(--v211-soft)); background-size: 200% 100%; animation: v211-shimmer 1.2s linear infinite; }
@keyframes v211-shimmer { to { background-position: -200% 0; } }
@media (prefers-reduced-motion: reduce) { .rd-tiles.is-loading i { animation: none; } }