/* NAGA6D Hub — dana4d-like lobby chrome v2.0 */

:root {
  --q5k-bg: #1e0407;
  --q5k-bg-2: #26060a;
  --q5k-bg-3: #30080d;
  --q5k-gold-light: #ffe9a8;
  --q5k-gold-mid: #d8a83e;
  --q5k-gold-dark: #9c6f22;
  --q5k-red: #c01722;
  --q5k-red-deep: #7c0d13;
  --q5k-red-glow: rgba(192, 23, 34, 0.38);
  --q5k-text: #f7edda;
  --q5k-text-muted: #c0a08b;
  --q5k-border: rgba(212, 170, 62, 0.30);
  --q5k-border-strong: rgba(212, 170, 62, 0.55);
  --q5k-gold-grad: linear-gradient(135deg, #ffe9a8 0%, #d8a83e 48%, #9c6f22 100%);
  --q5k-red-grad: linear-gradient(135deg, #c01722 0%, #7c0d13 100%);
  --q5k-radius: 10px;
  --q5k-radius-sm: 6px;
  --q5k-shell: min(1140px, 100% - 1.25rem);
  --q5k-ease: cubic-bezier(0.22, 1, 0.36, 1);
  --q5k-shadow-soft: 0 10px 40px rgba(0, 0, 0, 0.42);
  --font-display: "Bebas Neue", Impact, sans-serif;
  --font-body: "Nunito Sans", system-ui, sans-serif;
  --q5k-dock-h: 64px;
}

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

html {
  scroll-behavior: smooth;
  -webkit-text-size-adjust: 100%;
}

body.q5k-skin {
  margin: 0;
  font-family: var(--font-body);
  font-size: 1rem;
  line-height: 1.65;
  color: var(--q5k-text);
  background:
    radial-gradient(circle at 50% -6%, rgba(216, 168, 62, 0.12), transparent 42%),
    radial-gradient(ellipse 55% 45% at 6% 2%, var(--q5k-red-glow), transparent 60%),
    radial-gradient(ellipse 55% 45% at 94% 2%, var(--q5k-red-glow), transparent 60%),
    radial-gradient(ellipse 100% 60% at 50% 118%, rgba(124, 13, 19, 0.42), transparent 72%),
    linear-gradient(180deg, #38090f 0%, #1e0407 55%, #120305 100%);
  background-attachment: fixed;
  min-height: 100vh;
  padding-bottom: calc(var(--q5k-dock-h) + 12px);
  -webkit-font-smoothing: antialiased;
}

img { max-width: 100%; height: auto; display: block; }

a {
  color: var(--q5k-gold-light);
  transition: color 0.25s var(--q5k-ease);
}
a:hover { color: var(--q5k-gold-mid); }

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.skip-link {
  position: absolute;
  left: -9999px;
  top: 0;
  z-index: 20000;
  padding: .6rem 1rem;
  background: var(--q5k-gold-mid);
  color: #1a1200;
  font-weight: 700;
}
.skip-link:focus { left: .5rem; top: .5rem; }

.q5k-shell {
  width: var(--q5k-shell);
  margin-inline: auto;
}

/* ── Buttons ── */
.q5k-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .35rem;
  padding: .52rem 1.1rem;
  border-radius: var(--q5k-radius-sm);
  font-family: var(--font-display);
  font-size: 1rem;
  letter-spacing: .08em;
  text-decoration: none;
  border: 2px solid transparent;
  cursor: pointer;
  transition: transform 0.25s var(--q5k-ease), box-shadow 0.25s var(--q5k-ease), background 0.25s var(--q5k-ease);
  white-space: nowrap;
}
.q5k-btn:hover { transform: translateY(-1px); }
.q5k-btn--sm { padding: .4rem .85rem; font-size: .95rem; }
.q5k-btn--gold {
  background: var(--q5k-gold-grad);
  color: #1a1200;
  border-color: rgba(252, 230, 142, 0.55);
  box-shadow: 0 4px 14px rgba(212, 170, 62, 0.28);
}
.q5k-btn--gold:hover { color: #1a1200; }
.q5k-btn--outline {
  background: rgba(212, 170, 62, 0.05);
  color: var(--q5k-gold-light);
  border-color: rgba(212, 170, 62, 0.5);
}
.q5k-btn--outline:hover {
  background: rgba(212, 170, 62, 0.14);
  color: var(--q5k-gold-light);
}

/* ── Header + login form ── */
.q5k-header {
  position: relative;
  z-index: 9000;
  background: linear-gradient(180deg, rgba(42, 12, 10, 0.97) 0%, rgba(26, 7, 6, 0.96) 100%);
  border-bottom: 1px solid var(--q5k-border-strong);
  box-shadow: 0 6px 24px rgba(0, 0, 0, 0.5);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}
/* Centered mobile logo (hidden on desktop) */
.q5k-header__logo-m { display: none; }
.q5k-btn--tg-wide {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: .5rem;
  width: 100%;
  margin-top: .6rem;
  padding: .72rem 1rem;
  border: 0;
  border-radius: 9px;
  font-family: var(--font-display);
  font-weight: 700;
  letter-spacing: .03em;
  color: #fff;
  text-decoration: none;
  background: linear-gradient(180deg, #3a3a3d 0%, #161618 100%);
  border: 1px solid rgba(255, 255, 255, 0.08);
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.45);
}
.q5k-btn--tg-wide:hover { filter: brightness(1.12); }
.q5k-viewswitch {
  text-align: center;
  margin-top: .7rem;
  font-size: .82rem;
  letter-spacing: .06em;
  color: #cbb8a0;
}
.q5k-viewswitch span { padding: 0 .45rem; }
.q5k-viewswitch .is-active { color: var(--q5k-gold-light); font-weight: 700; }

.q5k-header__top {
  display: flex;
  align-items: center;
  gap: .85rem;
  padding: .7rem 0 .55rem;
  flex-wrap: wrap;
}

.q5k-logo img {
  height: 42px;
  width: auto;
  filter: drop-shadow(0 2px 8px rgba(212, 170, 62, 0.15));
}

.q5k-header__meta { margin-right: auto; }

.q5k-clock {
  font-size: .72rem;
  color: var(--q5k-text-muted);
  letter-spacing: .05em;
  font-variant-numeric: tabular-nums;
  padding: .22rem .65rem;
  border-radius: 999px;
  border: 1px solid rgba(212, 170, 62, 0.12);
  background: rgba(255, 255, 255, 0.02);
}

.q5k-login {
  display: flex;
  align-items: center;
  gap: .4rem;
  flex-wrap: wrap;
}

.q5k-login__input {
  width: 118px;
  height: 34px;
  padding: 0 .55rem;
  border-radius: var(--q5k-radius-sm);
  border: 1px solid rgba(212, 170, 62, 0.35);
  background: #2a0e0b;
  color: var(--q5k-text);
  font-size: .82rem;
  outline: none;
}
.q5k-login__input:focus {
  border-color: var(--q5k-gold-mid);
  box-shadow: 0 0 0 2px rgba(212, 170, 62, 0.18);
}
.q5k-login__input--cap { width: 64px; }

.q5k-login__cap {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 48px;
  height: 34px;
  padding: 0 .45rem;
  border-radius: var(--q5k-radius-sm);
  border: 1px solid rgba(158, 158, 158, 0.55);
  background: linear-gradient(180deg, #2a2418, #16120c);
  color: var(--q5k-gold-light);
  font-family: var(--font-display);
  font-size: 1.05rem;
  letter-spacing: .12em;
  user-select: none;
}

.q5k-login--desk { display: none; }
/* Desktop auth: hide fields, keep wide colored Masuk (red) + Daftar (blue) at far right */
.q5k-login--desk label,
.q5k-login--desk .q5k-login__input,
.q5k-login--desk .q5k-login__cap { display: none; }
.q5k-login--desk .q5k-btn--sm {
  min-width: 122px;
  padding: .6rem 1.6rem;
  font-size: .82rem;
  letter-spacing: .04em;
}
.q5k-login--desk .q5k-btn--gold {
  background: linear-gradient(180deg, #e5493f 0%, #c22d28 100%);
  color: #fff;
  border: 0;
  box-shadow: 0 4px 12px rgba(197, 45, 42, 0.35);
}
.q5k-login--desk .q5k-btn--outline {
  background: linear-gradient(180deg, #29a9e4 0%, #1c86c4 100%);
  color: #fff;
  border: 0;
  box-shadow: 0 4px 12px rgba(28, 134, 196, 0.35);
}

.q5k-login-mobile {
  padding: .75rem 0 .35rem;
}
.q5k-login--mobile {
  display: grid;
  gap: .55rem;
  padding: .85rem;
  background: var(--q5k-bg-2);
  border: 1px solid var(--q5k-border);
  border-radius: var(--q5k-radius);
}
.q5k-login--mobile .q5k-login__input { width: 100%; height: 42px; }
.q5k-login__cap-row {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: .5rem;
  align-items: center;
}
.q5k-login__actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .55rem;
}
.q5k-login__actions .q5k-btn { width: 100%; padding: .7rem 1rem; }

@media (min-width: 980px) {
  .q5k-login--desk { display: flex; }
  .q5k-login-mobile { display: none; }
  .q5k-header__meta { margin-left: 0; order: 0; }
  .q5k-header__top { flex-wrap: nowrap; }
}

/* ── Category mega nav ── */
.q5k-cats {
  position: relative;
  z-index: 60;
  border-top: 1px solid rgba(212, 170, 62, 0.22);
  background: linear-gradient(180deg, #350f0c 0%, #220908 100%);
}
.q5k-cats__track {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: nowrap;
  gap: .3rem;
  overflow: visible;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
  scroll-snap-type: x proximity;
  padding: .45rem .25rem .55rem;
}
.q5k-cats__track::-webkit-scrollbar { display: none; }

.q5k-cats__cell {
  flex: 1 1 auto;
  min-width: 64px;
  display: flex;
  scroll-snap-align: start;
}

.q5k-cats__logo {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  padding-right: .7rem;
  margin-right: .3rem;
  border-right: 1px solid rgba(212, 170, 62, 0.18);
  scroll-snap-align: start;
}
.q5k-cats__logo img { height: clamp(30px, 5vw, 44px); width: auto; }

.q5k-cats__item {
  flex: 1 1 auto;
  width: 100%;
  min-width: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: .3rem;
  padding: .4rem .35rem;
  text-decoration: none;
  color: #f0f0f0;
  border-radius: 8px;
  transition: background 0.25s var(--q5k-ease), color 0.25s var(--q5k-ease);
}
.q5k-cats__item:hover,
.q5k-cats__item.is-active {
  color: var(--q5k-gold-light);
  background: linear-gradient(180deg, rgba(212, 170, 62, 0.16) 0%, transparent 100%);
}

.q5k-cats__icon {
  width: 30px;
  height: 30px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  color: #ffffff;
  background:
    radial-gradient(circle at 40% 30%, rgba(255, 255, 255, 0.10), transparent 60%),
    linear-gradient(145deg, #3a1210, #1a0605);
  border: 1px solid rgba(255, 255, 255, 0.22);
  transition: color 0.25s var(--q5k-ease), border-color 0.25s var(--q5k-ease), box-shadow 0.25s var(--q5k-ease);
}
.q5k-cats__icon svg { width: 18px; height: 18px; display: block; }
.q5k-cats__item:hover .q5k-cats__icon,
.q5k-cats__item.is-active .q5k-cats__icon {
  color: #ffffff;
  border-color: rgba(212, 170, 62, 0.75);
  box-shadow: 0 0 0 2px rgba(212, 170, 62, 0.22);
}

.q5k-cats__label {
  font-family: var(--font-display);
  font-size: .78rem;
  letter-spacing: .06em;
  white-space: nowrap;
}

/* ── Hover mega-menu (provider panels) ── */
.q5k-mega {
  position: absolute;
  left: 50%;
  top: 100%;
  transform: translate(-50%, 8px);
  width: var(--q5k-shell);
  max-width: 1140px;
  background: linear-gradient(180deg, #2a0c0a 0%, #180605 100%);
  border: 1px solid rgba(212, 170, 62, 0.35);
  border-radius: 12px;
  box-shadow: 0 18px 44px rgba(0, 0, 0, 0.55), inset 0 1px 0 rgba(255, 255, 255, 0.05);
  padding: .9rem 1rem 1.05rem;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity .22s var(--q5k-ease), transform .22s var(--q5k-ease);
  z-index: 70;
}
.q5k-cats__cell.has-mega:hover .q5k-mega,
.q5k-cats__cell.has-mega:focus-within .q5k-mega {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translate(-50%, 0);
}
.q5k-mega__head {
  font-family: var(--font-display);
  font-size: .82rem;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--q5k-gold-light);
  padding: 0 .1rem .6rem;
  margin-bottom: .55rem;
  border-bottom: 1px solid rgba(212, 170, 62, 0.2);
}
.q5k-mega__grid {
  display: flex;
  flex-wrap: wrap;
  gap: .5rem;
}
.q5k-mega__prov {
  flex: 0 0 calc((100% - 8 * 0.5rem) / 9);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: .3rem;
  padding: .55rem .3rem;
  border-radius: 9px;
  text-decoration: none;
  color: #e9e0cf;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.04), rgba(255, 255, 255, 0));
  border: 1px solid rgba(212, 170, 62, 0.12);
  transition: transform .18s var(--q5k-ease), border-color .18s var(--q5k-ease), background .18s var(--q5k-ease);
}
.q5k-mega__prov img {
  width: 42px;
  height: 42px;
  object-fit: contain;
}
.q5k-mega__prov span {
  font-size: .62rem;
  letter-spacing: .02em;
  text-align: center;
  line-height: 1.15;
  color: #cfc4ad;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 100%;
}
.q5k-mega__prov:hover {
  transform: translateY(-2px);
  border-color: rgba(212, 170, 62, 0.55);
  background: linear-gradient(180deg, rgba(212, 170, 62, 0.14), rgba(212, 170, 62, 0.03));
}
.q5k-mega__prov:hover span { color: #fff; }

/* City emblems for the TOGEL panel */
.q5k-mega__prov--city img {
  width: 54px;
  height: 54px;
  border-radius: 50%;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.5);
}
.q5k-mega__prov--city span { font-size: .66rem; }
.q5k-mega__chips {
  display: flex;
  flex-wrap: wrap;
  gap: .45rem;
}
.q5k-mega__chip {
  font-family: var(--font-display);
  font-size: .72rem;
  letter-spacing: .04em;
  padding: .45rem .8rem;
  border-radius: 999px;
  text-decoration: none;
  color: #eadfc6;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0));
  border: 1px solid rgba(212, 170, 62, 0.28);
  transition: transform .18s var(--q5k-ease), border-color .18s var(--q5k-ease), color .18s var(--q5k-ease);
}
.q5k-mega__chip:hover {
  transform: translateY(-2px);
  border-color: var(--q5k-gold-mid);
  color: #fff;
}

/* ── Broadcast marquee ── */
.q5k-broadcast {
  background: var(--q5k-bg-2);
  border-bottom: 1px solid var(--q5k-border);
  overflow: hidden;
}
.q5k-broadcast__inner {
  display: flex;
  align-items: center;
  gap: .65rem;
  padding: .55rem 0;
  overflow: hidden;
}
.q5k-broadcast__icon {
  flex-shrink: 0;
  color: var(--q5k-gold-mid);
}
.q5k-broadcast__track {
  display: flex;
  gap: 2.5rem;
  animation: q5k-marquee 40s linear infinite;
  will-change: transform;
}
.q5k-broadcast__item {
  flex-shrink: 0;
  font-size: .82rem;
  color: var(--q5k-text-muted);
  white-space: nowrap;
}
@keyframes q5k-marquee {
  0% { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}

/* ── Banners (full-bleed, show full art — no crop) ── */
.q5k-banners {
  position: relative;
  width: 100%;
  max-width: 100%;
  margin: 0;
  padding: 0;
  background: #0d0303;
  overflow: visible;
}
.q5k-banners__slides {
  position: relative;
  width: 100%;
  border-radius: 0;
  overflow: visible;
  border: 0;
  background: #0d0303;
  line-height: 0;
  aspect-ratio: auto;
}
.q5k-banners__slide {
  position: relative;
  opacity: 0;
  transition: opacity .5s var(--q5k-ease);
  pointer-events: none;
  background: #0d0303;
  display: none;
}
.q5k-banners__slide.is-active {
  opacity: 1;
  pointer-events: auto;
  display: block;
}
.q5k-banner {
  display: block;
  width: 100%;
  background: #0d0303;
}
.q5k-banner__img {
  width: 100%;
  max-width: 100%;
  height: auto !important;
  max-height: none !important;
  display: block;
  object-fit: fill;
  object-position: center top;
  background: #0d0303;
  vertical-align: top;
}
.q5k-banners__dots {
  display: flex;
  justify-content: center;
  gap: .4rem;
  padding: .55rem 0 .2rem;
}
.q5k-banners__dots button {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  border: 0;
  padding: 0;
  background: rgba(212, 170, 62, 0.28);
  cursor: pointer;
}
.q5k-banners__dots button.is-active {
  background: var(--q5k-gold-mid);
  box-shadow: 0 0 0 3px rgba(212, 170, 62, 0.2);
}

/* ── Section heads ── */
.q5k-section-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin: 1.35rem 0 .85rem;
}
.q5k-section-title {
  margin: 0;
  font-family: var(--font-display);
  font-size: clamp(1.2rem, 3vw, 1.5rem);
  letter-spacing: .1em;
  color: var(--q5k-gold-light);
  background: var(--q5k-gold-grad);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  text-shadow: 0 1px 10px rgba(192, 23, 34, 0.25);
}
.q5k-section-link {
  font-size: .82rem;
  font-weight: 700;
  text-decoration: none;
  color: var(--q5k-gold-mid);
}

/* ── Category (provider) page ── */
.q5k-catpage { padding: 1.25rem 0 2.5rem; min-height: 46vh; }
.q5k-catpage__grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(112px, 1fr));
  gap: .7rem;
}
.q5k-catpage__prov {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: .45rem;
  padding: 1rem .5rem;
  border-radius: 12px;
  text-decoration: none;
  color: #e9e0cf;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.04), rgba(255, 255, 255, 0));
  border: 1px solid rgba(212, 170, 62, 0.14);
  transition: transform .18s var(--q5k-ease), border-color .18s var(--q5k-ease), background .18s var(--q5k-ease);
}
.q5k-catpage__prov img { width: 60px; height: 60px; object-fit: contain; }
.q5k-catpage__prov span {
  font-size: .72rem;
  letter-spacing: .02em;
  text-align: center;
  line-height: 1.2;
  color: #cfc4ad;
}
.q5k-catpage__prov:hover {
  transform: translateY(-3px);
  border-color: rgba(212, 170, 62, 0.6);
  background: linear-gradient(180deg, rgba(212, 170, 62, 0.14), rgba(212, 170, 62, 0.03));
}
.q5k-catpage__prov:hover span { color: #fff; }
.q5k-catpage__grid--city .q5k-catpage__prov img {
  width: 76px;
  height: 76px;
  border-radius: 50%;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.5);
}
.q5k-catpage__chips {
  display: flex;
  flex-wrap: wrap;
  gap: .55rem;
}
.q5k-catpage__chip {
  font-family: var(--font-display);
  font-size: .78rem;
  letter-spacing: .04em;
  padding: .6rem 1.1rem;
  border-radius: 999px;
  text-decoration: none;
  color: #eadfc6;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0));
  border: 1px solid rgba(212, 170, 62, 0.2);
  transition: border-color .18s var(--q5k-ease), color .18s var(--q5k-ease);
}
.q5k-catpage__chip:hover { border-color: rgba(212, 170, 62, 0.6); color: #fff; }
.q5k-catpage__body { margin-top: 1.6rem; color: var(--q5k-text-muted); line-height: 1.75; }

/* ── Togel result tiles ── */
.q5k-togel { padding-bottom: .25rem; }
.q5k-togel__reveal { position: relative; }
.q5k-togel__grid {
  display: grid;
  grid-template-columns: repeat(10, 1fr);
  gap: .5rem;
  max-height: 128px;
  overflow: hidden;
  transition: max-height .55s var(--q5k-ease);
}
.q5k-togel__reveal:hover .q5k-togel__grid,
.q5k-togel__reveal.is-open .q5k-togel__grid { max-height: 380px; }
.q5k-togel__toggle {
  position: absolute;
  left: 50%;
  bottom: -13px;
  transform: translateX(-50%);
  width: 52px;
  height: 26px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--q5k-border-strong);
  border-top: 0;
  border-radius: 0 0 13px 13px;
  background: linear-gradient(180deg, #3d100d, #250908);
  color: var(--q5k-gold-light);
  cursor: pointer;
  z-index: 3;
  box-shadow: 0 6px 14px rgba(0, 0, 0, 0.45);
}
.q5k-togel__toggle svg { transition: transform .45s var(--q5k-ease); }
.q5k-togel__reveal:hover .q5k-togel__toggle svg,
.q5k-togel__reveal.is-open .q5k-togel__toggle svg { transform: rotate(180deg); }
.q5k-togel__toggle:hover { color: #fff; border-color: var(--q5k-gold-mid); }

/* ── Kupon berhadiah (marquee lights) ── */
.q5k-kupon { margin-top: 1.1rem; }
.q5k-kupon__panel {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 1.15rem 1.5rem;
  border-radius: 16px;
  background:
    radial-gradient(circle, rgba(255, 223, 138, 0.95) 1.5px, transparent 2.4px) 0 0 / 15px 15px,
    linear-gradient(180deg, #4d1011, #2c0909);
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.5);
  overflow: hidden;
  animation: q5k-kupon-chase 1.3s linear infinite;
}
@keyframes q5k-kupon-chase { to { background-position: 15px 0, 0 0; } }
.q5k-kupon__panel::before {
  content: "";
  position: absolute;
  inset: 9px;
  border-radius: 10px;
  background: linear-gradient(180deg, #5c1315, #380b0c);
  box-shadow: inset 0 0 26px rgba(0, 0, 0, 0.55);
  z-index: 0;
}
.q5k-kupon__left,
.q5k-kupon__right { position: relative; z-index: 1; }
.q5k-kupon__left { display: flex; align-items: center; gap: .85rem; }
.q5k-kupon__logo { color: var(--q5k-gold-light); display: flex; }
.q5k-kupon__name {
  font-family: var(--font-display);
  font-size: 1.35rem;
  letter-spacing: .06em;
  color: var(--q5k-gold-light);
}
.q5k-kupon__right { display: flex; align-items: center; gap: 1rem; }
.q5k-kupon__label {
  font-family: var(--font-display);
  letter-spacing: .12em;
  color: #f1e6d1;
  font-size: 1.05rem;
}
.q5k-kupon__amount {
  font-family: var(--font-display);
  font-size: clamp(1.4rem, 4vw, 2.05rem);
  color: var(--q5k-gold-light);
  letter-spacing: .04em;
  text-shadow: 0 2px 12px rgba(0, 0, 0, 0.55);
  font-variant-numeric: tabular-nums;
}
.q5k-result {
  display: flex;
  flex-direction: column;
  min-height: 118px;
  text-decoration: none;
  color: var(--q5k-text);
  border: 2px solid #9e9e9e;
  border-radius: 10px;
  overflow: hidden;
  transition: border-color .25s var(--q5k-ease), transform .25s var(--q5k-ease), box-shadow .25s var(--q5k-ease);
}
.q5k-result:hover {
  border-color: var(--q5k-gold-mid);
  transform: translateY(-2px);
  box-shadow: 0 8px 18px rgba(0, 0, 0, 0.5);
  color: var(--q5k-text);
}
.q5k-result__top {
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: .3rem;
  padding: .5rem .3rem;
  background: linear-gradient(180deg, #171717 0%, #070707 100%);
}
.q5k-result__foot {
  flex: 0 0 auto;
  padding: .3rem .3rem;
  text-align: center;
  background: linear-gradient(180deg, #8f1017 0%, #5f0a10 100%);
  border-top: 1px solid rgba(212, 170, 62, 0.35);
}
.q5k-result__market {
  font-size: .56rem;
  font-weight: 800;
  letter-spacing: .02em;
  text-align: center;
  line-height: 1.2;
  color: #e9cfa0;
  text-transform: uppercase;
}
.q5k-result__code {
  font-family: var(--font-display);
  font-size: 1.7rem;
  letter-spacing: .08em;
  color: var(--q5k-gold-light);
  line-height: 1;
}
.q5k-result__date {
  font-size: .58rem;
  color: #ffdfe2;
  letter-spacing: .02em;
}

/* ── Live bola carousel ── */
.q5k-sport { position: relative; }
.q5k-sport__viewport { overflow: hidden; }
.q5k-sport__track {
  display: flex;
  gap: .8rem;
  transition: transform .55s var(--q5k-ease);
  will-change: transform;
}
.q5k-match {
  flex: 0 0 calc((100% - 1.6rem) / 3);
  box-sizing: border-box;
  background: linear-gradient(165deg, #2c0f0c, #1a0605);
  border: 1px solid var(--q5k-border);
  border-radius: var(--q5k-radius);
  padding: .8rem .85rem .9rem;
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.4);
}
.q5k-match__head {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: .12rem;
  margin-bottom: .6rem;
  text-align: center;
}
.q5k-match__league {
  font-weight: 800;
  color: var(--q5k-gold-light);
  font-size: .72rem;
  letter-spacing: .03em;
  text-transform: uppercase;
  line-height: 1.2;
}
.q5k-match__time { font-size: .66rem; color: var(--q5k-text-muted); }
.q5k-match__body {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: start;
  gap: .4rem;
}
.q5k-match__side {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: .35rem;
}
.q5k-match__badge {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--font-display);
  font-size: 1rem;
  color: #fff;
  background:
    radial-gradient(circle at 35% 28%, rgba(255, 255, 255, 0.38), transparent 60%),
    var(--team, #333);
  border: 2px solid rgba(255, 255, 255, 0.28);
  box-shadow: 0 3px 8px rgba(0, 0, 0, 0.45);
  overflow: hidden;
}
.q5k-match__badge--flag {
  background: #0b0b0b;
  border-color: rgba(212, 170, 62, 0.55);
}
.q5k-match__badge img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.q5k-match__team {
  font-size: .72rem;
  font-weight: 700;
  text-align: center;
  line-height: 1.15;
  min-height: 2.1em;
}
.q5k-match__center {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: .4rem;
  padding-top: .3rem;
}
.q5k-match__score {
  font-family: var(--font-display);
  font-size: 1.4rem;
  letter-spacing: .06em;
  color: var(--q5k-gold-light);
}
.q5k-match__bet {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: .3rem .7rem;
  border-radius: 5px;
  background: var(--q5k-gold-grad);
  color: #1a1200;
  font-family: var(--font-display);
  font-size: .78rem;
  letter-spacing: .06em;
  text-decoration: none;
}
.q5k-match__bet:hover { color: #1a1200; transform: translateY(-1px); }
.q5k-match__odds {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: .35rem;
  margin-top: .8rem;
}
.q5k-odd {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: .38rem .2rem;
  border-radius: 6px;
  background: #240a08;
  border: 1px solid rgba(212, 170, 62, 0.28);
  text-decoration: none;
  color: var(--q5k-gold-light);
  font-size: .74rem;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}
.q5k-odd:hover { border-color: var(--q5k-gold-mid); color: #fff; background: #33100c; }

.q5k-sport__nav {
  position: absolute;
  top: calc(50% + .6rem);
  transform: translateY(-50%);
  width: 34px;
  height: 34px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(42, 12, 10, 0.9);
  color: var(--q5k-gold-light);
  border: 1px solid var(--q5k-border-strong);
  cursor: pointer;
  z-index: 4;
  transition: background .25s, color .25s;
}
.q5k-sport__nav--prev { left: -8px; }
.q5k-sport__nav--next { right: -8px; }
.q5k-sport__nav:hover { color: #fff; background: rgba(64, 17, 14, 0.96); }
.q5k-sport__dots {
  display: flex;
  gap: .4rem;
  justify-content: center;
  margin-top: .75rem;
}
.q5k-sport__dots button {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  border: 0;
  padding: 0;
  background: rgba(255, 255, 255, 0.25);
  cursor: pointer;
  transition: background .25s, width .25s;
}
.q5k-sport__dots button.is-active {
  background: var(--q5k-gold-mid);
  width: 20px;
  border-radius: 6px;
}

/* ── Telegram Bet banner ── */
.q5k-tgbet { margin-top: 1rem; }
.q5k-tgbet__panel {
  display: flex;
  align-items: center;
  gap: 1.1rem;
  padding: 1rem 1.35rem;
  border-radius: 14px;
  background: linear-gradient(120deg, #1e3f63 0%, #16263f 58%, #0f1a2b 100%);
  border: 1px solid rgba(120, 180, 240, 0.28);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.45);
  text-decoration: none;
}
.q5k-tgbet__panel:hover { border-color: rgba(120, 180, 240, 0.5); }
.q5k-tgbet__icon {
  color: #35a8ee;
  flex: 0 0 auto;
  display: flex;
  filter: drop-shadow(0 2px 8px rgba(53, 168, 238, 0.55));
}
.q5k-tgbet__copy { display: flex; flex-direction: column; gap: .25rem; flex: 1 1 auto; }
.q5k-tgbet__title {
  font-family: var(--font-display);
  font-size: 1.3rem;
  letter-spacing: .08em;
  color: #eaf3fb;
}
.q5k-tgbet__links { display: flex; flex-wrap: wrap; gap: .55rem; }
.q5k-tgbet__links span {
  font-size: .72rem;
  color: #bcd4ea;
  position: relative;
  padding-right: .65rem;
}
.q5k-tgbet__links span:not(:last-child)::after {
  content: "·";
  position: absolute;
  right: .18rem;
  color: rgba(188, 212, 234, 0.55);
}
.q5k-tgbet__cta { flex: 0 0 auto; }

/* ── Hub categories ── */
.q5k-hub { padding: .5rem 0 1rem; }
.q5k-hub__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: .75rem;
}
.q5k-hub__tile {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: .4rem;
  padding: 1.15rem .7rem 1rem;
  background: linear-gradient(165deg, #1c1c1c, #0b0b0b);
  border: 1px solid var(--q5k-border);
  border-radius: var(--q5k-radius);
  text-decoration: none;
  color: var(--q5k-text);
  transition: transform .25s var(--q5k-ease), border-color .25s var(--q5k-ease);
}
.q5k-hub__tile:hover {
  transform: translateY(-3px);
  border-color: var(--q5k-border-strong);
  color: var(--q5k-text);
}
.q5k-hub__icon {
  width: 54px;
  height: 54px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: radial-gradient(circle at 35% 25%, rgba(252,230,142,.18), rgba(11,11,11,.4));
  border: 1px solid rgba(212, 170, 62, 0.35);
}
.q5k-hub__icon img { width: 32px; height: 32px; }
.q5k-hub__label {
  font-family: var(--font-display);
  font-size: 1.2rem;
  letter-spacing: .08em;
  color: var(--q5k-gold-light);
}
.q5k-hub__desc {
  font-size: .75rem;
  color: var(--q5k-text-muted);
  line-height: 1.35;
  max-width: 16ch;
}
.q5k-hub__arrow {
  color: var(--q5k-gold-mid);
  opacity: 0;
  transition: opacity .25s var(--q5k-ease);
}
.q5k-hub__tile:hover .q5k-hub__arrow { opacity: 1; }

/* ── Payments ── */
.q5k-pay { padding: .25rem 0 1.25rem; }
.q5k-pay__wrap {
  display: grid;
  grid-template-columns: minmax(0, 300px) 1fr;
  gap: 1.5rem;
  align-items: center;
  padding: 1.25rem 1.4rem;
  border-radius: 16px;
  border: 1px solid var(--q5k-border);
  background:
    radial-gradient(120% 90% at 15% 0%, rgba(192, 23, 34, 0.22), transparent 60%),
    linear-gradient(180deg, #2c0f0c, #1a0605);
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.45);
}
.q5k-pay__figure {
  margin: 0;
  position: relative;
  border-radius: 14px;
  overflow: hidden;
  padding: .5rem .5rem 0;
  background:
    radial-gradient(120% 80% at 50% 0%, rgba(216, 168, 62, 0.20), transparent 60%),
    linear-gradient(180deg, #3a130e, #1c0706);
  border: 1px solid var(--q5k-border);
}
.q5k-pay__figure img {
  position: relative;
  z-index: 1;
  display: block;
  width: 100%;
  height: auto;
  filter: drop-shadow(0 14px 30px rgba(0, 0, 0, 0.55));
}
.q5k-pay__methods { display: grid; gap: 1.15rem; align-content: start; }
.q5k-pay__group-title {
  margin: 0 0 .55rem;
  font-family: var(--font-display);
  font-size: 1rem;
  letter-spacing: .06em;
  color: var(--q5k-gold-light);
}
.q5k-pay__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: .5rem;
}
.q5k-pay__chip {
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  padding: .5rem .7rem;
  border-radius: 8px;
  border: 1px solid rgba(212, 170, 62, 0.28);
  background: linear-gradient(180deg, #241110, #170807);
  font-family: var(--font-display);
  font-size: .82rem;
  letter-spacing: .02em;
  color: var(--q5k-text);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.q5k-pay__dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #2fd06a;
  box-shadow: 0 0 6px rgba(47, 208, 106, 0.8);
  flex: 0 0 auto;
}

/* ── Info links + trust badges ── */
.q5k-info { padding: 1rem 0 .5rem; }
.q5k-info__links {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: .35rem .5rem;
  padding: .85rem 1rem;
  border: 1px solid var(--q5k-border);
  border-radius: 12px;
  background: linear-gradient(180deg, rgba(44, 16, 12, 0.6), rgba(20, 6, 5, 0.6));
}
.q5k-info__link {
  font-family: var(--font-display);
  font-size: .84rem;
  letter-spacing: .05em;
  color: var(--q5k-text-muted);
  text-decoration: none;
  transition: color .18s ease;
}
.q5k-info__link:hover { color: var(--q5k-gold-light); }
.q5k-info__sep { color: rgba(212, 170, 62, 0.4); font-size: .8rem; }
.q5k-trust {
  list-style: none;
  margin: 1rem 0 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: .75rem;
}
.q5k-trust__item {
  display: flex;
  align-items: center;
  gap: .65rem;
  padding: .8rem 1rem;
  border: 1px solid var(--q5k-border);
  border-radius: 12px;
  background:
    radial-gradient(120% 100% at 0% 0%, rgba(216, 168, 62, 0.12), transparent 60%),
    linear-gradient(180deg, #240f0c, #170807);
}
.q5k-trust__icon { color: var(--q5k-gold-mid); flex: 0 0 auto; display: inline-flex; }
.q5k-trust__text { display: flex; flex-direction: column; line-height: 1.15; }
.q5k-trust__text strong {
  font-family: var(--font-display);
  font-size: .95rem;
  letter-spacing: .04em;
  color: var(--q5k-gold-light);
}
.q5k-trust__text span { font-size: .74rem; color: var(--q5k-text-muted); letter-spacing: .03em; }

/* ── Live withdraw / jackpot ticker ── */
.q5k-jackpot {
  position: fixed;
  left: 16px;
  bottom: 20px;
  z-index: 60;
  display: flex;
  align-items: center;
  gap: .6rem;
  max-width: 300px;
  padding: .6rem .85rem .6rem .7rem;
  border-radius: 12px;
  border: 1px solid var(--q5k-border-strong);
  background: linear-gradient(135deg, #2c100c 0%, #160504 100%);
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.5), 0 0 0 1px rgba(0, 0, 0, 0.25);
  color: var(--q5k-text);
  opacity: 0;
  transform: translateY(14px) scale(.98);
  transition: opacity .5s ease, transform .5s cubic-bezier(.22, 1, .36, 1);
  pointer-events: none;
}
.q5k-jackpot.is-visible { opacity: 1; transform: translateY(0) scale(1); }
.q5k-jackpot__icon {
  flex: 0 0 auto;
  display: grid;
  place-items: center;
  width: 38px;
  height: 38px;
  border-radius: 10px;
  color: #1a1200;
  background: var(--q5k-gold-grad);
}
.q5k-jackpot__body { display: flex; flex-direction: column; line-height: 1.2; min-width: 0; }
.q5k-jackpot__name {
  font-family: var(--font-display);
  font-size: .92rem;
  letter-spacing: .04em;
  color: var(--q5k-gold-light);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.q5k-jackpot__meta { font-size: .74rem; color: var(--q5k-text-muted); }
.q5k-jackpot__amt { color: #2fd06a; }
@media (prefers-reduced-motion: reduce) {
  .q5k-jackpot { transition: opacity .3s ease; transform: none; }
  .q5k-jackpot.is-visible { transform: none; }
}
@media (max-width: 640px) {
  .q5k-trust { grid-template-columns: repeat(2, 1fr); }
  .q5k-jackpot { display: none; }
}

/* ── Provider logos ── */
.q5k-providers { padding: .25rem 0 1.25rem; }
.q5k-providers__img {
  display: block;
  width: 100%;
  height: auto;
  margin: 0;
  padding: 1.1rem 1.3rem;
  border: 1px solid var(--q5k-border);
  border-radius: 14px;
  background: linear-gradient(180deg, rgba(44, 16, 12, 0.55), rgba(20, 6, 5, 0.55));
  opacity: .92;
}

/* ── Promo ── */
.q5k-promo { padding: .25rem 0 1.5rem; }
.q5k-promo__strip {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: .75rem;
}
.q5k-promo__card {
  position: relative;
  padding: 1.1rem 1rem;
  background: #2a0e0b;
  border: 1px solid var(--q5k-border);
  border-radius: var(--q5k-radius);
}
.q5k-promo__tag {
  display: inline-block;
  margin-bottom: .45rem;
  padding: .15rem .5rem;
  border-radius: 4px;
  background: var(--q5k-gold-grad);
  color: #1a1200;
  font-size: .65rem;
  font-weight: 800;
  letter-spacing: .08em;
}
.q5k-promo__card h3 {
  margin: 0 0 .4rem;
  font-family: var(--font-display);
  font-size: 1.15rem;
  letter-spacing: .05em;
  color: var(--q5k-gold-light);
}
.q5k-promo__card p {
  margin: 0 0 .7rem;
  font-size: .84rem;
  color: var(--q5k-text-muted);
}
.q5k-promo__link {
  font-size: .82rem;
  font-weight: 700;
  text-decoration: none;
}

/* ── Event ── */
.q5k-event { padding: 0 0 2rem; }
.q5k-event__banner {
  padding: 1.35rem 1.25rem;
  border-radius: var(--q5k-radius);
  border: 1px solid var(--q5k-border);
  background:
    radial-gradient(ellipse at 80% 20%, rgba(212,170,62,.16), transparent 55%),
    linear-gradient(135deg, #151515, #0b0b0b);
}
.q5k-event__eyebrow {
  margin: 0 0 .35rem;
  font-size: .72rem;
  font-weight: 800;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--q5k-gold-mid);
}
.q5k-event__copy h3 {
  margin: 0 0 .45rem;
  font-family: var(--font-display);
  font-size: 1.55rem;
  letter-spacing: .06em;
  color: var(--q5k-gold-light);
}
.q5k-event__copy p {
  margin: 0 0 1rem;
  color: var(--q5k-text-muted);
  max-width: 52ch;
}

/* ── SEO article ── */
.q5k-seo { padding: 1rem 0 3rem; }
.q5k-article {
  padding: 1.5rem 1.25rem 1.75rem;
  background: #1f0807;
  border: 1px solid rgba(212, 170, 62, 0.18);
  border-radius: var(--q5k-radius);
}
.q5k-article__h1,
.q5k-article h2,
.q5k-article h3 {
  font-family: var(--font-display);
  letter-spacing: .05em;
  color: var(--q5k-gold-light);
  line-height: 1.2;
}
.q5k-article__h1 {
  margin: 0 0 1.1rem;
  font-size: clamp(1.45rem, 4vw, 2rem);
}
.q5k-article h2 {
  margin: 1.6rem 0 .7rem;
  font-size: 1.35rem;
}
.q5k-article h3 {
  margin: 1.2rem 0 .55rem;
  font-size: 1.15rem;
}
.q5k-article p {
  margin: 0 0 .9rem;
  color: #d5d0c2;
}
.q5k-article__closing { margin-top: 1.5rem; }
.q5k-table-wrap {
  overflow-x: auto;
  margin: .75rem 0 1.1rem;
  border-radius: 8px;
  border: 1px solid rgba(212, 170, 62, 0.18);
}
.q5k-table {
  width: 100%;
  border-collapse: collapse;
  font-size: .84rem;
}
.q5k-table th,
.q5k-table td {
  padding: .65rem .7rem;
  border-bottom: 1px solid rgba(255,255,255,.06);
  text-align: left;
  vertical-align: top;
}
.q5k-table th {
  background: #38140f;
  color: var(--q5k-gold-light);
  font-weight: 700;
}
.q5k-table td { color: #cfc8b8; }
.q5k-steps {
  margin: .5rem 0 1rem;
  padding-left: 1.2rem;
  color: #d5d0c2;
}
.q5k-steps li { margin-bottom: .45rem; }
.q5k-faq__item {
  border: 1px solid rgba(212, 170, 62, 0.2);
  border-radius: 8px;
  margin-bottom: .55rem;
  background: #2a0e0b;
  padding: 0 .85rem;
}
.q5k-faq__item summary {
  cursor: pointer;
  padding: .85rem 0;
  font-weight: 700;
  color: var(--q5k-gold-light);
}
.q5k-faq__item p {
  margin: 0 0 .9rem;
  color: var(--q5k-text-muted);
}
.q5k-article ul:not(.q5k-steps):not(.q5k-review__stars) {
  margin: .5rem 0 1rem;
  padding-left: 1.2rem;
  color: #d5d0c2;
}
.q5k-article ul li { margin-bottom: .4rem; }
.q5k-article a { color: var(--q5k-gold-light); }
.q5k-lead {
  font-size: 1.05rem;
  color: #e6e0d0 !important;
}

/* ── Promo banner gallery (Promosi page) ── */
.q5k-promogrid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: .9rem;
  margin: 1rem 0 1.5rem;
}
.q5k-promogrid figure {
  margin: 0;
  background: #2a0e0b;
  border: 1px solid rgba(212, 170, 62, 0.22);
  border-radius: 12px;
  overflow: hidden;
}
.q5k-promogrid img {
  width: 100%;
  height: auto;
  display: block;
  aspect-ratio: 1024 / 400;
  object-fit: cover;
  background: #1f0807;
}
.q5k-promogrid figcaption {
  padding: .6rem .8rem .85rem;
  font-size: .85rem;
  color: #cfc8b8;
  line-height: 1.45;
}
.q5k-promogrid figcaption strong {
  display: block;
  color: var(--q5k-gold-light);
  font-size: .95rem;
  margin-bottom: .2rem;
}
@media (max-width: 640px) {
  .q5k-promogrid { grid-template-columns: 1fr; gap: .75rem; }
}

/* ── Byline / author / reviews ── */
.q5k-meta {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem .9rem;
  align-items: center;
  margin: 0 0 1.2rem;
  padding-bottom: 1rem;
  border-bottom: 1px solid rgba(212, 170, 62, 0.18);
  font-size: .82rem;
  color: var(--q5k-text-muted);
}
.q5k-meta strong { color: var(--q5k-gold-light); font-weight: 700; }
.q5k-author {
  display: flex;
  gap: .9rem;
  align-items: flex-start;
  margin: 1.75rem 0 .5rem;
  padding: 1rem 1.1rem;
  background: #2a0e0b;
  border: 1px solid rgba(212, 170, 62, 0.22);
  border-radius: 10px;
}
.q5k-author__avatar {
  flex: 0 0 auto;
  width: 56px;
  height: 56px;
  border-radius: 50%;
  object-fit: cover;
  border: 2px solid rgba(212, 170, 62, 0.4);
  background: #1f0807;
}
.q5k-author__name { margin: 0; font-size: 1.05rem; color: var(--q5k-gold-light); font-weight: 700; }
.q5k-author__role { margin: .1rem 0 .4rem; font-size: .82rem; color: var(--q5k-gold); }
.q5k-author__bio { margin: 0; font-size: .88rem; color: #cfc8b8; }
.q5k-reviews {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
  gap: .75rem;
  margin: .75rem 0 1.1rem;
}
.q5k-review {
  padding: .85rem .95rem;
  background: #2a0e0b;
  border: 1px solid rgba(212, 170, 62, 0.18);
  border-radius: 10px;
}
.q5k-review__stars { color: #f0c14b; letter-spacing: .1em; font-size: .85rem; margin-bottom: .35rem; }
.q5k-review p { margin: 0 0 .5rem; font-size: .88rem; color: #cfc8b8; }
.q5k-review__name { font-size: .8rem; color: var(--q5k-gold-light); font-weight: 700; }
.q5k-related {
  margin: 1.5rem 0 .5rem;
  padding: 1rem 1.1rem;
  background: #2a0e0b;
  border: 1px solid rgba(212, 170, 62, 0.22);
  border-radius: 10px;
}
.q5k-related h2 { margin: 0 0 .6rem; font-size: 1.05rem; }
.q5k-related ul { margin: 0; padding-left: 1.1rem; }
.q5k-related li { margin-bottom: .35rem; }
.q5k-related a { color: var(--q5k-gold-light); text-decoration: none; }
.q5k-related a:hover { text-decoration: underline; }

/* ── Footer ── */
.q5k-footer {
  border-top: 1px solid var(--q5k-border);
  background: #120404;
  padding: 1.75rem 0 1.25rem;
}
.q5k-footer__partners {
  width: var(--q5k-shell);
  margin: 0 auto 1.5rem;
}
.q5k-footer__partners-title {
  margin: 0 0 .7rem;
  font-family: var(--font-display);
  letter-spacing: .08em;
  color: var(--q5k-gold-light);
  font-size: 1.1rem;
}
.q5k-footer__partners-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: .4rem;
}
.q5k-footer__partners-list li {
  padding: .3rem .65rem;
  border-radius: 999px;
  border: 1px solid rgba(212, 170, 62, 0.22);
  font-size: .72rem;
  color: var(--q5k-text-muted);
}
.q5k-footer__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1.25rem;
  margin-bottom: 1.5rem;
}
.q5k-footer h3 {
  margin: 0 0 .55rem;
  font-family: var(--font-display);
  letter-spacing: .06em;
  color: var(--q5k-gold-light);
  font-size: 1.05rem;
}
.q5k-footer ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
.q5k-footer li { margin-bottom: .35rem; }
.q5k-footer a { text-decoration: none; color: var(--q5k-text-muted); font-size: .88rem; }
.q5k-footer a:hover { color: var(--q5k-gold-light); }
.q5k-footer p { color: var(--q5k-text-muted); font-size: .86rem; margin: 0; }
.q5k-footer__hours { margin-top: .7rem !important; font-size: .78rem !important; }
.q5k-footer__bottom {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding-top: 1rem;
  border-top: 1px solid rgba(255,255,255,.06);
}
.q5k-footer__bottom img { height: 32px; width: auto; }
.q5k-footer__bottom p { font-size: .78rem; }

/* ── Float rails ── */
.q5k-float {
  position: fixed;
  top: 42%;
  z-index: 9500;
  display: flex;
  align-items: center;
  gap: 0;
  transition: transform .3s var(--q5k-ease);
}
.q5k-float--left { left: 0; }
.q5k-float--right { right: 0; }
.q5k-float__panel {
  display: flex;
  flex-direction: column;
  gap: .5rem;
  padding: .6rem;
  background: rgba(14, 14, 14, 0.94);
  border: 1px solid var(--q5k-border);
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.45);
}
.q5k-float--left .q5k-float__panel {
  border-left: 0;
  border-radius: 0 10px 10px 0;
}
.q5k-float--right .q5k-float__panel {
  border-right: 0;
  border-radius: 10px 0 0 10px;
}
.q5k-float__btn {
  width: 54px;
  height: 54px;
  display: grid;
  place-items: center;
  border-radius: 10px;
  color: #fff;
  text-decoration: none;
}
.q5k-float__btn svg { width: 26px; height: 26px; }
.q5k-float__btn--tg { background: #229ED9; }
.q5k-float__btn--wa { background: #25D366; }
.q5k-float__btn--lc { background: #d4aa3e; color: #1a1200; }
.q5k-float__toggle {
  width: 26px;
  height: 54px;
  border: 1px solid var(--q5k-border);
  background: #2a0e0b;
  color: var(--q5k-gold-light);
  cursor: pointer;
  padding: 0;
  font-size: 1.05rem;
}
.q5k-float--left .q5k-float__toggle { border-left: 0; border-radius: 0 6px 6px 0; }
.q5k-float--right .q5k-float__toggle { border-right: 0; border-radius: 6px 0 0 6px; }
.q5k-float--left.is-collapsed { transform: translateX(calc(-100% + 26px)); }
.q5k-float--right.is-collapsed { transform: translateX(calc(100% - 26px)); }
.q5k-float__apk {
  display: grid;
  gap: .35rem;
  justify-items: center;
  text-decoration: none;
  color: var(--q5k-gold-light);
  padding: .25rem;
}
.q5k-float__apk-label {
  font-family: var(--font-display);
  font-size: .95rem;
  letter-spacing: .08em;
}
.q5k-float__apk-qr {
  width: 128px;
  height: 128px;
  border-radius: 8px;
  background: #fff;
  padding: 4px;
}
.q5k-float__apk-hint {
  font-size: .72rem;
  color: var(--q5k-text-muted);
}

/* ── Mobile dock (dana4d-like) ── */
.q5k-dock {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 9600;
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  height: var(--q5k-dock-h);
  background: linear-gradient(180deg, rgba(42, 12, 10, 0.98), rgba(20, 6, 5, 0.98));
  border-top: 1px solid var(--q5k-border-strong);
  backdrop-filter: blur(10px);
  padding-bottom: env(safe-area-inset-bottom);
}
.q5k-dock__item {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: .15rem;
  text-decoration: none;
  color: #bdb6a6;
  font-size: .62rem;
  font-weight: 700;
  letter-spacing: .03em;
}
.q5k-dock__item:hover,
.q5k-dock__item--home {
  color: var(--q5k-gold-light);
}

/* ── Responsive ── */
@media (max-width: 900px) {
  .q5k-hub__grid { grid-template-columns: repeat(2, 1fr); }
  .q5k-promo__strip { grid-template-columns: repeat(2, 1fr); }
  .q5k-footer__grid { grid-template-columns: repeat(2, 1fr); }
  .q5k-togel__grid { grid-template-columns: repeat(5, 1fr); }
  .q5k-togel__reveal:hover .q5k-togel__grid,
  .q5k-togel__reveal.is-open .q5k-togel__grid { max-height: 560px; }
  .q5k-cats__track { justify-content: flex-start; overflow-x: auto; }
  .q5k-cats__cell { flex: 0 0 auto; }
  .q5k-mega { display: none; }
  .q5k-match { flex-basis: calc((100% - .8rem) / 2); }
}

/* ── Mobile stacked order: logo → marquee → banner → menu → auth → Desktop|Wap ── */
@media (max-width: 979px) {
  body.q5k-skin { display: flex; flex-direction: column; min-height: 100vh; }
  .skip-link { order: 0; }
  .q5k-header { order: 1; }
  .q5k-broadcast { order: 2; }
  .q5k-banners { order: 3; }
  .q5k-cats { order: 4; }
  .q5k-login-mobile { order: 5; }
  #main-content { order: 6; }
  .q5k-footer { order: 7; }

  .q5k-header__logo-m { display: flex; justify-content: center; padding: .55rem 0; }
  .q5k-header__logo-m img { height: 40px; width: auto; }
  .q5k-header__top { display: none; }
  .q5k-cats__logo { display: none; }
  .q5k-login-mobile { display: block; }

  /* Mobile auth: remove form fields, stack full-width colored buttons */
  .q5k-login--mobile label,
  .q5k-login--mobile .q5k-login__input,
  .q5k-login--mobile .q5k-login__cap-row { display: none; }
  .q5k-login--mobile {
    padding: 0;
    gap: 0;
    background: none;
    border: 0;
  }
  .q5k-login__actions {
    grid-template-columns: 1fr;
    gap: .6rem;
  }
  .q5k-login__actions .q5k-btn {
    padding: .82rem 1rem;
    border-radius: 9px;
    font-family: var(--font-display);
    font-weight: 700;
    letter-spacing: .04em;
  }
  .q5k-login--mobile .q5k-btn--gold {
    background: linear-gradient(180deg, #e5493f 0%, #c22d28 100%);
    color: #fff;
    border: 0;
    box-shadow: 0 6px 16px rgba(197, 45, 42, 0.35);
  }
  .q5k-login--mobile .q5k-btn--outline {
    background: linear-gradient(180deg, #29a9e4 0%, #1c86c4 100%);
    color: #fff;
    border: 0;
    box-shadow: 0 6px 16px rgba(28, 134, 196, 0.35);
  }
  .q5k-float--right { display: none; }
  .q5k-pay__wrap { grid-template-columns: minmax(0, 240px) 1fr; gap: 1rem; }
  .q5k-pay__grid { grid-template-columns: repeat(3, 1fr); }
}

@media (max-width: 640px) {
  .q5k-header__meta { display: none; }
  .q5k-cats__track { justify-content: flex-start; gap: .15rem; padding: .35rem .4rem .4rem; overflow-x: auto; }
  .q5k-cats__logo { padding-right: .5rem; margin-right: .2rem; }
  .q5k-cats__cell { flex: 0 0 auto; min-width: 56px; }
  .q5k-cats__item { min-width: 56px; padding: .35rem .35rem; }
  .q5k-cats__icon { width: 26px; height: 26px; }
  .q5k-cats__icon svg { width: 16px; height: 16px; }
  .q5k-cats__label { font-size: .66rem; letter-spacing: .03em; }
  .q5k-togel__grid { grid-template-columns: repeat(4, 1fr); gap: .4rem; }
  .q5k-togel__reveal:hover .q5k-togel__grid,
  .q5k-togel__reveal.is-open .q5k-togel__grid { max-height: 700px; }
  .q5k-result { min-height: 100px; }
  .q5k-result__code { font-size: 1.35rem; }
  .q5k-match { flex-basis: 100%; }
  .q5k-pay__wrap { grid-template-columns: 1fr; gap: 1rem; padding: 1rem; }
  .q5k-pay__figure { max-width: 300px; margin: 0 auto; }
  .q5k-pay__grid { grid-template-columns: repeat(2, 1fr); }
  .q5k-kupon__panel { flex-direction: column; gap: .8rem; padding: 1rem; text-align: center; }
  .q5k-kupon__right { flex-direction: column; gap: .1rem; }
  .q5k-tgbet__panel { flex-direction: column; text-align: center; gap: .75rem; }
  .q5k-promo__strip { grid-template-columns: 1fr; }
  .q5k-footer__grid { grid-template-columns: 1fr; }
  .q5k-float--left { top: auto; bottom: calc(var(--q5k-dock-h) + 16px); }
}

@media (min-width: 901px) {
  body.q5k-skin { padding-bottom: 1.5rem; }
  .q5k-dock { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  .q5k-broadcast__track,
  .q5k-providers__rail { animation: none; }
}

/* ── Login/Daftar click notice ── */
.q5k-notice {
  position: fixed;
  inset: 0;
  z-index: 30000;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1.2rem;
}
.q5k-notice[hidden] { display: none; }
.q5k-notice__backdrop {
  position: absolute;
  inset: 0;
  background: transparent;
}
.q5k-notice__box {
  position: relative;
  width: min(88vw, 400px);
  background: transparent;
  border: 0;
  padding: 0;
  box-shadow: none;
  animation: q5kNoticeIn 0.28s cubic-bezier(0.2, 0.8, 0.2, 1);
}
@keyframes q5kNoticeIn {
  from { opacity: 0; transform: translateY(14px) scale(0.96); }
  to { opacity: 1; transform: none; }
}
.q5k-notice__img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 16px;
  /* Crop the black strips baked into the source image (top ~2.3%, bottom ~0.8%, right ~0.9%) */
  -webkit-clip-path: inset(2.6% 1.1% 1% 0.3% round 14px);
  clip-path: inset(2.6% 1.1% 1% 0.3% round 14px);
}
.q5k-notice__close {
  position: absolute;
  top: 8px;
  right: 8px;
  width: 44px;
  height: 44px;
  border: 0;
  border-radius: 50%;
  background: transparent;
  color: transparent;
  font-size: 1.6rem;
  line-height: 1;
  cursor: pointer;
  z-index: 2;
  padding: 0;
}

/* ── Click notification: "please Daftar & Login" prompt (text, separate from entry pop-up) ── */
.q5k-cta {
  position: fixed;
  inset: 0;
  z-index: 30001;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1.2rem;
}
.q5k-cta[hidden] { display: none; }
.q5k-cta__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(4, 2, 2, 0.72);
  -webkit-backdrop-filter: blur(2px);
  backdrop-filter: blur(2px);
}
.q5k-cta__box {
  position: relative;
  width: min(88vw, 360px);
  background: linear-gradient(160deg, #2a0d0b, #140605);
  border: 1px solid rgba(212, 170, 62, 0.4);
  border-radius: 16px;
  padding: 1.7rem 1.4rem 1.4rem;
  text-align: center;
  box-shadow: 0 24px 60px rgba(0, 0, 0, 0.6);
  animation: q5kNoticeIn 0.28s cubic-bezier(0.2, 0.8, 0.2, 1);
}
.q5k-cta__close {
  position: absolute;
  top: 8px;
  right: 10px;
  width: 34px;
  height: 34px;
  border: 0;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.08);
  color: #f3d98b;
  font-size: 1.4rem;
  line-height: 1;
  cursor: pointer;
  padding: 0;
}
.q5k-cta__logo {
  font-family: var(--font-display, "Segoe UI", sans-serif);
  font-weight: 800;
  letter-spacing: 0.14em;
  color: #e9c766;
  font-size: 1.35rem;
  margin-bottom: 0.55rem;
}
.q5k-cta__msg {
  color: #f5e9d0;
  font-size: 1rem;
  line-height: 1.55;
  margin: 0 0 1.1rem;
}
.q5k-cta__actions {
  display: flex;
  gap: 0.6rem;
  justify-content: center;
}
.q5k-cta__btn {
  flex: 1;
  padding: 0.72rem 0;
  border-radius: 10px;
  font-weight: 700;
  font-size: 0.95rem;
  text-decoration: none;
  letter-spacing: 0.02em;
}
.q5k-cta__btn--daftar {
  background: linear-gradient(180deg, #f2d270, #c99a2e);
  color: #2a0d0b;
}
.q5k-cta__btn--login {
  background: rgba(255, 255, 255, 0.1);
  color: #f3d98b;
  border: 1px solid rgba(212, 170, 62, 0.4);
}

/* ── Imlek / CNY festive overlay (pure CSS, non-interactive) ── */
.q5k-imlek {
  position: fixed;
  inset: 0;
  z-index: 50;
  pointer-events: none;
  overflow: hidden;
}
.q5k-imlek__hang {
  position: absolute;
  top: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  transform-origin: top center;
  animation: q5kSway 3.6s ease-in-out infinite;
  will-change: transform;
}
.q5k-imlek__hang--l { left: 2.5%; }
.q5k-imlek__hang--r { right: 2.5%; animation-delay: -1.8s; }
.q5k-imlek__cord {
  width: 2px;
  height: 46px;
  background: linear-gradient(#d4aa3e, rgba(212, 170, 62, 0.25));
}
.q5k-imlek__lantern {
  font-size: 2.1rem;
  line-height: 1;
  filter: drop-shadow(0 4px 10px rgba(210, 40, 40, 0.55));
}
.q5k-imlek__cracker {
  font-size: 1.35rem;
  margin-top: -4px;
  animation: q5kShake 1.8s ease-in-out infinite;
}
.q5k-imlek__float {
  position: absolute;
  top: 0;
  opacity: 0;
  animation-name: q5kFloatUp;
  animation-timing-function: linear;
  animation-iteration-count: infinite;
  will-change: transform, opacity;
  filter: drop-shadow(0 2px 6px rgba(0, 0, 0, 0.35));
}
@keyframes q5kSway {
  0%, 100% { transform: rotate(-7deg); }
  50% { transform: rotate(7deg); }
}
@keyframes q5kShake {
  0%, 100% { transform: translateY(0) rotate(-4deg); }
  50% { transform: translateY(-2px) rotate(4deg); }
}
@keyframes q5kFloatUp {
  0% { transform: translateY(106vh) translateX(0) rotate(0deg); opacity: 0; }
  8% { opacity: 0.95; }
  88% { opacity: 0.95; }
  100% { transform: translateY(-14vh) translateX(26px) rotate(38deg); opacity: 0; }
}
@media (max-width: 640px) {
  .q5k-imlek__lantern { font-size: 1.6rem; }
  .q5k-imlek__float:nth-child(2n) { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  .q5k-imlek__hang,
  .q5k-imlek__cracker,
  .q5k-imlek__float { animation: none; }
  .q5k-imlek__float { display: none; }
}

/* ── Category page SEO intro copy ── */
.q5k-catintro {
  max-width: 960px;
  margin: 26px auto 10px;
  padding: 0 16px;
  line-height: 1.75;
}
.q5k-catintro h2 {
  font-size: 1.18rem;
  color: #f4d47a;
  margin: 0 0 12px;
}
.q5k-catintro p {
  margin: 0 0 14px;
  font-size: 0.98rem;
  color: #cfc7b2;
}
.q5k-catintro__links {
  margin-top: 10px;
  font-size: 0.9rem;
  color: #bdb59f;
}
.q5k-catintro__label { color: #f4d47a; font-weight: 600; }
.q5k-catintro__links a { color: #e8c977; text-decoration: none; }
.q5k-catintro__links a:hover { text-decoration: underline; }
@media (max-width: 768px) {
  .q5k-catintro { margin: 16px auto; }
  .q5k-catintro h2 { font-size: 1.06rem; }
}

/* ══════════════ Blog: listing, article, byline, author, reviews, FAQ ══════════════ */
.q5k-blog { max-width: 1040px; margin: 0 auto; padding: 24px 16px 48px; }
.q5k-blog__head { text-align: center; margin-bottom: 22px; }
.q5k-blog__eyebrow {
  margin: 0 0 8px;
  font-size: 0.78rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: rgba(244, 212, 122, 0.75);
}
.q5k-blog__title { font-size: 1.7rem; color: #f4d47a; margin: 0 0 10px; }
.q5k-blog__intro { color: #cfc7b2; max-width: 680px; margin: 0 auto; line-height: 1.7; font-size: 0.98rem; }
.q5k-blog__banner { margin: 0 0 28px; }
.q5k-blog__section-title {
  font-family: var(--font-display, "Bebas Neue", Impact, sans-serif);
  font-size: clamp(1.2rem, 3vw, 1.55rem);
  color: #f4d47a;
  margin: 8px 0 16px;
  letter-spacing: 0.04em;
}
.q5k-card__tag {
  display: inline-block;
  margin-bottom: 6px;
  font-size: 0.72rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: rgba(244, 212, 122, 0.85);
}
.q5k-blog__seo { margin-top: 2.5rem; }
.q5k-blog__grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  gap: 20px;
}
.q5k-card {
  background: linear-gradient(180deg, #1c1710, #14100b);
  border: 1px solid #3a2f18;
  border-radius: 14px;
  overflow: hidden;
  transition: transform 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease;
}
.q5k-card:hover { transform: translateY(-3px); border-color: #a97f2e; box-shadow: 0 12px 28px rgba(0, 0, 0, 0.4); }
.q5k-card__link { display: block; color: inherit; text-decoration: none; }
.q5k-card__thumb { margin: 0; aspect-ratio: 16 / 9; overflow: hidden; }
.q5k-card__thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.q5k-card__body { padding: 16px 18px 20px; }
.q5k-card__title { font-size: 1.12rem; color: #f6e6bf; margin: 0 0 8px; line-height: 1.35; }
.q5k-card__meta { font-size: 0.8rem; color: #9c9482; display: flex; gap: 6px; margin-bottom: 10px; }
.q5k-card__excerpt { font-size: 0.92rem; color: #c4bca7; line-height: 1.6; margin: 0 0 12px; }
.q5k-card__more { font-size: 0.86rem; color: #e8c977; font-weight: 600; }

/* Breadcrumbs */
.q5k-crumbs { max-width: 820px; margin: 8px auto 4px; padding: 0 16px; font-size: 0.82rem; color: #9c9482; display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.q5k-crumbs a { color: #e8c977; text-decoration: none; }
.q5k-crumbs a:hover { text-decoration: underline; }
.q5k-crumbs__current { color: #cfc7b2; }

/* Single article */
.q5k-entry { max-width: 820px; margin: 0 auto; }
.q5k-entry__title { font-size: 1.7rem; line-height: 1.3; color: #f4d47a; margin: 6px 0 12px; }
.q5k-byline { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; font-size: 0.86rem; color: #a8a08b; margin-bottom: 18px; }
.q5k-byline strong { color: #e8c977; }
.q5k-byline__sep { opacity: 0.5; }
.q5k-entry__body { color: #d8d0bc; line-height: 1.8; font-size: 1rem; }
.q5k-entry__body h2 { font-size: 1.32rem; color: #f4d47a; margin: 30px 0 12px; }
.q5k-entry__body h3 { font-size: 1.1rem; color: #f0d79a; margin: 22px 0 10px; }
.q5k-entry__body p { margin: 0 0 16px; }
.q5k-entry__body ul, .q5k-entry__body ol { margin: 0 0 16px; padding-left: 22px; }
.q5k-entry__body li { margin-bottom: 8px; }
.q5k-entry__body a { color: #e8c977; text-decoration: underline; }
.q5k-entry__body img { max-width: 100%; height: auto; border-radius: 12px; margin: 10px 0 18px; }
.q5k-entry__body strong { color: #efe6cd; }
.q5k-entry__body blockquote { border-left: 3px solid #a97f2e; margin: 0 0 16px; padding: 6px 0 6px 16px; color: #cfc7b2; font-style: italic; }

/* Review box */
.q5k-reviews { background: #17120c; border: 1px solid #3a2f18; border-radius: 14px; padding: 18px 20px; margin: 24px 0; }
.q5k-reviews h3 { margin-top: 0; }
.q5k-review { border-top: 1px dashed #3a2f18; padding: 12px 0; }
.q5k-review:first-of-type { border-top: 0; }
.q5k-review__stars { color: #f4c948; letter-spacing: 2px; font-size: 0.9rem; }
.q5k-review__name { color: #e8c977; font-weight: 600; font-size: 0.9rem; }
.q5k-review__text { margin: 4px 0 0; font-size: 0.93rem; color: #c4bca7; }

/* FAQ */
.q5k-faq { margin: 26px 0 8px; }
.q5k-faq h2 { margin-bottom: 12px; }
.q5k-faq__item { border: 1px solid #3a2f18; border-radius: 10px; margin-bottom: 10px; overflow: hidden; background: #17120c; }
.q5k-faq__item summary { cursor: pointer; padding: 14px 16px; font-weight: 600; color: #f0d79a; list-style: none; position: relative; }
.q5k-faq__item summary::-webkit-details-marker { display: none; }
.q5k-faq__item summary::after { content: "+"; position: absolute; right: 16px; color: #a97f2e; font-size: 1.2rem; }
.q5k-faq__item[open] summary::after { content: "−"; }
.q5k-faq__item p { padding: 0 16px 14px; margin: 0; color: #c4bca7; line-height: 1.7; font-size: 0.94rem; }

/* Author box */
.q5k-authorbox { display: flex; gap: 14px; align-items: flex-start; background: #17120c; border: 1px solid #3a2f18; border-radius: 14px; padding: 18px 20px; margin: 28px 0 8px; }
.q5k-authorbox__avatar { flex: 0 0 auto; width: 52px; height: 52px; border-radius: 50%; background: linear-gradient(135deg, #d4af37, #8a5a12); color: #1a1206; font-weight: 800; font-size: 1.5rem; display: grid; place-items: center; }
.q5k-authorbox__label { font-size: 0.75rem; text-transform: uppercase; letter-spacing: 0.08em; color: #9c9482; }
.q5k-authorbox__name { display: block; color: #f4d47a; font-size: 1.05rem; margin: 2px 0 6px; }
.q5k-authorbox__bio { margin: 0; color: #c4bca7; font-size: 0.9rem; line-height: 1.65; }

/* Related links inside articles */
.q5k-related { background: #17120c; border: 1px solid #3a2f18; border-radius: 14px; padding: 16px 20px; margin: 22px 0; }
.q5k-related strong { color: #f4d47a; display: block; margin-bottom: 8px; }
.q5k-related a { color: #e8c977; }

/* Pagination */
.q5k-pagination, .pagination { display: flex; justify-content: center; gap: 8px; margin-top: 28px; }
.q5k-pagination .page-numbers, .pagination .page-numbers { padding: 8px 13px; border: 1px solid #3a2f18; border-radius: 8px; color: #e8c977; text-decoration: none; font-size: 0.9rem; }
.q5k-pagination .current { background: #a97f2e; color: #1a1206; border-color: #a97f2e; }

@media (max-width: 768px) {
  .q5k-entry__title, .q5k-blog__title { font-size: 1.32rem; }
  .q5k-entry__body { font-size: 0.97rem; }
  .q5k-blog__grid { grid-template-columns: 1fr; }
}


/* ── Welcome APK popup ── */
.qsm-welcome[hidden] { display: none !important; }
.qsm-welcome {
  position: fixed;
  inset: 0;
  z-index: 13000;
  display: grid;
  place-items: center;
  padding: 1rem;
}
.qsm-welcome__backdrop {
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse 70% 55% at 50% 45%, rgba(120, 0, 0, 0.45) 0%, transparent 70%),
    rgba(0, 0, 0, 0.72);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
}
.qsm-welcome__box {
  position: relative;
  z-index: 1;
  width: min(100%, 640px);
  padding: 0.35rem 0.25rem 0.35rem;
  background: transparent;
  border: 0;
  text-align: center;
  animation: qsm-welcome-in 0.45s cubic-bezier(0.22, 1, 0.36, 1);
}
.qsm-welcome__close {
  position: absolute;
  top: 6px;
  right: 10px;
  z-index: 5;
  width: 44px;
  height: 44px;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: transparent;
  color: transparent;
  font-size: 0;
  cursor: pointer;
}
.qsm-welcome__link {
  position: relative;
  display: block;
  text-decoration: none !important;
  animation: qsm-welcome-float 3.6s ease-in-out infinite;
  filter:
    drop-shadow(0 18px 28px rgba(0, 0, 0, 0.65))
    drop-shadow(0 0 22px rgba(255, 50, 20, 0.45));
}
.qsm-welcome__img {
  width: 100%;
  height: auto;
  display: block;
  background: transparent;
  animation: qsm-welcome-sway 5.2s ease-in-out infinite;
  transform-origin: 50% 60%;
}
@keyframes qsm-welcome-in {
  from { opacity: 0; transform: scale(0.86) translateY(28px); }
  to { opacity: 1; transform: scale(1) translateY(0); }
}
@keyframes qsm-welcome-float {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-10px); }
}
@keyframes qsm-welcome-sway {
  0%, 100% { transform: rotate(-1.2deg) scale(1); }
  50% { transform: rotate(1.2deg) scale(1.015); }
}
@media (max-width: 480px) {
  .qsm-welcome { padding: 0.45rem; }
  .qsm-welcome__box { width: min(100%, 420px); }
  .qsm-welcome__close { top: 4px; right: 6px; width: 40px; height: 40px; }
}
@media (prefers-reduced-motion: reduce) {
  .qsm-welcome__box,
  .qsm-welcome__link,
  .qsm-welcome__img { animation: none !important; }
}

/* Article banner on kategori / info pages */
.q5k-article__banner {
  margin: 0 0 1.25rem;
  border-radius: 14px;
  overflow: hidden;
  border: 1px solid rgba(212, 170, 62, 0.28);
}
.q5k-article__banner img {
  display: block;
  width: 100%;
  height: auto;
}
.q5k-seo--cat {
  margin-top: 1.75rem;
  padding-top: 0.5rem;
}
@media (max-width: 768px) {
  .q5k-article__banner { border-radius: 10px; }
}