    :root {
      font-family: 'Barlow', system-ui, sans-serif;
      --primary: #00e5ff;
      --primary-dark: #00b8d4;
      --secondary: #ff6b35;
      --accent: #ffd60a;
      --card-bg: rgba(12, 18, 32, 0.94);
      --card-border: rgba(0, 229, 255, 0.1);
      --text-primary: #f0f4ff;
      --text-secondary: #a8b4cc;
      --text-muted: #5a6a80;
    }
    * { box-sizing: border-box; margin: 0; padding: 0; }
    body {
      background: #080c14;
      color: var(--text-primary);
      min-height: 100vh;
      background-image:
        radial-gradient(ellipse at 20% 0%, rgba(0,229,255,0.05) 0%, transparent 50%),
        radial-gradient(ellipse at 80% 100%, rgba(255,107,53,0.05) 0%, transparent 50%);
    }

    /* NAV */
    .top-nav {
      position: sticky; top: 0; z-index: 1200;
      background: rgba(8,12,20,0.97);
      border-bottom: 1px solid rgba(0,229,255,0.15);
      backdrop-filter: blur(16px);
    }
    .top-nav-inner {
      max-width: 1280px; margin: 0 auto;
      padding: 0 16px;
      display: flex; align-items: stretch; justify-content: space-between;
      gap: 16px; height: 56px;
    }
    .nav-brand { display: flex; align-items: center; gap: 10px; flex-shrink: 0; }
    .nav-logo-pulse {
      width: 32px; height: 32px; border-radius: 8px;
      background: linear-gradient(135deg, var(--primary), var(--secondary));
      display: flex; align-items: center; justify-content: center;
      font-family: 'Barlow Condensed', sans-serif; font-weight: 900; font-size: 0.85rem; color: #000;
    }
    .nav-logo-text {
      font-family: 'Barlow Condensed', sans-serif; font-weight: 800;
      font-size: 1.2rem; letter-spacing: 0.06em; color: var(--primary); white-space: nowrap; text-transform: uppercase;
    }
    .nav-logo-text span { color: var(--text-primary); }
    .top-nav-buttons { display: flex; align-items: stretch; gap: 2px; }
    .top-nav .nav-btn {
      border: none; cursor: pointer; padding: 0 13px;
      font-family: 'Barlow Condensed', sans-serif; font-size: 0.82rem; font-weight: 700;
      text-transform: uppercase; letter-spacing: 0.06em;
      background: transparent; color: var(--text-muted);
      display: flex; align-items: center; gap: 5px; white-space: nowrap;
      transition: all 0.2s ease; border-bottom: 2px solid transparent;
    }
    .top-nav .nav-btn:hover { color: var(--text-primary); background: rgba(0,229,255,0.05); }
    .top-nav .nav-btn.nav-active { color: var(--primary); border-bottom-color: var(--primary); background: rgba(0,229,255,0.07); }
    .mobile-nav-toggle { display: none; background: none; border: none; color: var(--text-primary); font-size: 1.2rem; cursor: pointer; padding: 8px; align-items: center; }
    /* Desktop dropdown (hidden on mobile — replaced by sticky bottom bar) */
    .mobile-nav-dropdown {
      display: none; position: absolute; top: 100%; left: 0; right: 0;
      background: rgba(8,12,20,0.99); border-top: 1px solid rgba(0,229,255,0.1);
      backdrop-filter: blur(16px); z-index: 1100; padding: 12px;
    }
    .mobile-nav-dropdown.active { display: block; animation: slideDown 0.25s ease; }
    @keyframes slideDown { from { opacity:0; transform:translateY(-8px); } to { opacity:1; transform:translateY(0); } }
    .mobile-nav-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 6px; }
    .mobile-nav-btn {
      display: flex; flex-direction: column; align-items: center; gap: 4px;
      padding: 10px 6px; background: rgba(255,255,255,0.03); border: 1px solid rgba(255,255,255,0.06);
      border-radius: 8px; color: var(--text-secondary);
      font-family: 'Barlow Condensed', sans-serif; font-size: 0.7rem; font-weight: 700;
      text-transform: uppercase; letter-spacing: 0.05em; cursor: pointer; transition: all 0.2s;
    }
    .mobile-nav-btn i { font-size: 1rem; }
    .mobile-nav-btn:hover { background: rgba(0,229,255,0.06); color: var(--text-primary); }
    .mobile-nav-btn.nav-active { color: var(--primary); background: transparent; border-color: transparent; }
    @media (max-width: 768px) {
      .top-nav-buttons { display: none; }
      /* Sticky bottom tab bar */
      .mobile-nav-dropdown {
        display: block !important;
        position: fixed;
        bottom: 0; left: 0; right: 0; top: auto;
        background: rgba(6,10,18,0.97);
        backdrop-filter: blur(20px);
        -webkit-backdrop-filter: blur(20px);
        border-top: 1px solid rgba(0,229,255,0.12);
        border-radius: 0;
        padding: 6px 4px env(safe-area-inset-bottom, 6px);
        z-index: 1000;
        box-shadow: 0 -4px 24px rgba(0,0,0,0.5);
        animation: none !important;
      }
      .mobile-nav-grid {
        grid-template-columns: repeat(7, 1fr);
        gap: 0;
      }
      .mobile-nav-btn {
        padding: 6px 2px 4px;
        border: none; border-radius: 8px;
        background: transparent;
        font-size: 0.56rem; gap: 2px;
      }
      .mobile-nav-btn i { font-size: 1.1rem; display: block; }
      .mobile-nav-btn.nav-active { color: var(--primary); }
      .mobile-nav-btn.nav-active i { filter: drop-shadow(0 0 6px var(--primary)); }
      .mobile-nav-toggle { display: none !important; }
      .page-main { padding-bottom: 80px; }
    }
    @media (max-width: 400px) {
      .mobile-nav-btn span { display: none; }
      .mobile-nav-btn { padding: 10px 2px; }
      .mobile-nav-btn i { font-size: 1.25rem; }
    }

    /* LAYOUT */
    .page-main { max-width: 1280px; margin: 0 auto; padding: 24px 16px 48px; }
    .feed-layout { display: grid; grid-template-columns: 1fr 300px; gap: 24px; }
    @media (max-width: 1024px) { .feed-layout { grid-template-columns: 1fr; } .feed-sidebar { display: none; } }
    .panel { display: none; animation: fadeIn 0.3s ease; }
    @keyframes fadeIn { from { opacity:0; transform:translateY(4px); } to { opacity:1; transform:translateY(0); } }
    .panel.panel-active { display: block; }

    /* HERO */
    .hero-section {
      background: linear-gradient(135deg, rgba(0,229,255,0.07) 0%, rgba(255,107,53,0.04) 100%);
      border: 1px solid rgba(0,229,255,0.12); border-radius: 16px;
      padding: 28px 24px; margin-bottom: 24px; position: relative; overflow: hidden;
    }
    .hero-inner { display: flex; align-items: center; gap: 20px; }
    .logo-wrap img { max-width: 100px; height: auto; filter: drop-shadow(0 0 14px rgba(0,229,255,0.4)); }
    .hero-text { flex: 1; }
    .hero-title {
      font-family: 'Barlow Condensed', sans-serif; font-size: 2.2rem; font-weight: 900;
      line-height: 1; text-transform: uppercase; letter-spacing: 0.02em;
      background: linear-gradient(to right, var(--primary), var(--text-primary));
      -webkit-background-clip: text; background-clip: text; color: transparent; margin-bottom: 8px;
    }
    .hero-subtitle { font-size: 0.9rem; color: var(--text-secondary); line-height: 1.5; }
    .sport-tags { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 12px; }
    .sport-tag {
      font-family: 'Barlow Condensed', sans-serif; font-size: 0.68rem; font-weight: 700;
      text-transform: uppercase; letter-spacing: 0.06em;
      padding: 2px 8px; border-radius: 100px; border: 1px solid; opacity: 0.85;
    }
    @media (max-width: 600px) { .hero-inner { flex-direction: column; text-align: center; } .sport-tags { justify-content: center; } .hero-title { font-size: 1.7rem; } }

    /* SPORT FILTER */
    .sport-filter-bar {
      display: flex; gap: 7px; flex-wrap: nowrap; overflow-x: auto; padding-bottom: 4px;
      margin-bottom: 18px; scrollbar-width: none;
    }
    .sport-filter-bar::-webkit-scrollbar { display: none; }
    .sport-filter-btn {
      flex-shrink: 0; padding: 5px 13px; border-radius: 100px;
      border: 1px solid rgba(255,255,255,0.08); background: rgba(255,255,255,0.03);
      color: var(--text-secondary); font-family: 'Barlow Condensed', sans-serif;
      font-size: 0.76rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.06em;
      cursor: pointer; transition: all 0.2s; white-space: nowrap;
    }
    .sport-filter-btn:hover { background: rgba(0,229,255,0.08); color: var(--primary); border-color: rgba(0,229,255,0.25); }
    .sport-filter-btn.active { background: rgba(0,229,255,0.13); color: var(--primary); border-color: var(--primary); }

    /* FEED CARDS */
    .feed-card {
      background: var(--card-bg); border-radius: 14px; border: 1px solid var(--card-border);
      box-shadow: 0 8px 28px rgba(0,0,0,0.4); overflow: hidden; margin-bottom: 18px;
      transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
    }
    .feed-card:hover { transform: translateY(-2px); box-shadow: 0 14px 36px rgba(0,0,0,0.5); border-color: rgba(0,229,255,0.18); }
    .feed-card-sport-bar { height: 3px; width: 100%; }
    .feed-card-body { padding: 16px 18px 14px; }
    .feed-header { display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: 9px; gap: 8px; }
    .feed-header-left { display: flex; align-items: center; gap: 7px; flex-wrap: wrap; }
    .feed-league {
      font-family: 'Barlow Condensed', sans-serif; font-size: .7rem; font-weight: 800;
      text-transform: uppercase; letter-spacing: .1em; padding: 2px 7px; border-radius: 4px;
    }
    .feed-sport-label { font-size: .7rem; color: var(--text-muted); }
    .feed-timestamp { font-size: .68rem; color: var(--text-muted); white-space: nowrap; display: flex; align-items: center; gap: 4px; }
    .feed-title {
      font-family: 'Barlow Condensed', sans-serif; font-size: 1.3rem; font-weight: 800;
      line-height: 1.2; margin: 6px 0 10px; color: var(--text-primary); text-transform: uppercase; letter-spacing: 0.02em;
    }
    .feed-score {
      display: inline-flex; align-items: center; gap: 9px;
      font-family: 'Barlow Condensed', sans-serif; font-size: 1.05rem; font-weight: 700;
      color: var(--text-primary); margin-bottom: 10px; padding: 7px 13px;
      background: rgba(255,255,255,0.04); border-radius: 8px; border: 1px solid rgba(255,255,255,0.06);
    }
    .score-divider { color: var(--text-muted); font-weight: 400; }
    .feed-thumb { border-radius: 10px; overflow: hidden; margin-bottom: 12px; }
    .feed-thumb img { width: 100%; height: 210px; object-fit: cover; display: block; transition: transform 0.4s; }
    .feed-card:hover .feed-thumb img { transform: scale(1.04); }

    /* 60-second read */
    .read-section { margin-bottom: 12px; }
    .read-header { display: flex; align-items: center; gap: 8px; margin-bottom: 7px; }
    .read-badge {
      display: flex; align-items: center; gap: 5px;
      font-family: 'Barlow Condensed', sans-serif; font-size: 0.66rem; font-weight: 800;
      text-transform: uppercase; letter-spacing: 0.08em; color: var(--accent);
      background: rgba(255,214,10,0.1); border: 1px solid rgba(255,214,10,0.22);
      padding: 2px 7px; border-radius: 4px;
    }
    .read-content {
      font-size: .92rem; line-height: 1.65; color: var(--text-secondary);
      overflow: hidden;
      display: -webkit-box; -webkit-line-clamp: 5; -webkit-box-orient: vertical;
    }
    .read-content.expanded { display: block; }
    .read-toggle {
      background: none; border: none; color: var(--primary); font-size: 0.78rem; font-weight: 600;
      cursor: pointer; padding: 3px 0; margin-top: 4px; display: flex; align-items: center; gap: 4px; transition: opacity 0.2s;
    }
    .read-toggle:hover { opacity: 0.7; }
    .read-loading { display: flex; align-items: center; gap: 8px; font-size: 0.8rem; color: var(--text-muted); padding: 6px 0; }
    .spinner-sm { width: 13px; height: 13px; border: 2px solid rgba(0,229,255,0.18); border-top-color: var(--primary); border-radius: 50%; animation: spin 0.8s linear infinite; flex-shrink: 0; }
    @keyframes spin { to { transform: rotate(360deg); } }

    /* Feed actions */
    .feed-actions {
      display: flex; align-items: center; gap: 7px;
      padding-top: 11px; border-top: 1px solid rgba(255,255,255,0.05); flex-wrap: wrap;
    }
    .feed-action-btn {
      display: inline-flex; align-items: center; gap: 5px;
      padding: 6px 13px; border-radius: 8px; border: 1px solid rgba(255,255,255,0.07);
      background: rgba(255,255,255,0.03); color: var(--text-secondary);
      font-family: 'Barlow Condensed', sans-serif; font-size: 0.78rem; font-weight: 700;
      text-transform: uppercase; letter-spacing: 0.05em; cursor: pointer; transition: all 0.2s;
    }
    .feed-action-btn:hover { background: rgba(255,255,255,0.07); color: var(--text-primary); }
    .feed-action-btn.video-btn { color: var(--primary); border-color: rgba(0,229,255,0.22); background: rgba(0,229,255,0.06); }
    .feed-action-btn.video-btn:hover { background: rgba(0,229,255,0.12); }
    .feed-like-btn.liked { color: #ff4d6d; border-color: rgba(255,77,109,0.3); background: rgba(255,77,109,0.07); }
    .feed-actions-spacer { flex: 1; }
    .feed-source { font-size: 0.68rem; color: var(--text-muted); display: flex; align-items: center; gap: 4px; }

    /* Inline video */
    .inline-video { margin-top: 12px; border-radius: 10px; overflow: hidden; background: #000; position: relative; display: none; }
    .inline-video.visible { display: block; animation: fadeIn 0.3s ease; }
    .inline-video iframe { width: 100%; height: 210px; border: none; display: block; }
    .inline-video-close {
      position: absolute; top: 7px; right: 7px; background: rgba(0,0,0,0.8); border: none; color: #fff;
      border-radius: 50%; width: 26px; height: 26px; cursor: pointer; font-size: 0.78rem;
      display: flex; align-items: center; justify-content: center; z-index: 10; transition: background 0.2s;
    }
    .inline-video-close:hover { background: rgba(255,50,50,0.8); }

    /* SIDEBAR */
    .feed-sidebar { position: sticky; top: 72px; height: fit-content; }
    .sidebar-widget { background: var(--card-bg); border: 1px solid var(--card-border); border-radius: 14px; padding: 15px; margin-bottom: 14px; }
    .sidebar-widget-title {
      font-family: 'Barlow Condensed', sans-serif; font-size: 0.78rem; font-weight: 800;
      text-transform: uppercase; letter-spacing: 0.1em; color: var(--primary);
      margin-bottom: 10px; padding-bottom: 9px; border-bottom: 1px solid rgba(0,229,255,0.1);
      display: flex; align-items: center; gap: 7px;
    }
    .trending-item {
      display: flex; gap: 9px; align-items: flex-start;
      padding: 7px 0; border-bottom: 1px solid rgba(255,255,255,0.04); cursor: pointer; transition: opacity 0.2s;
    }
    .trending-item:hover { opacity: 0.75; }
    .trending-item:last-child { border-bottom: none; }
    .trending-num { font-family: 'Barlow Condensed', sans-serif; font-size: 0.95rem; font-weight: 900; color: var(--text-muted); width: 18px; flex-shrink: 0; }
    .trending-info { flex: 1; }
    .trending-title { font-size: 0.8rem; font-weight: 600; color: var(--text-primary); line-height: 1.3; margin-bottom: 2px; }
    .trending-sport { font-size: 0.68rem; color: var(--text-muted); }
    .sport-dot { width: 7px; height: 7px; border-radius: 50%; flex-shrink: 0; margin-top: 5px; }

    /* EMPTY */
    .empty-state {
      text-align: center; opacity: .55; font-size: .88rem; margin-top: 36px;
      padding: 44px 20px; background: rgba(255,255,255,0.02);
      border-radius: 14px; border: 1px dashed rgba(255,255,255,0.07);
    }

    /* BOX */
    .box { background: var(--card-bg); border-radius: 14px; border: 1px solid var(--card-border); padding: 20px; box-shadow: 0 8px 28px rgba(0,0,0,0.3); margin-bottom: 18px; }
    .box-title {
      font-family: 'Barlow Condensed', sans-serif; font-weight: 800; font-size: 1.05rem;
      letter-spacing: .08em; color: var(--primary); text-transform: uppercase;
      margin-bottom: 14px; text-align: center; padding-bottom: 11px;
      border-bottom: 1px solid rgba(0,229,255,0.1); display: flex; align-items: center; justify-content: center; gap: 8px;
    }

    /* Scores */
    /* ── SCORES PAGE ──────────────────────────────── */
    .scores-toolbar {
      display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
      margin-bottom: 18px;
    }
    .scores-filter-btn {
      padding: 5px 14px; border-radius: 100px;
      border: 1px solid rgba(255,255,255,0.08); background: rgba(255,255,255,0.03);
      color: var(--text-secondary); font-family: 'Barlow Condensed', sans-serif;
      font-size: 0.76rem; font-weight: 700; text-transform: uppercase;
      letter-spacing: 0.06em; cursor: pointer; transition: all 0.2s; white-space: nowrap;
    }
    .scores-filter-btn:hover { background: rgba(0,229,255,0.08); color: var(--primary); border-color: rgba(0,229,255,0.25); }
    .scores-filter-btn.active { background: rgba(0,229,255,0.13); color: var(--primary); border-color: var(--primary); }
    .scores-updated { font-size: 0.7rem; color: var(--text-muted); margin-left: auto; display: flex; align-items: center; gap: 5px; }
    .live-dot { width: 7px; height: 7px; border-radius: 50%; background: #39ff14; box-shadow: 0 0 6px #39ff14; animation: pulse-dot 1.4s ease-in-out infinite; flex-shrink: 0; }
    @keyframes pulse-dot { 0%,100%{opacity:1;transform:scale(1);} 50%{opacity:.5;transform:scale(0.7);} }
    .scores-grid {
      display: grid;
      grid-template-columns: repeat(auto-fill, minmax(min(320px, 100%), 1fr));
      gap: 14px;
    }
    .score-card {
      background: rgba(10,16,30,0.95);
      border: 1px solid rgba(255,255,255,0.07);
      border-radius: 14px; overflow: hidden;
      transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
      position: relative;
    }
    .score-card:hover { transform: translateY(-3px); box-shadow: 0 12px 32px rgba(0,0,0,0.5); border-color: rgba(0,229,255,0.2); }
    .score-card-top-bar { height: 3px; width: 100%; }
    .score-card-header {
      display: flex; align-items: center; justify-content: space-between;
      padding: 9px 14px 6px;
    }
    .score-card-league {
      font-family: 'Barlow Condensed', sans-serif; font-size: 0.68rem; font-weight: 800;
      text-transform: uppercase; letter-spacing: 0.1em;
      padding: 2px 7px; border-radius: 4px; color: #000;
    }
    .score-card-status {
      font-family: 'Barlow Condensed', sans-serif; font-size: 0.72rem; font-weight: 700;
      text-transform: uppercase; letter-spacing: 0.06em;
      display: flex; align-items: center; gap: 5px;
    }
    .score-card-status.live { color: #39ff14; }
    .score-card-status.final { color: var(--text-muted); }
    .score-card-status.upcoming { color: var(--accent); }
    .score-matchup {
      padding: 6px 14px 14px;
      display: flex; align-items: center; justify-content: space-between; gap: 8px;
    }
    .score-team {
      display: flex; flex-direction: column; align-items: center;
      gap: 8px; flex: 1; min-width: 0;
    }
    .score-team-logo-wrap {
      width: 64px; height: 64px; border-radius: 50%;
      background: rgba(255,255,255,0.05);
      border: 2px solid rgba(255,255,255,0.08);
      display: flex; align-items: center; justify-content: center;
      overflow: hidden; flex-shrink: 0;
      transition: border-color 0.2s;
    }
    .score-card:hover .score-team-logo-wrap { border-color: rgba(0,229,255,0.25); }
    .score-team-logo-wrap img { width: 52px; height: 52px; object-fit: contain; }
    .score-team-logo-wrap .team-initials {
      font-family: 'Barlow Condensed', sans-serif; font-size: 1.1rem; font-weight: 900;
      color: var(--text-muted); letter-spacing: 0.04em; text-align: center; line-height: 1;
    }
    .score-team-name {
      font-family: 'Barlow Condensed', sans-serif; font-size: 0.85rem; font-weight: 800;
      text-transform: uppercase; letter-spacing: 0.04em; text-align: center;
      color: var(--text-primary); line-height: 1.2;
      max-width: 100px; word-break: break-word;
    }
    .score-team.winner .score-team-name { color: var(--primary); }
    .score-team.winner .score-team-logo-wrap { border-color: rgba(0,229,255,0.5); box-shadow: 0 0 14px rgba(0,229,255,0.15); }
    .score-center {
      display: flex; flex-direction: column; align-items: center; gap: 4px;
      flex-shrink: 0; min-width: 80px;
    }
    .score-numbers {
      font-family: 'Barlow Condensed', sans-serif; font-weight: 900; font-size: 2.4rem;
      color: var(--text-primary); letter-spacing: -0.02em; line-height: 1;
      display: flex; align-items: center; gap: 8px;
    }
    .score-numbers .score-num { min-width: 36px; text-align: center; }
    .score-numbers .score-sep { color: var(--text-muted); font-weight: 300; font-size: 2rem; }
    .score-vs {
      font-family: 'Barlow Condensed', sans-serif; font-weight: 700; font-size: 1.4rem;
      color: var(--text-muted); letter-spacing: 0.05em;
    }
    .score-time-label {
      font-family: 'Barlow Condensed', sans-serif; font-size: 0.7rem; font-weight: 700;
      color: var(--text-muted); text-transform: uppercase; letter-spacing: 0.07em;
      margin-top: 2px;
    }
    .score-time-label.live-time { color: #39ff14; }
    .score-card-footer {
      padding: 7px 14px 10px;
      display: flex; align-items: center; justify-content: space-between;
      border-top: 1px solid rgba(255,255,255,0.05);
      font-size: 0.7rem; color: var(--text-muted);
    }
    .score-card-sport { font-family: 'Barlow Condensed', sans-serif; font-weight: 700; text-transform: uppercase; letter-spacing: 0.06em; }
    .score-card-ts { display: flex; align-items: center; gap: 4px; }
    .no-scores { font-size: .83rem; opacity: .6; text-align: center; margin-top: 14px; padding: 18px; }
    .opacity-dim { opacity: 0.45; }
    @media (max-width: 480px) {
      .scores-grid { grid-template-columns: 1fr; }
      .score-numbers { font-size: 2rem; }
      .score-team-logo-wrap { width: 52px; height: 52px; }
      .score-team-logo-wrap img { width: 42px; height: 42px; }
    }

    /* Schedule */
    /* ── SCHEDULE PAGE ─────────────────────────────── */
    .sched-toolbar {
      display: flex; align-items: center; gap: 8px;
      flex-wrap: wrap; margin-bottom: 20px;
    }
    .sched-filter-btn {
      padding: 5px 14px; border-radius: 100px;
      border: 1px solid rgba(255,255,255,0.08);
      background: rgba(255,255,255,0.03);
      color: var(--text-secondary);
      font-family: 'Barlow Condensed', sans-serif;
      font-size: 0.76rem; font-weight: 700;
      text-transform: uppercase; letter-spacing: 0.06em;
      cursor: pointer; transition: all 0.2s; white-space: nowrap;
    }
    .sched-filter-btn:hover { background: rgba(0,229,255,0.08); color: var(--primary); border-color: rgba(0,229,255,0.25); }
    .sched-filter-btn.active { background: rgba(0,229,255,0.13); color: var(--primary); border-color: var(--primary); }
    .sched-updated { font-size: 0.7rem; color: var(--text-muted); margin-left: auto; display: flex; align-items: center; gap: 5px; }

    /* Day section header */
    .sched-day-section { margin-bottom: 28px; }
    .sched-day-header {
      display: flex; align-items: center; gap: 12px;
      margin-bottom: 14px; position: relative;
    }
    .sched-day-badge {
      display: flex; flex-direction: column; align-items: center; justify-content: center;
      width: 56px; height: 56px; border-radius: 12px; flex-shrink: 0;
      background: linear-gradient(135deg, rgba(0,229,255,0.15), rgba(0,229,255,0.05));
      border: 1px solid rgba(0,229,255,0.2);
    }
    .sched-day-badge.today {
      background: linear-gradient(135deg, rgba(0,229,255,0.3), rgba(0,229,255,0.1));
      border-color: var(--primary);
      box-shadow: 0 0 18px rgba(0,229,255,0.2);
    }
    .sched-day-badge.tomorrow {
      background: linear-gradient(135deg, rgba(255,214,10,0.2), rgba(255,214,10,0.06));
      border-color: rgba(255,214,10,0.4);
    }
    .sched-day-num {
      font-family: 'Barlow Condensed', sans-serif;
      font-size: 1.6rem; font-weight: 900; line-height: 1;
      color: var(--primary);
    }
    .sched-day-badge.tomorrow .sched-day-num { color: var(--accent); }
    .sched-day-dow {
      font-family: 'Barlow Condensed', sans-serif;
      font-size: 0.62rem; font-weight: 800; text-transform: uppercase;
      letter-spacing: 0.1em; color: var(--text-muted);
    }
    .sched-day-info { flex: 1; }
    .sched-day-label {
      font-family: 'Barlow Condensed', sans-serif;
      font-size: 1.3rem; font-weight: 900;
      text-transform: uppercase; letter-spacing: 0.04em;
      color: var(--text-primary); line-height: 1;
    }
    .sched-day-label.today-label { color: var(--primary); }
    .sched-day-label.tomorrow-label { color: var(--accent); }
    .sched-day-count {
      font-size: 0.75rem; color: var(--text-muted); margin-top: 3px;
    }
    .sched-day-line {
      flex: 1; height: 1px;
      background: linear-gradient(to right, rgba(0,229,255,0.15), transparent);
    }

    /* Individual game cards */
    .sched-grid {
      display: grid;
      grid-template-columns: repeat(auto-fill, minmax(min(300px, 100%), 1fr));
      gap: 12px;
    }
    .sched-card {
      background: rgba(10,16,30,0.95);
      border: 1px solid rgba(255,255,255,0.07);
      border-radius: 14px; overflow: hidden;
      transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
      cursor: default;
    }
    .sched-card:hover {
      transform: translateY(-3px);
      box-shadow: 0 12px 30px rgba(0,0,0,0.5);
      border-color: rgba(0,229,255,0.18);
    }
    .sched-card-bar { height: 3px; width: 100%; }
    .sched-card-top {
      display: flex; align-items: center; justify-content: space-between;
      padding: 9px 13px 6px;
    }
    .sched-card-league {
      font-family: 'Barlow Condensed', sans-serif;
      font-size: 0.66rem; font-weight: 800;
      text-transform: uppercase; letter-spacing: 0.1em;
      padding: 2px 7px; border-radius: 4px; color: #000;
    }
    .sched-card-time {
      font-family: 'Barlow Condensed', sans-serif;
      font-size: 0.8rem; font-weight: 700;
      color: var(--accent);
      display: flex; align-items: center; gap: 4px;
    }
    .sched-card-time.tbd { color: var(--text-muted); }

    /* Matchup row */
    .sched-matchup {
      display: flex; align-items: center;
      justify-content: space-between; gap: 6px;
      padding: 8px 14px 10px;
    }
    .sched-team {
      display: flex; flex-direction: column;
      align-items: center; gap: 7px; flex: 1; min-width: 0;
    }
    .sched-logo-wrap {
      width: 54px; height: 54px; border-radius: 50%;
      background: rgba(255,255,255,0.04);
      border: 2px solid rgba(255,255,255,0.07);
      display: flex; align-items: center; justify-content: center;
      overflow: hidden; flex-shrink: 0;
      transition: border-color 0.2s;
    }
    .sched-card:hover .sched-logo-wrap { border-color: rgba(0,229,255,0.2); }
    .sched-logo-wrap img { width: 42px; height: 42px; object-fit: contain; }
    .sched-logo-wrap .sched-initials {
      font-family: 'Barlow Condensed', sans-serif;
      font-size: 0.95rem; font-weight: 900;
      color: var(--text-muted); text-align: center; line-height: 1;
    }
    .sched-team-name {
      font-family: 'Barlow Condensed', sans-serif;
      font-size: 0.82rem; font-weight: 800;
      text-transform: uppercase; letter-spacing: 0.03em;
      text-align: center; color: var(--text-primary);
      line-height: 1.2; max-width: 90px; word-break: break-word;
    }
    .sched-vs {
      display: flex; flex-direction: column; align-items: center;
      gap: 4px; flex-shrink: 0;
    }
    .sched-vs-text {
      font-family: 'Barlow Condensed', sans-serif;
      font-size: 0.9rem; font-weight: 700;
      color: var(--text-muted); letter-spacing: 0.08em;
    }
    .sched-countdown {
      font-family: 'Barlow Condensed', sans-serif;
      font-size: 0.68rem; font-weight: 700;
      color: var(--primary); letter-spacing: 0.04em;
      text-align: center; min-width: 60px;
      white-space: nowrap;
    }
    .sched-countdown.soon { color: var(--secondary); animation: pulse-count 1s ease-in-out infinite; }
    @keyframes pulse-count { 0%,100%{opacity:1;} 50%{opacity:0.5;} }

    /* Footer strip */
    .sched-card-footer {
      display: flex; align-items: center; justify-content: space-between;
      padding: 7px 13px 10px;
      border-top: 1px solid rgba(255,255,255,0.05);
      gap: 8px;
    }
    .sched-venue {
      font-size: 0.67rem; color: var(--text-muted);
      overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
      max-width: 160px; display: flex; align-items: center; gap: 4px;
    }
    .sched-cal-btn {
      display: inline-flex; align-items: center; gap: 5px;
      padding: 4px 10px; border-radius: 6px;
      border: 1px solid rgba(0,229,255,0.2);
      background: rgba(0,229,255,0.06);
      color: var(--primary); font-family: 'Barlow Condensed', sans-serif;
      font-size: 0.68rem; font-weight: 700; text-transform: uppercase;
      letter-spacing: 0.06em; cursor: pointer; text-decoration: none;
      transition: all 0.2s; white-space: nowrap; flex-shrink: 0;
    }
    .sched-cal-btn:hover { background: rgba(0,229,255,0.14); }

    .no-schedule { font-size: .83rem; opacity: .6; text-align: center; margin-top: 8px; padding: 18px; }

    /* Polymarket */
    /* ── MARKET ODDS ────────────────────────────────── */
    .poly-toolbar {
      display: flex; align-items: center; gap: 8px;
      flex-wrap: wrap; margin-bottom: 20px;
    }
    .poly-filter-btn {
      padding: 5px 14px; border-radius: 100px;
      border: 1px solid rgba(255,255,255,0.08);
      background: rgba(255,255,255,0.03);
      color: var(--text-secondary);
      font-family: 'Barlow Condensed', sans-serif;
      font-size: 0.76rem; font-weight: 700;
      text-transform: uppercase; letter-spacing: 0.06em;
      cursor: pointer; transition: all 0.2s; white-space: nowrap;
    }
    .poly-filter-btn:hover { background: rgba(255,214,10,0.08); color: var(--accent); border-color: rgba(255,214,10,0.25); }
    .poly-filter-btn.active { background: rgba(255,214,10,0.13); color: var(--accent); border-color: var(--accent); }
    .poly-updated { font-size: 0.7rem; color: var(--text-muted); margin-left: auto; }

    .poly-grid {
      display: grid;
      grid-template-columns: repeat(auto-fill, minmax(min(320px, 100%), 1fr));
      gap: 14px;
    }
    .poly-card {
      background: rgba(10,16,30,0.95);
      border: 1px solid rgba(255,255,255,0.07);
      border-radius: 14px; overflow: hidden;
      transition: transform 0.2s, box-shadow 0.2s, border-color 0.2s;
    }
    .poly-card:hover {
      transform: translateY(-3px);
      box-shadow: 0 12px 30px rgba(0,0,0,0.5);
      border-color: rgba(255,214,10,0.18);
    }
    .poly-card-bar { height: 3px; }
    .poly-card-header {
      display: flex; align-items: flex-start;
      justify-content: space-between; gap: 10px;
      padding: 12px 14px 8px;
    }
    .poly-sport-tag {
      font-family: 'Barlow Condensed', sans-serif;
      font-size: 0.66rem; font-weight: 800;
      text-transform: uppercase; letter-spacing: 0.1em;
      padding: 2px 7px; border-radius: 4px;
      background: rgba(255,214,10,0.15); color: var(--accent);
      border: 1px solid rgba(255,214,10,0.25);
      white-space: nowrap; flex-shrink: 0;
    }
    .poly-gametime {
      font-size: 0.68rem; color: var(--text-muted);
      display: flex; align-items: center; gap: 4px;
      white-space: nowrap; flex-shrink: 0;
    }
    .poly-question {
      padding: 0 14px 10px;
      font-family: 'Barlow Condensed', sans-serif;
      font-size: 1.05rem; font-weight: 700;
      color: var(--text-primary); line-height: 1.3;
    }
    /* Outcomes probability bars */
    .poly-outcomes { padding: 0 14px 14px; display: flex; flex-direction: column; gap: 7px; }
    .poly-outcome-row { display: flex; flex-direction: column; gap: 3px; }
    .poly-outcome-label-row {
      display: flex; justify-content: space-between; align-items: center;
    }
    .poly-outcome-name {
      font-size: 0.78rem; font-weight: 600; color: var(--text-secondary);
      overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 70%;
    }
    .poly-outcome-pct {
      font-family: 'Barlow Condensed', sans-serif;
      font-size: 0.85rem; font-weight: 800;
      letter-spacing: 0.02em;
    }
    .poly-bar-track {
      height: 6px; border-radius: 100px;
      background: rgba(255,255,255,0.06); overflow: hidden;
    }
    .poly-bar-fill {
      height: 100%; border-radius: 100px;
      transition: width 0.6s cubic-bezier(0.4,0,0.2,1);
    }
    /* leading outcome = gold, others = muted blue */
    .poly-bar-fill.leader { background: linear-gradient(to right, var(--accent), #ffb700); }
    .poly-bar-fill.other  { background: rgba(0,229,255,0.35); }
    .poly-outcome-pct.leader { color: var(--accent); }
    .poly-outcome-pct.other  { color: var(--text-secondary); }

    .poly-card-footer {
      padding: 8px 14px 10px;
      border-top: 1px solid rgba(255,255,255,0.05);
      display: flex; align-items: center; justify-content: space-between;
    }
    .poly-link {
      display: inline-flex; align-items: center; gap: 5px;
      font-family: 'Barlow Condensed', sans-serif;
      font-size: 0.68rem; font-weight: 700; text-transform: uppercase;
      letter-spacing: 0.06em; color: var(--accent);
      text-decoration: none; opacity: 0.7; transition: opacity 0.2s;
    }
    .poly-link:hover { opacity: 1; }
    .poly-volume {
      font-size: 0.68rem; color: var(--text-muted);
      display: flex; align-items: center; gap: 4px;
    }
    .no-poly { font-size: .83rem; opacity: .6; text-align: center; margin-top: 14px; padding: 18px; }

    /* Odds */
    /* ══════════════════════════════════════════════════════
       GAMING ODDS — full redesign
    ══════════════════════════════════════════════════════ */
    .odds-toolbar {
      display: flex; align-items: center; gap: 7px;
      flex-wrap: wrap; margin-bottom: 18px;
    }
    .odds-filter-btn {
      padding: 5px 13px; border-radius: 100px;
      border: 1px solid rgba(255,255,255,0.08);
      background: rgba(255,255,255,0.03);
      color: var(--text-muted);
      font-family: 'Barlow Condensed', sans-serif;
      font-size: 0.72rem; font-weight: 700;
      text-transform: uppercase; letter-spacing: 0.07em;
      cursor: pointer; transition: all 0.18s; white-space: nowrap;
    }
    .odds-filter-btn:hover  { background: rgba(255,107,53,0.1); color: var(--secondary); border-color: rgba(255,107,53,0.3); }
    .odds-filter-btn.active { background: rgba(255,107,53,0.18); color: var(--secondary); border-color: rgba(255,107,53,0.5); box-shadow: 0 0 10px rgba(255,107,53,0.15); }
    .odds-updated { font-size: 0.68rem; color: var(--text-muted); margin-left: auto; white-space: nowrap; }

    .odds-grid {
      display: grid;
      grid-template-columns: repeat(auto-fill, minmax(min(320px, 100%), 1fr));
      gap: 12px;
    }

    /* Card shell */
    .odds-card {
      position: relative;
      background: linear-gradient(160deg, rgba(14,20,36,0.98) 0%, rgba(8,12,20,0.98) 100%);
      border: 1px solid rgba(255,255,255,0.07);
      border-radius: 16px; overflow: hidden;
      transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
    }
    .odds-card::before {
      content: ''; position: absolute; inset: 0; border-radius: 16px;
      background: radial-gradient(ellipse at 50% 0%, rgba(255,107,53,0.04) 0%, transparent 70%);
      pointer-events: none;
    }
    .odds-card:hover {
      transform: translateY(-2px);
      box-shadow: 0 16px 40px rgba(0,0,0,0.55), 0 0 0 1px rgba(255,107,53,0.15);
      border-color: rgba(255,107,53,0.18);
    }

    /* Top accent bar */
    .odds-card-bar { height: 3px; width: 100%; }

    /* Header row: sport tag + time */
    .odds-card-header {
      display: flex; align-items: center;
      justify-content: space-between; gap: 8px;
      padding: 11px 14px 5px;
    }
    .odds-league-row {
      display: flex; align-items: center; gap: 6px;
    }
    .odds-sport-tag {
      font-family: 'Barlow Condensed', sans-serif;
      font-size: 0.64rem; font-weight: 900;
      text-transform: uppercase; letter-spacing: 0.12em;
      padding: 2px 8px; border-radius: 4px;
      background: rgba(255,107,53,0.14); color: var(--secondary);
      border: 1px solid rgba(255,107,53,0.22);
    }
    .odds-league-name {
      font-size: 0.64rem; color: var(--text-muted);
      font-family: 'Barlow Condensed', sans-serif;
      letter-spacing: 0.05em; text-transform: uppercase;
    }
    .odds-commence {
      font-size: 0.66rem; color: var(--text-muted);
      display: flex; align-items: center; gap: 4px;
      white-space: nowrap; font-family: 'Barlow Condensed', sans-serif;
      letter-spacing: 0.04em;
    }
    .odds-commence.soon { color: var(--accent); font-weight: 700; }
    .odds-commence.live-dot::before {
      content: ''; display: inline-block; width: 6px; height: 6px;
      border-radius: 50%; background: #ff4444;
      box-shadow: 0 0 6px #ff4444; animation: pulse-dot 1.2s infinite;
    }

    /* ── Matchup zone ── */
    .odds-matchup-zone {
      display: grid;
      grid-template-columns: 1fr auto 1fr;
      align-items: center;
      gap: 8px;
      padding: 10px 14px 6px;
    }
    .odds-team-col {
      display: flex; flex-direction: column;
      align-items: center; gap: 6px; min-width: 0;
    }
    .odds-team-col.away { align-items: center; }

    /* Logo circle */
    .odds-logo-ring {
      width: 56px; height: 56px; border-radius: 50%;
      background: rgba(255,255,255,0.03);
      border: 2px solid rgba(255,255,255,0.08);
      display: flex; align-items: center; justify-content: center;
      overflow: hidden; flex-shrink: 0;
      transition: border-color 0.2s, box-shadow 0.2s;
    }
    .odds-card:hover .odds-logo-ring { border-color: rgba(255,107,53,0.3); }
    .odds-logo-ring.fav-ring {
      border-color: rgba(0,229,255,0.3);
      box-shadow: 0 0 12px rgba(0,229,255,0.1);
    }
    .odds-logo-ring img { width: 42px; height: 42px; object-fit: contain; }
    .odds-logo-initials {
      font-family: 'Barlow Condensed', sans-serif;
      font-size: 1rem; font-weight: 900; color: var(--text-muted);
    }
    .odds-team-label {
      font-family: 'Barlow Condensed', sans-serif;
      font-size: 0.82rem; font-weight: 800;
      text-transform: uppercase; letter-spacing: 0.04em;
      color: var(--text-primary); text-align: center;
      line-height: 1.2; max-width: 100px; word-break: break-word;
    }

    /* Moneyline price chip */
    .odds-price {
      font-family: 'Barlow Condensed', sans-serif;
      font-size: 1.25rem; font-weight: 900; letter-spacing: 0.01em;
      padding: 5px 12px; border-radius: 9px; min-width: 62px; text-align: center;
    }
    .odds-price.fav  {
      background: rgba(0,229,255,0.1); color: var(--primary);
      border: 1px solid rgba(0,229,255,0.25);
      text-shadow: 0 0 12px rgba(0,229,255,0.4);
    }
    .odds-price.dog  {
      background: rgba(255,107,53,0.1); color: var(--secondary);
      border: 1px solid rgba(255,107,53,0.25);
    }
    .odds-price.even {
      background: rgba(255,255,255,0.05); color: var(--text-secondary);
      border: 1px solid rgba(255,255,255,0.1);
    }

    /* VS divider */
    .odds-vs-zone {
      display: flex; flex-direction: column;
      align-items: center; gap: 5px; flex-shrink: 0; width: 36px;
    }
    .odds-vs-text {
      font-family: 'Barlow Condensed', sans-serif;
      font-size: 0.78rem; font-weight: 900;
      color: rgba(255,255,255,0.18); letter-spacing: 0.08em;
    }
    .odds-draw-pill {
      font-family: 'Barlow Condensed', sans-serif;
      font-size: 0.6rem; font-weight: 800; letter-spacing: 0.06em;
      color: var(--text-muted); text-align: center;
      padding: 2px 5px; border-radius: 5px;
      background: rgba(255,255,255,0.04);
      border: 1px solid rgba(255,255,255,0.07);
      white-space: nowrap;
    }

    /* ── Win probability bar ── */
    .odds-prob-section {
      padding: 4px 14px 10px;
    }
    .odds-prob-header {
      display: flex; justify-content: space-between;
      margin-bottom: 5px;
    }
    .odds-prob-pct {
      font-family: 'Barlow Condensed', sans-serif;
      font-size: 0.68rem; font-weight: 700; color: var(--text-muted);
    }
    .odds-prob-pct.fav-pct { color: var(--primary); }
    .odds-prob-track {
      height: 6px; border-radius: 100px;
      background: rgba(255,255,255,0.06); overflow: hidden;
      display: flex;
    }
    .odds-prob-fill-home {
      height: 100%;
      background: linear-gradient(to right, #00c9e0, var(--primary));
      border-radius: 100px 0 0 100px;
      transition: width 0.8s cubic-bezier(0.16,1,0.3,1);
    }
    .odds-prob-fill-away {
      height: 100%;
      background: linear-gradient(to left, #ff4d1c, var(--secondary));
      border-radius: 0 100px 100px 0;
      transition: width 0.8s cubic-bezier(0.16,1,0.3,1);
    }
    .odds-prob-label-row {
      display: flex; justify-content: space-between;
      margin-top: 4px;
    }
    .odds-prob-team-lbl {
      font-size: 0.6rem; color: var(--text-muted);
      font-family: 'Barlow Condensed', sans-serif;
      letter-spacing: 0.05em; text-transform: uppercase;
      max-width: 45%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
    }

    /* ── Footer ── */
    .odds-card-footer {
      padding: 7px 14px 10px;
      border-top: 1px solid rgba(255,255,255,0.05);
      display: flex; align-items: center;
      justify-content: space-between; gap: 6px;
    }
    .odds-bookmaker {
      display: flex; align-items: center; gap: 5px;
      font-family: 'Barlow Condensed', sans-serif;
      font-size: 0.66rem; font-weight: 700;
      text-transform: uppercase; letter-spacing: 0.07em;
      color: var(--text-muted);
    }
    .odds-bookmaker i { opacity: 0.5; }
    .odds-line-badge {
      display: inline-flex; align-items: center; gap: 5px;
      padding: 4px 11px; border-radius: 7px;
      background: rgba(255,107,53,0.08);
      border: 1px solid rgba(255,107,53,0.2);
      color: rgba(255,107,53,0.8);
      font-family: 'Barlow Condensed', sans-serif;
      font-size: 0.66rem; font-weight: 800; text-transform: uppercase;
      letter-spacing: 0.07em; white-space: nowrap;
    }
    .no-odds { font-size: .83rem; opacity: .6; text-align: center; margin-top: 14px; padding: 18px; }

    /* ═══════════════════════════════════════════════════════
       PLAYERS — redesign
    ═══════════════════════════════════════════════════════ */
    .players-search-bar { display: flex; gap: 8px; margin-bottom: 14px; align-items: center; }
    .search-input-wrap { flex: 1; position: relative; }
    .search-input { width: 100%; padding: 10px 36px 10px 14px; border-radius: 10px; border: 1px solid rgba(255,255,255,0.1); background: rgba(255,255,255,0.04); color: var(--text-primary); font-size: 0.88rem; font-family: 'Barlow', sans-serif; outline: none; transition: border-color 0.2s; }
    .search-input:focus { border-color: var(--primary); background: rgba(0,229,255,0.04); }
    .search-input-clear { position: absolute; right: 10px; top: 50%; transform: translateY(-50%); background: none; border: none; color: var(--text-muted); cursor: pointer; font-size: 0.85rem; padding: 4px; display: none; }
    .search-btn { padding: 10px 16px; border-radius: 10px; border: none; background: var(--primary); color: #000; font-family: 'Barlow Condensed', sans-serif; font-size: 0.85rem; font-weight: 800; cursor: pointer; transition: opacity 0.2s; white-space: nowrap; display: flex; align-items: center; gap: 6px; }
    .search-btn:hover { opacity: 0.85; }
    .players-sport-bar { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 18px; padding-bottom: 14px; border-bottom: 1px solid rgba(255,255,255,0.06); }
    .plr-sport-btn { padding: 5px 12px; border-radius: 100px; border: 1px solid rgba(255,255,255,0.07); background: rgba(255,255,255,0.03); color: var(--text-muted); font-family: 'Barlow Condensed', sans-serif; font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.06em; cursor: pointer; transition: all 0.18s; white-space: nowrap; }
    .plr-sport-btn:hover { background: rgba(0,229,255,0.08); color: var(--primary); border-color: rgba(0,229,255,0.2); }
    .plr-sport-btn.active { background: rgba(0,229,255,0.12); color: var(--primary); border-color: rgba(0,229,255,0.35); }
    .plr-shuffle-btn { margin-left: auto; padding: 5px 14px; border-radius: 100px; border: 1px solid rgba(255,107,53,0.25); background: rgba(255,107,53,0.1); color: var(--secondary); font-family: 'Barlow Condensed', sans-serif; font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.06em; cursor: pointer; transition: all 0.18s; display: flex; align-items: center; gap: 5px; white-space: nowrap; }
    .plr-shuffle-btn:hover { background: rgba(255,107,53,0.2); }
    /* Player of the Day */
    .potd-wrap { margin-bottom: 20px; }
    .potd-label { font-family: 'Barlow Condensed', sans-serif; font-size: 0.66rem; font-weight: 900; text-transform: uppercase; letter-spacing: 0.12em; color: var(--accent); margin-bottom: 8px; display: flex; align-items: center; gap: 6px; }
    .potd-label::before { content: ''; display: block; width: 18px; height: 2px; background: var(--accent); border-radius: 1px; }
    .potd-card { background: linear-gradient(135deg, rgba(255,214,10,0.07) 0%, rgba(8,12,20,0.95) 60%); border: 1px solid rgba(255,214,10,0.2); border-radius: 16px; overflow: hidden; display: flex; align-items: stretch; cursor: pointer; transition: all 0.2s; position: relative; }
    .potd-card:hover { border-color: rgba(255,214,10,0.4); box-shadow: 0 10px 36px rgba(0,0,0,0.5); transform: translateY(-1px); }
    .potd-card-bar { position: absolute; top: 0; left: 0; right: 0; height: 3px; background: linear-gradient(to right, var(--accent), rgba(255,107,53,0.6)); }
    .potd-img-col { width: 110px; flex-shrink: 0; display: flex; align-items: flex-end; justify-content: center; overflow: hidden; background: rgba(255,214,10,0.04); }
    .potd-img { width: 100px; height: 110px; object-fit: cover; object-position: top center; display: block; }
    .potd-img-placeholder { width: 70px; height: 70px; border-radius: 50%; background: rgba(255,214,10,0.1); border: 2px solid rgba(255,214,10,0.2); display: flex; align-items: center; justify-content: center; font-size: 1.6rem; margin: 20px auto; }
    .potd-info { flex: 1; padding: 16px 18px; }
    .potd-badge { font-family: 'Barlow Condensed', sans-serif; font-size: 0.62rem; font-weight: 900; letter-spacing: 0.1em; padding: 2px 8px; border-radius: 4px; background: rgba(255,214,10,0.15); color: var(--accent); border: 1px solid rgba(255,214,10,0.25); display: inline-block; margin-bottom: 8px; }
    .potd-name { font-family: 'Barlow Condensed', sans-serif; font-size: 1.5rem; font-weight: 900; text-transform: uppercase; color: var(--text-primary); line-height: 1.1; margin-bottom: 4px; }
    .potd-sub { font-size: 0.78rem; color: var(--text-muted); display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
    .potd-team-tag { background: rgba(0,229,255,0.08); color: var(--primary); padding: 2px 8px; border-radius: 100px; font-size: 0.7rem; font-family: 'Barlow Condensed', sans-serif; font-weight: 700; }
    .potd-bio-snippet { margin-top: 8px; font-size: 0.78rem; color: var(--text-secondary); line-height: 1.5; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
    .potd-cta { margin-top: 10px; font-family: 'Barlow Condensed', sans-serif; font-size: 0.7rem; font-weight: 700; letter-spacing: 0.06em; color: var(--accent); text-transform: uppercase; display: flex; align-items: center; gap: 5px; }
    /* Recently viewed */
    .recents-section { margin-bottom: 20px; }
    .recents-label { font-family: 'Barlow Condensed', sans-serif; font-size: 0.66rem; font-weight: 900; text-transform: uppercase; letter-spacing: 0.1em; color: var(--text-muted); margin-bottom: 8px; }
    .recents-row { display: flex; gap: 8px; overflow-x: auto; padding-bottom: 4px; scrollbar-width: none; }
    .recents-row::-webkit-scrollbar { display: none; }
    .recent-chip { display: flex; align-items: center; gap: 7px; padding: 6px 10px 6px 7px; border-radius: 100px; border: 1px solid rgba(255,255,255,0.08); background: rgba(255,255,255,0.03); cursor: pointer; transition: all 0.18s; flex-shrink: 0; white-space: nowrap; }
    .recent-chip:hover { background: rgba(0,229,255,0.07); border-color: rgba(0,229,255,0.2); }
    .recent-chip-avatar { width: 26px; height: 26px; border-radius: 50%; object-fit: cover; border: 1px solid rgba(255,255,255,0.1); background: rgba(255,255,255,0.06); flex-shrink: 0; }
    .recent-chip-name { font-family: 'Barlow Condensed', sans-serif; font-size: 0.76rem; font-weight: 700; text-transform: uppercase; color: var(--text-secondary); }
    /* Player grid */
    .players-section-lbl { font-family: 'Barlow Condensed', sans-serif; font-size: 0.68rem; font-weight: 900; text-transform: uppercase; letter-spacing: 0.1em; color: var(--text-muted); margin-bottom: 10px; display: flex; align-items: center; gap: 8px; }
    .players-section-lbl::after { content: ''; flex: 1; height: 1px; background: rgba(255,255,255,0.06); }
    .players-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(170px, 45%), 1fr)); gap: 12px; margin-top: 4px; }
    .player-card { background: rgba(10,16,30,0.95); border-radius: 14px; overflow: hidden; border: 1px solid rgba(255,255,255,0.07); text-align: center; cursor: pointer; transition: all 0.22s; }
    .player-card:hover { transform: translateY(-3px); box-shadow: 0 12px 30px rgba(0,0,0,0.45); border-color: rgba(0,229,255,0.22); }
    .player-card-bar { height: 3px; }
    .player-card-body { padding: 14px 12px 12px; }
    .player-image { width: 80px; height: 80px; border-radius: 50%; object-fit: cover; margin: 0 auto 10px; border: 2px solid rgba(255,255,255,0.1); display: block; background: rgba(255,255,255,0.04); transition: border-color 0.2s; }
    .player-card:hover .player-image { border-color: rgba(0,229,255,0.4); }
    .player-name { font-family: 'Barlow Condensed', sans-serif; font-weight: 800; font-size: 0.9rem; margin-bottom: 4px; color: var(--text-primary); text-transform: uppercase; line-height: 1.2; }
    .player-pos-row { display: flex; align-items: center; justify-content: center; gap: 5px; margin-bottom: 6px; }
    .player-pos-badge { font-family: 'Barlow Condensed', sans-serif; font-size: 0.6rem; font-weight: 900; letter-spacing: 0.08em; padding: 1px 5px; border-radius: 3px; background: rgba(255,214,10,0.1); color: var(--accent); border: 1px solid rgba(255,214,10,0.18); }
    .player-nat { font-size: 0.7rem; color: var(--text-muted); }
    .player-sport { font-size: 0.68rem; color: var(--text-muted); margin-bottom: 5px; }
    .player-team { font-size: 0.68rem; color: var(--primary); background: rgba(0,229,255,0.07); padding: 3px 9px; border-radius: 100px; display: inline-block; font-family: 'Barlow Condensed', sans-serif; font-weight: 700; letter-spacing: 0.04em; text-transform: uppercase; }
    /* Player modal */
    #player-modal { position: fixed; top: 0; left: 0; width: 100%; height: 100%; display: none; align-items: center; justify-content: center; z-index: 2000; background: rgba(0,0,0,0.85); backdrop-filter: blur(6px); padding: 20px; }
    #player-modal.active { display: flex; animation: fadeIn 0.3s ease; }
    .player-modal-inner { position: relative; background: var(--card-bg); border: 1px solid var(--card-border); border-radius: 14px; max-width: 480px; width: 100%; max-height: 88vh; overflow-y: auto; box-shadow: 0 20px 56px rgba(0,0,0,0.7); }
    .player-modal-close { position: absolute; top: 11px; right: 11px; border: none; background: rgba(255,255,255,0.07); color: var(--text-primary); border-radius: 6px; padding: 5px 11px; cursor: pointer; font-size: .8rem; font-weight: 700; z-index: 10; transition: background 0.2s; }
    .player-modal-close:hover { background: rgba(239,68,68,0.7); }
    .player-modal-hero { position: relative; overflow: hidden; border-radius: 14px 14px 0 0; background: linear-gradient(160deg, rgba(0,229,255,0.08), rgba(8,12,20,1)); display: flex; align-items: flex-end; min-height: 120px; }
    .player-modal-hero-img { width: 110px; height: 130px; object-fit: cover; object-position: top center; flex-shrink: 0; }
    .player-modal-hero-info { flex: 1; padding: 14px 18px 14px 14px; }
    .player-modal-name { font-family: 'Barlow Condensed', sans-serif; font-size: 1.45rem; font-weight: 900; color: var(--text-primary); text-transform: uppercase; line-height: 1.1; margin-bottom: 4px; }
    .player-modal-sport { color: var(--text-muted); font-size: 0.82rem; margin-bottom: 6px; display: flex; align-items: center; gap: 7px; flex-wrap: wrap; }
    .player-modal-sport-badge { background: rgba(0,229,255,0.1); color: var(--primary); padding: 2px 8px; border-radius: 100px; font-size: 0.7rem; font-family: 'Barlow Condensed', sans-serif; font-weight: 700; }
    .player-modal-content { padding: 16px 20px 22px; }
    .player-modal-info { display: grid; grid-template-columns: 1fr 1fr; gap: 6px 16px; margin-bottom: 14px; }
    .player-info-item { padding: 5px 0; border-bottom: 1px solid rgba(255,255,255,0.05); }
    .player-info-label { color: var(--text-muted); font-size: 0.66rem; text-transform: uppercase; letter-spacing: 0.06em; font-family: 'Barlow Condensed', sans-serif; font-weight: 700; margin-bottom: 2px; display: block; }
    .player-info-value { color: var(--text-primary); font-weight: 600; font-size: 0.84rem; display: block; }
    .player-modal-bio { font-size: 0.8rem; color: var(--text-secondary); line-height: 1.65; border-top: 1px solid rgba(255,255,255,0.06); padding-top: 12px; }
    .player-modal-bio-label { font-family: 'Barlow Condensed', sans-serif; font-size: 0.66rem; font-weight: 900; text-transform: uppercase; letter-spacing: 0.1em; color: var(--text-muted); margin-bottom: 6px; display: block; }

    /* Video modal */
    #video-modal { position: fixed; top: 0; left: 0; width: 100%; height: 100%; display: none; align-items: center; justify-content: center; z-index: 2000; background: rgba(0,0,0,0.9); backdrop-filter: blur(6px); }
    #video-modal.active { display: flex; animation: fadeIn 0.3s; }
    .video-modal-inner { position: relative; background: #000; border-radius: 14px; max-width: 840px; width: 95%; box-shadow: 0 24px 56px rgba(0,0,0,0.8); border: 1px solid rgba(255,255,255,0.07); }
    .video-modal-close { position: absolute; top: -14px; right: -14px; background: rgba(15,23,42,0.95); border: 1px solid rgba(255,255,255,0.1); color: var(--text-primary); border-radius: 50%; width: 34px; height: 34px; cursor: pointer; font-size: .85rem; display: flex; align-items: center; justify-content: center; z-index: 10; transition: background 0.2s; }
    .video-modal-close:hover { background: rgba(239,68,68,0.8); }
    .video-modal-frame { position: relative; padding-bottom: 56.25%; height: 0; border-radius: 14px; overflow: hidden; }
    .video-modal-frame iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; border: none; }

    .loading { width: 26px; height: 26px; border: 3px solid rgba(0,229,255,0.14); border-radius: 50%; border-top-color: var(--primary); animation: spin 0.9s linear infinite; }

    .updated-at { font-size: .72rem; color: var(--text-muted); margin-bottom: 16px; padding: 5px 11px; background: rgba(0,229,255,0.04); border-radius: 6px; border: 1px solid rgba(0,229,255,0.08); display: inline-block; }

    .page-footer { max-width: 1280px; margin: 0 auto; padding: 18px 16px 30px; text-align: center; }
    .footer-text { font-size: .75rem; color: var(--text-muted); }





    /* ═══════════════════════════════════════════════════════
       MOBILE-FIRST RESPONSIVE — single authoritative block
       768px = tablet/mobile, 480px = small phone
    ═══════════════════════════════════════════════════════ */

    @media (max-width: 768px) {

      /* ── Page shell ── */
      body { overflow-x: hidden; }
      .page-main { padding: 10px 10px 80px !important; }

      /* ── Top nav: shrink, hide desktop buttons ── */
      .top-nav-inner { padding: 0 10px; height: 48px; gap: 6px; }
      .top-nav-buttons { display: none !important; }
      .nav-logo-text { font-size: 1rem; }
      .nav-logo-pulse { width: 28px; height: 28px; font-size: 0.75rem; }
      .mobile-nav-toggle { display: none !important; }

      /* ── Sticky bottom tab bar ── */
      .mobile-nav-dropdown {
        display: block !important;
        position: fixed !important;
        bottom: 0; left: 0; right: 0; top: auto !important;
        background: rgba(6,10,18,0.98) !important;
        backdrop-filter: blur(20px);
        -webkit-backdrop-filter: blur(20px);
        border-top: 1px solid rgba(0,229,255,0.15);
        border-radius: 0 !important;
        padding: 4px 2px 6px !important;
        z-index: 1100 !important;
        box-shadow: 0 -4px 24px rgba(0,0,0,0.6);
        animation: none !important;
      }
      .mobile-nav-grid {
        display: grid !important;
        grid-template-columns: repeat(7, 1fr) !important;
        gap: 0 !important;
      }
      .mobile-nav-btn {
        padding: 6px 2px 4px !important;
        border: none !important;
        border-radius: 6px !important;
        background: transparent !important;
        font-size: 0.52rem !important;
        gap: 2px !important;
        color: var(--text-muted);
      }
      .mobile-nav-btn i { font-size: 1.1rem !important; display: block; margin-bottom: 1px; }
      .mobile-nav-btn span { display: block; }
      .mobile-nav-btn.nav-active { color: var(--primary) !important; background: transparent !important; }
      .mobile-nav-btn.nav-active i { filter: drop-shadow(0 0 5px var(--primary)); }

      /* ── Hero ── */
      .hero-section { padding: 14px 12px 12px; margin-bottom: 10px; }
      .hero-inner { flex-direction: column; text-align: center; gap: 8px; }
      .hero-title { font-size: 1.35rem; }
      .hero-subtitle { font-size: 0.78rem; }
      .sport-tags { justify-content: center; }
      .logo-wrap img { max-width: 65px; }

      /* ── Box ── */
      .box { padding: 12px 10px; border-radius: 12px; }
      .box-title { font-size: 0.92rem; margin-bottom: 10px; }

      /* ── Sport filter bar ── */
      .sport-filter-bar { gap: 5px; padding-bottom: 2px; }
      .sport-filter-btn { font-size: 0.7rem; padding: 5px 10px; }

      /* ── Feed ── */
      .feed-card-body { padding: 10px 10px 8px; }
      .feed-title { font-size: 0.95rem; line-height: 1.3; }
      .feed-thumb img { height: 160px; }
      .inline-video iframe { height: 190px; }
      .feed-actions { flex-wrap: wrap; gap: 5px; }
      .feed-action-btn { font-size: 0.7rem; padding: 5px 9px; }
      .feed-source { display: none; }
      .read-content { font-size: 0.8rem; line-height: 1.6; }
      .read-badge { font-size: 0.65rem; }

      /* ── Scores — single column ── */
      .scores-toolbar { gap: 5px; }
      .scores-filter-btn { font-size: 0.68rem; padding: 4px 9px; }
      .scores-updated { display: none; }
      .scores-grid { grid-template-columns: 1fr !important; gap: 10px; }
      .score-matchup { padding: 6px 12px 10px; gap: 6px; }
      .score-team-logo-wrap { width: 52px; height: 52px; }
      .score-team-logo-wrap img { width: 40px; height: 40px; }
      .score-numbers { font-size: 2rem; gap: 6px; }
      .score-team-name { font-size: 0.76rem; max-width: 82px; }
      .score-card-footer { font-size: 0.65rem; padding: 6px 12px 8px; }

      /* ── Schedule — single column ── */
      .sched-toolbar { gap: 5px; }
      .sched-filter-btn { font-size: 0.68rem; padding: 4px 9px; }
      .sched-updated { display: none; }
      .sched-grid { grid-template-columns: 1fr !important; gap: 10px; }
      .sched-day-badge { width: 48px; height: 48px; border-radius: 10px; }
      .sched-day-num { font-size: 1.3rem; }
      .sched-day-label { font-size: 1.05rem; }
      .sched-day-count { font-size: 0.7rem; }
      .sched-matchup { padding: 6px 12px 10px; gap: 6px; }
      .sched-logo-wrap { width: 48px; height: 48px; }
      .sched-logo-wrap img { width: 36px; height: 36px; }
      .sched-team-name { font-size: 0.76rem; max-width: 82px; }
      .sched-card-footer { padding: 6px 12px 8px; }
      .sched-cal-btn { font-size: 0.64rem; padding: 4px 8px; }

      /* ── Market odds — single column ── */
      .poly-toolbar { gap: 5px; }
      .poly-filter-btn { font-size: 0.68rem; padding: 4px 9px; }
      .poly-updated { display: none; }
      .poly-grid { grid-template-columns: 1fr !important; gap: 10px; }
      .poly-question { font-size: 0.92rem; padding: 0 12px 8px; }
      .poly-outcomes { padding: 0 12px 12px; }
      .poly-card-footer { padding: 7px 12px 10px; flex-wrap: wrap; gap: 5px; }

      /* ── Gaming odds — single column ── */
      .odds-toolbar { gap: 5px; }
      .odds-filter-btn { font-size: 0.68rem; padding: 4px 9px; }
      .odds-updated { display: none; }
      .odds-grid { grid-template-columns: 1fr !important; gap: 10px; }
      .odds-logo-ring { width: 48px; height: 48px; }
      .odds-logo-ring img { width: 36px; height: 36px; }
      .odds-price { font-size: 1.1rem; padding: 4px 10px; min-width: 54px; }
      .odds-team-label { font-size: 0.76rem; }
      .odds-matchup-zone { gap: 6px; padding: 8px 12px 5px; }
      .odds-card-footer { padding: 6px 12px 9px; }

      /* ── Players ── */
      .players-grid { grid-template-columns: repeat(auto-fill, minmax(min(140px,45%),1fr)) !important; gap: 10px; }
      .players-sport-bar { gap: 5px; }
      .plr-sport-btn { font-size: 0.68rem; padding: 4px 9px; }
      .plr-shuffle-btn { font-size: 0.68rem; padding: 4px 10px; }
      .potd-img-col { width: 85px; }
      .potd-img { width: 80px; height: 90px; }
      .potd-name { font-size: 1.15rem; }
      .player-modal-hero-img { width: 85px; height: 105px; }
      .player-modal-info { grid-template-columns: 1fr; }

      /* ── Modals ── */
      .player-modal-inner { width: 96%; max-height: 90vh; }
      .video-modal-inner { width: 99%; border-radius: 8px; }
    }

    @media (max-width: 420px) {
      /* Very small phones */
      .page-main { padding: 8px 8px 76px !important; }
      .mobile-nav-btn span { font-size: 0.48rem !important; }
      .hero-title { font-size: 1.15rem; }
      .hero-subtitle { display: none; }
      .feed-thumb img { height: 140px; }
      .score-numbers { font-size: 1.7rem; }
      .score-team-logo-wrap { width: 44px; height: 44px; }
      .score-team-logo-wrap img { width: 34px; height: 34px; }
      .score-team-name { font-size: 0.68rem; max-width: 68px; }
      .sched-logo-wrap { width: 40px; height: 40px; }
      .sched-logo-wrap img { width: 30px; height: 30px; }
      .sched-team-name { font-size: 0.68rem; max-width: 68px; }
      .box { padding: 10px 8px; }
      /* Icon-only bottom nav on very small phones */
      .mobile-nav-btn span { display: none !important; }
      .mobile-nav-btn { padding: 9px 2px !important; }
      .mobile-nav-btn i { font-size: 1.2rem !important; }
    }

    /* ═══════════════════════════════════════════════════════
       FANTASY SPORTS — full redesign
    ═══════════════════════════════════════════════════════ */

    /* Sport switcher bar */
    .fant-sport-bar {
      display: flex; gap: 8px; margin-bottom: 16px; flex-wrap: wrap;
    }
    .fant-sport-btn {
      display: flex; align-items: center; gap: 7px;
      padding: 9px 18px; border-radius: 12px;
      border: 1px solid rgba(255,255,255,0.08);
      background: rgba(255,255,255,0.03);
      color: var(--text-muted);
      font-family: 'Barlow Condensed', sans-serif;
      font-size: 0.88rem; font-weight: 800;
      text-transform: uppercase; letter-spacing: 0.07em;
      cursor: pointer; transition: all 0.18s; flex: 1; justify-content: center;
      min-width: 70px;
    }
    .fant-sport-btn:hover { background: rgba(0,229,255,0.07); color: var(--primary); border-color: rgba(0,229,255,0.2); }
    .fant-sport-btn.active {
      background: linear-gradient(135deg, rgba(0,229,255,0.15), rgba(0,229,255,0.06));
      color: var(--primary); border-color: rgba(0,229,255,0.4);
      box-shadow: 0 0 16px rgba(0,229,255,0.1);
    }
    .fant-sport-icon { font-size: 1.05rem; }
    .fant-sport-lbl  { }

    /* Section tab bar */
    .fant-tab-bar {
      display: flex; gap: 4px; margin-bottom: 18px;
      border-bottom: 1px solid rgba(255,255,255,0.07);
      padding-bottom: 0;
    }
    .fant-tab {
      padding: 9px 16px; border: none; background: transparent;
      color: var(--text-muted);
      font-family: 'Barlow Condensed', sans-serif;
      font-size: 0.82rem; font-weight: 700;
      text-transform: uppercase; letter-spacing: 0.07em;
      cursor: pointer; transition: all 0.18s;
      border-bottom: 2px solid transparent; margin-bottom: -1px;
      display: flex; align-items: center; gap: 6px;
    }
    .fant-tab:hover { color: var(--text-secondary); }
    .fant-tab.active { color: var(--accent); border-bottom-color: var(--accent); }
    .fant-tab i { font-size: 0.78rem; }

    /* Period badge */
    .fant-period-badge {
      font-family: 'Barlow Condensed', sans-serif;
      font-size: 0.62rem; font-weight: 800; letter-spacing: 0.08em;
      padding: 2px 6px; border-radius: 4px;
      background: rgba(255,255,255,0.06); color: var(--text-muted);
      border: 1px solid rgba(255,255,255,0.08); text-transform: uppercase;
    }

    /* Trending two-column layout */
    .fant-two-col {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(min(300px, 100%), 1fr));
      gap: 14px;
    }
    .fant-trend-box { padding: 16px 14px; }

    /* Iframe wrapper with loader */
    .fant-iframe-wrap {
      position: relative; min-height: 480px;
      border-radius: 10px; overflow: hidden;
      border: 1px solid rgba(255,255,255,0.06);
      background: rgba(255,255,255,0.02);
    }
    .fant-iframe-wrap iframe {
      width: 100%; height: 480px; border: none;
      display: block;
    }
    .fant-iframe-loader {
      position: absolute; inset: 0;
      display: flex; align-items: center; justify-content: center;
      color: var(--text-muted); font-size: 1.4rem;
    }

    /* Top projected grid */
    .fant-proj-grid {
      display: grid;
      grid-template-columns: repeat(auto-fill, minmax(min(240px, 100%), 1fr));
      gap: 10px;
    }
    .fant-proj-card {
      background: rgba(255,255,255,0.02);
      border: 1px solid rgba(255,255,255,0.06);
      border-radius: 11px; padding: 12px 14px;
      display: flex; align-items: center; gap: 12px;
      transition: background 0.18s, border-color 0.18s;
    }
    .fant-proj-card:hover {
      background: rgba(255,255,255,0.04);
      border-color: rgba(0,229,255,0.15);
    }
    .fant-proj-rank {
      font-family: 'Barlow Condensed', sans-serif;
      font-size: 1.3rem; font-weight: 900; color: var(--text-muted);
      min-width: 26px; text-align: center;
    }
    .fant-proj-rank.top3 { color: var(--accent); }
    .fant-proj-info { flex: 1; min-width: 0; }
    .fant-proj-name {
      font-family: 'Barlow Condensed', sans-serif;
      font-size: 0.95rem; font-weight: 800;
      text-transform: uppercase; letter-spacing: 0.03em;
      color: var(--text-primary); white-space: nowrap;
      overflow: hidden; text-overflow: ellipsis;
    }
    .fant-proj-meta {
      font-size: 0.7rem; color: var(--text-muted); margin-top: 2px;
      display: flex; align-items: center; gap: 6px; flex-wrap: wrap;
    }
    .fant-pos-badge {
      font-family: 'Barlow Condensed', sans-serif;
      font-size: 0.62rem; font-weight: 900; letter-spacing: 0.08em;
      padding: 1px 5px; border-radius: 3px;
      background: rgba(255,214,10,0.12); color: var(--accent);
      border: 1px solid rgba(255,214,10,0.2);
    }
    .fant-proj-stats {
      display: flex; flex-direction: column; align-items: flex-end; gap: 2px;
      flex-shrink: 0;
    }
    .fant-proj-pts {
      font-family: 'Barlow Condensed', sans-serif;
      font-size: 1.05rem; font-weight: 900; color: var(--primary);
    }
    .fant-proj-own {
      font-size: 0.66rem; color: var(--text-muted);
    }
    .fant-empty {
      text-align: center; padding: 32px 16px;
      color: var(--text-muted); font-size: 0.85rem;
    }
    .fant-empty code {
      font-size: 0.78rem; background: rgba(255,255,255,0.06);
      padding: 1px 5px; border-radius: 4px;
    }

    /* Tools grid */
    .fant-tools-grid {
      display: grid;
      grid-template-columns: repeat(auto-fill, minmax(min(280px, 100%), 1fr));
      gap: 12px; margin-bottom: 14px;
    }
    .fant-tool-card { padding: 16px 16px 14px; }
    .fant-tool-header {
      display: flex; align-items: center; gap: 12px; margin-bottom: 12px;
    }
    .fant-tool-icon {
      width: 40px; height: 40px; border-radius: 10px;
      display: flex; align-items: center; justify-content: center;
      font-size: 1.1rem; flex-shrink: 0;
    }
    .fant-tool-name {
      font-family: 'Barlow Condensed', sans-serif;
      font-size: 0.95rem; font-weight: 800;
      text-transform: uppercase; letter-spacing: 0.04em;
      color: var(--text-primary);
    }
    .fant-tool-desc { font-size: 0.72rem; color: var(--text-muted); margin-top: 2px; }
    .fant-tool-links { display: flex; gap: 7px; flex-wrap: wrap; }
    .fant-link-btn {
      display: inline-flex; align-items: center; gap: 5px;
      padding: 6px 12px; border-radius: 7px;
      background: rgba(0,229,255,0.1);
      border: 1px solid rgba(0,229,255,0.22);
      color: var(--primary);
      font-family: 'Barlow Condensed', sans-serif;
      font-size: 0.7rem; font-weight: 800;
      text-transform: uppercase; letter-spacing: 0.06em;
      text-decoration: none; transition: all 0.18s; white-space: nowrap;
    }
    .fant-link-btn:hover { background: rgba(0,229,255,0.18); border-color: rgba(0,229,255,0.4); }
    .fant-link-btn.secondary {
      background: rgba(255,255,255,0.04);
      border-color: rgba(255,255,255,0.09);
      color: var(--text-secondary);
    }
    .fant-link-btn.secondary:hover { background: rgba(255,255,255,0.08); color: var(--text-primary); }
    .fant-tools-note {
      font-size: 0.7rem; color: var(--text-muted);
      text-align: center; padding: 6px 0;
      display: flex; align-items: center; justify-content: center; gap: 5px;
    }

    /* Footer */
    .fant-footer {
      display: flex; align-items: center; justify-content: center;
      gap: 14px; flex-wrap: wrap;
      margin-top: 18px; padding-top: 12px;
      border-top: 1px solid rgba(255,255,255,0.05);
      font-size: 0.68rem; color: var(--text-muted);
    }
    .fant-footer a { color: var(--text-muted); text-decoration: none; }
    .fant-footer a:hover { color: var(--primary); }

    /* Mobile */
    @media (max-width: 600px) {
      .fant-sport-btn { padding: 8px 10px; font-size: 0.78rem; }
      .fant-sport-icon { font-size: 1.1rem; }
      .fant-tab { padding: 8px 10px; font-size: 0.76rem; }
      .fant-iframe-wrap, .fant-iframe-wrap iframe { min-height: 400px; height: 400px; }
      .fant-proj-card { padding: 10px 11px; gap: 9px; }
    }

    /* ── Player card enhancements ── */
    .player-avatar-wrap {
      width: 82px; height: 82px; margin: 0 auto 10px;
      position: relative;
    }
    .player-image {
      width: 82px; height: 82px; border-radius: 50%;
      object-fit: cover; object-position: top center;
      border: 2px solid rgba(255,255,255,0.1);
      display: block; background: rgba(255,255,255,0.04);
      transition: border-color 0.2s;
    }
    .player-card:hover .player-image { border-color: rgba(0,229,255,0.4); }
    .player-initials-avatar {
      width: 82px; height: 82px; border-radius: 50%;
      display: flex; align-items: center; justify-content: center;
      font-family: 'Barlow Condensed', sans-serif;
      font-size: 1.5rem; font-weight: 900;
      border: 2px solid currentColor; opacity: 0.85;
    }
    .player-card-meta {
      display: flex; align-items: center; justify-content: center;
      gap: 5px; flex-wrap: wrap; margin-bottom: 6px;
    }
    .player-meta-chip {
      font-size: 0.62rem; color: var(--text-muted);
      background: rgba(255,255,255,0.04);
      border: 1px solid rgba(255,255,255,0.07);
      padding: 2px 6px; border-radius: 4px;
      display: flex; align-items: center; gap: 3px;
      font-family: 'Barlow Condensed', sans-serif; font-weight: 700;
    }
    .player-meta-chip i { font-size: 0.55rem; opacity: 0.7; }
    .player-meta-sport { color: var(--primary); background: rgba(0,229,255,0.06); border-color: rgba(0,229,255,0.14); }
    .player-card-snippet {
      margin-top: 9px; padding-top: 9px;
      border-top: 1px solid rgba(255,255,255,0.05);
      font-size: 0.67rem; color: var(--text-muted);
      line-height: 1.55; text-align: left;
      font-style: italic;
      display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
      overflow: hidden;
    }

    /* ── Modal enhancements ── */
    .player-modal-section-label {
      display: flex; align-items: center; gap: 6px;
      font-family: 'Barlow Condensed', sans-serif;
      font-size: 0.64rem; font-weight: 900;
      text-transform: uppercase; letter-spacing: 0.1em;
      color: var(--text-muted); margin-bottom: 9px;
    }
    .player-modal-section-label i { font-size: 0.72rem; }
    /* Fun facts list */
    .player-modal-facts {
      display: flex; flex-direction: column; gap: 7px;
    }
    .player-fact-item {
      display: flex; align-items: flex-start; gap: 9px;
      padding: 7px 10px; border-radius: 8px;
      background: rgba(255,255,255,0.025);
      border: 1px solid rgba(255,255,255,0.05);
    }
    .player-fact-icon { font-size: 0.95rem; flex-shrink: 0; margin-top: 1px; }
    .player-fact-text { font-size: 0.8rem; color: var(--text-secondary); line-height: 1.45; }
    /* Social buttons */
    .player-social-btn {
      width: 36px; height: 36px; border-radius: 8px;
      display: flex; align-items: center; justify-content: center;
      background: rgba(255,255,255,0.05);
      border: 1px solid rgba(255,255,255,0.09);
      color: var(--text-muted); font-size: 1rem;
      text-decoration: none; transition: all 0.18s;
    }
    .player-social-btn:hover { background: rgba(0,229,255,0.1); color: var(--primary); border-color: rgba(0,229,255,0.2); }
    /* Bio expand */
    .bio-expand-btn {
      display: inline-block; margin-top: 5px;
      background: none; border: none; padding: 0;
      color: var(--primary); font-size: 0.76rem;
      cursor: pointer; font-family: 'Barlow', sans-serif;
    }
    .bio-expand-btn:hover { text-decoration: underline; }

/* OTQI visual boost */
body{background-image:radial-gradient(ellipse at 15% 0%,rgba(0,229,255,.10),transparent 42%),radial-gradient(ellipse at 85% 15%,rgba(255,43,214,.07),transparent 38%),radial-gradient(ellipse at 80% 100%,rgba(255,107,53,.08),transparent 48%),linear-gradient(180deg,#070b14 0%,#0a1020 48%,#070b14 100%)}.feed-card,.box,.sidebar-widget,.score-card,.sched-card,.odds-card,.poly-card,.player-card{box-shadow:0 12px 34px rgba(0,0,0,.45),inset 0 1px 0 rgba(255,255,255,.035)}.feed-card:hover,.score-card:hover,.sched-card:hover,.odds-card:hover,.poly-card:hover,.player-card:hover{transform:translateY(-4px)}.hero-section{background:linear-gradient(135deg,rgba(0,229,255,.14),rgba(108,43,255,.08) 45%,rgba(255,107,53,.10));box-shadow:0 18px 46px rgba(0,0,0,.42),0 0 45px rgba(0,229,255,.06)}
