:root { --hsclc-ink:#040a07; --hsclc-panel:#0a1710; --hsclc-text:#f6f8ef; --hsclc-muted:#b9c4b6; --hsclc-gold:#ffd33a; --hsclc-lime:#b6f042; --hsclc-line:rgba(255,211,58,.27); --hsclc-girls:#e7649f; --hsclc-boys:#50a9ed; }
.mf-hscl-command-page { background:var(--hsclc-ink); color:var(--hsclc-text); }
.mf-hscl-command-page main { overflow:clip; }
.hscl-command-container { width:min(1240px,calc(100% - 48px)); margin-inline:auto; }
.hscl-command-hero { position:relative; min-height:390px; isolation:isolate; display:grid; align-items:center; border-bottom:1px solid var(--hsclc-line); }
.hscl-command-hero__image,.hscl-command-hero__veil { position:absolute; inset:0; width:100%; height:100%; }
.hscl-command-hero__image { z-index:-2; object-fit:cover; object-position:center 56%; }
.hscl-command-hero__veil { z-index:-1; background:linear-gradient(90deg,rgba(3,10,7,.98) 0%,rgba(3,11,7,.88) 51%,rgba(3,11,7,.48) 100%),linear-gradient(180deg,rgba(3,10,7,.06),rgba(3,10,7,.96)); }
.hscl-command-hero::after { content:''; position:absolute; inset:0; z-index:-1; pointer-events:none; background:linear-gradient(135deg,transparent 0 8%,rgba(255,211,58,.74) 8.1% 8.25%,transparent 8.35% 9%,rgba(87,185,89,.74) 9.1% 9.25%,transparent 9.35%); }
.hscl-command-hero__grid { display:grid; grid-template-columns:minmax(0,1.55fr) minmax(320px,.7fr); gap:clamp(26px,4vw,64px); align-items:center; padding-block:38px; }
.hscl-command-kicker { display:block; color:var(--hsclc-gold); font:800 .7rem/1.2 var(--f-mono,monospace); letter-spacing:.13em; text-transform:uppercase; }
.hscl-command-hero h1,.hscl-command-section h2,.hscl-command-section h3 { margin:0; color:var(--hsclc-text); }
.hscl-command-hero h1 { max-width:none; margin-top:12px; font:400 clamp(2.1rem,2.35vw,2.8rem)/.95 var(--f-display,sans-serif); letter-spacing:0; white-space:nowrap; }
.hscl-command-hero h1 span { color:#dce8dd; }
.hscl-command-hero__copy>p { max-width:610px; margin:16px 0 0; color:#e2e9df; font-size:.94rem; line-height:1.5; }
.hscl-command-actions { display:flex; flex-wrap:wrap; gap:8px; margin-top:20px; }
.hscl-command-button { min-height:44px; display:inline-flex; align-items:center; justify-content:center; border:1px solid var(--hsclc-line); border-radius:6px; padding:10px 14px; background:rgba(6,20,13,.84); color:var(--hsclc-text); font:800 .72rem/1.1 var(--f-mono,monospace); text-decoration:none; transition:transform .16s ease,border-color .16s ease,background .16s ease; }
.hscl-command-button:hover,.hscl-command-button:focus-visible { transform:translateY(-2px); border-color:var(--hsclc-gold); color:var(--hsclc-gold); }
.hscl-command-button--primary { border-color:transparent; background:linear-gradient(100deg,var(--hsclc-gold),var(--hsclc-lime)); color:#061007; }
.hscl-command-button--primary:hover,.hscl-command-button--primary:focus-visible { color:#061007; filter:brightness(1.08); }
.hscl-command-hero__board { padding:20px; border:1px solid var(--hsclc-line); border-radius:8px; background:rgba(4,17,10,.88); box-shadow:0 25px 70px rgba(0,0,0,.35); backdrop-filter:blur(15px); }
.hscl-command-hero__brand { display:grid; grid-template-columns:76px 1fr; gap:16px; align-items:center; }
.hscl-command-hero__brand img { width:76px; height:76px; object-fit:cover; border:1px solid var(--hsclc-line); border-radius:6px; }
.hscl-command-hero__brand span,.hscl-command-hero__brand strong { display:block; }
.hscl-command-hero__brand span { color:var(--hsclc-gold); font:800 .66rem/1.2 var(--f-mono,monospace); letter-spacing:.11em; text-transform:uppercase; }
.hscl-command-hero__brand strong { margin-top:7px; font-size:1.12rem; line-height:1.2; }
.hscl-command-stat-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; margin:16px 0 0; }
.hscl-command-stat-grid div { min-height:66px; padding:10px; border:1px solid rgba(255,255,255,.11); background:rgba(255,255,255,.035); }
.hscl-command-stat-grid dt { color:var(--hsclc-muted); font:700 .65rem/1 var(--f-mono,monospace); text-transform:uppercase; }
.hscl-command-stat-grid dd { margin:8px 0 0; color:var(--hsclc-gold); font:800 1rem/1.1 var(--f-mono,monospace); }
.hscl-command-source-note { margin:13px 0 0; color:var(--hsclc-muted); font-size:.73rem; line-height:1.45; }
.hscl-command-nav { position:sticky; top:var(--site-header-height,0); z-index:20; border-bottom:1px solid var(--hsclc-line); background:rgba(3,11,7,.96); backdrop-filter:blur(13px); }
.hscl-command-nav__inner { display:flex; gap:4px; overflow-x:auto; padding-block:7px; scrollbar-width:none; }
.hscl-command-nav__inner::-webkit-scrollbar { display:none; }
.hscl-command-nav a { min-height:40px; display:inline-flex; align-items:center; padding:0 13px; color:var(--hsclc-muted); font:800 .7rem/1 var(--f-mono,monospace); text-decoration:none; white-space:nowrap; }
.hscl-command-nav a:hover,.hscl-command-nav a:focus-visible { color:var(--hsclc-gold); background:rgba(255,211,58,.08); }
.hscl-command-section { padding:clamp(48px,6vw,78px) 0; background:var(--hsclc-ink); }
.hscl-command-section--tint,.hscl-command-section--stories { border-block:1px solid var(--hsclc-line); background:linear-gradient(110deg,#07140e,#05100b 55%,#09170f); }
.hscl-command-section--stories,#official { position:relative; isolation:isolate; overflow:hidden; }
.hscl-command-section--stories::before,#official::before { content:''; position:absolute; z-index:-1; pointer-events:none; background-repeat:no-repeat; background-position:calc(100% + 65px) center; background-size:min(510px,42vw); opacity:.065; filter:grayscale(1) contrast(1.15); }
.hscl-command-section--stories::before { inset:0; background-image:url('/assets/HSChamps_logo.jpg'); }
#official::before { inset:0; background-image:url('/assets/img/league-logos/mshsaa.jpg'); }
.hscl-command-section-head { display:grid; grid-template-columns:minmax(0,1fr) minmax(260px,.52fr); gap:42px; align-items:end; margin-bottom:26px; }
.hscl-command-section-head h2 { max-width:770px; margin-top:8px; font:400 clamp(2.2rem,4vw,3.8rem)/.94 var(--f-display,sans-serif); letter-spacing:0; }
.hscl-command-section-head>p { margin:0; color:var(--hsclc-muted); font-size:.92rem; line-height:1.6; }
.hscl-command-source-grid { display:grid; grid-template-columns:1.3fr 1fr 1fr; gap:14px; }
.hscl-command-source-card { position:relative; min-height:238px; display:flex; flex-direction:column; padding:19px; overflow:hidden; border:1px solid var(--hsclc-line); border-radius:7px; background:var(--hsclc-panel); color:var(--hsclc-text); text-decoration:none; transition:transform .18s ease,border-color .18s ease; }
.hscl-command-source-card:hover,.hscl-command-source-card:focus-visible { transform:translateY(-3px); border-color:var(--hsclc-gold); }
.hscl-command-source-card img { width:58px; height:58px; margin-bottom:auto; object-fit:cover; border:1px solid var(--hsclc-line); border-radius:5px; background:#fff; }
.hscl-command-source-card span { margin-top:20px; color:var(--hsclc-gold); font:800 .66rem/1.2 var(--f-mono,monospace); letter-spacing:.1em; text-transform:uppercase; }
.hscl-command-source-card h3 { margin-top:8px; max-width:410px; font-size:clamp(1.22rem,2vw,1.65rem); line-height:1.04; }
.hscl-command-source-card small { margin-top:14px; color:var(--hsclc-muted); font-size:.75rem; }
.hscl-command-source-card--hscl { background:linear-gradient(125deg,rgba(7,25,15,.98),rgba(28,40,15,.96)); }
.hscl-command-source-card--state { background:linear-gradient(125deg,rgba(8,18,25,.98),rgba(8,33,30,.96)); }
.hscl-command-source-card__mark { width:58px; height:58px; display:grid; place-items:center; margin:0!important; border:1px solid var(--hsclc-line); border-radius:5px; color:var(--hsclc-gold); font:800 1.1rem/1 var(--f-display,sans-serif); }
.hscl-command-section--explainer { border-block:1px solid var(--hsclc-line); background:linear-gradient(100deg,rgba(33,20,6,.74),rgba(7,21,13,.98) 50%,rgba(4,10,7,.98)); }
.hscl-command-explainer-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:14px; }
.hscl-command-explainer-card { min-height:260px; display:flex; flex-direction:column; padding:24px; border:1px solid var(--hsclc-line); background:rgba(5,18,11,.9); }
.hscl-command-explainer-card--national { border-top:4px solid var(--hsclc-gold); }
.hscl-command-explainer-card--stl { border-top:4px solid var(--hsclc-lime); }
.hscl-command-explainer-card span,.hscl-command-principles>span { color:var(--hsclc-gold); font:800 .66rem/1.2 var(--f-mono,monospace); letter-spacing:.1em; text-transform:uppercase; }
.hscl-command-explainer-card h3 { max-width:580px; margin-top:12px; font-size:clamp(1.45rem,2.5vw,2.25rem); line-height:1.02; }
.hscl-command-explainer-card p { max-width:620px; color:var(--hsclc-muted); line-height:1.55; }
.hscl-command-explainer-card a { margin-top:auto; color:var(--hsclc-gold); font:800 .72rem/1.2 var(--f-mono,monospace); text-decoration:none; }
.hscl-command-principles { display:flex; flex-wrap:wrap; gap:8px; align-items:center; margin-top:14px; padding:14px; border:1px solid var(--hsclc-line); background:rgba(255,211,58,.055); }
.hscl-command-principles>span { margin-right:4px; }
.hscl-command-principles strong { min-height:32px; display:inline-flex; align-items:center; padding:0 10px; border:1px solid rgba(255,255,255,.13); color:var(--hsclc-text); font-size:.77rem; }
.hscl-command-season-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:14px; }
.hscl-command-season-card,.hscl-command-season-note { min-height:282px; padding:24px; border:1px solid var(--hsclc-line); border-radius:7px; background:var(--hsclc-panel); }
.hscl-command-season-card--girls { border-top:4px solid var(--hsclc-girls); }
.hscl-command-season-card--boys { border-top:4px solid var(--hsclc-boys); }
.hscl-command-season-card__top { display:flex; align-items:center; justify-content:space-between; gap:14px; }
.hscl-command-season-card__top span { color:var(--hsclc-gold); font:800 .7rem/1 var(--f-mono,monospace); letter-spacing:.1em; text-transform:uppercase; }
.hscl-command-season-card__top strong { color:var(--hsclc-muted); font-size:.76rem; }
.hscl-command-season-card h3 { margin-top:20px; font-size:clamp(1.55rem,2.7vw,2.3rem); line-height:1; }
.hscl-command-season-card p { max-width:600px; color:var(--hsclc-muted); line-height:1.55; }
.hscl-command-season-card__links { display:flex; flex-wrap:wrap; gap:15px; margin-top:18px; }
.hscl-command-season-card__links a,.hscl-command-season-note a { color:var(--hsclc-gold); font:800 .72rem/1.2 var(--f-mono,monospace); text-decoration:none; }
.hscl-command-season-card__links a:hover,.hscl-command-season-card__links a:focus-visible,.hscl-command-season-note a:hover,.hscl-command-season-note a:focus-visible { text-decoration:underline; }
.hscl-command-season-note { grid-column:1/-1; min-height:auto; display:flex; align-items:center; justify-content:space-between; gap:28px; padding-block:20px; background:linear-gradient(90deg,rgba(255,211,58,.09),rgba(10,34,21,.85)); }
.hscl-command-season-note span { color:var(--hsclc-gold); font:800 .68rem/1 var(--f-mono,monospace); text-transform:uppercase; }
.hscl-command-season-note strong { max-width:650px; font-size:.95rem; line-height:1.35; }
.hscl-command-filter { display:flex; justify-content:flex-end; gap:6px; }
.hscl-command-filter button { min-height:40px; border:1px solid var(--hsclc-line); border-radius:5px; padding:8px 12px; background:transparent; color:var(--hsclc-muted); font:800 .7rem/1 var(--f-mono,monospace); cursor:pointer; }
.hscl-command-filter button.is-active,.hscl-command-filter button:hover,.hscl-command-filter button:focus-visible { border-color:var(--hsclc-gold); background:var(--hsclc-gold); color:#061007; }
.hscl-command-school-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:10px; }
.hscl-command-school-welcome { display:grid; grid-template-columns:68px minmax(0,1fr) auto; gap:16px; align-items:center; margin:-4px 0 16px; padding:14px 16px; border:1px solid var(--hsclc-line); border-left:4px solid var(--hsclc-gold); border-radius:7px; background:linear-gradient(90deg,rgba(255,211,58,.1),rgba(9,29,18,.96) 47%,rgba(4,13,9,.94)); }
.hscl-command-school-welcome img { width:64px; height:64px; object-fit:cover; border:1px solid var(--hsclc-line); border-radius:5px; background:#fff; }
.hscl-command-school-welcome span,.hscl-command-school-welcome strong,.hscl-command-school-welcome p { display:block; }
.hscl-command-school-welcome span { color:var(--hsclc-gold); font:800 .65rem/1 var(--f-mono,monospace); letter-spacing:.1em; text-transform:uppercase; }
.hscl-command-school-welcome strong { margin-top:6px; font-size:1rem; line-height:1.25; }
.hscl-command-school-welcome p { max-width:800px; margin:5px 0 0; color:var(--hsclc-muted); font-size:.78rem; line-height:1.45; }
.hscl-command-school-welcome a { min-height:38px; display:inline-flex; align-items:center; justify-content:center; padding:8px 10px; border:1px solid var(--hsclc-gold); color:var(--hsclc-gold); font:800 .67rem/1.15 var(--f-mono,monospace); text-align:center; text-decoration:none; }
.hscl-command-school-welcome a:hover,.hscl-command-school-welcome a:focus-visible { background:var(--hsclc-gold); color:#061007; }
.hscl-command-school-card { min-height:0; aspect-ratio:1; display:flex; flex-direction:column; padding:14px; overflow:hidden; border:1px solid rgba(255,255,255,.13); background:linear-gradient(145deg,#091711,#06100b); transition:border-color .16s ease,transform .16s ease; }
.hscl-command-school-card:hover { transform:translateY(-2px); border-color:var(--hsclc-gold); }
.hscl-command-school-card--girls { border-top:3px solid var(--hsclc-girls); }
.hscl-command-school-card--boys { border-top:3px solid var(--hsclc-boys); }
.hscl-command-school-card__identity { display:flex; align-items:center; gap:9px; }
.hscl-command-school-card__identity>span:last-child { color:var(--hsclc-muted); font:800 .64rem/1 var(--f-mono,monospace); text-transform:uppercase; }
.hscl-command-school-card__mark,.hscl-command-school-card__monogram { width:48px!important; height:48px!important; max-width:48px; max-height:48px; display:grid; place-items:center; flex:0 0 48px; padding:3px; border:1px solid rgba(255,211,58,.5); border-radius:4px; background:#fff; object-fit:contain; }
.hscl-command-school-card__monogram { color:var(--hsclc-gold); background:rgba(255,211,58,.07); font:800 .72rem/1 var(--f-mono,monospace); letter-spacing:.04em; }
.hscl-command-school-card h3 { margin-top:11px; font-size:.96rem; line-height:1.06; }
.hscl-command-school-card p { margin:6px 0 2px; color:var(--hsclc-muted); font-size:.73rem; }
.hscl-command-school-card small { color:#a9b9a9; font-size:.64rem; line-height:1.3; }
.hscl-command-school-card a { margin-top:auto; color:var(--hsclc-gold); font:800 .7rem/1.2 var(--f-mono,monospace); text-decoration:none; }
.hscl-command-school-card b,.hscl-command-story-card b { font-size:1rem; }
.hscl-command-footnote { margin:18px 0 0; color:var(--hsclc-muted); font-size:.78rem; line-height:1.45; }
.hscl-command-feed-tools { display:grid; justify-items:end; gap:10px; }
.hscl-command-feed-status { max-width:290px; border-left:2px solid var(--hsclc-gold); padding-left:12px; color:var(--hsclc-muted); font-size:.78rem; line-height:1.4; }
.hscl-command-story-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; }
.hscl-command-story-card,.hscl-command-story-empty { min-height:220px; display:flex; flex-direction:column; padding:19px; border:1px solid var(--hsclc-line); border-radius:6px; background:rgba(8,23,14,.82); }
.hscl-command-story-card span { color:var(--hsclc-gold); font:800 .64rem/1.3 var(--f-mono,monospace); letter-spacing:.08em; text-transform:uppercase; }
.hscl-command-story-card h3 { margin-top:10px; font-size:1.14rem; line-height:1.18; }
.hscl-command-story-card p,.hscl-command-story-empty p { color:var(--hsclc-muted); font-size:.82rem; line-height:1.5; }
.hscl-command-story-card a { margin-top:auto; color:var(--hsclc-gold); font:800 .72rem/1.2 var(--f-mono,monospace); text-decoration:none; }
.hscl-command-story-empty { grid-column:1/-1; align-items:center; justify-content:center; text-align:center; }
.hscl-command-story-empty strong { font-size:1.1rem; }
.hscl-command-submit-band { display:flex; align-items:center; justify-content:space-between; gap:28px; margin-top:26px; padding:21px; border:1px solid var(--hsclc-line); background:rgba(255,211,58,.06); }
.hscl-command-submit-band span,.hscl-command-submit-band strong { display:block; }
.hscl-command-submit-band span { color:var(--hsclc-gold); font:800 .65rem/1.2 var(--f-mono,monospace); letter-spacing:.1em; text-transform:uppercase; }
.hscl-command-submit-band strong { margin-top:7px; font-size:.98rem; }
.hscl-command-pathway-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:10px; }
.hscl-command-pathway-grid a { min-height:166px; display:flex; flex-direction:column; padding:18px; border:1px solid var(--hsclc-line); background:rgba(6,20,12,.85); color:var(--hsclc-text); text-decoration:none; transition:border-color .18s ease,transform .18s ease,background .18s ease; }
.hscl-command-pathway-grid a:hover,.hscl-command-pathway-grid a:focus-visible { transform:translateY(-3px); border-color:var(--hsclc-gold); }
.hscl-command-pathway-grid span { color:var(--hsclc-gold); font:800 .65rem/1 var(--f-mono,monospace); text-transform:uppercase; }
.hscl-command-pathway-grid strong { margin-top:10px; font-size:1.1rem; line-height:1.1; }
.hscl-command-pathway-grid small { margin-top:auto; color:var(--hsclc-muted); font-size:.76rem; line-height:1.4; }
.hscl-command-pathway-grid b { color:var(--hsclc-gold); font-size:1rem; }
@media (max-width:980px) { .hscl-command-hero__grid,.hscl-command-section-head { grid-template-columns:1fr; } .hscl-command-section-head { gap:16px; } .hscl-command-section-head>p,.hscl-command-feed-tools { justify-self:start; } .hscl-command-feed-tools { justify-items:start; } .hscl-command-source-grid,.hscl-command-school-grid,.hscl-command-pathway-grid { grid-template-columns:repeat(2,1fr); } .hscl-command-hero h1 { white-space:normal; } }
@media (max-width:980px) { .hscl-command-school-welcome { grid-template-columns:68px minmax(0,1fr); } .hscl-command-school-welcome a { grid-column:2; justify-self:start; } }
@media (max-width:680px) { .hscl-command-container { width:min(100% - 28px,1240px); } .hscl-command-hero { min-height:auto; } .hscl-command-hero__grid { gap:26px; padding-block:42px; } .hscl-command-hero h1 { font-size:clamp(2.7rem,12vw,4.4rem); } .hscl-command-actions .hscl-command-button { flex:1 1 145px; } .hscl-command-hero__board { padding:18px; } .hscl-command-source-grid,.hscl-command-explainer-grid,.hscl-command-season-grid,.hscl-command-school-grid,.hscl-command-story-grid,.hscl-command-pathway-grid { grid-template-columns:1fr; } .hscl-command-school-card { aspect-ratio:auto; min-height:170px; } .hscl-command-season-note,.hscl-command-submit-band { display:grid; gap:14px; } .hscl-command-filter { justify-content:start; } .hscl-command-school-welcome { grid-template-columns:56px 1fr; gap:12px; padding:13px; } .hscl-command-school-welcome img { width:56px; height:56px; } .hscl-command-school-welcome a { grid-column:1/-1; justify-self:stretch; } }
@media (prefers-reduced-motion:reduce) { .mf-hscl-command-page *,.mf-hscl-command-page *::before,.mf-hscl-command-page *::after { scroll-behavior:auto!important; transition-duration:.01ms!important; } }
