/* KING333 official casino: near-black floor, royal purple chrome, gold reserved for money.
   Namespaced .kg-. The --jade-* tokens now carry the deep purple field and --aqua-* the violet
   accent; the names are kept so every rule that references them keeps working.

   Conventions in here:
     - The gaps and insets, the line heights, the letter-spacings, the font weights and the
       shadows used more than once are named once in :root as --q-* and called by name
       everywhere else;
     - box properties are written in logical names (block-start, inline-end) so a modifier
       resets the one edge it means to;
     - every border is split into width, style and colour;
     - gap is row-gap plus column-gap;
     - overflow is overflow-x plus overflow-y;
     - a transition is spelled out as property, duration, timing and delay;
     - an animation names all eight of its parts. */

:root {
  --ink: #0b0714;
  --ink-2: #120c20;
  --panel: #1a1030;
  --panel-2: #221640;
  --sink: #0e0919;
  --jade: #2b1259;
  --jade-2: #3d1c7a;
  --jade-3: #1e0d42;
  --aqua: #a855f7;
  --aqua-2: #c084fc;
  --aqua-3: #7322c9;
  --aqua-4: #9333ea;
  --gold: #e8b64c;
  --gold-2: #f7d488;
  --gold-3: #a67c1c;
  --txt: #f3ecff;
  --mut: #a797c4;
  --line: rgba(168,85,247,.18);
  --line-2: rgba(168,85,247,.32);
  --dep: #2ecb7f;
  --wd: #ff8a63;
  --chip: #f6f2fb;
  --chip-line: #ded0f0;
  --bar: 58px;
  --font: Arial,"Helvetica Neue",Helvetica,"Noto Sans SC",sans-serif;

  /* named values used more than once */
  --q-sp1: -18px;
  --q-sp2: 1px;
  --q-sp3: 2px;
  --q-sp4: 3px;
  --q-sp5: 4px;
  --q-sp6: 5px;
  --q-sp7: 6px;
  --q-sp8: 7px;
  --q-sp9: 8px;
  --q-sp10: 9px;
  --q-sp11: 10px;
  --q-sp12: 11px;
  --q-sp13: 12px;
  --q-sp14: 13px;
  --q-sp15: 14px;
  --q-sp16: 15px;
  --q-sp17: 16px;
  --q-sp18: 18px;
  --q-sp19: 20px;
  --q-sp20: 22px;
  --q-sp21: 26px;
  --q-lh1: 1;
  --q-lh2: 1.2;
  --q-lh3: 1.25;
  --q-lh4: 1.35;
  --q-lh5: 1.55;
  --q-tr1: .01em;
  --q-tr2: .03em;
  --q-tr3: .14em;
  --q-tr4: .22em;
  --q-wt1: 700;
  --q-wt2: 900;
  --q-wt3: 800;
}
*{box-sizing: border-box;}
html{-webkit-text-size-adjust: 100%; overflow-x: clip; max-width: 100%;}
body{margin-block: 0; margin-inline: 0; color: var(--txt); font-family: var(--font); line-height: 1.58; background: var(--ink);}
a{color: var(--aqua); text-decoration-line: none; text-decoration-style: solid; text-decoration-color: currentcolor; text-decoration-thickness: auto;}
img{max-width: 100%; height: auto; display: block;}
h1,h2,h3,h4{margin-block: 0; margin-inline: 0; line-height: 1.26;}
table{border-collapse: collapse; width: 100%;}

/* ---------- buttons ---------- */
.kg-btn{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  row-gap: var(--q-sp8);
  column-gap: var(--q-sp8);
  min-height: 2.75rem;
  padding-block: 0;
  padding-inline: var(--q-sp17);
  border-radius: 0.5625rem;
  font-weight: var(--q-wt3);
  font-size: 0.84375rem;
  letter-spacing: var(--q-tr1);
  border-width: 0.0625rem;
  border-style: solid;
  border-color: transparent;
  text-align: center;
  line-height: var(--q-lh2);
}
.kg-btn.p{
  background: linear-gradient(180deg,var(--aqua) 0%,var(--aqua-3) 100%);
  color: #1b0b33;
  box-shadow: 0 2px 0 #5b17a3;
}
.kg-btn.g{
  background: linear-gradient(180deg,var(--gold-2),var(--gold));
  color: #33230a;
  box-shadow: 0 0.125rem 0 var(--gold-3);
}
.kg-btn.o{background: rgba(168,85,247,.07); color: var(--aqua); border-color: var(--line-2);}
.kg-btn.lg{min-height: 3.125rem; font-size: 0.9375rem; padding-block: 0; padding-inline: var(--q-sp20);}
.kg-btn.w{width: 100%;}
.kg-pill{
  display: inline-flex;
  align-items: center;
  min-height: 2.375rem;
  padding-block: 0;
  padding-inline: var(--q-sp17);
  border-radius: 62.4375rem;
  background: linear-gradient(180deg,var(--aqua),var(--aqua-3));
  color: #1b0b33;
  font-weight: var(--q-wt2);
  font-size: 0.78125rem;
}

/* ---------- header ---------- */
.kg-head{
  position: sticky;
  inset-block-start: 0;
  z-index: 50;
  background: linear-gradient(180deg,var(--jade-2),var(--jade-3));
  box-shadow: 0 0.1875rem 1rem rgba(0,0,0,.5);
}
.kg-head .row{
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  row-gap: var(--q-sp13);
  column-gap: var(--q-sp13);
  padding-block: var(--q-sp10);
  padding-inline: var(--q-sp17);
  max-width: 92.5rem;
  margin-block: 0;
  margin-inline: auto;
}
.kg-burger{
  justify-self: start;
  background: rgba(168,85,247,.12);
  border-width: 0.0625rem;
  border-style: solid;
  border-color: var(--line-2);
  color: var(--aqua);
  font-size: 1.0625rem;
  line-height: var(--q-lh1);
  min-width: 2.75rem;
  min-height: 2.75rem;
  padding-block: 0;
  padding-inline: var(--q-sp13);
  border-radius: 0.5625rem;
  cursor: pointer;
}
.kg-logo{display: flex; align-items: center; row-gap: var(--q-sp11); column-gap: var(--q-sp11); justify-self: center;}
.kg-logo svg{width: 2.375rem; height: 2.375rem; flex-grow: 0; flex-shrink: 0; flex-basis: auto;}
.kg-logo .wm{display: flex; flex-direction: column; line-height: var(--q-lh1);}
.kg-logo .wm b{
  font-family: "Arial Black",Arial,sans-serif;
  font-size: 1.625rem;
  letter-spacing: var(--q-tr2);
  white-space: nowrap;
  background: linear-gradient(180deg,#ece0ff,var(--aqua) 55%,var(--aqua-3));
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
.kg-logo .wm small{
  font-size: 0.53125rem;
  letter-spacing: .3em;
  color: rgba(243,236,255,.6);
  font-weight: var(--q-wt1);
  margin-block-start: var(--q-sp5);
  white-space: nowrap;
}
.kg-tools{justify-self: end; display: flex; align-items: center; row-gap: var(--q-sp9); column-gap: var(--q-sp9);}
.kg-lang{display: flex; row-gap: var(--q-sp5); column-gap: var(--q-sp5);}
.kg-lang a{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 0.75rem;
  font-weight: var(--q-wt1);
  color: rgba(243,236,255,.78);
  border-width: 0.0625rem;
  border-style: solid;
  border-color: var(--line);
  border-radius: 0.4375rem;
  min-width: 2.5rem;
  min-height: 2.75rem;
  padding-block: 0;
  padding-inline: var(--q-sp8);
  line-height: var(--q-lh1);
  white-space: nowrap;
}
.kg-lang a.on{color: #1b0b33; background: linear-gradient(180deg,var(--aqua),var(--aqua-3)); border-color: transparent;}
.kg-tick{
  background: var(--jade);
  color: var(--aqua-2);
  overflow-x: hidden;
  overflow-y: hidden;
  font-weight: var(--q-wt1);
  font-size: 0.78125rem;
  padding-block: var(--q-sp8);
  padding-inline: 0;
  white-space: nowrap;
  border-block-start-width: 0.0625rem;
  border-block-start-style: solid;
  border-block-start-color: var(--line);
}
.kg-tick span{display: inline-block; padding-inline-start: 100%; animation-name: kg-run; animation-duration: 46s; animation-timing-function: linear; animation-delay: 0s; animation-iteration-count: infinite; animation-direction: normal; animation-fill-mode: none; animation-play-state: running;}
@keyframes kg-run{to{transform: translateX(-100%);}}
.kg-drawer{
  display: none;
  flex-wrap: wrap;
  row-gap: var(--q-sp7);
  column-gap: var(--q-sp7);
  padding-block: var(--q-sp11);
  padding-inline: var(--q-sp17);
  background: var(--jade-3);
  border-block-start-width: 0.0625rem;
  border-block-start-style: solid;
  border-block-start-color: var(--line);
}
.kg-open .kg-drawer{display: flex;}
.kg-drawer a{
  display: inline-flex;
  align-items: center;
  min-height: 2.5rem;
  padding-block: 0;
  padding-inline: var(--q-sp14);
  border-radius: 0.5rem;
  background: rgba(168,85,247,.08);
  border-width: 0.0625rem;
  border-style: solid;
  border-color: var(--line);
  color: var(--txt);
  font-weight: var(--q-wt1);
  font-size: 0.8125rem;
}

/* ---------- three-column grid ---------- */
.kg-three{
  display: grid;
  grid-template-columns: 18.75rem minmax(0,1fr) 18.75rem;
  row-gap: var(--q-sp17);
  column-gap: var(--q-sp17);
  align-items: start;
  max-width: 92.5rem;
  margin-block: 0;
  margin-inline: auto;
  padding-block: var(--q-sp17);
  padding-inline: var(--q-sp17);
}
.kg-col{display: flex; flex-direction: column; row-gap: var(--q-sp15); column-gap: var(--q-sp15); min-width: 0;}
.kg-card{background: var(--panel); border-width: 0.0625rem; border-style: solid; border-color: var(--line); border-radius: 0.8125rem; overflow-x: hidden; overflow-y: hidden;}
.kg-card .h{
  display: flex;
  align-items: center;
  justify-content: space-between;
  row-gap: var(--q-sp9);
  column-gap: var(--q-sp9);
  padding-block: var(--q-sp11);
  padding-inline: var(--q-sp14);
  background: var(--panel-2);
  border-block-end-width: 0.0625rem;
  border-block-end-style: solid;
  border-block-end-color: var(--line);
}
.kg-card .h b{font-size: 0.8125rem; letter-spacing: var(--q-tr2); text-transform: uppercase; color: var(--aqua);}
.kg-card .h span{font-size: 0.6875rem; color: var(--mut);}

/* register promo */
.kg-promo{position: relative; border-radius: 0.8125rem; overflow-x: hidden; overflow-y: hidden; border-width: 0.0625rem; border-style: solid; border-color: var(--line-2);}
.kg-promo img{width: 100%; aspect-ratio: 4/3; object-fit: cover;}
.kg-promo .ov{
  position: absolute;
  inset-block: 0;
  inset-inline: 0;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-end;
  row-gap: var(--q-sp8);
  column-gap: var(--q-sp8);
  padding-block: var(--q-sp16);
  padding-inline: var(--q-sp16);
  background: linear-gradient(180deg,rgba(11,7,20,0) 32%,rgba(11,7,20,.92) 100%);
}
.kg-promo .kick{font-size: 0.65625rem; font-weight: var(--q-wt2); letter-spacing: var(--q-tr4); color: var(--gold);}
.kg-promo strong{font-size: 1.0625rem; line-height: var(--q-lh2); color: #fff;}
.kg-promo em{font-style: normal; font-size: 0.75rem; color: var(--mut);}
.kg-promo .kg-pill{margin-block-start: var(--q-sp4);}

/* provider mini wall - one chip, see THE LOGO CHIP below */
.kg-minilogos{display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr) minmax(0,1fr) minmax(0,1fr); row-gap: var(--q-sp8); column-gap: var(--q-sp8);}
.kg-minilogos span{
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--chip);
  border-width: 0.0625rem;
  border-style: solid;
  border-color: var(--chip-line);
  border-radius: 0.5rem;
  height: 2.375rem;
  padding-block: var(--q-sp6);
  padding-inline: var(--q-sp6);
}
.kg-minilogos img{max-height: 1.5rem; width: auto; object-fit: contain;}

/* paired live transaction boards */
.kg-txn table{font-size: 0.75rem;}
.kg-txn td{padding-block: var(--q-sp7); padding-inline: var(--q-sp12); border-block-end-width: 0.0625rem; border-block-end-style: solid; border-block-end-color: rgba(168,85,247,.08); color: var(--mut);}
.kg-txn td.a{font-weight: var(--q-wt3); text-align: right; font-variant-numeric: tabular-nums;}
.kg-txn td.p{text-align: right; font-size: 0.6875rem; color: rgba(167,151,196,.75);}
.kg-txn.dep td.a{color: var(--dep);}
.kg-txn.wd td.a{color: var(--gold);}
.kg-txn .live{
  display: inline-flex;
  align-items: center;
  row-gap: var(--q-sp6);
  column-gap: var(--q-sp6);
  font-size: 0.625rem;
  font-weight: var(--q-wt2);
  letter-spacing: .1em;
  color: var(--dep);
}
.kg-txn .live::before{
  content: "";
  width: 0.375rem;
  height: 0.375rem;
  border-radius: 50%;
  background: var(--dep);
  animation-name: kg-pulse;
  animation-duration: 1.6s;
  animation-timing-function: ease-in-out;
  animation-delay: 0s;
  animation-iteration-count: infinite;
  animation-direction: normal;
  animation-fill-mode: none;
  animation-play-state: running;
}
@keyframes kg-pulse{50%{opacity: .25;}}

/* referral card */
.kg-ref img{width: 100%; aspect-ratio: 16/9; object-fit: cover;}
.kg-ref .pct{display: flex; align-items: baseline; row-gap: var(--q-sp10); column-gap: var(--q-sp10); padding-block-start: var(--q-sp12); padding-inline-end: var(--q-sp14); padding-block-end: 0; padding-inline-start: var(--q-sp14);}
.kg-ref .pct b{font-size: 1.6875rem; color: var(--gold); line-height: var(--q-lh1);}
.kg-ref .pct span{font-size: 0.71875rem; color: var(--mut); line-height: var(--q-lh4);}
.kg-ref .btns{display: grid; grid-template-columns: 1fr 1fr; row-gap: var(--q-sp9); column-gap: var(--q-sp9); padding-block-start: var(--q-sp12); padding-inline-end: var(--q-sp14); padding-block-end: var(--q-sp14); padding-inline-start: var(--q-sp14);}
.kg-ref .btns .kg-btn{min-height: 2.5rem; font-size: 0.78125rem; padding-block: 0; padding-inline: var(--q-sp10);}

/* side strips */
.kg-strip{
  display: flex;
  flex-direction: column;
  row-gap: var(--q-sp3);
  column-gap: var(--q-sp3);
  padding-block: var(--q-sp13);
  padding-inline: var(--q-sp15);
  border-radius: 0.6875rem;
  background: var(--panel);
  border-width: 0.0625rem;
  border-style: solid;
  border-color: var(--line);
}
.kg-strip b{font-size: 0.84375rem; color: var(--aqua);}
.kg-strip small{font-size: 0.71875rem; color: var(--mut);}
.kg-strip.app{background: linear-gradient(135deg,var(--jade),var(--jade-3)); border-color: var(--line-2);}

/* category rail */
.kg-cats{display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr) minmax(0,1fr) minmax(0,1fr) minmax(0,1fr) minmax(0,1fr); row-gap: var(--q-sp10); column-gap: var(--q-sp10);}
.kg-cats a{
  display: flex;
  flex-direction: column;
  align-items: center;
  row-gap: var(--q-sp7);
  column-gap: var(--q-sp7);
  padding-block: var(--q-sp13);
  padding-inline: var(--q-sp5);
  border-radius: 0.75rem;
  background: var(--panel);
  border-width: 0.0625rem;
  border-style: solid;
  border-color: var(--line);
  color: var(--txt);
  font-size: 0.71875rem;
  font-weight: var(--q-wt1);
  text-align: center;
}
.kg-cats .i{
  display: flex;
  align-items: center;
  justify-content: center;
  width: 2.75rem;
  height: 2.75rem;
  border-radius: 50%;
  background: linear-gradient(180deg,var(--aqua),var(--aqua-3));
  color: #1b0b33;
  font-size: 1.25rem;
}

/* section heading */
.kg-sh{display: flex; align-items: center; justify-content: space-between; row-gap: var(--q-sp13); column-gap: var(--q-sp13); margin-block-start: var(--q-sp5); margin-inline-end: 0; margin-block-end: var(--q-sp3); margin-inline-start: 0;}
.kg-sh h2{display: flex; align-items: center; row-gap: var(--q-sp10); column-gap: var(--q-sp10); font-size: 1rem; letter-spacing: var(--q-tr1);}
.kg-sh h2::before{
  content: "";
  width: 0.25rem;
  height: 1.0625rem;
  border-radius: 0.125rem;
  background: linear-gradient(180deg,var(--aqua),var(--aqua-3));
}
.kg-sh a{font-size: 0.75rem; font-weight: var(--q-wt1); color: var(--mut);}

/* jackpot */
.kg-jp{
  display: flex;
  flex-direction: column;
  align-items: center;
  row-gap: var(--q-sp4);
  column-gap: var(--q-sp4);
  padding-block: var(--q-sp17);
  padding-inline: var(--q-sp15);
  border-radius: 0.875rem;
  background: radial-gradient(130% 160% at 50% 0,var(--jade-2) 0%,var(--jade-3) 60%,var(--ink-2) 100%);
  border-width: 0.0625rem;
  border-style: solid;
  border-color: var(--line-2);
}
.kg-jp .k{font-size: 0.65625rem; font-weight: var(--q-wt2); letter-spacing: var(--q-tr4); text-transform: uppercase; color: var(--aqua);}
.kg-jp b{display: flex; align-items: baseline; row-gap: var(--q-sp6); column-gap: var(--q-sp6); font-size: 0.9375rem; color: var(--gold);}
.kg-jp b i{
  font-style: normal;
  font-size: 2rem;
  font-weight: var(--q-wt2);
  letter-spacing: var(--q-tr1);
  font-variant-numeric: tabular-nums;
  text-shadow: 0 0 1.375rem rgba(232,182,76,.35);
}
.kg-jp .s{font-size: 0.71875rem; color: var(--mut);}

/* six product tiles */
.kg-tiles{display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr) minmax(0,1fr); row-gap: var(--q-sp13); column-gap: var(--q-sp13);}
.kg-tile{
  position: relative;
  border-radius: 0.8125rem;
  overflow-x: hidden;
  overflow-y: hidden;
  border-width: 0.0625rem;
  border-style: solid;
  border-color: var(--line);
  background: var(--panel);
}
.kg-tile img{width: 100%; aspect-ratio: 4/3; object-fit: cover;}
.kg-tile .cap{
  position: absolute;
  inset-block-start: auto;
  inset-inline-end: 0;
  inset-block-end: 0;
  inset-inline-start: 0;
  display: flex;
  flex-direction: column;
  row-gap: var(--q-sp3);
  column-gap: var(--q-sp3);
  padding-block: var(--q-sp12);
  padding-inline: var(--q-sp13);
  background: linear-gradient(180deg,rgba(11,7,20,0),rgba(11,7,20,.93) 62%);
}
.kg-tile .cap b{font-size: 0.875rem; color: #fff;}
.kg-tile .cap small{font-size: 0.6875rem; color: var(--mut); line-height: 1.3;}

/* game grids */
.kg-games{display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr) minmax(0,1fr) minmax(0,1fr) minmax(0,1fr); row-gap: var(--q-sp12); column-gap: var(--q-sp12);}
.kg-games.pg{grid-template-columns: minmax(0,1fr) minmax(0,1fr) minmax(0,1fr) minmax(0,1fr) minmax(0,1fr);}
.kg-game{
  position: relative;
  border-radius: 0.6875rem;
  overflow-x: hidden;
  overflow-y: hidden;
  background: var(--panel);
  border-width: 0.0625rem;
  border-style: solid;
  border-color: var(--line);
}
.kg-game img{width: 100%; aspect-ratio: 1/1; object-fit: cover;}
.kg-game .m{display: flex; flex-direction: column; row-gap: var(--q-sp2); column-gap: var(--q-sp2); padding-block-start: var(--q-sp8); padding-inline-end: var(--q-sp10); padding-block-end: var(--q-sp10); padding-inline-start: var(--q-sp10);}
.kg-game .m b{font-size: 0.75rem; color: var(--txt); line-height: var(--q-lh3);}
.kg-game .m small{font-size: 0.65625rem; color: var(--mut);}
.kg-game .m small i{font-style: normal; color: var(--aqua-4);}
.kg-tag{
  position: absolute;
  inset-block-start: 0.4375rem;
  inset-inline-start: 0.4375rem;
  padding-block: var(--q-sp3);
  padding-inline: var(--q-sp8);
  border-radius: 0.3125rem;
  font-size: 0.59375rem;
  font-weight: var(--q-wt2);
  letter-spacing: .08em;
  background: var(--gold);
  color: #33230a;
}

/* top live casino rail */
.kg-live{display: flex; flex-direction: column; row-gap: var(--q-sp10); column-gap: var(--q-sp10);}
.kg-live .rail{
  display: flex;
  row-gap: var(--q-sp12);
  column-gap: var(--q-sp12);
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  padding-block-end: var(--q-sp6);
  -webkit-overflow-scrolling: touch;
}
.kg-live .it{
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: 9.375rem;
  scroll-snap-align: start;
  border-radius: 0.75rem;
  overflow-x: hidden;
  overflow-y: hidden;
  background: var(--panel);
  border-width: 0.0625rem;
  border-style: solid;
  border-color: var(--line);
}
.kg-live .im{position: relative; display: block;}
.kg-live .im img{width: 100%; aspect-ratio: 4/3; object-fit: cover;}
.kg-live .pl{
  position: absolute;
  inset-inline-start: 50%;
  inset-block-start: 50%;
  width: 2.25rem;
  height: 2.25rem;
  margin-block-start: var(--q-sp1);
  margin-inline-end: 0;
  margin-block-end: 0;
  margin-inline-start: var(--q-sp1);
  border-radius: 50%;
  background: rgba(168,85,247,.92);
  opacity: 0;
  transition-property: opacity;
  transition-duration: .18s;
  transition-timing-function: ease;
  transition-delay: 0s;
}
.kg-live .pl::after{
  content: "";
  position: absolute;
  inset-inline-start: 0.875rem;
  inset-block-start: 0.6875rem;
  border-style: solid;
  border-width: 0.4375rem 0 0.4375rem 0.6875rem;
  border-color: transparent transparent transparent #1b0b33;
}
.kg-live .it:hover .pl,.kg-live .it:focus-visible .pl{opacity: 1;}
.kg-live .nm{
  display: flex;
  align-items: center;
  row-gap: var(--q-sp7);
  column-gap: var(--q-sp7);
  padding-block-start: var(--q-sp9);
  padding-inline-end: var(--q-sp11);
  padding-block-end: var(--q-sp2);
  padding-inline-start: var(--q-sp11);
  font-size: 0.78125rem;
  font-weight: var(--q-wt1);
  color: var(--txt);
}
.kg-live .nm em{
  font-style: normal;
  padding-block: var(--q-sp2);
  padding-inline: var(--q-sp7);
  border-radius: 0.25rem;
  font-size: 0.5625rem;
  font-weight: var(--q-wt2);
  letter-spacing: .07em;
}
.kg-live .nm em.hot{background: #ff5b3d; color: #fff;}
.kg-live .nm em.new{background: var(--aqua); color: #1b0b33;}
.kg-live small{display: block; padding-block-start: 0; padding-inline-end: var(--q-sp11); padding-block-end: var(--q-sp11); padding-inline-start: var(--q-sp11); font-size: 0.65625rem; color: var(--mut);}

/* testimonials */
.kg-testi{display: flex; flex-direction: column; row-gap: var(--q-sp11); column-gap: var(--q-sp11);}
.kg-testi .grid{display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); row-gap: var(--q-sp13); column-gap: var(--q-sp13);}
.kg-testi .bx{
  margin-block: 0;
  margin-inline: 0;
  padding-block: var(--q-sp15);
  padding-inline: var(--q-sp15);
  border-radius: 0.75rem;
  background: var(--panel);
  border-width: 0.0625rem;
  border-style: solid;
  border-color: var(--line);
  display: grid;
  grid-template-columns: 2.5rem 1fr;
  row-gap: var(--q-sp5);
  column-gap: var(--q-sp12);
}
.kg-testi .av{
  grid-row: span 2;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 50%;
  background: var(--jade);
  font-size: 1.1875rem;
}
.kg-testi figcaption{display: flex; flex-direction: column; line-height: var(--q-lh3);}
.kg-testi figcaption b{font-size: 0.8125rem; color: var(--txt);}
.kg-testi figcaption small{font-size: 0.6875rem; color: var(--mut);}
.kg-testi .st{font-size: 0.71875rem; letter-spacing: var(--q-tr3); color: var(--gold);}
.kg-testi blockquote{grid-column: 1/-1; margin-block-start: var(--q-sp7); margin-inline-end: 0; margin-block-end: 0; margin-inline-start: 0; font-size: 0.78125rem; color: var(--mut); line-height: var(--q-lh5);}

/* KING333MV movie rail */
.kg-movie{
  display: flex;
  flex-direction: column;
  row-gap: var(--q-sp10);
  column-gap: var(--q-sp10);
  padding-block: var(--q-sp15);
  padding-inline: var(--q-sp15);
  border-radius: 0.8125rem;
  background: linear-gradient(140deg,var(--jade-3),var(--ink-2));
  border-width: 0.0625rem;
  border-style: solid;
  border-color: var(--line);
}
.kg-movie p{margin-block: 0; margin-inline: 0; font-size: 0.75rem; color: var(--mut); line-height: var(--q-lh5);}
.kg-movie .rail{display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr) minmax(0,1fr) minmax(0,1fr); row-gap: var(--q-sp9); column-gap: var(--q-sp9);}
.kg-movie .mv{position: relative; border-radius: 0.5625rem; overflow-x: hidden; overflow-y: hidden; border-width: 0.0625rem; border-style: solid; border-color: var(--line);}
.kg-movie .mv img{width: 100%; aspect-ratio: 3/4; object-fit: cover;}
.kg-movie .mv em{
  position: absolute;
  inset-block-start: auto;
  inset-inline-end: 0;
  inset-block-end: 0;
  inset-inline-start: 0;
  padding-block: var(--q-sp5);
  padding-inline: var(--q-sp8);
  font-style: normal;
  font-size: 0.625rem;
  font-weight: var(--q-wt1);
  color: #fff;
  background: linear-gradient(180deg,rgba(11,7,20,0),rgba(11,7,20,.9));
}

/* daily wheel */
.kg-wheel .wh{
  position: relative;
  width: 10.625rem;
  height: 10.625rem;
  margin-block-start: var(--q-sp15);
  margin-inline-end: auto;
  margin-block-end: var(--q-sp11);
  margin-inline-start: auto;
  border-radius: 50%;
  background: conic-gradient(var(--jade-2) 0 45deg,var(--jade-3) 45deg 90deg,var(--jade-2) 90deg 135deg,
    var(--jade-3) 135deg 180deg,var(--jade-2) 180deg 225deg,var(--jade-3) 225deg 270deg,
    var(--jade-2) 270deg 315deg,var(--jade-3) 315deg 360deg);
  border-width: 0.1875rem;
  border-style: solid;
  border-color: var(--aqua);
  box-shadow: 0 0 1.625rem rgba(168,85,247,.2);
}
.kg-wheel .wh ul{position: absolute; inset-block: 0; inset-inline: 0; margin-block: 0; margin-inline: 0; padding-block: 0; padding-inline: 0; list-style-type: none; list-style-position: outside; list-style-image: none;}
.kg-wheel .wh li{
  position: absolute;
  inset-inline-start: 50%;
  inset-block-start: 0.5625rem;
  transform-origin: 50% 4.75rem;
  font-size: 0.625rem;
  font-weight: var(--q-wt3);
  color: var(--aqua-2);
  margin-inline-start: -0.9375rem;
  width: 1.875rem;
  text-align: center;
}
.kg-wheel .wh li:nth-child(1){transform: rotate(22.5deg);}
.kg-wheel .wh li:nth-child(2){transform: rotate(67.5deg);}
.kg-wheel .wh li:nth-child(3){transform: rotate(112.5deg);}
.kg-wheel .wh li:nth-child(4){transform: rotate(157.5deg);}
.kg-wheel .wh li:nth-child(5){transform: rotate(202.5deg);}
.kg-wheel .wh li:nth-child(6){transform: rotate(247.5deg);}
.kg-wheel .wh li:nth-child(7){transform: rotate(292.5deg);}
.kg-wheel .wh li:nth-child(8){transform: rotate(337.5deg);}
.kg-wheel .pin{
  position: absolute;
  inset-inline-start: 50%;
  inset-block-start: -0.5625rem;
  margin-inline-start: -0.4375rem;
  border-style: solid;
  border-width: 0.875rem 0.4375rem 0 0.4375rem;
  border-color: var(--gold) transparent transparent transparent;
}
.kg-wheel>.kg-btn{width: calc(100% - 1.625rem); margin-block: 0; margin-inline: var(--q-sp14);}
.kg-wheel small{display: block; padding-block-start: var(--q-sp10); padding-inline-end: var(--q-sp14); padding-block-end: var(--q-sp14); padding-inline-start: var(--q-sp14); font-size: 0.6875rem; color: var(--mut); text-align: center;}

/* match strip */
.kg-matches{display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr) minmax(0,1fr); row-gap: var(--q-sp12); column-gap: var(--q-sp12);}
.kg-match{padding-block: var(--q-sp13); padding-inline: var(--q-sp13); border-radius: 0.6875rem; background: var(--panel); border-width: 0.0625rem; border-style: solid; border-color: var(--line);}
.kg-match .lg{
  display: flex;
  align-items: center;
  justify-content: space-between;
  row-gap: var(--q-sp9);
  column-gap: var(--q-sp9);
  font-size: 0.65625rem;
  color: var(--mut);
  margin-block-end: var(--q-sp9);
}
.kg-match .lg em{font-style: normal; font-weight: var(--q-wt3); color: var(--mut);}
.kg-match .lg em.on{display: inline-flex; align-items: center; row-gap: var(--q-sp5); column-gap: var(--q-sp5); color: #ff5b3d;}
.kg-match .tm{display: flex; align-items: center; justify-content: space-between; row-gap: var(--q-sp10); column-gap: var(--q-sp10); margin-block-end: var(--q-sp7);}
.kg-match .tm b{font-size: 0.78125rem; font-weight: var(--q-wt1);}
.kg-match .odd{
  min-width: 3.125rem;
  padding-block: var(--q-sp6);
  padding-inline: var(--q-sp9);
  border-radius: 0.4375rem;
  background: rgba(168,85,247,.1);
  border-width: 0.0625rem;
  border-style: solid;
  border-color: var(--line);
  color: var(--aqua);
  font-size: 0.75rem;
  font-weight: var(--q-wt3);
  text-align: center;
  font-variant-numeric: tabular-nums;
}

/* provider wall */
.kg-provs{display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr) minmax(0,1fr) minmax(0,1fr) minmax(0,1fr) minmax(0,1fr); row-gap: var(--q-sp11); column-gap: var(--q-sp11);}
.kg-prov{
  display: flex;
  flex-direction: column;
  align-items: center;
  row-gap: var(--q-sp7);
  column-gap: var(--q-sp7);
  padding-block: var(--q-sp12);
  padding-inline: var(--q-sp8);
  border-radius: 0.6875rem;
  background: var(--panel);
  border-width: 0.0625rem;
  border-style: solid;
  border-color: var(--line);
  color: var(--mut);
  font-size: 0.65625rem;
  text-align: center;
}
.kg-prov .lg{
  display: flex;
  align-items: center;
  justify-content: center;
  height: 2.125rem;
  width: 100%;
  background: var(--chip);
  border-radius: 0.4375rem;
  padding-block: var(--q-sp5);
  padding-inline: var(--q-sp5);
}
.kg-prov .lg img{max-height: 1.75rem; width: auto; object-fit: contain;}
.kg-prov .lg.t{background: none; padding-block: 0; padding-inline: 0; font-size: 0.75rem; font-weight: var(--q-wt3); color: var(--aqua);}

/* certification row */
.kg-row{display: flex; flex-wrap: wrap; row-gap: var(--q-sp10); column-gap: var(--q-sp10);}
.kg-chip{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 2.5rem;
  padding-block: 0;
  padding-inline: var(--q-sp14);
  border-radius: 0.5625rem;
  background: var(--chip);
  border-width: 0.0625rem;
  border-style: solid;
  border-color: var(--chip-line);
}
.kg-chip img{max-height: 1.375rem; width: auto; object-fit: contain;}

/* tables */
.kg-tw{overflow-x: auto; border-radius: 0.6875rem; border-width: 0.0625rem; border-style: solid; border-color: var(--line);}
.kg-tbl{font-size: 0.8125rem; min-width: 26.25rem; background: var(--panel);}
.kg-tbl th{
  padding-block: var(--q-sp11);
  padding-inline: var(--q-sp14);
  text-align: left;
  background: var(--jade-3);
  color: var(--aqua);
  font-size: 0.71875rem;
  letter-spacing: .05em;
  text-transform: uppercase;
  white-space: nowrap;
}
.kg-tbl td{padding-block: var(--q-sp11); padding-inline: var(--q-sp14); border-block-start-width: 0.0625rem; border-block-start-style: solid; border-block-start-color: rgba(168,85,247,.1); color: var(--txt);}
.kg-tbl tbody tr:nth-child(2n){background: rgba(168,85,247,.03);}

/* wallet rail */
.kg-wallet .bal{padding-block: var(--q-sp15); padding-inline: var(--q-sp15); background: linear-gradient(140deg,var(--jade-2),var(--jade-3));}
.kg-wallet .bal .k{font-size: 0.6875rem; letter-spacing: var(--q-tr3); text-transform: uppercase; color: var(--aqua);}
.kg-wallet .bal .v{font-size: 1.6875rem; font-weight: var(--q-wt2); color: #fff; font-variant-numeric: tabular-nums;}
.kg-wallet .meta{
  display: flex;
  justify-content: space-between;
  row-gap: var(--q-sp10);
  column-gap: var(--q-sp10);
  padding-block: var(--q-sp10);
  padding-inline: var(--q-sp14);
  font-size: 0.6875rem;
  color: var(--mut);
  border-block-end-width: 0.0625rem;
  border-block-end-style: solid;
  border-block-end-color: var(--line);
}
.kg-wallet .meta b{color: var(--gold);}
.kg-wallet .two{display: grid; grid-template-columns: 1fr 1fr; row-gap: var(--q-sp9); column-gap: var(--q-sp9); padding-block-start: var(--q-sp12); padding-inline-end: var(--q-sp14); padding-block-end: 0; padding-inline-start: var(--q-sp14);}
.kg-wallet .stack{display: grid; row-gap: var(--q-sp9); column-gap: var(--q-sp9); padding-block-start: var(--q-sp9); padding-inline-end: var(--q-sp14); padding-block-end: var(--q-sp14); padding-inline-start: var(--q-sp14);}
.kg-wallet .stack .kg-btn{min-height: 2.5rem; font-size: 0.78125rem;}

/* seven-day check-in */
.kg-check .days{display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr) minmax(0,1fr) minmax(0,1fr) minmax(0,1fr) minmax(0,1fr) minmax(0,1fr); row-gap: var(--q-sp6); column-gap: var(--q-sp6); padding-block: var(--q-sp13); padding-inline: var(--q-sp12);}
.kg-check .days span{
  display: flex;
  flex-direction: column;
  align-items: center;
  row-gap: var(--q-sp3);
  column-gap: var(--q-sp3);
  padding-block: var(--q-sp8);
  padding-inline: var(--q-sp3);
  border-radius: 0.5rem;
  background: var(--panel-2);
  border-width: 0.0625rem;
  border-style: solid;
  border-color: var(--line);
}
.kg-check .days span.on{background: linear-gradient(180deg,var(--aqua),var(--aqua-3)); border-color: transparent;}
.kg-check .days span.on i,.kg-check .days span.on b{color: #1b0b33;}
.kg-check .days i{font-style: normal; font-size: 0.53125rem; color: var(--mut); white-space: nowrap;}
.kg-check .days b{font-size: 0.6875rem; color: var(--gold);}
.kg-check>.kg-btn{width: calc(100% - 1.375rem); margin-block-start: 0; margin-inline-end: var(--q-sp12); margin-block-end: var(--q-sp13); margin-inline-start: var(--q-sp12);}

/* tips banner */
.kg-tips{position: relative; border-radius: 0.75rem; overflow-x: hidden; overflow-y: hidden; border-width: 0.0625rem; border-style: solid; border-color: var(--line);}
.kg-tips img{width: 100%; aspect-ratio: 16/9; object-fit: cover;}
.kg-tips .ov{
  position: absolute;
  inset-block: 0;
  inset-inline: 0;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-end;
  row-gap: var(--q-sp8);
  column-gap: var(--q-sp8);
  padding-block: var(--q-sp14);
  padding-inline: var(--q-sp14);
  background: linear-gradient(180deg,rgba(11,7,20,0) 36%,rgba(11,7,20,.9));
}
.kg-tips .ov b{font-size: 0.875rem; color: #fff;}

/* floor figures */
.kg-floor dl{margin-block: 0; margin-inline: 0; padding-block-start: var(--q-sp6); padding-inline-end: var(--q-sp14); padding-block-end: var(--q-sp12); padding-inline-start: var(--q-sp14);}
.kg-floor dl>div{
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  row-gap: var(--q-sp12);
  column-gap: var(--q-sp12);
  padding-block: var(--q-sp8);
  padding-inline: 0;
  border-block-end-width: 0.0625rem;
  border-block-end-style: dashed;
  border-block-end-color: rgba(168,85,247,.14);
}
.kg-floor dl>div:last-child{border-block-end-width: 0; border-block-end-style: none; border-block-end-color: currentcolor;}
.kg-floor dt{font-size: 0.75rem; color: var(--mut);}
.kg-floor dd{margin-block: 0; margin-inline: 0; font-size: 0.8125rem; font-weight: var(--q-wt3); color: var(--aqua);}

/* save-link card */
.kg-perks ul{margin-block: 0; margin-inline: 0; padding-block-start: var(--q-sp12); padding-inline-end: var(--q-sp14); padding-block-end: var(--q-sp6); padding-inline-start: 1.6875rem;}
.kg-perks li{font-size: 0.75rem; color: var(--mut); margin-block-end: var(--q-sp7); line-height: 1.5;}
.kg-perks>.kg-btn{width: calc(100% - 1.625rem); margin-block-start: 0; margin-inline-end: var(--q-sp14); margin-block-end: var(--q-sp14); margin-inline-start: var(--q-sp14);}

/* ---------- article pages ---------- */
.kg-content{max-width: 53.75rem; margin-block: 0; margin-inline: auto; padding-block-start: var(--q-sp20); padding-inline-end: var(--q-sp17); padding-block-end: 2.125rem; padding-inline-start: var(--q-sp17);}
.kg-content h1{font-size: 1.875rem; margin-block-start: 0; margin-inline-end: 0; margin-block-end: var(--q-sp13); margin-inline-start: 0; letter-spacing: -.01em;}
.kg-content h2{font-size: 1.3125rem; margin-block-start: 1.75rem; margin-inline-end: 0; margin-block-end: var(--q-sp11); margin-inline-start: 0; color: var(--aqua);}
.kg-content p{margin-block-start: 0; margin-inline-end: 0; margin-block-end: var(--q-sp15); margin-inline-start: 0;}
.kg-content .lead{font-size: 1.0625rem; color: #ded0f0;}
.kg-content ul{margin-block-start: 0; margin-inline-end: 0; margin-block-end: var(--q-sp16); margin-inline-start: 0; padding-inline-start: var(--q-sp20);}
.kg-content li{margin-block-end: var(--q-sp8);}
.kg-ph{position: relative; margin-block-start: 0; margin-inline-end: 0; margin-block-end: var(--q-sp18); margin-inline-start: 0; border-radius: 0.875rem; overflow-x: hidden; overflow-y: hidden; border-width: 0.0625rem; border-style: solid; border-color: var(--line);}
.kg-ph img{width: 100%; aspect-ratio: 16/9; object-fit: cover;}
.kg-ph .eb{
  position: absolute;
  inset-block-start: 0.8125rem;
  inset-inline-start: 0.875rem;
  padding-block: var(--q-sp5);
  padding-inline: var(--q-sp12);
  border-radius: 62.4375rem;
  font-size: 0.65625rem;
  font-weight: var(--q-wt2);
  letter-spacing: .16em;
  text-transform: uppercase;
  background: rgba(11,7,20,.72);
  border-width: 0.0625rem;
  border-style: solid;
  border-color: var(--line-2);
  color: var(--aqua);
}
.kg-ph .act{
  position: absolute;
  inset-block-start: auto;
  inset-inline-end: 0;
  inset-block-end: 0;
  inset-inline-start: 0;
  display: flex;
  flex-wrap: wrap;
  row-gap: var(--q-sp10);
  column-gap: var(--q-sp10);
  padding-block: var(--q-sp15);
  padding-inline: var(--q-sp15);
  background: linear-gradient(180deg,rgba(11,7,20,0),rgba(11,7,20,.9));
}
.act.utl{position: static; background: none; padding-block-start: 0; padding-inline-end: 0; padding-block-end: var(--q-sp18); padding-inline-start: 0;}
.kg-kpis{display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr) minmax(0,1fr) minmax(0,1fr); row-gap: var(--q-sp12); column-gap: var(--q-sp12); margin-block-start: 0; margin-inline-end: 0; margin-block-end: var(--q-sp19); margin-inline-start: 0;}
.kg-kpis>div{min-width:0;
  padding-block: var(--q-sp14);
  padding-inline: var(--q-sp12);
  border-radius: 0.6875rem;
  background: var(--panel);
  border-width: 0.0625rem;
  border-style: solid;
  border-color: var(--line);
  text-align: center;
}
.kg-kpis b{display: block; font-size: 1.25rem; color: var(--gold); line-height: var(--q-lh2);}
.kg-kpis span{font-size: 0.6875rem; color: var(--mut); line-height: var(--q-lh4);}
.kg-steps{counter-reset: v7s; list-style-type: none; list-style-position: outside; list-style-image: none; margin-block-start: 0; margin-inline-end: 0; margin-block-end: var(--q-sp19); margin-inline-start: 0; padding-block: 0; padding-inline: 0; display: grid; row-gap: var(--q-sp10); column-gap: var(--q-sp10);}
.kg-steps li{
  counter-increment: v7s;
  position: relative;
  padding-block-start: var(--q-sp12);
  padding-inline-end: var(--q-sp14);
  padding-block-end: var(--q-sp12);
  padding-inline-start: 2.875rem;
  border-radius: 0.6875rem;
  background: var(--panel);
  border-width: 0.0625rem;
  border-style: solid;
  border-color: var(--line);
  font-size: 0.84375rem;
}
.kg-steps li::before{
  content: counter(v7s);
  position: absolute;
  inset-inline-start: 0.75rem;
  inset-block-start: 0.6875rem;
  width: 1.5rem;
  height: 1.5rem;
  border-radius: 50%;
  background: linear-gradient(180deg,var(--aqua),var(--aqua-3));
  color: #1b0b33;
  font-weight: var(--q-wt2);
  font-size: 0.78125rem;
  display: flex;
  align-items: center;
  justify-content: center;
}
.kg-faq{display: grid; row-gap: var(--q-sp9); column-gap: var(--q-sp9); margin-block-start: 0; margin-inline-end: 0; margin-block-end: var(--q-sp19); margin-inline-start: 0;}
.kg-faq details{border-radius: 0.6875rem; background: var(--panel); border-width: 0.0625rem; border-style: solid; border-color: var(--line); overflow-x: hidden; overflow-y: hidden;}
.kg-faq summary{padding-block: var(--q-sp13); padding-inline: var(--q-sp15); cursor: pointer; font-weight: var(--q-wt1); font-size: 0.875rem; color: var(--txt);}
.kg-faq p{margin-block: 0; margin-inline: 0; padding-block-start: 0; padding-inline-end: var(--q-sp15); padding-block-end: var(--q-sp14); padding-inline-start: var(--q-sp15); font-size: 0.84375rem; color: var(--mut);}
.kg-band{
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  row-gap: var(--q-sp14);
  column-gap: var(--q-sp14);
  margin-block-start: var(--q-sp20);
  margin-inline-end: 0;
  margin-block-end: 0;
  margin-inline-start: 0;
  padding-block: var(--q-sp18);
  padding-inline: var(--q-sp18);
  border-radius: 0.875rem;
  background: linear-gradient(135deg,var(--jade-2),var(--jade-3));
  border-width: 0.0625rem;
  border-style: solid;
  border-color: var(--line-2);
}
.kg-band b{font-size: 1rem; color: #fff; max-width: 35rem;}

/* ---------- footer ---------- */
.kg-foot{
  background: var(--ink-2);
  border-block-start-width: 0.0625rem;
  border-block-start-style: solid;
  border-block-start-color: var(--line);
  margin-block-start: var(--q-sp21);
  padding-block-end: calc(var(--bar) + 3.875rem);
}
.kg-foot .w{max-width: 92.5rem; margin-block: 0; margin-inline: auto; padding-block-start: var(--q-sp21); padding-inline-end: var(--q-sp17); padding-block-end: var(--q-sp18); padding-inline-start: var(--q-sp17);}
.kg-foot .cols{display: grid; grid-template-columns: 1.6fr 1fr 1fr 1fr; row-gap: var(--q-sp20); column-gap: var(--q-sp20);}
.kg-foot .cols>div{display: flex; flex-direction: column; row-gap: var(--q-sp8); column-gap: var(--q-sp8); min-width: 0;}
.kg-foot p{margin-block-start: var(--q-sp8); margin-inline-end: 0; margin-block-end: 0; margin-inline-start: 0; font-size: 0.75rem; color: var(--mut); line-height: 1.6;}
.kg-foot h4{font-size: 0.75rem; letter-spacing: .09em; text-transform: uppercase; color: var(--aqua); margin-block-end: var(--q-sp4);}
.kg-foot a{font-size: 0.78125rem; color: var(--mut);}
.kg-foot a.cta{color: var(--aqua);}
.kg-foot .soc{display: flex; row-gap: var(--q-sp10); column-gap: var(--q-sp10); margin-block-start: var(--q-sp10);}
.kg-foot .soc a{
  display: flex;
  align-items: center;
  justify-content: center;
  width: 2.25rem;
  height: 2.25rem;
  border-radius: 0.5625rem;
  background: var(--panel);
  border-width: 0.0625rem;
  border-style: solid;
  border-color: var(--line);
}
.kg-foot .soc svg{width: 1.0625rem; height: 1.0625rem; fill: var(--aqua);}
.kg-foot .pay,.kg-foot .trust{
  display: flex;
  flex-wrap: wrap;
  row-gap: var(--q-sp10);
  column-gap: var(--q-sp10);
  padding-block-start: var(--q-sp17);
  padding-inline-end: 0;
  padding-block-end: 0;
  padding-inline-start: 0;
  margin-block-start: var(--q-sp17);
  border-block-start-width: 0.0625rem;
  border-block-start-style: solid;
  border-block-start-color: var(--line);
}
.kg-foot .pay span,.kg-foot .trust span{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 2.125rem;
  padding-block: 0;
  padding-inline: var(--q-sp12);
  border-radius: 0.4375rem;
  background: var(--chip);
}
.kg-foot .pay img{max-height: 1.25rem; width: auto; object-fit: contain;}
.kg-foot .trust img{max-height: 1.375rem; width: auto; object-fit: contain;}
.kg-foot .legal{
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  row-gap: var(--q-sp12);
  column-gap: var(--q-sp12);
  margin-block-start: var(--q-sp17);
  padding-block-start: var(--q-sp15);
  border-block-start-width: 0.0625rem;
  border-block-start-style: solid;
  border-block-start-color: var(--line);
  font-size: 0.71875rem;
  color: var(--mut);
}
.kg-foot .legal>span{display: flex; align-items: center; row-gap: var(--q-sp10); column-gap: var(--q-sp10); max-width: 47.5rem; line-height: var(--q-lh5);}
.kg-foot .age{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.875rem;
  height: 1.875rem;
  border-radius: 50%;
  border-width: 0.125rem;
  border-style: solid;
  border-color: var(--wd);
  color: var(--wd);
  font-weight: var(--q-wt2);
  font-size: 0.6875rem;
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: auto;
}

/* ---------- entry popup ---------- */
.kg-pop{
  display: none;
  position: fixed;
  inset-block: 0;
  inset-inline: 0;
  z-index: 90;
  align-items: center;
  justify-content: center;
  padding-block: var(--q-sp18);
  padding-inline: var(--q-sp18);
  background: rgba(2,12,11,.82);
}
.kg-pop.on{display: flex;}
.kg-pop .bx{
  position: relative;
  width: min(43.75rem,100%);
  display: grid;
  grid-template-columns: 10.5rem 1fr;
  background: var(--panel);
  border-width: 0.0625rem;
  border-style: solid;
  border-color: var(--line-2);
  border-radius: 0.9375rem;
  overflow-x: hidden;
  overflow-y: hidden;
  max-height: 92vh;
}
/* Inside the card, not hanging off it: .bx is overflow:hidden for the rounded image corners,
   so a button at top:-13px gets its top half clipped and the close control reads as broken. */
.kg-pop .x{
  position: absolute;
  inset-block-start: 0.5625rem;
  inset-inline-end: 0.5625rem;
  z-index: 2;
  width: 2.125rem;
  height: 2.125rem;
  border-radius: 50%;
  background: var(--aqua);
  color: #1b0b33;
  border-width: 0;
  border-style: none;
  border-color: currentcolor;
  font-size: 1.1875rem;
  line-height: var(--q-lh1);
  cursor: pointer;
  box-shadow: 0 0.125rem 0.625rem rgba(2,12,11,.5);
}
.kg-pop .ix{display: flex; flex-direction: column; background: var(--jade-3); padding-block: var(--q-sp12); padding-inline: var(--q-sp12); row-gap: var(--q-sp8); column-gap: var(--q-sp8);}
.kg-pop .ix button{
  display: flex;
  align-items: center;
  row-gap: var(--q-sp9);
  column-gap: var(--q-sp9);
  padding-block: var(--q-sp11);
  padding-inline: var(--q-sp11);
  border-radius: 0.5625rem;
  border-width: 0;
  border-style: none;
  border-color: currentcolor;
  background: transparent;
  color: var(--mut);
  font-size: 0.75rem;
  font-weight: var(--q-wt1);
  text-align: left;
  cursor: pointer;
}
.kg-pop .ix button i{width: 0.4375rem; height: 0.4375rem; border-radius: 50%; background: var(--mut); flex-grow: 0; flex-shrink: 0; flex-basis: auto;}
.kg-pop .ix button.on{background: rgba(168,85,247,.12); color: var(--aqua);}
.kg-pop .ix button.on i{background: var(--aqua);}
.kg-pop .pane img{width: 100%; aspect-ratio: 4/3; object-fit: cover;}
.kg-pop .pane{display: flex; flex-direction: column; min-width: 0;}
.kg-pop .cap{padding-block-start: var(--q-sp14); padding-inline-end: var(--q-sp16); padding-block-end: var(--q-sp17); padding-inline-start: var(--q-sp16); display: flex; flex-direction: column; row-gap: var(--q-sp7); column-gap: var(--q-sp7);}
.kg-pop .cap b{font-size: 0.9375rem; color: #fff;}
.kg-pop .cap span{font-size: 0.78125rem; color: var(--mut);}
/* The pager, so the card reads as four pages rather than one long list. */
.kg-pop .pg{
  display: flex;
  align-items: center;
  justify-content: center;
  row-gap: var(--q-sp15);
  column-gap: var(--q-sp15);
  padding-block-start: 0;
  padding-inline-end: var(--q-sp16);
  padding-block-end: var(--q-sp15);
  padding-inline-start: var(--q-sp16);
  margin-block-start: auto;
}
.kg-pop .pg button{
  width: 2.125rem;
  height: 2.125rem;
  border-radius: 50%;
  border-width: 0.0625rem;
  border-style: solid;
  border-color: var(--line-2);
  background: transparent;
  color: var(--aqua);
  font-size: 1.125rem;
  line-height: var(--q-lh1);
  cursor: pointer;
}
.kg-pop .pg button:disabled{opacity: .35; cursor: default;}
.kg-pop .pg .n{font-size: 0.75rem; font-weight: var(--q-wt3); color: var(--mut); min-width: 2.75rem; text-align: center;}
/* .kg-hide alone loses to `.kg-pop .cap{display: flex;}` on specificity, which is why every
   caption and every CTA rendered at once. Beat it explicitly. */
.kg-hide{display: none;}
.kg-pop .cap.kg-hide,.kg-pop .pane>.kg-hide{display: none;}

/* ---------- fixed bars ---------- */
.kg-nav{
  position: fixed;
  inset-block-start: auto;
  inset-inline-end: 0;
  inset-block-end: 0;
  inset-inline-start: 0;
  z-index: 60;
  display: none;
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
  background: var(--jade-3);
  border-block-start-width: 0.0625rem;
  border-block-start-style: solid;
  border-block-start-color: var(--line);
  padding-block-start: var(--q-sp8);
}
.kg-nav a{
  display: flex;
  flex-direction: column;
  align-items: center;
  row-gap: var(--q-sp3);
  column-gap: var(--q-sp3);
  padding-block-start: var(--q-sp6);
  padding-inline-end: var(--q-sp3);
  padding-block-end: var(--q-sp8);
  padding-inline-start: var(--q-sp3);
  font-size: 0.625rem;
  color: var(--mut);
  min-height: var(--bar);
}
.kg-nav a .i{font-size: 1.0625rem; line-height: var(--q-lh1);}
.kg-nav a.coin{position: relative;}
.kg-nav a.coin .i{
  position: absolute;
  inset-block-start: -1.3125rem;
  inset-inline-start: 50%;
  margin-inline-start: -1.4375rem;
  width: 2.875rem;
  height: 2.875rem;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.1875rem;
  background: linear-gradient(180deg,var(--gold-2),var(--gold));
  color: #33230a;
  border-width: 0.25rem;
  border-style: solid;
  border-color: var(--jade-3);
  box-shadow: 0 0.1875rem 0.75rem rgba(0,0,0,.45);
}
.kg-scta{
  position: fixed;
  inset-block-start: auto;
  inset-inline-end: 0;
  inset-block-end: var(--bar);
  inset-inline-start: 0;
  z-index: 59;
  display: none;
  padding-block: var(--q-sp10);
  padding-inline: var(--q-sp15);
  background: linear-gradient(180deg,rgba(11,7,20,.5),var(--jade-3));
  border-block-start-width: 0.0625rem;
  border-block-start-style: solid;
  border-block-start-color: var(--line);
}
.kg-scta a{width: 100%;}

/* ---------- responsive ---------- */
@media (max-width:1180px){
  .kg-three{grid-template-columns: 16.875rem minmax(0,1fr);}
  .kg-col.r{grid-column: 1/-1; flex-direction: row; flex-wrap: wrap;}
  .kg-col.r>*{flex-grow: 1; flex-shrink: 1; flex-basis: 17.5rem;}
  .kg-games,.kg-games.pg{grid-template-columns: minmax(0,1fr) minmax(0,1fr) minmax(0,1fr) minmax(0,1fr);}
  .kg-provs{grid-template-columns: minmax(0,1fr) minmax(0,1fr) minmax(0,1fr) minmax(0,1fr);}
  .kg-movie .rail{grid-template-columns: minmax(0,1fr) minmax(0,1fr) minmax(0,1fr) minmax(0,1fr);}
}
@media (max-width:900px){
  body{padding-block-end: 0;}
  .kg-three{grid-template-columns: minmax(0,1fr); padding-block: var(--q-sp14); padding-inline: var(--q-sp14);}
  .kg-col.l,.kg-col.r{grid-column: auto; flex-direction: column;}
  .kg-col.r>*{flex-grow: 1; flex-shrink: 1; flex-basis: auto;}
  .kg-tiles{grid-template-columns: minmax(0,1fr) minmax(0,1fr);}
  .kg-matches{grid-template-columns: minmax(0,1fr);}
  .kg-kpis{grid-template-columns: minmax(0,1fr) minmax(0,1fr);}
  .kg-testi .grid{grid-template-columns: minmax(0,1fr);}
  .kg-foot .cols{grid-template-columns: minmax(0,1fr) minmax(0,1fr);}
  .kg-nav{display: grid;}
  .kg-scta{display: block;}
  .kg-pop .bx{grid-template-columns: minmax(0,1fr);}
  .kg-pop .ix{flex-direction: row; overflow-x: auto;}
  .kg-pop .ix button{white-space: nowrap;}
}
@media (max-width:640px){
  .kg-head .row{grid-template-columns: auto 1fr auto; padding-block: var(--q-sp9); padding-inline: var(--q-sp13);}
  .kg-logo .wm b{font-size: 1.3125rem;}
  .kg-logo svg{width: 2rem; height: 2rem;}
  .kg-lang a{min-width: 2.125rem; font-size: 0.6875rem;}
  .kg-cats{grid-template-columns: minmax(0,1fr) minmax(0,1fr) minmax(0,1fr);}
  .kg-cats .i{width: 2.5rem; height: 2.5rem; font-size: 1.125rem;}
  .kg-games,.kg-games.pg{grid-template-columns: minmax(0,1fr) minmax(0,1fr) minmax(0,1fr);}
  .kg-provs{grid-template-columns: minmax(0,1fr) minmax(0,1fr) minmax(0,1fr);}
  .kg-col.l .kg-promo img{aspect-ratio: 3/2;}
  .kg-minilogos{grid-template-columns: minmax(0,1fr) minmax(0,1fr) minmax(0,1fr) minmax(0,1fr);}
  .kg-content{padding-block-start: var(--q-sp18); padding-inline-end: var(--q-sp15); padding-block-end: 1.875rem; padding-inline-start: var(--q-sp15);}
  .kg-content h1{font-size: 1.5rem;}
  .kg-content h2{font-size: 1.125rem;}
  .kg-kpis b{font-size: 1.0625rem;}
  .kg-foot .cols{grid-template-columns: minmax(0,1fr);}
  .kg-band{flex-direction: column; align-items: flex-start;}
  .kg-band b{font-size: 0.9375rem;}
  .kg-tick span{animation-duration: 34s;}
  .kg-jp b i{font-size: 1.5625rem;}
  .kg-live .it{flex-basis: 8.25rem;}
  .kg-movie .rail{grid-template-columns: minmax(0,1fr) minmax(0,1fr) minmax(0,1fr) minmax(0,1fr);}
}
@media (prefers-reduced-motion:reduce){
  .kg-tick span{animation-name: none; animation-duration: 0s; animation-timing-function: ease; animation-delay: 0s; animation-iteration-count: 1; animation-direction: normal; animation-fill-mode: none; animation-play-state: running; padding-inline-start: 0;}
  .kg-txn .live::before{animation-name: none; animation-duration: 0s; animation-timing-function: ease; animation-delay: 0s; animation-iteration-count: 1; animation-direction: normal; animation-fill-mode: none; animation-play-state: running;}
}
/* Small phones. Burger, lockup and language pills are all nowrap, so at 320 the head row measured
   349px and dragged the document sideways. Trim the strapline's letter-spacing and the pills
   rather than wrapping or hiding any of them. */
@media (max-width:400px){
  .kg-head .row{row-gap: var(--q-sp7); column-gap: var(--q-sp7);}
  .kg-logo{row-gap: var(--q-sp8); column-gap: var(--q-sp8);}
  .kg-logo .wm b{font-size: 1.125rem;}
  .kg-logo .wm small{font-size: 0.5rem; letter-spacing: .18em;}
  .kg-lang a{min-width: 1.875rem; padding-block: 0; padding-inline: var(--q-sp6);}
}

/* THE LOGO CHIP. Every third-party mark on this site - provider wall, mini wall, payment rails,
   certification badges - sits on this one near-white field, in its own colour, nothing lifted and
   nothing silhouetted. Measuring each file and chipping only the dark ones splits the wall into
   two looks and still leaves a fill-less SVG (Evolution, GLI) invisible on the panel. */

/* === image focal points === */
/* The part of the picture that must survive the crop is pinned to the same
   point of the box. */
img[src$="/assets/img/game-jade-dragon.jpg"]{object-position: 27.4% 61.6%;}
img[src$="/assets/img/hero-918kiss.jpg"]{object-position: 50.0% 43.5%;}
img[src$="/assets/img/hero-malaysia.jpg"]{object-position: 36.0% 39.2%;}
img[src$="/assets/img/live-dragon-tiger.jpg"]{object-position: 31.5% 40.0%;}
img[src$="/assets/img/promo-register.jpg"]{object-position: 47.4% 30.0%;}
/* === end image focal points === */