/* =========================
   Home page sections
   (currently: Section 1)
   ========================= */

.rc-section{
  padding: 54px 0;
}

.rc-kicker{
  margin:0 0 10px;
  font-family: var(--rc-font-mono);
  font-size: 12px;
  letter-spacing: .9px;
  text-transform: uppercase;
  color: rgba(241,230,207,.86);
}

.rc-h1Hero{
  position:relative;
  overflow:hidden;
}
.rc-h1Hero__inner{
  position:relative;
  display:grid;
  grid-template-columns: 1.25fr .9fr;
  gap: 18px;
  align-items: start;
  padding: 22px 0 10px;
}

/* Background layers unique to hero */
.rc-h1Hero__bg{
  position:absolute;
  inset:-40px -40px -30px -40px;
  pointer-events:none;
  z-index:0;
}
.rc-h1Hero__grid{
  position:absolute;
  inset:0;
  background:
    linear-gradient(rgba(237,241,255,.06) 1px, transparent 1px),
    linear-gradient(90deg, rgba(237,241,255,.05) 1px, transparent 1px);
  background-size: 44px 44px;
  mask-image: radial-gradient(400px 240px at 16% 10%, #000 60%, transparent 100%);
  opacity:.85;
}
.rc-h1Hero__spray{
  position:absolute;
  inset:0;
  background:
    radial-gradient(220px 160px at 12% 22%, rgba(185,255,62,.16), transparent 70%),
    radial-gradient(280px 220px at 76% 18%, rgba(241,230,207,.12), transparent 72%),
    radial-gradient(360px 260px at 58% 86%, rgba(74,31,77,.16), transparent 74%);
  opacity:.95;
}
.rc-h1Hero__route{
  position:absolute;
  left: 10%;
  top: 18%;
  width: 520px;
  height: 300px;
  border-radius: 999px;
  border: 1px dashed rgba(241,230,207,.22);
  transform: rotate(-12deg);
  filter: drop-shadow(0 10px 26px rgba(0,0,0,.25));
  animation: rcRouteDrift 7s ease-in-out infinite;
}
@keyframes rcRouteDrift{
  0%{ transform: translateY(0) rotate(-12deg); opacity:.45; }
  50%{ transform: translateY(10px) rotate(-10deg); opacity:.75; }
  100%{ transform: translateY(0) rotate(-12deg); opacity:.45; }
}

/* Copy */
.rc-h1Hero__copy{
  position:relative;
  z-index:1;
  padding: 18px 18px 18px;
  border-radius: var(--rc-radius-xl);
  border: 1px solid rgba(237,241,255,.12);
  background: linear-gradient(135deg, rgba(7,8,11,.55), rgba(74,31,77,.10));
  box-shadow: var(--rc-shadow);
}

.rc-h1{
  margin:0 0 14px;
  font-size: clamp(28px, 3.2vw, 44px);
  line-height: 1.05;
  letter-spacing: -0.6px;
}
.rc-h1__accent{
  background: linear-gradient(90deg, rgba(185,255,62,.95), rgba(241,230,207,.60));
  -webkit-background-clip:text;
  background-clip:text;
  color: transparent;
}
.rc-h1__accent2{
  background: linear-gradient(90deg, rgba(241,230,207,.85), rgba(74,31,77,.85));
  -webkit-background-clip:text;
  background-clip:text;
  color: transparent;
}
.rc-lead{
  margin:0 0 16px;
  color: var(--rc-dim);
  line-height: 1.65;
  max-width: 70ch;
}

/* CTA */
.rc-h1Hero__ctaRow{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  margin: 10px 0 14px;
}
.rc-btn{
  position:relative;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  padding: 12px 14px;
  border-radius: 16px;
  border: 1px solid rgba(237,241,255,.14);
  background: rgba(7,8,11,.25);
  box-shadow: 0 10px 24px rgba(0,0,0,.18);
  transition: transform .2s ease, border-color .2s ease, background .2s ease;
}
.rc-btn:hover{
  transform: translateY(-2px);
  border-color: rgba(185,255,62,.45);
}
.rc-btn__label{
  font-weight:600;
  letter-spacing:.15px;
}
.rc-btn--primary{
  background: linear-gradient(135deg, rgba(185,255,62,.16), rgba(241,230,207,.08), rgba(74,31,77,.10));
}
.rc-btn--ghost{
  background: rgba(241,230,207,.06);
}
.rc-btn__spark{
  width:10px;height:10px;
  border-radius:99px;
  background: rgba(185,255,62,.95);
  box-shadow: 0 0 0 8px rgba(185,255,62,.12);
  animation: rcSpark 1.6s ease-in-out infinite;
}
@keyframes rcSpark{
  0%{ transform: scale(.9); opacity:.6; }
  50%{ transform: scale(1.12); opacity:1; }
  100%{ transform: scale(.9); opacity:.6; }
}
.rc-btn__arrow{
  font-family: var(--rc-font-mono);
  color: rgba(241,230,207,.9);
}

/* Chips */
.rc-h1Hero__chips{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  margin-top: 10px;
}
.rc-chip{
  text-align:left;
  border-radius: 18px;
  border: 1px solid rgba(237,241,255,.12);
  background: rgba(7,8,11,.22);
  padding: 10px 12px;
  cursor:pointer;
  transition: transform .18s ease, border-color .18s ease, background .18s ease;
}
.rc-chip:hover{
  transform: translateY(-2px);
  border-color: rgba(241,230,207,.30);
  background: rgba(74,31,77,.10);
}
.rc-chip__cap{
  display:block;
  font-family: var(--rc-font-mono);
  font-size: 11px;
  letter-spacing:.8px;
  text-transform: uppercase;
  color: rgba(241,230,207,.88);
}
.rc-chip__txt{
  display:block;
  margin-top:2px;
  font-size: 13px;
  color: var(--rc-dim);
}

/* Rail (unique “season pass” column) */
.rc-h1Hero__rail{
  position:relative;
  z-index:1;
}
.rc-rail{
  border-radius: var(--rc-radius-xl);
  border: 1px solid rgba(237,241,255,.12);
  background: linear-gradient(135deg, rgba(20,51,31,.18), rgba(7,8,11,.35));
  box-shadow: var(--rc-shadow);
  padding: 16px;
}
.rc-rail__tag{
  margin:0;
  font-family: var(--rc-font-mono);
  font-size: 12px;
  letter-spacing:.9px;
  text-transform: uppercase;
  color: rgba(185,255,62,.92);
}
.rc-rail__hint{
  margin:8px 0 0;
  color: var(--rc-dim);
  line-height:1.5;
}

.rc-rail__steps{
  list-style:none;
  padding: 14px 0 8px;
  margin: 10px 0 0;
  border-top:1px solid rgba(237,241,255,.10);
}
.rc-step{
  display:grid;
  grid-template-columns: 16px 1fr;
  gap:10px;
  padding: 10px 0;
  border-bottom:1px solid rgba(237,241,255,.08);
}
.rc-step__node{
  width:14px;height:14px;
  border-radius:99px;
  border:1px solid rgba(241,230,207,.26);
  background: rgba(185,255,62,.10);
  box-shadow: 0 0 0 6px rgba(185,255,62,.08);
  margin-top: 3px;
}
.rc-step__title{
  margin:0;
  font-weight:600;
  letter-spacing:.15px;
}
.rc-step__desc{
  margin:4px 0 0;
  color: var(--rc-dim);
  line-height:1.5;
}

.rc-rail__meterWrap{
  padding-top: 12px;
}
.rc-rail__meter{
  height: 12px;
  border-radius: 999px;
  border: 1px solid rgba(237,241,255,.10);
  background: rgba(7,8,11,.25);
  overflow:hidden;
}
.rc-rail__fill{
  display:block;
  height:100%;
  width: 0%;
  background: linear-gradient(90deg, rgba(185,255,62,.95), rgba(241,230,207,.55), rgba(74,31,77,.55));
  border-radius: 999px;
}
.rc-rail__meterTxt{
  margin:8px 0 0;
  font-family: var(--rc-font-mono);
  font-size:11px;
  letter-spacing:.7px;
  text-transform:uppercase;
  color: rgba(241,230,207,.78);
}

/* Board of “postais” */
.rc-h1Hero__board{
  grid-column: 1 / -1;
  margin-top: 14px;
  display:grid;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  gap: 12px;
  position:relative;
  z-index:1;
}
.rc-post{
  border-radius: 22px;
  border: 1px solid rgba(237,241,255,.12);
  background: rgba(7,8,11,.20);
  box-shadow: 0 10px 24px rgba(0,0,0,.18);
  overflow:hidden;
  transform-origin: center;
  transition: transform .22s ease, border-color .22s ease, background .22s ease;
}
.rc-post:hover{
  transform: translateY(-3px) rotate(-.2deg);
  border-color: rgba(185,255,62,.32);
  background: rgba(185,255,62,.05);
}
.rc-post img{
  width:100%;
  max-width:350px;
  margin: 0 auto;
}
.rc-post__cap{
  padding: 10px 12px 12px;
  border-top:1px solid rgba(237,241,255,.10);
  display:flex;
  flex-direction:column;
  gap:4px;
}
.rc-post__lbl{
  font-family: var(--rc-font-mono);
  font-size: 11px;
  letter-spacing:.8px;
  text-transform: uppercase;
  color: rgba(241,230,207,.86);
}
.rc-post__txt{
  color: var(--rc-dim);
  line-height:1.45;
}

/* Slightly different cuts per tile (no inline styles) */
.rc-post--a{ border-top-left-radius: 30px; border-bottom-right-radius: 30px; }
.rc-post--b{ border-top-right-radius: 30px; border-bottom-left-radius: 30px; }
.rc-post--c{ border-radius: 26px 18px 30px 18px; }
.rc-post--d{ border-radius: 18px 30px 18px 30px; }

/* Responsive */
@media (max-width: 1020px){
  .rc-h1Hero__inner{ grid-template-columns: 1fr; }
  .rc-h1Hero__board{ grid-template-columns: 1fr 1fr; }
}
@media (max-width: 560px){
  .rc-section{ padding: 44px 0; }
  .rc-h1Hero__copy{ padding: 16px; }
  .rc-h1Hero__board{ grid-template-columns: 1fr; }
}
/* Shared head for inner sections */
.rc-sHead{ margin-bottom: 16px; }
.rc-h2{
  margin:0 0 10px;
  font-size: clamp(22px, 2.2vw, 34px);
  line-height:1.12;
  letter-spacing:-.35px;
}
.rc-sLead{
  margin:0;
  color: var(--rc-dim);
  line-height:1.7;
  max-width: 78ch;
}

/* =========================
   SECTION 2: Tideboard
   ========================= */
.rc-s2Inner{ position:relative; }
.rc-s2Grid{
  margin-top: 16px;
  display:grid;
  grid-template-columns: .9fr 1.1fr .95fr;
  gap: 14px;
  align-items:start;
}

.rc-s2Panel{
  border-radius: var(--rc-radius-xl);
  border:1px solid rgba(237,241,255,.12);
  background: linear-gradient(135deg, rgba(74,31,77,.12), rgba(7,8,11,.45));
  box-shadow: var(--rc-shadow);
  padding: 14px;
  position:relative;
  overflow:hidden;
}
.rc-s2Panel::after{
  content:"";
  position:absolute;
  inset:-40px -20px auto -40px;
  height:120px;
  background: radial-gradient(closest-side, rgba(185,255,62,.18), transparent 70%);
  transform: rotate(-10deg);
  opacity:.75;
  pointer-events:none;
}

.rc-s2Gauge{ padding: 12px 10px; border-bottom:1px solid rgba(237,241,255,.08); }
.rc-s2Gauge:last-of-type{ border-bottom:none; }
.rc-s2GaugeCap{
  margin:0;
  font-family: var(--rc-font-mono);
  font-size:11px;
  letter-spacing:.9px;
  text-transform:uppercase;
  color: rgba(241,230,207,.85);
}
.rc-s2GaugeVal{
  margin:6px 0 8px;
  font-weight:600;
  letter-spacing:.2px;
}
.rc-s2Bar{
  height: 12px;
  border-radius:999px;
  border:1px solid rgba(237,241,255,.10);
  background: rgba(7,8,11,.22);
  overflow:hidden;
}
.rc-s2BarFill{
  display:block;
  height:100%;
  width:0%;
  border-radius:999px;
  background: linear-gradient(90deg, rgba(185,255,62,.95), rgba(241,230,207,.55), rgba(74,31,77,.55));
}
.rc-s2GaugeHint{
  margin:8px 0 0;
  color: var(--rc-dim);
  line-height:1.55;
  font-size: 13px;
}

.rc-s2StampRow{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  padding: 12px 10px 6px;
}
.rc-s2Stamp{
  font-family: var(--rc-font-mono);
  font-size: 11px;
  letter-spacing: .9px;
  text-transform: uppercase;
  padding: 8px 10px;
  border-radius: 999px;
  border:1px dashed rgba(241,230,207,.24);
  background: rgba(241,230,207,.06);
  color: rgba(241,230,207,.88);
}

/* Center wave block */
.rc-s2Wave{
  border-radius: var(--rc-radius-xl);
  border:1px solid rgba(237,241,255,.12);
  background: linear-gradient(135deg, rgba(20,51,31,.16), rgba(7,8,11,.42));
  box-shadow: var(--rc-shadow);
  padding: 14px;
  position:relative;
  overflow:hidden;
}
.rc-s2WaveTop{ padding: 2px 2px 10px; }
.rc-s2WaveTitle{ margin:0; font-weight:600; letter-spacing:.15px; }
.rc-s2WaveMicro{
  margin:6px 0 0;
  color: var(--rc-dim);
  line-height:1.5;
  font-size: 13px;
}

.rc-s2WaveCanvas{
  margin: 10px 0 12px;
  border-radius: 20px;
  border:1px solid rgba(237,241,255,.10);
  background:
    radial-gradient(240px 160px at 20% 30%, rgba(185,255,62,.12), transparent 70%),
    radial-gradient(260px 190px at 78% 50%, rgba(241,230,207,.10), transparent 72%),
    rgba(7,8,11,.22);
  height: 140px;
  position:relative;
  overflow:hidden;
}
.rc-s2WaveLine{
  position:absolute;
  left:-20%;
  right:-20%;
  top: 46%;
  height: 2px;
  background: linear-gradient(90deg, transparent, rgba(185,255,62,.55), rgba(241,230,207,.28), rgba(74,31,77,.45), transparent);
  transform: rotate(-6deg);
  animation: rcS2Drift 6s ease-in-out infinite;
}
@keyframes rcS2Drift{
  0%{ transform: translateY(0) rotate(-6deg); opacity:.55; }
  50%{ transform: translateY(10px) rotate(-5deg); opacity:.9; }
  100%{ transform: translateY(0) rotate(-6deg); opacity:.55; }
}
.rc-s2WaveDots{ position:absolute; inset:0; }
.rc-s2Dot{
  position:absolute;
  width:10px;height:10px;
  border-radius:99px;
  background: rgba(185,255,62,.9);
  box-shadow: 0 0 0 8px rgba(185,255,62,.10);
  opacity:.9;
}
.rc-s2Dot--a{ left:14%; top:32%; }
.rc-s2Dot--b{ left:38%; top:60%; background: rgba(241,230,207,.8); box-shadow:0 0 0 8px rgba(241,230,207,.08); }
.rc-s2Dot--c{ left:62%; top:40%; background: rgba(185,255,62,.9); }
.rc-s2Dot--d{ left:82%; top:58%; background: rgba(74,31,77,.8); box-shadow:0 0 0 8px rgba(74,31,77,.10); }

.rc-s2WaveBars{
  position:absolute;
  right:10px;
  bottom:10px;
  display:flex;
  gap:6px;
  align-items:flex-end;
}
.rc-s2Beat{
  width:6px;
  height: 18px;
  border-radius: 99px;
  background: rgba(241,230,207,.22);
  border:1px solid rgba(237,241,255,.10);
  animation: rcS2Beat 1.8s ease-in-out infinite;
}
.rc-s2Beat:nth-child(2){ animation-delay:.12s; height:28px; }
.rc-s2Beat:nth-child(3){ animation-delay:.24s; height:20px; }
.rc-s2Beat:nth-child(4){ animation-delay:.36s; height:34px; }
.rc-s2Beat:nth-child(5){ animation-delay:.48s; height:22px; }
.rc-s2Beat:nth-child(6){ animation-delay:.60s; height:30px; }
.rc-s2Beat:nth-child(7){ animation-delay:.72s; height:16px; }
@keyframes rcS2Beat{
  0%{ transform: translateY(0); opacity:.55; }
  50%{ transform: translateY(-6px); opacity:.95; }
  100%{ transform: translateY(0); opacity:.55; }
}

.rc-s2Top{
  list-style:none;
  margin:0;
  padding:0;
  border-top:1px solid rgba(237,241,255,.10);
}
.rc-s2TopRow{
  display:grid;
  grid-template-columns: 42px 1fr .9fr 88px;
  gap:10px;
  padding:10px 4px;
  border-bottom:1px solid rgba(237,241,255,.08);
  align-items:center;
}
.rc-s2Rank{
  font-family: var(--rc-font-mono);
  color: rgba(241,230,207,.82);
  letter-spacing:.8px;
}
.rc-s2Name{ font-weight:600; letter-spacing:.15px; }
.rc-s2Tag{
  font-family: var(--rc-font-mono);
  font-size:11px;
  letter-spacing:.7px;
  text-transform:uppercase;
  color: var(--rc-dim);
}
.rc-s2Pts{
  text-align:right;
  font-family: var(--rc-font-mono);
  font-size:12px;
  letter-spacing:.6px;
  color: rgba(185,255,62,.85);
}
.rc-s2Note{
  margin:12px 2px 0;
  color: var(--rc-dim);
  line-height:1.65;
}

/* Right collage */
.rc-s2Collage{
  display:grid;
  gap:12px;
}
.rc-s2Shot{
  border-radius: 24px;
  border:1px solid rgba(237,241,255,.12);
  background: rgba(7,8,11,.20);
  box-shadow: 0 10px 24px rgba(0,0,0,.18);
  overflow:hidden;
  transition: transform .22s ease, border-color .22s ease, background .22s ease;
}
.rc-s2Shot:hover{
  transform: translateY(-3px) rotate(.2deg);
  border-color: rgba(185,255,62,.30);
  background: rgba(185,255,62,.05);
}
.rc-s2Shot img{
  width:100%;
  max-width:350px;
  margin:0 auto;
}
.rc-s2Cap{
  padding:10px 12px 12px;
  border-top:1px solid rgba(237,241,255,.10);
}
.rc-s2CapK{
  display:block;
  font-family: var(--rc-font-mono);
  font-size:11px;
  letter-spacing:.8px;
  text-transform:uppercase;
  color: rgba(241,230,207,.86);
}
.rc-s2CapT{
  display:block;
  margin-top:4px;
  color: var(--rc-dim);
  line-height:1.45;
}
.rc-s2Shot--a{ border-radius: 30px 18px 26px 18px; }
.rc-s2Shot--b{ border-radius: 18px 30px 18px 26px; }
.rc-s2Shot--c{ border-radius: 26px 18px 30px 18px; }

/* =========================
   SECTION 3: Mission tape
   ========================= */
.rc-s3Wrap{
  margin-top: 16px;
  display:grid;
  grid-template-columns: 1.25fr .9fr;
  gap: 14px;
  align-items:start;
}

.rc-s3Tape{
  border-radius: var(--rc-radius-xl);
  border:1px solid rgba(237,241,255,.12);
  background: linear-gradient(135deg, rgba(241,230,207,.06), rgba(7,8,11,.42));
  box-shadow: var(--rc-shadow);
  padding: 14px;
  overflow:hidden;
}
.rc-s3TapeRail{
  display:flex;
  gap:12px;
  overflow:auto;
  padding: 8px 2px 14px;
  scroll-snap-type: x mandatory;
  scrollbar-width: thin;
  scrollbar-color: rgba(241,230,207,.25) transparent;
}
.rc-s3Ticket{
  min-width: 260px;
  max-width: 320px;
  border-radius: 22px;
  border:1px dashed rgba(241,230,207,.20);
  background: rgba(7,8,11,.26);
  padding: 12px 12px 12px;
  scroll-snap-align: start;
  box-shadow: 0 12px 30px rgba(0,0,0,.18);
  transition: transform .2s ease, border-color .2s ease, background .2s ease;
}
.rc-s3Ticket:hover{
  transform: translateY(-2px);
  border-color: rgba(185,255,62,.32);
  background: rgba(185,255,62,.05);
}
.rc-s3TicketTop{
  margin:0;
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  gap:8px;
}
.rc-s3TicketTag{
  font-family: var(--rc-font-mono);
  font-size:11px;
  letter-spacing:.8px;
  text-transform:uppercase;
  color: rgba(241,230,207,.86);
}
.rc-s3TicketPts{
  font-family: var(--rc-font-mono);
  font-size:11px;
  letter-spacing:.8px;
  text-transform:uppercase;
  color: rgba(185,255,62,.82);
}
.rc-s3TicketTitle{
  margin:10px 0 6px;
  font-weight:600;
  letter-spacing:.15px;
}
.rc-s3TicketText{
  margin:0;
  color: var(--rc-dim);
  line-height:1.6;
}

.rc-s3TapeHint{
  margin-top: 10px;
  padding-top: 10px;
  border-top:1px solid rgba(237,241,255,.10);
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
}
.rc-s3HintLine{
  margin:0;
  color: var(--rc-dim);
  line-height:1.6;
  max-width: 68ch;
}
.rc-s3Pulse{
  display:flex;
  gap:8px;
  margin-top: 4px;
}
.rc-s3PulseDot{
  width:10px;height:10px;
  border-radius:99px;
  border:1px solid rgba(237,241,255,.10);
  background: rgba(185,255,62,.10);
  animation: rcS3Pulse 1.6s ease-in-out infinite;
}
.rc-s3PulseDot:nth-child(2){ animation-delay:.18s; }
.rc-s3PulseDot:nth-child(3){ animation-delay:.36s; }
@keyframes rcS3Pulse{
  0%{ transform: translateY(0); opacity:.45; }
  50%{ transform: translateY(-4px); opacity:.95; }
  100%{ transform: translateY(0); opacity:.45; }
}

.rc-s3Wall{
  border-radius: var(--rc-radius-xl);
  border:1px solid rgba(237,241,255,.12);
  background: linear-gradient(135deg, rgba(74,31,77,.10), rgba(7,8,11,.40));
  box-shadow: var(--rc-shadow);
  padding: 14px;
  display:grid;
  gap:12px;
}
.rc-s3Poster{
  border-radius: 22px;
  border:1px solid rgba(237,241,255,.12);
  background: rgba(7,8,11,.22);
  overflow:hidden;
  transition: transform .22s ease, border-color .22s ease, background .22s ease;
}
.rc-s3Poster:hover{
  transform: translateY(-3px);
  border-color: rgba(241,230,207,.26);
  background: rgba(241,230,207,.05);
}
.rc-s3Poster img{ width:100%; max-width:350px; margin:0 auto; }
.rc-s3Poster--thin{ border-radius: 30px 18px 18px 30px; }

.rc-s3PosterCap{
  padding:10px 12px 12px;
  border-top:1px solid rgba(237,241,255,.10);
}
.rc-s3PosterK{
  display:block;
  font-family: var(--rc-font-mono);
  font-size:11px;
  letter-spacing:.8px;
  text-transform:uppercase;
  color: rgba(241,230,207,.86);
}
.rc-s3PosterT{
  display:block;
  margin-top:4px;
  color: var(--rc-dim);
  line-height:1.45;
}

.rc-s3Now{
  border-radius: 22px;
  border:1px dashed rgba(241,230,207,.22);
  background: rgba(241,230,207,.06);
  padding: 12px;
}
.rc-s3NowCap{
  margin:0;
  font-family: var(--rc-font-mono);
  font-size:11px;
  letter-spacing:.8px;
  text-transform:uppercase;
  color: rgba(241,230,207,.86);
}
.rc-s3NowLine{
  margin:8px 0 8px;
  font-weight:600;
  letter-spacing:.15px;
}
.rc-s3NowMicro{
  margin:0;
  color: var(--rc-dim);
  line-height:1.6;
}

/* =========================
   SECTION 4: Loadout Lab
   ========================= */
.rc-s4Grid{
  margin-top: 16px;
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
  align-items:start;
}

.rc-s4Control{
  border-radius: var(--rc-radius-xl);
  border:1px solid rgba(237,241,255,.12);
  background: linear-gradient(135deg, rgba(20,51,31,.16), rgba(7,8,11,.45));
  box-shadow: var(--rc-shadow);
  padding: 14px;
  position:relative;
  overflow:hidden;
}
.rc-s4Control::before{
  content:"";
  position:absolute;
  inset:auto -40px 18px -40px;
  height: 2px;
  background: linear-gradient(90deg, transparent, rgba(185,255,62,.55), rgba(241,230,207,.25), rgba(74,31,77,.45), transparent);
  opacity:.7;
  pointer-events:none;
}
.rc-s4ControlTop{ padding: 2px 2px 10px; }
.rc-s4Cap{ margin:0; font-weight:600; letter-spacing:.15px; }
.rc-s4Micro{ margin:8px 0 0; color: var(--rc-dim); line-height:1.6; }

.rc-s4Btns{ display:grid; gap:10px; margin-top: 10px; }
.rc-s4Btn{
  text-align:left;
  padding: 12px 12px;
  border-radius: 20px;
  border:1px solid rgba(237,241,255,.12);
  background: rgba(7,8,11,.22);
  cursor:pointer;
  transition: transform .2s ease, border-color .2s ease, background .2s ease;
}
.rc-s4Btn:hover{
  transform: translateY(-2px);
  border-color: rgba(185,255,62,.30);
  background: rgba(185,255,62,.05);
}
.rc-s4Btn.is-active{
  border-color: rgba(185,255,62,.55);
  background: linear-gradient(135deg, rgba(185,255,62,.10), rgba(74,31,77,.08));
}
.rc-s4BtnK{
  display:block;
  font-family: var(--rc-font-mono);
  font-size:11px;
  letter-spacing:.8px;
  text-transform:uppercase;
  color: rgba(241,230,207,.84);
}
.rc-s4BtnT{
  display:block;
  margin-top:4px;
  font-weight:600;
  letter-spacing:.15px;
}
.rc-s4BtnD{
  display:block;
  margin-top:2px;
  color: var(--rc-dim);
  font-size:13px;
  line-height:1.4;
}

.rc-s4PaneWrap{
  margin-top: 12px;
  border-top:1px solid rgba(237,241,255,.10);
  padding-top: 12px;
}
.rc-s4Pane{ display:none; }
.rc-s4Pane.is-active{ display:block; }
.rc-s4PaneTitle{
  margin:0 0 8px;
  font-weight:600;
  letter-spacing:.15px;
}
.rc-s4PaneText{
  margin:0 0 10px;
  color: var(--rc-dim);
  line-height:1.65;
}
.rc-s4Mini{
  margin:0;
  padding-left: 18px;
  color: var(--rc-dim);
  line-height:1.6;
}

/* Tray visuals */
.rc-s4Tray{
  border-radius: var(--rc-radius-xl);
  border:1px solid rgba(237,241,255,.12);
  background: linear-gradient(135deg, rgba(241,230,207,.05), rgba(7,8,11,.44));
  box-shadow: var(--rc-shadow);
  padding: 14px;
}
.rc-s4TrayTop{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  margin-bottom: 12px;
}
.rc-s4TrayChip{
  font-family: var(--rc-font-mono);
  font-size:11px;
  letter-spacing:.9px;
  text-transform:uppercase;
  padding: 8px 10px;
  border-radius: 999px;
  border:1px dashed rgba(241,230,207,.22);
  background: rgba(241,230,207,.06);
  color: rgba(241,230,207,.86);
}

.rc-s4Shots{
  display:grid;
  grid-template-columns: 1fr;
  gap:12px;
}
.rc-s4Shot{
  border-radius: 24px;
  border:1px solid rgba(237,241,255,.12);
  background: rgba(7,8,11,.20);
  overflow:hidden;
  transition: transform .22s ease, border-color .22s ease, background .22s ease;
}
.rc-s4Shot:hover{
  transform: translateY(-3px) rotate(-.15deg);
  border-color: rgba(185,255,62,.30);
  background: rgba(185,255,62,.05);
}
.rc-s4Shot img{ width:100%; max-width:350px; margin:0 auto; }
.rc-s4Cap{
  padding:10px 12px 12px;
  border-top:1px solid rgba(237,241,255,.10);
}
.rc-s4CapK{
  display:block;
  font-family: var(--rc-font-mono);
  font-size:11px;
  letter-spacing:.8px;
  text-transform:uppercase;
  color: rgba(241,230,207,.86);
}
.rc-s4CapT{
  display:block;
  margin-top:4px;
  color: var(--rc-dim);
  line-height:1.45;
}
.rc-s4Shot--a{ border-radius: 30px 18px 26px 18px; }
.rc-s4Shot--b{ border-radius: 18px 30px 18px 26px; }
.rc-s4Shot--c{ border-radius: 26px 18px 30px 18px; }

.rc-s4Foot{
  margin: 12px 2px 0;
  color: var(--rc-dim);
  line-height:1.65;
}

/* Responsive for sections 2–4 */
@media (max-width: 1020px){
  .rc-s2Grid{ grid-template-columns: 1fr; }
  .rc-s3Wrap{ grid-template-columns: 1fr; }
  .rc-s4Grid{ grid-template-columns: 1fr; }
  .rc-s2TopRow{ grid-template-columns: 42px 1fr; }
  .rc-s2Tag, .rc-s2Pts{ display:none; }
}
/* =========================
   SECTION 5: Tríptico de mapas
   Unique layout: left image + center core + right image + bottom banner
   ========================= */
.rc-s5Tri{
  margin-top:16px;
  display:grid;
  grid-template-columns: 1fr 1.15fr 1fr;
  gap:14px;
  align-items:stretch;
}

.rc-s5Frame{
  border-radius: var(--rc-radius-xl);
  border:1px solid rgba(237,241,255,.12);
  background: rgba(7,8,11,.22);
  box-shadow: var(--rc-shadow);
  overflow:hidden;
  transition: transform .22s ease, border-color .22s ease, background .22s ease;
}
.rc-s5Frame:hover{
  transform: translateY(-3px);
  border-color: rgba(185,255,62,.30);
  background: rgba(185,255,62,.05);
}
.rc-s5Frame img{ width:100%; max-width:350px; margin:0 auto; }
.rc-s5Frame--left{ border-radius: 30px 18px 30px 18px; }
.rc-s5Frame--right{ border-radius: 18px 30px 18px 30px; }

.rc-s5Cap{
  padding:10px 12px 12px;
  border-top:1px solid rgba(237,241,255,.10);
}
.rc-s5CapK{
  display:block;
  font-family: var(--rc-font-mono);
  font-size:11px;
  letter-spacing:.8px;
  text-transform:uppercase;
  color: rgba(241,230,207,.86);
}
.rc-s5CapT{
  display:block;
  margin-top:4px;
  color: var(--rc-dim);
  line-height:1.45;
}

.rc-s5Core{
  border-radius: var(--rc-radius-xl);
  border:1px solid rgba(237,241,255,.12);
  background: linear-gradient(135deg, rgba(74,31,77,.12), rgba(7,8,11,.46));
  box-shadow: var(--rc-shadow);
  padding:14px;
  position:relative;
  overflow:hidden;
}
.rc-s5CoreTop{ padding:2px 2px 10px; }
.rc-s5CoreK{
  margin:0;
  font-family: var(--rc-font-mono);
  font-size:11px;
  letter-spacing:.9px;
  text-transform:uppercase;
  color: rgba(241,230,207,.86);
}
.rc-s5CoreT{ margin:8px 0 0; color: var(--rc-dim); line-height:1.6; }

.rc-s5Pills{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  margin-top:10px;
}
.rc-s5Pill{
  font-family: var(--rc-font-mono);
  font-size:11px;
  letter-spacing:.8px;
  text-transform:uppercase;
  padding:8px 10px;
  border-radius:999px;
  border:1px dashed rgba(241,230,207,.22);
  background: rgba(241,230,207,.06);
  color: rgba(241,230,207,.86);
}

.rc-s5Radar{
  margin-top:12px;
  height: 160px;
  border-radius: 22px;
  border:1px solid rgba(237,241,255,.10);
  background:
    radial-gradient(220px 160px at 18% 30%, rgba(185,255,62,.12), transparent 70%),
    radial-gradient(260px 190px at 78% 55%, rgba(241,230,207,.10), transparent 72%),
    rgba(7,8,11,.22);
  position:relative;
  overflow:hidden;
}
.rc-s5RadarRing{
  position:absolute;
  inset: 18px;
  border-radius: 999px;
  border:1px solid rgba(241,230,207,.18);
  opacity:.9;
}
.rc-s5RadarRing:nth-child(2){
  inset: 44px;
  border-color: rgba(237,241,255,.10);
  opacity:.8;
}
.rc-s5RadarDot{
  position:absolute;
  width:10px;height:10px;
  border-radius:99px;
  background: rgba(185,255,62,.92);
  box-shadow: 0 0 0 8px rgba(185,255,62,.10);
  animation: rcS5Dot 2.6s ease-in-out infinite;
}
.rc-s5RadarDot--a{ left:22%; top:40%; }
.rc-s5RadarDot--b{ left:58%; top:30%; background: rgba(241,230,207,.82); box-shadow:0 0 0 8px rgba(241,230,207,.08); animation-delay:.22s; }
.rc-s5RadarDot--c{ left:72%; top:62%; background: rgba(74,31,77,.85); box-shadow:0 0 0 8px rgba(74,31,77,.10); animation-delay:.44s; }

@keyframes rcS5Dot{
  0%{ transform: translateY(0); opacity:.65; }
  50%{ transform: translateY(-6px); opacity:1; }
  100%{ transform: translateY(0); opacity:.65; }
}

.rc-s5Micro{
  margin:12px 2px 0;
  color: var(--rc-dim);
  line-height:1.6;
}

.rc-s5Bottom{
  grid-column: 1 / -1;
  border-radius: 26px;
  border:1px solid rgba(237,241,255,.12);
  background: rgba(7,8,11,.20);
  box-shadow: var(--rc-shadow);
  overflow:hidden;
  display:grid;
  grid-template-columns: 350px 1fr;
  gap:0;
  align-items:stretch;
}
.rc-s5Bottom img{ width:100%; max-width:350px; }
.rc-s5BottomCap{
  padding:12px 14px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  border-left:1px solid rgba(237,241,255,.10);
}

/* =========================
   SECTION 6: Replay mosaic
   Unique layout: asym grid (no overlaps)
   ========================= */
.rc-s6Grid{
  margin-top:16px;
  display:grid;
  grid-template-columns: .85fr 1.15fr;
  gap:14px;
  align-items:start;
}
.rc-s6Text{
  border-radius: var(--rc-radius-xl);
  border:1px solid rgba(237,241,255,.12);
  background: linear-gradient(135deg, rgba(20,51,31,.14), rgba(7,8,11,.46));
  box-shadow: var(--rc-shadow);
  padding:14px;
}
.rc-s6Rules{
  margin:0;
  padding-left:18px;
  color: var(--rc-dim);
  line-height:1.7;
}
.rc-s6Rules strong{ color: rgba(241,230,207,.92); }
.rc-s6Note{
  margin:12px 0 0;
  color: var(--rc-dim);
  line-height:1.6;
}

.rc-s6Mosaic{
  border-radius: var(--rc-radius-xl);
  border:1px solid rgba(237,241,255,.12);
  background: rgba(7,8,11,.22);
  box-shadow: var(--rc-shadow);
  padding:14px;
  display:grid;
  grid-template-columns: 1.05fr .95fr;
  grid-template-rows: auto auto;
  gap:12px;
}
.rc-s6Tile{
  border-radius: 22px;
  border:1px solid rgba(237,241,255,.12);
  background: rgba(7,8,11,.20);
  overflow:hidden;
  transition: transform .22s ease, border-color .22s ease, background .22s ease;
}
.rc-s6Tile:hover{
  transform: translateY(-3px);
  border-color: rgba(185,255,62,.28);
  background: rgba(185,255,62,.05);
}
.rc-s6Tile img{ width:100%; max-width:350px; margin:0 auto; }

.rc-s6Cap{
  padding:10px 12px 12px;
  border-top:1px solid rgba(237,241,255,.10);
}
.rc-s6CapK{
  display:block;
  font-family: var(--rc-font-mono);
  font-size:11px;
  letter-spacing:.8px;
  text-transform:uppercase;
  color: rgba(241,230,207,.86);
}
.rc-s6CapT{
  display:block;
  margin-top:4px;
  color: var(--rc-dim);
  line-height:1.45;
}

.rc-s6Tile--tall{ grid-row: 1 / span 2; }
.rc-s6Tile--wide{ grid-column: 2; }
.rc-s6Tile--square{ grid-column: 2; }
.rc-s6Tile--square2{ grid-column: 2; }

/* =========================
   SECTION 7: Badges ribbon
   Unique layout: staggered ribbon + filter highlight
   ========================= */
.rc-s7Grid{
  margin-top:16px;
  display:grid;
  grid-template-columns: .8fr 1.2fr;
  gap:14px;
  align-items:start;
}
.rc-s7Controls{
  border-radius: var(--rc-radius-xl);
  border:1px solid rgba(237,241,255,.12);
  background: linear-gradient(135deg, rgba(74,31,77,.10), rgba(7,8,11,.46));
  box-shadow: var(--rc-shadow);
  padding:14px;
  display:flex;
  flex-direction:column;
  gap:10px;
}
.rc-s7Tag{
  text-align:left;
  padding:12px 12px;
  border-radius: 18px;
  border:1px solid rgba(237,241,255,.12);
  background: rgba(7,8,11,.22);
  color: var(--rc-ink);
  cursor:pointer;
  transition: transform .2s ease, border-color .2s ease, background .2s ease;
}
.rc-s7Tag:hover{
  transform: translateY(-2px);
  border-color: rgba(241,230,207,.26);
  background: rgba(241,230,207,.05);
}
.rc-s7Tag.is-active{
  border-color: rgba(185,255,62,.55);
  background: linear-gradient(135deg, rgba(185,255,62,.10), rgba(74,31,77,.08));
}
.rc-s7Hint{
  margin:4px 0 0;
  color: var(--rc-dim);
  line-height:1.6;
}

.rc-s7Ribbon{
  border-radius: var(--rc-radius-xl);
  border:1px solid rgba(237,241,255,.12);
  background: rgba(7,8,11,.22);
  box-shadow: var(--rc-shadow);
  padding:14px;
  display:grid;
  gap:12px;
}
.rc-s7Badge{
  border-radius: 24px;
  border:1px solid rgba(237,241,255,.12);
  background: rgba(7,8,11,.20);
  overflow:hidden;
  transform-origin:center;
  transition: transform .22s ease, border-color .22s ease, background .22s ease, opacity .22s ease;
}
.rc-s7Badge:hover{
  transform: translateY(-3px) rotate(-.1deg);
  border-color: rgba(185,255,62,.28);
  background: rgba(185,255,62,.05);
}
.rc-s7Badge:nth-child(2){ transform: translateX(14px); }
.rc-s7Badge:nth-child(3){ transform: translateX(-10px); }

.rc-s7Badge img{ width:100%; max-width:350px; margin:0 auto; }
.rc-s7Cap{
  padding:10px 12px 12px;
  border-top:1px solid rgba(237,241,255,.10);
}
.rc-s7CapK{
  display:block;
  font-family: var(--rc-font-mono);
  font-size:11px;
  letter-spacing:.8px;
  text-transform:uppercase;
  color: rgba(241,230,207,.86);
}
.rc-s7CapT{
  display:block;
  margin-top:4px;
  color: var(--rc-dim);
  line-height:1.45;
}

/* Filter states */
.rc-s7Badge.is-dim{ opacity:.26; filter: saturate(.7); }
.rc-s7Badge.is-hot{
  border-color: rgba(185,255,62,.45);
  box-shadow: 0 16px 50px rgba(0,0,0,.28);
}

/* Responsive */
@media (max-width: 1020px){
  .rc-s5Tri{ grid-template-columns: 1fr; }
  .rc-s5Bottom{ grid-template-columns: 1fr; }
  .rc-s5BottomCap{ border-left:none; border-top:1px solid rgba(237,241,255,.10); }
  .rc-s6Grid{ grid-template-columns: 1fr; }
  .rc-s7Grid{ grid-template-columns: 1fr; }
  .rc-s7Badge:nth-child(2), .rc-s7Badge:nth-child(3){ transform:none; }
}
/* =========================
   SECTION 8: Delta de Patches (zigzag stream)
   ========================= */
.rc-s8Stream{
  margin: 16px 0 0;
  padding: 0;
  list-style: none;
  position: relative;
  display: grid;
  gap: 14px;
}
.rc-s8Stream::before{
  content:"";
  position:absolute;
  left: 50%;
  top: 10px;
  bottom: 10px;
  width: 2px;
  transform: translateX(-50%);
  background: linear-gradient(180deg, transparent, rgba(185,255,62,.35), rgba(241,230,207,.18), transparent);
  opacity: .8;
  pointer-events:none;
}

.rc-s8Entry{
  display:grid;
  grid-template-columns: 350px 1fr;
  gap: 14px;
  align-items: stretch;
}
.rc-s8Entry--even{
  grid-template-columns: 1fr 350px;
}
.rc-s8Thumb{
  margin:0;
  border-radius: 26px;
  border:1px solid rgba(237,241,255,.12);
  background: rgba(7,8,11,.22);
  box-shadow: var(--rc-shadow2);
  overflow:hidden;
  transition: transform .22s ease, border-color .22s ease, background .22s ease;
}
.rc-s8Thumb:hover{
  transform: translateY(-3px);
  border-color: rgba(185,255,62,.28);
  background: rgba(185,255,62,.05);
}
.rc-s8Thumb img{
  width:100%;
  max-width:350px;
  margin:0 auto;
}

.rc-s8Card{
  border-radius: var(--rc-radius-xl);
  border:1px solid rgba(237,241,255,.12);
  background: linear-gradient(135deg, rgba(20,51,31,.14), rgba(7,8,11,.48));
  box-shadow: var(--rc-shadow);
  padding: 14px;
  position: relative;
  overflow: hidden;
}
.rc-s8Card::after{
  content:"";
  position:absolute;
  inset:-60px -60px auto -60px;
  height: 160px;
  background: radial-gradient(closest-side, rgba(74,31,77,.18), transparent 70%);
  transform: rotate(-10deg);
  opacity:.9;
  pointer-events:none;
}
.rc-s8Topline{
  margin:0;
  display:flex;
  gap:10px;
  align-items:center;
  flex-wrap:wrap;
  position:relative;
  z-index:1;
}
.rc-s8Tag{
  font-family: var(--rc-font-mono);
  font-size: 11px;
  letter-spacing: .9px;
  text-transform: uppercase;
  padding: 8px 10px;
  border-radius: 999px;
  border: 1px solid rgba(237,241,255,.10);
  background: rgba(7,8,11,.22);
  color: rgba(241,230,207,.86);
}
.rc-s8Tag--lime{ border-color: rgba(185,255,62,.35); background: rgba(185,255,62,.08); color: rgba(185,255,62,.92); }
.rc-s8Tag--sand{ border-color: rgba(241,230,207,.32); background: rgba(241,230,207,.06); }
.rc-s8Tag--acai{ border-color: rgba(74,31,77,.40); background: rgba(74,31,77,.12); }

.rc-s8Meta{
  font-family: var(--rc-font-mono);
  font-size: 11px;
  letter-spacing: .8px;
  text-transform: uppercase;
  color: var(--rc-dim);
}
.rc-s8Title{
  margin: 10px 0 6px;
  font-weight: 600;
  letter-spacing: .15px;
  position:relative;
  z-index:1;
}
.rc-s8Text{
  margin:0;
  color: var(--rc-dim);
  line-height: 1.65;
  position:relative;
  z-index:1;
}
.rc-s8Rule{
  margin-top: 14px;
  border-radius: 22px;
  border:1px dashed rgba(241,230,207,.22);
  background: rgba(241,230,207,.06);
  padding: 12px 14px;
}
.rc-s8RuleK{
  margin:0;
  font-family: var(--rc-font-mono);
  font-size: 11px;
  letter-spacing: .9px;
  text-transform: uppercase;
  color: rgba(241,230,207,.86);
}
.rc-s8RuleT{
  margin: 8px 0 0;
  color: var(--rc-dim);
  line-height: 1.6;
}

/* =========================
   SECTION 9: Crew Board (center compass + 3 pins)
   ========================= */
.rc-s9Canvas{
  margin-top:16px;
  display:grid;
  grid-template-columns: 1fr 1.15fr 1fr;
  grid-template-rows: auto auto;
  gap: 14px;
  align-items: stretch;
}
.rc-s9Pin{
  margin:0;
  border-radius: 26px;
  border:1px solid rgba(237,241,255,.12);
  background: rgba(7,8,11,.22);
  box-shadow: var(--rc-shadow);
  overflow:hidden;
  transition: transform .22s ease, border-color .22s ease, background .22s ease;
}
.rc-s9Pin:hover{
  transform: translateY(-3px) rotate(.12deg);
  border-color: rgba(185,255,62,.28);
  background: rgba(185,255,62,.05);
}
.rc-s9Pin img{
  width:100%;
  max-width:350px;
  margin:0 auto;
}
.rc-s9Cap{
  padding: 10px 12px 12px;
  border-top:1px solid rgba(237,241,255,.10);
}
.rc-s9CapK{
  display:block;
  font-family: var(--rc-font-mono);
  font-size: 11px;
  letter-spacing: .8px;
  text-transform: uppercase;
  color: rgba(241,230,207,.86);
}
.rc-s9CapT{
  display:block;
  margin-top:4px;
  color: var(--rc-dim);
  line-height:1.45;
}

.rc-s9Pin--nw{ grid-column:1; grid-row:1; border-radius: 30px 18px 26px 18px; }
.rc-s9Pin--ne{ grid-column:3; grid-row:1; border-radius: 18px 30px 18px 26px; }
.rc-s9Pin--se{ grid-column:3; grid-row:2; border-radius: 26px 18px 30px 18px; }

.rc-s9Compass{
  grid-column:2;
  grid-row:1 / span 2;
  border-radius: var(--rc-radius-xl);
  border:1px solid rgba(237,241,255,.12);
  background: linear-gradient(135deg, rgba(74,31,77,.10), rgba(7,8,11,.48));
  box-shadow: var(--rc-shadow);
  padding: 14px;
  position:relative;
  overflow:hidden;
}
.rc-s9CompassRing{
  height: 180px;
  border-radius: 26px;
  border:1px solid rgba(237,241,255,.10);
  background:
    radial-gradient(closest-side, rgba(185,255,62,.14), transparent 70%),
    conic-gradient(from 210deg,
      rgba(185,255,62,.28),
      rgba(241,230,207,.18),
      rgba(74,31,77,.24),
      rgba(185,255,62,.28)
    );
  opacity:.92;
  animation: rcS9Spin2 14s linear infinite;
}
@keyframes rcS9Spin2{
  0%{ transform: rotate(0deg); }
  100%{ transform: rotate(360deg); }
}
.rc-s9CompassK{
  margin: 12px 0 0;
  font-family: var(--rc-font-mono);
  font-size: 12px;
  letter-spacing: .9px;
  text-transform: uppercase;
  color: rgba(241,230,207,.86);
}
.rc-s9CompassT{
  margin: 8px 0 0;
  color: var(--rc-dim);
  line-height: 1.6;
}
.rc-s9Chips{
  list-style:none;
  margin: 12px 0 0;
  padding:0;
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap:10px;
}
.rc-s9Chip{
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  gap:10px;
  padding: 10px 12px;
  border-radius: 18px;
  border:1px solid rgba(237,241,255,.12);
  background: rgba(7,8,11,.22);
  transition: transform .2s ease, border-color .2s ease, background .2s ease;
}
.rc-s9Chip:hover{
  transform: translateY(-2px);
  border-color: rgba(241,230,207,.26);
  background: rgba(241,230,207,.05);
}
.rc-s9ChipK{
  font-family: var(--rc-font-mono);
  font-size: 11px;
  letter-spacing: .8px;
  text-transform: uppercase;
  color: rgba(241,230,207,.86);
}
.rc-s9ChipT{
  font-family: var(--rc-font-mono);
  font-size: 11px;
  letter-spacing: .8px;
  text-transform: uppercase;
  color: rgba(185,255,62,.82);
}
.rc-s9CompassNote{
  margin: 12px 0 0;
  padding-top: 12px;
  border-top:1px solid rgba(237,241,255,.10);
  color: var(--rc-dim);
  line-height: 1.6;
}

/* =========================
   SECTION 10: Metronome Stage
   ========================= */
.rc-s10Film{
  margin-top:16px;
  border-radius: var(--rc-radius-xl);
  border:1px solid rgba(237,241,255,.12);
  background: rgba(7,8,11,.22);
  box-shadow: var(--rc-shadow);
  padding: 14px;
  display:grid;
  grid-template-columns: 1.2fr .8fr .8fr;
  gap:12px;
  align-items:stretch;
}
.rc-s10FilmFrame{
  margin:0;
  border-radius: 24px;
  border:1px solid rgba(237,241,255,.12);
  background: rgba(7,8,11,.20);
  overflow:hidden;
  transition: transform .22s ease, border-color .22s ease, background .22s ease;
}
.rc-s10FilmFrame:hover{
  transform: translateY(-3px);
  border-color: rgba(185,255,62,.28);
  background: rgba(185,255,62,.05);
}
.rc-s10FilmFrame img{
  width:100%;
  max-width:350px;
  margin:0 auto;
}
.rc-s10FilmCap{
  padding:10px 12px 12px;
  border-top:1px solid rgba(237,241,255,.10);
}
.rc-s10FilmK{
  display:block;
  font-family: var(--rc-font-mono);
  font-size: 11px;
  letter-spacing: .8px;
  text-transform: uppercase;
  color: rgba(241,230,207,.86);
}
.rc-s10FilmT{
  display:block;
  margin-top:4px;
  color: var(--rc-dim);
  line-height:1.45;
}
.rc-s10FilmFrame--wide{ border-radius: 30px 18px 26px 18px; }
.rc-s10FilmFrame--smallA{ border-radius: 18px 30px 18px 26px; }
.rc-s10FilmFrame--smallB{ border-radius: 26px 18px 30px 18px; }

.rc-s10ControlGrid{
  margin-top:14px;
  border-radius: var(--rc-radius-xl);
  border:1px solid rgba(237,241,255,.12);
  background: linear-gradient(135deg, rgba(20,51,31,.16), rgba(7,8,11,.48));
  box-shadow: var(--rc-shadow);
  padding: 14px;
  display:grid;
  grid-template-columns: .85fr 1fr .9fr;
  gap:14px;
  align-items:start;

  --rc-s10-bpm: 68;
  --rc-s10-beat: calc(60s / var(--rc-s10-bpm));
}

/* reuse your button styles (already exist from previous section 10) */
.rc-s10Btns{ display:grid; gap:10px; }

.rc-s10Metro{
  height: 240px;
  border-radius: 26px;
  border:1px solid rgba(237,241,255,.10);
  background:
    radial-gradient(240px 160px at 20% 30%, rgba(185,255,62,.12), transparent 70%),
    radial-gradient(260px 190px at 78% 55%, rgba(241,230,207,.10), transparent 72%),
    rgba(7,8,11,.22);
  position:relative;
  overflow:hidden;
}
.rc-s10Arc{
  position:absolute;
  inset: 26px 26px auto 26px;
  height: 132px;
  border-radius: 999px 999px 24px 24px;
  border:1px dashed rgba(241,230,207,.22);
  opacity:.9;
}
.rc-s10Needle{
  position:absolute;
  left:50%;
  top: 64px;
  width: 2px;
  height: 132px;
  background: linear-gradient(180deg, rgba(185,255,62,.95), rgba(241,230,207,.25));
  transform-origin: bottom center;
  animation: rcS10Swing2 var(--rc-s10-beat) ease-in-out infinite alternate;
}
@keyframes rcS10Swing2{
  0%{ transform: translateX(-50%) rotate(-28deg); }
  100%{ transform: translateX(-50%) rotate(28deg); }
}
.rc-s10BeatLamp{
  position:absolute;
  left: 14px;
  bottom: 14px;
  width:12px;height:12px;
  border-radius:99px;
  background: rgba(185,255,62,.20);
  border:1px solid rgba(237,241,255,.10);
  animation: rcS10Lamp2 var(--rc-s10-beat) ease-in-out infinite;
}
@keyframes rcS10Lamp2{
  0%{ transform: scale(.95); opacity:.45; box-shadow: 0 0 0 0 rgba(185,255,62,.0); }
  50%{ transform: scale(1.08); opacity:.95; box-shadow: 0 0 0 10px rgba(185,255,62,.10); }
  100%{ transform: scale(.95); opacity:.45; box-shadow: 0 0 0 0 rgba(185,255,62,.0); }
}

/* Responsive */
@media (max-width: 1020px){
  .rc-s8Stream::before{ display:none; }
  .rc-s8Entry{ grid-template-columns: 1fr; }
  .rc-s8Entry--even{ grid-template-columns: 1fr; }

  .rc-s9Canvas{
    grid-template-columns: 1fr;
    grid-template-rows: auto;
  }
  .rc-s9Compass{ grid-column:auto; grid-row:auto; }
  .rc-s9Pin--nw, .rc-s9Pin--ne, .rc-s9Pin--se{ grid-column:auto; grid-row:auto; }

  .rc-s10Film{ grid-template-columns: 1fr; }
  .rc-s10ControlGrid{ grid-template-columns: 1fr; }
}

@media (max-width: 560px){
  .rc-s9Chips{ grid-template-columns: 1fr; }
}
/* =========================
   FIX STYLES: Section 10 BPM buttons (override white defaults)
   ========================= */
.rc-s10Stage .rc-s10Btns{
  display:grid;
  gap:12px;
}

/* максимально специфично, чтобы перебить глобальные button-стили */
.rc-s10Stage button.rc-s10Btn{
  -webkit-appearance:none;
  appearance:none;
  width:100%;
  border:1px solid rgba(237,241,255,.14);
  background: linear-gradient(135deg, rgba(7,8,11,.72), rgba(74,31,77,.22));
  color: var(--rc-ink);
  border-radius: 18px;
  padding: 14px 14px;
  cursor:pointer;

  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;

  box-shadow: 0 14px 34px rgba(0,0,0,.22);
  position:relative;
  overflow:hidden;

  transition: transform .18s ease, border-color .18s ease, background .18s ease, box-shadow .18s ease;
}

/* лёгкая “скан-линия” */
.rc-s10Stage button.rc-s10Btn::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    repeating-linear-gradient(
      90deg,
      rgba(241,230,207,.06) 0px,
      rgba(241,230,207,.06) 1px,
      transparent 1px,
      transparent 10px
    );
  opacity:.20;
  pointer-events:none;
}

/* мягкое свечение справа */
.rc-s10Stage button.rc-s10Btn::after{
  content:"";
  position:absolute;
  right:-40px;
  top:-40px;
  width:140px;
  height:140px;
  background: radial-gradient(circle, rgba(185,255,62,.18), transparent 60%);
  opacity:.65;
  transform: rotate(12deg);
  pointer-events:none;
}

.rc-s10Stage button.rc-s10Btn:hover{
  transform: translateY(-2px);
  border-color: rgba(185,255,62,.30);
  background: linear-gradient(135deg, rgba(185,255,62,.10), rgba(7,8,11,.70));
  box-shadow: 0 18px 46px rgba(0,0,0,.28);
}

.rc-s10Stage button.rc-s10Btn:active{
  transform: translateY(0px);
}

.rc-s10Stage button.rc-s10Btn:focus-visible{
  outline: 2px solid rgba(185,255,62,.55);
  outline-offset: 3px;
}

/* active */
.rc-s10Stage button.rc-s10Btn.is-active{
  border-color: rgba(185,255,62,.58);
  background: linear-gradient(135deg, rgba(185,255,62,.14), rgba(74,31,77,.18), rgba(7,8,11,.72));
}

/* если у тебя внутри есть span'ы (как в моём HTML) */
.rc-s10Stage .rc-s10BtnK{
  font-family: var(--rc-font-mono);
  font-size:11px;
  letter-spacing:.9px;
  text-transform:uppercase;
  color: rgba(241,230,207,.86);
}

.rc-s10Stage .rc-s10BtnT{
  font-weight:700;
  letter-spacing:.2px;
}

/* если кнопка без span-структуры (просто текст) — тоже будет красиво */
.rc-s10Stage button.rc-s10Btn{
  font-size: 16px;
  line-height: 1.1;
}

/* mobile */
@media (max-width: 560px){
  .rc-s10Stage button.rc-s10Btn{
    padding: 13px 12px;
    border-radius: 16px;
  }
}
/* =========================
   SECTION 11: Orbit (4 corners + center)
   ========================= */
.rc-s11Grid{
  margin-top:16px;
  display:grid;
  grid-template-columns: 1fr 1.1fr 1fr;
  grid-template-rows: auto auto;
  gap:14px;
  align-items:stretch;
}
.rc-s11Pod{
  margin:0;
  border-radius: 26px;
  border:1px solid rgba(237,241,255,.12);
  background: rgba(7,8,11,.22);
  box-shadow: var(--rc-shadow);
  overflow:hidden;
  transition: transform .22s ease, border-color .22s ease, background .22s ease;
}
.rc-s11Pod:hover{
  transform: translateY(-3px) rotate(.12deg);
  border-color: rgba(185,255,62,.28);
  background: rgba(185,255,62,.05);
}
.rc-s11Pod img{ width:100%; max-width:350px; margin:0 auto; }
.rc-s11Cap{
  padding:10px 12px 12px;
  border-top:1px solid rgba(237,241,255,.10);
}
.rc-s11CapK{
  display:block;
  font-family: var(--rc-font-mono);
  font-size:11px;
  letter-spacing:.8px;
  text-transform:uppercase;
  color: rgba(241,230,207,.86);
}
.rc-s11CapT{
  display:block;
  margin-top:4px;
  color: var(--rc-dim);
  line-height:1.45;
}

.rc-s11Pod--nw{ grid-column:1; grid-row:1; border-radius: 30px 18px 26px 18px; }
.rc-s11Pod--ne{ grid-column:3; grid-row:1; border-radius: 18px 30px 18px 26px; }
.rc-s11Pod--sw{ grid-column:1; grid-row:2; border-radius: 26px 18px 30px 18px; }
.rc-s11Pod--se{ grid-column:3; grid-row:2; border-radius: 18px 26px 18px 30px; }

.rc-s11Core{
  grid-column:2;
  grid-row:1 / span 2;
  border-radius: var(--rc-radius-xl);
  border:1px solid rgba(237,241,255,.12);
  background: linear-gradient(135deg, rgba(74,31,77,.12), rgba(7,8,11,.50));
  box-shadow: var(--rc-shadow);
  padding:14px;
  position:relative;
  overflow:hidden;
}
.rc-s11Core::after{
  content:"";
  position:absolute;
  inset:-60px -60px auto -60px;
  height:170px;
  background: radial-gradient(closest-side, rgba(185,255,62,.14), transparent 70%);
  transform: rotate(-10deg);
  opacity:.85;
  pointer-events:none;
}
.rc-s11Dial{
  height: 180px;
  border-radius: 26px;
  border:1px solid rgba(237,241,255,.10);
  background:
    radial-gradient(closest-side, rgba(241,230,207,.10), transparent 70%),
    radial-gradient(260px 180px at 78% 55%, rgba(74,31,77,.18), transparent 72%),
    rgba(7,8,11,.22);
  position:relative;
  overflow:hidden;
}
.rc-s11Ring{
  position:absolute;
  inset: 18px;
  border-radius: 999px;
  border:1px solid rgba(241,230,207,.18);
  opacity:.9;
}
.rc-s11Ring:nth-child(2){
  inset: 44px;
  border-color: rgba(237,241,255,.10);
  opacity:.85;
}
.rc-s11Dot{
  position:absolute;
  width:10px;height:10px;
  border-radius:99px;
  background: rgba(185,255,62,.92);
  box-shadow: 0 0 0 8px rgba(185,255,62,.10);
  animation: rcS11Dot 2.8s ease-in-out infinite;
}
.rc-s11Dot--a{ left:22%; top:44%; }
.rc-s11Dot--b{ left:62%; top:30%; background: rgba(241,230,207,.82); box-shadow:0 0 0 8px rgba(241,230,207,.08); animation-delay:.22s; }
.rc-s11Dot--c{ left:72%; top:64%; background: rgba(74,31,77,.85); box-shadow:0 0 0 8px rgba(74,31,77,.10); animation-delay:.44s; }
@keyframes rcS11Dot{
  0%{ transform: translateY(0); opacity:.65; }
  50%{ transform: translateY(-6px); opacity:1; }
  100%{ transform: translateY(0); opacity:.65; }
}

.rc-s11CoreK{
  margin:12px 0 0;
  font-family: var(--rc-font-mono);
  font-size:12px;
  letter-spacing:.9px;
  text-transform:uppercase;
  color: rgba(241,230,207,.86);
  position:relative;
  z-index:1;
}
.rc-s11CoreT{
  margin:8px 0 0;
  color: var(--rc-dim);
  line-height:1.65;
  position:relative;
  z-index:1;
}
.rc-s11MiniRow{
  margin-top:12px;
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  position:relative;
  z-index:1;
}
.rc-s11Mini{
  font-family: var(--rc-font-mono);
  font-size:11px;
  letter-spacing:.9px;
  text-transform:uppercase;
  padding:8px 10px;
  border-radius:999px;
  border:1px dashed rgba(241,230,207,.22);
  background: rgba(241,230,207,.06);
  color: rgba(241,230,207,.86);
}

/* =========================
   SECTION 12: Bracket (center board + 2 stamps sides)
   ========================= */
.rc-s12Arena{
  margin-top:16px;
  display:grid;
  grid-template-columns: 350px 1fr 350px;
  gap:14px;
  align-items:start;
}
.rc-s12StampFig{
  margin:0;
  border-radius: 26px;
  border:1px solid rgba(237,241,255,.12);
  background: rgba(7,8,11,.22);
  box-shadow: var(--rc-shadow);
  overflow:hidden;
  transition: transform .22s ease, border-color .22s ease, background .22s ease;
}
.rc-s12StampFig:hover{
  transform: translateY(-3px);
  border-color: rgba(185,255,62,.28);
  background: rgba(185,255,62,.05);
}
.rc-s12StampFig img{ width:100%; max-width:350px; margin:0 auto; }
.rc-s12StampCap{
  padding:10px 12px 12px;
  border-top:1px solid rgba(237,241,255,.10);
}
.rc-s12StampK{
  display:block;
  font-family: var(--rc-font-mono);
  font-size:11px;
  letter-spacing:.8px;
  text-transform:uppercase;
  color: rgba(241,230,207,.86);
}
.rc-s12StampT{
  display:block;
  margin-top:4px;
  color: var(--rc-dim);
  line-height:1.45;
}

.rc-s12BracketBoard{
  list-style:none;
  margin:0;
  padding:14px;
  border-radius: var(--rc-radius-xl);
  border:1px solid rgba(237,241,255,.12);
  background: linear-gradient(135deg, rgba(20,51,31,.14), rgba(7,8,11,.50));
  box-shadow: var(--rc-shadow);
  position:relative;
  overflow:hidden;
  display:grid;
  grid-template-columns: 1fr;
  gap:12px;
}
.rc-s12BracketBoard::before{
  content:"";
  position:absolute;
  inset: -60px -60px auto -60px;
  height: 160px;
  background: radial-gradient(closest-side, rgba(74,31,77,.18), transparent 70%);
  transform: rotate(-12deg);
  opacity:.85;
  pointer-events:none;
}

.rc-s12Match{
  border-radius: 22px;
  border:1px solid rgba(237,241,255,.12);
  background: rgba(7,8,11,.22);
  padding:12px;
  position:relative;
  z-index:1;
  transition: transform .2s ease, border-color .2s ease, background .2s ease;
}
.rc-s12Match:hover{
  transform: translateY(-2px);
  border-color: rgba(241,230,207,.26);
  background: rgba(241,230,207,.05);
}
.rc-s12MatchK{
  margin:0 0 10px;
  font-family: var(--rc-font-mono);
  font-size:11px;
  letter-spacing:.9px;
  text-transform:uppercase;
  color: rgba(241,230,207,.86);
}
.rc-s12TeamRow{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:8px 10px;
  border-radius: 16px;
  border:1px solid rgba(237,241,255,.10);
  background: rgba(7,8,11,.18);
}
.rc-s12Team{ font-weight:600; letter-spacing:.12px; }
.rc-s12Score{
  font-family: var(--rc-font-mono);
  font-size:12px;
  letter-spacing:.8px;
  color: rgba(185,255,62,.82);
}

.rc-s12Final{
  border-radius: 22px;
  border:1px dashed rgba(241,230,207,.22);
  background: rgba(241,230,207,.06);
  padding:12px;
  position:relative;
  z-index:1;
}
.rc-s12FinalK{
  margin:0;
  font-family: var(--rc-font-mono);
  font-size:11px;
  letter-spacing:.9px;
  text-transform:uppercase;
  color: rgba(241,230,207,.86);
}
.rc-s12FinalT{
  margin:8px 0 12px;
  color: var(--rc-dim);
  line-height:1.6;
}
.rc-s12FinalLine{
  height: 2px;
  border-radius: 99px;
  background: linear-gradient(90deg, transparent, rgba(185,255,62,.55), rgba(241,230,207,.25), rgba(74,31,77,.45), transparent);
  opacity:.85;
  animation: rcS12Line 3.6s ease-in-out infinite;
}
@keyframes rcS12Line{
  0%{ transform: translateX(-10px); opacity:.55; }
  50%{ transform: translateX(10px); opacity:1; }
  100%{ transform: translateX(-10px); opacity:.55; }
}

/* =========================
   SECTION 13: Wave Shelf (wave + rail with different heights)
   ========================= */
.rc-s13Shelf{
  margin-top:16px;
  border-radius: var(--rc-radius-xl);
  border:1px solid rgba(237,241,255,.12);
  background: rgba(7,8,11,.22);
  box-shadow: var(--rc-shadow);
  padding:14px;
  position:relative;
  overflow:hidden;
}
.rc-s13Wave{
  height: 78px;
  border-radius: 22px;
  border:1px solid rgba(237,241,255,.10);
  background: rgba(7,8,11,.18);
  position:relative;
  overflow:hidden;
}
.rc-s13WaveLine{
  position:absolute;
  left:-20%;
  right:-20%;
  top: 40px;
  height: 2px;
  background: linear-gradient(90deg, transparent, rgba(185,255,62,.55), rgba(241,230,207,.25), rgba(74,31,77,.45), transparent);
  transform: rotate(-3deg);
  animation: rcS13Drift 6s ease-in-out infinite;
}
.rc-s13WaveGlow{
  position:absolute;
  inset:-60px -60px auto -60px;
  height:160px;
  background: radial-gradient(closest-side, rgba(185,255,62,.14), transparent 70%);
  transform: rotate(-10deg);
  opacity:.8;
}
@keyframes rcS13Drift{
  0%{ transform: translateY(0) rotate(-3deg); opacity:.55; }
  50%{ transform: translateY(8px) rotate(-2deg); opacity:1; }
  100%{ transform: translateY(0) rotate(-3deg); opacity:.55; }
}

.rc-s13Rail{
  list-style:none;
  margin: 14px 0 0;
  padding: 0;
  display:grid;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  gap:12px;
  align-items:stretch;
}
.rc-s13Item{ display:flex; }
.rc-s13Item--up{ transform: translateY(-10px); }
.rc-s13Item--down{ transform: translateY(12px); }
.rc-s13Item--mid{ transform: translateY(0); }
.rc-s13Item--mid2{ transform: translateY(6px); }

.rc-s13Frame{
  margin:0;
  width:100%;
  border-radius: 24px;
  border:1px solid rgba(237,241,255,.12);
  background: rgba(7,8,11,.20);
  overflow:hidden;
  transition: transform .22s ease, border-color .22s ease, background .22s ease;
}
.rc-s13Frame:hover{
  transform: translateY(-3px);
  border-color: rgba(185,255,62,.28);
  background: rgba(185,255,62,.05);
}
.rc-s13Frame img{ width:100%; max-width:350px; margin:0 auto; }
.rc-s13Cap{
  padding:10px 12px 12px;
  border-top:1px solid rgba(237,241,255,.10);
}
.rc-s13CapK{
  display:block;
  font-family: var(--rc-font-mono);
  font-size:11px;
  letter-spacing:.8px;
  text-transform:uppercase;
  color: rgba(241,230,207,.86);
}
.rc-s13CapT{
  display:block;
  margin-top:4px;
  color: var(--rc-dim);
  line-height:1.45;
}

.rc-s13NoteCard{
  width:100%;
  border-radius: 24px;
  border:1px dashed rgba(241,230,207,.22);
  background: rgba(241,230,207,.06);
  padding: 12px 12px;
}
.rc-s13NoteK{
  margin:0;
  font-family: var(--rc-font-mono);
  font-size:11px;
  letter-spacing:.9px;
  text-transform:uppercase;
  color: rgba(241,230,207,.86);
}
.rc-s13NoteT{
  margin:8px 0 10px;
  color: var(--rc-dim);
  line-height:1.6;
}
.rc-s13NoteM{
  margin:0;
  font-family: var(--rc-font-mono);
  font-size:11px;
  letter-spacing:.8px;
  text-transform:uppercase;
  color: rgba(185,255,62,.82);
}

.rc-s13Footer{
  margin-top: 14px;
  padding-top: 12px;
  border-top:1px solid rgba(237,241,255,.10);
}
.rc-s13FooterK{
  margin:0;
  font-family: var(--rc-font-mono);
  font-size:11px;
  letter-spacing:.9px;
  text-transform:uppercase;
  color: rgba(241,230,207,.86);
}
.rc-s13FooterT{
  margin:8px 0 0;
  color: var(--rc-dim);
  line-height:1.6;
}

/* Responsive */
@media (max-width: 1020px){
  .rc-s11Grid{
    grid-template-columns: 1fr;
    grid-template-rows: auto;
  }
  .rc-s11Core{ grid-column:auto; grid-row:auto; }
  .rc-s11Pod--nw, .rc-s11Pod--ne, .rc-s11Pod--sw, .rc-s11Pod--se{ grid-column:auto; grid-row:auto; }

  .rc-s12Arena{ grid-template-columns: 1fr; }

  .rc-s13Rail{ grid-template-columns: 1fr; }
  .rc-s13Item--up, .rc-s13Item--down, .rc-s13Item--mid2{ transform:none; }
}

@media (max-width: 560px){
  .rc-s12BracketBoard{ padding:12px; }
  .rc-s12TeamRow{ padding:8px 8px; }
}
/* =========================
   SECTION 14: Ledger (2 corners + center page)
   ========================= */
.rc-s14Board{
  margin-top:16px;
  display:grid;
  grid-template-columns: 350px 1fr 350px;
  gap:14px;
  align-items:stretch;
}

.rc-s14Corner{
  margin:0;
  border-radius: 26px;
  border:1px solid rgba(237,241,255,.12);
  background: rgba(7,8,11,.22);
  box-shadow: var(--rc-shadow);
  overflow:hidden;
  transition: transform .22s ease, border-color .22s ease, background .22s ease;
}
.rc-s14Corner:hover{
  transform: translateY(-3px) rotate(.12deg);
  border-color: rgba(185,255,62,.28);
  background: rgba(185,255,62,.05);
}
.rc-s14Corner img{ width:100%; max-width:350px; margin:0 auto; }
.rc-s14Corner--a{ border-radius: 30px 18px 26px 18px; animation: rcS14Float 4.6s ease-in-out infinite; }
.rc-s14Corner--b{ border-radius: 18px 30px 18px 26px; animation: rcS14Float 5.2s ease-in-out infinite; animation-delay:.25s; }

@keyframes rcS14Float{
  0%{ transform: translateY(0); }
  50%{ transform: translateY(-6px); }
  100%{ transform: translateY(0); }
}

.rc-s14Cap{
  padding:10px 12px 12px;
  border-top:1px solid rgba(237,241,255,.10);
}
.rc-s14CapK{
  display:block;
  font-family: var(--rc-font-mono);
  font-size:11px;
  letter-spacing:.8px;
  text-transform:uppercase;
  color: rgba(241,230,207,.86);
}
.rc-s14CapT{
  display:block;
  margin-top:4px;
  color: var(--rc-dim);
  line-height:1.45;
}

.rc-s14LedgerPanel{
  border-radius: var(--rc-radius-xl);
  border:1px solid rgba(237,241,255,.12);
  background: linear-gradient(135deg, rgba(241,230,207,.06), rgba(7,8,11,.48));
  box-shadow: var(--rc-shadow);
  padding:14px;
  position:relative;
  overflow:hidden;
}
.rc-s14LedgerPanel::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    repeating-linear-gradient(
      0deg,
      rgba(237,241,255,.05) 0px,
      rgba(237,241,255,.05) 1px,
      transparent 1px,
      transparent 26px
    );
  opacity:.35;
  pointer-events:none;
}
.rc-s14LedgerPanel::after{
  content:"";
  position:absolute;
  right:-60px;
  top:-60px;
  width:180px;
  height:180px;
  background: radial-gradient(circle, rgba(185,255,62,.14), transparent 60%);
  opacity:.8;
  pointer-events:none;
}

.rc-s14LedgerHead{ position:relative; z-index:1; }
.rc-s14LedgerK{
  margin:0;
  font-family: var(--rc-font-mono);
  font-size:12px;
  letter-spacing:.9px;
  text-transform:uppercase;
  color: rgba(241,230,207,.86);
}
.rc-s14LedgerT{
  margin:8px 0 0;
  color: var(--rc-dim);
  line-height:1.6;
}

.rc-s14Dl{
  position:relative;
  z-index:1;
  margin:12px 0 0;
  padding:0;
  border-top:1px solid rgba(237,241,255,.10);
}
.rc-s14Row{
  display:grid;
  grid-template-columns: 120px 1fr;
  gap:12px;
  padding:10px 0;
  border-bottom:1px solid rgba(237,241,255,.08);
}
.rc-s14Dt{
  font-family: var(--rc-font-mono);
  font-size:11px;
  letter-spacing:.9px;
  text-transform:uppercase;
  color: rgba(241,230,207,.86);
}
.rc-s14Dd{
  margin:0;
  color: var(--rc-dim);
  line-height:1.6;
}

.rc-s14Metrics{
  position:relative;
  z-index:1;
  margin-top:12px;
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap:10px;
}
.rc-s14Metric{
  border-radius: 18px;
  border:1px solid rgba(237,241,255,.12);
  background: rgba(7,8,11,.20);
  padding:10px 12px;
  transition: transform .2s ease, border-color .2s ease, background .2s ease;
}
.rc-s14Metric:hover{
  transform: translateY(-2px);
  border-color: rgba(241,230,207,.26);
  background: rgba(241,230,207,.05);
}
.rc-s14MetricK{
  margin:0;
  font-family: var(--rc-font-mono);
  font-size:11px;
  letter-spacing:.8px;
  text-transform:uppercase;
  color: rgba(241,230,207,.86);
}
.rc-s14MetricV{
  margin:6px 0 0;
  font-weight:700;
  letter-spacing:.2px;
  color: rgba(185,255,62,.82);
}
.rc-s14Foot{
  position:relative;
  z-index:1;
  margin:12px 0 0;
  padding-top:12px;
  border-top:1px solid rgba(237,241,255,.10);
  color: var(--rc-dim);
  line-height:1.6;
}

/* =========================
   SECTION 15: Passport ticket (perforation + seal)
   ========================= */
.rc-s15Wrap{
  margin-top:16px;
  display:grid;
  grid-template-columns: 1.25fr .75fr;
  gap:14px;
  align-items:start;
}

.rc-s15Ticket{
  border-radius: var(--rc-radius-xl);
  border:1px solid rgba(237,241,255,.12);
  background: linear-gradient(135deg, rgba(74,31,77,.12), rgba(7,8,11,.50));
  box-shadow: var(--rc-shadow);
  padding:14px;
  position:relative;
  overflow:hidden;
}
.rc-s15Ticket::before{
  content:"";
  position:absolute;
  top: 0;
  bottom: 0;
  left: 10px;
  width: 10px;
  background:
    radial-gradient(circle at 50% 10px, transparent 8px, rgba(7,8,11,.0) 9px) 0 0/10px 28px;
  opacity:.9;
  pointer-events:none;
}
.rc-s15Ticket::after{
  content:"";
  position:absolute;
  top: 0;
  bottom: 0;
  right: 10px;
  width: 10px;
  background:
    radial-gradient(circle at 50% 10px, transparent 8px, rgba(7,8,11,.0) 9px) 0 0/10px 28px;
  opacity:.9;
  pointer-events:none;
}

.rc-s15TicketTop{
  padding:2px 2px 10px;
  border-bottom:1px solid rgba(237,241,255,.10);
}
.rc-s15TicketK{
  margin:0;
  font-family: var(--rc-font-mono);
  font-size:12px;
  letter-spacing:.9px;
  text-transform:uppercase;
  color: rgba(241,230,207,.86);
}
.rc-s15TicketT{
  margin:8px 0 0;
  color: var(--rc-dim);
  line-height:1.6;
}

.rc-s15Seal{
  margin:12px 0 0;
  border-radius: 26px;
  border:1px solid rgba(237,241,255,.12);
  background: rgba(7,8,11,.22);
  overflow:hidden;
  transition: transform .22s ease, border-color .22s ease, background .22s ease;
}
.rc-s15Seal:hover{
  transform: translateY(-3px);
  border-color: rgba(185,255,62,.28);
  background: rgba(185,255,62,.05);
}
.rc-s15Seal img{ width:100%; max-width:350px; margin:0 auto; }
.rc-s15SealCap{
  padding:10px 12px 12px;
  border-top:1px solid rgba(237,241,255,.10);
}
.rc-s15SealK{
  display:block;
  font-family: var(--rc-font-mono);
  font-size:11px;
  letter-spacing:.8px;
  text-transform:uppercase;
  color: rgba(241,230,207,.86);
}
.rc-s15SealT{
  display:block;
  margin-top:4px;
  color: var(--rc-dim);
  line-height:1.45;
}

.rc-s15Steps{
  list-style:none;
  margin:12px 0 0;
  padding:0;
  display:grid;
  gap:10px;
}
.rc-s15Step{
  border-radius: 20px;
  border:1px solid rgba(237,241,255,.12);
  background: rgba(7,8,11,.22);
  padding:12px;
  transition: transform .2s ease, border-color .2s ease, background .2s ease;
}
.rc-s15Step:hover{
  transform: translateY(-2px);
  border-color: rgba(241,230,207,.26);
  background: rgba(241,230,207,.05);
}
.rc-s15StepK{
  margin:0;
  font-family: var(--rc-font-mono);
  font-size:11px;
  letter-spacing:.9px;
  text-transform:uppercase;
  color: rgba(241,230,207,.86);
}
.rc-s15StepT{
  margin:8px 0 6px;
  color: var(--rc-dim);
  line-height:1.6;
}
.rc-s15StepM{
  margin:0;
  font-family: var(--rc-font-mono);
  font-size:11px;
  letter-spacing:.8px;
  text-transform:uppercase;
  color: rgba(185,255,62,.82);
}

.rc-s15Fine{
  margin:12px 0 0;
  padding-top:12px;
  border-top:1px solid rgba(237,241,255,.10);
  color: var(--rc-dim);
  line-height:1.6;
}

.rc-s15Side{
  border-radius: var(--rc-radius-xl);
  border:1px dashed rgba(241,230,207,.22);
  background: rgba(241,230,207,.06);
  padding:14px;
}
.rc-s15SideK{
  margin:0;
  font-family: var(--rc-font-mono);
  font-size:11px;
  letter-spacing:.9px;
  text-transform:uppercase;
  color: rgba(241,230,207,.86);
}
.rc-s15SideT{
  margin:8px 0 0;
  color: var(--rc-dim);
  line-height:1.6;
}
.rc-s15SidePills{
  margin-top:12px;
  display:flex;
  gap:8px;
  flex-wrap:wrap;
}
.rc-s15Pill{
  font-family: var(--rc-font-mono);
  font-size:11px;
  letter-spacing:.9px;
  text-transform:uppercase;
  padding:8px 10px;
  border-radius:999px;
  border:1px solid rgba(237,241,255,.12);
  background: rgba(7,8,11,.18);
  color: rgba(185,255,62,.82);
}

/* =========================
   SECTION 16: Gate (badge + action tiles + pledge)
   ========================= */
.rc-s16Layout{
  margin-top:16px;
  display:grid;
  grid-template-columns: 350px 1fr;
  gap:14px;
  align-items:stretch;
}

.rc-s16Badge{
  margin:0;
  border-radius: 30px;
  border:1px solid rgba(237,241,255,.12);
  background: rgba(7,8,11,.22);
  box-shadow: var(--rc-shadow);
  overflow:hidden;
  transition: transform .22s ease, border-color .22s ease, background .22s ease;
}
.rc-s16Badge:hover{
  transform: translateY(-3px);
  border-color: rgba(185,255,62,.28);
  background: rgba(185,255,62,.05);
}
.rc-s16Badge img{ width:100%; max-width:350px; margin:0 auto; }
.rc-s16Cap{
  padding:10px 12px 12px;
  border-top:1px solid rgba(237,241,255,.10);
}
.rc-s16CapK{
  display:block;
  font-family: var(--rc-font-mono);
  font-size:11px;
  letter-spacing:.8px;
  text-transform:uppercase;
  color: rgba(241,230,207,.86);
}
.rc-s16CapT{
  display:block;
  margin-top:4px;
  color: var(--rc-dim);
  line-height:1.45;
}

.rc-s16Actions{
  border-radius: var(--rc-radius-xl);
  border:1px solid rgba(237,241,255,.12);
  background: linear-gradient(135deg, rgba(20,51,31,.14), rgba(7,8,11,.50));
  box-shadow: var(--rc-shadow);
  padding:14px;
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap:12px;
  align-items:stretch;
  position:relative;
  overflow:hidden;
}
.rc-s16Actions::after{
  content:"";
  position:absolute;
  inset:-60px -60px auto -60px;
  height:160px;
  background: radial-gradient(closest-side, rgba(74,31,77,.18), transparent 70%);
  transform: rotate(-10deg);
  opacity:.85;
  pointer-events:none;
}

.rc-s16Link{
  position:relative;
  z-index:1;
  text-decoration:none;
  border-radius: 22px;
  border:1px solid rgba(237,241,255,.12);
  background: rgba(7,8,11,.22);
  padding:12px;
  color: var(--rc-ink);
  transition: transform .2s ease, border-color .2s ease, background .2s ease, box-shadow .2s ease;
  overflow:hidden;
}
.rc-s16Link::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(120px 120px at 20% 20%, rgba(185,255,62,.12), transparent 60%),
    radial-gradient(140px 140px at 80% 40%, rgba(241,230,207,.10), transparent 65%);
  opacity:.9;
  pointer-events:none;
}
.rc-s16Link:hover{
  transform: translateY(-2px);
  border-color: rgba(185,255,62,.30);
  background: rgba(185,255,62,.05);
  box-shadow: 0 18px 46px rgba(0,0,0,.26);
}
.rc-s16LinkK{
  display:block;
  font-family: var(--rc-font-mono);
  font-size:11px;
  letter-spacing:.9px;
  text-transform:uppercase;
  color: rgba(241,230,207,.86);
}
.rc-s16LinkT{
  display:block;
  margin-top:6px;
  color: var(--rc-dim);
  line-height:1.55;
}

.rc-s16Link--a::before{ opacity:.95; }
.rc-s16Link--b::before{ opacity:.80; }
.rc-s16Link--c::before{ opacity:.70; }

.rc-s16Pledge{
  grid-column: 1 / -1;
  position:relative;
  z-index:1;
  border-radius: 22px;
  border:1px dashed rgba(241,230,207,.22);
  background: rgba(241,230,207,.06);
  padding:12px 14px;
}
.rc-s16PledgeK{
  margin:0;
  font-family: var(--rc-font-mono);
  font-size:11px;
  letter-spacing:.9px;
  text-transform:uppercase;
  color: rgba(241,230,207,.86);
}
.rc-s16PledgeT{
  margin:8px 0 0;
  color: var(--rc-dim);
  line-height:1.6;
}

/* Responsive */
@media (max-width: 1020px){
  .rc-s14Board{ grid-template-columns: 1fr; }
  .rc-s15Wrap{ grid-template-columns: 1fr; }
  .rc-s16Layout{ grid-template-columns: 1fr; }
  .rc-s16Actions{ grid-template-columns: 1fr; }
}

@media (max-width: 560px){
  .rc-s14Row{ grid-template-columns: 1fr; }
  .rc-s14Metrics{ grid-template-columns: 1fr; }
}
/* =========================
   S6 Replay Mosaic — mobile fix
   ========================= */

/* Tablet: убрать “узкие башни”, дать больше воздуха */
@media (max-width: 980px){
  .rc-s6Grid{
    display:grid;
    grid-template-columns: 1fr;
    gap: 16px;
  }

  .rc-s6Text{
    order: 0;
  }

  .rc-s6Mosaic{
    order: 1;
  }
}

/* Mobile: перестраиваем мозаику без tall-колонок */
@media (max-width: 560px){
  .rc-s6Grid{
    display:grid;
    grid-template-columns: 1fr;
    gap: 14px;
  }

  .rc-s6Text{
    border-radius: 22px;
    padding: 12px;
    border: 1px solid rgba(237,241,255,.12);
    background: rgba(255,255,255,.06);
  }

  .rc-s6Rules{
    margin: 0;
    padding-left: 18px;
    line-height: 1.7;
  }

  .rc-s6Note{
    margin: 10px 0 0;
    line-height: 1.7;
  }

  /* Главное: мозаика становится 2 колонки, без экстремальных высот */
  .rc-s6Mosaic{
    display:grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
    align-items: stretch;
  }

  /* Сбрасываем возможные фиксированные высоты/минимумы из desktop-стилей */
  .rc-s6Tile{
    height: auto !important;
    min-height: 0 !important;
    border-radius: 22px;
    overflow: hidden;
  }

  /* Картинка занимает “верх” карточки, без обрезаний текста */
  .rc-s6Tile img{
    width: 100%;
    height: auto;
    max-width: 350px;
    display:block;
  }

  /* Подписи компактнее и читабельнее */
  .rc-s6Cap{
    padding: 10px 12px 12px;
  }
  .rc-s6CapK{
    font-size: 11px;
    letter-spacing: .9px;
  }
  .rc-s6CapT{
    font-size: 14px;
    line-height: 1.5;
    word-break: normal;
    hyphens: auto;
  }

  /* Перекомпоновка спанов под мобильный ритм */
  .rc-s6Tile--tall{
    grid-column: 1 / -1;         /* первая карточка во всю ширину */
  }
  .rc-s6Tile--wide{
    grid-column: 1 / -1;         /* wide тоже во всю ширину */
  }
  .rc-s6Tile--square,
  .rc-s6Tile--square2{
    grid-column: auto;           /* две последние — в 2 колонки */
  }

  /* Если у тебя в desktop задан crop через object-fit — на мобиле делаем мягче */
  .rc-s6Tile--tall img,
  .rc-s6Tile--wide img,
  .rc-s6Tile--square img,
  .rc-s6Tile--square2 img{
    object-fit: cover;
  }

  /* Контроль "карточного" вида, чтобы не было слишком длинных “пилюль” */
  .rc-s6Tile--tall img{ aspect-ratio: 16 / 9; }
  .rc-s6Tile--wide img{ aspect-ratio: 16 / 9; }
  .rc-s6Tile--square img,
  .rc-s6Tile--square2 img{ aspect-ratio: 1 / 1; }
}

/* Очень маленькие экраны: 1 колонка */
@media (max-width: 380px){
  .rc-s6Mosaic{
    grid-template-columns: 1fr;
  }

  .rc-s6Tile--square,
  .rc-s6Tile--square2{
    grid-column: 1 / -1;
  }
}
