/* WAKAMARIA.COM — PROFESSIONAL ANALYTICS PLATFORM
   Mobile-first application shell + desktop control room
   ---------------------------------------------------- */
:root {
  --bg: #040911;
  --bg-2: #07111d;
  --bg-3: #0a1725;
  --surface: #081421;
  --surface-2: #0b1a2a;
  --surface-3: #102237;
  --line: #1a3147;
  --line-soft: rgba(103, 140, 176, .16);
  --text: #f4f7fb;
  --muted: #8291a5;
  --muted-2: #aab5c3;
  --red: #f01422;
  --red-2: #ff3942;
  --red-soft: rgba(240, 20, 34, .12);
  --green: #22d36b;
  --green-soft: rgba(34, 211, 107, .12);
  --blue: #2da8ff;
  --gold: #f2ba3a;
  --danger: #ff5260;
  --shadow: 0 22px 70px rgba(0, 0, 0, .42);
  --shadow-soft: 0 12px 38px rgba(0, 0, 0, .24);
  --radius: 14px;
  --radius-sm: 9px;
  --font: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --display: "Barlow Condensed", Impact, sans-serif;
  --mono: "JetBrains Mono", ui-monospace, SFMono-Regular, monospace;
  --nav-h: 70px;
}

.team-logo-badge { overflow: hidden; background: radial-gradient(circle at 35% 25%, #183650, #071522 68%) !important; }
.team-logo-badge img { width: 78%; height: 78%; object-fit: contain; display: block; }
.team-logo-badge span { line-height: 1; }
.team-logo-badge img[hidden], .team-logo-badge span[hidden] { display: none; }
.win-pill { position: relative; width: 30px; height: 30px; padding: 0 !important; display: grid; place-items: center; border: 1px solid rgba(213,255,93,.65); border-radius: 50% !important; background: radial-gradient(circle at 35% 25%, #f7ff82, #5ee35d 48%, #15913d 100%) !important; box-shadow: 0 0 18px rgba(34,211,107,.22), inset 0 -7px 11px rgba(0,44,15,.34); color: transparent !important; font-size: 0 !important; }
.win-pill span { position: relative; width: 17px; height: 13px; display: block; border-radius: 2px 2px 5px 5px; background: #062111; box-shadow: 0 2px 0 rgba(255,255,255,.28) inset; }
.win-pill span::before { content: ""; position: absolute; left: -1px; top: -8px; width: 19px; height: 12px; background: #062111; clip-path: polygon(0 100%, 0 38%, 24% 72%, 50% 0, 76% 72%, 100% 38%, 100% 100%); }
.win-pill span::after { content: ""; position: absolute; left: 4px; bottom: 3px; width: 9px; height: 5px; border-radius: 5px 5px 0 0; background: var(--green); }
.bottom-showcase { align-items: stretch; }
.member-live-panel { min-height: 100% !important; height: 100%; padding: 0 !important; overflow: hidden; border-color: #28445c !important; background: #071421 !important; align-self: stretch; }
.member-live-frame { width: 100%; height: 100%; display: block; border: 0; border-radius: 8px; background: #071421; }

* { box-sizing: border-box; }
html { scroll-behavior: smooth; background: var(--bg); }
body {
  margin: 0;
  min-height: 100vh;
  overflow-x: hidden;
  background:
    radial-gradient(circle at 16% 0%, rgba(21, 73, 115, .18), transparent 30%),
    radial-gradient(circle at 90% 12%, rgba(240, 20, 34, .08), transparent 25%),
    var(--bg);
  color: var(--text);
  font-family: var(--font);
  font-size: 14px;
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
}
body.member-app, body.admin-app { padding-bottom: 0; }
body::selection { background: var(--red); color: white; }
a { color: inherit; text-decoration: none; }
button, input, select, textarea { font: inherit; }
button { color: inherit; }
img { max-width: 100%; display: block; }
main { min-height: calc(100vh - var(--nav-h)); padding-top: 26px; }
.public-shell main { padding-top: 0; }
.page-noise { position: fixed; inset: 0; pointer-events: none; z-index: -1; opacity: .025; background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"); }

/* Typography */
h1, h2, h3, h4, p { margin-top: 0; }
h1, h2, h3 { font-family: var(--font); font-weight: 950; letter-spacing: 0; line-height: 1.06; text-transform: none; }
h1 { font-size: clamp(2.35rem, 4.7vw, 4.9rem); margin-bottom: 16px; }
h2 { font-size: clamp(1.65rem, 2.55vw, 2.55rem); margin-bottom: 12px; }
h3 { font-size: 1.28rem; margin-bottom: 8px; }
p { color: var(--muted-2); }
small { color: var(--muted); }
code, .font-mono { font-family: var(--mono); }
.text-muted { color: var(--muted) !important; }
.text-success { color: var(--green) !important; }
.text-center { text-align: center; }
.text-sm { font-size: 12px; }
.text-xs { font-size: 10px; }
.inline-block { display: inline-block; }
.mb-0 { margin-bottom: 0 !important; }.mb-sm { margin-bottom: 8px !important; }.mb-md { margin-bottom: 16px !important; }.mb-lg { margin-bottom: 24px !important; }.mb-xl { margin-bottom: 38px !important; }
.mt-sm { margin-top: 8px !important; }.mt-md { margin-top: 16px !important; }.mt-lg { margin-top: 24px !important; }.mt-xl { margin-top: 38px !important; }
.flex { display: flex; }.grid { display: grid; }.items-center { align-items: center; }.justify-between { justify-content: space-between; }.justify-center { justify-content: center; }.gap-sm { gap: 8px; }
.grid-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }.grid-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }.grid-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }

.container { width: min(1380px, calc(100% - 40px)); margin: 0 auto; }
.container-md { width: min(980px, calc(100% - 40px)); margin: 0 auto; }
.container-sm { width: min(620px, calc(100% - 40px)); margin: 0 auto; }
.section-kicker, .panel-kicker { display: block; color: var(--red-2); font-size: 10px; font-weight: 900; letter-spacing: 1.35px; text-transform: uppercase; margin-bottom: 8px; }
.back-link { display: inline-flex; margin-bottom: 13px; color: var(--muted); font-size: 10px; font-weight: 900; letter-spacing: .7px; }
.back-link:hover { color: white; }

/* Navbar */
.navbar { position: sticky; top: 0; z-index: 200; height: var(--nav-h); border-bottom: 1px solid rgba(89, 124, 158, .14); background: rgba(3, 9, 16, .9); backdrop-filter: blur(18px); transition: box-shadow .2s, background .2s; }
.navbar.scrolled { background: rgba(3, 8, 14, .97); box-shadow: 0 12px 35px rgba(0,0,0,.28); }
.navbar-inner { width: min(1450px, calc(100% - 40px)); height: 100%; margin: auto; display: flex; align-items: center; gap: 30px; }
.navbar-brand { display: inline-flex; align-items: center; gap: 10px; flex: 0 0 auto; }
.brand-mark { width: 42px; height: 42px; display: grid; place-items: center; flex: 0 0 auto; overflow: visible; background: transparent; box-shadow: none; border-radius: 0; }
.brand-mark img { width: 100%; height: 100%; object-fit: contain; display: block; background: transparent; }
.brand-copy { display: flex; flex-direction: column; line-height: 1; }
.brand-name { color: #f7f8fb; font: 900 italic 27px/1 var(--display); letter-spacing: .8px; text-transform: lowercase; word-spacing: 2px; }
.brand-name span { display: inline-block; margin-left: 2px; color: var(--red-2); letter-spacing: .55px; }
.brand-copy small { margin-top: 4px; color: #c2cad4; font: 800 6.5px/1 var(--font); letter-spacing: 1.7px; }
.footer-brand-lockup { display: inline-flex; align-items: center; gap: 10px; }
.navbar-menu { display: flex; align-items: stretch; align-self: stretch; gap: 5px; margin-left: auto; }
.navbar-menu a { position: relative; display: flex; align-items: center; padding: 0 13px; color: #bdc7d2; font: 800 11px/1 var(--font); }
.navbar-menu a::after { content: ""; position: absolute; left: 13px; right: 13px; bottom: 0; height: 2px; background: transparent; }
.navbar-menu a:hover, .navbar-menu a.active { color: white; }
.navbar-menu a.active::after { background: var(--red); }
.navbar-right { display: flex; align-items: center; gap: 10px; margin-left: 8px; }
.navbar-toggle { display: none; width: 40px; height: 40px; align-items: center; justify-content: center; flex-direction: column; gap: 4px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface); cursor: pointer; }
.navbar-toggle span { width: 17px; height: 2px; border-radius: 2px; background: white; transition: transform .2s, opacity .2s; }
.navbar-toggle.active span:nth-child(1) { transform: translateY(6px) rotate(45deg); }.navbar-toggle.active span:nth-child(2) { opacity: 0; }.navbar-toggle.active span:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }
.user-avatar { width: 34px; height: 34px; display: grid; place-items: center; border: 1px solid #354d64; border-radius: 50%; background: linear-gradient(145deg, #12283c, #081421); font-weight: 900; }
.subscription-pill { height: 34px; display: inline-flex; align-items: center; gap: 5px; padding: 0 10px; border: 1px solid rgba(34,211,107,.3); border-radius: 20px; background: var(--green-soft); color: var(--green); }
.subscription-pill > span { width: 6px; height: 6px; border-radius: 50%; background: var(--green); box-shadow: 0 0 10px var(--green); }
.subscription-pill b { font-size: 13px; }.subscription-pill small { color: inherit; font-size: 8px; text-transform: uppercase; }
.subscription-pill.warning { border-color: rgba(242,186,58,.36); background: rgba(242,186,58,.1); color: var(--gold); }
.subscription-pill.expired { border-color: rgba(255,82,96,.35); background: rgba(255,82,96,.1); color: var(--danger); font-size: 10px; font-weight: 900; }
.admin-mode-pill { padding: 7px 10px; border: 1px solid rgba(240,20,34,.32); border-radius: 7px; background: var(--red-soft); color: var(--red-2); font-size: 9px; font-weight: 900; }

/* Buttons */
.btn { min-height: 38px; display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 9px 16px; border: 1px solid transparent; border-radius: 6px; background: none; color: white; font: 900 11px/1 var(--font); letter-spacing: .1px; text-transform: uppercase; cursor: pointer; transition: transform .16s, background .16s, border-color .16s, opacity .16s; }
.btn:hover { transform: translateY(-1px); }
.btn:disabled { opacity: .45; cursor: not-allowed; transform: none; }
.btn-primary { border-color: #ff2632; background: linear-gradient(135deg, #ff1f2b, #da0714); box-shadow: 0 10px 26px rgba(240,20,34,.18); }
.btn-primary:hover { background: linear-gradient(135deg, #ff3842, #ef101d); }
.btn-secondary { border-color: #274158; background: #0c1a28; }
.btn-secondary:hover { border-color: #46647f; background: #102337; }
.btn-outline { border-color: #31465b; background: transparent; }
.btn-ghost { border-color: transparent; color: #d2dae3; }
.btn-ghost:hover { background: rgba(255,255,255,.04); }
.btn-danger { border-color: rgba(255,82,96,.4); background: rgba(255,82,96,.12); color: #ff8c96; }
.btn-lg { min-height: 46px; padding: 12px 20px; font-size: 12px; }.btn-sm { min-height: 32px; padding: 7px 11px; font-size: 9px; }.btn-block { width: 100%; }

/* Messages / alerts */
.messages-wrap { position: fixed; top: 82px; right: 20px; z-index: 500; width: min(430px, calc(100% - 30px)); display: grid; gap: 8px; }
.alert { display: flex; align-items: flex-start; gap: 10px; padding: 13px 15px; border: 1px solid #28435a; border-radius: 9px; background: rgba(8,20,33,.97); box-shadow: var(--shadow-soft); color: #dbe3eb; }
.alert.is-dismissing { opacity: 0; transform: translateY(-8px); transition: opacity .35s ease, transform .35s ease; }
.alert-icon { flex: 0 0 22px; width: 22px; height: 22px; display: grid; place-items: center; border-radius: 50%; background: #183046; font-weight: 900; }
.alert-success { border-color: rgba(34,211,107,.35); }.alert-success .alert-icon { background: var(--green-soft); color: var(--green); }
.alert-warning { border-color: rgba(242,186,58,.4); }.alert-warning .alert-icon { background: rgba(242,186,58,.12); color: var(--gold); }
.alert-error, .alert-danger { border-color: rgba(255,82,96,.42); }.alert-error .alert-icon, .alert-danger .alert-icon { background: rgba(255,82,96,.12); color: var(--danger); }
.alert-info { border-color: rgba(45,168,255,.35); }.alert-info .alert-icon { background: rgba(45,168,255,.12); color: var(--blue); }

/* Generic panels/forms */
.card, .data-panel, .admin-data-panel, .create-slip-card { border: 1px solid var(--line); border-radius: var(--radius); background: linear-gradient(145deg, rgba(12,27,43,.96), rgba(6,16,27,.98)); box-shadow: var(--shadow-soft); }
.card { padding: 22px; }.card-hover:hover { border-color: #3e5f7c; transform: translateY(-2px); }
.card-header, .panel-heading-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.card-header { margin-bottom: 17px; padding-bottom: 13px; border-bottom: 1px solid var(--line-soft); }.card-title { margin: 0; }
.form-group { margin-bottom: 16px; }
.form-label { display: block; margin-bottom: 7px; color: #c6d0dc; font-size: 9px; font-weight: 900; letter-spacing: .65px; text-transform: uppercase; }
.form-control, .form-select, .form-textarea, .search-field { width: 100%; border: 1px solid #253d54; border-radius: 7px; background: #06121f; color: white; outline: none; transition: border-color .18s, box-shadow .18s; }
.form-control, .form-select { height: 44px; padding: 0 12px; }.form-textarea { min-height: 92px; padding: 12px; resize: vertical; }
.form-control:focus, .form-select:focus, .form-textarea:focus, .search-field:focus-within { border-color: #587795; box-shadow: 0 0 0 3px rgba(45,168,255,.08); }
.form-control::placeholder, .form-textarea::placeholder { color: #526579; }
.form-select { appearance: none; background-image: linear-gradient(45deg, transparent 50%, #73869a 50%), linear-gradient(135deg, #73869a 50%, transparent 50%); background-position: calc(100% - 17px) 18px, calc(100% - 12px) 18px; background-size: 5px 5px; background-repeat: no-repeat; padding-right: 30px; }
.input-group { display: flex; }.input-group .form-control { border-radius: 7px 0 0 7px; }.input-group-append { min-width: 45px; display: grid; place-items: center; border: 1px solid #253d54; border-left: 0; border-radius: 0 7px 7px 0; background: #0a1928; }
.search-field { height: 44px; display: flex; align-items: center; gap: 9px; padding: 0 12px; }
.search-field > span { color: var(--muted); font-size: 18px; }.search-field input { width: 100%; border: 0; background: transparent; color: white; outline: 0; }.search-field input::placeholder { color: #65768a; }
.switch-row { display: flex; align-items: center; gap: 12px; margin: 14px 0 18px; cursor: pointer; }
.switch-row input { position: absolute; opacity: 0; pointer-events: none; }
.switch-row > span { position: relative; flex: 0 0 42px; width: 42px; height: 23px; border: 1px solid #324a60; border-radius: 20px; background: #07131f; transition: background .2s, border-color .2s; }
.switch-row > span::after { content: ""; position: absolute; top: 3px; left: 3px; width: 15px; height: 15px; border-radius: 50%; background: #718196; transition: transform .2s, background .2s; }
.switch-row input:checked + span { border-color: rgba(34,211,107,.45); background: rgba(34,211,107,.15); }.switch-row input:checked + span::after { transform: translateX(19px); background: var(--green); }
.switch-row div { display: flex; flex-direction: column; }.switch-row strong { font-size: 11px; }.switch-row small { font-size: 9px; }.danger-switch input:checked + span { border-color: rgba(255,82,96,.5); background: rgba(255,82,96,.14); }.danger-switch input:checked + span::after { background: var(--danger); }
.progress { height: 5px; overflow: hidden; border-radius: 5px; background: #15283a; }.progress span { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, #13b956, #39e47e); }
.badge, .status-badge { display: inline-flex; align-items: center; justify-content: center; padding: 5px 8px; border-radius: 5px; font-size: 8px; font-weight: 900; letter-spacing: .45px; text-transform: uppercase; }
.badge-success, .status-badge.success { border: 1px solid rgba(34,211,107,.28); background: rgba(34,211,107,.12); color: var(--green); }.badge-warning, .status-badge.warning { border: 1px solid rgba(242,186,58,.3); background: rgba(242,186,58,.11); color: var(--gold); }.badge-danger, .status-badge.danger { border: 1px solid rgba(255,82,96,.34); background: rgba(255,82,96,.11); color: var(--danger); }.badge-muted, .status-badge.muted { border: 1px solid #2a4055; background: #0d1b29; color: #8fa0b2; }.badge-accent { border: 1px solid rgba(240,20,34,.34); background: var(--red-soft); color: var(--red-2); }
.empty-mini, .empty-state-wide { display: grid; place-items: center; text-align: center; color: var(--muted); }
.empty-mini { min-height: 100px; }.empty-mini p { margin: 0; }
.empty-state-wide { width: 100%; min-height: 260px; padding: 34px; border: 1px dashed #29445c; border-radius: var(--radius); background: rgba(7,18,30,.55); }
.empty-state-wide > span { font: 900 42px var(--display); color: #39536b; }.empty-state-wide h2, .empty-state-wide h3 { margin: 10px 0 8px; }.empty-state-wide p { max-width: 520px; }
.spinner { display: inline-block; width: 16px; height: 16px; border: 2px solid rgba(255,255,255,.3); border-top-color: white; border-radius: 50%; animation: spin .7s linear infinite; } @keyframes spin { to { transform: rotate(360deg); } }

/* Member dashboard */
.member-page { padding-bottom: 42px; }
.member-hero { position: relative; display: grid; grid-template-columns: 1.2fr .78fr .82fr; min-height: 510px; overflow: hidden; border: 1px solid #263c52; border-radius: 15px; background: linear-gradient(105deg, #061321 0 43%, #081625 70%, #07111d); box-shadow: var(--shadow); }
.member-hero::after { content: ""; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(90deg, transparent 42%, rgba(240,20,34,.04) 67%, transparent); }
.member-hero-copy { position: relative; z-index: 2; padding: 52px 30px 28px 40px; }
.eyebrow-row { display: flex; align-items: center; gap: 8px; color: #9eabb9; font-size: 9px; font-weight: 900; letter-spacing: .7px; }.hero-date { margin-left: auto; color: #68798d; }
.live-dot { display: inline-block; width: 7px; height: 7px; border-radius: 50%; background: var(--red); box-shadow: 0 0 12px var(--red); }
.member-hero h1 { max-width: 640px; font-size: clamp(4.2rem, 6vw, 6.4rem); margin: 25px 0 16px; }.member-hero h1 span { color: var(--red-2); }
.member-hero-copy > p { max-width: 620px; font-size: 14px; line-height: 1.65; }
.hero-cta { display: flex; flex-wrap: wrap; gap: 9px; margin: 25px 0; }
.hero-metrics { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin-top: 30px; border-top: 1px solid var(--line-soft); padding-top: 20px; }
.hero-metric { min-width: 0; padding: 0 14px; border-right: 1px solid var(--line-soft); }.hero-metric:first-child { padding-left: 0; }.hero-metric:last-child { border-right: 0; }.hero-metric strong { display: block; font: 900 25px/1 var(--display); }.hero-metric small { display: block; margin-top: 5px; font-size: 8px; text-transform: uppercase; }
.member-hero-visual { position: relative; overflow: hidden; border-left: 1px solid rgba(80,112,142,.14); background: radial-gradient(circle at 45% 42%, rgba(32,106,158,.28), transparent 45%); }
.member-hero-visual::before { content: ""; position: absolute; inset: 0; z-index: 1; background: linear-gradient(90deg, #071321 0, transparent 25%, transparent 75%, #071321 100%), linear-gradient(0deg, #071321 0, transparent 35%); }
.member-hero-visual img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 20%; filter: saturate(.86) contrast(1.08); }
.hero-confidence-card { position: absolute; z-index: 2; left: 20px; right: 20px; bottom: 20px; padding: 14px; border: 1px solid #2c4b64; border-radius: 9px; background: rgba(5,15,25,.9); backdrop-filter: blur(10px); }.hero-confidence-card span, .hero-confidence-card small { display: block; font-size: 8px; text-transform: uppercase; }.hero-confidence-card strong { display: block; margin: 3px 0 8px; font: 900 30px/1 var(--display); }
.member-verdict { position: relative; z-index: 2; padding: 23px; border-left: 1px solid var(--line); background: rgba(6,16,27,.82); }
.panel-heading-row h2, .panel-heading-row h3 { margin: 0; }.panel-heading-row > span, .panel-heading-row > a { color: var(--muted); font-size: 9px; font-weight: 900; }.status-live { color: var(--green) !important; }
.verdict-fixture { margin-top: 18px; padding: 16px; border: 1px solid #253f56; border-radius: 10px; background: linear-gradient(145deg, #0b1c2d, #071522); }.verdict-fixture > span { color: #9eacbb; font-size: 8px; font-weight: 800; }.verdict-fixture > small { float: right; }
.verdict-teams { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 10px; margin: 23px 0; text-align: center; }.verdict-teams > div { min-width: 0; }.verdict-teams b { width: 48px; height: 48px; display: grid; place-items: center; margin: 0 auto 7px; border: 1px solid #34536d; border-radius: 50%; background: #0d2234; font: 900 17px var(--display); }.verdict-teams span { display: block; overflow: hidden; color: white; font-size: 9px; font-weight: 800; text-overflow: ellipsis; white-space: nowrap; }.verdict-teams em { color: #718196; font-style: normal; font-size: 9px; }
.verdict-pick { display: grid; grid-template-columns: 1fr auto; padding: 12px; border-radius: 7px; background: #06111d; }.verdict-pick small { grid-column: 1 / -1; }.verdict-pick strong { font: 900 21px var(--display); text-transform: uppercase; }.verdict-pick > span { color: var(--green); font: 900 21px var(--display); }
.confidence-line { display: flex; justify-content: space-between; margin: 14px 0 7px; color: #afbbc7; font-size: 8px; font-weight: 800; text-transform: uppercase; }.member-verdict .btn { margin-top: 17px; }
.mobile-command-card, .mobile-stat-strip { display: none; }

.notice-stack { display: grid; gap: 9px; margin: 18px 0; }.notice-stack.compact { margin: 12px 0 18px; }
.notice-card { display: flex; align-items: flex-start; gap: 12px; padding: 13px 15px; border: 1px solid #264057; border-radius: 9px; background: #081522; }.notice-card.high { border-color: rgba(255,82,96,.38); background: rgba(255,82,96,.07); }.notice-card.medium { border-color: rgba(242,186,58,.3); }.notice-icon { flex: 0 0 25px; width: 25px; height: 25px; display: grid; place-items: center; border: 1px solid #3b5268; border-radius: 50%; font-weight: 900; }.notice-card div { min-width: 0; }.notice-card strong { font-size: 11px; }.notice-card p { margin: 2px 0 0; font-size: 11px; }

.dashboard-action-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin: 16px 0 35px; }
.action-tile { display: grid; grid-template-columns: 42px 1fr auto; align-items: center; gap: 13px; padding: 17px; border: 1px solid var(--line); border-radius: 10px; background: linear-gradient(145deg, #0a1929, #06131f); transition: transform .18s, border-color .18s; }.action-tile:hover { transform: translateY(-2px); border-color: #456783; }.action-tile.primary { border-color: rgba(240,20,34,.38); background: linear-gradient(145deg, rgba(240,20,34,.13), #081420); }.action-icon { width: 42px; height: 42px; display: grid; place-items: center; border: 1px solid #2e4b63; border-radius: 8px; background: #0b1c2b; color: var(--red-2); font-size: 20px; }.action-tile small { display: block; font-size: 7px; letter-spacing: .8px; }.action-tile strong { display: block; margin-top: 2px; font: 900 18px var(--display); }.action-tile p { margin: 1px 0 0; font-size: 9px; }.action-tile > b { color: #8091a4; }
.dashboard-section { margin: 35px 0; }.section-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 15px; margin-bottom: 15px; }.section-heading h2 { margin: 0; }.section-link { color: #adb8c4; font-size: 9px; font-weight: 900; }.section-link:hover { color: white; }.section-count { color: var(--muted); font-size: 9px; text-transform: uppercase; }
.member-picks-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.member-pick-card { overflow: hidden; border: 1px solid #20394f; border-radius: 10px; background: linear-gradient(145deg, #0b1b2b, #06131f); transition: transform .18s, border-color .18s; }.member-pick-card:hover { transform: translateY(-3px); border-color: #3b5d78; }
.member-pick-head { display: flex; justify-content: space-between; padding: 10px 12px; border-bottom: 1px solid var(--line-soft); color: #8d9bab; font-size: 8px; font-weight: 800; }
.member-fixture { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 8px; padding: 15px 12px 10px; text-align: center; }.member-fixture > div { min-width: 0; }.member-fixture b { width: 38px; height: 38px; display: grid; place-items: center; margin: auto; border: 1px solid #304d65; border-radius: 50%; background: #0c2032; font: 900 14px var(--display); }.member-fixture span { display: block; overflow: hidden; margin-top: 5px; font-size: 8px; font-weight: 800; text-overflow: ellipsis; white-space: nowrap; }.member-fixture em { color: #6f8092; font-size: 8px; font-style: normal; }
.member-prediction-row { display: grid; grid-template-columns: 1fr auto; align-items: end; gap: 8px; padding: 10px 13px; border-top: 1px solid var(--line-soft); background: rgba(2,10,17,.28); }.member-prediction-row small { display: block; font-size: 7px; }.member-prediction-row strong { display: block; font: 900 19px var(--display); text-transform: uppercase; }.odds-box { color: var(--green); font: 900 24px var(--display); }
.pick-quality-row { display: flex; align-items: center; gap: 8px; padding: 9px 13px 6px; color: #8797a9; font-size: 8px; }.confidence-chip { padding: 3px 6px; border-radius: 4px; font-weight: 900; }.confidence-chip.high { background: var(--green-soft); color: var(--green); }.confidence-chip.medium { background: rgba(242,186,58,.12); color: var(--gold); }.confidence-chip.low { background: rgba(255,82,96,.12); color: var(--danger); }.member-pick-card > .progress { margin: 0 13px 11px; }.pick-card-link { display: flex; justify-content: space-between; padding: 11px 13px; border-top: 1px solid var(--line-soft); color: #cad3dc; font-size: 8px; font-weight: 900; }.pick-card-link:hover { background: rgba(255,255,255,.025); }
.master-slip-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 12px; }.master-slip-card { position: relative; overflow: hidden; padding: 17px; border: 1px solid #223d53; border-radius: 10px; background: linear-gradient(145deg, #0b1b2c, #06131f); }.master-slip-card.featured { border-color: rgba(240,20,34,.5); box-shadow: inset 0 3px 0 var(--red); }.master-slip-top { display: grid; grid-template-columns: 45px 1fr auto; align-items: center; gap: 11px; }.slip-date-box { width: 45px; height: 48px; display: grid; place-items: center; align-content: center; border: 1px solid #304d65; border-radius: 7px; background: #0b2032; }.slip-date-box strong { font: 900 23px/1 var(--display); }.slip-date-box span { color: var(--red-2); font-size: 7px; font-weight: 900; }.master-slip-top small { font-size: 7px; }.master-slip-top h3 { overflow: hidden; margin: 2px 0 0; font-size: 20px; text-overflow: ellipsis; white-space: nowrap; }.master-slip-card > p { min-height: 40px; margin: 15px 0; font-size: 10px; }.master-slip-stats { display: flex; gap: 10px; margin-bottom: 14px; color: #77889b; font-size: 8px; }.master-slip-stats span { flex: 1; }.master-slip-stats b { color: #dbe1e7; }
.dashboard-lower-grid { display: grid; grid-template-columns: repeat(2,1fr); gap: 12px; margin-top: 30px; }.data-panel, .admin-data-panel { padding: 18px; }.activity-list { display: grid; margin-top: 13px; }.activity-row { min-width: 0; display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 10px; padding: 11px 0; border-bottom: 1px solid var(--line-soft); }.activity-row:last-child { border-bottom: 0; }.activity-row > div { min-width: 0; }.activity-row strong { display: block; overflow: hidden; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }.activity-row small { display: block; margin-top: 2px; font-size: 8px; }.activity-row > b { color: var(--green); font: 900 16px var(--display); }.win-pill { padding: 4px 6px; border-radius: 4px; background: var(--green); color: #03210f; font-size: 7px; font-weight: 900; }.code-icon, .payment-method { width: 30px; height: 30px; display: grid; place-items: center; border: 1px solid #2b485f; border-radius: 6px; background: #0b1d2d; color: var(--red-2); font-size: 12px; font-weight: 900; }.app-footer { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-top: 40px; padding: 22px 0 10px; border-top: 1px solid var(--line-soft); }.app-footer > span { font: 900 italic 23px var(--display); }.app-footer > span span { color: var(--red); }.app-footer p { margin: 0; font-size: 9px; }

/* Slip workspace / filters / match board */
.slip-workspace { padding-bottom: 55px; }.workspace-header { display: flex; align-items: flex-end; justify-content: space-between; gap: 25px; padding: 13px 0 20px; }.workspace-title-row { display: flex; align-items: center; gap: 12px; }.workspace-heading h1 { margin: 0; font-size: clamp(2.6rem, 5vw, 4.6rem); }.workspace-heading p { margin: 8px 0 0; font-size: 11px; }.workspace-selection-summary { display: flex; align-items: stretch; gap: 8px; }.workspace-selection-summary > div { min-width: 92px; padding: 10px 13px; border: 1px solid var(--line); border-radius: 7px; background: #081522; }.workspace-selection-summary small, .workspace-selection-summary strong { display: block; }.workspace-selection-summary small { font-size: 7px; }.workspace-selection-summary strong { margin-top: 2px; font: 900 22px var(--display); }
.slip-intro-card { display: flex; align-items: center; gap: 14px; margin-bottom: 12px; padding: 14px 17px; border: 1px solid rgba(45,168,255,.27); border-radius: 9px; background: rgba(45,168,255,.06); }.intro-icon { width: 34px; height: 34px; display: grid; place-items: center; border: 1px solid rgba(45,168,255,.4); border-radius: 7px; color: var(--blue); font: 900 12px var(--display); }.slip-intro-card small { display: block; font-size: 7px; }.slip-intro-card p { margin: 2px 0 0; font-size: 11px; }
.filter-preset-strip { display: flex; gap: 8px; overflow-x: auto; margin: 18px 0 10px; padding-bottom: 3px; scrollbar-width: none; }.filter-preset-strip::-webkit-scrollbar { display: none; }.preset-chip { flex: 0 0 auto; display: inline-flex; align-items: center; gap: 7px; padding: 9px 13px; border: 1px solid #294258; border-radius: 7px; background: #081522; color: #b5c0cb; font-size: 9px; font-weight: 900; text-transform: uppercase; }.preset-chip span { color: var(--green); }.preset-chip.active { border-color: rgba(240,20,34,.55); background: var(--red-soft); color: white; }.preset-chip.active span { color: var(--red-2); }.preset-chip.clear { margin-left: auto; }
.advanced-filter-panel { overflow: hidden; margin-bottom: 25px; border: 1px solid #243f56; border-radius: 10px; background: #071421; }.advanced-filter-panel > summary { display: flex; align-items: center; justify-content: space-between; padding: 13px 16px; cursor: pointer; list-style: none; }.advanced-filter-panel > summary::-webkit-details-marker { display: none; }.advanced-filter-panel > summary > div { display: flex; align-items: center; gap: 10px; }.filter-summary-icon { width: 31px; height: 31px; display: grid; place-items: center; border: 1px solid #2b4960; border-radius: 6px; color: var(--red-2); }.advanced-filter-panel summary strong, .advanced-filter-panel summary small { display: block; }.advanced-filter-panel summary strong { font-size: 10px; }.advanced-filter-panel summary small { font-size: 8px; }.summary-toggle { color: #8fa0b2; font-size: 8px; font-weight: 900; }.advanced-filter-panel[open] .summary-toggle { color: var(--green); }.advanced-filter-form { padding: 16px; border-top: 1px solid var(--line); background: rgba(3,10,17,.25); }.filter-search-row { display: grid; grid-template-columns: 1fr auto; gap: 8px; margin-bottom: 13px; }.filters-grid { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 11px; }.professional-filters .form-group { margin-bottom: 0; }.split-inputs > div { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 6px; }.split-inputs input { width: 100%; height: 44px; min-width: 0; padding: 0 9px; border: 1px solid #253d54; border-radius: 7px; background: #06121f; color: white; outline: 0; }.filter-form-actions { display: flex; justify-content: flex-end; gap: 8px; margin-top: 10px; }
.match-board-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 15px; margin-bottom: 13px; }.match-board-heading h2 { margin: 0; }.board-legend { display: flex; gap: 12px; color: #7f90a3; font-size: 8px; }.legend-dot { display: inline-block; width: 6px; height: 6px; margin-right: 4px; border-radius: 50%; }.legend-dot.high { background: var(--green); }.legend-dot.risk { background: var(--gold); }
.analytics-match-list { display: grid; gap: 10px; }.analytics-match-card { overflow: hidden; border: 1px solid #203a50; border-radius: 10px; background: linear-gradient(145deg, #0a1929, #06131f); transition: border-color .18s, box-shadow .18s, transform .18s; }.analytics-match-card:hover { border-color: #3c5f7a; }.analytics-match-card.selected { border-color: rgba(34,211,107,.65); box-shadow: inset 3px 0 0 var(--green), 0 10px 32px rgba(0,0,0,.18); }.analytics-match-card.conflict-prone { box-shadow: inset 3px 0 0 var(--gold); }.analytics-match-card.selected.conflict-prone { box-shadow: inset 3px 0 0 var(--green); }
.match-card-topline { display: flex; justify-content: space-between; gap: 15px; padding: 9px 13px; border-bottom: 1px solid var(--line-soft); background: rgba(4,12,20,.45); }.match-card-topline > div { display: flex; align-items: center; gap: 8px; min-width: 0; }.match-card-topline strong { overflow: hidden; color: #9ba9b8; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }.match-card-topline time { color: #aeb9c5; font-size: 8px; }.sport-label { color: var(--red-2); font-size: 7px; font-weight: 900; }.risk-tag { padding: 3px 6px; border-radius: 4px; font-size: 7px; font-weight: 900; text-transform: uppercase; }.risk-tag.low { background: var(--green-soft); color: var(--green); }.risk-tag.medium { background: rgba(242,186,58,.11); color: var(--gold); }.risk-tag.high { background: rgba(255,82,96,.11); color: var(--danger); }
.match-card-body { display: grid; grid-template-columns: 1.55fr .8fr .62fr; align-items: stretch; }.fixture-block { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 10px; padding: 15px; }.fixture-team { min-width: 0; display: grid; grid-template-columns: 39px 1fr; align-items: center; gap: 9px; }.fixture-team.away { grid-template-columns: 1fr 39px; text-align: right; }.fixture-team.away .team-monogram { grid-column: 2; grid-row: 1 / 3; }.fixture-team.away strong, .fixture-team.away small { grid-column: 1; }.team-monogram { grid-row: 1 / 3; width: 39px; height: 39px; display: grid; place-items: center; border: 1px solid #315069; border-radius: 50%; background: #0c2032; font: 900 14px var(--display); }.fixture-team strong { overflow: hidden; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }.fixture-team small { font-size: 7px; }.fixture-vs { text-align: center; }.fixture-vs span { display: block; color: #67798b; font-size: 8px; font-weight: 900; }.fixture-vs small { display: block; width: 52px; margin-top: 3px; font-size: 6px; }
.prediction-block { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 10px; padding: 15px; border-left: 1px solid var(--line-soft); border-right: 1px solid var(--line-soft); background: rgba(4,12,20,.2); }.prediction-block small, .prediction-block span { display: block; font-size: 7px; }.prediction-block strong { display: block; margin: 2px 0; font: 900 20px var(--display); text-transform: uppercase; }.prediction-odds { text-align: right; }.prediction-odds strong { color: var(--green); font-size: 27px; }
.quality-block { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 13px; padding: 15px; }.confidence-meter > div:first-child { display: flex; justify-content: space-between; gap: 8px; margin-bottom: 7px; font-size: 8px; }.confidence-meter strong { color: var(--green); }.value-meter { text-align: center; }.value-meter small { display: block; font-size: 6px; }.value-meter strong { font: 900 23px var(--display); }
.match-card-footer { min-height: 44px; display: flex; align-items: stretch; justify-content: space-between; border-top: 1px solid var(--line-soft); }.analysis-disclosure { flex: 1; }.analysis-disclosure summary { display: flex; align-items: center; justify-content: space-between; min-height: 43px; padding: 0 14px; list-style: none; color: #8d9cad; font-size: 8px; font-weight: 900; cursor: pointer; }.analysis-disclosure summary::-webkit-details-marker { display: none; }.analysis-disclosure p { margin: 0; padding: 13px 14px; border-top: 1px solid var(--line-soft); font-size: 10px; }.analysis-unavailable { flex: 1; display: flex; align-items: center; padding: 0 14px; color: #596b7e; font-size: 8px; }.select-match-button { min-width: 154px; display: flex; align-items: center; justify-content: center; gap: 7px; border: 0; border-left: 1px solid #2a4359; background: #0c1d2c; color: white; font-size: 8px; font-weight: 900; cursor: pointer; }.select-match-button:hover { background: #12293e; }.select-match-button.selected { background: var(--green); color: #03220e; }.select-icon { font-size: 15px; }
.analysis-file-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 10px; }.analysis-file-card { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 11px; padding: 13px; border: 1px solid var(--line); border-radius: 8px; background: #081522; }.analysis-file-card > div { min-width: 0; }.analysis-file-card strong, .analysis-file-card p, .analysis-file-card small { display: block; }.analysis-file-card strong { overflow: hidden; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }.analysis-file-card p { margin: 2px 0; font-size: 8px; }.analysis-file-card a { color: var(--red-2); font-size: 8px; font-weight: 900; }.file-type-icon { min-width: 35px; height: 32px; display: grid; place-items: center; border: 1px solid #2a465e; border-radius: 6px; background: #0b1d2d; color: var(--blue); font-size: 8px; font-weight: 900; }

/* Builder */
.builder-workspace { padding-bottom: 45px; }.builder-header { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; padding: 10px 0 22px; }.builder-header h1 { margin: 0; }.builder-header p { margin: 8px 0 0; }.builder-header-stats { display: grid; grid-template-columns: repeat(3, 1fr); min-width: 370px; border: 1px solid var(--line); border-radius: 9px; background: #081522; }.builder-header-stats > div { padding: 12px 15px; border-right: 1px solid var(--line); }.builder-header-stats > div:last-child { border-right: 0; }.builder-header-stats small, .builder-header-stats strong { display: block; }.builder-header-stats small { font-size: 7px; }.builder-header-stats strong { font: 900 23px var(--display); }
.builder-layout { display: grid; grid-template-columns: minmax(0,1fr) 410px; align-items: start; gap: 14px; }.builder-selections-panel, .generate-code-panel, .code-selections-panel { padding: 18px; border: 1px solid var(--line); border-radius: var(--radius); background: linear-gradient(145deg, #0a1929, #06131f); }.generate-code-panel { position: sticky; top: 88px; }.builder-match-list { display: grid; gap: 8px; margin-top: 14px; }.builder-match-card { position: relative; display: grid; grid-template-columns: 36px 1fr auto auto; align-items: center; gap: 11px; min-width: 0; padding: 12px; border: 1px solid #20394f; border-radius: 8px; background: #071522; }.builder-match-index { width: 32px; height: 32px; display: grid; place-items: center; border: 1px solid #2d4b63; border-radius: 6px; color: var(--red-2); font: 900 13px var(--mono); }.builder-match-main { min-width: 0; }.builder-match-main small, .builder-match-main strong, .builder-match-main span { display: block; }.builder-match-main small { font-size: 7px; }.builder-match-main strong { overflow: hidden; margin: 2px 0; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }.builder-match-main em { color: #728397; font-style: normal; }.builder-match-main span { color: #cbd4dd; font-size: 9px; }.builder-match-quality { min-width: 55px; text-align: right; }.builder-match-quality small { display: block; color: var(--green); font-size: 8px; }.builder-match-quality strong { font: 900 23px var(--display); }.remove-selection { width: 31px; height: 31px; display: grid; place-items: center; border: 1px solid #3c4b5b; border-radius: 6px; background: transparent; color: #8fa0b1; font-size: 19px; cursor: pointer; }.remove-selection:hover { border-color: rgba(255,82,96,.5); color: var(--danger); background: rgba(255,82,96,.08); }
.company-options { display: grid; gap: 7px; }.company-option { position: relative; display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 10px; padding: 11px; border: 1px solid #243e55; border-radius: 8px; background: #071521; cursor: pointer; }.company-option input { position: absolute; opacity: 0; }.company-option:has(input:checked) { border-color: rgba(34,211,107,.55); background: rgba(34,211,107,.055); }.company-logo { width: 35px; height: 35px; display: grid; place-items: center; border: 1px solid #335169; border-radius: 7px; font: 900 13px var(--display); }.company-option strong, .company-option small { display: block; }.company-option strong { font-size: 10px; }.company-option small { font-size: 7px; }.company-option i { display: none; color: var(--green); font-style: normal; }.company-option:has(input:checked) i { display: block; }
.responsible-note { display: block; margin-top: 8px; text-align: center; font-size: 7px; }.builder-empty { margin-top: 20px; }

/* Bet code pages */
.simple-member-page, .code-detail-page { padding-bottom: 45px; }.compact-header { align-items: center; padding-top: 15px; }.code-history-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 11px; }.code-history-card { display: block; padding: 17px; border: 1px solid var(--line); border-radius: 10px; background: linear-gradient(145deg, #0a1929, #06131f); }.code-history-card:hover { border-color: #3f617d; }.code-history-top { display: flex; align-items: center; justify-content: space-between; }.code-history-card > small { display: block; margin: 13px 0 4px; font-size: 8px; }.code-history-card > strong { display: block; overflow: hidden; font: 900 20px var(--mono); color: var(--red-2); text-overflow: ellipsis; }.code-history-card > div:last-of-type { display: grid; grid-template-columns: repeat(3,1fr); gap: 6px; margin: 15px 0; }.code-history-card > div:last-of-type span { padding: 8px; border: 1px solid var(--line-soft); border-radius: 6px; background: rgba(2,9,16,.25); }.code-history-card small, .code-history-card b { display: block; }.code-history-card b { font: 900 16px var(--display); }.code-history-card em { color: #b7c2cd; font-size: 8px; font-style: normal; font-weight: 900; }
.code-detail-layout { display: grid; grid-template-columns: 410px minmax(0,1fr); align-items: start; gap: 14px; }.generated-code-card { position: sticky; top: 88px; padding: 20px; border: 1px solid rgba(240,20,34,.48); border-radius: var(--radius); background: radial-gradient(circle at 50% 0%, rgba(240,20,34,.12), transparent 38%), linear-gradient(145deg, #0a1929, #06131f); box-shadow: var(--shadow-soft); }.generated-code-head { display: flex; justify-content: space-between; gap: 10px; }.generated-code-head h1 { margin: 0; font-size: 36px; }.generated-code-value { margin: 22px 0 10px; padding: 20px 10px; border: 1px dashed rgba(255,255,255,.24); border-radius: 8px; background: #050e18; color: white; font: 900 clamp(22px,4vw,34px) var(--mono); text-align: center; word-break: break-all; }.generated-code-stats { display: grid; grid-template-columns: repeat(2,1fr); gap: 7px; margin: 14px 0; }.generated-code-stats div { padding: 10px; border: 1px solid var(--line-soft); border-radius: 6px; background: rgba(2,9,16,.25); }.generated-code-stats small, .generated-code-stats strong { display: block; }.generated-code-stats small { font-size: 6px; }.generated-code-stats strong { font: 900 18px var(--display); }.code-meta-list { margin: 13px 0; border-top: 1px solid var(--line-soft); }.code-meta-list > div { display: flex; justify-content: space-between; gap: 10px; padding: 8px 0; border-bottom: 1px solid var(--line-soft); font-size: 8px; }.code-meta-list span { color: var(--muted); }.code-meta-list b { max-width: 58%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }.instruction-card { margin-top: 14px; padding: 15px; border: 1px solid var(--line); border-radius: 8px; background: #071522; }.instruction-card ol { padding-left: 19px; color: #c2ccd6; font-size: 10px; line-height: 1.8; }.instruction-card p { margin: 8px 0 0; font-size: 9px; }

/* Admin */
.admin-page { padding-bottom: 50px; }.admin-page-header { display: flex; align-items: flex-end; justify-content: space-between; gap: 25px; padding: 12px 0 23px; }.admin-page-header h1 { margin: 0; }.admin-page-header p { max-width: 700px; margin: 9px 0 0; }.admin-header-actions { display: flex; gap: 8px; }.admin-header-actions form { margin: 0; }
.admin-kpi-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 10px; margin-bottom: 13px; }.admin-kpi-grid article { display: grid; grid-template-columns: auto 1fr; align-items: center; gap: 12px; padding: 16px; border: 1px solid var(--line); border-radius: 10px; background: linear-gradient(145deg,#0a1929,#06131f); }.kpi-icon { width: 42px; height: 42px; display: grid; place-items: center; border: 1px solid #35526a; border-radius: 8px; background: #0b1d2d; font-weight: 900; }.kpi-icon.red { color: var(--red-2); }.kpi-icon.green { color: var(--green); }.kpi-icon.blue { color: var(--blue); }.kpi-icon.gold { color: var(--gold); font-size: 8px; }.admin-kpi-grid small, .admin-kpi-grid strong, .admin-kpi-grid p { display: block; }.admin-kpi-grid small { font-size: 7px; }.admin-kpi-grid strong { margin-top: 1px; font: 900 29px/1 var(--display); }.admin-kpi-grid p { margin: 4px 0 0; font-size: 8px; }
.admin-workflow-card { padding: 18px; border: 1px solid var(--line); border-radius: 11px; background: linear-gradient(145deg,#0a1929,#06131f); }.workflow-steps { display: grid; grid-template-columns: repeat(4,1fr); gap: 8px; margin-top: 15px; }.workflow-steps a { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 10px; padding: 12px; border: 1px solid #213b52; border-radius: 8px; background: #071522; }.workflow-steps a:hover { border-color: #456783; }.workflow-steps a > span { width: 28px; height: 28px; display: grid; place-items: center; border: 1px solid #34536d; border-radius: 6px; color: var(--red-2); font: 900 10px var(--mono); }.workflow-steps strong, .workflow-steps p { display: block; }.workflow-steps strong { font-size: 9px; }.workflow-steps p { margin: 2px 0 0; font-size: 7px; }.workflow-steps b { color: #6f8295; }
.admin-main-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 11px; margin-top: 12px; }.admin-data-panel.wide { grid-column: 1 / -1; }.admin-card-list { display: grid; gap: 7px; margin-top: 13px; }.admin-list-card { display: grid; grid-template-columns: auto 1fr auto auto; align-items: center; gap: 11px; padding: 11px; border: 1px solid var(--line-soft); border-radius: 8px; background: #071522; }.admin-list-icon { width: 36px; height: 36px; display: grid; place-items: center; border: 1px solid #315069; border-radius: 6px; font: 900 16px var(--display); }.admin-list-main { min-width: 0; }.admin-list-main small, .admin-list-main strong, .admin-list-main p { display: block; }.admin-list-main strong { overflow: hidden; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }.admin-list-main p { margin: 1px 0 0; font-size: 8px; }.activity-amount { text-align: right; }.activity-amount b, .activity-amount small { display: block; }.activity-amount b { font: 900 16px var(--display); }.status-text { text-transform: uppercase; }.status-text.completed, .status-text.generated { color: var(--green); }.status-text.pending { color: var(--gold); }.status-text.failed { color: var(--danger); }
.file-processing-list { display: grid; margin-top: 13px; }.file-processing-list article { display: grid; grid-template-columns: auto 1fr auto auto; align-items: center; gap: 10px; padding: 10px 0; border-bottom: 1px solid var(--line-soft); }.file-processing-list article:last-child { border-bottom: 0; }.file-processing-list div { min-width: 0; }.file-processing-list strong, .file-processing-list small { display: block; }.file-processing-list strong { overflow: hidden; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }.processing-status { padding: 4px 6px; border: 1px solid #31485e; border-radius: 4px; color: #91a1b2; font-size: 7px; font-weight: 900; text-transform: uppercase; }.processing-status.processed { border-color: rgba(34,211,107,.3); color: var(--green); }.processing-status.processing { border-color: rgba(45,168,255,.3); color: var(--blue); }.processing-status.failed { border-color: rgba(255,82,96,.3); color: var(--danger); }.file-processing-list b { font-size: 8px; }
.admin-filter-bar { display: grid; grid-template-columns: 1fr 230px auto; gap: 8px; margin-bottom: 12px; padding: 10px; border: 1px solid var(--line); border-radius: 9px; background: #071522; }.admin-filter-bar .form-select { margin: 0; }
.responsive-admin-table { margin-top: 13px; }.admin-table-head, .admin-table-row { display: grid; grid-template-columns: 2fr .9fr .7fr .9fr .7fr .8fr; align-items: center; gap: 10px; }.admin-table-head { padding: 0 11px 8px; color: #6f8194; font-size: 7px; font-weight: 900; text-transform: uppercase; }.admin-table-row { min-height: 64px; padding: 10px 11px; border-top: 1px solid var(--line-soft); }.admin-table-row > div { min-width: 0; }.admin-table-row strong, .admin-table-row small { display: block; }.admin-table-row strong { overflow: hidden; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }.admin-table-row small { margin-top: 2px; font-size: 7px; }.users-table .admin-table-head, .users-table .admin-table-row { grid-template-columns: 1.8fr 1fr 1fr .65fr .85fr; }.users-table .admin-table-row > div:first-child { display: grid; grid-template-columns: auto 1fr; align-items: center; gap: 9px; }.user-list-avatar { width: 32px; height: 32px; display: grid; place-items: center; border: 1px solid #36536b; border-radius: 50%; background: #0b1e2f; font-weight: 900; }
.compact-admin-kpis { grid-template-columns: repeat(2, minmax(0,320px)); }

/* Admin editor */
.sticky-admin-header { position: relative; }.editor-status-strip { display: grid; grid-template-columns: repeat(4,1fr); gap: 8px; margin-bottom: 12px; }.editor-status-strip > div { display: grid; grid-template-columns: auto 1fr; gap: 8px; padding: 11px; border: 1px solid var(--line); border-radius: 8px; background: #071522; }.editor-status-strip span { grid-row: 1 / 3; width: 28px; height: 28px; display: grid; place-items: center; border: 1px solid #34536b; border-radius: 6px; color: var(--red-2); font: 900 9px var(--mono); }.editor-status-strip small, .editor-status-strip strong { display: block; }.editor-status-strip small { font-size: 7px; }.editor-status-strip strong { font-size: 9px; }
.editor-grid { display: grid; grid-template-columns: minmax(0,1fr) 390px; align-items: start; gap: 11px; }.editor-main-column, .editor-side-column { display: grid; gap: 10px; }.editor-side-column { position: sticky; top: 82px; }.editor-section { overflow: hidden; border: 1px solid var(--line); border-radius: 10px; background: linear-gradient(145deg,#0a1929,#06131f); }.editor-section > summary, .static-section-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 13px 15px; list-style: none; cursor: pointer; }.editor-section > summary::-webkit-details-marker { display: none; }.editor-section > summary > div, .static-section-head > div { display: flex; align-items: center; gap: 10px; }.editor-section > summary > div > span, .static-section-head > div > span { width: 30px; height: 30px; display: grid; place-items: center; border: 1px solid #34536b; border-radius: 6px; color: var(--red-2); font: 900 10px var(--mono); }.editor-section summary strong, .editor-section summary small, .static-section-head strong, .static-section-head small { display: block; }.editor-section summary strong, .static-section-head strong { font-size: 10px; }.editor-section summary small, .static-section-head small { font-size: 7px; }.editor-section summary > b, .static-section-head > b { color: #8798aa; font-size: 8px; }.editor-section[open] summary > b { color: var(--green); }.editor-section-body { padding: 15px; border-top: 1px solid var(--line-soft); background: rgba(3,10,17,.18); }.bulk-format-note { display: flex; align-items: center; gap: 9px; margin-bottom: 11px; padding: 9px; border: 1px solid rgba(45,168,255,.25); border-radius: 6px; background: rgba(45,168,255,.05); }.bulk-format-note strong { color: var(--blue); font-size: 7px; }.bulk-format-note code { overflow-x: auto; color: #b9c5d0; font-size: 8px; white-space: nowrap; }.code-textarea { font: 600 10px/1.7 var(--mono); }.static-section { overflow: hidden; border: 1px solid var(--line); border-radius: 10px; background: linear-gradient(145deg,#0a1929,#06131f); }
.admin-match-list { display: grid; gap: 6px; padding: 0 13px 13px; }.admin-match-card { display: grid; grid-template-columns: auto 1fr auto auto; align-items: center; gap: 10px; padding: 10px; border: 1px solid var(--line-soft); border-radius: 7px; background: #071522; }.admin-match-order { color: var(--red-2); font: 900 11px var(--mono); }.admin-match-main { min-width: 0; }.admin-match-main small, .admin-match-main strong, .admin-match-main span { display: block; }.admin-match-main strong { overflow: hidden; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }.admin-match-main span { color: #c2ccd6; font-size: 8px; }.admin-match-metrics { display: flex; gap: 7px; }.admin-match-metrics > span { min-width: 47px; padding: 6px; border: 1px solid var(--line-soft); border-radius: 5px; text-align: center; }.admin-match-metrics small, .admin-match-metrics b { display: block; }.admin-match-metrics small { font-size: 5px; }.admin-match-metrics b { font: 900 13px var(--display); }.admin-match-card form { margin: 0; }
.file-drop { min-height: 115px; display: grid; place-items: center; align-content: center; padding: 15px; border: 1px dashed #3a5870; border-radius: 8px; background: rgba(4,12,20,.35); text-align: center; cursor: pointer; }.file-drop input { position: absolute; opacity: 0; }.file-drop > span { color: var(--red-2); font-size: 24px; }.file-drop strong, .file-drop small { display: block; }.file-drop strong { font-size: 9px; }.file-drop small { margin-top: 3px; font-size: 7px; }.uploaded-file-list { display: grid; padding: 0 13px 13px; }.uploaded-file-list article { display: grid; grid-template-columns: auto 1fr auto auto; align-items: center; gap: 8px; padding: 9px 0; border-top: 1px solid var(--line-soft); }.uploaded-file-list div { min-width: 0; }.uploaded-file-list strong, .uploaded-file-list small { display: block; }.uploaded-file-list strong { overflow: hidden; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }.uploaded-file-list small { font-size: 6px; }.uploaded-file-list a { color: var(--red-2); font-size: 7px; font-weight: 900; }
.admin-note-list { display: grid; padding: 0 13px 13px; }.admin-note-list article { display: flex; align-items: flex-start; gap: 9px; padding: 9px 0; border-top: 1px solid var(--line-soft); }.admin-note-list article > span { flex: 0 0 22px; width: 22px; height: 22px; display: grid; place-items: center; border: 1px solid #3b5268; border-radius: 50%; }.admin-note-list article.high > span { color: var(--danger); border-color: rgba(255,82,96,.4); }.admin-note-list strong { display: block; font-size: 9px; }.admin-note-list p { margin: 2px 0 0; font-size: 8px; }
.admin-create-page { padding-top: 25px; padding-bottom: 45px; }.create-slip-card { padding: 26px; }.create-slip-card h1 { margin-bottom: 10px; }.create-slip-card > p { margin-bottom: 23px; }

/* Auth / subscriptions / old generic pages */
.auth-stage { min-height: calc(100vh - var(--nav-h)); display: grid; place-items: center; padding: 35px 0; background: radial-gradient(circle at 50% 10%, rgba(240,20,34,.08), transparent 30%); }.auth-wrap { width: min(470px, calc(100% - 28px)); }.auth-card { padding: 30px; }.auth-brand { width: 52px; height: 45px; display: grid; place-items: center; margin: 0 auto 15px; clip-path: polygon(12% 0,100% 0,86% 100%,0 100%); background: var(--red); font: 900 italic 28px var(--display); }.auth-card h1 { font-size: 42px; }.auth-trust { display: flex; justify-content: center; gap: 14px; margin-top: 13px; color: #718398; font-size: 7px; font-weight: 900; }.divider { height: 1px; margin: 20px 0; background: var(--line); }.otp-input-wrapper { display: flex; justify-content: center; gap: 9px; margin: 22px 0; }.otp-input { width: 56px; height: 62px; border: 1px solid #31506a; border-radius: 8px; background: #06131f; color: white; font: 800 27px var(--mono); text-align: center; outline: 0; }.otp-input:focus { border-color: var(--red); }
.membership-page { padding-bottom: 45px; }.membership-hero { max-width: 720px; margin: 35px auto 30px; }.membership-hero h1 { margin: 9px 0; }.membership-trust { margin-top: 18px; }.pricing-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 12px; }.pricing-card { position: relative; padding: 22px; border: 1px solid var(--line); border-radius: 11px; background: linear-gradient(145deg,#0a1929,#06131f); }.pricing-card.popular { border-color: rgba(240,20,34,.6); box-shadow: inset 0 3px 0 var(--red); }.popular-label { position: absolute; top: -9px; left: 50%; transform: translateX(-50%); padding: 4px 12px; border-radius: 10px; background: var(--red); font-size: 7px; font-weight: 900; white-space: nowrap; }.pricing-card h3 { margin-top: 10px; }.price { font: 900 37px var(--display); }.price small { font: 500 9px var(--font); }.pricing-list { margin: 18px 0; padding: 0; list-style: none; }.pricing-list li { padding: 6px 0; border-bottom: 1px solid var(--line-soft); color: #b5c0cb; font-size: 9px; }.pricing-list li::before { content: "✓"; margin-right: 7px; color: var(--green); font-weight: 900; }
.bottom-showcase { display: grid; grid-template-columns: 1.2fr .8fr 1fr; gap: 10px; margin-top: 30px; }.bottom-panel { position: relative; overflow: hidden; min-height: 190px; padding: 20px; border: 1px solid var(--line); border-radius: 10px; background: linear-gradient(145deg,#0a1929,#06131f); }.bottom-panel.red { background: linear-gradient(145deg,#d70b17,#78040d); }.bottom-panel h3 { font-size: 25px; }.bottom-panel p { font-size: 10px; }.feature-inline { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 17px; }.feature-inline span { color: #c7d0d9; font-size: 8px; }.mini-icon { color: var(--blue); }.member-number { font: 900 35px var(--display); }.avatar-stack { display: flex; margin-top: 14px; }.avatar-stack span { width: 30px; height: 30px; display: grid; place-items: center; margin-left: -5px; border: 2px solid #b20b15; border-radius: 50%; background: #142638; font-size: 7px; font-weight: 900; }.avatar-stack span:first-child { margin-left: 0; }

/* Public landing from initial visual direction */
.showcase-shell { width: min(1560px, calc(100% - 28px)); margin: 14px auto; overflow: hidden; border: 1px solid #304559; border-radius: 15px; background: #06101b; box-shadow: var(--shadow); }.showcase-hero { display: grid; grid-template-columns: 1.25fr .8fr .75fr; min-height: 520px; border-bottom: 1px solid var(--line); }.hero-copy { padding: 60px 35px 28px; }.hero-label { display: inline-block; color: var(--red-2); font-size: 9px; font-weight: 900; letter-spacing: .5px; }.hero-title { margin: 18px 0 13px; font-size: clamp(4rem,6vw,6.2rem); }.hero-title span, .hero-title .red { display: block; color: var(--red-2); }.hero-subtitle { max-width: 650px; font-size: 13px; }.hero-athlete { position: relative; overflow: hidden; }.hero-athlete img { width: 100%; height: 100%; object-fit: cover; }.confidence-orb { position: absolute; right: 14px; bottom: 18px; padding: 12px; border: 1px solid #37536b; border-radius: 8px; background: rgba(5,15,25,.9); text-align: center; }.orb-ring { width: 65px; height: 65px; display: grid; place-items: center; margin: 7px auto; border-radius: 50%; background: conic-gradient(var(--green) 0 87%,#21374b 87%); }.orb-ring::before { content: ""; grid-area: 1/1; width: 49px; height: 49px; border-radius: 50%; background: #071521; }.orb-ring span { z-index: 1; grid-area: 1/1; font: 900 19px var(--display); }.confidence-orb small, .confidence-orb b { display: block; }.confidence-orb b { color: var(--green); font-size: 8px; text-transform: uppercase; }.verdict-panel { padding: 22px; border-left: 1px solid var(--line); }.verdict-head { display: flex; justify-content: space-between; font-size: 10px; font-weight: 900; }.verdict-card { margin-top: 18px; padding: 15px; border: 1px solid #29455d; border-radius: 9px; background: #081725; }.matchup-row { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 9px; margin: 20px 0; text-align: center; }.team-badge, .pick-team-icon { width: 43px; height: 43px; display: grid; place-items: center; margin: auto; border: 1px solid #34536d; border-radius: 50%; background: #0c2032; font: 900 13px var(--display); }.ai-verdict-line { display: flex; justify-content: space-between; align-items: center; margin: 12px 0; }.model-breakdown { margin-top: 15px; padding-top: 13px; border-top: 1px solid var(--line-soft); }.model-breakdown h4 { font-size: 8px; }.model-row { display: flex; justify-content: space-between; padding: 4px 0; font-size: 8px; }.green { color: var(--green); }.showcase-content { padding: 0 20px 25px; }.section-bar { display: flex; align-items: center; gap: 16px; padding: 17px 0 12px; }.section-bar-left { display: flex; align-items: center; gap: 8px; }.section-bar-left h3, .section-bar-left p { margin: 0; }.section-bar-left p { font-size: 8px; }.filter-chips { display: flex; gap: 6px; margin-left: auto; }.filter-chip { padding: 6px 10px; border: 1px solid #2b455c; border-radius: 14px; color: #8798aa; font-size: 7px; font-weight: 900; }.filter-chip.active { background: var(--red); border-color: var(--red); color: white; }.picks-layout { display: grid; grid-template-columns: 1fr 250px; gap: 9px; }.pick-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 7px; }.pick-card { overflow: hidden; border: 1px solid #213b52; border-radius: 8px; background: #081725; }.pick-card-top, .pick-bottom, .pick-action { display: flex; justify-content: space-between; padding: 9px 10px; font-size: 7px; }.pick-card-top { border-bottom: 1px solid var(--line-soft); color: #8c9bad; }.pick-teams { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 5px; padding: 13px 8px; text-align: center; }.pick-team-name { margin-top: 4px; font-size: 7px; font-weight: 900; }.best-bet { display: table; margin: -3px auto 5px; padding: 3px 7px; border-radius: 4px; background: var(--green); color: #03210f; font-size: 6px; font-weight: 900; }.pick-main { padding: 8px 10px; font: 900 18px var(--display); text-align: center; }.pick-bottom b { color: var(--green); }.pick-action { border-top: 1px solid var(--line-soft); color: #aeb9c5; font-weight: 900; }.recent-panel { padding: 11px; border: 1px solid #213b52; border-radius: 8px; background: #081725; }.recent-head { display: flex; justify-content: space-between; }.recent-win { display: grid; grid-template-columns: auto 1fr auto; gap: 7px; align-items: center; padding: 8px 0; border-bottom: 1px solid var(--line-soft); }.recent-win div strong, .recent-win div small { display: block; font-size: 7px; }.recent-win > b { font-size: 9px; }.results-grid { display: grid; grid-template-columns: repeat(4,1fr); margin-top: 13px; border: 1px solid var(--line); border-radius: 8px; overflow: hidden; }.result-stat { padding: 16px; border-right: 1px solid var(--line); }.result-stat:last-child { border-right: 0; }.result-stat small, .result-stat strong, .result-stat b { display: block; }.result-stat strong { font: 900 31px var(--display); }.result-stat b { color: var(--green); font-size: 7px; }.sparkline { height: 28px; margin-top: 8px; background: linear-gradient(180deg, transparent, rgba(34,211,107,.07)); clip-path: polygon(0 75%,12% 55%,24% 68%,35% 42%,48% 60%,61% 30%,73% 47%,84% 18%,100% 5%,100% 100%,0 100%); }.site-footer { display: flex; justify-content: space-between; gap: 20px; padding: 23px; border-top: 1px solid var(--line); }.site-footer p { margin: 0; text-align: right; }

/* Tables legacy */
.table-wrapper { overflow-x: auto; border: 1px solid var(--line); border-radius: 9px; background: #071522; } table { width: 100%; min-width: 680px; border-collapse: collapse; } th { padding: 11px; border-bottom: 1px solid var(--line); color: #788a9e; font-size: 7px; text-align: left; text-transform: uppercase; } td { padding: 11px; border-bottom: 1px solid var(--line-soft); font-size: 10px; } tr:last-child td { border-bottom: 0; }
.stat-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 10px; }.stat-card { padding: 16px; }.stat-icon { width: 38px; height: 38px; display: grid; place-items: center; border: 1px solid #31506a; border-radius: 7px; }.stat-label { margin-top: 11px; color: var(--muted); font-size: 7px; text-transform: uppercase; }.stat-value { font: 900 30px var(--display); }
.betcode-card { padding: 24px; border: 1px solid rgba(240,20,34,.4); border-radius: 11px; background: linear-gradient(145deg,#0a1929,#06131f); }.betcode-label { color: var(--green); font-size: 9px; font-weight: 900; text-transform: uppercase; }.betcode-code { margin: 20px 0; font: 900 34px var(--mono); text-align: center; }.betcode-stats { display: grid; grid-template-columns: repeat(3,1fr); gap: 8px; }.betcode-stat { padding: 11px; border: 1px solid var(--line); border-radius: 7px; }.betcode-stat-label { font-size: 7px; color: var(--muted); }.betcode-stat-value { font: 900 22px var(--display); }.betcode-stat-value.highlight { color: var(--green); }

/* Floating selection builder and mobile dock */
.bet-builder { position: fixed; right: 18px; bottom: 18px; z-index: 160; min-width: 330px; display: none; align-items: center; justify-content: space-between; gap: 15px; padding: 10px 11px; border: 1px solid rgba(34,211,107,.46); border-radius: 10px; background: rgba(5,16,27,.97); box-shadow: 0 18px 55px rgba(0,0,0,.5); backdrop-filter: blur(15px); }.bet-builder.active { display: flex; }.bet-builder-copy { display: flex; align-items: center; gap: 9px; }.bet-builder-count { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 7px; background: var(--green); color: #03210e; font: 900 16px var(--display); }.bet-builder-copy strong, .bet-builder-copy small { display: block; }.bet-builder-copy strong { font-size: 10px; }.bet-builder-copy small { font-size: 8px; }.mobile-dock { display: none; }

/* Tablet */
@media (max-width: 1120px) {
  .navbar-inner { gap: 16px; }.navbar-menu a { padding: 0 8px; font-size: 9px; }
  .member-hero { grid-template-columns: 1.2fr .72fr; }.member-verdict { grid-column: 1 / -1; display: grid; grid-template-columns: auto 1fr; gap: 20px; border-left: 0; border-top: 1px solid var(--line); }.member-verdict .verdict-fixture { margin-top: 0; }
  .member-picks-grid, .master-slip-grid { grid-template-columns: repeat(2,1fr); }
  .match-card-body { grid-template-columns: 1.25fr .8fr; }.quality-block { grid-column: 1 / -1; border-top: 1px solid var(--line-soft); }
  .filters-grid { grid-template-columns: repeat(3,1fr); }
  .builder-layout { grid-template-columns: minmax(0,1fr) 360px; }
  .admin-kpi-grid { grid-template-columns: repeat(2,1fr); }.workflow-steps { grid-template-columns: repeat(2,1fr); }
  .editor-grid { grid-template-columns: minmax(0,1fr) 340px; }
  .showcase-hero { grid-template-columns: 1.3fr .8fr; }.verdict-panel { grid-column: 1 / -1; }.pick-grid { grid-template-columns: repeat(2,1fr); }
}

/* Mobile */
@media (max-width: 760px) {
  :root { --nav-h: 61px; }
  body.member-app, body.admin-app { padding-bottom: calc(74px + env(safe-area-inset-bottom)); }
  main { padding-top: 13px; }
  .container, .container-md, .container-sm { width: calc(100% - 22px); }
  .navbar { height: var(--nav-h); }.navbar-inner { width: calc(100% - 18px); gap: 8px; }
  .brand-mark { width: 34px; height: 34px; }.brand-name { font-size: 20px; }.brand-copy small { display: none; }
  .navbar-toggle { display: flex; order: 3; }.navbar-menu { position: fixed; top: 67px; left: 10px; right: 10px; display: none; flex-direction: column; align-items: stretch; gap: 0; padding: 7px; border: 1px solid #29445b; border-radius: 10px; background: rgba(4,12,20,.98); box-shadow: var(--shadow); }.navbar-menu.active { display: flex; }.navbar-menu a { min-height: 43px; padding: 0 12px; border-radius: 6px; }.navbar-menu a::after { display: none; }.navbar-menu a.active { background: var(--red-soft); color: var(--red-2); }
  .navbar-right { margin-left: auto; gap: 6px; }.user-avatar { display: none; }.subscription-pill { height: 30px; padding: 0 8px; }.admin-mode-pill { display: none; }.desktop-only { display: none !important; }.navbar-right .btn { min-height: 31px; padding: 7px 10px; font-size: 9px; }
  .messages-wrap { top: 70px; right: 11px; width: calc(100% - 22px); }.alert { padding: 11px; font-size: 11px; }
  h1 { font-size: 2.65rem; }.section-kicker { font-size: 8px; }
  .grid-2, .grid-3, .grid-4 { grid-template-columns: 1fr; }

  /* Hide desktop hero; show app command card */
  .member-hero { display: none; }
  .mobile-command-card { display: grid; grid-template-columns: 1fr 82px; align-items: stretch; overflow: hidden; min-height: 132px; margin-bottom: 9px; border: 1px solid #2b445a; border-radius: 11px; background: radial-gradient(circle at 85% 25%, rgba(240,20,34,.2), transparent 38%), linear-gradient(145deg,#0b1c2c,#06131f); }.mobile-command-card > div { padding: 16px; }.mobile-command-card small { margin-left: 5px; font-size: 7px; font-weight: 900; }.mobile-command-card h2 { margin: 11px 0 4px; font-size: 27px; }.mobile-command-card p { margin: 0; font-size: 9px; }.mobile-command-button { display: flex; flex-direction: column; align-items: center; justify-content: center; border-left: 1px solid rgba(240,20,34,.34); background: linear-gradient(160deg, rgba(240,20,34,.2), rgba(240,20,34,.05)); color: white; font: 900 17px/1.05 var(--display); text-align: center; }.mobile-command-button span { margin-top: 10px; color: var(--red-2); }
  .mobile-stat-strip { display: grid; grid-template-columns: repeat(4,1fr); margin-bottom: 9px; overflow: hidden; border: 1px solid var(--line); border-radius: 9px; background: #071522; }.mobile-stat-strip div { min-width: 0; padding: 10px 5px; border-right: 1px solid var(--line-soft); text-align: center; }.mobile-stat-strip div:last-child { border-right: 0; }.mobile-stat-strip strong, .mobile-stat-strip small { display: block; }.mobile-stat-strip strong { font: 900 18px var(--display); }.mobile-stat-strip small { overflow: hidden; font-size: 6px; text-transform: uppercase; text-overflow: ellipsis; white-space: nowrap; }
  .notice-stack { margin: 9px 0; }.notice-card { padding: 10px; }.notice-card p { font-size: 9px; }
  .dashboard-action-grid { grid-template-columns: 1fr; gap: 7px; margin: 9px 0 25px; }.action-tile { grid-template-columns: 35px 1fr auto; padding: 11px; }.action-icon { width: 35px; height: 35px; font-size: 17px; }.action-tile strong { font-size: 16px; }.action-tile p { font-size: 8px; }
  .dashboard-section { margin: 25px 0; }.section-heading { align-items: center; }.section-heading h2 { font-size: 27px; }.section-link { font-size: 7px; }
  .member-picks-grid, .master-slip-grid { grid-template-columns: 1fr; gap: 8px; }.member-pick-card { display: grid; grid-template-columns: 1fr; }.member-pick-head { padding: 8px 10px; }.member-fixture { padding: 10px; }.member-fixture b { width: 34px; height: 34px; }.member-prediction-row { padding: 9px 11px; }.member-prediction-row strong { font-size: 18px; }.odds-box { font-size: 22px; }.pick-quality-row { padding: 7px 11px 5px; }.pick-card-link { padding: 9px 11px; }
  .master-slip-card { padding: 13px; }.master-slip-top { grid-template-columns: 40px 1fr auto; }.slip-date-box { width: 40px; height: 43px; }.master-slip-top h3 { font-size: 18px; }.master-slip-card > p { min-height: 0; margin: 11px 0; font-size: 9px; }.master-slip-stats { margin-bottom: 11px; }
  .dashboard-lower-grid { grid-template-columns: 1fr; gap: 8px; margin-top: 22px; }.data-panel { padding: 13px; }.activity-row { padding: 9px 0; }.app-footer { display: block; margin-top: 24px; text-align: center; }.app-footer p { margin-top: 6px; }

  /* Master slip */
  .workspace-header { display: block; padding: 6px 0 12px; }.workspace-title-row { align-items: flex-start; justify-content: space-between; }.workspace-heading h1 { font-size: 35px; }.workspace-heading p { font-size: 9px; }.workspace-selection-summary { position: sticky; top: 67px; z-index: 90; display: grid; grid-template-columns: 1fr 1fr auto; margin-top: 13px; padding: 6px; border: 1px solid #2a455c; border-radius: 9px; background: rgba(5,15,25,.96); box-shadow: 0 8px 25px rgba(0,0,0,.25); }.workspace-selection-summary > div { min-width: 0; padding: 7px 8px; border: 0; border-right: 1px solid var(--line-soft); background: transparent; }.workspace-selection-summary strong { font-size: 18px; }.workspace-selection-summary .btn { min-height: 38px; padding: 7px 10px; font-size: 8px; }.slip-intro-card { padding: 11px; }.slip-intro-card p { font-size: 9px; }
  .filter-preset-strip { margin: 10px 0 8px; }.preset-chip { padding: 8px 10px; font-size: 8px; }.preset-chip.clear { margin-left: 0; }
  .advanced-filter-panel > summary { padding: 11px; }.summary-toggle { font-size: 7px; }.advanced-filter-form { padding: 11px; }.filter-search-row { grid-template-columns: 1fr; }.filter-search-row .btn { width: 100%; }.filters-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; }.form-label { font-size: 7px; }.form-control, .form-select { height: 41px; font-size: 11px; }.professional-filters .form-group:nth-last-child(1) { grid-column: 1 / -1; }.filter-form-actions { display: grid; grid-template-columns: 1fr 1fr; }.filter-form-actions .btn { padding: 8px; }
  .match-board-heading { align-items: center; }.match-board-heading h2 { font-size: 27px; }.board-legend { display: none; }
  .analytics-match-list { gap: 8px; }.match-card-topline { padding: 8px 9px; }.match-card-topline > div:last-child { flex: 0 0 auto; }.match-card-topline strong { max-width: 140px; }.match-card-topline time { display: none; }
  .match-card-body { display: block; }.fixture-block { padding: 12px 9px; }.fixture-team { grid-template-columns: 34px 1fr; gap: 7px; }.fixture-team.away { grid-template-columns: 1fr 34px; }.team-monogram { width: 34px; height: 34px; font-size: 12px; }.fixture-team strong { font-size: 10px; }.fixture-vs small { width: 40px; font-size: 5px; }
  .prediction-block { padding: 10px; border: 0; border-top: 1px solid var(--line-soft); border-bottom: 1px solid var(--line-soft); }.prediction-block strong { font-size: 18px; }.prediction-odds strong { font-size: 24px; }.quality-block { grid-column: auto; padding: 9px 10px; border-top: 0; }.value-meter strong { font-size: 19px; }.match-card-footer { min-height: 41px; }.analysis-disclosure summary, .analysis-unavailable { min-height: 40px; padding: 0 10px; }.select-match-button { min-width: 132px; font-size: 7px; }
  .analysis-file-grid { grid-template-columns: 1fr; }.analysis-file-card { grid-template-columns: auto 1fr auto; }

  /* Builder */
  .builder-header { display: block; padding: 5px 0 13px; }.builder-header h1 { font-size: 38px; }.builder-header p { font-size: 9px; }.builder-header-stats { min-width: 0; margin-top: 12px; }.builder-header-stats > div { padding: 9px; }.builder-header-stats strong { font-size: 19px; }
  .builder-layout { display: flex; flex-direction: column; }.generate-code-panel { position: static; order: -1; width: 100%; padding: 13px; }.builder-selections-panel { width: 100%; padding: 13px; }.company-option { padding: 9px; }.builder-match-card { grid-template-columns: 29px 1fr auto auto; gap: 8px; padding: 9px; }.builder-match-index { width: 28px; height: 28px; }.builder-match-main strong { font-size: 9px; }.builder-match-quality strong { font-size: 19px; }.remove-selection { width: 28px; height: 28px; }

  /* Codes */
  .compact-header { display: block; }.compact-header .btn { width: 100%; margin-top: 12px; }.code-history-grid { grid-template-columns: 1fr; }.code-history-card { padding: 13px; }.code-detail-layout { grid-template-columns: 1fr; }.generated-code-card { position: static; padding: 15px; }.generated-code-head h1 { font-size: 29px; }.generated-code-value { margin: 15px 0 9px; padding: 16px 8px; font-size: 23px; }.code-selections-panel { padding: 13px; }

  /* Admin */
  .admin-page-header { display: block; padding: 5px 0 14px; }.admin-page-header h1 { font-size: 37px; }.admin-page-header p { font-size: 9px; }.admin-header-actions { display: grid; grid-template-columns: 1fr 1fr; margin-top: 12px; }.admin-header-actions .btn { width: 100%; padding: 8px; font-size: 8px; }.admin-kpi-grid, .compact-admin-kpis { display: flex; overflow-x: auto; gap: 7px; padding-bottom: 3px; scrollbar-width: none; }.admin-kpi-grid::-webkit-scrollbar { display: none; }.admin-kpi-grid article { flex: 0 0 71%; padding: 12px; }.admin-kpi-grid strong { font-size: 26px; }.admin-workflow-card { padding: 13px; }.workflow-steps { grid-template-columns: 1fr; gap: 6px; }.workflow-steps a { padding: 9px; }.admin-main-grid { grid-template-columns: 1fr; gap: 8px; }.admin-data-panel.wide { grid-column: auto; }.admin-data-panel { padding: 13px; }.admin-list-card { grid-template-columns: auto 1fr auto; padding: 9px; }.admin-list-card .status-badge { display: none; }.admin-list-card .btn { grid-column: 2 / -1; width: 100%; }.file-processing-list article { grid-template-columns: auto 1fr auto; }.file-processing-list article > b { display: none; }
  .admin-filter-bar { grid-template-columns: 1fr; padding: 8px; }.responsive-admin-table { margin-top: 8px; }.admin-table-head { display: none; }.admin-table-row, .users-table .admin-table-row { display: grid; grid-template-columns: 1fr 1fr; gap: 0; margin-bottom: 8px; padding: 0; border: 1px solid var(--line); border-radius: 8px; background: #071522; overflow: hidden; }.admin-table-row > div { min-height: 57px; display: flex; flex-direction: column; justify-content: center; padding: 9px; border-right: 1px solid var(--line-soft); border-bottom: 1px solid var(--line-soft); }.admin-table-row > div::before { content: attr(data-label); display: block; margin-bottom: 3px; color: #66798d; font-size: 6px; font-weight: 900; text-transform: uppercase; }.admin-table-row > div:nth-child(even) { border-right: 0; }.admin-table-row > div:nth-last-child(-n+2) { border-bottom: 0; }.users-table .admin-table-row > div:first-child { display: grid; grid-template-columns: auto 1fr; grid-column: 1 / -1; border-right: 0; }.users-table .admin-table-row > div:first-child::before { grid-column: 1 / -1; }

  /* Editor */
  .editor-status-strip { display: flex; overflow-x: auto; gap: 6px; scrollbar-width: none; }.editor-status-strip > div { flex: 0 0 62%; padding: 9px; }.editor-grid { grid-template-columns: 1fr; }.editor-side-column { position: static; }.editor-section > summary, .static-section-head { padding: 11px; }.editor-section-body { padding: 11px; }.editor-section-body .grid-2 { grid-template-columns: 1fr 1fr; gap: 8px; }.editor-section-body .grid-2 .form-group { margin-bottom: 0; }.editor-section-body .grid-2 .form-group:first-child, .editor-section-body .grid-2 .form-group:nth-child(2), .editor-section-body .grid-2 .form-group:nth-child(3), .editor-section-body .grid-2 .form-group:nth-child(4) { grid-column: auto; }.bulk-format-note { display: block; }.bulk-format-note code { display: block; margin-top: 4px; }.admin-match-list { padding: 0 9px 9px; }.admin-match-card { grid-template-columns: auto 1fr auto; padding: 8px; }.admin-match-metrics { grid-column: 2 / -1; }.admin-match-card form { grid-column: 3; grid-row: 1; }.uploaded-file-list article { grid-template-columns: auto 1fr auto; }.uploaded-file-list .processing-status { display: none; }.admin-create-page { padding-top: 10px; }.create-slip-card { padding: 17px; }

  /* Dock / builder */
  .mobile-dock { position: fixed; left: 0; right: 0; bottom: 0; z-index: 180; height: calc(66px + env(safe-area-inset-bottom)); display: grid; grid-template-columns: repeat(5,1fr); padding: 0 6px env(safe-area-inset-bottom); border-top: 1px solid #20384d; background: rgba(4,12,20,.98); backdrop-filter: blur(18px); }.mobile-dock a { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px; color: #75879a; }.mobile-dock a > span { font-size: 17px; line-height: 1; }.mobile-dock a small { font-size: 6.5px; font-weight: 900; text-transform: uppercase; }.mobile-dock a.active { color: var(--red-2); }.mobile-dock .dock-primary > span { width: 38px; height: 38px; display: grid; place-items: center; margin-top: -17px; border: 4px solid var(--bg); border-radius: 50%; background: var(--red); color: white; font-size: 24px; box-shadow: 0 8px 18px rgba(240,20,34,.3); }.mobile-dock .dock-primary small { margin-top: -2px; color: #b7c3ce; }.admin-dock .dock-primary > span { background: var(--green); color: #03210e; box-shadow: 0 8px 18px rgba(34,211,107,.25); }
  .bet-builder { left: 11px; right: 11px; bottom: calc(73px + env(safe-area-inset-bottom)); min-width: 0; padding: 8px; }.bet-builder-copy strong { font-size: 9px; }.bet-builder .btn { min-width: 95px; }

  /* Public and auth */
  .auth-stage { padding: 18px 0; }.auth-card { padding: 20px 16px; }.auth-card h1 { font-size: 35px; }.auth-trust { flex-wrap: wrap; gap: 8px; }.otp-input { width: 48px; height: 56px; }
  .pricing-grid { grid-template-columns: 1fr; }.bottom-showcase { grid-template-columns: 1fr; }.bottom-panel { min-height: 150px; }.showcase-shell { width: 100%; margin: 0; border: 0; border-radius: 0; }.showcase-hero { display: block; min-height: 0; }.hero-copy { padding: 34px 18px 22px; }.hero-title { font-size: 4rem; }.hero-athlete { min-height: 360px; }.verdict-panel { display: none; }.showcase-content { padding: 0 11px 20px; }.section-bar { flex-wrap: wrap; }.filter-chips { width: 100%; overflow-x: auto; margin-left: 0; }.picks-layout { grid-template-columns: 1fr; }.pick-grid { grid-template-columns: 1fr; }.results-grid { grid-template-columns: repeat(2,1fr); }.result-stat:nth-child(2) { border-right: 0; }.result-stat:nth-child(-n+2) { border-bottom: 1px solid var(--line); }.site-footer { display: block; text-align: center; }.site-footer p { margin-top: 8px; text-align: center; }
  .member-live-panel { min-height: 520px !important; height: 520px; }
}

@media (max-width: 390px) {
  .container, .container-md, .container-sm { width: calc(100% - 16px); }
  .brand-name { font-size: 18px; }.brand-mark { width: 30px; height: 30px; }
  .subscription-pill small { display: none; }
  .mobile-stat-strip strong { font-size: 16px; }
  .filters-grid { grid-template-columns: 1fr; }.professional-filters .form-group:nth-last-child(1) { grid-column: auto; }.filter-form-actions { grid-template-columns: 1fr; }
  .workspace-selection-summary { grid-template-columns: 1fr 1fr; }.workspace-selection-summary .btn { grid-column: 1 / -1; }
  .editor-section-body .grid-2 { grid-template-columns: 1fr; }
  .admin-header-actions { grid-template-columns: 1fr; }
  .admin-table-row, .users-table .admin-table-row { grid-template-columns: 1fr; }.admin-table-row > div { border-right: 0; }.admin-table-row > div:nth-last-child(-n+2) { border-bottom: 1px solid var(--line-soft); }.admin-table-row > div:last-child { border-bottom: 0; }
  .select-match-button { min-width: 116px; }.select-label { font-size: 6px; }
  .builder-match-card { grid-template-columns: 25px 1fr auto; }.builder-match-card .remove-selection { grid-column: 3; grid-row: 1; }.builder-match-quality { grid-column: 2 / -1; display: flex; justify-content: flex-end; gap: 8px; }
}

.match-card-footer {
  min-height: 58px;
}
.analysis-disclosure summary,
.analysis-unavailable {
  min-height: 58px;
  font-size: 10px;
}
.select-match-button {
  min-width: 190px;
  min-height: 58px;
  padding: 0 22px;
  gap: 10px;
  border-left-color: #365a76;
  background: linear-gradient(135deg, #102a40, #0a1d2d);
  color: #f7fbff;
  font-size: 11px;
  letter-spacing: .25px;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04);
}
.select-match-button:hover {
  background: linear-gradient(135deg, #153650, #0c2438);
}
.select-match-button.selected {
  background: linear-gradient(135deg, #5ee36f, #25c75e);
  color: #031f0d;
}
.select-icon {
  font-size: 22px;
  line-height: 1;
}
.select-label {
  font-size: 11px;
  font-weight: 950;
  white-space: nowrap;
}

@media (max-width: 760px) {
  .match-card-footer {
    min-height: 62px;
  }
  .analysis-disclosure summary,
  .analysis-unavailable {
    min-height: 62px;
    padding: 0 12px;
    font-size: 9px;
  }
  .select-match-button {
    min-width: 156px;
    min-height: 62px;
    padding: 0 16px;
    gap: 9px;
    font-size: 10px;
  }
  .select-icon {
    font-size: 21px;
  }
  .select-label {
    font-size: 10px;
  }
}

@media (max-width: 390px) {
  .match-card-footer {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(148px, 42%);
  }
  .select-match-button {
    width: 100%;
    min-width: 148px;
    min-height: 64px;
    padding: 0 12px;
  }
  .select-label {
    font-size: 9.5px;
  }
}

/* Subscription checkout, OTP and billing history — v2 */
.otp-card { max-width: 520px; margin: 0 auto; }
.otp-demo-note { display: flex; align-items: center; gap: 12px; margin: 0 0 18px; padding: 11px 13px; border: 1px solid rgba(45,168,255,.3); border-radius: 8px; background: rgba(45,168,255,.06); }
.otp-demo-note > span { padding: 4px 7px; border-radius: 4px; background: var(--blue); color: #021522; font-size: 7px; font-weight: 900; }
.otp-demo-note div { display: flex; align-items: center; justify-content: space-between; flex: 1; gap: 10px; }.otp-demo-note small { font-size: 8px; }.otp-demo-note code { color: var(--green); font: 900 20px var(--mono); letter-spacing: 3px; }
.otp-resend-row { display: flex; align-items: center; justify-content: center; gap: 8px; margin-top: 15px; color: var(--muted); font-size: 10px; }
.payment-workspace { padding: 26px 0 55px; }.payment-card { overflow: hidden; border: 1px solid #26445c; border-radius: 13px; background: linear-gradient(145deg,#0a1929,#06131f); box-shadow: var(--shadow-soft); }
.payment-card-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; padding: 22px; border-bottom: 1px solid var(--line); background: radial-gradient(circle at 90% 0, rgba(240,20,34,.13), transparent 38%); }.payment-card-head h1 { margin: 0; font-size: 42px; }.payment-card-head p { margin: 8px 0 0; font-size: 10px; }.payment-price { flex: 0 0 auto; text-align: right; }.payment-price strong, .payment-price span { display: block; }.payment-price strong { color: var(--red-2); font: 900 35px var(--display); }.payment-price span { font-size: 8px; font-weight: 900; }
.checkout-summary { display: grid; grid-template-columns: repeat(3,1fr); border-bottom: 1px solid var(--line); }.checkout-summary div { padding: 12px 16px; border-right: 1px solid var(--line-soft); }.checkout-summary div:last-child { border-right: 0; }.checkout-summary span, .checkout-summary strong { display: block; }.checkout-summary span { color: var(--muted); font-size: 7px; text-transform: uppercase; }.checkout-summary strong { margin-top: 3px; font-size: 10px; }
.payment-form { padding: 20px 22px 22px; }.payment-method-grid { display: grid; grid-template-columns: repeat(2,1fr); gap: 8px; }.payment-method-grid label { position: relative; display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 9px; min-height: 54px; padding: 10px; border: 1px solid #27445c; border-radius: 8px; background: #071522; cursor: pointer; }.payment-method-grid input { position: absolute; opacity: 0; }.payment-method-grid label > span { width: 32px; height: 32px; display: grid; place-items: center; border: 1px solid #36556e; border-radius: 6px; color: var(--red-2); font: 900 9px var(--mono); }.payment-method-grid label strong { font-size: 10px; }.payment-method-grid label i { width: 18px; height: 18px; display: grid; place-items: center; border: 1px solid #39536a; border-radius: 50%; color: transparent; font-size: 9px; font-style: normal; }.payment-method-grid label:has(input:checked) { border-color: rgba(34,211,107,.55); background: var(--green-soft); }.payment-method-grid label:has(input:checked) i { border-color: var(--green); background: var(--green); color: #03210e; }
.status-payment-card { padding: 24px; text-align: center; }.payment-status-icon { width: 72px; height: 72px; display: grid; place-items: center; margin: 0 auto 16px; border: 1px solid rgba(240,20,34,.45); border-radius: 50%; background: var(--red-soft); color: var(--red-2); font-size: 30px; }.status-payment-card .section-kicker { font-size: 12px; }.status-payment-card h1 { max-width: 440px; margin: 7px auto 10px; font-size: 42px; }.status-payment-card > p { max-width: 500px; margin: 0 auto 18px; font-size: 12px; }.status-payment-card > p strong { color: white; }
.payment-status-grid { display: grid; grid-template-columns: repeat(2,1fr); gap: 8px; margin: 18px 0; text-align: left; }.payment-status-grid div { min-width: 0; padding: 13px; border: 1px solid var(--line); border-radius: 7px; background: #071522; }.payment-status-grid small, .payment-status-grid strong { display: block; }.payment-status-grid small { font-size: 9px; font-weight: 900; letter-spacing: .5px; }.payment-status-grid strong { overflow: hidden; margin-top: 5px; font-size: 13px; text-overflow: ellipsis; white-space: nowrap; }
.payment-waiting { display: flex; align-items: center; gap: 12px; margin: 16px 0; padding: 14px; border: 1px solid rgba(242,186,58,.3); border-radius: 8px; background: rgba(242,186,58,.06); text-align: left; }.payment-waiting strong, .payment-waiting small { display: block; }.payment-waiting strong { font-size: 12px; }.payment-waiting small { margin-top: 2px; font-size: 9px; }
.account-history-page { padding-bottom: 55px; }.compact-header { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; padding: 13px 0 22px; }.compact-header h1 { margin: 0; }.compact-header p { margin: 8px 0 0; font-size: 11px; }
.billing-summary-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 9px; margin-bottom: 12px; }.billing-summary-grid article { padding: 14px; border: 1px solid var(--line); border-radius: 9px; background: #071522; }.billing-summary-grid small, .billing-summary-grid strong, .billing-summary-grid p { display: block; }.billing-summary-grid small { font-size: 7px; }.billing-summary-grid strong { margin-top: 4px; font: 900 25px var(--display); }.billing-summary-grid p { margin: 3px 0 0; font-size: 8px; }
.billing-layout { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }.billing-panel { padding: 16px; border: 1px solid var(--line); border-radius: 11px; background: linear-gradient(145deg,#0a1929,#06131f); }.billing-list { display: grid; margin-top: 12px; }.billing-list article { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 10px; min-width: 0; padding: 11px 0; border-bottom: 1px solid var(--line-soft); }.billing-list article:last-child { border-bottom: 0; }.billing-icon { width: 35px; height: 35px; display: grid; place-items: center; border: 1px solid #36546c; border-radius: 7px; color: var(--red-2); font: 900 8px var(--mono); }.billing-list div { min-width: 0; }.billing-list small, .billing-list strong, .billing-list p { display: block; }.billing-list small { font-size: 7px; }.billing-list strong { overflow: hidden; margin: 2px 0; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }.billing-list p { overflow: hidden; margin: 0; font-size: 8px; text-overflow: ellipsis; white-space: nowrap; }

@media (max-width: 760px) {
  .payment-workspace { padding: 8px 0 25px; }.payment-card-head { display: block; padding: 16px; }.payment-card-head h1 { font-size: 34px; }.payment-price { margin-top: 14px; text-align: left; }.payment-price strong { font-size: 31px; }.checkout-summary { grid-template-columns: 1fr; }.checkout-summary div { display: flex; justify-content: space-between; gap: 8px; padding: 10px 13px; border-right: 0; border-bottom: 1px solid var(--line-soft); }.checkout-summary div:last-child { border-bottom: 0; }.payment-form { padding: 14px; }.payment-method-grid { grid-template-columns: 1fr; }.payment-method-grid label { min-height: 50px; }
  .status-payment-card { padding: 17px 14px; }.payment-status-icon { width: 60px; height: 60px; font-size: 25px; }.status-payment-card .section-kicker { font-size: 10px; }.status-payment-card h1 { font-size: 34px; }.payment-status-grid { grid-template-columns: 1fr 1fr; }.payment-status-grid small { font-size: 8px; }.payment-status-grid strong { font-size: 11px; }.payment-waiting strong { font-size: 10px; }.payment-waiting small { font-size: 8px; }
  .billing-summary-grid { display: flex; overflow-x: auto; gap: 7px; scrollbar-width: none; }.billing-summary-grid article { flex: 0 0 72%; }.billing-layout { grid-template-columns: 1fr; }.billing-panel { padding: 13px; }.billing-list article { grid-template-columns: auto 1fr; }.billing-list .status-badge { grid-column: 2; justify-self: start; }.account-history-page .compact-header { display: block; }.account-history-page .compact-header .btn { width: 100%; margin-top: 12px; }
  .otp-demo-note { padding: 9px 10px; }.otp-demo-note code { font-size: 17px; }.otp-resend-row { flex-wrap: wrap; }
}

/* Account profile — responsive member control center */
.profile-page { padding: 12px 0 54px; }
.profile-heading { display: grid; justify-items: center; gap: 14px; margin-bottom: 14px; text-align: center; }
.profile-heading h1 { margin: 3px 0 6px; }
.profile-heading p { margin: 0; font-size: 11px; }
.profile-layout { display: grid; grid-template-columns: .82fr 1.2fr; gap: 10px; }
.profile-card, .membership-card, .account-security-card { padding: 18px; border: 1px solid var(--line); border-radius: 11px; background: linear-gradient(145deg,#0a1929,#06131f); }
.profile-card { display: grid; grid-template-columns: 1fr; justify-items: center; align-items: center; gap: 14px; text-align: center; }
.profile-avatar { width: 62px; height: 62px; display: grid; place-items: center; border: 1px solid rgba(240,20,34,.55); border-radius: 11px; background: linear-gradient(145deg,rgba(240,20,34,.2),rgba(45,168,255,.08)); font: 900 30px var(--display); }
.profile-identity h2 { margin: 8px 0 2px; font-size: 24px; }.profile-identity p { margin: 0; font-size: 10px; }
.profile-facts { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(3,1fr); margin: 4px 0 0; border: 1px solid var(--line-soft); border-radius: 8px; overflow: hidden; }
.profile-facts div { padding: 10px; border-right: 1px solid var(--line-soft); }.profile-facts div:last-child { border-right: 0; }.profile-facts dt, .profile-facts dd { margin: 0; }.profile-facts dt { color: var(--muted); font-size: 7px; text-transform: uppercase; }.profile-facts dd { margin-top: 3px; font-size: 10px; font-weight: 800; }
.profile-page .section-heading.compact { justify-content: center; text-align: center; }
.membership-card { min-width: 0; }.membership-meter { margin: 14px 0; padding: 16px; border: 1px solid rgba(34,211,107,.35); border-radius: 9px; background: var(--green-soft); }.membership-meter strong, .membership-meter span { display: block; }.membership-meter strong { font: 900 24px var(--display); }.membership-meter span { margin-top: 4px; color: var(--muted); font-size: 9px; }
.profile-metrics { margin-bottom: 14px; }.compact-empty { padding: 20px 12px; }.compact-empty h3 { margin: 8px 0 5px; }.compact-empty p { max-width: 520px; margin: 0 auto; }
.membership-card { text-align: center; }
.membership-card .profile-metrics { justify-content: center; text-align: center; }
.membership-card .profile-metrics > div { text-align: center; }
.membership-card .button-row { display: flex; justify-content: center; gap: 10px; flex-wrap: wrap; }
.membership-card .button-row .btn { min-width: 178px; }
.account-security-card { grid-column: 1 / -1; }.security-list { display: grid; grid-template-columns: repeat(3,1fr); gap: 8px; margin: 14px 0; }.security-row { display: grid; grid-template-columns: auto 1fr; gap: 10px; align-items: center; padding: 12px; border: 1px solid var(--line-soft); border-radius: 8px; background: #071522; }.security-icon { min-width: 36px; height: 36px; display: grid; place-items: center; padding: 0 5px; border: 1px solid rgba(34,211,107,.4); border-radius: 7px; color: var(--green); font: 900 8px var(--mono); }.security-row strong, .security-row small { display: block; }.security-row strong { font-size: 13px; }.security-row small { margin-top: 5px; font-size: 10px; line-height:1.35; }
.btn-danger-outline { border-color: rgba(240,20,34,.45); color: var(--red-2); background: rgba(240,20,34,.05); }.btn-danger-outline:hover { background: rgba(240,20,34,.12); }

@media (max-width: 760px) {
  .profile-page { padding-top: 2px; }.profile-heading { display: grid; justify-items: center; padding: 8px 0; text-align: center; }.profile-heading .btn { width: 100%; margin-top: 12px; }.profile-layout { grid-template-columns: 1fr; }.profile-card, .membership-card, .account-security-card { padding: 14px; }.profile-card { grid-template-columns: 1fr; justify-items: center; text-align: center; }.profile-avatar { width: 52px; height: 52px; font-size: 25px; }.profile-identity h2 { overflow: hidden; font-size: 21px; text-overflow: ellipsis; white-space: nowrap; }.profile-facts { grid-template-columns: 1fr; text-align: left; }.profile-facts div { display: flex; justify-content: space-between; gap: 10px; border-right: 0; border-bottom: 1px solid var(--line-soft); }.profile-facts div:last-child { border-bottom: 0; }.security-list { grid-template-columns: 1fr; }.account-security-card { grid-column: auto; }.button-row { display: grid; grid-template-columns: 1fr; }.button-row .btn { width: 100%; }
}

/* Mobile checkout keeps the payment CTA within the first screen. */
@media (max-width: 760px) {
  .payment-card-head { padding: 14px; }.payment-card-head h1 { max-width: 290px; font-size: 31px; line-height: .96; }.payment-card-head p { margin-top: 7px; font-size: 9px; line-height: 1.45; }.payment-price { margin-top: 10px; }.payment-price strong { font-size: 28px; }
  .payment-form { padding: 12px 14px 17px; }.payment-form .form-group { margin-bottom: 12px; }.payment-method-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 7px; }.payment-method-grid label { grid-template-columns: auto minmax(0,1fr) auto; min-height: 47px; padding: 7px; }.payment-method-grid label > span { width: 28px; height: 28px; }.payment-method-grid label strong { overflow: hidden; font-size: 8px; text-overflow: ellipsis; white-space: nowrap; }
  .payment-form .notice-card { margin: 11px 0; padding: 9px; }.payment-form .notice-card p { font-size: 7px; }.payment-form .btn-lg { min-height: 48px; }
}

/* ================================================================
   WAKAMARIA V3 — SIMPLE ACCESS JOURNEY
   One dashboard: past results are free, today's slips unlock for 30 days.
   ================================================================ */
.member-home-v3,
.payment-page-v3 {
  width: min(1180px, calc(100% - 32px));
  margin: 0 auto;
  padding: 4px 0 54px;
}

.access-hero-v3 {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 270px;
  gap: 28px;
  min-height: 350px;
  padding: 38px 40px;
  border: 1px solid #213d55;
  border-radius: 18px;
  background:
    linear-gradient(90deg, rgba(4,12,22,.98) 0%, rgba(5,15,27,.93) 52%, rgba(4,13,23,.78) 100%),
    radial-gradient(circle at 86% 24%, rgba(45,168,255,.22), transparent 34%),
    #06111d;
  box-shadow: var(--shadow);
}
.access-hero-v3::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  opacity: .55;
  background:
    linear-gradient(130deg, transparent 0 58%, rgba(255,255,255,.025) 58.2% 58.7%, transparent 59% 100%),
    repeating-linear-gradient(90deg, transparent 0 92px, rgba(92,137,177,.035) 93px 94px);
}
.access-hero-v3.is-limited { border-color: rgba(240,20,34,.42); }
.access-hero-v3.is-limited::after,
.access-hero-v3.is-active::after {
  content: "";
  position: absolute;
  width: 420px;
  height: 420px;
  right: -170px;
  top: -180px;
  z-index: -1;
  border-radius: 50%;
  filter: blur(20px);
}
.access-hero-v3.is-limited::after { background: rgba(240,20,34,.14); }
.access-hero-v3.is-active { border-color: rgba(34,211,107,.36); }
.access-hero-v3.is-active::after { background: rgba(34,211,107,.12); }
.access-hero-copy { align-self: center; max-width: 790px; }
.access-state-pill {
  width: fit-content;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 7px 10px;
  border: 1px solid rgba(255,82,96,.36);
  border-radius: 999px;
  background: rgba(255,82,96,.08);
  color: #ff7e87;
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .85px;
}
.is-active .access-state-pill { border-color: rgba(34,211,107,.35); background: var(--green-soft); color: var(--green); }
.access-state-pill i { width: 7px; height: 7px; border-radius: 50%; background: currentColor; box-shadow: 0 0 12px currentColor; }
.welcome-line { margin: 17px 0 5px; color: #91a2b5; font-size: 11px; font-weight: 700; }
.access-hero-v3 h1 { max-width: 870px; margin: 0 0 14px; font-size: clamp(3rem, 5.2vw, 5.1rem); line-height: .9; }
.access-hero-v3 h1 span { color: var(--red-2); }
.access-hero-v3.is-active h1 span { color: var(--green); }
.access-hero-v3.is-limited h1 { font-size: clamp(2.35rem, 4.15vw, 4rem); }
.access-hero-v3 h1.dashboard-access-title {
  display: grid;
  gap: 5px;
  max-width: none;
  font-size: clamp(1.95rem, 2.65vw, 3rem);
  line-height: .98;
  letter-spacing: 0;
  justify-items: center;
  text-align: center;
}
.access-hero-v3 h1.dashboard-access-title span {
  display: block;
  white-space: nowrap;
}
.access-hero-v3.is-active h1.dashboard-access-title span:first-child { color: var(--green); }
.access-hero-v3.is-active h1.dashboard-access-title span:last-child { color: #f4f8ff; }
.access-hero-v3 h1.dashboard-access-title span:first-child { font-size: .72em; }
.access-hero-v3 .access-hero-copy > p:not(.welcome-line) { max-width: 660px; margin-bottom: 22px; font-size: 12px; line-height: 1.7; }
.access-price-row { display: flex; align-items: center; gap: 15px; }
.access-price-row > div { min-width: 142px; padding-right: 16px; border-right: 1px solid var(--line); }
.access-price-row > div strong,
.access-price-row > div span { display: block; }
.access-price-row > div strong { font: 900 33px/1 var(--display); }
.access-price-row > div span { margin-top: 4px; color: var(--muted); font-size: 8px; font-weight: 800; text-transform: uppercase; }
.access-price-row .btn { min-height: 50px; padding-inline: 22px; }
.access-hero-side {
  align-self: stretch;
  min-height: 274px;
}
.access-insight-frame {
  width: 100%;
  height: 100%;
  min-height: 274px;
  display: block;
  border: 0;
  border-radius: 18px;
  background: #06111d;
  box-shadow: 0 22px 70px rgba(0,0,0,.28);
}

.proof-strip-v3 {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  margin: 12px 0 36px;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 13px;
  background: #07131f;
}
.proof-strip-v3 article { min-width: 0; padding: 18px 21px; border-right: 1px solid var(--line-soft); }
.proof-strip-v3 article:last-child { border-right: 0; }
.proof-strip-v3 span,
.proof-strip-v3 strong,
.proof-strip-v3 small { display: block; }
.proof-strip-v3 span { color: var(--red-2); font-size: 7px; font-weight: 900; letter-spacing: 1px; }
.proof-strip-v3 strong { margin: 3px 0; font: 900 28px/1 var(--display); }
.proof-strip-v3 small { font-size: 8px; }

.today-zone-v3,
.history-zone-v3 { margin: 0 0 38px; scroll-margin-top: 90px; }
.section-heading-v3 { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; margin-bottom: 14px; }
.section-heading-v3 > div > span { display: block; margin-bottom: 3px; color: var(--red-2); font-size: 8px; font-weight: 900; letter-spacing: 1px; }
.section-heading-v3 h2 { margin: 0; font-size: clamp(2rem, 3vw, 3.1rem); }
.section-heading-v3 > a,
.section-heading-v3 > b { color: var(--green); font-size: 9px; font-weight: 900; letter-spacing: .45px; }

.today-slip-grid-v3 { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 12px; }
.today-slip-card-v3 {
  overflow: hidden;
  padding: 18px;
  border: 1px solid #233e55;
  border-radius: 14px;
  background: linear-gradient(145deg,#0a1928,#06121e);
  box-shadow: var(--shadow-soft);
}
.today-slip-card-v3.locked { border-color: rgba(240,20,34,.37); }
.today-slip-card-v3 > header { display: grid; grid-template-columns: 58px minmax(0,1fr) auto; align-items: center; gap: 13px; }
.today-date-badge { width: 58px; height: 62px; display: grid; place-items: center; align-content: center; border: 1px solid #38556d; border-radius: 8px; background: #0b2031; }
.today-date-badge strong { font: 900 31px/1 var(--display); }
.today-date-badge span { color: var(--red-2); font-size: 8px; font-weight: 900; }
.today-slip-card-v3 header small { display:block; font-size: 8px; }
.today-slip-card-v3 header h3 { overflow:hidden; margin:2px 0 0; font-size:29px; text-overflow:ellipsis; white-space:nowrap; }
.live-chip { padding: 6px 9px; border-radius: 5px; background: var(--red); color: white; font-size: 8px; font-weight: 900; }
.today-slip-meta { display: grid; grid-template-columns: repeat(3,1fr); gap: 6px; margin: 14px 0; }
.today-slip-meta span { padding: 10px; border: 1px solid var(--line-soft); border-radius: 7px; color: #8797a9; font-size: 10px; text-align:center; }
.today-slip-meta b { color: white; }
.locked-picks-preview,
.open-picks-preview { position: relative; display:grid; gap:6px; min-height: 164px; margin-bottom: 12px; padding: 10px; overflow:hidden; border:1px solid var(--line-soft); border-radius:9px; background:#06111c; }
.open-picks-preview.pro-frame-preview {
  display: block;
  min-height: 232px;
  padding: 0;
  border: 0;
  border-radius: 14px;
  background: transparent;
}
.today-picks-iframe {
  width: 100%;
  height: 232px;
  display: block;
  border: 0;
  border-radius: 14px;
  background: #06111c;
}
.locked-picks-preview::before { content:""; position:absolute; inset:0; z-index:1; background:rgba(4,10,18,.47); backdrop-filter: blur(2px); }
.locked-picks-preview > div:not(.lock-seal),
.open-picks-preview > div { min-width:0; display:grid; grid-template-columns: 112px minmax(0,1fr) auto; align-items:center; gap:12px; padding:12px 10px; border-bottom:1px solid var(--line-soft); }
.locked-picks-preview > div:last-of-type,
.open-picks-preview > div:last-child { border-bottom:0; }
.locked-picks-preview span,
.open-picks-preview span { color:#77899c; font-size:9px; }
.locked-picks-preview strong,
.open-picks-preview strong { overflow:hidden; font-size:12px; text-overflow:ellipsis; white-space:nowrap; }
.locked-picks-preview em,
.open-picks-preview em { color:var(--green); font-size:10px; font-style:normal; font-weight:900; }
.open-picks-preview > .today-open-pick-row {
  grid-template-columns: 58px minmax(0, 1fr) 58px auto;
  gap: 14px;
  min-height: 72px;
  padding: 10px 12px;
}
.today-team-logo {
  width: 54px !important;
  height: 54px !important;
  display: grid;
  place-items: center;
  margin: 0;
  border-radius: 50%;
  border: 1px solid #34536d;
  background: radial-gradient(circle at 35% 25%, #183650, #071522 68%);
}
.today-team-logo img {
  width: 88% !important;
  height: 88% !important;
  object-fit: contain;
}
.today-open-pick-main {
  min-width: 0;
  display: grid;
  gap: 5px;
}
.today-open-pick-main small {
  color: #77899c;
  font-size: 11px;
  font-weight: 800;
}
.today-open-pick-main strong {
  font-size: 13px;
}
.lock-seal { position:absolute; inset:0; z-index:2; display:grid; place-items:center; align-content:center; gap:5px; text-align:center; }
.lock-seal b { width:48px; height:48px; display:grid; place-items:center; border:1px solid rgba(255,82,96,.45); border-radius:50%; background:rgba(240,20,34,.16); font-size:19px; }
.lock-seal span { color:white; font-size:10px; font-weight:900; }
.open-picks-preview p { align-self:center; margin:auto; font-size:10px; text-align:center; }
.simple-empty-v3 { padding:40px 20px; border:1px dashed #2e4a61; border-radius:13px; background:#07131f; text-align:center; }
.simple-empty-v3 > span { width:48px; height:48px; display:grid; place-items:center; margin:auto; border:1px solid #36546c; border-radius:50%; color:var(--green); font-size:20px; }
.simple-empty-v3 h3 { margin:13px 0 5px; }
.simple-empty-v3 p { margin:0; font-size:10px; }

.history-layout-v3 { display:grid; grid-template-columns:minmax(0,1fr) 340px; gap:12px; }
.history-slip-list-v3 { display:grid; gap:8px; }
.history-slip-card-v3 { min-width:0; display:grid; grid-template-columns:48px minmax(0,1fr) 92px 22px; align-items:center; gap:12px; padding:13px; border:1px solid #203b52; border-radius:11px; background:linear-gradient(145deg,#091824,#06121e); transition:.18s ease; }
.history-slip-card-v3:hover { transform:translateY(-2px); border-color:#3b5f7b; }
.history-date-v3 { width:48px; height:48px; display:grid; place-items:center; align-content:center; border:1px solid #344f66; border-radius:8px; background:#0b1f30; }
.history-date-v3 strong { font:900 23px/1 var(--display); }
.history-date-v3 span { color:var(--red-2); font-size:7px; font-weight:900; }
.history-copy-v3 { min-width:0; }
.history-copy-v3 small { display:block; font-size:9px; letter-spacing:.55px; }
.history-copy-v3 h3 { overflow:hidden; margin:3px 0 5px; font-size:22px; text-overflow:ellipsis; white-space:nowrap; }
.history-copy-v3 p { overflow:hidden; margin:0; font-size:10px; line-height:1.25; text-overflow:ellipsis; white-space:nowrap; }
.history-rate-v3 { text-align:right; }
.history-rate-v3 strong,
.history-rate-v3 span { display:block; }
.history-rate-v3 strong { color:var(--green); font:900 25px/1 var(--display); }
.history-rate-v3 span { margin-top:4px; color:var(--muted); font-size:9px; font-weight:900; letter-spacing:.45px; }
.history-arrow { color:#77899c; font-size:18px; }
.recent-result-panel-v3 { overflow:hidden; align-self:start; border:1px solid #203b52; border-radius:11px; background:linear-gradient(145deg,#091824,#06121e); }
.recent-result-panel-v3 > header { display:flex; align-items:center; justify-content:space-between; gap:8px; padding:15px; border-bottom:1px solid var(--line-soft); }
.recent-result-panel-v3 header small { display:block; font-size:9px; letter-spacing:.55px; }
.recent-result-panel-v3 header h3 { margin:3px 0 0; font-size:22px; }
.recent-result-panel-v3 header > span { width:28px; height:28px; display:grid; place-items:center; border-radius:50%; background:var(--red-soft); color:var(--red-2); font-size:9px; font-weight:900; }
.recent-result-list-v3 { padding:4px 13px 9px; }
.recent-result-row-v3 { min-width:0; display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:9px; padding:10px 0; border-bottom:1px solid var(--line-soft); }
.recent-result-row-v3:last-child { border-bottom:0; }
.result-badge-v3 { min-width:42px; padding:5px 7px; border-radius:5px; font-size:8px; font-weight:900; text-align:center; }
.result-badge-v3.won { background:var(--green); color:#042311; }
.result-badge-v3.lost { background:rgba(255,82,96,.17); color:#ff7c86; }
.recent-result-row-v3 div { min-width:0; }
.recent-result-row-v3 strong,
.recent-result-row-v3 small { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.recent-result-row-v3 strong { font-size:11px; }
.recent-result-row-v3 small { margin-top:3px; font-size:9px; line-height:1.22; }
.recent-result-row-v3 > b { color:#dfe6ed; font:900 15px var(--display); }
.empty-copy-v3 { padding:20px 0; font-size:9px; text-align:center; }

.unlock-bottom-v3 { display:flex; align-items:center; justify-content:space-between; gap:25px; margin-top:35px; padding:23px 25px; border:1px solid rgba(240,20,34,.44); border-radius:14px; background:linear-gradient(120deg,rgba(240,20,34,.15),#071522 64%); }
.unlock-bottom-v3 span { color:var(--red-2); font-size:8px; font-weight:900; letter-spacing:1px; }
.unlock-bottom-v3 h2 { margin:2px 0 4px; font-size:35px; }
.unlock-bottom-v3 p { margin:0; font-size:9px; }
.compact-footer-v3 { margin-top:30px; }

/* Simplified payment gateway */
.payment-page-v3 { max-width: 900px; }
.payment-back-v3 { display:inline-flex; align-items:center; margin:3px 0 14px; color:#8798aa; font-size:9px; font-weight:900; }
.payment-back-v3:hover { color:white; }
.payment-shell-v3 { overflow:hidden; border:1px solid #27445b; border-radius:18px; background:#07131f; box-shadow:var(--shadow); }
.payment-hero-v3 { display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:18px; padding:25px 28px; border-bottom:1px solid var(--line); background:linear-gradient(120deg,rgba(240,20,34,.17),#071522 58%,rgba(45,168,255,.08)); }
.payment-lock-v3 { width:58px; height:58px; display:grid; place-items:center; border:1px solid rgba(240,20,34,.46); border-radius:13px; background:rgba(240,20,34,.14); font-size:25px; }
.payment-hero-v3 h1 { margin:2px 0 7px; font-size:clamp(2.3rem,4vw,3.7rem); }
.payment-hero-v3 p { max-width:520px; margin:0; font-size:10px; }
.payment-total-v3 { min-width:125px; padding:12px; border:1px solid rgba(34,211,107,.3); border-radius:10px; background:rgba(34,211,107,.08); text-align:right; }
.payment-total-v3 strong { font:900 35px/1 var(--display); }
.payment-total-v3 span { margin-left:4px; color:var(--green); font-size:10px; font-weight:900; }
.payment-total-v3 small { display:block; margin-top:5px; color:#8ca0b1; font-size:7px; font-weight:900; }
.payment-benefits-v3 { display:grid; grid-template-columns:repeat(4,1fr); border-bottom:1px solid var(--line); background:#06111c; }
.payment-benefits-v3 span { padding:13px 9px; border-right:1px solid var(--line-soft); color:#aeb9c6; font-size:8px; font-weight:800; text-align:center; }
.payment-benefits-v3 span:last-child { border-right:0; }
.payment-benefits-v3 b { color:var(--green); }
.payment-form-v3 { padding:24px 28px 28px; }
.payment-step-v3 + .payment-step-v3 { margin-top:23px; }
.step-heading-v3 { display:flex; align-items:center; gap:10px; margin-bottom:11px; }
.step-heading-v3 > span { width:28px; height:28px; display:grid; place-items:center; flex:0 0 auto; border-radius:50%; background:var(--red); color:white; font:900 12px var(--display); }
.step-heading-v3 small { display:block; font-size:6px; }
.step-heading-v3 h2 { margin:1px 0 0; font-size:22px; }
.network-grid-v3 { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:9px; }
.network-card-v3 { position:relative; min-width:0; min-height:132px; display:grid; place-items:center; align-content:center; padding:12px 9px; border:1px solid #29455c; border-radius:11px; background:#091824; text-align:center; cursor:pointer; transition:.18s ease; }
.network-card-v3:hover { transform:translateY(-2px); border-color:#50718c; }
.network-card-v3.selected { border-color:var(--green); background:linear-gradient(145deg,rgba(34,211,107,.12),#081724); box-shadow:0 0 0 1px rgba(34,211,107,.12),0 10px 30px rgba(0,0,0,.2); }
.network-card-v3 input { position:absolute; opacity:0; pointer-events:none; }
.network-logo-v3 { width:100%; height:50px; display:grid; place-items:center; margin-bottom:7px; padding:5px; border-radius:7px; background:#fff; }
.network-logo-v3 img { max-width:100%; max-height:40px; object-fit:contain; }
.network-card-v3 strong { overflow:hidden; max-width:100%; font-size:10px; text-overflow:ellipsis; white-space:nowrap; }
.network-card-v3 small { font-size:7px; }
.network-card-v3 i { position:absolute; right:8px; top:8px; width:18px; height:18px; display:grid; place-items:center; border:1px solid #3a566d; border-radius:50%; color:transparent; font-size:8px; font-style:normal; }
.network-card-v3.selected i { border-color:var(--green); background:var(--green); color:#042311; }
.phone-field-v3 { display:grid; grid-template-columns:52px minmax(0,1fr); align-items:center; min-height:56px; overflow:hidden; border:1px solid #29465e; border-radius:10px; background:#071522; }
.phone-icon-v3 { height:100%; display:grid; place-items:center; border-right:1px solid var(--line); background:#0b1d2c; color:var(--red-2); font:900 8px var(--mono); }
.phone-field-v3 input { width:100%; height:54px; min-width:0; padding:0 14px; border:0; outline:0; background:transparent; color:white; font-size:15px; font-weight:800; }
.phone-help-v3 { margin:7px 0 0; font-size:8px; }
.payment-confirm-v3 { display:grid; grid-template-columns:repeat(3,1fr); margin:22px 0 13px; overflow:hidden; border:1px solid var(--line); border-radius:10px; background:#06111c; }
.payment-confirm-v3 > div { min-width:0; padding:12px 14px; border-right:1px solid var(--line-soft); }
.payment-confirm-v3 > div:last-child { border-right:0; }
.payment-confirm-v3 span,
.payment-confirm-v3 strong { display:block; }
.payment-confirm-v3 span { color:var(--muted); font-size:7px; }
.payment-confirm-v3 strong { overflow:hidden; margin-top:3px; font-size:10px; text-overflow:ellipsis; white-space:nowrap; }
.payment-submit-v3 { min-height:54px; font-size:12px; }
.payment-security-v3 { display:flex; align-items:center; justify-content:center; gap:8px; margin-top:11px; text-align:center; }
.payment-security-v3 > span { color:var(--green); }
.payment-security-v3 p { margin:0; font-size:7.5px; }

/* Historical slip is view-only, but visible to limited members. */
.workspace-history-summary { display:grid; grid-template-columns:repeat(3, minmax(88px,1fr)); gap:7px; }
.workspace-history-summary > div { padding:10px 12px; border:1px solid var(--line); border-radius:8px; background:#081522; }
.workspace-history-summary small,
.workspace-history-summary strong { display:block; }
.workspace-history-summary small { font-size:6px; }
.workspace-history-summary strong { margin-top:3px; font:900 20px var(--display); }
.historical-result-bar { display:grid; grid-template-columns:auto minmax(0,1fr); align-items:center; gap:10px; margin:0 12px 10px; padding:9px 11px; border-radius:7px; }
.historical-result-bar.won { border:1px solid rgba(34,211,107,.3); background:rgba(34,211,107,.09); }
.historical-result-bar.lost { border:1px solid rgba(255,82,96,.3); background:rgba(255,82,96,.08); }
.historical-result-bar > span { min-width:47px; color:var(--green); font-size:8px; font-weight:900; }
.historical-result-bar.lost > span { color:#ff7883; }
.historical-result-bar small,
.historical-result-bar strong { display:block; }
.historical-result-bar small { font-size:6px; }
.historical-result-bar strong { margin-top:2px; font-size:9px; }
.history-view-label { color:#708296; font-size:7px; font-weight:900; }
.status-badge.neutral { border-color:rgba(45,168,255,.34); background:rgba(45,168,255,.1); color:#62bfff; }

@media (max-width: 760px) {
  body.member-app { padding-bottom: calc(75px + env(safe-area-inset-bottom)); }
  body.member-app main { padding-top: 9px; }
  .member-home-v3,
  .payment-page-v3 { width: calc(100% - 18px); padding:0 0 24px; }

  .access-hero-v3 { display:block; min-height:0; padding:18px 16px 16px; border-radius:14px; }
  .access-state-pill { padding:6px 8px; font-size:7px; }
  .welcome-line { margin-top:13px; font-size:9px; }
  .access-hero-v3 h1 { margin-bottom:10px; font-size:37px; line-height:.91; }
  .access-hero-v3 h1.dashboard-access-title {
    gap: 4px;
    font-size: clamp(1.28rem, 5.25vw, 1.62rem);
    line-height: 1.02;
  }
  .access-hero-v3 h1.dashboard-access-title span:first-child { font-size: .66em; }
  .access-hero-v3 .access-hero-copy > p:not(.welcome-line) { margin-bottom:15px; font-size:9px; line-height:1.55; }
  .access-price-row { display:grid; grid-template-columns:1fr; gap:10px; }
  .access-price-row .access-days-left { display:none; }
  .access-price-row > div { display:flex; align-items:baseline; gap:6px; min-width:0; padding:0; border:0; }
  .access-price-row > div strong { font-size:29px; }
  .access-price-row > div span { margin:0; }
  .access-price-row .btn { width:100%; min-height:48px; padding:12px 10px; }
  .access-hero-side { display:block; min-height:210px; margin-top:13px; }
  .access-insight-frame { min-height:210px; border-radius:14px; }

  .proof-strip-v3 { grid-template-columns:repeat(2,1fr); margin:8px 0 24px; border-radius:11px; }
  .proof-strip-v3 article { padding:12px; }
  .proof-strip-v3 article:nth-child(2) { border-right:0; }
  .proof-strip-v3 article:nth-child(-n+2) { border-bottom:1px solid var(--line-soft); }
  .proof-strip-v3 strong { font-size:22px; }

  .today-zone-v3,
  .history-zone-v3 { margin-bottom:25px; }
  .section-heading-v3 { align-items:center; margin-bottom:10px; }
  .section-heading-v3 h2 { font-size:28px; }
  .section-heading-v3 > div > span,
  .section-heading-v3 > a,
  .section-heading-v3 > b { font-size:6.5px; }
  .today-slip-grid-v3 { grid-template-columns:1fr; }
  .today-slip-card-v3 { padding:13px; border-radius:12px; }
  .today-slip-card-v3 > header { grid-template-columns:42px minmax(0,1fr) auto; gap:8px; }
  .today-date-badge { width:42px; height:46px; }
  .today-date-badge strong { font-size:22px; }
  .today-slip-card-v3 header h3 { font-size:16px; line-height:1.08; }
  .today-slip-meta { margin:11px 0; }
  .today-slip-meta span { padding:7px 3px; font-size:6.5px; }
  .locked-picks-preview,
  .open-picks-preview { min-height:148px; margin-bottom:9px; }
  .open-picks-preview.pro-frame-preview { min-height: 224px; }
  .today-picks-iframe { height: 224px; }
  .locked-picks-preview > div:not(.lock-seal),
  .open-picks-preview > div { grid-template-columns:64px minmax(0,1fr) auto; padding:8px 3px; }
  .today-slip-card-v3 .btn { min-height:47px; font-size:9px; }

  .history-layout-v3 { grid-template-columns:1fr; }
  .history-slip-card-v3 { grid-template-columns:42px minmax(0,1fr) 67px; gap:8px; padding:10px; }
  .history-date-v3 { width:42px; height:44px; }
  .history-date-v3 strong { font-size:21px; }
  .history-copy-v3 small { font-size:8px; }
  .history-copy-v3 h3 { font-size:19px; }
  .history-copy-v3 p { font-size:8.8px; }
  .history-rate-v3 strong { font-size:23px; }
  .history-rate-v3 span { font-size:8px; }
  .history-arrow { display:none; }
  .recent-result-panel-v3 { margin-top:2px; }
  .recent-result-panel-v3 > header { padding:12px; }
  .recent-result-panel-v3 header small { font-size:8px; }
  .recent-result-panel-v3 header h3 { font-size:20px; }
  .recent-result-list-v3 { padding-inline:11px; }
  .recent-result-row-v3 strong { font-size:10px; }
  .recent-result-row-v3 small { font-size:8.5px; }
  .result-badge-v3 { min-width:40px; font-size:7.5px; }
  .unlock-bottom-v3 { display:block; padding:17px; }
  .unlock-bottom-v3 h2 { font-size:29px; }
  .unlock-bottom-v3 .btn { width:100%; min-height:48px; margin-top:13px; }
  .compact-footer-v3 { display:block; padding-bottom:3px; text-align:center; }
  .compact-footer-v3 p { margin-top:6px; }

  .payment-page-v3 { padding-top:1px; }
  .payment-back-v3 { margin:2px 2px 8px; font-size:7px; }
  .payment-shell-v3 { border-radius:14px; }
  .payment-hero-v3 { grid-template-columns:42px minmax(0,1fr); gap:10px; padding:15px 13px; }
  .payment-lock-v3 { width:42px; height:42px; border-radius:9px; font-size:18px; }
  .payment-hero-v3 h1 { font-size:31px; }
  .payment-hero-v3 p { font-size:8px; line-height:1.45; }
  .payment-total-v3 { grid-column:1 / -1; min-width:0; display:flex; align-items:baseline; justify-content:center; gap:5px; padding:9px; text-align:center; }
  .payment-total-v3 strong { font-size:29px; }
  .payment-total-v3 small { margin:0 0 0 8px; }
  .payment-benefits-v3 { grid-template-columns:repeat(2,1fr); }
  .payment-benefits-v3 span { padding:9px 5px; font-size:6.5px; }
  .payment-benefits-v3 span:nth-child(2) { border-right:0; }
  .payment-benefits-v3 span:nth-child(-n+2) { border-bottom:1px solid var(--line-soft); }
  .payment-form-v3 { padding:15px 13px 17px; }
  .payment-step-v3 + .payment-step-v3 { margin-top:17px; }
  .step-heading-v3 { margin-bottom:8px; }
  .step-heading-v3 > span { width:25px; height:25px; font-size:10px; }
  .step-heading-v3 h2 { font-size:19px; }
  .network-grid-v3 { grid-template-columns:repeat(2,minmax(0,1fr)); gap:7px; }
  .network-card-v3 { min-height:103px; padding:9px 7px; }
  .network-logo-v3 { height:39px; margin-bottom:5px; padding:4px; }
  .network-logo-v3 img { max-height:31px; }
  .network-card-v3 strong { font-size:8px; }
  .network-card-v3 small { font-size:6px; }
  .phone-field-v3 { min-height:49px; grid-template-columns:45px minmax(0,1fr); }
  .phone-field-v3 input { height:47px; padding-inline:10px; font-size:13px; }
  .phone-help-v3 { font-size:7px; }
  .payment-confirm-v3 { grid-template-columns:1fr; margin:15px 0 10px; }
  .payment-confirm-v3 > div { display:flex; align-items:center; justify-content:space-between; gap:8px; padding:9px 11px; border-right:0; border-bottom:1px solid var(--line-soft); }
  .payment-confirm-v3 > div:last-child { border-bottom:0; }
  .payment-confirm-v3 strong { max-width:65%; margin:0; text-align:right; }
  .payment-submit-v3 { min-height:50px; font-size:10px; }
  .payment-security-v3 p { font-size:6.5px; }

  .workspace-history-summary { width:100%; grid-template-columns:repeat(3,1fr); }
  .workspace-history-summary > div { padding:8px; }
  .workspace-history-summary strong { font-size:17px; }
  .historical-result-bar { margin-inline:9px; }

  .subscription-pill.expired { max-width:66px; overflow:hidden; padding:0 7px; font-size:7px; white-space:nowrap; }
  .simple-member-dock { grid-template-columns:repeat(5,1fr); }
}

@media (max-width: 390px) {
  .member-home-v3,
  .payment-page-v3 { width:calc(100% - 14px); }
  .access-hero-v3 { padding:16px 13px 14px; }
  .access-hero-v3 h1 { font-size:34px; }
  .access-hero-v3 h1.dashboard-access-title { font-size: clamp(1.12rem, 5.35vw, 1.42rem); }
  .access-hero-v3 h1.dashboard-access-title span:first-child { font-size: .62em; }
  .section-heading-v3 h2 { font-size:26px; }
  .history-slip-card-v3 { grid-template-columns:40px minmax(0,1fr) 60px; }
  .navbar-right { gap:5px; }
  .navbar-right .user-avatar { width:30px; height:30px; }
  .payment-hero-v3 h1 { font-size:28px; }
}
.single-pricing-grid { width:min(620px,100%); grid-template-columns:1fr; margin-inline:auto; }
.single-pricing-grid .pricing-card { min-height:0; }
.package-pricing-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.package-pricing-grid .pricing-card {
  min-height: 100%;
}
.package-pricing-grid .pricing-card.popular {
  transform: translateY(-6px);
}
@media (max-width: 900px) {
  .package-pricing-grid {
    grid-template-columns: 1fr;
  }
  .package-pricing-grid .pricing-card.popular {
    transform: none;
  }
}

.bottom-showcase {
  align-items: stretch;
  grid-auto-rows: 1fr;
}
.bottom-showcase > .member-live-panel {
  min-height: 0 !important;
  height: auto;
  display: flex;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
.bottom-showcase > .member-live-panel .member-live-frame {
  flex: 1 1 auto;
  min-height: 100%;
  height: auto;
  border-radius: 10px;
}
.bottom-showcase > .ai-feed-panel {
  min-height: 0 !important;
  display: flex;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
.bottom-showcase > .ai-feed-panel .ai-feed-frame {
  flex: 1 1 auto;
  width: 100%;
  min-height: 100%;
  border: 0;
  border-radius: 10px;
  background: #071421;
}

@media (max-width: 640px) {
  .bottom-showcase {
    grid-auto-rows: auto;
  }
  .bottom-showcase > .member-live-panel {
    min-height: 520px !important;
  }
  .bottom-showcase > .ai-feed-panel {
    min-height: 520px !important;
  }
}

.landing-locked-card {
  position: relative;
  cursor: pointer;
  transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}
.landing-locked-card:hover,
.landing-locked-card:focus-visible {
  transform: translateY(-3px);
  border-color: #3f607a;
  box-shadow: 0 18px 36px rgba(0,0,0,.22);
  outline: 0;
}
.pick-secret {
  position: relative;
  overflow: hidden;
  border-top: 1px solid rgba(255,255,255,.03);
}
.pick-secret::after {
  content: "SIGN UP TO UNLOCK";
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  color: #fff;
  font-size: 8px;
  font-weight: 900;
  letter-spacing: .9px;
  text-shadow: 0 2px 12px rgba(0,0,0,.65);
  background: linear-gradient(90deg, rgba(7,20,33,.34), rgba(7,20,33,.62), rgba(7,20,33,.34));
  pointer-events: none;
}
.pick-secret .pick-main,
.pick-secret .pick-bottom {
  filter: blur(5px);
  opacity: .55;
  user-select: none;
}
.locked-pick-action {
  width: 100%;
  border: 0;
  border-top: 1px solid var(--line-soft);
  background: transparent;
  color: #aeb9c5;
  cursor: pointer;
  font-family: inherit;
  text-align: left;
}
.landing-locked-card:hover .locked-pick-action {
  color: #fff;
  background: rgba(45,168,255,.06);
}
.recent-see-all {
  font-size: 10px;
  font-weight: 900;
}
.recent-see-all:hover {
  color: #fff;
}
.signup-gate-modal {
  position: fixed;
  inset: 0;
  z-index: 120;
  display: none;
  place-items: center;
  padding: 20px;
}
.signup-gate-modal.active {
  display: grid;
}
.signup-gate-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(1,7,13,.78);
  backdrop-filter: blur(8px);
}
.signup-gate-card {
  position: relative;
  width: min(430px, 100%);
  padding: 24px;
  border: 1px solid #31516a;
  border-radius: 10px;
  background: radial-gradient(circle at 18% 0, rgba(239,49,36,.22), transparent 34%), linear-gradient(145deg, #0d1d30, #06111d);
  box-shadow: 0 28px 80px rgba(0,0,0,.5);
}
.signup-gate-card h2 {
  margin: 6px 0 8px;
  font-size: 34px;
}
.signup-gate-card p {
  margin: 0 0 18px;
  color: #c6d4e1;
  line-height: 1.55;
}
.signup-gate-close {
  position: absolute;
  top: 10px;
  right: 10px;
  width: 32px;
  height: 32px;
  border: 1px solid #29455d;
  border-radius: 50%;
  background: rgba(255,255,255,.05);
  color: #fff;
  cursor: pointer;
  font-size: 20px;
  line-height: 1;
}
.signup-gate-actions {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}
.verdict-secret {
  position: relative;
  overflow: hidden;
  margin-top: 8px;
}
.verdict-secret::after {
  content: "AI VERDICT LOCKED";
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  border-radius: 8px;
  background: linear-gradient(90deg, rgba(8,23,37,.42), rgba(8,23,37,.72), rgba(8,23,37,.42));
  color: #fff;
  font-size: 8px;
  font-weight: 900;
  letter-spacing: 1px;
}
.verdict-secret .ai-verdict-line,
.verdict-secret .flex,
.verdict-secret .progress,
.verdict-secret .model-breakdown {
  filter: blur(5px);
  opacity: .55;
  user-select: none;
}
.verdict-unlock {
  display: flex;
  justify-content: space-between;
  margin-top: 12px;
  padding: 10px 11px;
  border: 1px solid rgba(239,49,36,.35);
  border-radius: 7px;
  background: rgba(239,49,36,.12);
  color: #fff;
  font-size: 8px;
  font-weight: 900;
}
.verdict-unlock:hover {
  background: var(--red);
  color: #fff;
}
.premium-hero-copy {
  padding: 0 !important;
  min-height: 520px;
  display: flex;
  overflow: hidden;
  background: #06101b;
}
.hero-copy-frame {
  display: block;
  flex: 1 1 auto;
  width: 100%;
  min-height: 520px;
  border: 0;
}

@media (max-width: 920px) {
  .premium-hero-copy,
  .hero-copy-frame {
    min-height: 520px;
  }
}

@media (max-width: 520px) {
  .premium-hero-copy,
  .hero-copy-frame {
    min-height: 360px;
    height: 360px;
  }
  .showcase-hero .hero-athlete {
    display: none;
  }
}

.hero-athlete img {
  animation: heroAthleteZoom 9s ease-in-out infinite;
  transform-origin: center center;
  will-change: transform;
}

.cta-athlete {
  animation: ctaAthleteZoom 10.5s ease-in-out infinite;
  transform-origin: center center;
  will-change: transform;
}
.bottom-panel.cta {
  display: flex;
  flex-direction: column;
  min-height: 520px;
  overflow: hidden;
}
.bottom-panel.cta h3,
.bottom-panel.cta p,
.bottom-panel.cta .btn {
  position: relative;
  z-index: 3;
}
.bottom-panel.cta .btn {
  width: max-content;
  margin: 10px 0 18px;
}
.bottom-panel.cta .cta-athlete {
  position: relative;
  z-index: 1;
  width: 100%;
  min-height: 0;
  flex: 1 1 auto;
  object-fit: cover;
  object-position: center top;
}

@keyframes heroAthleteZoom {
  0%, 100% {
    transform: scale(1);
  }
  50% {
    transform: scale(1.075);
  }
}

@keyframes ctaAthleteZoom {
  0%, 100% {
    transform: scale(1);
  }
  50% {
    transform: scale(1.065);
  }
}

.result-stat {
  position: relative;
  overflow: hidden;
}
.result-stat::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(115deg, transparent 0 34%, rgba(255,255,255,.055) 45%, transparent 56%);
  transform: translateX(-120%);
  pointer-events: none;
}
.results-grid.is-animated .result-stat::before {
  animation: resultSweep 2.8s ease-in-out infinite;
}
.results-grid.is-animated .result-stat:nth-child(2)::before { animation-delay: .18s; }
.results-grid.is-animated .result-stat:nth-child(3)::before { animation-delay: .36s; }
.results-grid.is-animated .result-stat:nth-child(4)::before { animation-delay: .54s; }
.result-stat .sparkline {
  position: relative;
  transform-origin: bottom;
  transform: scaleY(.28) translateY(8px);
  opacity: .55;
  transition: transform .8s ease, opacity .8s ease;
}
.result-stat .sparkline::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, transparent, rgba(34,211,107,.35), transparent);
  transform: translateX(-110%);
}
.results-grid.is-animated .sparkline {
  transform: scaleY(1) translateY(0);
  opacity: 1;
  animation: sparkPulse 2.6s ease-in-out infinite;
}
.results-grid.is-animated .sparkline::after {
  animation: sparkFlow 1.9s ease-in-out infinite;
}

@keyframes resultSweep {
  0% { transform: translateX(-120%); }
  55%, 100% { transform: translateX(120%); }
}

@keyframes sparkFlow {
  0% { transform: translateX(-110%); }
  100% { transform: translateX(110%); }
}

@keyframes sparkPulse {
  0%, 100% { filter: brightness(1); }
  50% { filter: brightness(1.55); }
}

.public-wins-page {
  width: min(1440px, calc(100% - 28px));
  margin: 16px auto 34px;
}
.wins-hero {
  min-height: 470px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 360px;
  gap: 22px;
  align-items: stretch;
  padding: 34px;
  border: 1px solid #304b63;
  border-radius: 14px;
  background: radial-gradient(circle at 12% 15%, rgba(45,168,255,.24), transparent 32%), radial-gradient(circle at 88% 8%, rgba(239,49,36,.24), transparent 30%), linear-gradient(145deg, #0b1d30, #06101b 70%);
  overflow: hidden;
}
.wins-hero h1 {
  max-width: 760px;
  margin: 18px 0 12px;
  font-size: clamp(1.9rem, 2.7vw, 3rem);
  line-height: 1.05;
  text-align: center;
}
.wins-hero h1 span {
  display: inline;
  color: var(--red-2);
}
.wins-hero p {
  max-width: 720px;
  color: #c2d0df;
  font-size: 14px;
  line-height: 1.65;
}
.wins-hero-actions {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  margin-top: 24px;
}
.wins-score-card {
  position: relative;
  display: grid;
  align-content: center;
  justify-items: center;
  padding: 24px;
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 12px;
  background: linear-gradient(145deg, rgba(255,255,255,.08), rgba(255,255,255,.025));
  text-align: center;
}
.wins-score-card small,
.wins-score-card span {
  color: #92a7ba;
  font-size: 9px;
  font-weight: 900;
  letter-spacing: 1px;
}
.wins-score-card strong {
  margin-top: 12px;
  font: 900 92px/.85 var(--display);
}
.wins-score-card p {
  max-width: 260px;
  margin: 18px 0 0;
  font-size: 11px;
}
.wins-ring {
  width: 170px;
  height: 170px;
  display: grid;
  place-items: center;
  margin-top: 18px;
  border-radius: 50%;
  background: conic-gradient(var(--green) 0 87%, #1b3347 87%);
  animation: winsRingPulse 2.8s ease-in-out infinite;
}
.wins-ring i {
  width: 132px;
  height: 132px;
  border-radius: 50%;
  background: #071421;
}
.wins-proof-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin: 14px 0;
  border: 1px solid var(--line);
  border-radius: 10px;
  overflow: hidden;
}
.wins-proof-grid article {
  padding: 18px;
  border-right: 1px solid var(--line);
  background: #081725;
}
.wins-proof-grid article:last-child {
  border-right: 0;
}
.wins-proof-grid small,
.wins-proof-grid span {
  display: block;
  color: #8fa3b7;
  font-size: 8px;
  font-weight: 900;
}
.wins-proof-grid strong {
  display: block;
  margin: 8px 0 4px;
  font: 900 38px/.9 var(--display);
}
.wins-board {
  padding: 22px;
  border: 1px solid #263f56;
  border-radius: 12px;
  background: #071421;
}
.wins-board-head {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: center;
  margin-bottom: 15px;
}
.wins-board-head h2 {
  margin: 4px 0 0;
}
.wins-list {
  display: grid;
  gap: 10px;
}
.win-history-card {
  display: grid;
  grid-template-columns: 92px minmax(0, 1fr) 180px;
  gap: 14px;
  align-items: center;
  padding: 14px;
  border: 1px solid rgba(255,255,255,.09);
  border-radius: 9px;
  background: linear-gradient(145deg, rgba(255,255,255,.045), rgba(255,255,255,.018));
  transition: transform .18s ease, border-color .18s ease;
}
.win-history-card:hover {
  transform: translateY(-2px);
  border-color: #3d617c;
}
.win-history-status {
  display: grid;
  gap: 6px;
}
.win-history-status span {
  width: max-content;
  padding: 6px 9px;
  border-radius: 6px;
  background: var(--green);
  color: #03210f;
  font-size: 8px;
  font-weight: 900;
}
.win-history-status b {
  font-size: 18px;
}
.win-history-copy small,
.win-history-copy p,
.win-history-meter span {
  color: #94a7b9;
}
.win-history-copy h3 {
  margin: 4px 0 5px;
  font-size: 24px;
}
.win-history-copy p {
  margin: 0;
  font-size: 11px;
}
.win-history-meter strong,
.win-history-meter span {
  display: block;
  text-align: right;
}
.win-history-meter strong {
  font: 900 28px/.9 var(--display);
}
.win-history-meter span {
  margin: 4px 0 8px;
  font-size: 7px;
  font-weight: 900;
}
.win-history-meter .progress {
  height: 6px;
  background: #172b3e;
}
.win-history-meter .progress i {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--green), #2da8ff);
}
.wins-hook {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  margin-top: 14px;
  padding: 24px;
  border: 1px solid #ef3124;
  border-radius: 12px;
  background: linear-gradient(135deg, rgba(239,49,36,.16), rgba(45,168,255,.08));
}
.wins-hook h2,
.wins-hook p {
  margin: 0;
}
.wins-hook span {
  color: var(--red-2);
  font-size: 9px;
  font-weight: 900;
}
.wins-hook p {
  margin-top: 6px;
  color: #c5d4e3;
}

@keyframes winsRingPulse {
  0%, 100% { transform: scale(1); filter: brightness(1); }
  50% { transform: scale(1.035); filter: brightness(1.25); }
}

@media (max-width: 900px) {
  .wins-hero,
  .wins-proof-grid,
  .win-history-card {
    grid-template-columns: 1fr;
  }
  .wins-proof-grid article {
    border-right: 0;
    border-bottom: 1px solid var(--line);
  }
  .wins-proof-grid article:last-child {
    border-bottom: 0;
  }
  .wins-board-head,
  .wins-hook {
    display: block;
  }
  .wins-hook .btn {
    margin-top: 15px;
  }
  .win-history-meter strong,
  .win-history-meter span {
    text-align: left;
  }
  .wins-hero h1 {
    font-size: 24px;
    line-height: 1.1;
  }
  .wins-hero h1 span {
    display: block;
  }
}

.about-page {
  width: min(1440px, calc(100% - 28px));
  margin: 16px auto 34px;
}
.about-page .hero-label,
.about-page .section-kicker,
.about-page .panel-kicker,
.about-page .popular-label,
.about-page .back-link {
  font-family: var(--font);
  font-size: 8px;
  letter-spacing: .55px;
  line-height: 1.2;
}
.about-page .btn {
  font-family: var(--font);
  font-size: 10px;
  letter-spacing: .15px;
}
.about-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 390px;
  gap: 22px;
  min-height: 520px;
  padding: 36px;
  border: 1px solid #304b63;
  border-radius: 14px;
  background: radial-gradient(circle at 12% 14%, rgba(45,168,255,.24), transparent 32%), radial-gradient(circle at 84% 5%, rgba(239,49,36,.23), transparent 30%), linear-gradient(145deg, #0b1d30, #06101b 70%);
}
.about-hero h1 {
  max-width: 850px;
  margin: 18px 0 12px;
  font-family: var(--font);
  font-size: clamp(1.35rem, 2.4vw, 2.45rem);
  font-weight: 950;
  letter-spacing: 0;
  line-height: 1.02;
  text-transform: none;
}
.about-hero h1 span {
  display: block;
  color: var(--red-2);
}
.about-hero p {
  max-width: 760px;
  color: #c4d3e1;
  font-size: 14px;
  line-height: 1.68;
}
.about-hero-actions {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  margin-top: 24px;
}
.about-command-card {
  display: grid;
  align-content: center;
  gap: 14px;
  padding: 24px;
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 12px;
  background: linear-gradient(145deg, rgba(255,255,255,.08), rgba(255,255,255,.025));
}
.about-command-card small,
.about-command-card span {
  color: #9db0c2;
  font-size: 8px;
  font-weight: 900;
  letter-spacing: .45px;
  text-transform: uppercase;
}
.about-command-card strong {
  font: 950 38px/1 var(--font);
  letter-spacing: 0;
}
.about-signal-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}
.about-signal-list span {
  padding: 9px;
  border: 1px solid rgba(45,168,255,.18);
  border-radius: 7px;
  background: rgba(45,168,255,.055);
}
.about-section,
.about-process,
.about-use,
.about-packages,
.about-trust,
.about-cta {
  margin-top: 14px;
  padding: 24px;
  border: 1px solid #263f56;
  border-radius: 12px;
  background: #071421;
}
.about-section-head {
  max-width: 820px;
  margin-bottom: 16px;
}
.about-section-head h2 {
  margin: 5px 0 0;
  font-family: var(--font);
  font-size: clamp(1.65rem, 2.85vw, 2.55rem);
  font-weight: 950;
  letter-spacing: 0;
  line-height: 1.12;
  text-transform: none;
}
.about-feature-grid,
.process-steps,
.use-grid,
.about-trust {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}
.about-feature-grid article,
.process-steps article,
.use-card,
.about-trust article {
  padding: 16px;
  border: 1px solid rgba(255,255,255,.09);
  border-radius: 9px;
  background: linear-gradient(145deg, rgba(255,255,255,.045), rgba(255,255,255,.018));
}
.about-feature-grid span,
.process-steps b {
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;
  margin-bottom: 12px;
  border-radius: 8px;
  background: var(--red);
  color: #fff;
  font-weight: 900;
}
.about-feature-grid h3,
.process-steps h3,
.use-card strong,
.about-trust h3 {
  display: block;
  margin: 0 0 7px;
  font-family: var(--font);
  font-size: 17px;
  font-weight: 900;
  letter-spacing: 0;
  line-height: 1.18;
  text-transform: none;
}
.about-feature-grid p,
.process-steps p,
.use-card p,
.about-trust p {
  margin: 0;
  color: #aebdca;
  font-size: 12px;
  line-height: 1.55;
}
.about-trust {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.about-cta {
  display: flex;
  justify-content: space-between;
  gap: 18px;
  align-items: center;
  border-color: #ef3124;
  background: linear-gradient(135deg, rgba(239,49,36,.16), rgba(45,168,255,.08));
}
.about-cta span {
  color: var(--red-2);
  font-size: 8px;
  font-weight: 900;
  letter-spacing: .45px;
  text-transform: uppercase;
}
.about-cta h2,
.about-cta p {
  margin: 0;
}
.about-cta h2 {
  font-family: var(--font);
  font-size: clamp(1.55rem, 2.5vw, 2.25rem);
  font-weight: 950;
  letter-spacing: 0;
  line-height: 1.12;
  text-transform: none;
}
.about-cta p {
  margin-top: 6px;
  color: #c5d4e3;
}

@media (max-width: 980px) {
  .about-hero,
  .about-feature-grid,
  .process-steps,
  .use-grid,
  .about-trust {
    grid-template-columns: 1fr;
  }
  .about-cta {
    display: block;
  }
  .about-cta .btn {
    margin-top: 15px;
  }
  .about-hero {
    min-height: 0;
    padding: 24px 18px;
  }
  .about-hero h1 {
    font-size: clamp(1.25rem, 5vw, 1.65rem);
    line-height: 1.05;
  }
  .about-hero p {
    font-size: 12px;
    line-height: 1.58;
  }
  .about-command-card strong {
    font-size: 30px;
  }
  .about-section,
  .about-process,
  .about-use,
  .about-packages,
  .about-trust,
  .about-cta {
    padding: 18px;
  }
  .about-section-head h2,
  .about-cta h2 {
    font-size: clamp(1.35rem, 6vw, 2rem);
    line-height: 1.15;
  }
  .about-page .hero-label,
  .about-page .section-kicker,
  .about-page .panel-kicker,
  .about-page .popular-label,
  .about-page .back-link {
    font-size: 7.5px;
    letter-spacing: .45px;
  }
}

.team-badge,
.pick-team-icon {
  width: 58px !important;
  height: 58px !important;
}
.team-logo-badge img {
  width: 88% !important;
  height: 88% !important;
}
.team-monogram {
  width: 54px !important;
  height: 54px !important;
}
.fixture-team {
  grid-template-columns: 54px 1fr !important;
  gap: 12px !important;
}
.fixture-team.away {
  grid-template-columns: 1fr 54px !important;
}
.pick-teams {
  padding-block: 17px !important;
}

@media (max-width: 640px) {
  .team-badge,
  .pick-team-icon {
    width: 64px !important;
    height: 64px !important;
  }
  .team-monogram {
    width: 58px !important;
    height: 58px !important;
  }
  .fixture-team {
    grid-template-columns: 58px 1fr !important;
    gap: 10px !important;
  }
  .fixture-team.away {
    grid-template-columns: 1fr 58px !important;
  }
}

.pick-card-top,
.pick-action,
.filter-chip,
.section-link,
.recent-see-all,
.recent-win div strong,
.recent-win div small,
.recent-win > b,
.pick-secret::after,
.verdict-secret::after,
.verdict-unlock,
.pick-team-name,
.best-bet {
  font-size: 10px !important;
}
.pick-card-top,
.pick-action,
.filter-chip,
.section-link,
.recent-see-all,
.pick-secret::after,
.verdict-secret::after,
.verdict-unlock {
  letter-spacing: .3px;
}
.recent-win div strong,
.recent-win > b {
  font-size: 11px !important;
}
.recent-win div small {
  font-size: 9px !important;
}
.recent-panel h4,
.section-bar-left h3 {
  font-size: 22px !important;
}
.section-bar-left p {
  font-size: 10px !important;
}
.pick-bottom,
.pick-card-top {
  font-size: 10px !important;
}

@media (max-width: 640px) {
  .pick-card-top,
  .pick-action,
  .filter-chip,
  .section-link,
  .recent-see-all,
  .pick-secret::after,
  .verdict-secret::after,
  .verdict-unlock,
  .pick-team-name,
  .best-bet {
    font-size: 11px !important;
  }
  .recent-win div strong,
  .recent-win > b {
    font-size: 12px !important;
  }
  .recent-win div small {
    font-size: 10px !important;
  }
  .filter-chip {
    padding: 8px 12px !important;
  }
}

.today-ai-layout-v3 {
  display: grid;
  grid-template-columns: repeat(2, minmax(420px, 1fr));
  gap: 18px;
  align-items: start;
}
.today-ai-layout-v3 .today-slip-grid-v3 {
  min-width: 0;
  min-height: 0;
  display: block;
  padding: 24px;
  border: 1px solid #233e55;
  border-radius: 14px;
  background: linear-gradient(145deg, rgba(10,25,40,.78), rgba(6,18,30,.45));
  box-shadow: var(--shadow-soft);
  align-items: start;
}
.today-ai-layout-v3 .today-slip-card-v3 {
  max-width: none;
  width: 100%;
  align-self: start;
}
.today-view-more-btn {
  max-width: none;
  width: 100%;
  margin-top: 12px;
}
.today-view-more-btn span {
  margin-left: 6px;
}
.wakamaria-ai-chat {
  height: 620px;
  max-height: 72vh;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto auto auto;
  border: 1px solid rgba(34,211,107,.34);
  border-radius: 14px;
  background: radial-gradient(circle at 14% 0, rgba(34,211,107,.16), transparent 32%), radial-gradient(circle at 88% 5%, rgba(45,168,255,.12), transparent 30%), #071421;
  box-shadow: 0 24px 70px rgba(0,0,0,.24);
  overflow: hidden;
}
.wakamaria-ai-chat header {
  display: flex;
  justify-content: space-between;
  gap: 14px;
  align-items: center;
  padding: 18px;
  border-bottom: 1px solid rgba(255,255,255,.08);
}
.wakamaria-ai-chat header span {
  color: var(--green);
  font-size: 9px;
  font-weight: 900;
  letter-spacing: 1.2px;
}
.wakamaria-ai-chat header h3 {
  margin: 5px 0 0;
  font-size: 34px;
}
.wakamaria-ai-chat header b {
  padding: 7px 9px;
  border-radius: 999px;
  background: rgba(34,211,107,.12);
  color: var(--green);
  font-size: 8px;
}
.ai-chat-body {
  min-height: 0;
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 16px;
  overflow-y: auto;
}
.ai-message {
  max-width: 88%;
  padding: 11px 12px;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 12px;
  background: rgba(255,255,255,.045);
}
.ai-message.user {
  align-self: flex-end;
  background: rgba(239,49,36,.13);
  border-color: rgba(239,49,36,.28);
}
.ai-message strong {
  display: block;
  margin-bottom: 5px;
  color: #fff;
  font-size: 10px;
}
.ai-message p {
  margin: 0;
  color: #d2dfeb;
  font-size: 12px;
  line-height: 1.55;
}
.ai-quick-prompts {
  display: flex;
  gap: 7px;
  padding: 0 16px 12px;
  overflow-x: auto;
}
.ai-quick-prompts button {
  flex: 0 0 auto;
  padding: 8px 10px;
  border: 1px solid rgba(45,168,255,.28);
  border-radius: 999px;
  background: rgba(45,168,255,.08);
  color: #cfe8ff;
  font-size: 9px;
  font-weight: 900;
  cursor: pointer;
}
.ai-usage-note {
  padding: 0 16px 10px;
  color: #8fa1b3;
  font-size: 8px;
  font-weight: 900;
  letter-spacing: .4px;
  text-align: right;
}
.ai-chat-form {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 8px;
  padding: 14px;
  border-top: 1px solid rgba(255,255,255,.08);
}
.ai-chat-form input {
  min-width: 0;
  height: 44px;
  border: 1px solid #29445b;
  border-radius: 9px;
  background: #081725;
  color: #fff;
  padding: 0 12px;
  outline: none;
}
.ai-chat-form button {
  border: 0;
  border-radius: 9px;
  background: var(--red);
  color: #fff;
  padding: 0 16px;
  font-size: 10px;
  font-weight: 900;
  cursor: pointer;
}

@media (max-width: 1100px) {
  .today-ai-layout-v3 {
    grid-template-columns: 1fr;
  }
  .today-ai-layout-v3 .today-slip-grid-v3 {
    min-height: 0;
    padding: 14px;
  }
  .today-ai-layout-v3 .today-slip-card-v3 {
    max-width: none;
  }
  .wakamaria-ai-chat {
    height: 560px;
    max-height: 78vh;
  }
}

@media (max-width: 768px) {
  .showcase-hero .verdict-panel {
    display: none !important;
  }
  .public-wins-page .wins-hero {
    display: none !important;
  }
  .public-wins-page .wins-proof-grid {
    display: none !important;
  }
}

/* Global readability pass: keep micro-copy legible across every app page. */
.text-xs,
.hero-label,
.section-kicker,
.back-link,
.form-label,
.badge,
.status-badge,
.btn-sm,
.section-link,
.section-count,
.eyebrow-row,
.subscription-pill small,
.admin-mode-pill,
.hero-metric small,
.panel-heading-row > span,
.panel-heading-row > a,
.verdict-fixture > span,
.confidence-line,
.action-tile small,
.action-tile p,
.member-pick-head,
.member-fixture span,
.member-fixture em,
.member-prediction-row small,
.pick-quality-row,
.pick-card-link,
.slip-date-box span,
.master-slip-top small,
.master-slip-stats,
.activity-row small,
.win-pill,
.app-footer p,
.workspace-selection-summary small,
.slip-intro-card small,
.preset-chip,
.advanced-filter-panel summary strong,
.advanced-filter-panel summary small,
.summary-toggle,
.board-legend,
.match-card-topline strong,
.match-card-topline time,
.sport-label,
.risk-tag,
.fixture-team small,
.fixture-vs span,
.fixture-vs small,
.prediction-block small,
.prediction-block span,
.confidence-meter > div:first-child,
.value-score,
.view-analysis-link,
.selection-action,
.builder-summary small,
.builder-summary span,
.recent-win div small,
.pick-card-top,
.pick-bottom,
.pick-action,
.pick-team-name,
.filter-chip,
.recent-see-all,
.best-bet,
.verdict-unlock,
.verdict-secret::after,
.pick-secret::after,
.wins-score-card small,
.wins-score-card span,
.wins-proof-grid small,
.wins-proof-grid span,
.win-history-status span,
.win-history-copy small,
.win-history-copy p,
.win-history-meter span,
.about-command-card small,
.about-command-card span,
.ai-message strong,
.ai-quick-prompts button,
.ai-usage-note {
  font-size: 11px !important;
  line-height: 1.35 !important;
}

.match-card-topline,
.advanced-filter-panel > summary,
.fixture-team strong,
.prediction-block strong,
.confidence-meter strong,
.recent-win div strong,
.activity-row strong,
.master-slip-card > p,
.slip-intro-card p,
.workspace-heading p,
.admin-table small,
.admin-table strong,
.static-section-head small,
.admin-match-main small,
.admin-match-main span,
.admin-match-metrics small,
.today-slip-meta,
.history-slip-copy p,
.result-item-v3 small,
.result-item-v3 strong {
  font-size: 13px !important;
  line-height: 1.35 !important;
}

.btn,
.summary-toggle,
.selection-action,
.view-analysis-link,
.builder-toggle,
.today-view-more-btn,
.recent-see-all {
  letter-spacing: .35px !important;
}

@media (max-width: 768px) {
  .text-xs,
  .hero-label,
  .section-kicker,
  .back-link,
  .form-label,
  .badge,
  .status-badge,
  .btn-sm,
  .section-link,
  .section-count,
  .eyebrow-row,
  .subscription-pill small,
  .admin-mode-pill,
  .hero-metric small,
  .panel-heading-row > span,
  .panel-heading-row > a,
  .verdict-fixture > span,
  .confidence-line,
  .action-tile small,
  .action-tile p,
  .member-pick-head,
  .member-fixture span,
  .member-fixture em,
  .member-prediction-row small,
  .pick-quality-row,
  .pick-card-link,
  .slip-date-box span,
  .master-slip-top small,
  .master-slip-stats,
  .activity-row small,
  .win-pill,
  .app-footer p,
  .workspace-selection-summary small,
  .slip-intro-card small,
  .preset-chip,
  .advanced-filter-panel summary strong,
  .advanced-filter-panel summary small,
  .summary-toggle,
  .board-legend,
  .match-card-topline strong,
  .match-card-topline time,
  .sport-label,
  .risk-tag,
  .fixture-team small,
  .fixture-vs span,
  .fixture-vs small,
  .prediction-block small,
  .prediction-block span,
  .confidence-meter > div:first-child,
  .value-score,
  .view-analysis-link,
  .selection-action,
  .builder-summary small,
  .builder-summary span,
  .recent-win div small,
  .pick-card-top,
  .pick-bottom,
  .pick-action,
  .pick-team-name,
  .filter-chip,
  .recent-see-all,
  .best-bet,
  .verdict-unlock,
  .verdict-secret::after,
  .pick-secret::after {
    font-size: 12px !important;
  }

  .match-card-topline,
  .advanced-filter-panel > summary,
  .fixture-team strong,
  .prediction-block strong,
  .confidence-meter strong,
  .recent-win div strong,
  .activity-row strong,
  .master-slip-card > p,
  .slip-intro-card p,
  .workspace-heading p {
    font-size: 14px !important;
  }
}

/* Slip Builder readability pass. */
.builder-workspace .builder-header-stats small,
.builder-workspace .builder-match-main small,
.builder-workspace .builder-match-main span,
.builder-workspace .builder-match-quality small,
.builder-workspace .company-option small,
.builder-workspace .responsible-note,
.bet-builder-copy small {
  font-size: 12px !important;
  line-height: 1.4 !important;
}

.builder-workspace .company-option strong,
.builder-workspace .builder-match-main strong,
.builder-workspace .builder-header p,
.bet-builder-copy strong {
  font-size: 14px !important;
  line-height: 1.35 !important;
}

.builder-workspace .builder-header-stats strong,
.builder-workspace .builder-match-quality strong {
  font-size: 28px !important;
}

.payment-dev-skip-v3,
.status-payment-card .btn-secondary.btn-lg {
  margin-top: 10px;
  border-color: rgba(45,168,255,.42);
  background: linear-gradient(135deg, rgba(45,168,255,.16), #0b1d2d);
  color: #d8efff;
  font-size: 12px;
}
.payment-dev-skip-v3:hover,
.status-payment-card .btn-secondary.btn-lg:hover {
  border-color: rgba(45,168,255,.68);
  background: linear-gradient(135deg, rgba(45,168,255,.24), #10283d);
}

/* Slip detail readability: keep key user text clean and legible. */
.slip-workspace .workspace-heading h1,
.slip-workspace .match-board-heading h2 {
  font-family: var(--font) !important;
  font-weight: 950 !important;
  letter-spacing: .01em !important;
  line-height: 1.08 !important;
  text-transform: none !important;
}
.slip-workspace .workspace-heading h1.slip-detail-title {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: .24em;
  width: 100%;
  color: #f4f8ff !important;
  text-align: center;
  text-transform: uppercase !important;
}
.slip-workspace .workspace-heading h1.slip-detail-title span:first-child {
  color: #f4f8ff !important;
}
.slip-workspace .workspace-heading h1.slip-detail-title span:last-child {
  color: var(--green) !important;
}
.slip-workspace .workspace-title-row {
  justify-content: center;
  text-align: center;
}
.slip-workspace .workspace-title-row > div {
  flex: 1;
}
.slip-workspace .match-board-heading h2 {
  text-transform: uppercase !important;
}
.slip-workspace .prediction-block > div:not(.prediction-odds) strong {
  font-family: var(--font) !important;
  font-size: 18px !important;
  font-weight: 950 !important;
  letter-spacing: 0 !important;
  line-height: 1.18 !important;
  text-transform: none !important;
}
.slip-workspace .prediction-odds strong {
  font-family: var(--display) !important;
}

@media (max-width: 768px) {
  .slip-workspace .slip-intro-card {
    display: none !important;
  }
  .slip-workspace .workspace-heading h1 {
    font-size: 30px !important;
    line-height: 1.12 !important;
  }
  .slip-workspace .workspace-heading h1.slip-detail-title {
    font-size: 24px !important;
    gap: .18em;
  }
  .slip-workspace .match-board-heading h2 {
    font-size: 25px !important;
    line-height: 1.08 !important;
  }
  .slip-workspace .prediction-block > div:not(.prediction-odds) strong {
    font-size: 17px !important;
  }
  .today-slips-heading-v3,
  .today-ai-layout-v3 .today-slip-grid-v3 {
    display: none !important;
  }
}

.builder-workspace .company-logo,
.builder-workspace .builder-match-index {
  font-size: 15px !important;
}

@media (max-width: 768px) {
  .builder-workspace .builder-header-stats small,
  .builder-workspace .builder-match-main small,
  .builder-workspace .builder-match-main span,
  .builder-workspace .builder-match-quality small,
  .builder-workspace .company-option small,
  .builder-workspace .responsible-note,
  .bet-builder-copy small {
    font-size: 13px !important;
  }

  .builder-workspace .company-option strong,
  .builder-workspace .builder-match-main strong,
  .builder-workspace .builder-header p,
  .bet-builder-copy strong {
    font-size: 15px !important;
  }
}

/* Functional controls polish */
.filter-chip {
  appearance: none;
  cursor: pointer;
  background: transparent;
  font-family: var(--font);
}
.filter-chip:hover,
.filter-chip:focus-visible {
  border-color: #4b7192;
  color: #fff;
  outline: none;
}
.pick-card[hidden] {
  display: none !important;
}

/* Legal footer and policy pages */
.site-footer {
  align-items: center;
}
.site-footer-links,
.legal-footer nav {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 10px;
}
.site-footer-links a,
.legal-footer a {
  color: #a9bbce;
  font-size: 10px;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .45px;
}
.site-footer-links a:hover,
.legal-footer a:hover {
  color: var(--red-2);
}
.legal-footer {
  width: min(1440px, calc(100% - 28px));
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  margin: 32px auto 0;
  padding: 22px 0 30px;
  border-top: 1px solid var(--line-soft);
}
.legal-footer .brand-name {
  display: block;
  font: 900 italic 24px var(--display);
}
.legal-footer .brand-name span {
  color: var(--red);
}
.legal-footer p {
  margin: 5px 0 0;
  color: #8fa1b4;
  font-size: 11px;
}
.legal-page {
  width: min(1120px, calc(100% - 28px));
  margin: 28px auto 50px;
}
.legal-hero {
  padding: 34px;
  border: 1px solid #273f55;
  border-radius: 14px;
  background:
    radial-gradient(circle at 12% 12%, rgba(45,168,255,.18), transparent 32%),
    radial-gradient(circle at 90% 0%, rgba(239,49,36,.18), transparent 32%),
    linear-gradient(145deg, #081725, #050d16);
}
.legal-hero h1 {
  max-width: 820px;
  margin: 14px 0 10px;
  font-size: clamp(2.3rem, 4vw, 4.5rem);
  line-height: .95;
}
.legal-hero p {
  max-width: 780px;
  color: #c2d0df;
  font-size: 14px;
  line-height: 1.65;
}
.legal-body {
  display: grid;
  gap: 12px;
  margin-top: 14px;
}
.legal-body article {
  padding: 20px;
  border: 1px solid #243c53;
  border-radius: 10px;
  background: linear-gradient(145deg, rgba(10,26,42,.94), rgba(6,15,26,.96));
}
.legal-body h2 {
  margin: 0 0 8px;
  color: #fff;
  font-size: 22px;
}
.legal-body p {
  margin: 0;
  color: #bed0e2;
  font-size: 13px;
  line-height: 1.7;
}

@media (max-width: 720px) {
  .site-footer,
  .legal-footer {
    display: grid;
    justify-items: center;
    text-align: center;
  }
  .site-footer p,
  .legal-footer p {
    text-align: center;
  }
  .legal-page {
    width: min(100% - 20px, 680px);
    margin-top: 16px;
  }
  .legal-hero {
    padding: 22px 18px;
  }
  .legal-hero h1 {
    font-size: 32px;
  }
  .legal-body article {
    padding: 16px;
  }
  .legal-body h2 {
    font-size: 19px;
  }
}