/* ==========================================================================
   National Casino MULTI - site.css
   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 */
  --nc-bg:#171514;
  --nc-bg2:#1e1c1b;
  --nc-bar:#302d2b;
  --nc-bar2:#3a3735;
  --nc-card:#272423;
  --nc-card2:#2f2c2a;
  --nc-line:#413d3a;
  --nc-line2:#514c48;

  /* ink */
  --nc-ink:#f2eeea;
  --nc-ink2:#cfc7c0;
  --nc-ink3:#9d938c;
  --nc-on-accent:#2b1a0a;

  /* accent - the operator's peach/orange */
  --nc-a1:#fbcb96;
  --nc-a2:#f0a05a;
  --nc-a3:#e8873a;
  --nc-accent:#f4b47c;
  --nc-accent-soft:rgba(244,180,124,.14);
  --nc-grad:linear-gradient(180deg,var(--nc-a1) 0%,var(--nc-a2) 100%);
  --nc-grad-h:linear-gradient(180deg,#fdd8ac 0%,#f3ad6d 100%);

  --nc-good:#5fce8f;
  --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{color:var(--nc-accent);text-decoration:none}
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-sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.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:38px;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{
  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{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-line2);border-radius:1.5px;margin:0 5px}

.nc-acts{display:flex;align-items:center;gap:10px;flex:none}
.nc-globe{
  width:40px;height:34px;border:0;background:transparent;cursor:pointer;
  display:flex;align-items:center;justify-content:center;gap:3px;color:var(--nc-ink2);
}
.nc-globe svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.6}
.nc-globe .nc-caret{width:9px;height:9px;stroke-width:2.2}
.nc-globe:hover{color:var(--nc-accent)}

/* 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(240,160,90,.22)}
.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}
.nc-btn--block{display:flex;width:100%}

/* ==========================================================================
   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{
  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{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{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{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-a2);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}
.nc-slide{
  position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  opacity:0;visibility:hidden;transition:opacity .5s ease;
  background-image:var(--nc-art,none),var(--nc-fb,linear-gradient(120deg,#3a2b3f,#241b2b 55%,#3d2a24));
  background-size:cover;background-position:center;
}
.nc-slide.is-on{opacity:1;visibility:visible}
.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);
}
.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-a2);border-color:var(--nc-a2)}

/* ==========================================================================
   5. Game grid
   ========================================================================== */
.nc-grid{
  display:grid;gap:14px;
  grid-template-columns:repeat(auto-fill,minmax(148px,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(12,10,10,.78);color:#bfe2ff;
}
.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:#cdbfb4;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:#cdbfb4;margin-top:2px}

/* ==========================================================================
   6. Offer banners (the operator's Aktionen rows)
   ========================================================================== */
.nc-offers{display:grid;gap:18px}
.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(244,180,124,.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;
}
.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)}
.nc-offer__f{font-size:12.5px;color:var(--nc-ink3);margin:-8px 0 16px}

/* 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{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);
}
.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-a2);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}
.nc-toc li{padding-left:0;margin:0 0 7px;break-inside:avoid;counter-increment:none}
.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__s{margin-left:auto;flex:none;color:var(--nc-a1);font-size:12px;letter-spacing:1px}
.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{
  flex:none;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 8px;
}
.nc-score__big b{font-family:var(--nc-f-head);font-weight:800;font-size:30px;line-height:1}
.nc-score__big span{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{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{color:var(--nc-ink2);font-size:13.5px}
.nc-foot__l a:hover{color:var(--nc-accent)}
.nc-pay{display:flex;flex-wrap:wrap;gap:9px}
.nc-pay span{
  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}
.nc-foot__lang{display:flex;flex-wrap:wrap;gap:6px 10px;margin:0 auto 20px;max-width:1280px}
.nc-foot__lang a{font-size:12px;color:var(--nc-ink3)}
.nc-foot__lang a:hover{color:var(--nc-accent)}

/* ==========================================================================
   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:#4a4442;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{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:#4a3f38;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}
.nc-stores-solo{margin:26px 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). */

/* ==========================================================================
   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}
}

/* ==========================================================================
   12. Responsive
   ========================================================================== */
@media (max-width:1180px){
  .nc-nav a{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(8,6,6,.6);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}
}
@media (max-width:760px){
  :root{--nc-top-h:60px;--nc-gut:14px}
  body{font-size:14.5px}
  .nc-logo img{height:30px}
  .nc-acts .nc-btn{padding:9px 13px;font-size:12.5px}
  .nc-art{padding:22px 16px}
  .nc-hero__vp{min-height:0}
  .nc-slide{position:relative;display:none}
  .nc-slide.is-on{display:flex}
  .nc-slide__in{padding:52px 18px 40px}
  .nc-grid{grid-template-columns:repeat(auto-fill,minmax(124px,1fr));gap:10px}
  .nc-offer{padding:16px;min-height:0}
  .nc-offer__in{padding:18px;max-width:none}
  .nc-toc ol{columns:1}
  .nc-modal__box{padding:24px 18px}
  .nc-foot{padding:26px var(--nc-gut) 26px}
  .nc-score__big{width:80px;height:80px}
}
@media (max-width:440px){
  .nc-acts .nc-btn--ghost{display:none}
  .nc-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .nc-langs{grid-template-columns:repeat(auto-fill,minmax(132px,1fr))}
}