:root { --accent:#f15a22; --on-accent:#fff; --accent-deep:color-mix(in srgb,var(--accent) 78%,#000); --accent-text:color-mix(in srgb,var(--accent) 72%,var(--ink)); --ink:#11100f; --paper:#f3efe6; --muted:#b8b2a7; --line:#d7d0c3; font-family:-apple-system,BlinkMacSystemFont,'Hiragino Sans','Yu Gothic',sans-serif; color:var(--ink); background:var(--paper); }
* { box-sizing:border-box; }
body { margin:0; min-width:320px; background:var(--paper); }
a { color:inherit; text-decoration:none; }
.hero { color:white; min-height:420px; padding:24px 20px 40px; background:radial-gradient(circle at 84% 18%,color-mix(in srgb,var(--accent) 28%,#1a1816) 0,transparent 34%),linear-gradient(155deg,#1a1816,#090909 70%); position:relative; overflow:hidden; }
.hero::after { content:'143'; position:absolute; right:-12px; bottom:-86px; font:800 260px/1 'Barlow Condensed'; color:transparent; -webkit-text-stroke:1px #ffffff20; transform:skew(-8deg); }
.brand-mark { min-width:48px; width:max-content; height:48px; padding:0 11px; border:2px solid var(--accent); color:var(--accent); display:grid; place-items:center; border-radius:24px; font:900 italic 24px/1 Arial Narrow,Impact,sans-serif; }
.hero-top { display:flex; justify-content:space-between; align-items:center; position:relative; z-index:1; }
.all-teams { font:700 11px 'Barlow Condensed'; letter-spacing:.14em; color:#aaa; padding:12px 0 12px 12px; }
.eyebrow { font:800 12px/1 Arial Narrow,Impact,sans-serif; letter-spacing:.24em; color:var(--accent); margin:64px 0 14px; }
.hero h1 { font:900 70px/.82 Arial Narrow,Impact,sans-serif; letter-spacing:-.04em; margin:0; max-width:600px; }
.hero h1 em { color:var(--accent); font-style:italic; }
.lede { margin:22px 0 40px; font-weight:600; letter-spacing:.05em; }
.progress { max-width:620px; position:relative; z-index:1; }
.progress strong { font:800 30px 'Barlow Condensed'; color:var(--accent); }
.progress span { font:700 14px 'Barlow Condensed'; letter-spacing:.12em; color:#aaa; }
.progress-track { height:3px; background:#ffffff25; margin-top:8px; }
.progress-track i { display:block; height:100%; background:var(--accent); transition:width .3s; }
.calendar-wrap { padding:44px 16px 80px; max-width:860px; margin:auto; }
.month-block { margin-bottom:56px; }
.month-title { display:flex; justify-content:space-between; align-items:baseline; border-bottom:3px solid var(--ink); margin-bottom:12px; }
.month-title h2 { font:800 34px/1 'Barlow Condensed'; margin:0 0 7px; letter-spacing:.03em; }
.month-title span { font:700 13px 'Barlow Condensed'; color:var(--accent-text); }
.weekdays,.days { display:grid; grid-template-columns:repeat(7,1fr); gap:4px; }
.weekdays { margin-bottom:5px; }
.weekdays span { text-align:center; font:700 9px 'Barlow Condensed'; color:#827c72; }
.day { aspect-ratio:.82; min-width:0; position:relative; border:1px solid var(--line); padding:6px; font:600 12px 'Barlow Condensed'; }
.rest { color:#aaa39a; border-color:transparent; }
.game-cell { color:var(--on-accent); border-color:var(--accent-deep); background:linear-gradient(145deg,color-mix(in srgb,var(--accent) 90%,#fff),color-mix(in srgb,var(--accent) 90%,#000)); box-shadow:0 3px 0 var(--accent-deep); transition:transform .15s,filter .15s; }
.game-cell:active { transform:translateY(2px); box-shadow:0 1px 0 var(--accent-deep); }
.day-number { position:absolute; top:5px; left:6px; }
.opponent { position:absolute; right:5px; bottom:4px; font-size:13px; font-weight:800; opacity:.78; }
.check { display:none; position:absolute; inset:0; place-items:center; color:#fff; font:800 24px 'Barlow Condensed'; background:#111d; }
.game-cell.is-watched .check { display:grid; }
footer { background:#111; color:#777; padding:28px 20px; }
footer div { display:flex; justify-content:space-between; font:700 10px 'Barlow Condensed'; letter-spacing:.12em; }
footer p { margin:18px 0 0; font-size:11px; line-height:1.7; color:#8a8a8a; }
.game-page { min-height:100vh; background:#111; color:white; padding:20px 18px 40px; }
.game-page nav { display:flex; justify-content:space-between; font:700 11px 'Barlow Condensed'; letter-spacing:.14em; color:#999; max-width:840px; margin:auto; }
.game-page article,.game-nav { max-width:840px; margin:auto; }
.game-page .eyebrow { margin:66px 0 14px; }
.game-date { margin:0; font:800 64px/.85 'Barlow Condensed'; letter-spacing:-.035em; }
.scoreboard { border-top:1px solid #444; border-bottom:1px solid #444; margin:30px 0 22px; padding:20px 0; }
.scoreboard p { font:800 27px/1.1 'Barlow Condensed'; margin:0 0 10px; }
.scoreboard span { font:600 11px 'Barlow Condensed'; letter-spacing:.1em; color:#999; }
.description { min-height:2em; margin:0 0 28px; color:#ddd; font-size:14px; font-weight:600; line-height:1.7; }
.video-wrap { aspect-ratio:16/9; background:#000; }
.video-wrap iframe,.video-shell { width:100%; height:100%; border:0; }
.video-shell { cursor:pointer; color:white; display:grid; place-items:center; align-content:center; gap:12px; position:relative; overflow:hidden; background-image:linear-gradient(#0004,#0009),var(--thumb); background-size:cover; background-position:center; }
.video-shell::before { content:''; position:absolute; inset:0; background:linear-gradient(110deg,transparent 30%,color-mix(in srgb,var(--accent) 13%,transparent)); }
.play-icon { width:64px; height:64px; border-radius:50%; display:grid; place-items:center; padding-left:4px; background:var(--accent); color:var(--on-accent); font-size:21px; z-index:1; box-shadow:0 12px 30px #0009; }
.play-label { z-index:1; font:700 11px 'Barlow Condensed'; letter-spacing:.16em; }
.video-meta { display:grid; grid-template-columns:1fr 1fr; gap:18px; border-bottom:1px solid #333; padding:19px 0; }
.video-meta div { display:flex; flex-direction:column; gap:5px; }
.video-meta span { color:#777; font:700 9px 'Barlow Condensed'; letter-spacing:.15em; }
.video-meta strong { font:600 12px 'Barlow Condensed'; }
.game-nav { display:flex; justify-content:space-between; padding-top:32px; color:var(--accent); font:700 12px 'Barlow Condensed'; letter-spacing:.15em; }
.home-wrap { padding:44px 16px 80px; max-width:860px; margin:auto; }
.league { margin-bottom:48px; }
.team-grid { display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.team-card { display:grid; grid-template-columns:auto 1fr; gap:2px 12px; align-items:center; min-width:0; padding:14px 12px; background:#fff8; border:1px solid var(--line); border-bottom:3px solid var(--accent); transition:transform .15s; }
.team-card:active { transform:translateY(2px); }
.team-mark { grid-row:1 / span 3; width:44px; height:44px; border-radius:50%; display:grid; place-items:center; background:var(--accent); color:var(--on-accent); font:900 italic 18px/1 Arial Narrow,Impact,sans-serif; }
.team-label { font:800 19px/1.1 'Barlow Condensed',Arial Narrow,sans-serif; letter-spacing:.03em; }
.team-name { font-size:10px; font-weight:600; line-height:1.35; color:#6f6a61; }
.team-progress { font:700 11px 'Barlow Condensed'; letter-spacing:.1em; color:#8b857b; }
.not-found { min-height:100vh; display:grid; place-items:center; align-content:center; gap:20px; text-align:center; }

@media (min-width:700px) {
  .hero { padding:38px max(7vw,40px) 58px; min-height:500px; }
  .hero h1 { font-size:112px; }
  .home-wrap { padding-top:72px; }
  .team-grid { grid-template-columns:repeat(3,1fr); gap:12px; }
  .team-card { padding:18px 16px; }
  .calendar-wrap { padding-top:72px; display:grid; grid-template-columns:1fr 1fr; gap:32px 64px; }
  .month-block { margin:0 0 32px; }
  .day { aspect-ratio:1; }
  .game-page { padding:30px 5vw 60px; }
  .game-date { font-size:96px; }
  .scoreboard p { font-size:40px; }
}
@media (prefers-reduced-motion:reduce) { * { scroll-behavior:auto!important; transition:none!important; } }