:root{
    --bg-deep:#0F1C17;
    --bg-panel:#16261F;
    --bg-panel-2:#1D2F27;
    --turf:#3C7A4F;
    --turf-bright:#4F9A66;
    --amber:#F2A93B;
    --amber-dim:#B9832C;
    --chalk:#EDEAE1;
    --muted:#8FA396;
    --alert:#C9503F;
    --line:rgba(237,234,225,0.12);
    --line-bright:rgba(237,234,225,0.22);
    --radius:2px;
    --maxw:1180px;
  }
  *{box-sizing:border-box;}
  html{scroll-behavior:smooth;}
  body{
    margin:0;
    background:var(--bg-deep);
    background-image:
      radial-gradient(ellipse at top, rgba(60,122,79,0.16), transparent 55%),
      repeating-linear-gradient(0deg, rgba(237,234,225,0.015) 0px, rgba(237,234,225,0.015) 1px, transparent 1px, transparent 3px);
    color:var(--chalk);
    font-family:'Source Serif 4', Georgia, serif;
    line-height:1.55;
    -webkit-font-smoothing:antialiased;
  }
  h1,h2,h3,h4,.display{
    font-family:'Oswald', 'Arial Narrow', sans-serif;
    text-transform:uppercase;
    letter-spacing:0.02em;
    font-weight:600;
    margin:0;
  }
  .mono{font-family:'JetBrains Mono', monospace;}
  a{color:inherit;text-decoration:none;}
  button{font-family:inherit;cursor:pointer;}
  :focus-visible{outline:2px solid var(--amber);outline-offset:3px;}
  .wrap{max-width:var(--maxw);margin:0 auto;padding:0 24px;}
  .eyebrow{
    font-family:'JetBrains Mono', monospace;
    font-size:11px;
    letter-spacing:0.14em;
    text-transform:uppercase;
    color:var(--amber);
    display:flex;align-items:center;gap:8px;
  }
  .eyebrow::before{content:"";width:16px;height:1px;background:var(--amber);display:inline-block;}

  /* ---------- header ---------- */
  header{position:sticky;top:0;z-index:50;background:rgba(15,28,23,0.92);backdrop-filter:blur(6px);border-bottom:1px solid var(--line);}
  .headbar{display:flex;align-items:center;justify-content:space-between;padding:16px 24px;max-width:var(--maxw);margin:0 auto;gap:16px;flex-wrap:wrap;}
  .brand{display:flex;flex-direction:column;gap:2px;cursor:pointer;}
  .brand .logo{font-size:22px;letter-spacing:0.03em;}
  .brand .logo span{color:var(--amber);}
  .brand .tagline{font-family:'JetBrains Mono',monospace;font-size:10px;color:var(--muted);letter-spacing:0.08em;text-transform:uppercase;}
  nav{display:flex;gap:2px;flex-wrap:wrap;}
  nav button{
    background:transparent;border:1px solid transparent;color:var(--muted);
    font-family:'JetBrains Mono',monospace;font-size:12px;text-transform:uppercase;letter-spacing:0.06em;
    padding:8px 12px;border-radius:var(--radius);transition:color .15s ease, border-color .15s ease, background .15s ease;
  }
  nav button:hover{color:var(--chalk);border-color:var(--line-bright);}
  nav button.active{color:var(--bg-deep);background:var(--amber);border-color:var(--amber);}
  .newsroom-btn{
    display:flex;align-items:center;gap:6px;
    background:var(--bg-panel-2);border:1px dashed var(--muted);color:var(--muted);
    font-family:'JetBrains Mono',monospace;font-size:11px;text-transform:uppercase;letter-spacing:0.08em;
    padding:8px 12px;border-radius:var(--radius);transition:border-color .15s ease,color .15s ease;
  }
  .newsroom-btn:hover{border-color:var(--amber);color:var(--amber);}

  /* ---------- ticker ---------- */
  .ticker-outer{background:var(--bg-panel);border-bottom:1px solid var(--line);overflow:hidden;white-space:nowrap;}
  .ticker-track{display:inline-flex;gap:0;padding:7px 0;animation:tickerScroll 38s linear infinite;}
  .ticker-item{font-family:'JetBrains Mono',monospace;font-size:12px;padding:0 22px;border-right:1px solid var(--line);color:var(--muted);display:inline-flex;align-items:center;gap:8px;}
  .ticker-item b{color:var(--chalk);font-weight:500;}
  .ticker-item .up{color:var(--turf-bright);}
  .ticker-item .down{color:var(--alert);}
  .ticker-item .live{color:var(--amber);}
  @keyframes tickerScroll{from{transform:translateX(0);}to{transform:translateX(-50%);}}

  /* ---------- hero ---------- */
  .hero{padding:56px 24px 48px;border-bottom:1px solid var(--line);}
  .hero-grid{max-width:var(--maxw);margin:0 auto;display:grid;grid-template-columns:1.5fr 1fr;gap:48px;align-items:start;}
  .hero h1{font-size:clamp(30px,4.2vw,50px);line-height:1.05;margin:14px 0 18px;color:var(--chalk);}
  .hero .excerpt{color:var(--muted);font-size:17px;max-width:52ch;margin-bottom:20px;}
  .meta-row{display:flex;gap:14px;align-items:center;font-family:'JetBrains Mono',monospace;font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:0.05em;margin-bottom:24px;flex-wrap:wrap;}
  .meta-row .dot{width:3px;height:3px;background:var(--muted);border-radius:50%;}
  .cta{
    display:inline-flex;align-items:center;gap:8px;
    background:var(--amber);color:var(--bg-deep);border:none;
    font-family:'JetBrains Mono',monospace;font-weight:700;font-size:12px;letter-spacing:0.06em;text-transform:uppercase;
    padding:12px 20px;border-radius:var(--radius);transition:background .15s ease,transform .15s ease;
  }
  .cta:hover{background:#ffbf5c;transform:translateY(-1px);}
  .cta.ghost{background:transparent;border:1px solid var(--line-bright);color:var(--chalk);}
  .cta.ghost:hover{border-color:var(--amber);color:var(--amber);background:transparent;}

  /* ---------- bet slip (signature element) ---------- */
  .slip{
    background:var(--bg-panel);
    border:1px solid var(--line-bright);
    position:relative;
    padding:22px 22px 18px;
  }
  .slip::before,.slip::after{
    content:"";position:absolute;left:50%;transform:translateX(-50%);
    width:22px;height:22px;background:var(--bg-deep);border-radius:50%;
  }
  .slip::before{top:-11px;}
  .slip::after{bottom:-11px;}
  .slip-perf{border-top:1px dashed var(--line-bright);margin:16px 0;}
  .slip-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px;}
  .slip-head .label{font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:0.14em;text-transform:uppercase;color:var(--muted);}
  .slip-head .stamp{font-family:'JetBrains Mono',monospace;font-size:10px;color:var(--turf-bright);}
  .slip-matchup{font-size:19px;font-family:'Oswald',sans-serif;text-transform:uppercase;color:var(--chalk);margin-bottom:6px;}
  .slip-line{font-family:'JetBrains Mono',monospace;font-size:13px;color:var(--muted);display:flex;justify-content:space-between;margin:6px 0;}
  .slip-line b{color:var(--amber);font-weight:700;}
  .confidence{display:flex;align-items:center;gap:10px;margin-top:14px;}
  .confidence .label{font-family:'JetBrains Mono',monospace;font-size:10px;text-transform:uppercase;letter-spacing:0.1em;color:var(--muted);}
  .dots{display:flex;gap:4px;}
  .dots i{width:7px;height:7px;border-radius:50%;background:var(--line-bright);display:inline-block;}
  .dots i.on{background:var(--amber);}

  /* ---------- category filter ---------- */
  .filters{max-width:var(--maxw);margin:0 auto;padding:28px 24px 0;display:flex;gap:8px;flex-wrap:wrap;}
  .chip{
    font-family:'JetBrains Mono',monospace;font-size:11px;text-transform:uppercase;letter-spacing:0.06em;
    padding:7px 14px;border:1px solid var(--line-bright);color:var(--muted);border-radius:20px;background:transparent;
    transition:all .15s ease;
  }
  .chip:hover{border-color:var(--amber);color:var(--amber);}
  .chip.active{background:var(--chalk);color:var(--bg-deep);border-color:var(--chalk);}

  /* ---------- article grid ---------- */
  main{max-width:var(--maxw);margin:0 auto;padding:28px 24px 80px;}
  .grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:22px;}
  .card{
    background:var(--bg-panel);border:1px solid var(--line);border-top:3px solid var(--turf);
    padding:20px;display:flex;flex-direction:column;gap:10px;position:relative;
    transition:border-color .18s ease, transform .18s ease;
  }
  .card:hover{border-color:var(--line-bright);border-top-color:var(--amber);transform:translateY(-2px);}
  .card .odds-badge{
    position:absolute;top:16px;right:16px;background:var(--bg-panel-2);border:1px solid var(--line-bright);
    font-family:'JetBrains Mono',monospace;font-size:11px;color:var(--amber);padding:3px 8px;border-radius:20px;
  }
  .card .cat{font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:0.12em;text-transform:uppercase;color:var(--turf-bright);}
  .card h3{font-size:19px;line-height:1.2;color:var(--chalk);padding-right:70px;}
  .card p{color:var(--muted);font-size:14px;margin:0;flex-grow:1;}
  .card .meta-row{margin:6px 0 0;font-size:10px;}
  .card .dots i{width:5px;height:5px;}

  /* ---------- article detail ---------- */
  .article-view{display:none;}
  .article-view.show{display:block;}
  .home-view.hide{display:none;}
  .back-link{font-family:'JetBrains Mono',monospace;font-size:12px;color:var(--muted);display:inline-flex;align-items:center;gap:6px;margin-bottom:24px;}
  .back-link:hover{color:var(--amber);}
  .article-layout{display:grid;grid-template-columns:1.7fr 1fr;gap:44px;align-items:start;}
  .article-body h1{font-size:clamp(26px,3.6vw,40px);line-height:1.1;color:var(--chalk);margin-bottom:14px;}
  .article-body .lede{color:var(--muted);font-size:18px;margin-bottom:18px;}
  .article-body p{font-size:16px;color:#DAD6C9;margin:0 0 18px;}
  .pull{
    border-left:2px solid var(--amber);padding-left:18px;margin:28px 0;
    font-family:'Oswald',sans-serif;text-transform:none;font-weight:500;letter-spacing:0;
    font-size:21px;color:var(--chalk);
  }
  .sidebar-stick{position:sticky;top:120px;display:flex;flex-direction:column;gap:20px;}
  .related-title{font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:0.12em;text-transform:uppercase;color:var(--muted);margin:8px 0 4px;}
  .related-item{display:block;padding:10px 0;border-bottom:1px solid var(--line);font-size:14px;color:var(--chalk);}
  .related-item:hover{color:var(--amber);}
  .related-item .cat{display:block;font-family:'JetBrains Mono',monospace;font-size:9px;color:var(--turf-bright);text-transform:uppercase;letter-spacing:0.1em;margin-bottom:3px;}

  /* ---------- newsroom / admin ---------- */
  .overlay{position:fixed;inset:0;background:rgba(6,12,10,0.7);display:none;align-items:flex-start;justify-content:center;z-index:100;padding:60px 20px;overflow:auto;}
  .overlay.show{display:flex;}
  .panel{background:var(--bg-panel);border:1px solid var(--line-bright);max-width:640px;width:100%;padding:30px;}
  .panel h2{font-size:22px;margin-bottom:4px;}
  .panel .note{font-family:'JetBrains Mono',monospace;font-size:11px;color:var(--amber-dim);border:1px dashed var(--amber-dim);padding:10px 12px;margin:14px 0 20px;line-height:1.5;}
  .field{margin-bottom:14px;display:flex;flex-direction:column;gap:6px;}
  .field label{font-family:'JetBrains Mono',monospace;font-size:10px;text-transform:uppercase;letter-spacing:0.08em;color:var(--muted);}
  .field input,.field select,.field textarea{
    background:var(--bg-deep);border:1px solid var(--line-bright);color:var(--chalk);
    padding:10px 12px;font-family:'Source Serif 4',serif;font-size:14px;border-radius:var(--radius);
  }
  .field textarea{min-height:110px;resize:vertical;font-family:'Source Serif 4',serif;}
  .field-row{display:grid;grid-template-columns:1fr 1fr;gap:12px;}
  .panel-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:20px;}
  .cta.small{padding:9px 16px;font-size:11px;}
  .btn-plain{background:transparent;border:1px solid var(--line-bright);color:var(--muted);padding:9px 16px;font-family:'JetBrains Mono',monospace;font-size:11px;text-transform:uppercase;border-radius:var(--radius);}
  .btn-plain:hover{color:var(--chalk);border-color:var(--chalk);}

  /* ---------- footer ---------- */
  footer{border-top:1px solid var(--line);padding:36px 24px;background:var(--bg-panel);}
  .footer-inner{max-width:var(--maxw);margin:0 auto;display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;align-items:center;}
  .footer-inner p{font-family:'JetBrains Mono',monospace;font-size:11px;color:var(--muted);max-width:60ch;margin:0;}
  .footer-brand{font-family:'Oswald',sans-serif;text-transform:uppercase;letter-spacing:0.04em;font-size:15px;color:var(--chalk);}

  @media (max-width:860px){
    .hero-grid{grid-template-columns:1fr;}
    .grid{grid-template-columns:repeat(2,1fr);}
    .article-layout{grid-template-columns:1fr;}
    .sidebar-stick{position:static;}
  }
  @media (max-width:560px){
    .grid{grid-template-columns:1fr;}
    .field-row{grid-template-columns:1fr;}
    nav{width:100%;justify-content:flex-start;}
  }
  @media (prefers-reduced-motion:reduce){
    .ticker-track{animation:none;}
    html{scroll-behavior:auto;}
    .card:hover,.cta:hover{transform:none;}
  }
