/* ══ Schedule page ════════════════════════════════════════════════════════════
   Its own file (loaded with ?v=filemtime) rather than _styles.css, because
   .htaccess caches CSS as immutable for a year — an edit to an unversioned
   stylesheet never reaches returning visitors. Everything is scoped to .sc-page.
   League palette: navy #252f52 (nav bar) with the UVHL green #3cd918. */

.sc-page { font-family: helvetica, arial, sans-serif; font-size: 13px; line-height: 1.45; color: #4a5058; }
.sc-page *, .sc-page *::before, .sc-page *::after { box-sizing: border-box; }
.sc-page [hidden] { display: none !important; }

/* ── Hero ─────────────────────────────────────────────────────────────────── */
.sc-hero { position: relative; width: 100%; margin-top: 45px; overflow: hidden;
           background: linear-gradient(135deg,#1a2036 0%,#252f52 52%,#1a2036 100%);
           border-top: 4px solid #3cd918; box-shadow: 0 2px 16px rgba(0,0,0,.28); }
.sc-hero:before { content: ''; position: absolute; left: -60px; top: 50%; width: 340px; height: 340px;
                  transform: translateY(-50%); border-radius: 50%; pointer-events: none;
                  background: radial-gradient(circle, rgba(60,217,24,.9) 0%, transparent 66%); opacity: .16; }
.sc-hero:after  { content: ''; position: absolute; right: 0; top: 0; bottom: 0; width: 300px; pointer-events: none;
                  background: repeating-linear-gradient(115deg,transparent 0 26px,rgba(255,255,255,.04) 26px 34px); }
.sc-hero-inner { position: relative; z-index: 2; display: flex; align-items: center; gap: 24px; padding: 22px 28px; }
.sc-mark { width: 120px; flex: none; }
.sc-mark img { width: 100%; height: auto; display: block; filter: drop-shadow(0 4px 10px rgba(0,0,0,.5)); }
.sc-id { flex: 1 1 auto; min-width: 0; }
.sc-kicker { font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: .18em; color: #3cd918; }
.sc-title { font-family: 'Josefin Sans', helvetica, arial, sans-serif; font-size: 48px; line-height: 1;
            margin: 6px 0 0; color: #fff; text-transform: uppercase; font-weight: 600; letter-spacing: .015em; }
.sc-sub { color: rgba(255,255,255,.74); font-size: 13px; margin-top: 8px; }
.sc-sub b { color: #fff; }
.sc-sub i { color: rgba(255,255,255,.34); font-style: normal; margin: 0 5px; }

.sc-stats { display: flex; flex: none; }
.sc-stat { padding: 0 18px; text-align: center; border-left: 1px solid rgba(255,255,255,.15); }
.sc-stat:first-child { border-left: 0; }
.sc-stat b { display: block; color: #fff; font-size: 24px; line-height: 1.1; font-weight: 700;
             font-family: 'Josefin Sans', helvetica, arial, sans-serif; }
.sc-stat span { display: block; font-size: 9px; text-transform: uppercase; letter-spacing: .12em;
                color: rgba(255,255,255,.56); margin-top: 4px; font-weight: 700; }

/* ── Team filter (same crest row as the team page switcher) ───────────────── */
.sc-filter { display: flex; align-items: center; flex-wrap: wrap; gap: 4px 8px; padding: 9px 26px;
             background: rgba(255,255,255,.6); border-bottom: 1px solid #dfe3e7; }
.sc-filter-label { font-size: 9px; text-transform: uppercase; letter-spacing: .14em; color: #8a929c;
                   font-weight: 700; margin-right: 6px; flex: none; }
.sc-team { -webkit-appearance: none; appearance: none; display: flex; flex-direction: column; align-items: center;
           gap: 2px; width: 84px; padding: 3px 2px; margin: 0; cursor: pointer; background: transparent;
           border: 0; border-bottom: 2px solid transparent; border-radius: 6px 6px 0 0; font: inherit; overflow: hidden; }
.sc-team img { width: 36px; height: 36px; object-fit: contain; filter: grayscale(1); opacity: .45;
               transition: filter .15s, opacity .15s, transform .15s; }
.sc-team.is-all img { width: 52px; }
.sc-team span { font-size: 9px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: #99a1a9;
                line-height: 1.2; max-width: 100%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sc-team:hover img { filter: none; opacity: 1; transform: translateY(-2px); }
.sc-team:hover span { color: #3a4048; }
.sc-team:focus-visible { outline: 2px solid #252f52; outline-offset: 1px; }
.sc-team.is-current { border-bottom-color: var(--c,#3cd918); }
.sc-team.is-current img { filter: none; opacity: 1; }
.sc-team.is-current span { color: #22262b; }

/* ── Layout ───────────────────────────────────────────────────────────────── */
.sc-body { display: grid; grid-template-columns: minmax(0,1fr) 290px; gap: 24px; align-items: start;
           padding: 22px 26px 44px; }

.sc-toolbar { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap;
              gap: 10px; margin-bottom: 14px; }
.sc-tabs { display: inline-flex; padding: 3px; border-radius: 8px; background: #e2e6ea; }
.sc-tab { -webkit-appearance: none; appearance: none; border: 0; margin: 0; background: transparent; cursor: pointer;
          padding: 7px 14px; border-radius: 6px; font: 700 11px helvetica, arial, sans-serif;
          text-transform: uppercase; letter-spacing: .08em; color: #6a7178; transition: color .15s, background .15s; }
.sc-tab:hover { color: #22262b; }
.sc-tab[aria-selected="true"] { background: #fff; color: #22262b; box-shadow: 0 1px 3px rgba(0,0,0,.13); }
.sc-tab:focus-visible { outline: 2px solid #252f52; outline-offset: 1px; }
.sc-tab i { font-style: normal; display: inline-block; min-width: 18px; margin-left: 4px; padding: 1px 5px;
            border-radius: 9px; background: #d0d6dc; color: #59616a; font-size: 10px; letter-spacing: 0; text-align: center; }
.sc-tab[aria-selected="true"] i { background: #3cd918; color: #fff; }
.sc-showing { font-size: 12px; color: #79818a; }
.sc-showing b { color: #2f3640; }

.sc-list { display: flex; flex-direction: column; gap: 16px; }
/* Results read newest-first. */
.sc-list[data-view="results"] { flex-direction: column-reverse; }

/* ── Game night card ──────────────────────────────────────────────────────── */
.sc-night { background: #fff; border: 1px solid #e3e6ea; border-radius: 10px; overflow: hidden;
            box-shadow: 0 1px 4px rgba(0,0,0,.07); }
.sc-night.is-next { border-color: #3cd918; box-shadow: 0 0 0 1px #3cd918, 0 6px 18px rgba(60,217,24,.16); }
.sc-night-head { display: flex; align-items: center; gap: 14px; padding: 11px 16px;
                 background: linear-gradient(180deg,#fbfcfd 0%,#f1f3f5 100%); border-bottom: 1px solid #e6e9ec; }
.sc-date { flex: none; width: 46px; text-align: center; border-radius: 7px; overflow: hidden; background: #fff;
           box-shadow: 0 0 0 1px #dfe3e7, 0 1px 2px rgba(0,0,0,.06); }
.sc-date span { display: block; padding: 2px 0; background: #252f52; color: #fff; font-size: 9px; font-weight: 700;
                letter-spacing: .14em; text-transform: uppercase; }
.sc-night.is-next .sc-date span { background: #3cd918; }
.sc-date b { display: block; padding: 5px 0 3px; font-family: 'Josefin Sans', helvetica, arial, sans-serif;
             font-size: 22px; line-height: 1; color: #22262b; }
.sc-night-txt { flex: 1 1 auto; min-width: 0; }
.sc-night-day { font-size: 15px; font-weight: 700; color: #22262b; }
.sc-night-meta { font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: .1em; color: #8a929c; margin-top: 2px; }
.sc-badge { display: none; flex: none; padding: 4px 10px; border-radius: 20px; background: #3cd918; color: #fff;
            font-size: 9px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.sc-night.is-next .sc-badge { display: inline-block; }

/* ── Game row ─────────────────────────────────────────────────────────────── */
.sc-game { display: grid; grid-template-columns: 58px minmax(0,1fr) 84px 82px; align-items: center; gap: 12px;
           padding: 11px 16px; border-bottom: 1px solid #eef0f2; color: inherit; text-decoration: none;
           transition: background .12s; }
.sc-game:last-child { border-bottom: 0; }
a.sc-game:hover { background: #f6f8fa; }
a.sc-game:focus-visible { outline: 2px solid #252f52; outline-offset: -2px; }

.sc-time b { display: block; font-size: 14px; line-height: 1.1; color: #2f3640; }
.sc-time em { display: block; font-size: 10px; font-style: normal; color: #9aa1a9; letter-spacing: .06em; }

.sc-match { display: grid; grid-template-columns: minmax(0,1fr) 72px minmax(0,1fr); align-items: center; gap: 10px; }
.sc-tm { display: flex; align-items: center; gap: 10px; min-width: 0; font-size: 14px; font-weight: 700; color: #3a4048; }
.sc-away { justify-content: flex-end; text-align: right; }
.sc-tm img { width: 34px; height: 34px; object-fit: contain; flex: none; }
.sc-tname { min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sc-short { display: none; }
.sc-tm.is-win { color: #111418; }
.sc-tm.is-loss { color: #a0a7ae; font-weight: 600; }
.sc-tm.is-loss img { opacity: .5; filter: grayscale(.7); }

.sc-mid { display: flex; flex-direction: column; align-items: center; gap: 3px; text-align: center; }
.sc-at { font-size: 11px; font-weight: 700; letter-spacing: .08em; color: #b3b9bf; }
.sc-score { display: inline-flex; align-items: center; gap: 5px; padding: 4px 9px 3px; border-radius: 6px;
            background: #2f3640; color: #fff; font-family: 'Josefin Sans', helvetica, arial, sans-serif;
            font-size: 17px; line-height: 1; }
.sc-score i { font-style: normal; opacity: .45; }
.sc-mid-tag, .sc-flag { font-style: normal; font-size: 9px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.sc-mid-tag { color: #8a929c; }
.sc-flag { padding: 1px 7px; border-radius: 10px; background: #e9edf0; color: #59616a; }
.is-cup .sc-flag { background: #c9a24a; color: #fff; }

.sc-rink { font-size: 11px; color: #79818a; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sc-cta { justify-self: end; font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: .08em;
          color: #252f52; white-space: nowrap; padding: 6px 10px; border: 1px solid #dfe3e7; border-radius: 6px;
          transition: background .12s, color .12s, border-color .12s; }
.sc-cta:empty { display: none; }
a.sc-game:hover .sc-cta { background: #252f52; border-color: #252f52; color: #fff; }

.sc-match-event { display: flex; gap: 10px; justify-content: center; font-size: 14px; font-weight: 700; color: #2f3640; }
.sc-event-ico { color: #c9a24a; font-size: 15px; }

.sc-empty { padding: 40px 20px; border: 1px dashed #cdd3d9; border-radius: 10px; background: #fff; text-align: center; }
.sc-empty b { display: block; font-family: 'Josefin Sans', helvetica, arial, sans-serif; font-size: 21px; color: #2f3640; font-weight: 600; }
.sc-empty span { display: block; margin-top: 6px; font-size: 13px; color: #79818a; }

/* ── Subscribe card ───────────────────────────────────────────────────────── */
.sc-aside { position: sticky; top: 16px; }
.sc-cal { background: #fff; border: 1px solid #e3e6ea; border-radius: 10px; overflow: hidden; box-shadow: 0 1px 4px rgba(0,0,0,.08); }
.sc-cal-top { position: relative; overflow: hidden; padding: 16px 16px 15px; color: #fff;
              background: linear-gradient(135deg,#1a2036 0%,#252f52 100%); border-top: 3px solid #3cd918; }
/* Watermark tucked into the corner, faint enough that the copy over it stays clean. */
.sc-cal-art { position: absolute; right: -22px; bottom: -26px; width: 104px; height: 104px; color: rgba(255,255,255,.06); }
.sc-cal-art path:last-child { stroke: rgba(60,217,24,.22); }
.sc-cal-top b { position: relative; display: block; font-family: 'Josefin Sans', helvetica, arial, sans-serif;
                font-size: 21px; line-height: 1.15; font-weight: 600; }
.sc-cal-top span { position: relative; display: block; margin-top: 6px; font-size: 12px; line-height: 1.5; color: rgba(255,255,255,.74); }
.sc-cal-top em { font-style: normal; color: #fff; font-weight: 700; }

.sc-cal-body { padding: 14px 16px 16px; }
.sc-cal-label { display: block; margin-bottom: 6px; font-size: 9.5px; font-weight: 700; text-transform: uppercase;
                letter-spacing: .12em; color: #8a929c; }
.sc-select { position: relative; display: flex; align-items: center; padding-left: 9px; background: #fff;
             border: 1px solid #d3d9de; border-radius: 8px; }
.sc-select:focus-within { border-color: #252f52; box-shadow: 0 0 0 2px rgba(37,47,82,.15); }
.sc-select:after { content: ''; position: absolute; right: 13px; top: 50%; width: 7px; height: 7px; pointer-events: none;
                   border-right: 2px solid #6a7178; border-bottom: 2px solid #6a7178; transform: translateY(-70%) rotate(45deg); }
.sc-select img { width: 28px; height: 28px; object-fit: contain; flex: none; }
.sc-select select { -webkit-appearance: none; appearance: none; flex: 1; min-width: 0; margin: 0; padding: 10px 32px 10px 8px;
                    border: 0; background: transparent; cursor: pointer; outline: none;
                    font: 700 14px helvetica, arial, sans-serif; color: #22262b; }

.sc-cal-btns { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 12px; }
.sc-cal-btn { -webkit-appearance: none; appearance: none; display: flex; align-items: center; gap: 8px; min-width: 0; margin: 0;
              padding: 9px 10px; border: 1px solid #dfe3e7; border-radius: 8px; background: #fff; cursor: pointer;
              font: 700 12px helvetica, arial, sans-serif; color: #2f3640; text-decoration: none; text-align: left;
              white-space: nowrap; transition: background .12s, border-color .12s, color .12s; }
.sc-cal-btn:hover { background: #f4f7fb; border-color: #9aa6c4; }
.sc-cal-btn:focus-visible { outline: 2px solid #252f52; outline-offset: 1px; }
.sc-cal-btn.is-primary { grid-column: 1 / -1; justify-content: center; padding: 11px 12px; font-size: 13px;
                         background: #252f52; border-color: #252f52; color: #fff; box-shadow: 0 1px 3px rgba(0,0,0,.18); }
.sc-cal-btn.is-primary:hover { background: #313d69; border-color: #313d69; }
.sc-cal-btn.is-done { background: #eef9ea; border-color: #9edb8c; color: #2f7a1f; }
.sc-cal-ico { flex: none; display: flex; align-items: center; justify-content: center; width: 18px; height: 18px; }
.sc-cal-ico svg { width: 100%; height: 100%; }
.sc-cal-ico-g { width: 22px; height: 22px; padding: 3px; border-radius: 50%; background: #fff; }

.sc-cal-foot { margin-top: 12px; padding-top: 11px; border-top: 1px solid #eef0f2; font-size: 11px; color: #9aa1a9; }
.sc-cal-foot a { color: #252f52; font-weight: 700; text-decoration: none; }
.sc-cal-foot a:hover { text-decoration: underline; }
.sc-cal-foot i { font-style: normal; color: #cfd4d9; margin: 0 3px; }
.sc-cal-note { margin: 6px 0 0; font-size: 11px; line-height: 1.5; color: #9aa1a9; }

/* ── Responsive ───────────────────────────────────────────────────────────── */
@media (max-width: 900px) {
  .sc-hero-inner { flex-wrap: wrap; gap: 14px; padding: 18px 16px; }
  .sc-mark { width: 84px; }
  .sc-title { font-size: 36px; }
  .sc-stats { width: 100%; justify-content: space-between; }
  .sc-stat { padding: 0 6px; flex: 1; }
  .sc-body { grid-template-columns: minmax(0,1fr); padding: 18px 16px 36px; }
  /* Subscribe card first on narrow screens, where a sticky rail isn't possible. */
  .sc-aside { position: static; order: -1; }
}
@media (max-width: 620px) {
  .sc-hero:after { display: none; }
  .sc-mark { width: 64px; }
  .sc-title { font-size: 30px; }
  .sc-stat b { font-size: 19px; }
  /* One swipeable strip, so a sixth or seventh team never wraps onto its own line. */
  .sc-filter { flex-wrap: nowrap; gap: 4px; padding: 8px 10px; overflow-x: auto;
               -webkit-overflow-scrolling: touch; scrollbar-width: none; }
  .sc-filter::-webkit-scrollbar { display: none; }
  .sc-filter-label { display: none; }
  .sc-team { flex: none; width: 60px; }
  .sc-team img { width: 30px; height: 30px; }
  .sc-team.is-all img { width: 44px; }
  .sc-body { padding: 14px 10px 30px; }
  .sc-toolbar { justify-content: center; }
  .sc-showing { display: none; }
  .sc-night-head { padding: 10px 12px; gap: 11px; }
  .sc-night-day { font-size: 14px; }
  .sc-badge { padding: 3px 8px; font-size: 8px; }
  .sc-game { grid-template-columns: 46px minmax(0,1fr); gap: 8px; padding: 10px 12px; }
  .sc-rink, .sc-cta { display: none; }
  .sc-match { grid-template-columns: minmax(0,1fr) 58px minmax(0,1fr); gap: 7px; }
  .sc-tm { gap: 7px; font-size: 13px; }
  .sc-tm img { width: 28px; height: 28px; }
  .sc-long { display: none; }
  .sc-short { display: inline; }
  .sc-score { font-size: 15px; padding: 4px 7px 3px; }
}
