/* ==========================================================================
   Previously Sportsbook — the Odds Board
   Walk-into-the-casino sportsbook wall: seamless dark LED board, amber LED
   type, glowing gold section banners. No card borders anywhere.
   Phone-first; system monospace stack (site CSP is font-src 'self' — no
   external font hosts).
   ========================================================================== */
:root{
  --ob-bg:#030303;
  --ob-amber:#ffb000;
  --ob-amber-hi:#ffd75e;
  --ob-amber-dim:#8a6a1f;
  --ob-amber-faint:#5c4718;
  --ob-ivory:#ffe9b0;
  --ob-price:#b57e18;
  --ob-green:#7dfb9a;
  --ob-gold1:#ffd75e;
  --ob-gold2:#e8a90c;
}
html{background:var(--ob-bg)}
body.ob{background:var(--ob-bg);color:var(--ob-amber);
  font-family:ui-monospace,'SF Mono','Cascadia Mono',Menlo,Consolas,'Liberation Mono',monospace;
  min-height:100vh;margin:0;-webkit-font-smoothing:antialiased}

/* Marquee header */
.ob-marquee{text-align:center;padding:30px 16px 4px}
.ob-marquee .ob-brand{font-size:14px;letter-spacing:.6em;color:#ffcf4d;
  text-shadow:0 0 16px rgba(255,180,0,.5)}
.ob-marquee h1{font-size:clamp(36px,9vw,64px);letter-spacing:.12em;color:var(--ob-amber-hi);
  margin:6px 0 0;font-weight:700;
  text-shadow:0 0 8px rgba(255,183,0,.9),0 0 34px rgba(255,140,0,.5)}
.ob-updated{margin-top:10px;font-size:11px;letter-spacing:.18em;color:var(--ob-amber-dim)}

/* The wall */
.ob-wrap{max-width:900px;margin:0 auto;padding:8px 0 48px}
.ob-colh{display:grid;grid-template-columns:36px 1fr 68px 56px 78px 56px 68px;
  padding:8px 16px;font-size:10px;letter-spacing:.2em;color:var(--ob-amber-faint)}
.ob-colh span:nth-child(n+3){text-align:right}

/* Gold section banner — always know where you are */
.ob-sect{margin:26px 0 0;padding:12px 16px;font-size:17px;letter-spacing:.3em;
  color:#0a0a0a;font-weight:700;background:linear-gradient(180deg,var(--ob-gold1),var(--ob-gold2));
  box-shadow:0 0 26px rgba(255,190,60,.45)}

.ob-kick{display:flex;justify-content:space-between;align-items:baseline;
  padding:10px 16px 2px;font-size:12px;letter-spacing:.1em;color:var(--ob-amber-dim)}
.ob-kick .kt{white-space:nowrap;margin-left:10px;color:var(--ob-amber)}

/* Rows — seamless, no borders */
.ob-row{display:grid;grid-template-columns:36px 1fr 68px 56px 78px 56px 68px;
  align-items:center;padding:8px 16px;font-size:17px}
.ob-row:nth-of-type(odd){background:rgba(255,170,0,.025)}
.ob-rot{color:var(--ob-amber-faint);font-size:12px}
.ob-team{color:var(--ob-ivory);font-weight:700;letter-spacing:.08em;
  text-shadow:0 0 10px rgba(255,200,80,.45)}
.ob-ln{color:var(--ob-amber);text-align:right;text-shadow:0 0 8px rgba(255,170,0,.4);
  font-variant-numeric:tabular-nums;white-space:nowrap}
.ob-pr{color:var(--ob-price);font-size:12px;text-align:right;font-variant-numeric:tabular-nums}
.ob-ml{color:var(--ob-green);text-shadow:0 0 8px rgba(80,255,140,.35)}

/* Tappable rows — only where a real matchup destination exists */
a.ob-row{color:inherit;text-decoration:none;cursor:pointer}
a.ob-row:hover .ob-team,a.ob-row:focus-visible .ob-team{text-shadow:0 0 14px rgba(255,210,100,.9)}
a.ob-row:focus-visible{outline:2px solid var(--ob-amber-hi);outline-offset:-2px}
a.ob-kick{color:inherit;text-decoration:none}
a.ob-kick:hover .ob-kick-teams{text-decoration:underline;text-decoration-color:var(--ob-amber-dim)}

/* Polymarket strip — prediction-market prices under each game */
.ob-pm{display:flex;gap:10px;align-items:baseline;padding:6px 16px 10px 52px;
  font-size:11.5px;letter-spacing:.06em;color:var(--ob-amber-dim);
  font-variant-numeric:tabular-nums}
.ob-pm-tag{flex:0 0 auto;font-size:10px;font-weight:700;letter-spacing:.14em;
  color:#0a0a0a;background:var(--ob-amber-dim);padding:2px 7px;border-radius:3px}
.ob-pm span:last-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

.ob-foot{text-align:center;color:var(--ob-amber-faint);font-size:11px;
  letter-spacing:.14em;padding:34px 16px;line-height:2.1}
.ob-foot b{color:var(--ob-price)}
.ob-legal{color:#3d3013;font-size:10px;letter-spacing:.08em}
.ob-empty{padding:40px 20px;text-align:center;color:var(--ob-amber-dim);
  font-size:13px;letter-spacing:.1em;line-height:2}

@media (max-width:560px){
  .ob-colh,.ob-row{grid-template-columns:30px 1fr 58px 48px 66px 48px 58px;padding:8px 10px}
  .ob-row{font-size:15px}
  .ob-sect{font-size:14px;padding:10px 12px;letter-spacing:.22em}
  .ob-kick{padding:10px 10px 2px}
  .ob-pm{padding:6px 10px 10px 40px;font-size:10.5px}
  .ob-pm span:last-child{white-space:normal;line-height:1.7}
}
@media (min-width:1000px){
  .ob-row{font-size:18px}
}
