/* Casino list, compact pass (owner 2026-10-15, Figma "OSH Daily Sweeps Sheet Redesign" > Casino list page).
   Loaded after heliopulp-list.css. Goals: first casino above the fold, even one-line rows on desktop,
   short cards on phones (about 3 per screen), controls in sideways-scrolling rows. */

/* ---------- desktop ---------- */
@media (min-width:900px){
  html[data-theme] header.hero{padding-top:24px!important;padding-bottom:22px!important}
  html[data-theme] header.hero h1{font-size:clamp(40px,4.2vw,58px)!important;line-height:1.02!important;margin:6px 0 8px!important}
  html[data-theme] header.hero .sub{margin:0 0 16px!important;max-width:760px}
  html[data-theme] header.hero .kpis{margin-top:0!important}
  html[data-theme] header.hero .kpi{padding:12px 18px!important}
  html[data-theme] header.hero .kpi .v{font-size:24px!important}
  html[data-theme] .sv-bar{padding:14px 18px!important;gap:12px!important}
  html[data-theme] .sv-quick{padding-bottom:12px!important}
  html[data-theme] .sv-quick a{padding:6px 12px!important;font-size:11.5px!important}

  /* one even row per casino */
  html[data-theme] .sv-grid tr.sv-row > td{padding-top:10px!important;padding-bottom:10px!important;vertical-align:middle!important}
  html[data-theme] .sv-grid tr.sv-row > td.sv-w-play{padding-top:10px!important;padding-bottom:10px!important}
  html[data-theme] .sv-grid .sv-w-daily,html[data-theme] .sv-grid .sv-w-daily *{white-space:nowrap!important}
  html[data-theme] .sv-grid .sv-w-daily{width:15%!important}
  html[data-theme] .sv-grid .sv-w-welcome{width:16%!important}
  html[data-theme] header.hero .sub{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}
  html[data-theme] header.hero .kpi .l{margin-top:2px!important}
  html[data-theme] header.hero .kpi .split{margin-top:4px!important}
  html[data-theme] .sv-grid .sv-w-daily .sv-spark,html[data-theme] .sv-grid .sv-w-daily .sv-dvu{display:none!important}
  html[data-theme] .sv-grid .sv-w-welcome .sv-txt{display:-webkit-box!important;-webkit-box-orient:vertical;-webkit-line-clamp:2!important;overflow:hidden;line-height:1.35}
  html[data-theme] .sv-grid tr.sv-row > :nth-child(5) .sv-days{display:-webkit-box!important;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;margin-top:3px!important}
  html[data-theme] .sv-grid .sv-pgs{gap:3px}
  html[data-theme] .sv-grid .sv-pg{font-size:13px;white-space:nowrap}
  html[data-theme] .sv-grid .sv-pmore{margin-top:4px!important}
  html[data-theme] .sv-grid td.sv-actcol .btn{min-height:34px;padding-top:7px!important;padding-bottom:7px!important}
}

/* ---------- phones ---------- */
@media (max-width:899px){
  /* hero: title, one line of context, stats in one row */
  html[data-theme] header.hero{padding:22px 18px 18px!important}
  html[data-theme] header.hero .eyebrow{font-size:10px!important;letter-spacing:.16em!important;margin-bottom:6px!important}
  html[data-theme] header.hero h1{font-size:32px!important;line-height:1.02!important;margin:0 0 8px!important}
  html[data-theme] header.hero h1 .hl{font-size:26px!important;line-height:1.1!important;display:inline-block;margin-top:4px}
  html[data-theme] header.hero .sub{font-size:14px!important;line-height:1.45!important;margin:0 0 14px!important;
    display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}
  html[data-theme] header.hero .kpis{display:grid!important;grid-template-columns:repeat(4,1fr)!important;gap:0!important;margin:0!important}
  html[data-theme] header.hero .kpi{padding:10px 4px!important;border:0!important;text-align:center;min-width:0}
  html[data-theme] header.hero .kpi + .kpi{border-left:1px solid rgba(242,179,68,.16)!important}
  html[data-theme] header.hero .kpi .v{font-size:18px!important;line-height:1.1!important}
  html[data-theme] header.hero .kpi .l{font-size:8.5px!important;letter-spacing:.08em!important;line-height:1.3!important;margin-top:4px!important}
  html[data-theme] header.hero .kpi .split{display:none!important}

  /* controls: quick links and tiers scroll sideways, filters in one row */
  html[data-theme] .sv-bar{padding:12px 0 12px 12px!important;gap:10px!important;border-radius:14px!important}
  html[data-theme] .sv-quick,html[data-theme] .sv-tabs{display:flex!important;flex-wrap:nowrap!important;overflow-x:auto;scrollbar-width:none;
    gap:8px!important;padding:0 12px 0 0!important;border:0!important;-webkit-mask-image:linear-gradient(90deg,#000 88%,transparent);mask-image:linear-gradient(90deg,#000 88%,transparent)}
  html[data-theme] .sv-quick::-webkit-scrollbar,html[data-theme] .sv-tabs::-webkit-scrollbar,html[data-theme] .sv-bar .sv-filters::-webkit-scrollbar{display:none}
  html[data-theme] .sv-quick a{flex:0 0 auto;min-height:34px!important;padding:7px 12px!important;border-radius:999px!important;white-space:nowrap;font-size:11.5px!important}
  html[data-theme] .sv-tab{flex:0 0 auto;width:auto!important;min-height:34px!important;padding:6px 12px!important;border-radius:999px!important;white-space:nowrap}
  html[data-theme] .sv-bar .sv-filters{display:grid!important;grid-template-columns:1.4fr 1fr 1fr!important;gap:8px!important;padding-right:12px!important}
  html[data-theme] .sv-bar .sv-filters > *{width:100%!important;min-height:38px!important;font-size:11.5px!important;padding-left:8px!important;padding-right:8px!important}
  html[data-theme] .sv-bar .sv-filters .sv-search{grid-column:1/-1;height:40px}
  html[data-theme] .sv-bar .sv-filters #svTAll{display:none!important}
  html[data-theme] .sv-hint{margin:8px 4px 8px!important}

  /* cards: name row, three stats, welcome line, buttons */
  html[data-theme] .sv-grid tr.sv-row{grid-template-columns:1.3fr 1fr .85fr!important;
    grid-template-areas:"name name name" "daily pay red" "wel wel wel" "act act act"!important;
    margin:0 0 10px!important;border-radius:12px!important}
  html[data-theme] .sv-grid tr.sv-row > td{padding:4px 14px!important}
  html[data-theme] .sv-grid tr.sv-row > .sv-gut{display:none!important}
  html[data-theme] .sv-grid tr.sv-row > .sv-namecol{grid-area:name;padding:12px 56px 6px 14px!important;font-size:16px!important}
  html[data-theme] .sv-grid tr.sv-row .sv-expand{top:10px!important;right:10px!important;width:30px!important;height:30px!important}
  html[data-theme] .sv-grid tr.sv-row > .sv-w-daily{grid-area:daily;padding-right:4px!important}
  html[data-theme] .sv-grid tr.sv-row > :nth-child(5){grid-area:pay;padding-left:6px!important;padding-right:4px!important}
  html[data-theme] .sv-grid tr.sv-row > .sv-w-redeem{grid-area:red;padding-left:6px!important}
  html[data-theme] .sv-grid tr.sv-row > .sv-w-welcome{grid-area:wel;display:flex!important;gap:10px;align-items:baseline;padding-top:6px!important}
  html[data-theme] .sv-grid tr.sv-row > .sv-w-play,html[data-theme] .sv-grid tr.sv-row > .sv-w-ptx{display:none!important}
  html[data-theme] .sv-grid tr.sv-row > .sv-actcol{grid-area:act;padding:8px 14px 12px!important}
  html[data-theme] .sv-grid tr.sv-row > .sv-actcol a,html[data-theme] .sv-grid tr.sv-row > .sv-actcol button{min-height:40px!important}
  html[data-theme] .sv-grid tr.sv-row > .sv-w-daily::before,
  html[data-theme] .sv-grid tr.sv-row > :nth-child(5)::before,
  html[data-theme] .sv-grid tr.sv-row > .sv-w-redeem::before,
  html[data-theme] .sv-grid tr.sv-row > .sv-w-welcome::before{font-size:9px!important;letter-spacing:.12em!important;margin-bottom:4px!important;white-space:nowrap}
  html[data-theme] .sv-grid tr.sv-row > .sv-w-redeem::before{content:"Min redeem"!important}
  html[data-theme] .sv-grid tr.sv-row > .sv-w-welcome::before{content:"Welcome"!important;flex:0 0 auto;margin:0!important}
  html[data-theme] .sv-grid .sv-w-daily .sv-dv{font-size:15px!important;white-space:nowrap}
  html[data-theme] .sv-grid .sv-w-daily .sv-dvu,html[data-theme] .sv-grid .sv-w-daily .sv-spark{display:none!important}
  html[data-theme] .sv-grid tr.sv-row > .sv-w-redeem{font-size:16px!important}
  html[data-theme] .sv-grid tr.sv-row > :nth-child(5) .chip{font-size:9.5px!important;padding:2px 7px!important}
  html[data-theme] .sv-grid tr.sv-row > :nth-child(5) .sv-days{display:block;margin-top:4px;font-size:11.5px!important;line-height:1.3;
    display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;margin-left:0!important;padding-left:0!important}
  html[data-theme] .sv-grid .sv-w-welcome .sv-txt{font-size:13.5px!important;line-height:1.4!important;display:-webkit-box!important;-webkit-box-orient:vertical;-webkit-line-clamp:2!important;overflow:hidden}
  html[data-theme] .sv-grid tr.sv-band td{padding:12px 4px 8px!important}
  html[data-theme] .sv-grid tr.sv-band .sv-band-in{padding-left:2px!important}
}

/* ---------- owner 2026-10-15 round 2 ---------- */
/* casinos with no fixed daily value: one-word kind + range (full text in the tooltip and the details drawer) */
html[data-theme] .sv-grid .sv-dvx{font-family:var(--mono);font-weight:700;font-size:13px;letter-spacing:.04em;color:var(--mut-strong)}
html[data-theme] .sv-grid .sv-dvn{display:block;margin-top:2px;font-family:var(--mono);font-size:12px;color:var(--lime);opacity:.85;white-space:nowrap}
/* NEW tab: still marked, no longer the loudest thing on the page (S Tier leads) */
html[data-theme] .sv-tab[data-tab="NEW"]{animation:none!important;box-shadow:none!important;background:rgba(242,179,68,.1)!important;
  color:var(--ink)!important;border-color:rgba(242,179,68,.45)!important;font-weight:600}
html[data-theme] .sv-tab[data-tab="NEW"] .n{background:rgba(242,179,68,.2)!important;color:var(--lime)!important}
html[data-theme] .sv-tab[data-tab="NEW"][aria-selected="true"]{outline:0!important;border-color:var(--lime)!important;box-shadow:inset 0 0 0 1px rgba(242,179,68,.35)!important}
/* the checkbox column says what it does */
@media (min-width:900px){
  html[data-theme] .sv-grid tr.sv-heads th.sv-gut::after{content:"MY\A STACK";white-space:pre;display:block;text-align:center;
    font-family:var(--mono);font-size:9.5px;font-weight:700;letter-spacing:.12em;line-height:1.35;color:var(--mut)}
}
/* phone hero: the eyebrow fits on one line */
@media (max-width:899px){
  html[data-theme] header.hero .eyebrow{white-space:nowrap;overflow:hidden;font-size:9px!important;letter-spacing:.1em!important}
}

/* ---------- visitor's state + age chips (scripts/list_state_marks.py) ---------- */
html[data-theme] .sv-here{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;padding:10px 14px;border:1px solid rgba(94,232,173,.35);
  border-radius:12px;background:rgba(94,232,173,.07);font-size:13.5px;line-height:1.45;color:var(--ink)}
html[data-theme] .sv-here[hidden]{display:none}
html[data-theme] .sv-here b{color:var(--teal)}
html[data-theme] .sv-here button{font-family:var(--mono);font-size:11px;letter-spacing:.06em;padding:6px 11px;border-radius:999px;cursor:pointer;
  border:1px solid rgba(94,232,173,.45);background:transparent;color:var(--ink)}
html[data-theme] .sv-here button:hover{background:rgba(94,232,173,.14)}
html[data-theme] .sv-grid .sv-agechip{display:inline-block;margin-left:8px;padding:1px 6px;border-radius:4px;border:1px solid rgba(185,195,212,.35);
  font-family:var(--mono);font-size:10px;font-weight:600;color:var(--mut-strong);vertical-align:middle;white-space:nowrap}
html[data-theme] .sv-grid .sv-notin{display:inline-block;margin-left:6px;padding:1px 7px;border-radius:4px;border:1px solid rgba(210,90,78,.6);
  background:rgba(210,90,78,.12);font-family:var(--mono);font-size:10px;font-weight:600;color:#f0a49b;vertical-align:middle;white-space:nowrap}
html[data-theme] .sv-grid tr.sv-row.notin .btn.play{opacity:.6}
@media (min-width:900px){html[data-theme] .sv-grid td.sv-namecol .sv-agechip{margin:4px 0 0 76px}html[data-theme] .sv-grid td.sv-namecol .sv-notin{margin-top:4px}}
@media (max-width:899px){
  html[data-theme] .sv-grid .sv-w-daily .sv-dv{font-size:14px!important;letter-spacing:-.03em}
  html[data-theme] .sv-grid tr.sv-row > .sv-namecol .sv-cas{display:inline-flex!important;vertical-align:middle;max-width:100%}
  html[data-theme] .sv-grid td.sv-namecol .sv-agechip{margin-left:8px}
}

/* ---------- phone hero: one top-pick button above the fold (scripts/list_state_marks.py) ---------- */
html[data-theme] .hero-pick{display:none}
@media (max-width:899px){
  html[data-theme] .hero-pick:not([hidden]){display:flex;align-items:center;gap:10px;margin:2px 0 12px;padding:9px 10px 9px 10px;border-radius:12px;
    border:1px solid rgba(242,179,68,.55);background:rgba(7,15,29,.78);text-decoration:none;color:var(--ink);position:relative;z-index:2}
  html[data-theme] .hero-pick img{width:28px;height:28px;border-radius:7px;flex:0 0 28px;border:1px solid rgba(242,179,68,.3)}
  html[data-theme] .hero-pick span{flex:1;min-width:0;font-size:14px;font-weight:600;line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  html[data-theme] .hero-pick small{display:block;font-family:var(--mono);font-size:9.5px;font-weight:500;letter-spacing:.12em;text-transform:uppercase;color:var(--teal)}
  html[data-theme] .hero-pick b{flex:0 0 auto;padding:8px 14px;border-radius:8px;background:linear-gradient(180deg,#ffd27a,#f2b344);color:#1a1206;
    font-family:var(--mono);font-size:12px;letter-spacing:.08em}
}
html[data-theme] .sv-bar > .sv-here{height:auto!important;min-height:0!important;min-width:0}
html[data-theme] .sv-here span{flex:1 1 100%;min-width:0}
@media (max-width:899px){html[data-theme] .sv-bar > .sv-here{margin-right:12px!important;font-size:13px;max-width:calc(100vw - 60px);box-sizing:border-box}}