: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));
  --safe-bottom: max(env(safe-area-inset-bottom), var(--tg-safe-area-inset-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); }
.global-header {
  position: relative;
  z-index: 20;
  width: min(100% - 32px, 430px);
  height: 72px;
  margin: 0 auto;
  padding: calc(var(--safe-top) + 10px) 10px 10px;
  min-height: calc(72px + var(--safe-top));
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  background: linear-gradient(180deg, rgba(15,27,42,.96), rgba(8,18,28,.96));
  border: 1px solid rgba(0,229,255,.35);
  border-top: 0;
  border-radius: 0 0 18px 18px;
  box-shadow: 0 10px 30px rgba(0,0,0,.24);
}
.brand { min-width: 0; display: flex; align-items: center; gap: 9px; }
.brand-avatar { width: 44px; height: 44px; border-radius: 12px; object-fit: cover; border: 1px solid rgba(0,229,255,.65); }
.brand-copy { display: grid; line-height: 1; }
.brand-name { font-size: 12px; font-weight: 800; letter-spacing: .02em; white-space: nowrap; }
.brand-live { margin-top: 4px; color: var(--bc-cyan-light); font-size: 11px; font-weight: 800; letter-spacing: .34em; text-shadow: 0 0 10px rgba(0,229,255,.5); }
.header-actions { display: flex; align-items: center; gap: 6px; }
.header-btn { height: 42px; min-width: 42px; padding: 0 11px; display: inline-flex; align-items: center; justify-content: center; gap: 7px; border-radius: 12px; border: 1px solid rgba(0,229,255,.5); color: var(--bc-white); background: #0a1d2a; font-weight: 800; font-size: 12px; }
.header-btn--roblox { box-shadow: inset 0 0 18px rgba(0,229,255,.08); }
.header-btn--roblox .icon { color: var(--bc-cyan-light); filter: drop-shadow(0 0 6px rgba(0,229,255,.5)); }
.header-btn--support { color: var(--bc-gold); border-color: rgba(255,211,77,.42); background: #17150d; }
.header-btn--support .icon { width: 23px; height: 23px; filter: drop-shadow(0 0 7px rgba(255,211,77,.45)); }
.header-btn--settings { color: #eef7ff; border-color: #30465e; }

.page-content { width: min(100% - 32px, 430px); margin: 14px auto 0; padding-bottom: calc(94px + var(--safe-bottom)); }
.live-hero { position: relative; height: 300px; overflow: hidden; border-radius: var(--radius-hero); border: 1.5px solid var(--bc-cyan); background: url('../assets/courier-avatar.webp') center 31% / 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: 20px; right: 20px; bottom: 20px; }
.live-hook { margin: 0; font-size: 30px; 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: 290px; margin: 9px 0 14px; 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: 48px; 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: 24px; }
.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; 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: 104px; display: grid; grid-template-columns: 76px 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: 76px; height: 76px; 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: 24px; min-height: 126px; 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(4,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) {
  .global-header { width: calc(100% - 20px); padding-left: 8px; padding-right: 8px; }
  .page-content { width: calc(100% - 20px); }
  .brand-copy { display: none; }
  .header-btn { padding: 0 9px; }
  .header-btn--roblox span { display: none; }
  .live-hook { font-size: 27px; }
}

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

/* Milestone 02 — MATCH. Uses the same canon tokens, radii and UI language as LIVE. */
.match-hero {
  position: relative; height: 250px; 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: 28px; 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:104px; display:grid; grid-template-columns:76px 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:76px; height:76px; 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:270px; overflow:hidden; display:grid; grid-template-columns:130px minmax(0,1fr); align-items:center; gap:18px; padding:24px 20px; border-radius:var(--radius-hero); border:1.5px solid var(--bc-cyan); background-size:cover; background-position:center; }
.player-hero__avatar { width:130px; height:130px; 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:30px; 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:18px; bottom:18px; min-width:146px; min-height:42px; 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:16px; padding:16px; 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:142px; display:grid; grid-template-columns:88px 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:82px; height:82px; display:grid; place-items:center; border-radius:50%; border:3px solid var(--bc-gold); color:var(--bc-gold); background:#201b0d; font-size:38px; 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:150px; 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:252px; overflow:hidden; border-radius:var(--radius-hero); border:1px solid rgba(0,229,255,.4); background:url('../assets/courier-avatar.webp') center 31% / 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:30px; font-weight:900; letter-spacing:-.03em; }
.discover-hero__copy p { margin:7px 0 0; color:#c8d8e8; font-size:12px; }
.discover-search { margin-top:14px; min-height:54px; 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:44px; 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:196px; 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:210px; display:grid; grid-template-rows:145px 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:260px; 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:32px; 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:150px; display:grid; grid-template-columns:92px 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:82px; height:82px; 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:158px; display:grid; grid-template-columns:72px 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:68px; height:68px; display:grid; place-items:center; grid-row:1/span 2; border-radius:50%; border:1.5px solid currentColor; font-size:30px; 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:250px; overflow:hidden; display:grid; grid-template-columns:116px minmax(0,1fr); align-items:center; gap:18px; padding:22px; border-radius:var(--radius-hero); border:1.5px solid var(--bc-cyan); background-size:cover; background-position:center; }
.sponsor-hero__avatar { width:116px; height:116px; 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:30px; 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:126px; 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:260px;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:31px;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:220px;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:230px}.ranking-podium-card--1{min-height:252px;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:220px;border-color:#a96831}.ranking-podium-card img{width:76px;height:76px;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:250px;display:grid;grid-template-columns:138px minmax(0,1fr);align-items:center;gap:18px;padding:18px;border:1px solid var(--bc-cyan);border-radius:var(--radius-hero);background-size:cover;background-position:center}.profile-user-hero__avatar{width:132px;height:132px;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:30px;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:120px;display:grid;grid-template-columns:86px 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:82px;height:82px;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:235px;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:30px;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:104px minmax(0,1fr)}.profile-user-hero__avatar{width:100px;height:100px}.achievement-row{grid-template-columns:repeat(3,1fr)}.profile-action-grid,.ranking-actions{grid-template-columns:1fr}}