:root{
  --tt-navy:#061a45;
  --tt-navy-2:#0a2d67;
  --tt-red:#d51f2a;
  --tt-red-dark:#a90f1c;
  --tt-blue:#153f7c;
  --tt-ink:#102038;
  --tt-muted:#64748b;
  --tt-line:#dce5f0;
  --tt-bg:#f5f7fb;
  --tt-soft-red:#fff1f2;
  --tt-soft-blue:#eef4fb;
  --navy:var(--tt-navy);
  --blue:var(--tt-blue);
  --cyan:#5379a7;
  --ink:var(--tt-ink);
  --muted:var(--tt-muted);
  --line:var(--tt-line);
  --bg:var(--tt-bg);
  --green:#0f766e;
}
*{box-sizing:border-box}
body{background:var(--tt-bg);color:var(--tt-ink);font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif}
a{color:var(--tt-blue)}
.tt-nav{background:linear-gradient(100deg,var(--tt-navy),#08295f 72%,var(--tt-red-dark));box-shadow:0 8px 28px rgba(2,12,27,.18);border-bottom:3px solid var(--tt-red)}
.navbar-brand{letter-spacing:-.03em}
.tt-brand-lockup{display:flex;align-items:center;gap:10px;text-decoration:none}
.tt-brand-logo{height:48px;width:auto;display:block;background:#fff;border-radius:10px;padding:3px 8px;box-shadow:0 5px 16px rgba(0,0,0,.18)}
.tt-brand-name{font-weight:950;letter-spacing:-.035em;color:#fff;line-height:1}
.tt-brand-name small{display:block;margin-top:4px;font-size:9px;letter-spacing:.13em;text-transform:uppercase;color:#d9e5f7;font-weight:800}
.brand-mark{display:inline-grid;place-items:center;width:36px;height:36px;border-radius:12px;background:#fff;color:var(--tt-navy);margin-right:8px;font-weight:950}
.hero{border-radius:28px;background:radial-gradient(circle at 88% 8%,rgba(213,31,42,.34),transparent 28%),linear-gradient(135deg,var(--tt-navy),#0b326f 72%);color:white;padding:44px;box-shadow:0 24px 70px rgba(6,26,69,.2);border-bottom:4px solid var(--tt-red)}
.hero h1{font-weight:900;letter-spacing:-.045em}
.tt-card{border:1px solid rgba(220,229,240,.9);border-radius:22px;box-shadow:0 14px 40px rgba(15,23,42,.07)}
.tt-card .card-header{background:transparent;border-bottom:1px solid var(--tt-line);font-weight:850}
.kicker{text-transform:uppercase;letter-spacing:.12em;font-size:.74rem;font-weight:900;color:#ffb8be}
.step-chip{display:inline-flex;align-items:center;gap:8px;border-radius:999px;padding:8px 12px;background:#eef3fa;color:var(--tt-navy);font-size:.84rem;font-weight:800;border:1px solid #d8e2f0}
.status-dot{width:8px;height:8px;border-radius:50%;background:var(--tt-red)}
.metric{font-size:2rem;font-weight:900;letter-spacing:-.04em}
.tt-footer{background:var(--tt-navy);color:white;padding:28px 0;margin-top:54px;border-top:4px solid var(--tt-red)}
.form-control,.form-select{border-radius:12px;border-color:#ccd8e6;min-height:46px}
.form-control:focus,.form-select:focus{border-color:#7893b9;box-shadow:0 0 0 .25rem rgba(6,26,69,.1)}
.btn{border-radius:12px;font-weight:750}
.btn-primary{background:var(--tt-navy);border-color:var(--tt-navy)}
.btn-primary:hover,.btn-primary:focus{background:var(--tt-navy-2);border-color:var(--tt-navy-2)}
.btn-outline-primary{color:var(--tt-navy);border-color:var(--tt-navy)}
.btn-outline-primary:hover{background:var(--tt-navy);border-color:var(--tt-navy);color:#fff}
.btn-danger{background:var(--tt-red);border-color:var(--tt-red)}
.btn-danger:hover,.btn-danger:focus{background:var(--tt-red-dark);border-color:var(--tt-red-dark)}
.text-primary{color:var(--tt-navy)!important}
.bg-primary{background-color:var(--tt-navy)!important}
.text-bg-primary{background-color:var(--tt-navy)!important;color:#fff!important}
.border-primary{border-color:var(--tt-navy)!important}
.page-title{font-weight:900;letter-spacing:-.035em}
.next-action{border:0;border-radius:22px;background:linear-gradient(115deg,#eef3fa,#fff);box-shadow:inset 0 0 0 1px #d5dfec;padding:20px}
.table>thead th{font-size:.76rem;text-transform:uppercase;letter-spacing:.06em;color:#64748b}
.live-pulse{display:inline-block;width:10px;height:10px;border-radius:50%;background:var(--tt-red);box-shadow:0 0 0 0 rgba(213,31,42,.5);animation:pulse 1.5s infinite}
.tt-ready-banner{border:2px solid #ef8f97;background:linear-gradient(115deg,#fff1f2,#fff);border-radius:18px;padding:16px;box-shadow:0 10px 28px rgba(169,15,28,.08)}
.tt-ready-badge{display:inline-flex;align-items:center;gap:7px;border-radius:999px;background:var(--tt-red);color:#fff;padding:6px 10px;font-size:12px;font-weight:900;letter-spacing:.05em;text-transform:uppercase}
.tt-ready-badge::before{content:"";width:8px;height:8px;border-radius:50%;background:#fff;box-shadow:0 0 0 0 rgba(255,255,255,.5);animation:pulseWhite 1.5s infinite}
@keyframes pulse{70%{box-shadow:0 0 0 12px rgba(213,31,42,0)}100%{box-shadow:0 0 0 0 rgba(213,31,42,0)}}
@keyframes pulseWhite{70%{box-shadow:0 0 0 10px rgba(255,255,255,0)}100%{box-shadow:0 0 0 0 rgba(255,255,255,0)}}
@media(max-width:767px){
  .hero{padding:28px 22px;border-radius:22px}.hero h1{font-size:2rem}.metric{font-size:1.55rem}
  .tt-brand-logo{height:40px;padding:2px 6px}.tt-brand-name{font-size:16px}.tt-brand-name small{display:none}
}
/* Brand-theme override for page-specific hero panels retained from the source system. */
.apply-hero,.auto-hero,.dash-hero,.extlist-hero,.league-hero,.league-only-hero,.live-hero,.manual-hero,.queue-hero,.reg-hero,.score-hero,.tt-public-hero{
  background:radial-gradient(circle at 90% 0,rgba(213,31,42,.30),transparent 30%),linear-gradient(135deg,#061a45,#0a2d67 72%,#7f1520)!important;
  border-bottom:4px solid #d51f2a!important;
}

/* Live Draw visual shuffle. The official result remains server-committed; this is the public/admin countdown animation. */
.tt-live-shuffle{position:relative;overflow:hidden;border:2px solid var(--tt-red);border-radius:20px;background:radial-gradient(circle at 88% 0,rgba(213,31,42,.22),transparent 34%),linear-gradient(135deg,#061a45,#0a2d67 74%,#7f1520);color:#fff;padding:18px;box-shadow:0 14px 34px rgba(6,26,69,.18)}
.tt-live-shuffle .tt-shuffle-heading{font-size:.74rem;font-weight:950;text-transform:uppercase;letter-spacing:.11em;color:#dce8f8}
.tt-live-shuffle .tt-shuffle-countdown{font-size:3.15rem;line-height:1;font-weight:950;letter-spacing:-.05em;margin:6px 0 12px;color:#fff}
.tt-live-shuffle .tt-shuffle-cards{display:flex;justify-content:center;align-items:stretch;flex-wrap:wrap;gap:9px;min-height:58px}
.tt-live-shuffle .tt-shuffle-card{min-width:150px;max-width:260px;flex:1 1 170px;border:1px solid rgba(255,255,255,.35);border-bottom:3px solid #d51f2a;border-radius:14px;background:rgba(255,255,255,.96);color:#061a45;padding:9px 12px;box-shadow:0 9px 20px rgba(0,0,0,.18);animation:ttShuffleMove .38s cubic-bezier(.2,.78,.3,1.18) both;animation-delay:calc(var(--shuffle-index,0) * 28ms)}
.tt-live-shuffle .tt-shuffle-card strong,.tt-live-shuffle .tt-shuffle-card small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.tt-live-shuffle .tt-shuffle-card strong{font-size:1rem;font-weight:950}.tt-live-shuffle .tt-shuffle-card small{font-size:.72rem;color:#64748b;margin-top:2px}
.tt-live-shuffle .tt-shuffle-status{font-size:.78rem;color:#d9e5f7;margin-top:10px;font-weight:700}.tt-live-shuffle.is-revealing .tt-shuffle-cards{filter:brightness(1.05)}
.tt-live-shuffle.is-revealing .tt-shuffle-card{animation:ttShuffleReveal .5s ease both}
@keyframes ttShuffleMove{0%{opacity:.35;transform:translate3d(calc((var(--shuffle-index,0) - 2) * 8px),10px,0) scale(.93)}55%{opacity:1;transform:translate3d(0,-3px,0) scale(1.025)}100%{opacity:1;transform:translate3d(0,0,0) scale(1)}}
@keyframes ttShuffleReveal{0%{transform:scale(.97);opacity:.7}100%{transform:scale(1);opacity:1}}
@media(max-width:767px){.tt-live-shuffle{padding:15px}.tt-live-shuffle .tt-shuffle-countdown{font-size:2.55rem}.tt-live-shuffle .tt-shuffle-card{min-width:0;flex:1 1 135px;padding:8px 9px}.tt-live-shuffle .tt-shuffle-card strong{font-size:.9rem}.tt-live-shuffle .tt-shuffle-card small{font-size:.66rem}}
.tt-live-shuffle.tt-shuffle-compact{margin-top:12px;padding:12px;border-radius:15px}.tt-live-shuffle.tt-shuffle-compact .tt-shuffle-countdown{font-size:2rem;margin:4px 0 8px}.tt-live-shuffle.tt-shuffle-compact .tt-shuffle-card{min-width:110px;flex-basis:125px;padding:6px 8px}.tt-live-shuffle.tt-shuffle-compact .tt-shuffle-card strong{font-size:.82rem}.tt-live-shuffle.tt-shuffle-compact .tt-shuffle-card small{display:none}.tt-live-shuffle.tt-shuffle-compact .tt-shuffle-status{font-size:.7rem;margin-top:7px}
