/* EZSPIN, landing B. A bone page with charcoal bands cut into it, an orange button, an ice-blue
   second action, square corners and a 3px accent rule on the top edge of every card. The shell is
   deliberately the inverse of the cluster's other landing: light ground, dark panels, flat
   geometry, uppercase section heads, and one pinned CTA strip that stays on a phone instead of
   handing the bottom of the screen to a tab bar.
   Hand written, not generated by the build. Namespaced .qx- so it cannot collide with a sibling. */
:root{
  --char:#15171C; --char-2:#1F232B; --char-3:#2B313C;
  --orng:#FB7A1E; --orng-2:#FF9B4D; --orng-d:#C85A08;
  --ice:#9FD8F2; --ice-d:#5FB3DA;
  --bone:#EDE9E2; --bone-2:#E2DCD2; --sheet:#FFFFFF;
  --txt:#1B1E24; --mut:#5C6270; --line:#CFC8BC; --line-2:rgba(237,233,226,.2);
  --bar:60px;
  --font:system-ui,-apple-system,"Segoe UI",Roboto,"Noto Sans SC","PingFang SC",sans-serif;
  --disp:Tahoma,Verdana,"Noto Sans SC","PingFang SC",sans-serif;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;overflow-x:clip;max-width:100%;scroll-behavior:smooth}
body{margin:0;color:var(--txt);font-family:var(--font);line-height:1.68;background:var(--bone)}
a{color:var(--orng-d);text-decoration:none}
img{max-width:100%;height:auto;display:block;min-width:0}
h1,h2,h3,h4{margin:0;line-height:1.22;font-family:var(--disp);font-weight:700}
table{border-collapse:collapse;width:100%}
.w{max-width:1120px;margin:0 auto;padding:0 22px}
.note{display:block;margin-top:14px;font-size:12.5px;color:var(--mut)}

/* ---------- buttons: flat, square, a hard 2px edge rather than a drop shadow ---------- */
.qx-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;
  padding:0 22px;border-radius:3px;font-weight:700;font-size:14px;border:2px solid transparent;
  text-align:center;line-height:1.2;letter-spacing:.03em;font-family:var(--disp)}
.qx-btn.y{background:var(--orng);color:#fff;border-color:var(--orng)}
.qx-btn.y:hover{background:var(--orng-d);border-color:var(--orng-d)}
.qx-btn.i{background:transparent;color:var(--char);border-color:var(--char)}
.qx-btn.i:hover{background:var(--char);color:var(--ice)}
.qx-btn.lg{min-height:56px;font-size:15.5px;padding:0 28px}

/* ---------- header: charcoal, one hairline, no coloured underline ---------- */
.qx-head{position:sticky;top:0;z-index:50;background:var(--char);
  box-shadow:inset 0 -1px 0 rgba(237,233,226,.16)}
.qx-head .w{display:flex;align-items:center;gap:18px;padding-top:11px;padding-bottom:11px}
.qx-logo{display:flex;align-items:center;gap:10px;flex:none;min-width:0}
.qx-logo svg{width:34px;height:34px;flex:none}
.qx-logo .wm{display:flex;align-items:baseline;gap:7px;line-height:1;min-width:0;flex-wrap:nowrap}
.qx-logo .wm b{font-family:var(--disp);font-size:21px;letter-spacing:.09em;white-space:nowrap;
  color:var(--bone);font-weight:700}
.qx-logo .wm small{font-size:10px;letter-spacing:.2em;color:var(--orng);font-weight:700;
  white-space:nowrap}
.qx-pills{display:flex;flex:1;flex-wrap:wrap;gap:2px;min-width:0}
.qx-pills a{display:inline-flex;align-items:center;justify-content:center;min-height:40px;
  min-width:44px;padding:0 11px;border-radius:2px;font-family:var(--disp);
  font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:#C6CBD5;
  white-space:nowrap}
.qx-pills a:hover{color:var(--orng);box-shadow:inset 0 -3px 0 var(--orng)}
.qx-lang{display:flex;gap:4px;flex:none}
.qx-lang a{display:inline-flex;align-items:center;justify-content:center;min-width:42px;
  min-height:44px;border-radius:2px;background:var(--char-2);color:#C6CBD5;font-size:11.5px;
  font-weight:700;padding:0 7px;white-space:nowrap}
.qx-lang a.on{background:var(--ice);color:var(--char)}
.qx-burger{display:none;background:var(--char-2);border:0;color:var(--orng);
  font-size:18px;min-width:44px;min-height:44px;border-radius:2px;cursor:pointer}
.qx-drawer{display:none;flex-wrap:wrap;gap:6px;padding:0 22px 14px;background:var(--char)}
.qx-open .qx-drawer{display:flex}
.qx-drawer a{display:inline-flex;align-items:center;min-height:42px;padding:0 14px;border-radius:2px;
  background:var(--char-2);color:var(--bone);font-size:13px;font-weight:700;
  font-family:var(--disp);letter-spacing:.04em}

/* ---------- hero: one column of copy, the picture as a wide strip underneath ----------
   The donor shell put the picture beside the copy, which on a phone shoved both buttons below
   the fold. Here the whole selling block finishes first and the media carries the trust chips. */
.qx-hero{padding:34px 0 0;background:var(--bone)}
.qx-hero.big{padding:44px 0 0}
.qx-hero .w{display:grid;gap:26px}
.qx-hero .bd{display:grid;gap:16px;align-content:start;max-width:780px;min-width:0}
.qx-hero .eb{display:inline-flex;align-self:start;align-items:center;min-height:28px;padding:0 10px;
  background:var(--char);color:var(--orng);font-family:var(--disp);font-size:11px;font-weight:700;
  letter-spacing:.16em;text-transform:uppercase;border-radius:2px}
.qx-hero h1{font-size:43px;line-height:1.1;color:var(--char);letter-spacing:-.01em}
.qx-hero.big h1{font-size:48px}
.qx-hero .lead{margin:0;font-size:17px;color:#3C424E;max-width:62ch}
.qx-hero a:not(.qx-btn){color:var(--orng-d);text-decoration:underline;text-underline-offset:3px}
.qx-hero .act{display:flex;flex-wrap:wrap;gap:12px;margin-top:2px}
.qx-hero .ph{position:relative;margin:0;min-width:0}
.qx-hero .ph>img{width:100%;aspect-ratio:21/8;object-fit:cover;border-radius:3px}
.qx-hero .chips{display:flex;flex-wrap:wrap;gap:0;min-width:0;background:var(--char);
  border-radius:0 0 3px 3px;margin-top:-3px}
.qx-hero .chips span{display:inline-flex;align-items:center;gap:8px;padding:12px 16px;
  flex:1 1 180px;min-width:0;font-size:12px;color:var(--bone);font-weight:700;
  box-shadow:inset 1px 0 0 rgba(237,233,226,.14)}
.qx-hero .chips span:first-child{box-shadow:none}
.qx-hero .chips i{font-style:normal;color:var(--orng);font-size:13px;flex:none;font-weight:700}

/* two routes onto the floor: the Android file and the home-screen shortcut */
.qx-stores{display:flex;flex-wrap:wrap;gap:10px;min-width:0}
.qx-stores .st{display:flex;align-items:center;gap:11px;padding:11px 14px;border-radius:3px;
  background:var(--sheet);box-shadow:inset 0 0 0 1px var(--line);min-width:0;flex:0 1 auto}
.qx-stores .st>i{font-style:normal;font-size:19px;color:var(--orng);flex:none;line-height:1}
.qx-stores .st>span{display:grid;gap:2px;min-width:0}
.qx-stores .st b{font-size:12.5px;color:var(--char);line-height:1.3;font-weight:700}
.qx-stores .st small{font-size:10.5px;color:var(--mut);line-height:1.4}

/* ---------- generic section: bone ground, uppercase head, thin orange rule ---------- */
.qx-sec{padding:34px 0}
.qx-sec.pad{padding-top:42px}
.qx-sec .sh{margin-bottom:22px;padding-top:14px;border-top:3px solid var(--char)}
.qx-sec .sh h2{font-size:25px;color:var(--char);letter-spacing:.01em}
.qx-sec .sh p{margin:9px 0 0;color:var(--mut);font-size:14.5px;max-width:70ch}

/* kpi strip: one charcoal band split by hairlines, figures in orange */
.qx-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;border-radius:3px;
  overflow:hidden;background:var(--char)}
.qx-kpis>div{display:grid;gap:5px;align-content:start;padding:20px 16px;
  box-shadow:inset 1px 0 0 rgba(237,233,226,.14)}
.qx-kpis>div:first-child{box-shadow:none}
.qx-kpis b{font-family:var(--disp);font-size:29px;color:var(--orng);line-height:1.05}
.qx-kpis span{font-size:12px;color:#B8BFCB;line-height:1.45}

/* payment rail: white chips in a row, label under the mark rather than beside it */
.qx-rail{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px}
.qx-rail .rc{display:grid;justify-items:center;align-content:center;gap:9px;min-height:84px;
  padding:14px 10px;border-radius:3px;background:var(--sheet);
  box-shadow:inset 0 0 0 1px var(--line);min-width:0}
.qx-rail .rc img{max-height:24px;max-width:100%;width:auto;height:auto;object-fit:contain;
  flex:0 1 auto;min-width:0}
.qx-rail .rc em{font-style:normal;font-size:11px;font-weight:700;color:var(--mut);min-width:0;
  text-align:center;line-height:1.35}

/* room tiles: white cards, top accent rule, icon on a bone square */
.qx-tiles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.qx-tiles .tl{display:grid;gap:11px;align-content:start;padding:20px 20px 24px;border-radius:3px;
  background:var(--sheet);border-top:3px solid var(--orng);min-width:0}
.qx-tiles .tl:hover{border-top-color:var(--char)}
.qx-tiles .ic{display:flex;align-items:center;justify-content:center;width:46px;height:46px;
  border-radius:3px;background:var(--bone-2);color:var(--char)}
.qx-tiles .ic svg{width:28px;height:28px}
.qx-tiles .tl b{font-family:var(--disp);font-size:18px;color:var(--char)}
.qx-tiles .tl p{margin:0;font-size:13px;color:var(--mut);line-height:1.6}

/* match board: charcoal cards so the prices read as a board, not as cards */
.qx-odds{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.qx-odds .mt{display:grid;gap:12px;align-content:start;padding:16px 17px 18px;border-radius:3px;
  background:var(--char);min-width:0}
.qx-odds .hd{display:flex;align-items:center;gap:9px;flex-wrap:wrap;min-width:0}
.qx-odds .lg{font-family:var(--disp);font-size:10.5px;font-weight:700;letter-spacing:.11em;
  text-transform:uppercase;color:var(--ice);min-width:0}
.qx-odds .lv{font-style:normal;display:inline-flex;align-items:center;gap:5px;font-size:10px;
  font-weight:700;letter-spacing:.1em;color:#fff;background:var(--orng-d);padding:3px 8px;
  border-radius:2px}
.qx-odds .lv i{width:6px;height:6px;border-radius:50%;background:#fff;animation:qxpulse 1.4s infinite}
.qx-odds .tm{font-style:normal;font-size:11px;font-weight:700;color:#9AA2B0}
.qx-odds .hd small{font-size:11px;color:var(--ice);font-weight:700}
.qx-odds .tms{display:grid;gap:3px;min-width:0}
.qx-odds .tms span{font-family:var(--disp);font-size:16px;font-weight:700;color:var(--bone);
  min-width:0}
.qx-odds .tms i{font-style:normal;font-size:10.5px;font-weight:700;color:#7E8694;
  letter-spacing:.14em;text-transform:uppercase}
.qx-odds .ods{display:flex;gap:9px;min-width:0}
.qx-odds .od{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;
  flex:1 1 0;min-width:0;min-height:50px;border-radius:2px;background:var(--char-3);
  color:var(--bone);box-shadow:inset 0 0 0 1px rgba(237,233,226,.15)}
.qx-odds .od:hover{background:var(--orng);box-shadow:none;color:#fff}
.qx-odds .od span{font-size:9.5px;font-weight:700;text-transform:uppercase;letter-spacing:.09em;
  color:var(--ice)}
.qx-odds .od:hover span{color:#fff}
.qx-odds .od b{font-family:var(--disp);font-size:15px;line-height:1}
@keyframes qxpulse{50%{opacity:.2}}

/* full-width photographic band, caption on a charcoal plate rather than a gradient */
.qx-band{position:relative;margin:18px 0;background:var(--char)}
.qx-band>img{width:100%;aspect-ratio:21/8;object-fit:cover;object-position:center 45%}
.qx-band .w{position:absolute;left:0;right:0;bottom:0;padding-bottom:0}
.qx-band p{margin:0;display:inline-block;max-width:34ch;padding:14px 18px;
  background:var(--char);color:var(--bone);font-family:var(--disp);font-weight:700;font-size:21px;
  border-left:4px solid var(--orng);line-height:1.3}

/* why-us trio: three charcoal cards, the only dark band above the game cards */
.qx-why{padding:38px 0;background:var(--char)}
.qx-why .sh{margin-bottom:22px;padding-top:14px;border-top:3px solid var(--orng)}
.qx-why .sh h2{font-size:25px;color:var(--bone)}
.qx-why .sh p{margin:9px 0 0;font-size:14.5px;color:#A9B1BE}
.qx-why .gr{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.qx-why .wc{display:grid;gap:11px;align-content:start;padding:22px 20px 24px;border-radius:3px;
  background:var(--char-2);min-width:0}
.qx-why .ic{display:flex;align-items:center;justify-content:center;width:42px;height:42px;
  border-radius:3px;background:var(--orng);font-size:20px;line-height:1}
.qx-why .wc b{font-family:var(--disp);font-size:17px;color:var(--bone);line-height:1.3}
.qx-why .wc p{margin:0;font-size:13px;color:#A9B1BE;line-height:1.68}
.qx-why a{color:var(--ice);text-decoration:underline;text-underline-offset:3px}

/* promo stack: rows, not cards, with the rate on the left and the condition beside it */
.qx-promos{display:grid;gap:12px}
.qx-promos .pr{display:grid;grid-template-columns:52px minmax(0,1fr);gap:16px;align-items:start;
  padding:18px 20px;border-radius:3px;background:var(--sheet);
  box-shadow:inset 0 0 0 1px var(--line);border-left:4px solid var(--orng)}
.qx-promos .ic{display:flex;align-items:center;justify-content:center;width:48px;height:48px;
  border-radius:3px;background:var(--bone-2);font-size:21px;line-height:1}
.qx-promos .bd{display:grid;gap:4px;min-width:0}
.qx-promos .bd b{font-family:var(--disp);font-size:18px;color:var(--char);line-height:1.3}
.qx-promos .bd em{font-style:normal;justify-self:start;font-size:11px;font-weight:700;
  letter-spacing:.08em;text-transform:uppercase;color:var(--orng-d)}
.qx-promos .bd p{margin:3px 0 0;font-size:13px;color:var(--mut);line-height:1.6}

/* the fishing room: three control cards, the figure set large on the left of each */
.qx-fish{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.qx-fish .fc{display:grid;gap:10px;align-content:start;padding:22px 20px 24px;border-radius:3px;
  background:var(--char-2);min-width:0;border-top:3px solid var(--ice)}
.qx-fish .fc em{font-style:normal;font-family:var(--disp);font-size:30px;font-weight:700;
  color:var(--ice);line-height:1}
.qx-fish .fc b{font-family:var(--disp);font-size:17px;color:var(--bone);line-height:1.3}
.qx-fish .fc p{margin:0;font-size:13px;color:#A9B1BE;line-height:1.68}

/* cash-out feed: a vertical scroll of rows on a white sheet */
.qx-winners{height:280px;overflow:hidden;border-radius:3px;background:var(--sheet);
  box-shadow:inset 0 0 0 1px var(--line);position:relative;
  -webkit-mask-image:linear-gradient(180deg,transparent,#000 10%,#000 90%,transparent);
  mask-image:linear-gradient(180deg,transparent,#000 10%,#000 90%,transparent)}
.qx-winners .tr{animation:qxroll 38s linear infinite}
.qx-winners:hover .tr{animation-play-state:paused}
.qx-winners .wr{display:grid;grid-template-columns:minmax(0,106px) minmax(0,1fr) auto minmax(0,44px);
  align-items:center;gap:14px;padding:11px 18px;border-bottom:1px solid var(--bone-2)}
.qx-winners .id{font-size:12px;font-weight:700;color:var(--mut);min-width:0}
.qx-winners .gm{font-size:13px;color:var(--txt);min-width:0}
.qx-winners b{font-family:var(--disp);font-size:15.5px;color:var(--char);
  border-bottom:3px solid var(--orng);white-space:nowrap}
.qx-winners small{font-size:11px;color:var(--mut);text-align:right}
@keyframes qxroll{to{transform:translateY(-50%)}}

/* live tables: picture on top, charcoal body under it */
.qx-live{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.qx-live .lc{display:grid;align-content:start;border-radius:3px;overflow:hidden;
  background:var(--char);min-width:0}
.qx-live .lc img{width:100%;aspect-ratio:16/10;object-fit:cover}
.qx-live .bd{display:grid;gap:11px;padding:18px 18px 20px;min-width:0}
.qx-live .bd b{font-family:var(--disp);font-size:17px;color:var(--bone)}
.qx-live .mt{display:flex;flex-wrap:wrap;gap:8px}
.qx-live .mt span{font-size:11px;font-weight:700;color:var(--ice);
  box-shadow:inset 0 0 0 1px rgba(159,216,242,.4);padding:4px 9px;border-radius:2px}
.qx-live .bd p{margin:0;font-size:13px;color:#A9B1BE;line-height:1.68}
.qx-live .qx-btn{justify-self:start;margin-top:3px}

/* the SPIN ladder: five white columns, the tier label on a charcoal plate */
.qx-vip{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px}
.qx-vip .vt{display:grid;gap:9px;align-content:start;padding:0 0 18px;border-radius:3px;
  background:var(--sheet);box-shadow:inset 0 0 0 1px var(--line);min-width:0;overflow:hidden}
.qx-vip .vt>b{font-family:var(--disp);font-size:16px;color:var(--bone);letter-spacing:.1em;
  background:var(--char);padding:13px 16px;border-bottom:3px solid var(--orng)}
.qx-vip .rw{display:grid;gap:1px;padding:0 16px;min-width:0}
.qx-vip .rw span{font-size:10.5px;color:var(--mut);letter-spacing:.06em;text-transform:uppercase;
  min-width:0}
.qx-vip .rw em{font-style:normal;font-family:var(--disp);font-size:16px;font-weight:700;
  color:var(--char)}
.qx-vip .vt p{margin:5px 0 0;padding:0 16px;font-size:12px;color:var(--mut);line-height:1.6}

/* four steps: numbered, connected by the number plate rather than by a line */
.qx-steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.qx-steps .sp{display:grid;gap:11px;align-content:start;padding:20px 18px 22px;border-radius:3px;
  background:var(--sheet);box-shadow:inset 0 0 0 1px var(--line);min-width:0}
.qx-steps em{font-style:normal;display:flex;align-items:center;justify-content:center;
  width:36px;height:36px;border-radius:3px;background:var(--char);color:var(--orng);
  font-family:var(--disp);font-size:17px;font-weight:700}
.qx-steps p{margin:0;font-size:13px;color:var(--txt);line-height:1.68}

/* the phone block: charcoal plate, copy left, the handset right */
.qx-app{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:32px;
  align-items:center;padding:28px;border-radius:3px;background:var(--char)}
.qx-app .bd{display:grid;gap:16px;align-content:start;min-width:0;justify-items:start}
.qx-app h3{font-size:26px;color:var(--bone);max-width:34ch}
.qx-app .bd p{margin:0;font-size:14.5px;color:#A9B1BE;max-width:58ch}
.qx-app .bd .qx-stores .st{background:var(--char-2);box-shadow:none}
.qx-app .bd .qx-stores .st b{color:var(--bone)}
.qx-app .bd .qx-stores .st small{color:#9AA2B0}
.qx-app .bd .qx-stores .st>i{color:var(--ice)}
.qx-app .ph{display:flex;justify-content:center;min-width:0}
.qx-app .fr{display:block;width:min(248px,100%);padding:10px;border-radius:26px;
  background:var(--char-3);box-shadow:inset 0 0 0 2px rgba(159,216,242,.3);min-width:0}
.qx-app .fr img{width:100%;border-radius:18px;min-width:0}

/* studio wall and the H5 name chips */
.qx-provs{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:10px}
.qx-provs.six{grid-template-columns:repeat(6,minmax(0,1fr))}
.qx-provs .pg{display:flex;align-items:center;justify-content:center;min-height:60px;padding:12px;
  border-radius:3px;background:var(--char);min-width:0}
.qx-provs .pg img{max-height:26px;max-width:100%;width:auto;height:auto;object-fit:contain;
  flex:0 1 auto;min-width:0}
.qx-chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.qx-chips .pc{display:inline-flex;align-items:center;min-height:34px;padding:0 13px;border-radius:2px;
  background:var(--bone-2);color:var(--char);font-size:12px;font-weight:700;
  font-family:var(--disp);letter-spacing:.03em}

/* game card wall */
.qx-gt{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:12px}
.qx-gt .gt{display:grid;gap:6px;align-content:start;padding:0 0 10px;border-radius:3px;
  background:var(--sheet);box-shadow:inset 0 0 0 1px var(--line);min-width:0;overflow:hidden}
.qx-gt .gt img{width:100%;aspect-ratio:1/1;object-fit:cover;min-width:0}
.qx-gt .gt em{font-style:normal;font-size:11.5px;font-weight:700;color:var(--char);line-height:1.35;
  padding:0 10px;font-family:var(--disp)}
.qx-gt .gt small{font-size:10px;color:var(--mut);padding:0 10px;letter-spacing:.04em;
  text-transform:uppercase}

/* trust badges */
.qx-trust{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:10px}
.qx-trust .tb{display:grid;justify-items:center;align-content:center;gap:9px;min-height:84px;
  padding:14px 10px;border-radius:3px;background:var(--char);min-width:0}
.qx-trust .tb img{max-height:28px;max-width:100%;width:auto;height:auto;object-fit:contain;
  min-width:0}
.qx-trust .tb em{font-style:normal;font-size:10px;font-weight:700;color:#A9B1BE;text-align:center;
  line-height:1.35;min-width:0;letter-spacing:.05em;text-transform:uppercase}

/* cashier rows: a left rule rather than a dotted timeline */
.qx-cash{display:grid;gap:12px}
.qx-cash .cr{display:grid;grid-template-columns:14px minmax(0,1fr);gap:16px;align-items:stretch;
  padding:16px 18px;border-radius:3px;background:var(--sheet);
  box-shadow:inset 0 0 0 1px var(--line)}
.qx-cash .dot{width:14px;border-radius:2px;background:var(--orng)}
.qx-cash .bd{display:grid;gap:5px;min-width:0}
.qx-cash .bd b{font-family:var(--disp);font-size:16.5px;color:var(--char)}
.qx-cash .bd em{font-style:normal;justify-self:start;font-size:10.5px;font-weight:700;
  letter-spacing:.09em;text-transform:uppercase;color:var(--orng-d)}
.qx-cash .bd p{margin:2px 0 0;font-size:13.5px;color:var(--mut)}

/* six-vertical chip grid */
.qx-verts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.qx-verts .vc{display:grid;gap:4px;align-content:start;padding:18px 18px 20px;border-radius:3px;
  background:var(--sheet);box-shadow:inset 0 0 0 1px var(--line);border-top:3px solid var(--char);
  min-width:0}
.qx-verts .vc b{font-family:var(--disp);font-size:13px;color:var(--mut);letter-spacing:.08em;
  text-transform:uppercase}
.qx-verts .vc em{font-style:normal;font-family:var(--disp);font-size:28px;font-weight:700;
  color:var(--orng-d);line-height:1.12}
.qx-verts .vc span{font-size:12.5px;color:var(--mut);line-height:1.55}

/* ---------- prose: no card. A left rule on the whole column, on the bone ground ---------- */
.qx-prose{max-width:860px;padding-left:24px;border-left:3px solid var(--line)}
.qx-prose h1{font-size:34px;color:var(--char);margin-bottom:14px}
.qx-prose h2{font-size:23px;color:var(--char);margin:34px 0 12px;scroll-margin-top:88px;
  padding-left:14px;border-left:4px solid var(--orng)}
.qx-prose h2:first-child{margin-top:0}
.qx-prose p{margin:0 0 15px;color:#333944}
.qx-prose .lead{font-size:17px;color:var(--mut);margin-bottom:22px}
.qx-prose ul{margin:0 0 18px;padding-left:22px;display:grid;gap:8px;color:#333944}
.qx-prose .act{display:flex;flex-wrap:wrap;gap:12px;margin:0 0 26px}
.qx-tw{overflow-x:auto;margin:6px 0 26px}
.qx-tbl{font-size:13.5px;min-width:480px}
.qx-tbl th{background:var(--char);color:var(--ice);text-align:left;padding:12px 15px;font-size:11px;
  letter-spacing:.09em;text-transform:uppercase;font-family:var(--disp)}
.qx-tbl td{padding:12px 15px;border-bottom:1px solid var(--line);color:#333944;
  background:var(--sheet)}
.qx-tbl tbody tr:nth-child(even) td{background:var(--bone-2)}
.qx-faq{display:grid;gap:0;margin:0 0 8px}
.qx-faq details{border-bottom:1px solid var(--line)}
.qx-faq summary{cursor:pointer;padding:15px 0;font-weight:700;font-size:15px;color:var(--char);
  font-family:var(--disp);list-style:none}
.qx-faq summary::-webkit-details-marker{display:none}
.qx-faq summary::before{content:"+";display:inline-block;width:20px;color:var(--orng);
  font-weight:700}
.qx-faq details[open] summary::before{content:"\2013"}
.qx-faq p{margin:0;padding:0 0 16px 20px;color:#333944}

/* closing band: charcoal plate, orange button */
.qx-close{padding:10px 0 42px}
.qx-close .w{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:20px;
  padding:26px 28px;border-radius:3px;background:var(--char);border-left:5px solid var(--orng)}
.qx-close b{font-family:var(--disp);font-size:19px;line-height:1.45;max-width:64ch;
  color:var(--bone);font-weight:700}

/* ---------- footer ---------- */
.qx-foot{background:var(--char);margin-top:14px}
.qx-foot .w{padding-top:36px;padding-bottom:30px;display:grid;gap:26px}
.qx-foot .top{display:grid;grid-template-columns:1.6fr repeat(4,1fr);gap:26px}
.qx-foot .ab{display:grid;gap:14px;align-content:start;min-width:0}
.qx-foot .ab p{margin:0;font-size:12.5px;color:#9AA2B0;line-height:1.7}
.qx-foot .top>div{display:grid;gap:8px;align-content:start;min-width:0}
.qx-foot h4{font-size:10.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--orng)}
.qx-foot a{display:inline-flex;align-items:center;min-height:34px;color:#9AA2B0;font-size:13px}
.qx-foot a:hover{color:var(--ice)}
.qx-foot .pay,.qx-foot .trust{display:flex;flex-wrap:wrap;gap:10px;padding-top:20px;
  border-top:1px solid var(--line-2)}
.qx-foot .pay span,.qx-foot .trust span{display:flex;align-items:center;justify-content:center;
  height:38px;padding:0 13px;border-radius:2px;background:var(--char-2);min-width:0}
.qx-foot .pay img{max-height:19px;width:auto;object-fit:contain;min-width:0}
.qx-foot .trust img{max-height:22px;width:auto;object-fit:contain;min-width:0}
.qx-foot .legal{display:flex;flex-wrap:wrap;align-items:center;gap:14px;padding-top:19px;
  border-top:1px solid var(--line-2)}
.qx-foot .legal p{margin:0;flex:1;min-width:250px;font-size:12.5px;color:#9AA2B0}
.qx-foot .legal small{font-size:12px;color:#7E8694}
.qx-foot .age{display:inline-flex;align-items:center;justify-content:center;flex:none;width:36px;
  height:36px;border-radius:3px;background:var(--orng);color:#fff;font-weight:700;font-size:11.5px;
  font-family:var(--disp)}

/* ---------- the one pinned strip: it stays on a phone, in the thumb arc ---------- */
.qx-sticky{position:fixed;left:0;right:0;bottom:0;z-index:60;display:flex;align-items:center;
  justify-content:center;gap:16px;padding:10px 18px;background:var(--char);
  box-shadow:0 -1px 0 rgba(237,233,226,.2),0 -10px 24px rgba(21,23,28,.18)}
.qx-sticky.off{display:none}
.qx-sticky>span{font-size:13.5px;color:var(--bone);font-weight:700}
.qx-sticky .bt{display:flex;gap:10px;flex:none}
.qx-sticky .qx-btn{min-height:44px;padding:0 18px;font-size:13px}
.qx-sticky .qx-btn.i{color:var(--ice);border-color:var(--ice)}
.qx-sticky .qx-btn.i:hover{background:var(--ice);color:var(--char)}
.qx-sticky .x{width:44px;height:44px;border-radius:2px;border:0;flex:none;
  background:var(--char-2);color:#9AA2B0;font-size:18px;line-height:1;cursor:pointer}

/* ---------- paged entry modal ---------- */
.qx-pop[hidden]{display:none}
.qx-pop{position:fixed;inset:0;z-index:80;display:flex;align-items:center;justify-content:center;
  padding:18px;background:rgba(21,23,28,.72)}
.qx-pop .bx{position:relative;width:min(360px,100%);max-height:92vh;overflow:auto;
  border-radius:3px;background:var(--bone);border-top:5px solid var(--orng);
  box-shadow:0 24px 54px rgba(21,23,28,.5);padding:0 0 16px}
.qx-pop .x{position:absolute;top:10px;right:10px;width:36px;height:36px;border:0;border-radius:2px;
  cursor:pointer;font-size:21px;line-height:1;color:var(--bone);background:rgba(21,23,28,.72);
  z-index:3}
.qx-pop .tp{display:grid;gap:4px;padding:17px 18px;background:var(--char);text-align:center}
.qx-pop .tp .wm{font-family:var(--disp);font-weight:700;font-size:20px;color:var(--bone);
  letter-spacing:.12em}
.qx-pop .tp em{font-style:normal;font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--orng)}
.qx-pop .pn{display:grid;gap:12px;padding:20px 20px 6px}
.qx-pop .pn[hidden]{display:none!important}
.qx-pop .pn b{font-family:var(--disp);font-size:21px;color:var(--char);line-height:1.28}
.qx-pop .pn p{margin:0;font-size:13.5px;color:var(--mut);line-height:1.65}
.qx-pop .pn .qx-btn{margin-top:2px}
.qx-pop .pg{display:flex;justify-content:center;gap:10px;padding:14px 0 6px}
.qx-pop .pg .dt{width:30px;height:5px;border-radius:2px;border:0;cursor:pointer;padding:0;
  background:var(--line)}
.qx-pop .pg .dt.on{background:var(--orng)}
.qx-pop .later{display:block;margin:0 auto;border:0;background:none;cursor:pointer;font:inherit;
  font-size:12.5px;color:var(--mut);text-decoration:underline;padding:6px 10px}

/* ---------- responsive ---------- */
@media(max-width:1060px){
  .qx-trust,.qx-provs{grid-template-columns:repeat(4,minmax(0,1fr))}
  .qx-provs.six{grid-template-columns:repeat(3,minmax(0,1fr))}
  .qx-odds{grid-template-columns:repeat(2,minmax(0,1fr))}
  .qx-vip{grid-template-columns:repeat(3,minmax(0,1fr))}
  .qx-gt{grid-template-columns:repeat(4,minmax(0,1fr))}
  .qx-rail{grid-template-columns:repeat(4,minmax(0,1fr))}
  .qx-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}
  .qx-kpis>div{box-shadow:inset 1px 0 0 rgba(237,233,226,.14),inset 0 1px 0 rgba(237,233,226,.14)}
  .qx-kpis>div:nth-child(-n+2){box-shadow:inset 1px 0 0 rgba(237,233,226,.14)}
  .qx-kpis>div:nth-child(odd){box-shadow:inset 0 1px 0 rgba(237,233,226,.14)}
  .qx-kpis>div:first-child{box-shadow:none}
}
@media(max-width:1000px){
  .qx-hero h1,.qx-hero.big h1{font-size:32px}
  .qx-hero .lead{font-size:15px;line-height:1.6}
  .qx-hero .ph>img{aspect-ratio:16/9}
  .qx-pills{display:none}
  .qx-burger{display:inline-flex;align-items:center;justify-content:center}
  .qx-head .w{justify-content:space-between}
  .qx-tiles,.qx-live,.qx-steps,.qx-fish{grid-template-columns:repeat(2,minmax(0,1fr))}
  .qx-why .gr{grid-template-columns:repeat(2,minmax(0,1fr))}
  .qx-app{grid-template-columns:1fr}
  .qx-app .ph{order:-1}
  .qx-foot .top{grid-template-columns:1fr 1fr}
  .qx-band>img{aspect-ratio:16/8}
  .qx-prose{padding-left:18px}
}
@media(max-width:760px){
  body{padding-bottom:calc(var(--bar) + 18px)}
  .qx-hero{padding:22px 0 0}
  .qx-hero.big{padding:24px 0 0}
  .qx-sec{padding:26px 0}
  .qx-why{padding:30px 0}
  .qx-vip{grid-template-columns:repeat(2,minmax(0,1fr))}
  .qx-trust,.qx-provs,.qx-rail{grid-template-columns:repeat(3,minmax(0,1fr))}
  .qx-gt{grid-template-columns:repeat(3,minmax(0,1fr))}
  .qx-odds,.qx-verts{grid-template-columns:1fr}
  .qx-sec .sh h2,.qx-why .sh h2{font-size:22px}
  .qx-prose h1{font-size:27px}
  .qx-prose h2{font-size:20px;scroll-margin-top:74px}
  .qx-band p{font-size:16.5px;padding:12px 15px}
  .qx-close b{font-size:17px}
  /* The pinned strip keeps the CTA in the thumb arc, so the sentence beside it goes and the two
     buttons take the full width. Nothing else is pinned at the bottom of a phone screen. */
  .qx-sticky{gap:10px;padding:9px 14px}
  .qx-sticky>span{display:none}
  .qx-sticky .bt{flex:1;min-width:0}
  .qx-sticky .bt .qx-btn{flex:1 1 0;min-width:0;padding:0 10px}
}
@media(max-width:560px){
  .w{padding:0 16px}
  .qx-hero h1,.qx-hero.big h1{font-size:28px}
  .qx-hero .w{gap:20px}
  .qx-hero .act .qx-btn{flex:1 1 100%}
  .qx-hero .chips span{flex:1 1 100%;padding:11px 14px}
  .qx-logo .wm b{font-size:18px}
  .qx-tiles,.qx-live,.qx-steps,.qx-fish,.qx-vip{grid-template-columns:1fr}
  .qx-why .gr{grid-template-columns:1fr}
  .qx-rail,.qx-trust,.qx-provs,.qx-provs.six{grid-template-columns:repeat(2,minmax(0,1fr))}
  .qx-gt{grid-template-columns:repeat(2,minmax(0,1fr))}
  .qx-kpis{grid-template-columns:1fr}
  .qx-kpis>div{box-shadow:inset 0 1px 0 rgba(237,233,226,.14)}
  .qx-kpis>div:first-child{box-shadow:none}
  .qx-band>img{aspect-ratio:4/3}
  .qx-promos .pr{grid-template-columns:1fr;gap:12px}
  .qx-winners .wr{grid-template-columns:minmax(0,1fr) auto;row-gap:3px;gap:10px}
  .qx-winners .id{grid-column:1;font-size:11px}
  .qx-winners .gm{grid-column:1}
  .qx-winners b{grid-column:2;grid-row:1}
  .qx-winners small{grid-column:2;grid-row:2}
  .qx-winners{height:310px}
  .qx-app{padding:20px}
  .qx-close .w{padding:20px}
  .qx-prose{padding-left:14px}
}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .qx-winners .tr{animation:none}
  .qx-odds .lv i{animation:none}
}

/* Near-black third-party artwork vanishes on the charcoal panels, so it is lifted to a white mark.
   Only the measured DARK_INK set carries .lift: a SOLID badge silhouettes into a featureless
   block. On the white payment chips the artwork is left exactly as the vendor ships it. */
.qx-provs .pg img.lift,
.qx-trust .tb img.lift,
.qx-foot .pay img.lift,
.qx-foot .trust img.lift{filter:brightness(0) invert(1);opacity:.92}
