@font-face{font-family:'Luckiest Guy';font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/luckiest-guy-400.woff2) format('woff2')}
@font-face{font-family:'Outfit';font-style:normal;font-weight:400 700;font-display:swap;src:url(/fonts/outfit-var.woff2) format('woff2')}

:root{
  --asphalt:#262a3d;
  --asphalt-2:#2f3449;
  --asphalt-3:#3a4058;
  --kerb:#e8e4d8;
  --yolk:#ffc93c;
  --yolk-hi:#ffd866;
  --comb:#e8432e;
  --verge:#4caf50;
  --chalk:#f4f2ec;
  --fog:#b5b9c9;
  --seam:rgba(244,242,236,.14);
  --loud:'Luckiest Guy','Arial Black',sans-serif;
  --body:'Outfit',system-ui,-apple-system,'Segoe UI',sans-serif;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--asphalt);color:var(--chalk);font:400 17px/1.65 var(--body)}
img{max-width:100%;height:auto;display:block}
a{color:var(--yolk)}
:focus-visible{outline:3px solid var(--yolk);outline-offset:3px}
h1,h2,h3{font-family:var(--loud);font-weight:400;line-height:1.08;margin:0 0 .5em;letter-spacing:.02em}
h2{font-size:clamp(28px,3.2vw,40px)}
h3{font-size:21px;letter-spacing:.03em}
p{margin:0 0 1em}
.wrap{max-width:1160px;margin:0 auto;padding:0 20px}
.read{max-width:68ch}

.btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:10px 24px;border-radius:10px;background:var(--yolk);color:#2a2000;font:700 16px/1.1 var(--body);text-decoration:none;border:0;cursor:pointer;white-space:nowrap}
.btn:hover{background:var(--yolk-hi)}
.btn--dark{background:transparent;color:var(--chalk);box-shadow:inset 0 0 0 2px var(--fog)}
.btn--dark:hover{box-shadow:inset 0 0 0 2px var(--chalk);background:rgba(255,255,255,.05)}
.btn--sm{min-height:40px;padding:8px 16px;font-size:15px}
.btn:disabled{opacity:.4;cursor:not-allowed}

.top{position:sticky;top:0;z-index:20;background:rgba(38,42,61,.95);border-bottom:4px dashed var(--yolk);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.top__in{display:flex;align-items:center;gap:22px;min-height:62px}
.brand{display:flex;align-items:center;gap:10px;color:var(--chalk);text-decoration:none;font:400 21px/1 var(--loud);letter-spacing:.03em;margin-right:auto;padding-top:4px}
.brand img{border-radius:10px;margin-top:-4px}
.nav{display:flex;gap:22px}
.nav a{color:var(--fog);text-decoration:none;font-weight:700;font-size:15px}
.nav a:hover{color:var(--chalk)}
.menu-btn{display:none;background:none;border:2px solid var(--seam);color:var(--chalk);border-radius:10px;font:700 15px var(--body);padding:7px 12px;cursor:pointer}

/* hero */
.hero{padding:48px 0 58px;background:
  radial-gradient(ellipse 45% 60% at 100% 0%,rgba(255,201,60,.18),transparent 70%),var(--asphalt)}
.hero__in{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:44px;align-items:center}
.hero__logo{width:180px;border-radius:22px;margin-bottom:16px;border:3px solid var(--yolk)}
.hero h1{font-size:clamp(32px,3.8vw,48px);max-width:18ch}
.hero__lede{font-size:18px;color:#dfe1ea;max-width:52ch}
.hero__acts{display:flex;flex-wrap:wrap;gap:12px;margin:22px 0 24px}
.byline{display:flex;align-items:center;gap:12px;font-size:14px;color:var(--fog);margin:0}
.byline img{border-radius:50%;border:2px solid var(--yolk);flex:none}
.byline b{color:var(--chalk)}

/* road demo */
.road{background:var(--asphalt-2);border-radius:20px;padding:22px;border:2px solid var(--seam)}
.road h2{font-size:26px;margin-bottom:.15em}
.road__intro{font-size:15px;color:var(--fog);margin-bottom:12px}
.pills{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:12px}
.pills button{border:2px solid var(--seam);background:none;color:var(--chalk);border-radius:999px;padding:6px 14px;font:700 14px var(--body);cursor:pointer}
.pills button[aria-pressed="true"]{background:var(--yolk);border-color:var(--yolk);color:#2a2000}
.pills button:disabled{opacity:.45;cursor:not-allowed}
.lanes{list-style:none;margin:0;padding:14px 0 14px 12px;display:flex;gap:0;overflow-x:auto;border-radius:12px;background:
  linear-gradient(90deg,var(--verge) 0 12px,transparent 12px),#1c1f2e;scrollbar-width:thin}
.lane{flex:none;width:76px;height:120px;display:grid;place-items:end center;padding-bottom:10px;border-right:3px dashed rgba(255,255,255,.35);position:relative}
.lane span{font:700 13px/1 var(--body);color:var(--fog);background:rgba(0,0,0,.35);padding:4px 6px;border-radius:6px}
.lane::before{content:"";position:absolute;top:30px;left:50%;width:38px;height:38px;margin-left:-19px;border-radius:50%;border:3px solid rgba(255,255,255,.18)}
.lane.is-done::before{background:var(--yolk);border-color:var(--yolk)}
.lane.is-done span{color:#2a2000;background:var(--yolk)}
.lane.is-here::before{background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40'%3E%3Ccircle cx='20' cy='22' r='12' fill='%23fff'/%3E%3Cpath d='M17 9q3-6 6 0z' fill='%23e8432e'/%3E%3Cpath d='M30 22l6 2-6 2z' fill='%23ffc93c'/%3E%3Ccircle cx='24' cy='19' r='2' fill='%23222'/%3E%3C/svg%3E") center/80% no-repeat;border-color:#fff;transform:scale(1.2);transition:transform .25s ease}
.lane.is-hit::before{background:var(--comb);border-color:var(--comb)}
.road__read{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:12px 0 0}
.road__read div{padding:8px 12px;border-radius:10px;background:var(--asphalt-3)}
.road__read span{display:block;font-size:12.5px;color:var(--fog)}
.road__read b{font:400 20px/1.2 var(--loud);letter-spacing:.03em}
.road__foot{display:flex;flex-wrap:wrap;align-items:center;gap:8px 10px;margin-top:12px}
.road__msg{flex:1 1 100%;margin:0 0 4px;font-weight:700;min-height:3.2em}
.road__note{margin:10px 0 0;font-size:13px;color:var(--fog);line-height:1.5}

/* warning */
.warn{margin:0;padding:22px 24px;border-radius:16px;background:#3d2b1a;border:2px solid var(--yolk);color:#fbe9c0}
.warn h2{color:var(--yolk);font-size:26px}
.warn p:last-child{margin:0}

/* casinos */
.lot{padding:60px 0;background:var(--asphalt-2);border-top:4px dashed rgba(255,201,60,.4)}
.lot__list{list-style:none;margin:26px 0 0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.bay{display:flex;flex-direction:column;gap:10px;padding:18px;border-radius:16px;background:var(--asphalt);border:2px solid var(--seam)}
.bay--first{border-color:var(--yolk)}
.bay img{border-radius:12px}
.bay h3{margin:0;font-size:19px}
.bay__amt{margin:0;font:400 22px/1.1 var(--loud);letter-spacing:.03em;color:var(--yolk)}
.bay ul{margin:0;padding-left:18px;font-size:14.5px;line-height:1.5;color:#d6d9e4;flex:1}
.bay small{font-size:12px;color:var(--fog)}
.lot__small{font-size:14px;color:var(--fog);margin:20px 0 0;max-width:72ch}

/* sections */
.part{padding:56px 0;border-top:1px solid var(--seam)}
.part--alt{background:var(--asphalt-2)}
.side{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,440px);gap:44px;align-items:center}
.side img{border-radius:18px;width:min(440px,100%)}
.specs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:24px 0 0}
.specs div{padding:14px 16px;border-radius:12px;background:var(--asphalt-3);border-left:4px solid var(--yolk)}
.specs dt{font-size:13px;color:var(--fog)}
.specs dd{margin:2px 0 0;font-weight:700;font-size:18px}
.scroll{overflow-x:auto}
.odds{width:100%;min-width:560px;border-collapse:collapse;margin:10px 0 16px}
.odds th,.odds td{padding:11px 14px;text-align:right;border-bottom:1px solid var(--seam)}
.odds th:first-child{text-align:left}
.odds thead th{font-size:13.5px;color:var(--fog);font-weight:700;border-bottom:3px solid var(--yolk)}
.odds tbody th{font-weight:700}
.marks-list{margin:0;padding-left:20px;max-width:70ch}
.marks-list li{margin:7px 0}
.marks-list li::marker{color:var(--yolk)}
.go-steps{margin:0;padding-left:26px;max-width:70ch}
.go-steps li{padding:5px 0 5px 4px}
.go-steps li::marker{font:400 19px var(--loud);color:var(--yolk)}
.cmp{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;max-width:900px}
.cmp>div{padding:20px 22px;border-radius:16px;background:var(--asphalt-3)}
.cmp>div:first-child{border-top:5px solid var(--verge)}
.cmp>div:last-child{border-top:5px solid var(--comb)}
.cmp ul{margin:0;padding-left:20px}
.faq{max-width:860px}
.faq details{border-bottom:1px solid var(--seam)}
.faq summary{cursor:pointer;list-style:none;padding:16px 34px 16px 0;font-weight:700;font-size:17.5px;position:relative}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";position:absolute;right:4px;top:13px;font:400 24px/1 var(--loud);color:var(--yolk)}
.faq details[open] summary::after{content:"–"}
.faq details p{margin:0 0 18px;color:#d6d9e4}

.end{padding:64px 0;text-align:center;background:repeating-linear-gradient(90deg,transparent 0 46%,rgba(255,201,60,.12) 46% 54%,transparent 54% 100%) 0 0/100% 60px,var(--asphalt)}
.end img{margin:0 auto 18px;border-radius:20px;border:3px solid var(--yolk)}
.end p{color:var(--fog);max-width:48ch;margin:0 auto 22px}

.foot{padding:44px 0 110px;background:#191c2a;font-size:14px;color:var(--fog)}
.foot__in{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:40px}
.foot nav{display:flex;flex-wrap:wrap;gap:8px 18px}
.foot nav a{color:var(--chalk)}
.marks{display:flex;flex-wrap:wrap;align-items:center;gap:12px}
.marks img{width:84px;height:auto}
.plus18{display:inline-grid;place-items:center;width:46px;height:46px;border-radius:50%;border:3px solid var(--comb);color:var(--chalk);font:400 16px/1 var(--loud);padding-top:3px}
.foot__c{margin:14px 0 0}

.sign{position:fixed;left:0;right:0;bottom:0;z-index:30;background:var(--yolk);color:#2a2000;box-shadow:0 -10px 30px rgba(0,0,0,.35);transform:translateY(110%);transition:transform .3s ease}
.sign.is-on{transform:none}
.sign__in{display:flex;align-items:center;gap:14px;min-height:64px}
.sign p{margin:0;flex:1;min-width:0;font-size:14px;line-height:1.35}
.sign b{display:block;font:400 17px/1.2 var(--loud);letter-spacing:.03em}
.sign .btn{flex:none;background:var(--asphalt);color:var(--yolk)}
.sign__x{flex:none;background:none;border:0;font-size:28px;line-height:1;color:#2a2000;cursor:pointer;padding:4px 6px}

.gone{padding:90px 20px 110px;max-width:640px}
.gone h1{font-size:46px}

@media (max-width:1020px){
  .lot__list{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:920px){
  .hero__in,.side{grid-template-columns:minmax(0,1fr)}
  .specs{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:760px){
  body{font-size:16px}
  .nav{display:none;position:absolute;left:0;right:0;top:62px;flex-direction:column;gap:0;background:var(--asphalt);border-bottom:2px solid var(--seam);padding:6px 20px 14px}
  .nav.is-open{display:flex}
  .nav a{padding:12px 0;border-bottom:1px solid var(--seam)}
  .menu-btn{display:block}
  .top__in>.btn{display:none}
  .hero{padding:30px 0 44px}
  .hero__logo{width:140px}
  .hero__lede{font-size:17px}
  .road{padding:16px 12px}
  .lane{width:64px;height:104px}
  .road__read b{font-size:17px}
  .lot,.part{padding:44px 0}
  .lot__list,.cmp{grid-template-columns:minmax(0,1fr)}
  .foot__in{grid-template-columns:minmax(0,1fr);gap:24px}
  .sign span{display:none}
}
@media (prefers-reduced-motion:reduce){
  .lane.is-here::before,.sign{transition:none}
}
.odds th,.odds td{white-space:nowrap}
.odds thead th{white-space:normal}
