@charset "utf-8";
/* Olland Casino — "Het Raster" (De Stijl). Één CSS-bestand, tokens in :root.
   Warm papiervlak, zwart asymmetrisch raster, primaire vlakken. Geen gradient, geen neon, geen ronde hoeken. */

/* ---------- font ---------- */
@font-face{
  font-family:"Archivo";
  src:url(/assets/fonts/archivo-var-latin.woff2) format("woff2");
  font-weight:100 900;font-stretch:62% 125%;font-style:normal;font-display:swap;
}
@font-face{
  font-family:"Archivo Black";
  src:url(/assets/fonts/archivo-black-latin.woff2) format("woff2");
  font-weight:400 900;font-style:normal;font-display:swap;
}

/* ---------- tokens ---------- */
:root{
  --paper:#f4f1ea;        /* warm wit papiervlak */
  --paper-2:#eae4d6;      /* iets dieper paneel */
  --paper-3:#e0d9c7;
  --ink:#14110f;          /* bijna-zwart, raster + tekst */
  --ink-soft:#4a443c;     /* secundaire tekst op papier */
  --line:#14110f;         /* rasterlijn */

  --red:#d0342c;   --on-red:#fbf4ea;
  --yellow:#f2c200; --on-yellow:#14110f;
  --blue:#1d3a8a;  --on-blue:#f4f1ea;
  --green:#1f6f4a; --on-green:#f4f1ea;   /* status: goedgekeurd/actief */

  --ok:#1f6f4a; --warn:#b8631a; --bad:#a3231d; --info:#1d3a8a;

  /* rasterlijnen */
  --l1:2px; --l2:4px; --l3:6px; --l4:10px;

  --gutter:clamp(16px,4vw,40px);
  --maxw:1320px;

  --f-sans:"Archivo",-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif;
  --f-disp:"Archivo Black",var(--f-sans);
  /* Uitgebreide (expanded) display-stem uit dezelfde superfamilie */
  --f-exp:"Archivo",var(--f-sans);

  --step--1:clamp(.78rem,.76rem + .1vw,.84rem);
  --step-0:clamp(.95rem,.92rem + .15vw,1.02rem);
  --step-1:clamp(1.12rem,1.05rem + .35vw,1.35rem);
  --step-2:clamp(1.4rem,1.25rem + .8vw,1.95rem);
  --step-3:clamp(1.9rem,1.55rem + 1.7vw,3rem);
  --step-4:clamp(2.6rem,1.9rem + 3.4vw,4.6rem);

  --focus:#1d3a8a;
}

/* ---------- reset ---------- */
*,*::before,*::after{box-sizing:border-box}
*{margin:0}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{
  font-family:var(--f-sans);
  font-size:var(--step-0);
  line-height:1.55;
  color:var(--ink);
  background:var(--paper);
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
img,svg,video{display:block;max-width:100%}
button,input,select,textarea{font:inherit;color:inherit}
a{color:inherit;text-decoration:none}
ul,ol{list-style:none;padding:0}
h1,h2,h3,h4{line-height:1.02;font-weight:800;letter-spacing:-.02em;text-wrap:balance}
p{text-wrap:pretty}
:focus-visible{outline:var(--l2) solid var(--focus);outline-offset:2px}
::selection{background:var(--yellow);color:var(--ink)}
::-webkit-scrollbar{width:12px;height:12px}
::-webkit-scrollbar-thumb{background:var(--ink);border:3px solid var(--paper)}
::-webkit-scrollbar-track{background:var(--paper-2)}
html{scrollbar-color:var(--ink) var(--paper-2)}
:target{scroll-margin-top:120px}

.skip{position:absolute;left:-999px;top:0;background:var(--ink);color:var(--paper);padding:12px 18px;z-index:200;font-weight:700}
.skip:focus{left:8px;top:8px}

/* ---------- layout primitives ---------- */
.wrap{width:100%;max-width:var(--maxw);margin-inline:auto;padding-inline:var(--gutter)}
.stack>*+*{margin-top:var(--sp,1.2rem)}
.i{width:1em;height:1em;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:square;stroke-linejoin:miter;flex:none;vertical-align:-.14em}
.i--fill{fill:currentColor;stroke:none}
.vh{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* De Stijl vlak-helpers */
.plane{border:var(--l3) solid var(--line)}
.plane--red{background:var(--red);color:var(--on-red)}
.plane--yellow{background:var(--yellow);color:var(--on-yellow)}
.plane--blue{background:var(--blue);color:var(--on-blue)}
.plane--ink{background:var(--ink);color:var(--paper)}
.plane--paper{background:var(--paper)}

/* ---------- warnbar (verplichte slogan) ---------- */
.warnbar{background:var(--ink);color:var(--paper);font-size:var(--step--1);border-bottom:var(--l2) solid var(--yellow)}
.warnbar__in{display:flex;align-items:center;gap:14px;min-height:40px;flex-wrap:wrap;padding-block:6px}
.badge18{background:var(--yellow);color:var(--ink);font-family:var(--f-disp);font-size:.82em;letter-spacing:.02em;padding:2px 7px;line-height:1}
.warnbar__slogan{font-weight:600}
.warnbar__ksa{margin-left:auto;color:var(--paper);text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:2px;text-decoration-color:var(--yellow)}
.warnbar__ksa:hover{color:var(--yellow)}

/* ---------- header ---------- */
.hdr{position:sticky;top:0;z-index:90;background:var(--paper);border-bottom:var(--l4) solid var(--ink)}
.hdr__in{display:flex;align-items:stretch;gap:0;min-height:66px}
.wordmark{display:flex;align-items:center;gap:10px;font-family:var(--f-disp);font-size:1.32rem;letter-spacing:-.03em;text-transform:lowercase;padding-right:22px;color:var(--ink)}
.wordmark__mark{width:26px;height:26px;background:var(--red);border:var(--l1) solid var(--ink);flex:none}
.hdr__nav{display:flex;align-items:stretch;overflow:visible}
.hdr__nav>ul{display:flex;align-items:stretch}
.hdr__nav a{display:flex;align-items:center;padding:0 15px;font-weight:600;font-size:.94rem;border-left:var(--l1) solid var(--ink);position:relative}
.hdr__nav a:hover{background:var(--yellow);color:var(--ink)}
.hdr__nav a[aria-current=page]{background:var(--ink);color:var(--paper)}
.hdr__spacer{flex:1 1 auto;min-width:8px}
.hdr__actions{display:flex;align-items:stretch;margin-left:auto}
.hdr__actions .btn{border-radius:0;border:0;border-left:var(--l1) solid var(--ink)}
.hdr__search{display:flex;align-items:center;padding:0 14px;border-left:var(--l1) solid var(--ink)}
.hdr__search:hover{background:var(--paper-2)}
.burger{display:none}

/* mobiele navigatie */
.mnav{display:none}
@media(max-width:1080px){
  .hdr__nav{display:none}
  .hdr__search{border-left:0}
  .burger{display:flex;align-items:center;gap:8px;padding:0 16px;border-left:var(--l1) solid var(--ink);font-weight:700;background:var(--paper)}
  .burger:hover{background:var(--yellow)}
  .burger__lines{width:22px;height:16px;position:relative}
  .burger__lines::before,.burger__lines::after,.burger__lines span{content:"";position:absolute;left:0;right:0;height:3px;background:var(--ink)}
  .burger__lines::before{top:0}.burger__lines span{top:6.5px}.burger__lines::after{bottom:0}
  .mnav[open]{display:block;position:fixed;inset:0;top:0;z-index:120}
  .mnav__scrim{position:fixed;inset:0;background:rgba(20,17,15,.55)}
  .mnav__panel{position:fixed;top:0;right:0;bottom:0;width:min(88vw,380px);background:var(--paper);border-left:var(--l4) solid var(--ink);overflow-y:auto;display:flex;flex-direction:column}
  .mnav__head{display:flex;justify-content:space-between;align-items:center;padding:14px 18px;border-bottom:var(--l3) solid var(--ink)}
  .mnav__list a{display:flex;justify-content:space-between;align-items:center;padding:14px 18px;border-bottom:var(--l1) solid var(--ink);font-weight:600}
  .mnav__list a:hover,.mnav__list a[aria-current=page]{background:var(--yellow);color:var(--ink)}
  .mnav__group{font-family:var(--f-disp);font-size:.72rem;text-transform:uppercase;letter-spacing:.06em;padding:14px 18px 6px;color:var(--ink-soft)}
  .mnav__cta{display:grid;grid-template-columns:1fr 1fr;gap:0;margin-top:auto;border-top:var(--l3) solid var(--ink)}
  .mnav__cta .btn{border-radius:0;border:0}
  .mnav__cta .btn+.btn{border-left:var(--l2) solid var(--ink)}
}
@media(max-width:520px){.wordmark{font-size:1.12rem}}

/* ---------- buttons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;font-family:var(--f-sans);font-weight:700;font-size:.96rem;letter-spacing:-.01em;padding:13px 22px;border:var(--l2) solid var(--ink);background:var(--paper);color:var(--ink);cursor:pointer;text-align:center;transition:transform .08s ease,background .12s ease}
.btn:hover{background:var(--paper-2)}
.btn:active{transform:translateY(1px)}
.btn--primary{background:var(--red);color:var(--on-red);border-color:var(--ink)}
.btn--primary:hover{background:#b82922}
.btn--blue{background:var(--blue);color:var(--on-blue)}
.btn--blue:hover{background:#16296a}
.btn--yellow{background:var(--yellow);color:var(--on-yellow)}
.btn--yellow:hover{background:#d9ae00}
.btn--ink{background:var(--ink);color:var(--paper)}
.btn--ink:hover{background:#000}
.btn--ghost{background:transparent}
.btn--lg{padding:16px 30px;font-size:1.06rem}
.btn--sm{padding:9px 15px;font-size:.86rem;border-width:var(--l1)}
.btn--block{display:flex;width:100%}
.btn[disabled],.btn[aria-disabled=true]{opacity:.5;cursor:not-allowed}
.btn__i{width:1.1em;height:1.1em}

/* ---------- flash ---------- */
.flashes{position:sticky;top:66px;z-index:60}
.flash{display:flex;gap:12px;align-items:flex-start;padding:14px var(--gutter);border-bottom:var(--l2) solid var(--ink);font-weight:600}
.flash--success{background:var(--green);color:var(--on-green)}
.flash--error{background:var(--bad);color:#fbeceb}
.flash--info{background:var(--yellow);color:var(--ink)}
.flash__x{margin-left:auto;background:none;border:0;cursor:pointer;font-weight:800;font-size:1.2em;line-height:1}

/* ---------- hero (De Stijl vlakkenraster) ---------- */
.hero{border-bottom:var(--l4) solid var(--ink)}
.hero__grid{display:grid;grid-template-columns:1.55fr 1fr;grid-template-rows:auto auto auto;gap:0}
.hero__cell{border-right:var(--l3) solid var(--ink);border-bottom:var(--l3) solid var(--ink);min-width:0}
.hero__main{grid-row:span 3;background:var(--red);color:var(--on-red);display:flex;flex-direction:column;justify-content:space-between;gap:28px;padding:clamp(26px,4vw,56px);container-type:inline-size}
.hero__feat{background:var(--paper);padding:clamp(16px,2vw,22px);display:flex;flex-direction:column;gap:12px;min-width:0}
.hero__feat__h{font-family:var(--f-disp);font-size:1rem}
.hero__feat__row{display:grid;grid-template-columns:repeat(3,1fr);gap:0;border:var(--l2) solid var(--ink)}
.hero__feat__row a{aspect-ratio:1/1;overflow:hidden;border-right:var(--l1) solid var(--ink);position:relative}
.hero__feat__row a:last-child{border-right:0}
.hero__feat__row img,.hero__feat__row svg{width:100%;height:100%;object-fit:cover}
.hero__feat .lnk{margin-top:auto;font-weight:700;display:inline-flex;align-items:center;gap:7px;border-bottom:var(--l2) solid currentColor;align-self:flex-start;padding-bottom:2px}
.hero__eyebrowless{display:flex;flex-direction:column;gap:18px}
.hero__wm{font-family:var(--f-exp);font-weight:900;font-stretch:125%;line-height:.86;letter-spacing:-.03em;font-size:13.5cqi;text-transform:none}
.hero__sub{font-size:var(--step-1);font-weight:600;max-width:22ch}
.hero__cta{display:flex;flex-wrap:wrap;gap:0}
.hero__cta .btn{border-color:var(--ink)}
.hero__cta .btn+.btn{border-left:0}
.hero__side,.hero__feat{border-left:var(--l3) solid var(--ink)}
.hero__side{background:var(--yellow);color:var(--on-yellow);padding:clamp(18px,2.4vw,28px);display:flex;flex-direction:column;gap:12px;justify-content:center;border-bottom:var(--l3) solid var(--ink)}
.hero__side--blue{background:var(--blue);color:var(--on-blue)}
.hero__kicker{font-family:var(--f-disp);font-size:var(--step-2);line-height:.92;letter-spacing:-.03em}
.hero__side p{font-size:var(--step--1);font-weight:600}
.hero__side .lnk{margin-top:auto;font-weight:700;display:inline-flex;align-items:center;gap:7px;border-bottom:var(--l2) solid currentColor;padding-bottom:2px;align-self:flex-start}
@media(max-width:820px){
  .hero__grid{grid-template-columns:1fr 1fr}
  .hero__main{grid-column:1 / -1;grid-row:auto;border-bottom:var(--l3) solid var(--ink)}
  .hero__feat{border-bottom:0}
  .hero__wm{font-size:22cqi}
}
@media(max-width:520px){
  .hero__grid{grid-template-columns:1fr}
  .hero__cell{border-right:0}
  .hero__side,.hero__feat{border-left:0;border-bottom:var(--l3) solid var(--ink)}
  .hero__feat{border-bottom:0}
  .hero__cta{flex-direction:column}
  .hero__cta .btn+.btn{border-left:var(--l2) solid var(--ink);border-top:0}
}

/* ---------- section head ---------- */
.section{padding-block:clamp(34px,5vw,64px)}
.section--tight{padding-block:clamp(22px,3vw,36px)}
.shead{display:flex;align-items:flex-end;justify-content:space-between;gap:18px;margin-bottom:22px;flex-wrap:wrap}
.shead__t{font-size:var(--step-2);letter-spacing:-.03em}
.shead__t .count{font-family:var(--f-sans);font-weight:700;font-size:.5em;color:var(--ink-soft);vertical-align:super;margin-left:.4em}
.shead__link{font-weight:700;display:inline-flex;align-items:center;gap:7px;border-bottom:var(--l2) solid var(--ink);padding-bottom:2px}
.shead__link:hover{color:var(--red)}
.lead{font-size:var(--step-1);font-weight:500;max-width:60ch;color:var(--ink-soft)}
.prose{max-width:68ch}
.prose p,.prose ul,.prose ol{margin-top:1rem}
.prose h2{font-size:var(--step-2);margin-top:2.2rem}
.prose h3{font-size:var(--step-1);margin-top:1.6rem}
.prose ul{list-style:none}
.prose ul li{position:relative;padding-left:24px}
.prose ul li::before{content:"";position:absolute;left:0;top:.55em;width:11px;height:11px;background:var(--red)}
.prose ol{counter-reset:n}
.prose ol li{position:relative;padding-left:34px;counter-increment:n}
.prose ol li::before{content:counter(n);position:absolute;left:0;top:0;font-family:var(--f-disp);font-size:.8em;color:var(--blue)}
.prose a{border-bottom:2px solid var(--red)}
.prose a:hover{background:var(--yellow)}

/* ---------- game grid / cards ---------- */
.gamegrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:0;border-top:var(--l2) solid var(--ink);border-left:var(--l2) solid var(--ink)}
.gamegrid--home{grid-template-columns:repeat(auto-fill,minmax(220px,1fr))}
.gcard{position:relative;min-width:0;border-right:var(--l2) solid var(--ink);border-bottom:var(--l2) solid var(--ink);background:var(--paper);display:flex;flex-direction:column}
.gcard__cover{aspect-ratio:4/5;position:relative;overflow:hidden;border-bottom:var(--l2) solid var(--ink)}
.gcard__cover img,.gcard__cover svg{width:100%;height:100%;object-fit:cover}
.gcard__tags{position:absolute;top:0;left:0;display:flex;flex-wrap:wrap;gap:0}
.tag{font-family:var(--f-disp);font-size:.62rem;letter-spacing:.04em;text-transform:uppercase;padding:4px 8px;border-right:var(--l1) solid var(--ink);border-bottom:var(--l1) solid var(--ink)}
.tag--new{background:var(--red);color:var(--on-red)}
.tag--pop{background:var(--yellow);color:var(--ink)}
.tag--excl{background:var(--blue);color:var(--on-blue)}
.tag--jackpot{background:var(--ink);color:var(--yellow)}
.gcard__body{padding:11px 13px 13px;display:flex;flex-direction:column;gap:3px;flex:1}
.gcard__name{font-weight:800;font-size:.98rem;letter-spacing:-.02em;line-height:1.1}
.gcard__prov{font-size:.8rem;color:var(--ink-soft);font-weight:600;overflow-wrap:anywhere}
.gcard__play{margin-top:9px}
.gcard__link{position:absolute;inset:0;z-index:1}
.gcard__play .btn{position:relative;z-index:2}

/* ---------- lobby toolbar / filters ---------- */
.lobby__bar{display:flex;flex-wrap:wrap;gap:0;border:var(--l2) solid var(--ink);margin-bottom:22px}
.lobby__search{display:flex;align-items:center;gap:9px;padding:11px 14px;flex:1 1 240px;min-width:0;border-right:var(--l2) solid var(--ink)}
.lobby__search input{border:0;background:transparent;width:100%;outline:none;font-weight:600}
.lobby__sort{display:flex;align-items:center;gap:8px;padding:0 12px;border-right:var(--l2) solid var(--ink)}
.lobby__sort select{border:0;background:transparent;font-weight:700;padding:11px 4px;cursor:pointer}
.chips{display:flex;flex-wrap:wrap;gap:0;border:var(--l2) solid var(--ink);border-bottom:0}
.chip{padding:10px 15px;font-weight:700;font-size:.9rem;border-right:var(--l1) solid var(--ink);border-bottom:var(--l2) solid var(--ink)}
.chip:hover{background:var(--paper-2)}
.chip[aria-current=true],.chip.is-on{background:var(--ink);color:var(--paper)}
.chip--prov[aria-current=true]{background:var(--blue);color:var(--on-blue)}

/* ---------- panels / info blocks ---------- */
.panel{border:var(--l3) solid var(--ink);background:var(--paper)}
.panel__h{padding:16px 20px;border-bottom:var(--l2) solid var(--ink);font-family:var(--f-disp);font-size:1.02rem;display:flex;align-items:center;gap:10px}
.panel__b{padding:20px}
.grid2{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:0;border-top:var(--l2) solid var(--ink);border-left:var(--l2) solid var(--ink)}
.grid2>*{border-right:var(--l2) solid var(--ink);border-bottom:var(--l2) solid var(--ink);min-width:0}
.tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr));gap:0}
.tile{padding:22px;border:var(--l2) solid var(--ink);margin:-1px 0 0 -1px;min-width:0;display:flex;flex-direction:column;gap:8px}
.tile__k{font-family:var(--f-disp);font-size:1.02rem}
.tile__d{font-size:.9rem;color:var(--ink-soft)}
.tile .i{width:26px;height:26px}

/* verticaal-vlakken (home productblokken) */
.verts{display:grid;grid-template-columns:repeat(4,1fr);border:var(--l3) solid var(--ink)}
.vert{padding:22px;border-right:var(--l2) solid var(--ink);min-width:0;display:flex;flex-direction:column;gap:10px;min-height:180px;color:var(--on-red)}
.vert:last-child{border-right:0}
.vert--red{background:var(--red)}.vert--yellow{background:var(--yellow);color:var(--on-yellow)}
.vert--blue{background:var(--blue);color:var(--on-blue)}.vert--ink{background:var(--ink);color:var(--paper)}
.vert__t{font-family:var(--f-disp);font-size:var(--step-1);line-height:.96}
.vert__d{font-size:.86rem;font-weight:600;opacity:.95}
.vert__go{margin-top:auto;font-weight:800;display:inline-flex;gap:7px;align-items:center;border-bottom:var(--l2) solid currentColor;align-self:flex-start;padding-bottom:2px}
@media(max-width:820px){.verts{grid-template-columns:1fr 1fr}.vert:nth-child(2){border-right:0}.vert{border-bottom:var(--l2) solid var(--ink)}}
@media(max-width:520px){.verts{grid-template-columns:1fr}.vert{border-right:0}}

/* ---------- forms ---------- */
.form{max-width:560px}
.form--wide{max-width:820px}
.fld{margin-bottom:18px;min-width:0}
.fld__l{display:block;font-weight:700;margin-bottom:6px;font-size:.92rem}
.fld__req{color:var(--red)}
.fld input[type=text],.fld input[type=email],.fld input[type=password],.fld input[type=number],.fld input[type=search],.fld input[type=tel],.fld select,.fld textarea{
  width:100%;padding:12px 14px;border:var(--l2) solid var(--ink);background:var(--paper);font-weight:500;outline:none}
.fld input:focus,.fld select:focus,.fld textarea:focus{border-color:var(--blue);box-shadow:inset 0 0 0 2px var(--blue)}
.fld--err input,.fld--err select,.fld--err textarea{border-color:var(--bad);box-shadow:inset 0 0 0 2px var(--bad)}
.fld__err{color:var(--bad);font-weight:700;font-size:.85rem;margin-top:6px;display:flex;gap:6px;align-items:center}
.fld__hint{color:var(--ink-soft);font-size:.85rem;margin-top:5px}
.fld__row{display:flex;gap:12px;flex-wrap:wrap}
.fld__row>*{flex:1;min-width:0}
.dob{display:grid;grid-template-columns:1fr 1.4fr 1.2fr;gap:10px}
.check{display:flex;gap:11px;align-items:flex-start;font-size:.92rem}
.check input{width:22px;height:22px;flex:none;accent-color:var(--red);margin-top:1px}
fieldset{border:var(--l2) solid var(--ink);padding:18px;min-width:0}
legend{font-family:var(--f-disp);font-size:.92rem;padding:0 8px}
.radios{display:flex;flex-direction:column;gap:0;border:var(--l2) solid var(--ink)}
.radio{display:flex;gap:12px;align-items:flex-start;padding:14px;border-bottom:var(--l1) solid var(--ink);cursor:pointer}
.radio:last-child{border-bottom:0}
.radio:hover{background:var(--paper-2)}
.radio input{accent-color:var(--red);width:20px;height:20px;margin-top:2px;flex:none}
.radio__t{font-weight:700}
.radio__d{font-size:.85rem;color:var(--ink-soft)}

/* ---------- registratie stappen ---------- */
.reg{display:grid;grid-template-columns:250px 1fr;gap:0;border:var(--l3) solid var(--ink)}
.reg__steps{border-right:var(--l3) solid var(--ink);background:var(--paper-2)}
.reg__step{display:flex;gap:12px;align-items:center;padding:14px 16px;border-bottom:var(--l1) solid var(--ink);font-weight:600;font-size:.9rem}
.reg__step:last-child{border-bottom:0}
.reg__num{width:28px;height:28px;flex:none;display:grid;place-items:center;font-family:var(--f-disp);font-size:.8rem;border:var(--l2) solid var(--ink);background:var(--paper)}
.reg__step.is-done .reg__num{background:var(--green);color:#fff;border-color:var(--green)}
.reg__step.is-current{background:var(--yellow);color:var(--ink)}
.reg__step.is-current .reg__num{background:var(--ink);color:var(--paper)}
.reg__body{padding:clamp(20px,3vw,34px);min-width:0}
@media(max-width:720px){.reg{grid-template-columns:1fr}.reg__steps{display:flex;overflow-x:auto;border-right:0;border-bottom:var(--l3) solid var(--ink)}.reg__step{border-bottom:0;border-right:var(--l1) solid var(--ink);white-space:nowrap}}

/* ---------- account layout ---------- */
.acc{display:grid;grid-template-columns:260px 1fr;gap:0;border:var(--l3) solid var(--ink);margin-block:clamp(20px,3vw,40px)}
.accnav{border-right:var(--l3) solid var(--ink);background:var(--paper-2);min-width:0}
.accnav__grp{font-family:var(--f-disp);font-size:.7rem;text-transform:uppercase;letter-spacing:.06em;color:var(--ink-soft);padding:14px 16px 4px}
.accnav a{display:flex;align-items:center;gap:10px;padding:11px 16px;border-bottom:var(--l1) solid var(--ink);font-weight:600;font-size:.9rem}
.accnav a:hover{background:var(--paper)}
.accnav a[aria-current=page]{background:var(--ink);color:var(--paper)}
.accnav a[aria-current=page] .i{color:var(--yellow)}
.acc__body{padding:clamp(20px,3vw,36px);min-width:0}
@media(max-width:820px){.acc{grid-template-columns:1fr}.accnav{border-right:0;border-bottom:var(--l3) solid var(--ink)}}

/* ---------- checks / status rows ---------- */
.checks{border:var(--l2) solid var(--ink)}
.checkrow{display:flex;gap:14px;align-items:flex-start;padding:15px 18px;border-bottom:var(--l1) solid var(--ink)}
.checkrow:last-child{border-bottom:0}
.checkrow__ic{width:30px;height:30px;flex:none;display:grid;place-items:center;border:var(--l2) solid var(--ink)}
.checkrow--ok .checkrow__ic{background:var(--green);color:#fff;border-color:var(--green)}
.checkrow--no .checkrow__ic{background:var(--paper-2)}
.checkrow__t{font-weight:800}
.checkrow__d{font-size:.88rem;color:var(--ink-soft)}
.badge{display:inline-flex;align-items:center;gap:6px;font-family:var(--f-disp);font-size:.7rem;letter-spacing:.03em;text-transform:uppercase;padding:4px 9px;border:var(--l1) solid var(--ink)}
.badge--ok{background:var(--green);color:#fff;border-color:var(--green)}
.badge--warn{background:#8a4a12;color:#fff;border-color:#8a4a12}
.badge--bad{background:var(--bad);color:#fff;border-color:var(--bad)}
.badge--info{background:var(--blue);color:#fff;border-color:var(--blue)}
.badge--pending{background:var(--yellow);color:var(--ink)}

/* ---------- tables ---------- */
.tablewrap{overflow-x:auto;border:var(--l2) solid var(--ink)}
table.data{width:100%;border-collapse:collapse;font-variant-numeric:tabular-nums;min-width:560px}
table.data th,table.data td{text-align:left;padding:12px 15px;border-bottom:var(--l1) solid var(--ink);border-right:var(--l1) solid var(--ink)}
table.data th{font-family:var(--f-disp);font-size:.74rem;text-transform:uppercase;letter-spacing:.04em;background:var(--paper-2)}
table.data tr:last-child td{border-bottom:0}
table.data td:last-child,table.data th:last-child{border-right:0}
.amt-plus{color:var(--green);font-weight:700}
.amt-min{color:var(--bad);font-weight:700}

/* ---------- empty states ---------- */
.empty{border:var(--l3) dashed var(--ink);padding:clamp(28px,5vw,54px);text-align:center;display:flex;flex-direction:column;align-items:center;gap:14px;background:var(--paper)}
.empty .i{width:44px;height:44px;color:var(--ink)}
.empty__t{font-family:var(--f-disp);font-size:var(--step-1)}
.empty__d{max-width:52ch;color:var(--ink-soft)}
.empty__links{display:flex;gap:0;flex-wrap:wrap;margin-top:6px}

/* ---------- live tables / event rows ---------- */
.rows{border:var(--l2) solid var(--ink)}
.row{display:grid;grid-template-columns:1fr auto;gap:14px;align-items:center;padding:14px 18px;border-bottom:var(--l1) solid var(--ink)}
.row:last-child{border-bottom:0}
.row__m{min-width:0}
.row__t{font-weight:800}
.row__meta{font-size:.85rem;color:var(--ink-soft);display:flex;gap:12px;flex-wrap:wrap}

/* betslip / odds */
.oddsbtn{border:var(--l2) solid var(--ink);background:var(--paper);padding:10px 14px;font-weight:800;font-variant-numeric:tabular-nums;min-width:64px;text-align:center;cursor:not-allowed;opacity:.55}

/* ---------- info strip (honest disclosures) ---------- */
.note{display:flex;gap:12px;align-items:flex-start;padding:15px 18px;border:var(--l2) solid var(--ink);background:var(--paper-2);font-size:.92rem}
.note .i{width:22px;height:22px;flex:none;color:var(--blue)}
.note--warn{border-color:var(--warn);background:#f6e7d6}
.note--warn .i{color:var(--warn)}

/* rg orgs logos */
.orgs{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,180px),1fr));gap:0;border-top:var(--l2) solid var(--ink);border-left:var(--l2) solid var(--ink)}
.org{border-right:var(--l2) solid var(--ink);border-bottom:var(--l2) solid var(--ink);padding:22px;display:flex;flex-direction:column;gap:12px;min-width:0}
.org__logo{height:46px;display:flex;align-items:center}
.org__logo img{max-height:46px;width:auto;object-fit:contain}
.org__logo--dark{background:var(--ink);padding:10px 14px;align-self:flex-start}
.org__name{font-weight:800}
.org__d{font-size:.85rem;color:var(--ink-soft)}
.org__lnk{font-weight:700;border-bottom:var(--l2) solid var(--red);align-self:flex-start;margin-top:auto}

/* ---------- age gate ---------- */
.agegate{position:fixed;inset:0;z-index:300;background:var(--ink);display:grid;place-items:center;padding:20px}
.agegate__card{background:var(--paper);border:var(--l4) solid var(--yellow);max-width:520px;width:100%}
.agegate__top{background:var(--red);color:var(--on-red);padding:22px 26px;display:flex;align-items:center;gap:14px;border-bottom:var(--l3) solid var(--ink)}
.agegate__18{font-family:var(--f-disp);font-size:1.8rem;background:var(--yellow);color:var(--ink);padding:4px 12px;line-height:1}
.agegate__b{padding:26px}
.agegate__q{font-family:var(--f-disp);font-size:var(--step-2);margin-bottom:18px}
.agegate__btns{display:grid;grid-template-columns:1fr 1fr;gap:0;border:var(--l2) solid var(--ink)}
.agegate__btns .btn{border:0;border-radius:0}
.agegate__btns .btn+.btn{border-left:var(--l2) solid var(--ink)}
.agegate__fine{margin-top:16px;font-size:.82rem;color:var(--ink-soft)}
.agegate__deny{padding:26px;text-align:center}

/* ---------- cookie banner ---------- */
.cookie{position:fixed;left:0;right:0;bottom:0;z-index:200;background:var(--paper);border-top:var(--l4) solid var(--ink)}
.cookie__in{display:grid;grid-template-columns:1fr auto;gap:20px;align-items:center;padding:18px var(--gutter)}
.cookie__txt{font-size:.9rem;max-width:70ch}
.cookie__txt b{font-family:var(--f-disp);font-weight:400}
.cookie__btns{display:flex;gap:0;flex-wrap:wrap}
.cookie__cats{display:flex;flex-wrap:wrap;gap:16px;padding:12px var(--gutter);border-top:var(--l1) solid var(--ink)}
.cookie__cat{display:flex;gap:8px;align-items:center;font-size:.85rem;font-weight:600}
.cookie__cat input{accent-color:var(--red);width:18px;height:18px}
[hidden]{display:none!important}
@media(max-width:720px){.cookie__in{grid-template-columns:1fr}}

/* ---------- footer ---------- */
.foot{background:var(--ink);color:var(--paper);border-top:var(--l4) solid var(--yellow);margin-top:60px}
.foot__slogan{background:var(--red);color:var(--on-red);padding:20px var(--gutter);display:flex;align-items:center;gap:16px;flex-wrap:wrap;font-weight:700;font-size:var(--step-1);border-bottom:var(--l3) solid var(--ink)}
.foot__grid{display:grid;grid-template-columns:1.4fr repeat(3,1fr);gap:28px;padding:44px var(--gutter)}
.foot__brand .wordmark{color:var(--paper)}
.foot__brand p{font-size:.86rem;color:#c7c0b3;margin-top:14px;max-width:34ch}
.foot h3{font-family:var(--f-disp);font-size:.78rem;text-transform:uppercase;letter-spacing:.06em;color:var(--yellow);margin-bottom:12px;font-weight:400}
.foot__col a{display:block;padding:5px 0;color:#ded7c9;font-size:.9rem}
.foot__col a:hover{color:var(--paper);text-decoration:underline;text-underline-offset:3px}
.foot__legal{border-top:var(--l1) solid #3a352e;padding:24px var(--gutter);display:grid;grid-template-columns:1fr auto;gap:20px;align-items:start;font-size:.82rem;color:#b3ab9d}
.foot__legal strong{color:var(--paper)}
.foot__ksa{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.foot__ksa .ksabox{background:#fff;padding:8px 12px;display:flex;align-items:center}
.foot__ksa .ksabox img{height:34px;width:auto}
.foot__cruks{font-family:var(--f-disp);font-size:.9rem;color:var(--paper);border:var(--l1) solid var(--yellow);padding:5px 10px}
@media(max-width:900px){.foot__grid{grid-template-columns:1fr 1fr}.foot__legal{grid-template-columns:1fr}}
@media(max-width:560px){.foot__grid{grid-template-columns:1fr}}

/* ---------- utilities ---------- */
.mt0{margin-top:0}.mt1{margin-top:1rem}.mt2{margin-top:2rem}.mb1{margin-bottom:1rem}
.muted{color:var(--ink-soft)}
.center{text-align:center}
.flexbtns{display:flex;gap:0;flex-wrap:wrap}
.flexbtns .btn{border-radius:0}
.flexbtns .btn+.btn{border-left:0}
.pagehead{padding:clamp(26px,4vw,50px) 0;border-bottom:var(--l4) solid var(--ink)}
.pagehead--red{background:var(--red);color:var(--on-red)}
.pagehead--blue{background:var(--blue);color:var(--on-blue)}
.pagehead--yellow{background:var(--yellow);color:var(--on-yellow)}
.pagehead--ink{background:var(--ink);color:var(--paper)}
.pagehead h1{font-family:var(--f-exp);font-weight:900;font-stretch:125%;font-size:var(--step-3);letter-spacing:-.025em}
.pagehead p{font-size:var(--step-1);font-weight:500;max-width:60ch;margin-top:12px}
.crumbs{display:flex;gap:8px;flex-wrap:wrap;font-size:.82rem;font-weight:600;margin-bottom:14px;opacity:.85}
.crumbs a{border-bottom:2px solid currentColor}
.subnav{display:flex;flex-wrap:wrap;gap:0;border:var(--l2) solid var(--ink);margin-bottom:24px}
.subnav a{padding:11px 16px;font-weight:700;font-size:.9rem;border-right:var(--l1) solid var(--ink)}
.subnav a:hover{background:var(--paper-2)}
.subnav a[aria-current=page]{background:var(--ink);color:var(--paper)}

/* ---------- sportsbook split (breed events + smalle bon) ---------- */
.split{display:grid;grid-template-columns:1fr 340px;gap:0;border:var(--l3) solid var(--ink);margin-top:0}
.split__main{border-right:var(--l3) solid var(--ink);min-width:0}
.split__side{min-width:0}
.split__side .panel{border:0}
@media(max-width:860px){.split{grid-template-columns:1fr}.split__main{border-right:0;border-bottom:var(--l3) solid var(--ink)}}

/* ---------- legal / doc layout ---------- */
.doc{display:grid;grid-template-columns:250px 1fr;gap:0;border:var(--l3) solid var(--ink);margin-block:clamp(20px,3vw,40px)}
.toc{border-right:var(--l3) solid var(--ink);background:var(--paper-2);align-self:start;position:sticky;top:88px}
.toc__h{font-family:var(--f-disp);font-size:.74rem;text-transform:uppercase;letter-spacing:.06em;padding:16px 18px 6px;color:var(--ink-soft)}
.toc a{display:block;padding:9px 18px;border-bottom:var(--l1) solid var(--ink);font-weight:600;font-size:.86rem}
.toc a:hover{background:var(--paper)}
.doc__body{padding:clamp(22px,3vw,42px);min-width:0}
.doc__body .prose{max-width:70ch}
.doc__body h2{scroll-margin-top:96px}
.docmeta{font-size:.85rem;color:var(--ink-soft);border-bottom:var(--l2) solid var(--ink);padding-bottom:14px;margin-bottom:8px;font-weight:600}
.doc__body table{width:100%;border-collapse:collapse;margin-top:1.2rem;font-size:.9rem}
.doc__body th,.doc__body td{text-align:left;padding:10px 13px;border:var(--l1) solid var(--ink);vertical-align:top}
.doc__body th{background:var(--paper-2);font-family:var(--f-disp);font-size:.72rem;text-transform:uppercase;letter-spacing:.03em}
@media(max-width:820px){.doc{grid-template-columns:1fr}.toc{position:static;border-right:0;border-bottom:var(--l3) solid var(--ink);display:flex;flex-wrap:wrap}.toc__h{width:100%}.toc a{border-bottom:0;border-right:var(--l1) solid var(--ink)}}

@media(prefers-reduced-motion:reduce){*{animation-duration:.001ms!important;transition-duration:.001ms!important}}