:root {
  --hscl-gold: #ffd337;
  --hscl-lime: #b9ff43;
  --hscl-blue: #58b8ff;
  --hscl-pink: #ff70b5;
  --hscl-ink: #020b08;
  --hscl-panel: #071710;
  --hscl-panel-2: #0a2118;
  --hscl-line: rgba(255, 211, 55, 0.25);
  --hscl-text: #f7fbf8;
  --hscl-muted: #bcc8c1;
}

html { overflow-x: hidden; }
.mf-hscl-page { max-width: 100vw; overflow-x: clip; background: var(--hscl-ink); color: var(--hscl-text); }
.mf-hscl-page .mf-stl-jump-nav { display: none !important; }
.mf-hscl-page main { overflow: clip; }
.mf-hscl-container { width: min(1180px, calc(100% - 32px)); margin-inline: auto; }
.mf-hscl-page main > .mf-hscl-section { padding: clamp(42px, 6vw, 78px) 0; scroll-margin-top: 126px; background-image: none !important; }
.mf-hscl-section--tint { background: linear-gradient(180deg, rgba(17, 49, 34, 0.52), rgba(3, 13, 9, 0.92)); border-block: 1px solid var(--hscl-line); }
.mf-hscl-kicker,.mf-hscl-label { display: block; font: 700 .72rem/1.3 var(--f-mono, monospace); letter-spacing: .14em; text-transform: uppercase; color: var(--hscl-gold); }
.mf-hscl-page h1,.mf-hscl-page h2,.mf-hscl-page h3 { color: var(--hscl-text); margin: 0; }
.mf-hscl-page p { color: var(--hscl-muted); }

.mf-hscl-hero { min-height: 470px; position: relative; display: grid; align-items: center; border-bottom: 1px solid var(--hscl-line); isolation: isolate; }
.mf-hscl-hero__image,.mf-hscl-hero__veil { position: absolute; inset: 0; width: 100%; height: 100%; }
.mf-hscl-hero__image { object-fit: cover; object-position: center 56%; z-index: -3; }
.mf-hscl-hero__veil { z-index: -2; background: linear-gradient(90deg, rgba(1, 10, 7, .98) 0%, rgba(2, 13, 9, .9) 48%, rgba(2, 12, 9, .42) 100%), linear-gradient(0deg, rgba(2, 11, 8, .95), transparent 55%); }
.mf-hscl-hero__grid { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(340px, .85fr); gap: clamp(28px, 5vw, 72px); align-items: center; padding-block: 52px; }
.mf-hscl-hero__copy h1 { max-width: 760px; margin-top: 12px; font: 400 clamp(2.45rem, 5vw, 4.7rem)/.95 var(--f-display, sans-serif); letter-spacing: -.045em; }
.mf-hscl-hero__copy > p { max-width: 660px; margin: 18px 0 0; font-size: clamp(1rem, 1.4vw, 1.15rem); line-height: 1.55; }
.mf-hscl-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 24px; }
.mf-hscl-button,.mf-hscl-tabs button,.mf-hscl-filter-tabs button { min-height: 44px; display: inline-flex; align-items: center; justify-content: center; border: 1px solid var(--hscl-line); border-radius: 12px; background: rgba(8, 25, 18, .9); color: var(--hscl-text); padding: 10px 16px; font: 800 .76rem/1 var(--f-mono, monospace); text-decoration: none; cursor: pointer; }
.mf-hscl-button:hover,.mf-hscl-button:focus-visible,.mf-hscl-tabs button:hover,.mf-hscl-tabs button:focus-visible,.mf-hscl-filter-tabs button:hover,.mf-hscl-filter-tabs button:focus-visible { border-color: var(--hscl-gold); color: var(--hscl-gold); transform: translateY(-1px); }
.mf-hscl-button--primary { background: linear-gradient(135deg, var(--hscl-gold), var(--hscl-lime)); border-color: transparent; color: #061006; }
.mf-hscl-button--primary:hover,.mf-hscl-button--primary:focus-visible { color: #061006; filter: brightness(1.05); }
.mf-hscl-hero__board,.mf-hscl-panel,.mf-hscl-score-card,.mf-hscl-desk { border: 1px solid var(--hscl-line); border-radius: 22px; background: linear-gradient(145deg, rgba(5, 19, 13, .95), rgba(10, 34, 24, .88)); box-shadow: 0 22px 60px rgba(0, 0, 0, .28); }
.mf-hscl-hero__board { padding: clamp(20px, 3vw, 30px); backdrop-filter: blur(14px); }
.mf-hscl-crest-block { display: flex; gap: 16px; align-items: center; }
.mf-hscl-crest-block img { width: 78px; height: 78px; border-radius: 18px; object-fit: cover; border: 1px solid var(--hscl-line); }
.mf-hscl-crest-block h2 { margin-top: 5px; font-size: clamp(1.25rem, 2vw, 1.7rem); line-height: 1.1; }
.mf-hscl-pulse { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin-top: 22px; }
.mf-hscl-pulse div { min-height: 92px; padding: 14px 10px; border: 1px solid rgba(255, 255, 255, .1); border-radius: 14px; background: rgba(255,255,255,.035); }
.mf-hscl-pulse strong { display: block; color: var(--hscl-gold); font-size: 1.4rem; }
.mf-hscl-pulse span { display: block; margin-top: 6px; color: var(--hscl-muted); font-size: .72rem; line-height: 1.25; }
.mf-hscl-source-note { margin: 16px 0 0; font-size: .78rem; line-height: 1.45; }

.mf-hscl-nav { position: sticky; top: var(--site-header-height, 0); z-index: 22; background: rgba(2, 11, 8, .95); border-bottom: 1px solid var(--hscl-line); backdrop-filter: blur(15px); }
.mf-hscl-nav__inner { display: flex; gap: 4px; overflow-x: auto; scrollbar-width: none; padding-block: 7px; }
.mf-hscl-nav__inner::-webkit-scrollbar { display: none; }
.mf-hscl-nav a { min-height: 44px; display: inline-flex; align-items: center; padding: 0 14px; border-radius: 10px; color: var(--hscl-muted); font: 700 .72rem/1 var(--f-mono, monospace); text-decoration: none; white-space: nowrap; }
.mf-hscl-nav a:hover,.mf-hscl-nav a:focus-visible { background: rgba(255, 211, 55, .1); color: var(--hscl-gold); }

.mf-hscl-section__head { display: flex; align-items: end; justify-content: space-between; gap: 24px; margin-bottom: 24px; }
.mf-hscl-section__head h2 { margin-top: 8px; max-width: 820px; font: 400 clamp(2rem, 4vw, 3.5rem)/1 var(--f-display, sans-serif); letter-spacing: -.035em; }
.mf-hscl-section__head p { max-width: 760px; margin: 12px 0 0; line-height: 1.55; }
.mf-hscl-desk { overflow: hidden; }
.mf-hscl-tabs { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; padding: 12px; border-bottom: 1px solid var(--hscl-line); }
.mf-hscl-tabs button[aria-selected="true"] { background: var(--hscl-gold); border-color: var(--hscl-gold); color: #071007; }
.mf-hscl-panel { padding: 22px; }
#mf-hscl-tab-panel { min-height: 230px; border: 0; border-radius: 0; box-shadow: none; background: transparent; }
.mf-hscl-tab-content { display: grid; grid-template-columns: 1.25fr .75fr; gap: 28px; align-items: center; }
.mf-hscl-tab-content h3 { margin-top: 8px; font-size: clamp(1.55rem, 3vw, 2.4rem); line-height: 1.05; }
.mf-hscl-tab-content p { line-height: 1.55; }
.mf-hscl-tab-facts { display: grid; gap: 9px; }
.mf-hscl-tab-facts div { padding: 13px 15px; border: 1px solid rgba(255,255,255,.1); border-radius: 12px; background: rgba(255,255,255,.035); }
.mf-hscl-tab-facts strong { display: block; color: var(--hscl-text); font-size: .9rem; }
.mf-hscl-tab-facts span { display: block; margin-top: 4px; color: var(--hscl-muted); font-size: .76rem; }

.mf-hscl-score-card { padding: clamp(20px, 4vw, 36px); }
.mf-hscl-score-card__meta { display: flex; flex-wrap: wrap; gap: 8px; }
.mf-hscl-score-card__meta span { padding: 7px 10px; border-radius: 999px; background: rgba(255, 211, 55, .1); color: var(--hscl-gold); font: 700 .68rem/1 var(--f-mono, monospace); }
.mf-hscl-score-card__match { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 24px; margin: 32px 0; }
.mf-hscl-score-card__match > div { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 20px; border: 1px solid rgba(255,255,255,.11); border-radius: 16px; background: rgba(255,255,255,.035); }
.mf-hscl-score-card__match span { font-weight: 800; font-size: clamp(1rem, 2vw, 1.25rem); }
.mf-hscl-score-card__match strong { font: 400 clamp(2.5rem, 5vw, 4rem)/1 var(--f-display, sans-serif); color: var(--hscl-gold); }
.mf-hscl-score-card__match p { margin: 0; font: 800 .68rem/1 var(--f-mono, monospace); text-transform: uppercase; letter-spacing: .14em; }
.mf-hscl-score-card__actions { display: flex; flex-wrap: wrap; gap: 10px; }

.mf-hscl-history-grid,.mf-hscl-official-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.mf-hscl-history-card,.mf-hscl-official-card { display: block; min-height: 225px; text-decoration: none; transition: transform .2s ease, border-color .2s ease; }
.mf-hscl-history-card:hover,.mf-hscl-history-card:focus-visible,.mf-hscl-official-card:hover,.mf-hscl-official-card:focus-visible { transform: translateY(-3px); border-color: var(--hscl-gold); }
.mf-hscl-history-card--boys { border-top: 4px solid var(--hscl-blue); }
.mf-hscl-history-card--girls { border-top: 4px solid var(--hscl-pink); }
.mf-hscl-history-card h3,.mf-hscl-official-card h3 { margin-top: 10px; font-size: 1.25rem; }
.mf-hscl-history-card p,.mf-hscl-official-card p { line-height: 1.5; }
.mf-hscl-card-cta { display: inline-block; margin-top: 12px; color: var(--hscl-gold); font: 800 .74rem/1.3 var(--f-mono, monospace); }

.mf-hscl-count { color: var(--hscl-gold); font: 800 .75rem/1 var(--f-mono, monospace); }
.mf-hscl-filterbar { display: grid; grid-template-columns: 1fr auto; gap: 16px; align-items: end; margin-bottom: 18px; }
.mf-hscl-search label { display: block; margin-bottom: 7px; color: var(--hscl-muted); font: 700 .72rem/1 var(--f-mono, monospace); }
.mf-hscl-search input { width: 100%; min-height: 48px; border: 1px solid var(--hscl-line); border-radius: 12px; background: rgba(2, 12, 8, .9); color: var(--hscl-text); padding: 0 14px; }
.mf-hscl-search input:focus { border-color: var(--hscl-gold); outline: 3px solid rgba(255, 211, 55, .18); }
.mf-hscl-filter-tabs { display: flex; gap: 8px; }
.mf-hscl-filter-tabs button[aria-pressed="true"] { background: var(--hscl-gold); border-color: var(--hscl-gold); color: #071007; }
.mf-hscl-school-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.mf-hscl-school-card { min-height: 170px; padding: 18px; border: 1px solid var(--hscl-line); border-radius: 16px; background: linear-gradient(145deg, rgba(6, 25, 17, .96), rgba(9, 35, 25, .75)); }
.mf-hscl-school-card[data-side="boys"] { border-top: 3px solid var(--hscl-blue); }
.mf-hscl-school-card[data-side="girls"] { border-top: 3px solid var(--hscl-pink); }
.mf-hscl-school-card h3 { margin-top: 8px; font-size: 1.05rem; }
.mf-hscl-school-card p { margin: 8px 0 14px; font-size: .8rem; }
.mf-hscl-school-card a { min-height: 44px; display: inline-flex; align-items: center; color: var(--hscl-gold); font: 800 .72rem/1.2 var(--f-mono, monospace); }
.mf-hscl-load-more { display: flex; justify-content: center; margin-top: 18px; }
.mf-hscl-empty { grid-column: 1 / -1; min-height: 140px; display: grid; place-items: center; text-align: center; }

.mf-hscl-story-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.mf-hscl-story { min-height: 220px; display: flex; flex-direction: column; padding: 20px; border: 1px solid var(--hscl-line); border-radius: 16px; background: var(--hscl-panel); }
.mf-hscl-story h3 { margin-top: 9px; font-size: 1.05rem; line-height: 1.25; }
.mf-hscl-story p { font-size: .82rem; line-height: 1.5; }
.mf-hscl-story a { min-height: 44px; display: inline-flex; align-items: center; margin-top: auto; color: var(--hscl-gold); font: 800 .72rem/1.2 var(--f-mono, monospace); }
.mf-hscl-official-card { display: grid; grid-template-columns: 76px 1fr; gap: 16px; }
.mf-hscl-official-card img { width: 76px; height: 76px; object-fit: cover; border-radius: 15px; border: 1px solid var(--hscl-line); }

@media (max-width: 900px) {
  .mf-hscl-hero__grid { grid-template-columns: 1fr; }
  .mf-hscl-hero__board { max-width: 680px; }
  .mf-hscl-history-grid,.mf-hscl-official-grid,.mf-hscl-school-grid,.mf-hscl-story-grid { grid-template-columns: repeat(2, 1fr); }
  .mf-hscl-tab-content { grid-template-columns: 1fr; }
}

@media (max-width: 640px) {
  .mf-hscl-container { width: min(100% - 24px, 1180px); }
  .mf-hscl-hero { min-height: auto; }
  .mf-hscl-hero__grid { padding-block: 34px; gap: 24px; }
  .mf-hscl-hero__copy h1 { font-size: clamp(2.25rem, 12vw, 3.2rem); }
  .mf-hscl-actions .mf-hscl-button { flex: 1 1 145px; }
  .mf-hscl-hero__board { padding: 18px; }
  .mf-hscl-pulse { grid-template-columns: repeat(3, 1fr); }
  .mf-hscl-pulse div { min-height: 78px; padding-inline: 8px; }
  .mf-hscl-section { padding: 42px 0; scroll-margin-top: 110px; }
  .mf-hscl-section__head { display: block; }
  .mf-hscl-section__head > .mf-hscl-button,.mf-hscl-section__head > .mf-hscl-count { margin-top: 16px; }
  .mf-hscl-tabs { grid-template-columns: 1fr; }
  .mf-hscl-tabs button { width: 100%; }
  .mf-hscl-score-card__match { grid-template-columns: 1fr; gap: 10px; }
  .mf-hscl-score-card__match p { text-align: center; }
  .mf-hscl-filterbar { grid-template-columns: 1fr; }
  .mf-hscl-filter-tabs { display: grid; grid-template-columns: repeat(3, 1fr); }
  .mf-hscl-history-grid,.mf-hscl-official-grid,.mf-hscl-school-grid,.mf-hscl-story-grid { grid-template-columns: 1fr; }
  .mf-hscl-school-card,.mf-hscl-story,.mf-hscl-history-card { min-height: auto; }
  .mf-hscl-official-card { grid-template-columns: 64px 1fr; }
  .mf-hscl-official-card img { width: 64px; height: 64px; }
}

@media (prefers-reduced-motion: reduce) {
  .mf-hscl-page * { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
}