body[data-x-page="character-gallery"] #xCharacterGalleryPanel.x-clean-active {
  animation: none !important;
  transform: none !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  overscroll-behavior-y: contain;
  -webkit-overflow-scrolling: touch;
  touch-action: pan-y !important;
  background:
    radial-gradient(circle at 14% 4%, rgba(255,255,255,.92), transparent 30%),
    radial-gradient(circle at 88% 18%, rgba(210,188,232,.42), transparent 34%),
    linear-gradient(180deg, #f8f4fb 0%, #eee5f7 50%, #f7f3fa 100%);
}

.shex-character-gallery {
  --shex-gallery-page-gutter: clamp(14px, 4vw, 34px);
  --shex-gallery-page-top: max(14px, env(safe-area-inset-top));
  box-sizing: border-box;
  width: min(980px, 100%);
  min-height: 100%;
  margin: 0 auto;
  padding: var(--shex-gallery-page-top) var(--shex-gallery-page-gutter) calc(70px + env(safe-area-inset-bottom));
  color: #2d2537;
}

.shex-gallery-top-panel {
  position: relative;
  z-index: 8;
  margin: calc(-1 * var(--shex-gallery-page-top)) calc(-1 * var(--shex-gallery-page-gutter)) 2px;
  padding: var(--shex-gallery-page-top) var(--shex-gallery-page-gutter) 20px;
  border: 0;
  border-radius: 0;
  background: linear-gradient(180deg, rgba(223,203,239,.84) 0%, rgba(237,224,247,.62) 62%, rgba(247,243,250,0) 100%);
  box-shadow: none;
}

.shex-gallery-brandbar,
.shex-gallery-detail-nav {
  position: relative;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  min-height: 34px;
  margin-bottom: 9px;
}

.shex-gallery-top-panel .shex-gallery-brandbar { margin-bottom: 7px; }

.shex-gallery-brandbar > button {
  display: grid;
  place-items: center;
  width: 28px;
  height: 34px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  color: #554561;
  font-size: 27px;
  line-height: 1;
}

.shex-gallery-detail-nav button {
  display: grid;
  place-items: center;
  width: 40px;
  height: 40px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: rgba(255,255,255,.7);
  box-shadow: 0 10px 26px rgba(91,63,112,.08);
  color: #554561;
  font-size: 28px;
  line-height: 1;
}

.shex-gallery-compact-brand {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  justify-self: end;
  gap: 1px;
  min-width: 0;
  line-height: 1.1;
}

.shex-gallery-compact-brand strong,
.shex-gallery-detail-nav > strong {
  font-family: Georgia, "Times New Roman", serif;
  font-size: 16px;
  font-weight: 600;
  letter-spacing: .12em;
  color: #6f5980;
}

.shex-gallery-compact-brand small {
  color: #967bab;
  font-family: Georgia, "Source Han Serif SC", "Noto Serif SC", serif;
  font-size: 9px;
  letter-spacing: .08em;
  white-space: nowrap;
}

.shex-gallery-discoverybar {
  position: relative;
  z-index: 9;
  margin: 0;
}

.shex-gallery-primary-menus {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0;
  padding: 3px;
  border: 1px solid #e6e5e6;
  border-radius: 14px;
  background: rgba(255,255,255,.3);
  box-shadow: inset 0 1px 2px rgba(91,64,110,.04);
}

.shex-gallery-primary-menus > button {
  position: relative;
  display: grid;
  place-items: center;
  min-height: 35px;
  padding: 4px 8px;
  border: 0;
  border-radius: 11px;
  background: transparent;
  box-shadow: none;
  color: #666;
  font-family: Georgia, "Source Han Serif SC", "Noto Serif SC", serif;
  font-size: 13px;
  font-weight: 500;
  letter-spacing: .12em;
}

.shex-gallery-primary-menus > button + button::before {
  position: absolute;
  top: 9px;
  bottom: 9px;
  left: 0;
  width: 1px;
  background: rgba(115,91,132,.12);
  content: "";
}

.shex-gallery-primary-menus > button.is-open {
  background: #dac9e8;
  color: #55445f;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.42), 0 3px 9px rgba(91,65,109,.08);
}

.shex-gallery-primary-menus > button.is-open::before,
.shex-gallery-primary-menus > button.is-open + button::before { opacity: 0; }

.shex-gallery-primary-menus b {
  position: absolute;
  top: 3px;
  right: 5px;
  display: grid;
  place-items: center;
  min-width: 14px;
  height: 14px;
  padding: 0 4px;
  border-radius: 999px;
  background: rgba(102,72,125,.7);
  color: #fff;
  font-size: 8px;
  font-weight: 700;
}

.shex-gallery-popup {
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  left: 0;
  z-index: 20;
  padding: 15px;
  border: 1px solid rgba(112,82,137,.16);
  border-radius: 19px;
  background: rgba(251,248,253,.98);
  box-shadow: 0 18px 42px rgba(64,43,78,.2);
  backdrop-filter: blur(18px);
}

.shex-gallery-popup header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 12px;
}

.shex-gallery-popup header strong { color: #493857; font-size: 15px; }
.shex-gallery-popup header small { color: #8f8097; font-size: 11px; }

.shex-gallery-popup-options {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.shex-gallery-popup-options button {
  min-height: 32px;
  padding: 0 13px;
  border: 1px solid rgba(112,82,137,.12);
  border-radius: 11px;
  background: rgba(229,219,237,.66);
  color: #6f5b7a;
  font-size: 12px;
}

.shex-gallery-popup-options button.is-active {
  border-color: rgba(111,82,135,.4);
  background: #80649a;
  color: #fff;
}

.shex-gallery-popup-options button:disabled { opacity: .38; }

.shex-gallery-popup footer {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  margin-top: 14px;
  padding-top: 11px;
  border-top: 1px solid rgba(112,82,137,.1);
}

.shex-gallery-popup footer button {
  min-height: 32px;
  padding: 0 13px;
  border: 1px solid rgba(112,82,137,.14);
  border-radius: 11px;
  background: transparent;
  color: #715d7c;
  font-size: 12px;
}

.shex-gallery-popup footer button.primary {
  border-color: #80649a;
  background: #80649a;
  color: #fff;
}

.shex-gallery-alert {
  margin-bottom: 16px;
  padding: 13px 16px;
  border: 1px solid rgba(174,80,102,.13);
  border-radius: 15px;
  background: rgba(255,239,243,.88);
  color: #a33f54;
}

.shex-gallery-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(12px, 2.5vw, 20px);
}

.shex-gallery-card {
  position: relative;
  display: block;
  width: 100%;
  aspect-ratio: 4 / 5;
  min-width: 0;
  padding: 0;
  overflow: hidden;
  border: 0;
  border-radius: 23px;
  background: #d9cce5;
  box-shadow: 0 18px 40px rgba(76,52,94,.13);
  color: #fff;
  text-align: left;
  isolation: isolate;
}

.shex-gallery-card-cover,
.shex-gallery-detail-cover,
.shex-gallery-card-shade,
.shex-gallery-detail-shade {
  position: absolute;
  inset: 0;
}

.shex-gallery-cover-image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  transition: transform .45s ease;
}

.shex-gallery-card:hover .shex-gallery-cover-image { transform: scale(1.035); }

.shex-gallery-cover-fallback {
  display: grid;
  place-items: center;
  background:
    radial-gradient(circle at 70% 20%, rgba(255,255,255,.68), transparent 30%),
    linear-gradient(145deg, #e9def2 0%, #bea8d2 55%, #80649a 100%);
}

.shex-gallery-cover-fallback span {
  transform: translateY(-8%);
  font-family: Georgia, "Source Han Serif SC", serif;
  font-size: clamp(54px, 12vw, 92px);
  color: rgba(255,255,255,.82);
  text-shadow: 0 12px 30px rgba(79,53,100,.16);
}

.shex-gallery-card-shade {
  z-index: 1;
  background: linear-gradient(180deg, rgba(41,28,50,.06) 16%, rgba(39,27,47,.18) 43%, rgba(27,18,33,.88) 100%);
}

.shex-gallery-card-author {
  position: absolute;
  z-index: 2;
  top: 12px;
  left: 12px;
  max-width: calc(100% - 24px);
  padding: 4px 7px;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.2);
  border-radius: 999px;
  background: rgba(45,32,53,.34);
  backdrop-filter: blur(10px);
  color: rgba(255,255,255,.9);
  font-size: 9px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.shex-gallery-card-copy {
  position: absolute;
  z-index: 2;
  right: 0;
  bottom: 0;
  left: 0;
  padding: 18px;
}

.shex-gallery-card-copy h3 {
  margin: 0 0 8px;
  overflow: hidden;
  font-family: Georgia, "Source Han Serif SC", "Noto Serif SC", serif;
  font-size: clamp(20px, 3vw, 27px);
  font-weight: 600;
  line-height: 1.2;
  text-overflow: ellipsis;
  white-space: nowrap;
  text-shadow: 0 2px 12px rgba(0,0,0,.35);
}

.shex-gallery-tags {
  display: flex;
  gap: 6px;
  margin-bottom: 8px;
  overflow: hidden;
}

.shex-gallery-tags span {
  max-width: 48%;
  padding: 4px 7px;
  overflow: hidden;
  border-radius: 999px;
  background: rgba(243,236,248,.22);
  backdrop-filter: blur(8px);
  color: rgba(255,255,255,.9);
  font-size: 11px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.shex-gallery-card-copy p {
  display: -webkit-box;
  margin: 0;
  overflow: hidden;
  color: rgba(255,255,255,.75);
  font-size: 10px;
  line-height: 1.35;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
}

.shex-gallery-empty {
  grid-column: 1 / -1;
  padding: 68px 20px;
  border: 1px solid rgba(126,99,153,.14);
  border-radius: 24px;
  background: rgba(255,255,255,.56);
  text-align: center;
  color: #85768c;
}

.shex-gallery-more {
  display: block;
  min-width: 142px;
  min-height: 34px;
  margin: 18px auto 0;
  border: 1px solid rgba(126,99,153,.2);
  border-radius: 999px;
  background: rgba(255,255,255,.68);
  color: #715780;
  font-size: 10px;
}

.shex-gallery-detail { display: grid; gap: 18px; }

.shex-gallery-detail-nav {
  grid-template-columns: auto 1fr auto;
  gap: 10px;
  margin-bottom: 2px;
}

.shex-gallery-detail-nav span {
  font-size: 17px;
  font-weight: 650;
}

.shex-gallery-detail-hero {
  position: relative;
  min-height: clamp(330px, 65vh, 560px);
  overflow: hidden;
  border: 1px solid rgba(126,99,153,.16);
  border-radius: 28px;
  background: #d9cce5;
  box-shadow: 0 22px 54px rgba(76,52,94,.15);
  isolation: isolate;
}

.shex-gallery-detail-shade {
  z-index: 1;
  background: linear-gradient(180deg, rgba(38,25,47,.03) 18%, rgba(34,23,42,.2) 55%, rgba(25,17,30,.9) 100%);
}

.shex-gallery-detail-copy {
  position: absolute;
  z-index: 2;
  right: 0;
  bottom: 0;
  left: 0;
  padding: clamp(22px, 5vw, 38px);
  color: #fff;
}

.shex-gallery-detail-copy small { color: rgba(255,255,255,.72); letter-spacing: .08em; }
.shex-gallery-detail-copy h2 { margin: 6px 0 10px; font-family: Georgia, "Source Han Serif SC", serif; font-size: clamp(34px, 7vw, 58px); }
.shex-gallery-detail-copy p { max-width: 680px; margin: 0; color: rgba(255,255,255,.82); line-height: 1.7; }

.shex-gallery-version { display: flex; flex-wrap: wrap; gap: 9px; }
.shex-gallery-version span { padding: 7px 11px; border-radius: 999px; background: rgba(255,255,255,.66); color: #80649a; font-size: 12px; }

.shex-gallery-claim {
  display: grid;
  gap: 8px;
  padding: 18px 20px;
  border: 1px solid rgba(126,99,153,.16);
  border-radius: 20px;
  background: rgba(255,255,255,.68);
}

.shex-gallery-claim button { min-height: 48px; border: 0; border-radius: 15px; background: #80649a; color: #fff; font-size: 16px; }
.shex-gallery-claim button:disabled { background: #c6b7d1; color: #fff; }
.shex-gallery-claim p { margin: 0; color: #827589; font-size: 13px; line-height: 1.6; }
.shex-gallery-report { margin: 0 18px 16px; display: grid; gap: 10px; }
.shex-gallery-report > button { justify-self: end; border: 0; background: transparent; color: #826c91; font: inherit; font-size: 11px; text-decoration: underline; }
.shex-gallery-report form { display: grid; gap: 10px; padding: 14px; border-radius: 16px; background: rgba(255,255,255,.58); }
.shex-gallery-report label { display: grid; gap: 6px; color: #685873; font-size: 11px; }
.shex-gallery-report select, .shex-gallery-report textarea { width: 100%; box-sizing: border-box; border: 1px solid rgba(112,82,137,.18); border-radius: 12px; padding: 10px; color: #43384a; background: rgba(255,255,255,.82); font: inherit; }
.shex-gallery-report textarea { min-height: 82px; resize: vertical; }
.shex-gallery-report form button { border: 0; border-radius: 12px; padding: 10px; background: #81649a; color: #fff; font: inherit; }
body.x-dark-mode .shex-gallery-report form, body.x-night-mode .shex-gallery-report form, html.x-night-mode .shex-gallery-report form { background: rgba(255,255,255,.08); }
body.x-dark-mode .shex-gallery-report select, body.x-dark-mode .shex-gallery-report textarea, body.x-night-mode .shex-gallery-report select, body.x-night-mode .shex-gallery-report textarea, html.x-night-mode .shex-gallery-report select, html.x-night-mode .shex-gallery-report textarea { color: #f2edf5; background: rgba(17,14,21,.82); border-color: rgba(255,255,255,.13); }

.shex-gallery-detail-fields {
  display: grid;
  gap: 0;
  margin: 0;
  padding: 5px 22px;
  border: 1px solid rgba(126,99,153,.16);
  border-radius: 24px;
  background: rgba(255,255,255,.68);
}

.shex-gallery-detail-field { display: grid; grid-template-columns: minmax(120px, 28%) minmax(0, 1fr); gap: 16px; padding: 15px 0; border-bottom: 1px solid rgba(126,99,153,.11); }
.shex-gallery-detail-field:last-child { border-bottom: 0; }
.shex-gallery-detail-field dt { color: #80649a; }
.shex-gallery-detail-field dd { margin: 0; white-space: pre-wrap; overflow-wrap: anywhere; color: #33283b; line-height: 1.7; }

.shex-gallery-section[hidden],
.shex-gallery-discoverybar[hidden] { display: none !important; }

.shex-gallery-section-nav {
  position: fixed;
  right: auto;
  bottom: max(10px, env(safe-area-inset-bottom));
  left: 50%;
  z-index: 40;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  width: min(330px, calc(100vw - 36px));
  gap: 2px;
  padding: 4px;
  margin: 0;
  transform: translateX(-50%);
  border: 1px solid rgba(112,82,137,.16);
  border-radius: 15px;
  background: rgba(248,243,251,.9);
  box-shadow: 0 16px 40px rgba(64,43,78,.2);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
}

.shex-gallery-section-nav button {
  min-height: 34px;
  border: 0;
  border-radius: 11px;
  background: transparent;
  color: #77677f;
  font-family: Georgia, "Source Han Serif SC", "Noto Serif SC", serif;
  font-size: 11px;
  font-weight: 500;
  letter-spacing: .14em;
}

.shex-gallery-section-nav button.is-active {
  background: #80649a;
  color: #fff;
  box-shadow: 0 8px 20px rgba(94,68,113,.2);
}

.shex-gallery-feed {
  display: block;
  height: 100dvh;
  min-height: 520px;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior-y: contain;
  scroll-snap-type: y mandatory;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
}

.shex-gallery-feed::-webkit-scrollbar { display: none; }

.shex-gallery-feed-alert {
  position: absolute;
  top: max(72px, calc(env(safe-area-inset-top) + 58px));
  right: 18px;
  left: 18px;
  z-index: 16;
  padding: 10px 13px;
  border: 1px solid rgba(255,255,255,.2);
  border-radius: 14px;
  color: #fff;
  background: rgba(99,42,61,.72);
  box-shadow: 0 12px 30px rgba(10,7,13,.2);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  font-size: 12px;
  line-height: 1.5;
}

.shex-gallery-feed-card {
  position: relative;
  width: 100%;
  height: 100%;
  min-height: 100%;
  overflow: hidden;
  border: 0;
  border-radius: 0;
  background: #17131e;
  box-shadow: none;
  color: #fff;
  isolation: isolate;
  scroll-snap-align: start;
  scroll-snap-stop: always;
}

.shex-gallery-feed-cover,
.shex-gallery-feed-shade { position: absolute; inset: 0; }

.shex-gallery-feed-shade {
  z-index: 1;
  background:
    linear-gradient(180deg, rgba(12,9,17,.34) 0%, rgba(18,12,24,.02) 26%, rgba(20,13,25,.2) 52%, rgba(18,12,22,.9) 100%),
    linear-gradient(90deg, rgba(15,10,20,.2), transparent 56%);
}

.shex-gallery-feed-copy {
  position: absolute;
  right: clamp(18px, 5vw, 42px);
  bottom: calc(76px + env(safe-area-inset-bottom));
  left: 0;
  z-index: 2;
  padding: 0 clamp(18px, 5vw, 42px);
}

.shex-gallery-feed-copy small { color: rgba(255,255,255,.78); font-size: 11px; letter-spacing: .08em; }
.shex-gallery-feed-copy h2 { margin: 8px 0 10px; font-family: Georgia, "Source Han Serif SC", serif; font-size: clamp(32px, 7vw, 52px); font-weight: 600; line-height: 1.05; }
.shex-gallery-feed-copy p {
  display: -webkit-box;
  max-width: 620px;
  margin: 11px 0 0;
  overflow: hidden;
  color: rgba(255,255,255,.76);
  font-size: 12px;
  line-height: 1.58;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}
.shex-gallery-feed-message {
  position: relative;
  max-width: min(88%, 620px);
  margin-top: 13px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  color: rgba(255,255,255,.94);
  font-family: "Source Han Serif SC", "Noto Serif SC", "Songti SC", Georgia, serif;
  font-size: 14px;
  font-weight: 400;
  letter-spacing: .035em;
  line-height: 1.76;
  text-shadow: 0 2px 12px rgba(0,0,0,.42);
}

.shex-gallery-feed-message span {
  display: -webkit-box;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 6;
}
.shex-gallery-feed-tags { display: flex; flex-wrap: wrap; gap: 6px; }
.shex-gallery-feed-tags span { padding: 4px 9px; border: 1px solid rgba(255,255,255,.16); border-radius: 999px; background: rgba(25,18,31,.22); backdrop-filter: blur(10px); font-size: 10px; }
.shex-gallery-feed-copy .shex-gallery-feed-chat {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 46px;
  margin-top: 17px;
  padding: 0 24px;
  border: 1px solid rgba(255,255,255,.32);
  border-radius: 999px;
  background: rgba(238,225,249,.22);
  color: #fff;
  box-shadow: 0 14px 34px rgba(10,7,13,.2);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  font-size: 14px;
  font-weight: 600;
  letter-spacing: .08em;
}
.shex-gallery-feed-copy .shex-gallery-feed-chat:disabled { opacity: .68; }
.shex-character-gallery.is-home-active {
  position: absolute;
  inset: 0;
  width: 100%;
  max-width: none;
  min-height: 100dvh;
  margin: 0;
  padding: 0;
  overflow: hidden;
  background: #17131e;
}

.shex-character-gallery.is-home-active .shex-gallery-top-panel {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  z-index: 12;
  margin: 0;
  padding: max(12px, env(safe-area-inset-top)) clamp(16px, 4vw, 30px) 26px;
  color: #fff;
  background: linear-gradient(180deg, rgba(18,12,24,.52), rgba(18,12,24,0));
  pointer-events: none;
}

.shex-character-gallery.is-home-active .shex-gallery-brandbar { margin: 0; pointer-events: auto; }
.shex-character-gallery.is-home-active .shex-gallery-brandbar > button,
.shex-character-gallery.is-home-active .shex-gallery-compact-brand strong,
.shex-character-gallery.is-home-active .shex-gallery-compact-brand small { color: #fff; text-shadow: 0 2px 12px rgba(0,0,0,.36); }
.shex-character-gallery.is-home-active .shex-gallery-section[data-gallery-view="home"] { height: 100dvh; }
.shex-character-gallery.is-home-active .shex-gallery-section-nav {
  border-color: rgba(255,255,255,.16);
  background: rgba(23,18,29,.48);
  box-shadow: none;
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
}
.shex-character-gallery.is-home-active .shex-gallery-section-nav button { color: rgba(255,255,255,.68); }
.shex-character-gallery.is-home-active .shex-gallery-section-nav button.is-active { background: rgba(220,198,237,.3); color: #fff; box-shadow: none; }

.shex-gallery-creator-section { padding: 0 0 24px; }
.shex-gallery-creator-section .shex-creator-workbench { width: 100%; padding: 4px 0 84px; }
.shex-gallery-creator-section .shex-creator-head { display: none; }

.shex-gallery-card:focus-visible,
.shex-gallery-discoverybar button:focus-visible,
.shex-gallery-brandbar button:focus-visible,
.shex-gallery-detail-nav button:focus-visible {
  outline: 3px solid rgba(128,100,154,.38);
  outline-offset: 3px;
}

body.x-dark-mode[data-x-page="character-gallery"] #xCharacterGalleryPanel.x-clean-active,
body.x-night-mode[data-x-page="character-gallery"] #xCharacterGalleryPanel.x-clean-active,
html.x-night-mode body[data-x-page="character-gallery"] #xCharacterGalleryPanel.x-clean-active {
  background: radial-gradient(circle at 80% 0%, rgba(91,66,123,.28), transparent 35%), linear-gradient(180deg, #111017, #17131e 55%, #0e0d12);
}

body.x-dark-mode .shex-character-gallery,
body.x-night-mode .shex-character-gallery,
html.x-night-mode .shex-character-gallery { color: #f1edf7; }

body.x-dark-mode .shex-gallery-brandbar > button,
body.x-night-mode .shex-gallery-brandbar > button,
html.x-night-mode .shex-gallery-brandbar > button { color: #f1edf7; }

body.x-dark-mode .shex-gallery-detail-nav button,
body.x-night-mode .shex-gallery-detail-nav button,
html.x-night-mode .shex-gallery-detail-nav button { border-color: rgba(255,255,255,.1); background: rgba(255,255,255,.07); color: #f1edf7; }

body.x-dark-mode .shex-gallery-top-panel,
body.x-night-mode .shex-gallery-top-panel,
html.x-night-mode .shex-gallery-top-panel {
  border-color: transparent;
  background: linear-gradient(180deg, rgba(67,52,79,.88) 0%, rgba(45,37,54,.66) 62%, rgba(23,19,30,0) 100%);
  box-shadow: none;
}

body.x-dark-mode .shex-gallery-primary-menus,
body.x-night-mode .shex-gallery-primary-menus,
html.x-night-mode .shex-gallery-primary-menus { border-color: rgba(255,255,255,.1); background: rgba(255,255,255,.055); }

body.x-dark-mode .shex-gallery-compact-brand strong,
body.x-dark-mode .shex-gallery-detail-nav > strong,
body.x-night-mode .shex-gallery-compact-brand strong,
body.x-night-mode .shex-gallery-detail-nav > strong,
html.x-night-mode .shex-gallery-compact-brand strong,
html.x-night-mode .shex-gallery-detail-nav > strong { color: #c8b5dc; }

body.x-dark-mode .shex-gallery-primary-menus > button,
body.x-night-mode .shex-gallery-primary-menus > button,
html.x-night-mode .shex-gallery-primary-menus > button { background: transparent; box-shadow: none; color: #d9cae5; }

body.x-dark-mode .shex-gallery-primary-menus > button.is-open,
body.x-night-mode .shex-gallery-primary-menus > button.is-open,
html.x-night-mode .shex-gallery-primary-menus > button.is-open { background: rgba(225,211,236,.22); color: #fff; box-shadow: inset 0 1px 0 rgba(255,255,255,.08); }

body.x-dark-mode .shex-gallery-popup,
body.x-night-mode .shex-gallery-popup,
html.x-night-mode .shex-gallery-popup { border-color: rgba(255,255,255,.12); background: rgba(31,27,38,.97); box-shadow: 0 18px 42px rgba(0,0,0,.42); }

body.x-dark-mode .shex-gallery-popup header strong,
body.x-night-mode .shex-gallery-popup header strong,
html.x-night-mode .shex-gallery-popup header strong { color: #f2ecf7; }

body.x-dark-mode .shex-gallery-popup header small,
body.x-night-mode .shex-gallery-popup header small,
html.x-night-mode .shex-gallery-popup header small { color: rgba(238,232,245,.56); }

body.x-dark-mode .shex-gallery-popup-options button,
body.x-night-mode .shex-gallery-popup-options button,
html.x-night-mode .shex-gallery-popup-options button { border-color: rgba(255,255,255,.1); background: rgba(255,255,255,.07); color: rgba(243,238,248,.72); }

body.x-dark-mode .shex-gallery-popup-options button.is-active,
body.x-night-mode .shex-gallery-popup-options button.is-active,
html.x-night-mode .shex-gallery-popup-options button.is-active { border-color: #a78bc1; background: #80649a; color: #fff; }

body.x-dark-mode .shex-gallery-popup footer,
body.x-night-mode .shex-gallery-popup footer,
html.x-night-mode .shex-gallery-popup footer { border-top-color: rgba(255,255,255,.09); }

body.x-dark-mode .shex-gallery-popup footer button,
body.x-night-mode .shex-gallery-popup footer button,
html.x-night-mode .shex-gallery-popup footer button { border-color: rgba(255,255,255,.11); color: rgba(243,238,248,.72); }

body.x-dark-mode .shex-gallery-empty,
body.x-dark-mode .shex-gallery-more,
body.x-dark-mode .shex-gallery-claim,
body.x-dark-mode .shex-gallery-detail-fields,
body.x-night-mode .shex-gallery-empty,
body.x-night-mode .shex-gallery-more,
body.x-night-mode .shex-gallery-claim,
body.x-night-mode .shex-gallery-detail-fields,
html.x-night-mode .shex-gallery-empty,
html.x-night-mode .shex-gallery-more,
html.x-night-mode .shex-gallery-claim,
html.x-night-mode .shex-gallery-detail-fields { border-color: rgba(255,255,255,.09); background: rgba(255,255,255,.055); color: rgba(240,235,247,.76); }

body.x-dark-mode .shex-gallery-detail-field dd,
body.x-night-mode .shex-gallery-detail-field dd,
html.x-night-mode .shex-gallery-detail-field dd { color: #eee9f5; }

body.x-dark-mode .shex-gallery-section-nav,
body.x-night-mode .shex-gallery-section-nav,
html.x-night-mode .shex-gallery-section-nav { border-color: rgba(255,255,255,.1); background: rgba(29,25,35,.9); box-shadow: 0 16px 40px rgba(0,0,0,.35); }

body.x-dark-mode .shex-gallery-section-nav button,
body.x-night-mode .shex-gallery-section-nav button,
html.x-night-mode .shex-gallery-section-nav button { color: rgba(240,235,247,.7); }

body.x-dark-mode .shex-gallery-section-nav button.is-active,
body.x-night-mode .shex-gallery-section-nav button.is-active,
html.x-night-mode .shex-gallery-section-nav button.is-active { background: #8b6ba5; color: #fff; }

@media (max-width: 700px) {
  .shex-character-gallery { padding-right: 12px; padding-left: 12px; }
  .shex-gallery-brandbar { margin-bottom: 9px; }
  .shex-gallery-discoverybar { margin-right: 0; margin-left: 0; }
  .shex-gallery-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .shex-gallery-card { border-radius: 18px; }
  .shex-gallery-card-copy { padding: 13px; }
  .shex-gallery-card-copy h3 { margin-bottom: 6px; font-size: 19px; }
  .shex-gallery-card-copy p { font-size: 9px; }
  .shex-gallery-card-author { top: 9px; left: 9px; max-width: calc(100% - 18px); padding: 3px 6px; font-size: 8px; }
  .shex-gallery-tags { margin-bottom: 6px; }
  .shex-gallery-tags span { padding: 3px 6px; font-size: 10px; }
  .shex-gallery-detail-hero { min-height: min(62vh, 520px); border-radius: 22px; }
  .shex-gallery-detail-field { grid-template-columns: 1fr; gap: 5px; }
}

@media (max-width: 360px) {
  .shex-gallery-card-copy p { display: -webkit-box; font-size: 8.5px; }
  .shex-gallery-card-copy h3 { font-size: 17px; }
}
