/* Club-Plakat: the approved opening composition, its navigation and controls.
   CMS color anchors are deliberately ordinary custom properties: inline palette
   values remain authoritative. Page-module rules follow after the hero review. */
html[data-design="club"] {
  --bg: #f6f5f5;
  --bg2: #eeeded;
  --bg3: #e7e5e5;
  --text: #181919;
  --text2: #555656;
  --text3: #626363;
  --border: #d7d5d5;
  --border2: #a8aaaa;
  --card: #fff;
  --card2: #f0efef;
  --glass: #eeeded;
  --glass-border: #d7d5d5;
  --glass-border-hover: #a8aaaa;
  --menu-bg: #f6f5f5;
  --nav-bg: #f6f5f5;
  --accent: #f56712;
  --club-on-accent: #181919;
  --green: #246448;
  --red: #aa3424;
  --orange: #875c0c;
  --font: "Manrope", sans-serif;
  --font2: "Manrope", sans-serif;
  --font-display: "Archivo Black", sans-serif;
  --club-section-font: "Anton", sans-serif;
  --club-section-heading-font: "Russo One", "Archivo Black", sans-serif;
  --nav-h: 5.3156vw;
  --club-gutter: 3.3223vw;
  --club-ease: cubic-bezier(.16, 1, .3, 1);
  --r: 8px;
  --r2: 12px;
  --r3: 16px;
  --shadow-pop: 0 12px 30px -12px rgb(24 25 25 / .22);
  color-scheme: light;
  background: var(--bg);
  scroll-padding-top: calc(var(--nav-h) + 16px);
  scrollbar-color: var(--border2) var(--bg);
}

html[data-design="club"][data-theme="dark"] {
  --bg: #181a1b;
  --bg2: #222526;
  --bg3: #2d3031;
  --text: #f3f3f0;
  --text2: #bec3c2;
  --text3: #afb5b3;
  --border: #3e4344;
  --border2: #687171;
  --card: #222526;
  --card2: #2d3031;
  --glass: #222526;
  --glass-border: #3e4344;
  --glass-border-hover: #687171;
  --menu-bg: #222526;
  --nav-bg: #181a1b;
  --green: #92d9b0;
  --red: #ffafa3;
  --orange: #f2c66c;
  --shadow-pop: 0 12px 30px -12px rgb(0 0 0 / .5);
  color-scheme: dark;
}

html[data-design="club"] body {
  padding-top: var(--nav-h);
  color: var(--text);
  background: var(--bg);
  font-family: var(--font);
  line-height: 1.55;
  caret-color: var(--accent);
}
html[data-design="club"] #root { padding-top: 0; }
html[data-design="club"] #root.nd-enter { animation: none; }
html[data-design="club"] .nd-fx { display: none; }
html[data-design="club"] ::selection {
  color: var(--text);
  background: color-mix(in srgb, var(--accent) 28%, var(--bg));
}
html[data-design="club"] ::-webkit-scrollbar { width: 8px; height: 8px; }
html[data-design="club"] ::-webkit-scrollbar-track { background: var(--bg); }
html[data-design="club"] ::-webkit-scrollbar-thumb {
  border: 2px solid var(--bg);
  border-radius: 8px;
  background: var(--border2);
}
html[data-design="club"] :where(button, a, [tabindex]):focus-visible {
  outline: 2px solid var(--text);
  outline-offset: 3px;
}
html[data-design="club"] :where(button, a) {
  text-underline-offset: .2em;
}

/* A clear fixed top bar. Its actual logo has transparent source margins. */
html[data-design="club"] #nav,
html[data-design="club"] #nav.scrolled {
  height: var(--nav-h);
  min-height: 64px;
  padding: 0;
  border: 0;
  box-shadow: none;
  background: var(--bg);
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
html[data-design="club"] #nav::before { display: none; }
html[data-design="club"]:has(.club-hero) #nav[data-at-top="true"] {
  background: transparent;
}
html[data-design="club"] .nav-inner {
  position: relative;
  height: 100%;
  max-width: none;
  margin: 0;
  padding: 0 var(--club-gutter);
  gap: clamp(16px, 2.2vw, 34px);
  justify-content: flex-start;
}
html[data-design="club"] .nav-logo {
  min-width: 0;
  flex: 0 1 auto;
  gap: 5px;
  border-radius: 8px;
  scale: 1;
  transition: none;
}
html[data-design="club"] .nav-logo-img {
  width: 5.3156vw;
  height: 5.3156vw;
  min-width: 64px;
  min-height: 64px;
  margin-left: -.7973vw;
  border-radius: 0;
  object-fit: contain;
  filter: none;
}
html[data-design="club"] .nav-name {
  max-width: 14ch;
  font-family: var(--club-section-font);
  font-size: clamp(18px, 1.5282vw, 25px);
  font-weight: 400;
  line-height: 1.05;
  letter-spacing: 0;
  text-align: left;
  text-transform: uppercase;
  white-space: normal;
  text-wrap: balance;
}
html[data-design="club"] .nav-name-flame {
  background: none;
  color: var(--accent);
  -webkit-text-fill-color: var(--accent);
  filter: none;
  animation: none;
}
html[data-design="club"] .nav-center {
  position: static;
  left: auto;
  min-width: 0;
  flex: 1 1 auto;
  justify-content: flex-start;
  gap: clamp(2px, .5vw, 8px);
  transform: none;
}
html[data-design="club"] .nav-link {
  min-height: 44px;
  padding: 10px 9px;
  border-radius: 6px;
  color: var(--text);
  font-family: var(--font);
  font-size: clamp(12px, .9vw, 14px);
  font-weight: 700;
  line-height: 1.4;
  text-transform: none;
  letter-spacing: 0;
  transition: background-color 180ms var(--club-ease);
}
html[data-design="club"] .nav-link.active { color: var(--text); }
html[data-design="club"] .nav-link.active::after {
  left: 9px;
  right: 9px;
  bottom: 3px;
  height: 2px;
  background: var(--accent);
  box-shadow: none;
}
html[data-design="club"] .nav-right.nav-controls {
  width: auto;
  flex: 0 0 auto;
  gap: clamp(6px, .66vw, 10px);
  margin-left: auto;
}
html[data-design="club"] :is(.theme-toggle, .lang-globe-btn) {
  width: 40px;
  height: 40px;
  border: 0;
  border-radius: 6px;
  background: var(--bg);
  color: var(--text);
  transition: background-color 180ms var(--club-ease);
}
html[data-design="club"] :is(.nav-submenu, .lang-globe-menu) {
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--menu-bg);
  box-shadow: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
html[data-design="club"] .nav-submenu {
  min-width: 240px;
  padding: 6px;
  transition: opacity 180ms var(--club-ease), scale 180ms var(--club-ease), visibility 0s linear 180ms;
}
html[data-design="club"] .nav-dropdown-root > .nav-submenu-root {
  overflow: visible;
}
html[data-design="club"] .nav-submenu-nested {
  top: -7px;
  left: calc(100% + 8px);
  transform: none;
}
html[data-design="club"] :is(.nav-subitem, .lang-option) {
  min-height: 40px;
  padding: 10px 12px;
  border-radius: 6px;
  color: var(--text);
  font-family: var(--font);
  font-size: 13px;
  font-weight: 600;
  line-height: 1.4;
  white-space: normal;
  transition: background-color 180ms var(--club-ease);
}
html[data-design="club"] :is(.nav-subitem, .lang-option).active {
  color: var(--text);
  background: color-mix(in srgb, var(--accent) 13%, var(--menu-bg));
}
html[data-design="club"] .lang-globe-menu {
  min-width: 170px;
  padding: 6px;
}
html[data-design="club"] .nav-burger {
  width: 40px;
  height: 40px;
  padding: 11px 8px;
  border-radius: 6px;
  justify-content: center;
  background: var(--bg);
}
html[data-design="club"] .nav-burger span { height: 2px; }
html[data-design="club"] .nav-mobile {
  max-height: calc(100dvh - var(--nav-h));
  padding: 8px var(--club-gutter) 20px;
  border-bottom: 1px solid var(--border);
  background: var(--menu-bg);
  backdrop-filter: none;
}
html[data-design="club"] .nav-m-link {
  min-height: 48px;
  color: var(--text);
}
html[data-design="club"] .nav-m-link.active { color: var(--text); font-weight: 800; }
html[data-design="club"] .nav-m-sub { border-left-width: 1px; }
html[data-design="club"] .nav-m-sub .nav-m-link { color: var(--text2); }

/* Long, authoritative CMS menus switch to the complete existing menu drawer. */
html[data-design="club"] .nav-inner:has(.nav-center > :nth-child(6)) .nav-center { display: none; }
html[data-design="club"] .nav-inner:has(.nav-center > :nth-child(6)) .nav-burger { display: flex; }

/* Shared action vocabulary, without the previous shimmer or glow. */
html[data-design="club"] :is(.btn-glow, .btn-ghost, .btn-login, .btn-discord) {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  min-height: 44px;
  padding: 10px 20px;
  border-radius: 8px;
  font-family: var(--font);
  font-size: 13px;
  font-weight: 800;
  line-height: 1.3;
  letter-spacing: 0;
  text-transform: none;
  text-decoration: none;
  box-shadow: none;
  filter: none;
  transform: none;
  scale: 1;
  clip-path: none;
  backdrop-filter: none;
  transition: background-color 180ms var(--club-ease), border-color 180ms var(--club-ease);
}
html[data-design="club"] :is(.btn-glow, .btn-login) {
  border: 1px solid transparent;
  background: var(--accent);
  color: var(--club-on-accent);
}
html[data-design="club"] :is(.btn-ghost, .btn-discord) {
  border: 1px solid var(--text);
  background: transparent;
  color: var(--text);
}
html[data-design="club"] .btn-discord { background: var(--bg); }
html[data-design="club"] .btn-glow::after { display: none; }
html[data-design="club"] :is(.btn-glow, .btn-ghost, .btn-login, .btn-discord):disabled {
  opacity: .5;
  cursor: not-allowed;
}
html[data-design="club"] :is(.btn-glow, .btn-ghost, .btn-login, .btn-discord):active:not(:disabled):not(:focus-visible) {
  scale: .985;
}
html[data-design="club"] .nav-right :is(.btn-login, .btn-discord) {
  min-height: 44px;
  padding: 9px 17px;
  font-size: 12px;
}
html[data-design="club"] .nav-right .btn-login {
  width: 12.8904vw;
  min-width: 180px;
  padding-inline: 16px;
  border-color: #181919;
  border-radius: 6px;
  background: #181919;
  color: #f6f5f5;
  font-size: 14px;
  font-weight: 600;
}
html[data-design="club"][data-theme="dark"] .nav-right .btn-login {
  border-color: var(--border2);
}

/* Plate coordinates were measured against the approved 1505 × 1045 image.
   The artwork crosses the empty top-bar region and must never be clipped. */
html[data-design="club"] .club-hero {
  position: relative;
  isolation: isolate;
  height: 33.289vw;
  min-height: 0;
  overflow: visible;
}
html[data-design="club"] .club-hero-art {
  position: absolute;
  z-index: -1;
  left: 49.3688%;
  top: -1.2625vw;
  width: 50.6312%;
  height: 34.5515vw;
  max-width: none;
  object-fit: contain;
  pointer-events: none;
  user-select: none;
}
html[data-design="club"] .club-hero-copy {
  width: 52%;
  padding-top: 1.2625vw;
  padding-left: 4.186vw;
}
html[data-design="club"] .club-hero-title {
  width: max-content;
  margin: .5316vw 0 0;
  color: var(--text);
  font-family: var(--font-display);
  font-size: 12.2vw;
  font-weight: 400;
  line-height: .81;
  letter-spacing: -.04em;
  text-transform: uppercase;
  text-shadow: none;
  text-wrap: nowrap;
}
html[data-design="club"] .club-hero-title > span {
  display: block;
  white-space: nowrap;
}
html[data-design="club"] .club-title-destiny {
  transform: scaleX(.818);
  transform-origin: left center;
}
html[data-design="club"] .club-hero-title:has(.club-title-custom) {
  width: 100%;
  font-size: clamp(36px, 7.5vw, 120px);
  line-height: .95;
  overflow-wrap: anywhere;
}
html[data-design="club"] .club-hero-title .club-title-custom {
  white-space: normal;
  text-wrap: balance;
}
html[data-design="club"] .club-tagline {
  display: flex;
  align-items: center;
  gap: 3.12vw;
  margin-top: -.0664vw;
  color: var(--text);
  font-family: var(--font);
  font-size: clamp(20px, 1.9269vw, 31px);
  font-weight: 400;
  line-height: 1.2;
}
html[data-design="club"] .club-tagline::before {
  content: "";
  width: 6.2458vw;
  height: 3px;
  flex: 0 0 auto;
  background: var(--accent);
}
html[data-design="club"] .club-tagline .slogan-rotator {
  min-width: 0;
  max-width: 32ch;
  text-align: left;
}
html[data-design="club"] .club-tagline .slogan-item {
  background: none;
  color: var(--text);
  -webkit-text-fill-color: currentColor;
  filter: none;
  transition: opacity 180ms var(--club-ease);
}
html[data-design="club"] .club-tagline .slogan-item p { margin: 0; }
html[data-design="club"] .club-hero .hero-cta {
  display: flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  gap: 1.0631vw;
  margin: 1.4618vw 0 0;
  animation: none;
}
html[data-design="club"] .club-hero .hero-cta :is(.btn-glow, .btn-ghost) {
  min-height: 3.7209vw;
  padding: 14px 22px;
  font-size: clamp(13px, 1.05vw, 17px);
}
html[data-design="club"] .club-hero .hero-cta .btn-glow {
  width: 16.4784vw;
  justify-content: space-between;
}
html[data-design="club"] .club-hero .hero-cta .btn-ghost { width: 14.6179vw; }

/* Real current news closes the poster with a useful, quiet rail. */
html[data-design="club"] .club-activity {
  position: relative;
  display: grid;
  grid-template-columns: minmax(110px, .5fr) minmax(0, 3fr) auto;
  align-items: center;
  gap: 24px;
  min-height: 7.2425vw;
  padding: 14px var(--club-gutter);
  border-block: 1px solid var(--border);
  background: var(--bg2);
}
html[data-design="club"] .club-activity-label {
  color: var(--text);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .035em;
  text-transform: uppercase;
}
html[data-design="club"] .club-activity-items {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 24px;
  min-width: 0;
}
html[data-design="club"] .club-activity-item {
  min-width: 0;
  min-height: 64px;
  padding: 2px 0 2px 20px;
  border-left: 1px solid var(--border);
  border-radius: 0;
  text-align: left;
}
html[data-design="club"] .club-activity-item :is(small, strong, span) { display: block; }
html[data-design="club"] .club-activity-item small {
  color: var(--text2);
  font-size: 11px;
  font-weight: 600;
  line-height: 1.4;
  font-variant-numeric: tabular-nums;
}
html[data-design="club"] .club-activity-item strong {
  display: -webkit-box;
  margin: 4px 0 2px;
  overflow: hidden;
  color: var(--text);
  font-size: 14px;
  font-weight: 800;
  line-height: 1.35;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}
html[data-design="club"] .club-activity-item > span {
  overflow: hidden;
  color: var(--text2);
  font-size: 12px;
  line-height: 1.4;
  text-overflow: ellipsis;
  white-space: nowrap;
}
html[data-design="club"] .club-activity-action {
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  min-height: 44px;
  padding: 10px 14px;
  border: 1px solid var(--text);
  border-radius: 8px;
  background: transparent;
  color: var(--text);
  font-size: 12px;
  font-weight: 800;
  line-height: 1.3;
  transition: background-color 180ms var(--club-ease);
}
html[data-design="club"] .club-activity-empty {
  grid-column: 1 / -1;
  color: var(--text2);
  font-size: 14px;
}

/* The next spread begins immediately; actual team content is never removed. */
html[data-design="club"] :is(.club-home-teams, .club-home-news).sec {
  max-width: none;
  margin: 0;
  padding-inline: var(--club-gutter);
}
html[data-design="club"] .club-home-teams.sec {
  padding-top: 1.9934vw;
  padding-bottom: 2.6578vw;
}
html[data-design="club"] .club-home-news.sec { padding-top: 1.4618vw; }
html[data-design="club"] :is(.club-home-teams, .club-home-news) .sec-hdr-row {
  align-items: center;
  gap: 16px;
  margin-bottom: 1.4618vw;
}
html[data-design="club"] :is(.club-home-teams, .club-home-news) .sec-hdr {
  display: flex;
  flex: 1 1 auto;
  align-items: center;
  gap: 30px;
  margin: 0;
}
html[data-design="club"] :is(.club-home-teams, .club-home-news) .sec-tag { display: none; }
html[data-design="club"] :is(.club-home-teams, .club-home-news) .sec-title {
  width: max-content;
  margin: 0 -9.4684vw 0 0;
  color: var(--text);
  font-family: var(--club-section-heading-font);
  font-size: 4.7442vw;
  font-weight: 400;
  line-height: .87;
  letter-spacing: -.015em;
  text-transform: uppercase;
  text-wrap: balance;
  white-space: nowrap;
  transform: scaleX(.745);
  transform-origin: left center;
}
html[data-design="club"] .club-home-teams .sec-hdr { gap: 5.5814vw; }
html[data-design="club"] .club-home-teams .sec-sub {
  position: relative;
  max-width: 28ch;
  color: var(--text2);
  font-size: 13px;
  line-height: 1.5;
}
html[data-design="club"] .club-home-teams .sec-sub::before {
  content: "";
  position: absolute;
  top: calc(50% - 1px);
  left: -4.3854vw;
  width: 2.7907vw;
  height: 2px;
  background: var(--accent);
}
html[data-design="club"] :is(.club-home-teams, .club-home-news) .sec-hdr-row > .btn-ghost {
  min-height: 44px;
  padding: 9px 0 9px 16px;
  border: 0;
  border-radius: 0;
  background: none;
  font-size: 12px;
}
html[data-design="club"] .club-home-teams .teams-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1.3289vw;
}
html[data-design="club"] .club-home-teams .tcard {
  display: grid;
  grid-template-columns: 80px minmax(0, 1fr);
  min-height: 112px;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--card);
  box-shadow: none;
  transform: none;
  scale: 1;
  cursor: default;
  transition: border-color 180ms var(--club-ease);
}
html[data-design="club"] .club-home-teams .tcard::after,
html[data-design="club"] .club-home-teams .tcard-banner::before { display: none; }
html[data-design="club"] .club-home-teams .tcard-banner {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 8px;
  width: 100%;
  height: 100%;
  min-height: 112px;
  padding: 12px 8px;
  scale: 1;
}
html[data-design="club"] .club-home-teams .tcard-game {
  position: static;
  order: 2;
  max-width: 100%;
  padding: 0;
  border-radius: 0;
  background: none;
  color: var(--text);
  font-size: 10px;
  font-weight: 800;
  line-height: 1.25;
  letter-spacing: 0;
  text-transform: none;
  overflow-wrap: anywhere;
}
html[data-design="club"] .club-home-teams :is(.tcard-logo-img, .tcard-icon) {
  width: 54px;
  height: 54px;
  border: 0;
  border-radius: 8px;
  background: transparent;
  box-shadow: none;
  transform: none;
  filter: none;
  font-size: 22px;
  transition: none;
}
html[data-design="club"] .club-home-teams .tcard-body {
  display: flex;
  flex-direction: column;
  min-width: 0;
  padding: 10px 12px;
}
html[data-design="club"] .club-home-teams .tcard-name {
  margin: 0 0 3px;
  color: var(--text);
  font-family: var(--font);
  font-size: 16px;
  font-weight: 800;
  line-height: 1.15;
  letter-spacing: -.02em;
  overflow-wrap: anywhere;
}
html[data-design="club"] .club-home-teams .tcard-desc {
  margin: 0 0 5px;
  color: var(--text2);
  font-size: 12.5px;
  line-height: 1.4;
  -webkit-line-clamp: 2;
}
html[data-design="club"] .club-home-teams .tcard-desc:empty { display: none; }
html[data-design="club"] .club-home-teams .tcard-badges { gap: 4px; margin: 0 0 2px; }
html[data-design="club"] .club-home-teams .status-pill {
  min-height: 19px;
  padding: 1px 6px;
  border: 0;
  border-radius: 4px;
  font-size: 11px;
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: 0;
  text-transform: none;
}
html[data-design="club"] .club-home-teams .status-pill.is-open {
  background: color-mix(in srgb, var(--green) 10%, var(--card));
  color: var(--green);
}
html[data-design="club"] .club-home-teams .status-pill.is-closed {
  background: color-mix(in srgb, var(--red) 10%, var(--card));
  color: var(--red);
}
html[data-design="club"] .club-home-teams .status-pill.is-limited {
  background: color-mix(in srgb, var(--orange) 10%, var(--card));
  color: var(--orange);
}
html[data-design="club"] .club-home-teams .tcard-foot {
  flex-wrap: wrap;
  gap: 4px 8px;
  margin-top: auto;
  padding: 0;
  border: 0;
}
html[data-design="club"] .club-home-teams .tcard-foot .chip2 {
  padding: 0;
  border: 0;
  border-radius: 0;
  background: none;
  color: var(--text2);
  font-size: 11px;
  line-height: 1.4;
  letter-spacing: 0;
  font-variant-numeric: tabular-nums;
}
html[data-design="club"] .club-home-teams .arrow-btn {
  min-width: 44px;
  min-height: 28px;
  margin-right: -3px;
  padding: 4px 3px;
  color: var(--text);
  font-size: 11px;
  font-weight: 800;
  line-height: 1.4;
  transform: none;
  scale: 1;
}
html[data-design="club"] .club-home-teams .empty-state { grid-column: 1 / -1; }

@media (hover: hover) and (pointer: fine) {
  html[data-design="club"] :is(.nav-link, .nav-subitem, .lang-option, .theme-toggle, .lang-globe-btn):hover {
    color: var(--text);
    background: var(--bg2);
    box-shadow: none;
  }
  html[data-design="club"] :is(.btn-glow, .btn-login):hover {
    color: var(--club-on-accent);
    background: color-mix(in srgb, var(--accent) 92%, var(--text));
    box-shadow: none;
    filter: none;
    transform: none;
  }
  html[data-design="club"] .nav-right .btn-login:hover {
    border-color: #333637;
    background: #333637;
    color: #f6f5f5;
  }
  html[data-design="club"] :is(.btn-ghost, .btn-discord, .club-activity-action):hover {
    color: var(--text);
    border-color: var(--text);
    background: var(--bg2);
    box-shadow: none;
  }
  html[data-design="club"] .club-activity-item:hover strong { text-decoration: underline; }
  html[data-design="club"] .club-home-teams .tcard:hover {
    border-color: var(--border2);
    background: var(--card);
    box-shadow: none;
    transform: none;
  }
  html[data-design="club"] .club-home-teams .arrow-btn:hover { text-decoration: underline; }
}

/* At tablet widths the poster retains its two-column relation with more height. */
@media (min-width: 801px) and (max-width: 1100px) {
  html[data-design="club"] .club-hero { height: 400px; }
  html[data-design="club"] .club-hero-copy { padding-top: 24px; }
  html[data-design="club"] .club-hero-art { top: 24px; }
  html[data-design="club"] .club-tagline { font-size: 20px; gap: 20px; }
  html[data-design="club"] .club-hero .hero-cta :is(.btn-glow, .btn-ghost) {
    min-width: 145px;
    min-height: 48px;
    padding-inline: 14px;
  }
  html[data-design="club"] .club-activity { grid-template-columns: 100px minmax(0, 1fr); }
  html[data-design="club"] .club-activity-action { grid-column: 2; justify-self: end; }
  html[data-design="club"] .club-home-teams .teams-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 1120px) {
  html[data-design="club"] { --nav-h: 72px; }
  html[data-design="club"] .nav-center { display: none; }
  html[data-design="club"] .nav-burger { display: flex; }
  html[data-design="club"] .nav-desktop-only { display: none; }
  html[data-design="club"] .nav-logo-img { width: 72px; height: 72px; }
  html[data-design="club"] .nav-name { font-size: 22px; }
  html[data-design="club"] .nav-right.nav-controls { gap: 6px; }
  html[data-design="club"] .nav-mobile .theme-toggle { width: 44px; height: 44px; }
}

@media (max-width: 800px) {
  html[data-design="club"] { --club-gutter: 20px; }
  html[data-design="club"] .club-hero {
    display: flex;
    flex-direction: column;
    height: auto;
  }
  html[data-design="club"] .club-hero-copy {
    order: 1;
    width: 100%;
    padding: 22px var(--club-gutter) 0;
  }
  html[data-design="club"] .club-hero-title {
    margin-top: 12px;
    font-size: 23.4vw;
    line-height: .86;
    letter-spacing: -.04em;
  }
  html[data-design="club"] .club-title-destiny { font-size: 20.2vw; transform: scaleX(.94); }
  html[data-design="club"] .club-hero-title:has(.club-title-custom) { font-size: 15vw; }
  html[data-design="club"] .club-tagline {
    gap: 16px;
    margin-top: 22px;
    font-family: var(--font);
    font-size: clamp(16px, 3vw, 22px);
    font-weight: 500;
    line-height: 1.4;
  }
  html[data-design="club"] .club-tagline::before { width: 44px; height: 2px; }
  html[data-design="club"] .club-hero .hero-cta { gap: 12px; margin-top: 22px; }
  html[data-design="club"] .club-hero .hero-cta :is(.btn-glow, .btn-ghost) {
    width: auto;
    min-width: 0;
    min-height: 48px;
    flex: 1 1 0;
    padding: 12px 16px;
    font-size: 13px;
  }
  html[data-design="club"] .club-hero-art {
    position: relative;
    order: 2;
    left: auto;
    top: auto;
    width: 100%;
    height: auto;
    margin: -8px 0 0;
    aspect-ratio: 1516 / 1038;
    object-fit: contain;
  }
  html[data-design="club"] .club-activity {
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 16px;
    min-height: 0;
    padding-block: 18px;
  }
  html[data-design="club"] .club-activity-label { font-size: 12px; }
  html[data-design="club"] .club-activity-items {
    grid-column: 1 / -1;
    grid-row: 2;
    grid-template-columns: repeat(3, minmax(180px, 1fr));
    gap: 20px;
    overflow-x: auto;
    padding: 2px 3px 10px;
    margin: 0 -3px -10px;
    scroll-snap-type: x proximity;
    overscroll-behavior-inline: contain;
    scrollbar-width: thin;
  }
  html[data-design="club"] .club-activity-item {
    min-height: 72px;
    padding-left: 14px;
    scroll-snap-align: start;
  }
  html[data-design="club"] .club-activity-item:first-child { padding-left: 0; border-left: 0; }
  html[data-design="club"] .club-activity-action { grid-column: 2; grid-row: 1; }
  html[data-design="club"] .club-activity-empty { min-width: 0; }
  html[data-design="club"] .club-home-teams.sec { padding-top: 34px; padding-bottom: 30px; }
  html[data-design="club"] .club-home-news.sec { padding-top: 24px; }
  html[data-design="club"] :is(.club-home-teams, .club-home-news) .sec-hdr-row {
    flex-wrap: nowrap;
    align-items: flex-start;
    margin-bottom: 20px;
    gap: 12px;
  }
  html[data-design="club"] :is(.club-home-teams, .club-home-news) .sec-hdr {
    display: block;
    min-width: 0;
  }
  html[data-design="club"] :is(.club-home-teams, .club-home-news) .sec-title {
    width: auto;
    margin-right: 0;
    font-size: clamp(36px, 7.6vw, 58px);
    line-height: 1.05;
    white-space: normal;
    transform: none;
  }
  html[data-design="club"] .club-home-teams .sec-sub { max-width: 36ch; margin-top: 12px; font-size: 13px; }
  html[data-design="club"] .club-home-teams .sec-sub::before { display: none; }
  html[data-design="club"] :is(.club-home-teams, .club-home-news) .sec-hdr-row > .btn-ghost {
    flex: 0 0 auto;
    padding: 4px 0;
  }
  html[data-design="club"] .club-home-teams .teams-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
}

@media (max-width: 560px) {
  html[data-design="club"] .nav-inner { gap: 8px; }
  html[data-design="club"] .nav-logo { gap: 1px; }
  html[data-design="club"] .nav-logo-img {
    width: 64px;
    height: 64px;
    min-width: 64px;
    margin-left: -10px;
  }
  html[data-design="club"] .nav-name { max-width: 12ch; font-size: 17px; }
  html[data-design="club"] .nav-right.nav-controls { gap: 2px; }
  html[data-design="club"] :is(.theme-toggle, .lang-globe-btn, .nav-burger) { width: 36px; height: 40px; }
  html[data-design="club"] .club-home-teams .teams-grid { grid-template-columns: 1fr; gap: 12px; }
  html[data-design="club"] .club-home-teams .tcard { grid-template-columns: 94px minmax(0, 1fr); }
  html[data-design="club"] .club-home-teams .tcard-body { padding: 12px 14px; }
  html[data-design="club"] .club-home-teams .tcard-name { font-size: 18px; }
  html[data-design="club"] .club-home-teams .tcard-desc { font-size: 13px; }
  html[data-design="club"] .club-home-teams .arrow-btn { min-height: 36px; font-size: 12px; }
}

@media (prefers-reduced-motion: reduce) {
  html[data-design="club"] { scroll-behavior: auto; }
  html[data-design="club"] :is(.nav-submenu, .lang-globe-menu, .nav-mobile, .nav-m-sub,
      .nav-link, .nav-subitem, .lang-option, .theme-toggle, .lang-globe-btn,
      .btn-glow, .btn-ghost, .btn-login, .btn-discord, .club-activity-action,
      .club-home-teams .tcard, .club-tagline .slogan-item) {
    transition: none;
    animation: none;
  }
  html[data-design="club"] :is(.nav-submenu, .lang-globe-menu) { scale: 1; }
  html[data-design="club"] :is(.btn-glow, .btn-ghost, .btn-login, .btn-discord):active { scale: 1; }
}

/* The rest of the club: open editorial spreads, rosters and real sporting data.
   Homepage opening selectors above remain more specific than shared sections. */
html[data-design="club"] {
  --club-content-width: 1440px;
  --club-read-width: 72ch;
  --shadow-card: none;
  --shadow-accent: none;
  --shadow-deep: none;
}
html[data-design="club"] .sec {
  max-width: var(--club-content-width);
  margin-inline: auto;
  padding: clamp(48px, 5.3vw, 88px) var(--club-gutter);
}
html[data-design="club"] .sec + .sec { padding-top: 24px; }
html[data-design="club"] .sec-hdr-row { align-items: flex-end; gap: 24px; margin-bottom: 36px; }
html[data-design="club"] .sec-hdr { margin-bottom: 0; min-width: 0; }
html[data-design="club"] .sec-hdr .sec-tag { display: none; }
html[data-design="club"] :is(.sec-title, .thub-title, .cms-page-title, .td-hero-name, .pp-hero-name) {
  color: var(--text);
  font-family: var(--club-section-heading-font);
  font-weight: 400;
  line-height: 1.04;
  letter-spacing: -.025em;
  overflow-wrap: anywhere;
  text-wrap: balance;
}
html[data-design="club"] :is(.sec-title, .thub-title, .cms-page-title) {
  font-size: clamp(32px, 4.3vw, 68px);
  text-transform: uppercase;
}
html[data-design="club"] .sec-title { margin-bottom: 16px; }
html[data-design="club"] .sec-sub { max-width: 60ch; font-size: 16px; line-height: 1.65; color: var(--text2); }
html[data-design="club"] .sec-action-row { align-items: center; gap: 16px; }
html[data-design="club"] .strip-bg { background: var(--bg2); border: 0; }
html[data-design="club"] .breadcrumb { gap: 8px; margin-bottom: 28px; font-size: 13px; }
html[data-design="club"] .breadcrumb :is(a, button) { min-height: 36px; color: var(--text2); text-decoration: underline; text-underline-offset: 3px; }
html[data-design="club"] .bc-sep { opacity: 1; color: var(--border2); }
html[data-design="club"] .bc-current { color: var(--text); overflow-wrap: anywhere; }
html[data-design="club"] :is(.copy-paragraph, .copy-stack, .md-p, .md-list li) { color: var(--text2); font-size: 16px; line-height: 1.7; }
html[data-design="club"] .copy-stack { max-width: var(--club-read-width); gap: 18px; }
html[data-design="club"] .copy-stack p + p { margin-top: 16px; }
html[data-design="club"] .md-label { color: var(--text2); opacity: 1; font-size: 12px; letter-spacing: .025em; }
html[data-design="club"] :is(.btn-white, .btn-admin, .hero-slide-cta, .section-band-cta, .shop-promo-cta) {
  display: inline-flex; align-items: center; justify-content: center; gap: 12px;
  min-height: 44px; padding: 12px 22px; border: 1px solid transparent; border-radius: 8px;
  background: var(--accent); color: var(--club-on-accent);
  font-family: var(--font); font-size: 14px; font-weight: 800; line-height: 1.4;
  text-transform: none; letter-spacing: 0; box-shadow: none; filter: none; transform: none;
  transition: background-color 180ms var(--club-ease), border-color 180ms var(--club-ease);
}
html[data-design="club"] .hero-slide-cta::after { display: none; }
html[data-design="club"] :is(.btn-white, .btn-admin, .hero-slide-cta, .section-band-cta, .shop-promo-cta):disabled { opacity: .5; cursor: not-allowed; }
html[data-design="club"] .btn-compact { min-height: 44px; }
html[data-design="club"] .arrow-btn { min-width: 44px; min-height: 44px; color: var(--text); font-size: 14px; font-weight: 800; transform: none; }
html[data-design="club"] :is(.chip2, .status-pill, .match-status-badge, .live-ticker-status, .ecard-badge) {
  min-height: 24px; padding: 3px 8px; border: 1px solid var(--border); border-radius: 5px;
  background: var(--bg2); color: var(--text2); font-size: 12px; font-weight: 600;
  line-height: 1.35; text-transform: none; letter-spacing: 0;
}
html[data-design="club"] :is(.status-pill.is-open, .live-ticker-status.upcoming, .match-status-badge.match-upcoming, .ebadge-upcoming) { color: var(--green); background: color-mix(in srgb, var(--green) 9%, var(--bg)); border-color: color-mix(in srgb, var(--green) 24%, var(--border)); }
html[data-design="club"] :is(.status-pill.is-closed, .live-ticker-status.live, .match-status-badge.match-live, .ebadge-live) { color: var(--red); background: color-mix(in srgb, var(--red) 9%, var(--bg)); border-color: color-mix(in srgb, var(--red) 24%, var(--border)); }
html[data-design="club"] :is(.status-pill.is-limited, .chip2-lead) { color: var(--orange); background: color-mix(in srgb, var(--orange) 9%, var(--bg)); border-color: color-mix(in srgb, var(--orange) 24%, var(--border)); }
html[data-design="club"] :is(.stat-num, .acard-val, .ecard-day, .match-score-num, .live-ticker-score, .pp-stat-value) {
  background: none; color: var(--text); -webkit-text-fill-color: currentColor; text-shadow: none;
  font-family: var(--club-section-heading-font); font-weight: 400; font-variant-numeric: tabular-nums;
}
html[data-design="club"] :is(.stat-label, .acard-label, .thub-stat-label, .pp-stat-label) { color: var(--text2); font-size: 12px; letter-spacing: .025em; text-transform: none; }
html[data-design="club"] .stats-bar { border-block: 1px solid var(--border); background: none; backdrop-filter: none; padding: 30px var(--club-gutter); }
html[data-design="club"] .stats-inner { max-width: var(--club-content-width); display: grid; grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)); gap: 28px; }
html[data-design="club"] .stat-box { min-width: 0; padding: 0; text-align: left; }
html[data-design="club"] .stat-box + .stat-box::before { display: none; }
html[data-design="club"] .stat-num { font-size: clamp(28px, 3.5vw, 44px); line-height: 1.1; }
html[data-design="club"] :is(.stats-mini-grid, .about-stats-grid) { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 0 28px; }
html[data-design="club"] .acard { border: 0; border-top: 1px solid var(--border); border-radius: 0; padding: 24px 0; text-align: left; background: none; }
html[data-design="club"] .acard-val { font-size: 36px; }
html[data-design="club"] :is(.tcard, .ncard, .match-card, .feat-box, .acard, .spcard, .game-page-card, .live-ticker-card, .apply-type-card, .team-ov-card, .pp-clip, .tourn-card, .feat-news) { box-shadow: none; transform: none; scale: 1; transition: border-color 180ms var(--club-ease), background-color 180ms var(--club-ease); }
html[data-design="club"] :is(.tcard, .ncard, .match-card, .feat-box, .acard, .game-page-card, .live-ticker-card, .apply-type-card, .team-ov-card, .tourn-card, .spcard)::after { display: none; }

/* Teams are a directory: full identity, description, recruiting and entry link. */
html[data-design="club"] .thub-intro { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 30px; align-items: start; margin-bottom: 40px; }
html[data-design="club"] .thub-intro-head { min-width: 0; }
html[data-design="club"] .thub-title { margin-bottom: 18px; }
html[data-design="club"] .thub-mascot { grid-column: 2; grid-row: 1 / 3; width: 130px; height: 130px; margin: 0; filter: none; animation: none; }
html[data-design="club"] .thub-stats { display: flex; flex-wrap: wrap; gap: 32px; border: 0; padding: 0; }
html[data-design="club"] .thub-stat { border: 0; padding: 0; min-width: 70px; }
html[data-design="club"] .thub-stat-num { font-size: 32px; }
html[data-design="club"] .thub-controls { top: var(--nav-h); margin-bottom: 20px; padding: 14px 0; border: 0; border-block: 1px solid var(--border); border-radius: 0; background: var(--bg); backdrop-filter: none; gap: 16px; }
html[data-design="club"] :is(.thub-pill, .thub-toggle, .news-filter-tab, .news-filter-reset) { min-height: 44px; padding: 10px 14px; border: 1px solid var(--border); border-radius: 7px; background: transparent; color: var(--text); font-size: 13px; font-weight: 700; letter-spacing: 0; box-shadow: none; scale: 1; }
html[data-design="club"] :is(.thub-pill.is-active, .news-filter-tab.is-active) { border-color: var(--text); background: var(--text); color: var(--bg); box-shadow: none; }
html[data-design="club"] .thub-pill-n { color: var(--text2); background: var(--bg2); font-size: 11px; }
html[data-design="club"] .thub-pill.is-active .thub-pill-n { color: var(--bg); background: transparent; }
html[data-design="club"] .thub-toggle-dot { box-shadow: none; }
html[data-design="club"] .thub-toggle[aria-pressed="true"] .thub-toggle-dot { box-shadow: none; }
html[data-design="club"] .thub-search { min-height: 44px; border-color: var(--border2); border-radius: 7px; background: var(--card); padding: 10px 12px; }
html[data-design="club"] .thub-search-input { font-family: var(--font); font-size: 14px; }
html[data-design="club"] .thub-count { font-size: 13px; }
html[data-design="club"] .thub-reset { color: var(--text); min-height: 36px; }
html[data-design="club"] .thub-shelves { gap: 52px; }
html[data-design="club"] .thub-shelf { gap: 20px; }
html[data-design="club"] .thub-shelf-head { gap: 20px; align-items: center; }
html[data-design="club"] .thub-shelf-name { font-family: var(--club-section-heading-font); font-size: clamp(23px, 2.5vw, 34px); font-weight: 400; letter-spacing: -.02em; line-height: 1.15; white-space: normal; }
html[data-design="club"] .thub-shelf-rule { height: 1px; background: var(--border); }
html[data-design="club"] .thub-shelf-count { border: 0; border-radius: 4px; color: var(--text2); background: var(--bg2); }
html[data-design="club"] :is(.teams-grid, .bento-grid) { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); grid-auto-rows: auto; grid-auto-flow: row; gap: 0 36px; }
html[data-design="club"] :is(.bento-f, .bento-b, .bento-w, .bento-n) { grid-column: auto; grid-row: auto; }
html[data-design="club"] .tcard { display: grid; grid-template-columns: 112px minmax(0, 1fr); min-height: 184px; height: auto; border: 0; border-bottom: 1px solid var(--border); border-radius: 0; background: transparent; overflow: visible; }
html[data-design="club"] .tcard-banner { width: 100%; height: 100%; min-height: 160px; max-width: none; border-left: 0; border-top-width: 1px; padding: 24px 12px; gap: 12px; flex-direction: column; border-radius: 8px; }
html[data-design="club"] .tcard-banner::before { display: none; }
html[data-design="club"] .tcard-game { position: static; order: 2; background: none; color: var(--text); border-radius: 0; padding: 0; max-width: 100%; font-size: 11px; font-weight: 700; text-transform: none; letter-spacing: 0; overflow-wrap: anywhere; }
html[data-design="club"] :is(.tcard-logo-img, .tcard-icon) { width: 72px; height: 72px; border-radius: 8px; box-shadow: none; transform: none; transition: none; background: none; }
html[data-design="club"] .tcard-icon { font-size: 28px; }
html[data-design="club"] .tcard-body { display: flex; flex-direction: column; min-width: 0; padding: 20px 0 20px 24px; }
html[data-design="club"] .tcard-name { color: var(--text); font-family: var(--font); font-size: 22px; font-weight: 800; line-height: 1.2; letter-spacing: -.025em; overflow-wrap: anywhere; }
html[data-design="club"] .tcard-desc { display: -webkit-box; font-size: 14px; line-height: 1.55; margin-bottom: 12px; -webkit-line-clamp: 3; }
html[data-design="club"] .tcard-badges { gap: 6px; margin-bottom: 10px; }
html[data-design="club"] .tcard-foot { border: 0; padding-top: 4px; gap: 12px; flex-wrap: wrap; }
html[data-design="club"] .thub-card .tcard-body { display: flex; flex: 1 1 auto; padding: 20px 0 20px 24px; justify-content: flex-start; }
html[data-design="club"] .thub-card .tcard-banner { height: 100%; width: 100%; min-height: 160px; border-left: 0; border-top: 1px solid var(--tc, var(--accent)); box-shadow: none; }
html[data-design="club"] .thub-card .tcard-desc { display: -webkit-box; font-size: 14px; -webkit-line-clamp: 3; max-width: none; }
html[data-design="club"] .thub-card .tcard-foot { margin-top: auto; border: 0; padding-top: 4px; }
html[data-design="club"] .thub-card .arrow-btn { padding: 4px 0; border: 0; border-radius: 0; background: none; font-size: 13px; color: var(--text); transform: none; }
html[data-design="club"] .thub-card .arrow-cta { display: inline; }
html[data-design="club"] .thub-card::before,
html[data-design="club"] .thub-card .tcard-ov { display: none; }

/* Real teams and people lead; their own image fitting and color tokens survive. */
html[data-design="club"] :is(.td-hero-full, .pp-hero) { padding: 52px var(--club-gutter) 48px; border-bottom: 1px solid var(--border); background: var(--bg2); overflow: visible; }
html[data-design="club"] .td-hero-full::before { display: none; }
html[data-design="club"] .td-hero-inner { max-width: calc(var(--club-content-width) - 100px); }
html[data-design="club"] :is(.td-hero-top, .pp-hero-top) { align-items: center; gap: 28px; margin-bottom: 20px; }
html[data-design="club"] :is(.td-hero-logo, .td-hero-icon) { width: 120px; height: 120px; border-radius: 12px; border-width: 1px; box-shadow: none; }
html[data-design="club"] .td-hero-name { font-size: clamp(30px, 4vw, 62px); }
html[data-design="club"] .td-hero-desc { max-width: 72ch; font-size: 16px; line-height: 1.7; }
html[data-design="club"] .team-overview-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 32px 48px; }
html[data-design="club"] .team-ov-card { border: 0; border-top: 1px solid var(--border); border-radius: 0; background: none; padding: 24px 0; min-width: 0; }
html[data-design="club"] .team-ov-card .sec-title { font-family: var(--font); font-size: 22px; font-weight: 800; text-transform: none; }
html[data-design="club"] .team-ov-card :is(p, .copy-paragraph, .team-ov-desc) { font-size: 15px; line-height: 1.7; }
html[data-design="club"] .about-layout { grid-template-columns: minmax(0, 1.35fr) minmax(250px, .65fr); align-items: start; gap: 60px; }
html[data-design="club"] .tdh-social a { min-height: 40px; padding: 8px 12px; border-radius: 6px; background: transparent; color: var(--text); font-size: 13px; }
html[data-design="club"] .players-grid { grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); gap: 28px; }
html[data-design="club"] .pcard { display: flex; flex-direction: column; aspect-ratio: auto; border: 0; border-bottom: 1px solid var(--border); border-radius: 0; background: transparent; overflow: visible; }
html[data-design="club"] .pcard-media { position: relative; inset: auto; aspect-ratio: 4 / 5; width: 100%; overflow: hidden; border-radius: 12px; background: var(--bg2); }
html[data-design="club"] .pcard-photo { filter: none; transform: none; transition: none; }
html[data-design="club"] .pcard-shade,
html[data-design="club"] .pcard-foot { display: none; }
html[data-design="club"] .pcard-banner { position: relative; inset: auto; width: 100%; min-height: 0; padding: 18px 0; border: 0; background: none; transform: none; opacity: 1; gap: 8px; transition: none; }
html[data-design="club"] .pcard-banner :is(.pign-lg, .prealname, .pbio, .pcard-cta, .chip2) { color: var(--text); text-shadow: none; }
html[data-design="club"] .pcard-banner .pign-lg { padding-right: 0; font-size: 20px; line-height: 1.2; }
html[data-design="club"] .pcard-banner .prealname { color: var(--text2); font-size: 13px; }
html[data-design="club"] .pcard-banner .pbio { display: block; overflow: visible; color: var(--text2); font-size: 13px; line-height: 1.55; }
html[data-design="club"] .pcard-banner .chip2 { background: var(--bg2); border-color: var(--border); }
html[data-design="club"] .pcard-logo-mini { top: 10px; right: 10px; opacity: 1; transform: none; filter: none; background: var(--bg); }
html[data-design="club"] .pcard-socials a { min-height: 30px; padding: 4px 0; color: var(--text); font-size: 12px; text-transform: none; letter-spacing: 0; text-decoration: underline; opacity: 1; }
html[data-design="club"] .pcard-cta { font-size: 12px; text-transform: none; letter-spacing: 0; }
html[data-design="club"] .pgender-corner { background: var(--bg); box-shadow: none; opacity: 1; }
html[data-design="club"] .pp-hero { max-width: none; }
html[data-design="club"] .pp-hero-photo { width: 150px; height: 150px; padding: 0; border: 0; border-radius: 12px; background: none; filter: none; box-shadow: none; }
html[data-design="club"] .pp-hero-photo.ppic-fallback { background: var(--bg3); color: var(--text); }
html[data-design="club"] .pp-hero-name { font-size: clamp(28px, 3.6vw, 54px); }
html[data-design="club"] .pp-hero-real { color: var(--text2); font-size: 16px; }
html[data-design="club"] .pp-sec-title { color: var(--text); font-family: var(--font); font-size: 24px; font-weight: 800; margin-bottom: 24px; }
html[data-design="club"] .pp-stats { grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 0 28px; }
html[data-design="club"] .pp-stat { border: 0; border-top: 1px solid var(--border); border-radius: 0; background: none; padding: 24px 0; text-align: left; }
html[data-design="club"] .pp-stat-value { font-size: 36px; }
html[data-design="club"] .pp-chart { max-width: 760px; gap: 18px; }
html[data-design="club"] .pp-bar-track { height: 8px; border-radius: 2px; }
html[data-design="club"] .pp-bar-fill { border-radius: 2px; background: var(--tc, var(--accent)); transition: none; }
html[data-design="club"] .pp-favorite { color: var(--text); }
html[data-design="club"] .pp-clip { border: 0; border-radius: 12px; background: var(--bg2); }
html[data-design="club"] .pp-clip-title { padding: 14px; font-size: 14px; }

/* News is an editorial index; an icon remains an icon, rather than a fake photo. */
html[data-design="club"] .news-filters { gap: 20px; margin-bottom: 0; padding-bottom: 24px; border-bottom: 1px solid var(--border); }
html[data-design="club"] .news-filter-year-label { color: var(--text2); font-size: 12px; letter-spacing: 0; text-transform: none; }
html[data-design="club"] .news-filter-year-select { min-height: 44px; padding: 10px 12px; border-color: var(--text3); background: var(--card); color: var(--text); font-family: var(--font); }
html[data-design="club"] .news-grid { display: block; }
html[data-design="club"] .ncard { display: grid; grid-template-columns: 80px minmax(0, 1fr) 170px; align-items: start; gap: 28px; padding: 30px 0; border: 0; border-bottom: 1px solid var(--border); border-radius: 0; background: transparent; overflow: visible; cursor: default; }
html[data-design="club"] .ncard-thumb { width: 80px; height: 80px; padding: 8px; border-radius: 8px; background: var(--bg2); color: var(--text); font-family: var(--club-section-heading-font); font-size: 30px; text-shadow: none; }
html[data-design="club"] .ncard-thumb::after { display: none; }
html[data-design="club"] .ncard-body { min-width: 0; padding: 0; }
html[data-design="club"] .ncard-meta { gap: 12px; flex-wrap: wrap; margin-bottom: 12px; }
html[data-design="club"] .ncat { padding: 0; background: none; border-radius: 0; color: var(--text); font-size: 12px; font-weight: 800; text-transform: none; letter-spacing: 0; }
html[data-design="club"] .ndate { color: var(--text2); font-size: 12px; letter-spacing: 0; font-variant-numeric: tabular-nums; }
html[data-design="club"] .ncard-title { display: block; overflow: visible; margin-bottom: 12px; font-family: var(--font); font-size: clamp(20px, 2vw, 27px); font-weight: 800; line-height: 1.25; letter-spacing: -.025em; }
html[data-design="club"] .ncard-exc { font-size: 15px; line-height: 1.65; color: var(--text2); -webkit-line-clamp: 3; max-width: 72ch; }
html[data-design="club"] .ncard-footer { display: flex; flex-direction: column; align-items: flex-start; gap: 12px; border: 0; padding: 26px 0 0; }
html[data-design="club"] .ncard-author { color: var(--text2); font-size: 12px; letter-spacing: 0; }
html[data-design="club"] .ncard-read { min-height: 44px; color: var(--text); font-size: 13px; font-weight: 800; text-transform: none; letter-spacing: 0; }
html[data-design="club"] .feat-news { padding: 32px 0; margin-bottom: 0; grid-template-columns: minmax(0, 1fr) 100px; gap: 40px; border: 0; border-block: 1px solid var(--border); border-radius: 0; background: none; }
html[data-design="club"] .feat-news-tag { display: inline-block; margin-top: 12px; padding: 0; border-radius: 0; background: none; color: var(--text2); font-size: 12px; text-transform: none; letter-spacing: 0; }
html[data-design="club"] .feat-news-title { max-width: 26ch; font-family: var(--club-section-heading-font); font-size: clamp(28px, 3.4vw, 48px); font-weight: 400; line-height: 1.1; letter-spacing: -.025em; }
html[data-design="club"] .feat-news-title a { color: inherit; text-decoration: underline; text-decoration-color: var(--accent); text-decoration-thickness: 1px; text-underline-offset: .15em; }
html[data-design="club"] .feat-news-exc { max-width: 72ch; font-size: 16px; line-height: 1.65; }
html[data-design="club"] .feat-news-icon { width: 100px; height: 100px; background: var(--bg2); color: var(--text); border-radius: 12px; font-size: 28px; }
html[data-design="club"] .article-page { max-width: 980px; }
html[data-design="club"] .article-card { padding: 0; background: none; border: 0; border-radius: 0; }
html[data-design="club"] :is(.article-body, .cms-page-body, .rich-content) { max-width: var(--club-read-width); color: var(--text); font-size: 16px; line-height: 1.8; overflow-wrap: anywhere; }
html[data-design="club"] :is(.article-body, .cms-page-body, .rich-content) p { margin: 0 0 18px; }
html[data-design="club"] .rich-content :is(h1, h2, h3, h4, h5, h6) { color: var(--text); font-family: var(--font); font-weight: 800; line-height: 1.2; letter-spacing: -.025em; margin: 38px 0 14px; }
html[data-design="club"] .rich-content h1 { font-size: clamp(30px, 3.5vw, 46px); }
html[data-design="club"] .rich-content h2 { font-size: 28px; }
html[data-design="club"] .rich-content h3 { font-size: 23px; }
html[data-design="club"] .rich-content :is(h4, h5, h6) { font-size: 18px; }
html[data-design="club"] .rich-content :is(ul, ol) { margin: 0 0 20px; padding-left: 24px; }
html[data-design="club"] .rich-content li { margin: 8px 0; }
html[data-design="club"] .rich-content a { color: var(--text); text-decoration: underline; text-decoration-color: var(--accent); text-decoration-thickness: 2px; text-underline-offset: 4px; }
html[data-design="club"] .rich-content :is(code, pre) { background: var(--bg2); border: 1px solid var(--border); border-radius: 7px; color: var(--text); }
html[data-design="club"] .rich-content pre { max-width: 100%; overflow: auto; padding: 18px; }
html[data-design="club"] .rich-content pre code { border: 0; background: none; padding: 0; }
html[data-design="club"] .rich-content blockquote { padding: 18px 22px; margin: 24px 0; border: 0; border-left: 1px solid var(--accent); background: var(--bg2); color: var(--text2); }
html[data-design="club"] .rich-content img { height: auto; border-radius: 12px; margin-block: 24px; }
html[data-design="club"] .rich-content hr { margin-block: 32px; border-color: var(--border); }
html[data-design="club"] .rich-content :is(th, td) { border: 0; border-bottom: 1px solid var(--border); padding: 12px 14px; }
html[data-design="club"] .rich-content th { background: var(--bg2); }
html[data-design="club"] .cms-page { max-width: 900px; padding-block: 20px; }
html[data-design="club"] .cms-page-title { margin-bottom: 36px; }
html[data-design="club"] .legal-card { padding: 0; border: 0; border-radius: 0; background: none; max-width: 72ch; }
html[data-design="club"] .legal-card :is(p, li) { color: var(--text); font-size: 16px; line-height: 1.8; }
html[data-design="club"] .legal-card h3 { color: var(--text); font-size: 23px; margin-top: 38px; }

/* An agenda and scoreboards, with visible states and room for real names. */
html[data-design="club"] .events-list { gap: 0; }
html[data-design="club"] .ecard { grid-template-columns: 92px minmax(0, 1fr) auto; gap: 28px; padding: 28px 0; border: 0; border-bottom: 1px solid var(--border); border-radius: 0; background: none; transform: none; }
html[data-design="club"] .ecard-date { min-width: 0; background: none; border: 0; border-radius: 0; padding: 0; text-align: left; }
html[data-design="club"] .ecard-day { font-size: 40px; }
html[data-design="club"] .ecard-month { font-size: 12px; letter-spacing: .03em; }
html[data-design="club"] .ecard-title { font-size: 23px; font-weight: 800; line-height: 1.3; }
html[data-design="club"] .ecard-meta { gap: 12px 20px; }
html[data-design="club"] .emeta-chip { font-size: 13px; }
html[data-design="club"] .matches-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px; }
html[data-design="club"] .match-card { border: 1px solid var(--border); border-radius: 12px; background: var(--card); box-shadow: none; }
html[data-design="club"] .match-card.match-live { border-color: color-mix(in srgb, var(--red) 50%, var(--border)); box-shadow: none; }
html[data-design="club"] .match-header { padding: 16px 20px; flex-wrap: wrap; gap: 12px; }
html[data-design="club"] .match-game { color: var(--text2); font-size: 12px; letter-spacing: 0; text-transform: none; }
html[data-design="club"] .match-teams { gap: 18px; padding: 28px 20px; }
html[data-design="club"] .match-team { min-width: 0; }
html[data-design="club"] .match-team-name { font-size: 15px; line-height: 1.35; overflow-wrap: anywhere; }
html[data-design="club"] .match-score-num { font-size: 40px; }
html[data-design="club"] .match-footer { padding: 16px 20px; gap: 16px; flex-wrap: wrap; }
html[data-design="club"] .match-tournament { font-size: 12px; }
html[data-design="club"] .match-watch { min-height: 36px; display: inline-flex; align-items: center; color: var(--text); font-size: 12px; text-transform: none; letter-spacing: 0; }
html[data-design="club"] .dot-live-match { animation: none; }
html[data-design="club"] .live-ticker-list { grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 0 28px; }
html[data-design="club"] .live-ticker-card { border: 0; border-bottom: 1px solid var(--border); border-radius: 0; padding: 22px 0; background: none; }
html[data-design="club"] .live-ticker-title { font-size: 17px; }
html[data-design="club"] .live-ticker-game { color: var(--text2); letter-spacing: 0; text-transform: none; }
html[data-design="club"] .live-ticker-score { font-size: 28px; }
html[data-design="club"] .announcements-sec { padding: 30px var(--club-gutter); max-width: var(--club-content-width); }
html[data-design="club"] .ann-card { border: 1px solid var(--border); border-radius: 12px; padding: 20px; background: var(--bg2); align-items: flex-start; box-shadow: none; transform: none; }
html[data-design="club"] .ann-card-accent { width: 1px; }
html[data-design="club"] .ann-card-content { min-width: 0; }
html[data-design="club"] .ann-card-title { font-size: 17px; }
html[data-design="club"] .ann-card-body { font-size: 14px; line-height: 1.65; }
html[data-design="club"] .ann-card-icon { border: 0; border-radius: 6px; background: none; width: 32px; height: 32px; }
html[data-design="club"] .ann-card-badge { font-size: 12px; border-radius: 5px; animation: none; text-transform: none; letter-spacing: 0; }
html[data-design="club"] .ach-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 36px; }
html[data-design="club"] .achcard { border: 0; border-bottom: 1px solid var(--border); border-radius: 0; padding: 24px 0; background: none; align-items: flex-start; transform: none; }
html[data-design="club"] .ach-trophy { width: 42px; height: 42px; border: 0; background: none; }
html[data-design="club"] .ach-placement { font-size: 20px; color: var(--text); }
html[data-design="club"] .ach-tournament { font-size: 16px; }
html[data-design="club"] .ach-team { color: var(--text2); font-size: 13px; }
html[data-design="club"] .ach-date { color: var(--text2); font-size: 12px; }

/* Application/contact operate on a quiet form and an honest side ledger. */
html[data-design="club"] .club-form-shell { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: clamp(40px, 6vw, 90px); align-items: start; }
html[data-design="club"] .club-form-main { min-width: 0; }
html[data-design="club"] .club-form-aside { position: sticky; top: calc(var(--nav-h) + 28px); padding-top: 24px; border-top: 1px solid var(--text); min-width: 0; color: var(--text2); font-size: 14px; line-height: 1.65; }
html[data-design="club"] .club-form-aside :is(h2, h3, h4) { margin: 0 0 18px; color: var(--text); font-family: var(--font); font-size: 20px; font-weight: 800; line-height: 1.3; }
html[data-design="club"] .club-form-aside a { text-decoration: underline; overflow-wrap: anywhere; }
html[data-design="club"] .club-form-aside :is(ul, dl) { list-style: none; margin: 0; padding: 0; }
html[data-design="club"] .club-form-aside :is(li, dd) { margin: 0 0 16px; }
html[data-design="club"] .club-form-aside dt { color: var(--text); font-weight: 800; font-size: 12px; }
html[data-design="club"] .apply-form-wrap { border: 0; border-radius: 0; background: none; padding: 0; }
html[data-design="club"] .form-stack { display: flex; flex-direction: column; gap: 24px; }
html[data-design="club"] .apply-form-wrap .fld { margin: 0; min-width: 0; }
html[data-design="club"] .apply-form-wrap .fld-row { gap: 24px; }
html[data-design="club"] .apply-form-wrap .fld label:not(.apply-check) { flex-direction: row; align-items: baseline; gap: .5rem; color: var(--text); font-size: 13px; font-weight: 700; line-height: 1.4; text-transform: none; letter-spacing: 0; margin-bottom: 9px; }
html[data-design="club"] .fld-label-text { min-width: 0; }
html[data-design="club"] .fld-meta { flex: 0 0 auto; white-space: nowrap; color: var(--text2); font-size: 12px; }
html[data-design="club"] .fld-meta-required { color: var(--text); font-size: 15px; }
html[data-design="club"] .apply-form-wrap .fld :is(input, select, textarea) {
  min-height: 48px; padding: 12px 14px; border: 1px solid var(--text3); border-radius: 7px;
  background: var(--card); color: var(--text); font-family: var(--font); font-size: 16px; line-height: 1.4;
  box-shadow: none; transition: border-color 180ms var(--club-ease);
}
html[data-design="club"] .apply-form-wrap .fld select { appearance: auto; }
html[data-design="club"] .apply-form-wrap .fld textarea { min-height: 150px; }
html[data-design="club"] .apply-form-wrap .fld :is(input, select, textarea)::placeholder { color: var(--text3); opacity: 1; }
html[data-design="club"] .apply-form-wrap .fld :is(input, select, textarea):focus { outline: 2px solid var(--text); outline-offset: 2px; border-color: var(--text); box-shadow: none; }
html[data-design="club"] .apply-form-wrap .fld :is(input, select, textarea)[aria-invalid="true"] { border-color: var(--red); }
html[data-design="club"] .apply-form-wrap .fld :is(input, select, textarea):disabled { background: var(--bg2); color: var(--text2); cursor: not-allowed; }
html[data-design="club"] :is(.apply-check, .question-check) { gap: 12px; color: var(--text); font-size: 14px; line-height: 1.6; }
html[data-design="club"] :is(.apply-check, .question-check, .video-consent-remember) input[type="checkbox"],
html[data-design="club"] .apply-form-wrap .fld input:is([type="checkbox"], [type="radio"]) { width: 18px; height: 18px; min-height: 18px; flex: 0 0 auto; margin-top: 3px; padding: 0; accent-color: var(--text); appearance: auto; }
html[data-design="club"] .apply-check a { text-decoration: underline; }
html[data-design="club"] .apply-gate { border: 1px solid var(--border); border-radius: 12px; background: var(--bg2); padding: 28px; }
html[data-design="club"] .apply-gate-title { font-family: var(--font); font-size: 21px; font-weight: 800; color: var(--text); text-transform: none; letter-spacing: -.02em; }
html[data-design="club"] .apply-gate p { font-size: 15px; line-height: 1.65; color: var(--text2); }
html[data-design="club"] .apply-gate .btn-glow { margin-top: 24px; }
html[data-design="club"] .apply-body { animation: none; }
html[data-design="club"] .apply-rest { gap: 24px; }
html[data-design="club"] .apply-form-wrap :is(.age-warning, .team-full-warning) { padding: 14px 16px; border: 1px solid color-mix(in srgb, var(--red) 40%, var(--border)); border-radius: 7px; background: color-mix(in srgb, var(--red) 6%, var(--bg)); color: var(--red); font-size: 14px; }
html[data-design="club"] .team-status-note { border: 1px solid var(--border); border-radius: 7px; background: var(--bg2); color: var(--text2); font-size: 14px; }
html[data-design="club"] .birthday-age { background: var(--bg2); border-color: var(--border); border-radius: 7px; color: var(--text); font-size: 14px; }
html[data-design="club"] .team-questions { border: 0; border-top: 1px solid var(--border); border-radius: 0; background: none; padding: 24px 0 0; gap: 24px; }
html[data-design="club"] .team-questions-title { color: var(--text); font-size: 17px; font-weight: 800; text-transform: none; letter-spacing: -.01em; }
html[data-design="club"] .team-status-panel { border: 0; border-radius: 0; background: none; padding: 0; }
html[data-design="club"] .team-status-row { padding: 16px 0; border-bottom: 1px solid var(--border); gap: 16px; }
html[data-design="club"] .team-status-name { font-size: 14px; color: var(--text); }
html[data-design="club"] .team-status-meta { font-size: 12px; color: var(--text2); }
html[data-design="club"] .sec-hdr-mascot { align-items: center; gap: 28px; margin-bottom: 40px; }
html[data-design="club"] .sec-hdr-mascot .sec-hdr-row { margin-bottom: 0; }
html[data-design="club"] .hdr-mascot { width: 140px; max-width: 20vw; margin: 0; filter: none; animation: none; }
html[data-design="club"] .hdr-mascot-wide { width: 210px; }
html[data-design="club"] .sec-owl { width: 64px; height: 64px; filter: none; animation: none; }

/* The page builder shares the public composition; authored colors and crops remain inline. */
html[data-design="club"] .cms-builder-sec { padding-block: clamp(40px, 5vw, 76px); }
html[data-design="club"] .cms-builder-container { display: grid; gap: 32px; min-width: 0; margin-inline: auto; }
html[data-design="club"] .cms-container-narrow { max-width: 760px; }
html[data-design="club"] .cms-container-wide { max-width: 1200px; }
html[data-design="club"] .cms-container-full { max-width: none; }
html[data-design="club"] :is(.cms-container-muted, .cms-container-accent) { padding: clamp(24px, 3.4vw, 48px); border: 1px solid var(--border); border-radius: 12px; background: var(--bg2); }
html[data-design="club"] .cms-container-accent { border-top: 3px solid var(--accent); border-radius: 0; }
html[data-design="club"] .cms-builder-heading { max-width: var(--club-read-width); margin-inline: auto; }
html[data-design="club"] .cms-builder-heading .sec-tag { display: block; margin: 0 0 16px; color: var(--text2); font-family: var(--font); font-size: 13px; font-weight: 700; letter-spacing: .04em; line-height: 1.5; text-transform: none; }
html[data-design="club"] .cms-builder-heading :is(h1, h2).sec-title { font-size: clamp(32px, 4.2vw, 60px); }
html[data-design="club"] .cms-builder-heading h3.sec-title { font-size: clamp(26px, 3vw, 40px); }
html[data-design="club"] .cms-builder-heading h4.sec-title { font-family: var(--font); font-size: 22px; line-height: 1.3; }
html[data-design="club"] .cms-builder-paragraph { max-width: var(--club-read-width); margin-inline: auto; color: var(--text2); font-size: 16px; line-height: 1.8; overflow-wrap: anywhere; }
html[data-design="club"] .cms-builder-image { max-width: 1200px; margin: 0 auto; }
html[data-design="club"] .cms-builder-image img { display: block; width: 100%; max-height: 740px; border: 0; border-radius: 8px; background: var(--bg2); }
html[data-design="club"] .cms-builder-image figcaption { margin-top: 12px; color: var(--text2); font-size: 13px; line-height: 1.5; text-align: left; }
html[data-design="club"] .cms-builder-actions { display: flex; flex-wrap: wrap; gap: 12px; justify-content: flex-start; max-width: var(--club-read-width); margin-inline: auto; }
html[data-design="club"] .cms-builder-cardgrid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 250px), 1fr)); gap: 24px 40px; max-width: var(--club-content-width); margin-inline: auto; }
html[data-design="club"] .cms-builder-cardgrid .team-ov-card { padding: 24px 0; border: 0; border-top: 1px solid var(--border); border-radius: 0; background: none; }
html[data-design="club"] .cms-builder-cardgrid .team-ov-card h3 { font-size: 20px; }
html[data-design="club"] .cms-builder-stats { max-width: 1200px; margin-inline: auto; }
html[data-design="club"] .cms-builder-container :is(.cms-builder-heading, .cms-builder-paragraph, .cms-builder-actions, .cms-builder-stats, .cms-builder-cardgrid, .cms-builder-image, .cms-page-body) { width: 100%; }

/* Real people form a roster, with all names and roles visible on touch. */
html[data-design="club"] .members-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 32px; perspective: none; }
html[data-design="club"] .mcard { display: flex; flex-direction: column; gap: 16px; padding: 0 0 24px; border: 0; border-bottom: 1px solid var(--border); border-radius: 0; background: none; box-shadow: none; transform: none; scale: 1; overflow: visible; transition: none; }
html[data-design="club"] .mcard:is(:hover, :active) { background: none; border-color: var(--border); box-shadow: none; transform: none; scale: 1; }
html[data-design="club"] .mcard::before,
html[data-design="club"] .mcard::after,
html[data-design="club"] .mcard .mcard-photo-wrap::before,
html[data-design="club"] .mcard .mcard-photo-wrap::after { display: none; animation: none; }
html[data-design="club"] .mcard .mcard-photo-wrap { aspect-ratio: 4 / 5; border: 0; border-radius: 8px; background: var(--bg2); box-shadow: none; overflow: hidden; }
html[data-design="club"] .mcard .mcard-photo { transform: none; filter: none; transition: none; }
html[data-design="club"] .mcard:hover .mcard-photo { transform: none; filter: none; }
html[data-design="club"] .mcard-photo-fallback { display: flex; align-items: center; justify-content: center; background: var(--bg2); color: var(--text); font-family: var(--font); font-size: 48px; font-weight: 800; }
html[data-design="club"] .mcard-body { display: flex; flex-direction: column; align-items: flex-start; gap: 6px; padding: 0; text-align: left; }
html[data-design="club"] .mcard-name { font-family: var(--font); color: var(--text); font-size: 20px; font-weight: 800; line-height: 1.3; letter-spacing: -.02em; text-transform: none; overflow-wrap: anywhere; }
html[data-design="club"] .mcard-role { color: var(--text2); font-size: 14px; line-height: 1.5; }
html[data-design="club"] .mcard-game { margin-top: 6px; padding: 5px 10px; border: 1px solid var(--border); border-radius: 5px; background: var(--bg2); color: var(--text2); font-family: var(--font); font-size: 12px; letter-spacing: 0; text-transform: none; }
html[data-design="club"] .members-group-title { margin: 48px 0 24px; padding: 0; color: var(--text); font-family: var(--club-section-heading-font); font-size: 26px; line-height: 1.2; letter-spacing: -.02em; text-transform: none; }
html[data-design="club"] .members-group-title::before,
html[data-design="club"] .members-group-title::after { display: none; }
html[data-design="club"] .members-group-title:first-child { margin-top: 0; }
html[data-design="club"] .nd-enter .mcard { animation: none; }

/* Custom CMS slides keep their authored media and active-slide contract. */
html[data-design="club"] .hero-slider { min-height: 0; background: var(--bg2); }
html[data-design="club"] .hero-slider::before { display: none; }
html[data-design="club"] .hero-slider-track { display: grid; height: auto; min-height: clamp(480px, calc(100svh - var(--nav-h)), 720px); }
html[data-design="club"] .hero-slide { position: relative; grid-area: 1 / 1; transition: opacity 220ms var(--club-ease); will-change: auto; }
html[data-design="club"] .hero-slide-inner { max-width: var(--club-content-width); padding: 56px clamp(72px, 7vw, 112px) 96px; gap: 24px; }
html[data-design="club"] .hero-slide-title { color: inherit; font-family: var(--club-section-heading-font); font-size: clamp(40px, 5vw, 72px); font-weight: 400; line-height: 1.08; letter-spacing: -.025em; text-shadow: none; text-transform: none; overflow-wrap: anywhere; }
html[data-design="club"] .hero-slide-sub { color: inherit; font-family: var(--font); font-size: clamp(16px, 1.4vw, 21px); font-weight: 500; line-height: 1.6; opacity: 1; text-shadow: none; }
html[data-design="club"] .hero-slide:is(.is-active, .is-shown) :is(.hero-slide-title, .hero-slide-sub, .hero-slide-cta) { animation: none; }
html[data-design="club"] .hero-slide-cta::after { display: none; }
html[data-design="club"] :is(.hero-slider-arrow, .section-band-arrow, .shop-slider-arrow) { width: 44px; height: 44px; border: 1px solid #8a8e8c; border-radius: 8px; background: #181919; color: #f6f5f5; opacity: 1; box-shadow: none; backdrop-filter: none; transition: background-color 180ms var(--club-ease); }
html[data-design="club"] :is(.hero-slider-arrow, .section-band-arrow):focus-visible { outline: 2px solid currentColor; outline-offset: 3px; }
html[data-design="club"] .hero-slider-prev { left: 20px; }
html[data-design="club"] .hero-slider-next { right: 20px; }
html[data-design="club"] :is(.hero-slider-dots, .section-band-dots) { bottom: 12px; gap: 8px; }
html[data-design="club"] :is(.hero-slider-dot, .section-band-dot) { width: 44px; height: 44px; border: 0; border-radius: 0; background: none; padding: 0; overflow: visible; transition: none; }
html[data-design="club"] :is(.hero-slider-dot, .section-band-dot).is-active { width: 64px; background: none; }
html[data-design="club"] :is(.hero-slider-dot, .section-band-dot)::before { content: ""; position: absolute; top: 20px; left: 0; right: 0; height: 4px; border-radius: 2px; background: #f6f5f5; box-shadow: 0 0 0 1px #181919; }
html[data-design="club"] :is(.hero-dot-fill, .section-band-dot-fill) { top: 20px; bottom: auto; height: 4px; border-radius: 2px; background: var(--accent); }
html[data-design="club"] .section-band { isolation: isolate; }
html[data-design="club"] .section-band-inner { max-width: 1000px; padding: 36px 72px 56px; gap: 18px; }
html[data-design="club"] .section-band-title { color: inherit; font-family: var(--club-section-heading-font); font-size: clamp(28px, 3.8vw, 52px); font-weight: 400; line-height: 1.15; text-shadow: none; }
html[data-design="club"] .section-band-sub { color: inherit; font-family: var(--font); font-size: 16px; line-height: 1.65; opacity: 1; text-shadow: none; }
html[data-design="club"] :is(.section-band-slogans, .section-band-marquee) { background: var(--band-background, var(--bg2)); }
html[data-design="club"] .section-band-slogan { font-family: var(--club-section-heading-font); font-size: clamp(28px, 3.8vw, 52px); font-weight: 400; line-height: 1.2; text-shadow: none; }
html[data-design="club"] .section-band-slogan .slogan-item { color: inherit; }
html[data-design="club"] .section-band-slide { transition: opacity 220ms var(--club-ease); will-change: auto; }
html[data-design="club"] :is(.hero-slide-bg, .section-band-bg, .section-band-slides) { transition: opacity 180ms var(--club-ease); }
html[data-design="club"] .section-band-prev { left: 16px; }
html[data-design="club"] .section-band-next { right: 16px; }
html[data-design="club"] .marquee { mask-image: none; -webkit-mask-image: none; }
html[data-design="club"] .marquee-group { gap: 48px; padding-right: 48px; }
html[data-design="club"] .marquee-item { height: 64px; color: inherit; opacity: 1; filter: none; transition: none; }
html[data-design="club"] .marquee-logo-text { color: inherit; font-family: var(--font); font-size: 18px; font-weight: 800; }

/* Games, seasons and partners are directories and real media, not imitation tiles. */
html[data-design="club"] .games-page-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 32px 48px; }
html[data-design="club"] .game-page-card { padding: 28px 0 0; border: 0; border-top: 1px solid var(--border); border-radius: 0; background: none; }
html[data-design="club"] .game-page-header { align-items: center; gap: 20px; margin-bottom: 24px; }
html[data-design="club"] .game-page-icon { width: 56px; height: 56px; border: 1px solid var(--border); border-radius: 8px; background: var(--bg2); color: var(--text); font-family: var(--font); box-shadow: none; }
html[data-design="club"] .game-page-name { font-family: var(--club-section-heading-font); font-size: 28px; line-height: 1.2; letter-spacing: -.02em; }
html[data-design="club"] .game-teams-list { gap: 0; }
html[data-design="club"] .game-team-row { min-height: 64px; padding: 16px 0; border: 0; border-bottom: 1px solid var(--border); border-radius: 0; background: none; color: var(--text); gap: 16px; }
html[data-design="club"] .game-team-row > :first-child { min-width: 0; overflow-wrap: anywhere; }
html[data-design="club"] .teams-overview { gap: 48px; }
html[data-design="club"] .game-group-title { font-family: var(--club-section-heading-font); font-size: 28px; font-weight: 400; line-height: 1.2; text-transform: none; }
html[data-design="club"] .team-accordion { gap: 0; }
html[data-design="club"] .team-acc { border: 0; border-bottom: 1px solid var(--border); border-radius: 0; background: none; }
html[data-design="club"] .team-acc.is-open { border-color: var(--border); }
html[data-design="club"] .team-acc-head { min-height: 88px; padding: 20px 0; gap: 20px; }
html[data-design="club"] .tacc-name { font-family: var(--font); font-size: 18px; }
html[data-design="club"] .tacc-count { font-size: 13px; color: var(--text2); }
html[data-design="club"] .team-acc-panel { padding: 24px 0; }
html[data-design="club"] .tpr-label { color: var(--text2); font-size: 12px; text-transform: none; letter-spacing: 0; }
html[data-design="club"] .tpr-value { font-size: 15px; }
html[data-design="club"] .tpr-social a { color: var(--text); text-decoration: underline; }
html[data-design="club"] .team-panel-roster-title { color: var(--text); font-size: 18px; letter-spacing: 0; text-transform: none; }
html[data-design="club"] .dl-list { display: grid; gap: 48px; }
html[data-design="club"] .dl-card { border: 0; border-top: 3px solid var(--accent); border-radius: 0; background: none; overflow: visible; }
html[data-design="club"] .dl-banner { height: clamp(200px, 24vw, 340px); border-radius: 0 0 8px 8px; }
html[data-design="club"] .dl-banner::after { display: none; }
html[data-design="club"] .dl-body { padding: 28px 0 0; }
html[data-design="club"] .dl-meta { gap: 8px; margin-bottom: 18px; }
html[data-design="club"] :is(.dl-season, .dl-game, .dl-date) { padding: 6px 12px; border: 1px solid var(--border); border-radius: 5px; background: var(--bg2); color: var(--text2); font-family: var(--font); font-size: 12px; line-height: 1.4; letter-spacing: 0; }
html[data-design="club"] .dl-season { color: var(--text); font-weight: 800; }
html[data-design="club"] .dl-title { max-width: 26ch; font-family: var(--club-section-heading-font); font-size: clamp(28px, 3vw, 42px); font-weight: 400; line-height: 1.18; margin-bottom: 16px; }
html[data-design="club"] .dl-desc { max-width: var(--club-read-width); color: var(--text2); font-size: 16px; line-height: 1.75; margin-bottom: 24px; }
html[data-design="club"] .dl-winner { gap: 20px; padding: 24px 0; border: 0; border-block: 1px solid var(--border); border-radius: 0; background: none; }
html[data-design="club"] .dl-winner-logo { width: 64px; height: 64px; border: 1px solid var(--border); border-radius: 8px; }
html[data-design="club"] .dl-winner-label { font-size: 12px; letter-spacing: 0; text-transform: none; color: var(--text2); }
html[data-design="club"] .dl-winner-name { color: var(--text); font-family: var(--font); font-size: 20px; }
html[data-design="club"] .dl-winner-note { color: var(--text2); font-size: 14px; line-height: 1.6; }
html[data-design="club"] .dl-detail-banner { height: clamp(240px, 30vw, 460px); }
html[data-design="club"] .dl-detail-title { font-size: clamp(34px, 4vw, 56px); }
html[data-design="club"] .video-embed { border-radius: 8px; }
html[data-design="club"] .video-consent { height: auto; min-height: 260px; padding: 36px; border: 1px solid var(--border); background: var(--bg2); }
html[data-design="club"] .video-consent-body { position: relative; inset: auto; gap: 20px; padding: 0; }
html[data-design="club"] .video-consent-text { color: var(--text2); font-size: 15px; line-height: 1.7; opacity: 1; }
html[data-design="club"] .video-consent-remember { gap: 12px; color: var(--text2); font-size: 13px; line-height: 1.5; opacity: 1; }
html[data-design="club"] .sponsors-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 48px; }
html[data-design="club"] .spcard { display: flex; align-items: flex-start; gap: 24px; min-width: 0; padding: 28px 0; border: 0; border-bottom: 1px solid var(--border); border-radius: 0; background: none; }
html[data-design="club"] .sp-logo { width: 72px; height: 72px; flex: 0 0 auto; border: 1px solid var(--border); border-radius: 8px; background: var(--bg2); color: var(--text); font-family: var(--font); box-shadow: none; }
html[data-design="club"] .sp-logo-img { width: 72px; height: 72px; max-width: 72px; object-fit: contain; }
html[data-design="club"] .sp-name { color: var(--text); font-family: var(--font); font-size: 21px; line-height: 1.35; }
html[data-design="club"] .sp-tier { margin-top: 6px; color: var(--text2); font-size: 12px; letter-spacing: .03em; text-transform: none; }
html[data-design="club"] .sp-desc { margin-top: 12px; color: var(--text2); font-size: 15px; line-height: 1.65; }
html[data-design="club"] .sp-code { padding: 7px 10px; border: 1px solid var(--border); border-radius: 5px; background: var(--bg2); color: var(--text); font-size: 13px; overflow-wrap: anywhere; }
html[data-design="club"] .shop-slider { border: 1px solid var(--border); border-radius: 12px; background: var(--bg2); margin-bottom: 40px; }
html[data-design="club"] .shop-promo { gap: 40px; padding: 40px 76px 64px; transition: opacity 220ms var(--club-ease); }
html[data-design="club"] .shop-promo-img { width: 240px; height: 240px; border-radius: 8px; }
html[data-design="club"] .shop-promo-shop { padding: 6px 10px; border: 1px solid var(--border); border-radius: 5px; background: var(--bg); color: var(--text); font-family: var(--font); font-size: 12px; font-weight: 700; letter-spacing: .02em; text-transform: none; }
html[data-design="club"] .shop-promo-text h3 { color: var(--text); font-family: var(--club-section-heading-font); font-size: clamp(28px, 3vw, 40px); font-weight: 400; line-height: 1.2; }
html[data-design="club"] .shop-promo-text p { max-width: 60ch; color: var(--text2); font-size: 16px; line-height: 1.7; }
html[data-design="club"] .shop-slider-dots { bottom: 8px; gap: 4px; }
html[data-design="club"] .shop-slider-dot { position: relative; width: 44px; height: 44px; padding: 0; border-radius: 0; background: none; transition: none; }
html[data-design="club"] .shop-slider-dot::before { content: ""; position: absolute; inset: 19px 8px; border-radius: 3px; background: var(--text3); }
html[data-design="club"] .shop-slider-dot.is-active { width: 44px; background: none; }
html[data-design="club"] .shop-slider-dot.is-active::before { background: var(--text); }

/* Tournament data keeps dense tables and a local, horizontally scrollable bracket. */
html[data-design="club"] .tourn-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 48px; }
html[data-design="club"] .tourn-card { padding: 24px 0; border: 0; border-bottom: 1px solid var(--border); border-radius: 0; background: none; }
html[data-design="club"] .tourn-card-head { align-items: flex-start; gap: 20px; margin-bottom: 12px; }
html[data-design="club"] .tourn-name { font-family: var(--font); font-size: 22px; line-height: 1.35; overflow-wrap: anywhere; }
html[data-design="club"] .tourn-meta { font-size: 14px; line-height: 1.6; color: var(--text2); }
html[data-design="club"] .tourn-badge { display: inline-flex; align-items: center; min-height: 28px; border-radius: 5px; padding: 5px 10px; color: var(--tourn-status-color, var(--text2)); background: color-mix(in srgb, var(--tourn-status-color, var(--text2)) 13%, var(--bg)); font-family: var(--font); font-size: 12px; font-weight: 700; text-transform: none; letter-spacing: 0; vertical-align: middle; }
html[data-design="club"] .tourn-back { min-height: 44px; padding-block: 12px; color: var(--text); text-decoration: underline; }
html[data-design="club"] .tourn-stage { margin-top: 40px; }
html[data-design="club"] .tourn-stage > h3 { display: flex; flex-wrap: wrap; align-items: baseline; gap: 12px; color: var(--text); font-family: var(--club-section-heading-font); font-size: 26px; font-weight: 400; line-height: 1.3; margin-bottom: 20px; }
html[data-design="club"] .tourn-stage h3 small { color: var(--text2); font-family: var(--font); font-size: 13px; line-height: 1.5; }
html[data-design="club"] .brk-rounds { gap: 32px; padding: 12px 0 24px; overscroll-behavior-inline: contain; scrollbar-color: var(--text3) var(--bg2); }
html[data-design="club"] .brk-col { min-width: 240px; gap: 16px; }
html[data-design="club"] .brk-col h4 { color: var(--text2); font-family: var(--font); font-size: 13px; font-weight: 700; letter-spacing: 0; text-transform: none; }
html[data-design="club"] .brk-match { border-color: var(--border); border-radius: 8px; background: var(--card); }
html[data-design="club"] .brk-slot { min-height: 44px; align-items: center; gap: 24px; padding: 12px 16px; color: var(--text); font-size: 14px; }
html[data-design="club"] .brk-slot.win { background: color-mix(in srgb, var(--green) 9%, var(--card)); color: var(--green); }
html[data-design="club"] :is(.tourn-table-wrap, .privacy-table-wrap) { overflow-x: auto; overscroll-behavior-inline: contain; margin-top: 24px; }
html[data-design="club"] :is(.tourn-table, .privacy-table) { width: 100%; border-collapse: collapse; font-size: 14px; }
html[data-design="club"] :is(.tourn-table, .privacy-table) :is(th, td) { padding: 14px 16px; border: 0; border-bottom: 1px solid var(--border); vertical-align: top; color: var(--text); line-height: 1.6; }
html[data-design="club"] :is(.tourn-table, .privacy-table) th { background: var(--bg2); color: var(--text2); font-weight: 700; }
html[data-design="club"] .tourn-table { font-variant-numeric: tabular-nums; }
html[data-design="club"] .tourn-live { gap: 24px; padding: 20px 0; border: 0; border-block: 1px solid var(--border); border-radius: 0; background: none; }
html[data-design="club"] .tourn-live-label { font-family: var(--font); font-size: 13px; text-transform: none; letter-spacing: 0; }
html[data-design="club"] .tlt-track { min-width: 0; padding-block: 4px; gap: 32px; overscroll-behavior-inline: contain; }
html[data-design="club"] .tlt-item { font-size: 14px; font-variant-numeric: tabular-nums; }
html[data-design="club"] .tlt-vs { color: var(--text); }
html[data-design="club"] .tpart-grid { grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 0 32px; }
html[data-design="club"] .tpart-card { padding: 20px 0; gap: 6px; border: 0; border-bottom: 1px solid var(--border); border-radius: 0; background: none; }
html[data-design="club"] .tpart-name { font-size: 16px; line-height: 1.4; }
html[data-design="club"] .tpart-meta { font-size: 13px; line-height: 1.5; }
html[data-design="club"] .tip-widget { gap: 20px; padding: 24px; border: 1px solid var(--border); border-radius: 12px; background: var(--bg2); }
html[data-design="club"] .tip-widget p { font-size: 14px; line-height: 1.7; }
html[data-design="club"] .tip-widget code { padding: 4px 8px; border: 1px solid var(--border); border-radius: 5px; background: var(--card); color: var(--text); overflow-wrap: anywhere; }

/* Form and article additions carry real context without blocking the main task. */
html[data-design="club"] .club-form-shell.club-form-single { grid-template-columns: minmax(0, 760px); }
html[data-design="club"] .club-contact-aside a { display: inline-block; padding-block: 8px; color: var(--text); font-size: 16px; }
html[data-design="club"] .club-article { max-width: 1120px; margin-inline: auto; }
html[data-design="club"] .club-article > :is(h1, .ncard-meta, .club-article-lede, .article-body) { max-width: var(--club-read-width); margin-inline: auto; }
html[data-design="club"] .club-article > h1 { margin-bottom: 24px; }
html[data-design="club"] .club-article > .ncard-meta { margin-bottom: 32px; }
html[data-design="club"] .club-article-media { margin: 32px 0 40px; }
html[data-design="club"] .club-article-media img { display: block; width: 100%; height: auto; max-height: 640px; border-radius: 8px; background: var(--bg2); }
html[data-design="club"] .club-article-lede { color: var(--text); font-size: clamp(18px, 1.7vw, 24px); font-weight: 500; line-height: 1.65; margin-bottom: 32px; }
html[data-design="club"] .club-zoom-control { display: inline-flex; flex: 0 0 auto; padding: 0; border: 0; border-radius: 12px; background: none; line-height: 0; cursor: zoom-in; }
html[data-design="club"] .club-zoom-control:focus-visible { outline: 2px solid var(--text); outline-offset: 4px; }
html[data-design="club"] .club-zoom-control .pp-hero-photo { margin: 0; }
html[data-design="club"] .club-icon { display: inline-block; flex: 0 0 auto; width: 24px; height: 24px; max-width: 64px; max-height: 64px; vertical-align: middle; color: inherit; }
html[data-design="club"] .cms-builder-heading { display: flex; flex-direction: column; }
html[data-design="club"] .cms-builder-heading .sec-title { order: 1; }
html[data-design="club"] .cms-builder-heading .sec-tag { order: 2; margin: 16px 0 0; }
html[data-design="club"] .cms-builder-heading .sec-sub { order: 3; }

/* A clear final invitation and a compact destination directory. */
html[data-design="club"] .join-strip { padding: 64px var(--club-gutter); border-block: 1px solid var(--border); background: var(--bg2); text-align: left; }
html[data-design="club"] .join-strip::before { display: none; }
html[data-design="club"] .join-strip-band { background-image: none; }
html[data-design="club"] .join-inner { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; column-gap: 48px; max-width: var(--club-content-width); }
html[data-design="club"] .join-strip h2 { grid-column: 1; margin-bottom: 16px; color: var(--text); background: none; -webkit-text-fill-color: currentColor; font-family: var(--club-section-heading-font); font-size: clamp(32px, 4vw, 58px); font-weight: 400; line-height: 1.12; letter-spacing: -.025em; }
html[data-design="club"] .join-strip p { grid-column: 1; max-width: 64ch; margin: 0; color: var(--text2); font-size: 16px; line-height: 1.7; }
html[data-design="club"] .join-inner > button { grid-column: 2; grid-row: 1 / 3; }
html[data-design="club"] .cms-cta-actions { display: flex; flex-wrap: wrap; grid-column: 2; grid-row: 1 / 3; gap: 12px; align-items: center; justify-content: flex-start; }
html[data-design="club"] footer { padding: 64px var(--club-gutter) 28px; border-top: 1px solid var(--border); background: var(--bg2); }
html[data-design="club"] .footer-inner { max-width: var(--club-content-width); }
html[data-design="club"] .footer-top,
html[data-design="club"] .footer-top.compact-footer { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr) minmax(0, 1fr); gap: 48px; margin-bottom: 48px; }
html[data-design="club"] .club-footer-logo { display: block; width: 72px; height: 72px; object-fit: contain; margin: -8px 0 12px -8px; filter: none; }
html[data-design="club"] .footer-brand-name { color: var(--text); font-family: var(--club-section-heading-font); font-size: 26px; font-weight: 400; line-height: 1.2; letter-spacing: -.02em; margin-bottom: 16px; }
html[data-design="club"] .footer-brand-sub { max-width: 38ch; color: var(--text2); font-family: var(--font); font-size: 14px; line-height: 1.7; margin-bottom: 24px; }
html[data-design="club"] .footer-socials { flex-wrap: wrap; gap: 8px; }
html[data-design="club"] .fsoc { width: 44px; height: 44px; border: 1px solid var(--border2); border-radius: 7px; background: none; color: var(--text); box-shadow: none; }
html[data-design="club"] .footer-col h4 { color: var(--text); font-family: var(--font); font-size: 14px; font-weight: 800; line-height: 1.5; letter-spacing: 0; text-transform: none; margin-bottom: 16px; }
html[data-design="club"] .footer-col :is(a, button) { display: block; max-width: 100%; min-height: 44px; padding: 11px 0; border: 0; background: none; color: var(--text2); font-family: var(--font); font-size: 14px; line-height: 1.5; overflow-wrap: anywhere; text-align: left; }
html[data-design="club"] .footer-bottom { padding-top: 24px; gap: 16px 24px; color: var(--text2); font-size: 12px; line-height: 1.6; }

/* Overlays retain their open/closed states and keep every dismissal target reachable. */
html[data-design="club"] :is(.modal-ov, .pmodal-backdrop, .nd-lightbox) { background: rgb(0 0 0 / .72); backdrop-filter: none; transition: opacity 180ms var(--club-ease), visibility 0s linear 180ms; }
html[data-design="club"] :is(.modal-ov.open, .pmodal-backdrop.is-open, .nd-lightbox.is-open) { transition: opacity 180ms var(--club-ease), visibility 0s; }
html[data-design="club"] .modal-box { padding: 32px; border: 1px solid var(--border); border-radius: 12px; background: var(--bg); color: var(--text); transform: none; box-shadow: none; transition: none; }
html[data-design="club"] .modal-ov.open .modal-box { transform: none; transition: none; }
html[data-design="club"] .ext-dialog { max-width: 560px; }
html[data-design="club"] .ext-dialog h3 { margin: 0 40px 16px 0; font-family: var(--font); color: var(--text); font-size: 24px; font-weight: 800; line-height: 1.3; letter-spacing: -.02em; }
html[data-design="club"] .ext-dialog p { color: var(--text2); font-size: 15px; line-height: 1.7; }
html[data-design="club"] .ext-dialog-url { padding: 12px 14px; border: 1px solid var(--border); border-radius: 7px; background: var(--bg2); color: var(--text); font-size: 13px; line-height: 1.6; overflow-wrap: anywhere; word-break: normal; }
html[data-design="club"] .ext-dialog-actions { gap: 12px; margin-top: 28px; }
html[data-design="club"] :is(.modal-cls, .pmodal-close) { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; top: 12px; right: 12px; border: 1px solid var(--border); border-radius: 7px; background: var(--bg2); color: var(--text); font-size: 22px; line-height: 1; transition: background-color 180ms var(--club-ease); }
html[data-design="club"] .pmodal { padding: 32px; border: 1px solid var(--border); border-radius: 12px; background: var(--bg); color: var(--text); box-shadow: none; transform: none; transition: none; }
html[data-design="club"] .pmodal-backdrop.is-open .pmodal { transform: none; transition: none; }
html[data-design="club"] .pmodal-hero { padding-right: 24px; gap: 24px; margin-bottom: 24px; }
html[data-design="club"] .pmodal-photo { border: 1px solid var(--border); border-radius: 8px; }
html[data-design="club"] .pmodal-ign { font-family: var(--font); font-size: 26px; font-weight: 800; line-height: 1.3; overflow-wrap: anywhere; }
html[data-design="club"] .pmodal-name { color: var(--text2); font-size: 15px; }
html[data-design="club"] .pmodal-bio { color: var(--text2); font-size: 15px; line-height: 1.75; }
html[data-design="club"] .pmodal-meta { color: var(--text2); font-size: 13px; line-height: 1.6; }
html[data-design="club"] .pmodal-social { gap: 12px 24px; }
html[data-design="club"] .pmodal-social a { padding-block: 10px; color: var(--text); font-size: 14px; text-decoration: underline; }
html[data-design="club"] .nd-lightbox-img { border-radius: 8px; box-shadow: none; transform: none; transition: none; }
html[data-design="club"] .nd-lightbox.is-open .nd-lightbox-img { transform: none; transition: none; }
html[data-design="club"] .nd-lightbox-close { border: 1px solid #8a8e8c; border-radius: 8px; background: #181919; color: #f6f5f5; }
html[data-design="club"] #toastZone { gap: 12px; }
html[data-design="club"] .toast { min-width: 280px; border: 1px solid var(--border2); border-left: 1px solid var(--green); border-radius: 8px; background: var(--bg); color: var(--text); padding: 16px 20px; font-size: 14px; line-height: 1.6; box-shadow: var(--shadow-pop); transition: opacity 180ms var(--club-ease); }
html[data-design="club"] .toast.err { border-left-color: var(--red); }
html[data-design="club"] .toast.is-leaving { transform: none; transition: opacity 180ms var(--club-ease); }
@starting-style { html[data-design="club"] .toast { transform: none; opacity: 0; } }

/* Recovery shares the same quiet paper and readable controls. */
html[data-design="club"] :is(.error-state, .maintenance-state) { max-width: 620px; padding: 64px 24px; }
html[data-design="club"] :is(.error-title, .maint-title, .empty-state h3, .nd-notfound h3) { color: var(--text); font-family: var(--club-section-heading-font); font-size: clamp(26px, 3vw, 38px); font-weight: 400; line-height: 1.25; letter-spacing: -.02em; }
html[data-design="club"] :is(.error-text, .maint-text) { color: var(--text2); font-size: 16px; line-height: 1.75; }
html[data-design="club"] :is(.error-owl, .maint-logo, .maint-owl) { width: 132px; height: 132px; object-fit: contain; filter: none; animation: none; }
html[data-design="club"] .error-icon-wobble { width: 72px; height: 72px; border: 1px solid var(--border); border-radius: 8px; background: var(--bg2); color: var(--text); font-family: var(--font); box-shadow: none; animation: none; }
html[data-design="club"] .error-detail { max-width: 100%; padding: 10px 16px; border: 1px solid var(--border); border-radius: 7px; background: var(--bg2); color: var(--text); font-size: 13px; line-height: 1.6; overflow-wrap: anywhere; }
html[data-design="club"] .error-contact { color: var(--text2); font-size: 14px; line-height: 1.7; }
html[data-design="club"] .error-mail { color: var(--text); text-decoration: underline; overflow-wrap: anywhere; }
html[data-design="club"] .maint-pulse { display: none; }
html[data-design="club"] .maint-dots span { width: 7px; height: 7px; background: var(--text2); animation: none; }
html[data-design="club"] :is(.empty-state, .nd-notfound) { padding: 48px 24px; color: var(--text2); }
html[data-design="club"] :is(.empty-state, .nd-notfound) p { max-width: 60ch; margin-inline: auto; font-size: 15px; line-height: 1.7; }
html[data-design="club"] #nd-splash { background: var(--bg); transition: opacity 180ms var(--club-ease), visibility 0s linear 180ms; }
html[data-design="club"] .nd-splash-logo { opacity: 1; animation: none; }
html[data-design="club"] .nd-splash-pulse { display: none; }
html[data-design="club"] .nd-splash-bar { height: 3px; background: var(--border); }
html[data-design="club"] .nd-splash-bar span { background: var(--text); }

/* Content is visible before observers run; animation is reserved for actual state changes. */
html[data-design="club"] :is(.nd-reveal, .nd-reveal.nd-visible) { opacity: 1; animation: none; transform: none; }
html[data-design="club"] .nd-stagger.nd-visible > *,
html[data-design="club"] .nd-enter .bento-grid .thub-card,
html[data-design="club"] .apply-body.is-revealed { animation: none; }
html[data-design="club"] :is(.hero-logo, .thub-mascot, .hdr-mascot, .sec-owl) { animation: none; }
html[data-design="club"] .slogan-rotator .slogan-item { filter: none; transition: opacity 180ms var(--club-ease); }
html[data-design="club"] :is(.thub-card.is-hidden, .thub-shelf.is-hidden) { display: none; }
html[data-design="club"] [hidden] { display: none !important; }

@media (hover: hover) and (pointer: fine) {
  html[data-design="club"] :is(.tcard, .ncard, .match-card, .acard, .spcard, .game-page-card, .live-ticker-card, .tourn-card):hover { transform: none; scale: 1; box-shadow: none; }
  html[data-design="club"] :is(.btn-white, .btn-admin, .hero-slide-cta, .section-band-cta, .shop-promo-cta):hover { transform: none; scale: 1; filter: brightness(.95); box-shadow: none; }
  html[data-design="club"] :is(.hero-slider-arrow, .section-band-arrow, .shop-slider-arrow):hover { background: #333637; border-color: #8a8e8c; transform: translateY(-50%); }
  html[data-design="club"] :is(.hero-slider-dot, .section-band-dot, .shop-slider-dot):hover { background: none; }
  html[data-design="club"] .hero-slide-cta:hover .hero-cta-arrow { transform: none; }
  html[data-design="club"] .marquee-item:hover { opacity: 1; filter: none; transform: none; }
  html[data-design="club"] .game-team-row:hover { border-color: var(--border); background: var(--bg2); }
  html[data-design="club"] .team-acc-head:hover { background: var(--bg2); }
  html[data-design="club"] :is(.modal-cls, .pmodal-close):hover { border-color: var(--border2); background: var(--bg3); color: var(--text); }
  html[data-design="club"] .nd-lightbox-close:hover { background: #333637; }
  html[data-design="club"] .fsoc:hover { border-color: var(--border2); background: var(--bg3); color: var(--text); transform: none; }
  html[data-design="club"] .footer-col :is(a, button):hover { color: var(--text); text-decoration: underline; }
  html[data-design="club"] .pp-hero-photo.is-zoomable:hover { transform: none; }
}

/* Narrower layouts change their reading order, while dense data scrolls locally. */
@media (max-width: 1120px) {
  html[data-design="club"] .club-form-shell { grid-template-columns: minmax(0, 1fr) 280px; gap: 36px; }
  html[data-design="club"] .thub-intro { grid-template-columns: minmax(0, 1fr) 200px; gap: 24px; }
  html[data-design="club"] .thub-mascot { width: 200px; }
  html[data-design="club"] :is(.teams-grid, .bento-grid) { column-gap: 24px; }
  html[data-design="club"] :is(.tcard, .thub-card) { grid-template-columns: 88px minmax(0, 1fr); gap: 20px; }
  html[data-design="club"] :is(.tcard, .thub-card) .tcard-banner { width: 88px; min-height: 88px; }
  html[data-design="club"] .shop-promo { gap: 28px; }
  html[data-design="club"] .shop-promo-img { width: 190px; height: 190px; }
}
@media (max-width: 980px) {
  html[data-design="club"] :is(.about-layout, .team-overview-grid, .club-form-shell) { grid-template-columns: minmax(0, 1fr); gap: 40px; }
  html[data-design="club"] .club-form-aside { position: static; max-width: 760px; }
  html[data-design="club"] .club-form-main { max-width: 760px; }
  html[data-design="club"] .news-grid .ncard { grid-template-columns: 64px minmax(0, 1fr); gap: 20px; }
  html[data-design="club"] .news-grid .ncard-footer { grid-column: 2; flex-direction: row; align-items: center; justify-content: space-between; gap: 16px; padding-top: 0; }
  html[data-design="club"] .news-grid .ncard-thumb { width: 64px; height: 64px; }
  html[data-design="club"] .ecard { grid-template-columns: 80px minmax(0, 1fr); }
  html[data-design="club"] .ecard .stack-actions { grid-column: 2; justify-content: flex-start; }
  html[data-design="club"] .footer-top,
  html[data-design="club"] .footer-top.compact-footer { grid-template-columns: minmax(0, 1.5fr) repeat(2, minmax(0, 1fr)); gap: 32px; }
}
@media (max-width: 800px) {
  html[data-design="club"] :is(.games-page-grid, .tourn-grid, .sponsors-row) { grid-template-columns: minmax(0, 1fr); }
  html[data-design="club"] .thub-intro { grid-template-columns: minmax(0, 1fr) 140px; }
  html[data-design="club"] .thub-mascot { width: 140px; }
  html[data-design="club"] .thub-title { font-size: clamp(34px, 6.5vw, 48px); }
  html[data-design="club"] .thub-controls { position: static; }
  html[data-design="club"] .thub-tools { width: 100%; }
  html[data-design="club"] .thub-search { flex: 1; }
  html[data-design="club"] .thub-search-input { width: 100%; max-width: none; font-size: 16px; }
  html[data-design="club"] :is(.teams-grid, .bento-grid) { grid-template-columns: minmax(0, 1fr); }
  html[data-design="club"] .hero-slider-track { min-height: clamp(480px, calc(100svh - var(--nav-h)), 620px); height: auto; }
  html[data-design="club"] .hero-slide-inner { padding-inline: 72px; }
  html[data-design="club"] .hero-slide-title { font-size: clamp(36px, 6vw, 54px); }
  html[data-design="club"] .shop-promo { flex-direction: column; align-items: flex-start; text-align: left; padding: 32px 68px 64px; }
  html[data-design="club"] .shop-promo-img { width: min(100%, 240px); height: 200px; }
  html[data-design="club"] .join-inner { grid-template-columns: minmax(0, 1fr); gap: 24px; }
  html[data-design="club"] .join-inner > button { grid-column: 1; grid-row: auto; justify-self: start; }
  html[data-design="club"] .cms-cta-actions { grid-column: 1; grid-row: auto; }
  html[data-design="club"] .footer-top,
  html[data-design="club"] .footer-top.compact-footer { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 32px; }
  html[data-design="club"] .footer-top > :first-child { grid-column: 1 / -1; }
}
@media (max-width: 640px) {
  html[data-design="club"] .sec { padding: 48px 20px; }
  html[data-design="club"] .sec + .sec { padding-top: 20px; }
  html[data-design="club"] .sec-hdr-row { flex-wrap: wrap; align-items: flex-start; gap: 20px; margin-bottom: 28px; }
  html[data-design="club"] .sec-title { font-size: clamp(30px, 8vw, 40px); }
  html[data-design="club"] .sec-sub { font-size: 15px; }
  html[data-design="club"] .breadcrumb { font-size: 12px; gap: 8px; flex-wrap: wrap; line-height: 1.6; }
  html[data-design="club"] :is(.stats-inner, .stats-mini-grid) { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
  html[data-design="club"] .stat-box { min-width: 0; padding: 0; text-align: left; }
  html[data-design="club"] .stat-num { font-size: 34px; }
  html[data-design="club"] .stat-label { font-size: 12px; }
  html[data-design="club"] :is(.ach-grid, .matches-grid, .team-overview-grid) { grid-template-columns: minmax(0, 1fr); }
  html[data-design="club"] .thub-intro { grid-template-columns: minmax(0, 1fr); padding-top: 12px; gap: 24px; }
  html[data-design="club"] .thub-intro-side { justify-content: flex-start; }
  html[data-design="club"] .thub-mascot { width: 132px; max-height: 132px; }
  html[data-design="club"] .thub-mascot { grid-column: 1; grid-row: auto; }
  html[data-design="club"] .thub-stats { flex-wrap: wrap; gap: 20px 28px; }
  html[data-design="club"] .thub-controls { gap: 16px; padding: 20px 0; }
  html[data-design="club"] .thub-pills { width: 100%; gap: 8px; }
  html[data-design="club"] .thub-pill { min-height: 44px; padding: 10px 13px; font-size: 13px; }
  html[data-design="club"] .thub-tools { flex-wrap: wrap; }
  html[data-design="club"] .thub-meta-row { align-items: flex-start; gap: 12px; }
  html[data-design="club"] .thub-shelf-hdr { gap: 16px; }
  html[data-design="club"] .thub-shelf-title { font-size: 25px; }
  html[data-design="club"] :is(.tcard, .thub-card) { grid-template-columns: 80px minmax(0, 1fr); gap: 16px; padding-block: 24px; }
  html[data-design="club"] :is(.tcard, .thub-card) .tcard-banner { width: 80px; height: 100%; min-height: 80px; }
  html[data-design="club"] :is(.tcard, .thub-card) .tcard-logo-img { width: 64px; height: 64px; }
  html[data-design="club"] :is(.tcard, .thub-card) .tcard-name { font-size: 21px; }
  html[data-design="club"] :is(.tcard, .thub-card) .tcard-desc { font-size: 14px; }
  html[data-design="club"] :is(.tcard, .thub-card) .tcard-foot { flex-wrap: wrap; align-items: center; }
  html[data-design="club"] :is(.td-hero-full, .pp-hero) { padding: 32px 20px; }
  html[data-design="club"] :is(.td-hero-top, .pp-hero-top) { gap: 20px; align-items: flex-start; }
  html[data-design="club"] :is(.td-hero-logo, .td-hero-icon) { width: 88px; height: 88px; }
  html[data-design="club"] .td-hero-name { font-size: 34px; }
  html[data-design="club"] .td-hero-desc { font-size: 15px; }
  html[data-design="club"] .tdh-social { gap: 8px; }
  html[data-design="club"] .tdh-social a { min-height: 44px; }
  html[data-design="club"] .players-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px 16px; }
  html[data-design="club"] .pcard-banner { padding: 16px 12px; }
  html[data-design="club"] .pcard-banner .pign-lg { font-size: 17px; }
  html[data-design="club"] .pcard-banner .pbio { font-size: 12px; }
  html[data-design="club"] .pcard-banner .pcard-socials { gap: 6px; }
  html[data-design="club"] .pp-hero-photo { width: 112px; height: 112px; }
  html[data-design="club"] .pp-hero-name { font-size: 32px; }
  html[data-design="club"] .pp-hero-top { flex-direction: column; }
  html[data-design="club"] .pp-stats { gap: 24px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  html[data-design="club"] .pp-bar-row { grid-template-columns: 88px minmax(0, 1fr) 32px; gap: 12px; }
  html[data-design="club"] .pp-clips { grid-template-columns: minmax(0, 1fr); }
  html[data-design="club"] .news-filters { flex-wrap: wrap; gap: 16px; margin-bottom: 28px; }
  html[data-design="club"] .news-filter-tabs { width: 100%; flex-wrap: wrap; gap: 8px; }
  html[data-design="club"] .news-filter-year-select { font-size: 16px; min-height: 44px; }
  html[data-design="club"] .news-grid .ncard { grid-template-columns: 44px minmax(0, 1fr); gap: 16px; padding-block: 24px; }
  html[data-design="club"] .news-grid .ncard-thumb { width: 44px; height: 44px; font-size: 18px; }
  html[data-design="club"] .news-grid .ncard-title { font-size: 21px; }
  html[data-design="club"] .news-grid .ncard-exc { font-size: 14px; }
  html[data-design="club"] .news-grid .ncard-footer { align-items: center; flex-wrap: wrap; }
  html[data-design="club"] .feat-news { display: block; padding: 28px 0; }
  html[data-design="club"] .feat-news-icon { display: none; }
  html[data-design="club"] .feat-news-title { font-size: 29px; }
  html[data-design="club"] .ecard { grid-template-columns: 60px minmax(0, 1fr); gap: 16px; padding-block: 24px; }
  html[data-design="club"] .ecard-date { min-width: 0; padding: 0; }
  html[data-design="club"] .ecard-day { font-size: 34px; }
  html[data-design="club"] .ecard-month { font-size: 12px; }
  html[data-design="club"] .ecard-title { font-size: 21px; }
  html[data-design="club"] .ecard-meta { gap: 8px; font-size: 13px; }
  html[data-design="club"] .match-card { padding: 24px 20px; }
  html[data-design="club"] .match-score-num { font-size: 34px; }
  html[data-design="club"] .ann-card { padding: 20px; gap: 16px; }
  html[data-design="club"] .ann-card-icon { width: 32px; height: 32px; flex: 0 0 auto; font-size: 20px; }
  html[data-design="club"] .sec-hdr-mascot { align-items: flex-start; gap: 16px; }
  html[data-design="club"] .hdr-mascot { width: 80px; max-width: 22vw; }
  html[data-design="club"] .hdr-mascot-wide { width: 96px; }
  html[data-design="club"] .club-form-shell { gap: 40px; }
  html[data-design="club"] .apply-gate { padding: 24px 20px; }
  html[data-design="club"] .apply-form-wrap .fld-row { grid-template-columns: minmax(0, 1fr); gap: 24px; }
  html[data-design="club"] .apply-form-wrap .apply-check { align-items: flex-start; }
  html[data-design="club"] .club-form-aside { padding-top: 24px; }
  html[data-design="club"] .cms-builder-sec { padding-block: 40px; }
  html[data-design="club"] .cms-builder-container { gap: 24px; }
  html[data-design="club"] :is(.cms-container-muted, .cms-container-accent) { padding: 24px 20px; }
  html[data-design="club"] .cms-builder-cardgrid { grid-template-columns: minmax(0, 1fr); gap: 0; }
  html[data-design="club"] .cms-builder-heading :is(h1, h2).sec-title { font-size: 34px; }
  html[data-design="club"] .cms-builder-heading h3.sec-title { font-size: 28px; }
  html[data-design="club"] .cms-builder-image img { max-height: 560px; }
  html[data-design="club"] .members-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px 16px; }
  html[data-design="club"] .mcard { padding-bottom: 20px; gap: 12px; }
  html[data-design="club"] .mcard-name { font-size: 18px; }
  html[data-design="club"] .mcard-role { font-size: 13px; }
  html[data-design="club"] .members-group-title { font-size: 24px; }
  html[data-design="club"] .hero-slider-track { height: auto; min-height: 520px; }
  html[data-design="club"] .hero-slide-inner { padding: 48px 20px 112px; gap: 20px; }
  html[data-design="club"] .hero-slide-title { font-size: clamp(30px, 8vw, 42px); }
  html[data-design="club"] .hero-slide-sub { font-size: 16px; }
  html[data-design="club"] .hero-slider-arrow { top: auto; bottom: 20px; transform: none; }
  html[data-design="club"] .hero-slider-dots { bottom: 20px; max-width: calc(100% - 144px); overflow-x: auto; }
  html[data-design="club"] :is(.hero-slider-dot, .section-band-dot) { flex: 0 0 44px; }
  html[data-design="club"] :is(.hero-slider-dot, .section-band-dot).is-active { flex-basis: 44px; width: 44px; }
  html[data-design="club"] .section-band-inner { padding: 32px 20px 80px; }
  html[data-design="club"] .section-band-arrow { top: auto; bottom: 20px; transform: none; }
  html[data-design="club"] .section-band-dots { bottom: 20px; max-width: calc(100% - 144px); overflow-x: auto; }
  html[data-design="club"] .section-band-title { font-size: 30px; }
  html[data-design="club"] .section-band-slogan { font-size: 30px; }
  html[data-design="club"] .game-page-header { gap: 16px; }
  html[data-design="club"] .game-page-name { font-size: 25px; }
  html[data-design="club"] .game-team-row { flex-wrap: wrap; }
  html[data-design="club"] .team-acc-head { gap: 16px; padding-block: 20px; }
  html[data-design="club"] .tacc-meta { flex-wrap: wrap; justify-content: flex-end; max-width: 100px; }
  html[data-design="club"] .tacc-name { font-size: 16px; }
  html[data-design="club"] .dl-list { gap: 40px; }
  html[data-design="club"] .dl-banner { height: 200px; }
  html[data-design="club"] .dl-detail-banner { height: 240px; }
  html[data-design="club"] .dl-title { font-size: 30px; }
  html[data-design="club"] .dl-detail-title { font-size: 34px; }
  html[data-design="club"] .dl-winner { align-items: flex-start; gap: 16px; }
  html[data-design="club"] .video-consent { min-height: 0; padding: 28px 20px; }
  html[data-design="club"] .video-consent-remember { align-items: flex-start; text-align: left; }
  html[data-design="club"] .spcard { gap: 20px; }
  html[data-design="club"] :is(.sp-logo, .sp-logo-img) { width: 56px; height: 56px; }
  html[data-design="club"] .sp-name { font-size: 20px; }
  html[data-design="club"] .shop-promo { gap: 24px; padding: 28px 20px 112px; }
  html[data-design="club"] .shop-promo-img { width: min(100%, 260px); height: 220px; }
  html[data-design="club"] .shop-promo-text h3 { font-size: 30px; }
  html[data-design="club"] .shop-slider-arrow { top: auto; bottom: 20px; transform: none; }
  html[data-design="club"] :is(.hero-slider-arrow, .section-band-arrow, .shop-slider-arrow):hover { transform: none; }
  html[data-design="club"] .shop-slider-dots { bottom: 20px; max-width: calc(100% - 144px); overflow-x: auto; }
  html[data-design="club"] .shop-slider-dot { flex: 0 0 44px; }
  html[data-design="club"] .tourn-card-head { flex-wrap: wrap; gap: 12px; }
  html[data-design="club"] .tourn-name { font-size: 21px; }
  html[data-design="club"] .tourn-live { flex-direction: column; align-items: flex-start; gap: 12px; }
  html[data-design="club"] .tlt-track { width: 100%; }
  html[data-design="club"] .tpart-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 20px; }
  html[data-design="club"] .tpart-name { font-size: 14px; }
  html[data-design="club"] .tip-widget { align-items: flex-start; padding: 20px; gap: 16px; }
  html[data-design="club"] .club-article-media { margin: 24px 0 32px; }
  html[data-design="club"] .club-article-lede { font-size: 19px; }
  html[data-design="club"] :is(.tourn-table, .privacy-table) :is(th, td) { padding: 12px; }
  html[data-design="club"] .join-strip { padding: 48px 20px; }
  html[data-design="club"] .join-strip h2 { font-size: 34px; }
  html[data-design="club"] footer { padding: 48px 20px 24px; }
  html[data-design="club"] .footer-top,
  html[data-design="club"] .footer-top.compact-footer { gap: 32px 20px; margin-bottom: 36px; }
  html[data-design="club"] .footer-bottom { align-items: flex-start; flex-direction: column; gap: 12px; }
  html[data-design="club"] :is(.modal-box, .pmodal) { padding: 28px 20px; max-height: calc(100dvh - 40px); }
  html[data-design="club"] .pmodal-hero { flex-direction: row; text-align: left; padding-right: 0; padding-top: 32px; gap: 20px; }
  html[data-design="club"] .pmodal-photo { width: 88px; height: 88px; }
  html[data-design="club"] .pmodal-ign { font-size: 23px; }
  html[data-design="club"] .pmodal-id .proles { justify-content: flex-start; }
  html[data-design="club"] .ext-dialog-actions { flex-direction: column-reverse; }
  html[data-design="club"] .ext-dialog-actions > button { width: 100%; }
  html[data-design="club"] #toastZone { left: 20px; right: 20px; bottom: max(20px, env(safe-area-inset-bottom)); align-items: stretch; }
  html[data-design="club"] .toast { min-width: 0; max-width: none; }
  html[data-design="club"] :is(.error-state, .maintenance-state) { padding: 48px 20px; }
}
@media (prefers-reduced-motion: reduce) {
  html[data-design="club"] :is(.hero-slide, .section-band-slide, .shop-promo, .slogan-item, .hero-slide-bg, .section-band-bg, .section-band-slides, .modal-ov, .pmodal-backdrop, .nd-lightbox, .toast, #nd-splash) { transition: none; }
  html[data-design="club"] .hero-slide:is(.is-active, .is-shown) :is(.hero-slide-title, .hero-slide-sub, .hero-slide-cta) { animation: none !important; }
  html[data-design="club"] .nd-splash-bar span { animation: none; width: 100%; }
  html[data-design="club"] .marquee { overflow-x: auto; }
  html[data-design="club"] .marquee-track { animation: none !important; }
}