/* Variant 2 — reworked original: round belt, personal status, action-first pages. */
.round-belt { position: sticky; top: 78px; z-index: 25; border-bottom: 1px solid var(--line); background: rgba(9,12,26,.92); backdrop-filter: blur(14px); }
.round-belt__inner { min-height: 46px; display: flex; flex-wrap: wrap; align-items: center; gap: 8px 22px; font-size: var(--text-caption); }
.round-belt__title { color: var(--paper); font-weight: 900; }
.round-belt__timer { color: var(--lime); font-weight: 900; }
.round-belt__sync { display: inline-flex; align-items: center; gap: 7px; color: var(--muted); }
.round-belt__sync--stale { color: #ffb657; }
.round-belt__link { margin-left: auto; color: var(--muted); text-decoration: underline; text-underline-offset: 3px; }
.round-belt__link:hover { color: var(--paper); }

.me-button { display: inline-flex; align-items: center; gap: 9px; min-height: 42px; padding: 0 8px 0 16px; border: 1px solid var(--line-hot); border-radius: 999px; background: rgba(215,255,73,.08); color: var(--paper); font-weight: 900; font-size: var(--text-caption); cursor: pointer; }
.me-button:hover { background: rgba(215,255,73,.15); }
.me-button__value { min-width: 28px; height: 28px; display: grid; place-items: center; padding: 0 8px; border-radius: 999px; background: var(--lime); color: #10120c; }

.now-stage { display: grid; grid-template-columns: minmax(0,1.05fr) minmax(320px,.95fr); gap: 40px; align-items: center; padding-block: clamp(38px,6vw,72px); }
.now-stage h1 { margin-bottom: 18px; font-size: clamp(2.6rem,5.4vw,4.6rem); }
.now-stage p { max-width: 560px; margin-bottom: 26px; }
.now-stage__actions { display: flex; flex-wrap: wrap; gap: 12px; }
.now-stage__me { margin-top: 18px; }
.now-stage__me-button { padding: 0; border: 0; background: none; color: var(--lime); font: inherit; font-weight: 900; text-decoration: underline; text-underline-offset: 4px; cursor: pointer; }

.round-card { padding: 26px; border: 1px solid var(--line-hot); border-radius: var(--radius-lg); background: linear-gradient(160deg, rgba(215,255,73,.1), rgba(215,255,73,0) 58%), rgba(13,16,33,.92); box-shadow: var(--shadow); }
.round-card__top { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 18px; }
.round-card__clock { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 8px; text-align: center; }
.round-card__clock > div { padding: 12px 4px; border-radius: 14px; background: rgba(255,255,255,.04); }
.round-card__clock span { display: block; font-family: var(--display-font); font-size: clamp(1.7rem,3vw,2.4rem); line-height: 1; color: #fff; }
.round-card__clock small { display: block; margin-top: 5px; color: var(--muted); font-size: .68rem; text-transform: uppercase; letter-spacing: .08em; }
.round-card__deadline { margin: 12px 0 18px; color: var(--muted); font-size: var(--text-caption); }
.round-card__facts { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 12px; margin: 0 0 18px; }
.round-card__facts div { padding: 13px; border-radius: 14px; background: rgba(255,255,255,.04); }
.round-card__facts dt { color: var(--muted); font-size: .72rem; text-transform: uppercase; letter-spacing: .08em; }
.round-card__facts dd { margin: 6px 0 0; color: #fff; font-size: 1.15rem; font-weight: 900; }

/* The 310px column is a wish, not a demand: on a narrow phone the card follows the
   width of the screen instead of sticking out past its right edge. */
.path-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(310px, 100%),1fr)); gap: 16px; }
.path-card { min-width: 0; display: grid; gap: 14px; align-content: start; padding: 26px; border: 1px solid var(--line); border-radius: var(--radius-lg); background: rgba(255,255,255,.02); }
.path-card--accent { border-color: var(--line-hot); background: linear-gradient(150deg, rgba(215,255,73,.09), rgba(215,255,73,0) 60%), rgba(255,255,255,.02); }
.path-card__tag { color: var(--lime); font-size: .72rem; font-weight: 900; letter-spacing: .14em; text-transform: uppercase; }
.path-card h3 { margin: 0; font-size: 1.45rem; }
.path-card ol { margin: 0; padding-left: 20px; display: grid; gap: 9px; color: var(--muted); }
.path-card .button { justify-self: start; }

.winner-strip { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px,1fr)); gap: 14px; }
.winner-strip__card { display: grid; gap: 6px; padding: 20px; border: 1px solid var(--line); border-radius: 16px; background: rgba(255,255,255,.025); }
.winner-strip__tag { color: var(--lime); font-size: .7rem; font-weight: 900; letter-spacing: .12em; text-transform: uppercase; }
.winner-strip__card strong { font-size: 1.15rem; }
.winner-strip__handle { color: var(--muted); font-size: var(--text-caption); }
.winner-strip__card p { margin: 4px 0 0; color: var(--paper); }
.winner-strip__status { color: var(--lime); font-size: var(--text-caption); font-weight: 900; }

.trust-steps--flat { grid-template-columns: repeat(auto-fit, minmax(260px,1fr)); }
.home-trust__actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 22px; }

.action-stage { display: grid; grid-template-columns: minmax(0,1fr) minmax(320px,.85fr); gap: 36px; align-items: start; padding-block: clamp(34px,5vw,62px); }
.action-stage h1 { margin-bottom: 16px; font-size: clamp(2.4rem,4.6vw,3.9rem); }
.action-stage p { max-width: 540px; }
.submit-card { padding: 24px; border: 1px solid var(--line-hot); border-radius: var(--radius-lg); background: rgba(13,16,33,.9); }
.submit-card h2 { margin-bottom: 14px; font-size: 1.3rem; }
.submit-card label { display: block; margin-bottom: 8px; color: var(--muted); font-size: var(--text-caption); }
.submit-card__row { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 10px; }
.submit-card input { min-height: 50px; padding: 0 14px; border: 1px solid var(--line-strong); border-radius: 12px; background: #090c19; color: var(--paper); font: inherit; }
.submit-card__notice { margin-top: 14px; padding: 13px 15px; border-radius: 12px; border: 1px solid rgba(255,79,145,.35); background: rgba(255,79,145,.08); display: grid; gap: 4px; font-size: var(--text-caption); }
.submit-card__notice--ok { border-color: var(--line-hot); background: rgba(215,255,73,.09); }
.submit-card__status { margin-top: 18px; padding-top: 18px; border-top: 1px solid var(--line); display: grid; gap: 8px; justify-items: start; }
.submit-card__status p { margin: 0; color: var(--muted); font-size: var(--text-caption); }

.me-card { display: grid; gap: 10px; justify-items: start; padding: 26px; border: 1px solid var(--line-hot); border-radius: var(--radius-lg); background: linear-gradient(150deg, rgba(255,79,145,.16), rgba(137,134,255,.12)); }
.me-card__value { font-family: var(--display-font); font-size: clamp(3rem,7vw,4.6rem); line-height: 1; }
.me-card__hint { margin: 0; color: rgba(255,255,255,.8); font-size: var(--text-caption); }

.leader-cards { display: grid; gap: 10px; }
.leader-card { display: grid; grid-template-columns: 44px minmax(0,1.2fr) minmax(0,1.4fr) auto auto; gap: 16px; align-items: center; padding: 14px 16px; border: 1px solid var(--line); border-radius: 14px; background: rgba(255,255,255,.025); }
.leader-card__author { min-width: 0; display: grid; gap: 3px; }
.leader-card__author strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.leader-card__author span { color: var(--muted); font-size: var(--text-caption); }
.leader-card__metrics { display: grid; gap: 3px; color: var(--muted); font-size: var(--text-caption); }
.leader-card__metrics b { color: var(--paper); font-size: var(--text-body); }
.leader-card__goal { color: #ffb657; }
.leader-card__chance { display: grid; gap: 6px; min-width: 110px; justify-items: end; }
.leader-card__chance b { color: var(--lime); font-size: 1.05rem; }
.leader-card__link { color: var(--muted); font-size: var(--text-caption); white-space: nowrap; }
.leader-card__link:hover { color: var(--lime); }

.rules-quick { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px,1fr)); gap: 12px; margin-top: 30px; }
.rules-quick article { display: grid; gap: 8px; align-content: start; padding: 20px; border: 1px solid var(--line); border-radius: 16px; background: rgba(255,255,255,.025); }
.rules-quick span { color: var(--lime); font-family: var(--display-font); font-size: 1.4rem; }
.rules-quick p { margin: 0; font-size: var(--text-caption); }

.faq-list { display: grid; gap: 8px; }
.faq-list details { padding: 16px 18px; border: 1px solid var(--line); border-radius: 14px; background: rgba(255,255,255,.025); }
.faq-list summary { cursor: pointer; font-weight: 900; }
.faq-list details[open] summary { color: var(--lime); }
.faq-list p { margin: 10px 0 0; font-size: var(--text-small); }

.fair-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px,1fr)); gap: 14px; }
.fair-grid article { padding: 22px; border: 1px solid var(--line); border-radius: 16px; background: rgba(255,255,255,.025); }
.fair-grid strong { display: block; margin-bottom: 8px; color: var(--lime); }
.fair-grid p { margin: 0; font-size: var(--text-small); }

.winners-hero { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 30px; align-items: center; padding-block: clamp(40px,6vw,80px); }
.winners-hero h1 { font-size: clamp(2.6rem,6vw,5rem); }
.winners-hero p { max-width: 520px; }
.winners-hero__stats { display: flex; gap: 14px; }
.winners-hero__stats article { min-width: 130px; padding: 18px; border: 1px solid var(--line); border-radius: 16px; background: rgba(255,255,255,.025); text-align: center; }
.winners-hero__stats strong { display: block; font-family: var(--display-font); font-size: 2.4rem; color: var(--lime); }
.winners-hero__stats span { color: var(--muted); font-size: var(--text-caption); }
.winners-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(270px,1fr)); gap: 14px; }
.winner-tile { display: grid; gap: 8px; align-content: start; padding: 22px; border: 1px solid var(--line); border-radius: 18px; background: rgba(255,255,255,.025); }
.winner-tile__top { display: flex; flex-wrap: wrap; gap: 8px; justify-content: space-between; }
.winner-tile__tag { color: var(--lime); font-size: .7rem; font-weight: 900; letter-spacing: .12em; text-transform: uppercase; }
.winner-tile h3 { margin: 0; font-size: 1.25rem; }
.winner-tile__handle { color: var(--muted); font-size: var(--text-caption); }
.winner-tile__prize { margin: 4px 0 0; font-weight: 900; }
.winner-tile__meta { display: grid; gap: 2px; color: var(--muted); font-size: var(--text-caption); }

@media (max-width: 980px) {
  .now-stage, .action-stage, .winners-hero { grid-template-columns: minmax(0,1fr); }
  .round-belt { position: static; }
  .leader-card { grid-template-columns: 40px minmax(0,1fr) auto; }
  .leader-card__metrics { grid-column: 2 / -1; }
  .leader-card__link { grid-column: 2 / -1; }
}

@media (max-width: 640px) {
  .round-card__facts { grid-template-columns: 1fr; }
  .winners-hero__stats { width: 100%; }
  .winners-hero__stats article { flex: 1; min-width: 0; }
  /* The headline used to keep a floor of 2.6rem, so a single long word such as
     "комментируй" ran off the right edge of a 320px screen and was cut in half. It now
     follows the width of the screen, and any word longer still is wrapped. */
  .now-stage h1 { font-size: clamp(1.95rem, 8.6vw, 2.9rem); }
  .action-stage h1 { font-size: clamp(1.85rem, 8vw, 2.7rem); }
  .winners-hero h1 { font-size: clamp(1.95rem, 8.6vw, 2.9rem); }
  .ui-two h1, .ui-two h2 { overflow-wrap: anywhere; }
}

/* The active section is filled with the brand colour, like the active version chip. */
.ui-two .site-nav__link--active,
.ui-two .site-nav__link--active:hover { color: #10120c; background: var(--lime); box-shadow: 0 0 22px rgba(215,255,73,.28); }

/* Highlighted words in headings read like a marker stroke, not just coloured text. */
.ui-two h1 em, .ui-two h2 em { background: var(--lime); color: #10120c; padding: 0 .14em; font-style: normal; box-decoration-break: clone; -webkit-box-decoration-break: clone; }

/* The sliding highlight replaces the flat fill of the current link, so the
   section chip is painted once and moves instead of blinking. */
.ui-two .site-nav .nav-pill { box-shadow: 0 0 22px rgba(215, 255, 73, .28); }
.ui-two .site-nav.has-nav-pill .site-nav__link--active,
.ui-two .site-nav.has-nav-pill .site-nav__link--active:hover {
  color: #10120c;
  background: transparent;
  box-shadow: none;
}