:root {
  --bc-bg: #050a12;
  --bc-surface: #0f1b2a;
  --bc-surface-2: #101c2b;
  --bc-cyan: #00e5ff;
  --bc-cyan-light: #40f0ff;
  --bc-white: #ffffff;
  --bc-secondary: #7a8ca8;
  --bc-divider: #17324a;
  --bc-red: #ff3838;
  --bc-orange: #ff8a00;
  --bc-gold: #ffd34d;
  --bc-green: #39e06b;
  --radius-hero: 24px;
  --radius-large: 20px;
  --radius-card: 18px;
  --radius-row: 14px;
  --radius-button: 14px;
  --content-x: 16px;
  --safe-top: max(env(safe-area-inset-top), var(--tg-safe-area-inset-top, 0px), var(--bc-tg-safe-top, 0px));
  --content-safe-top: max(var(--safe-top), var(--tg-content-safe-area-inset-top, 0px), var(--bc-tg-content-top, 0px));
  --safe-bottom: max(env(safe-area-inset-bottom), var(--tg-safe-area-inset-bottom, 0px), var(--bc-tg-safe-bottom, 0px));
  color-scheme: dark;
  font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

* { box-sizing: border-box; }
html, body { margin: 0; min-height: 100%; background: var(--bc-bg); color: var(--bc-white); }
body { min-width: 320px; overflow-x: hidden; }
button { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
button:focus-visible { outline: 2px solid var(--bc-cyan); outline-offset: 2px; }
.icon { width: 20px; height: 20px; flex: 0 0 auto; }

.app-shell { min-height: 100dvh; background: radial-gradient(circle at 50% -20%, rgba(0,229,255,.07), transparent 34%), var(--bc-bg); }
.page-content { width: min(100% - 32px, 430px); margin: 0 auto; padding-top: calc(var(--content-safe-top) + 12px); padding-bottom: calc(94px + var(--safe-bottom)); }
.live-hero { position: relative; height: 220px; overflow: hidden; border-radius: var(--radius-hero); border: 1.5px solid var(--bc-cyan); background: url('../assets/courier-master.webp') center 42% / cover no-repeat; box-shadow: inset 0 0 36px rgba(0,229,255,.04); }
.live-hero__shade { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(5,10,18,.08) 0%, rgba(5,10,18,.18) 34%, rgba(5,10,18,.94) 100%); }
.status-pill { position: relative; z-index: 2; display: inline-flex; align-items: center; gap: 7px; min-height: 28px; padding: 0 10px; border-radius: 9px; font-size: 11px; font-weight: 800; letter-spacing: .03em; }
.status-pill--live { color: #fff; background: #5d0d14; border: 1px solid #b7202f; box-shadow: 0 0 12px rgba(255,56,56,.13); }
.status-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--bc-red); box-shadow: 0 0 8px rgba(255,56,56,.85); }
.live-hero > .status-pill { position: absolute; top: 16px; left: 16px; }
.live-hero__copy { position: absolute; z-index: 2; left: 18px; right: 18px; bottom: 16px; max-width: 63%; }
.live-hook { margin: 0; font-size: 27px; line-height: 1.02; letter-spacing: -.04em; font-weight: 900; text-shadow: 0 3px 20px rgba(0,0,0,.55); }
.live-hero__subtitle { max-width: 250px; margin: 7px 0 11px; color: rgba(239,247,255,.78); font-size: 12px; line-height: 1.35; }
.primary-cta, .small-cta, .support-cta { border: 1.5px solid var(--bc-cyan); color: var(--bc-white); background: linear-gradient(180deg, rgba(9,53,70,.95), rgba(6,31,44,.98)); font-weight: 800; letter-spacing: .02em; }
.primary-cta { width: 100%; min-height: 44px; border-radius: var(--radius-button); box-shadow: inset 0 0 22px rgba(0,229,255,.12), 0 0 16px rgba(0,229,255,.11); }

.metrics-strip { margin-top: 16px; min-height: 72px; display: grid; grid-template-columns: repeat(3,1fr); border-radius: var(--radius-large); border: 1px solid var(--bc-divider); background: var(--bc-surface-2); overflow: hidden; }
.metric-item { position: relative; display: grid; place-items: center; align-content: center; min-width: 0; }
.metric-item:not(:last-child)::after { content: ''; position: absolute; right: 0; top: 16px; bottom: 16px; width: 1px; background: var(--bc-divider); }
.metric-value { font-size: 21px; line-height: 1; font-weight: 900; }
.metric-label { margin-top: 7px; color: var(--bc-secondary); font-size: 9px; line-height: 1; font-weight: 800; letter-spacing: .06em; }
.content-section { margin-top: 20px; }
.section-heading { min-height: 30px; display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 11px; }
.section-heading h2 { margin: 0; font-size: 15px; font-weight: 900; letter-spacing: .01em; }
.section-more { border: 0; background: transparent; color: var(--bc-cyan-light); font-size: 11px; font-weight: 800; padding: 8px 0 8px 12px; }
.event-list { display: grid; gap: 8px; }
.event-row { width: 100%; min-height: 56px; display: grid; grid-template-columns: 24px minmax(0,1fr) 22px; align-items: center; gap: 10px; padding: 8px 12px; text-align: left; color: var(--bc-white); background: var(--bc-surface-2); border: 1px solid var(--bc-divider); border-radius: var(--radius-row); }
.event-dot { width: 18px; height: 18px; border-radius: 50%; box-shadow: 0 0 12px currentColor; }
.event-dot--danger { color: var(--bc-red); background: var(--bc-red); }
.event-dot--cyan { color: var(--bc-cyan); background: var(--bc-cyan); }
.event-dot--cargo { color: var(--bc-orange); background: var(--bc-orange); }
.event-copy { min-width: 0; display: grid; gap: 4px; }
.event-copy strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 12px; }
.event-copy small { color: var(--bc-secondary); font-size: 10px; }
.event-row > .icon { color: #a9bed1; width: 18px; height: 18px; }

.featured-card { position: relative; height: 170px; display: flex; flex-direction: column; justify-content: space-between; padding: 16px; background-size: cover; background-position: center 44%; border-radius: var(--radius-large); border: 1px solid rgba(0,229,255,.65); overflow: hidden; }
.featured-card__top, .featured-card__bottom { position: relative; z-index: 1; display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.featured-card__top > strong { font-size: 16px; font-weight: 900; }
.featured-stats { display: flex; gap: 16px; }
.featured-stat { display: grid; grid-template-columns: 22px auto; column-gap: 6px; align-items: center; }
.featured-stat .icon { grid-row: 1 / span 2; color: #fff; }
.featured-stat strong { font-size: 14px; line-height: 1; }
.featured-stat small { margin-top: 3px; color: #c9d7e4; font-size: 9px; font-weight: 700; }
.small-cta { min-width: 118px; min-height: 38px; border-radius: 12px; font-size: 11px; }
.favorite-card { width: 100%; min-height: 78px; display: grid; grid-template-columns: 56px minmax(0,1fr) 22px; align-items: center; gap: 14px; padding: 12px; color: var(--bc-white); text-align: left; background: var(--bc-surface-2); border: 1px solid var(--bc-divider); border-radius: var(--radius-card); }
.favorite-avatar { width: 56px; height: 56px; border-radius: 16px; object-fit: cover; border: 1px solid rgba(0,229,255,.55); }
.favorite-copy { display: grid; gap: 5px; }
.favorite-copy strong { font-size: 16px; font-weight: 900; }
.favorite-copy small { color: var(--bc-secondary); font-size: 10px; }
.mini-live { width: max-content; margin-top: 2px; padding: 3px 7px; border-radius: 8px; color: #fff; background: #6b1118; font-size: 9px; font-weight: 900; }
.favorite-card > .icon { color: #b7c8d8; }

.project-support-card { margin-top: 20px; min-height: 106px; display: grid; grid-template-columns: 56px minmax(0,1fr); gap: 12px; align-items: center; padding: 16px; border-radius: var(--radius-large); border: 1.5px solid var(--bc-gold); background: linear-gradient(115deg, #17150d, #0e1111 55%, #18140b); box-shadow: inset 0 0 22px rgba(255,211,77,.05); }
.support-star { width: 48px; height: 48px; display: grid; place-items: center; color: var(--bc-gold); filter: drop-shadow(0 0 9px rgba(255,211,77,.38)); }
.support-star .icon { width: 38px; height: 38px; }
.support-copy { min-width: 0; display: grid; gap: 4px; }
.support-copy strong { font-size: 12px; font-weight: 900; }
.support-copy small { color: #c7c3ad; font-size: 10px; }
.support-cta { grid-column: 1 / -1; min-height: 40px; border-color: var(--bc-gold); border-radius: 12px; background: linear-gradient(180deg, #5a4610, #281f09); color: #fff; font-size: 12px; box-shadow: inset 0 0 16px rgba(255,211,77,.1); }

.bottom-nav { position: fixed; z-index: 30; left: 50%; bottom: 0; transform: translateX(-50%); width: min(100%, 462px); min-height: calc(70px + var(--safe-bottom)); padding: 5px 8px var(--safe-bottom); display: grid; grid-template-columns: repeat(2,1fr); background: rgba(8,19,29,.97); border-top: 1px solid rgba(0,229,255,.25); backdrop-filter: blur(16px); }
.nav-item { position: relative; min-height: 62px; display: grid; place-items: center; align-content: center; gap: 4px; color: #92a8bd; background: transparent; border: 0; border-radius: 15px; font-size: 9px; font-weight: 800; }
.nav-item .icon { width: 21px; height: 21px; }
.nav-item--active { color: var(--bc-cyan); text-shadow: 0 0 10px rgba(0,229,255,.35); }
.nav-item--active::before { content: ''; position: absolute; top: 0; left: 50%; width: 54px; height: 2px; transform: translateX(-50%); border-radius: 2px; background: var(--bc-cyan); box-shadow: 0 0 8px rgba(0,229,255,.65); }
.stale-banner { margin-top: 16px; padding: 10px 12px; border-radius: 12px; border: 1px solid var(--bc-divider); color: #c9d7e4; background: var(--bc-surface-2); font-size: 11px; }
.app-toast { position: fixed; z-index: 100; left: 50%; bottom: calc(88px + var(--safe-bottom)); width: min(calc(100% - 32px), 390px); transform: translate(-50%, 12px); opacity: 0; padding: 12px 14px; color: #eef8ff; background: rgba(15,27,42,.98); border: 1px solid rgba(0,229,255,.45); border-radius: 14px; box-shadow: 0 12px 30px rgba(0,0,0,.4); font-size: 11px; text-align: center; transition: .2s ease; pointer-events: none; }
.app-toast--visible { transform: translate(-50%,0); opacity: 1; }

@media (max-width: 359px) {
  .page-content { width: calc(100% - 20px); }
  .live-hook { font-size: 27px; }
}

@media (min-width: 431px) {
  .page-content { max-width: 430px; }
}

/* Milestone 02 — MATCH. Uses the same canon tokens, radii and UI language as LIVE. */
.match-hero {
  position: relative; height: 180px; overflow: hidden; margin-top: 0;
  border-radius: var(--radius-hero); border: 1.5px solid var(--bc-cyan);
  background-size: cover; background-position: center;
}
.match-hero > .status-pill { position: absolute; top: 16px; left: 16px; }
.match-hero__copy { position: absolute; left: 20px; right: 20px; bottom: 18px; display: grid; gap: 6px; }
.match-title { margin: 0; font-size: 25px; line-height: 1; font-weight: 900; letter-spacing: -.03em; }
.match-alive { font-size: 15px; font-weight: 900; }
.match-watchers { color: #d7e4f0; font-size: 11px; font-weight: 700; }
.match-sector { color: var(--bc-cyan-light); font-size: 10px; font-weight: 800; letter-spacing: .04em; }
.match-status-strip { margin-top: 16px; min-height: 72px; display: grid; grid-template-columns: repeat(3,1fr); border-radius: var(--radius-large); border: 1px solid var(--bc-cyan); background: var(--bc-surface-2); overflow: hidden; }
.match-status-item { position: relative; display: grid; place-items: center; align-content: center; gap: 5px; }
.match-status-item:not(:last-child)::after { content:''; position:absolute; right:0; top:16px; bottom:16px; width:1px; background:var(--bc-divider); }
.match-status-value { font-size: 21px; line-height: 1; font-weight: 900; }
.match-status-value--cyan { color: var(--bc-cyan-light); }
.match-status-value--muted { color: #9aacc0; }
.match-status-value--white { color: var(--bc-white); }
.match-status-item small { color: var(--bc-secondary); font-size: 9px; font-weight: 800; }
.match-player-list { display: grid; gap: 8px; }
.match-player-card { width:100%; min-height:82px; display:grid; grid-template-columns:58px minmax(0,1fr) auto 18px; align-items:center; gap:12px; padding:12px; color:var(--bc-white); text-align:left; background:var(--bc-surface-2); border:1px solid var(--bc-divider); border-radius:var(--radius-card); }
.match-player-card--selected { border-color: var(--bc-cyan); }
.match-player-card--out { opacity: .64; }
.match-player-avatar { width:56px; height:56px; object-fit:cover; border-radius:16px; border:1px solid rgba(0,229,255,.55); }
.match-player-copy { min-width:0; display:grid; gap:5px; }
.match-player-copy strong { font-size:16px; font-weight:900; }
.match-player-copy small { color:var(--bc-secondary); font-size:10px; }
.match-player-sub { color:var(--bc-secondary); font-size:9px; font-weight:800; }
.match-player-status { min-width:64px; padding:6px 8px; text-align:center; border-radius:10px; font-size:9px; font-weight:900; }
.match-player-status--active { color:#dfffea; background:#0b6d42; }
.match-player-status--danger { color:#fff; background:#a51f2a; }
.match-player-status--out { color:#c6d2de; background:#253647; }
.match-player-card > .icon { color:#9fb4c8; width:16px; height:16px; }
.match-support-panel { margin-top:18px; display:grid; grid-template-columns:minmax(0,1fr) auto; gap:12px; align-items:center; padding:16px; border:1px solid var(--bc-divider); border-radius:var(--radius-card); background:var(--bc-surface-2); }
.match-support-copy { display:grid; gap:5px; }
.match-support-copy strong { font-size:17px; font-weight:900; }
.match-support-copy small { color:var(--bc-secondary); font-size:10px; }
.match-selected-chip { grid-column:1; width:max-content; max-width:100%; padding:7px 10px; border-radius:12px; border:1px solid var(--bc-cyan); color:#dff9ff; background:#0b2130; font-size:9px; font-weight:800; }
.match-support-btn { grid-column:2; grid-row:1 / span 2; min-width:128px; min-height:42px; border-radius:12px; border:1px solid var(--bc-cyan); color:var(--bc-white); background:#0a1d2a; font-size:10px; font-weight:900; }
.match-out-row { width:100%; min-height:50px; margin-top:10px; display:flex; align-items:center; justify-content:space-between; padding:0 14px; border:1px solid var(--bc-divider); border-radius:14px; color:#d1dce7; background:var(--bc-surface-2); font-size:11px; font-weight:900; }
.match-out-row .icon { transform:rotate(90deg); color:var(--bc-secondary); }
.match-cta-row { margin-top:24px; display:grid; grid-template-columns:1.35fr .85fr; gap:10px; }
.match-cta { min-height:48px; border-radius:14px; border:1px solid #35506a; color:var(--bc-white); background:var(--bc-surface-2); font-size:10px; font-weight:900; }
.match-cta--primary { border-color:var(--bc-cyan); background:#0a1d2a; }
.updating-card { margin-top:18px; min-height:72px; display:flex; align-items:center; gap:12px; padding:14px; border:1px solid var(--bc-divider); border-radius:14px; color:#d7e4f0; background:var(--bc-surface-2); font-size:11px; }
.updating-ring { width:28px; height:28px; border-radius:50%; border:4px solid #23384e; border-top-color:var(--bc-cyan); }

@media (max-width: 359px) {
  .match-support-panel { grid-template-columns:1fr; }
  .match-support-btn { grid-column:1; grid-row:auto; width:100%; }
  .match-player-card { grid-template-columns:64px minmax(0,1fr) 18px; }
  .match-player-avatar { width:64px; height:64px; }
  .match-player-status { grid-column:2; width:max-content; }
}

/* Milestone 03 — PLAYER + DISCOVER. No new visual language: reuses canon tokens from LIVE/MATCH. */
.player-hero { position:relative; min-height:188px; overflow:hidden; display:grid; grid-template-columns:96px minmax(0,1fr); align-items:center; gap:14px; padding:16px; border-radius:var(--radius-hero); border:1.5px solid var(--bc-cyan); background-size:cover; background-position:center; }
.player-hero__avatar { width:94px; height:94px; border-radius:20px; object-fit:cover; border:1.5px solid var(--bc-cyan); box-shadow:0 0 16px rgba(0,229,255,.12); }
.player-hero__copy { display:grid; align-content:center; justify-items:start; gap:7px; min-width:0; }
.player-name { margin:0; font-size:26px; line-height:1; font-weight:900; letter-spacing:-.03em; }
.player-sector { color:var(--bc-cyan-light); font-size:14px; font-weight:900; }
.player-match { color:#d7e4f0; font-size:11px; font-weight:700; }
.player-insignia-name { color:var(--bc-gold); font-size:10px; font-weight:900; }
.player-image-btn { position:absolute; right:14px; bottom:14px; min-width:130px; min-height:36px; border-radius:12px; border:1px solid var(--bc-cyan); color:var(--bc-white); background:#0a1d2a; font-size:10px; font-weight:900; }
.player-panel { margin-top:12px; padding:14px; border-radius:var(--radius-large); border:1px solid var(--bc-divider); background:var(--bc-surface-2); }
.player-panel > .section-heading { margin-bottom:10px; }
.player-image-list { display:grid; gap:8px; }
.player-image-option { min-height:42px; display:flex; align-items:center; justify-content:space-between; gap:10px; padding:0 13px; border-radius:12px; border:1px solid #35506a; color:var(--bc-white); background:var(--bc-surface); font-size:10px; font-weight:900; text-align:left; }
.player-image-option--active { border-color:var(--bc-cyan); background:#0a2230; }
.player-image-option:disabled { color:#718399; opacity:.7; }
.player-radio { width:14px; height:14px; border-radius:50%; border:4px solid var(--bc-cyan); }
.player-image-disabled { margin-left:auto; color:#6f8297; font-size:8px; }
.player-telemetry { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; }
.telemetry-item { min-width:0; display:grid; gap:7px; }
.telemetry-item small { color:var(--bc-secondary); font-size:9px; font-weight:900; }
.telemetry-value { font-size:22px; font-weight:900; }
.telemetry-value--cyan { color:var(--bc-cyan-light); }
.telemetry-value--green { color:var(--bc-green); }
.telemetry-value--white { color:var(--bc-white); }
.telemetry-track { height:7px; border-radius:6px; overflow:hidden; background:#1b2a3b; }
.telemetry-fill { display:block; height:100%; border-radius:inherit; background:var(--bc-cyan); box-shadow:0 0 8px rgba(0,229,255,.25); }
.insignia-card { margin-top:12px; min-height:112px; display:grid; grid-template-columns:66px minmax(0,1fr); align-items:center; gap:18px; padding:18px; border-radius:var(--radius-large); border:1px solid #6a5b2b; background:var(--bc-surface-2); }
.insignia-medallion { width:62px; height:62px; display:grid; place-items:center; border-radius:50%; border:3px solid var(--bc-gold); color:var(--bc-gold); background:#201b0d; font-size:28px; font-weight:900; }
.insignia-copy { display:grid; gap:5px; }
.insignia-copy strong { font-size:18px; font-weight:900; }
.insignia-copy span { color:#e6d79a; font-size:11px; font-weight:800; }
.insignia-copy small { color:var(--bc-secondary); font-size:10px; }
.insignia-copy .insignia-holder { color:var(--bc-cyan-light); font-weight:800; }
.player-action { min-height:46px; border-radius:13px; border:1px solid #35506a; color:var(--bc-white); background:var(--bc-surface-2); font-size:10px; font-weight:900; }
.player-action--primary { width:100%; border-color:var(--bc-cyan); background:#0a1d2a; }
.player-action--gold { border-color:var(--bc-gold); background:#18150c; }
.player-action-row { margin-top:10px; display:grid; grid-template-columns:1fr 1.35fr 1fr; gap:9px; }
.player-event-copy { min-width:0; display:grid; grid-template-columns:46px minmax(0,1fr); gap:8px; align-items:center; }
.player-event-copy small { color:var(--bc-secondary); font-size:9px; }
.player-event-copy strong { font-size:11px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.player-current-match { min-height:126px; display:flex; align-items:flex-end; justify-content:space-between; gap:12px; padding:16px; border-radius:var(--radius-large); border:1px solid var(--bc-divider); background-size:cover; background-position:center; overflow:hidden; }
.player-current-match__copy { display:grid; justify-items:start; gap:7px; }
.player-current-match__copy > strong { font-size:18px; font-weight:900; }
.player-current-match__stats { color:#d7e4f0; font-size:10px; font-weight:700; }
.player-duo { margin-top:16px; display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.player-audience { margin-top:0; display:grid; align-content:center; gap:6px; }
.panel-kicker { color:var(--bc-secondary); font-size:9px; font-weight:900; }
.audience-count { font-size:20px; font-weight:900; }
.audience-supporters { color:var(--bc-cyan-light); font-size:11px; font-weight:900; }
.main-sponsor-card { min-height:116px; display:grid; align-content:center; gap:7px; padding:16px; border-radius:var(--radius-large); border:1.5px solid var(--bc-gold); background:#17150d; }
.main-sponsor-card small { color:var(--bc-gold); font-size:9px; font-weight:900; }
.main-sponsor-card strong { font-size:19px; font-weight:900; }
.main-sponsor-card span { color:#d8cb8b; font-size:10px; }
.sponsor-open { min-height:32px; border-radius:10px; border:1px solid #8a6c17; color:var(--bc-gold); background:#2a220b; font-size:9px; font-weight:900; }
.player-rank { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; }
.player-rank-item { display:grid; gap:6px; }
.player-rank-item small { color:var(--bc-secondary); font-size:8px; font-weight:900; }
.player-rank-item strong { font-size:18px; font-weight:900; }
.player-rank-cyan { color:var(--bc-cyan-light); }
.player-rank-foot { grid-column:1/-1; margin-top:4px; padding:12px 0 0; text-align:left; border:0; border-top:1px solid var(--bc-divider); color:#d7e4f0; background:transparent; font-size:10px; font-weight:700; }
.roblox-avatar-state { margin-top:16px; min-height:80px; display:flex; align-items:center; justify-content:space-between; gap:12px; padding:14px; border-radius:var(--radius-card); border:1px solid var(--bc-divider); background:var(--bc-surface-2); }
.roblox-avatar-state > div { display:grid; gap:5px; }
.roblox-avatar-state strong { font-size:11px; }
.roblox-avatar-state small { color:var(--bc-secondary); font-size:9px; }
.roblox-avatar-state button { min-width:130px; min-height:38px; border-radius:11px; border:1px solid #30455b; color:#6e8298; background:#172331; font-size:9px; font-weight:900; }

.discover-hero { position:relative; height:190px; overflow:hidden; border-radius:var(--radius-hero); border:1px solid rgba(0,229,255,.4); background:url('../assets/courier-master.webp') center 42% / cover no-repeat; }
.discover-hero__shade { position:absolute; inset:0; background:linear-gradient(90deg,rgba(5,10,18,.95) 0%,rgba(5,10,18,.4) 62%,rgba(5,10,18,.24) 100%); }
.discover-hero__copy { position:absolute; left:20px; right:20px; bottom:18px; }
.discover-hero__copy h1 { margin:0; font-size:26px; font-weight:900; letter-spacing:-.03em; }
.discover-hero__copy p { margin:7px 0 0; color:#c8d8e8; font-size:12px; }
.discover-search { margin-top:12px; min-height:46px; display:flex; align-items:center; gap:12px; padding:0 15px; border-radius:16px; border:1px solid #35506a; background:var(--bc-surface-2); }
.discover-search .icon { width:24px; height:24px; color:#9cb5ce; }
.discover-search__input { width:100%; min-width:0; border:0; outline:0; color:var(--bc-white); background:transparent; font:600 12px/1.2 Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; }
.discover-search__input::placeholder { color:#8ca3bb; opacity:1; }
.discover-filters { margin-top:12px; display:grid; grid-template-columns:1.15fr 1.25fr .9fr .9fr; gap:8px; }
.discover-filter { min-height:38px; padding:0 8px; border-radius:13px; border:1px solid #35506a; color:var(--bc-white); background:var(--bc-surface-2); font-size:9px; font-weight:900; }
.discover-filter--active { color:#031017; border-color:var(--bc-cyan); background:linear-gradient(180deg,#40f0ff,#00c6e2); box-shadow:0 0 14px rgba(0,229,255,.2); }
.discover-match-row, .discover-player-row { display:grid; grid-auto-flow:column; grid-auto-columns:76%; gap:10px; overflow-x:auto; padding-bottom:4px; scrollbar-width:none; scroll-snap-type:x proximity; }
.discover-match-row::-webkit-scrollbar,.discover-player-row::-webkit-scrollbar{display:none;}
.discover-match-card { height:154px; display:flex; flex-direction:column; justify-content:space-between; padding:14px; border-radius:var(--radius-card); border:1px solid var(--bc-cyan); color:var(--bc-white); text-align:left; background-size:cover; background-position:center; scroll-snap-align:start; }
.discover-match-card__top { display:flex; align-items:flex-start; justify-content:space-between; gap:8px; }
.discover-match-card__top strong { font-size:15px; font-weight:900; }
.discover-match-card__stats { display:flex; gap:16px; }
.discover-match-card__stats > span { display:grid; grid-template-columns:20px auto; column-gap:5px; align-items:center; }
.discover-match-card__stats .icon { grid-row:1/span 2; width:18px; height:18px; }
.discover-match-card__stats strong { font-size:12px; }
.discover-match-card__stats small { color:#c9d7e4; font-size:8px; font-weight:900; }
.discover-player-row { grid-auto-columns:44%; }
.discover-player-card { min-height:176px; display:grid; grid-template-rows:116px auto auto; align-items:center; justify-items:center; overflow:hidden; padding:8px 8px 12px; border-radius:var(--radius-card); border:1px solid #35506a; color:var(--bc-white); background:var(--bc-surface-2); }
.discover-player-card__image { width:100%; height:145px; object-fit:cover; border-radius:13px; }
.discover-player-card > strong { margin-top:8px; font-size:14px; font-weight:900; }
.discover-player-followers { display:flex; align-items:center; gap:8px; color:#9ec7ea; font-size:13px; font-weight:900; }
.discover-player-dot { width:14px; height:14px; border-radius:50%; box-shadow:0 0 10px currentColor; }
.discover-player-dot--green { color:var(--bc-green); background:var(--bc-green); }
.discover-player-dot--cyan { color:var(--bc-cyan); background:var(--bc-cyan); }
.discover-player-dot--danger { color:var(--bc-red); background:var(--bc-red); }
.discover-player-dot--cargo { color:var(--bc-orange); background:var(--bc-orange); }
.discover-event-card { width:100%; min-height:144px; display:grid; grid-template-columns:minmax(0,1fr) 24px; align-items:center; padding:16px; border-radius:var(--radius-card); border:1px solid #35506a; color:var(--bc-white); text-align:left; background-size:cover; background-position:center; }
.discover-event-copy { display:grid; justify-items:start; gap:5px; }
.discover-event-kicker { color:var(--bc-cyan-light)!important; font-weight:900!important; }
.discover-event-copy strong { font-size:16px; font-weight:900; }
.discover-event-copy span { color:#c6d6e7; font-size:10px; }
.discover-event-copy small { color:#8fb0cc; font-size:9px; }
.discover-event-card > .icon { color:var(--bc-cyan-light); }
.discover-empty { margin-top:24px; min-height:150px; display:grid; place-content:center; gap:8px; padding:20px; text-align:center; border-radius:var(--radius-large); border:1px solid var(--bc-divider); background:var(--bc-surface-2); }
.discover-empty strong { font-size:15px; }
.discover-empty span { color:var(--bc-secondary); font-size:10px; }

@media (max-width:359px){
  .player-hero { grid-template-columns:104px minmax(0,1fr); min-height:250px; padding:18px 14px; }
  .player-hero__avatar { width:104px; height:104px; }
  .player-image-btn { right:14px; bottom:14px; min-width:120px; }
  .player-telemetry { grid-template-columns:repeat(2,1fr); }
  .player-action-row { grid-template-columns:1fr; }
  .player-duo { grid-template-columns:1fr; }
  .player-rank { grid-template-columns:repeat(2,1fr); }
  .discover-filters { grid-template-columns:1fr 1fr; }
  .discover-match-row { grid-auto-columns:84%; }
  .discover-player-row { grid-auto-columns:50%; }
}

/* Milestone 04 — DISRUPT + SPONSOR. Written canon has priority over old visual labels:
   DISRUPT = one user / one vote / no Stars; SPONSOR = Telegram-only support/visual status. */
.disrupt-hero { position:relative; min-height:220px; overflow:hidden; border-radius:var(--radius-hero); border:1.5px solid var(--bc-cyan); background-size:cover; background-position:center; }
.disrupt-hero__copy { position:absolute; left:20px; right:20px; bottom:18px; display:grid; justify-items:start; gap:8px; }
.disrupt-hero__copy h1 { margin:0; white-space:pre-line; font-size:28px; line-height:.98; font-weight:900; letter-spacing:-.035em; background:linear-gradient(180deg,#fff 20%,var(--bc-cyan-light) 100%); -webkit-background-clip:text; background-clip:text; color:transparent; }
.disrupt-hero__copy p { max-width:300px; margin:0; color:#c8d8e8; font-size:12px; line-height:1.35; }
.disrupt-opponent { width:100%; min-height:116px; display:grid; grid-template-columns:70px minmax(0,1fr) 20px; align-items:center; gap:14px; padding:16px; color:var(--bc-white); text-align:left; border:1px solid var(--bc-cyan); border-radius:var(--radius-large); background:var(--bc-surface-2); }
.disrupt-opponent__badge { width:64px; height:64px; display:grid; place-items:center; border-radius:18px; border:1px solid var(--bc-cyan); color:#dff9ff; background:#0c2132; font-size:27px; font-weight:900; }
.disrupt-opponent__copy { min-width:0; display:grid; gap:6px; }
.disrupt-opponent__name { display:flex; align-items:center; gap:10px; }
.disrupt-opponent__name strong { font-size:21px; font-weight:900; }
.disrupt-opponent__copy > small { color:#a9c2dc; font-size:11px; }
.disrupt-opponent__bars { display:grid; gap:7px; margin-top:3px; }
.disrupt-stat { display:grid; grid-template-columns:30px minmax(0,1fr) 28px; align-items:center; gap:8px; }
.disrupt-stat small { color:#a8bdd4; font-size:10px; font-weight:800; }
.disrupt-stat strong { font-size:11px; text-align:right; }
.disrupt-stat__track { height:8px; overflow:hidden; border-radius:8px; background:#18293b; }
.disrupt-stat__fill { display:block; height:100%; border-radius:inherit; }
.disrupt-stat__fill--cyan { background:linear-gradient(90deg,#00cfe8,#66f4ff); }
.disrupt-stat__fill--gold { background:linear-gradient(90deg,#f0a600,#ffe66a); }
.disrupt-opponent > .icon { width:18px; height:18px; color:#a5bdd6; }
.disrupt-grid { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.disrupt-effect { min-height:142px; display:grid; grid-template-columns:58px minmax(0,1fr); grid-template-rows:auto auto; gap:8px 12px; align-items:center; padding:14px; color:var(--bc-white); text-align:left; border:1px solid #35506a; border-radius:var(--radius-card); background:var(--bc-surface-2); }
.disrupt-effect__icon { width:54px; height:54px; display:grid; place-items:center; grid-row:1/span 2; border-radius:50%; border:1.5px solid currentColor; font-size:24px; font-weight:900; }
.disrupt-effect__copy { display:grid; gap:5px; align-self:end; }
.disrupt-effect__copy strong { font-size:14px; font-weight:900; }
.disrupt-effect__copy small { color:#a9c0d7; font-size:10px; line-height:1.3; }
.disrupt-effect__vote { min-height:28px; display:grid; place-items:center; align-self:start; padding:0 8px; border:1px solid currentColor; border-radius:10px; font-size:9px; font-weight:900; }
.disrupt-effect--cyan { color:#31eaff; border-color:#1e83c5; }
.disrupt-effect--danger { color:#ff5454; border-color:#be3341; }
.disrupt-effect--violet { color:#bd65ff; border-color:#7d3dbb; }
.disrupt-effect--gold { color:#ffd34d; border-color:#ad8218; }
.disrupt-effect--selected { border-width:2px; box-shadow:0 0 18px rgba(0,229,255,.25), inset 0 0 18px rgba(0,229,255,.06); }
.disrupt-effect--selected.disrupt-effect--danger { box-shadow:0 0 18px rgba(255,56,56,.22); }
.disrupt-effect--selected.disrupt-effect--violet { box-shadow:0 0 18px rgba(189,101,255,.22); }
.disrupt-effect--selected.disrupt-effect--gold { box-shadow:0 0 18px rgba(255,211,77,.22); }
.disrupt-vote-panel { margin-top:18px; display:grid; gap:9px; }
.disrupt-vote-cta { min-height:62px; border-radius:17px; border:2px solid var(--bc-cyan); color:var(--bc-white); background:linear-gradient(180deg,#0c77c8,#075087); box-shadow:0 0 18px rgba(0,229,255,.28), inset 0 0 18px rgba(64,240,255,.12); font-size:17px; font-weight:900; }
.disrupt-vote-cta--submitted { color:#d7e4f0; border-color:#35506a; background:#162638; box-shadow:none; }
.disrupt-rule { margin:0; color:#91abc4; font-size:10px; line-height:1.4; text-align:center; }
.disrupt-timer { color:var(--bc-cyan-light); font-size:10px; font-weight:800; text-align:center; }
.disrupt-footer-actions { margin-top:20px; display:grid; grid-template-columns:1.35fr .85fr; gap:10px; }
.disrupt-footer-card { min-height:76px; display:flex; align-items:center; justify-content:center; gap:10px; padding:12px; border:1px solid var(--bc-cyan); border-radius:var(--radius-card); color:var(--bc-white); background:#0a1d2a; font-size:10px; font-weight:900; }
.disrupt-footer-card .icon { width:26px; height:26px; }
.disrupt-footer-card--gold { border-color:var(--bc-gold); color:#fff5c2; background:#18150c; }
.disrupt-footer-card--gold .icon { color:var(--bc-gold); }

.sponsor-hero { position:relative; min-height:190px; overflow:hidden; display:grid; grid-template-columns:92px minmax(0,1fr); align-items:center; gap:14px; padding:16px; border-radius:var(--radius-hero); border:1.5px solid var(--bc-cyan); background-size:cover; background-position:center; }
.sponsor-hero__avatar { width:90px; height:90px; object-fit:cover; border-radius:19px; border:1.5px solid var(--bc-cyan); }
.sponsor-hero__copy { display:grid; justify-items:start; gap:7px; min-width:0; }
.sponsor-kicker { color:var(--bc-gold); font-size:11px; font-weight:900; }
.sponsor-hero__copy h1 { margin:0; font-size:26px; line-height:1; font-weight:900; }
.sponsor-hero__copy p { margin:2px 0 0; color:#c9d8e7; font-size:10px; line-height:1.4; }
.sponsor-panel { margin-top:16px; padding:16px; border:1px solid var(--bc-divider); border-radius:var(--radius-large); background:var(--bc-surface-2); }
.sponsor-panel > .section-heading { margin-bottom:10px; }
.sponsor-mode-row { display:grid; grid-template-columns:1fr 1fr 1.2fr; gap:8px; }
.sponsor-mode { min-height:44px; border:1px solid #35506a; border-radius:12px; color:var(--bc-white); background:var(--bc-surface); font-size:9px; font-weight:900; }
.sponsor-mode--active { color:var(--bc-gold); border-color:var(--bc-gold); background:#211c0c; }
.stars-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:8px; }
.stars-option { min-height:104px; display:grid; justify-items:center; align-content:center; gap:7px; padding:10px 6px; border:1px solid #35506a; border-radius:var(--radius-card); color:var(--bc-white); background:var(--bc-surface-2); }
.stars-option .icon { width:34px; height:34px; color:var(--bc-gold); filter:drop-shadow(0 0 8px rgba(255,211,77,.28)); }
.stars-option strong { font-size:13px; }
.stars-option small { color:#9fb3c8; font-size:7px; line-height:1.25; text-align:center; font-weight:900; }
.stars-option--active { border:2px solid var(--bc-cyan); box-shadow:0 0 16px rgba(0,229,255,.25), inset 0 0 14px rgba(0,229,255,.05); }
.main-sponsor-offer { margin-top:16px; min-height:128px; display:grid; grid-template-columns:60px minmax(0,1fr) auto; align-items:center; gap:14px; padding:16px; border:1.5px solid var(--bc-gold); border-radius:var(--radius-large); background:linear-gradient(90deg,#19150b,#201b0d); box-shadow:inset 0 0 22px rgba(255,211,77,.05); }
.main-sponsor-crown { width:54px; height:54px; display:grid; place-items:center; color:var(--bc-gold); font-size:34px; }
.main-sponsor-offer__copy { display:grid; gap:5px; }
.main-sponsor-offer__copy strong { font-size:16px; }
.main-sponsor-offer__copy p { margin:0; color:#d8d0a8; font-size:9px; line-height:1.35; }
.main-sponsor-offer__copy small { color:#9c8d55; font-size:8px; }
.main-sponsor-offer__cta { min-height:44px; padding:0 14px; border:1px solid var(--bc-gold); border-radius:12px; color:var(--bc-gold); background:#251f0a; font-size:9px; font-weight:900; }
.sponsor-visibility-row { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.sponsor-visibility { min-height:68px; display:grid; justify-items:start; align-content:center; gap:4px; padding:12px 14px; border:1px solid #35506a; border-radius:var(--radius-card); color:var(--bc-white); background:var(--bc-surface-2); text-align:left; }
.sponsor-visibility strong { font-size:11px; }
.sponsor-visibility small { color:#98acc1; font-size:9px; }
.sponsor-visibility--active { border:2px solid var(--bc-cyan); box-shadow:0 0 14px rgba(0,229,255,.16); }
.sponsor-cta-wrap { margin-top:18px; display:grid; gap:9px; }
.sponsor-primary-cta { min-height:62px; display:flex; align-items:center; justify-content:center; gap:12px; border:2px solid var(--bc-cyan); border-radius:17px; color:var(--bc-white); background:linear-gradient(180deg,#0b76c8,#07508a); box-shadow:0 0 18px rgba(0,229,255,.26); font-size:15px; font-weight:900; }
.sponsor-primary-cta .icon { width:30px; height:30px; color:#dffcff; }
.sponsor-rule { margin:0; color:#92a8bd; font-size:9px; line-height:1.4; text-align:center; }

@media (max-width:359px){
  .disrupt-grid { grid-template-columns:1fr; }
  .disrupt-opponent { grid-template-columns:72px minmax(0,1fr) 18px; }
  .disrupt-opponent__badge { width:64px; height:64px; }
  .disrupt-footer-actions { grid-template-columns:1fr; }
  .sponsor-hero { grid-template-columns:92px minmax(0,1fr); padding:16px; }
  .sponsor-hero__avatar { width:92px; height:92px; }
  .stars-grid { grid-template-columns:1fr 1fr; }
  .main-sponsor-offer { grid-template-columns:50px minmax(0,1fr); }
  .main-sponsor-offer__cta { grid-column:1/-1; }
  .sponsor-visibility-row { grid-template-columns:1fr; }
}

/* Milestone 05 — RANKING / PROFILE / SETTINGS. Uses frozen canon tokens only. */
.ranking-hero{position:relative;min-height:190px;overflow:hidden;border-radius:var(--radius-hero);border:1px solid rgba(0,229,255,.55);background-size:cover;background-position:center}
.ranking-hero__copy{position:absolute;left:20px;right:20px;bottom:18px;display:grid;justify-items:start;gap:8px}.ranking-kicker{font-size:24px}.ranking-hero h1{margin:0;white-space:pre-line;font-size:27px;line-height:.98;font-weight:900}.ranking-hero p{max-width:290px;margin:0;color:#c8d8e8;font-size:12px}
.ranking-season{margin-top:14px;border:1px solid var(--bc-divider);border-radius:var(--radius-large);background:var(--bc-surface-2);overflow:hidden}.ranking-season__top{display:flex;justify-content:space-between;gap:12px;padding:16px;border-bottom:1px solid var(--bc-divider);font-weight:900}.ranking-season__top small{color:var(--bc-cyan-light);font-size:10px}.ranking-season__stats{display:grid;grid-template-columns:repeat(4,1fr)}.ranking-season__stats>div{display:grid;place-items:center;align-content:center;min-height:76px;border-right:1px solid var(--bc-divider)}.ranking-season__stats>div:last-child{border-right:0}.ranking-season__stats strong{font-size:18px}.ranking-season__stats small{margin-top:5px;color:var(--bc-secondary);font-size:8px;font-weight:800;text-align:center}
.ranking-filters{margin-top:12px;display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.ranking-filter{min-height:42px;border:1px solid #35506a;border-radius:12px;color:#d9e6f2;background:var(--bc-surface-2);font-size:9px;font-weight:900}.ranking-filter--active{border-color:var(--bc-cyan);color:#031017;background:linear-gradient(180deg,#40f0ff,#00c6e2);box-shadow:0 0 14px rgba(0,229,255,.18)}
.ranking-podium-row{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;align-items:end}.ranking-podium-card{min-height:176px;padding:12px 8px;display:grid;justify-items:center;align-content:start;gap:5px;border:1px solid #466078;border-radius:var(--radius-card);color:var(--bc-white);background:var(--bc-surface-2)}.ranking-podium-card--2{min-height:184px}.ranking-podium-card--1{min-height:200px;border-color:var(--bc-gold);background:linear-gradient(180deg,#241f0d,#111b26);box-shadow:0 0 18px rgba(255,211,77,.15)}.ranking-podium-card--3{min-height:176px;border-color:#a96831}.ranking-podium-card img{width:58px;height:58px;object-fit:cover;border-radius:16px;border:1px solid var(--bc-cyan)}.ranking-podium-card--1 img{border-color:var(--bc-gold)}.ranking-place{font-size:24px;font-weight:900;color:#cfe0ef}.ranking-podium-card--1 .ranking-place,.ranking-podium-card--1 b{color:var(--bc-gold)}.ranking-podium-card strong{font-size:13px}.ranking-podium-card small,.ranking-points{color:#9ab1c8;font-size:9px}.ranking-podium-card b{font-size:17px}
.ranking-list{display:grid;gap:8px}.ranking-row{min-height:68px;display:grid;grid-template-columns:24px 46px minmax(0,1fr) auto 42px 18px;align-items:center;gap:9px;padding:8px 10px;border:1px solid var(--bc-divider);border-radius:14px;color:var(--bc-white);background:var(--bc-surface-2)}.ranking-row--me{border-color:var(--bc-cyan);box-shadow:inset 0 0 18px rgba(0,229,255,.06)}.ranking-row__avatar{width:44px;height:44px;border-radius:12px;object-fit:cover}.ranking-row__copy{display:grid;min-width:0}.ranking-row__copy strong{font-size:12px}.ranking-row__copy small{color:var(--bc-secondary);font-size:8px}.ranking-row__points{font-size:12px}.ranking-row>.icon{width:16px;color:#8da9c2}.ranking-delta{font-size:10px;color:#9bb2c8}.ranking-delta--up{color:var(--bc-green)}.ranking-delta--down{color:var(--bc-red)}
.my-rank-card{display:grid;grid-template-columns:1fr 62px 1fr;gap:10px;align-items:center;padding:14px;border:1px solid var(--bc-cyan);border-radius:var(--radius-large);background:var(--bc-surface-2)}.my-rank-card img{width:58px;height:58px;object-fit:cover;border-radius:14px}.my-rank-card>div{display:grid;gap:4px}.my-rank-card>div:first-child strong{font-size:25px}.my-rank-card small{color:var(--bc-secondary);font-size:9px}.my-rank-card .small-cta{grid-column:2/4}.ranking-actions{margin-top:18px;display:grid;grid-template-columns:1fr 1fr;gap:10px}.ranking-actions button{min-height:46px;border-radius:14px;display:flex;align-items:center;justify-content:center;gap:8px}

.profile-user-hero{position:relative;min-height:188px;display:grid;grid-template-columns:96px minmax(0,1fr);align-items:center;gap:14px;padding:14px;border:1px solid var(--bc-cyan);border-radius:var(--radius-hero);background-size:cover;background-position:center}.profile-user-hero__avatar{width:94px;height:94px;object-fit:cover;border-radius:20px;border:1.5px solid var(--bc-cyan)}.profile-user-hero__copy{display:grid;justify-items:start;gap:6px}.profile-user-hero h1{margin:0;font-size:26px;font-weight:900}.profile-user-hero__copy>strong{font-size:13px}.profile-user-hero__copy>small{color:#c6d6e6;font-size:10px}
.identity-grid{display:grid;gap:8px}.identity-row{min-height:62px;display:grid;grid-template-columns:100px minmax(0,1fr) auto;align-items:center;gap:10px;padding:10px 12px;border:1px solid #35506a;border-radius:14px;background:var(--bc-surface-2)}.identity-row strong{font-size:12px}.identity-row small{color:var(--bc-secondary);font-size:9px}.identity-ok{color:var(--bc-green);font-size:9px;font-weight:900}.identity-off{color:var(--bc-red);font-size:9px;font-weight:900}
.profile-stats{margin-top:14px;display:grid;grid-template-columns:repeat(4,1fr);border:1px solid var(--bc-divider);border-radius:var(--radius-large);overflow:hidden;background:var(--bc-surface-2)}.profile-stats>div{min-height:82px;display:grid;place-items:center;align-content:center;border-right:1px solid var(--bc-divider);text-align:center}.profile-stats>div:last-child{border-right:0}.profile-stats strong{font-size:19px}.profile-stats small{margin-top:6px;color:var(--bc-secondary);font-size:7px;font-weight:800}
.profile-favorite{width:100%;min-height:94px;display:grid;grid-template-columns:64px minmax(0,1fr) 24px 18px;align-items:center;gap:12px;padding:12px;border:1px solid #35506a;border-radius:var(--radius-large);color:var(--bc-white);background:var(--bc-surface-2);text-align:left}.profile-favorite img{width:60px;height:60px;object-fit:cover;border-radius:16px}.profile-favorite>div{display:grid;justify-items:start;gap:5px}.profile-favorite>div strong{font-size:18px}.profile-favorite>div small{color:#9bb6d1}.profile-fav-star{color:var(--bc-gold);font-size:22px}.profile-favorite>.icon{color:#9fb8d1}
.profile-activity{display:grid;gap:7px}.profile-activity-row{min-height:58px;display:grid;grid-template-columns:36px minmax(0,1fr) auto;align-items:center;gap:10px;padding:8px 12px;border:1px solid var(--bc-divider);border-radius:13px;background:var(--bc-surface-2)}.profile-activity-icon{font-size:20px}.profile-activity-copy{display:grid;gap:3px}.profile-activity-copy strong{font-size:11px}.profile-activity-copy small,.profile-activity-row time{color:var(--bc-secondary);font-size:8px}.achievement-row{display:grid;grid-template-columns:repeat(5,1fr);gap:7px}.achievement{min-height:100px;display:grid;justify-items:center;align-content:center;gap:5px;padding:7px;border:1px solid #35506a;border-radius:14px;background:var(--bc-surface-2);text-align:center}.achievement>span{font-size:25px}.achievement strong{font-size:8px}.achievement small{color:var(--bc-secondary);font-size:7px}.achievement--locked{opacity:.45}.profile-action-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px}.profile-action-grid button{min-height:46px;border-radius:14px;display:flex;align-items:center;justify-content:center;gap:8px}

.settings-hero{position:relative;min-height:176px;border:1px solid var(--bc-cyan);border-radius:var(--radius-hero);background-size:cover;background-position:center;overflow:hidden}.settings-hero__copy{position:absolute;left:20px;bottom:20px;display:grid;justify-items:start;gap:7px}.settings-hero__copy>.icon{width:34px;height:34px;color:var(--bc-cyan-light)}.settings-hero h1{margin:0;font-size:26px;font-weight:900}.settings-hero p{margin:0;color:#c9d9e8;font-size:12px}.language-list{display:grid;gap:6px}.language-row{min-height:44px;display:flex;align-items:center;justify-content:space-between;padding:0 14px;border:1px solid var(--bc-divider);border-radius:12px;color:var(--bc-white);background:var(--bc-surface-2);text-align:left}.language-row--active{border-color:var(--bc-cyan);background:#0a2432}.language-row strong{color:var(--bc-cyan);font-size:17px}.settings-row,.connection-row{min-height:66px;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:12px;padding:10px 13px;border:1px solid var(--bc-divider);border-radius:14px;background:var(--bc-surface-2)}.settings-row>div{display:grid;gap:4px}.settings-row strong,.connection-row strong{font-size:12px}.settings-row small,.connection-row small{color:var(--bc-secondary);font-size:9px}.toggle{width:54px;height:30px;padding:3px;border:0;border-radius:16px;background:#33485d}.toggle span{display:block;width:24px;height:24px;border-radius:50%;background:#fff;transition:transform .18s ease}.toggle--on{background:var(--bc-green)}.toggle--on span{transform:translateX(24px)}.settings-connections{display:grid;gap:8px}.connection-row{grid-template-columns:90px minmax(0,1fr) auto}.connection-row--button{width:100%;color:var(--bc-white);text-align:left;grid-template-columns:90px minmax(0,1fr) auto 18px}.connection-row--button>.icon{color:#9eb7d0}.settings-actions{margin-top:20px;display:grid;gap:10px}.settings-actions button{min-height:48px;border-radius:14px;display:flex;align-items:center;justify-content:center;gap:8px}

@media(max-width:359px){.ranking-season__stats,.profile-stats{grid-template-columns:repeat(2,1fr)}.ranking-season__stats>div:nth-child(2),.profile-stats>div:nth-child(2){border-right:0}.ranking-podium-card{padding-inline:5px}.ranking-row{grid-template-columns:20px 40px minmax(0,1fr) auto 30px}.ranking-row__avatar{width:38px;height:38px}.ranking-row>.icon{display:none}.profile-user-hero{grid-template-columns:82px minmax(0,1fr)}.profile-user-hero__avatar{width:80px;height:80px}.achievement-row{grid-template-columns:repeat(3,1fr)}.profile-action-grid,.ranking-actions{grid-template-columns:1fr}}

/* M7 CANON CORRECTION — binding overrides. No internal app header. */
.page-content > :first-child { margin-top: 0; }

/* Canonical character crops: black face + two vertical white rectangular eyes. */
.live-hero { background-position: 58% 42%; }
.match-hero, .player-current-match, .discover-match-card, .discover-event-card { background-position: center 44%; }
.player-hero, .sponsor-hero { background-position: 58% 42%; }
.disrupt-hero { background-position: 58% 40%; }

/* Level 3 PLAYER: preserve compact information density on narrow iPhones. */
@media (max-width:359px){
  .player-hero { grid-template-columns:82px minmax(0,1fr); min-height:188px; padding:12px; gap:10px; }
  .player-hero__avatar { width:80px; height:80px; border-radius:17px; }
  .player-name { font-size:23px; }
  .player-image-btn { right:12px; bottom:12px; min-width:108px; min-height:34px; }
}

/* Level 5 DISRUPT icons from approved icon vocabulary, never text glyphs/emoji. */
.disrupt-effect__icon { font-size:0; }
.disrupt-effect__icon-svg { width:30px; height:30px; }

/* Level 7 RANKING hero uses the approved Courier and trophy icon, not emoji. */
.ranking-hero { background-position:62% 42%; }
.ranking-kicker { width:30px; height:30px; display:grid; place-items:center; color:var(--bc-gold); }
.ranking-kicker .icon { width:26px; height:26px; }

/* Level 8 PROFILE hero is a profile header card, not a second PLAYER card. */
.profile-user-hero { width:100%; min-height:188px; display:block; padding:0; background-size:cover; background-position:68% 42%; overflow:hidden; }
.profile-user-hero__avatar { display:none; }
.profile-user-hero__copy { position:absolute; z-index:1; left:18px; top:18px; bottom:18px; width:52%; display:grid; align-content:center; justify-items:start; gap:6px; }
.profile-user-hero h1 { font-size:24px; }
.profile-user-hero__copy > strong { font-size:11px; }
.profile-user-hero__copy > small { font-size:9px; line-height:1.35; }
.identity-row { grid-template-columns:38px 78px minmax(0,1fr) auto; }
.identity-icon, .connection-icon { width:34px; height:34px; display:grid; place-items:center; color:var(--bc-cyan-light); border:1px solid #35506a; border-radius:9px; background:#0c2232; }
.identity-icon .icon, .connection-icon .icon { width:21px; height:21px; }
.profile-stats > div > .icon { width:18px; height:18px; color:#cce9ff; margin-bottom:3px; }
.profile-stats > div:last-child > .icon { color:var(--bc-gold); }
.profile-fav-star { width:24px; height:24px; display:grid; place-items:center; }
.profile-fav-star .icon { width:22px; height:22px; }
.profile-activity-row { grid-template-columns:32px minmax(0,1fr) auto 16px; }
.profile-activity-icon { width:28px; height:28px; display:grid; place-items:center; color:#d9ecff; }
.profile-activity-icon .icon { width:20px; height:20px; }
.profile-activity-row > .icon { width:15px; height:15px; color:#8da9c2; }
.achievement-icon { width:42px; height:42px; display:grid; place-items:center; border:1px solid #35506a; border-radius:12px; color:var(--bc-cyan-light); }
.achievement:nth-child(1) .achievement-icon { color:var(--bc-gold); border-color:#8a6c17; }
.achievement:nth-child(3) .achievement-icon { color:var(--bc-red); border-color:#8b2d36; }
.achievement:nth-child(4) .achievement-icon { color:#bd65ff; border-color:#704093; }
.achievement--locked .achievement-icon { color:#8394a8; }
.achievement-icon .icon { width:25px; height:25px; }

/* Level 9 SETTINGS: compact selector; full list opens only contextually. */
.settings-hero { min-height:176px; background-position:70% 42%; }
.language-selector { width:100%; min-height:50px; display:flex; align-items:center; justify-content:space-between; gap:12px; padding:0 14px; border:1px solid #35506a; border-radius:12px; color:var(--bc-white); background:var(--bc-surface-2); text-align:left; }
.language-selector__left, .language-selector__right { display:flex; align-items:center; gap:10px; }
.language-selector__left .icon { width:20px; height:20px; color:#d8ebff; }
.language-selector__left strong { font-size:11px; }
.language-selector__right { color:#c5d4e3; font-size:10px; }
.language-selector__right .icon { width:15px; height:15px; transform:rotate(90deg); color:#9eb7d0; }
.language-list--picker { margin-top:8px; overflow:hidden; border:1px solid #35506a; border-radius:12px; }
.language-list--picker .language-row { border:0; border-bottom:1px solid var(--bc-divider); border-radius:0; }
.language-list--picker .language-row:last-child { border-bottom:0; }
.language-list--picker .language-row--active { background:#0a2432; }
.language-list--picker .language-row .icon { width:18px; height:18px; color:var(--bc-cyan); }
.connection-row { grid-template-columns:38px 74px minmax(0,1fr) auto; }
.connection-row--button { grid-template-columns:38px 74px minmax(0,1fr) auto 18px; }
.connection-row--button > .icon { width:16px; height:16px; }

.main-sponsor-crown .icon { width:34px; height:34px; }

/* Level 6 SPONSOR latest approved component geometry. */
.sponsor-support-card { margin-top:16px; min-height:104px; display:grid; align-content:center; gap:6px; padding:16px; border:1px solid var(--bc-gold); border-radius:var(--radius-large); background:#17150d; }
.sponsor-support-card > small { color:var(--bc-cyan-light); font-size:9px; font-weight:900; }
.sponsor-support-card > strong { font-size:15px; font-weight:900; }
.sponsor-support-card > p { margin:0; color:#aab7c4; font-size:9px; line-height:1.4; }
.sponsor-visibility-list { display:grid; gap:8px; }
.sponsor-visibility-row { width:100%; min-height:58px; display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:center; gap:12px; padding:10px 13px; border:1px solid var(--bc-divider); border-radius:14px; color:var(--bc-white); background:var(--bc-surface-2); text-align:left; }
.sponsor-visibility-row > span:first-child { display:grid; gap:4px; }
.sponsor-visibility-row strong { font-size:10px; }
.sponsor-visibility-row small { color:var(--bc-secondary); font-size:8px; }
.sponsor-visibility-row--active { border-color:var(--bc-cyan); }
.sponsor-toggle { width:44px; height:24px; padding:3px; display:block; border-radius:14px; background:#31465a; }
.sponsor-toggle i { display:block; width:18px; height:18px; border-radius:50%; background:#fff; transition:transform .18s ease; }
.sponsor-toggle--on { background:var(--bc-cyan); }
.sponsor-toggle--on i { transform:translateX(20px); }
.discover-player-card { grid-template-rows:112px auto auto; }
.discover-player-card__image { height:112px; }

/* M7.1 bugfix behavior only — no visual redesign */
.match-out-row--expanded .icon { transform: rotate(-90deg); }
.match-out-list { margin-top: 8px; }
#player-image-selector { scroll-margin-top: calc(var(--content-safe-top) + 12px); }
.profile-activity-row { width:100%; color:var(--bc-white); text-align:left; font:inherit; }

/* Project Support dialog. Uses canon tokens only: existing colours, radii and
   surfaces. [hidden] is restated explicitly because an author display rule
   would otherwise win over the user-agent default. */
.bc-modal { position: fixed; inset: 0; z-index: 200; display: grid; align-items: end; justify-items: center; background: rgba(3,8,14,.74); backdrop-filter: blur(6px); }
.bc-modal[hidden] { display: none; }
.bc-modal__sheet { width: min(100%, 462px); max-height: calc(100vh - var(--safe-top) - 16px); max-height: calc(100dvh - var(--safe-top) - 16px); overflow-y: auto; overscroll-behavior: contain; -webkit-overflow-scrolling: touch; display: grid; gap: 12px; padding: 18px var(--content-x) calc(18px + var(--safe-bottom)); background: var(--bc-surface); border: 1px solid var(--bc-gold); border-radius: var(--radius-hero) var(--radius-hero) 0 0; box-shadow: 0 -14px 40px rgba(0,0,0,.55); }
.bc-modal__head { display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: center; gap: 12px; }
.bc-modal__title { font-size: 15px; font-weight: 900; color: var(--bc-gold); }
.bc-modal__close { min-width: 34px; min-height: 34px; border: 1px solid var(--bc-divider); border-radius: 12px; background: var(--bc-surface-2); color: var(--bc-white); font-size: 13px; }
.bc-modal__lead { margin: 0; color: #aab7c4; font-size: 10px; line-height: 1.45; }
.bc-modal__check { display: grid; place-items: center; width: 22px; height: 22px; color: var(--bc-cyan); }
.bc-modal__check[hidden] { display: none; }
.bc-modal__check .icon { width: 18px; height: 18px; }
.bc-modal__pay { min-height: 46px; }
.bc-modal__pay:disabled { opacity: .42; }
.bc-modal__status { margin: 0; min-height: 13px; color: var(--bc-secondary); font-size: 10px; text-align: center; }
.bc-modal__status--error { color: var(--bc-red); }
.bc-modal__status--ok { color: var(--bc-green); }

/* LIVE sponsor placement. Geometry follows the approved 709x1536 reference:
   heading on one line, cyan card frame, and the CTA as the only orange element
   on the screen. Canon tokens only. */
.ad-block { display: grid; gap: 6px; margin-top: 22px; }
.ad-block__heading { display: flex; align-items: baseline; gap: 8px; margin: 0; white-space: nowrap; }
.ad-block__heading-label { color: var(--bc-white); font-size: 13px; font-weight: 900; letter-spacing: .02em; }
.ad-block__heading-project { color: var(--bc-cyan-light); font-size: 15px; font-weight: 800; font-style: italic; }
@media (max-width: 359px) {
  .ad-block__heading-label { font-size: 11px; }
  .ad-block__heading-project { font-size: 13px; }
}

.ad-card { position: relative; display: grid; gap: 10px; padding: 12px; border: 1.5px solid var(--bc-cyan); border-radius: var(--radius-large); background-color: #071019; box-shadow: inset 0 0 26px rgba(0,229,255,.07); }
.ad-card__label { justify-self: start; padding: 4px 9px; border-radius: 8px; background: rgba(10,24,36,.86); border: 1px solid var(--bc-divider); color: #9fb3c8; font-size: 8px; font-weight: 900; letter-spacing: .08em; }
.ad-card__body { display: grid; grid-template-columns: minmax(0,1fr) 34%; gap: 12px; align-items: stretch; }
.ad-card__main { min-width: 0; display: grid; align-content: start; gap: 10px; }
.ad-card__head { display: grid; grid-template-columns: 62px minmax(0,1fr); gap: 12px; align-items: center; }
.ad-card__logo { width: 62px; height: 62px; display: grid; place-items: center; overflow: hidden; border: 1px solid rgba(0,229,255,.45); border-radius: var(--radius-card); background: #0b1a27; }
.ad-card__logo img { width: 100%; height: 100%; object-fit: cover; }
.ad-card__copy { min-width: 0; display: grid; gap: 4px; }
.ad-card__title { font-size: 20px; font-weight: 900; color: var(--bc-white); text-transform: uppercase; letter-spacing: .01em; }
.ad-card__lead { color: #b9c7d6; font-size: 11px; line-height: 1.35; }
/* auto-fit, not a fixed 3 columns: long Russian labels collided when forced
   into a third of the card. Items reflow to two rows instead of overlapping. */
.ad-card__benefits { display: grid; grid-template-columns: repeat(auto-fit, minmax(96px, 1fr)); gap: 8px 10px; }
.ad-card__benefit { display: grid; grid-template-columns: 14px minmax(0,1fr); gap: 6px; align-items: center; min-width: 0; color: #c3d2e0; font-size: 8px; font-weight: 800; line-height: 1.25; text-transform: uppercase; overflow-wrap: break-word; hyphens: none; }
.ad-card__benefit .icon { width: 14px; height: 14px; color: var(--bc-cyan); }

/* The only orange element on LIVE. The card frame stays cyan on purpose. */
.ad-card__cta { min-height: 40px; display: grid; grid-auto-flow: column; align-items: center; justify-content: center; gap: 10px; padding: 0 14px; border: 1.5px solid var(--bc-orange); border-radius: var(--radius-button); background: linear-gradient(180deg, #241704, #150e03); color: var(--bc-white); font-size: 11px; font-weight: 900; letter-spacing: .03em; }
.ad-card__cta .icon { width: 15px; height: 15px; color: var(--bc-orange); }

.ad-card__shot { overflow: hidden; border-radius: var(--radius-card); background: #0b1a27; }
.ad-card__shot img { width: 100%; height: 100%; object-fit: cover; object-position: left center; display: block; }
@media (max-width: 359px) {
  .ad-card__body { grid-template-columns: minmax(0,1fr); }
  .ad-card__shot { display: none; }
}

/* Owner-only advertising console. Canon tokens only; opens over SETTINGS and
   changes no approved screen. */
.ad-slot { display: contents; }
/* 100dvh follows the visible viewport when the iOS keyboard opens; plain
   inset:0 does not, which left the save button underneath the keyboard. */
.adm { position: fixed; inset: 0; height: 100dvh; z-index: 210; display: grid; overflow: hidden; background: var(--bc-bg); }
.adm[hidden] { display: none; }
/* content-safe-top, not safe-top: in fullscreen launch mode Telegram's own
   Close / collapse / menu controls float over the page, and the panel header
   used to sit underneath them where it could not be tapped. */
.adm__sheet { width: min(100%, 462px); height: 100%; min-height: 0; margin: 0 auto; display: grid; grid-template-rows: auto auto minmax(0,1fr); padding-top: calc(var(--content-safe-top) + 8px); }
.adm__head { display: grid; grid-template-columns: 40px minmax(0,1fr) 40px; align-items: center; gap: 8px; padding: 10px var(--content-x); border-bottom: 1px solid var(--bc-divider); }
.adm__title { text-align: center; font-size: 13px; font-weight: 900; color: var(--bc-cyan); }
.adm__nav { min-width: 36px; min-height: 36px; border: 1px solid var(--bc-divider); border-radius: 12px; background: var(--bc-surface-2); color: var(--bc-white); font-size: 15px; }
.adm__status { margin: 0; min-height: 14px; padding: 6px var(--content-x); color: var(--bc-secondary); font-size: 10px; text-align: center; }
.adm__status--error { color: var(--bc-red); }
.adm__status--ok { color: var(--bc-green); }
/* The bottom padding is deliberately large: it keeps the last field and the
   save button reachable above the keyboard on tall phones. */
.adm__body { display: grid; gap: 10px; align-content: start; min-height: 0; overflow-y: auto; -webkit-overflow-scrolling: touch; overscroll-behavior: contain; padding: 4px var(--content-x) calc(140px + var(--safe-bottom)); }
.adm__section { margin: 10px 0 2px; color: var(--bc-secondary); font-size: 10px; font-weight: 900; letter-spacing: .08em; }
.adm__field { display: grid; gap: 5px; }
.adm__label { color: var(--bc-secondary); font-size: 9px; font-weight: 800; text-transform: uppercase; }
.adm__input { width: 100%; min-height: 42px; padding: 10px 12px; border: 1px solid var(--bc-divider); border-radius: var(--radius-row); background: var(--bc-surface-2); color: var(--bc-white); font: inherit; font-size: 12px; }
.adm__input--area { min-height: 70px; resize: vertical; }
.adm__controls { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.adm__stats { display: grid; grid-template-columns: repeat(3,1fr); gap: 8px; }
.adm__stat { display: grid; gap: 2px; justify-items: center; padding: 10px 6px; border: 1px solid var(--bc-divider); border-radius: var(--radius-row); background: var(--bc-surface-2); }
.adm__stat strong { font-size: 14px; font-weight: 900; }
.adm__stat small { color: var(--bc-secondary); font-size: 8px; text-transform: uppercase; }
.adm__empty { margin: 0; padding: 12px; border: 1px dashed var(--bc-divider); border-radius: var(--radius-row); color: var(--bc-secondary); font-size: 10px; text-align: center; }
.adm__preview { display: grid; }

/* Destructive action in the ads console: red outline, never the primary style. */
.adm__delete { margin-top: 6px; border-color: var(--bc-red); color: var(--bc-red); background: rgba(255,56,56,.06); }
.adm__file { padding: 8px 10px; font-size: 11px; }

/* Advertising enquiry row on LIVE. Muted on purpose: it must not compete with
   the paid creative directly above it. */
.ad-enquiry { margin-top: 14px; }
.ad-enquiry__row { width: 100%; display: grid; grid-template-columns: minmax(0,1fr) 18px; align-items: center; gap: 10px; padding: 12px 14px; border: 1px dashed var(--bc-divider); border-radius: var(--radius-card); background: rgba(16,28,43,.5); text-align: left; }
.ad-enquiry__row strong { display: block; color: var(--bc-white); font-size: 11px; font-weight: 900; letter-spacing: .02em; }
.ad-enquiry__row small { display: block; margin-top: 3px; color: var(--bc-secondary); font-size: 10px; }
.ad-enquiry__row .icon { width: 18px; height: 18px; color: var(--bc-secondary); }
.adm__media { display: grid; gap: 6px; margin: -4px 0 4px; }

/* Advertiser cabinet. Reuses the console shell; only the report blocks are new. */
.cab__campaign { display: grid; gap: 8px; padding: 12px; border: 1px solid var(--bc-divider); border-radius: var(--radius-card); background: var(--bc-surface-2); }
.cab__name { color: var(--bc-white); font-size: 13px; font-weight: 900; }
.cab__meta { color: var(--bc-secondary); font-size: 10px; }
.cab__creatives { display: grid; gap: 6px; }
.cab__creative { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 10px; align-items: center; padding: 8px 10px; border: 1px solid var(--bc-divider); border-radius: var(--radius-row); color: #c3d2e0; font-size: 11px; }
.cab__nums { color: var(--bc-cyan); font-size: 10px; font-weight: 800; white-space: nowrap; }
.cab__note { margin: 4px 0 0; color: var(--bc-secondary); font-size: 9px; line-height: 1.4; }

/* DISRUPT — состав матча и состояние без боя. Язык прежний: те же рамки,
   те же скругления, те же шкалы, что у карточки бойца. */
.disrupt-targets { display:grid; gap:8px; }
.disrupt-target { width:100%; display:grid; grid-template-columns:44px minmax(0,1fr); align-items:center; gap:12px; padding:10px 12px; text-align:left; color:var(--bc-white); border:1px solid #35506a; border-radius:var(--radius-row); background:var(--bc-surface-2); }
.disrupt-target--chosen { border-color:var(--bc-gold); box-shadow:inset 0 0 18px rgba(255,211,77,.08); }
.disrupt-target--down { opacity:.45; }
.disrupt-target__badge { width:40px; height:40px; display:grid; place-items:center; border-radius:12px; border:1px solid var(--bc-cyan); background:#0c2132; color:#dff9ff; font-size:15px; font-weight:900; }
.disrupt-target__copy { min-width:0; display:grid; gap:6px; }
.disrupt-target__head { display:flex; align-items:baseline; justify-content:space-between; gap:10px; }
.disrupt-target__head strong { font-size:14px; font-weight:900; }
.disrupt-target__head small { color:#a8bdd4; font-size:10px; font-weight:800; }
.disrupt-empty { margin:0; padding:14px; border:1px dashed var(--bc-divider); border-radius:var(--radius-row); color:var(--bc-secondary); font-size:11px; text-align:center; }
.disrupt-offline { display:grid; gap:10px; justify-items:start; padding:16px; border:1px solid var(--bc-divider); border-radius:var(--radius-large); background:var(--bc-surface-2); }
.disrupt-offline strong { font-size:15px; font-weight:900; color:var(--bc-white); }
.disrupt-offline small { color:var(--bc-secondary); font-size:11px; line-height:1.4; }
.disrupt-offline .disrupt-vote-cta { width:100%; margin-top:2px; }

/* --- Главный экран: статус, поиск, лента попаданий, липкая кнопка --- */
/* Шапка на 220px уезжала во весь первый экран телефона и уводила бойцов,
   эффекты и кнопку под сгиб. Полоса занимает 56px и оставляет главное видимым. */
.disrupt-status { min-height:56px; display:flex; align-items:center; justify-content:space-between; gap:12px; padding:0 16px; overflow:hidden; border:1px solid var(--bc-cyan); border-radius:var(--radius-card); background-size:cover; background-position:58% 40%; }
.disrupt-status__left { display:flex; align-items:center; gap:10px; min-width:0; }
.disrupt-status__left strong { color:var(--bc-white); font-size:13px; font-weight:900; letter-spacing:-.01em; white-space:nowrap; }
.disrupt-status__clock { color:var(--bc-cyan-light); font-size:11px; font-weight:800; white-space:nowrap; }

.disrupt-search { width:100%; margin-top:10px; min-height:44px; display:flex; align-items:center; gap:10px; padding:0 14px; text-align:left; color:var(--bc-secondary); background:var(--bc-surface-2); border:1px solid var(--bc-divider); border-radius:14px; font-size:12px; font-weight:700; }
.disrupt-search__icon { width:17px; height:17px; flex:none; }

/* Зритель обязан видеть, чем кончились его голоса, не листая. */
.disrupt-feed { margin-top:12px; display:grid; gap:6px; }
.disrupt-feed__last { display:grid; gap:3px; padding:12px 14px; border-radius:16px; border:1px solid var(--bc-orange); background:linear-gradient(180deg,#1d1206,#120c06); }
.disrupt-feed__last strong { color:#ffd9ae; font-size:15px; font-weight:900; letter-spacing:-.01em; }
.disrupt-feed__last small { color:#c08f5e; font-size:10px; font-weight:700; }
.disrupt-feed__last--mine { border-color:var(--bc-gold); box-shadow:0 0 16px rgba(255,211,77,.18); }
.disrupt-feed__mine { justify-self:start; margin-top:4px; padding:3px 8px; border-radius:7px; color:#151003; background:var(--bc-gold); font-size:9px; font-weight:900; letter-spacing:.04em; }
.disrupt-feed__row { display:grid; grid-template-columns:38px minmax(0,1fr) auto; align-items:center; gap:10px; padding:8px 14px; border-radius:12px; border:1px solid var(--bc-divider); background:var(--bc-surface-2); }
.disrupt-feed__row span { min-width:0; color:#c9d7e4; font-size:11px; font-weight:700; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.disrupt-feed__row small { color:var(--bc-secondary); font-size:10px; font-weight:800; }

/* Кнопка не должна уезжать вместе с прокруткой: она одна и та же весь матч. */
.disrupt-vote-panel--sticky { position:sticky; z-index:20; bottom:calc(78px + var(--safe-bottom)); margin-top:14px; padding:10px 0 4px; background:linear-gradient(180deg,rgba(5,10,18,0),var(--bc-bg) 22%); }

/* --- Карта матча: восемь секторов 4×2 --- */
.disrupt-map { margin-top:12px; display:grid; gap:6px; }
.disrupt-map__grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:4px; padding:4px; border-radius:16px; border:1px solid rgba(0,229,255,.35); background:#061423; }
.disrupt-map__cell { position:relative; min-height:62px; display:grid; align-content:space-between; gap:4px; padding:6px; overflow:hidden; border-radius:11px; border:1px solid var(--bc-divider); background:var(--bc-surface-2); }
.disrupt-map__id { color:#4f6a86; font-size:9px; font-weight:900; letter-spacing:.06em; }
.disrupt-map__people { display:flex; flex-wrap:wrap; gap:3px; }
.disrupt-map__dot { min-width:22px; height:22px; padding:0 4px; display:grid; place-items:center; border-radius:7px; border:1px solid var(--bc-cyan); color:#dff9ff; background:#0c2a44; font-size:9px; font-weight:900; }
.disrupt-map__dot--chosen { border-color:var(--bc-gold); color:#1a1405; background:var(--bc-gold); box-shadow:0 0 10px rgba(255,211,77,.45); }
.disrupt-map__dot--bot { border-color:var(--bc-orange); color:#ffd9ae; background:#2a1606; }
.disrupt-map__dot--down { opacity:.35; }
.disrupt-map__cell--hit { border-color:var(--bc-orange); background:linear-gradient(180deg,#24140a,#140c06); }
.disrupt-map__cell--fresh { animation:disrupt-hit 1.2s ease-out 3; }
.disrupt-map__hit { color:#ffb56b; font-size:8px; font-weight:900; line-height:1.15; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.disrupt-map__note { color:var(--bc-secondary); font-size:10px; }
@keyframes disrupt-hit { 0% { box-shadow:0 0 0 0 rgba(255,138,0,.75); } 100% { box-shadow:0 0 0 12px rgba(255,138,0,0); } }
.disrupt-target__bot { margin-left:6px; padding:1px 5px; border-radius:5px; color:#1d1003; background:var(--bc-orange); font-size:8px; font-style:normal; font-weight:900; }
.disrupt-target--bot { border-color:var(--bc-orange); }

/* Причина, по которой полная шкала не выстрелит, не должна прятаться серым. */
.disrupt-rule--alert { color:#ffb56b; font-size:12px; font-weight:800; line-height:1.35; }
.disrupt-target--capped { opacity:.55; }

/* === Карта-пульт: квадрат, как сам мир; сектор вдвое выше, чем шире === */
.disrupt-map__grid { aspect-ratio:1 / 1; grid-template-rows:repeat(2,minmax(0,1fr)); }
.disrupt-map__cell { min-height:0; align-content:start; grid-template-rows:auto 1fr; cursor:pointer; isolation:isolate; }
.disrupt-map__id { position:relative; z-index:2; }
.disrupt-map__people { position:relative; z-index:2; display:grid; grid-template-columns:repeat(2,30px); grid-auto-rows:30px; gap:4px; align-content:start; justify-content:center; padding-top:4px; }
.disrupt-map__hit { position:absolute; z-index:3; left:6px; right:6px; bottom:6px; white-space:normal; font-size:8px; }
.disrupt-map__heat { position:absolute; inset:0; z-index:0; pointer-events:none; background:radial-gradient(ellipse at 50% 55%,rgba(255,138,0,.5),rgba(255,138,0,0) 70%); }
.disrupt-map__cell--cargo { border-color:var(--bc-gold); animation:cell-cargo 1.6s ease-in-out infinite; }
.disrupt-map__cell--trail { border:1px dashed rgba(255,211,77,.55); }

/* Плашка: кольцо давления — фон кнопки, сама плашка лежит внутри. */
.disrupt-map__dot { position:relative; width:30px; height:30px; min-width:0; padding:2px; display:block; border:0; border-radius:10px; color:inherit; }
.disrupt-map__initials { display:grid; place-items:center; width:100%; height:100%; border-radius:8px; color:#dff9ff; background:#0c2a44; font-size:9px; font-weight:900; letter-spacing:.02em; }
.disrupt-map__dot--bot .disrupt-map__initials { color:#ffd9ae; background:#2a1606; }
.disrupt-map__dot--cargo .disrupt-map__initials { color:#1a1405; background:var(--bc-gold); box-shadow:0 0 10px rgba(255,211,77,.6); }
.disrupt-map__dot--chosen { outline:2px solid var(--bc-gold); outline-offset:1px; box-shadow:none; }
.disrupt-map__dot--down { opacity:.3; }
.disrupt-map__dot--capped { opacity:.55; }
.disrupt-map__dot--near { animation:dot-near .5s ease-in-out infinite; box-shadow:0 0 12px rgba(255,138,0,.75); }
.disrupt-map__dot--struck { animation:dot-struck 1.2s ease-out 3; }
.disrupt-map__more { width:30px; height:30px; border-radius:10px; border:1px dashed var(--bc-cyan); color:var(--bc-cyan-light); background:#061423; font-size:10px; font-weight:900; }

/* Картинки ударов: у каждого эффекта своя, длится столько же, сколько эффект. */
.disrupt-map__fx { position:absolute; inset:0; z-index:1; pointer-events:none; border-radius:inherit; }
.disrupt-map__fx--dark, .disrupt-map__fx--fog, .disrupt-map__fx--wall { animation-name:fx-hold; animation-timing-function:linear; animation-fill-mode:both; }
.disrupt-map__fx--dark { background:rgba(0,0,0,.88); }
.disrupt-map__fx--fog { background:linear-gradient(180deg,rgba(170,190,205,.55),rgba(120,140,155,.35)); -webkit-backdrop-filter:blur(3px); backdrop-filter:blur(3px); }
.disrupt-map__fx--wall { background:linear-gradient(180deg,transparent 44%,#6b4a2a 44% 56%,transparent 56%); }
.disrupt-map__fx--echo { background:radial-gradient(circle at 50% 50%,transparent 30%,rgba(0,229,255,.55) 33%,transparent 38%); animation:fx-echo 1.8s ease-out infinite; }
.disrupt-map__fx--hail { background-image:radial-gradient(circle,#ff8a00 1.6px,transparent 2.2px); background-size:14px 14px; animation:fx-hail .6s linear infinite; }
.disrupt-map__initials--fx-shake { animation:fx-shake .4s linear infinite; }
.disrupt-map__initials--fx-spark { animation:fx-spark .7s ease-in-out infinite; }
.disrupt-map__initials--fx-mark { animation:fx-mark 1.2s ease-in-out infinite; }

.disrupt-map__legend { display:flex; flex-wrap:wrap; gap:6px 12px; padding:0 4px; color:var(--bc-secondary); font-size:10px; font-weight:700; }
.disrupt-map__key::before { content:''; display:inline-block; width:9px; height:9px; margin-right:5px; border-radius:3px; vertical-align:-1px; }
.disrupt-map__key--player::before { background:#0c2a44; box-shadow:0 0 0 1.5px var(--bc-cyan); }
.disrupt-map__key--bot::before { background:#2a1606; box-shadow:0 0 0 1.5px var(--bc-orange); }
.disrupt-map__key--cargo::before { background:var(--bc-gold); }
.disrupt-map__key--ring::before { border-radius:50%; background:conic-gradient(var(--bc-cyan) 0 65%,rgba(122,140,168,.3) 65% 100%); }

@keyframes dot-near { 0%,100% { transform:translate(0,0); } 25% { transform:translate(-1px,0); } 75% { transform:translate(1px,0); } }
@keyframes dot-struck { 0% { box-shadow:0 0 0 0 rgba(255,138,0,.9); } 100% { box-shadow:0 0 0 12px rgba(255,138,0,0); } }
@keyframes cell-cargo { 0%,100% { box-shadow:inset 0 0 0 0 rgba(255,211,77,0); } 50% { box-shadow:inset 0 0 18px 2px rgba(255,211,77,.35); } }
@keyframes fx-hold { 0% { opacity:0; } 6% { opacity:1; } 88% { opacity:1; } 100% { opacity:0; } }
@keyframes fx-echo { 0% { transform:scale(.4); opacity:1; } 100% { transform:scale(1.6); opacity:0; } }
@keyframes fx-hail { from { background-position:0 0; } to { background-position:0 14px; } }
@keyframes fx-shake { 0%,100% { transform:translate(0,0) rotate(0); } 25% { transform:translate(-2px,1px) rotate(-4deg); } 75% { transform:translate(2px,-1px) rotate(4deg); } }
@keyframes fx-spark { 0%,100% { box-shadow:0 0 0 0 rgba(57,224,107,0); } 50% { box-shadow:0 0 12px 3px rgba(57,224,107,.8); } }
@keyframes fx-mark { 0%,100% { box-shadow:0 0 6px 1px rgba(255,211,77,.5); } 50% { box-shadow:0 0 16px 5px rgba(255,211,77,.95); } }

/* === Карточка поверх экрана: боец или сектор === */
.disrupt-sheet { position:fixed; inset:0; z-index:60; display:flex; align-items:flex-end; justify-content:center; }
.disrupt-sheet__backdrop { position:absolute; inset:0; border:0; background:rgba(2,6,12,.62); }
.disrupt-sheet__panel { position:relative; width:min(100%,462px); max-height:80vh; overflow-y:auto; display:grid; gap:12px; padding:14px 16px calc(18px + var(--safe-bottom)); border-radius:22px 22px 0 0; border:1px solid rgba(0,229,255,.35); border-bottom:0; background:#07121f; box-shadow:0 -12px 40px rgba(0,0,0,.5); }
.disrupt-sheet__panel--fresh { animation:sheet-up .22s ease-out; }
.disrupt-sheet__head { display:grid; grid-template-columns:48px minmax(0,1fr) 36px; align-items:center; gap:12px; }
.disrupt-sheet__head--sector { grid-template-columns:minmax(0,1fr) 36px; }
.disrupt-sheet__badge { width:48px; height:48px; display:grid; place-items:center; border-radius:14px; border:1px solid var(--bc-cyan); color:#dff9ff; background:#0c2132; font-size:18px; font-weight:900; }
.disrupt-sheet__badge--bot { border-color:var(--bc-orange); color:#ffd9ae; background:#2a1606; }
.disrupt-sheet__badge--cargo { border-color:var(--bc-gold); color:#1a1405; background:var(--bc-gold); }
.disrupt-sheet__copy { min-width:0; display:grid; gap:3px; }
.disrupt-sheet__copy strong { color:var(--bc-white); font-size:18px; font-weight:900; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.disrupt-sheet__copy small { color:var(--bc-secondary); font-size:11px; font-weight:700; }
.disrupt-sheet__close { width:36px; height:36px; border-radius:12px; border:1px solid var(--bc-divider); color:#c9d7e4; background:var(--bc-surface-2); font-size:14px; }
.disrupt-sheet__panel .content-section { margin-top:0; }
.disrupt-sheet__panel .disrupt-vote-panel { margin-top:4px; }
@keyframes sheet-up { from { transform:translateY(24px); opacity:0; } to { transform:none; opacity:1; } }

/* === Состояние бойца: ранен, критично, выбыл === */
.disrupt-map__hp { position:absolute; z-index:2; top:-3px; right:-3px; width:10px; height:10px; border-radius:50%; border:2px solid #061423; }
.disrupt-map__hp--wounded { background:#ffb020; }
.disrupt-map__hp--critical { background:var(--bc-red); animation:hp-critical .9s ease-in-out infinite; }
.disrupt-map__cross { position:absolute; z-index:2; inset:0; display:grid; place-items:center; color:#ff5c5c; font-size:17px; font-weight:900; pointer-events:none; }
.disrupt-map__cell--fall { animation:cell-fall 1s ease-out 3; }
.disrupt-map__key--wounded::before { border-radius:50%; background:#ffb020; }
.disrupt-map__key--critical::before { border-radius:50%; background:var(--bc-red); }
.disrupt-target__hp { margin-left:6px; padding:1px 5px; border-radius:5px; font-size:8px; font-style:normal; font-weight:900; }
.disrupt-target__hp--wounded { color:#1d1403; background:#ffb020; }
.disrupt-target__hp--critical { color:#fff; background:var(--bc-red); }
.disrupt-target__hp--down { color:#c9d7e4; background:#35506a; }
@keyframes hp-critical { 0%,100% { box-shadow:0 0 0 0 rgba(255,56,56,.8); } 50% { box-shadow:0 0 0 4px rgba(255,56,56,0); } }
@keyframes cell-fall { 0% { box-shadow:inset 0 0 0 0 rgba(255,56,56,.7); } 30% { box-shadow:inset 0 0 22px 4px rgba(255,56,56,.55); } 100% { box-shadow:inset 0 0 0 0 rgba(255,56,56,0); } }

/* === Поделиться: позвать в матч и поделиться ударом === */
.disrupt-status__right { display:flex; align-items:center; gap:10px; }
.disrupt-status__share { width:34px; height:34px; display:grid; place-items:center; border-radius:11px; border:1px solid var(--bc-cyan); color:var(--bc-cyan-light); background:rgba(0,229,255,.08); }
.disrupt-status__share .icon { width:17px; height:17px; }
.disrupt-feed__share { justify-self:start; margin-top:6px; min-height:34px; padding:0 14px; border-radius:11px; border:1px solid var(--bc-gold); color:#ffe9a8; background:rgba(255,211,77,.1); font-size:11px; font-weight:900; letter-spacing:.03em; }

/* === Предложение добавить иконку на домашний экран === */
.disrupt-shortcut { margin-top:10px; display:grid; grid-template-columns:minmax(0,1fr) auto auto; align-items:center; gap:10px; padding:10px 12px; border-radius:14px; border:1px solid var(--bc-cyan); background:rgba(0,229,255,.06); }
.disrupt-shortcut__copy { min-width:0; display:grid; gap:2px; }
.disrupt-shortcut__copy strong { color:var(--bc-white); font-size:12px; font-weight:800; line-height:1.25; }
.disrupt-shortcut__copy small { color:var(--bc-secondary); font-size:10px; font-weight:600; }
.disrupt-shortcut__add { min-height:34px; padding:0 14px; border-radius:10px; border:1px solid var(--bc-cyan); color:#051019; background:var(--bc-cyan); font-size:11px; font-weight:900; }
.disrupt-shortcut__close { width:30px; height:30px; border-radius:9px; border:1px solid var(--bc-divider); color:#c9d7e4; background:var(--bc-surface-2); font-size:12px; }

/* === Пустой экран «матча нет» — теперь не пустой === */
.disrupt-subscribe { width:100%; margin-top:12px; min-height:56px; display:flex; align-items:center; gap:12px; padding:0 16px; text-align:left; border:1px solid var(--bc-cyan); border-radius:16px; color:var(--bc-cyan-light); background:rgba(0,229,255,.06); }
.disrupt-subscribe .icon { width:20px; height:20px; flex:none; }
.disrupt-subscribe__copy { display:grid; gap:2px; }
.disrupt-subscribe__copy strong { color:var(--bc-white); font-size:13px; font-weight:800; }
.disrupt-subscribe__copy small { color:var(--bc-secondary); font-size:10px; font-weight:600; }
.disrupt-subscribe--on { border-color:var(--bc-gold); background:rgba(255,211,77,.08); }
.disrupt-subscribe--on .disrupt-subscribe__copy strong { color:var(--bc-gold); }

.disrupt-history { display:grid; gap:6px; }
.disrupt-history__row { display:grid; grid-template-columns:38px minmax(0,1fr) auto; align-items:center; gap:10px; padding:9px 14px; border-radius:12px; border:1px solid var(--bc-divider); background:var(--bc-surface-2); }
.disrupt-history__row span { min-width:0; color:#c9d7e4; font-size:11px; font-weight:700; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.disrupt-history__row small:first-child { color:var(--bc-secondary); font-size:10px; font-weight:800; }
.disrupt-history__row small:last-child { color:var(--bc-secondary); font-size:10px; font-weight:800; }
.disrupt-history__row--mine { border-color:var(--bc-gold); }
.disrupt-history__row--mine small:last-child { color:var(--bc-gold); }

.disrupt-contribution { margin-top:10px; padding:12px 16px; display:grid; gap:3px; border-radius:14px; border:1px solid var(--bc-divider); background:var(--bc-surface-2); }
.disrupt-contribution span { color:var(--bc-secondary); font-size:11px; font-weight:700; }
.disrupt-contribution strong { color:var(--bc-white); font-size:13px; font-weight:800; }

.disrupt-explainer__list { display:grid; gap:8px; }
.disrupt-explainer__item { padding:10px 14px; border-radius:12px; border:1px solid var(--bc-divider); background:var(--bc-surface-2); }
.disrupt-explainer__item strong { display:block; color:var(--bc-white); font-size:12px; font-weight:800; margin-bottom:2px; }
.disrupt-explainer__item small { color:var(--bc-secondary); font-size:10px; font-weight:600; line-height:1.4; }

/* === Правки 12.09.2026: разбор второго прогона обратной связи === */
/* Ряд из двух кнопок поровну — .support-cta сам себе ставит grid-column:1/-1
   (это было верно для старого ряда из трёх кнопок, где поддержка — полная
   строка снизу); здесь явно отменяем это, иначе кнопка НАСТРОЙКИ выглядит
   вдвое короче ПОДДЕРЖАТЬ ПРОЕКТ ровно из-за этого унаследованного правила. */
.actions-row-equal { display:grid; grid-template-columns:1fr 1fr; gap:9px; }
.actions-row-equal > * { grid-column:auto; min-width:0; }

/* Крупный, заметный блок рекламы на PROFILE — тот же смысл, что и прежний
   ad-enquiry__row, но не теряется: сплошная рамка вместо пунктира, свой значок,
   заметный размер. Именно этот блок должен убедить рекламодателя, что здесь
   можно разместиться. */
.ad-spotlight { margin-top:14px; padding:16px; display:grid; grid-template-columns:52px minmax(0,1fr) 18px; align-items:center; gap:12px; border:1.5px solid var(--bc-cyan); border-radius:var(--radius-hero); background:linear-gradient(135deg,rgba(0,229,255,.14),rgba(0,229,255,.03)); box-shadow:0 0 22px rgba(0,229,255,.12); text-align:left; }
.ad-spotlight__badge { width:52px; height:52px; object-fit:contain; }
.ad-spotlight strong { display:block; color:var(--bc-white); font-size:14px; font-weight:900; }
.ad-spotlight small { display:block; margin-top:3px; color:var(--bc-secondary); font-size:11px; }
.ad-spotlight .icon { width:18px; height:18px; color:var(--bc-cyan-light); }

/* Hero становится кнопкой: тап открывает выбор фото и путь в настройки. */
.profile-user-hero--tap { cursor:pointer; }
.profile-user-hero__edit { position:absolute; left:78px; top:78px; width:26px; height:26px; display:grid; place-items:center; border-radius:50%; background:var(--profile-cyan,var(--bc-cyan)); color:#06121e; box-shadow:0 0 0 2px var(--bc-bg); }
.profile-user-hero__edit .icon { width:13px; height:13px; }
.profile-picker { margin-top:10px; display:grid; gap:8px; }

/* ============================================================
   LIVE_HOME_IDLE_v1 — утверждённый макет, зафиксирован владельцем 12.09.2026.
   Точные значения из присланного ТЗ. Не сводить с системой .disrupt-* —
   это состояние "матча нет" реализовано отдельно и буквально.
   Safe-area сверху берётся из уже решённой fullscreen-задачи
   (--content-safe-top, см. services/telegram.js) — там же учтена реальная
   высота плавающих кнопок Telegram, которую env(safe-area-inset-top) сам по
   себе не знает; дублировать чистый env() здесь означало бы вернуть баг,
   который чинили 12.09.2026 в отдельном заходе.
   ============================================================ */
:root {
    --idle-bg: #020B14; --idle-surface: #071522; --idle-surface-2: #0B1B2B; --idle-line: #173A55;
    --idle-cyan: #00DDF5; --idle-blue: #078DFF; --idle-blue-deep: #0564B8;
    --idle-orange: #FF7918; --idle-gold: #FFC62E; --idle-red: #FF2638;
    --idle-text: #F7FAFF; --idle-text-2: #91A9C6; --idle-text-3: #617893;
}
/* .page-content уже задаёт padding-top под шапку Telegram и padding-bottom
   под нижнюю навигацию (94px+safe-bottom) — здесь не переопределяем ни то,
   ни другое: нижняя навигация вернулась на этот экран 12.09.2026. */
.idle-home { display: grid; gap: 16px; }

/* --- Header --- */
.idle-header { display: flex; align-items: center; justify-content: space-between; min-height: 46px; }
.idle-header__brand { display: flex; align-items: center; gap: 10px; }
.idle-header__logo { width: 42px; height: 42px; object-fit: contain; }
/* Настоящий вордмарк-ассет (шапка, самый верх страницы) — прислан владельцем
   12.09.2026 напрямую вставкой в чат, обрезан по контенту (без прозрачных
   полей вокруг свечения). Высота 48px подобрана сверкой с 01_HEADER.png:
   блок "BLIND COURIER"+LIVE занимает там ~295x129 референс-px при иконке
   ~113px = 42px факта, то есть по тому же масштабу ~48px высоты. */
.idle-header__wordmark { height: 48px; width: auto; }
.idle-header__actions { display: flex; align-items: center; gap: 10px; }
.idle-header__bell { position: relative; width: 46px; height: 46px; display: grid; place-items: center; border: 1px solid rgba(70,150,205,.45); border-radius: 50%; color: var(--idle-text-2); }
.idle-header__bell .icon { width: 20px; height: 20px; }
.idle-header__dot { position: absolute; top: 8px; right: 10px; width: 9px; height: 9px; border-radius: 50%; background: var(--idle-red); }
.idle-header__profile { width: 48px; height: 48px; border-radius: 50%; border: 2px solid var(--idle-cyan); background: var(--idle-surface); color: var(--idle-text); font-size: 15px; font-weight: 900; box-shadow: 0 0 10px rgba(0,221,245,.4), inset 0 0 10px rgba(0,221,245,.08); }

/* --- Intro: logo tile + carousel --- */
.idle-intro-group { display: grid; gap: 10px; }
.idle-intro { position: relative; display: grid; grid-template-columns: 145px minmax(0,1fr); align-items: stretch; gap: 12px; padding-right: 21px; }
.idle-intro__logo { width: 145px; height: 145px; display: grid; place-items: center; background: #061522; border: 2px solid var(--idle-cyan); border-radius: 24px; box-shadow: 0 0 14px rgba(0,221,245,.35), inset 0 0 20px rgba(0,221,245,.05); overflow: hidden; }
.idle-intro__logo img { width: 88%; height: 88%; object-fit: contain; }
.idle-carousel { position: relative; height: 145px; overflow: hidden; padding: 12px 14px; display: grid; align-content: start; gap: 6px; background: linear-gradient(135deg, rgba(8,29,46,.96), rgba(3,19,31,.96)); border: 1.5px solid #116FA4; border-radius: 22px; }
.idle-carousel__top { display: flex; align-items: center; justify-content: space-between; }
.idle-carousel__count { font-size: 14px; font-weight: 700; color: #A9C6E5; border: 1px solid #315A7D; border-radius: 12px; padding: 3px 9px; }
.idle-carousel__info { width: 28px; height: 28px; border-radius: 50%; border: 1.5px solid #9AC5E8; color: #9AC5E8; font-size: 13px; font-style: italic; font-weight: 700; background: transparent; }
.idle-carousel__title { font-size: 20px; font-weight: 800; letter-spacing: -.02em; color: #fff; line-height: 1.15; }
.idle-carousel__text { margin: 0; font-size: 15px; font-weight: 500; line-height: 1.28; color: var(--idle-text-2); }
.idle-carousel__arrow { position: absolute; top: 50%; right: 0; transform: translateY(-50%); width: 42px; height: 42px; border-radius: 50%; border: 1.5px solid var(--idle-blue); background: #062038; color: #DFF3FF; box-shadow: 0 0 10px rgba(0,141,255,.35); display: grid; place-items: center; z-index: 1; }
.idle-carousel__arrow .icon { width: 18px; height: 18px; }
.idle-dots { display: flex; justify-content: center; gap: 10px; }
.idle-dots__dot { width: 8px; height: 8px; border-radius: 50%; background: #496783; border: 0; padding: 0; }
.idle-dots__dot--active { width: 11px; height: 11px; background: var(--idle-cyan); }

/* --- info sheet (кнопка «i») --- */
.idle-sheet { position: fixed; inset: 0; z-index: 70; display: flex; align-items: flex-end; justify-content: center; }
.idle-sheet__backdrop { position: absolute; inset: 0; border: 0; background: rgba(2,6,12,.62); }
.idle-sheet__panel { position: relative; width: min(100%,462px); display: grid; gap: 10px; padding: 18px 18px calc(20px + var(--safe-bottom)); border-radius: 22px 22px 0 0; border: 1.5px solid #116FA4; border-bottom: 0; background: var(--idle-surface); }
.idle-sheet__panel strong { font-size: 18px; font-weight: 900; color: #fff; }
.idle-sheet__panel p { margin: 0; font-size: 14px; line-height: 1.5; color: var(--idle-text-2); }
.idle-sheet__close { justify-self: end; width: 32px; height: 32px; border-radius: 10px; border: 1px solid var(--idle-line); color: var(--idle-text-2); background: var(--idle-surface-2); }

/* --- No-match hero --- */
.idle-hero { position: relative; min-height: 150px; padding: 16px; background-size: cover; background-position: 62% 40%; border: 1.5px solid var(--idle-blue); border-radius: 22px; overflow: hidden; }
.idle-hero__status { display: inline-flex; align-items: center; gap: 8px; height: 38px; padding: 0 16px; border-radius: 10px; background: rgba(116,0,18,.85); border: 1px solid var(--idle-red); color: #fff; font-size: 15px; font-weight: 900; letter-spacing: .04em; }
.idle-hero__dot { width: 8px; height: 8px; border-radius: 50%; background: var(--idle-red); }
.idle-hero__label { margin-left: 12px; font-size: 21px; font-weight: 900; letter-spacing: -.02em; color: var(--idle-text); vertical-align: middle; }
.idle-hero__tagline { position: absolute; right: 16px; bottom: 14px; display: grid; justify-items: end; gap: 1px; font-style: italic; font-weight: 700; font-size: 18px; line-height: 1.15; color: #fff; text-shadow: 0 0 10px rgba(255,121,24,.35); }
.idle-hero__tagline .icon { width: 30px; height: 16px; margin-top: 3px; color: var(--idle-orange); filter: drop-shadow(0 0 6px rgba(255,121,24,.55)); }

/* --- Последние удары --- */
.idle-hits { padding: 14px; background: #061522; border: 1.5px solid #116FA4; border-radius: 20px; }
.idle-hits__head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 6px; }
.idle-hits__head strong { font-size: 18px; font-weight: 900; letter-spacing: -.02em; color: var(--idle-text); }
.idle-hits__all { border: 1px solid #2E5A80; background: rgba(255,255,255,.02); border-radius: 14px; padding: 6px 14px; color: #B9D2E8; font-size: 13px; font-weight: 700; }
.idle-hits__empty { margin: 6px 0 0; color: var(--idle-text-3); font-size: 12px; }
.idle-hits__row { display: flex; align-items: center; gap: 8px; min-height: 46px; border-bottom: 1px solid rgba(112,153,184,.35); }
.idle-hits__row:last-child { border-bottom: 0; }
.idle-hits__time { flex: none; width: 40px; color: var(--idle-text-3); font-size: 12px; font-weight: 700; }
.idle-hits__icon { flex: none; width: 20px; display: grid; place-items: center; }
.idle-hits__icon .icon { width: 16px; height: 16px; }
.idle-hits__effect { flex: none; color: var(--idle-text); font-size: 13px; font-weight: 800; }
.idle-hits__dash { flex: none; color: var(--idle-text-3); }
.idle-hits__player { flex: 1 1 auto; min-width: 0; color: var(--idle-text-2); font-size: 12px; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.idle-hits__mine { flex: none; color: var(--idle-gold); font-size: 11px; font-weight: 800; }
.idle-hits__votes { flex: none; color: var(--idle-text-3); font-size: 11px; font-weight: 700; }

/* --- Roblox CTA --- */
/* Точные значения из CLAUDE_CODE_PATCH_01.md (Диск, LIVE_HOME_IDLE_v1/PATCH_01,
   12.09.2026, раздел 2) — заменяют прежний компромисс с ellipsis: заголовок
   держится одной строкой уменьшением плитки/кнопки на узких экранах, а не
   уменьшением/обрезкой самого текста. */
.idle-roblox { display: grid; grid-template-columns: 56px minmax(0,1fr) 108px; align-items: center; gap: 10px; min-height: 84px; padding: 12px; border-radius: 18px; background: linear-gradient(135deg,#062747,#073F70); border: 2px solid var(--idle-blue); box-shadow: 0 0 18px rgba(0,141,255,.25), inset 0 0 24px rgba(0,221,245,.08); }
.idle-roblox__badge { width: 56px; height: 56px; border-radius: 13px; display: grid; place-items: center; background: #020910; }
.idle-roblox__badge-img { width: 60%; height: 60%; object-fit: contain; }
.idle-roblox__copy { min-width: 0; }
.idle-roblox__copy strong { margin: 0; display: block; white-space: nowrap; overflow: visible; text-overflow: clip; font-size: 16px; line-height: 1.05; font-weight: 900; letter-spacing: -0.02em; color: #fff; }
.idle-roblox__copy small { display: block; margin-top: 4px; font-size: 12px; line-height: 1.22; color: #8EB4DA; }
.idle-roblox__play { width: 108px; height: 52px; padding: 0; display: inline-flex; align-items: center; justify-content: center; gap: 8px; border-radius: 15px; background: linear-gradient(180deg,#12A7E8,#0874C9); border: 2px solid #19ECFF; box-shadow: 0 0 14px rgba(0,221,245,.45), inset 0 1px 0 rgba(255,255,255,.25); color: #fff; font-size: 16px; font-weight: 900; }
.idle-roblox__play .icon { width: 16px; height: 16px; }

@media (min-width: 400px) {
    .idle-roblox { grid-template-columns: 64px minmax(0,1fr) 120px; gap: 12px; padding: 14px; min-height: 92px; }
    .idle-roblox__badge { width: 64px; height: 64px; border-radius: 14px; }
    .idle-roblox__copy strong { font-size: 18px; }
    .idle-roblox__copy small { font-size: 13px; }
    .idle-roblox__play { width: 120px; height: 55px; font-size: 17px; }
}

/* --- Support --- */
.idle-support { width: 100%; min-height: 78px; padding: 12px 14px; display: grid; grid-template-columns: 52px minmax(0,1fr) 38px; align-items: center; gap: 12px; background: linear-gradient(100deg, rgba(60,43,5,.65), rgba(28,25,15,.85)); border: 1.5px solid var(--idle-gold); border-radius: 18px; text-align: left; }
.idle-support__star { width: 52px; height: 52px; display: grid; place-items: center; }
.idle-support__star-img { width: 52px; height: 52px; object-fit: contain; }
.idle-support__copy strong { display: block; font-size: 18px; font-weight: 900; letter-spacing: -.02em; color: #fff; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.idle-support__copy small { display: block; margin-top: 2px; font-size: 13px; color: var(--idle-text-2); }
.idle-support__arrow { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 50%; background: rgba(255,255,255,.09); color: #fff; font-size: 18px; }

@media (max-width: 360px) {
    .idle-intro { grid-template-columns: 32vw minmax(0,1fr); }
    .idle-intro__logo { width: 32vw; height: 32vw; max-width: 145px; max-height: 145px; }
    .idle-home { padding-left: 14px; padding-right: 14px; }
}

/* ============================================================
   ADS_SUPPORT_v1 — «Реклама и поддержка», макет прислан владельцем
   напрямую в чат 12.09.2026 (второе сообщение — исправленная версия
   после «перепутал»). Токены — существующие global --bc-* сверху этого
   файла, не новые: подтверждены побайтовым совпадением с geometry.json
   пакета BlindCourierLive_LIVE_Canon_Assets_v1 (#FF8A00/#00E5FF/#FFD34D).
   HEKTE — реальный одобренный демо-рекламодатель проекта, не выдумка
   (assets/sponsors/hekte-logo.png уже лежал в проекте). #2FD9A8 у бейджа
   "ПРОВЕРЕННЫЙ ПРОЕКТ" — единственный цвет в этом блоке, не взятый из
   --bc-*: в одобренных токенах нет отдельного "успех"-цвета, а бейдж на
   макете явно не оранжевый/циановый/золотой — отдельный смысловой акцент.
   ============================================================ */
.ads-support { display: grid; gap: 14px; }

.promo-hero { display: flex; align-items: center; gap: 16px; padding: 18px; border: 1.5px solid var(--bc-orange); border-radius: var(--radius-large); background: radial-gradient(120% 140% at 15% 20%, rgba(255,138,0,.22), transparent 60%), linear-gradient(160deg, #170a02, #0c0700 70%); box-shadow: 0 0 22px rgba(255,138,0,.18); }
.promo-hero__badge { flex: none; width: 120px; height: 120px; border-radius: 50%; overflow: hidden; display: grid; place-items: center; background: #0c0700; box-shadow: 0 0 40px rgba(255,138,0,.5); }
.promo-hero__badge img { width: 100%; height: 100%; object-fit: cover; }
.promo-hero__copy { flex: 1; min-width: 0; display: grid; gap: 8px; }
.promo-hero__kicker { display: flex; align-items: center; gap: 8px; font-size: 11px; font-weight: 800; letter-spacing: .1em; color: var(--bc-orange); }
.promo-hero__kicker::after { content: ''; flex: 1; height: 1px; max-width: 60px; background: linear-gradient(90deg, var(--bc-orange), transparent); }
.promo-hero__title { margin: 0; font-size: 26px; line-height: 1.05; font-weight: 900; letter-spacing: -.01em; color: var(--bc-white); }
.promo-hero__title span { display: block; }
.promo-hero__title-accent { color: var(--bc-orange); }
.promo-hero__body { margin: 0; font-size: 14px; line-height: 1.4; color: #cfe0f2; }
.promo-hero__bullets { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 4px; font-size: 11px; font-weight: 800; letter-spacing: .04em; color: #9fb3c8; }
.promo-hero__dot { color: var(--bc-orange); }

.promo-submit { width: 100%; display: grid; grid-template-columns: 56px minmax(0,1fr) 40px; align-items: center; gap: 14px; padding: 14px 16px; border: 1.5px solid var(--bc-orange); border-radius: var(--radius-card); background: linear-gradient(135deg, rgba(255,138,0,.14), rgba(10,6,2,.9)); text-align: left; }
.promo-submit__icon { width: 56px; height: 56px; display: grid; place-items: center; border-radius: 14px; background: #1a0f03; color: var(--bc-orange); }
.promo-submit__icon .icon { width: 30px; height: 30px; }
.promo-submit__copy strong { display: block; font-size: 17px; font-weight: 900; color: var(--bc-white); }
.promo-submit__copy small { display: block; margin-top: 2px; font-size: 12px; color: #9fb3c8; }
.promo-submit__arrow { width: 40px; height: 40px; display: grid; place-items: center; border-radius: 50%; border: 1.5px solid var(--bc-orange); color: var(--bc-orange); }
.promo-submit__arrow .icon { width: 16px; height: 16px; }

.promo-card { display: grid; gap: 12px; padding: 16px; border: 1.5px solid var(--bc-orange); border-radius: var(--radius-large); background: #0a0f16; box-shadow: 0 0 24px rgba(255,138,0,.2), inset 0 0 30px rgba(255,138,0,.05); }
.promo-card__top { display: flex; align-items: center; justify-content: space-between; gap: 8px; flex-wrap: wrap; }
.promo-card__label { display: inline-flex; align-items: center; gap: 5px; padding: 4px 10px; border-radius: 8px; border: 1px solid var(--bc-orange); color: var(--bc-orange); font-size: 10px; font-weight: 900; letter-spacing: .06em; }
.promo-card__label::before { content: ''; width: 5px; height: 5px; border-radius: 50%; background: var(--bc-orange); }
.promo-card__verified { display: inline-flex; align-items: center; gap: 5px; padding: 4px 10px; border-radius: 8px; border: 1px solid #2FD9A8; color: #2FD9A8; font-size: 10px; font-weight: 800; letter-spacing: .03em; }
.promo-card__verified .icon { width: 13px; height: 13px; }
.promo-card__head { display: grid; grid-template-columns: 68px minmax(0,1fr); gap: 14px; align-items: center; }
.promo-card__logo { width: 68px; height: 68px; border-radius: 16px; overflow: hidden; background: #0e1a26; display: grid; place-items: center; }
.promo-card__logo img { width: 100%; height: 100%; object-fit: cover; }
.promo-card__title { display: block; font-size: 22px; font-weight: 900; color: var(--bc-white); }
.promo-card__lead { margin: 4px 0 0; font-size: 13px; line-height: 1.35; color: #cfe0f2; }
.promo-card__tags { display: flex; flex-wrap: wrap; gap: 8px; }
.promo-card__tag { display: inline-flex; align-items: center; gap: 6px; padding: 7px 11px; border-radius: 10px; border: 1px solid var(--bc-divider); background: rgba(255,255,255,.03); font-size: 12px; font-weight: 700; color: #cfe0f2; }
.promo-card__tag .icon { width: 14px; height: 14px; color: var(--bc-orange); }
.promo-card__desc { margin: 0; font-size: 12px; line-height: 1.4; color: #8ba0b8; }
.promo-card__cta { width: 100%; min-height: 52px; display: inline-flex; align-items: center; justify-content: center; gap: 10px; border-radius: var(--radius-button); border: 0; background: linear-gradient(180deg, #ff9d2e, #ff7a00); color: #1a0f03; font-size: 16px; font-weight: 900; box-shadow: 0 0 18px rgba(255,138,0,.4); }
.promo-card__cta .icon { width: 16px; height: 16px; }

.promo-why { display: grid; gap: 10px; }
.promo-why__head { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; flex-wrap: wrap; }
.promo-why__head strong { font-size: 16px; font-weight: 900; letter-spacing: -.01em; color: var(--bc-white); }
.promo-why__head span { font-size: 10px; font-weight: 800; letter-spacing: .05em; color: #7a8ca8; }
.promo-why__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.promo-why__card { display: grid; gap: 6px; padding: 12px 10px; border: 1px solid var(--bc-divider); border-radius: 14px; background: #0a121c; }
.promo-why__icon { width: 32px; height: 32px; display: grid; place-items: center; border-radius: 9px; border: 1px solid var(--bc-orange); color: var(--bc-orange); }
.promo-why__icon .icon { width: 16px; height: 16px; }
.promo-why__card strong { font-size: 12px; font-weight: 800; line-height: 1.2; color: var(--bc-white); }
.promo-why__card small { font-size: 10.5px; line-height: 1.3; color: #8ba0b8; }

.promo-footer { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 14px 16px; border: 1px solid var(--bc-divider); border-left: 3px solid var(--bc-orange); border-radius: 12px; background: #070d15; }
.promo-footer__left strong { display: block; font-size: 14px; font-weight: 800; color: var(--bc-white); }
.promo-footer__left small { display: block; margin-top: 2px; font-size: 10px; font-weight: 700; letter-spacing: .12em; color: #7a8ca8; }
.promo-footer__tagline { font-size: 10px; font-weight: 700; letter-spacing: .06em; color: #7a8ca8; white-space: nowrap; }

@media (max-width: 359px) {
    .promo-hero__badge { width: 92px; height: 92px; }
    .promo-why__grid { grid-template-columns: 1fr; }
}

/* ============================================================
   PROFILE_v1 — Google Drive → Blind Courier Live → DESIGN → PROFILE_v1
   (PROFILE_v1_SPEC.md + design-tokens.css + REFERENCES/* + ICONS/*),
   пакет скачан и прочитан целиком 12.09.2026. Токены — дословно из
   реального design-tokens.css пакета, не с картинки и не придуманы:
   предыдущая версия этого блока использовала другие hex, взятые с плоского
   скриншота-макета, а не из настоящего пакета — владелец эту версию
   отклонил как импровизацию. Разделы 10-13 спеки — источник размеров/весов
   шрифта и правил рамки/свечения ниже (раздел 12: обычная строка — тонкая
   рамка почти без свечения; hero — циановое; РЕКЛАМА — оранжевое; ПОДДЕРЖАТЬ
   ПРОЕКТ — «сдержанное cyan/gold», НЕ золотая рамка).
   Видимость блока РЕКЛАМА только владельцу — не из этой спеки (она вообще не
   говорит про роли), гейт живёт в app.js поверх этих же честных компонентов. */
:root {
    --profile-bg: #020B14; --profile-surface: #071827; --profile-surface-2: #0A2034; --profile-border: #0E78B8;
    --profile-cyan: #00DDF5; --profile-cyan-soft: #73D8FF; --profile-blue: #078DFF;
    --profile-orange: #FF8A19; --profile-gold: #FFC83D; --profile-green: #41F18B; --profile-red: #FF4F63;
    --profile-text: #F7FAFF; --profile-text-2: #91A9C6; --profile-text-3: #627D98;
    --profile-r-card: 22px; --profile-r-row: 18px; --profile-r-icon: 15px; --profile-r-pill: 999px;
    --profile-glow-cyan: 0 0 18px rgba(0,221,245,.26);
    --profile-glow-orange: 0 0 18px rgba(255,138,25,.24);
    --profile-glow-gold: 0 0 16px rgba(255,200,61,.22);
}
.profile-page { display: grid; gap: 16px; }

/* --- Раздел 3: Profile hero --- */
.profile-hero { position: relative; display: flex; align-items: center; gap: 16px; padding: 18px; border-radius: var(--profile-r-card); border: 1.5px solid var(--profile-cyan); background: radial-gradient(120% 160% at 100% 0%, rgba(0,221,245,.10), transparent 55%), linear-gradient(120deg, var(--profile-bg), var(--profile-surface)); box-shadow: var(--profile-glow-cyan); overflow: hidden; }
.profile-hero__avatar-wrap { position: relative; flex: none; }
.profile-hero__avatar { width: 108px; height: 108px; padding: 0; border-radius: 50%; border: 3px solid var(--profile-cyan); background: #04101c; overflow: hidden; box-shadow: 0 0 14px rgba(0,221,245,.35); }
.profile-hero__avatar img { width: 100%; height: 100%; object-fit: cover; }
.profile-hero__edit-badge { position: absolute; right: -2px; bottom: -2px; width: 34px; height: 34px; border-radius: 50%; background: var(--profile-cyan); color: #04101c; display: grid; place-items: center; box-shadow: 0 0 0 3px var(--profile-bg); }
.profile-hero__edit-badge .icon { width: 15px; height: 15px; }
.profile-hero__copy { flex: 1; min-width: 0; display: grid; gap: 6px; padding-right: 185px; }
.profile-hero__role { display: inline-flex; align-items: center; gap: 6px; width: fit-content; padding: 4px 10px; border-radius: var(--profile-r-pill); border: 1px solid var(--profile-gold); color: var(--profile-gold); font-size: 11px; font-weight: 800; letter-spacing: .04em; }
.profile-hero__role .icon { width: 12px; height: 12px; }
.profile-hero__copy h1 { margin: 0; font-size: 26px; font-weight: 900; letter-spacing: -.01em; color: var(--profile-text); }
.profile-hero__copy > small { font-size: 13px; color: var(--profile-text-2); }
.profile-hero__tagline { margin: 2px 0 0; font-size: 13px; line-height: 1.35; color: var(--profile-text-2); }
.profile-hero__edit-btn { position: absolute; right: 16px; bottom: 16px; display: inline-flex; align-items: center; gap: 6px; padding: 8px 14px; border-radius: var(--profile-r-pill); border: 1.5px solid var(--profile-cyan); background: rgba(0,20,32,.65); color: var(--profile-text); font-size: 11.5px; font-weight: 800; white-space: nowrap; }
.profile-hero__edit-btn .icon { width: 13px; height: 13px; color: var(--profile-cyan); flex: none; }
@media (max-width: 359px) {
    .profile-hero { flex-wrap: wrap; }
    .profile-hero__copy { padding-right: 0; }
    .profile-hero__edit-btn { position: static; margin-top: 10px; width: 100%; justify-content: center; }
}

/* --- Section head (АККАУНТЫ / ТВОИ ПОПАДАНИЯ) --- */
.profile-section-head { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; margin-bottom: 8px; }
.profile-section-head__link { border: 0; background: none; padding: 0; font-size: 13px; font-weight: 700; color: var(--profile-cyan-soft); }

/* --- Раздел 4: АККАУНТЫ (переопределяет старые .identity-* правила ниже по каскаду) --- */
.identity-grid { display: grid; gap: 10px; }
.identity-row { min-height: 74px; display: grid; grid-template-columns: 56px minmax(0,1fr) auto auto; align-items: center; gap: 12px; padding: 12px 14px; border-radius: var(--profile-r-row); border: 1.5px solid var(--profile-border); background: var(--profile-surface); }
.identity-icon { width: 56px; height: 56px; border-radius: 14px; display: grid; place-items: center; background: var(--profile-surface-2); }
.identity-icon img { width: 30px; height: 30px; object-fit: contain; }
.identity-row__copy { min-width: 0; display: grid; gap: 2px; }
.identity-row__copy strong { font-size: 15px; font-weight: 800; color: var(--profile-text); }
.identity-row__copy small { font-size: 11.5px; line-height: 1.3; color: var(--profile-text-2); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.identity-pill { padding: 6px 12px; border-radius: var(--profile-r-pill); border: 1px solid var(--profile-border); color: var(--profile-text-2); font-size: 11px; font-weight: 800; white-space: nowrap; }
.identity-pill--ok { border-color: var(--profile-green); color: var(--profile-green); display: inline-flex; align-items: center; gap: 5px; }
.identity-chevron { color: var(--profile-text-2); font-size: 16px; }

/* --- Раздел 5: РЕКЛАМА (admin-only, гейт в app.js) --- */
.ad-cabinet-cta { width: 100%; display: grid; grid-template-columns: 72px minmax(0,1fr) 40px; align-items: center; gap: 14px; padding: 16px; border-radius: 21px; border: 1.5px solid var(--profile-orange); background: linear-gradient(135deg, #1a0f02, #0c0700); box-shadow: var(--profile-glow-orange); text-align: left; }
.ad-cabinet-cta__icon { width: 72px; height: 72px; display: grid; place-items: center; }
.ad-cabinet-cta__icon img { width: 46px; height: 46px; object-fit: contain; }
.ad-cabinet-cta__copy strong { display: block; font-size: 19px; font-weight: 900; color: var(--profile-text); }
.ad-cabinet-cta__copy small { display: block; margin-top: 3px; font-size: 13px; line-height: 1.3; color: #D8B98A; }
.ad-cabinet-cta__arrow { width: 40px; height: 40px; border-radius: 50%; border: 1.5px solid var(--profile-orange); color: var(--profile-orange); display: grid; place-items: center; }
.ad-cabinet-cta__arrow .icon { width: 16px; height: 16px; }

/* --- Раздел 6: ПОДДЕРЖАТЬ ПРОЕКТ — «сдержанное cyan/gold», не золотая рамка --- */
.support-project-cta { width: 100%; display: grid; grid-template-columns: 60px minmax(0,1fr) 40px; align-items: center; gap: 14px; padding: 14px 16px; border-radius: var(--profile-r-row); border: 1.5px solid var(--profile-border); background: var(--profile-surface); text-align: left; }
.support-project-cta__icon { width: 56px; height: 56px; display: grid; place-items: center; }
.support-project-cta__icon img { width: 42px; height: 42px; object-fit: contain; }
.support-project-cta__copy strong { display: block; font-size: 17px; font-weight: 900; color: var(--profile-text); }
.support-project-cta__copy small { display: block; margin-top: 2px; font-size: 13px; color: var(--profile-text-2); }
.support-project-cta__arrow { width: 36px; height: 36px; border-radius: 50%; border: 1.5px solid var(--profile-blue); color: var(--profile-cyan-soft); display: grid; place-items: center; }
.support-project-cta__arrow .icon { width: 14px; height: 14px; }

/* --- Раздел 7: ТВОИ ПОПАДАНИЯ --- */
.recent-hits { display: grid; gap: 8px; }
.recent-hits__empty { margin: 0; padding: 14px; border-radius: var(--profile-r-row); border: 1px solid var(--profile-border); background: var(--profile-surface); color: var(--profile-text-2); font-size: 13px; }
.recent-hits__row { display: flex; align-items: center; gap: 12px; padding: 12px 14px; border-radius: var(--profile-r-row); border: 1px solid var(--profile-border); background: var(--profile-surface); }
.recent-hits__icon { flex: none; width: 40px; height: 40px; border-radius: 12px; border: 1px solid var(--profile-border); display: grid; place-items: center; background: var(--profile-surface-2); }
.recent-hits__icon .icon { width: 18px; height: 18px; }
.recent-hits__copy { flex: 1; min-width: 0; display: grid; gap: 2px; }
.recent-hits__copy strong { font-size: 14px; font-weight: 800; color: var(--profile-text); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.recent-hits__copy small { font-size: 12px; color: var(--profile-text-2); }
.recent-hits__time { flex: none; font-size: 12px; color: var(--profile-text-3); }
.recent-hits__chevron { flex: none; color: var(--profile-text-2); font-size: 16px; }

/* --- Раздел 8: System actions --- */
.system-actions { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.system-action { display: grid; gap: 8px; padding: 12px; border-radius: var(--profile-r-row); border: 1px solid var(--profile-border); background: var(--profile-surface); text-align: left; }
.system-action__top { display: flex; align-items: center; justify-content: space-between; }
.system-action__icon { width: 34px; height: 34px; display: grid; place-items: center; }
.system-action__icon img { width: 22px; height: 22px; object-fit: contain; }
.system-action__chevron { color: var(--profile-text-2); font-size: 15px; }
.system-action strong { font-size: 13px; font-weight: 800; color: var(--profile-text); }
.system-action small { font-size: 10.5px; line-height: 1.25; color: var(--profile-text-2); }
.system-action--danger { border-color: var(--profile-red); }
.system-action--danger strong { color: var(--profile-red); }
@media (max-width: 359px) {
    .system-actions { grid-template-columns: 1fr; }
}