.jg-masthead {
  position: sticky; top: 0; z-index: 100;
  background: rgba(253, 243, 234, 0.94);
  backdrop-filter: saturate(1.2) blur(10px);
  border-bottom: 2px solid rgba(143, 109, 165, 0.1);
}
.jg-masthead__row { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding-block: clamp(8px, .85vw, 16px); }
.jg-brand { display: inline-flex; flex: 0 0 auto; align-items: center; }
.jg-brand img { width: clamp(120px, 15vw, 180px); height: auto; aspect-ratio: 154 / 64; object-fit: contain; }
.jg-masthead__tools { display: flex; align-items: center; gap: clamp(10px, 1.25vw, 24px); }

.jg-nav { display: none; }
.jg-nav__list { list-style: none; display: flex; flex-wrap: wrap; gap: clamp(6px, 1vw, 22px); }
.jg-nav__link {
  display: inline-flex; align-items: center; min-height: 44px; padding: 0 6px;
  color: var(--jg-violet-strong); font-weight: 600; font-size: clamp(.95rem, .6rem + .45vw, 1.15rem);
  text-decoration: none; border-bottom: 2px solid transparent; transition: border-color .2s;
}
.jg-nav__link:hover, .jg-nav__link[aria-current="page"] { border-color: var(--jg-red); }

.jg-auth-btn {
  display: inline-flex; align-items: center; gap: 20px; min-height: 44px;
  padding: clamp(8px, .8vw, 16px) clamp(14px, 1.25vw, 24px);
  border-radius: 48px; border: 2px solid var(--jg-violet-strong);
  font-weight: 700; font-size: clamp(1rem, .7rem + .6vw, 1.5rem); line-height: 1.33;
  cursor: pointer; text-decoration: none; transition: background-color .2s, color .2s, transform .2s;
}
.jg-auth-btn--outline { background: transparent; color: var(--jg-violet-strong); }
.jg-auth-btn--outline:hover { background: rgba(99,66,171,.08); }
.jg-auth-btn--solid { background: var(--jg-violet-strong); color: #fff; }
.jg-auth-btn--solid:hover { background: var(--jg-violet-deep); }
.jg-auth-btn .jg-arrow { font-size: 1.3em; line-height: 1; }

.jg-wallet {
  display: none; align-items: center; gap: 10px; min-height: 44px; padding: 6px 16px 6px 8px;
  border-radius: var(--jg-pill); background: #fff; border: 2px solid var(--jg-border-soft);
  color: var(--jg-violet); font-weight: 700; font-size: clamp(.9rem, .8rem + .3vw, 1.1rem); white-space: nowrap;
}
.jg-wallet__coin {
  width: 30px; height: 30px; border-radius: 50%; display: grid; place-items: center;
  background: radial-gradient(circle at 35% 30%, #fff3b0, var(--jg-gold) 55%, #e8a92a); color: #8a5a00; font-size: .8rem; font-weight: 800;
}
.jg-user-menu { position: relative; display: none; }
.jg-user-menu__toggle { display: inline-flex; align-items: center; gap: 10px; }
.jg-user-menu__avatar {
  width: 32px; height: 32px; border-radius: 50%; background: var(--jg-grad-sky); color: var(--jg-violet-deep);
  display: grid; place-items: center; font-weight: 800; font-size: .95rem;
}
.jg-user-menu__panel {
  position: absolute; right: 0; top: calc(100% + 10px); min-width: 240px; padding: 10px;
  background: #fff; border-radius: 20px; box-shadow: var(--jg-shadow-lift); border: 1px solid var(--jg-border-soft);
}
.jg-user-menu__panel[hidden] { display: none; }
.jg-user-menu__panel p { padding: 8px 12px; font-size: .9rem; }
.jg-user-menu__item {
  display: flex; width: 100%; align-items: center; min-height: 44px; padding: 8px 12px; border: 0; background: none;
  border-radius: 12px; color: var(--jg-violet); font-weight: 600; text-decoration: none; cursor: pointer; text-align: left;
}
.jg-user-menu__item:hover { background: var(--jg-lilac); }

body.is-signed-in .jg-guest-only { display: none !important; }
body.is-signed-in .jg-wallet, body.is-signed-in .jg-user-menu { display: inline-flex; }

.jg-burger {
  display: inline-grid; place-items: center; width: 48px; height: 48px; border-radius: 50%;
  border: 2px solid var(--jg-violet-strong); background: #fff; cursor: pointer; padding: 0;
}
.jg-burger__bars, .jg-burger__bars::before, .jg-burger__bars::after {
  display: block; width: 20px; height: 2.5px; border-radius: 2px; background: var(--jg-violet-strong);
  transition: transform .3s var(--jg-ease), opacity .2s; content: "";
}
.jg-burger__bars { position: relative; }
.jg-burger__bars::before { position: absolute; top: -7px; left: 0; }
.jg-burger__bars::after { position: absolute; top: 7px; left: 0; }
.jg-burger[aria-expanded="true"] .jg-burger__bars { background: transparent; }
.jg-burger[aria-expanded="true"] .jg-burger__bars::before { transform: translateY(7px) rotate(45deg); }
.jg-burger[aria-expanded="true"] .jg-burger__bars::after { transform: translateY(-7px) rotate(-45deg); }

.jg-drawer {
  position: fixed; inset: 0; z-index: 150; display: flex; justify-content: flex-end;
  background: rgba(59, 36, 110, 0.35); opacity: 0; visibility: hidden; transition: opacity .3s, visibility .3s;
}
.jg-drawer.is-open { opacity: 1; visibility: visible; }
.jg-drawer__panel {
  width: min(420px, 100%); height: 100%; overflow-y: auto; padding: 24px clamp(20px, 5vw, 36px) 36px;
  background: var(--jg-grad-sky); transform: translateX(100%); transition: transform .35s var(--jg-ease);
  display: flex; flex-direction: column; gap: 24px;
}
.jg-drawer.is-open .jg-drawer__panel { transform: none; }
.jg-drawer__top { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.jg-drawer__top img { width: clamp(120px, 40vw, 160px); height: auto; aspect-ratio: 154 / 64; object-fit: contain; }
.jg-drawer__close {
  width: 48px; height: 48px; border-radius: 50%; border: 0; background: #fff; color: var(--jg-violet);
  font-size: 1.6rem; cursor: pointer; box-shadow: var(--jg-shadow-card);
}
.jg-drawer__list { list-style: none; display: grid; gap: 6px; }
.jg-drawer__link {
  display: flex; align-items: center; justify-content: space-between; min-height: 56px; padding: 0 20px;
  border-radius: 18px; background: rgba(255,255,255,.72); color: var(--jg-violet); font-weight: 700; font-size: 1.15rem; text-decoration: none;
}
.jg-drawer__link:hover, .jg-drawer__link[aria-current="page"] { background: #fff; }
.jg-drawer__auth { display: grid; gap: 12px; margin-top: auto; }
body.jg-locked { overflow: hidden; }


@media (max-width: 599px) {
  .jg-masthead__tools .jg-auth-btn { display: none; }
  body.is-signed-in .jg-user-menu__label { display: none; }
}

/* ---------- Footer ---------- */
.jg-base { background: var(--jg-grad-sky); padding-block: clamp(56px, 5.2vw, 100px); }
.jg-base__inner { display: grid; gap: clamp(36px, 3.4vw, 64px); }
.jg-base__top { display: grid; grid-template-columns: minmax(0, 500px) minmax(0, 240px) minmax(0, 533px); justify-content: space-between; gap: 40px; }
.jg-base__brand { display: grid; gap: 28px; align-content: start; }
.jg-base__brand img { width: clamp(130px, 15vw, 190px); height: auto; aspect-ratio: 154 / 64; object-fit: contain; }
.jg-base__brand p { font-size: var(--jg-fs-lead); line-height: 1.6; color: var(--jg-muted); }
.jg-base__col { display: grid; gap: 24px; align-content: start; padding-top: 16px; }
.jg-base__col h2 { font-size: clamp(1.5rem, 1.1rem + 1vw, 2rem); font-weight: 700; letter-spacing: -0.02em; color: var(--jg-violet); }
.jg-base__links { list-style: none; display: grid; gap: 14px; }
.jg-base__links--split { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 14px; }
.jg-base__links a, .jg-base__links button {
  color: var(--jg-link); font-weight: 500; font-size: var(--jg-fs-lead); line-height: 1.5; text-decoration: none;
  background: none; border: 0; padding: 0; cursor: pointer; text-align: left; min-height: 30px;
}
.jg-base__links a:hover, .jg-base__links button:hover { color: var(--jg-violet); text-decoration: underline; }
.jg-base__care { display: flex; align-items: center; justify-content: space-between; gap: 32px; }
.jg-base__note { display: flex; gap: clamp(20px, 4.6vw, 88px); align-items: flex-start; padding-right: 32px; border-right: 1px solid var(--jg-violet); }
.jg-base__note img { width: 83px; height: 83px; flex: 0 0 auto; object-fit: contain; }
.jg-base__note h2 { font-size: clamp(1.1rem, .95rem + .45vw, 1.5rem); font-weight: 600; color: var(--jg-violet); letter-spacing: 0; line-height: 1.33; }
.jg-base__note p { font-size: var(--jg-fs-lead); line-height: 1.6; }
.jg-base__note a { color: var(--jg-violet); font-weight: 600; }
.jg-base__gamcare { flex: 0 0 auto; display: inline-flex; }
.jg-base__gamcare img { width: clamp(170px, 14.2vw, 273px); height: auto; aspect-ratio: 273 / 99; object-fit: contain; }
.jg-base__legal { display: grid; gap: 24px; }
.jg-base__legal hr { border: 0; height: 1px; background: var(--jg-line); margin: 0; }
.jg-base__legal p { font-size: var(--jg-fs-lead); }

[data-signed-only] { display: none !important; }
body.is-signed-in [data-signed-only] { display: inline-flex !important; }
