:root{--bg:#080812;--panel:#111126;--panel2:#171733;--text:#f6f2ff;--muted:#b8add7;--accent:#b78cff;--accent2:#6f4cff;--danger:#ff5b8a}*{box-sizing:border-box}body{margin:0;background:radial-gradient(circle at top,#20123f,#080812 45%);color:var(--text);font-family:Inter,Arial,sans-serif}a{color:inherit;text-decoration:none}.top{position:sticky;top:0;z-index:5;display:flex;justify-content:space-between;align-items:center;padding:16px 5%;background:rgba(8,8,18,.88);backdrop-filter:none !important;border-bottom:1px solid rgba(255,255,255,.08)}.brand{display:flex;gap:10px;align-items:center;font-size:22px}.moon,.bigmoon{filter:drop-shadow(0 0 18px #d9c2ff);animation:float 3s ease-in-out infinite}.bigmoon{font-size:86px}nav{display:flex;gap:10px;align-items:center;flex-wrap:wrap}nav a,button,.btn{display:inline-flex;align-items:center;justify-content:center;min-height:42px;min-width:118px;border:0;border-radius:12px;padding:10px 16px;background:linear-gradient(135deg,var(--accent2),var(--accent));color:white;font-weight:700;cursor:pointer}main{width:min(1180px,92%);margin:0 auto;padding:32px 0}.hero{min-height:420px;display:grid;place-items:center;text-align:center}.hero h1{font-size:56px;margin:8px 0}.hero p{color:var(--muted);font-size:18px}.actions{display:flex;justify-content:center;gap:12px;flex-wrap:wrap}.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:14px;margin:24px 0}.stats div,.card,.panel{background:linear-gradient(180deg,rgba(255,255,255,.07),rgba(255,255,255,.03));border:1px solid rgba(255,255,255,.10);border-radius:20px;padding:20px;box-shadow:0 12px 40px rgba(0,0,0,.25)}.stats b{display:block;color:var(--muted);font-size:12px}.stats span{display:block;font-size:24px;font-weight:900;margin-top:6px}.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:18px}.card h3{margin-top:0}.card p{color:var(--muted)}.narrow{max-width:480px;margin:50px auto}.full{width:100%;margin:8px 0}input,textarea,select{width:100%;min-height:44px;margin:8px 0;padding:12px;border-radius:12px;border:1px solid rgba(255,255,255,.12);background:#0c0c1c;color:white}textarea{min-height:120px}.adminnav{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:20px}.adminnav a{min-height:42px;min-width:130px;text-align:center;border-radius:12px;padding:12px;background:var(--panel2)}.slider{display:flex;gap:12px;overflow-x:auto}.slider img{max-height:260px;border-radius:18px}.comment{background:rgba(255,255,255,.05);border-radius:14px;padding:12px;margin:10px 0}.console{background:#020207;border:1px solid #31265a;border-radius:18px;padding:18px;min-height:360px;max-height:520px;overflow:auto;color:#b8ffce;font-family:monospace}.notice{padding:12px 16px;border-radius:12px;background:#17351d;margin-bottom:14px}.error{background:#3a1321}footer{text-align:center;color:var(--muted);padding:35px}@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}@media(max-width:760px){.top{align-items:flex-start;flex-direction:column}.hero h1{font-size:38px}nav a,button,.btn{width:100%}nav{width:100%}.adminnav a{width:100%}}

/* LuNa dashboard/comment fixes */
.back-btn{margin-bottom:24px}.spaced-back{margin-bottom:28px}.detail-panel{margin-top:8px}.category-intro{margin-bottom:18px}.event-card{display:block}.dashboard-top-actions{justify-content:flex-start;margin-bottom:20px}.dashboard-grid{align-items:stretch}.dashboard-card{display:block;min-height:150px}.dashboard-card h3{font-size:24px;margin-bottom:12px}.adminnav{margin-bottom:24px}.adminnav .btn{background:linear-gradient(135deg,var(--accent2),var(--accent));border-radius:14px}.comment{padding:18px;margin:18px 0}.comment-actions{display:flex;gap:12px;align-items:center;margin-top:14px}.comment-actions form{margin:0;flex:1}.comment-btn{width:100%;min-width:0}.danger{background:linear-gradient(135deg,#d92362,#ff5b8a)!important}.comment-edit-form{margin-top:14px}.comments-panel textarea{margin-top:18px}@media(max-width:760px){.comment-actions{display:grid;grid-template-columns:1fr 1fr}.dashboard-top-actions .btn{width:100%}.dashboard-card{min-height:130px}}


/* Dashboard/admin button consistency */
.dashboard-top-actions {
  margin: 24px 28px 24px;
  display: grid;
  gap: 14px;
}

.dashboard-top-actions .btn {
  width: 100%;
  text-align: center;
  justify-content: center;
}

.views-admin-learning .grid,
.admin-category-list {
  margin-top: 30px;
}


/* Force all Back/Home dashboard buttons to match User Dashboard button sizing */
.actions,
.dashboard-top-actions {
  display: grid;
  grid-template-columns: 1fr;
  gap: 14px;
  margin: 24px 28px;
}

.actions .btn,
.dashboard-top-actions .btn,
a.btn.back-btn,
.back-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 58px;
  padding: 16px 22px;
  border-radius: 18px;
  box-sizing: border-box;
  font-size: 18px;
  font-weight: 800;
  text-align: center;
  text-decoration: none;
}

.admin-page-top,
.page-top-actions {
  margin: 24px 28px;
  display: grid;
  grid-template-columns: 1fr;
  gap: 14px;
}

.admin-page-top .btn,
.page-top-actions .btn {
  width: 100%;
  min-height: 58px;
}


/* Spacing fix: stop event/comment/admin cards from touching each other */
.card + .card,
.panel + .panel,
.event-card + .event-card,
.events-list .card + .card,
.admin-events-list .card + .card,
.grid .card {
  margin-top: 24px;
}

.grid {
  gap: 24px;
}

.comments-panel {
  margin-top: 32px !important;
}

.admin-events-list,
.events-list {
  display: grid;
  gap: 24px;
}

.event-detail-card {
  margin-bottom: 32px;
}


.comment-actions{
  display:flex;
  gap:12px;
  margin-top:15px;
}
.comment-actions .btn{
  flex:1;
  width:50%;
  text-align:center;
}
.edit-btn,.delete-btn{
  min-height:58px;
}


/* Comment edit/delete equal sizing */
.comment-actions {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 12px !important;
  margin-top: 15px !important;
  width: 100% !important;
}

.comment-actions form,
.comment-actions a,
.comment-actions button,
.comment-actions .btn {
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  box-sizing: border-box !important;
}

.comment-actions .btn,
.comment-actions button {
  min-height: 58px !important;
  padding: 16px 12px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
}


/* Header gems display */
.top {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.top-gems {
  margin-left: auto;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 10px 16px;
  border-radius: 999px;
  background: rgba(124, 92, 255, 0.16);
  border: 1px solid rgba(182, 136, 255, 0.3);
  color: #fff;
  font-weight: 900;
}

/* Cosmetics Shop spacing */
.shop-actions {
  display: flex;
  flex-direction: column;
  gap: 16px;
  margin-top: 20px;
}

.shop-actions form,
.shop-actions .btn {
  width: 100%;
}

.shop-actions .btn {
  min-height: 58px;
}

/* Profile cosmetics */
.profile-panel {
  margin-bottom: 28px;
}


/* Role tags and admin/user feature polish */
.role-tags {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin: 8px 0 12px;
}

.role-tag {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid currentColor;
  border-radius: 999px;
  padding: 4px 10px;
  font-size: 12px;
  font-weight: 900;
  background: rgba(255,255,255,.04);
}

button:disabled,
.btn[disabled] {
  opacity: .65;
  cursor: not-allowed;
}

.shop-actions {
  display: flex;
  flex-direction: column;
  gap: 16px;
  margin-top: 20px;
}

.shop-actions .btn,
.shop-actions form,
.shop-actions form .btn {
  width: 100%;
}

.comment-actions {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 12px !important;
  width: 100% !important;
}

.comment-actions form,
.comment-actions .btn {
  width: 100% !important;
}


/* Cosmetic Effects */
.cosmetic-purple-border{
 border:2px solid #a970ff !important;
 box-shadow:0 0 18px rgba(169,112,255,.5);
}
.cosmetic-moon-glow{
 box-shadow:0 0 25px rgba(255,211,90,.45) !important;
}
.cosmetic-starlight-name{
 text-shadow:0 0 8px #fff,0 0 16px #a970ff;
}


/* Active cosmetic effects applied to comments, names, and profiles */
.cosmetic-purple-border {
  border: 2px solid #a970ff !important;
  box-shadow: 0 0 18px rgba(169,112,255,.55) !important;
}

.cosmetic-crystal-border {
  border: 2px solid #68e8ff !important;
  box-shadow: 0 0 20px rgba(104,232,255,.55) !important;
}

.cosmetic-moon-glow {
  box-shadow: 0 0 28px rgba(255,211,90,.5), 0 0 60px rgba(183,140,255,.2) !important;
}

.cosmetic-royal-frame {
  border: 2px solid #ffd35a !important;
  box-shadow: 0 0 22px rgba(255,211,90,.45) !important;
}

.cosmetic-shadow-moon {
  border: 2px solid #5d4bff !important;
  box-shadow: inset 0 0 30px rgba(0,0,0,.55), 0 0 22px rgba(93,75,255,.4) !important;
}

.cosmetic-nebula-bg {
  background:
    radial-gradient(circle at 20% 20%, rgba(183,140,255,.25), transparent 30%),
    radial-gradient(circle at 80% 10%, rgba(104,232,255,.16), transparent 28%),
    linear-gradient(180deg,rgba(255,255,255,.07),rgba(255,255,255,.03)) !important;
}

.cosmetic-starlight-name {
  text-shadow: 0 0 8px #fff, 0 0 16px #a970ff, 0 0 26px #ffd35a !important;
}


/* Profile Avatar */
.profile-avatar-wrap{
  text-align:center;
  margin-bottom:20px;
}

.profile-avatar-large{
  width:120px;
  height:120px;
  border-radius:50%;
  object-fit:cover;
  border:3px solid rgba(183,140,255,.8);
  box-shadow:0 0 20px rgba(183,140,255,.4);
}

.profile-avatar-placeholder{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size:48px;
  background:rgba(255,255,255,.05);
}


/* Gold Alliance Badge cosmetic */
.comment-name-line,
.profile-name-line {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

.gold-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 26px;
  height: 26px;
  border-radius: 50%;
  background: radial-gradient(circle at 30% 25%, #fff7b3, #ffd35a 42%, #ad7600 100%);
  box-shadow: 0 0 12px rgba(255, 211, 90, .75), inset 0 0 6px rgba(255,255,255,.55);
  font-size: 15px;
  line-height: 1;
  border: 1px solid rgba(255, 231, 150, .9);
}

.gold-badge-large {
  width: 34px;
  height: 34px;
  font-size: 20px;
}


/* LuNa EXP / Level system */
.xp-progress-wrap {
  margin: 16px 0 8px;
}
.xp-progress-label {
  display: flex;
  justify-content: space-between;
  color: var(--muted);
  font-weight: 800;
  margin-bottom: 8px;
}
.xp-progress-bar {
  width: 100%;
  height: 18px;
  border-radius: 999px;
  overflow: hidden;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.12);
}
.xp-progress-fill {
  height: 100%;
  border-radius: 999px;
  background: linear-gradient(135deg, #6f4cff, #b78cff);
  box-shadow: 0 0 14px rgba(183,140,255,.65);
}
.useful-guide-badge {
  display: inline-flex;
  margin: 10px 0;
  padding: 8px 12px;
  border-radius: 999px;
  background: rgba(255,211,90,.12);
  border: 1px solid rgba(255,211,90,.55);
  color: #ffd35a !important;
  font-weight: 900;
}


/* Achievements */
.achievements-grid {
  gap: 22px;
}

.achievement-card {
  position: relative;
  overflow: hidden;
}

.achievement-icon {
  font-size: 42px;
  margin-bottom: 10px;
}

.achievement-unlocked {
  border-color: rgba(255, 211, 90, .55) !important;
  box-shadow: 0 0 22px rgba(255, 211, 90, .18), 0 12px 40px rgba(0,0,0,.25) !important;
}

.achievement-locked {
  opacity: .72;
  filter: grayscale(.35);
}

.achievement-status {
  font-weight: 900;
}

.achievement-status.unlocked {
  color: #ffd35a !important;
}

.achievement-status.locked {
  color: var(--muted) !important;
}

.profile-achievement-actions {
  margin-top: 18px;
}

/* Extra cosmetics */
.cosmetic-lunar-crown {
  text-shadow: 0 0 8px #fff, 0 0 18px #ffd35a, 0 0 30px #b78cff !important;
}

.cosmetic-fire-moon-name {
  text-shadow: 0 0 8px #fff, 0 0 18px #ff8c3a, 0 0 30px #ff2f6d !important;
}

.cosmetic-eclipse-border {
  border: 2px solid #2d234d !important;
  box-shadow: 0 0 22px rgba(183,140,255,.45), inset 0 0 24px rgba(0,0,0,.65) !important;
}

.cosmetic-aurora-comment {
  border: 2px solid rgba(120,255,210,.8) !important;
  box-shadow: 0 0 18px rgba(120,255,210,.45), 0 0 28px rgba(183,140,255,.35) !important;
}

.cosmetic-galaxy-card {
  background:
    radial-gradient(circle at 15% 20%, rgba(80,120,255,.25), transparent 28%),
    radial-gradient(circle at 85% 30%, rgba(255,120,210,.18), transparent 30%),
    radial-gradient(circle at 45% 80%, rgba(120,255,210,.12), transparent 34%),
    linear-gradient(180deg,rgba(255,255,255,.08),rgba(255,255,255,.03)) !important;
}

.cosmetic-royal-admin-frame {
  border: 2px solid #ffd35a !important;
  box-shadow: 0 0 28px rgba(255,211,90,.55), inset 0 0 18px rgba(183,140,255,.18) !important;
}

.diamond-badge,
.starborn-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 26px;
  height: 26px;
  border-radius: 50%;
  margin-right: 6px;
}

.diamond-badge {
  background: radial-gradient(circle, #d8f8ff, #56dfff);
  box-shadow: 0 0 14px rgba(86,223,255,.75);
}

.starborn-badge {
  background: radial-gradient(circle, #fff7b3, #b78cff);
  box-shadow: 0 0 14px rgba(183,140,255,.75);
}


/* Post admin/useful guide actions spacing */
.post-admin-actions {
  margin: 18px 0 22px;
}

.post-admin-actions form {
  margin: 0;
}

.post-admin-actions .btn {
  width: 100%;
}

.card-actions {
  margin-top: 14px;
  gap: 12px;
}

.card-actions form {
  flex: 1;
  margin: 0;
}

.card-actions .btn {
  width: 100%;
}


/* Admin issue logs */
.logs-list {
  display: grid;
  gap: 16px;
}

.log-card {
  background: rgba(255,255,255,.045);
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 16px;
  padding: 16px;
}

.log-head {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: center;
}

.log-error {
  border-color: rgba(255,91,138,.65);
  box-shadow: 0 0 16px rgba(255,91,138,.18);
}

.log-warn {
  border-color: rgba(255,211,90,.65);
  box-shadow: 0 0 16px rgba(255,211,90,.14);
}

.log-info {
  border-color: rgba(183,140,255,.45);
}

.log-card pre {
  white-space: pre-wrap;
  overflow-x: auto;
  background: #05050d;
  border-radius: 12px;
  padding: 12px;
  color: #b8ffce;
  font-size: 13px;
}


/* Admin category edit controls */
.category-actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  margin-top: 18px;
}

.category-actions form {
  margin: 0;
}

.category-actions .btn {
  width: 100%;
}

.category-edit-form {
  margin-top: 20px;
  padding-top: 18px;
  border-top: 1px solid rgba(255,255,255,.12);
}


/* Admin Members page button spacing fix */
.member-card-actions {
  display: grid;
  grid-template-columns: 1fr;
  gap: 12px;
  margin-top: 18px;
  clear: both;
}

.member-card-actions form {
  margin: 0;
  width: 100%;
}

.member-card-actions .btn,
.member-card-actions button {
  width: 100%;
  min-width: 0;
}

@media (min-width: 760px) {
  .member-card-actions {
    grid-template-columns: 1fr 1fr;
  }
}


/* Mail read/delete controls */
.mail-card.mail-unread {
  border-color: rgba(255,211,90,.55);
  box-shadow: 0 0 18px rgba(255,211,90,.12);
}

.mail-card.mail-read {
  opacity: .82;
}

.mail-actions {
  display: grid;
  grid-template-columns: 1fr;
  gap: 12px;
  margin-top: 18px;
}

.mail-actions form {
  margin: 0;
}

.mail-actions .btn {
  width: 100%;
}

@media (min-width: 760px) {
  .mail-actions {
    grid-template-columns: repeat(3, 1fr);
  }
}


/* Category Edit Button Spacing Fix */
.category-edit-form{
    display:flex;
    flex-direction:column;
    gap:12px;
    margin-top:20px;
    padding-top:20px;
    border-top:1px solid rgba(255,255,255,.10);
}

.category-edit-form .btn{
    width:100%;
    margin:0;
}

.category-edit-form button + button,
.category-edit-form .btn + .btn{
    margin-top:12px;
}





/* Admin Events Edit Function Fix */
.admin-events-list {
  margin-top: 30px;
}

.event-actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  margin-top: 18px;
}

.event-actions form {
  margin: 0;
}

.event-actions .btn,
.event-actions button {
  width: 100%;
}

.event-edit-form {
  margin-top: 20px;
  padding-top: 20px;
  border-top: 1px solid rgba(255,255,255,.10);
}

.event-edit-form.is-hidden {
  display: none !important;
}

.event-edit-form label {
  display: block;
  margin-top: 12px;
  margin-bottom: 6px;
}

.event-edit-form .btn {
  width: 100%;
  margin-top: 12px !important;
}


/* Image carousel and image removal controls */
.image-carousel {
  position: relative;
  width: 100%;
  margin-top: 18px;
}

.carousel-track {
  position: relative;
  width: 100%;
  min-height: 280px;
  display: grid;
  place-items: center;
  overflow: hidden;
  border-radius: 18px;
}

.carousel-image {
  display: none;
  max-width: 100%;
  max-height: 420px;
  width: auto;
  height: auto;
  object-fit: contain;
  border-radius: 18px;
}

.carousel-image.active {
  display: block;
}

.carousel-btn {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 2;
  width: 44px !important;
  min-width: 44px !important;
  height: 44px;
  min-height: 44px;
  border-radius: 50%;
  padding: 0;
  font-size: 34px;
  line-height: 1;
  background: rgba(111,76,255,.75);
}

.carousel-prev {
  left: 10px;
}

.carousel-next {
  right: 10px;
}

.carousel-count {
  text-align: center;
  color: var(--muted);
  font-weight: 800;
  margin-top: 10px;
}

.image-remove-select {
  min-height: 96px;
}

.image-remove-preview,
.mini-image-strip {
  display: flex;
  gap: 10px;
  overflow-x: auto;
  margin: 12px 0;
  padding-bottom: 4px;
}

.remove-preview-item {
  min-width: 92px;
  text-align: center;
  color: var(--muted);
}

.remove-preview-item img,
.mini-image-strip img {
  width: 86px;
  height: 86px;
  object-fit: cover;
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.12);
}

.small-text {
  font-size: 13px;
}

.post-owner-actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  margin: 18px 0;
}

.post-owner-actions form {
  margin: 0;
}

.post-owner-actions .btn {
  width: 100%;
}

.post-edit-form,
.event-edit-form {
  margin-top: 20px;
  padding-top: 20px;
  border-top: 1px solid rgba(255,255,255,.10);
}

.post-edit-form.is-hidden,
.event-edit-form.is-hidden {
  display: none !important;
}

.post-edit-form .btn,
.event-edit-form .btn {
  width: 100%;
  margin-top: 12px !important;
}


/* Admin Logs toggle controls */
.log-control-actions {
  display: grid;
  grid-template-columns: 1fr;
  gap: 14px;
  margin-top: 18px;
}

.log-control-actions form {
  margin: 0;
}

.log-control-actions .btn {
  width: 100%;
}

.log-status {
  display: inline-flex;
  padding: 8px 12px;
  border-radius: 999px;
  font-weight: 900;
  margin: 8px 0 16px;
}

.log-status.enabled {
  border: 1px solid rgba(120,255,180,.55);
  color: #8cffb4;
}

.log-status.disabled {
  border: 1px solid rgba(255,91,138,.55);
  color: #ff5b8a;
}


/* Learning category image fix */
.category-card-image {
  width: 100%;
  max-height: 220px;
  object-fit: cover;
  border-radius: 16px;
  margin: 12px 0;
  border: 1px solid rgba(255,255,255,.12);
}

.category-edit-form {
  margin-top: 20px;
  padding-top: 20px;
  border-top: 1px solid rgba(255,255,255,.10);
}

.category-edit-form .btn {
  width: 100%;
  margin-top: 12px !important;
}


/* Admin Learning Posts */
.card-actions {
  display: grid;
  grid-template-columns: 1fr;
  gap: 12px;
  margin-top: 16px;
}

.card-actions form {
  margin: 0;
}

.card-actions .btn {
  width: 100%;
}

@media (min-width: 760px) {
  .card-actions {
    grid-template-columns: 1fr 1fr;
  }
}





/* Animated LuNa Night Sky */
body::before,
body::after {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: -1;
}

body::before {
  background:
    radial-gradient(circle at 8% 14%, rgba(255,255,255,.95) 0 1px, transparent 2px),
    radial-gradient(circle at 18% 38%, rgba(183,140,255,.9) 0 1px, transparent 2px),
    radial-gradient(circle at 33% 19%, rgba(155,211,255,.85) 0 1px, transparent 2px),
    radial-gradient(circle at 47% 62%, rgba(255,211,90,.8) 0 1px, transparent 2px),
    radial-gradient(circle at 69% 23%, rgba(255,255,255,.9) 0 1px, transparent 2px),
    radial-gradient(circle at 81% 44%, rgba(193,140,255,.9) 0 1px, transparent 2px),
    radial-gradient(circle at 91% 76%, rgba(140,255,180,.75) 0 1px, transparent 2px),
    radial-gradient(circle at 56% 86%, rgba(255,255,255,.8) 0 1px, transparent 2px);
  background-size: 520px 520px;
  animation: lunaStarDrift 28s linear infinite, lunaStarColour 10s ease-in-out infinite alternate;
  opacity: .85;
}

body::after {
  background:
    radial-gradient(circle at 22% 72%, rgba(255,255,255,.75) 0 1px, transparent 2px),
    radial-gradient(circle at 41% 31%, rgba(155,211,255,.75) 0 1px, transparent 2px),
    radial-gradient(circle at 75% 67%, rgba(255,211,90,.7) 0 1px, transparent 2px),
    radial-gradient(circle at 88% 18%, rgba(255,255,255,.85) 0 1px, transparent 2px),
    radial-gradient(circle at 12% 84%, rgba(183,140,255,.8) 0 1px, transparent 2px);
  background-size: 360px 360px;
  animation: lunaStarDriftReverse 36s linear infinite, lunaTwinkle 3.5s ease-in-out infinite;
  opacity: .55;
}

.top,
.site-header,
.hero,
.top-banner,
.luna-header {
  position: relative;
  overflow: hidden;
}

.top::before,
.site-header::before,
.hero::before,
.top-banner::before,
.luna-header::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    radial-gradient(circle at 14% 24%, rgba(255,255,255,.9) 0 1px, transparent 2px),
    radial-gradient(circle at 27% 71%, rgba(183,140,255,.85) 0 1px, transparent 2px),
    radial-gradient(circle at 48% 36%, rgba(155,211,255,.9) 0 1px, transparent 2px),
    radial-gradient(circle at 72% 22%, rgba(255,211,90,.8) 0 1px, transparent 2px),
    radial-gradient(circle at 86% 63%, rgba(255,255,255,.9) 0 1px, transparent 2px),
    radial-gradient(circle at center, rgba(80,42,145,.24), transparent 68%);
  background-size: 460px 460px;
  animation: lunaHeaderStars 22s linear infinite, lunaHeaderGlow 7s ease-in-out infinite alternate;
  opacity: .85;
}

.top::after,
.site-header::after,
.hero::after,
.top-banner::after,
.luna-header::after {
  content: "✦";
  position: absolute;
  left: -8%;
  top: 28%;
  color: rgba(255,255,255,.9);
  text-shadow: 0 0 10px #fff, 0 0 22px #b78cff;
  animation: lunaShootingStar 9s ease-in-out infinite;
  pointer-events: none;
  opacity: 0;
}

@keyframes lunaStarDrift {
  0% { background-position: 0 0; transform: translateY(0); filter: hue-rotate(0deg); }
  50% { transform: translateY(-8px); }
  100% { background-position: 520px 260px; transform: translateY(0); filter: hue-rotate(80deg); }
}

@keyframes lunaStarDriftReverse {
  0% { background-position: 0 0; transform: translateY(0); }
  50% { opacity: .9; transform: translateY(10px); }
  100% { background-position: -360px 220px; transform: translateY(0); }
}

@keyframes lunaStarColour {
  0% { filter: hue-rotate(0deg) saturate(1); }
  33% { filter: hue-rotate(45deg) saturate(1.35); }
  66% { filter: hue-rotate(120deg) saturate(1.15); }
  100% { filter: hue-rotate(220deg) saturate(1.45); }
}

@keyframes lunaTwinkle {
  0%, 100% { opacity: .35; }
  50% { opacity: .9; }
}

@keyframes lunaHeaderStars {
  0% { background-position: 0 0; }
  100% { background-position: 460px 180px; }
}

@keyframes lunaHeaderGlow {
  0% { opacity: .45; filter: hue-rotate(0deg); }
  100% { opacity: .95; filter: hue-rotate(120deg); }
}

@keyframes lunaShootingStar {
  0%, 70%, 100% {
    opacity: 0;
    transform: translate(0, 0) rotate(-22deg) scale(.7);
  }
  76% {
    opacity: 1;
  }
  84% {
    opacity: 0;
    transform: translate(120vw, 52px) rotate(-22deg) scale(1.1);
  }
}

/* Keep page content above animated sky */
.top,
main,
footer {
  position: relative;
  z-index: 1;
}

/* LuNa unified background */
body{
 background: linear-gradient(180deg,#09051f 0%,#12082e 50%,#09051f 100%) !important;
}
body::before,body::after{
 mix-blend-mode:screen;
}


/* Unified LuNa Header Background Fix */
.top,
.site-header,
.luna-header,
.top-banner{
  background:
    radial-gradient(circle at 15% 50%, rgba(183,140,255,.18), transparent 35%),
    radial-gradient(circle at 85% 20%, rgba(255,90,180,.12), transparent 35%),
    radial-gradient(circle at 50% 100%, rgba(111,76,255,.10), transparent 40%),
    linear-gradient(180deg,#12082e 0%,#09051f 100%) !important;
}

.hero,
.hero .card,
.hero .panel{
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}


/* Remove header blur */
.top{
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
}


/* Admin My Game Role */
.form label {
  display: block;
  margin-top: 12px;
  margin-bottom: 6px;
  color: var(--muted);
  font-weight: 800;
}