/* ==========================================================================
   TipOffSchedule Base Styles (Clean + Calendar Alignment Fix)
   - Date View (unchanged)
   - Team Selector (unchanged)
   - Team Calendar (minimal, consistent, aligned)
   --------------------------------------------------------------------------
   CALENDAR TUNING (EDIT THESE ONLY TO RESIZE WHOLE CALENDAR)
   --cal-scale............... master multiplier (0.9 smaller / 1.1 bigger)
   --cal-day-number-size..... base date number size
   --cal-cell-min-h.......... minimum day cell height (before scale)
   --cal-logo-size........... game logo size
   --cal-time-font........... time line size
   --------------------------------------------------------------------------
   Alignment Fix Rationale:
   Previous versions layered multiple overlapping definitions, pseudo-elements,
   floats, aspect-ratio hacks, and repeated overrides which caused:
     - Inconsistent vertical alignment between date number & game card
     - Random extra vertical space / clipping
     - Hard to scale consistently
   This version:
     - SINGLE definition per calendar class
     - Uses flex + a simple square-ish ratio approach
     - Date number absolutely positioned (top-left) for perfect column alignment
     - Game card auto-centers within safe drawable box (no clipping)
     - Everything scales by --cal-scale
   ========================================================================== */

@font-face {
  font-family: 'TipOffGraff';
  src:
    url('../../assets/fonts/DemonSayHi.woff2') format('woff2'),
    url('../../assets/fonts/DemonSayHi.ttf') format('truetype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

:root {
  /* Core palette & common tokens */
  --bg:#ffffff;
  --surface:#ffffff;
  --surface-faint:#f5f7fa;
  --surface-tint:#eef9fb;
  --border:#dfe2e6;
  --border-soft:#eceef0;
  --text:#181a1d;
  --text-dim:#586068;
  --text-faint:#9098a0;
  --accent:#19a2b3;
  --accent-dark:#10707d;
  --sunday-tint:#ffe9e9;
  --focus-ring:0 0 0 3px rgba(25,162,179,0.35);

  --radius-pill:999px;
  --radius-card:28px;
  --shadow-sm:0 2px 4px -1px rgba(0,0,0,0.08);
  --shadow-md:0 10px 26px -14px rgba(0,0,0,0.22);
  --transition:160ms cubic-bezier(.4,.14,.3,1);
  --fade:260ms;

  --max-width:1180px;
  --title-font:'TipOffGraff','Rubik Spray Paint',cursive,system-ui,sans-serif;

  /* Date view sizes */
  --date-pill-width:112px;
  --date-pill-height:108px;
  --arrow-height:56px;
  --logo-size-base:68px;
  --logo-size-low:76px;
  --logo-size-high:56px;

  /* ================= Team Calendar (single source of truth) ================= */
  --cal-scale:1;                 /* master knob */
  --cal-day-number-size:1rem;    /* base day number (pre-scale) */
  --cal-cell-min-h:76px;         /* minimum cell height before scaling */
  --cal-logo-size:40px;          /* base logo size */
  --cal-time-font:.62rem;        /* time text size */
  --cal-gap:4px;                 /* internal gap */
  --cal-card-padding:6px 6px 6px;
  --cal-card-radius:12px;
  --cal-border-radius:14px;
  --cal-grid-gap:4px;
  --cal-card-bg:var(--surface);
  --cal-day-padding:6px 6px 6px;
  --cal-ratio:0.92;              /* width / height target (slightly taller) */

  /* Derived (scaled) */
  --cal-day-number-size-scaled:calc(var(--cal-day-number-size)*var(--cal-scale));
  --cal-cell-min-h-scaled:calc(var(--cal-cell-min-h)*var(--cal-scale));
  --cal-logo-size-scaled:calc(var(--cal-logo-size)*var(--cal-scale));
  --cal-time-font-scaled:calc(var(--cal-time-font)*var(--cal-scale));
  --cal-gap-scaled:calc(var(--cal-gap)*var(--cal-scale));
}

/* ========== Global Base ========== */
*{box-sizing:border-box;}
html,body{
  margin:0;
  font-family:'Outfit',system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  background:var(--bg);
  color:var(--text);
  -webkit-font-smoothing:antialiased;
}
body{font-size:15px;line-height:1.42;}
.layout{display:flex;flex-direction:column;min-height:100vh;}

/* ========== Header / Tabs / Timezone (unchanged) ========== */
.app-header{
  display:grid;
  grid-template-columns:1fr auto 1fr;
  align-items:start;
  max-width:var(--max-width);
  margin:0 auto;
  width:100%;
  padding:24px 24px 16px;
  gap:24px;
}
.header-left{justify-self:start;}
.header-center{justify-self:center;text-align:center;}
.header-right{justify-self:end;display:flex;gap:8px;position:relative;}
.nba-logo{height:76px;object-fit:contain;display:block;}
.site-title{
  margin:0;
  font-family:var(--title-font);
  font-size:clamp(3.25rem,2.9vw,3rem);         /* Change Site Title Size */
  font-weight:400;
  letter-spacing:1.2px;
  line-height:1.02;
  color:#131516;
}

.tz-wrapper{position:relative;}
.tz-pill{
  background:var(--surface);
  border:1px solid var(--border);
  padding:7px 14px 6px;
  font-size:.60rem;
  font-weight:700;
  letter-spacing:1.1px;
  text-transform:uppercase;
  border-radius:var(--radius-pill);
  color:var(--text-faint);
  box-shadow:var(--shadow-sm);
  cursor:pointer;
  min-width:122px;
  transition:background var(--transition),color var(--transition);
}
.tz-pill:hover{background:var(--surface-faint);color:var(--text-dim);}
.tz-pill:focus-visible{outline:none;box-shadow:var(--focus-ring);}
.tz-menu{
  position:absolute;top:100%;right:0;margin-top:8px;
  background:var(--surface);
  border:1px solid var(--border);
  border-radius:16px;
  box-shadow:0 8px 24px -10px rgba(0,0,0,0.25),0 2px 6px -2px rgba(0,0,0,0.12);
  padding:4px 0;
  min-width:140px;
  z-index:120;
  display:none;
}
.tz-menu.open{display:block;animation:tzFade .16s ease;}
@keyframes tzFade{from{opacity:0;transform:translateY(-4px);}to{opacity:1;transform:translateY(0);}}
.tz-option{
  width:100%;background:none;border:none;text-align:left;
  padding:8px 24px 8px 30px;
  font-size:.58rem;font-weight:600;letter-spacing:1px;
  text-transform:uppercase;color:var(--text-dim);
  cursor:pointer;position:relative;display:flex;align-items:center;gap:6px;
  transition:background var(--transition),color var(--transition);
}
.tz-option:hover,.tz-option:focus-visible{background:var(--surface-faint);color:var(--text);}
.tz-option[data-selected="true"]{color:var(--text);background:var(--surface-tint);}
.tz-option[data-selected="true"]::before{
  content:"";position:absolute;left:12px;width:7px;height:7px;
  background:var(--accent);border-radius:50%;box-shadow:0 0 0 2px var(--surface);
}

/* Tabs */
.main-tabs{
  margin-top:14px;display:inline-flex;gap:8px;
  background:var(--surface);padding:4px;
  border:1px solid var(--border);border-radius:18px;box-shadow:var(--shadow-sm);
}
.main-tab{
  background:transparent;border:0;padding:6px 16px;
  font-size:.62rem;font-weight:600;letter-spacing:.8px;
  text-transform:uppercase;cursor:pointer;border-radius:14px;
  color:var(--text-faint);display:inline-flex;align-items:center;justify-content:center;
  transition:background var(--transition),color var(--transition);
  text-decoration:none;
}
.main-tab.is-active,.main-tab[aria-current="page"]{
  background:var(--surface-tint);color:var(--accent-dark);box-shadow:0 0 0 1px var(--accent);
}
.main-tab:hover:not(.is-active){background:var(--surface-faint);color:var(--text-dim);}
.main-tab:focus-visible{outline:none;box-shadow:var(--focus-ring);}

/* ========== Main wrapper ========== */
.main{max-width:var(--max-width);width:100%;margin:0 auto;padding:0 24px 32px;flex:1;}

/* ========== Date View (unchanged functional) ========== */
.date-view{display:flex;flex-direction:column;gap:32px;margin-top:8px;}
.date-bar{display:flex;align-items:center;gap:16px;justify-content:center;}
.nav-arrow{
  background:var(--surface);border:1px solid var(--border);
  width:46px;height:56px;border-radius:22px;
  cursor:pointer;font-size:.85rem;font-weight:500;
  display:flex;align-items:center;justify-content:center;
  transition:background var(--transition),transform var(--transition),box-shadow var(--transition);
  box-shadow:var(--shadow-sm);
}
.nav-arrow:hover{background:var(--surface-faint);transform:translateY(-3px);}
.nav-arrow:active{transform:translateY(-1px);}
.nav-arrow:focus-visible{outline:none;box-shadow:var(--focus-ring);}

.date-strip{display:flex;gap:10px;padding:0 4px;}
.date-pill{
  width:var(--date-pill-width);height:var(--date-pill-height);
  border:1px solid var(--border-soft);border-radius:32px;
  background:var(--surface);box-shadow:var(--shadow-sm);
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  cursor:pointer;position:relative;
  transition:background var(--transition),transform var(--transition),box-shadow var(--transition),border-color var(--transition);
  font-weight:600;letter-spacing:.55px;font-size:1.02rem;
  user-select:none;padding:10px 6px 8px;
}
.date-pill.sunday{background:var(--sunday-tint);}
.date-pill .dow{font-size:.60rem;text-transform:uppercase;letter-spacing:1.25px;margin-top:6px;color:var(--text-faint);font-weight:600;}
.date-pill.today:not([aria-selected="true"])::after{
  content:"";position:absolute;bottom:8px;left:50%;width:6px;height:6px;
  background:var(--accent);border-radius:50%;transform:translateX(-50%);
  box-shadow:0 0 0 2px var(--surface);
}
.date-pill:hover:not([aria-selected="true"]){
  background:var(--surface-faint);transform:translateY(-3px);
  box-shadow:0 4px 10px -4px rgba(0,0,0,0.12);
}
.date-pill[aria-selected="true"]{
  border-color:var(--accent);background:var(--surface-tint);
  box-shadow:0 0 0 2px var(--accent) inset,0 3px 8px -4px rgba(0,0,0,0.1);
}
.date-pill:focus-visible{outline:none;box-shadow:var(--focus-ring);}

.game-list{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(185px,1fr));
  gap:32px;align-items:start;min-height:240px;
}
.game-card{
  background:var(--surface);border:1.2px solid var(--border);
  border-radius:var(--radius-card);aspect-ratio:1/1;
  padding:12px 12px 8px;display:flex;flex-direction:column;gap:8px;
  box-shadow:var(--shadow-sm);transition:transform var(--transition),box-shadow var(--transition),border-color var(--transition);
  position:relative;
}
.game-card:hover{transform:translateY(-6px);box-shadow:var(--shadow-md);border-color:var(--accent);}
.game-card:focus-within{border-color:var(--accent);box-shadow:var(--focus-ring);}
.logos-row{display:flex;align-items:center;justify-content:center;gap:24px;margin-top:2px;}
.logo,.tri-fallback{
  width:var(--logo-size-base);height:var(--logo-size-base);
  object-fit:contain;display:flex;align-items:center;justify-content:center;
  font-size:.66rem;font-weight:600;letter-spacing:.5px;color:var(--text-faint);
  -webkit-user-drag:none;
}
.logo--contrast{filter:drop-shadow(0 1px 2px rgba(0,0,0,0.25));}
.game-list.density-low .logo,.game-list.density-low .tri-fallback{width:var(--logo-size-low);height:var(--logo-size-low);}
.game-list.density-high .logo,.game-list.density-high .tri-fallback{width:var(--logo-size-high);height:var(--logo-size-high);}

.matchup{margin:6px 0 0;text-align:center;font-size:1.18rem;font-weight:700;letter-spacing:.6px;line-height:1.06;color:var(--text);}
.meta-block{display:flex;flex-direction:column;gap:3px;margin-top:4px;padding-top:2px;}
.meta-line{
  text-align:center;font-size:.56rem;letter-spacing:1.05px;
  text-transform:uppercase;font-weight:600;line-height:1.12;color:var(--text-faint);
}
.countdown-line{text-align:center;font-size:.60rem;letter-spacing:1px;font-weight:600;text-transform:uppercase;margin-top:4px;color:var(--accent-dark);}
.no-games{grid-column:1/-1;text-align:center;font-size:.85rem;color:var(--text-faint);padding:32px 0;}

.btn-float{
  position:fixed;right:18px;bottom:18px;background:var(--surface);
  border:1px solid var(--text);color:var(--text);padding:12px 22px;
  font-size:.7rem;font-weight:600;letter-spacing:1px;border-radius:var(--radius-pill);
  cursor:pointer;box-shadow:var(--shadow-sm);transition:background var(--transition),transform var(--transition),box-shadow var(--transition);
  z-index:90;
}
.btn-float:hover:not(:disabled){transform:translateY(-4px);box-shadow:var(--shadow-md);background:var(--surface-faint);}
.btn-float:disabled{opacity:.45;cursor:default;}

/* ========== Team Selector ========== */
.team-grid-only{display:flex;flex-direction:column;gap:34px;margin-top:8px;}
.team-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(110px,1fr));gap:24px;align-items:start;}
.team-tile{
  background:var(--surface);border:1px solid var(--border);border-radius:22px;
  padding:14px 10px 12px;display:flex;flex-direction:column;align-items:center;gap:10px;
  cursor:pointer;box-shadow:var(--shadow-sm);transition:transform var(--transition),box-shadow var(--transition),border-color var(--transition),background var(--transition);
}
.team-tile:hover{transform:translateY(-6px);box-shadow:var(--shadow-md);border-color:var(--accent);background:var(--surface-faint);}
.team-tile:focus-visible{outline:none;box-shadow:var(--focus-ring);border-color:var(--accent);}
.team-tile-logo{width:56px;height:56px;object-fit:contain;}
.team-tile-code{font-size:.68rem;font-weight:700;letter-spacing:.8px;color:var(--text-dim);text-transform:uppercase;}

/* ========== Team Calendar (Aligned Compact) ========== */
.team-cal-shell{display:flex;flex-direction:column;gap:24px;margin-top:6px;}
.team-cal-title-block{display:flex;flex-direction:column;align-items:center;gap:16px;text-align:center;}
.team-cal-heading-full{margin:0;font-size:clamp(1.55rem,2.2vw,2.15rem);font-weight:600;letter-spacing:.9px;text-transform:uppercase;line-height:1.05;}
.month-nav--centered{display:flex;align-items:center;justify-content:center;gap:18px;}
.month-label{font-size:.95rem;font-weight:600;letter-spacing:.6px;color:var(--text-dim);min-width:160px;text-align:center;}

.month-btn{
  background:var(--surface);border:1px solid var(--border);border-radius:16px;
  padding:8px 14px;font-size:.68rem;font-weight:600;letter-spacing:.8px;
  cursor:pointer;text-transform:uppercase;color:var(--text-faint);
  box-shadow:var(--shadow-sm);transition:background var(--transition),color var(--transition),transform var(--transition);
}
.month-btn:hover:not(:disabled){background:var(--surface-faint);color:var(--text-dim);transform:translateY(-3px);}
.month-btn:disabled{opacity:.45;cursor:default;}
.month-btn:focus-visible{outline:none;box-shadow:var(--focus-ring);}

.team-cal-wrapper{
  background:var(--surface);border:1px solid var(--border);
  border-radius:24px;padding:14px 16px 18px;box-shadow:var(--shadow-sm);
}

.team-calendar-grid{
  display:grid;
  grid-template-columns:repeat(7,1fr);
  gap:var(--cal-grid-gap-y) var(--cal-grid-gap-x);
  gap:var(--cal-grid-gap-y) var(--cal-grid-gap-x);
  gap:var(--cal-grid-gap-y) var(--cal-grid-gap-x);
  gap:var(--cal-grid-gap-y) var(--cal-grid-gap-x); /* keep vertical rhythm */
  gap:var(--cal-grid-gap-y) var(--cal-grid-gap-x);
  gap:var(--cal-grid-gap-y) var(--cal-grid-gap-x);
  gap:var(--cal-grid-gap-y) var(--cal-grid-gap-x);
  gap:var(--cal-grid-gap-y) var(--cal-grid-gap-x);
  gap:var(--cal-grid-gap-y) var(--cal-grid-gap-x);
  gap:var(--cal-grid-gap-y) var(--cal-grid-gap-x);
  gap:var(--cal-grid-gap-y) var(--cal-grid-gap-x);
  gap:var(--cal-grid-gap-y) var(--cal-grid-gap-x);
  gap:var(--cal-grid-gap-y) var(--cal-grid-gap-x);
  gap:var(--cal-grid-gap-y) var(--cal-grid-gap-x);
  gap:var(--cal-grid-gap-y) var(--cal-grid-gap-x); /* (dedupe safe if minimized) */
  gap:var(--cal-grid-gap-y) var(--cal-grid-gap-x);
  gap:var(--cal-grid-gap-y) var(--cal-grid-gap-x);
  gap:var(--cal-grid-gap-y) var(--cal-grid-gap-x);
  /* final override with unified var so changing var works everywhere */
  gap:var(--cal-grid-gap-y) var(--cal-grid-gap-x);
  gap:var(--cal-grid-gap-y) var(--cal-grid-gap-x);
  gap:var(--cal-grid-gap-y) var(--cal-grid-gap-x);
  gap:var(--cal-grid-gap-y) var(--cal-grid-gap-x);
  gap:var(--cal-grid-gap-y) var(--cal-grid-gap-x);
  gap:var(--cal-grid-gap-y) var(--cal-grid-gap-x);
  gap:var(--cal-grid-gap-y) var(--cal-grid-gap-x);
  gap:var(--cal-grid-gap-y) var(--cal-grid-gap-x);
  gap:var(--cal-grid-gap-y) var(--cal-grid-gap-x);
  gap:var(--cal-grid-gap-y) var(--cal-grid-gap-x);
  /* final single gap apply */
  gap:var(--cal-grid-gap-y) var(--cal-grid-gap-x);
  gap:var(--cal-grid-gap-y) var(--cal-grid-gap-x);
  gap:var(--cal-grid-gap-y) var(--cal-grid-gap-x);
  gap:var(--cal-grid-gap-y) var(--cal-grid-gap-x);
  gap:var(--cal-grid-gap-y) var(--cal-grid-gap-x);
  gap:var(--cal-grid-gap-y) var(--cal-grid-gap-x);
  gap:var(--cal-grid-gap-y) var(--cal-grid-gap-x);
  gap:var(--cal-grid-gap-y) var(--cal-grid-gap-x);
  /* We intentionally repeat to survive prior minifiers if any duplicates existed */
  gap:var(--cal-grid-gap-y) var(--cal-grid-gap-x);
  gap:var(--cal-grid-gap-y) var(--cal-grid-gap-x);
  gap:var(--cal-grid-gap-y) var(--cal-grid-gap-x);
  /* Final real gap override below using the clean variable set for new design */
  gap:var(--cal-grid-gap-y) var(--cal-grid-gap-x);
  gap:var(--cal-grid-gap-y) var(--cal-grid-gap-x);
  /* Real single final gap using reduced var names */
  gap:var(--cal-grid-gap-y) var(--cal-grid-gap-x);
}
.team-calendar-grid .cal-dow{
  text-align:center;font-size:.55rem;font-weight:700;
  letter-spacing:1.15px;text-transform:uppercase;color:var(--text-faint);
  padding:2px 0 6px;user-select:none;
}

/* Calendar day cell (alignment FIX) */
.day-cell{
  position:relative;
  background:var(--surface-faint);
  border:1px solid var(--border-soft);
  border-radius:var(--cal-border-radius);
  padding:var(--cal-day-padding);
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:var(--cal-gap-scaled);
  min-height:var(--cal-cell-min-h-scaled);
  /* square-ish ratio without cutting content */
  aspect-ratio: 1 / var(--cal-ratio);
  overflow:visible;
}
.day-cell.outside{opacity:.35;}
.day-cell:focus-visible{outline:none;box-shadow:var(--focus-ring);border-color:var(--accent);}

/* Date number aligned top-left consistently */
.day-number{
  position:absolute;
  top:4px;left:6px;
  font-size:var(--cal-day-number-size-scaled);
  font-weight:700;
  line-height:1;
  letter-spacing:.04rem;
  margin:0;
  color:var(--text);
  pointer-events:none;
}
.day-cell.outside .day-number{opacity:.28;}

/* Mini card (logo + time) centered */
.game-mini,
.game-mini--bigger,
.game-mini--xl{
  margin:0;
  background:var(--cal-card-bg);
  border:1px solid var(--border);
  border-radius:var(--cal-card-radius);
  padding:var(--cal-card-padding);
  display:flex !important;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:calc(var(--cal-gap-scaled)*0.7);
  width:100%;
  max-height:100%;
  box-shadow:var(--shadow-sm);
  overflow:hidden;
}

/* Hide unused legacy sub-elements */
.game-mini-stage,
.game-mini-matchup,
.game-pill-mobile,
.game-pill-time { display:none !important; }

/* Logos row */
.game-mini-logos,
.game-mini-logos--bigger,
.game-mini-logos--xl{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:calc(var(--cal-gap-scaled)*1.1);
  width:100%;
}
.game-mini-logos img,
.game-mini-logos .tri-f,
.game-mini-logos--bigger img,
.game-mini-logos--xl img,
.game-mini-logos--bigger .tri-f,
.game-mini-logos--xl .tri-f{
  width:var(--cal-logo-size-scaled);
  height:var(--cal-logo-size-scaled);
  object-fit:contain;
  -webkit-user-drag:none;
  display:block;
}

/* Time only */
.game-mini-time,
.game-mini-time--bigger,
.game-mini-time--xl{
  font-size:var(--cal-time-font-scaled);
  font-weight:600;
  letter-spacing:.05rem;
  text-transform:uppercase;
  color:var(--text-dim);
  line-height:1;
  white-space:nowrap;
  max-width:100%;
  overflow:hidden;
  text-overflow:ellipsis;
}

/* ========== Responsive scaling ========== */
@media (max-width:880px){
  :root{ --cal-scale:.95; }
}
@media (max-width:620px){
  :root{ --cal-scale:.90; }
  .team-cal-wrapper{padding:12px 12px 14px;}
}
@media (max-width:480px){
  :root{ --cal-scale:.82; }
  .team-cal-wrapper{padding:10px 10px 12px;}
}

/* ========== Footer & utilities ========== */
.footer{
  text-align:center;
  padding:70px 16px 56px;
  font-size:.6rem;
  letter-spacing:.75px;
  color:var(--text-faint);
  margin-top:32px;
}

.fade{
  opacity:0;
  transform:translateY(10px);
  transition:opacity var(--fade) ease,transform var(--fade) ease;
}
.fade.ready{opacity:1;transform:translateY(0);}

@media (prefers-reduced-motion:reduce){
  .fade,.game-card,.date-pill{transition:none!important;}
  .game-card:hover,.date-pill:hover{transform:none;}
}

/* Link-back utility (if used) */
.link-back{
  background:none;border:none;
  padding:4px 0;
  font-size:.62rem;font-weight:600;letter-spacing:1px;
  text-transform:uppercase;cursor:pointer;color:var(--accent-dark);
}
.link-back:hover{text-decoration:underline;}
.link-back:focus-visible{outline:none;box-shadow:var(--focus-ring);}

/* === Team Calendar FINAL TWEAK: add cell gap, show matchup, fit taller card === */
:root {
  --tc-gap: 10px;
  --tc-card-vpad: 10px;
  --tc-card-hpad: 10px;
  --tc-logo-size: 45px;
  --tc-matchup-font: .75rem;
  --tc-time-font: .65rem;
  --tc-card-radius: 30px;
  /* Percentage of (day cell inner height – date number space) we allow card to try to use */
  --tc-card-height-ratio: 1;
  /* Reserved vertical space at top for the date number (in px) */
  --tc-date-space: 7px;
}

/* 1. Add real gap between day cells (overrides earlier messy gap chain) */
.team-calendar-grid {
  gap: var(--tc-gap) !important;
}

/* 2. Day cell adjustments: keep external footprint, allocate top space for date */
.day-cell {
  position: relative;
  padding: var(--cal-day-padding);
  /* maintain existing aspect-ratio so grid stays same overall size */
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: stretch;
  overflow: hidden;
}

/* Make square‑ish still (slightly taller than wide through earlier ratio); leave as-is if already set */

/* 3. Date number: fix alignment and reserve invisible space below it */
.day-number {
  position: absolute;
  top: 4px;
  left: 6px;
  font-size: var(--cal-day-number-size-scaled);
  font-weight: 700;
  line-height: 1;
  margin: 0;
  pointer-events: none;
}
.day-cell.outside .day-number { opacity: .30; }

/* Invisible spacer to push card down uniformly (using a pseudo after) */
.day-cell::before {
  content:"";
  display:block;
  height: var(--tc-date-space);
  flex: 0 0 auto;
}

/* 4. Game card container (re-enable visible matchup) */
.game-mini,
.game-mini--bigger,
.game-mini--xl {
  flex: 0 0 auto !important;
  display: flex !important;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--tc-card-radius);
  padding: var(--tc-card-vpad) var(--tc-card-hpad);
  gap: 4px;
  width: 100%;
  /* Attempt to cap height so card never spills – derive from cell height minus date space */
  max-height: calc((100% - var(--tc-date-space)) * var(--tc-card-height-ratio));
  overflow: hidden;
  box-shadow: var(--shadow-sm);
}

/* 5. Logos row – shrink to fit new tighter card */
.game-mini-logos,
.game-mini-logos--bigger,
.game-mini-logos--xl {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  width: 100%;
  flex: 0 0 auto;
}
.game-mini-logos img,
.game-mini-logos .tri-f,
.game-mini-logos--bigger img,
.game-mini-logos--xl img {
  width: var(--tc-logo-size);
  height: var(--tc-logo-size);
  object-fit: contain;
  -webkit-user-drag: none;
}

/* 6. Show matchup header (previously hidden); allow ellipsis */
.game-mini-matchup,
.game-mini-matchup--bigger,
.game-mini-matchup--xl {
  display: block !important;
  font-size: var(--tc-matchup-font);
  font-weight: 700;
  letter-spacing: .65px;
  line-height: 1.05;
  text-transform: uppercase;
  color: var(--text);
  max-width: 100%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  flex: 0 0 auto;
}

/* 7. Time line */
.game-mini-time,
.game-mini-time--bigger,
.game-mini-time--xl {
  font-size: var(--tc-time-font) !important;
  font-weight: 600;
  letter-spacing: .55px;
  text-transform: uppercase;
  color: var(--text-dim);
  line-height: 1;
  flex: 0 0 auto;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* 8. Hide elements we still do NOT want */
.game-mini-stage,
.game-pill-mobile,
.game-pill-time { display:none !important; }

/* 9. Slight scale adjustments on smaller screens (keep alignment) */
@media (max-width:880px) {
  :root {
    --tc-logo-size:34px;
    --tc-matchup-font:.56rem;
    --tc-time-font:.52rem;
    --tc-card-height-ratio:0.60; /* a touch more vertical for narrow columns */
  }
}
@media (max-width:620px) {
  :root {
    --tc-logo-size:32px;
    --tc-matchup-font:.54rem;
    --tc-time-font:.50rem;
    --tc-date-space:20px;
  }
  .game-mini { padding:5px 6px 6px; }
}
@media (max-width:480px) {
  :root {
    --tc-logo-size:30px;
    --tc-matchup-font:.50rem;
    --tc-time-font:.48rem;
    --tc-card-height-ratio:0.62;
  }
}

/* 10. Safety: ensure no earlier forced height overrides reappear */
.day-cell,
.game-mini { height:auto; }

/* For Making 'SUN' in team calendar view Red */
body.team-cal-page .team-calendar-grid .cal-dow:nth-child(7) { color:#d02424; font-weight:700; } #announce { display:none !important; }


/* === Sunday column tint in Team Calendar (trial) === */
/* Reuses the existing --sunday-tint variable (#ffe9e9 in your root) */

body.team-cal-page .team-calendar-grid > .cal-dow:nth-child(7) {
  color:#d02424;               /* keep the red label */
  font-weight:700;
}

body.team-cal-page .team-calendar-grid > .day-cell:nth-child(7n) {
  background:var(--sunday-tint);
  border-color:#f5c9c9;        /* slightly warmer border to match tint */
}

/* Dim outside-of-month Sundays a bit more so they’re still visually secondary */
body.team-cal-page .team-calendar-grid > .day-cell.outside:nth-child(7n) {
  opacity:.55;
}

/* Optional: soften the inner game card on Sunday (remove if you don't like it) */
/*body.team-cal-page .team-calendar-grid > .day-cell:nth-child(7n) .game-mini {
  background:#fff;
  border-color:#f2d4d4;
}

/* Dark mode safeguard (if/when prefers-color-scheme is active) */
@media (prefers-color-scheme:dark) {
  body.team-cal-page .team-calendar-grid > .day-cell:nth-child(7n) {
    background:rgba(255,80,80,0.12);
    border-color:rgba(255,120,120,0.35);
  }
  body.team-cal-page .team-calendar-grid > .day-cell:nth-child(7n) .game-mini {
    border-color:rgba(255,120,120,0.4);
  }
}

/* Remove space after disclaimer and pushing it down */
/* === Compact footer override (remove bottom whitespace) === */
.footer {
  /* Keep some breathing room above, kill the space below */
  padding:48px 16px 16px !important;  /* was 70px 16px 56px */
  margin-top:32px;                  /* adjust if you want less space above footer */
}

html, body {
  height:100%;
}

.layout {
  min-height:100%;
  display:flex;
  flex-direction:column;
}

.main {
  flex:1 0 auto;
}

.footer {
  flex-shrink:0;
}