:root {
  --ink: #082248;
  --navy: #0a326d;
  --blue: #1467cb;
  --aqua: #5edaf1;
  --ice: #effaff;
  --line: rgba(20, 103, 203, 0.14);
}

* { box-sizing: border-box; }

html {
  background: #eaf5fa;
  color-scheme: light;
}

body {
  margin: 0;
  min-height: 100vh;
  background:
    radial-gradient(circle at 15% -10%, rgba(94, 218, 241, .28), transparent 35%),
    linear-gradient(145deg, #f7fcff 0%, #e8f5fb 55%, #edf8ff 100%);
  color: var(--ink);
  font-family: Arial, Helvetica, sans-serif;
}

button, a { -webkit-tap-highlight-color: transparent; }
button { font: inherit; color: inherit; }

.app-shell {
  position: relative;
  width: 100%;
  min-height: 100svh;
  overflow: hidden;
  background: rgba(248, 253, 255, .88);
}

.ambient {
  position: fixed;
  border-radius: 999px;
  filter: blur(2px);
  pointer-events: none;
  opacity: .55;
}

.ambient-one {
  width: 260px;
  height: 260px;
  top: 16%;
  left: max(calc(50% - 390px), -180px);
  background: radial-gradient(circle, rgba(81, 214, 238, .22), transparent 70%);
}

.ambient-two {
  width: 320px;
  height: 320px;
  right: max(calc(50% - 420px), -220px);
  bottom: 6%;
  background: radial-gradient(circle, rgba(35, 104, 207, .14), transparent 70%);
}

.topbar {
  position: sticky;
  top: 0;
  z-index: 50;
  min-height: 74px;
  padding: max(12px, env(safe-area-inset-top)) clamp(18px, 4vw, 64px) 12px;
  display: grid;
  grid-template-columns: minmax(44px, 1fr) auto minmax(104px, 1fr);
  align-items: center;
  background: rgba(249, 253, 255, .78);
  border-bottom: 1px solid rgba(10, 50, 109, .08);
  backdrop-filter: blur(22px) saturate(1.35);
}

.brand-lockup {
  justify-self: center;
  display: flex;
  align-items: center;
  gap: 9px;
}

.brand-lockup img {
  width: 38px;
  height: 38px;
  border-radius: 11px;
  object-fit: cover;
  box-shadow: 0 5px 15px rgba(8,34,72,.18);
}

.brand-lockup div { display: flex; flex-direction: column; line-height: 1; }
.brand-lockup strong { font-size: 14px; letter-spacing: .16em; }
.brand-lockup span { margin-top: 5px; font-size: 9px; text-transform: uppercase; letter-spacing: .19em; color: #5e7794; }

.back-button {
  width: 40px;
  height: 40px;
  border-radius: 14px;
  border: 1px solid rgba(10, 50, 109, .1);
  display: grid;
  place-items: center;
  background: rgba(255,255,255,.72);
  box-shadow: 0 7px 18px rgba(20, 76, 128, .08);
  text-decoration: none;
  cursor: pointer;
}

.back-button { font-size: 21px; }
.back-button.is-hidden { opacity: 0; pointer-events: none; }
.topbar-leading { position: relative; width: 40px; height: 40px; }
.topbar-leading .back-button { position: absolute; inset: 0; }
.header-settings { font-size: 17px; }
.header-settings.is-hidden { opacity: 0; pointer-events: none; }

.language-picker {
  justify-self: end;
  position: relative;
}

.language-picker::after {
  content: "⌄";
  position: absolute;
  right: 12px;
  top: 50%;
  transform: translateY(-54%);
  color: var(--blue);
  font-size: 12px;
  pointer-events: none;
}

.language-picker select {
  min-width: 104px;
  height: 40px;
  padding: 0 32px 0 13px;
  border: 1px solid rgba(10, 50, 109, .12);
  border-radius: 14px;
  appearance: none;
  color: var(--ink);
  background: rgba(255,255,255,.76);
  box-shadow: 0 7px 18px rgba(20, 76, 128, .08);
  font-size: 10px;
  font-weight: 800;
  cursor: pointer;
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.screen {
  display: none;
  width: 100%;
  min-height: calc(100svh - 74px);
  padding: 22px 20px calc(30px + env(safe-area-inset-bottom));
}

.screen.active {
  display: block;
  animation: water-enter .55s cubic-bezier(.16, 1, .3, 1);
}

@keyframes water-enter {
  from { opacity: 0; transform: translateY(13px) scale(.985); filter: blur(5px); }
  to { opacity: 1; transform: none; filter: none; }
}

.hero { text-align: center; padding-top: 3px; }

.logo-stage {
  position: relative;
  width: 184px;
  height: 184px;
  margin: 0 auto 18px;
  display: grid;
  place-items: center;
}

.logo-stage img {
  position: relative;
  width: 158px;
  height: 158px;
  border-radius: 36px;
  object-fit: cover;
  filter: drop-shadow(0 20px 22px rgba(8, 34, 72, .22));
  animation: logo-float 5s ease-in-out infinite;
}

.logo-halo {
  position: absolute;
  inset: 4px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(94,218,241,.35), rgba(255,255,255,0) 68%);
  animation: halo 4s ease-in-out infinite;
}

@keyframes logo-float { 50% { transform: translateY(-6px); } }
@keyframes halo { 50% { transform: scale(1.08); opacity: .7; } }

.eyebrow {
  margin: 0;
  color: #2673b8;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .2em;
  text-transform: uppercase;
}

.hero h1 {
  margin: 10px 0 13px;
  color: var(--ink);
  font-size: clamp(34px, 8.5vw, 58px);
  line-height: .98;
  letter-spacing: -.045em;
}

.hero h1 em { color: var(--blue); font-style: normal; }

.hero-copy {
  width: min(92%, 390px);
  margin: 0 auto;
  color: #5e7590;
  font-size: 13px;
  line-height: 1.55;
}

.ripple-host {
  position: relative;
  overflow: hidden;
  isolation: isolate;
}

.water-ripple {
  position: absolute;
  z-index: -1;
  width: 18px;
  height: 18px;
  border: 2px solid rgba(255,255,255,.8);
  border-radius: 50%;
  pointer-events: none;
  transform: translate(-50%, -50%) scale(.1);
  animation: water-ripple .8s ease-out forwards;
}

@keyframes water-ripple {
  0% { opacity: .85; box-shadow: 0 0 0 0 rgba(94,218,241,.5); }
  100% { opacity: 0; transform: translate(-50%, -50%) scale(16); box-shadow: 0 0 0 25px rgba(94,218,241,0); }
}

.next-card {
  width: 100%;
  margin-top: 24px;
  padding: 17px;
  border: 1px solid rgba(31, 126, 190, .18);
  border-radius: 24px;
  text-align: left;
  color: white;
  background:
    linear-gradient(135deg, rgba(25, 111, 204, .96), rgba(8, 44, 96, .98)),
    radial-gradient(circle at top right, var(--aqua), transparent 50%);
  box-shadow: 0 18px 36px rgba(9, 58, 121, .22), inset 0 1px rgba(255,255,255,.28);
  cursor: pointer;
}

.next-card-top { display: flex; justify-content: space-between; align-items: center; margin-bottom: 13px; }
.next-card-top span { font-size: 9px; text-transform: uppercase; font-weight: 800; letter-spacing: .16em; color: #bfeeff; }
.next-card-top b { padding: 5px 8px; border-radius: 999px; background: rgba(255,255,255,.14); font-size: 9px; }
.next-card strong { display: block; font-size: 17px; letter-spacing: -.02em; }
.next-card small { display: block; margin-top: 6px; color: #d4eafb; font-size: 10px; }
.next-card i { display: block; margin-top: 15px; font-size: 10px; font-style: normal; font-weight: 800; }
.next-card-content.is-swapping { animation: reminder-swap .45s cubic-bezier(.16, 1, .3, 1); }

@keyframes reminder-swap {
  from { opacity: 0; transform: translateY(7px); }
  to { opacity: 1; transform: translateY(0); }
}

.home-actions { margin-top: 13px; }
.home-dashboard { width: 100%; }

.legacy-public-actions { display: none !important; }
.legacy-footer-control { display: none !important; }
.home-screen footer { display: none; }
.public-portal { margin-top: 14px; }
.public-portal-heading { margin-bottom: 10px; display: flex; align-items: flex-end; justify-content: space-between; gap: 14px; }
.public-portal-heading small { display: block; color: #2673b8; font-size: 8px; font-weight: 900; letter-spacing: .16em; text-transform: uppercase; }
.public-portal-heading h2 { margin: 4px 0 0; color: var(--ink); font-size: 18px; letter-spacing: -.03em; }
.public-portal-heading > span { color: rgba(18,89,154,.17); font-size: 18px; font-weight: 950; letter-spacing: .12em; }
.public-card-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 9px; }
.dynamic-public-cards { margin-top: 9px; }
.public-card { position: relative; min-height: 112px; padding: 13px; display: flex; flex-direction: column; align-items: flex-start; border: 1px solid var(--line); border-radius: 20px; color: var(--ink); background: rgba(255,255,255,.76); box-shadow: 0 11px 24px rgba(23,86,136,.07), inset 0 1px #fff; text-align: left; text-decoration: none; cursor: pointer; overflow: hidden; }
.public-card-icon { width: 34px; height: 34px; margin-bottom: 13px; display: grid; place-items: center; border-radius: 11px; color: #fff; background: linear-gradient(145deg,#4fd5ed,#1766c0); box-shadow: 0 7px 14px rgba(22,103,192,.18); font-size: 15px; }
.public-card b { font-size: 12px; }
.public-card small { margin-top: 4px; padding-right: 16px; color: #7a91a6; font-size: 8px; line-height: 1.35; }
.public-card i { position: absolute; right: 13px; bottom: 12px; color: var(--blue); font-size: 15px; font-style: normal; }
.public-card-featured { color: #fff; background: linear-gradient(140deg,#082e5f,#137cc1); }
.public-card-featured small { color: #cce8f7; }
.public-card-featured i { color: #fff; }
.public-card-featured .public-card-icon { background: rgba(255,255,255,.15); border: 1px solid rgba(255,255,255,.16); }
.public-card-accent { background: linear-gradient(145deg,#fff8e5,#fff); border-color: rgba(213,154,25,.23); }
.public-card-accent .public-card-icon { background: linear-gradient(145deg,#f6bd35,#d98012); }
.public-card-social { color: #fff; background: radial-gradient(circle at 15% 110%,#ffd600 0 10%,#ff7a00 28%,#ff0169 52%,#7638fa 100%); border-color: transparent; }
.public-card-social small { color: rgba(255,255,255,.8); }
.public-card-social i { color: #fff; }
.public-card-social .public-card-icon { background: rgba(255,255,255,.16); border: 1px solid rgba(255,255,255,.22); }
body.is-member-active .public-portal { display: none; }

.access-gateway { margin-top: 18px; padding: 18px; border: 1px solid rgba(255,255,255,.8); border-radius: 26px; color: #fff; background: radial-gradient(circle at 90% 0,rgba(94,218,241,.28),transparent 35%),linear-gradient(145deg,#06244d,#0c4f91); box-shadow: 0 26px 60px rgba(4,39,83,.24), inset 0 1px rgba(255,255,255,.18); opacity: 0; transform: translateY(46px) scale(.96); transition: opacity .55s ease,transform .7s cubic-bezier(.16,1,.3,1); }
.access-gateway.is-visible { opacity: 1; transform: none; }
.access-reminder { display: grid; grid-template-columns: 42px 1fr; gap: 12px; }
.access-reminder > span { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 14px; color: #fff; background: rgba(255,255,255,.13); border: 1px solid rgba(255,255,255,.16); font-size: 20px; }
.access-reminder small { color: #7de7f4; font-size: 8px; font-weight: 900; letter-spacing: .14em; text-transform: uppercase; }
.access-reminder h2 { margin: 5px 0 6px; color: #fff; font-size: 18px; line-height: 1.12; letter-spacing: -.03em; }
.access-reminder p { margin: 0; color: #cce3f2; font-size: 9px; line-height: 1.55; }
.access-gateway-actions { margin-top: 15px; display: grid; gap: 9px; }
.access-gateway .primary-action { border: 0; background: #fff; box-shadow: none; }
.access-gateway .member-area-home { background: linear-gradient(135deg,#1687d4,#0a55a2); box-shadow: none; }
.access-gateway .public-registration-action { margin-top: 0; }
.member-cancel-home { min-height: 42px; padding: 0 13px; display: grid; grid-template-columns: 25px 1fr auto; align-items: center; gap: 8px; border: 1px solid rgba(255,255,255,.2); border-radius: 14px; color: #d6e8f5; background: rgba(255,255,255,.08); text-align: left; cursor: pointer; }
.member-cancel-home b { font-size: 10px; }
.member-cancel-home i { font-style: normal; }
body.is-member-active .member-cancel-home { color: #7a3840; border-color: #efd3d7; background: #fff5f6; }
body.is-member-active .access-reminder { display: none; }
body.is-member-active .access-gateway { margin-top: 0; padding: 0; border: 0; background: transparent; box-shadow: none; opacity: 1; transform: none; }
body.is-member-active .access-gateway-actions { margin-top: 0; }
body.is-member-active .access-gateway-actions { grid-template-columns: 1fr; }
body.is-member-active #open-member-cancel { display: none; }

.media-layout { display: grid; gap: 13px; }
.media-feature { position: relative; min-height: 270px; padding: 25px; display: flex; flex-direction: column; justify-content: flex-end; border-radius: 28px; color: #fff; background: radial-gradient(circle at 20% 110%,#ffd600 0 11%,#ff7a00 27%,#ff0169 48%,#b800c5 68%,#5538c9 100%); box-shadow: 0 22px 50px rgba(150,20,125,.22); text-decoration: none; }
.media-camera { width: 58px; height: 58px; margin-bottom: auto; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.25); border-radius: 19px; background: rgba(255,255,255,.14); font-size: 26px; }
.media-feature small { font-size: 8px; font-weight: 900; letter-spacing: .15em; }
.media-feature h3 { margin: 6px 0 7px; font-size: 25px; }
.media-feature p { margin: 0; color: rgba(255,255,255,.82); font-size: 10px; line-height: 1.5; }
.media-feature i { position: absolute; align-self: flex-end; font-size: 23px; font-style: normal; }
.media-link-panel { padding: 18px; border: 1px solid var(--line); border-radius: 24px; background: rgba(255,255,255,.8); box-shadow: 0 15px 34px rgba(18,74,124,.08); }
.media-link-panel h3 { margin: 0 0 13px; font-size: 18px; }
.media-social-row { margin-top: 8px; padding: 12px; display: grid; grid-template-columns: 38px 1fr auto; align-items: center; gap: 11px; border-radius: 14px; color: var(--ink); background: #f2f9fc; text-decoration: none; }
.media-social-row > span { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 12px; color: #fff; background: linear-gradient(145deg,#4fd5ed,#1766c0); }
.media-social-row div { display: flex; flex-direction: column; }
.media-social-row b { font-size: 11px; }
.media-social-row small { margin-top: 3px; color: #6f879a; font-size: 9px; }
.media-social-row i { color: var(--blue); font-style: normal; }
.public-detail-card { min-height: 260px; padding: 24px; border: 1px solid var(--line); border-radius: 26px; background: rgba(255,255,255,.82); box-shadow: 0 18px 40px rgba(18,74,124,.09); }
.public-detail-card > span { width: 58px; height: 58px; display: grid; place-items: center; border-radius: 18px; color: #fff; background: linear-gradient(145deg,#4fd5ed,#1766c0); font-size: 25px; }
#public-detail-content { margin-top: 20px; color: #45647c; font-size: 12px; line-height: 1.7; white-space: pre-wrap; }
#public-detail-link { width: fit-content; margin-top: 20px; padding: 12px 16px; display: inline-flex; border-radius: 13px; color: #fff; background: var(--blue-deep); font-size: 10px; font-weight: 850; text-decoration: none; }
.public-card-management { margin: 14px 0; padding: 13px; border: 1px solid #cee2ec; border-radius: 16px; background: #f7fbfd; text-align: left; }
.public-card-management summary { display: flex; align-items: center; justify-content: space-between; color: var(--blue-deep); font-weight: 850; cursor: pointer; }
.public-card-management summary::marker { content: ""; }
.public-card-management summary button { width: 34px; height: 34px; border: 0; border-radius: 11px; color: #fff; background: #0b72b9; font-size: 20px; cursor: pointer; }
.public-card-management > p { color: #667f93; font-size: 10px; line-height: 1.5; }
.public-card-form { display: grid; gap: 9px; padding: 12px; border-radius: 14px; background: #fff; }
.public-card-form label { display: grid; gap: 5px; color: #274b66; font-size: 10px; font-weight: 800; }
.public-card-form input,.public-card-form textarea { width: 100%; padding: 10px; border: 1px solid #cfe1ea; border-radius: 11px; font: inherit; resize: vertical; }
.public-card-form-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.public-card-form-actions button { min-height: 40px; border: 0; border-radius: 11px; font-weight: 850; cursor: pointer; }
#public-card-save { color: #fff; background: #0b72b9; }
.public-card-management-list { display: grid; gap: 7px; margin-top: 10px; }
.public-card-management-row { padding: 10px; display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 10px; border: 1px solid #d8e8f0; border-radius: 12px; background: #fff; }
.public-card-management-row div { display: flex; flex-direction: column; }
.public-card-management-row b { font-size: 11px; }
.public-card-management-row small { margin-top: 3px; color: #6c8294; font-size: 8px; }
.public-card-management-row button { border: 0; border-radius: 9px; padding: 8px 10px; color: #0b629f; background: #eaf6fc; font-size: 9px; font-weight: 850; cursor: pointer; }
.member-cancel-action { color: #9b3b44; }
.logged-cancel-action { display: none; margin: 13px auto 0; padding: 7px 12px; border: 0; color: #b33f49; background: transparent; font-size: 9px; font-weight: 750; cursor: pointer; }
body.is-member-active .logged-cancel-action { display: block; }
.venue-route-list { margin-top: 14px; display: grid; gap: 8px; }
.venue-route-list a { padding: 12px; display: grid; grid-template-columns: 38px 1fr auto; align-items: center; gap: 10px; border: 1px solid #d7e8f1; border-radius: 14px; color: var(--ink); background: #f7fbfd; text-decoration: none; }
.venue-route-list a > span { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 12px; color: #fff; background: linear-gradient(145deg,#4fd5ed,#1766c0); font-size: 18px; }
.venue-route-list a div { display: flex; flex-direction: column; }
.venue-route-list a b { font-size: 11px; }
.venue-route-list a small { margin-top: 3px; color: #6d8497; font-size: 8px; line-height: 1.35; }
.venue-route-list a i { color: var(--blue); font-size: 9px; font-style: normal; font-weight: 850; }
.venue-route-cards { gap: 13px; }
.venue-route-cards a { min-height: 130px; padding: 18px; border-radius: 22px; background: rgba(255,255,255,.82); box-shadow: 0 15px 34px rgba(18,74,124,.08); }
.venue-route-cards a > span { width: 48px; height: 48px; border-radius: 15px; font-size: 22px; }
.venue-route-cards a b { font-size: 15px; }
.venue-route-cards a small { margin-top: 6px; font-size: 10px; line-height: 1.55; }
@media (min-width:700px) { .venue-route-cards { grid-template-columns: repeat(2,minmax(0,1fr)); } }
.sponsor-ribbon { width: 100%; margin-top: 14px; overflow: hidden; border: 1px solid rgba(17,95,157,.13); border-radius: 15px; background: linear-gradient(90deg,#072b50,#0b679d,#072b50); box-shadow: 0 9px 22px rgba(7,52,92,.14); }
.sponsor-track { width: max-content; padding: 9px 0; display: flex; align-items: center; animation: sponsor-scroll 24s linear infinite; }
.sponsor-track > span { min-width: 220px; padding: 0 25px; display: flex; align-items: center; gap: 10px; border-right: 1px solid rgba(255,255,255,.15); color: #fff; white-space: nowrap; }
.sponsor-track small { color: #7de7f4; font-size: 7px; font-weight: 900; letter-spacing: .13em; }
.sponsor-track b { font-size: 9px; }
@keyframes sponsor-scroll { to { transform: translateX(-50%); } }

.club-story-screen { max-width: 1080px; }
.club-story-layout { display: grid; gap: 13px; }
.story-panel { padding: 20px; border: 1px solid var(--line); border-radius: 24px; background: rgba(255,255,255,.8); box-shadow: 0 15px 34px rgba(18,74,124,.08), inset 0 1px #fff; }
.story-origin { color: #fff; background: radial-gradient(circle at 100% 0,rgba(94,218,241,.22),transparent 38%),linear-gradient(145deg,#0b3976,#08264f); }
.story-year { display: block; color: #73e1f3; font-size: 34px; font-weight: 950; letter-spacing: -.05em; }
.story-panel h3 { margin: 8px 0 10px; font-size: 20px; letter-spacing: -.025em; }
.story-panel > p { margin: 0; color: #668099; font-size: 11px; line-height: 1.65; }
.story-origin > p { color: #d2e8f6; }
.story-milestone { margin-top: 13px; padding-top: 13px; display: grid; grid-template-columns: 82px 1fr; gap: 11px; border-top: 1px solid rgba(255,255,255,.14); }
.story-milestone b { color: #73e1f3; font-size: 10px; }
.story-milestone span { color: #e1eff8; font-size: 10px; line-height: 1.45; }
.story-kicker { color: #1b75bc; font-size: 8px; font-weight: 900; letter-spacing: .15em; text-transform: uppercase; }
.people-list { display: grid; gap: 8px; }
.people-list > div { padding: 11px 12px; display: flex; justify-content: space-between; gap: 12px; border-radius: 13px; background: #f2f9fc; }
.people-list b { font-size: 11px; }
.people-list span { color: #55758e; font-size: 10px; }
.technical-timeline { display: grid; gap: 10px; }
.technical-timeline p { margin: 0; padding-left: 13px; display: flex; flex-direction: column; gap: 3px; border-left: 3px solid #42c8e2; }
.technical-timeline b { color: #1b75bc; font-size: 9px; text-transform: uppercase; letter-spacing: .08em; }
.technical-timeline span { color: #425f78; font-size: 10px; line-height: 1.45; }
.story-cta { width: 100%; margin-top: 13px; padding: 16px; display: grid; grid-template-columns: 42px 1fr auto; align-items: center; gap: 12px; border: 0; border-radius: 20px; color: #fff; background: linear-gradient(135deg,#0b6b55,#159d80); text-align: left; box-shadow: 0 14px 28px rgba(11,107,85,.18); cursor: pointer; }
.story-cta > span { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 13px; background: rgba(255,255,255,.14); }
.story-cta div { display: flex; flex-direction: column; }
.story-cta b { font-size: 13px; }
.story-cta small { margin-top: 3px; color: #d1f2e9; font-size: 9px; }
.story-cta i { font-size: 18px; font-style: normal; }

.primary-action {
  width: 100%;
  padding: 15px;
  display: grid;
  grid-template-columns: 45px 1fr 24px;
  align-items: center;
  gap: 12px;
  border: 1px solid var(--line);
  border-radius: 21px;
  background: rgba(255,255,255,.78);
  box-shadow: 0 12px 26px rgba(23, 86, 136, .09), inset 0 1px white;
  text-align: left;
  cursor: pointer;
}

.action-icon, .category-icon {
  width: 44px;
  height: 44px;
  display: grid;
  place-items: center;
  border-radius: 15px;
  color: white;
  background: linear-gradient(145deg, #58d9f0, #1766c0 78%);
  box-shadow: 0 9px 17px rgba(22, 103, 192, .2), inset 0 1px rgba(255,255,255,.55);
  font-size: 22px;
}

.primary-action span:nth-child(2) { display: flex; flex-direction: column; }
.primary-action b { font-size: 13px; }
.primary-action small { margin-top: 5px; color: #7990a8; font-size: 10px; }
.primary-action i { color: var(--blue); font-style: normal; font-size: 20px; }

.management-home-entry {
  width: 100%; margin-top: 12px; min-height: 76px; padding: 13px 15px;
  display: grid; grid-template-columns: 42px 1fr auto 18px; align-items: center; gap: 11px;
  border: 1px solid rgba(15, 107, 170, .2); border-radius: 22px;
  background: linear-gradient(135deg, #072b50 0%, #0b5c99 72%, #087eaf 100%);
  color: #fff; text-align: left; box-shadow: 0 16px 34px rgba(5, 57, 101, .2);
}

#private-home-content { display: contents; }
#private-home-content[hidden] { display: none !important; }
.next-card[hidden], .public-registration-action[hidden] { display: none !important; }
.renewal-banner { padding:18px; border-radius:22px; color:#fff; background:linear-gradient(135deg,#a05a09,#e49a19); box-shadow:0 16px 30px rgba(153,89,12,.24); }
.renewal-banner[hidden] { display:none !important; }
.renewal-banner small { font-size:9px; font-weight:900; letter-spacing:.16em; }
.renewal-banner h2 { margin:7px 0 5px; font-size:20px; }
.renewal-banner p { margin:0; font-size:11px; line-height:1.5; color:#fff8e9; }
.renewal-actions { display:grid; gap:7px; margin-top:14px; }
.renewal-actions button { min-height:43px; border:0; border-radius:13px; padding:0 12px; font-weight:850; cursor:pointer; }
#renewal-confirm { color:#87500c; background:#fff; }
#renewal-edit { color:#fff; background:rgba(255,255,255,.16); }
#renewal-cancel { color:#fff; background:rgba(98,25,15,.34); }
#member-registration-bank-fields[hidden] { display: none !important; }
.management-role-select {
  grid-column: 1 / -1; width: 100%; min-height: 44px; border: 1px solid #c9dce9;
  border-radius: 13px; padding: 0 12px; color: #0b2a4d; background: #fff; font-weight: 750;
}
.tournament-import-panel { margin:14px 0; padding:13px; border:1px solid #cee2ec; border-radius:16px; background:#f7fbfd; text-align:left; }
.tournament-import-panel summary { color:var(--blue-deep); font-weight:850; cursor:pointer; }
.tournament-import-panel > p { color:#667f93; font-size:10px; line-height:1.5; }
.tournament-import-actions { display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.tournament-import-actions button,.tournament-file-button { min-height:42px; display:grid; place-items:center; border:0; border-radius:12px; padding:0 9px; color:#fff; background:#0b72b9; font-size:10px; font-weight:850; cursor:pointer; text-align:center; }
.tournament-file-button input { position:absolute; width:1px; height:1px; opacity:0; }
.tournament-import-preview { display:grid; gap:7px; max-height:260px; overflow:auto; }
.tournament-preview-row { padding:9px 10px; border-radius:11px; background:#fff; border:1px solid #d8e8f0; }
.tournament-preview-row b,.tournament-preview-row small { display:block; }
.tournament-preview-row b { color:var(--blue-deep); font-size:11px; }
.tournament-preview-row small { margin-top:3px; color:#6c8294; font-size:9px; }
.tournament-preview-row.is-error { border-color:#dda9a9; background:#fff5f5; }
.school-tournament-action { margin-top:10px; background:linear-gradient(135deg,#80520a,#d99b20); }
.school-tournament-dialog { max-width:500px; }
.school-tournament-list { display:grid; gap:11px; margin-top:14px; max-height:58vh; overflow:auto; text-align:left; }
.tournament-group-heading { padding: 8px 3px 1px; }
.tournament-group-heading span { color: #1680bd; font-size: 7px; font-weight: 900; letter-spacing: .15em; }
.tournament-group-heading h3 { margin: 3px 0 0; color: var(--ink); font-size: 15px; }
.school-tournament-card { padding:14px; border:1px solid #d4e5ed; border-radius:16px; background:#fff; }
.school-tournament-card h3 { margin:0; color:var(--blue-deep); font-size:14px; }
.school-tournament-card p { margin:5px 0 11px; color:#688095; font-size:10px; }
.school-tournament-card select { width:100%; min-height:44px; border:1px solid #cfe1ea; border-radius:12px; padding:0 10px; background:#fff; }
.school-tournament-card button { width:100%; min-height:44px; margin-top:8px; border:0; border-radius:12px; color:#fff; background:#096bb1; font-weight:850; cursor:pointer; }
.school-tournament-card button:disabled { opacity:.55; }
.tournament-type-badge { display:inline-flex; margin-bottom:7px; padding:4px 8px; border-radius:999px; background:#e8f4fb; color:#0870b7; font-size:9px; font-weight:900; text-transform:uppercase; letter-spacing:.08em; }
.tournament-limit { margin:10px 0 5px!important; font-weight:750; }
.tournament-modality { margin-top:8px; padding:10px; border:1px solid #dbe9ef; border-radius:12px; background:#f8fcfe; }
.tournament-modality.is-selected { border-color:#1495d2; background:#edf8fe; }
.tournament-mode-check { display:flex; gap:8px; align-items:center; color:#0b2c50; font-size:12px; font-weight:850; }
.tournament-modality select { margin-top:8px; }
.tournament-partner { display:grid; gap:7px; margin-top:8px; }
.tournament-partner label { font-size:11px; font-weight:750; color:#385a73; }
.tournament-partner input:not([type=checkbox]) { width:100%; min-height:40px; box-sizing:border-box; border:1px solid #cfe1ea; border-radius:10px; padding:0 10px; background:#fff; }
.school-category-result { display:flex; justify-content:space-between; align-items:center; margin-top:10px; padding:11px; border-radius:12px; background:#edf8fe; color:#244f6c; font-size:11px; }
.school-category-result strong { color:#056cb1; font-size:14px; }
.member-area-home {
  width: 100%; border: 0; border-radius: 22px; padding: 15px 16px;
  display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 13px;
  color: #fff; text-align: left; cursor: pointer;
  background: linear-gradient(135deg, #123b69, #0c86c4);
  box-shadow: 0 14px 28px rgba(12, 68, 119, .18);
}
.member-area-home .management-home-copy small,
.member-area-home .management-home-copy b,
.member-area-home .management-home-copy em { color: inherit; }
.public-registration-action { margin-top: 12px; }
body.is-member-active .member-area-home { background: linear-gradient(135deg, #0b6b55, #159d80); }
body.is-member-pending .member-area-home { background: linear-gradient(135deg, #72520c, #c58a14); }
.management-home-entry[hidden] { display: none !important; }
.management-home-icon {
  width: 42px; height: 42px; display: grid; place-items: center; border-radius: 14px;
  background: rgba(255,255,255,.13); border: 1px solid rgba(255,255,255,.18); font-size: 20px;
}
.management-home-copy { min-width: 0; display: flex; flex-direction: column; }
.management-home-copy small { color: #9edcff; font-size: 8px; font-weight: 900; letter-spacing: .16em; }
.management-home-copy b { margin-top: 2px; font-size: 14px; }
.management-home-copy em { margin-top: 3px; color: #cce7f6; font-size: 9px; font-style: normal; }
.management-home-count {
  min-width: 28px; height: 28px; padding: 0 7px; display: grid; place-items: center;
  border-radius: 999px; background: #fff; color: #07588f; font-size: 12px; font-weight: 900;
}
.management-home-entry > i { color: #fff; font-size: 18px; font-style: normal; }

.action-grid { margin-top: 10px; display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }

.secondary-action {
  min-height: 116px;
  padding: 15px;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  border: 1px solid var(--line);
  border-radius: 21px;
  color: var(--ink);
  background: rgba(255,255,255,.67);
  box-shadow: 0 12px 25px rgba(23, 86, 136, .07), inset 0 1px white;
  text-decoration: none;
  text-align: left;
  cursor: pointer;
}

.secondary-action span { margin-bottom: auto; color: var(--blue); font-size: 21px; }
.secondary-action b { font-size: 12px; }
.secondary-action small { margin-top: 4px; color: #8195aa; font-size: 9px; }

.social-card {
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
}

.social-copy {
  min-width: 0;
  display: flex;
  flex-direction: column;
}

.instagram-social-button {
  width: 49px;
  height: 49px;
  flex: 0 0 49px;
  display: grid;
  place-items: center;
  overflow: hidden;
  border-radius: 16px;
  background: radial-gradient(circle at 31% 101%, #ffd600 0 19%, #ff7a00 30%, #ff0169 51%, #d300c5 70%, #7638fa 100%);
  box-shadow: 0 10px 22px rgba(202, 27, 134, .24), inset 0 1px rgba(255,255,255,.42);
}

.instagram-social-button .instagram-glyph {
  position: relative;
  width: 24px;
  height: 24px;
  margin: 0;
  border: 2.3px solid white;
  border-radius: 7px;
  color: white;
}

.instagram-glyph::before {
  content: "";
  position: absolute;
  width: 8px;
  height: 8px;
  inset: 0;
  margin: auto;
  border: 2.2px solid white;
  border-radius: 50%;
}

.instagram-glyph::after {
  content: "";
  position: absolute;
  top: 4px;
  right: 4px;
  width: 3px;
  height: 3px;
  border-radius: 50%;
  background: white;
}

footer { padding: 26px 0 0; text-align: center; display: flex; flex-direction: column; }
footer span { color: #6b839d; font-size: 8px; font-weight: 900; letter-spacing: .25em; }
footer small { margin-top: 5px; color: #a0b2c1; font-size: 7px; letter-spacing: .13em; }

.section-heading { padding: 22px 4px 20px; }
.section-heading.compact { padding-bottom: 14px; }
.section-heading h2 { margin: 10px 0 8px; font-size: 30px; letter-spacing: -.045em; }
.section-heading > p:last-child { margin: 0; color: #7188a0; font-size: 12px; line-height: 1.5; }

.category-list, .event-list { display: grid; gap: 11px; }
.event-list { gap: 28px; }
.event-group { min-width: 0; }
.event-group-heading { margin: 0 3px 11px; display: flex; align-items: center; gap: 9px; }
.event-group-heading h3 { margin: 0; font-size: 16px; letter-spacing: -.025em; }
.event-group-heading span { min-width: 24px; height: 24px; padding: 0 7px; display: grid; place-items: center; border-radius: 99px; color: var(--blue); background: #e6f3f9; font-size: 8px; font-weight: 900; }
.event-grid { display: grid; gap: 11px; }

.competition-tabs { width: 100%; margin-bottom: 20px; padding: 5px; display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 5px; border: 1px solid var(--line); border-radius: 17px; background: rgba(235,245,250,.8); }
.competition-tabs button { min-height: 43px; padding: 8px 10px; border-radius: 13px; color: #68829b; background: transparent; font-size: 9px; font-weight: 850; line-height: 1.25; cursor: pointer; }
.competition-tabs button.active { color: white; background: linear-gradient(135deg,#1a83d5,#0b3d82); box-shadow: 0 8px 18px rgba(13,75,148,.2), inset 0 1px rgba(255,255,255,.35); }
.event-view-switcher { width: min(100%, 470px); margin: -8px auto 20px; padding: 4px; display: grid; grid-template-columns: repeat(3,1fr); gap: 4px; border: 1px solid var(--line); border-radius: 15px; background: rgba(255,255,255,.72); }
.event-view-switcher button { min-width: 0; min-height: 40px; padding: 6px 4px; display: flex; align-items: center; justify-content: center; gap: 5px; border-radius: 11px; color: #7188a0; background: transparent; cursor: pointer; }
.event-view-switcher button span { font-size: 14px; }
.event-view-switcher button b { overflow: hidden; font-size: 8px; line-height: 1.15; text-overflow: ellipsis; }
.event-view-switcher button.active { color: var(--blue-deep); background: #e8f5fb; box-shadow: inset 0 0 0 1px rgba(23,102,192,.08); }

.month-list { overflow: hidden; border: 1px solid var(--line); border-radius: 22px; background: rgba(255,255,255,.76); box-shadow: 0 14px 30px rgba(18,74,124,.08); }
.month-list + .month-list { margin-top: 14px; }
.month-list > h3 { margin: 0; padding: 14px 16px 11px; color: var(--blue-deep); font-size: 14px; text-transform: capitalize; }
.month-event { width: 100%; min-height: 68px; padding: 10px 14px; display: grid; grid-template-columns: 42px 1fr 18px; align-items: center; gap: 11px; border-top: 1px solid #e5eff4; color: var(--ink); background: transparent; text-align: left; cursor: pointer; }
.month-event time { width: 42px; height: 45px; display: grid; place-items: center; align-content: center; border-radius: 12px; color: var(--blue-deep); background: #e8f5fb; }
.month-event time b { font-size: 17px; line-height: 1; }
.month-event time span { margin-top: 3px; font-size: 7px; font-weight: 850; text-transform: uppercase; }
.month-event > span { min-width: 0; display: flex; flex-direction: column; }
.month-event > span b { font-size: 11px; line-height: 1.25; }
.month-event small { margin-top: 5px; color: #7a91a8; font-size: 8px; line-height: 1.3; }
.month-event i { font-size: 22px; font-style: normal; }
.month-event i.open { color: #20a77a; }
.month-event i.closed { color: #9badbc; }
.inline-event-detail { padding: 0 10px 12px; background: #f8fbfd; }
.inline-event-detail .event-card { box-shadow: none; }

.month-calendar { padding: 12px; border: 1px solid var(--line); border-radius: 22px; background: rgba(255,255,255,.78); box-shadow: 0 14px 30px rgba(18,74,124,.08); }
.calendar-toolbar { display: grid; grid-template-columns: 38px 1fr 38px; align-items: center; gap: 7px; }
.calendar-toolbar h3 { margin: 0; font-size: 15px; text-align: center; text-transform: capitalize; }
.calendar-toolbar button { height: 36px; border-radius: 11px; color: var(--blue); background: #e8f5fb; font-size: 20px; cursor: pointer; }
.calendar-toolbar .calendar-today { grid-column: 1 / -1; width: max-content; height: 27px; margin: 0 auto 3px; padding: 0 12px; border-radius: 99px; font-size: 8px; font-weight: 850; }
.calendar-weekdays, .calendar-grid { display: grid; grid-template-columns: repeat(7,minmax(0,1fr)); }
.calendar-weekdays span { padding: 8px 0 6px; color: #8195aa; font-size: 7px; font-weight: 850; text-align: center; }
.calendar-grid { overflow: hidden; border: 1px solid #dfeaf0; border-radius: 13px; }
.calendar-day { min-width: 0; min-height: 64px; padding: 5px 3px; border-right: 1px solid #e5eff4; border-bottom: 1px solid #e5eff4; background: rgba(255,255,255,.7); }
.calendar-day:nth-child(7n) { border-right: 0; }
.calendar-day > span { width: 21px; height: 21px; display: grid; place-items: center; color: #607c96; font-size: 8px; font-weight: 850; }
.calendar-day.empty { background: #f3f7f9; }
.calendar-day.today > span { border-radius: 50%; color: white; background: var(--blue); }
.calendar-event { width: 100%; margin-top: 3px; padding: 3px; overflow: hidden; border-radius: 5px; color: white; background: #237ac4; font-size: 6px; font-weight: 800; line-height: 1.2; text-align: left; text-overflow: ellipsis; cursor: pointer; }
.calendar-event.senior-national { background: #7158c8; }
.calendar-event.gbt { background: #08a6a0; }
.calendar-event-detail:empty { display: none; }
.calendar-event-detail { margin-top: 12px; }
.calendar-event-detail .event-card { box-shadow: none; }

.league-tabs { width: 100%; max-width: 560px; margin-bottom: 16px; padding: 5px; display: grid; grid-template-columns: 1fr 1fr; gap: 5px; border: 1px solid var(--line); border-radius: 17px; background: rgba(235,245,250,.8); }
.league-tabs button { min-height: 43px; border-radius: 13px; color: #68829b; background: transparent; font-size: 10px; font-weight: 850; cursor: pointer; }
.league-tabs button.active { color: white; background: linear-gradient(135deg,#1a83d5,#0b3d82); box-shadow: 0 8px 18px rgba(13,75,148,.2), inset 0 1px rgba(255,255,255,.35); }
.league-layout { display: grid; gap: 14px; }
.team-card, .fixtures-panel, .gbt-card { padding: 17px; border: 1px solid var(--line); border-radius: 24px; background: rgba(255,255,255,.76); box-shadow: 0 15px 32px rgba(18,74,124,.09), inset 0 1px white; }
.team-photo-placeholder { min-height: 220px; display: flex; flex-direction: column; align-items: center; justify-content: center; border: 1px dashed #bdd7e3; border-radius: 19px; color: #6e8ba5; background: radial-gradient(circle at 50% 20%,rgba(67,203,228,.16),transparent 42%), linear-gradient(145deg,#edf8fc,#f5f9ff); text-align: center; }
.team-photo-placeholder > span { color: var(--aqua); font-size: 40px; }
.team-photo-placeholder b { margin-top: 10px; color: var(--ink); font-size: 14px; }
.team-photo-placeholder small { max-width: 230px; margin-top: 6px; font-size: 9px; line-height: 1.45; }
.team-card-copy { padding: 15px 4px 2px; }
.team-card-copy span { color: var(--blue); font-size: 9px; font-weight: 850; text-transform: uppercase; letter-spacing: .12em; }
.team-card-copy h3 { margin: 7px 0 0; font-size: 17px; }
.fixtures-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.fixtures-heading > div { display: flex; align-items: center; gap: 9px; }
.fixtures-heading span { color: var(--blue); font-size: 20px; }
.fixtures-heading h3 { margin: 0; font-size: 15px; }
.fixtures-heading small { color: #8195aa; font-size: 8px; }
.league-empty { min-height: 220px; margin-top: 15px; padding: 25px; display: grid; place-items: center; align-content: center; gap: 8px; border-radius: 18px; background: linear-gradient(135deg,#edf8fc,#f4f9ff); text-align: center; }
.league-empty span { color: var(--aqua); font-size: 34px; }
.league-empty p { max-width: 360px; margin: 0; color: #7188a0; font-size: 10px; line-height: 1.55; }
.gbt-card { position: relative; max-width: 720px; min-height: 320px; padding: 40px; overflow: hidden; background: radial-gradient(circle at 100% 0,rgba(67,203,228,.25),transparent 35%), linear-gradient(145deg,#0d4d96,#072e68); color: white; }
.gbt-mark { display: inline-grid; place-items: center; width: 72px; height: 72px; border-radius: 22px; color: #0b4f95; background: white; box-shadow: 0 14px 30px rgba(0,0,0,.18); font-size: 20px; font-weight: 950; letter-spacing: -.04em; }
.gbt-card .eyebrow { margin-top: 28px; color: #7de7f4; }
.gbt-card h3 { margin: 9px 0 10px; font-size: 30px; }
.gbt-card > p:not(.eyebrow) { max-width: 500px; margin: 0; color: rgba(255,255,255,.72); font-size: 11px; line-height: 1.6; }
.pending-link { display: inline-flex; margin-top: 24px; padding: 10px 14px; border: 1px solid rgba(255,255,255,.2); border-radius: 99px; color: rgba(255,255,255,.75); background: rgba(255,255,255,.08); font-size: 9px; font-weight: 800; }

.club-info-grid { display: grid; gap: 14px; }
.info-panel { padding: 17px; border: 1px solid var(--line); border-radius: 24px; background: rgba(255,255,255,.76); box-shadow: 0 15px 32px rgba(18,74,124,.09), inset 0 1px white; }
.panel-heading { display: flex; align-items: center; gap: 12px; padding-bottom: 15px; }
.panel-heading > div { min-width: 0; display: flex; flex-direction: column; }
.panel-heading b { font-size: 14px; }
.panel-heading small { margin-top: 4px; color: #7c91a5; font-size: 9px; }
.panel-icon { width: 43px; height: 43px; flex: 0 0 43px; display: grid; place-items: center; border-radius: 14px; color: white; background: linear-gradient(145deg,#58d9f0,#1766c0 78%); box-shadow: 0 9px 17px rgba(22,103,192,.2), inset 0 1px rgba(255,255,255,.55); font-size: 19px; }
.contact-row { min-height: 62px; margin-top: 8px; padding: 10px 12px; display: grid; grid-template-columns: 34px 1fr auto; align-items: center; gap: 10px; overflow: hidden; border: 1px solid #dfedf3; border-radius: 16px; color: var(--ink); background: #f7fbfd; text-decoration: none; }
.contact-row > span { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 11px; color: var(--blue); background: #e8f5fb; font-weight: 900; }
.contact-row > div { min-width: 0; display: flex; flex-direction: column; }
.contact-row small { color: #7a91a8; font-size: 8px; }
.contact-row b { margin-top: 3px; overflow-wrap: anywhere; font-size: 10px; }
.contact-row i { color: var(--blue); font-style: normal; }
.schedule-group { padding: 14px; border-radius: 18px; background: linear-gradient(135deg,#edf8fc,#f4f9ff); border: 1px solid #e0f0f7; }
.schedule-group + .schedule-group { margin-top: 10px; }
.schedule-group h3 { margin: 0 0 11px; color: var(--blue-deep); font-size: 14px; }
.schedule-group p { margin: 5px 0 10px; color: #7a91a8; font-size: 9px; }
.schedule-group p:last-child { margin-bottom: 0; }
.schedule-row { display: flex; justify-content: space-between; gap: 14px; font-size: 10px; line-height: 1.4; }
.schedule-row + .schedule-row { margin-top: 7px; }
.schedule-row span { flex: 0 0 auto; color: var(--blue); font-weight: 800; }

.category-card {
  width: 100%;
  padding: 14px;
  display: grid;
  grid-template-columns: 48px 1fr auto;
  gap: 13px;
  align-items: center;
  border: 1px solid var(--line);
  border-radius: 22px;
  background: rgba(255,255,255,.72);
  box-shadow: 0 11px 26px rgba(21, 75, 124, .075), inset 0 1px white;
  text-align: left;
  cursor: pointer;
}

.category-card > span:nth-child(2) { display: flex; flex-direction: column; }
.category-card b { font-size: 13px; }
.category-card small { margin-top: 5px; color: #7a91aa; font-size: 10px; }
.category-card i { color: var(--blue); font-size: 20px; font-style: normal; }
.category-card em { padding: 5px 7px; border-radius: 99px; background: #eef4f8; color: #8aa0b4; font-size: 7px; font-style: normal; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; }

.event-card {
  padding: 17px;
  border: 1px solid var(--line);
  border-radius: 24px;
  background: rgba(255,255,255,.76);
  box-shadow: 0 15px 32px rgba(18, 74, 124, .09), inset 0 1px white;
}

.event-meta { display: flex; justify-content: space-between; align-items: center; color: #7991aa; font-size: 9px; }
.status { padding: 5px 7px; border-radius: 99px; font-weight: 800; }
.status.open { color: #087a71; background: #e4f9f5; }
.status.closed { color: #879bab; background: #eef3f6; }
.event-card h3 { margin: 14px 0 5px; font-size: 17px; letter-spacing: -.025em; }
.event-date { margin: 0; color: var(--blue); font-size: 11px; font-weight: 700; }
.registration-deadline { margin-top: 11px; padding: 9px 11px; display: flex; align-items: center; justify-content: space-between; gap: 12px; border: 1px solid #e1edf2; border-radius: 12px; background: #f7fafc; }
.registration-deadline span { color: #7c91a5; font-size: 8px; }
.registration-deadline b { color: var(--blue-deep); font-size: 9px; text-align: right; }

.venue { margin-top: 13px; padding: 11px; display: flex; flex-direction: column; border-radius: 14px; background: linear-gradient(135deg, #edf8fc, #f4f9ff); border: 1px solid #e0f0f7; }
.venue b { font-size: 10px; }
.venue small { margin-top: 4px; color: #7c91a5; font-size: 9px; }

.event-cta {
  margin-top: 12px;
  min-height: 44px;
  padding: 0 15px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-radius: 14px;
  color: white;
  background: linear-gradient(135deg, #1876d3, #0b3d82);
  box-shadow: 0 10px 20px rgba(15, 78, 151, .2);
  text-decoration: none;
  font-size: 11px;
  font-weight: 800;
}
.event-cta.pending { color: #7790a6; background: #eef4f7; box-shadow: none; }
.event-cta.finalized { color: #889aa9; background: #e8eef2; box-shadow: none; }

.event-tools { margin-top: 9px; display: grid; grid-template-columns: repeat(3, 1fr); gap: 7px; }
.event-tools button, .event-tools a {
  min-height: 38px;
  border: 1px solid #dbeaf1;
  border-radius: 12px;
  display: grid;
  place-items: center;
  color: #53718d;
  background: #f5fafc;
  text-decoration: none;
  font-size: 9px;
  font-weight: 700;
  cursor: pointer;
}

.empty-state { padding: 58px 28px; text-align: center; border: 1px dashed #cbdfe8; border-radius: 26px; color: #7490a9; background: rgba(255,255,255,.42); }
.empty-state span { display: block; color: var(--aqua); font-size: 42px; }
.empty-state h3 { margin: 13px 0 7px; color: var(--ink); font-size: 19px; }
.empty-state p { margin: 0; font-size: 11px; line-height: 1.55; }

.footer-install {
  margin: 12px auto 0;
  padding: 9px 14px;
  border: 1px solid rgba(30, 118, 198, .18);
  border-radius: 999px;
  display: flex;
  align-items: center;
  gap: 7px;
  color: var(--blue-deep);
  background: rgba(255,255,255,.7);
  box-shadow: 0 8px 24px rgba(23,83,138,.08);
  font-size: 10px;
  font-weight: 800;
  cursor: pointer;
}

.footer-install span { color: var(--aqua); font-size: 15px; }
.footer-settings { margin: 7px auto 0; padding: 7px 12px; border: 0; display: flex; align-items: center; gap: 6px; color: #71879b; background: transparent; font-size: 9px; font-weight: 750; cursor: pointer; }
.footer-settings span { color: var(--blue-deep); font-size: 12px; }

.legal-info-button {
  position: fixed;
  z-index: 70;
  left: max(12px, env(safe-area-inset-left));
  bottom: max(12px, env(safe-area-inset-bottom));
  width: 29px;
  height: 29px;
  padding: 0;
  border: 1px solid rgba(16, 78, 145, .2);
  border-radius: 50%;
  color: var(--blue-deep);
  background: rgba(255, 255, 255, .82);
  box-shadow: 0 7px 20px rgba(5, 35, 72, .12);
  backdrop-filter: blur(12px);
  font: 800 13px/1 Georgia, serif;
  cursor: pointer;
}

.legal-dialog { max-width: 620px; }
.legal-sections { margin-top: 18px; display: grid; gap: 10px; text-align: left; }
.legal-sections section { padding: 12px 14px; border: 1px solid #dfedf3; border-radius: 15px; background: #f7fbfd; }
.legal-sections h3 { margin: 0 0 4px; color: var(--blue-deep); font-size: 12px; }
.legal-sections p { margin: 0; color: #536d85; font-size: 11px; line-height: 1.55; }
.connection-banner { position: fixed; z-index: 105; top: calc(70px + env(safe-area-inset-top)); left: 50%; width: min(calc(100% - 24px), 620px); transform: translateX(-50%); padding: 11px 14px; border-radius: 16px; display: flex; align-items: center; gap: 10px; color: white; box-shadow: 0 14px 35px rgba(5,35,72,.22); animation: install-rise .28s ease-out both; }
.connection-banner[hidden] { display: none; }
.connection-banner.offline { background: linear-gradient(135deg,#8b4e08,#c57412); }
.connection-banner.online { width: max-content; max-width: calc(100% - 24px); background: linear-gradient(135deg,#157b5b,#22a977); }
.connection-banner > span { width: 30px; height: 30px; display: grid; place-items: center; flex: 0 0 auto; border-radius: 10px; background: rgba(255,255,255,.16); font-weight: 900; }
.connection-banner div { display: flex; flex-direction: column; gap: 2px; }
.connection-banner b { font-size: 11px; }
.connection-banner small { color: rgba(255,255,255,.85); font-size: 9px; line-height: 1.35; }
.offline-disabled { opacity: .48; filter: saturate(.35); cursor: not-allowed !important; }
.update-card { position: fixed; z-index: 108; right: 16px; bottom: calc(16px + env(safe-area-inset-bottom)); width: min(calc(100% - 32px),420px); padding: 16px; border: 1px solid rgba(255,255,255,.85); border-radius: 22px; display: grid; grid-template-columns: 38px 1fr; gap: 5px 11px; color: var(--ink); background: rgba(250,254,255,.96); box-shadow: 0 22px 60px rgba(5,35,72,.28); backdrop-filter: blur(14px); animation: install-rise .32s ease-out both; }
.update-card[hidden] { display: none; }
.update-icon { grid-row: 1 / 3; width: 38px; height: 38px; display: grid; place-items: center; border-radius: 12px; color: white; background: linear-gradient(135deg,var(--aqua),var(--blue-deep)); font-size: 19px; }
.update-card div { display: flex; flex-direction: column; gap: 3px; }
.update-card b { font-size: 12px; }
.update-card small { color: #71879b; font-size: 9px; line-height: 1.4; }
.update-card > button { grid-column: 2; margin-top: 6px; min-height: 37px; border: 0; border-radius: 11px; color: white; background: var(--blue-deep); font-size: 10px; font-weight: 800; cursor: pointer; }
.update-card > .update-later { margin-top: 0; color: #6f8598; background: transparent; }
.settings-mark { width: 68px; height: 68px; margin: 0 auto; display: grid; place-items: center; border-radius: 20px; color: white; background: linear-gradient(145deg,#1885dd,#0a3e84); box-shadow: 0 13px 30px rgba(10,63,125,.2); font-size: 28px; }
.settings-list { margin: 20px 0 15px; display: grid; gap: 8px; text-align: left; }
.settings-list > div { padding: 11px 12px; border: 1px solid #deecf3; border-radius: 13px; display: flex; justify-content: space-between; gap: 15px; background: rgba(255,255,255,.72); }
.settings-list span { color: #71879b; font-size: 9px; }
.settings-list b { color: var(--blue-deep); font-size: 10px; text-align: right; }
.settings-list .state-online { color: #16845f; }
.settings-list .state-offline { color: #b6650b; }
.settings-action { width: 100%; min-height: 45px; margin-top: 8px; border: 0; border-radius: 13px; display: flex; align-items: center; justify-content: center; gap: 8px; color: white; background: linear-gradient(135deg,#1885dd,#0a3e84); font-size: 10px; font-weight: 800; cursor: pointer; }
.settings-action.secondary { color: var(--blue-deep); background: #e9f4fa; }

.install-overlay {
  position: fixed;
  z-index: 120;
  inset: 0;
  padding: max(18px, env(safe-area-inset-top)) 18px max(18px, env(safe-area-inset-bottom));
  display: grid;
  place-items: center;
  background: rgba(4, 23, 48, .48);
  backdrop-filter: blur(14px);
  animation: install-fade .24s ease-out both;
}
.install-overlay[hidden] { display: none; }
.install-dialog {
  position: relative;
  width: min(100%, 430px);
  max-height: 100%;
  overflow: auto;
  padding: 28px 24px 20px;
  border: 1px solid rgba(255,255,255,.9);
  border-radius: 30px;
  color: var(--ink);
  background: linear-gradient(155deg, rgba(255,255,255,.98), rgba(238,248,255,.98));
  box-shadow: 0 30px 80px rgba(5,35,72,.3), inset 0 1px 0 white;
  text-align: center;
  animation: install-rise .32s cubic-bezier(.2,.8,.2,1) both;
}
.install-dialog > img { width: 76px; height: 76px; border-radius: 19px; box-shadow: 0 13px 30px rgba(10,63,125,.2); }
.install-dialog h2 { margin: 8px 0; font-size: clamp(22px, 6vw, 30px); letter-spacing: -.04em; }
.install-intro { margin: 0 auto; max-width: 340px; color: #668099; font-size: 12px; line-height: 1.55; }
.install-dialog ol { margin: 22px 0; padding: 0; display: grid; gap: 9px; list-style: none; text-align: left; }
.install-dialog li { padding: 11px 12px; display: grid; grid-template-columns: 28px 1fr; align-items: center; gap: 10px; border: 1px solid #dcecf4; border-radius: 14px; background: rgba(255,255,255,.75); }
.install-dialog li span { width: 28px; height: 28px; display: grid; place-items: center; border-radius: 9px; color: white; background: linear-gradient(135deg, var(--aqua), var(--blue-deep)); font-size: 10px; font-weight: 900; }
.install-dialog li b { font-size: 10px; line-height: 1.45; }
.install-close { position: absolute; top: 14px; right: 14px; width: 34px; height: 34px; border: 0; border-radius: 50%; color: #6c8295; background: #edf4f7; font-size: 21px; cursor: pointer; }
.install-primary { width: 100%; min-height: 50px; padding: 0 17px; border: 0; border-radius: 15px; display: flex; align-items: center; justify-content: space-between; color: white; background: linear-gradient(135deg, #1885dd, #0a3e84); box-shadow: 0 12px 25px rgba(9,69,138,.22); font-size: 12px; font-weight: 850; cursor: pointer; }
.install-later { margin-top: 10px; padding: 8px 14px; border: 0; color: #71879b; background: transparent; font-size: 10px; font-weight: 700; cursor: pointer; }
@keyframes install-fade { from { opacity: 0; } }
@keyframes install-rise { from { opacity: 0; transform: translateY(22px) scale(.97); } }

.toast {
  position: fixed;
  z-index: 80;
  left: 50%;
  bottom: calc(22px + env(safe-area-inset-bottom));
  transform: translateX(-50%);
  padding: 10px 15px;
  border-radius: 99px;
  color: white;
  background: rgba(8, 34, 72, .92);
  box-shadow: 0 10px 30px rgba(8,34,72,.25);
  font-size: 10px;
  font-weight: 700;
}

@media (min-width: 700px) {
  .screen {
    padding: 38px clamp(38px, 6vw, 86px) 48px;
  }

  .content-screen {
    max-width: 1280px;
    margin: 0 auto;
  }

  .category-list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
  }

  .event-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
  }

  .club-info-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
  }
  .public-card-grid { grid-template-columns: repeat(3,minmax(0,1fr)); gap: 12px; }
  .club-story-layout { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .story-origin { grid-row: span 2; }
  .access-gateway-actions { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .media-layout { grid-template-columns: minmax(0,1.15fr) minmax(0,.85fr); }

  .league-layout {
    grid-template-columns: minmax(300px, .85fr) minmax(360px, 1.15fr);
    gap: 18px;
  }

  .section-heading {
    max-width: 760px;
    padding-top: 32px;
  }

  .category-card {
    min-height: 94px;
    padding: 18px;
  }
}

@media (max-width: 699px) {
  body, .app-shell { min-height: 100svh; }

  .topbar {
    min-height: 62px;
    padding: max(8px, env(safe-area-inset-top)) 14px 8px;
    grid-template-columns: 42px 1fr 92px;
  }
  .brand-lockup { gap: 7px; }
  .brand-lockup img { width: 32px; height: 32px; border-radius: 9px; }
  .brand-lockup strong { font-size: 12px; }
  .brand-lockup span { margin-top: 3px; font-size: 7px; }
  .back-button { width: 36px; height: 36px; border-radius: 12px; }
  .topbar-leading { width: 36px; height: 36px; }
  .language-picker select { min-width: 88px; height: 36px; padding-left: 10px; font-size: 9px; }

  .home-screen.active {
    min-height: calc(100svh - 62px);
    height: auto;
    padding: 13px 16px max(12px, env(safe-area-inset-bottom));
    display: flex;
    flex-direction: column;
    overflow: visible;
  }

  .hero {
    min-height: 94px;
    padding: 2px 4px;
    display: grid;
    grid-template-columns: 88px 1fr;
    grid-template-rows: auto auto auto;
    column-gap: 16px;
    align-content: center;
    text-align: left;
  }
  .logo-stage {
    grid-column: 1;
    grid-row: 1 / 4;
    width: 86px;
    height: 86px;
    margin: 0;
  }
  .logo-stage img { width: 76px; height: 76px; border-radius: 20px; filter: drop-shadow(0 12px 15px rgba(8,34,72,.2)); }
  .logo-halo { inset: 0; }
  .hero .eyebrow { grid-column: 2; font-size: 8px; letter-spacing: .17em; }
  .hero h1 { grid-column: 2; margin: 5px 0 5px; font-size: clamp(25px, 7.5vw, 31px); line-height: 1; white-space: nowrap; }
  .hero-copy { grid-column: 2; width: 100%; margin: 0; font-size: 10px; line-height: 1.35; }

  .home-dashboard { min-height: 0; }
  .next-card {
    min-height: 92px;
    margin-top: 12px;
    padding: 14px 16px;
    border-radius: 21px;
    box-shadow: 0 11px 24px rgba(9,58,121,.18), inset 0 1px rgba(255,255,255,.28);
  }
  .next-card-top { margin-bottom: 9px; }
  .next-card-top span, .next-card-top b { font-size: 8px; }
  .next-card-top b { padding: 4px 8px; }
  .next-card strong { font-size: 16px; }
  .next-card small { margin-top: 5px; font-size: 9px; }
  .next-card i { margin-top: 9px; font-size: 9px; }

  .home-actions { margin-top: 11px; }
  .primary-action {
    min-height: 64px;
    padding: 10px 13px;
    grid-template-columns: 40px 1fr 20px;
    gap: 11px;
    border-radius: 19px;
  }
  .action-icon { width: 40px; height: 40px; border-radius: 13px; font-size: 19px; }
  .primary-action b { font-size: 12px; }
  .primary-action small { margin-top: 3px; font-size: 9px; }
  .primary-action i { font-size: 16px; }

  .action-grid { margin-top: 9px; gap: 9px; }
  .secondary-action {
    min-height: 80px;
    padding: 11px 13px;
    border-radius: 19px;
  }
  .secondary-action span { font-size: 18px; }
  .secondary-action b { font-size: 11px; }
  .secondary-action small { margin-top: 3px; font-size: 8px; }
  .instagram-social-button { width: 42px; height: 42px; flex-basis: 42px; border-radius: 13px; }
  .instagram-social-button .instagram-glyph { width: 19px; height: 19px; }

  .management-home-entry {
    min-height: 68px;
    margin-top: 9px;
    padding: 10px 13px;
    grid-template-columns: 40px 1fr auto 16px;
    gap: 11px;
    border-radius: 20px;
  }
  .management-home-icon { width: 40px; height: 40px; border-radius: 13px; font-size: 18px; }
  .management-home-copy small { font-size: 7px; }
  .management-home-copy b { font-size: 12px; }
  .management-home-copy em { margin-top: 3px; font-size: 8px; }
  .management-home-count { min-width: 27px; height: 27px; font-size: 11px; }

  .home-screen footer {
    display: none;
  }
  .home-screen footer > span, .home-screen footer > small { display: none; }
  .footer-install, .footer-settings { margin: 0; padding: 7px 11px; font-size: 9px; }
}

@media (min-width: 980px) {
  .home-screen.active {
    min-height: calc(100svh - 74px);
    padding: 44px clamp(54px, 7vw, 120px) 30px;
    display: grid;
    grid-template-columns: minmax(360px, .82fr) minmax(500px, 1.18fr);
    grid-template-rows: 1fr auto;
    align-items: center;
    gap: 36px clamp(54px, 7vw, 120px);
  }

  .hero {
    text-align: center;
    padding: 0;
  }

  .logo-stage {
    width: 260px;
    height: 260px;
    margin: 0 auto 24px;
  }

  .logo-stage img {
    width: 224px;
    height: 224px;
    border-radius: 48px;
  }

  .hero-copy {
    width: min(100%, 470px);
    margin: 0 auto;
    font-size: 15px;
  }

  .home-dashboard {
    align-self: center;
  }
  .public-card { min-height: 124px; }

  .next-card {
    margin-top: 0;
    padding: 25px;
    min-height: 190px;
  }

  .next-card strong { font-size: 24px; }
  .next-card small { margin-top: 10px; font-size: 12px; }
  .next-card i { margin-top: 24px; font-size: 12px; }

  .primary-action {
    min-height: 78px;
    padding: 18px;
  }

  .secondary-action {
    min-height: 142px;
    padding: 20px;
  }

  .primary-action b, .secondary-action b { font-size: 15px; }
  .primary-action small, .secondary-action small { font-size: 11px; }

  footer {
    grid-column: 1 / -1;
    padding-top: 0;
  }
}

@media (min-width: 1500px) {
  .event-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (min-width: 760px) {
  .competition-tabs { grid-template-columns: repeat(3,minmax(0,1fr)); }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; scroll-behavior: auto !important; }
}


/* Member Access · v1.5.1 */
.member-access-dialog { max-width: 420px; }
.member-access-mark { width: 54px; height: 54px; margin: 0 auto 10px; display: grid; place-items: center; border-radius: 18px; background: #edf8fc; font-size: 24px; }
.member-access-form { display: grid; gap: 10px; margin-top: 18px; text-align: left; }
.member-access-form label { color: var(--blue-deep); font-size: 12px; font-weight: 800; }
.member-access-form input { width: 100%; box-sizing: border-box; min-height: 50px; padding: 0 14px; border: 1px solid #cfe1ea; border-radius: 15px; background: #fff; color: #14314d; font: inherit; outline: none; }
.member-access-form input:focus { border-color: #3aa9d4; box-shadow: 0 0 0 4px rgba(58,169,212,.12); }
.member-access-message { min-height: 20px; margin: 12px 0 0; color: #536d85; font-size: 11px; line-height: 1.5; }
.member-access-message.is-error { color: #a43b3b; }
.member-access-message.is-success { color: #1d7650; }
.event-cta[data-protected="true"]::before { content: "🔒"; margin-right: 7px; font-size: 11px; }

/* CESIB v1.5.1 · Acceso íntegro dentro de la PWA */
.member-field { display: grid; gap: 7px; }
.member-field[hidden], .member-access-form[hidden], .member-account-box[hidden] { display: none; }
.member-access-form .install-primary { margin-top: 4px; }
.member-secondary { min-height: 44px; border: 1px solid #cfe1ea; border-radius: 14px; color: var(--blue-deep); background: #f2f9fc; font: inherit; font-size: 11px; font-weight: 800; cursor: pointer; }
.member-text-action { padding: 7px; border: 0; color: #587b96; background: transparent; font-size: 10px; font-weight: 750; cursor: pointer; }
.member-account-box { margin-top: 18px; padding: 16px; border: 1px solid #d9eaf2; border-radius: 18px; display: grid; gap: 5px; background: rgba(255,255,255,.72); }
.member-account-box > b { color: var(--blue-deep); font-size: 15px; }
.member-account-box > span { color: #668099; font-size: 10px; font-weight: 750; }
.member-account-box .settings-action { margin-top: 10px; }
.member-account-box .settings-action:disabled { opacity: .62; cursor: default; }
.member-profile-summary { display: grid; gap: 8px; margin-top: 12px; text-align: left; }
.member-profile-summary[hidden], .member-profile-form[hidden] { display: none !important; }
.member-profile-summary > div { display: grid; gap: 2px; padding: 9px 11px; border-radius: 12px; background: #f4f9fc; }
.member-profile-summary small { color: #72899c; font-size: 9px; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; }
.member-profile-summary strong { color: var(--blue-deep); font-size: 12px; overflow-wrap: anywhere; }
.member-profile-form { display: grid; gap: 10px; margin-top: 12px; text-align: left; }
.member-profile-form label { display: grid; gap: 5px; color: var(--blue-deep); font-size: 11px; font-weight: 800; }
.member-profile-form input { width: 100%; min-height: 44px; box-sizing: border-box; padding: 0 12px; border: 1px solid #cfe1ea; border-radius: 13px; font: inherit; color: #14314d; background: #fff; }
.member-profile-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.member-profile-actions .settings-action, .member-profile-actions .member-secondary { margin: 0; min-height: 44px; }

/* Badminton Clubs Core v2.0 · Sprint 1 */
.member-join-club {
  margin-top: 8px;
  border: 1px solid rgba(18, 108, 190, .18);
  background: rgba(18, 108, 190, .07);
}

/* CESIB v2.2.0 · Expedient digital de soci */
.member-registration-dialog { width: min(920px, calc(100vw - 24px)); max-width: 920px; max-height: min(92vh, 980px); overflow: auto; text-align: left; }
.member-registration-dialog > .eyebrow, .member-registration-dialog > h2, .member-registration-dialog > .install-intro { text-align: center; }
.member-registration-form { display: grid; gap: 16px; margin-top: 20px; }
.member-registration-form[hidden] { display: none !important; }
.registration-type-switch { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; padding: 5px; margin-top: 16px; border-radius: 16px; background: #eaf4f9; }
.registration-type-switch button { min-height: 42px; border: 0; border-radius: 12px; background: transparent; color: #536f86; font-weight: 800; cursor: pointer; }
.registration-type-switch button.active { color: #fff; background: linear-gradient(135deg,#168fda,#0c4f9f); box-shadow: 0 7px 15px rgba(17,97,166,.2); }
.family-players-heading { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.family-players-heading h3 { margin-bottom:4px; }
#family-add-player { border:0; border-radius:12px; padding:10px 12px; color:#fff; background:#0b72b9; font-weight:800; cursor:pointer; }
.family-player-card { position:relative; margin-top:12px; padding:14px; border:1px solid #d2e5ef; border-radius:16px; background:#f8fcfe; }
.family-player-card h4 { margin:0 0 12px; color:var(--blue-deep); }
.family-player-remove { position:absolute; right:12px; top:10px; border:0; background:transparent; color:#a43b3b; font-weight:800; cursor:pointer; }
.family-days { display:grid; gap:7px; margin-top:8px; }
.family-days label { display:flex; align-items:center; gap:8px; font-size:11px; }
.registration-section { padding: 17px; border: 1px solid #d9eaf2; border-radius: 20px; background: rgba(255,255,255,.76); }
.registration-section h3 { margin: 0 0 13px; color: var(--blue-deep); font-size: 14px; }
.registration-help { margin: -6px 0 12px; color: #668099; font-size: 10px; line-height: 1.5; }
.registration-grid { display: grid; gap: 12px; }
.registration-grid.two { grid-template-columns: repeat(2, minmax(0,1fr)); }
.registration-grid label, .registration-section > label { display: grid; gap: 7px; color: var(--blue-deep); font-size: 11px; font-weight: 800; }
.registration-grid .full { grid-column: 1 / -1; }
.registration-grid input, .registration-grid select { width: 100%; min-height: 48px; box-sizing: border-box; padding: 0 13px; border: 1px solid #cfe1ea; border-radius: 14px; background: #fff; color: #14314d; font: inherit; outline: none; }
.registration-grid input:focus, .registration-grid select:focus { border-color: #3aa9d4; box-shadow: 0 0 0 4px rgba(58,169,212,.12); }
.registration-days { display: flex; flex-wrap: wrap; gap: 10px 18px; padding: 12px; border: 1px solid #d9eaf2; border-radius: 14px; }
.registration-days legend { padding: 0 6px; color: var(--blue-deep); font-size: 11px; font-weight: 800; }
.registration-days label { display: flex; align-items: center; gap: 7px; }
.registration-days input, .registration-check input { width: 18px; height: 18px; min-height: auto; }
.registration-check { display: flex !important; grid-template-columns: auto 1fr; align-items: flex-start; gap: 10px !important; margin-top: 11px; color: #34516b !important; font-weight: 650 !important; line-height: 1.5; }
.sensitive-section { background: linear-gradient(135deg, rgba(242,249,252,.92), rgba(255,255,255,.92)); }
.registration-honeypot { position: absolute !important; left: -9999px !important; opacity: 0 !important; }
@media (max-width: 680px) { .registration-grid.two { grid-template-columns: 1fr; } .registration-grid .full { grid-column: auto; } .member-registration-dialog { max-height: 94vh; padding: 24px 16px; } }


/* Core v2.2.2 · Selecció de dies i horaris */
.registration-days[disabled] { opacity: .72; }
.registration-days-options { display: grid; gap: 10px; margin-top: 10px; }
.registration-day-option { display: flex !important; align-items: center; gap: 12px; padding: 12px 14px; border: 1px solid rgba(18, 91, 166, .16); border-radius: 14px; background: rgba(255,255,255,.72); cursor: pointer; }
.registration-day-option input { width: 18px; height: 18px; flex: 0 0 auto; }
.registration-day-option span { display: grid; gap: 2px; }
.registration-day-option strong { color: #082a55; font-size: .96rem; }
.registration-day-option small { color: #5e7897; font-size: .82rem; line-height: 1.3; }
.registration-day-option:has(input:checked) { border-color: #1774d1; background: rgba(23,116,209,.08); box-shadow: 0 0 0 2px rgba(23,116,209,.08); }


/* v2.2.3 · Motor automàtic de quotes */
.registration-fee-section { background: linear-gradient(135deg, rgba(239,248,255,.94), rgba(255,255,255,.92)); }
.family-discount-check { margin-bottom: 14px; }
.registration-fee-summary { display: grid; gap: 9px; padding: 15px; border: 1px solid rgba(18,91,166,.16); border-radius: 16px; background: rgba(255,255,255,.82); }
.registration-fee-summary > div { display: flex; justify-content: space-between; gap: 18px; color: #4d6984; font-size: 11px; }
.registration-fee-summary strong { color: #082a55; font-size: 12px; text-align: right; }
.registration-fee-summary .registration-fee-total { padding-top: 10px; border-top: 1px solid rgba(18,91,166,.14); }
.registration-fee-summary .registration-fee-total span, .registration-fee-summary .registration-fee-total strong { color: #0966c2; font-size: 13px; font-weight: 900; }
.registration-fee-summary p { margin: 2px 0 0; color: #668099; font-size: 9px; line-height: 1.45; }

/* v2.3.0 · Gestió de sol·licituds */
.member-management-dialog { width: min(960px, calc(100vw - 28px)); max-height: min(900px, calc(100vh - 28px)); overflow: auto; }
.management-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: 16px 0 4px; }
.management-toolbar .settings-action { width: auto; min-width: 130px; margin: 0; }
.management-count { color: var(--blue-deep); font-size: 12px; font-weight: 850; }
.management-list { display: grid; gap: 14px; margin-top: 14px; }
.management-card { border: 1px solid #d5e8f3; border-radius: 20px; background: rgba(255,255,255,.86); padding: 16px; box-shadow: 0 12px 28px rgba(20,76,120,.08); }
.management-card-header { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; }
.management-card h3 { margin: 0; color: var(--blue-deep); font-size: 17px; }
.management-card-header p { margin: 5px 0 0; color: #607b92; font-size: 11px; font-weight: 650; }
.management-status { flex: 0 0 auto; padding: 7px 10px; border-radius: 999px; background: #fff4c7; color: #7b5900; font-size: 10px; font-weight: 850; }
.management-details { margin-top: 12px; border-top: 1px solid #e0edf4; padding-top: 12px; }
.management-details summary { cursor: pointer; color: var(--blue); font-size: 12px; font-weight: 850; }
.management-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 9px; margin-top: 12px; }
.management-field { display: grid; gap: 3px; padding: 10px; border-radius: 12px; background: #f4f9fc; min-width: 0; }
.management-field span { color: #6c8498; font-size: 9px; font-weight: 760; text-transform: uppercase; letter-spacing: .04em; }
.management-field strong { color: #112f55; font-size: 11px; overflow-wrap: anywhere; }
.management-field.is-sensitive { background: #fff8eb; }
.management-actions { display: flex; gap: 10px; margin-top: 14px; }
.management-actions button { flex: 1; border: 0; border-radius: 13px; min-height: 44px; font-weight: 850; cursor: pointer; }
.management-approve { color: white; background: linear-gradient(135deg,#15955f,#08764a); }
.management-reject { color: #9f2731; background: #fff0f1; border: 1px solid #f3c8cc !important; }
.management-actions button:disabled { opacity: .55; cursor: wait; }
@media (max-width: 720px) { .management-grid { grid-template-columns: 1fr; } .management-actions { flex-direction: column; } }
/* v2.6 · informes de Direcció */
.club-reports-panel { margin: 14px 0; padding: 14px; border: 1px solid rgba(20,84,132,.16); border-radius: 18px; background: rgba(255,255,255,.62); }
.club-reports-panel summary { cursor: pointer; font-weight: 800; color: var(--navy, #08254a); }
.club-report-filters { display: grid; grid-template-columns: 1fr 1fr auto; gap: 10px; align-items: end; margin-top: 14px; }
.club-report-filters label { display: grid; gap: 5px; font-size: .78rem; font-weight: 700; }
.club-report-filters select, .club-report-filters button, .club-report-actions button { min-height: 42px; border: 1px solid rgba(20,84,132,.18); border-radius: 12px; padding: 8px 12px; background: white; font: inherit; font-weight: 700; }
.club-report-summary { display: grid; grid-template-columns: repeat(2,1fr); gap: 8px; margin: 12px 0; }
.club-report-summary div { display: flex; justify-content: space-between; gap: 10px; padding: 10px; border-radius: 12px; background: #eef7fc; font-size: .78rem; }
.club-report-summary strong { color: #075ea9; }
.club-report-actions { display: flex; gap: 8px; }
.club-report-actions button { flex: 1; color: #fff; border: 0; background: linear-gradient(135deg,#159deb,#084c9d); }
@media (max-width: 620px) { .club-report-filters { grid-template-columns: 1fr 1fr; } .club-report-filters button { grid-column: 1/-1; } .club-report-summary { grid-template-columns: 1fr; } }

.sponsor-track>span{min-width:240px;justify-content:center}
.sponsor-logo{max-height:42px;max-width:180px;width:auto;filter:brightness(1);transition:.25s}
.sponsor-logo:hover{transform:scale(1.05);filter:brightness(1.08)}

/* CESIB v2.8.3 · Àrea privada personalitzada */
.member-dashboard { display:grid; gap:10px; }
.member-welcome { padding:15px 17px; display:flex; align-items:center; justify-content:space-between; gap:14px; border:1px solid rgba(18,111,181,.15); border-radius:20px; background:linear-gradient(135deg,rgba(255,255,255,.96),rgba(231,247,255,.92)); box-shadow:0 10px 26px rgba(7,63,112,.10); }
.member-welcome small { display:block; color:#1681c8; font-size:7px; font-weight:900; letter-spacing:.18em; }
.member-welcome h2 { margin:5px 0 3px; color:#082d59; font-size:18px; line-height:1.05; letter-spacing:-.025em; }
.member-welcome p { margin:0; color:#6c8297; font-size:9px; font-weight:700; }
.member-session-badge { flex:none; padding:7px 10px; border-radius:999px; color:#087056; background:#dff8ef; font-size:8px; font-weight:900; }
.member-dashboard-card { margin:0; }
.member-card-profile { background:linear-gradient(135deg,#ffffff,#eef9ff); }
.member-card-league { background:linear-gradient(135deg,#fffdf7,#fff4d6); }
.member-card-calendar { background:linear-gradient(135deg,#fbfbff,#edf2ff); }
body.is-member-active #access-gateway { display:none; }
body.is-member-active #private-home-content { display:grid; }
body.is-member-active #member-management-home { margin-top:0; }
@media (max-width:699px){
  .member-welcome { padding:12px 14px; border-radius:18px; }
  .member-welcome h2 { font-size:16px; }
  .member-dashboard { gap:8px; }
}


/* v2.8.3.2 · recuperació robusta de la targeta d'inscripció */
body:not(.is-member-active) #access-gateway { display:block; }
body:not(.is-member-active) #access-gateway.is-visible { opacity:1; transform:none; }
body.is-member-pending #open-member-registration { display:flex !important; }

/* CESIB v2.8.4 · gestió administrativa separada de La meva àrea */
.member-card-management { position: relative; }
.member-card-management .management-home-count {
  margin-left: auto; min-width: 30px; height: 30px; padding: 0 9px; border-radius: 999px;
  display: inline-flex; align-items: center; justify-content: center; font-style: normal; font-weight: 900;
}

/* BC Layout Engine v3.3-alpha.1 */
.public-card-grid { grid-auto-flow: row dense; }
.public-card.bc-size-1x1 { grid-column: span 1; grid-row: span 1; }
.public-card.bc-size-2x1 { grid-column: span 2; grid-row: span 1; min-height: 126px; }
.public-card.bc-size-1x2 { grid-column: span 1; grid-row: span 2; min-height: 250px; }
.public-card.bc-size-2x2 { grid-column: span 2; grid-row: span 2; min-height: 250px; }
.public-card.bc-size-full { grid-column: 1 / -1; min-height: 126px; }
.public-card-form select { width: 100%; padding: 10px; border: 1px solid #cfe1ea; border-radius: 11px; background: #fff; font: inherit; }
.bc-layout-row { grid-template-columns: minmax(0, 1fr); }
.bc-layout-row-main { min-width: 0; }
.bc-layout-row-main b { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.bc-protected-badge,.bc-editable-badge { display: inline-flex; padding: 3px 6px; border-radius: 999px; font-size: 7px; letter-spacing: .05em; text-transform: uppercase; }
.bc-protected-badge { color: #7a5a08; background: #fff1bd; }
.bc-editable-badge { color: #09623f; background: #dff7ec; }
.bc-layout-actions { display: flex; flex-wrap: wrap; gap: 5px; align-items: center; }
.bc-layout-actions button,.bc-layout-actions select { min-height: 32px; border: 0; border-radius: 9px; padding: 6px 9px; color: #0b629f; background: #eaf6fc; font-size: 8px; font-weight: 850; cursor: pointer; }
.bc-layout-actions button:disabled { opacity: .35; cursor: not-allowed; }
.bc-layout-actions select { border: 1px solid #cfe1ea; background: #fff; }
@media (max-width: 700px) {
  .public-card.bc-size-2x1,.public-card.bc-size-2x2 { grid-column: 1 / -1; }
  .public-card.bc-size-1x2 { grid-row: span 1; min-height: 180px; }
}

/* Badminton Clubs v3.4-alpha.4 · BC Studio Pages Manager */
.bc-studio-launcher { display:flex; align-items:center; justify-content:space-between; gap:16px; margin:14px 0; padding:16px; border:1px solid rgba(14,102,164,.18); border-radius:20px; background:linear-gradient(135deg,#eef9ff,#fff); box-shadow:0 12px 28px rgba(15,74,120,.08); }
.bc-studio-launcher h3 { margin:3px 0 5px; color:#082f5c; font-size:18px; }
.bc-studio-launcher p { margin:0; color:#698198; font-size:10px; line-height:1.45; }
.bc-studio-kicker { display:block; color:#1681c8; font-size:7px; font-weight:950; letter-spacing:.17em; }
.bc-studio-dialog { width:min(1040px,calc(100vw - 24px)); max-height:calc(100vh - 24px); overflow:auto; padding:22px; }
.bc-studio-header { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; padding-right:34px; }
.bc-studio-header h2 { margin:4px 0; color:#082f5c; font-size:26px; }
.bc-studio-header p { margin:0; color:#71879b; font-size:11px; }
.bc-studio-sync { display:inline-flex; align-items:center; min-height:30px; padding:7px 11px; border-radius:999px; background:#fff3c4; color:#745300; font-size:8px; font-weight:900; }
.bc-studio-sync[data-state="synced"] { background:#dff8ed; color:#096843; }
.bc-studio-sync[data-state="offline"] { background:#ffe7e8; color:#9b2730; }
.bc-studio-tabs { display:flex; gap:6px; overflow:auto; margin:18px 0; padding:5px; border-radius:15px; background:#edf6fb; }
.bc-studio-tabs button { flex:1 0 auto; min-height:38px; padding:8px 12px; border:0; border-radius:11px; background:transparent; color:#56758d; font-size:9px; font-weight:900; cursor:pointer; }
.bc-studio-tabs button.active { color:#fff; background:linear-gradient(135deg,#168bd0,#0a5da8); box-shadow:0 8px 18px rgba(16,106,170,.22); }
.bc-studio-content { min-height:320px; }
.bc-studio-metrics { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:10px; }
.bc-studio-metrics article { display:grid; gap:6px; padding:15px; border:1px solid #dbeaf2; border-radius:16px; background:#fff; }
.bc-studio-metrics small { color:#7890a3; font-size:8px; font-weight:800; text-transform:uppercase; letter-spacing:.05em; }
.bc-studio-metrics strong { color:#0a3765; font-size:16px; overflow-wrap:anywhere; }
.bc-studio-quick-actions { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; margin-top:14px; }
.bc-studio-quick-actions button,.bc-studio-page-list button,.bc-studio-section-heading button,.bc-studio-publish-actions button { min-height:44px; border:0; border-radius:13px; padding:10px 14px; background:#eaf6fc; color:#075f9d; font-size:9px; font-weight:900; cursor:pointer; }
.bc-studio-page-list { display:grid; gap:10px; }
.bc-studio-page-list article { display:flex; align-items:center; justify-content:space-between; gap:14px; padding:15px; border:1px solid #dbeaf2; border-radius:16px; background:#fff; }
.bc-studio-page-list b { display:block; color:#092f59; font-size:13px; }
.bc-studio-page-list small { display:block; margin-top:4px; color:#748a9c; font-size:9px; }
.bc-studio-section-heading { display:flex; align-items:center; justify-content:space-between; gap:14px; margin-bottom:14px; }
.bc-studio-section-heading h3 { margin:0 0 4px; color:#092f59; }
.bc-studio-section-heading p { margin:0; color:#748a9c; font-size:10px; }
.bc-studio-widget-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; margin-bottom:14px; }
.bc-studio-widget-summary div { display:grid; place-items:center; gap:4px; min-height:90px; border-radius:16px; background:linear-gradient(135deg,#f7fcff,#eaf6fc); }
.bc-studio-widget-summary b { color:#0967a9; font-size:24px; }
.bc-studio-widget-summary small { color:#698399; font-size:8px; font-weight:850; }
.bc-studio-appearance-form { display:grid; gap:12px; max-width:560px; }
.bc-studio-appearance-form label:not(.registration-check) { display:grid; gap:6px; color:#496a83; font-size:9px; font-weight:850; }
.bc-studio-appearance-form input,.bc-studio-appearance-form select { min-height:42px; border:1px solid #cfe1ea; border-radius:12px; padding:9px 11px; background:#fff; font:inherit; }
.bc-studio-publish-card { padding:20px; border:1px solid #d4e8f2; border-radius:20px; background:linear-gradient(135deg,#f8fcff,#eef8fd); }
.bc-studio-publish-card h3 { margin:6px 0; color:#082f5c; }
.bc-studio-publish-card p { color:#688096; font-size:10px; line-height:1.5; }
.bc-studio-publish-actions { display:flex; gap:10px; margin-top:16px; }
.bc-studio-publish-actions button { flex:1; }
body.bc-compact-layout .public-card-grid { gap:8px; }
body.bc-compact-layout .public-card { min-height:92px; padding:12px; }
@media (max-width:760px) {
  .bc-studio-launcher { align-items:stretch; flex-direction:column; }
  .bc-studio-metrics { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .bc-studio-quick-actions { grid-template-columns:1fr; }
  .bc-studio-widget-summary { grid-template-columns:1fr; }
  .bc-studio-page-list article { align-items:stretch; flex-direction:column; }
  .bc-studio-page-list button { width:100%; }
  .bc-studio-publish-actions { flex-direction:column; }
}

/* BC Studio · Pages Manager */
.bc-studio-pages-layout { display:grid; grid-template-columns:minmax(0,1.3fr) minmax(260px,.7fr); gap:14px; align-items:start; }
.bc-studio-page-list { display:grid; gap:9px; }
.bc-studio-page-item { width:100%; display:flex; align-items:center; justify-content:space-between; gap:14px; padding:15px; border:1px solid #dbeaf2; border-radius:16px; background:#fff; color:inherit; text-align:left; cursor:pointer; transition:.18s ease; }
.bc-studio-page-item:hover,.bc-studio-page-item.is-selected { border-color:#36a0d8; background:#f0faff; box-shadow:0 8px 20px rgba(18,111,169,.10); transform:translateY(-1px); }
.bc-studio-page-item b { display:block; color:#092f59; font-size:13px; }
.bc-studio-page-item small { display:block; margin-top:4px; color:#748a9c; font-size:9px; }
.bc-studio-page-meta { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:5px; }
.bc-studio-page-meta em { padding:5px 7px; border-radius:999px; background:#eaf6fc; color:#176995; font-size:7px; font-style:normal; font-weight:900; white-space:nowrap; }
.bc-studio-page-inspector { min-height:250px; padding:18px; border:1px solid #d4e8f2; border-radius:18px; background:linear-gradient(145deg,#f8fcff,#edf8fd); position:sticky; top:0; }
.bc-studio-page-inspector h3 { margin:6px 0; color:#082f5c; font-size:19px; }
.bc-studio-page-inspector p { margin:0 0 14px; color:#688096; font-size:10px; line-height:1.55; }
.bc-studio-page-inspector dl { display:grid; gap:7px; margin:0 0 16px; }
.bc-studio-page-inspector dl div { display:flex; justify-content:space-between; gap:12px; padding:8px 0; border-bottom:1px solid rgba(24,103,153,.12); }
.bc-studio-page-inspector dt { color:#71879b; font-size:8px; font-weight:850; text-transform:uppercase; }
.bc-studio-page-inspector dd { margin:0; color:#0a426f; font-size:9px; font-weight:900; text-align:right; }
.bc-studio-page-actions { display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.bc-studio-page-actions button { min-height:42px; border:0; border-radius:12px; padding:9px; background:#eaf6fc; color:#075f9d; font-size:8px; font-weight:900; cursor:pointer; }
@media (max-width:760px) { .bc-studio-pages-layout { grid-template-columns:1fr; } .bc-studio-page-inspector { position:static; } .bc-studio-page-item { align-items:flex-start; flex-direction:column; } .bc-studio-page-meta { justify-content:flex-start; } }

/* Badminton Clubs v3.4-alpha.4 · BC Studio Widget Manager */
.bc-studio-widget-toolbar{display:grid;grid-template-columns:minmax(0,1fr) minmax(150px,220px);gap:12px;margin:14px 0}
.bc-studio-widget-toolbar label{display:grid;gap:6px;font-size:.78rem;font-weight:700;color:var(--muted,#667085)}
.bc-studio-widget-toolbar input,.bc-studio-widget-toolbar select{width:100%;min-height:42px;border:1px solid rgba(30,90,150,.22);border-radius:12px;padding:0 12px;background:var(--surface,#fff);color:inherit}
.bc-studio-widget-list{display:grid;gap:10px;margin:12px 0 16px}
.bc-studio-widget-item{display:grid;grid-template-columns:46px minmax(0,1fr) auto;gap:12px;align-items:center;padding:12px;border:1px solid rgba(30,90,150,.16);border-radius:16px;background:rgba(255,255,255,.76);box-shadow:0 8px 24px rgba(14,48,83,.06)}
.bc-studio-widget-icon{display:grid;place-items:center;width:44px;height:44px;border-radius:14px;background:rgba(0,113,188,.1);font-size:1.25rem}
.bc-studio-widget-main{display:grid;gap:3px;min-width:0}.bc-studio-widget-main b,.bc-studio-widget-main small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.bc-studio-widget-main small{color:var(--muted,#667085)}.bc-studio-widget-main span{font-size:.72rem;color:#667085}
.bc-studio-widget-controls{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:6px}.bc-studio-widget-controls button,.bc-studio-widget-controls select{min-height:34px;border:1px solid rgba(30,90,150,.2);border-radius:10px;background:#fff;padding:0 9px;font:inherit;font-size:.75rem}.bc-studio-widget-controls .is-danger{color:#a31621;border-color:rgba(163,22,33,.24)}
@media (max-width:760px){.bc-studio-widget-toolbar{grid-template-columns:1fr}.bc-studio-widget-item{grid-template-columns:42px minmax(0,1fr)}.bc-studio-widget-controls{grid-column:1/-1;justify-content:flex-start}.bc-studio-widget-controls button,.bc-studio-widget-controls select{flex:1 1 auto}}