/* ==========================================================================
   National Casino Danmark - site.css  (forked from the Chile build)
   Prefix: nc-
   Art slots are CSS custom properties (--nc-art) so a missing file falls
   through to the gradient instead of a broken-image box. Paths inside this
   file resolve against THIS stylesheet, i.e. ../img/... - never page-relative.
   ========================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@500;600;700;800&family=Inter:wght@400;500;600&display=swap');

:root{
  /* Ground: dark olive. Measured in OKLab against the SEVEN grounds already in
     the network - MULTI #171514 (3.9), Portugal #1d0f14 (5.5), Canada #111a13
     (3.2), Germany #13141d (5.8), Italy #241107 (3.4), Poland #110c08 (6.8)
     and Chile #231a19 (3.1) - and 3.50 from the art plates' edge #1e120b.
     Olive is a yellow-green (hue 95); Canada's pine sits at 150, so the two
     greens do not read as the same site. */
  --nc-bg:#281f00;
  --nc-bg2:#2d2406;
  --nc-bar:#332b0f;
  --nc-bar2:#393115;
  --nc-card:#302708;
  --nc-card2:#352d11;
  --nc-line:#3e371f;
  --nc-line2:#48422b;

  /* ink */
  --nc-ink:#fffffa;
  --nc-ink2:#e1dfd7;
  --nc-ink3:#a5a298;
  --nc-on-accent:#1a1100;

  /* Accent stays gold: the logo is a flat #FEC882 mark, so an accent from a
     different family would leave the wordmark stranded. */
  --nc-a1:#fbcb96;
  --nc-a2:#eeab5c;
  --nc-a3:#e08f3c;
  --nc-accent:#f5bd87;
  --nc-accent-soft:rgba(245,189,135,.12);
  --nc-grad:linear-gradient(180deg,var(--nc-a1) 0%,var(--nc-a2) 100%);
  --nc-grad-h:linear-gradient(180deg,#fdd8ac 0%,#f3b871 100%);

  /* Fuchsia: the ornament colour - diamonds, section marks, list bullets,
     RTP pills, the carousel marker. Portugal jade, Canada maple red, Germany
     periwinkle, Italy basil, Poland amethyst, Chile teal; fuchsia is the
     seventh family, and it is the one an olive ground throws furthest
     forward. Gold stays dominant, because the logo is gold. */
  --nc-b1:#ef8fd0;
  --nc-b2:#c2489b;

  --nc-good:#6fcf97;
  --nc-live:#e2544e;

  /* metrics */
  --nc-top-h:72px;
  --nc-rail-w:235px;
  --nc-gut:26px;
  --nc-r:10px;
  --nc-r2:14px;
  --nc-measure:1040px;
  --nc-shadow:0 10px 30px rgba(0,0,0,.38);

  --nc-f-head:"Montserrat","Segoe UI Variable Display","Segoe UI",system-ui,-apple-system,"Helvetica Neue",Arial,sans-serif;
  --nc-f-body:"Inter","Segoe UI",system-ui,-apple-system,"Helvetica Neue",Arial,sans-serif;
}

*,*::before,*::after{box-sizing:border-box}

html{scroll-behavior:smooth}
body{
  margin:0;
  background:var(--nc-bg);
  color:var(--nc-ink);
  font-family:var(--nc-f-body);
  font-size:15px;
  line-height:1.62;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img{max-width:100%;display:block}
a,.go-link{color:var(--nc-accent);text-decoration:none}
/* Outbound links are spans since 28 Sep 2026 (no href, base64 payload), so
   every rule below written for a bare `a` names .go-link too - and the boxes
   are measured before and after the change in scratchpad/hide_snap.py. */
.go-link{cursor:pointer}
button{font:inherit;color:inherit}

/* `[hidden]` is only `display:none` in the UA sheet, so ANY author `display`
   beats it. The wheel's claim link is a `.nc-btn` (inline-flex) and would stay
   visible without this. */
[hidden]{display:none !important}

.nc-skip{position:absolute;left:-9999px;top:0;z-index:200;background:var(--nc-a2);color:var(--nc-on-accent);padding:10px 16px;border-radius:0 0 8px 0;font-weight:700}
.nc-skip:focus{left:0}

:focus-visible{outline:2px solid var(--nc-a1);outline-offset:2px}

/* ==========================================================================
   1. Header
   ========================================================================== */
.nc-top{
  position:fixed;inset:0 0 auto 0;z-index:60;
  height:var(--nc-top-h);
  background:var(--nc-bar);
  border-bottom:1px solid rgba(0,0,0,.35);
  display:flex;align-items:center;gap:14px;
  padding:0 18px 0 14px;
}
.nc-logo{display:flex;align-items:center;gap:9px;flex:none}
.nc-logo img{height:42px;width:auto}
.nc-burger{
  display:none;flex:none;width:38px;height:38px;border:0;border-radius:9px;
  background:rgba(255,255,255,.06);align-items:center;justify-content:center;cursor:pointer;
}
.nc-burger svg{width:19px;height:19px;fill:none;stroke:var(--nc-ink2);stroke-width:2;stroke-linecap:round}

.nc-search{
  flex:none;width:34px;height:34px;border:0;border-radius:50%;background:transparent;
  display:flex;align-items:center;justify-content:center;cursor:pointer;
}
.nc-search svg{width:19px;height:19px;fill:none;stroke:var(--nc-ink2);stroke-width:1.9;stroke-linecap:round}
.nc-search:hover svg{stroke:var(--nc-accent)}

.nc-nav{display:flex;align-items:center;gap:2px;margin:0 auto;min-width:0}
.nc-nav a,.nc-nav .go-link{
  font-family:var(--nc-f-head);font-weight:600;font-size:14.5px;letter-spacing:.1px;
  color:var(--nc-ink);padding:10px 14px;border-radius:8px;white-space:nowrap;
}
.nc-nav a:hover,.nc-nav .go-link:hover{color:var(--nc-accent)}
.nc-nav a[aria-current="page"]{color:#fff;font-weight:700}
.nc-dia{flex:none;width:9px;height:9px;transform:rotate(45deg);border:1.4px solid var(--nc-b2);border-radius:1.5px;margin:0 5px}

.nc-acts{display:flex;align-items:center;gap:10px;flex:none}

/* Country switcher. It sits beside the buttons at EVERY width - on a phone it
   collapses to the flag square alone, never into the drawer, because a
   switcher hidden behind a burger is a switcher nobody finds. */
.nc-geo{
  flex:none;height:38px;padding:0 9px;border:1px solid var(--nc-line2);border-radius:9px;
  background:rgba(255,255,255,.04);cursor:pointer;color:var(--nc-ink2);
  display:flex;align-items:center;gap:7px;
}
.nc-geo:hover{border-color:var(--nc-a2);color:var(--nc-ink)}
.nc-geo__c{font-family:var(--nc-f-head);font-weight:700;font-size:12.5px;letter-spacing:.5px}
.nc-geo .nc-caret{width:12px;height:12px;stroke-width:2.2;flex:none;opacity:.8}
.nc-geo .nc-fl{width:22px;height:22px}

/* buttons ---------------------------------------------------------------- */
.nc-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  font-family:var(--nc-f-head);font-weight:700;font-size:14px;letter-spacing:.2px;
  padding:11px 22px;border-radius:9px;border:0;cursor:pointer;text-align:center;
  transition:filter .18s ease,transform .18s ease,background .18s ease,color .18s ease;
}
.nc-btn:hover{transform:translateY(-1px)}
.nc-btn--fill{background:var(--nc-grad);color:var(--nc-on-accent);box-shadow:0 4px 14px rgba(238,171,92,.20)}
.nc-btn--fill:hover{background:var(--nc-grad-h)}
.nc-btn--ghost{background:transparent;color:var(--nc-ink);border:1.5px solid var(--nc-a1)}
.nc-btn--ghost:hover{background:rgba(251,203,150,.10);color:#fff}
.nc-btn--lg{padding:14px 34px;font-size:15.5px;border-radius:10px}
.nc-btn--sm{padding:9px 16px;font-size:13px;border-radius:8px}

/* ==========================================================================
   2. Shell + rail
   ========================================================================== */
.nc-shell{
  display:grid;
  grid-template-columns:var(--nc-rail-w) minmax(0,1fr);
  padding-top:var(--nc-top-h);
  align-items:start;
}
.nc-main{min-width:0;padding:0 0 60px}

.nc-rail{
  position:sticky;top:var(--nc-top-h);
  height:calc(100vh - var(--nc-top-h));
  overflow-y:auto;overflow-x:hidden;
  background:var(--nc-bg);
  border-right:1px solid rgba(255,255,255,.05);
  padding:12px 12px 26px;
  scrollbar-width:thin;scrollbar-color:var(--nc-line) transparent;
}
.nc-rail::-webkit-scrollbar{width:6px}
.nc-rail::-webkit-scrollbar-thumb{background:var(--nc-line);border-radius:3px}

.nc-rail__hi{
  display:flex;align-items:center;gap:11px;
  background:var(--nc-grad);color:var(--nc-on-accent);
  font-family:var(--nc-f-head);font-weight:700;font-size:14.5px;
  padding:13px 14px;border-radius:var(--nc-r);margin-bottom:9px;
  border:0;width:100%;cursor:pointer;text-align:left;
}
.nc-rail__hi:hover{background:var(--nc-grad-h)}
.nc-rail__hi svg{width:24px;height:24px;flex:none}

.nc-rail__sep{height:1px;background:rgba(255,255,255,.07);margin:14px 4px}

/* The site's own pages, shown in the drawer only while the header nav is hidden. */
.nc-rail__pages,.nc-rail__sep--pages{display:none}
.nc-rail__pages a{
  display:flex;align-items:center;gap:12px;padding:11px 12px;border-radius:9px;
  color:var(--nc-ink);font-family:var(--nc-f-head);font-weight:700;font-size:14.5px;
}
.nc-rail__pages a:hover{background:rgba(255,255,255,.05)}
.nc-rail__pages a[aria-current="page"]{background:var(--nc-accent-soft);color:var(--nc-accent)}
.nc-rail__pages svg{width:20px;height:20px;flex:none;fill:none;stroke:currentColor;
  stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}

.nc-rail__l{list-style:none;margin:0;padding:0}
.nc-rail__l a,.nc-rail__l .go-link{
  display:flex;align-items:center;gap:12px;
  padding:11px 12px;border-radius:9px;
  color:var(--nc-ink2);font-family:var(--nc-f-head);font-weight:600;font-size:14px;
}
.nc-rail__l a:hover,.nc-rail__l .go-link:hover{background:rgba(255,255,255,.05);color:var(--nc-ink)}
.nc-rail__l svg{width:21px;height:21px;flex:none;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.nc-rail__l .nc-t{flex:1 1 auto;min-width:0}
.nc-badge{
  flex:none;background:var(--nc-a2);color:var(--nc-on-accent);
  font-size:11.5px;font-weight:800;line-height:1;padding:4px 7px;border-radius:5px;
}
.nc-chev{width:14px !important;height:14px !important;opacity:.6;stroke-width:2.2}

/* application card */
.nc-appcard{
  display:flex;align-items:center;gap:11px;
  background:var(--nc-card);border:1px solid var(--nc-line);
  border-radius:var(--nc-r);padding:10px;margin-top:16px;
}
.nc-appcard__t{min-width:0}
.nc-appcard b{display:block;font-family:var(--nc-f-head);font-size:12.5px;color:var(--nc-ink);font-weight:700}
.nc-appcard span:not(:where(.go-link)){display:block;font-size:11px;color:var(--nc-ink3);line-height:1.35}
.nc-appcard__p{
  flex:none;width:52px;height:38px;border-radius:7px;
  background-image:var(--nc-art,none),linear-gradient(140deg,#4a7b58,#2f5c40);
  background-size:cover;background-position:center;
}

/* winners */
.nc-win{margin-top:18px}
.nc-win__h{
  font-family:var(--nc-f-head);font-size:12px;font-weight:700;letter-spacing:.5px;
  text-transform:uppercase;color:var(--nc-accent);margin:0 0 9px 4px;
}
.nc-win__l{list-style:none;margin:0;padding:0;display:grid;gap:7px}
.nc-win__l li{display:flex;align-items:center;gap:9px}
.nc-win__i{
  flex:none;width:34px;height:34px;border-radius:7px;
  background-image:var(--nc-art,none),linear-gradient(140deg,#5a3f6e,#33223f);
  background-size:cover;background-position:center;
}
.nc-win__t{min-width:0;font-size:11.5px;line-height:1.3}
.nc-win__t b{display:block;color:var(--nc-ink2);font-weight:600}
.nc-win__t span:not(:where(.go-link)){display:block;color:var(--nc-ink3);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* ==========================================================================
   3. Section furniture
   ========================================================================== */
.nc-wrap{padding:0 var(--nc-gut)}
.nc-sec{margin:34px 0}

/* The article is split into panels with full-width modules between them, so a
   continued panel must not re-assert the big top margin of the first one. */
.nc-art + .nc-sec,.nc-sec + .nc-wrap > .nc-art{margin-top:26px}

.nc-sh{display:flex;align-items:center;justify-content:center;gap:14px;margin:0 0 20px}
.nc-sh__t{
  font-family:var(--nc-f-head);font-weight:700;font-size:26px;letter-spacing:.2px;
  color:var(--nc-accent);margin:0;text-align:center;
}
.nc-sh__r{
  flex:1 1 0;min-width:20px;max-width:260px;height:10px;position:relative;
}
.nc-sh__r::before{
  content:"";position:absolute;top:50%;left:0;right:16px;height:1px;
  background:linear-gradient(90deg,transparent,var(--nc-line2));
}
.nc-sh__r::after{
  content:"";position:absolute;top:50%;right:0;width:8px;height:8px;margin-top:-4px;
  transform:rotate(45deg);border:1.4px solid var(--nc-b2);border-radius:1.5px;
}
.nc-sh__r--l{transform:scaleX(-1)}

/* ==========================================================================
   4. Hero carousel
   ========================================================================== */
.nc-hero{
  position:relative;margin:14px 0 0;border-radius:var(--nc-r2);overflow:hidden;
  background:var(--nc-bg2);
}
.nc-hero__vp{
  position:relative;min-height:410px;
  display:flex;overflow-x:auto;overflow-y:hidden;
  scroll-snap-type:x mandatory;scroll-behavior:smooth;
  -webkit-overflow-scrolling:touch;scrollbar-width:none;
}
.nc-hero__vp::-webkit-scrollbar{width:0;height:0}
/* An ordinary scroller, not a fading stage: one slide per page, snapped, and
   usable with a swipe or a trackpad whether or not the script runs. The strip
   is exactly as tall as one slide - the old stage stacked all four in flow the
   moment anything overrode its positioning, which is what put a 900px hole in
   the middle of every home page. */
.nc-slide{
  position:relative;flex:0 0 100%;min-width:0;overflow:hidden;
  scroll-snap-align:center;scroll-snap-stop:always;
  display:flex;align-items:center;justify-content:center;
  background-image:var(--nc-art,none),var(--nc-fb,linear-gradient(120deg,#3a2b3f,#241b2b 55%,#3d2a24));
  background-size:cover;background-position:center;
}
/* the dots mark the slide in view; nothing is hidden any more */
.nc-slide.is-on{opacity:1}
.nc-slide__gl{
  position:absolute;inset:0;
  background:
    radial-gradient(72% 100% at 50% 50%,rgba(10,8,8,.72),rgba(10,8,8,.30) 60%,transparent 78%),
    linear-gradient(180deg,rgba(10,8,8,.30),transparent 30%,rgba(10,8,8,.42));
}
.nc-slide__in{position:relative;z-index:2;text-align:center;padding:44px 26px;max-width:620px}
.nc-slide__k{
  display:inline-flex;align-items:center;gap:7px;
  font-family:var(--nc-f-head);font-size:11.5px;font-weight:700;letter-spacing:1.2px;
  text-transform:uppercase;color:var(--nc-on-accent);background:var(--nc-grad);
  padding:6px 13px;border-radius:999px;margin-bottom:16px;
}
.nc-slide__t{
  font-family:var(--nc-f-head);font-weight:800;font-size:clamp(24px,3.1vw,40px);
  line-height:1.16;margin:0 0 10px;color:#fff;text-shadow:0 3px 18px rgba(0,0,0,.55);
  /* A single 20-character compound - Danish "genindbetalingsbonus" - needs
     289px in a 262px panel at 320px and painted over the edge. anywhere breaks
     it only when it truly does not fit, and leaves no hyphen behind. */
  min-width:0;overflow-wrap:anywhere;
}
.nc-slide__v{
  font-family:var(--nc-f-head);font-weight:700;font-size:clamp(16px,1.7vw,22px);
  color:var(--nc-a1);margin:0 0 22px;text-shadow:0 2px 12px rgba(0,0,0,.55);
}
.nc-hero__dots{
  position:absolute;left:0;right:0;bottom:16px;z-index:3;
  display:flex;align-items:center;justify-content:center;gap:16px;
}
.nc-hero__dots button{
  width:11px;height:11px;padding:0;border:1.4px solid var(--nc-line2);border-radius:2px;
  transform:rotate(45deg);background:transparent;cursor:pointer;transition:all .2s ease;
}
.nc-hero__dots button[aria-selected="true"]{background:var(--nc-b1);border-color:var(--nc-b1)}

/* ==========================================================================
   5. Game grid
   ========================================================================== */
/* 170px, not 148: twelve tiles divide evenly by 6, 4, 3 and 2, and at 148 the
   desktop grid fell to seven columns and left a five-wide hole on row two. */
.nc-grid{
  display:grid;gap:14px;
  grid-template-columns:repeat(auto-fill,minmax(170px,1fr));
}
.nc-tile{min-width:0}
.nc-tile__a{
  position:relative;display:block;border-radius:var(--nc-r);overflow:hidden;
  aspect-ratio:3/4;
  background-image:var(--nc-art,none),var(--nc-fb,linear-gradient(160deg,#41323e,#241d24));
  background-size:cover;background-position:center;
  transition:transform .22s ease,box-shadow .22s ease;
}
.nc-tile__a:hover{transform:translateY(-3px);box-shadow:0 12px 26px rgba(0,0,0,.5)}
.nc-tile__a::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(0,0,0,.30) 0%,transparent 32%,transparent 48%,rgba(0,0,0,.80) 100%);
}
/* The RTP pill floats over the art; the promo tag sits in the caption instead,
   because top-left it collided with the pill on any tile under ~200px and got
   silently ellipsised. In the caption it can never run out of room. */
.nc-tile__rtp{
  position:absolute;top:6px;right:6px;z-index:2;
  font-family:var(--nc-f-head);font-size:9px;font-weight:800;letter-spacing:.2px;
  padding:4px 6px;border-radius:5px;line-height:1;white-space:nowrap;
  background:rgba(22,14,0,.82);color:var(--nc-b1);
}
.nc-tile__tag{
  display:inline-block;margin-bottom:5px;
  font-family:var(--nc-f-head);font-size:8.5px;font-weight:800;letter-spacing:.4px;
  text-transform:uppercase;padding:3px 6px;border-radius:4px;line-height:1;
  background:var(--nc-grad);color:var(--nc-on-accent);
}
.nc-tile__cap{position:absolute;left:0;right:0;bottom:0;z-index:2;padding:10px 9px}
.nc-tile__n{
  display:block;font-family:var(--nc-f-head);font-weight:800;font-size:12.5px;line-height:1.2;
  color:#fff;text-transform:uppercase;text-shadow:0 2px 8px rgba(0,0,0,.7);
  overflow-wrap:anywhere;
}
.nc-tile__p{display:block;font-size:9.5px;letter-spacing:.4px;text-transform:uppercase;color:#cecbc3;margin-top:3px}
.nc-tile__f{display:flex;align-items:center;gap:5px;padding:6px 3px 0;font-size:11px;color:var(--nc-ink3)}
.nc-tile__f svg{width:12px;height:12px;fill:currentColor}

/* live strip - 180px lets all six tables sit on one row at desktop width
   instead of wrapping 5 + 1 and leaving a hole. */
.nc-live{display:grid;gap:14px;grid-template-columns:repeat(auto-fill,minmax(180px,1fr))}
.nc-lt{
  position:relative;min-width:0;border-radius:var(--nc-r);overflow:hidden;
  aspect-ratio:4/3;display:block;
  background-image:var(--nc-art,none),var(--nc-fb,linear-gradient(150deg,#3d2f2a,#211a18));
  background-size:cover;background-position:center;
}
.nc-lt::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 40%,rgba(0,0,0,.82))}
.nc-lt:hover{box-shadow:0 12px 26px rgba(0,0,0,.5)}
.nc-lt__b{
  position:absolute;top:8px;left:8px;z-index:2;display:inline-flex;align-items:center;gap:5px;
  background:var(--nc-live);color:#fff;font-family:var(--nc-f-head);font-size:10px;font-weight:800;
  letter-spacing:.6px;text-transform:uppercase;padding:4px 8px;border-radius:5px;line-height:1;
}
.nc-lt__b i{width:5px;height:5px;border-radius:50%;background:#fff;display:block}
.nc-lt__c{position:absolute;left:0;right:0;bottom:0;z-index:2;padding:12px}
.nc-lt__n{display:block;font-family:var(--nc-f-head);font-weight:800;font-size:15px;color:#fff;line-height:1.2}
.nc-lt__p{display:block;font-size:11px;color:#cecbc3;margin-top:2px}

/* ==========================================================================
   6. Offer banners (the operator's Aktionen rows)
   ========================================================================== */
.nc-offer{
  position:relative;min-height:215px;border-radius:var(--nc-r2);overflow:hidden;
  display:flex;align-items:center;
  background-image:var(--nc-art,none),var(--nc-fb,linear-gradient(115deg,#3b2c34,#221a20 60%,#3a2a22));
  background-size:cover;background-position:center right;
  padding:26px;
}
/* Enough scrim for the copy card to read, not so much that it blacks out the
   art the way an .86 left stop did. The card carries its own translucent bg. */
.nc-offer::before{
  content:"";position:absolute;inset:0;
  background:linear-gradient(90deg,rgba(12,10,9,.80) 0%,rgba(12,10,9,.50) 48%,rgba(12,10,9,.08) 82%,transparent 100%);
}
.nc-offer__in{
  position:relative;z-index:2;max-width:520px;width:100%;
  border:1px solid rgba(245,189,135,.55);border-radius:var(--nc-r);
  background:rgba(20,17,15,.42);
  padding:22px 24px;
}
.nc-offer__k{
  display:flex;align-items:center;gap:9px;margin:0 0 12px;
  font-family:var(--nc-f-head);font-weight:700;font-size:19px;color:#fff;
  /* The headline is an anonymous flex item, so min-width:auto refuses to
     shrink it below its longest word, and the Danish compound
     "genindbetalingsbonus" walked straight out of the card at 320px.
     overflow-wrap:anywhere lowers the min-content contribution and breaks only
     when there is really no room. Automatic hyphenation is OFF: it breaks a
     word that merely does not fit the rest of the LINE, with the row half
     empty, which is what the owner saw (28 Sep 2026). */
  min-width:0;overflow-wrap:anywhere;hyphens:manual;-webkit-hyphens:manual;
}
.nc-offer__k svg{width:26px;height:26px;flex:none}
.nc-offer__v{
  font-family:var(--nc-f-head);font-weight:800;font-size:clamp(20px,2.3vw,28px);
  line-height:1.24;color:#fff;margin:0 0 16px;
}
.nc-offer__v em{font-style:normal;color:var(--nc-a1)}

/* slim in-article promo */
.nc-promo{
  position:relative;display:flex;flex-wrap:wrap;align-items:center;gap:16px;
  border-radius:var(--nc-r);overflow:hidden;padding:18px 20px;margin:26px 0;
  background-image:var(--nc-art,none),var(--nc-fb,linear-gradient(100deg,#3a2b31,#221a1d));
  background-size:cover;background-position:center right;
}
.nc-promo::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(14,11,10,.9),rgba(14,11,10,.55) 70%,rgba(14,11,10,.15))}
.nc-promo__t{position:relative;z-index:2;flex:1 1 260px;min-width:0}
.nc-promo__t b{display:block;font-family:var(--nc-f-head);font-size:15px;color:var(--nc-a1);font-weight:700}
.nc-promo__t span:not(:where(.go-link)){display:block;font-family:var(--nc-f-head);font-size:19px;font-weight:800;color:#fff;line-height:1.3;margin-top:3px}
.nc-promo .nc-btn{position:relative;z-index:2;flex:none}

/* ==========================================================================
   7. Tournaments / VIP
   ========================================================================== */
.nc-tours{display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(290px,1fr))}
.nc-tour{
  position:relative;min-width:0;border-radius:var(--nc-r2);overflow:hidden;padding:22px;
  background-image:var(--nc-art,none),var(--nc-fb,linear-gradient(140deg,#3a2d26,#201a17));
  background-size:cover;background-position:center;
  border:1px solid var(--nc-line);
}
.nc-tour::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(14,11,10,.72),rgba(14,11,10,.90))}
.nc-tour > *{position:relative;z-index:2}
.nc-tour__k{
  display:inline-block;font-family:var(--nc-f-head);font-size:10.5px;font-weight:800;letter-spacing:.8px;
  text-transform:uppercase;color:var(--nc-on-accent);background:var(--nc-grad);
  padding:4px 10px;border-radius:5px;margin-bottom:12px;
}
.nc-tour__n{font-family:var(--nc-f-head);font-weight:800;font-size:21px;margin:0 0 8px;color:#fff}
.nc-tour__p{font-family:var(--nc-f-head);font-weight:800;font-size:26px;color:var(--nc-a1);margin:0 0 4px}
.nc-tour__s{font-size:13px;color:var(--nc-ink3);margin:0 0 18px}

.nc-vip{
  position:relative;border-radius:var(--nc-r2);overflow:hidden;padding:30px 26px;
  background-image:var(--nc-art,none),var(--nc-fb,linear-gradient(160deg,#453227,#241a15 70%));
  background-size:cover;background-position:center;
  border:1px solid var(--nc-line);
}
.nc-vip::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(14,11,10,.62),rgba(14,11,10,.88))}
.nc-vip > *{position:relative;z-index:2}
.nc-vip__path{
  display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));
  margin:0 0 24px;padding:0;list-style:none;
}
.nc-vip__step{text-align:center;min-width:0}
.nc-vip__hex{
  width:74px;height:82px;margin:0 auto 9px;position:relative;
  background-image:var(--nc-art,none),var(--nc-fb,linear-gradient(160deg,#7a5c3a,#3b2c1d));
  background-size:cover;background-position:center;
  clip-path:polygon(50% 0%,100% 25%,100% 75%,50% 100%,0% 75%,0% 25%);
  display:flex;align-items:flex-end;justify-content:center;
}
.nc-vip__hex::after{
  content:"";position:absolute;inset:0;
  clip-path:polygon(50% 0%,100% 25%,100% 75%,50% 100%,0% 75%,0% 25%);
  box-shadow:inset 0 0 0 2px rgba(251,203,150,.45);
}
.nc-vip__lv{
  display:inline-block;font-family:var(--nc-f-head);font-size:10.5px;font-weight:800;
  letter-spacing:.4px;color:var(--nc-on-accent);background:var(--nc-grad);
  padding:3px 9px;border-radius:4px;
}
.nc-vip__pz{display:block;font-size:12.5px;color:var(--nc-ink2);margin-top:7px;line-height:1.35}

/* ==========================================================================
   8. Article
   ========================================================================== */
.nc-art{
  background:var(--nc-bg2);border:1px solid var(--nc-line);
  border-radius:var(--nc-r2);padding:34px 30px;margin-top:34px;
}
.nc-art__in > *{max-width:min(100%,var(--nc-measure));margin-inline:auto}
.nc-art h1{
  font-family:var(--nc-f-head);font-weight:800;font-size:clamp(27px,3.2vw,38px);
  line-height:1.2;margin:0 0 30px;color:#fff;
}
.nc-art h2{
  font-family:var(--nc-f-head);font-weight:700;font-size:clamp(21px,2.2vw,27px);
  line-height:1.28;margin:38px 0 14px;color:var(--nc-accent);
  padding-bottom:10px;border-bottom:1px solid var(--nc-line);
}
.nc-art h3{
  font-family:var(--nc-f-head);font-weight:700;font-size:18px;
  margin:26px 0 10px;color:var(--nc-ink);
}
/* German compounds: "Verantwortungsbewusstes" alone is wider than a 320px
   phone at h2 size. Hyphenate by the page's lang="de" dictionary; break
   anywhere only as a last resort. */
.nc-art h1,.nc-art h2,.nc-art h3{hyphens:manual;-webkit-hyphens:manual;overflow-wrap:break-word;
  hyphenate-limit-chars:14 6 6}
.nc-art p{margin:0 0 15px;color:var(--nc-ink2)}
.nc-art strong{color:var(--nc-ink)}
.nc-art__body a:not(.nc-btn){color:var(--nc-accent);text-decoration:underline;text-underline-offset:2px}

.nc-art ul,.nc-art ol{margin:0 0 18px;padding-left:0;list-style:none;color:var(--nc-ink2)}
.nc-art ul li{position:relative;padding-left:26px;margin-bottom:9px}
.nc-art ul li::before{
  content:"";position:absolute;left:6px;top:.62em;width:8px;height:8px;
  transform:rotate(45deg);background:var(--nc-b2);border-radius:1.5px;
}
.nc-art ol{counter-reset:nc-o}
.nc-art ol li{position:relative;padding-left:38px;margin-bottom:11px;counter-increment:nc-o}
.nc-art ol li::before{
  content:counter(nc-o);position:absolute;left:0;top:1px;
  width:26px;height:26px;border-radius:7px;background:var(--nc-grad);color:var(--nc-on-accent);
  font-family:var(--nc-f-head);font-weight:800;font-size:12.5px;
  display:flex;align-items:center;justify-content:center;
}

.nc-note{
  display:flex;gap:12px;align-items:flex-start;
  background:var(--nc-accent-soft);border-left:3px solid var(--nc-a2);
  border-radius:0 var(--nc-r) var(--nc-r) 0;padding:14px 18px;margin:0 0 18px;
  color:var(--nc-ink2);font-size:14.5px;
}
.nc-note svg{width:19px;height:19px;flex:none;margin-top:2px;fill:none;stroke:var(--nc-a2);stroke-width:1.8}

/* tables */
.nc-tw{overflow-x:auto;margin:0 0 22px;border:1px solid var(--nc-line);border-radius:var(--nc-r);
  scrollbar-width:thin;scrollbar-color:var(--nc-line2) transparent}
.nc-tw table{width:100%;border-collapse:collapse;min-width:520px;font-size:14px}
.nc-tw th,.nc-tw td{padding:12px 15px;text-align:left;border-bottom:1px solid var(--nc-line);vertical-align:top}
.nc-tw thead th{
  background:var(--nc-card2);color:var(--nc-accent);
  font-family:var(--nc-f-head);font-weight:700;font-size:12.5px;letter-spacing:.5px;text-transform:uppercase;
  border-bottom:1px solid var(--nc-line2);white-space:nowrap;
}
.nc-tw tbody tr:last-child td{border-bottom:0}
.nc-tw tbody tr:nth-child(even){background:rgba(255,255,255,.018)}
.nc-tw td:first-child{color:var(--nc-ink);font-weight:600}

/* toc */
.nc-toc{
  background:var(--nc-card);border:1px solid var(--nc-line);border-radius:var(--nc-r);
  padding:18px 22px;margin:0 auto 26px;
}
.nc-toc b{
  display:block;font-family:var(--nc-f-head);font-size:12px;font-weight:800;letter-spacing:.7px;
  text-transform:uppercase;color:var(--nc-accent);margin-bottom:10px;
}
.nc-toc ol{margin:0;padding:0;list-style:none;columns:2;column-gap:26px}
/* The number badge is absolutely positioned and 26px tall - taller than a
   one-line entry. Left to overhang its <li>, the last badge of column one was
   painted at the TOP of column two (the "tail of the 6"). The item has to
   contain its badge: an inline-block never fragments across columns, and the
   min-height gives it the badge's full 1+26px. */
.nc-toc li{padding-left:0;margin:0 0 7px;break-inside:avoid;counter-increment:none;
  display:inline-block;width:100%;min-height:27px;vertical-align:top}
.nc-toc li::before{display:none}
.nc-toc a{color:var(--nc-ink2);font-size:13.5px}
.nc-toc a:hover{color:var(--nc-accent)}

/* faq */
.nc-faq{display:grid;gap:10px;margin:0 auto 22px}
.nc-faq details{
  background:var(--nc-card);border:1px solid var(--nc-line);border-radius:var(--nc-r);
  overflow:hidden;
}
.nc-faq summary{
  list-style:none;cursor:pointer;padding:15px 46px 15px 18px;position:relative;
  font-family:var(--nc-f-head);font-weight:600;font-size:15px;color:var(--nc-ink);
}
.nc-faq summary::-webkit-details-marker{display:none}
.nc-faq summary::after{
  content:"";position:absolute;right:19px;top:50%;width:9px;height:9px;margin-top:-6px;
  border-right:2px solid var(--nc-a2);border-bottom:2px solid var(--nc-a2);
  transform:rotate(45deg);transition:transform .2s ease;
}
.nc-faq details[open] summary::after{transform:rotate(-135deg);margin-top:-2px}
.nc-faq summary:hover{color:var(--nc-accent)}
.nc-faq__a{padding:0 18px 16px;color:var(--nc-ink2);font-size:14.5px}
.nc-faq__a p{margin:0}

/* player reviews */
.nc-revs{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));margin:0 auto 24px}
.nc-rev{
  background:var(--nc-card);border:1px solid var(--nc-line);border-radius:var(--nc-r);
  padding:18px 20px;min-width:0;
}
.nc-rev__h{display:flex;align-items:center;gap:10px;margin-bottom:9px}
.nc-rev__av{
  flex:none;width:34px;height:34px;border-radius:50%;background:var(--nc-grad);
  color:var(--nc-on-accent);font-family:var(--nc-f-head);font-weight:800;font-size:14px;
  display:flex;align-items:center;justify-content:center;
}
.nc-rev__n{font-family:var(--nc-f-head);font-weight:700;font-size:14px;color:var(--nc-ink);min-width:0;overflow-wrap:anywhere}
.nc-rev__q{margin:0;color:var(--nc-ink2);font-size:14px;font-style:italic}

/* score panel */
.nc-score{
  display:flex;flex-wrap:wrap;align-items:center;gap:20px;
  background:var(--nc-card);border:1px solid var(--nc-line);border-radius:var(--nc-r);
  padding:20px 24px;margin:0 auto 22px;
}
.nc-score__big{
  /* min-width, not width: "Gesamtbewertung" is longer than the English
     "Overall Rating" and a fixed 98px box let it bleed out, dark-on-dark,
     reading "esamtbewertun". The badge grows to its label instead. */
  flex:none;min-width:98px;height:98px;border-radius:18px;background:var(--nc-grad);
  color:var(--nc-on-accent);display:flex;flex-direction:column;align-items:center;justify-content:center;
  text-align:center;padding:0 12px;
}
.nc-score__big b{font-family:var(--nc-f-head);font-weight:800;font-size:30px;line-height:1}
.nc-score__big span:not(:where(.go-link)){font-family:var(--nc-f-head);font-size:11px;font-weight:700;letter-spacing:.5px;margin-top:2px}
.nc-score__t{flex:1 1 240px;min-width:0}
.nc-score__t b{display:block;font-family:var(--nc-f-head);font-size:16px;color:var(--nc-ink);margin-bottom:4px}
.nc-score__t span:not(:where(.go-link)){display:block;color:var(--nc-ink3);font-size:13.5px}

.nc-byline{
  display:flex;align-items:center;gap:12px;margin:26px auto 0;
  padding-top:18px;border-top:1px solid var(--nc-line);color:var(--nc-ink3);font-size:13.5px;
}
.nc-byline__av{
  flex:none;width:38px;height:38px;border-radius:50%;background:var(--nc-card2);
  border:1px solid var(--nc-line2);color:var(--nc-accent);
  font-family:var(--nc-f-head);font-weight:800;font-size:14px;
  display:flex;align-items:center;justify-content:center;
}

/* ==========================================================================
   9. Footer
   ========================================================================== */
.nc-foot{
  background:var(--nc-bar);border-top:1px solid rgba(0,0,0,.35);
  padding:34px var(--nc-gut) 30px;
}
.nc-foot__g{
  display:grid;gap:26px;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));
  max-width:1280px;margin:0 auto 24px;
}
.nc-foot__c{min-width:0}
.nc-foot__h{
  font-family:var(--nc-f-head);font-size:12px;font-weight:800;letter-spacing:.8px;
  text-transform:uppercase;color:var(--nc-accent);margin:0 0 12px;
}
.nc-foot__l{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.nc-foot__l a,.nc-foot__l .go-link{color:var(--nc-ink2);font-size:13.5px}
.nc-foot__l a:hover,.nc-foot__l .go-link:hover{color:var(--nc-accent)}
/* Same 1280px measure and centring as .nc-foot__g, or the chips sit flush to
   the screen edge while the columns above them are indented. */
.nc-pay{display:flex;flex-wrap:wrap;gap:9px;max-width:1280px;margin:0 auto 22px}
.nc-pay span:not(:where(.go-link)){
  display:inline-flex;align-items:center;justify-content:center;height:30px;padding:0 11px;
  background:rgba(255,255,255,.06);border:1px solid var(--nc-line);border-radius:6px;
  font-family:var(--nc-f-head);font-size:11px;font-weight:700;color:var(--nc-ink2);letter-spacing:.3px;
}
.nc-foot__b{
  max-width:1280px;margin:0 auto;padding-top:20px;border-top:1px solid rgba(255,255,255,.07);
  display:flex;flex-wrap:wrap;align-items:center;gap:14px;
  color:var(--nc-ink3);font-size:12.5px;
}
.nc-age{
  flex:none;width:34px;height:34px;border-radius:50%;border:2px solid var(--nc-ink3);
  display:flex;align-items:center;justify-content:center;
  font-family:var(--nc-f-head);font-weight:800;font-size:12px;color:var(--nc-ink2);
}
.nc-foot__d{flex:1 1 380px;min-width:0;margin:0;line-height:1.55}

/* ==========================================================================
   10. Modals / cookie / chat
   ========================================================================== */
.nc-modal{
  position:fixed;inset:0;z-index:90;display:none;
  align-items:center;justify-content:center;padding:20px;
  background:rgba(8,6,6,.72);backdrop-filter:blur(3px);
}
.nc-modal.is-on{display:flex}
.nc-modal__box{
  position:relative;width:100%;max-width:760px;max-height:88vh;overflow-y:auto;
  background:var(--nc-bar);border:1px solid var(--nc-line2);border-radius:var(--nc-r2);
  padding:30px;box-shadow:var(--nc-shadow);
}
.nc-modal__x{
  position:absolute;top:12px;right:12px;width:34px;height:34px;border-radius:50%;
  border:1.5px solid var(--nc-a2);background:transparent;color:var(--nc-a1);
  display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:17px;line-height:1;
}
.nc-modal__x:hover{background:var(--nc-a2);color:var(--nc-on-accent)}
.nc-modal__t{
  font-family:var(--nc-f-head);font-weight:800;font-size:26px;color:var(--nc-accent);
  text-align:center;margin:0 0 22px;
}

/* language picker */
.nc-langs{display:grid;gap:10px;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));list-style:none;margin:0;padding:0}
.nc-langs a{
  display:flex;align-items:center;gap:10px;min-width:0;
  background:var(--nc-card);border:1px solid var(--nc-line);border-radius:9px;
  padding:10px 12px;color:var(--nc-ink2);font-size:13.5px;font-family:var(--nc-f-head);font-weight:600;
}
.nc-langs a:hover{border-color:var(--nc-a2);color:var(--nc-ink)}
.nc-langs a[aria-current="true"]{border-color:var(--nc-a1);background:var(--nc-grad);color:var(--nc-on-accent)}
.nc-fl{
  flex:none;width:26px;height:26px;border-radius:50%;overflow:hidden;
  display:block;background:#3e371f;box-shadow:inset 0 0 0 1px rgba(255,255,255,.12);
}
.nc-langs .nc-t{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* wheel */
.nc-wheel{display:flex;flex-direction:column;align-items:center;gap:22px}
/* The wedge colours come from build.py as an inline `background`, so the
   highlighted wedge is always the one the rigged spin lands on. */
.nc-wheel__d{
  position:relative;width:min(340px,74vw);aspect-ratio:1;border-radius:50%;
  box-shadow:0 0 0 12px #d8bb8f,0 0 0 16px #a8895f,0 14px 40px rgba(0,0,0,.55);
  transition:transform 4.6s cubic-bezier(.16,.84,.28,1);
}
.nc-wheel__d::after{
  content:"";position:absolute;inset:26%;border-radius:50%;
  background:radial-gradient(circle at 38% 32%,#fffdf7,#e2d6c0);
  box-shadow:inset 0 -6px 14px rgba(0,0,0,.18);
}
/* Each label is a full-size layer rotated about the DISC centre. Anchoring on
   the text box instead made transform-origin depend on the label's own width,
   so long and short labels landed at different radii and overlapped. */
.nc-wheel__seg{
  position:absolute;inset:0;
  display:flex;justify-content:center;align-items:flex-start;
  padding-top:8%;transform-origin:50% 50%;pointer-events:none;
  font-family:var(--nc-f-head);font-weight:800;font-size:11.5px;color:#fff8ee;
  text-shadow:0 1px 3px rgba(0,0,0,.6);white-space:nowrap;
}
.nc-wheel__pin{
  position:absolute;left:50%;top:-13px;transform:translateX(-50%);
  width:26px;height:34px;background:var(--nc-grad);
  clip-path:polygon(50% 100%,0 32%,50% 0,100% 32%);z-index:3;
}
.nc-wheel__f{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:18px}
.nc-wheel__f span:not(:where(.go-link)){font-family:var(--nc-f-head);font-size:13.5px;color:var(--nc-ink2);font-weight:600}
.nc-wheel__out{
  min-height:24px;font-family:var(--nc-f-head);font-weight:800;font-size:17px;color:var(--nc-a1);text-align:center;
}

/* cookie */
.nc-cookie{
  position:fixed;left:50%;bottom:0;transform:translateX(-50%);z-index:70;
  display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:8px 16px;
  width:min(760px,100%);
  background:var(--nc-bar2);border:1px solid var(--nc-line2);border-bottom:0;
  border-radius:var(--nc-r) var(--nc-r) 0 0;
  padding:12px 20px;font-size:13.5px;color:var(--nc-ink2);box-shadow:0 -8px 24px rgba(0,0,0,.34);
}
.nc-cookie.is-off{display:none}

/* chat bubble */
.nc-chat{
  position:fixed;right:18px;bottom:18px;z-index:65;
  width:52px;height:52px;border-radius:50%;background:var(--nc-bar2);border:1px solid var(--nc-line2);
  display:flex;align-items:center;justify-content:center;box-shadow:var(--nc-shadow);
}
.nc-chat svg{width:24px;height:24px;fill:none;stroke:var(--nc-a1);stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}

/* app store buttons - the label is long in most languages, so it is allowed to
   wrap onto two lines instead of stretching the button across the banner */
.nc-stores{display:flex;flex-wrap:wrap;gap:12px;margin:0 auto 22px}
.nc-store{
  display:inline-flex;align-items:center;gap:12px;min-width:0;max-width:260px;
  background:rgba(20,17,15,.72);border:1px solid var(--nc-line2);border-radius:var(--nc-r);
  padding:11px 18px;color:var(--nc-ink);font-family:var(--nc-f-head);font-weight:700;
  font-size:13.5px;line-height:1.25;backdrop-filter:blur(3px);
}
.nc-store:hover{border-color:var(--nc-a2);background:rgba(46,40,36,.86)}
.nc-store svg{width:26px;height:26px;flex:none;fill:var(--nc-a1)}
.nc-store__t{min-width:0;text-align:left}

/* image-only banner that carries the store buttons */
/* 300px, not 260: at 260 the desktop box is 4.28:1 against a 3.2:1 plate and
   `cover` threw away 25% of the height, slicing the top off the phone. */
.nc-appbar{
  position:relative;display:flex;align-items:flex-end;
  min-height:300px;border-radius:var(--nc-r2);overflow:hidden;padding:24px;
  background-image:var(--nc-art,none),var(--nc-fb,linear-gradient(115deg,#3a2c26,#1d1715 60%,#3d2a20));
  background-size:cover;background-position:center;
}
.nc-appbar::before{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,transparent 30%,rgba(12,10,9,.72) 100%);
}
.nc-appbar .nc-stores{position:relative;z-index:2;margin:0}

/* Flag marks live in css/flags.css - real SVG geometry, generated by
   tools/make_flags.py. The CSS-gradient versions that used to sit here
   were unrecognisable at 26px (Norway read as Denmark). */

/* ==========================================================================
   10b. Loading screen
   ==========================================================================
   The brand's thin outer hexagon spinning around the filled mark, over the
   page ground - the operator's own splash.

   The exit is a CSS animation, not a JS call. If site.js never runs (blocked,
   parse error, old browser) the cover still lifts on its own, so a script
   failure can never leave the site behind a curtain. JS only ADDS `is-done`
   to bring the exit forward once `load` has fired. `visibility:hidden` at the
   end of the keyframes is what stops it eating clicks; `opacity:0` alone
   would leave an invisible full-screen lid in place. */
.nc-boot{
  position:fixed;inset:0;z-index:300;
  display:flex;align-items:center;justify-content:center;
  background:var(--nc-bg);
  animation:nc-boot-out .45s ease 1.05s forwards;
}
.nc-boot.is-done{animation:nc-boot-out .3s ease 0s forwards}
@keyframes nc-boot-out{to{opacity:0;visibility:hidden}}

.nc-boot__m{position:relative;width:132px;height:145px}
.nc-boot__ring,.nc-boot__core{position:absolute;inset:0;width:100%;height:100%;display:block}
.nc-boot__ring{
  fill:var(--nc-a1);opacity:.85;
  transform-origin:50% 50%;
  animation:nc-boot-spin 2.8s linear infinite;
}
.nc-boot__core{fill:var(--nc-a1);animation:nc-boot-beat 1.7s ease-in-out infinite}
@keyframes nc-boot-spin{to{transform:rotate(360deg)}}
@keyframes nc-boot-beat{50%{opacity:.72}}

/* ==========================================================================
   10c. Pieces this fork adds
   ========================================================================== */

/* Spec table: term/value pairs with no header row, because the source has no
   header row. A centred head over two columns of this shape fits neither. */
.nc-tw--spec table{min-width:0}
.nc-tw--spec th[scope="row"]{
  width:30%;min-width:150px;
  background:var(--nc-card2);color:var(--nc-accent);
  font-family:var(--nc-f-head);font-weight:700;font-size:13px;text-align:left;
  border-right:1px solid var(--nc-line);
}
.nc-tw--spec td{color:var(--nc-ink2)}

/* Player review: a bold headline quote over the body, the shape the source
   itself uses. No star row - the article gives no per-reviewer score, and a
   uniform five stars on every card would be a number nobody wrote. */
.nc-rev__t{
  margin:0 0 8px;font-family:var(--nc-f-head);font-weight:700;font-size:14.5px;
  line-height:1.35;color:var(--nc-a1);
}
.nc-stars{color:var(--nc-a1);letter-spacing:2px;white-space:nowrap;font-size:15px}

/* Store buttons. The logo sits in its own box so the two marks optically
   match - the Apple glyph is tall and narrow, the robot short and wide. */
.nc-store__i{
  flex:none;width:28px;height:28px;display:flex;align-items:center;justify-content:center;
}
.nc-store__i svg{width:100%;height:100%;fill:var(--nc-a1);display:block}
.nc-store:hover .nc-store__i svg{fill:#fff}

.nc-wheel__w{position:relative;width:min(340px,74vw)}
.nc-foot__logo{margin-bottom:15px;height:48px;width:auto}

/* ==========================================================================
   10d. Country strip
   ==========================================================================
   The footer half of the cross-link cluster: the same page type on each of
   the ten National Casino country domains. */
.nc-geo-strip{max-width:1280px;margin:0 auto 20px}
.nc-geo-strip__l{display:flex;flex-wrap:wrap;gap:8px}
.nc-geo-strip a{
  display:inline-flex;align-items:center;gap:8px;min-width:0;
  background:rgba(255,255,255,.045);border:1px solid var(--nc-line);border-radius:999px;
  padding:6px 13px 6px 7px;color:var(--nc-ink2);font-size:12.5px;line-height:1.3;
}
.nc-geo-strip a:hover{border-color:var(--nc-a2);color:var(--nc-ink)}
.nc-geo-strip a[aria-current="true"]{border-color:var(--nc-a1);color:var(--nc-a1)}
.nc-geo-strip .nc-fl{width:20px;height:20px}

/* ==========================================================================
   11. Motion
   ========================================================================== */
/* The reveal rule MUST outrank the hide rule. `html.nc-js .nc-in` is (0,2,1);
   a bare `.nc-in.is-vis` is only (0,2,0), so the class the JS adds lost the
   cascade and every module stayed at opacity 0 in real browsers. Keep the same
   `html.nc-js` prefix on the reveal so it scores (0,3,1) and wins. */
html.nc-js .nc-in{opacity:0;transform:translateY(16px)}
.nc-in{transition:opacity .55s ease,transform .55s ease}
html.nc-js .nc-in.is-vis{opacity:1;transform:none}
.nc-in.is-vis{opacity:1;transform:none}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  html.nc-js .nc-in{opacity:1;transform:none}
  .nc-in,.nc-btn,.nc-tile__a,.nc-slide,.nc-wheel__d{transition:none !important}
  /* Stop the spin and the beat, but NEVER nc-boot-out: that animation is how
     the splash lifts, so a blanket `animation:none` here would pin the cover
     over the page for every reduced-motion visitor. */
  .nc-boot__ring,.nc-boot__core{animation:none !important}
}

/* ==========================================================================
   12. Responsive
   ========================================================================== */
@media (max-width:1180px){
  .nc-nav a,.nc-nav .go-link{padding:10px 10px;font-size:13.5px}
  .nc-dia{margin:0 1px}
}
@media (max-width:1024px){
  :root{--nc-gut:18px}
  .nc-burger{display:flex}
  .nc-shell{grid-template-columns:minmax(0,1fr)}
  .nc-rail{
    position:fixed;top:var(--nc-top-h);left:0;width:var(--nc-rail-w);z-index:55;
    transform:translateX(-100%);transition:transform .26s ease;
    box-shadow:14px 0 32px rgba(0,0,0,.42);
  }
  body.nc-rail-on .nc-rail{transform:none}
  .nc-scrim{position:fixed;inset:var(--nc-top-h) 0 0;background:rgba(22,14,0,.62);z-index:54;display:none}
  body.nc-rail-on .nc-scrim{display:block}
  /* Once the header nav is gone the site pages are only reachable from the
     drawer, so the drawer grows its own copy; and the actions must claim the
     space the nav gave up instead of sitting mid-header. */
  .nc-nav{display:none}
  .nc-acts{margin-left:auto}
  .nc-rail__pages{display:block}
  .nc-rail__sep--pages{display:block}
  .nc-hero__vp{min-height:340px}
}

/* --------------------------------------------------------------------------
   Phone. The header row is a width budget: burger 38 + logo 30 + search 34 +
   login + register + flag 38, and at 390px it does not balance. Login goes
   first (it is the one action a visitor can reach from the operator page
   anyway), then the search, then the switcher's country code - but never the
   switcher itself, which stays beside the buttons as a flag square.
   -------------------------------------------------------------------------- */
@media (max-width:760px){
  :root{--nc-top-h:60px;--nc-gut:13px}
  body{font-size:14.5px}
  .nc-logo img{height:30px}
  .nc-top{gap:9px;padding:0 12px 0 10px}
  .nc-acts{gap:7px}
  .nc-acts .nc-btn{padding:9px 13px;font-size:12.5px}
  .nc-art{padding:20px 14px}
  .nc-art h1{margin-bottom:22px}
  .nc-art h2{margin-top:30px}
  .nc-sec{margin:26px 0}
  /* Phone hero. Keeping the copy ON the plate here throws the picture away:
     a 2.6:1 plate inside a ~1.4:1 box is cropped to its middle 50%, and the
     detective the whole page is built around sits in the left fifth. Split it
     instead - the art at its own ratio, the copy on the panel under it - and
     nothing is cropped at all. `--nc-art` is a custom property set on the
     slide, so it inherits down to the layer that now carries the picture. */
  .nc-hero__vp{min-height:0}
  /* A flex box is a ROW by default: without this the plate and the copy
     sit side by side, the copy overflows what is left of the slide and
     spills over the next banner. */
  .nc-slide{background-image:none;flex-direction:column;align-items:stretch}
  .nc-slide__gl{
    position:relative;inset:auto;display:block;width:100%;aspect-ratio:2.6/1;
    background-image:var(--nc-art,none),var(--nc-fb,linear-gradient(120deg,#3a2b3f,#241b2b 55%,#3d2a24));
    background-size:cover;background-position:center;
  }
  .nc-slide__gl{flex:none}
  .nc-slide__in{flex:1 1 auto;width:100%;padding:18px 16px 30px;max-width:none;background:var(--nc-bg2)}
  .nc-slide__t,.nc-slide__v{text-shadow:none}
  .nc-hero__dots{position:static;padding:0 0 16px;background:var(--nc-bg2)}
  .nc-grid{grid-template-columns:repeat(auto-fill,minmax(124px,1fr));gap:10px}
  .nc-live{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px}
  .nc-offer{padding:14px;min-height:0}
  .nc-offer__in{padding:16px;max-width:none}
  .nc-toc{padding:15px 16px}
  .nc-toc ol{columns:1}
  .nc-modal__box{padding:24px 16px}
  .nc-foot{padding:26px var(--nc-gut) 26px}
  .nc-foot__g{gap:20px}
  .nc-score{padding:16px;gap:14px}
  .nc-score__big{min-width:72px;height:72px;border-radius:14px;padding:0 9px}
  .nc-score__big span{font-size:9.5px;letter-spacing:.3px}
  .nc-score__big b{font-size:24px}
  .nc-appbar{min-height:210px;padding:16px}
  .nc-vip__path{grid-template-columns:repeat(2,minmax(0,1fr))}
  .nc-tour{padding:18px}
  .nc-boot__m{width:104px;height:114px}
  /* The cookie bar is fixed to the bottom and the chat bubble sits on top of
     it at this width; give the bubble the corner and the bar the full row. */
  .nc-cookie{padding:11px 14px;font-size:12.5px;gap:8px 12px}
  .nc-chat{width:46px;height:46px;right:12px;bottom:64px}
}

@media (max-width:520px){
  .nc-acts .nc-btn--ghost{display:none}
  .nc-search{display:none}
  .nc-geo__c{display:none}
  .nc-geo{padding:0 7px;gap:0}
  .nc-geo .nc-caret{display:none}
  .nc-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .nc-live{grid-template-columns:repeat(2,minmax(0,1fr))}
  .nc-langs{grid-template-columns:repeat(auto-fill,minmax(130px,1fr))}
  .nc-stores{gap:8px}
  .nc-store{max-width:none;flex:1 1 100%;padding:10px 14px}
  /* A three-value `padding` shorthand would reset the side gutter to 0 and
     the article would run to the screen edge. Set the block padding only. */
  .nc-art{padding-block:18px}
  .nc-vip{padding:22px 16px}
  .nc-vip__path{gap:10px}
  .nc-revs{grid-template-columns:minmax(0,1fr)}
  .nc-tours{grid-template-columns:minmax(0,1fr)}
  .nc-foot__g{grid-template-columns:minmax(0,1fr)}
  .nc-geo-strip a{padding:5px 11px 5px 6px;font-size:12px}
  .nc-tw--spec th[scope="row"]{min-width:118px;font-size:12.5px}
  .nc-tw table{font-size:13.5px}
  .nc-tw th,.nc-tw td{padding:10px 12px}
}

/* The wide plates fade into the ground instead of butting against it. Until
   this existed every fork's ground had to sit within 4.0 OKLab of the plates'
   warm edge (#1e120b) or the rectangle showed, which is what kept all ten
   grounds inside one near-neutral band. The shadow uses the TOKEN, so it
   follows whatever this fork's ground is. */
/* :where() so this can never beat an element's own positioning - as a plain
   selector it overrode the carousel stage and broke it. */
:where(.nc-promo,.nc-tour,.nc-appbar,.nc-offer){position:relative}
.nc-slide::after,.nc-promo::after,.nc-tour::after,.nc-appbar::after,
.nc-offer::after{
  content:"";position:absolute;inset:0;pointer-events:none;border-radius:inherit;
  box-shadow:inset 0 0 44px 14px var(--nc-bg);
}