.sg-member-page {
  --sg-cream: #fff0d9;
  --sg-gold: #f0c98b;
  --sg-subtle: #c8b7b1;
  --sg-line: #f7c7aa23;
  --sg-display: "RGS Display", Georgia, serif;
}

.sg-member-page #main-content {
  background: radial-gradient(ellipse at 68% 0, #3e181f63, transparent 52%), #100a0c;
}

.sg-member {
  max-width: 1240px;
  margin-inline: auto;
  padding: clamp(20px, 3.2vw, 46px) clamp(16px, 3.5vw, 48px) clamp(42px, 6vw, 88px);
  color: var(--sg-cream);
}

.sg-member-hero {
  --sg-scene: url("stargate-crimson-moon.png");
  position: relative;
  isolation: isolate;
  display: grid;
  align-items: center;
  min-height: 286px;
  padding: clamp(22px, 4.1vw, 56px);
  margin: 0 0 clamp(20px, 2.6vw, 32px);
  overflow: hidden;
  border-radius: 23px;
  background: #1c0d12;
  box-shadow: 0 22px 60px -32px #000b;
}

.sg-member-hero::before,
.sg-member-hero::after {
  position: absolute;
  z-index: -1;
  content: "";
  pointer-events: none;
}

.sg-member-hero::before {
  top: 50%;
  right: 0;
  width: min(82%, 930px);
  aspect-ratio: 1569 / 760;
  transform: translateY(-50%);
  background: var(--sg-scene) center / cover no-repeat;
}

.sg-member-hero::after {
  inset: 0;
  background: linear-gradient(90deg, #1a0c10 0%, #1a0c10f7 26%, #1a0c10d4 42%, #1a0c103b 65%, #1a0c1009 100%),
              linear-gradient(0deg, #1a0c10b0, transparent 44%, transparent 80%, #1a0c1040);
}

.sg-member-hero--systems::before,
.sg-member-hero--support::before {
  width: min(88%, 960px);
  aspect-ratio: 830 / 321;
  background: url("stargate-realm-scenes.png") var(--sg-position) / 201.44578% 293.14642% no-repeat;
}

.sg-member-hero--systems { --sg-position: 99.76247% 0.16129%; }
.sg-member-hero--support { --sg-position: 0.23725% 51.56250%; }
.sg-member-hero--support::before {
  aspect-ratio: 829 / 301;
  background-size: 201.68878% 312.62458%;
}
.sg-member-hero--detail { min-height: 240px; }
.sg-member-hero--detail::after {
  background: linear-gradient(90deg, #1a0c10 3%, #1a0c10f2 45%, #1a0c107a 78%, #1a0c102a), linear-gradient(0deg,#1a0c10c0,transparent 52%);
}

.sg-member-hero-copy { max-width: 530px; min-width: 0; }
.sg-member-hero h1 {
  margin: 0;
  color: var(--sg-cream);
  font: 600 clamp(2.6rem, 5.4vw, 4.65rem)/.99 var(--sg-display);
  letter-spacing: -.045em;
  overflow-wrap: anywhere;
  text-wrap: balance;
}
.sg-member-hero--detail h1 { font-size: clamp(2rem, 4.1vw, 3.3rem); }
.sg-member-hero-copy > p {
  margin: 14px 0 0;
  max-width: 38ch;
  color: #ead8d0;
  line-height: 1.55;
  font-size: clamp(.94rem, 1.4vw, 1.02rem);
}
.sg-member-hero-copy > .sg-member-cta { margin-top: 21px; }

.sg-member-grid, .sg-member-tools {
  display: grid;
  grid-template-columns: minmax(0, .82fr) minmax(0, 1.18fr);
  align-items: stretch;
  gap: clamp(14px, 2.2vw, 26px);
}
.sg-member-grid--support { grid-template-columns: minmax(0, 1.06fr) minmax(0, .94fr); align-items: start; }
.sg-member-tools { grid-template-columns: repeat(2, minmax(0, 1fr)); }

.sg-member-page .sg-member .sg-member-panel {
  padding: clamp(20px, 3.2vw, 34px);
  min-width: 0;
  border: 0;
  border-radius: 19px;
  background: radial-gradient(ellipse at 0 0, #53232a4f, transparent 65%), linear-gradient(145deg, #24161c, #181216 74%);
  box-shadow: inset 0 1px #f7c7aa19, 0 16px 36px -27px #000;
}

.sg-member-panel-head { display: flex; align-items: center; gap: 14px; margin-bottom: 18px; }
.sg-member-page .sg-member .sg-member-panel h2 {
  margin: 0;
  color: var(--sg-cream);
  font: 600 clamp(1.44rem, 2.2vw, 1.9rem)/1.1 var(--sg-display);
  overflow-wrap: anywhere;
}
.sg-member-page .sg-member .sg-member-label {
  margin: 0 0 5px;
  color: var(--sg-gold);
  font-size: .73rem;
  font-weight: 700;
  letter-spacing: .11em;
  text-transform: uppercase;
}
.sg-member-emblem {
  display: grid;
  place-items: center;
  flex: 0 0 45px;
  height: 45px;
  border-radius: 12px;
  background: linear-gradient(145deg, #74363e, #421b23);
  color: #ffdfac;
  box-shadow: inset 0 1px #ffe5c130;
}
.sg-member-icon { flex: 0 0 auto; }
.sg-member-facts { margin: 6px 0 18px; }
.sg-member-facts > div {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px 18px;
  padding: 12px 0;
  border-bottom: 1px solid var(--sg-line);
}
.sg-member-facts dt, .sg-member-wallet > span { color: var(--sg-subtle); font-size: .85rem; }
.sg-member-facts dd { margin: 0; text-align: end; font-size: .9rem; overflow-wrap: anywhere; }
.sg-member-badge {
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  padding: 3px 9px;
  border-radius: 100px;
  color: #f5d6a8;
  background: #b47a4934;
  font-size: .78rem;
}
.sg-member-badge--verified { color: #bde6ca; background: #53836b40; }
.sg-member-wallet {
  display: grid;
  gap: 5px;
  padding: 14px 16px;
  border-radius: 12px;
  background: linear-gradient(105deg, #4c2428, #342028);
}
.sg-member-wallet strong { color: #ffdeab; font: 600 clamp(1.55rem, 3vw, 2.35rem)/1.15 var(--sg-display); overflow-wrap: anywhere; }
.sg-member-wallet small { font: 700 .75rem/1.3 "RGS Text", sans-serif; white-space: nowrap; }
.sg-member-inline, .sg-member-page .sg-member .sg-member-inline {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: var(--sg-gold);
  font-size: .88rem;
  font-weight: 700;
  text-decoration: none;
}
.sg-member-inline:hover { text-decoration: underline; text-underline-offset: 4px; }
.sg-member-back { margin-bottom: 15px; }
.sg-member-identity > .sg-member-inline { margin-top: 17px; }

.sg-member-page .sg-member .sg-member-explainer { color: var(--sg-subtle); margin: 0 0 18px; }
.sg-member .sg-member-form { gap: 15px; }
.sg-member .sg-member-form .sg-member-fields { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 14px; }
.sg-member .sg-member-form .field { margin: 0; }
.sg-member .sg-member-form label { color: #ead7d1; font-size: .875rem; }
.sg-member-page .sg-member .sg-member-form :is(input:not([type=checkbox]),textarea,select) {
  color: var(--sg-cream);
  background: #120d11;
  border: 1px solid #f6c5b82f;
  border-radius: 9px;
  color-scheme: dark;
}
.sg-member-page .sg-member .sg-member-form textarea { min-height: 104px; resize: vertical; }
.sg-member-page .sg-member .sg-member-form input[type=file] { font-size: .82rem; }
.sg-member .sg-member-form small { color: var(--sg-subtle); line-height: 1.45; }
.sg-member .sg-member-form .errorlist { color: #ffbcab; font-size: .84rem; margin: 0; padding-inline-start: 1.3rem; }
.sg-member .sg-member-form :is(input,textarea,select):focus-visible,
.sg-member :is(a,button):focus-visible { outline: 2px solid #ffd89c; outline-offset: 3px; }
.sg-member .sg-member-cta {
  display: inline-flex;
  width: fit-content;
  max-width: 100%;
  align-items: center;
  justify-content: center;
  gap: 13px;
  min-height: 44px;
  padding: 10px 16px;
  border: 1px solid #f7c5a245;
  border-radius: 9px;
  background: #26161cee;
  color: #ffe2b2;
  font: 700 .89rem/1.3 "RGS Text", sans-serif;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
}
.sg-member .sg-member-cta:hover { border-color: #f7c5a2ad; background: #4a252c; }
.sg-member .sg-member-cta--gold { border-color: transparent; background: linear-gradient(110deg,#ffddaa,#e5ad67); color: #24120e; }
.sg-member .sg-member-cta--gold:hover { background: #ffe2b5; }

.sg-member-page .sg-member .sg-member-tile {
  display: grid;
  grid-template-columns: 45px minmax(0,1fr) auto;
  align-items: center;
  gap: 14px;
  color: var(--sg-cream);
  text-decoration: none;
  transition: background-color .2s, transform .2s;
}
.sg-member-page .sg-member .sg-member-tile p { margin: 5px 0 0; color: var(--sg-subtle); }
.sg-member-page .sg-member .sg-member-tile:hover {
  background: radial-gradient(ellipse at 0 0,#79333d65,transparent 66%),#291820;
  transform: translateY(-2px);
}
.sg-member-arrow { color: var(--sg-gold); font-size: 1.15rem; }
.sg-member-logout { margin-top: 20px; }
.sg-member-logout .sg-member-icon { width: 18px; height: 18px; }
.sg-member-ticket {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px 16px;
  padding: 12px 14px;
  background: #140d11;
  border-radius: 10px;
  color: var(--sg-cream);
  text-decoration: none;
}
.sg-member-ticket:hover { background: #42252c; }
.sg-member .sg-member-ticket h3 { margin: 4px 0; font: 600 1.05rem/1.3 var(--sg-display); overflow-wrap: anywhere; }
.sg-member-ticket small, .sg-member-empty { color: var(--sg-subtle); font-size: .86rem; }
.sg-member-empty { padding: 1rem; border-radius: 10px; background: #140d11; }
.sg-member-thread { max-width: 910px; }
.sg-member .support-player-thread {
  background: #1a1217;
  border: 0;
  box-shadow: inset 0 1px #f7c7aa19;
  border-radius: 16px;
}
.sg-member .support-bubble--outgoing { background: #4b242f; border-color: #a3566550; }
.sg-member .support-bubble--incoming { background: #29232e; border-color: #8776934a; }

@media (max-width: 810px) {
  .sg-member-grid, .sg-member-tools { grid-template-columns: minmax(0,1fr); }
}
@media (max-width: 600px) {
  .sg-member-hero { min-height: 255px; align-items: end; padding: 22px; border-radius: 17px; }
  .sg-member-hero::before { top: 0; right: -16%; width: max(117%, 470px); transform: none; opacity: .82; }
  .sg-member-hero::after { background: linear-gradient(0deg,#1a0c10 12%,#1a0c10f2 30%,#1a0c10a8 52%,#1a0c1029 96%),linear-gradient(90deg,#1a0c105c,transparent 70%); }
  .sg-member-hero-copy > p { max-width: 32ch; }
  .sg-member .sg-member-form .sg-member-fields { grid-template-columns: minmax(0,1fr); }
  .sg-member-ticket { flex-wrap: wrap; }
}
@media (prefers-reduced-motion: reduce) {
  .sg-member-page .sg-member .sg-member-tile { transition: none; transform: none; }
}