/*
File Name: 		custom.css
Description:  Custom overrides
*/

/* Standings table: horizontal scroll wrapper (replaces old tbody display:block approach) */
.standings-scroll-wrapper {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  width: 100%;
  max-width: 860px;
  margin: 0 auto;
  padding-bottom: 80px; /* space for nav/logo at bottom */
}

/* History table: sticky thead, normal flow */
.standings-table--full thead th {
  position: sticky;
  top: 0;
  z-index: 10;
  background: rgba(21, 23, 32, 0.92);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  padding-top: 20px !important;
  padding-bottom: 20px !important;
}

/* Hide scrollbar but keep scrolling */
::-webkit-scrollbar {
  display: none;
}
* {
  -ms-overflow-style: none;
  scrollbar-width: none;
}

/* Page heading top spacing removed */

/* Mobile Menu Overlay */
.mobile-menu-overlay {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  width: 100vw !important;
  height: 100vh !important;
  background-color: #151720 !important;
  z-index: 999999 !important;
  overflow-y: auto !important;
  padding: 80px 24px 24px !important;
  box-sizing: border-box !important;
  display: block !important;
}

.mobile-menu-overlay a {
  display: block;
  padding: 16px 0;
  color: #fff;
  font-size: 1.25rem;
  font-family: 'Rajdhani', sans-serif;
  font-weight: 600;
  text-transform: uppercase;
  text-decoration: none;
}

.mobile-menu-overlay a:hover,
.mobile-menu-overlay a.active {
  color: #048ac5;
}

.mobile-menu-overlay .close-btn {
  position: absolute;
  top: 20px;
  right: 24px;
  font-size: 2rem;
  color: #fff;
  cursor: pointer;
  z-index: 1000000;
}

.mobile-menu-overlay li {
  list-style: none;
  border-bottom: 1px solid rgba(255,255,255,0.1);
}

/* Darken news thumbnails for readability */
.blog-layout--style-4 .post__thumbnail {
  position: relative;
}
.blog-layout--style-4 .post__thumbnail::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(to bottom, rgba(0,0,0,0.7) 0%, rgba(0,0,0,0.4) 40%, rgba(0,0,0,0.75) 100%);
  pointer-events: none;
}

.blog-layout--style-4 .post__meta-item--date {
  color: #ffcc00 !important;
}

/* Fix pages overflowing on mobile */
@media (max-width: 991.98px) {
  .site-content,
  .site-content__inner,
  .container--large,
  .container {
    max-width: 100vw !important;
    /* overflow-x: hidden REMOVED — breaks standings horizontal scroll */
  }

  .page-heading__title {
    font-size: 1.5rem !important;
    word-wrap: break-word;
  }

  .team-item {
    margin-bottom: 1rem;
  }

  body {
    /* clip (not hidden) — clips page overflow without creating a scroll container,
       so child overflow-x:auto elements can still scroll horizontally */
    overflow-x: clip !important;
  }
}

/* Mobile: fix /news page - slider fullscreen + vertical scroll to news */
@media (max-width: 991.98px) {
  body.site-layout--horizontal {
    overflow-y: auto !important;
    overflow-x: hidden !important;
  }

  body.site-layout--horizontal .site-wrapper {
    display: block !important;
    max-height: none !important;
    overflow: visible !important;
  }

  body.site-layout--horizontal .site-content {
    display: block !important;
    overflow: visible !important;
    max-height: none !important;
    height: auto !important;
  }

  .widger-area--before-loop {
    width: 100vw !important;
    min-height: 100vh;
    height: auto !important;
    overflow: visible;
  }

  .widget-events-timeline {
    width: 100vw;
    background: rgba(0,0,0,0.5);
    padding: 0.5rem 1rem 1.5rem;
    box-sizing: border-box;
  }

  .widger-area--before-loop .widget-carousel__item.player {
    width: 100vw !important;
    min-height: 100vh;
    box-sizing: border-box;
  }

  .content.blog-layout--style-4 {
    width: 100vw !important;
    padding: 1rem;
    box-sizing: border-box;
  }

  .content.blog-layout--style-1 {
    width: 100vw !important;
    padding: 1rem;
    box-sizing: border-box;
  }
}

/* Team info page: prevent long position names from overlapping player photo */
.team-info-page .player-info-title.h1 {
  font-size: 2.5rem;
}
@media (min-width: 768px) {
  .team-info-page .player-info-title.h1 {
    font-size: 3.5rem;
  }
}
@media (min-width: 992px) {
  .team-info-page .player-info-title.h1 {
    font-size: 4rem;
  }
}
@media (min-width: 1200px) {
  .team-info-page .player-info-title.h1 {
    font-size: 5rem;
  }
}
@media (min-width: 1920px) {
  .team-info-page .player-info-title.h1 {
    font-size: 6rem;
  }
  .page-heading__title {
    font-size: 7.2rem !important;
  }
}

/* Allow scrolling on pages with lots of content (e.g. staff 2+ rows) */
.site-layout--horizontal .site-wrapper {
  overflow-y: auto !important;
}
.site-content--center {
  padding-bottom: 200px;
  padding-top: 40px;
}
.site-content--center .page-heading--default {
  margin-bottom: 24px;
}

/* Fit team logos inside the diamond border */
.match-team-logo {
  aspect-ratio: 1 / 1;
}
.match-team-logo img {
  width: 60% !important;
  position: absolute !important;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 1;
}

/* Disable match hover effect for non-hoverable cards */
.match-score:not(.match-score--hoverable):hover .match-score__body {
  opacity: 1 !important;
  transform: none !important;
  transition-delay: 0ms !important;
}
.match-score:not(.match-score--hoverable):hover .match-score__logo {
  opacity: 0 !important;
  transform: none !important;
}
.match-score:not(.match-score--hoverable):hover .match-score__footer {
  opacity: 0 !important;
  transform: none !important;
}

/* Hoverable match cards — вертикальный левый nav как в шаблоне */
.match-score--hoverable {
  position: relative;
  overflow: visible;
}

/* Вертикальный сайдбар слева — скрыт по умолчанию */
.match-score--hoverable .match-stats-links {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 0;
  list-style: none;
  margin: 0;
  padding: 6px 10px;
  opacity: 0;
  transition: opacity 0.2s ease;
  pointer-events: none;
  z-index: 20;
  background: rgba(10,20,40,0.88);
  border-radius: 8px;
  white-space: nowrap;
}

/* Появляется при hover */
.match-score--hoverable:hover .match-stats-links {
  opacity: 1;
  pointer-events: auto;
}

/* Каждая иконка — кружок, li горизонтальный flex чтобы ::after шёл справа */
.match-score--hoverable .match-stats-links li {
  position: relative;
  display: flex;
  align-items: center;
}

/* Пунктирная линия между иконками (горизонтальная) */
.match-score--hoverable .match-stats-links li:not(:last-child)::after {
  content: '';
  display: block;
  width: 20px;
  height: 1px;
  border-top: 1px dashed rgba(255,255,255,0.35);
  flex-shrink: 0;
}

.match-stats-links li a,
.match-stats-links li button {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  border: 1px solid rgba(255,255,255,0.2);
  background: rgba(10,20,40,0.85);
  color: rgba(255,255,255,0.55);
  transition: border-color 0.2s, color 0.2s, background 0.2s;
  text-decoration: none;
  cursor: pointer;
  padding: 0;
}

.match-stats-links li a svg,
.match-stats-links li button svg {
  width: 16px;
  height: 16px;
  fill: currentColor;
}

.match-stats-links li a:hover,
.match-stats-links li button:hover,
.match-stats-links li button.active {
  border-color: #048ac5;
  background: #048ac5;
  color: #fff;
}

/* News thumbnails: fill card width, crop overflow */
  display: block;
}

/* News thumbnails: fill entire card, crop overflow */
.blog-layout--style-4 .post {
  position: relative;
  overflow: hidden;
}
.blog-layout--style-4 .post__thumbnail {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 0;
}
.blog-layout--style-4 .post__thumbnail a {
  display: block;
  width: 100%;
  height: 100%;
}
.blog-layout--style-4 .post__thumbnail img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.blog-layout--style-4 .post__body {
  position: relative;
  z-index: 1;
}

/* Remove mobile margin from landing social menu items */
@media (max-width: 767.98px) {
  .social-menu--landing li {
    margin: 1rem 0 !important;
  }
}

/* CRITICAL FIX: Header renders as React Fragment (header + SearchPanel), so
   the adjacent sibling selector `.site-header--bottom + .site-content` in the
   template CSS never matches (SearchPanel sits between them in the DOM).
   Result: padding-bottom = 0, fixed bottom header covers the last line of content.
   Fix: use ~ (general sibling) to apply correct padding regardless of siblings. */
.site-header--bottom ~ .site-content {
  padding-bottom: 72px; /* = $header-height-desktop-mobile */
}
@media (min-width: 1536px) {
  .site-header--bottom ~ .site-content {
    padding-bottom: 100px; /* = $header-height-desktop */
  }
}

/* Desktop: horizontal news layout — with padding-bottom now applied, use
   border-box so height: 100vh includes the padding, keeping grid rows within
   the visible area (grid rows = 50% of 100vh-72px instead of 50vh). */
@media (min-width: 992px) {
  body.site-layout--horizontal .site-content {
    box-sizing: border-box;
  }
}

/* ── Players page: slick-dots всегда в пределах вьюпорта (без медиа-запроса) ── */
.team-info-page .team-carousel__content > .slick-dots {
  left: clamp(-98px, calc(16px - (100vw - 1140px) / 2), -8px);
}

/* ── Players page: синезолотые декоративные линии (Динамо Ставрополь) ──
   Используем .team-info-page .team-player__inner .ncr-page-decor .ncr-page-decor__layerX
   (specificity 0-4-0) — перекрывает одноимённые rules из style.css, т.к. идёт позже. ── */

/* Layer 1 — тёмная полоса (тёмный синий → почти чёрно-синий) */
.team-info-page .team-player__inner .ncr-page-decor .ncr-page-decor__layer-1 {
  background-color: #002b5c;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#1a4e8a), to(#000e2e));
  background-image: linear-gradient(#1a4e8a, #000e2e);
}
/* Layer 2 — средняя полоса (яркий синий → тёмно-синий) */
.team-info-page .team-player__inner .ncr-page-decor .ncr-page-decor__layer-2 {
  background-color: #0264a0;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#0a8fd4), to(#003d72));
  background-image: linear-gradient(#0a8fd4, #003d72);
}
/* Layer 2::after — золотая акцентная линия */
.team-info-page .team-player__inner .ncr-page-decor .ncr-page-decor__layer-2::after {
  background-color: #e8b84b;
}
/* Layer 3 — передняя полоса (голубой → синий) */
.team-info-page .team-player__inner .ncr-page-decor .ncr-page-decor__layer-3 {
  background-color: #048ac5;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#3db5e8), to(#005f9e));
  background-image: linear-gradient(#3db5e8, #005f9e);
}
/* Layer 3::after — золотая акцентная линия */
.team-info-page .team-player__inner .ncr-page-decor .ncr-page-decor__layer-3::after {
  background-color: #e8b84b;
}
/* Layer 4 — вертикальная золотая линия */
.team-info-page .team-player__inner .ncr-page-decor .ncr-page-decor__layer-4 {
  background-color: #e8b84b;
}
/* Layer 5 — вертикальная золотая линия */
.team-info-page .team-player__inner .ncr-page-decor .ncr-page-decor__layer-5 {
  background-color: #e8b84b;
}

/* ── News inline widgets ──────────────────────────────────────────────────── */
.news-widget-card {
  margin: 2rem auto;
  width: 100%;
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 8px;
  overflow: hidden;
  background: #0d1b2a;
  font-size: 0.88rem;
}
.news-widget-card__header {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 9px 14px;
  background: rgba(4,138,197,0.14);
  border-bottom: 1px solid rgba(255,255,255,0.08);
}
.news-widget-card__icon { font-size: 1rem; line-height: 1; }
.news-widget-card__title {
  font-family: 'Rajdhani', sans-serif;
  font-weight: 700;
  font-size: 0.82rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: #048ac5;
  flex: 1;
}

/* Standings table */
.widget-standings-table { width: 100%; border-collapse: collapse; }
.widget-standings-table th,
.widget-standings-table td {
  padding: 6px 8px;
  text-align: center;
  white-space: nowrap;
  border: none;
}
.widget-standings-table th {
  font-size: 0.72rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.35);
  font-weight: 600;
  background: rgba(255,255,255,0.03);
  border-bottom: 1px solid rgba(255,255,255,0.08);
}
.widget-standings-table td { color: rgba(255,255,255,0.82); }
.widget-standings-table__team { text-align: left !important; width: 99%; }
.widget-standings-table__name {
  font-weight: 600;
  color: rgba(255,255,255,0.92);
  white-space: nowrap;
}
.widget-standings-table__pts { font-weight: 700; color: #fff !important; }
.widget-standings-table__wins  { color: #2bc253 !important; }
.widget-standings-table__draws { color: rgba(255,255,255,0.5) !important; }
.widget-standings-table__losses{ color: #f44 !important; }
.widget-standings-table__goals { color: rgba(255,255,255,0.55) !important; font-size: 0.8em; }
.widget-standings-table__pos   { color: rgba(255,255,255,0.35) !important; font-size: 0.8em; width: 36px; min-width: 36px; white-space: nowrap; }
.widget-standings-table__team  { min-width: 0; overflow: hidden; }
.widget-standings-table        { table-layout: auto; }
.widget-standings-table__name  { white-space: nowrap; min-width: 120px; }
.widget-standings-table tbody tr {
  border-bottom: 1px solid rgba(255,255,255,0.04);
  transition: background 0.15s;
}
.widget-standings-table tbody tr:last-child { border-bottom: none; }
.widget-standings-table tbody tr:hover { background: rgba(255,255,255,0.03); }
.widget-standings-table tbody tr.is-own-team { background: rgba(4,138,197,0.10); }
.widget-standings-table tbody tr.is-own-team .widget-standings-table__name { color: #048ac5; }

.widget-form-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 14px; height: 14px;
  border-radius: 2px;
  font-size: 0.62rem;
  font-weight: 700;
  flex-shrink: 0;
}
.widget-form-badge--W { background: rgba(28,206,78,0.15); color: #1ce; }
.widget-form-badge--D { background: rgba(255,193,7,0.12);  color: #ffc107; }
.widget-form-badge--L { background: rgba(244,68,68,0.15);  color: #f44; }

/* Match result */
.widget-standings--loading,
.widget-match-result--loading,
.widget-tour-results--loading {
  display: flex; justify-content: center; padding: 2rem;
  background: #0d1b2a; border-radius: 8px;
}
.widget-standings__spinner {
  width: 28px; height: 28px;
  border: 3px solid rgba(4,138,197,0.2);
  border-top-color: #048ac5;
  border-radius: 50%;
  animation: widget-spin 0.8s linear infinite;
}
@keyframes widget-spin { to { transform: rotate(360deg); } }

.widget-score-card {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 16px 12px;
  gap: 0;
}
.widget-score-card__team { flex: 1; text-align: center; min-width: 0; }
.widget-score-card__team--right { text-align: right; }
.widget-score-card__name {
  font-weight: 700;
  font-size: 0.92rem;
  color: rgba(255,255,255,0.9);
  line-height: 1.2;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.widget-score-card__city {
  font-size: 0.68rem;
  color: rgba(255,255,255,0.35);
  text-transform: uppercase;
  letter-spacing: 0.06em;
  margin-top: 2px;
}
.widget-score-card__score-block {
  flex-shrink: 0;
  text-align: center;
  padding: 0 16px;
}
.widget-score-card__score {
  font-family: 'Rajdhani', sans-serif;
  font-size: 2rem;
  font-weight: 700;
  line-height: 1;
  letter-spacing: 0.05em;
  color: #fff;
  white-space: nowrap;
}
.widget-score-card__score-home.is-own,
.widget-score-card__score-away.is-own { color: #048ac5; }
.widget-score-card__sep { color: rgba(255,255,255,0.3); margin: 0 2px; }
.widget-score-card__sub {
  font-size: 0.68rem;
  color: rgba(255,255,255,0.35);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin-top: 4px;
}
.widget-score-card__label {
  display: inline-block;
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  padding: 2px 6px;
  border-radius: 3px;
  margin-top: 3px;
}
.widget-score-card__label--win  { background: rgba(40,167,69,0.18); color: #2bc253; }
.widget-score-card__label--lose { background: rgba(220,53,69,0.18);  color: #f55; }
.widget-score-card__label--draw { background: rgba(255,193,7,0.12);   color: #ffc107; }

/* Tour results list */
.widget-tour-list { list-style: none; margin: 0; padding: 0; }
.widget-tour-list__item {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 14px;
  border-bottom: 1px solid rgba(255,255,255,0.04);
}
.widget-tour-list__item:last-child { border-bottom: none; }
.widget-tour-list__item:hover { background: rgba(255,255,255,0.02); }
.widget-tour-list__team {
  flex: 1;
  font-size: 0.84rem;
  font-weight: 600;
  color: rgba(255,255,255,0.85);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.widget-tour-list__team--own { color: #048ac5; }
.widget-tour-list__team--right { text-align: right; }
.widget-tour-list__score {
  flex-shrink: 0;
  font-family: 'Rajdhani', sans-serif;
  font-weight: 700;
  font-size: 1.1rem;
  color: #fff;
  text-align: center;
  min-width: 52px;
}
.widget-tour-list__date {
  font-size: 0.68rem;
  color: rgba(255,255,255,0.28);
  flex-shrink: 0;
  min-width: 48px;
  text-align: right;
}

.widget-standings-table__city {
  font-size: 0.68rem;
  color: rgba(255,255,255,0.3);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  line-height: 1;
}
.widget-tour-list__city {
  display: block;
  font-size: 0.65rem;
  color: rgba(255,255,255,0.3);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  font-weight: 400;
  line-height: 1;
  margin-top: 1px;
}

/* Uppercase team names in all widgets */
.widget-standings-table__name,
.widget-tour-list__team,
.widget-score-card__name {
  text-transform: uppercase;
}

/* ===== Материалы о матче (GamePage / MaterialsTab) ===== */
.match-materials-list {
  display: flex;
  flex-direction: column;
  gap: 0;
}
.match-material-item {
  display: block;
  text-decoration: none;
  padding: 0.5rem 1rem;
  border-bottom: 1px solid rgba(255,255,255,0.07);
  transition: background 0.18s;
}
.match-material-item:hover {
  background: rgba(255,255,255,0.04);
}
.match-material-item__title {
  font-weight: 600;
  font-size: 0.95rem;
  color: #fff;
  line-height: 1.35;
  transition: color 0.18s;
}
.match-material-item:hover .match-material-item__title {
  color: #1ce7ff;
}
.match-material-item__meta {
  display: flex;
  align-items: center;
  gap: 1rem;
  margin-top: 0.35rem;
  font-size: 0.75rem;
  opacity: 0.45;
  color: #fff;
}

/* ===== Uppercase titles: материалы матча, список новостей, страница новости ===== */
.match-material-item__title,
.post__title,
.post__title a {
  text-transform: uppercase;
}

/* ===== Match replay poster (thumbnail + play overlay) ===== */
.match-replay-poster {
  position: relative;
  width: 100%;
  padding-bottom: 56.25%; /* 16:9 */
  height: 0;
  overflow: hidden;
  border-radius: 4px;
  cursor: pointer;
  background: #0d1117;
}
.match-replay-poster__img,
.match-replay-poster__placeholder {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}
.match-replay-poster__img {
  object-fit: cover;
}
.match-replay-poster__placeholder {
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg, #0d1b2e 0%, #0a1520 100%);
}
.match-replay-poster__label {
  font-size: 1.1rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: rgba(255,255,255,0.35);
}
/* Play button — центр постера */
.match-replay-poster__play {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(0,0,0,0.35);
  transition: background 0.2s;
}
.match-replay-poster:hover .match-replay-poster__play {
  background: rgba(0,0,0,0.15);
}
.match-replay-poster__play svg {
  color: #fff;
  filter: drop-shadow(0 2px 8px rgba(0,0,0,0.6));
  transition: transform 0.2s;
}
.match-replay-poster:hover .match-replay-poster__play svg {
  transform: scale(1.12);
}

/* ===== Lineups style-2 ===== */

/* Full match-player: avatar 60×60, img 105×128 absolute (clipped) — matches template */
.lineups-table--style-2 .match-player__avatar {
  width: 60px;
  min-width: 60px;
  height: 60px;
  overflow: hidden;
  margin-right: 12px;
  flex-shrink: 0;
  position: relative;
}
.lineups-table--style-2 .match-player__avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 15%;
  display: block;
  position: relative;
  z-index: 1;
}
/* Fallback: jersey number — белый текст на синем фоне (стартовые) */
.lineup-num {
  position: relative;
  z-index: 1;
  font-size: 1.4rem;
  font-weight: 700;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
}

/* Запасные: белая трапеция (как у основных, но белая), синий номер */
.lineups-table--style-2 td:last-child .match-player .match-player__avatar::before {
  background-color: #ffffff !important;
}
.lineups-table--style-2 td:last-child .lineup-num {
  color: #048ac5;
}

/* Lineups table: allow horizontal scroll on small screens */
.lineups-table--style-2 {
  min-width: 600px;
}
.match-lineups-container .table-responsive {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

/* Remove vertical padding on player columns */
.lineups-table--style-2 td.td-player {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

/* Right column: avatar moves to right (theme order:2) + margin flip */
.lineups-table--style-2 td:last-child .match-player__avatar {
  margin-right: 0;
  margin-left: 14px;
}
.lineups-table--style-2 td:last-child .match-player figcaption {
  text-align: right;
}

/* Nickname: large player name */
.lineups-table--style-2 .match-player__nickname {
  font-size: 0.9rem;
  font-weight: 700;
  letter-spacing: 0.02em;
  color: #fff;
  display: block;
  white-space: nowrap;
  text-transform: uppercase;
}
.lineups-table--style-2 .match-player__nickname a {
  color: inherit;
  text-decoration: none;
}
.lineups-table--style-2 .match-player__nickname a:hover {
  color: #048ac5;
}

/* Name: jersey + initial, smaller */
.lineups-table--style-2 .match-player__name {
  font-size: 0.72rem;
  color: #5e627e;
  display: block;
  margin-top: 3px;
}

/* Team logo in header */
.lineups-table--style-2 .match-team-logo {
  position: relative !important;
  width: 30px;
  height: 30px;
}
.lineups-table--style-2 .match-team-logo img {
  position: static !important;
  transform: none !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: contain;
}


/* ===== GamePage nav: always visible, content pushed right ===== */
.match-stats-links--main {
  z-index: 100 !important;
}

/* On desktop: push game page content right to clear the fixed left nav */
@media (min-width: 992px) {
  .game-page {
    padding-left: 120px !important;
  }
}

/* On mobile/tablet: nav is inline at top, no extra padding needed */
@media (max-width: 991px) {
  .match-stats-links--main {
    position: static !important;
    transform: none !important;
    display: flex !important;
    flex-direction: row !important;
    justify-content: center;
    gap: 8px;
    margin-bottom: 20px;
    padding: 8px 0;
    border-bottom: 1px solid rgba(255,255,255,0.1);
  }
  .match-stats-links--main li {
    display: block !important;
    margin: 0 !important;
  }
  .match-stats-links--main li + li {
    margin-left: 0 !important;
    margin-top: 0 !important;
  }
  .match-stats-links--main li + li::before {
    display: none !important;
  }
}

/* ===== match-score__logo: логотипы команд при hover ===== */
.match-score__logo {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0 24px;
  opacity: 0;
  transform: translateY(20px);
  transition: all 500ms ease 0ms;
  pointer-events: none;
}
.match-score__logo img {
  width: 70px;
  height: 70px;
  object-fit: contain;
}
.match-score__logo-placeholder {
  font-size: 0.7em;
  color: rgba(255,255,255,0.5);
  max-width: 70px;
  text-align: center;
  line-height: 1.2;
}

/* ===== TodayMatchWidget ===== */
.today-match-widget {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  height: 100%;
  padding: 40px 30px;
  text-align: center;
}

.today-match-widget__header {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  margin-bottom: 24px;
}

.today-match-widget__badge {
  display: inline-block;
  background: #048ac5;
  color: #fff;
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  padding: 4px 12px;
  border-radius: 20px;
}

.today-match-widget__competition {
  font-size: 0.75rem;
  color: rgba(255,255,255,0.7);
  text-transform: uppercase;
  letter-spacing: 0.08em;
  text-shadow: 0 1px 4px rgba(0,0,0,0.8);
}

.today-match-widget__card {
  width: 100%;
  max-width: 480px;
  cursor: default;
}

/* Bigger logos inside the widget on hover */
.today-match-widget__card .match-score__logo img {
  width: 90px;
  height: 90px;
  object-fit: contain;
}

/* Score area sizing */
.today-match-widget__card .match-score__body {
  padding: 32px 20px;
}

.today-match-widget__time {
  font-size: 2rem;
  font-weight: 700;
  letter-spacing: 0.05em;
}

.today-match-widget__date {
  margin-top: 20px;
  font-size: 0.8rem;
  color: rgba(255,255,255,0.6);
  text-transform: uppercase;
  letter-spacing: 0.06em;
  text-shadow: 0 1px 4px rgba(0,0,0,0.8);
}



/* ===== TodayMatchWidget — page-thumbnail-default синяя версия ===== */
.today-match-widget {
  position: relative;
  overflow: hidden;
  min-height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

/* Виджет = единый контейнер, контент сверху */
.today-match-widget {
  position: relative !important;
  min-height: 480px !important;
  height: 480px !important;
  overflow: hidden !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: flex-start !important;
  padding-top: 32px !important;
}
/* На всех размерах — по высоте родителя */
@media (min-width: 992px) {
  .today-match-widget {
    height: 100% !important;
    min-height: 0 !important;
  }
}
/* На мобайле: родитель = 100vh, виджет заполняет его */
@media (max-width: 991px) {
  .widger-area--before-loop {
    height: 100svh !important;
  }
  .today-match-widget {
    height: 100% !important;
    min-height: 0 !important;
  }
}

/* figure заполняет виджет как фон */
.today-match-widget .page-thumbnail--default {
  position: absolute !important;
  inset: 0 !important;
  padding-bottom: 0 !important;
  width: 100% !important;
  height: 100% !important;
  background-image: url("/img/bg-texture-05.jpg") !important;
  background-size: cover !important;
  background-position: center !important;
}

/* Контент — flex поверх figure через z-index */
.today-match-widget__header,
.today-match-widget__card,
.today-match-widget__date {
  position: relative !important;
  z-index: 3 !important;
}

/* Показываем все слои сразу (без scroll-is--active) */
.today-match-widget .page-thumbnail--default .ncr-page-decor__layer-1,
.today-match-widget .page-thumbnail--default .ncr-page-decor__layer-2,
.today-match-widget .page-thumbnail--default .ncr-page-decor__layer-3,
.today-match-widget .page-thumbnail--default .ncr-page-decor__layer-4,
.today-match-widget .page-thumbnail--default .ncr-page-decor__layer-5,
.today-match-widget .page-thumbnail--default .ncr-page-decor__layer-6 {
  opacity: 1 !important;
  transition: none !important;
}

/* Логотип: 460×461px, по центру, виден сразу */
.today-match-widget .page-thumbnail--default .page-bg-logo {
  width: 460px !important;
  height: 461px !important;
  object-fit: contain !important;
  opacity: 1 !important;
  transform: scale(1) translate3d(-50%, -50%, 0) !important;
  transition: none !important;
  z-index: 2 !important;
}

/* Цвета: зелёный → синий */
.today-match-widget .ncr-page-decor__layer-1 {
  background-color: #0d5aad !important;
  background-image: linear-gradient(#0d6abf, #041530) !important;
}
.today-match-widget .ncr-page-decor__layer-2 {
  background-color: #048ac5 !important;
  background-image: linear-gradient(#048ac5, #014e73) !important;
}
.today-match-widget .ncr-page-decor__layer-3 {
  background-color: #1ab3ff !important;
  background-image: linear-gradient(#3ec8ff, #0077bb) !important;
}
.today-match-widget .ncr-page-decor__layer-3::after,
.today-match-widget .ncr-page-decor__layer-4,
.today-match-widget .ncr-page-decor__layer-5 {
  background-color: #48d0ff !important;
}



@keyframes pulse {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.3; }
}

/* ── Stream Tab ───────────────────────────────────────────────────────────── */
.stream-tab {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}

.stream-tab__header {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.stream-tab__title {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 0.85rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .05em;
  color: #aaa;
}

.stream-tab__dot {
  display: inline-block;
  width: 10px;
  height: 10px;
  border-radius: 50%;
}
.stream-tab__dot--live    { background: #e53935; animation: pulse 1s infinite; }
.stream-tab__dot--checking{ background: #ffc107; animation: pulse 1.5s infinite; }
.stream-tab__dot--offline { background: #555; }

.stream-tab__match-name {
  font-size: 1rem;
  font-weight: 600;
}

.stream-tab__player-wrap {
  position: relative;
  background: #0a0a0f;
  border-radius: 6px;
  overflow: hidden;
  min-height: 260px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.stream-tab__video {
  width: 100%;
  display: block;
  max-height: 56.25vw;
}

.stream-tab__offline,
.stream-tab__no-hls {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 12px;
  padding: 3rem 2rem;
  text-align: center;
  color: #888;
}

.stream-tab__offline-icon { opacity: .35; }
.stream-tab__offline-text { font-size: 1rem; margin: 0; }
.stream-tab__offline-hint { font-size: 0.85rem; margin: 0; opacity: .7; }

.stream-tab__links {
  display: flex;
  gap: 1rem;
  flex-wrap: wrap;
  font-size: 0.85rem;
}
.stream-tab__links a {
  color: #048ac5;
  text-decoration: none;
}
.stream-tab__links a:hover { text-decoration: underline; }

/* ── Widget Inline Panel (lineups / stream) ───────────────────────────────── */
.widget-inline-panel {
  position: relative;
  background: #0b1526;
  border-top: 3px solid #048ac5;
  padding: 1.5rem 0.5rem 2rem;
  color: #ddd;
  min-height: 200px;
  animation: panel-slide-up 0.22s ease;
  overflow-x: auto;
}
@keyframes panel-slide-up {
  from { transform: translateY(30px); opacity: 0; }
  to   { transform: translateY(0);    opacity: 1; }
}

.widget-inline-panel__close {
  position: absolute;
  top: 10px; right: 12px;
  background: none; border: none;
  font-size: 1.1rem; color: #888;
  cursor: pointer; line-height: 1;
  padding: 4px 8px;
  transition: color .2s;
}
.widget-inline-panel__close:hover { color: #fff; }

/* Lineups */
.widget-lineups { font-size: 0.85rem; }

.widget-lineups__header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 1rem;
  font-weight: 700;
  font-size: 0.9rem;
}
.widget-lineups__team { flex: 1; }
.widget-lineups__team--right { text-align: right; }
.widget-lineups__vs {
  padding: 0 0.75rem;
  color: #048ac5;
  font-size: 0.75rem;
}

.widget-lineups__section-label {
  font-size: 0.7rem;
  text-transform: uppercase;
  letter-spacing: .08em;
  color: #666;
  margin: 0.75rem 0 0.35rem;
}

.widget-lineups__grid {
  display: flex;
  gap: 0.5rem;
}
.widget-lineups__col { flex: 1; display: flex; flex-direction: column; gap: 2px; }
.widget-lineups__col--right { align-items: flex-end; }

.widget-lineup__row {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 3px 0;
  border-bottom: 1px solid rgba(255,255,255,.05);
}
.widget-lineup__row--guest { flex-direction: row-reverse; }
.widget-lineup__num {
  width: 22px; min-width: 22px;
  font-size: 0.75rem; color: #048ac5;
  text-align: center;
}
.widget-lineup__name { font-size: 0.82rem; }

/* Stream in panel */
.widget-stream__status {
  display: flex; align-items: center; gap: 8px;
  font-size: 0.8rem; font-weight: 600;
  text-transform: uppercase; letter-spacing: .05em;
  margin-bottom: 0.75rem; color: #aaa;
}
.widget-stream__player {
  background: #06090f;
  border-radius: 4px;
  overflow: hidden;
  min-height: 180px;
  display: flex; align-items: center; justify-content: center;
}

/* nav-кнопки — те же стили что <a>, используют df-icon из dynamost-icons.svg */
.match-stats-links li button {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 36px; height: 36px;
  border-radius: 50%;
  border: 1px solid rgba(255,255,255,0.2);
  background: rgba(10,20,40,0.85);
  color: rgba(255,255,255,0.55);
  transition: border-color .2s, color .2s, background .2s;
  cursor: pointer;
  padding: 0;
}
.match-stats-links li button:hover {
  border-color: rgba(255,255,255,0.6);
  color: #fff;
}

/* В TodayMatchWidget hover-nav работает как обычно (убрано принудительное opacity: 1) */

/* ── has-panel: виджет+панель в одном столбце ─────────────────────────────── */
/* Враппер перестаёт быть фиксированной высоты */
.widger-area--before-loop.has-panel {
  height: auto !important;
  display: flex !important;
  flex-direction: column !important;
}
/* Виджет сжимается до минимальной высоты */
.widger-area--before-loop.has-panel .today-match-widget {
  height: auto !important;
  min-height: 240px !important;
  flex-shrink: 0;
}
/* На мобайле тоже снимаем 100svh */
@media (max-width: 991px) {
  .widger-area--before-loop.has-panel {
    height: auto !important;
    min-height: 100svh;
  }
}

/* На touch-устройствах hover недоступен — скрываем nav совсем */
@media (hover: none) and (pointer: coarse) {
  .match-score--hoverable .match-stats-links {
    display: none !important;
  }
}


/* ===== Landing page: one-screen layout ===== */
body.site-layout--landing {
  overflow: hidden !important;
}
body.site-layout--landing .site-wrapper {
  display: flex !important;
  flex-direction: column !important;
  height: 100dvh !important;
  overflow: hidden !important;
}
body.site-layout--landing .site-content {
  flex: 1 1 0 !important;
  min-height: 0 !important;
  overflow: hidden !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}
body.site-layout--landing #footer {
  flex-shrink: 0 !important;
}

/* Override site-layout--horizontal rules that conflict with landing */
body.site-layout--landing.site-layout--horizontal .site-wrapper {
  overflow: hidden !important;
  height: 100dvh !important;
  display: flex !important;
  flex-direction: column !important;
}
body.site-layout--landing.site-layout--horizontal .site-content {
  overflow: hidden !important;
  flex: 1 1 0 !important;
  min-height: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

/* Если идёт радиоэфир — разрешаем прокрутку */
body.site-layout--landing.landing-has-radio {
  overflow-y: auto !important;
}
body.site-layout--landing.landing-has-radio .site-wrapper {
  height: auto !important;
  min-height: 100dvh !important;
  overflow: visible !important;
}
body.site-layout--landing.landing-has-radio .site-content {
  overflow: visible !important;
  height: auto !important;
}

/* ===== Landing Radio Widget ===== */
.landing-radio {
  width: 100%;
  max-width: 400px;
  margin: 20px auto 0;
  padding: 12px 14px;
  border-radius: 12px;
  background: rgba(8, 12, 30, 0.85);
  border: 1px solid rgba(255, 255, 255, 0.1);
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.5);
  backdrop-filter: blur(12px);
  display: flex;
  flex-direction: column;
  gap: 8px;
  font-family: 'Rajdhani', sans-serif;
  animation: landing-radio-appear 0.4s ease-out;
}

@keyframes landing-radio-appear {
  from { opacity: 0; transform: translateY(12px); }
  to   { opacity: 1; transform: translateY(0); }
}

@keyframes landing-radio-pulse {
  0%, 100% { opacity: 1; box-shadow: 0 0 0 0 rgba(244,67,54,0.6); }
  50%       { opacity: 0.6; box-shadow: 0 0 0 5px rgba(244,67,54,0); }
}

.landing-radio__header {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.landing-radio__pulse {
  width: 8px; height: 8px;
  flex-shrink: 0;
  background: #f44336;
  border-radius: 50%;
  animation: landing-radio-pulse 1.5s infinite;
}
.landing-radio__live-label {
  font-size: 11px; font-weight: 700;
  letter-spacing: 0.1em; color: #f44336;
  text-transform: uppercase;
}
.landing-radio__title {
  flex: 1; font-size: 13px; font-weight: 600;
  color: #e0e8ff; overflow: hidden;
  text-overflow: ellipsis; white-space: nowrap;
}
.landing-radio__listeners {
  font-size: 12px; color: rgba(255, 255, 255, 0.4);
}

.landing-radio__controls {
  display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
}

.landing-radio__play-btn {
  display: flex; align-items: center; gap: 6px;
  padding: 8px 16px; border: none; border-radius: 8px;
  background: #3c6bfa; color: #fff;
  font-family: 'Rajdhani', sans-serif;
  font-size: 14px; font-weight: 700;
  cursor: pointer; transition: background 0.2s, transform 0.1s;
}
.landing-radio__play-btn:hover { background: #5580ff; transform: scale(1.03); }
.landing-radio__play-btn:active { transform: scale(0.97); }
.landing-radio__play-btn--active { background: #e02020; }
.landing-radio__play-btn--active:hover { background: #ff3030; }

.landing-radio__volume {
  display: flex; align-items: center; gap: 6px;
  flex: 1; min-width: 100px;
  font-size: 13px; color: rgba(255, 255, 255, 0.5);
}
.landing-radio__volume input[type="range"] {
  flex: 1; accent-color: #3c6bfa;
}

.landing-radio__walkie-toggle {
  width: 100%;
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 7px; color: rgba(255, 255, 255, 0.5);
  font-family: 'Rajdhani', sans-serif;
  font-size: 12px; font-weight: 600;
  padding: 6px; cursor: pointer; transition: all 0.2s;
}
.landing-radio__walkie-toggle:hover { background: rgba(255, 255, 255, 0.08); color: #fff; }

.landing-radio__walkie {
  display: flex; flex-direction: column; gap: 6px;
  padding-top: 8px;
  border-top: 1px solid rgba(255, 255, 255, 0.06);
}

.landing-radio__name-input {
  width: 100%; padding: 8px 12px;
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 7px; color: #fff;
  font-family: 'Rajdhani', sans-serif;
  font-size: 14px; box-sizing: border-box;
}
.landing-radio__name-input::placeholder { color: rgba(255, 255, 255, 0.3); }
.landing-radio__name-input:focus { outline: none; border-color: rgba(60, 107, 250, 0.5); }

.landing-radio__call-btn {
  width: 100%; padding: 9px; border: none;
  border-radius: 7px;
  font-family: 'Rajdhani', sans-serif;
  font-size: 13px; font-weight: 700;
  cursor: pointer; transition: all 0.2s;
}
.landing-radio__call-btn--connect { background: #3c6bfa; color: #fff; }
.landing-radio__call-btn--connect:hover { background: #5580ff; }
.landing-radio__call-btn--waiting { background: rgba(255,220,0,0.15); color: #ffdc00; border: 1px solid rgba(255,220,0,0.25); cursor: default; }
.landing-radio__call-btn--on-air { background: #e02020; color: #fff; }
.landing-radio__call-btn--disconnect { background: rgba(255,255,255,0.06); color: rgba(255,255,255,0.5); border: 1px solid rgba(255,255,255,0.1); }
.landing-radio__call-btn--disconnect:hover { background: rgba(255,255,255,0.1); color: #fff; }

.landing-radio__hand-btn {
  width: 100%; background: none;
  border: 1px solid rgba(255,220,0,0.3);
  border-radius: 7px; color: #ffdc00;
  font-family: 'Rajdhani', sans-serif;
  font-size: 13px; padding: 7px; cursor: pointer;
}
.landing-radio__hand-btn:hover { background: rgba(255,220,0,0.08); }

.landing-radio__call-status {
  font-size: 12px; color: rgba(255,255,255,0.4); text-align: center;
}
.landing-radio__call-status--on-air { color: #2ecc40; font-weight: 700; }
.landing-radio__call-status--preview { color: #bb86fc; font-weight: 600; }
.landing-radio__call-status--kicked { color: #e02020; }

@media (max-width: 520px) {
  .landing-radio { margin: 16px 0 0; max-width: 100%; }
}

/* Inline content links — clearly distinguishable from surrounding text */
.news-content a,
.post__body > p a {
  color: #048ac5;
  text-decoration: underline;
  text-decoration-style: dashed;
  text-underline-offset: 3px;
  transition: text-decoration-style 200ms ease, opacity 200ms ease;
}
.news-content a:hover,
.post__body > p a:hover {
  color: #048ac5;
  text-decoration-style: solid;
  opacity: 0.8;
}

/* ================================================
   9 MAY PAGE — Logo centered on screen, photos left+right in rows
   Desktop: logo fixed centered (transparent bg), photos wrap in rows
   Mobile: logo top, photos stacked below
   Logo: square PNG on transparent background
   ================================================ */

.may9 {
  display: flex;
  align-items: flex-start;
  width: 100vw;
  min-height: 100vh;
  background: transparent;
  position: relative;
}

/* Spacer: reserves the logo's space in the flex flow */
.may9-logo-space {
  flex-shrink: 0;
  width: calc(100vh - 60px);
}

/* Columns — photos wrap into multiple columns, filling the side areas */
.may9-col {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  flex: 1;
  gap: 10px;
  padding: 16px 12px;
  align-content: flex-start;
  max-height: calc(100vh - 60px);
  overflow-y: auto;
}

/* Left photos hug the left edge, right photos hug the right edge */
.may9-col-left  { justify-content: flex-start; }
.may9-col-right { justify-content: flex-end; }

/* Center logo — fixed, full viewport, centered, clickable */
.may9-logo {
  position: fixed;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: calc(100vh - 60px);
  height: calc(100vh - 60px);
  display: flex;
  align-items: center;
  justify-content: center;
  background: transparent;
  z-index: 10;
  margin: 0 auto;
  /* Don't block clicks on photos behind the transparent area */
  pointer-events: none;
}

.may9-logo img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  cursor: pointer;
  display: block;
  /* Re-enable click on the logo image itself */
  pointer-events: auto;
}

/* Photo card — NO visible text label, just the image */
.may9-photo {
  display: block;
  cursor: pointer;
  text-decoration: none !important;
}

.may9-photo img {
  width: 120px;
  height: 120px;
  object-fit: cover;
  border-radius: 8px;
  border: 2px solid rgba(255, 255, 255, 0.6);
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.5);
  display: block;
  transition: transform 0.15s, box-shadow 0.15s;
}

.may9-photo:hover img {
  transform: scale(1.05);
  box-shadow: 0 6px 24px rgba(0, 0, 0, 0.7);
}

/* Loading */
.may9-loading {
  color: rgba(255, 255, 255, 0.5);
  font-size: 0.9rem;
  padding: 1rem 0;
}

/* Hover popup — appears near cursor */
.may9-popup {
  position: fixed;
  z-index: 1000;
  pointer-events: none;
  background: rgba(0, 0, 0, 0.88);
  border-radius: 6px;
  padding: 5px 10px;
  font-size: 0.8rem;
  color: #fff;
  white-space: nowrap;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.5);
}

/* ===== Modal ===== */
.may9-modal-overlay {
  position: fixed;
  inset: 0;
  z-index: 9999;
  background: rgba(0, 0, 0, 0.75);
  display: flex;
  align-items: center;
  justify-content: center;
}

.may9-modal {
  position: relative;
  background: #12122a;
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 16px;
  padding: 2rem;
  width: 420px;
  max-width: 95vw;
  box-shadow: 0 8px 40px rgba(0, 0, 0, 0.6);
}

.may9-modal-close {
  position: absolute;
  top: 12px;
  right: 14px;
  background: none;
  border: none;
  color: rgba(255, 255, 255, 0.5);
  font-size: 1.2rem;
  cursor: pointer;
  padding: 4px 8px;
  line-height: 1;
}

.may9-modal-close:hover { color: #fff; }

.may9-modal-title {
  font-size: 1.2rem;
  font-weight: 700;
  color: #fff;
  text-align: center;
  margin: 0 0 0.3rem;
}

.may9-modal-subtitle {
  font-size: 0.85rem;
  color: rgba(255, 255, 255, 0.45);
  text-align: center;
  margin: 0 0 1.2rem;
}

.may9-modal-row {
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
}

.may9-input {
  width: 100%;
  padding: 0.7rem 1rem;
  border-radius: 8px;
  border: 1px solid rgba(255, 255, 255, 0.2);
  background: rgba(255, 255, 255, 0.07);
  color: #fff;
  font-size: 0.9rem;
  outline: none;
  box-sizing: border-box;
  transition: border-color 0.2s;
}

.may9-input::placeholder { color: rgba(255, 255, 255, 0.35); }
.may9-input:focus { border-color: rgba(255, 255, 255, 0.5); }

.may9-btn {
  width: 100%;
  padding: 0.7rem 1.5rem;
  border-radius: 8px;
  border: none;
  background: #c8a84b;
  color: #1a1a2e;
  font-weight: 700;
  font-size: 0.95rem;
  cursor: pointer;
  transition: background 0.2s;
}

.may9-btn:hover:not(:disabled) { background: #e0be5f; }
.may9-btn:active:not(:disabled) { background: #b8963e; }
.may9-btn:disabled { opacity: 0.5; cursor: not-allowed; }

.may9-error   { margin-top: 0.6rem; font-size: 0.8rem; color: #ff6b6b; text-align: center; }
.may9-success { margin-top: 0.6rem; font-size: 0.8rem; color: #6bff9e; text-align: center; }
.may9-hint    { margin-top: 0.5rem; font-size: 0.75rem; color: rgba(255, 255, 255, 0.35); text-align: center; }

/* ===== Narrow: photos below logo (max 1199px) ===== */
/* Logo moves into normal flow so photos can never scroll under it */
@media (max-width: 1199px) {
  .may9-logo-space { display: none; }

  .may9 {
    flex-direction: row;
    flex-wrap: wrap;
    align-items: flex-start;
    align-content: flex-start;
    justify-content: center;
    padding-top: 0;
  }

  /* Logo: pull out of fixed, put in flow first via order */
  .may9-logo {
    position: relative;
    top: auto;
    left: auto;
    transform: none;
    order: -1;
    width: min(100vw, calc(100vh - 60px));
    height: min(100vw, calc(100vh - 60px));
    margin: 0 auto;
    flex-shrink: 0;
  }

  /* Both cols side-by-side below the logo */
  .may9-col {
    order: 0;
    width: 50%;
    flex: none;
    max-height: none;
    overflow-y: visible;
    justify-content: center;
    align-content: flex-start;
  }

  .may9-col-left,
  .may9-col-right {
    align-items: center;
  }
}

/* ===== Mobile (≤ 768px): smaller logo ===== */
@media (max-width: 768px) {
  .may9-logo {
    width: min(100vw, 400px);
    height: min(100vw, 400px);
  }

  .may9-photo img {
    width: 72px;
    height: 72px;
  }

  .may9-modal { padding: 1.5rem; }
}