:root{ --primary:#c41230; --accent:#0b3d91; --muted:#f4f4f4; --text:#111; } *{box-sizing:border-box;} body{ font-family:Arial,Helvetica,sans-serif; margin:0; color:var(--text); background:#f2f2f2; } header{ background:var(--primary); color:#fff; padding:8px 0; } .nav-inner{ max-width:1150px; margin:0 auto; display:flex; align-items:center; justify-content:space-between; gap:10px; } .menu{ display:flex; gap:12px; align-items:center; } nav a{ color:#fff; text-decoration:none; padding:6px 8px; border-radius:4px; font-size:14px; } nav a:hover{ background:rgba(255,255,255,0.15); } .navbar-right a{ background:#fff; color:var(--primary); padding:6px 10px; border-radius:4px; font-weight:bold; } .navbar-right a:hover{ background:#fce3e6; } .nav-dropdown{ position:relative; } .nav-dropdown .dropbtn{ color:#fff; background:transparent; border:none; cursor:pointer; font-size:14px; padding:6px 8px; border-radius:4px; display:inline-block; text-decoration:none; } .nav-dropdown:hover .dropbtn{ background:rgba(255,255,255,0.15); } .nav-dropdown-content{ display:none; position:absolute; background:#fff; color:#000; min-width:200px; box-shadow:0 2px 6px rgba(0,0,0,0.15); z-index:50; } .nav-dropdown:hover .nav-dropdown-content{ display:block; } .nav-dropdown-content a{ display:block; padding:8px 10px; color:#111; text-decoration:none; } .nav-dropdown-content a:hover{ background:#f2f2f2; } hr{ margin:4px 0; border:none; border-top:1px solid #ddd; } .page-container{ max-width:1150px; margin:0 auto; padding:18px; } .page-inner{ background:#fff; padding:18px 20px 24px 20px; border-radius:6px; box-shadow:0 2px 4px rgba(0,0,0,0.05); } .table{ width:100%; border-collapse:collapse; margin-bottom:16px; } .table th,.table td{ border:1px solid #ddd; padding:6px 8px; text-align:left; font-size:13px; background:#fff; } .table th{ background:#f7f7f7; } .summary{ background:var(--muted); padding:10px 12px; border-radius:6px; margin-bottom:12px; font-size:14px; } .collapsible{ cursor:pointer; background:#f2f2f2; padding:8px 10px; border-radius:6px; margin-top:10px; border:1px solid #ddd; font-size:14px; } .collapsible .label{ font-weight:600; } .collapsible-content{ display:none; padding:6px 6px 6px 10px; margin-top:4px; border-left:4px solid #eee; background:#fafafa; border-radius:4px; } .matchup-row{ padding:4px 2px 6px 2px; margin-bottom:4px; border-bottom:1px dashed #ddd; font-size:13px; } .smallstats{ font-size:12px; color:#333; white-space:pre-wrap; } .footer{ max-width:1150px; margin:12px auto 18px auto; padding:8px 4px; text-align:center; color:#666; font-size:13px; } .standings-grid{ display:grid; grid-template-columns:1fr 1fr; gap:20px; } .leaders-grid{ display:grid; grid-template-columns:1fr 1fr; gap:20px; } .bracket{ display:grid; grid-template-columns:1.4fr 1.4fr 1.2fr; gap:12px; margin:10px 0; } .bracket-round{ border:1px solid #ddd; border-radius:6px; padding:8px; background:#fafafa; } .bracket-round h3{ margin-top:0; font-size:14px; } .bracket-match{ margin-bottom:6px; font-size:13px; } .bracket-match .winner{ font-weight:bold; color:var(--accent); } .bracket-match .loser{ color:#555; } .twocol-grid{ display:grid; grid-template-columns:1fr 1fr; gap:20px; } @media(max-width:800px){ .standings-grid,.leaders-grid,.bracket,.twocol-grid{ grid-template-columns:1fr; } .page-inner{padding:10px 12px 16px 12px;} } /* Sticky nav + theme toggle + records page grouping */ header{ position: sticky; top: 0; z-index: 999; } .navbar-right{ display:flex; align-items:center; gap:8px; } .theme-toggle{ border:1px solid rgba(255,255,255,0.6); background:transparent; color:#fff; padding:4px 10px; border-radius:999px; cursor:pointer; font-size:13px; } .theme-toggle:hover{ background:rgba(255,255,255,0.18); } /* Light/dark theme via data-theme on */ :root{ --bg:#f2f2f2; --card-bg:#ffffff; --border-color:#dddddd; } :root[data-theme="dark"]{ --primary:#111827; --accent:#f97316; --muted:#111827; --text:#e5e7eb; --bg:#020617; --card-bg:#020617; --border-color:#1f2933; } :root[data-theme="dark"] body{ background:var(--bg); color:var(--text); } :root[data-theme="dark"] .page-container{ background:var(--bg); } :root[data-theme="dark"] .page-inner, :root[data-theme="dark"] .summary, :root[data-theme="dark"] .table, :root[data-theme="dark"] .card{ background-color:var(--card-bg); color:var(--text); } :root[data-theme="dark"] .table th, :root[data-theme="dark"] .table td{ border-color:var(--border-color); } /* League Records visual grouping */ .records-page h1{ margin-top:0; margin-bottom:12px; } .records-page h2{ margin-top:32px; padding-top:12px; border-top:2px solid var(--accent); font-size:22px; } .records-page h3{ margin-top:18px; font-size:18px; } .records-page .twocol-grid{ margin-top:10px; gap:18px; }