/* Google Fonts: Playfair Display for headers, Lato for body, Great Vibes for calligraphy */
@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:wght@400;700&family=Lato:wght@300;400;700&family=Great+Vibes&display=swap');

body {
  font-family: 'Lato', sans-serif;
  color: #333;
  margin: 0;
  padding: 0;
  line-height: 1.6;
  font-weight: 900;
  text-shadow: 0 0 1px #000, 0 0 1px #000;
  overflow-x: hidden;
  text-align: center;
}

/* Ensure images never overflow their container */
img { max-width: 100%; height: auto; }

[hidden] {
  display: none !important;
}

h1 {
  font-family: 'Great Vibes', cursive;
  color: #2c3e50;
}

h2, h3, h4, h5, h6 {
  font-family: 'Playfair Display', serif;
  color: #333;
}

header {
  background-color: #2c3e50;
  color: white;
  padding: 1rem;
  position: fixed;
  left: 0;
  right: 0;
  top: 0;
  z-index: 1000;
  box-sizing: border-box;
}

main {
  position: relative;
  z-index: 1;
  width: min(100% - 2rem, 1080px);
  margin: 0 auto;
  padding: 5.75rem 0 2rem;
  text-align: center;
  box-sizing: border-box;
}

.hero {
  padding-top: 2.25rem;
}

.hero h1 {
  margin-top: 0;
  line-height: 1.1;
}

main > section {
  position: relative;
  width: min(100%, 920px);
  margin: 0 auto 1.75rem;
  padding: 2rem clamp(1rem, 4vw, 3rem);
  background: linear-gradient(135deg, rgba(255,255,255,0.055), rgba(255,255,255,0.012) 45%, rgba(44,62,80,0.022));
  border: 1px solid rgba(255,255,255,0.28);
  border-radius: 18px;
  box-shadow: 0 16px 36px rgba(31,45,61,0.08), inset 0 1px 0 rgba(255,255,255,0.34), inset 0 -1px 0 rgba(255,255,255,0.08);
  backdrop-filter: blur(2px) saturate(112%);
  -webkit-backdrop-filter: blur(2px) saturate(112%);
  box-sizing: border-box;
  overflow: hidden;
  isolation: isolate;
}

main > section::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  border-radius: inherit;
  background:
    linear-gradient(120deg, rgba(255,255,255,0.18), rgba(255,255,255,0.035) 26%, transparent 48%),
    linear-gradient(180deg, rgba(255,255,255,0.16), transparent 34%);
}

main > section > * {
  position: relative;
  z-index: 1;
}

main > section:last-child {
  margin-bottom: 0;
}

.featured-upload-image {
  display: block;
  width: min(100%, 520px);
  margin: 1.5rem auto 2rem;
  border-radius: 8px;
  box-shadow: 0 18px 36px rgba(0,0,0,0.22);
}

.about-page .featured-upload-image,
main > .featured-upload-image {
  width: 150px;
}

.book-listings {
  width: min(100%, 1080px);
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1.25rem;
  align-items: stretch;
}

.book-item {
  display: flex;
  min-width: 0;
  height: 100%;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  gap: 0.75rem;
}

.book-item h3,
.book-item p {
  margin: 0;
}

.book-item p {
  flex: 1;
}

.book-item img,
.book-cover-placeholder {
  width: min(100%, 170px);
  aspect-ratio: 2 / 3;
  object-fit: cover;
  border-radius: 8px;
}

.book-cover-placeholder {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1rem;
  border: 1px solid rgba(255,255,255,0.3);
  background: rgba(255,255,255,0.08);
  box-sizing: border-box;
}

.book-grid {
  width: min(100%, 1080px);
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1.25rem;
  align-items: stretch;
  margin: 1.5rem auto 0;
}

.edition-grid .book-item {
  padding: 1rem;
  border: 1px solid rgba(255,255,255,0.28);
  border-radius: 18px;
  background: rgba(255,255,255,0.08);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.24);
}

.section-kicker {
  margin: 0 auto 0.75rem;
  color: #2c3e50;
  font-size: 0.85rem;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.collector-statement {
  width: min(100%, 980px);
}

.collector-statement p {
  width: min(100%, 720px);
  margin: 0.85rem auto;
}

.collector-statement strong {
  color: #172535;
  text-shadow: 0 1px 1px rgba(255,255,255,0.62);
}

.history-series {
  width: min(100%, 1080px);
  background:
    linear-gradient(135deg, rgba(255,255,255,0.075), rgba(255,255,255,0.018) 42%, rgba(44,62,80,0.048)),
    rgba(255,255,255,0.03);
}

.history-series .edition-grid .book-item {
  background:
    linear-gradient(145deg, rgba(255,255,255,0.13), rgba(255,255,255,0.035)),
    rgba(23,37,53,0.04);
  border-color: rgba(255,255,255,0.34);
}

.history-series .book-item img {
  width: min(100%, 210px);
  box-shadow: 0 14px 34px rgba(17, 28, 42, 0.22);
}

.history-era-label {
  display: inline-flex;
  min-height: 30px;
  align-items: center;
  justify-content: center;
  padding: 0.3rem 0.7rem;
  border: 1px solid rgba(44,62,80,0.18);
  border-radius: 999px;
  background: rgba(255,255,255,0.14);
  color: #172535;
  font-size: 0.82rem;
  font-weight: 900;
}

.book-action-row {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.75rem;
  margin-top: 1rem;
}

.edition-card-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.45rem;
  margin-top: auto;
}

.store-filter-bar {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.55rem;
  margin: 0.8rem auto 1rem;
}

.store-filter {
  min-height: 38px;
  padding: 0.5rem 0.85rem;
  border: 1px solid rgba(44,62,80,0.22);
  border-radius: 999px;
  background: rgba(255,255,255,0.14);
  color: #243444;
  cursor: pointer;
  font: inherit;
  font-size: 0.82rem;
  font-weight: 900;
}

.store-filter.active {
  background: rgba(39, 174, 96, 0.22);
  border-color: rgba(39, 174, 96, 0.42);
  color: #173b28;
}

.store-empty {
  grid-column: 1 / -1;
  color: #536679;
  font-weight: 900;
}

nav .nav-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  justify-content: center;
  align-items: center;
}

nav .nav-list li {
  margin: 0 1rem;
}

nav .nav-list li a {
  color: white;
  text-decoration: none;
  font-weight: 700;
  text-align: center;
}

/* Hamburger / responsive nav */
.nav-toggle {
  display: none;
  background: transparent;
  border: none;
  color: white;
  font-size: 1.5rem;
  position: absolute;
  left: 1rem;
  top: 0.75rem;
  z-index: 1100;
}

/* ── Tablet landscape / small desktop ── */
@media (max-width: 1024px){
  main {
    width: min(100% - 2rem, 1080px);
    padding: 5.75rem 0 2rem;
  }
  .book-listings { grid-template-columns: repeat(2, 1fr); }
  .book-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .music-product-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* ── Tablet / hamburger breakpoint ── */
@media (max-width: 800px){
  header {
    min-height: 56px;
    padding: 0.5rem 1rem;
  }
  .nav-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    padding: 0;
    top: 50%;
    transform: translateY(-50%);
    line-height: 1;
  }
  nav .nav-list {
    display: none; flex-direction: column;
    background: rgba(44,62,80,0.98);
    position: fixed; top: 56px; left: 0; right: 0;
    padding: 1rem; gap: 0.25rem;
  }
  nav .nav-list.show { display: flex; }
  nav .nav-list li { margin: 0.4rem 0; }
  nav .nav-list li a { font-size: 1.1rem; display: block; padding: 0.5rem 1rem; }
  .hero h1 { font-size: 2rem; }
  .book-listings { grid-template-columns: 1fr; }
  .book-grid { grid-template-columns: 1fr; }
  .music-product-grid { grid-template-columns: 1fr; }
  footer { grid-template-columns: 1fr 1fr; }
  section:not(.hero) { padding: 1rem; }
}

/* ── Small tablets / large phones ── */
@media (max-width: 600px){
  main {
    width: min(100% - 1rem, 1080px);
    padding: 1.5rem 0;
    margin-top: 60px;
  }
  .hero h1 { font-size: 1.8rem; }
  .hero p { font-size: 1rem; }
  footer { grid-template-columns: 1fr; text-align: center; }
  .book-grid { grid-template-columns: 1fr; }
  .book-listings img,
  .book-cover-placeholder { width: 120px; }
  .store-form-grid { grid-template-columns: 1fr; }
  main.about-page p { font-size: 1.1rem; }
}

/* ── Small phones ── */
@media (max-width: 480px){
  main {
    width: min(100% - 0.75rem, 1080px);
    padding: 1rem 0;
    margin-top: 56px;
  }
  .hero h1 { font-size: 1.5rem; }
  .hero p { font-size: 0.95rem; }
  section:not(.hero) { padding: 0.75rem; margin-bottom: 1rem; }
  .btn { padding: 0.6rem 1rem; font-size: 0.9rem; }
  form { margin: 1rem auto; padding: 0.75rem; }
  .book-listings img,
  .book-cover-placeholder { width: 100px; }
  footer { padding: 1.5rem 1rem; }
}

/* ── Donate button accent ── */
.donate-btn {
  background-color: #27ae60;
  font-size: 1.1rem;
  padding: 0.85rem 2rem;
}

.donate-btn:hover {
  background-color: #1e8449;
}

.music-store-page {
  width: min(100% - 2rem, 1180px);
}

.music-store-hero p {
  max-width: 42rem;
  margin: 0.75rem auto 0;
}

.store-alert {
  display: none;
  width: min(100%, 760px);
  margin: 1rem auto 0;
  padding: 0.85rem 1rem;
  border: 1px solid rgba(255,255,255,0.28);
  border-radius: 14px;
  background: rgba(255,255,255,0.12);
  color: #243444;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.35);
  box-sizing: border-box;
}

.store-alert.show {
  display: block;
}

.store-alert.success {
  border-color: rgba(66, 130, 91, 0.42);
  background: rgba(213, 240, 222, 0.22);
}

.store-alert.error {
  border-color: rgba(150, 55, 55, 0.46);
  background: rgba(255, 226, 226, 0.22);
}

.store-alert.notice {
  border-color: rgba(184, 143, 68, 0.46);
  background: rgba(255, 244, 214, 0.18);
}

.btn {
  display: inline-flex;
  min-height: 42px;
  align-items: center;
  justify-content: center;
  gap: 0.35rem;
  padding: 0.7rem 1rem;
  border: 1px solid rgba(44,62,80,0.24);
  border-radius: 14px;
  background:
    linear-gradient(135deg, rgba(255,255,255,0.22), rgba(255,255,255,0.08)),
    rgba(44,62,80,0.12);
  color: #172535;
  cursor: pointer;
  font: inherit;
  font-weight: 900;
  line-height: 1.1;
  text-align: center;
  text-decoration: none;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.28);
  box-sizing: border-box;
}

.btn:hover,
.btn:focus-visible {
  background:
    linear-gradient(135deg, rgba(255,255,255,0.30), rgba(255,255,255,0.12)),
    rgba(44,62,80,0.16);
  outline: none;
}

.danger-btn {
  background: linear-gradient(180deg, #8e2f2f, #6f2020);
  color: #fff;
}

.small-btn.danger-btn {
  background: rgba(142, 47, 47, 0.18);
  border-color: rgba(142, 47, 47, 0.34);
  color: #6f2020;
}

.music-store-shell,
.checkout-panel {
  width: min(100%, 1080px);
}

.music-product-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1.25rem;
  margin-top: 1.5rem;
}

.music-product-card {
  display: flex;
  min-width: 0;
  height: 100%;
  flex-direction: column;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,0.32);
  border-radius: 20px;
  background:
    linear-gradient(135deg, rgba(255,255,255,0.18), rgba(255,255,255,0.045) 42%, rgba(54,74,92,0.08)),
    rgba(255,255,255,0.08);
  box-shadow: 0 18px 34px rgba(31,45,61,0.1), inset 0 1px 0 rgba(255,255,255,0.32);
  backdrop-filter: blur(2px) saturate(114%);
  -webkit-backdrop-filter: blur(2px) saturate(114%);
}

.music-product-media,
.music-product-card img,
.music-product-card video {
  width: 100%;
  aspect-ratio: 4 / 3;
  display: block;
  object-fit: cover;
  background: rgba(10, 14, 24, 0.18);
}

.music-product-art-pending {
  display: grid;
  place-items: center;
  color: rgba(23, 37, 53, 0.72);
  background:
    linear-gradient(135deg, rgba(255,255,255,0.58), rgba(224,242,250,0.28)),
    rgba(255,255,255,0.24);
  border-bottom: 1px solid rgba(11,95,159,0.14);
  font-size: 0.78rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.music-product-body {
  display: flex;
  flex: 1;
  flex-direction: column;
  align-items: center;
  gap: 0.65rem;
  padding: 1rem;
}

.music-product-body h3,
.music-product-body p {
  margin: 0;
}

.music-product-format,
.music-product-category,
.music-product-status {
  font-size: 0.78rem;
  letter-spacing: 0;
  text-transform: uppercase;
}

.music-product-category {
  display: inline-flex;
  min-height: 28px;
  align-items: center;
  justify-content: center;
  padding: 0.25rem 0.65rem;
  border-radius: 999px;
  background: rgba(44,62,80,0.12);
  color: #172535;
}

.music-product-price {
  color: #204f38;
  font-size: 1.2rem;
  font-weight: 900;
}

.music-track-list {
  display: grid;
  gap: 0.35rem;
  width: 100%;
  margin: 0.25rem 0 0;
  padding: 0;
  list-style: none;
}

.music-track-list li {
  padding: 0.45rem 0.5rem;
  border-radius: 12px;
  background: rgba(255,255,255,0.11);
  border: 1px solid rgba(255,255,255,0.22);
}

.store-form {
  display: grid;
  gap: 1rem;
  width: min(100%, 760px);
  margin: 1.25rem auto 0;
}

.engagement-form {
  display: grid;
  gap: 1rem;
  width: min(100%, 760px);
  margin: 1.25rem auto 0;
}

.compact-form {
  width: min(100%, 520px);
}

.store-form-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
}

.store-form label,
.engagement-form label {
  display: grid;
  gap: 0.35rem;
  min-width: 0;
  color: #243444;
  font-weight: 900;
  text-align: center;
}

.store-form input,
.store-form select,
.engagement-form input,
.engagement-form select,
.engagement-form textarea {
  width: 100%;
  min-height: 44px;
  padding: 0.7rem 0.85rem;
  border: 1px solid rgba(44,62,80,0.28);
  border-radius: 12px;
  background: rgba(255,255,255,0.42);
  color: #172535;
  font: inherit;
  font-weight: 700;
  text-align: center;
  box-sizing: border-box;
}

.engagement-form textarea {
  min-height: 128px;
  resize: vertical;
}

.store-form input:focus,
.store-form select:focus,
.engagement-form input:focus,
.engagement-form select:focus,
.engagement-form textarea:focus {
  outline: 2px solid rgba(54, 109, 150, 0.42);
  outline-offset: 2px;
}

.preference-grid,
.amount-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.75rem;
  margin: 0;
  padding: 1rem;
  border: 1px solid rgba(255,255,255,0.28);
  border-radius: 18px;
  background:
    linear-gradient(135deg, rgba(255,255,255,0.14), rgba(255,255,255,0.04)),
    rgba(255,255,255,0.08);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.28);
  box-sizing: border-box;
}

.preference-grid legend,
.amount-grid legend {
  padding: 0 0.5rem;
  color: #243444;
  font-weight: 900;
}

.preference-grid label,
.amount-grid label {
  display: grid;
  grid-template-columns: 22px 1fr;
  align-items: center;
  gap: 0.5rem;
  min-height: 44px;
  padding: 0.55rem 0.7rem;
  border: 1px solid rgba(255,255,255,0.24);
  border-radius: 14px;
  background: rgba(255,255,255,0.1);
  text-align: left;
}

.preference-grid input,
.amount-grid input {
  width: 18px;
  min-height: 18px;
  margin: 0;
}

.shipping-options {
  display: grid;
  gap: 0.75rem;
}

.shipping-option {
  display: grid;
  grid-template-columns: 24px 1fr;
  align-items: center;
  gap: 0.75rem;
  padding: 0.85rem 1rem;
  border: 1px solid rgba(255,255,255,0.32);
  border-radius: 16px;
  background: rgba(255,255,255,0.12);
  text-align: center;
}

.shipping-option input {
  width: 18px;
  min-height: 18px;
  margin: 0;
}

.store-checkout-btn:disabled,
#quote-shipping:disabled,
.preorder-card-btn:disabled {
  cursor: not-allowed;
  opacity: 0.58;
}

.preorder-card-btn {
  margin-top: auto;
}

.merch-direct-page {
  min-height: 100vh;
}

.merch-direct-shell {
  width: min(100% - 2rem, 1120px);
}

.merch-direct-hero {
  width: min(100%, 860px);
}

.merch-direct-layout {
  display: grid;
  grid-template-columns: minmax(280px, 0.85fr) minmax(320px, 1fr);
  align-items: start;
  gap: clamp(1.25rem, 4vw, 2.5rem);
}

.merch-direct-preview {
  display: grid;
  gap: 0.75rem;
  margin: 0;
}

.merch-direct-preview img {
  width: 100%;
  display: block;
  border-radius: 18px;
  border: 1px solid rgba(255,255,255,0.34);
  box-shadow: 0 18px 38px rgba(31,45,61,0.16);
}

.merch-direct-preview figcaption {
  color: rgba(23,37,53,0.72);
  font-weight: 900;
}

.merch-direct-details {
  display: grid;
  gap: 0.8rem;
}

.merch-direct-details h2,
.merch-direct-details p {
  margin: 0;
}

@media (max-width: 820px) {
  .merch-direct-layout {
    grid-template-columns: 1fr;
  }
}

.preference-center-page {
  width: min(100% - 2rem, 920px);
}

.preference-center-shell,
.preference-hero {
  width: min(100%, 820px);
}

.preference-center-shell h2,
.preference-center-shell p {
  margin-left: auto;
  margin-right: auto;
  max-width: 42rem;
}

.privacy {
  color: rgba(23, 37, 53, 0.68);
  font-size: 0.88rem;
  font-weight: 800;
}

.updates-page {
  width: min(100% - 2rem, 1040px);
}

.updates-shell,
.updates-hero {
  width: min(100%, 940px);
}

.updates-list {
  display: grid;
  gap: 1rem;
  margin-top: 1rem;
}

.update-card {
  display: grid;
  gap: 0.75rem;
  padding: 1.1rem;
  border: 1px solid rgba(44,62,80,0.14);
  border-radius: 18px;
  background:
    linear-gradient(135deg, rgba(255,255,255,0.16), rgba(255,255,255,0.045)),
    rgba(255,255,255,0.09);
  text-align: left;
}

.update-card h3,
.update-card p {
  margin: 0;
}

.update-card-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem;
  color: #536679;
  font-size: 0.78rem;
  font-weight: 900;
  text-transform: uppercase;
}

.update-summary {
  color: #243444;
  font-weight: 900;
}

.admin-page {
  width: min(100% - 2rem, 1280px);
}

.admin-dashboard {
  width: min(100%, 1200px);
}

.admin-login-panel,
.admin-dashboard {
  margin-left: auto;
  margin-right: auto;
}

.admin-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  text-align: center;
}

.admin-heading h1,
.admin-heading p {
  margin: 0;
}

.admin-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.6rem;
}


.admin-quick-filters {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.55rem;
  margin-bottom: 0.85rem;
}

.admin-quick-filter {
  min-height: 34px;
  padding: 0.4rem 0.7rem;
  border: 1px solid rgba(44,62,80,0.18);
  border-radius: 999px;
  background: rgba(255,255,255,0.14);
  color: #172535;
  font: inherit;
  font-size: 0.75rem;
  font-weight: 900;
  cursor: pointer;
}

.admin-incoming-call-banner {
  margin: 0 0 0.75rem;
  padding: 0.7rem 0.8rem;
  border-radius: 12px;
  border: 1px solid rgba(180, 62, 62, 0.56);
  background: linear-gradient(180deg, rgba(122, 8, 8, 0.2), rgba(60, 7, 7, 0.3));
  display: grid;
  gap: 0.35rem;
}

.admin-incoming-call-banner strong {
  color: #f9d1d1;
  font: 800 0.9rem/1.25 "Lato", Arial, sans-serif;
  letter-spacing: 0.03em;
  text-transform: uppercase;
}

.admin-incoming-call-banner span {
  color: #e8c9c9;
  font-size: 0.84rem;
}

.admin-incoming-call-banner .btn.small-btn {
  width: max-content;
}

.admin-messenger-call-waiting {
  color: #f2b6b6;
  font: 700 0.72rem/1.3 "Lato", Arial, sans-serif;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.admin-quick-filter:hover {
  background: rgba(225,238,255,0.34);
}

.admin-bulk-bar {
  display: flex;
  flex-wrap: wrap;
  align-items: end;
  justify-content: center;
  gap: 0.7rem;
  margin: 0 0 0.9rem;
  padding: 0.75rem;
  border: 1px solid rgba(44,62,80,0.14);
  border-radius: 16px;
  background: rgba(255,255,255,0.14);
}

.admin-bulk-bar strong {
  color: #172535;
  font-size: 0.84rem;
}
.admin-summary-grid {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 0.85rem;
  margin: 1.25rem 0;
}

.admin-workspace-bar {
  display: flex;
  flex-wrap: wrap;

.admin-table th:first-child,
.admin-table td:first-child {
  width: 42px;
}

.admin-row-select,
#admin-select-all {
  width: 18px;
  height: 18px;
}
  justify-content: center;
  gap: 0.6rem;
  margin: 1rem 0 0;
}

.admin-workspace-chip,
.account-nav-chip {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 38px;
  padding: 0.5rem 0.9rem;
  border: 1px solid rgba(44,62,80,0.18);
  border-radius: 999px;
  background: rgba(255,255,255,0.14);
  color: #172535;
  font: inherit;
  font-size: 0.8rem;
  font-weight: 900;
  text-decoration: none;
  cursor: pointer;
}

.admin-workspace-chip:hover,
.account-nav-chip:hover {
  background: rgba(225,238,255,0.34);
}

.admin-overview-section {
  scroll-margin-top: 6.5rem;
}

.admin-summary-card {
  display: grid;
  gap: 0.25rem;
  min-height: 86px;
  align-content: center;
  padding: 1rem;
  border: 1px solid rgba(255,255,255,0.28);
  border-radius: 18px;
  background:
    linear-gradient(135deg, rgba(255,255,255,0.15), rgba(255,255,255,0.045)),
    rgba(255,255,255,0.08);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.28);
  cursor: pointer;
  font: inherit;
  text-align: center;
}

.admin-summary-card strong {
  color: #172535;
  font-size: 1.35rem;
}

.admin-summary-card span {
  color: #34475a;
  font-size: 0.78rem;
  font-weight: 900;
  letter-spacing: 0;
  text-transform: uppercase;
}

.admin-summary-card small {
  color: #536679;
  font-size: 0.72rem;
  font-weight: 800;
}

.admin-ops-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  align-items: start;
  gap: 1rem;
  margin: 1rem 0;
}

.admin-focus-queue {
  display: grid;
  gap: 0.75rem;
  margin-top: 0.85rem;
}

.admin-focus-item {
  display: grid;
  gap: 0.2rem;
  justify-items: start;
  padding: 0.9rem 1rem;
  border: 1px solid rgba(44,62,80,0.16);
  border-radius: 16px;
  background: rgba(255,255,255,0.14);
  color: #172535;
  font: inherit;
  text-align: left;
  cursor: pointer;
}

.admin-focus-item span {
  font-size: 1.25rem;
  font-weight: 900;
}

.admin-focus-item small {
  color: #536679;
  font-size: 0.8rem;
  font-weight: 800;
}

.admin-focus-item.urgent {
  background: rgba(192, 57, 43, 0.10);
}

.admin-focus-item.warm {
  background: rgba(241, 196, 15, 0.14);
}

.admin-focus-item.calm {
  background: rgba(39, 174, 96, 0.10);
}

.admin-panel,
.admin-records-panel,
.admin-detail-panel {
  border: 1px solid rgba(255,255,255,0.30);
  border-radius: 22px;
  background:
    linear-gradient(135deg, rgba(255,255,255,0.16), rgba(255,255,255,0.05)),
    rgba(255,255,255,0.10);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.35),
    0 18px 50px rgba(18, 30, 44, 0.12);
  padding: 1rem;
}

.admin-panel,
.admin-records-panel,
.admin-overview-section {
  align-self: start;
}

.admin-panel-heading h2,
.admin-detail-heading h2 {
  margin: 0;
  color: #172535;
  font-size: 1.1rem;
}

.admin-panel-heading,
.admin-section-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.8rem;
}

.admin-section-heading {
  margin-bottom: 0.75rem;
}

.admin-section-heading h2 {
  margin: 0;
  color: #172535;
  font-size: 1.06rem;
}

.admin-collapse-toggle {
  min-height: 32px;
  padding: 0.35rem 0.7rem;
  border: 1px solid rgba(44,62,80,0.2);
  border-radius: 999px;
  background: rgba(255,255,255,0.16);
  color: #172535;
  font: inherit;
  font-size: 0.76rem;
  font-weight: 900;
  cursor: pointer;
}

.admin-collapse-toggle:hover {
  background: rgba(225,238,255,0.34);
}

.admin-panel.collapsed,
.admin-records-panel.collapsed,
.admin-overview-section.collapsed {
  padding: 0.72rem 0.86rem;
  min-height: 0;
  overflow: hidden;
}

.admin-panel.collapsed .admin-panel-heading,
.admin-records-panel.collapsed .admin-section-heading,
.admin-overview-section.collapsed .admin-section-heading {
  margin-bottom: 0;
}

.admin-health-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.65rem;
  margin-top: 0.8rem;
}

.admin-health-item {
  display: grid;
  gap: 0.2rem;
  min-height: 72px;
  align-content: center;
  padding: 0.75rem;
  border-radius: 16px;
  border: 1px solid rgba(44,62,80,0.16);
}

.admin-health-item.ready {
  background: rgba(39, 174, 96, 0.14);
}

.admin-health-item.attention {
  background: rgba(192, 57, 43, 0.12);
}

.admin-health-item strong {
  color: #172535;
  font-size: 0.9rem;
}

.admin-health-item span,
.admin-missing,
.admin-empty {
  color: #536679;
  font-size: 0.82rem;
  font-weight: 800;
}

.admin-provider-status {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
  grid-column: 1 / -1;
  justify-content: center;
  padding: 0.75rem;
  border: 1px solid rgba(44,62,80,0.14);
  border-radius: 16px;
  background: rgba(255,255,255,0.10);
}

.admin-provider-status strong {
  width: 100%;
  color: #172535;
}

.admin-provider-status span {
  padding: 0.3rem 0.55rem;
  border-radius: 999px;
  color: #243444;
  font-size: 0.75rem;
  font-weight: 900;
}

.admin-provider-status span.ready {
  background: rgba(39, 174, 96, 0.18);
  color: #173b28;
}

.admin-provider-status span.attention {
  background: rgba(241, 196, 15, 0.20);
  color: #5f4700;
}

.admin-missing {
  margin: 0.85rem 0 0;
  overflow-wrap: anywhere;
}

.admin-activity-list {
  display: grid;
  gap: 0.65rem;
  margin-top: 0.8rem;
  max-height: 360px;
  overflow: auto;
}

.admin-activity-item {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 0.75rem;
  align-items: center;
  padding: 0.75rem;
  border: 1px solid rgba(44,62,80,0.14);
  border-radius: 16px;
  background: rgba(255,255,255,0.12);
}

.admin-activity-item div {
  display: grid;
  gap: 0.18rem;
}

.admin-activity-item strong {
  color: #172535;
  font-size: 0.88rem;
}

.admin-activity-item span,
.admin-activity-item small {
  color: #536679;
  font-size: 0.78rem;
  font-weight: 800;
}

.admin-records-panel {
  margin-top: 1rem;
}

.admin-controls {
  display: grid;
  grid-template-columns: minmax(220px, 1fr) repeat(4, minmax(120px, 160px)) auto;
  align-items: end;
  gap: 1rem;
  margin-top: 1rem;
}

.admin-tabs {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.5rem;
}

.admin-tab {
  min-height: 42px;
  padding: 0.65rem 0.85rem;
  border: 1px solid rgba(44,62,80,0.24);
  border-radius: 14px;
  background: rgba(255,255,255,0.16);
  color: #243444;
  cursor: pointer;
  font: inherit;
  font-weight: 900;
}

.admin-tab.active {
  background: rgba(39, 174, 96, 0.22);
  border-color: rgba(39, 174, 96, 0.42);
  color: #173b28;
}

.admin-search {
  display: grid;
  gap: 0.35rem;
  color: #243444;
  font-weight: 900;
}

.admin-filter {
  display: grid;
  gap: 0.35rem;
  color: #243444;
  font-weight: 900;
}

.admin-search input,
.admin-filter select,
.admin-row-status {
  width: 100%;
  min-height: 42px;
  padding: 0.65rem 0.85rem;
  border: 1px solid rgba(44,62,80,0.28);
  border-radius: 12px;
  background: rgba(255,255,255,0.42);
  color: #172535;
  font: inherit;
  font-weight: 700;
  text-align: center;
  box-sizing: border-box;
}

.admin-record-toolbar {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  margin-top: 1rem;
  color: #34475a;
  font-size: 0.88rem;
  font-weight: 900;
}

.admin-table-wrap {
  width: 100%;
  margin-top: 1rem;
  overflow-x: auto;
  border: 1px solid rgba(255,255,255,0.28);
  border-radius: 18px;
  background: rgba(255,255,255,0.08);
}

.admin-table {
  width: 100%;
  min-width: 860px;
  border-collapse: collapse;
}

.admin-table th,
.admin-table td {
  max-width: 260px;
  padding: 0.75rem;
  border-bottom: 1px solid rgba(44,62,80,0.16);
  color: #172535;
  text-align: center;
  vertical-align: top;
  overflow-wrap: anywhere;
}

.admin-table th {
  background: rgba(255,255,255,0.16);
  font-size: 0.78rem;
  letter-spacing: 0;
  text-transform: uppercase;
}

.admin-sort {
  border: 0;
  background: transparent;
  color: #172535;
  cursor: pointer;
  font: inherit;
  font-weight: 900;
  text-transform: uppercase;
}

.admin-table tr:last-child td {
  border-bottom: 0;
}

.admin-row-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.4rem;
}

.small-btn {
  min-height: 34px;
  padding: 0.45rem 0.65rem;
  font-size: 0.78rem;
}

.admin-status-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 30px;
  padding: 0.3rem 0.6rem;
  border-radius: 999px;
  background: rgba(44,62,80,0.11);
  color: #243444;
  font-size: 0.76rem;
  font-weight: 900;
}

.admin-status-badge.status-paid,
.admin-status-badge.status-ready,
.admin-status-badge.status-submitted,
.admin-status-badge.status-subscribed,
.admin-status-badge.status-delivered,
.admin-status-badge.status-sent,
.admin-status-badge.status-opened,
.admin-status-badge.status-clicked,
.admin-status-badge.status-replied,
.admin-status-badge.status-published {
  background: rgba(39, 174, 96, 0.18);
  color: #173b28;
}

.admin-status-badge.status-new,
.admin-status-badge.status-unread,
.admin-status-badge.status-read,
.admin-status-badge.status-delivery-delayed,
.admin-status-badge.status-review-required,
.admin-status-badge.status-checkout-created,
.admin-status-badge.status-planned,
.admin-status-badge.status-in-progress,
.admin-status-badge.status-sending,
.admin-status-badge.status-queued,
.admin-status-badge.status-sent-with-errors {
  background: rgba(241, 196, 15, 0.20);
  color: #5f4700;
}

.admin-status-badge.status-failed,
.admin-status-badge.status-bounced,
.admin-status-badge.status-complained,
.admin-status-badge.status-archived,
.admin-status-badge.status-cancelled,
.admin-status-badge.status-unsubscribed {
  background: rgba(192, 57, 43, 0.14);
  color: #6b1f16;
}

.admin-detail-panel {
  margin-top: 1rem;
}

.admin-detail-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
}

.admin-detail-heading p {
  margin: 0.2rem 0 0;
  color: #536679;
  font-weight: 800;
  overflow-wrap: anywhere;
}

.admin-detail-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.6rem;
  margin: 1rem 0;
}

.admin-email-composer {
  display: grid;
  gap: 0.85rem;
  margin: 1rem 0;
  padding: 1rem;
  border: 1px solid rgba(44,62,80,0.16);
  border-radius: 18px;
  background:
    linear-gradient(135deg, rgba(255,255,255,0.20), rgba(255,255,255,0.08)),
    rgba(255,255,255,0.12);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.28);
}

.admin-email-composer[hidden] {
  display: none;
}

.admin-tool-form {
  display: grid;
  gap: 0.75rem;
  margin-top: 0.8rem;
}

.admin-divider-form {
  margin-top: 1rem;
  padding-top: 1rem;
  border-top: 1px solid rgba(44,62,80,0.14);
}

.admin-tool-form label {
  display: grid;
  gap: 0.35rem;
  color: #243444;
  font-weight: 900;
}

.admin-tool-form input,
.admin-tool-form select,
.admin-tool-form textarea {
  width: 100%;
  min-height: 42px;
  padding: 0.7rem 0.85rem;
  border: 1px solid rgba(44,62,80,0.28);
  border-radius: 12px;
  background: rgba(255,255,255,0.42);
  color: #172535;
  font: inherit;
  font-weight: 700;
  text-align: center;
  box-sizing: border-box;
}

.admin-tool-form textarea {
  resize: vertical;
  text-align: left;
}

.admin-mini-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.75rem;
}

.admin-composer-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.85rem;
}

.admin-email-composer label {
  display: grid;
  gap: 0.35rem;
  color: #243444;
  font-weight: 900;
  text-align: left;
}

.admin-email-composer input,
.admin-email-composer textarea {
  width: 100%;
  min-height: 42px;
  padding: 0.75rem 0.85rem;
  border: 1px solid rgba(44,62,80,0.28);
  border-radius: 12px;
  background: rgba(255,255,255,0.52);
  color: #172535;
  font: inherit;
  font-weight: 700;
  box-sizing: border-box;
}

.admin-email-composer textarea {
  resize: vertical;
  text-align: left;
}

.admin-composer-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.65rem;
}

.admin-note-form {
  display: grid;
  gap: 0.7rem;
  margin: 1rem 0;
  padding: 1rem;
  border: 1px solid rgba(44,62,80,0.14);
  border-radius: 18px;
  background: rgba(255,255,255,0.10);
}

.admin-note-form label {
  display: grid;
  gap: 0.35rem;
  color: #243444;
  font-weight: 900;
  text-align: left;
}

.admin-note-form textarea {
  width: 100%;
  min-height: 96px;
  padding: 0.75rem 0.85rem;
  border: 1px solid rgba(44,62,80,0.28);
  border-radius: 12px;
  background: rgba(255,255,255,0.52);
  color: #172535;
  font: inherit;
  font-weight: 700;
  resize: vertical;
  box-sizing: border-box;
}

.admin-messenger-workspace {
  display: grid;
  grid-template-columns: minmax(260px, 0.34fr) 1fr;
  gap: 1rem;
  margin-top: 0.9rem;
}

.admin-messenger-thread-rail,
.admin-messenger-chat {
  border: 1px solid rgba(44,62,80,0.15);
  border-radius: 18px;
  background:
    linear-gradient(135deg, rgba(255,255,255,0.2), rgba(255,255,255,0.08)),
    rgba(255,255,255,0.14);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.3);
}

.admin-messenger-thread-rail {
  display: grid;
  grid-template-rows: auto 1fr;
  max-height: 74vh;
}

.admin-messenger-rail-heading {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 0.75rem;
  padding: 0.85rem;
  border-bottom: 1px solid rgba(44,62,80,0.12);
}

.admin-messenger-rail-heading h3 {
  margin: 0;
  color: #172535;
  font-size: 0.96rem;
}

.admin-messenger-rail-heading span {
  color: #425a6e;
  font-size: 0.75rem;
  font-weight: 900;
}

.admin-messenger-thread-list {
  display: grid;
  gap: 0.55rem;
  padding: 0.75rem;
  overflow-y: auto;
}

.admin-messenger-thread-item {
  display: grid;
  grid-template-columns: 34px 1fr;
  align-items: center;
  gap: 0.6rem;
  min-height: 60px;
  padding: 0.55rem;
  border: 1px solid rgba(44,62,80,0.14);
  border-radius: 14px;
  background: rgba(255,255,255,0.22);
  color: #172535;
  text-align: left;
  cursor: pointer;
}

.admin-messenger-thread-item.active {
  border-color: rgba(67,124,188,0.52);
  background:
    linear-gradient(135deg, rgba(227, 240, 255, 0.92), rgba(255,255,255,0.2)),
    rgba(227, 240, 255, 0.45);
}

.admin-messenger-thread-avatar {
  width: 34px;
  height: 34px;
  border-radius: 999px;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,0.36);
  display: grid;
}

.admin-messenger-thread-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.admin-messenger-thread-copy {
  display: grid;
  min-width: 0;
  gap: 0.1rem;
}

.admin-messenger-thread-copy strong,
.admin-messenger-thread-copy span,
.admin-messenger-thread-copy small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.admin-messenger-thread-copy span,
.admin-messenger-thread-copy small {
  color: #52687c;
  font-weight: 800;
  font-size: 0.76rem;
}

.admin-messenger-chat {
  display: grid;
  grid-template-rows: auto 1fr auto;
  min-height: 520px;
  max-height: 74vh;
}

.admin-messenger-chat-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 0.8rem;
  padding: 0.85rem 0.9rem;
  border-bottom: 1px solid rgba(44,62,80,0.12);
}

.admin-messenger-chat-header h3 {
  margin: 0;
  color: #172535;
}

.admin-messenger-chat-header p {
  margin: 0.2rem 0 0;
  color: #52687c;
  font-weight: 800;
}

.admin-messenger-chat-messages {
  display: grid;
  gap: 0.75rem;
  padding: 0.85rem;
  overflow-y: auto;
}

.admin-messenger-chat-message {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr);
  align-items: end;
  gap: 0.55rem;
}

.admin-messenger-chat-avatar {
  width: 34px;
  height: 34px;
  border-radius: 999px;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,0.34);
  background: rgba(255,255,255,0.15);
  display: grid;
  place-items: center;
}

.admin-messenger-chat-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.admin-messenger-chat-avatar span {
  color: #ecf6ff;
  font-size: 0.56rem;
  font-weight: 900;
  text-transform: uppercase;
}

.admin-messenger-chat-bubble {
  width: min(88%, 700px);
  padding: 0.78rem 0.84rem;
  border-radius: 16px;
  border: 1px solid rgba(44,62,80,0.14);
}

.admin-messenger-chat-message.from-visitor .admin-messenger-chat-bubble {
  background: rgba(255,255,255,0.24);
}

.admin-messenger-chat-message.from-admin {
  justify-self: end;
}

.admin-messenger-chat-message.from-admin .admin-messenger-chat-avatar {
  grid-column: 2;
  justify-self: end;
}

.admin-messenger-chat-message.from-admin .admin-messenger-chat-bubble {
  grid-column: 1;
  grid-row: 1;
  justify-self: end;
  color: #edf7ff;
  border-color: rgba(255,255,255,0.22);
  background: linear-gradient(135deg, rgba(49,92,174,0.94), rgba(70,129,220,0.9));
}

.admin-messenger-chat-top,
.admin-messenger-chat-bottom {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 0.65rem;
}

.admin-messenger-chat-top span,
.admin-messenger-chat-bottom small {
  font-size: 0.76rem;
  font-weight: 900;
  opacity: 0.74;
}

.admin-messenger-chat-bubble p {
  margin: 0.25rem 0;
  line-height: 1.5;
  font-weight: 800;
  white-space: pre-wrap;
}

.admin-messenger-inline-reply {
  display: grid;
  gap: 0.55rem;
  padding: 0.8rem;
  border-top: 1px solid rgba(44,62,80,0.12);
}

.admin-messenger-inline-reply textarea {
  width: 100%;
  min-height: 96px;
  padding: 0.75rem 0.82rem;
  border: 1px solid rgba(44,62,80,0.22);
  border-radius: 14px;
  background: rgba(255,255,255,0.48);
  color: #172535;
  font: inherit;
  font-weight: 700;
  resize: vertical;
  box-sizing: border-box;
}

@media (max-width: 1024px) {
  .admin-messenger-workspace {
    grid-template-columns: 1fr;
  }

  .admin-messenger-thread-rail {
    max-height: 360px;
  }
}

@media (max-width: 800px) {
  .admin-messenger-chat {
    min-height: 420px;
    max-height: none;
  }

  .admin-messenger-chat-header,
  .admin-messenger-chat-top,
  .admin-messenger-chat-bottom {
    display: grid;
    grid-template-columns: 1fr;
    text-align: center;
  }

  .admin-messenger-chat-message,
  .admin-messenger-chat-message.from-admin {
    justify-self: stretch;
  }

  .admin-messenger-chat-message.from-admin .admin-messenger-chat-avatar {
    grid-column: 1;
    justify-self: center;
  }

  .admin-messenger-chat-message.from-admin .admin-messenger-chat-bubble {
    grid-column: 1;
    grid-row: 2;
    justify-self: center;
    width: 100%;
  }

  .admin-messenger-chat-bubble {
    width: 100%;
    text-align: left;
  }
}

.admin-thread-view {
  margin: 1rem 0;
}

.admin-thread-card {
  display: grid;
  gap: 0.9rem;
  padding: 1rem;
  border: 1px solid rgba(44,62,80,0.16);
  border-radius: 18px;
  background:
    linear-gradient(135deg, rgba(255,255,255,0.18), rgba(255,255,255,0.07)),
    rgba(255,255,255,0.10);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.24);
}

.admin-thread-switcher {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
  gap: 0.5rem;
}

.admin-thread-switch {
  display: grid;
  grid-template-columns: 32px 1fr;
  align-items: center;
  gap: 0.5rem;
  min-height: 44px;
  padding: 0.45rem 0.55rem;
  border: 1px solid rgba(44,62,80,0.14);
  border-radius: 14px;
  background: rgba(255,255,255,0.2);
  text-align: left;
  cursor: pointer;
}

.admin-thread-switch.active {
  border-color: rgba(64, 125, 191, 0.52);
  background: rgba(220, 236, 255, 0.42);
}

.admin-thread-switch-avatar {
  width: 32px;
  height: 32px;
  border-radius: 999px;
  overflow: hidden;
  display: grid;
  border: 1px solid rgba(255,255,255,0.34);
}

.admin-thread-switch-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.admin-thread-switch-copy {
  display: grid;
  min-width: 0;
}

.admin-thread-switch-copy strong,
.admin-thread-switch-copy small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.admin-thread-switch-copy small {
  color: #52687c;
  font-weight: 900;
}

.admin-thread-heading {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  align-items: flex-start;
  text-align: left;
}

.admin-thread-heading h3 {
  margin: 0;
  color: #172535;
  font-size: 1rem;
}

.admin-thread-heading p {
  margin: 0.25rem 0 0;
  color: #536679;
  font-weight: 900;
  overflow-wrap: anywhere;
}

.admin-thread-meta {
  display: grid;
  gap: 0.2rem;
  justify-items: end;
  color: #536679;
  font-size: 0.78rem;
  font-weight: 900;
  text-align: right;
}

.admin-thread-messages {
  display: grid;
  gap: 0.75rem;
}

.admin-thread-message {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: end;
  gap: 0.5rem;
  width: 100%;
  text-align: left;
  overflow-wrap: anywhere;
}

.admin-thread-avatar {
  width: 34px;
  height: 34px;
  border-radius: 999px;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,0.28);
  background: rgba(255,255,255,0.14);
  display: grid;
  place-items: center;
}

.admin-thread-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.admin-thread-avatar span {
  color: #eef7ff;
  font-size: 0.56rem;
  font-weight: 900;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

.admin-thread-bubble {
  width: min(90%, 680px);
  padding: 0.85rem;
  border: 1px solid rgba(44,62,80,0.14);
  border-radius: 18px;
}

.admin-thread-message.from-visitor {
  justify-self: start;
}

.admin-thread-message.from-visitor .admin-thread-bubble {
  background: rgba(255,255,255,0.18);
}

.admin-thread-message.from-admin {
  justify-self: end;
}

.admin-thread-message.from-admin .admin-thread-avatar {
  grid-column: 2;
  justify-self: end;
}

.admin-thread-message.from-admin .admin-thread-bubble {
  grid-column: 1;
  grid-row: 1;
  justify-self: end;
  color: #edf7ff;
  background: linear-gradient(135deg, rgba(48,90,170,0.92), rgba(71,128,218,0.88));
  border-color: rgba(255,255,255,0.20);
}

.admin-thread-message-top,
.admin-thread-message-bottom {
  display: flex;
  justify-content: space-between;
  gap: 0.65rem;
  align-items: center;
}

.admin-thread-message-top strong {
  color: inherit;
}

.admin-thread-message-top span,
.admin-thread-message-bottom small {
  color: inherit;
  opacity: 0.72;
  font-size: 0.78rem;
  font-weight: 900;
}

.admin-thread-message p {
  margin: 0;
  color: inherit;
  font-weight: 800;
  line-height: 1.5;
  white-space: pre-wrap;
}

.admin-record-notes {
  display: grid;
  gap: 0.65rem;
  margin: 1rem 0;
}

.admin-record-notes h3 {
  margin: 0;
  color: #172535;
  font-size: 1rem;
}

.admin-note-item {
  display: grid;
  gap: 0.25rem;
  padding: 0.85rem;
  border: 1px solid rgba(44,62,80,0.14);
  border-radius: 16px;
  background: rgba(255,255,255,0.12);
  text-align: left;
}

.admin-note-item strong,
.admin-note-item span {
  color: #536679;
  font-size: 0.78rem;
  font-weight: 900;
}

.admin-note-item p {
  margin: 0.3rem 0 0;
  color: #172535;
  font-weight: 800;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}

.admin-detail-list {
  display: grid;
  gap: 0.65rem;
  margin: 0;
}

.admin-detail-row {
  display: grid;
  grid-template-columns: minmax(120px, 0.28fr) 1fr;
  gap: 0.75rem;
  padding: 0.75rem;
  border-radius: 14px;
  background: rgba(255,255,255,0.12);
  border: 1px solid rgba(44,62,80,0.12);
  text-align: left;
}

.admin-detail-row dt {
  color: #34475a;
  font-weight: 900;
}

.admin-detail-row dd {
  margin: 0;
  color: #172535;
  font-weight: 700;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}

.account-page {
  width: min(100% - 2rem, 1040px);
}

.account-panel,
.account-dashboard,
.account-section {
  width: min(100%, 980px);
  margin-left: auto;
  margin-right: auto;
  border: 1px solid rgba(110, 16, 16, 0.42);
  border-radius: 22px;
  background: rgba(0, 0, 0, 0.48);
  backdrop-filter: blur(18px) saturate(130%);
  -webkit-backdrop-filter: blur(18px) saturate(130%);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.08),
    0 18px 50px rgba(0, 0, 0, 0.36);
  padding: 1.25rem;
}

.account-dashboard {
  display: grid;
  gap: 1rem;
}

.account-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
}

.account-heading h1,
.account-heading p,
.account-section h2 {
  margin: 0;
}

.account-entry-panel {
  display: grid;
  gap: 1rem;
  text-align: center;
}

.account-entry-heading {
  display: grid;
  gap: 0.45rem;
  justify-items: center;
}

.account-entry-heading span {
  color: #3e5368;
  font-size: 0.75rem;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: 0.1em;
}

.account-entry-heading h1 {
  margin: 0;
}

.account-entry-heading p,
.account-form-note {
  max-width: 720px;
  margin: 0;
  color: #536679;
  font-weight: 800;
  line-height: 1.55;
}

.account-auth-options {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.75rem;
}

.account-auth-tab {
  display: grid;
  gap: 0.2rem;
  min-height: 78px;
  padding: 0.85rem;
  border: 1px solid rgba(44,62,80,0.16);
  border-radius: 18px;
  color: #172535;
  background:
    linear-gradient(135deg, rgba(255,255,255,0.24), rgba(255,255,255,0.08)),
    rgba(255,255,255,0.12);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.28);
  cursor: pointer;
  text-align: center;
}

.account-auth-tab.active {
  border-color: rgba(75,126,220,0.52);
  background:
    linear-gradient(135deg, rgba(226,240,255,0.48), rgba(255,255,255,0.16)),
    rgba(255,255,255,0.18);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.36),
    0 12px 30px rgba(61,102,170,0.12);
}

.account-auth-tab strong {
  font-family: 'Playfair Display', serif;
  font-size: 1.08rem;
}

.account-auth-tab span {
  color: #536679;
  font-size: 0.78rem;
  font-weight: 900;
  text-transform: uppercase;
}

.account-auth-form {
  max-width: 620px;
  margin-left: auto;
  margin-right: auto;
}

.account-auth-form[hidden] {
  display: none !important;
}

.account-summary-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0.85rem;
}

.account-dashboard-nav {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.6rem;
}

.account-section-heading {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  text-align: left;
}

.account-section-heading p {
  margin: 0.2rem 0 0;
  color: #536679;
  font-weight: 800;
}

.account-next-steps {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 0.85rem;
  margin-top: 0.85rem;
}

.account-next-step-card {
  display: grid;
  gap: 0.55rem;
  padding: 1rem;
  border: 1px solid rgba(44,62,80,0.14);
  border-radius: 18px;
  background: rgba(255,255,255,0.14);
  text-align: left;
}

.account-next-step-card strong {
  color: #172535;
}

.account-next-step-card p {
  margin: 0;
  color: #536679;
  font-weight: 800;
}

.account-summary-card {
  display: grid;
  gap: 0.25rem;
  min-height: 82px;
  align-content: center;
  padding: 1rem;
  border: 1px solid rgba(255,255,255,0.28);
  border-radius: 18px;
  background: rgba(255,255,255,0.12);
  text-align: center;
}

.account-summary-card strong {
  color: #172535;
  font-size: 1.2rem;
}

.account-summary-card span {
  color: #536679;
  font-size: 0.78rem;
  font-weight: 900;
  text-transform: uppercase;
}

.account-record-list {
  display: grid;
  gap: 0.75rem;
  margin-top: 0.85rem;
}

.account-record {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 0.85rem 1rem;
  border: 1px solid rgba(44,62,80,0.14);
  border-radius: 16px;
  background: rgba(255,255,255,0.12);
  color: #172535;
}

.account-record span,
.account-empty {
  color: #536679;
  font-weight: 800;
}

.account-record .small-btn {
  flex: 0 0 auto;
}

.account-release-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.account-release-card {
  display: grid;
  grid-template-columns: 96px 1fr;
  gap: 0.85rem;
  align-items: center;
  padding: 0.85rem;
  border: 1px solid rgba(44,62,80,0.14);
  border-radius: 16px;
  background: rgba(255,255,255,0.12);
  color: #172535;
  text-align: left;
}

.account-release-card img {
  width: 96px;
  aspect-ratio: 1 / 1;
  object-fit: cover;
  border-radius: 12px;
}

.account-release-card div {
  display: grid;
  gap: 0.3rem;
  justify-items: start;
}

.owner-messenger-section {
  display: grid;
  gap: 1rem;
}

.owner-messenger-heading {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 1rem;
  text-align: left;
}

.owner-messenger-heading p {
  margin: 0.2rem 0 0;
  color: #536679;
  font-weight: 800;
}

.owner-messenger-stats {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0.75rem;
}

.owner-messenger-stats article {
  display: grid;
  gap: 0.2rem;
  min-height: 74px;
  align-content: center;
  padding: 0.8rem;
  border: 1px solid rgba(44,62,80,0.14);
  border-radius: 16px;
  background: rgba(255,255,255,0.14);
  text-align: center;
}

.owner-messenger-stats strong {
  color: #172535;
  font-size: 1.18rem;
}

.owner-messenger-stats span {
  color: #536679;
  font-size: 0.72rem;
  font-weight: 900;
  text-transform: uppercase;
}

.owner-messenger-grid {
  display: grid;
  grid-template-columns: minmax(220px, 0.34fr) 1fr;
  gap: 1rem;
  align-items: start;
}

.owner-messenger-grid h3 {
  margin: 0 0 0.65rem;
  color: #172535;
  font-size: 1rem;
  text-align: left;
}

.owner-messenger-search {
  display: grid;
  gap: 0.35rem;
  margin-bottom: 0.7rem;
  color: #34475a;
  font-size: 0.72rem;
  font-weight: 900;
  text-align: left;
  text-transform: uppercase;
}

.owner-messenger-search input {
  width: 100%;
  min-height: 42px;
  border: 1px solid rgba(44,62,80,0.16);
  border-radius: 14px;
  padding: 0.7rem 0.8rem;
  color: #172535;
  background: rgba(255,255,255,0.34);
  font: 800 0.9rem 'Lato', Arial, sans-serif;
  outline: none;
  box-sizing: border-box;
}

.owner-messenger-search input:focus {
  border-color: rgba(70,125,220,0.58);
  box-shadow: 0 0 0 3px rgba(70,125,220,0.12);
}

.owner-messenger-threads,
.owner-messenger-messages {
  display: grid;
  gap: 0.65rem;
}

.owner-messenger-threads {
  max-height: 430px;
  overflow-y: auto;
  padding-right: 0.25rem;
}

.owner-thread-button {
  width: 100%;
  display: grid;
  gap: 0.24rem;
  min-height: auto;
  padding: 0.8rem;
  border: 1px solid rgba(44,62,80,0.16);
  border-radius: 16px;
  color: #172535;
  background: rgba(255,255,255,0.18);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.22);
  text-align: left;
  cursor: pointer;
}

.owner-thread-button.active {
  border-color: rgba(70,125,220,0.42);
  background: rgba(225,238,255,0.34);
}

.owner-thread-button strong,
.owner-thread-button span,
.owner-thread-button small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.owner-thread-button span,
.owner-thread-button small {
  color: #536679;
  font-weight: 800;
}

.owner-messenger-conversation {
  display: grid;
  gap: 0.75rem;
  min-width: 0;
}

.owner-messenger-thread-title {
  padding: 0.75rem 0.9rem;
  border: 1px solid rgba(44,62,80,0.14);
  border-radius: 16px;
  color: #172535;
  background: rgba(255,255,255,0.16);
  font-family: 'Playfair Display', serif;
  font-weight: 900;
}

.owner-messenger-messages {
  max-height: 430px;
  overflow-y: auto;
  padding: 0.8rem;
  border: 1px solid rgba(44,62,80,0.14);
  border-radius: 18px;
  background: rgba(255,255,255,0.10);
}

.owner-message {
  width: 100%;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: end;
  gap: 0.5rem;
  text-align: left;
  overflow-wrap: anywhere;
}

.owner-message-avatar {
  width: 34px;
  height: 34px;
  border-radius: 999px;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,0.28);
  background: rgba(255,255,255,0.14);
  display: grid;
  place-items: center;
}

.owner-message-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.owner-message-avatar span {
  color: #eef7ff;
  font-size: 0.56rem;
  font-weight: 900;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

.owner-message-bubble {
  width: min(90%, 680px);
  padding: 0.8rem;
  border-radius: 17px;
}

.owner-message.from-visitor {
  justify-self: start;
}

.owner-message.from-visitor .owner-message-bubble {
  border: 1px solid rgba(44,62,80,0.14);
  background: rgba(255,255,255,0.22);
}

.owner-message.from-admin {
  justify-self: end;
}

.owner-message.from-admin .owner-message-avatar {
  grid-column: 2;
  justify-self: end;
}

.owner-message.from-admin .owner-message-bubble {
  grid-column: 1;
  grid-row: 1;
  justify-self: end;
  color: #edf7ff;
  background: linear-gradient(135deg, rgba(48,90,170,0.92), rgba(71,128,218,0.88));
}

.owner-message-bubble div {
  display: flex;
  justify-content: space-between;
  gap: 0.65rem;
}

.owner-message-bubble div span,
.owner-message-bubble small {
  color: inherit;
  opacity: 0.72;
  font-size: 0.76rem;
  font-weight: 900;
}

.owner-message-bubble p {
  margin: 0;
  color: inherit;
  font-weight: 800;
  line-height: 1.45;
  white-space: pre-wrap;
}

.owner-messenger-reply-form {
  display: grid;
  gap: 0.65rem;
  margin: 0;
  padding: 0;
}

.owner-messenger-reply-form textarea {
  width: 100%;
  min-height: 110px;
  padding: 0.8rem;
  border: 1px solid rgba(44,62,80,0.24);
  border-radius: 16px;
  background: rgba(255,255,255,0.48);
  color: #172535;
  font: inherit;
  font-weight: 800;
  resize: vertical;
  box-sizing: border-box;
}

.account-release-card strong {
  color: #172535;
}

.account-release-card span,
.account-release-card p,
.account-care-section p {
  margin: 0;
  color: #536679;
  font-weight: 800;
}

@media (max-width: 1024px){
  .music-product-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .admin-summary-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .admin-ops-grid,
  .admin-controls {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 800px){
  .music-product-grid {
    grid-template-columns: 1fr;
  }
  .admin-heading,
  .admin-controls {
    grid-template-columns: 1fr;
  }
  .admin-bulk-bar {
    display: grid;
    grid-template-columns: 1fr;
  }
  .admin-heading {
    display: grid;
  }
  .admin-health-grid {
    grid-template-columns: 1fr;
  }
  .admin-detail-heading,
  .admin-composer-grid,
  .admin-mini-grid,
  .admin-record-toolbar,
  .admin-activity-item {
    display: grid;
    grid-template-columns: 1fr;
  }
  .admin-detail-row {
    grid-template-columns: 1fr;
    text-align: center;
  }
  .account-heading,
  .account-section-heading,
  .owner-messenger-heading,
  .account-record,
  .account-release-card {
    display: grid;
    grid-template-columns: 1fr;
    text-align: center;
  }
  .owner-messenger-grid {
    grid-template-columns: 1fr;
  }
  .owner-messenger-stats {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .owner-messenger-heading,
  .owner-messenger-grid h3 {
    text-align: center;
  }
  .owner-messenger-threads,
  .owner-messenger-messages {
    max-height: 320px;
  }
  .owner-message {
    width: 100%;
  }
  .owner-message-bubble div {
    display: grid;
    grid-template-columns: 1fr;
  }
  .account-release-card div {
    justify-items: center;
  }
  .account-summary-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .account-release-grid {
    grid-template-columns: 1fr;
  }
  .account-auth-options {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 600px){
  .music-store-page {
    width: min(100% - 1rem, 1180px);
  }
  .store-form-grid {
    grid-template-columns: 1fr;
  }
  .preference-grid,
  .amount-grid {
    grid-template-columns: 1fr;
  }
  .admin-summary-grid {
    grid-template-columns: 1fr;
  }
  .admin-panel,
  .admin-records-panel,
  .admin-detail-panel {
    padding: 0.75rem;
    border-radius: 18px;
  }
  .account-page {
    width: min(100% - 1rem, 1040px);
  }
  .account-panel,
  .account-dashboard,
  .account-section {
    padding: 0.85rem;
    border-radius: 18px;
  }
  .account-summary-grid {
    grid-template-columns: 1fr;
  }
}

/*
  Advanced dashboard polish pass
  - Raises visual hierarchy and depth for admin/account workspaces
  - Adds restrained motion for a "live" feel without distraction
*/

.admin-page,
.account-page {
  --surface-ink: #102235;
  --surface-muted: #4b6379;
  --surface-border: rgba(255, 255, 255, 0.38);
  --surface-card: rgba(255, 255, 255, 0.2);
  --surface-shadow: 0 24px 54px rgba(11, 24, 38, 0.16);
  --surface-glow: 0 0 0 1px rgba(255, 255, 255, 0.16) inset;
  position: relative;
}

.admin-page::before,
.account-page::before {
  content: "";
  position: fixed;
  inset: -20vh -15vw;
  z-index: 0;
  pointer-events: none;
  background:
    radial-gradient(36rem 36rem at 10% 15%, rgba(104, 181, 255, 0.16), transparent 70%),
    radial-gradient(32rem 32rem at 88% 18%, rgba(89, 219, 171, 0.14), transparent 72%),
    radial-gradient(42rem 42rem at 52% 85%, rgba(255, 220, 153, 0.12), transparent 74%);
  filter: blur(4px);
  animation: surfaceDrift 18s ease-in-out infinite alternate;
}

.admin-page > *,
.account-page > * {
  position: relative;
  z-index: 1;
}

.admin-login-panel,
.admin-dashboard,
.account-panel,
.account-dashboard,
.account-section {
  border-color: var(--surface-border);
  box-shadow: var(--surface-shadow), var(--surface-glow);
  backdrop-filter: blur(8px) saturate(118%);
  -webkit-backdrop-filter: blur(8px) saturate(118%);
}

.admin-heading,
.account-heading,
.admin-panel-heading,
.account-section-heading,
.owner-messenger-heading {
  text-align: left;
}

.admin-heading h1,
.account-heading h1,
.admin-panel-heading h2,
.account-section h2,
.owner-messenger-heading h2 {
  color: var(--surface-ink);
  letter-spacing: 0.01em;
}

.admin-heading p,
.account-heading p,
.account-section-heading p,
.owner-messenger-heading p,
.admin-empty,
.account-empty {
  color: var(--surface-muted);
}

.admin-workspace-chip,
.admin-quick-filter,
.account-nav-chip {
  border-color: rgba(16, 34, 53, 0.2);
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.44), rgba(255, 255, 255, 0.16)),
    rgba(255, 255, 255, 0.26);
  transition: transform 160ms ease, box-shadow 220ms ease, background 220ms ease;
}

.admin-workspace-chip:hover,
.admin-quick-filter:hover,
.account-nav-chip:hover {
  transform: translateY(-1px);
  box-shadow: 0 10px 20px rgba(25, 54, 84, 0.14);
  background:
    linear-gradient(135deg, rgba(239, 248, 255, 0.62), rgba(255, 255, 255, 0.2)),
    rgba(255, 255, 255, 0.28);
}

.admin-summary-card,
.account-summary-card,
.admin-focus-item,
.account-next-step-card,
.account-record,
.account-release-card,
.owner-thread-button,
.owner-messenger-thread-title,
.owner-messenger-messages,
.admin-panel,
.admin-records-panel,
.admin-detail-panel {
  transition: transform 180ms ease, box-shadow 220ms ease, border-color 220ms ease, background 220ms ease;
}

.admin-summary-card:hover,
.account-summary-card:hover,
.admin-focus-item:hover,
.account-next-step-card:hover,
.account-record:hover,
.account-release-card:hover,
.owner-thread-button:hover,
.admin-panel:hover,
.admin-records-panel:hover,
.admin-detail-panel:hover {
  transform: translateY(-2px);
  border-color: rgba(72, 123, 177, 0.34);
  box-shadow: 0 14px 32px rgba(20, 45, 72, 0.14), var(--surface-glow);
}

.admin-summary-card {
  position: relative;
  overflow: hidden;
  min-height: 94px;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.42), rgba(255, 255, 255, 0.18)),
    var(--surface-card);
}

.admin-summary-card::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 3px;
  background: linear-gradient(90deg, rgba(58, 138, 214, 0.8), rgba(63, 194, 145, 0.8));
}

.admin-summary-card strong,
.account-summary-card strong,
.admin-focus-item span {
  color: var(--surface-ink);
}

.admin-focus-item {
  align-content: start;
  min-height: 108px;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.42), rgba(255, 255, 255, 0.16)),
    var(--surface-card);
}

.admin-focus-item.urgent {
  background:
    linear-gradient(135deg, rgba(255, 241, 239, 0.84), rgba(255, 255, 255, 0.22)),
    rgba(255, 218, 212, 0.32);
}

.admin-focus-item.warm {
  background:
    linear-gradient(135deg, rgba(255, 250, 231, 0.86), rgba(255, 255, 255, 0.22)),
    rgba(255, 236, 189, 0.3);
}

.admin-focus-item.calm {
  background:
    linear-gradient(135deg, rgba(234, 255, 245, 0.86), rgba(255, 255, 255, 0.22)),
    rgba(201, 244, 221, 0.28);
}

.admin-health-item,
.admin-provider-status,
.admin-bulk-bar,
.admin-thread-card,
.account-next-step-card,
.account-record,
.account-release-card,
.owner-thread-button {
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.48), rgba(255, 255, 255, 0.16)),
    var(--surface-card);
}

.admin-table-wrap {
  border-radius: 18px;
  border: 1px solid rgba(32, 57, 86, 0.14);
  background: rgba(255, 255, 255, 0.22);
}

.admin-table th {
  position: sticky;
  top: 0;
  z-index: 2;
  background: rgba(238, 246, 255, 0.88);
  backdrop-filter: blur(6px);
}

.admin-table tbody tr {
  transition: background 140ms ease;
}

.admin-table tbody tr:hover {
  background: rgba(213, 233, 252, 0.34);
}

.admin-row-actions .btn,
.admin-detail-actions .btn,
.admin-actions .btn,
.account-next-step-card .btn,
.book-action-row .btn,
.owner-messenger-reply-form .btn {
  box-shadow: 0 8px 18px rgba(21, 45, 74, 0.12);
}

.account-dashboard-nav {
  justify-content: flex-start;
}

.account-next-step-card {
  min-height: 150px;
  align-content: start;
}

.account-next-step-card p {
  line-height: 1.5;
}

.account-record,
.account-release-card {
  text-align: left;
}

.owner-thread-button.active {
  border-color: rgba(63, 121, 184, 0.52);
  background:
    linear-gradient(135deg, rgba(228, 240, 255, 0.86), rgba(255, 255, 255, 0.18)),
    rgba(228, 240, 255, 0.42);
}

.owner-message.from-admin {
  box-shadow: 0 12px 24px rgba(35, 74, 129, 0.3);
}

.admin-summary-card,
.account-summary-card,
.admin-focus-item,
.account-next-step-card,
.account-record,
.account-release-card,
.admin-panel,
.admin-records-panel,
.admin-detail-panel,
.account-section,
.owner-thread-button {
  animation: surfaceLiftIn 420ms ease both;
}

.admin-summary-card:nth-child(2n),
.account-summary-card:nth-child(2n),
.admin-focus-item:nth-child(2n),
.account-next-step-card:nth-child(2n),
.account-record:nth-child(2n),
.account-release-card:nth-child(2n),
.owner-thread-button:nth-child(2n) {
  animation-delay: 70ms;
}

.admin-summary-card:nth-child(3n),
.account-summary-card:nth-child(3n),
.admin-focus-item:nth-child(3n),
.account-next-step-card:nth-child(3n),
.account-record:nth-child(3n),
.account-release-card:nth-child(3n),
.owner-thread-button:nth-child(3n) {
  animation-delay: 120ms;
}

@keyframes surfaceLiftIn {
  from {
    opacity: 0;
    transform: translateY(8px) scale(0.995);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

@keyframes surfaceDrift {
  from {
    transform: translate3d(0, 0, 0) scale(1);
  }
  to {
    transform: translate3d(1.2vw, -1.2vh, 0) scale(1.03);
  }
}

@media (max-width: 800px) {
  .admin-heading,
  .account-heading,
  .account-section-heading,
  .owner-messenger-heading {
    text-align: center;
  }

  .account-dashboard-nav,
  .admin-workspace-bar,
  .admin-quick-filters {
    justify-content: center;
  }

  .account-record,
  .account-release-card,
  .account-next-step-card {
    text-align: center;
  }
}

/* Premium public surface system */

.home-page,
.books-page,
.store-page {
  --public-ink: #0f2236;
  --public-muted: #4d6479;
  --public-border: rgba(255, 255, 255, 0.44);
  --public-card: rgba(255, 255, 255, 0.26);
  --public-card-soft: rgba(255, 255, 255, 0.2);
  --public-shadow: 0 22px 52px rgba(13, 27, 42, 0.16);
}

body {
  color: var(--public-ink, #172535);
  text-shadow: none;
}

main > section {
  border-color: var(--public-border, rgba(255,255,255,0.3));
  background:
    linear-gradient(135deg, rgba(255,255,255,0.42), rgba(255,255,255,0.12) 45%, rgba(29,62,93,0.08)),
    var(--public-card-soft, rgba(255,255,255,0.12));
  box-shadow: var(--public-shadow, 0 14px 30px rgba(30,45,60,0.1));
  backdrop-filter: blur(8px) saturate(118%);
  -webkit-backdrop-filter: blur(8px) saturate(118%);
}

main > section > p,
main > section > h2,
main > section > h3,
main > section li,
main > section span {
  color: var(--public-ink, #172535);
}

main > section > p,
.book-item p,
.collector-statement p,
.music-store-hero p,
.store-form label,
.engagement-form label,
.store-empty,
.privacy {
  color: var(--public-muted, #536679);
}

.hero h1 {
  font-family: 'Playfair Display', serif;
  font-size: clamp(2.2rem, 6vw, 3.8rem);
  letter-spacing: 0.01em;
  color: var(--public-ink, #102235);
}

.hero {
  overflow: hidden;
}

.hero::after {
  content: "";
  position: absolute;
  inset: auto -10% 0;
  height: 2px;
  background: linear-gradient(90deg, rgba(57,134,210,0), rgba(57,134,210,0.8), rgba(63,196,145,0.8), rgba(57,134,210,0));
}

nav .nav-list li a {
  position: relative;
  padding: 0.15rem 0.1rem;
  letter-spacing: 0.01em;
}

nav .nav-list li a::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -0.25rem;
  height: 2px;
  background: linear-gradient(90deg, rgba(138,212,255,0.85), rgba(133,255,192,0.85));
  transform: scaleX(0);
  transform-origin: center;
  transition: transform 180ms ease;
}

nav .nav-list li a:hover::after,
nav .nav-list li a:focus-visible::after {
  transform: scaleX(1);
}

.btn {
  border-radius: 999px;
  padding: 0.72rem 1.15rem;
  border-color: rgba(29, 63, 95, 0.24);
  background:
    linear-gradient(140deg, rgba(255,255,255,0.56), rgba(255,255,255,0.16)),
    rgba(39,76,114,0.16);
  box-shadow: 0 10px 22px rgba(21, 44, 73, 0.12), inset 0 1px 0 rgba(255,255,255,0.36);
  transition: transform 180ms ease, box-shadow 220ms ease, background 220ms ease;
}

.btn:hover,
.btn:focus-visible {
  transform: translateY(-1px);
  box-shadow: 0 14px 28px rgba(21, 44, 73, 0.18), inset 0 1px 0 rgba(255,255,255,0.4);
  background:
    linear-gradient(140deg, rgba(255,255,255,0.68), rgba(255,255,255,0.2)),
    rgba(39,76,114,0.2);
}

.home-pathways,
.books-next-step {
  width: min(100%, 980px);
}

.home-pathway-grid,
.books-next-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.85rem;
  margin-top: 0.9rem;
}

.home-pathway-card,
.books-next-card {
  display: grid;
  gap: 0.4rem;
  align-content: start;
  min-height: 150px;
  padding: 1rem;
  border: 1px solid rgba(33, 64, 95, 0.16);
  border-radius: 18px;
  text-decoration: none;
  color: inherit;
  background:
    linear-gradient(135deg, rgba(255,255,255,0.5), rgba(255,255,255,0.14)),
    var(--public-card, rgba(255,255,255,0.24));
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.35);
  transition: transform 180ms ease, border-color 180ms ease, box-shadow 220ms ease;
}

.home-pathway-card:hover,
.books-next-card:hover {
  transform: translateY(-2px);
  border-color: rgba(55, 112, 166, 0.4);
  box-shadow: 0 16px 30px rgba(20, 43, 69, 0.14);
}

.home-pathway-card strong,
.books-next-card strong {
  color: var(--public-ink, #102235);
  font-size: 1rem;
}

.home-pathway-card span,
.books-next-card span {
  color: var(--public-muted, #4d6479);
  font-weight: 800;
  line-height: 1.5;
}

.store-promise-strip {
  width: min(100%, 1080px);
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.85rem;
}

.store-promise-strip article {
  display: grid;
  gap: 0.25rem;
  align-content: start;
  min-height: 114px;
  padding: 0.95rem;
  border: 1px solid rgba(33, 64, 95, 0.16);
  border-radius: 16px;
  background:
    linear-gradient(135deg, rgba(255,255,255,0.5), rgba(255,255,255,0.16)),
    rgba(255,255,255,0.24);
}

.store-promise-strip strong {
  color: var(--public-ink, #102235);
}

.store-promise-strip span {
  color: var(--public-muted, #4d6479);
  font-size: 0.9rem;
  font-weight: 800;
  line-height: 1.45;
}

.music-product-card,
.book-item,
.edition-grid .book-item {
  transition: transform 180ms ease, border-color 180ms ease, box-shadow 220ms ease;
}

.music-product-card:hover,
.book-item:hover,
.edition-grid .book-item:hover {
  transform: translateY(-2px);
  border-color: rgba(63, 124, 182, 0.35);
  box-shadow: 0 20px 36px rgba(15, 34, 54, 0.16), inset 0 1px 0 rgba(255,255,255,0.36);
}

footer {
  margin-top: 2rem;
  padding: 1.2rem 1rem;
  border-top: 1px solid rgba(255,255,255,0.32);
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1rem;
  width: min(100% - 2rem, 980px);
  margin-left: auto;
  margin-right: auto;
  background:
    linear-gradient(135deg, rgba(255,255,255,0.38), rgba(255,255,255,0.12)),
    rgba(255,255,255,0.18);
  border-radius: 20px;
  box-shadow: 0 16px 34px rgba(18, 35, 52, 0.12), inset 0 1px 0 rgba(255,255,255,0.42);
}

footer > div {
  text-align: left;
}

footer h3 {
  margin: 0 0 0.4rem;
  color: #12273b;
}

footer p {
  margin: 0.4rem 0;
  color: #496175;
  font-weight: 800;
}

footer p a {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  min-height: 34px;
  padding: 0.34rem 0.75rem;
  border: 1px solid rgba(32, 62, 91, 0.16);
  border-radius: 999px;
  color: #13324b;
  background:
    linear-gradient(135deg, rgba(255,255,255,0.74), rgba(255,255,255,0.32)),
    rgba(222, 237, 252, 0.5);
  text-decoration: none;
  font-weight: 900;
  letter-spacing: 0.01em;
  box-shadow: 0 10px 18px rgba(20, 47, 74, 0.1), inset 0 1px 0 rgba(255,255,255,0.5);
  transition: transform 180ms ease, box-shadow 220ms ease, border-color 200ms ease;
}

footer p a:hover,
footer p a:focus-visible {
  transform: translateY(-1px);
  border-color: rgba(56, 115, 173, 0.42);
  box-shadow: 0 14px 26px rgba(20, 47, 74, 0.16), inset 0 1px 0 rgba(255,255,255,0.62);
  outline: none;
}

footer > p {
  grid-column: 1 / -1;
  margin-top: 0.25rem;
  padding-top: 0.75rem;
  border-top: 1px solid rgba(255,255,255,0.32);
  text-align: center;
  color: #3f576c;
}

@keyframes publicLiftIn {
  from {
    opacity: 0;
    transform: translateY(8px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

main > section,
.home-pathway-card,
.books-next-card,
.store-promise-strip article,
.music-product-card {
  animation: publicLiftIn 420ms ease both;
}

main > section:nth-child(2n),
.home-pathway-card:nth-child(2n),
.books-next-card:nth-child(2n),
.store-promise-strip article:nth-child(2n),
.music-product-card:nth-child(2n) {
  animation-delay: 70ms;
}

@media (max-width: 1024px) {
  .home-pathway-grid,
  .books-next-grid,
  .store-promise-strip {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 800px) {
  .home-pathway-grid,
  .books-next-grid,
  .store-promise-strip {
    grid-template-columns: 1fr;
  }

  .home-pathway-card,
  .books-next-card,
  .store-promise-strip article {
    min-height: auto;
    text-align: center;
  }

  footer {
    grid-template-columns: 1fr;
    width: min(100% - 1rem, 980px);
  }

  footer > div {
    text-align: center;
  }
}

@media (max-width: 480px){
  .music-store-page {
    width: min(100% - 0.75rem, 1180px);
  }
  .music-product-body,
  .store-form {
    padding-left: 0.75rem;
    padding-right: 0.75rem;
  }
}

/* Premium editorial pages: about, blog, contact, updates */

.about-page-body,
.blog-page,
.contact-page,
.updates-page-body {
  --editor-ink: #0f2236;
  --editor-muted: #4f677b;
  --editor-line: rgba(20, 53, 84, 0.16);
  --editor-card: rgba(255, 255, 255, 0.32);
  --editor-glow: 0 20px 48px rgba(16, 39, 63, 0.14);
}

.about-page-body main,
.blog-page main,
.contact-page main,
.updates-page-body main {
  width: min(100% - 2rem, 1020px);
}

.about-page-body main > section,
.blog-page main > section,
.contact-page main > section,
.updates-page-body main > section {
  border: 1px solid var(--editor-line);
  border-radius: 24px;
  background:
    linear-gradient(145deg, rgba(255,255,255,0.56), rgba(255,255,255,0.12) 48%, rgba(37,76,109,0.08)),
    var(--editor-card);
  box-shadow: var(--editor-glow), inset 0 1px 0 rgba(255,255,255,0.4);
}

.about-page-body .about-profile-panel {
  text-align: left;
  padding-inline: clamp(1.05rem, 4vw, 3.2rem);
}

.about-page-body .about-profile-panel h1 {
  font-family: 'Playfair Display', serif;
  font-size: clamp(2.05rem, 5vw, 3.4rem);
  line-height: 1.06;
  letter-spacing: 0.01em;
  color: #0d2133;
  text-align: center;
}

.about-page-body .about-profile-panel p {
  color: var(--editor-muted);
  text-align: left;
  line-height: 1.9;
  margin: 0.92rem 0;
}

.about-page-body .about-profile-panel p:first-of-type {
  font-size: 1.3rem;
  line-height: 1.75;
  color: #123049;
}

.about-page-body .about-section-heading {
  position: relative;
  margin-top: 2.2rem;
  padding-top: 1.1rem;
  color: #102940;
  font-size: clamp(1.22rem, 2.4vw, 1.62rem);
  letter-spacing: 0.015em;
}

.about-page-body .about-section-heading::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: min(188px, 38%);
  height: 2px;
  background: linear-gradient(90deg, rgba(26,91,145,0.84), rgba(26,91,145,0));
}

.blog-page .blog-hero,
.contact-page .contact-hero,
.updates-page-body .updates-stream-hero {
  background:
    radial-gradient(circle at 8% 18%, rgba(133, 190, 243, 0.35), transparent 56%),
    radial-gradient(circle at 88% 12%, rgba(133, 232, 194, 0.24), transparent 52%),
    linear-gradient(145deg, rgba(255,255,255,0.58), rgba(255,255,255,0.14) 48%, rgba(24,58,89,0.08));
}

.blog-page .blog-hero h1,
.contact-page .contact-hero h1,
.updates-page-body .updates-stream-hero h1 {
  font-family: 'Playfair Display', serif;
  font-size: clamp(2.05rem, 5vw, 3.2rem);
  color: #0f2538;
}

.blog-page .blog-intro-panel,
.blog-page .blog-what-panel,
.blog-page .blog-invitation-panel,
.contact-page .contact-intro-panel,
.contact-page .contact-reasons-panel,
.contact-page .contact-closing-panel,
.updates-page-body .updates-stream-shell {
  text-align: left;
}

.blog-page .blog-intro-panel p,
.blog-page .blog-what-panel p,
.blog-page .blog-invitation-panel p,
.contact-page .contact-intro-panel p,
.contact-page .contact-reasons-panel p,
.contact-page .contact-closing-panel p,
.updates-page-body .updates-stream-shell p {
  color: var(--editor-muted);
  line-height: 1.85;
}

.blog-page .blog-entries-panel,
.blog-page .blog-cta-panel {
  background:
    linear-gradient(145deg, rgba(255,255,255,0.64), rgba(255,255,255,0.2) 48%, rgba(34,83,121,0.08)),
    rgba(255,255,255,0.34);
}

.blog-page .blog-entries-panel .btn,
.blog-page .blog-cta-panel .btn {
  margin: 0.35rem 0.3rem;
}

.contact-page .contact-form-panel {
  background:
    radial-gradient(circle at 92% 18%, rgba(139, 206, 245, 0.24), transparent 48%),
    linear-gradient(145deg, rgba(255,255,255,0.62), rgba(255,255,255,0.16) 48%, rgba(26,57,89,0.08));
}

.contact-page .engagement-form {
  width: min(100%, 780px);
}

.contact-page .engagement-form label {
  text-align: left;
}

.contact-page .engagement-form input,
.contact-page .engagement-form select,
.contact-page .engagement-form textarea {
  text-align: left;
  background: rgba(255,255,255,0.62);
}

.updates-page-body .updates-list {
  gap: 1.1rem;
}

.updates-page-body .update-card {
  border: 1px solid rgba(26, 66, 98, 0.16);
  border-radius: 20px;
  background:
    linear-gradient(145deg, rgba(255,255,255,0.6), rgba(255,255,255,0.16)),
    rgba(255,255,255,0.34);
  box-shadow: 0 16px 30px rgba(20, 47, 74, 0.1), inset 0 1px 0 rgba(255,255,255,0.42);
}

.updates-page-body .update-card h3 {
  color: #0f263c;
}

.updates-page-body .update-card-meta {
  color: #4f6679;
}

.about-page-body main > section,
.blog-page main > section,
.contact-page main > section,
.updates-page-body main > section,
.updates-page-body .update-card {
  animation: editorialRise 420ms ease both;
}

@keyframes editorialRise {
  from {
    opacity: 0;
    transform: translateY(10px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@media (max-width: 800px) {
  .about-page-body .about-profile-panel,
  .blog-page .blog-intro-panel,
  .blog-page .blog-what-panel,
  .blog-page .blog-invitation-panel,
  .contact-page .contact-intro-panel,
  .contact-page .contact-reasons-panel,
  .contact-page .contact-closing-panel,
  .updates-page-body .updates-stream-shell {
    text-align: center;
  }

  .about-page-body .about-profile-panel p,
  .blog-page .blog-intro-panel p,
  .blog-page .blog-what-panel p,
  .blog-page .blog-invitation-panel p,
  .contact-page .contact-intro-panel p,
  .contact-page .contact-reasons-panel p,
  .contact-page .contact-closing-panel p,
  .updates-page-body .updates-stream-shell p {
    text-align: center;
  }

  .contact-page .engagement-form label,
  .contact-page .engagement-form input,
  .contact-page .engagement-form select,
  .contact-page .engagement-form textarea {
    text-align: center;
  }
}

@media (max-width: 480px) {
  .about-page-body main,
  .blog-page main,
  .contact-page main,
  .updates-page-body main {
    width: min(100% - 0.75rem, 1020px);
  }

  .about-page-body .about-profile-panel p:first-of-type {
    font-size: 1.18rem;
  }
}

.site-messenger-panel {
  position: fixed;
  left: 16px;
  bottom: 16px;
  z-index: 10009;
  width: 340px;
  max-width: calc(100% - 32px);
  color: #edf7ff;
  background:
    linear-gradient(145deg, rgba(255,255,255,0.16), rgba(255,255,255,0.04) 45%, rgba(100,155,255,0.08)),
    rgba(7, 14, 28, 0.94);
  border: 1px solid rgba(255,255,255,0.20);
  border-radius: 26px;
  box-shadow:
    0 20px 54px rgba(0,0,0,0.36),
    inset 0 1px 0 rgba(255,255,255,0.22),
    inset 0 -1px 0 rgba(255,255,255,0.08);
  padding: 12px;
  font-family: 'Lato', sans-serif;
  box-sizing: border-box;
  overflow: hidden;
  backdrop-filter: blur(18px) saturate(128%);
  -webkit-backdrop-filter: blur(18px) saturate(128%);
}

.site-messenger-panel.expanded {
  width: 340px !important;
  max-width: calc(100% - 32px) !important;
}

.site-messenger-panel .site-messenger-rail,
.site-messenger-panel .site-messenger-capability-bar,
.site-messenger-panel .site-messenger-attach,
.site-messenger-panel .site-messenger-voice,
.site-messenger-panel .site-messenger-call-action,
.site-messenger-panel .site-messenger-state-card,
.site-messenger-panel .site-messenger-stats,
.site-messenger-panel .site-messenger-notes,
.site-messenger-panel .site-messenger-rail-actions {
  display: none !important;
}

.site-messenger-header-actions[hidden],
.site-messenger-call-action[hidden] {
  display: none !important;
}

.site-messenger-panel.signed-in .site-messenger-header-actions:not([hidden]) {
  display: flex !important;
}

.site-messenger-panel.signed-in .site-messenger-header-actions .site-messenger-call-action:not([hidden]) {
  display: inline-flex !important;
}

.site-messenger-panel.has-unread {
  border-color: rgba(154,198,255,0.58);
  box-shadow:
    0 22px 62px rgba(0,0,0,0.40),
    0 0 0 1px rgba(154,198,255,0.18),
    inset 0 1px 0 rgba(255,255,255,0.26);
}

.site-messenger-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.site-messenger-heading {
  min-width: 0;
  display: grid;
  gap: 3px;
  text-align: left;
}

.site-messenger-kicker {
  color: rgba(184,218,255,0.74);
  font-size: 0.62rem;
  font-weight: 900;
  letter-spacing: 0.11em;
  line-height: 1;
  text-transform: uppercase;
}

.site-messenger-title-row {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
}

.site-messenger-title-row strong {
  color: #f6fbff;
  font-family: 'Playfair Display', serif;
  font-size: 1.1rem;
  letter-spacing: 0.01em;
  line-height: 1.1;
}

.site-messenger-badge {
  display: inline-grid;
  place-items: center;
  min-width: 22px;
  height: 22px;
  border-radius: 999px;
  padding: 0 7px;
  color: #061327;
  background: linear-gradient(180deg, #d6ebff, #8fc4ff);
  font-size: 0.72rem;
  font-weight: 900;
  box-shadow: 0 8px 18px rgba(110,172,255,0.28);
}

.site-messenger-badge[hidden] {
  display: none;
}

.site-messenger-identity,
.site-messenger-thread-meta {
  max-width: 238px;
  color: rgba(237,247,255,0.68);
  font-size: 0.72rem;
  font-weight: 800;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.site-messenger-thread-meta {
  color: rgba(237,247,255,0.50);
}

.site-messenger-header-actions {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  gap: 6px;
}

.site-messenger-expand {
  min-height: 34px;
  border: 0;
  border-radius: 13px;
  padding: 0 10px;
  color: rgba(237,247,255,0.92);
  background: rgba(255,255,255,0.10);
  font: 900 0.68rem 'Lato', Arial, sans-serif;
  cursor: pointer;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,0.08);
  transition: background 160ms ease, transform 160ms ease;
}

.site-messenger-toggle {
  flex: 0 0 36px;
  width: 36px;
  height: 36px;
  min-height: 36px;
  border: 0;
  border-radius: 14px;
  background: rgba(255,255,255,0.12);
  color: #edf7ff;
  font-size: 1.1rem;
  font-weight: 900;
  cursor: pointer;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,0.08);
  transition: background 160ms ease, transform 160ms ease;
}

.site-messenger-expand:hover,
.site-messenger-toggle:hover {
  background: rgba(255,255,255,0.18);
  transform: translateY(-1px);
}

.site-messenger-body {
  display: grid;
  gap: 12px;
  margin-top: 12px;
}

.site-messenger-presence {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 9px;
  align-items: center;
  padding: 9px 10px;
  border: 1px solid rgba(255,255,255,0.10);
  border-radius: 18px;
  background:
    linear-gradient(135deg, rgba(255,255,255,0.10), rgba(255,255,255,0.04)),
    rgba(255,255,255,0.05);
  text-align: left;
}

.site-messenger-presence-dot {
  width: 10px;
  height: 10px;
  border-radius: 999px;
  background: #8ff0b2;
  box-shadow: 0 0 0 4px rgba(143,240,178,0.10), 0 0 18px rgba(143,240,178,0.42);
}

.site-messenger-presence strong,
.site-messenger-presence span {
  display: block;
}

.site-messenger-presence strong {
  color: #f6fbff;
  font-size: 0.82rem;
  line-height: 1.2;
}

.site-messenger-presence span {
  color: rgba(237,247,255,0.58);
  font-size: 0.68rem;
  font-weight: 800;
  line-height: 1.25;
}

.site-messenger-messages {
  display: grid;
  gap: 9px;
  max-height: 244px;
  overflow-y: auto;
  padding: 2px 4px 2px 0;
}

.site-messenger-panel.expanded .site-messenger-messages {
  max-height: 360px;
}

.site-messenger-empty {
  display: grid;
  gap: 4px;
  margin: 0;
  padding: 12px;
  color: rgba(237,247,255,0.70);
  font-size: 0.84rem;
  line-height: 1.45;
  text-align: left;
  border: 1px solid rgba(255,255,255,0.10);
  border-radius: 18px;
  background: rgba(255,255,255,0.07);
}

.site-messenger-empty strong {
  color: #f6fbff;
  font-family: 'Playfair Display', serif;
  font-size: 1rem;
}

.site-messenger-empty span {
  color: rgba(237,247,255,0.66);
}

.site-messenger-message {
  width: 100%;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: end;
  gap: 8px;
  line-height: 1.35;
  text-align: left;
  overflow-wrap: anywhere;
}

.site-messenger-avatar {
  width: 32px;
  height: 32px;
  border-radius: 999px;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,0.28);
  background: rgba(255,255,255,0.18);
  display: grid;
  place-items: center;
  box-shadow: 0 6px 12px rgba(0,0,0,0.2);
}

.site-messenger-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.site-messenger-avatar span {
  color: #ecf5ff;
  font-size: 0.56rem;
  font-weight: 900;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

.site-messenger-bubble {
  max-width: 86%;
  padding: 10px 11px;
  border-radius: 17px;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.12),
    0 8px 18px rgba(0,0,0,0.12);
}

.site-messenger-bubble div {
  font-size: 0.88rem;
}

.site-messenger-bubble small {
  display: block;
  margin-top: 5px;
  color: rgba(237,247,255,0.64);
  font-size: 0.68rem;
  font-weight: 800;
}

.site-messenger-message.from-visitor {
  justify-self: end;
}

.site-messenger-message.from-visitor .site-messenger-avatar {
  grid-column: 2;
  justify-self: end;
}

.site-messenger-message.from-visitor .site-messenger-bubble {
  grid-column: 1;
  grid-row: 1;
  justify-self: end;
  background: linear-gradient(135deg, rgba(68,126,255,0.92), rgba(92,158,255,0.88));
}

.site-messenger-message.from-admin {
  justify-self: start;
}

.site-messenger-message.from-admin .site-messenger-avatar {
  grid-column: 1;
}

.site-messenger-message.from-admin .site-messenger-bubble {
  grid-column: 2;
  background:
    linear-gradient(145deg, rgba(255,255,255,0.16), rgba(255,255,255,0.07)),
    rgba(255,255,255,0.08);
  border: 1px solid rgba(255,255,255,0.12);
}

.site-messenger-form {
  display: grid;
  gap: 8px;
}

.site-messenger-starters {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 6px;
}

.site-messenger-starter {
  min-height: 32px;
  border: 1px solid rgba(255,255,255,0.12);
  border-radius: 999px;
  color: rgba(237,247,255,0.88);
  background: rgba(255,255,255,0.08);
  font: 900 0.68rem 'Lato', Arial, sans-serif;
  cursor: pointer;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.08);
}

.site-messenger-starter:hover {
  background: rgba(255,255,255,0.14);
}

.site-messenger-identity-fields {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 6px;
}

.site-messenger-panel input,
.site-messenger-panel textarea {
  width: 100%;
  border: 1px solid rgba(255,255,255,0.14);
  border-radius: 14px;
  padding: 10px 11px;
  color: #102033;
  background: rgba(255,255,255,0.82);
  font: 800 0.86rem 'Lato', Arial, sans-serif;
  box-sizing: border-box;
  outline: none;
}

.site-messenger-panel textarea {
  min-height: 78px;
  max-height: 180px;
  resize: vertical;
}

.site-messenger-panel input:focus,
.site-messenger-panel textarea:focus {
  border-color: rgba(130,179,255,0.9);
  box-shadow: 0 0 0 3px rgba(94,158,255,0.18);
}

.site-messenger-actions {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 8px;
  align-items: center;
}

.site-messenger-action-meta {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.site-messenger-status {
  min-height: 1.2rem;
  margin: 0;
  color: rgba(237,247,255,0.74);
  font-size: 0.74rem;
  font-weight: 900;
  line-height: 1.3;
  text-align: left;
}

.site-messenger-last-checked {
  color: rgba(237,247,255,0.42);
  font-size: 0.66rem;
  font-weight: 900;
  line-height: 1.2;
  text-align: left;
}

.site-messenger-status.success {
  color: #aee8c8;
}

.site-messenger-status.error {
  color: #ffc1c1;
}

.site-messenger-send {
  min-height: 40px;
  border: 0;
  border-radius: 14px;
  padding: 0 16px;
  color: #fff;
  background: linear-gradient(180deg, #4d81ff, #345ed2);
  font: 900 0.86rem 'Lato', Arial, sans-serif;
  cursor: pointer;
  box-shadow: 0 10px 24px rgba(35,80,190,0.30);
}

.site-messenger-send:disabled {
  cursor: wait;
  opacity: 0.68;
}

.site-messenger-panel.minimized {
  width: 246px;
}

.site-messenger-panel.minimized .site-messenger-body {
  display: none;
}

.site-messenger-panel.minimized .site-messenger-expand {
  display: none;
}

.site-messenger-panel.minimized .site-messenger-thread-meta {
  display: none;
}

.audio-player-panel {
  position: fixed;
  right: 16px;
  bottom: 16px;
  width: 280px;
  max-width: calc(100% - 32px);
  max-height: calc(72vh - 32px);
  background: rgba(12, 19, 38, 0.95);
  border: 1px solid rgba(255,255,255,0.10);
  border-radius: 24px;
  box-shadow: 0 18px 46px rgba(0,0,0,0.34);
  padding: 12px;
  color: #eef6ff;
  font-family: 'Lato', sans-serif;
  z-index: 10010;
  backdrop-filter: blur(16px);
  box-sizing: border-box;
  overflow: hidden;
}

.audio-player-panel:not(.compact):not(.collapsed) {
  overflow-y: auto;
}

.audio-player-panel.compact {
  width: 240px;
  padding: 10px;
  max-height: 220px;
}

.audio-player-panel.compact .audio-player-cover-art,
.audio-player-panel.compact .audio-player-meta-panel,
.audio-player-panel.compact .audio-player-controls,
.audio-player-panel.compact .audio-player-slider-field,
.audio-player-panel.compact .audio-player-progress-row {
  display: none;
}

/* Interaction quality layer for messenger/account/admin */

.account-nav-chip.active {
  border-color: rgba(58, 122, 192, 0.58);
  background:
    linear-gradient(135deg, rgba(228, 241, 255, 0.9), rgba(255, 255, 255, 0.26)),
    rgba(228, 241, 255, 0.38);
  box-shadow: 0 12px 24px rgba(30, 62, 96, 0.18), inset 0 1px 0 rgba(255, 255, 255, 0.52);
}

.owner-thread-button.unread {
  border-color: rgba(75, 131, 196, 0.5);
  background:
    linear-gradient(135deg, rgba(230, 243, 255, 0.88), rgba(255, 255, 255, 0.2)),
    rgba(230, 243, 255, 0.42);
}

.owner-thread-button.unread strong::after {
  content: "  • New";
  color: #31679b;
  font-size: 0.72rem;
  font-weight: 900;
  letter-spacing: 0.02em;
}

.account-dashboard-live .account-heading h1,
.account-dashboard-live .account-section h2,
.account-dashboard-live .owner-messenger-heading h2 {
  text-wrap: balance;
}

.admin-heading::after {
  content: "Shortcuts: / search, Shift+R refresh, Alt+1-6 jump views";
  display: block;
  margin-top: 0.45rem;
  color: #597287;
  font-size: 0.72rem;
  font-weight: 900;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.site-messenger-panel {
  animation: messengerDockIn 320ms ease both;
}

.site-messenger-message {
  animation: messengerMessageIn 220ms ease both;
}

.site-messenger-send {
  transition: transform 180ms ease, box-shadow 220ms ease, filter 180ms ease;
}

.site-messenger-send:hover,
.site-messenger-send:focus-visible {
  transform: translateY(-1px);
  box-shadow: 0 14px 28px rgba(35,80,190,0.34);
}

.site-messenger-status.show {
  opacity: 1;
}

.site-messenger-status {
  opacity: 0.86;
  transition: opacity 180ms ease;
}

@keyframes messengerDockIn {
  from {
    opacity: 0;
    transform: translateY(10px) scale(0.99);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

@keyframes messengerMessageIn {
  from {
    opacity: 0;
    transform: translateY(6px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@media (max-width: 800px) {
  .admin-heading::after {
    text-align: center;
    line-height: 1.35;
  }
}

.audio-player-panel.compact .audio-player-cover {
  margin-bottom: 8px;
}

.audio-player-panel.compact .audio-player-video-container {
  display: block;
  height: 96px;
  margin-bottom: 8px;
}

.audio-player-panel.compact .audio-player-status-bar {
  margin-top: 4px;
}

.audio-player-panel ::-webkit-scrollbar {
  width: 9px;
  height: 9px;
}

.audio-player-panel ::-webkit-scrollbar-thumb {
  background: rgba(255,255,255,0.18);
  border-radius: 999px;
}

.audio-player-panel ::-webkit-scrollbar-track {
  background: rgba(255,255,255,0.05);
}

.audio-player-panel {
  scrollbar-width: thin;
  scrollbar-color: rgba(255,255,255,0.18) rgba(255,255,255,0.05);
}

.audio-player-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 14px;
}

.audio-player-brand {
  font-family: 'Playfair Display', serif;
  font-size: 1rem;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  color: #d2e3ff;
}

.audio-player-header-buttons {
  display: flex;
  align-items: center;
  gap: 8px;
}

.audio-player-cover {
  border-radius: 20px;
  overflow: hidden;
  margin-bottom: 10px;
  position: relative;
}

.audio-player-video-container {
  width: 100%;
  height: 140px;
  border-radius: 18px;
  overflow: hidden;
  background: #000;
  display: none;
  margin-bottom: 10px;
}

.audio-player-panel:not(.compact) .audio-player-video-container:has(.audio-player-youtube) {
  height: 168px;
}

.audio-player-youtube,
#audio-player-youtube-host,
.audio-player-video-container iframe {
  width: 100% !important;
  height: 100% !important;
  max-width: 100%;
  border: 0;
  display: block;
}

.audio-player-panel.compact .audio-player-video-container {
  height: 96px;
}

.audio-player-video {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  background: #000;
}

.audio-player-cover-art {
  width: 100%;
  min-height: 80px;
  background: radial-gradient(circle at top left, rgba(79, 126, 255, 0.35), transparent 40%),
              linear-gradient(135deg, rgba(255,255,255,0.12), rgba(20, 30, 60, 0.8));
  background-size: cover;
  background-position: center;
  display: flex;
  align-items: flex-end;
  justify-content: flex-start;
  padding: 12px;
  color: #eef6ff;
  font-size: 0.82rem;
  font-weight: 700;
  text-shadow: 0 2px 14px rgba(0,0,0,0.28);
}

.audio-player-meta-panel {
  display: grid;
  gap: 4px;
  margin-bottom: 10px;
}

.audio-player-title {
  font-size: 1.05rem;
  font-weight: 800;
  letter-spacing: 0.01em;
  line-height: 1.18;
  white-space: pre-line;
}

.audio-player-subtitle {
  color: rgba(235, 245, 255, 0.72);
  font-size: 0.85rem;
}

.audio-player-badges {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

.audio-player-badge {
  background: rgba(255,255,255,0.08);
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: 999px;
  padding: 6px 10px;
  font-size: 0.76rem;
  color: #d9e6ff;
}

.audio-player-controls {
  display: grid;
  grid-template-columns: 32px 32px 42px 32px 32px 32px;
  gap: 6px;
  justify-content: center;
  align-items: center;
  margin-bottom: 8px;
}

.audio-player-btn {
  width: 100%;
  height: 36px;
  border: none;
  border-radius: 14px;
  background: rgba(255,255,255,0.12);
  color: #eef6ff;
  font-size: 0.96rem;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: transform 0.2s ease, background 0.2s ease, box-shadow 0.2s ease;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,0.08);
}

.audio-player-btn:hover {
  transform: translateY(-1px);
  background: rgba(255,255,255,0.17);
}

.audio-player-btn.active {
  background: linear-gradient(135deg, rgba(69, 126, 255, 0.95), rgba(94, 168, 255, 0.95));
  color: #fff;
}

.audio-player-repeat-btn,
.audio-player-shuffle-btn {
  font-weight: 900;
}

.audio-player-slider-field {
  display: grid;
  gap: 5px;
  margin-bottom: 8px;
}

.audio-player-slider-label {
  font-size: 0.76rem;
  color: rgba(235, 245, 255, 0.72);
}

.audio-player-slider {
  width: 100%;
  appearance: none;
  background: rgba(255,255,255,0.12);
  height: 6px;
  border-radius: 999px;
}

.audio-player-slider::-webkit-slider-thumb {
  appearance: none;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: #4d81ff;
  box-shadow: 0 0 0 4px rgba(77,129,255,0.22);
  cursor: pointer;
}

.audio-player-slider::-moz-range-thumb {
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: #4d81ff;
  cursor: pointer;
}

.audio-player-progress-row {
  display: grid;
  gap: 10px;
  margin-bottom: 12px;
}

.audio-player-progress-track {
  position: relative;
  height: 10px;
  width: 100%;
  border-radius: 999px;
  background: rgba(255,255,255,0.08);
  cursor: pointer;
  overflow: hidden;
}

.audio-player-progress-fill {
  height: 100%;
  width: 0%;
  background: linear-gradient(90deg, #4d81ff, #95c0ff);
  border-radius: 999px;
  transition: width 0.1s linear;
}

.audio-player-time {
  font-size: 0.78rem;
  color: rgba(235, 245, 255, 0.64);
  text-align: right;
}

.audio-player-track-heading {
  font-size: 0.95rem;
  margin-bottom: 8px;
  color: #d9e6ff;
}

.audio-player-track-list {
  list-style: none;
  margin: 0;
  padding: 0;
  max-height: 240px;
  overflow-y: auto;
  display: grid;
  gap: 6px;
  margin-bottom: 10px;
}

.audio-player-track-item {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 8px;
  align-items: center;
  padding: 10px 14px;
  border-radius: 18px;
  background: rgba(255,255,255,0.05);
  color: #eef6ff;
  cursor: pointer;
  transition: transform 0.18s ease, background 0.2s ease;
}

.audio-player-track-title {
  min-width: 0;
  overflow-wrap: anywhere;
}

.audio-player-track-count {
  color: rgba(235,245,255,0.66);
  font-size: 0.72rem;
  font-weight: 800;
  white-space: nowrap;
}

.audio-player-track-item:hover {
  background: rgba(255,255,255,0.12);
  transform: translateY(-1px);
}

.audio-player-track-item.active {
  background: linear-gradient(135deg, rgba(78, 138, 255, 0.95), rgba(119, 184, 255, 0.95));
  color: #fff;
}

.audio-player-track-unavailable {
  opacity: 0.4;
  pointer-events: none;
}


.audio-player-status-bar {
  font-size: 0.76rem;
  color: rgba(235,245,255,0.72);
  text-align: center;
}

.audio-player-panel.collapsed {
  width: 220px;
  max-height: 72px;
  overflow: hidden;
  padding: 10px;
}

.audio-player-panel.collapsed .audio-player-cover,
.audio-player-panel.collapsed .audio-player-meta-panel,
.audio-player-panel.collapsed .audio-player-controls,
.audio-player-panel.collapsed .audio-player-slider-field,
.audio-player-panel.collapsed .audio-player-progress-row,
.audio-player-panel.collapsed .audio-player-track-heading,
.audio-player-panel.collapsed .audio-player-track-list {
  display: none;
}

@media (max-width: 720px) {
  .site-messenger-panel {
    left: 12px;
    right: 12px;
    bottom: 12px;
    width: auto;
    max-width: none;
  }

  .site-messenger-panel.expanded {
    width: auto;
  }

  .site-messenger-panel.minimized {
    width: min(246px, calc(100% - 24px));
    right: auto;
  }

  .site-messenger-messages {
    max-height: min(40vh, 244px);
  }

  .site-messenger-panel.expanded .site-messenger-messages {
    max-height: min(46vh, 320px);
  }

  .site-messenger-starters {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .site-messenger-identity-fields,
  .site-messenger-actions {
    grid-template-columns: 1fr;
  }

  .admin-thread-heading,
  .admin-thread-message-top,
  .admin-thread-message-bottom {
    display: grid;
    grid-template-columns: 1fr;
    justify-items: start;
    text-align: left;
  }

  .admin-thread-meta {
    justify-items: start;
    text-align: left;
  }

  .admin-thread-message {
    width: 100%;
  }

  .audio-player-panel {
    position: static;
    width: auto;
    margin: 1rem;
    max-width: none;
  }
}

@media (max-width: 720px) {
  body:has(main.password-page) .site-messenger-panel,
  body:has(main.password-page) .site-messenger-panel.expanded,
  body:has(main.password-page) .site-messenger-panel.minimized,
  body:has(main.password-page) .audio-player-panel {
    position: static !important;
    left: auto !important;
    right: auto !important;
    bottom: auto !important;
    width: min(100%, 860px) !important;
    max-width: none !important;
    margin: 0 auto !important;
    transform: none !important;
    z-index: auto !important;
  }

  body:has(main.password-page) .site-messenger-panel {
    margin-top: 0.25rem !important;
  }

  body:has(main.password-page) .audio-player-panel {
    margin-top: 0.75rem !important;
  }
}

/* Sapphire optical crystal public theme */
html {
  background: #020817;
}

@keyframes sapphireCausticDrift {
  0% {
    background-position: 0 0, 0 0, 0 0;
    transform: translate3d(0, 0, 0);
  }
  50% {
    background-position: 520px 180px, -96px 160px, 140px -90px;
    transform: translate3d(0, -1.5%, 0);
  }
  100% {
    background-position: 1040px 360px, -192px 320px, 280px -180px;
    transform: translate3d(0, 0, 0);
  }
}

@keyframes sapphirePrismSweep {
  0% {
    transform: translateX(-18%) rotate(0.001deg);
    opacity: 0.22;
  }
  45% {
    opacity: 0.45;
  }
  100% {
    transform: translateX(18%) rotate(0.001deg);
    opacity: 0.24;
  }
}

@keyframes sapphireUnderlineBounce {
  0% {
    transform: scaleX(0.14);
  }
  58% {
    transform: scaleX(1.08);
  }
  100% {
    transform: scaleX(1);
  }
}

body:not(:has(main.password-page)) {
  --crystal-void: #020817;
  --crystal-core: #041a52;
  --crystal-core-deep: #020c2a;
  --crystal-blue: #126dff;
  --crystal-cyan: #67efff;
  --crystal-ice: #eafcff;
  --crystal-violet: #8d78ff;
  --crystal-prism: rgba(128, 255, 219, 0.48);
  --crystal-text: #f0fbff;
  --crystal-muted: #a9c9e9;
  --crystal-edge: rgba(108, 231, 255, 0.56);
  --crystal-edge-soft: rgba(95, 186, 255, 0.26);
  --crystal-shadow: 0 26px 70px rgba(0, 9, 32, 0.54), 0 8px 24px rgba(12, 102, 255, 0.16);
  color: var(--crystal-text);
  background-color: var(--crystal-void);
  background-image:
    radial-gradient(circle at 15% 7%, rgba(45, 140, 255, 0.42), transparent 28%),
    radial-gradient(circle at 87% 9%, rgba(106, 241, 255, 0.26), transparent 26%),
    radial-gradient(circle at 50% 52%, rgba(6, 54, 145, 0.58), transparent 48%),
    linear-gradient(140deg, #020817 0%, #03123a 36%, #051d5e 58%, #020817 100%);
  text-shadow: none;
}

body:not(:has(main.password-page))::before,
body:not(:has(main.password-page))::after {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
}

body:not(:has(main.password-page))::before {
  background:
    linear-gradient(118deg, transparent 0%, transparent 9%, rgba(116, 236, 255, 0.16) 9.4%, transparent 10.2%, transparent 26%, rgba(33, 122, 255, 0.16) 26.5%, transparent 27.2%, transparent 56%, rgba(178, 245, 255, 0.13) 56.5%, transparent 57.2%),
    repeating-linear-gradient(62deg, rgba(135, 240, 255, 0.07) 0, rgba(135, 240, 255, 0.07) 1px, transparent 1px, transparent 34px),
    repeating-linear-gradient(118deg, rgba(85, 138, 255, 0.07) 0, rgba(85, 138, 255, 0.07) 1px, transparent 1px, transparent 46px);
  background-size: 1280px 840px, 92px 92px, 124px 124px;
  mix-blend-mode: screen;
  opacity: 0.46;
  animation: sapphireCausticDrift 34s linear infinite;
}

body:not(:has(main.password-page))::after {
  background:
    conic-gradient(from 28deg at 18% 24%, rgba(103, 239, 255, 0.22), transparent 12%, rgba(18, 109, 255, 0.18), transparent 30%, rgba(141, 120, 255, 0.16), transparent 48%),
    conic-gradient(from 210deg at 82% 18%, rgba(233, 252, 255, 0.18), transparent 11%, rgba(31, 126, 255, 0.20), transparent 36%),
    linear-gradient(144deg, transparent 0%, transparent 42%, rgba(125, 244, 255, 0.14) 42.4%, transparent 43.2%, transparent 65%, rgba(93, 129, 255, 0.12) 65.4%, transparent 66.1%);
  filter: saturate(140%) contrast(112%);
  mix-blend-mode: screen;
  opacity: 0.52;
  animation: sapphirePrismSweep 20s ease-in-out infinite alternate;
}

body:not(:has(main.password-page)) #particles-js,
body:not(:has(main.password-page)) #vanta-bg {
  background:
    radial-gradient(circle at 50% -8%, rgba(95, 239, 255, 0.12), transparent 34%),
    radial-gradient(circle at 52% 86%, rgba(19, 107, 255, 0.12), transparent 42%);
  filter: saturate(145%) contrast(112%);
}

body:not(:has(main.password-page)) main,
body:not(:has(main.password-page)) footer {
  position: relative;
  z-index: 1;
}

body:not(:has(main.password-page)) header {
  overflow: hidden;
  border-bottom: 1px solid rgba(118, 236, 255, 0.54);
  background:
    linear-gradient(115deg, rgba(255, 255, 255, 0.21), rgba(103, 239, 255, 0.12) 16%, rgba(14, 88, 220, 0.46) 36%, rgba(2, 14, 45, 0.92) 78%, rgba(1, 6, 20, 0.98) 100%),
    radial-gradient(circle at 10% -8%, rgba(219, 252, 255, 0.42), transparent 32%),
    radial-gradient(circle at 78% 0%, rgba(97, 174, 255, 0.26), transparent 34%),
    rgba(2, 12, 36, 0.92);
  box-shadow:
    0 20px 56px rgba(0, 8, 32, 0.52),
    0 0 0 1px rgba(130, 229, 255, 0.16),
    inset 0 1px 0 rgba(255, 255, 255, 0.44),
    inset 0 -1px 20px rgba(21, 118, 255, 0.28);
  backdrop-filter: blur(22px) saturate(185%) contrast(115%);
  -webkit-backdrop-filter: blur(22px) saturate(185%) contrast(115%);
}

body:not(:has(main.password-page)) header::before,
body:not(:has(main.password-page)) header::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
}

body:not(:has(main.password-page)) header::before {
  background:
    linear-gradient(102deg, transparent 0%, rgba(255, 255, 255, 0.30) 9%, transparent 18%),
    repeating-linear-gradient(118deg, rgba(180, 249, 255, 0.12) 0, rgba(180, 249, 255, 0.12) 1px, transparent 1px, transparent 32px),
    repeating-linear-gradient(62deg, rgba(41, 126, 255, 0.12) 0, rgba(41, 126, 255, 0.12) 1px, transparent 1px, transparent 44px);
  opacity: 0.72;
}

body:not(:has(main.password-page)) header::after {
  inset: auto 0 0;
  height: 3px;
  background: linear-gradient(90deg, transparent, #65eeff 17%, #2d8fff 45%, #9d84ff 72%, transparent);
  box-shadow: 0 0 18px rgba(101, 238, 255, 0.78), 0 -8px 26px rgba(45, 143, 255, 0.32);
}

body:not(:has(main.password-page)) header > * {
  position: relative;
  z-index: 1;
}

body:not(:has(main.password-page)) nav .nav-list li a,
body:not(:has(main.password-page)) .nav-toggle {
  color: #effcff;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.18), 0 8px 20px rgba(0, 0, 0, 0.34);
}

body:not(:has(main.password-page)) nav .nav-list li a {
  position: relative;
  isolation: isolate;
}

body:not(:has(main.password-page)) nav .nav-list li a::after {
  bottom: -0.34rem;
  height: 3px;
  border-radius: 999px;
  background:
    linear-gradient(90deg, transparent, rgba(230, 253, 255, 0.95) 8%, rgba(92, 239, 255, 0.98) 28%, rgba(30, 118, 255, 0.98) 58%, rgba(151, 126, 255, 0.92) 84%, transparent),
    radial-gradient(circle at 50% 50%, rgba(255, 255, 255, 0.82), transparent 58%);
  box-shadow:
    0 0 14px rgba(102, 238, 255, 0.78),
    0 0 30px rgba(22, 103, 255, 0.48),
    inset 0 1px 0 rgba(255, 255, 255, 0.68);
  opacity: 0.96;
  transform: scaleX(0);
  transform-origin: center;
}

body:not(:has(main.password-page)) nav .nav-list li a:hover::after,
body:not(:has(main.password-page)) nav .nav-list li a:focus-visible::after,
body:not(:has(main.password-page)) nav .nav-list li a.active::after,
body:not(:has(main.password-page)) nav .nav-list li a[aria-current="page"]::after {
  animation: sapphireUnderlineBounce 360ms cubic-bezier(0.2, 0.9, 0.22, 1.2) both;
}

body:not(:has(main.password-page)) h1,
body:not(:has(main.password-page)) h2,
body:not(:has(main.password-page)) h3,
body:not(:has(main.password-page)) h4,
body:not(:has(main.password-page)) h5,
body:not(:has(main.password-page)) h6,
body:not(:has(main.password-page)) .hero h1,
body:not(:has(main.password-page)) .home-pathway-card strong,
body:not(:has(main.password-page)) .books-next-card strong,
body:not(:has(main.password-page)) .store-promise-strip strong,
body:not(:has(main.password-page)) footer h3 {
  color: var(--crystal-text);
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.22), 0 12px 30px rgba(0, 0, 0, 0.46), 0 0 24px rgba(85, 218, 255, 0.16);
}

body:not(:has(main.password-page)) p,
body:not(:has(main.password-page)) li,
body:not(:has(main.password-page)) span,
body:not(:has(main.password-page)) small,
body:not(:has(main.password-page)) cite,
body:not(:has(main.password-page)) label,
body:not(:has(main.password-page)) .privacy,
body:not(:has(main.password-page)) .store-empty,
body:not(:has(main.password-page)) .book-item p,
body:not(:has(main.password-page)) .collector-statement p,
body:not(:has(main.password-page)) .music-store-hero p,
body:not(:has(main.password-page)) .store-form label,
body:not(:has(main.password-page)) .engagement-form label,
body:not(:has(main.password-page)) .home-pathway-card span,
body:not(:has(main.password-page)) .books-next-card span,
body:not(:has(main.password-page)) .store-promise-strip span,
body:not(:has(main.password-page)) footer p,
body:not(:has(main.password-page)) footer > p {
  color: var(--crystal-muted);
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.10), 0 10px 24px rgba(0, 0, 0, 0.32);
}

body:not(:has(main.password-page)) a {
  color: #9ef4ff;
}

body:not(:has(main.password-page)) .section-kicker,
body:not(:has(main.password-page)) .history-era-label,
body:not(:has(main.password-page)) .audio-player-badge,
body:not(:has(main.password-page)) .site-messenger-badge {
  color: #ecfdff;
  border-color: rgba(110, 234, 255, 0.40);
  background:
    linear-gradient(135deg, rgba(211, 252, 255, 0.22), rgba(40, 126, 255, 0.18)),
    rgba(6, 31, 86, 0.52);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.32), 0 10px 22px rgba(4, 25, 77, 0.28);
}

body:not(:has(main.password-page)) main > section,
body:not(:has(main.password-page)) .home-pathway-card,
body:not(:has(main.password-page)) .books-next-card,
body:not(:has(main.password-page)) .store-promise-strip article,
body:not(:has(main.password-page)) .music-product-card,
body:not(:has(main.password-page)) .book-item,
body:not(:has(main.password-page)) .edition-grid .book-item,
body:not(:has(main.password-page)) .update-card,
body:not(:has(main.password-page)) footer,
body:not(:has(main.password-page)) form {
  position: relative;
  overflow: hidden;
  isolation: isolate;
  color: var(--crystal-text);
  border-color: var(--crystal-edge);
  background:
    radial-gradient(circle at 16% 8%, rgba(227, 253, 255, 0.28), transparent 28%),
    radial-gradient(circle at 82% 18%, rgba(79, 205, 255, 0.18), transparent 32%),
    linear-gradient(135deg, rgba(255, 255, 255, 0.18), rgba(90, 210, 255, 0.10) 17%, rgba(8, 48, 138, 0.50) 47%, rgba(2, 12, 38, 0.78) 100%),
    rgba(3, 16, 48, 0.74);
  box-shadow:
    var(--crystal-shadow),
    0 0 0 1px rgba(172, 246, 255, 0.13),
    inset 0 1px 0 rgba(255, 255, 255, 0.42),
    inset 0 -1px 28px rgba(0, 74, 190, 0.38),
    inset 0 0 38px rgba(91, 233, 255, 0.10);
  backdrop-filter: blur(18px) saturate(178%) contrast(112%);
  -webkit-backdrop-filter: blur(18px) saturate(178%) contrast(112%);
}

body:not(:has(main.password-page)) main > section::before,
body:not(:has(main.password-page)) .home-pathway-card::before,
body:not(:has(main.password-page)) .books-next-card::before,
body:not(:has(main.password-page)) .store-promise-strip article::before,
body:not(:has(main.password-page)) .music-product-card::before,
body:not(:has(main.password-page)) .book-item::before,
body:not(:has(main.password-page)) .update-card::before,
body:not(:has(main.password-page)) footer::before,
body:not(:has(main.password-page)) form::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  border-radius: inherit;
  background:
    linear-gradient(121deg, rgba(255, 255, 255, 0.30), rgba(255, 255, 255, 0.04) 18%, transparent 39%),
    linear-gradient(34deg, transparent 0%, transparent 46%, rgba(126, 239, 255, 0.16) 46.5%, transparent 48%),
    repeating-linear-gradient(116deg, rgba(170, 247, 255, 0.10) 0, rgba(170, 247, 255, 0.10) 1px, transparent 1px, transparent 38px);
  mix-blend-mode: screen;
  opacity: 0.78;
}

body:not(:has(main.password-page)) main > section::after,
body:not(:has(main.password-page)) .home-pathway-card::after,
body:not(:has(main.password-page)) .books-next-card::after,
body:not(:has(main.password-page)) .store-promise-strip article::after,
body:not(:has(main.password-page)) .music-product-card::after,
body:not(:has(main.password-page)) .book-item::after,
body:not(:has(main.password-page)) .update-card::after,
body:not(:has(main.password-page)) footer::after,
body:not(:has(main.password-page)) form::after {
  content: "";
  position: absolute;
  inset: 1px;
  z-index: 0;
  pointer-events: none;
  border-radius: inherit;
  background:
    conic-gradient(from 42deg at 20% 18%, rgba(255, 255, 255, 0.28), transparent 10%, rgba(95, 239, 255, 0.13), transparent 25%),
    linear-gradient(155deg, transparent 0%, transparent 54%, rgba(141, 120, 255, 0.14) 55%, transparent 57%);
  opacity: 0.62;
}

body:not(:has(main.password-page)) main > section > *,
body:not(:has(main.password-page)) .home-pathway-card > *,
body:not(:has(main.password-page)) .books-next-card > *,
body:not(:has(main.password-page)) .store-promise-strip article > *,
body:not(:has(main.password-page)) .music-product-card > *,
body:not(:has(main.password-page)) .book-item > *,
body:not(:has(main.password-page)) .update-card > *,
body:not(:has(main.password-page)) footer > *,
body:not(:has(main.password-page)) form > * {
  position: relative;
  z-index: 1;
}

body:not(:has(main.password-page)) .hero::after {
  height: 3px;
  background: linear-gradient(90deg, transparent, #eafdff 8%, #67efff 28%, #126dff 56%, #8d78ff 78%, transparent);
  box-shadow: 0 0 20px rgba(103, 239, 255, 0.70), 0 0 42px rgba(18, 109, 255, 0.36);
}

body:not(:has(main.password-page)) .btn,
body:not(:has(main.password-page)) .donate-btn,
body:not(:has(main.password-page)) .store-filter,
body:not(:has(main.password-page)) .account-auth-tab,
body:not(:has(main.password-page)) .account-nav-chip,
body:not(:has(main.password-page)) .admin-tab,
body:not(:has(main.password-page)) .admin-thread-switch,
body:not(:has(main.password-page)) .owner-thread-button,
body:not(:has(main.password-page)) button[type="submit"] {
  color: #f0fbff;
  border-color: rgba(108, 231, 255, 0.40);
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.20), rgba(84, 220, 255, 0.12) 24%, rgba(7, 53, 155, 0.60) 100%),
    rgba(3, 22, 70, 0.72);
  box-shadow:
    0 12px 30px rgba(0, 17, 56, 0.38),
    inset 0 1px 0 rgba(255, 255, 255, 0.38),
    inset 0 -1px 16px rgba(0, 88, 220, 0.32);
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.16), 0 8px 18px rgba(0, 0, 0, 0.32);
}

body:not(:has(main.password-page)) .btn:hover,
body:not(:has(main.password-page)) .btn:focus-visible,
body:not(:has(main.password-page)) .store-filter:hover,
body:not(:has(main.password-page)) .store-filter:focus-visible,
body:not(:has(main.password-page)) .home-pathway-card:hover,
body:not(:has(main.password-page)) .books-next-card:hover,
body:not(:has(main.password-page)) .music-product-card:hover,
body:not(:has(main.password-page)) .book-item:hover,
body:not(:has(main.password-page)) .edition-grid .book-item:hover,
body:not(:has(main.password-page)) .update-card:hover,
body:not(:has(main.password-page)) button[type="submit"]:hover,
body:not(:has(main.password-page)) button[type="submit"]:focus-visible {
  border-color: rgba(164, 247, 255, 0.72);
  box-shadow:
    0 24px 58px rgba(0, 12, 42, 0.50),
    0 0 34px rgba(87, 222, 255, 0.22),
    inset 0 1px 0 rgba(255, 255, 255, 0.50),
    inset 0 -1px 22px rgba(19, 112, 255, 0.34);
}

body:not(:has(main.password-page)) .store-filter.active,
body:not(:has(main.password-page)) .account-auth-tab.active,
body:not(:has(main.password-page)) .account-nav-chip.active,
body:not(:has(main.password-page)) .admin-tab.active,
body:not(:has(main.password-page)) .admin-thread-switch.active,
body:not(:has(main.password-page)) .owner-thread-button.active,
body:not(:has(main.password-page)) .admin-messenger-thread-item.active,
body:not(:has(main.password-page)) .audio-player-btn.active,
body:not(:has(main.password-page)) .audio-player-track-item.active,
body:not(:has(main.password-page)) .site-messenger-send {
  color: #f7fdff;
  border-color: rgba(188, 251, 255, 0.76);
  background:
    radial-gradient(circle at 20% 0%, rgba(255, 255, 255, 0.42), transparent 34%),
    linear-gradient(135deg, rgba(102, 239, 255, 0.96) 0%, rgba(34, 126, 255, 0.94) 45%, rgba(139, 113, 255, 0.90) 100%);
  box-shadow:
    0 16px 40px rgba(28, 120, 255, 0.34),
    0 0 32px rgba(103, 239, 255, 0.34),
    inset 0 1px 0 rgba(255, 255, 255, 0.62),
    inset 0 -1px 20px rgba(0, 35, 122, 0.30);
}

body:not(:has(main.password-page)) input:not([type="range"]),
body:not(:has(main.password-page)) textarea,
body:not(:has(main.password-page)) select,
body:not(:has(main.password-page)) .site-messenger-panel input,
body:not(:has(main.password-page)) .site-messenger-panel textarea {
  color: #eefbff;
  border-color: rgba(116, 236, 255, 0.38);
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.12), rgba(32, 117, 255, 0.12)),
    rgba(1, 10, 31, 0.76);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.20), 0 10px 26px rgba(0, 8, 30, 0.28);
}

body:not(:has(main.password-page)) input::placeholder,
body:not(:has(main.password-page)) textarea::placeholder {
  color: rgba(188, 224, 245, 0.62);
}

body:not(:has(main.password-page)) input:not([type="range"]):focus,
body:not(:has(main.password-page)) textarea:focus,
body:not(:has(main.password-page)) select:focus {
  border-color: rgba(172, 248, 255, 0.78);
  outline: none;
  box-shadow: 0 0 0 4px rgba(103, 239, 255, 0.16), inset 0 1px 0 rgba(255, 255, 255, 0.28);
}

body:not(:has(main.password-page)) .book-item img,
body:not(:has(main.password-page)) .music-product-card img,
body:not(:has(main.password-page)) .music-product-card video,
body:not(:has(main.password-page)) .featured-upload-image,
body:not(:has(main.password-page)) .audio-player-cover-art,
body:not(:has(main.password-page)) .audio-player-video-container {
  border: 1px solid rgba(134, 240, 255, 0.38);
  background-color: #020817;
  box-shadow:
    0 18px 42px rgba(0, 8, 30, 0.44),
    0 0 30px rgba(65, 198, 255, 0.14),
    inset 0 1px 0 rgba(255, 255, 255, 0.22);
}

body:not(:has(main.password-page)) footer p a {
  color: #effcff;
  border-color: rgba(116, 236, 255, 0.42);
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.18), rgba(83, 213, 255, 0.12)),
    rgba(5, 34, 94, 0.70);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.36), 0 10px 22px rgba(0, 12, 42, 0.30);
}

body:not(:has(main.password-page)) .site-messenger-panel,
body:not(:has(main.password-page)) .audio-player-panel {
  isolation: isolate;
  border-color: rgba(121, 236, 255, 0.46);
  background:
    radial-gradient(circle at 14% 5%, rgba(236, 253, 255, 0.22), transparent 30%),
    linear-gradient(135deg, rgba(255, 255, 255, 0.16), rgba(70, 207, 255, 0.10) 22%, rgba(5, 37, 116, 0.76) 62%, rgba(1, 8, 26, 0.94) 100%);
  box-shadow:
    0 24px 66px rgba(0, 6, 24, 0.58),
    0 0 34px rgba(70, 206, 255, 0.16),
    inset 0 1px 0 rgba(255, 255, 255, 0.40),
    inset 0 -1px 28px rgba(25, 120, 255, 0.28);
  backdrop-filter: blur(22px) saturate(185%) contrast(112%);
  -webkit-backdrop-filter: blur(22px) saturate(185%) contrast(112%);
}

body:not(:has(main.password-page)) .site-messenger-panel::before,
body:not(:has(main.password-page)) .audio-player-panel::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  border-radius: inherit;
  background:
    linear-gradient(118deg, rgba(255, 255, 255, 0.26), transparent 20%, transparent 56%, rgba(103, 239, 255, 0.13) 57%, transparent 59%),
    repeating-linear-gradient(64deg, rgba(178, 248, 255, 0.10) 0, rgba(178, 248, 255, 0.10) 1px, transparent 1px, transparent 30px);
  mix-blend-mode: screen;
}

body:not(:has(main.password-page)) .site-messenger-panel > *,
body:not(:has(main.password-page)) .audio-player-panel > * {
  position: relative;
  z-index: 1;
}

body:not(:has(main.password-page)) .site-messenger-title-row strong,
body:not(:has(main.password-page)) .site-messenger-composer-header strong,
body:not(:has(main.password-page)) .audio-player-brand,
body:not(:has(main.password-page)) .audio-player-title,
body:not(:has(main.password-page)) .audio-player-track-heading,
body:not(:has(main.password-page)) .site-messenger-empty strong {
  color: #f3fdff;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.20), 0 10px 24px rgba(0, 0, 0, 0.40);
}

body:not(:has(main.password-page)) .site-messenger-identity,
body:not(:has(main.password-page)) .site-messenger-thread-meta,
body:not(:has(main.password-page)) .site-messenger-kicker,
body:not(:has(main.password-page)) .site-messenger-status,
body:not(:has(main.password-page)) .site-messenger-last-checked,
body:not(:has(main.password-page)) .audio-player-subtitle,
body:not(:has(main.password-page)) .audio-player-slider-label,
body:not(:has(main.password-page)) .audio-player-time,
body:not(:has(main.password-page)) .audio-player-track-count {
  color: rgba(197, 230, 248, 0.76);
}

body:not(:has(main.password-page)) .site-messenger-title-meta,
body:not(:has(main.password-page)) .site-messenger-form,
body:not(:has(main.password-page)) .site-messenger-messages,
body:not(:has(main.password-page)) .site-messenger-empty,
body:not(:has(main.password-page)) .site-messenger-starter,
body:not(:has(main.password-page)) .site-messenger-expand,
body:not(:has(main.password-page)) .site-messenger-toggle,
body:not(:has(main.password-page)) .site-messenger-header-actions button,
body:not(:has(main.password-page)) .audio-player-btn,
body:not(:has(main.password-page)) .audio-player-track-item,
body:not(:has(main.password-page)) .audio-player-progress-track,
body:not(:has(main.password-page)) .audio-player-slider {
  color: #eefbff;
  border-color: rgba(116, 236, 255, 0.28);
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.13), rgba(77, 211, 255, 0.08)),
    rgba(2, 17, 52, 0.56);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.20);
}

body:not(:has(main.password-page)) .site-messenger-message.from-visitor .site-messenger-bubble,
body:not(:has(main.password-page)) .site-messenger-message.from-admin .site-messenger-bubble {
  color: #f1fbff;
  border: 1px solid rgba(134, 238, 255, 0.28);
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.16), rgba(82, 222, 255, 0.10)),
    rgba(4, 26, 78, 0.72);
}

body:not(:has(main.password-page)) .audio-player-progress-fill {
  background: linear-gradient(90deg, #eafdff 0%, #67efff 24%, #126dff 62%, #8d78ff 100%);
  box-shadow: 0 0 18px rgba(103, 239, 255, 0.58), 0 0 30px rgba(18, 109, 255, 0.34);
}

body:not(:has(main.password-page)) .audio-player-slider {
  accent-color: #67efff;
}

body:not(:has(main.password-page)) .audio-player-slider::-webkit-slider-thumb {
  background: radial-gradient(circle at 28% 24%, #ffffff, #67efff 28%, #126dff 72%, #061a52 100%);
  border: 1px solid rgba(224, 253, 255, 0.72);
  box-shadow: 0 0 0 4px rgba(103, 239, 255, 0.18), 0 0 24px rgba(103, 239, 255, 0.50);
}

body:not(:has(main.password-page)) .audio-player-slider::-moz-range-thumb {
  background: radial-gradient(circle at 28% 24%, #ffffff, #67efff 28%, #126dff 72%, #061a52 100%);
  border: 1px solid rgba(224, 253, 255, 0.72);
  box-shadow: 0 0 0 4px rgba(103, 239, 255, 0.18), 0 0 24px rgba(103, 239, 255, 0.50);
}

@media (max-width: 800px) {
  body:not(:has(main.password-page)) nav .nav-list {
    background:
      linear-gradient(135deg, rgba(255, 255, 255, 0.16), rgba(66, 206, 255, 0.10)),
      rgba(2, 12, 37, 0.96);
    border-bottom: 1px solid rgba(118, 236, 255, 0.42);
    box-shadow: 0 18px 42px rgba(0, 7, 28, 0.48), inset 0 1px 0 rgba(255, 255, 255, 0.20);
    backdrop-filter: blur(20px) saturate(175%);
    -webkit-backdrop-filter: blur(20px) saturate(175%);
  }
}

body:has(main.password-page) .site-messenger-panel textarea,
body:has(main.password-page) .site-messenger-panel input,
body:has(main.password-page) .site-messenger-panel textarea::placeholder,
body:has(main.password-page) .site-messenger-panel input::placeholder {
  text-shadow: none !important;
}

body:has(main.password-page) .site-messenger-send,
body:has(main.password-page) .site-messenger-title-row strong,
body:has(main.password-page) .site-messenger-composer-header strong,
body:has(main.password-page) .site-messenger-identity,
body:has(main.password-page) .site-messenger-thread-meta,
body:has(main.password-page) .site-messenger-last-checked,
body:has(main.password-page) .site-messenger-badge,
body:has(main.password-page) .site-messenger-status,
body:has(main.password-page) .site-messenger-rail-actions,
body:has(main.password-page) .site-messenger-empty strong,
body:has(main.password-page) .site-messenger-empty span {
  text-shadow: 0 1px 0 rgba(255, 214, 214, 0.22), 0 -1px 0 rgba(58, 0, 0, 0.9) !important;
}

body:has(main.password-page) .site-messenger-header-actions .site-messenger-call-action {
  display: none !important;
}

body:has(main.password-page) .site-messenger-panel.signed-in .site-messenger-header-actions .site-messenger-call-action:not([hidden]) {
  display: inline-flex !important;
}

.art-protected-media {
  cursor: zoom-in;
  -webkit-user-drag: none;
  user-select: none;
  touch-action: manipulation;
}

.art-protected-media:focus-visible {
  outline: 3px solid rgba(88, 152, 255, 0.9);
  outline-offset: 4px;
}

.art-zoom-open {
  overflow: hidden;
}

.art-zoom-viewer {
  position: fixed;
  inset: 0;
  z-index: 5000;
  display: none;
  align-items: center;
  justify-content: center;
  padding: clamp(12px, 3vw, 36px);
  background: rgba(5, 9, 16, 0.84);
  backdrop-filter: blur(12px) saturate(120%);
  -webkit-backdrop-filter: blur(12px) saturate(120%);
  box-sizing: border-box;
}

.art-zoom-viewer.is-open {
  display: flex;
}

.art-zoom-shell {
  position: relative;
  width: min(100%, 1120px);
  height: min(100%, 860px);
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  gap: 12px;
}

.art-zoom-toolbar {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 8px;
}

/* Workspace overhaul: admin, account, and messenger */

body.admin-experience,
body.account-experience {
  --workspace-ink: #0d2133;
  --workspace-muted: #4f677b;
  --workspace-line: rgba(24, 56, 87, 0.16);
  --workspace-soft: rgba(255, 255, 255, 0.3);
  --workspace-elev: 0 18px 42px rgba(15, 34, 54, 0.16);
}

body.admin-experience .admin-page {
  width: min(100% - 2rem, 1320px);
}

body.admin-experience .admin-dashboard {
  width: min(100%, 1260px);
  gap: 1.15rem;
}

body.admin-experience .admin-heading {
  align-items: flex-start;
  padding: 0.35rem 0.25rem;
}

body.admin-experience .admin-actions {
  gap: 0.5rem;
}

body.admin-experience .admin-workspace-bar {
  justify-content: flex-start;
  gap: 0.45rem;
  margin-top: 0.2rem;
}

body.admin-experience .admin-workspace-chip {
  min-height: 34px;
  padding: 0.4rem 0.75rem;
  font-size: 0.72rem;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

body.admin-experience .admin-ops-grid {
  grid-template-columns: repeat(12, minmax(0, 1fr));
  align-items: start;
  gap: 0.9rem;
}

body.admin-experience #admin-focus-panel {
  grid-column: span 4;
}

body.admin-experience #admin-system-section {
  grid-column: span 4;
}

body.admin-experience #admin-activity-section {
  grid-column: span 4;
}

body.admin-experience #admin-email-studio-section {
  grid-column: span 6;
}

body.admin-experience #admin-content-studio-section {
  grid-column: span 6;
}

body.admin-experience .admin-panel,
body.admin-experience .admin-records-panel,
body.admin-experience .admin-detail-panel {
  border-color: var(--workspace-line);
  background:
    linear-gradient(150deg, rgba(255,255,255,0.56), rgba(255,255,255,0.16) 52%, rgba(25,64,99,0.07)),
    var(--workspace-soft);
  box-shadow: var(--workspace-elev), inset 0 1px 0 rgba(255,255,255,0.44);
}

body.admin-experience .admin-panel-heading h2,
body.admin-experience .admin-section-heading h2,
body.admin-experience .admin-detail-heading h2 {
  color: var(--workspace-ink);
  font-size: 1rem;
}

body.admin-experience .admin-panel.collapsed,
body.admin-experience .admin-records-panel.collapsed,
body.admin-experience .admin-overview-section.collapsed {
  padding: 0.58rem 0.72rem;
  border-color: rgba(30, 68, 104, 0.22);
  box-shadow: 0 8px 18px rgba(15, 34, 54, 0.1), inset 0 1px 0 rgba(255,255,255,0.4);
}

body.admin-experience .admin-collapse-toggle {
  min-height: 28px;
  padding: 0.3rem 0.62rem;
  font-size: 0.68rem;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

body.admin-experience .admin-controls {
  grid-template-columns: minmax(200px, 1fr) repeat(4, minmax(120px, 145px)) auto;
  gap: 0.7rem;
  margin-top: 0.75rem;
}

body.admin-experience .admin-controls label {
  font-size: 0.76rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

body.admin-experience .admin-controls input,
body.admin-experience .admin-controls select {
  min-height: 38px;
  font-size: 0.84rem;
}

body.admin-experience .admin-tabs {
  position: sticky;
  top: 5.6rem;
  z-index: 5;
  padding: 0.55rem;
  border: 1px solid rgba(24,56,87,0.14);
  border-radius: 16px;
  background: rgba(246, 252, 255, 0.8);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}

body.admin-experience .admin-tab {
  min-height: 34px;
  padding: 0.4rem 0.7rem;
  border-radius: 999px;
  font-size: 0.73rem;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

body.admin-experience .admin-messenger-workspace {
  grid-template-columns: minmax(300px, 0.36fr) 1fr;
  min-height: 72vh;
  max-height: 78vh;
  margin-top: 0.7rem;
}

body.admin-experience .admin-messenger-thread-rail,
body.admin-experience .admin-messenger-chat {
  border-color: rgba(20,56,88,0.18);
  border-radius: 22px;
  background:
    linear-gradient(145deg, rgba(255,255,255,0.62), rgba(255,255,255,0.2) 52%, rgba(22,61,97,0.06)),
    rgba(255,255,255,0.38);
  box-shadow: 0 16px 32px rgba(16, 37, 58, 0.12), inset 0 1px 0 rgba(255,255,255,0.5);
}

body.admin-experience .admin-messenger-thread-item {
  border-radius: 16px;
  min-height: 64px;
}

body.admin-experience .admin-messenger-thread-item.active {
  border-color: rgba(56, 121, 187, 0.64);
  box-shadow: 0 10px 24px rgba(31, 78, 132, 0.18);
}

body.admin-experience .admin-messenger-chat-header {
  padding: 0.95rem 1rem;
}

body.admin-experience .admin-messenger-chat-messages {
  padding: 1rem;
}

body.admin-experience .admin-messenger-inline-reply textarea {
  min-height: 112px;
}

body.account-experience .account-page {
  width: min(100% - 2rem, 1200px);
}

body.account-experience .account-dashboard {
  width: min(100%, 1140px);
  gap: 1rem;
}

body.account-experience .account-dashboard-nav {
  position: sticky;
  top: 5.6rem;
  z-index: 5;
  justify-content: flex-start;
  padding: 0.55rem;
  border: 1px solid rgba(24,56,87,0.14);
  border-radius: 16px;
  background: rgba(246, 252, 255, 0.8);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}

body.account-experience .account-nav-chip {
  min-height: 34px;
  padding: 0.4rem 0.72rem;
  font-size: 0.72rem;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

body.account-experience .account-nav-chip.active {
  border-color: rgba(56,121,187,0.54);
  background: rgba(220, 239, 255, 0.55);
}

body.account-experience .account-summary-grid {
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 0.62rem;
}

body.account-experience .account-summary-card {
  min-height: 76px;
  border-color: rgba(24,56,87,0.14);
  border-radius: 16px;
}

body.account-experience .account-section {
  border-color: var(--workspace-line);
  border-radius: 22px;
  background:
    linear-gradient(150deg, rgba(255,255,255,0.58), rgba(255,255,255,0.18) 52%, rgba(24,63,99,0.07)),
    var(--workspace-soft);
}

body.account-experience .account-record-list {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.65rem;
}

body.account-experience .account-record {
  min-height: 78px;
  align-items: flex-start;
  flex-direction: column;
  gap: 0.35rem;
  border-color: rgba(24,56,87,0.15);
}

body.account-experience .account-release-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.65rem;
}

body.account-experience .owner-messenger-grid {
  grid-template-columns: minmax(280px, 0.36fr) 1fr;
  gap: 0.9rem;
}

body.account-experience .owner-messenger-threads {
  max-height: 56vh;
  padding-right: 0.35rem;
}

body.account-experience .owner-thread-button {
  border-radius: 16px;
  min-height: 66px;
  border-color: rgba(24,56,87,0.14);
  background:
    linear-gradient(140deg, rgba(255,255,255,0.56), rgba(255,255,255,0.16)),
    rgba(255,255,255,0.32);
}

body.account-experience .owner-thread-button.active {
  border-color: rgba(58,123,188,0.6);
  box-shadow: 0 10px 22px rgba(25, 63, 104, 0.16);
}

body.account-experience .owner-messenger-thread-title,
body.account-experience .owner-messenger-messages {
  border-color: rgba(24,56,87,0.16);
  background:
    linear-gradient(145deg, rgba(255,255,255,0.52), rgba(255,255,255,0.15)),
    rgba(255,255,255,0.28);
}

body.account-experience .owner-messenger-messages {
  max-height: 56vh;
}

.site-messenger-panel {
  left: 16px;
  right: auto;
  bottom: 16px;
  width: min(420px, calc(100% - 32px));
  border-radius: 24px;
  border-color: rgba(255,255,255,0.24);
  background:
    linear-gradient(150deg, rgba(255,255,255,0.2), rgba(255,255,255,0.05) 44%, rgba(71,127,214,0.14)),
    rgba(8, 16, 32, 0.95);
}

.site-messenger-panel {
  position: fixed !important;
  top: auto !important;
  left: 16px !important;
  right: auto !important;
  bottom: 16px !important;
  margin: 0 !important;
  transform: none !important;
}

.site-messenger-thread-meta,
.site-messenger-last-checked {
  display: none;
}

.site-messenger-messages {
  max-height: 280px;
  padding-right: 2px;
}

.site-messenger-panel.expanded .site-messenger-messages {
  max-height: 420px;
}

.site-messenger-message {
  gap: 8px;
}

.site-messenger-bubble {
  border-radius: 16px;
  border: 1px solid rgba(255,255,255,0.14);
}

@media (max-width: 1120px) {
  body.admin-experience .admin-ops-grid {
    grid-template-columns: repeat(6, minmax(0, 1fr));
  }

  body.admin-experience #admin-focus-panel,
  body.admin-experience #admin-system-section,
  body.admin-experience #admin-activity-section,
  body.admin-experience #admin-email-studio-section,
  body.admin-experience #admin-content-studio-section {
    grid-column: span 3;
  }

  body.account-experience .account-summary-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

@media (max-width: 800px) {
  body.admin-experience .admin-ops-grid,
  body.account-experience .account-record-list,
  body.account-experience .account-release-grid,
  body.account-experience .owner-messenger-grid {
    grid-template-columns: 1fr;
  }

  body.admin-experience .admin-tabs,
  body.account-experience .account-dashboard-nav {
    position: static;
  }

  body.account-experience .account-summary-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .site-messenger-panel,
  .site-messenger-panel.expanded {
    right: 8px;
    left: 8px;
    width: auto;
    max-width: none;
  }
}

.site-messenger-actions {
  align-items: center;
  gap: 8px;
}

.site-messenger-attach,
.site-messenger-voice,
.site-messenger-hide-message,
.site-messenger-pending-item {
  border: 1px solid rgba(255,255,255,0.28);
  border-radius: 999px;
  background: rgba(255,255,255,0.12);
  color: #eaf4ff;
  font: 700 0.72rem 'Lato', Arial, sans-serif;
  min-height: 30px;
  padding: 0.32rem 0.72rem;
  cursor: pointer;
}

.site-messenger-attach:hover,
.site-messenger-voice:hover,
.site-messenger-hide-message:hover,
.site-messenger-pending-item:hover {
  background: rgba(255,255,255,0.2);
}

.site-messenger-pending-attachments {
  display: grid;
  gap: 0.35rem;
  margin-top: 0.45rem;
}

.site-messenger-pending-item {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  border-radius: 12px;
  padding: 0.35rem 0.6rem;
}

.site-messenger-pending-item strong {
  color: #9fc6ff;
  font-size: 0.66rem;
  text-transform: uppercase;
}

.site-messenger-attachments {
  display: grid;
  gap: 0.45rem;
  margin-top: 0.45rem;
}

.site-messenger-attachment {
  display: block;
  width: 100%;
  border: 1px solid rgba(255,255,255,0.2);
  border-radius: 12px;
  overflow: hidden;
  background: rgba(255,255,255,0.08);
}

.site-messenger-attachment.image img,
.site-messenger-attachment.video video {
  width: 100%;
  max-height: 220px;
  object-fit: cover;
  display: block;
}

.site-messenger-attachment.audio audio {
  width: 100%;
  display: block;
}

.site-messenger-attachment.file {
  padding: 0.55rem 0.7rem;
  color: #d6eaff;
  text-decoration: none;
  font-weight: 700;
}

.site-messenger-hide-message {
  margin-top: 0.45rem;
  min-height: 26px;
  font-size: 0.64rem;
  opacity: 0.85;
}

.admin-messenger-chat-attachments {
  display: grid;
  gap: 0.45rem;
  margin-top: 0.5rem;
}

.admin-messenger-attachment {
  display: block;
  border: 1px solid rgba(46,78,112,0.2);
  border-radius: 12px;
  overflow: hidden;
  background: rgba(255,255,255,0.28);
}

.admin-messenger-attachment.image img,
.admin-messenger-attachment.video video {
  width: 100%;
  max-height: 220px;
  object-fit: cover;
  display: block;
}

.admin-messenger-attachment.audio audio {
  width: 100%;
  display: block;
}

.admin-messenger-attachment.file {
  padding: 0.55rem 0.7rem;
  color: #16304a;
  text-decoration: none;
  font-weight: 800;
}

.owner-message-attachments {
  display: grid;
  gap: 0.45rem;
  margin-top: 0.5rem;
}

.owner-message-attachment {
  display: block;
  border: 1px solid rgba(255,255,255,0.2);
  border-radius: 12px;
  overflow: hidden;
  background: rgba(255,255,255,0.14);
}

.owner-message-attachment.image img,
.owner-message-attachment.video video {
  width: 100%;
  max-height: 220px;
  object-fit: cover;
  display: block;
}

.owner-message-attachment.audio audio {
  width: 100%;
  display: block;
}

.owner-message-attachment.file {
  padding: 0.55rem 0.7rem;
  color: inherit;
  text-decoration: none;
  font-weight: 800;
}

/* Next-gen messenger visual system */

.site-messenger-panel {
  width: min(460px, calc(100% - 32px));
  border-radius: 28px;
  border: 1px solid rgba(167, 214, 255, 0.24);
  background:
    radial-gradient(circle at 10% -20%, rgba(106, 212, 255, 0.24), transparent 42%),
    radial-gradient(circle at 90% 0%, rgba(139, 255, 207, 0.16), transparent 45%),
    linear-gradient(160deg, rgba(7, 17, 33, 0.98), rgba(10, 24, 46, 0.97) 56%, rgba(9, 31, 62, 0.97));
  box-shadow:
    0 32px 72px rgba(2, 9, 20, 0.58),
    inset 0 1px 0 rgba(255, 255, 255, 0.2),
    inset 0 -1px 0 rgba(151, 215, 255, 0.08);
  overflow: hidden;
}

.site-messenger-panel::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    repeating-linear-gradient(
      -45deg,
      rgba(122, 196, 255, 0.03) 0,
      rgba(122, 196, 255, 0.03) 2px,
      transparent 2px,
      transparent 10px
    );
}

.site-messenger-panel.expanded {
  width: min(620px, calc(100% - 32px));
}

.site-messenger-header {
  padding: 0.95rem 1rem;
  border-bottom: 1px solid rgba(157, 215, 255, 0.14);
  background: linear-gradient(180deg, rgba(255,255,255,0.08), rgba(255,255,255,0.02));
}

.site-messenger-kicker {
  color: #7cc8ff;
  font-size: 0.65rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  font-weight: 900;
}

.site-messenger-title-row strong {
  color: #eef7ff;
  font-size: 1.2rem;
  line-height: 1.1;
}

.site-messenger-identity {
  color: rgba(233, 244, 255, 0.8);
  font-size: 0.75rem;
  font-weight: 700;
}

.site-messenger-capability-bar {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
  margin-top: 0.1rem;
}

.site-messenger-capability-bar span {
  min-height: 24px;
  display: inline-flex;
  align-items: center;
  padding: 0.2rem 0.55rem;
  border: 1px solid rgba(153, 213, 255, 0.18);
  border-radius: 999px;
  background: rgba(255,255,255,0.06);
  color: #d9efff;
  font-size: 0.6rem;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.site-messenger-header-actions button {
  min-width: 74px;
  border: 1px solid rgba(161, 213, 255, 0.2);
  border-radius: 999px;
  background: rgba(255,255,255,0.08);
  color: #d9edff;
  font-size: 0.68rem;
  font-weight: 900;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

.site-messenger-body {
  padding: 0.95rem;
  display: grid;
  gap: 0.75rem;
}

.site-messenger-presence {
  border: 1px solid rgba(145, 204, 255, 0.16);
  border-radius: 14px;
  padding: 0.5rem 0.7rem;
  background: rgba(255,255,255,0.04);
}

.site-messenger-presence strong {
  color: #eff8ff;
}

.site-messenger-presence span {
  color: rgba(217, 236, 255, 0.7);
}

.site-messenger-messages {
  max-height: 340px;
  border: 1px solid rgba(143, 204, 255, 0.14);
  border-radius: 16px;
  padding: 0.7rem;
  background:
    linear-gradient(180deg, rgba(255,255,255,0.06), rgba(255,255,255,0.02));
}

.site-messenger-panel.expanded .site-messenger-messages {
  max-height: 500px;
}

.site-messenger-message {
  align-items: start;
  gap: 10px;
  margin-bottom: 0.65rem;
}

.site-messenger-avatar {
  width: 34px;
  height: 34px;
  border-radius: 12px;
  overflow: hidden;
  border: 1px solid rgba(161, 213, 255, 0.22);
}

.site-messenger-bubble {
  border-radius: 14px;
  border: 1px solid rgba(161, 213, 255, 0.2);
  padding: 0.6rem 0.7rem;
  backdrop-filter: blur(5px);
}

.site-messenger-message.from-visitor .site-messenger-bubble {
  background: linear-gradient(145deg, rgba(138, 203, 255, 0.28), rgba(124, 176, 255, 0.14));
  color: #eef8ff;
}

.site-messenger-message.from-admin .site-messenger-bubble {
  background: linear-gradient(145deg, rgba(235, 248, 255, 0.95), rgba(220, 238, 255, 0.85));
  color: #0f2538;
}

.site-messenger-bubble div {
  font-size: 0.92rem;
  line-height: 1.45;
}

.site-messenger-bubble small {
  margin-top: 0.45rem;
  font-size: 0.68rem;
  letter-spacing: 0.03em;
}

.site-messenger-form {
  border: 1px solid rgba(145, 204, 255, 0.18);
  border-radius: 16px;
  padding: 0.7rem;
  background: rgba(255,255,255,0.04);
}

.site-messenger-starters {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0.45rem;
}

.site-messenger-starter {
  border-radius: 999px;
  border: 1px solid rgba(145, 204, 255, 0.2);
  background: rgba(255,255,255,0.06);
  color: #d8edff;
  font-size: 0.64rem;
  font-weight: 900;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

.site-messenger-panel textarea,
.site-messenger-panel input {
  border-radius: 12px;
  border: 1px solid rgba(145, 204, 255, 0.2);
  background: rgba(10, 24, 44, 0.68);
  color: #ecf7ff;
}

.site-messenger-panel textarea::placeholder,
.site-messenger-panel input::placeholder {
  color: rgba(199, 227, 255, 0.58);
}

.site-messenger-actions {
  grid-template-columns: auto auto 1fr auto;
  gap: 0.45rem;
}

.site-messenger-send {
  min-height: 34px;
  border-radius: 999px;
  border: 1px solid rgba(149, 214, 255, 0.3);
  background: linear-gradient(135deg, rgba(80, 196, 255, 0.88), rgba(88, 154, 255, 0.92));
  color: #061729;
  font-size: 0.72rem;
  font-weight: 900;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

.site-messenger-attach,
.site-messenger-voice {
  min-height: 34px;
  padding: 0.36rem 0.7rem;
  border-radius: 999px;
  border: 1px solid rgba(149, 214, 255, 0.22);
  background: rgba(255,255,255,0.07);
  color: #dff1ff;
  font-size: 0.67rem;
  font-weight: 900;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

.site-messenger-call-action {
  min-height: 34px;
  padding: 0.36rem 0.72rem;
  border: 1px solid rgba(130, 255, 204, 0.22);
  border-radius: 999px;
  background: rgba(114, 255, 199, 0.08);
  color: #dffcf1;
  font-size: 0.67rem;
  font-weight: 900;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

.site-messenger-call-card,
.owner-message-call-card,
.admin-messenger-call-card {
  display: grid;
  gap: 0.35rem;
  margin-top: 0.55rem;
  padding: 0.65rem 0.7rem;
  border: 1px solid rgba(117, 240, 194, 0.28);
  border-radius: 14px;
  background: linear-gradient(145deg, rgba(87, 255, 194, 0.14), rgba(114, 193, 255, 0.12));
}

.site-messenger-call-card strong,
.owner-message-call-card strong,
.admin-messenger-call-card strong {
  font-size: 0.76rem;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

.site-messenger-call-card span,
.owner-message-call-card span,
.admin-messenger-call-card span {
  font-size: 0.82rem;
  line-height: 1.4;
}

.site-messenger-call-join {
  justify-self: start;
  min-height: 32px;
  padding: 0.36rem 0.8rem;
  border: 1px solid rgba(146, 222, 255, 0.28);
  border-radius: 999px;
  background: rgba(255,255,255,0.14);
  color: inherit;
  font-size: 0.68rem;
  font-weight: 900;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

/* Messenger flagship refinement */

.site-messenger-panel {
  width: min(520px, calc(100% - 32px));
  border-radius: 32px;
  border: 1px solid rgba(146, 214, 255, 0.22);
  background:
    radial-gradient(circle at 18% -10%, rgba(107, 224, 255, 0.22), transparent 38%),
    radial-gradient(circle at 100% 0%, rgba(112, 255, 201, 0.14), transparent 34%),
    linear-gradient(180deg, rgba(5, 14, 28, 0.99), rgba(7, 19, 37, 0.985) 50%, rgba(9, 28, 52, 0.98));
  box-shadow:
    0 34px 84px rgba(3, 10, 22, 0.66),
    inset 0 1px 0 rgba(255,255,255,0.18),
    inset 0 -1px 0 rgba(126, 214, 255, 0.08);
  transition: transform 220ms ease, width 220ms ease, height 220ms ease, box-shadow 220ms ease;
}

.site-messenger-panel.expanded {
  left: 50%;
  right: auto;
  bottom: 50%;
  transform: translate(-50%, 50%);
  width: min(1120px, calc(100vw - 40px));
  height: min(82vh, 860px);
  max-height: min(82vh, 860px);
  z-index: 2100;
  box-shadow:
    0 42px 110px rgba(3, 10, 22, 0.74),
    inset 0 1px 0 rgba(255,255,255,0.18),
    inset 0 -1px 0 rgba(126, 214, 255, 0.08);
}

body.site-messenger-overlay-open::after {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 2090;
  pointer-events: none;
  background: rgba(6, 14, 26, 0.5);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}

.site-messenger-header {
  padding: 1rem 1.05rem 0.9rem;
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 0.8rem;
}

.site-messenger-heading {
  display: grid;
  gap: 0.2rem;
}

.site-messenger-title-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
}

.site-messenger-title-row strong {
  font-size: 1.3rem;
  font-weight: 900;
}

.site-messenger-badge {
  min-width: 24px;
  min-height: 24px;
  display: inline-grid;
  place-items: center;
  border-radius: 999px;
  background: linear-gradient(135deg, #7cf2d4, #72b6ff);
  color: #041423;
  font-size: 0.72rem;
  font-weight: 900;
}

.site-messenger-header-actions {
  display: flex;
  align-items: start;
  gap: 0.45rem;
}

.site-messenger-header-actions button {
  min-width: 0;
  min-height: 34px;
  padding: 0.35rem 0.72rem;
}

.site-messenger-body {
  padding: 0 1.05rem 1.05rem;
  gap: 0.85rem;
}

.site-messenger-panel.expanded .site-messenger-body {
  height: calc(100% - 92px);
  grid-template-columns: minmax(0, 1.45fr) minmax(320px, 0.82fr);
  align-items: stretch;
}

.site-messenger-messages {
  min-height: 280px;
  max-height: 50vh;
  padding: 0.95rem;
  border-radius: 20px;
  background:
    linear-gradient(180deg, rgba(255,255,255,0.055), rgba(255,255,255,0.018)),
    rgba(255,255,255,0.02);
}

.site-messenger-panel.expanded .site-messenger-messages {
  max-height: none;
  min-height: 0;
  height: 100%;
  grid-column: 1;
  margin: 0;
}

.site-messenger-message {
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr);
  gap: 0.75rem;
  margin-bottom: 0.8rem;
}

.site-messenger-message.from-admin {
  grid-template-columns: minmax(0, 1fr) 38px;
}

.site-messenger-message.from-admin .site-messenger-avatar {
  grid-column: 2;
}

.site-messenger-message.from-admin .site-messenger-bubble {
  grid-column: 1;
  justify-self: end;
}

.site-messenger-avatar {
  width: 38px;
  height: 38px;
  border-radius: 14px;
  background: rgba(255,255,255,0.08);
}

.site-messenger-bubble {
  width: min(100%, 100%);
  display: grid;
  gap: 0.4rem;
  padding: 0.8rem 0.9rem;
  border-radius: 18px;
}

.site-messenger-message.from-visitor .site-messenger-bubble {
  justify-self: start;
  max-width: 88%;
}

.site-messenger-message.from-admin .site-messenger-bubble {
  max-width: 88%;
}

.site-messenger-bubble div {
  font-size: 0.95rem;
  line-height: 1.5;
  white-space: pre-wrap;
}

.site-messenger-bubble small {
  font-size: 0.68rem;
  opacity: 0.8;
}

.site-messenger-hide-message {
  justify-self: start;
  margin-top: 0.1rem;
  opacity: 0;
  transform: translateY(4px);
  transition: opacity 160ms ease, transform 160ms ease;
}

.site-messenger-bubble:hover .site-messenger-hide-message,
.site-messenger-bubble:focus-within .site-messenger-hide-message {
  opacity: 1;
  transform: translateY(0);
}

.site-messenger-form {
  display: grid;
  gap: 0.75rem;
  padding: 0.9rem;
  border-radius: 20px;
  border: 1px solid rgba(146, 214, 255, 0.16);
  background:
    linear-gradient(180deg, rgba(255,255,255,0.06), rgba(255,255,255,0.025)),
    rgba(0,0,0,0.08);
}

.site-messenger-panel.expanded .site-messenger-form {
  grid-column: 2;
  align-self: stretch;
  grid-template-rows: auto minmax(160px, 1fr) auto auto;
  min-height: 0;
}

.site-messenger-panel.expanded .site-messenger-form::before {
  content: "Compose Secure Message";
  display: block;
  color: #eff8ff;
  font-size: 0.72rem;
  font-weight: 900;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.site-messenger-identity-fields {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.55rem;
}

.site-messenger-panel.expanded .site-messenger-identity-fields {
  grid-template-columns: 1fr;
}

.site-messenger-panel textarea {
  min-height: 112px;
  padding: 0.85rem 0.9rem;
  font-size: 0.95rem;
  line-height: 1.5;
}

.site-messenger-panel.expanded textarea {
  min-height: 100%;
  height: 100%;
}

.site-messenger-actions {
  display: grid;
  grid-template-columns: auto auto auto auto 1fr auto;
  gap: 0.45rem;
  align-items: center;
}

.site-messenger-attach,
.site-messenger-voice,
.site-messenger-call-action {
  min-height: 34px;
  padding: 0.4rem 0.7rem;
  font-size: 0.64rem;
  letter-spacing: 0.06em;
}

.site-messenger-send {
  min-width: 112px;
  min-height: 38px;
  border-radius: 14px;
  font-size: 0.7rem;
  letter-spacing: 0.08em;
}

.site-messenger-action-meta {
  justify-self: stretch;
}

.site-messenger-status {
  text-align: left;
}

@media (max-width: 800px) {
  .site-messenger-panel.expanded,
  .site-messenger-panel {
    width: auto;
    height: auto;
    max-height: none;
    transform: none;
    left: 8px;
    right: 8px;
    bottom: 8px;
  }

  .site-messenger-identity-fields {
    grid-template-columns: 1fr;
  }

  .site-messenger-panel.expanded .site-messenger-body {
    height: auto;
    grid-template-columns: 1fr;
  }

  .site-messenger-panel.expanded .site-messenger-form,
  .site-messenger-panel.expanded .site-messenger-messages {
    grid-column: auto;
    height: auto;
  }

  .site-messenger-actions {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .site-messenger-action-meta {
    grid-column: 1 / -1;
    order: 5;
  }

  .site-messenger-send {
    grid-column: 1 / -1;
    order: 6;
  }
}

.site-messenger-action-meta {
  min-height: 34px;
  display: grid;
  align-content: center;
}

.site-messenger-status {
  font-size: 0.68rem;
  font-weight: 700;
}

.site-messenger-empty {
  border-radius: 12px;
  border: 1px dashed rgba(151, 214, 255, 0.22);
  background: rgba(255,255,255,0.03);
  color: #dcf0ff;
  padding: 0.8rem;
}

.site-messenger-panel.minimized {
  border-radius: 999px;
  width: min(332px, calc(100% - 24px));
  padding: 0;
}

@media (max-width: 800px) {
  .site-messenger-panel,
  .site-messenger-panel.expanded {
    width: auto;
    max-width: none;
  }

  .site-messenger-actions {
    grid-template-columns: 1fr 1fr;
  }

  .site-messenger-action-meta {
    grid-column: 1 / -1;
    order: 3;
  }

  .site-messenger-send {
    grid-column: 1 / -1;
    order: 4;
  }
}

/* Final messenger workspace override */
.site-messenger-panel {
  width: min(560px, calc(100% - 32px));
  border-radius: 30px;
  border: 1px solid rgba(147, 214, 255, 0.22);
  background:
    radial-gradient(circle at 12% -18%, rgba(104, 211, 255, 0.24), transparent 38%),
    radial-gradient(circle at 92% 0%, rgba(111, 255, 200, 0.14), transparent 34%),
    linear-gradient(180deg, rgba(5, 13, 26, 0.99), rgba(7, 18, 35, 0.985) 52%, rgba(8, 25, 48, 0.98));
  box-shadow:
    0 34px 88px rgba(3, 10, 22, 0.68),
    inset 0 1px 0 rgba(255, 255, 255, 0.18),
    inset 0 -1px 0 rgba(129, 214, 255, 0.08);
  overflow: hidden;
  transition: transform 220ms ease, width 220ms ease, height 220ms ease, box-shadow 220ms ease;
}

.site-messenger-panel::before {
  opacity: 0.7;
}

.site-messenger-panel.expanded {
  left: 50%;
  right: auto;
  bottom: 50%;
  transform: translate(-50%, 50%);
  width: min(1180px, calc(100vw - 32px));
  height: min(84vh, 900px);
  max-height: min(84vh, 900px);
  z-index: 2100;
  box-shadow:
    0 44px 120px rgba(3, 10, 22, 0.74),
    inset 0 1px 0 rgba(255, 255, 255, 0.18),
    inset 0 -1px 0 rgba(129, 214, 255, 0.08);
}

body.site-messenger-overlay-open::after {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 2090;
  pointer-events: none;
  background: rgba(6, 14, 26, 0.5);
  backdrop-filter: blur(9px);
  -webkit-backdrop-filter: blur(9px);
}

.site-messenger-header {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 0.9rem;
  padding: 1rem 1.05rem 0.9rem;
  border-bottom-color: rgba(155, 214, 255, 0.12);
}

.site-messenger-heading {
  gap: 0.28rem;
}

.site-messenger-title-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.6rem;
}

.site-messenger-title-row strong {
  color: #f3fbff;
  font-size: 1.33rem;
  font-weight: 900;
}

.site-messenger-title-meta {
  min-height: 24px;
  display: inline-flex;
  align-items: center;
  padding: 0.18rem 0.55rem;
  border: 1px solid rgba(132, 214, 255, 0.2);
  border-radius: 999px;
  background: rgba(255,255,255,0.06);
  color: #d9efff;
  font-size: 0.66rem;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.site-messenger-badge {
  min-width: 26px;
  min-height: 26px;
  box-shadow: 0 8px 18px rgba(104, 237, 207, 0.24);
}

.site-messenger-identity,
.site-messenger-thread-meta {
  color: rgba(222, 241, 255, 0.78);
  font-size: 0.75rem;
  font-weight: 700;
}

.site-messenger-header-actions {
  gap: 0.5rem;
}

.site-messenger-header-actions button {
  min-height: 34px;
  padding: 0.38rem 0.72rem;
}

.site-messenger-body {
  display: grid;
  gap: 0.9rem;
  padding: 0 1.05rem 1.05rem;
}

.site-messenger-workspace {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 0.95rem;
  align-items: stretch;
}

.site-messenger-panel.expanded .site-messenger-workspace {
  grid-template-columns: minmax(0, 1.35fr) minmax(260px, 0.78fr);
}

.site-messenger-conversation {
  display: grid;
  gap: 0.85rem;
  min-width: 0;
}

.site-messenger-state-card,
.site-messenger-rail,
.site-messenger-form,
.site-messenger-messages {
  border: 1px solid rgba(147, 214, 255, 0.14);
  border-radius: 22px;
  background:
    linear-gradient(180deg, rgba(255,255,255,0.06), rgba(255,255,255,0.025)),
    rgba(0,0,0,0.08);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.12);
}

.site-messenger-state-card {
  display: grid;
  gap: 0.22rem;
  padding: 0.82rem 0.92rem;
}

.site-messenger-state-title {
  color: #76caff;
  font-size: 0.66rem;
  font-weight: 900;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.site-messenger-state-value {
  color: #f3fbff;
  font-size: 1.05rem;
  font-weight: 900;
}

.site-messenger-state-note {
  color: rgba(220, 239, 255, 0.75);
  font-size: 0.82rem;
}

.site-messenger-messages {
  min-height: 280px;
  max-height: none;
  height: 100%;
  padding: 0.95rem;
  border-radius: 24px;
  background:
    linear-gradient(180deg, rgba(255,255,255,0.055), rgba(255,255,255,0.018)),
    rgba(255,255,255,0.02);
}

.site-messenger-empty {
  border-radius: 16px;
  border: 1px dashed rgba(151, 214, 255, 0.22);
  background: rgba(255,255,255,0.03);
  color: #dcf0ff;
  padding: 1rem;
}

.site-messenger-message {
  display: grid;
  grid-template-columns: 40px minmax(0, 1fr);
  gap: 0.75rem;
  margin-bottom: 0.8rem;
  align-items: start;
}

.site-messenger-message.from-admin {
  grid-template-columns: minmax(0, 1fr) 40px;
}

.site-messenger-message.from-admin .site-messenger-avatar {
  grid-column: 2;
}

.site-messenger-message.from-admin .site-messenger-bubble {
  grid-column: 1;
  justify-self: end;
}

.site-messenger-avatar {
  width: 40px;
  height: 40px;
  border-radius: 14px;
  background: rgba(255,255,255,0.08);
  border: 1px solid rgba(150, 215, 255, 0.2);
}

.site-messenger-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.site-messenger-avatar span {
  font-size: 0.72rem;
  font-weight: 900;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #ebf8ff;
}

.site-messenger-bubble {
  display: grid;
  gap: 0.42rem;
  width: min(100%, 100%);
  padding: 0.82rem 0.92rem;
  border-radius: 18px;
  border: 1px solid rgba(161, 213, 255, 0.2);
  backdrop-filter: blur(8px);
}

.site-messenger-message.from-visitor .site-messenger-bubble {
  max-width: 88%;
  justify-self: start;
  background: linear-gradient(145deg, rgba(134, 203, 255, 0.26), rgba(124, 176, 255, 0.12));
  color: #eff9ff;
}

.site-messenger-message.from-admin .site-messenger-bubble {
  max-width: 88%;
  background: linear-gradient(145deg, rgba(236, 248, 255, 0.96), rgba(219, 236, 255, 0.88));
  color: #0f2538;
}

.site-messenger-bubble div {
  font-size: 0.96rem;
  line-height: 1.55;
  white-space: pre-wrap;
}

.site-messenger-bubble small {
  font-size: 0.68rem;
  letter-spacing: 0.03em;
  opacity: 0.8;
}

.site-messenger-hide-message {
  justify-self: start;
  opacity: 0;
  transform: translateY(4px);
  transition: opacity 160ms ease, transform 160ms ease;
}

.site-messenger-bubble:hover .site-messenger-hide-message,
.site-messenger-bubble:focus-within .site-messenger-hide-message {
  opacity: 1;
  transform: translateY(0);
}

.site-messenger-form {
  display: grid;
  gap: 0.78rem;
  padding: 1rem;
  border-radius: 22px;
  background:
    linear-gradient(180deg, rgba(255,255,255,0.06), rgba(255,255,255,0.025)),
    rgba(0,0,0,0.08);
}

.site-messenger-composer-header {
  display: grid;
  gap: 0.2rem;
}

.site-messenger-composer-header strong {
  color: #f4fbff;
  font-size: 0.72rem;
  font-weight: 900;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.site-messenger-composer-header span {
  color: rgba(220, 239, 255, 0.74);
  font-size: 0.82rem;
}

.site-messenger-identity-fields {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.55rem;
}

.site-messenger-panel textarea,
.site-messenger-panel input {
  border-radius: 14px;
  border: 1px solid rgba(145, 204, 255, 0.2);
  background: rgba(8, 18, 34, 0.78);
  color: #eff7ff;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.06);
}

.site-messenger-panel textarea::placeholder,
.site-messenger-panel input::placeholder {
  color: rgba(199, 227, 255, 0.58);
}

.site-messenger-actions {
  display: grid;
  grid-template-columns: auto auto auto auto 1fr auto;
  gap: 0.45rem;
  align-items: center;
}

.site-messenger-action-meta {
  display: grid;
  gap: 0.3rem;
  align-content: center;
  min-height: 34px;
  justify-self: stretch;
}

.site-messenger-status {
  text-align: left;
  font-size: 0.68rem;
  font-weight: 700;
  color: rgba(220, 239, 255, 0.82);
}

.site-messenger-status.success {
  color: #8ff3c9;
}

.site-messenger-status.error {
  color: #ffb3b3;
}

.site-messenger-last-checked {
  color: rgba(220, 239, 255, 0.62);
  font-size: 0.64rem;
  font-weight: 700;
}

.site-messenger-attach,
.site-messenger-voice,
.site-messenger-call-action,
.site-messenger-rail-button,
.site-messenger-call-join {
  min-height: 34px;
  padding: 0.38rem 0.72rem;
  border-radius: 999px;
  border: 1px solid rgba(149, 214, 255, 0.22);
  background: rgba(255,255,255,0.07);
  color: #dff1ff;
  font-size: 0.66rem;
  font-weight: 900;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.site-messenger-send {
  min-width: 116px;
  min-height: 38px;
  border-radius: 14px;
  font-size: 0.7rem;
  letter-spacing: 0.08em;
}

.site-messenger-rail {
  display: none;
  gap: 0.85rem;
  align-content: start;
  min-width: 0;
  padding: 0.92rem;
}

.site-messenger-panel.expanded .site-messenger-rail {
  display: grid;
}

.site-messenger-stats {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.65rem;
}

.site-messenger-stat {
  display: grid;
  gap: 0.18rem;
  min-height: 80px;
  align-content: center;
  padding: 0.82rem;
  border: 1px solid rgba(147, 214, 255, 0.12);
  border-radius: 18px;
  background: rgba(255,255,255,0.04);
}

.site-messenger-stat strong {
  color: #f7fdff;
  font-size: 1.2rem;
  font-weight: 900;
}

.site-messenger-stat span {
  color: rgba(220, 239, 255, 0.72);
  font-size: 0.68rem;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.site-messenger-notes {
  display: grid;
  gap: 0.5rem;
  margin: 0;
  padding: 0 0 0 1rem;
  color: rgba(220, 239, 255, 0.76);
  font-size: 0.84rem;
}

.site-messenger-rail-actions {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.45rem;
}

.site-messenger-call-card,
.owner-message-call-card,
.admin-messenger-call-card {
  display: grid;
  gap: 0.35rem;
  margin-top: 0.55rem;
  padding: 0.7rem 0.78rem;
  border: 1px solid rgba(117, 240, 194, 0.28);
  border-radius: 16px;
  background: linear-gradient(145deg, rgba(87, 255, 194, 0.14), rgba(114, 193, 255, 0.12));
}

.site-messenger-call-card strong,
.owner-message-call-card strong,
.admin-messenger-call-card strong {
  font-size: 0.74rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.site-messenger-call-card span,
.owner-message-call-card span,
.admin-messenger-call-card span {
  font-size: 0.82rem;
  line-height: 1.45;
}

.site-messenger-call-join {
  justify-self: start;
}

.site-messenger-panel.minimized {
  border-radius: 999px;
  width: min(360px, calc(100% - 24px));
  padding: 0;
}

@media (max-width: 980px) {
  .site-messenger-panel.expanded {
    width: min(960px, calc(100vw - 24px));
    height: auto;
    max-height: none;
  }

  .site-messenger-workspace {
    grid-template-columns: 1fr;
  }

  .site-messenger-rail-actions {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 720px) {
  .site-messenger-panel,
  .site-messenger-panel.expanded {
    width: auto;
    max-width: none;
    left: 8px;
    right: 8px;
    bottom: 8px;
    transform: none;
  }

  .site-messenger-header {
    grid-template-columns: 1fr;
  }

  .site-messenger-identity-fields {
    grid-template-columns: 1fr;
  }

  .site-messenger-actions {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .site-messenger-action-meta,
  .site-messenger-send {
    grid-column: 1 / -1;
  }

  .site-messenger-stats {
    grid-template-columns: 1fr 1fr;
  }

  .site-messenger-rail-actions {
    grid-template-columns: 1fr;
  }
}

/* Compact messenger refinement */
.site-messenger-panel {
  width: min(388px, calc(100% - 24px));
  border-radius: 24px;
}

.site-messenger-header {
  padding: 0.78rem 0.86rem 0.72rem;
}

.site-messenger-title-row strong {
  font-size: 1.08rem;
}

.site-messenger-capability-bar {
  gap: 0.28rem;
}

.site-messenger-capability-bar span {
  min-height: 20px;
  padding: 0.12rem 0.45rem;
  font-size: 0.56rem;
}

.site-messenger-body {
  gap: 0.68rem;
  padding: 0 0.86rem 0.86rem;
}

.site-messenger-messages {
  min-height: 160px;
  max-height: 240px;
  padding: 0.7rem;
}

.site-messenger-message {
  margin-bottom: 0.58rem;
}

.site-messenger-bubble {
  padding: 0.62rem 0.72rem;
}

.site-messenger-bubble div {
  font-size: 0.88rem;
}

.site-messenger-form {
  gap: 0.62rem;
  padding: 0.72rem;
}

.site-messenger-composer-header strong {
  font-size: 0.64rem;
  letter-spacing: 0.11em;
}

.site-messenger-composer-header span {
  font-size: 0.75rem;
}

.site-messenger-panel textarea {
  min-height: 90px;
  font-size: 0.9rem;
  padding: 0.72rem;
}

.site-messenger-actions {
  grid-template-columns: auto auto auto auto 1fr auto;
  gap: 0.38rem;
}

.site-messenger-attach,
.site-messenger-voice,
.site-messenger-call-action,
.site-messenger-send {
  min-height: 31px;
  font-size: 0.61rem;
  padding: 0.32rem 0.56rem;
}

.site-messenger-call-action.audio {
  min-width: 36px;
  padding: 0.32rem 0.36rem;
  font-size: 0.86rem;
  line-height: 1;
}

.site-messenger-send {
  min-width: 88px;
}

.site-messenger-panel:not(.expanded) .site-messenger-composer-header span,
.site-messenger-panel:not(.expanded) .site-messenger-kicker,
.site-messenger-panel:not(.expanded) .site-messenger-title-meta,
.site-messenger-panel:not(.expanded) .site-messenger-thread-meta,
.site-messenger-panel:not(.expanded) .site-messenger-capability-bar {
  display: none;
}

.site-messenger-panel .site-messenger-rail[hidden],
.site-messenger-panel:not(.expanded) .site-messenger-rail {
  display: none !important;
}

.site-messenger-panel:not(.expanded)::before {
  display: none;
}

.site-messenger-panel:not(.expanded) {
  background: linear-gradient(180deg, rgba(10, 18, 31, 0.98), rgba(9, 16, 28, 0.98));
  border-color: rgba(154, 211, 255, 0.2);
  box-shadow: 0 20px 44px rgba(2, 9, 18, 0.5), inset 0 1px 0 rgba(255,255,255,0.12);
}

.site-messenger-panel:not(.expanded) .site-messenger-header {
  border-bottom-color: rgba(146, 204, 255, 0.12);
}

.site-messenger-panel:not(.expanded) .site-messenger-title-row strong {
  color: #f5fbff;
  font-size: 1.02rem;
}

.site-messenger-panel:not(.expanded) .site-messenger-identity {
  color: rgba(215, 236, 255, 0.74);
}

.site-messenger-panel:not(.expanded) .site-messenger-header-actions button {
  border-color: rgba(145, 203, 255, 0.24);
  background: rgba(255,255,255,0.06);
}

.site-messenger-panel:not(.expanded) .site-messenger-messages {
  border-color: rgba(145, 203, 255, 0.16);
  background: linear-gradient(180deg, rgba(255,255,255,0.03), rgba(255,255,255,0.015));
}

.site-messenger-panel:not(.expanded) .site-messenger-form {
  border-color: rgba(145, 203, 255, 0.16);
  background: linear-gradient(180deg, rgba(255,255,255,0.035), rgba(255,255,255,0.018));
}

.site-messenger-panel:not(.expanded) .site-messenger-composer-header strong {
  color: #deefff;
}

.site-messenger-panel:not(.expanded) .site-messenger-panel textarea,
.site-messenger-panel:not(.expanded) textarea,
.site-messenger-panel:not(.expanded) input {
  background: rgba(7, 15, 26, 0.9);
  border-color: rgba(145, 203, 255, 0.2);
  color: #eef8ff;
}

.site-messenger-panel:not(.expanded) .site-messenger-attach,
.site-messenger-panel:not(.expanded) .site-messenger-voice,
.site-messenger-panel:not(.expanded) .site-messenger-call-action {
  background: rgba(255,255,255,0.05);
  border-color: rgba(145, 203, 255, 0.24);
}

.site-messenger-panel:not(.expanded) .site-messenger-send {
  background: linear-gradient(145deg, #79d2ff, #5f9dff);
  color: #0a1b2d;
  border-color: rgba(169, 224, 255, 0.46);
  box-shadow: 0 10px 20px rgba(47, 112, 201, 0.28);
}

.site-messenger-panel:not(.expanded) .site-messenger-header-actions button {
  min-height: 30px;
  padding: 0.28rem 0.56rem;
  font-size: 0.62rem;
}

@media (max-width: 720px) {
  .site-messenger-panel {
    width: auto;
    border-radius: 20px;
  }

  .site-messenger-messages {
    min-height: 140px;
    max-height: 34vh;
  }

  .site-messenger-actions {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .site-messenger-send,
  .site-messenger-action-meta {
    grid-column: 1 / -1;
  }
}

.site-messenger-message {
  width: 100%;
  display: grid;
  grid-template-columns: 40px minmax(0, 1fr);
  gap: 0.75rem;
  align-items: end;
}

.site-messenger-messages {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  min-height: 0;
  max-height: min(38vh, 260px);
  padding: 0.85rem;
}

.site-messenger-empty {
  min-height: 118px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.site-messenger-message.from-admin {
  grid-template-columns: 40px minmax(0, 1fr);
  justify-self: start;
}

.site-messenger-message.from-admin .site-messenger-avatar {
  grid-column: 1;
  justify-self: start;
}

.site-messenger-message.from-admin .site-messenger-bubble {
  grid-column: 2;
  justify-self: start;
  max-width: min(100%, 290px);
  min-width: clamp(190px, 68%, 280px);
}

.site-messenger-message.from-visitor {
  grid-template-columns: minmax(0, 1fr);
  justify-items: end;
}

.site-messenger-message.from-visitor .site-messenger-bubble {
  grid-column: 1;
  justify-self: end;
  width: auto;
  max-width: min(100%, 290px);
  min-width: clamp(190px, 72%, 280px);
  background: linear-gradient(145deg, rgba(134, 203, 255, 0.26), rgba(124, 176, 255, 0.12));
  color: #eff9ff;
}

.site-messenger-bubble {
  width: auto;
  min-width: min(100%, 170px);
}

.site-messenger-bubble div {
  white-space: pre-wrap;
  word-break: break-word;
}

.site-messenger-bubble small {
  display: block;
  margin-top: 0.4rem;
}

.art-zoom-btn {
  min-width: 42px;
  height: 42px;
  border: 1px solid rgba(255,255,255,0.26);
  border-radius: 12px;
  background: rgba(255,255,255,0.14);
  color: #fff;
  font-size: 1.15rem;
  font-weight: 900;
  cursor: pointer;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.22), 0 10px 28px rgba(0,0,0,0.22);
}

.art-zoom-reset {
  min-width: 64px;
  font-size: 0.88rem;
}

.art-zoom-btn:hover,
.art-zoom-btn:focus-visible {
  background: rgba(255,255,255,0.24);
}

.art-zoom-stage {
  position: relative;
  min-height: 0;
  overflow: hidden;
  border-radius: 22px;
  border: 1px solid rgba(255,255,255,0.28);
  background:
    linear-gradient(135deg, rgba(255,255,255,0.12), rgba(255,255,255,0.035)),
    rgba(10, 16, 28, 0.58);
  box-shadow: 0 28px 70px rgba(0,0,0,0.38), inset 0 1px 0 rgba(255,255,255,0.28);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: grab;
  touch-action: none;
}

.art-zoom-stage.is-dragging {
  cursor: grabbing;
}

.art-zoom-image {
  max-width: 94%;
  max-height: 94%;
  object-fit: contain;
  border-radius: 12px;
  box-shadow: 0 18px 48px rgba(0,0,0,0.34);
  pointer-events: none;
  user-select: none;
  -webkit-user-drag: none;
  transform-origin: center center;
  transition: transform 0.12s ease-out;
}

.art-zoom-watermark {
  position: absolute;
  inset: 0;
  pointer-events: none;
  mix-blend-mode: soft-light;
  opacity: 0.28;
  background-image:
    repeating-linear-gradient(145deg, transparent 0 72px, rgba(255,255,255,0.16) 72px 74px, transparent 74px 142px);
}

.art-zoom-watermark::after {
  content: "Noah B. Price";
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%) rotate(-18deg);
  color: rgba(255,255,255,0.34);
  font-family: 'Playfair Display', serif;
  font-size: clamp(2.2rem, 8vw, 7rem);
  font-weight: 700;
  letter-spacing: 0;
  white-space: nowrap;
  text-shadow: 0 2px 16px rgba(0,0,0,0.26);
}

.art-capture-blank .art-zoom-image {
  opacity: 0;
}

@media (max-width: 720px) {
  .art-zoom-viewer {
    padding: 10px;
  }

  .art-zoom-shell {
    height: 100%;
  }

  .art-zoom-toolbar {
    justify-content: center;
  }

  .art-zoom-stage {
    border-radius: 16px;
  }
}

@media print {
  .art-protected-media,
  .art-zoom-viewer {
    display: none !important;
  }
}

body:has(main.password-page) {
  background: #030000 !important;
  color: #f7d9d9 !important;
}

body:has(main.password-page) #vanta-bg {
  background: #030000 !important;
}

body:has(main.password-page) .brand {
  display: block !important;
  width: max-content !important;
  margin: 0 auto !important;
  position: relative !important;
  left: 0 !important;
  transform: none !important;
  color: #8a1010 !important;
  background: none !important;
  -webkit-background-clip: border-box !important;
  background-clip: border-box !important;
  -webkit-text-fill-color: currentColor !important;
  text-shadow: 0 1px 0 rgba(255, 210, 210, 0.34), 0 -2px 0 rgba(44, 0, 0, 0.95), 0 0 14px rgba(132, 12, 12, 0.44), 0 14px 30px rgba(10, 0, 0, 0.72) !important;
}

body:has(main.password-page) main.password-page,
body:has(main.password-page) main.password-page *,
body:has(main.password-page) .site-messenger-panel *,
body:has(main.password-page) .audio-player-panel * {
  text-shadow: 0 2px 0 rgba(255,255,255,0.26), 0 -3px 0 rgba(0,0,0,0.92), 0 0 3px rgba(0,0,0,0.84) !important;
}

body:has(main.password-page) .glass-panel {
  border-color: rgba(110, 16, 16, 0.56) !important;
  background: rgba(0, 0, 0, 0.48) !important;
  box-shadow: 0 18px 48px rgba(0,0,0,0.42), inset 0 1px 0 rgba(255,255,255,0.08), inset 0 -1px 0 rgba(0,0,0,0.55), inset 0 0 0 1px rgba(106,16,16,0.22) !important;
  backdrop-filter: blur(18px) saturate(130%) !important;
  -webkit-backdrop-filter: blur(18px) saturate(130%) !important;
}

body:has(main.password-page) .glass-panel::before {
  display: none !important;
}

body:has(main.password-page) .glass-panel::after {
  content: "" !important;
  position: absolute !important;
  inset: 1px !important;
  border-radius: inherit !important;
  display: none !important;
  background: none !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

body:has(main.password-page) .glass-panel h1,
body:has(main.password-page) .glass-panel h2,
body:has(main.password-page) .glass-panel h3,
body:has(main.password-page) .glass-panel p,
body:has(main.password-page) .glass-panel blockquote,
body:has(main.password-page) .glass-panel cite,
body:has(main.password-page) .glass-panel label,
body:has(main.password-page) .glass-panel span,
body:has(main.password-page) .glass-panel strong,
body:has(main.password-page) .glass-panel button,
body:has(main.password-page) .glass-panel small,
body:has(main.password-page) .glass-panel li,
body:has(main.password-page) .glass-panel input,
body:has(main.password-page) .glass-panel textarea {
  text-shadow: 0 2px 0 rgba(255,255,255,0.26), 0 -3px 0 rgba(0,0,0,0.92), 0 0 3px rgba(0,0,0,0.84) !important;
}

body:has(main.password-page) .intro-panel p,
body:has(main.password-page) .launch-panel p,
body:has(main.password-page) .member-auth p,
body:has(main.password-page) .quote-panel cite,
body:has(main.password-page) .privacy,
body:has(main.password-page) .site-messenger-identity,
body:has(main.password-page) .site-messenger-thread-meta,
body:has(main.password-page) .audio-player-subtitle,
body:has(main.password-page) .audio-player-slider-label,
body:has(main.password-page) .audio-player-time,
body:has(main.password-page) .audio-player-track-heading {
  text-shadow: 0 2px 0 rgba(255,255,255,0.26), 0 -3px 0 rgba(0,0,0,0.92), 0 0 3px rgba(0,0,0,0.84) !important;
}

body:has(main.password-page) main.password-page .brand {
  text-shadow: 0 1px 0 rgba(255, 210, 210, 0.34), 0 -2px 0 rgba(44, 0, 0, 0.95), 0 0 14px rgba(132, 12, 12, 0.44), 0 14px 30px rgba(10, 0, 0, 0.72) !important;
}

body:has(main.password-page) .intro-panel p,
body:has(main.password-page) .quote-panel cite,
body:has(main.password-page) .launch-panel p,
body:has(main.password-page) .member-auth p,
body:has(main.password-page) .privacy {
  color: #ddd0d0 !important;
}

body.password-gate-page .teaser-list,
body.password-gate-page .teaser-list .teaser-line,
body.password-gate-page .teaser-list p {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  text-shadow: none !important;
}

body:has(main.password-page) .quote-panel blockquote,
body:has(main.password-page) .access-panel h2,
body:has(main.password-page) .launch-panel h2,
body:has(main.password-page) .member-auth h3 {
  color: #f2e8e8 !important;
  text-shadow: 0 1px 0 rgba(255,255,255,0.2), 0 9px 22px rgba(0,0,0,0.42) !important;
}

body:has(main.password-page) label,
body:has(main.password-page) .member-auth-status,
body:has(main.password-page) .launch-status {
  color: #b42424 !important;
  text-shadow: 0 1px 0 rgba(255, 206, 206, 0.18), 0 6px 14px rgba(56,0,0,0.42) !important;
}

body:has(main.password-page) input,
body:has(main.password-page) .member-auth-tab {
  color: #f7d9d9 !important;
  border-color: rgba(168, 50, 50, 0.42) !important;
  background: rgba(0, 0, 0, 0.55) !important;
}

body:has(main.password-page) input:focus {
  border-color: rgba(214, 78, 78, 0.86) !important;
  box-shadow: 0 0 0 4px rgba(158, 17, 17, 0.22) !important;
}

body:has(main.password-page) button {
  background: rgba(0, 0, 0, 0.58) !important;
  border: 1px solid rgba(106, 16, 16, 0.62) !important;
  color: #f7dede !important;
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.36), inset 0 0 0 1px rgba(106, 16, 16, 0.2) !important;
}

body:has(main.password-page) .member-auth-tab.active {
  border-color: rgba(126, 22, 22, 0.72) !important;
  background: rgba(0, 0, 0, 0.68) !important;
}

body:has(main.password-page) .site-messenger-panel,
body:has(main.password-page) .audio-player-panel {
  background: rgba(0, 0, 0, 0.48) !important;
  border: 1px solid rgba(106, 16, 16, 0.6) !important;
  box-shadow: 0 26px 60px rgba(0,0,0,0.42), inset 0 1px 0 rgba(255,255,255,0.08), inset 0 -1px 0 rgba(0,0,0,0.55), inset 0 0 0 1px rgba(106, 16, 16, 0.2) !important;
  backdrop-filter: blur(18px) saturate(130%) !important;
  -webkit-backdrop-filter: blur(18px) saturate(130%) !important;
}

body:has(main.password-page) .site-messenger-panel::before,
body:has(main.password-page) .audio-player-panel::before {
  display: none !important;
}

body:has(main.password-page) .site-messenger-header,
body:has(main.password-page) .audio-player-header {
  border-bottom-color: rgba(106, 16, 16, 0.42) !important;
}

body:has(main.password-page) .site-messenger-title-row strong,
body:has(main.password-page) .audio-player-brand,
body:has(main.password-page) .audio-player-title,
body:has(main.password-page) .site-messenger-composer-header strong {
  color: #f2e8e8 !important;
  text-shadow: 0 1px 0 rgba(255,255,255,0.2), 0 8px 20px rgba(0,0,0,0.38) !important;
}

body:has(main.password-page) .site-messenger-identity,
body:has(main.password-page) .site-messenger-thread-meta,
body:has(main.password-page) .audio-player-subtitle,
body:has(main.password-page) .audio-player-slider-label,
body:has(main.password-page) .audio-player-time,
body:has(main.password-page) .audio-player-track-heading,
body:has(main.password-page) .site-messenger-status,
body:has(main.password-page) .site-messenger-last-checked {
  color: #d4c7c7 !important;
}

body:has(main.password-page) .site-messenger-title-meta,
body:has(main.password-page) .site-messenger-badge,
body:has(main.password-page) .audio-player-badge,
body:has(main.password-page) .audio-player-track-item,
body:has(main.password-page) .audio-player-progress-track,
body:has(main.password-page) .audio-player-slider,
body:has(main.password-page) .site-messenger-form,
body:has(main.password-page) .site-messenger-messages,
body:has(main.password-page) .site-messenger-empty {
  border-color: rgba(106, 16, 16, 0.44) !important;
  background: linear-gradient(180deg, rgba(255,255,255,0.045), rgba(255,255,255,0.00) 20%, rgba(0,0,0,0.9) 100%) !important;
  color: #e8dddd !important;
}

body:has(main.password-page) .site-messenger-panel textarea,
body:has(main.password-page) .site-messenger-panel input,
body:has(main.password-page) .audio-player-btn,
body:has(main.password-page) .site-messenger-header-actions button {
  background: linear-gradient(180deg, rgba(255,255,255,0.05), rgba(0,0,0,0.92) 48%, rgba(0,0,0,0.9)) !important;
  border-color: rgba(106, 16, 16, 0.44) !important;
  color: #f0e5e5 !important;
  box-shadow: inset 0 0 0 1px rgba(106, 16, 16, 0.2) !important;
}

body:has(main.password-page) .site-messenger-send,
body:has(main.password-page) .audio-player-btn.active,
body:has(main.password-page) .audio-player-progress-fill {
  background: linear-gradient(180deg, #d14444 0%, #8f1111 24%, #5a0000 100%) !important;
  color: #fff3f3 !important;
  border-color: rgba(167, 36, 36, 0.6) !important;
  box-shadow: 0 10px 24px rgba(90, 0, 0, 0.34), inset 0 1px 0 rgba(255, 208, 208, 0.32) !important;
}

body:has(main.password-page) .audio-player-slider::-webkit-slider-thumb {
  background: linear-gradient(180deg, #d14444 0%, #7a1010 35%, #4c0000 100%) !important;
  border: 1px solid rgba(126, 24, 24, 0.8) !important;
  box-shadow: 0 0 0 4px rgba(122, 16, 16, 0.24), inset 0 1px 0 rgba(255, 206, 206, 0.30) !important;
}

body:has(main.password-page) .audio-player-slider::-moz-range-thumb {
  background: linear-gradient(180deg, #d14444 0%, #7a1010 35%, #4c0000 100%) !important;
  border: 1px solid rgba(126, 24, 24, 0.8) !important;
  box-shadow: 0 0 0 4px rgba(122, 16, 16, 0.24), inset 0 1px 0 rgba(255, 206, 206, 0.30) !important;
}

body:has(main.password-page) .audio-player-slider {
  accent-color: #7a1010 !important;
}

body:has(main.password-page) .site-messenger-message.from-admin .site-messenger-bubble,
body:has(main.password-page) .site-messenger-message.from-visitor .site-messenger-bubble {
  background: rgba(0, 0, 0, 0.9) !important;
  border-color: rgba(106, 16, 16, 0.42) !important;
  color: #f0e5e5 !important;
}

body:has(main.password-page) .audio-player-cover-art,
body:has(main.password-page) .audio-player-video-container {
  background: linear-gradient(135deg, rgba(0, 0, 0, 0.94), rgba(0, 0, 0, 0.99)) !important;
}

body:has(main.password-page) .site-messenger-empty strong,
body:has(main.password-page) .site-messenger-empty span,
body:has(main.password-page) .audio-player-badge,
body:has(main.password-page) .audio-player-track-item,
body:has(main.password-page) .audio-player-track-item * {
  color: #eadede !important;
}

body:has(main.password-page) .site-messenger-panel textarea,
body:has(main.password-page) .site-messenger-panel input,
body:has(main.password-page) .site-messenger-panel textarea::placeholder,
body:has(main.password-page) .site-messenger-panel input::placeholder {
  text-shadow: none !important;
}

body:has(main.password-page) .site-messenger-send,
body:has(main.password-page) .site-messenger-title-row strong,
body:has(main.password-page) .site-messenger-composer-header strong,
body:has(main.password-page) .site-messenger-identity,
body:has(main.password-page) .site-messenger-thread-meta,
body:has(main.password-page) .site-messenger-last-checked,
body:has(main.password-page) .site-messenger-badge,
body:has(main.password-page) .site-messenger-status,
body:has(main.password-page) .site-messenger-rail-actions,
body:has(main.password-page) .site-messenger-empty strong,
body:has(main.password-page) .site-messenger-empty span {
  text-shadow: 0 1px 0 rgba(255, 214, 214, 0.22), 0 -1px 0 rgba(58, 0, 0, 0.9) !important;
}

@media (max-width: 720px) {
  body:has(main.password-page) .site-messenger-panel,
  body:has(main.password-page) .site-messenger-panel.expanded,
  body:has(main.password-page) .site-messenger-panel.minimized,
  body:has(main.password-page) .audio-player-panel {
    position: static !important;
    top: auto !important;
    left: auto !important;
    right: auto !important;
    bottom: auto !important;
    width: min(100%, 860px) !important;
    max-width: none !important;
    height: auto !important;
    max-height: none !important;
    margin: 0.75rem auto 0 !important;
    transform: none !important;
    z-index: auto !important;
  }

  body:has(main.password-page) .site-messenger-panel {
    margin-top: 0.25rem !important;
  }

  body:has(main.password-page) .audio-player-panel {
    margin-top: 0.75rem !important;
  }
}

/* True EOF sapphire crystal precedence layer */
body:not(:has(main.password-page)) header,
body:not(:has(main.password-page)) main > section,
body:not(:has(main.password-page)) .home-pathway-card,
body:not(:has(main.password-page)) .books-next-card,
body:not(:has(main.password-page)) .store-promise-strip article,
body:not(:has(main.password-page)) .music-product-card,
body:not(:has(main.password-page)) .book-item,
body:not(:has(main.password-page)) .edition-grid .book-item,
body:not(:has(main.password-page)) .update-card,
body:not(:has(main.password-page)) footer,
body:not(:has(main.password-page)) .site-messenger-panel,
body:not(:has(main.password-page)) .audio-player-panel {
  border-color: rgba(118, 236, 255, 0.56);
  background:
    radial-gradient(circle at 14% 6%, rgba(239, 253, 255, 0.26), transparent 31%),
    radial-gradient(circle at 82% 12%, rgba(78, 216, 255, 0.18), transparent 34%),
    linear-gradient(135deg, rgba(255, 255, 255, 0.18), rgba(74, 213, 255, 0.10) 18%, rgba(8, 48, 138, 0.56) 50%, rgba(1, 9, 30, 0.88) 100%),
    rgba(3, 16, 48, 0.78);
  box-shadow:
    0 26px 72px rgba(0, 8, 30, 0.56),
    0 0 34px rgba(69, 207, 255, 0.18),
    inset 0 1px 0 rgba(255, 255, 255, 0.44),
    inset 0 -1px 28px rgba(19, 112, 255, 0.34),
    inset 0 0 40px rgba(103, 239, 255, 0.10);
  backdrop-filter: blur(20px) saturate(180%) contrast(112%);
  -webkit-backdrop-filter: blur(20px) saturate(180%) contrast(112%);
}

body:not(:has(main.password-page)) .site-messenger-title-meta,
body:not(:has(main.password-page)) .site-messenger-form,
body:not(:has(main.password-page)) .site-messenger-messages,
body:not(:has(main.password-page)) .site-messenger-empty,
body:not(:has(main.password-page)) .site-messenger-starter,
body:not(:has(main.password-page)) .site-messenger-expand,
body:not(:has(main.password-page)) .site-messenger-toggle,
body:not(:has(main.password-page)) .site-messenger-header-actions button,
body:not(:has(main.password-page)) .audio-player-btn,
body:not(:has(main.password-page)) .audio-player-track-item,
body:not(:has(main.password-page)) .audio-player-progress-track,
body:not(:has(main.password-page)) .audio-player-slider,
body:not(:has(main.password-page)) input:not([type="range"]),
body:not(:has(main.password-page)) textarea,
body:not(:has(main.password-page)) select {
  color: #eefbff;
  border-color: rgba(116, 236, 255, 0.34);
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.14), rgba(77, 211, 255, 0.09)),
    rgba(2, 17, 52, 0.62);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.22), 0 10px 24px rgba(0, 8, 30, 0.24);
}

body:not(:has(main.password-page)) .store-filter.active,
body:not(:has(main.password-page)) .account-auth-tab.active,
body:not(:has(main.password-page)) .account-nav-chip.active,
body:not(:has(main.password-page)) .admin-tab.active,
body:not(:has(main.password-page)) .admin-thread-switch.active,
body:not(:has(main.password-page)) .owner-thread-button.active,
body:not(:has(main.password-page)) .admin-messenger-thread-item.active,
body:not(:has(main.password-page)) .audio-player-btn.active,
body:not(:has(main.password-page)) .audio-player-track-item.active,
body:not(:has(main.password-page)) .site-messenger-send,
body:not(:has(main.password-page)) .audio-player-progress-fill {
  color: #f7fdff;
  border-color: rgba(200, 253, 255, 0.78);
  background:
    radial-gradient(circle at 20% 0%, rgba(255, 255, 255, 0.44), transparent 34%),
    linear-gradient(135deg, rgba(103, 239, 255, 0.98) 0%, rgba(34, 126, 255, 0.96) 48%, rgba(141, 120, 255, 0.92) 100%);
  box-shadow:
    0 18px 44px rgba(28, 120, 255, 0.36),
    0 0 34px rgba(103, 239, 255, 0.34),
    inset 0 1px 0 rgba(255, 255, 255, 0.64),
    inset 0 -1px 20px rgba(0, 35, 122, 0.30);
}

body:not(:has(main.password-page)) h1,
body:not(:has(main.password-page)) h2,
body:not(:has(main.password-page)) h3,
body:not(:has(main.password-page)) .audio-player-brand,
body:not(:has(main.password-page)) .audio-player-title,
body:not(:has(main.password-page)) .site-messenger-title-row strong,
body:not(:has(main.password-page)) .site-messenger-composer-header strong {
  color: #f0fbff;
}

body:not(:has(main.password-page)) p,
body:not(:has(main.password-page)) li,
body:not(:has(main.password-page)) span,
body:not(:has(main.password-page)) small,
body:not(:has(main.password-page)) label,
body:not(:has(main.password-page)) .audio-player-subtitle,
body:not(:has(main.password-page)) .audio-player-time,
body:not(:has(main.password-page)) .audio-player-track-count,
body:not(:has(main.password-page)) .site-messenger-identity,
body:not(:has(main.password-page)) .site-messenger-thread-meta,
body:not(:has(main.password-page)) .site-messenger-status {
  color: #a9c9e9;
}

body:not(:has(main.password-page)) nav .nav-list li a::after,
body:not(:has(main.password-page)) .hero::after {
  background: linear-gradient(90deg, transparent, #eafdff 8%, #67efff 28%, #126dff 58%, #8d78ff 84%, transparent);
  box-shadow: 0 0 18px rgba(103, 239, 255, 0.74), 0 0 36px rgba(18, 109, 255, 0.42), inset 0 1px 0 rgba(255, 255, 255, 0.66);
}

/* Dark sapphire refinement: faceted crystal, not bright line art */
body:not(:has(main.password-page)) {
  --crystal-void: #01030b;
  --crystal-core: #03124a;
  --crystal-core-deep: #020817;
  --crystal-blue: #082f89;
  --crystal-cyan: #2d5fb7;
  --crystal-ice: #d9e7ff;
  --crystal-violet: #40318f;
  --crystal-text: #edf3ff;
  --crystal-muted: #9badcf;
  --crystal-edge: rgba(54, 95, 191, 0.62);
  --crystal-shadow: 0 30px 82px rgba(0, 5, 19, 0.68), 0 10px 30px rgba(3, 28, 95, 0.26);
  background-color: #01030b;
  background-image:
    radial-gradient(circle at 14% 8%, rgba(5, 39, 127, 0.52), transparent 31%),
    radial-gradient(circle at 78% 12%, rgba(17, 45, 126, 0.34), transparent 30%),
    radial-gradient(circle at 48% 50%, rgba(2, 20, 76, 0.74), transparent 50%),
    linear-gradient(140deg, #01030b 0%, #020b2a 36%, #03175a 58%, #01030b 100%);
}

body:not(:has(main.password-page))::before {
  background:
    conic-gradient(from 32deg at 18% 20%, rgba(94, 122, 214, 0.20), transparent 11%, rgba(8, 44, 137, 0.20), transparent 24%, rgba(255, 255, 255, 0.055), transparent 40%),
    conic-gradient(from 208deg at 82% 14%, rgba(220, 232, 255, 0.10), transparent 9%, rgba(10, 47, 143, 0.22), transparent 31%),
    linear-gradient(121deg, transparent 0%, transparent 22%, rgba(60, 92, 181, 0.13) 22.4%, transparent 23.2%, transparent 66%, rgba(216, 231, 255, 0.075) 66.4%, transparent 67.1%);
  background-size: 1180px 820px, 1280px 760px, 100% 100%;
  opacity: 0.48;
}

body:not(:has(main.password-page))::after {
  background:
    linear-gradient(132deg, transparent 0%, rgba(255, 255, 255, 0.075) 8%, transparent 16%, transparent 42%, rgba(23, 72, 172, 0.18) 43%, transparent 45%),
    linear-gradient(24deg, transparent 0%, transparent 55%, rgba(63, 48, 143, 0.14) 56%, transparent 58%),
    radial-gradient(circle at 50% 18%, rgba(52, 91, 186, 0.20), transparent 38%);
  opacity: 0.42;
}

body:not(:has(main.password-page)) #particles-js,
body:not(:has(main.password-page)) #vanta-bg {
  background:
    radial-gradient(circle at 18% 10%, rgba(8, 46, 139, 0.14), transparent 34%),
    radial-gradient(circle at 72% 80%, rgba(16, 36, 105, 0.16), transparent 42%);
  filter: saturate(125%) contrast(118%) brightness(0.72);
}

body:not(:has(main.password-page)) header,
body:not(:has(main.password-page)) main > section,
body:not(:has(main.password-page)) .home-pathway-card,
body:not(:has(main.password-page)) .books-next-card,
body:not(:has(main.password-page)) .store-promise-strip article,
body:not(:has(main.password-page)) .music-product-card,
body:not(:has(main.password-page)) .book-item,
body:not(:has(main.password-page)) .edition-grid .book-item,
body:not(:has(main.password-page)) .update-card,
body:not(:has(main.password-page)) footer,
body:not(:has(main.password-page)) .site-messenger-panel,
body:not(:has(main.password-page)) .audio-player-panel {
  border-color: rgba(47, 88, 183, 0.66);
  background:
    radial-gradient(circle at 13% 7%, rgba(230, 238, 255, 0.12), transparent 27%),
    radial-gradient(circle at 82% 14%, rgba(21, 66, 160, 0.24), transparent 34%),
    conic-gradient(from 38deg at 26% 20%, rgba(255, 255, 255, 0.10), transparent 11%, rgba(10, 49, 145, 0.24), transparent 27%),
    linear-gradient(135deg, rgba(255, 255, 255, 0.08), rgba(22, 68, 161, 0.15) 20%, rgba(3, 23, 84, 0.68) 52%, rgba(1, 5, 18, 0.92) 100%),
    rgba(2, 12, 42, 0.86);
  box-shadow:
    0 30px 82px rgba(0, 5, 19, 0.66),
    0 0 26px rgba(10, 53, 154, 0.22),
    inset 0 1px 0 rgba(255, 255, 255, 0.24),
    inset 0 -1px 30px rgba(2, 32, 116, 0.48),
    inset 0 0 44px rgba(7, 41, 133, 0.24);
}

body:not(:has(main.password-page)) main > section::before,
body:not(:has(main.password-page)) .home-pathway-card::before,
body:not(:has(main.password-page)) .books-next-card::before,
body:not(:has(main.password-page)) .store-promise-strip article::before,
body:not(:has(main.password-page)) .music-product-card::before,
body:not(:has(main.password-page)) .book-item::before,
body:not(:has(main.password-page)) .update-card::before,
body:not(:has(main.password-page)) footer::before,
body:not(:has(main.password-page)) form::before,
body:not(:has(main.password-page)) .site-messenger-panel::before,
body:not(:has(main.password-page)) .audio-player-panel::before {
  background:
    conic-gradient(from 28deg at 20% 16%, rgba(255, 255, 255, 0.16), transparent 10%, rgba(26, 76, 175, 0.16), transparent 27%),
    linear-gradient(33deg, transparent 0%, transparent 45%, rgba(72, 101, 194, 0.15) 45.5%, transparent 47%),
    linear-gradient(119deg, transparent 0%, transparent 67%, rgba(225, 236, 255, 0.075) 67.4%, transparent 68.2%);
  opacity: 0.68;
}

body:not(:has(main.password-page)) nav .nav-list li a::after,
body:not(:has(main.password-page)) .hero::after {
  background: linear-gradient(90deg, transparent, rgba(220, 232, 255, 0.36) 8%, rgba(46, 92, 184, 0.76) 34%, rgba(6, 38, 126, 0.92) 62%, rgba(60, 48, 143, 0.58) 86%, transparent);
  box-shadow: 0 0 12px rgba(47, 88, 183, 0.42), 0 0 26px rgba(5, 35, 121, 0.46), inset 0 1px 0 rgba(255, 255, 255, 0.28);
}

body:not(:has(main.password-page)) .store-filter.active,
body:not(:has(main.password-page)) .account-auth-tab.active,
body:not(:has(main.password-page)) .account-nav-chip.active,
body:not(:has(main.password-page)) .admin-tab.active,
body:not(:has(main.password-page)) .admin-thread-switch.active,
body:not(:has(main.password-page)) .owner-thread-button.active,
body:not(:has(main.password-page)) .admin-messenger-thread-item.active,
body:not(:has(main.password-page)) .audio-player-btn.active,
body:not(:has(main.password-page)) .audio-player-track-item.active,
body:not(:has(main.password-page)) .site-messenger-send,
body:not(:has(main.password-page)) .audio-player-progress-fill {
  border-color: rgba(91, 123, 215, 0.74);
  background:
    radial-gradient(circle at 20% 0%, rgba(255, 255, 255, 0.22), transparent 34%),
    linear-gradient(135deg, rgba(45, 88, 184, 0.92) 0%, rgba(6, 42, 135, 0.96) 50%, rgba(39, 29, 112, 0.92) 100%);
  box-shadow:
    0 16px 42px rgba(4, 36, 124, 0.42),
    0 0 24px rgba(44, 82, 180, 0.26),
    inset 0 1px 0 rgba(255, 255, 255, 0.34),
    inset 0 -1px 20px rgba(0, 16, 68, 0.42);
}

/* Performance and cleanup pass */
body:not(:has(main.password-page))::before,
body:not(:has(main.password-page))::after,
body:not(:has(main.password-page)) header::before {
  display: none !important;
  animation: none !important;
}

#particles-js,
#vanta-bg,
#particles-js canvas,
#vanta-bg canvas {
  display: none !important;
}

body:not(:has(main.password-page)) {
  background:
    radial-gradient(circle at 20% 8%, rgba(5, 37, 120, 0.44), transparent 34%),
    radial-gradient(circle at 78% 18%, rgba(12, 34, 98, 0.28), transparent 36%),
    linear-gradient(135deg, #01030b 0%, #020b26 46%, #01030b 100%) !important;
}

body:has(main.password-page) {
  background:
    radial-gradient(circle at 50% 0%, rgba(106, 16, 16, 0.18), transparent 36%),
    linear-gradient(180deg, #050000 0%, #000 54%, #060000 100%) !important;
}

body:has(main.password-page)::before,
body:has(main.password-page)::after,
body:has(main.password-page) #particles-js,
body:has(main.password-page) #vanta-bg,
body:has(main.password-page) #particles-js canvas,
body:has(main.password-page) #vanta-bg canvas {
  display: none !important;
}

body:not(:has(main.password-page)) header::after {
  background: linear-gradient(90deg, transparent, rgba(43, 76, 168, 0.28), rgba(13, 45, 139, 0.62), rgba(43, 76, 168, 0.28), transparent) !important;
  box-shadow: 0 0 16px rgba(11, 42, 128, 0.34) !important;
}

.audio-player-panel,
.audio-player-panel:not(.compact):not(.collapsed) {
  overflow-x: hidden !important;
  overflow-y: auto !important;
  max-height: min(620px, calc(100vh - 32px));
  contain: layout paint;
}

.audio-player-track-list {
  max-height: min(190px, 26vh);
  overflow-y: auto !important;
  overflow-x: hidden !important;
  padding-right: 6px;
  margin-right: -2px;
  scrollbar-gutter: stable;
  min-height: 0;
}

.audio-player-track-list::-webkit-scrollbar {
  width: 6px;
}

.audio-player-track-list::-webkit-scrollbar-thumb {
  background: rgba(120, 145, 205, 0.42);
  border-radius: 999px;
}

.audio-player-track-list::-webkit-scrollbar-track {
  background: rgba(2, 8, 28, 0.28);
  border-radius: 999px;
}

.audio-player-panel::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}

@media (prefers-reduced-motion: no-preference) {
  body:not(:has(main.password-page)) main > section,
  body:not(:has(main.password-page)) .home-pathway-card,
  body:not(:has(main.password-page)) .books-next-card,
  body:not(:has(main.password-page)) .store-promise-strip article,
  body:not(:has(main.password-page)) .music-product-card {
    animation-duration: 180ms;
  }
}

/* Restore the sapphire line background without triangles or password bleed */
body:not(:has(main.password-page)) #particles-js,
body:not(:has(main.password-page)) #vanta-bg,
body:not(:has(main.password-page)) #particles-js canvas,
body:not(:has(main.password-page)) #vanta-bg canvas {
  display: block !important;
}

body:not(:has(main.password-page)) #particles-js,
body:not(:has(main.password-page)) #vanta-bg {
  opacity: 0.72;
  filter: saturate(128%) contrast(116%) brightness(0.74) drop-shadow(0 0 10px rgba(17, 56, 151, 0.28));
}

body:not(:has(main.password-page)) header,
body:not(:has(main.password-page)) main > section,
body:not(:has(main.password-page)) .home-pathway-card,
body:not(:has(main.password-page)) .books-next-card,
body:not(:has(main.password-page)) .store-promise-strip article,
body:not(:has(main.password-page)) .music-product-card,
body:not(:has(main.password-page)) .book-item,
body:not(:has(main.password-page)) .edition-grid .book-item,
body:not(:has(main.password-page)) .update-card,
body:not(:has(main.password-page)) footer,
body:not(:has(main.password-page)) .site-messenger-panel,
body:not(:has(main.password-page)) .audio-player-panel {
  backdrop-filter: blur(8px) saturate(132%) contrast(106%) !important;
  -webkit-backdrop-filter: blur(8px) saturate(132%) contrast(106%) !important;
}

body:not(:has(main.password-page)) *,
body:not(:has(main.password-page)) *::before,
body:not(:has(main.password-page)) *::after {
  animation-duration: 160ms;
}

body.password-gate-page,
body:has(main.password-page).password-gate-page {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.76), rgba(255, 255, 255, 0.36) 34%, rgba(255, 255, 255, 0.62)),
    url("/images/multiversal-idea-archive-bg-20260820.png") center top / cover fixed no-repeat,
    #ffffff !important;
}

body.password-gate-page::before,
body.password-gate-page::after,
body:has(main.password-page).password-gate-page::before,
body:has(main.password-page).password-gate-page::after {
  display: block !important;
}

body.password-gate-page #vanta-bg,
body:has(main.password-page).password-gate-page #vanta-bg,
body.password-gate-page #vanta-bg canvas,
body:has(main.password-page).password-gate-page #vanta-bg canvas {
  display: block !important;
}

body.password-gate-page #vanta-bg,
body:has(main.password-page).password-gate-page #vanta-bg {
  opacity: 0.42 !important;
  filter: none !important;
  background: transparent !important;
}

body.password-gate-page #vanta-bg canvas,
body:has(main.password-page).password-gate-page #vanta-bg canvas {
  display: block !important;
  filter: none !important;
}

body.password-gate-page .glass-panel,
body:has(main.password-page).password-gate-page .glass-panel {
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.58), rgba(255, 255, 255, 0.24) 44%, rgba(245, 236, 220, 0.34)),
    rgba(255, 255, 255, 0.34) !important;
  backdrop-filter: blur(2px) saturate(118%) !important;
  -webkit-backdrop-filter: blur(2px) saturate(118%) !important;
}

/* Original black/red particle-line restoration */
html {
  background: #000 !important;
}

body,
body:not(:has(main.password-page)),
body.password-gate-page,
body:has(main.password-page),
body:has(main.password-page).password-gate-page {
  --crystal-void: #000;
  --crystal-core: #100000;
  --crystal-core-deep: #030000;
  --crystal-blue: #ff0000;
  --crystal-cyan: #ff2929;
  --crystal-ice: #ffe1e1;
  --crystal-violet: #5a0000;
  --crystal-text: #fff0f0;
  --crystal-muted: #dfb4b4;
  --crystal-edge: rgba(255, 0, 0, 0.58);
  background:
    radial-gradient(circle at 50% 0%, rgba(105, 0, 0, 0.18), transparent 32%),
    radial-gradient(circle at 18% 20%, rgba(70, 0, 0, 0.18), transparent 42%),
    linear-gradient(180deg, #040000 0%, #000 48%, #040000 100%) !important;
  color: #fff0f0 !important;
}

body::before,
body::after,
body:not(:has(main.password-page))::before,
body:not(:has(main.password-page))::after,
body.password-gate-page::before,
body.password-gate-page::after,
body:has(main.password-page)::before,
body:has(main.password-page)::after,
body:has(main.password-page).password-gate-page::before,
body:has(main.password-page).password-gate-page::after {
  display: none !important;
  background: transparent !important;
  animation: none !important;
}

#particles-js,
#vanta-bg,
#particles-js canvas,
#vanta-bg canvas,
body:not(:has(main.password-page)) #particles-js,
body:not(:has(main.password-page)) #vanta-bg,
body:not(:has(main.password-page)) #particles-js canvas,
body:not(:has(main.password-page)) #vanta-bg canvas,
body.password-gate-page #vanta-bg,
body.password-gate-page #vanta-bg canvas,
body:has(main.password-page) #vanta-bg,
body:has(main.password-page) #vanta-bg canvas,
body:has(main.password-page).password-gate-page #vanta-bg,
body:has(main.password-page).password-gate-page #vanta-bg canvas {
  display: block !important;
}

#particles-js,
#vanta-bg,
body:not(:has(main.password-page)) #particles-js,
body:not(:has(main.password-page)) #vanta-bg,
body.password-gate-page #vanta-bg,
body:has(main.password-page) #vanta-bg,
body:has(main.password-page).password-gate-page #vanta-bg {
  opacity: 1 !important;
  background: #000 !important;
  filter: saturate(170%) contrast(132%) brightness(0.92) drop-shadow(0 0 14px rgba(255, 0, 0, 0.34)) !important;
}

body:not(:has(main.password-page)) header,
body:not(:has(main.password-page)) main > section,
body:not(:has(main.password-page)) .home-pathway-card,
body:not(:has(main.password-page)) .books-next-card,
body:not(:has(main.password-page)) .store-promise-strip article,
body:not(:has(main.password-page)) .music-product-card,
body:not(:has(main.password-page)) .book-item,
body:not(:has(main.password-page)) .edition-grid .book-item,
body:not(:has(main.password-page)) .update-card,
body:not(:has(main.password-page)) footer,
body:not(:has(main.password-page)) form,
body:not(:has(main.password-page)) .site-messenger-panel,
body:not(:has(main.password-page)) .audio-player-panel,
body:has(main.password-page) .glass-panel,
body:has(main.password-page) .site-messenger-panel,
body:has(main.password-page) .audio-player-panel,
body.password-gate-page .glass-panel,
body:has(main.password-page).password-gate-page .glass-panel {
  border-color: rgba(130, 0, 0, 0.68) !important;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.055), rgba(255, 255, 255, 0.008) 42%, rgba(120, 0, 0, 0.08)),
    rgba(0, 0, 0, 0.46) !important;
  box-shadow:
    0 22px 58px rgba(0, 0, 0, 0.58),
    0 0 28px rgba(90, 0, 0, 0.22),
    inset 0 1px 0 rgba(255, 220, 220, 0.10),
    inset 0 -1px 0 rgba(0, 0, 0, 0.62),
    inset 0 0 0 1px rgba(120, 0, 0, 0.18) !important;
  backdrop-filter: blur(2px) saturate(122%) !important;
  -webkit-backdrop-filter: blur(2px) saturate(122%) !important;
}

body:not(:has(main.password-page)) header::after,
body:not(:has(main.password-page)) nav .nav-list li a::after,
body:not(:has(main.password-page)) .hero::after {
  background: linear-gradient(90deg, transparent, rgba(255, 0, 0, 0.18), rgba(255, 0, 0, 0.92), rgba(255, 0, 0, 0.18), transparent) !important;
  box-shadow: 0 0 18px rgba(255, 0, 0, 0.42), 0 0 42px rgba(80, 0, 0, 0.56) !important;
}

body:not(:has(main.password-page)) .btn,
body:not(:has(main.password-page)) .donate-btn,
body:not(:has(main.password-page)) .store-filter,
body:not(:has(main.password-page)) .account-auth-tab,
body:not(:has(main.password-page)) .account-nav-chip,
body:not(:has(main.password-page)) .admin-tab,
body:not(:has(main.password-page)) .admin-thread-switch,
body:not(:has(main.password-page)) .owner-thread-button,
body:not(:has(main.password-page)) button[type="submit"],
body:not(:has(main.password-page)) input:not([type="range"]),
body:not(:has(main.password-page)) textarea,
body:not(:has(main.password-page)) select,
body:has(main.password-page) button,
body:has(main.password-page) input,
body:has(main.password-page) .member-auth-tab,
body:has(main.password-page) .site-messenger-panel input,
body:has(main.password-page) .site-messenger-panel textarea {
  color: #fff0f0 !important;
  border-color: rgba(150, 0, 0, 0.58) !important;
  background: rgba(0, 0, 0, 0.58) !important;
  box-shadow: inset 0 1px 0 rgba(255, 220, 220, 0.08), 0 10px 24px rgba(0, 0, 0, 0.24) !important;
}

body:not(:has(main.password-page)) .store-filter.active,
body:not(:has(main.password-page)) .account-auth-tab.active,
body:not(:has(main.password-page)) .account-nav-chip.active,
body:not(:has(main.password-page)) .admin-tab.active,
body:not(:has(main.password-page)) .admin-thread-switch.active,
body:not(:has(main.password-page)) .owner-thread-button.active,
body:not(:has(main.password-page)) .admin-messenger-thread-item.active,
body:not(:has(main.password-page)) .audio-player-btn.active,
body:not(:has(main.password-page)) .audio-player-track-item.active,
body:not(:has(main.password-page)) .site-messenger-send,
body:not(:has(main.password-page)) .audio-player-progress-fill,
body:has(main.password-page) .site-messenger-send,
body:has(main.password-page) .audio-player-btn.active,
body:has(main.password-page) .audio-player-progress-fill {
  color: #fff7f7 !important;
  border-color: rgba(255, 0, 0, 0.70) !important;
  background: linear-gradient(180deg, #d12626 0%, #8f0909 35%, #4a0000 100%) !important;
  box-shadow: 0 12px 34px rgba(110, 0, 0, 0.38), 0 0 24px rgba(255, 0, 0, 0.20), inset 0 1px 0 rgba(255, 218, 218, 0.24) !important;
}

body:not(:has(main.password-page)) h1,
body:not(:has(main.password-page)) h2,
body:not(:has(main.password-page)) h3,
body:not(:has(main.password-page)) .audio-player-brand,
body:not(:has(main.password-page)) .audio-player-title,
body:not(:has(main.password-page)) .site-messenger-title-row strong,
body:not(:has(main.password-page)) .site-messenger-composer-header strong,
body:has(main.password-page) .brand,
body:has(main.password-page) h1,
body:has(main.password-page) h2,
body:has(main.password-page) h3 {
  color: #fff0f0 !important;
}

/* Password page blood red brand */
body.password-gate-page .brand,
body:has(main.password-page) .brand,
body:has(main.password-page).password-gate-page .brand,
main.password-page .brand {
  color: #8b0000 !important;
  -webkit-text-fill-color: #8b0000 !important;
  text-shadow:
    0 1px 0 rgba(255, 170, 170, 0.16),
    0 -2px 0 rgba(18, 0, 0, 0.96),
    0 0 16px rgba(139, 0, 0, 0.70),
    0 12px 30px rgba(0, 0, 0, 0.84) !important;
}

/* Restore light public/product theme */
html {
  background: #ffffff !important;
}

body:not(.password-gate-page):not(:has(main.password-page)),
body.merch-direct-page {
  --crystal-void: #ffffff;
  --crystal-core: #eefaff;
  --crystal-core-deep: #dff7ff;
  --crystal-blue: #1a8fc4;
  --crystal-cyan: #40d7d2;
  --crystal-ice: #ffffff;
  --crystal-violet: #5f8fb8;
  --crystal-text: #172535;
  --crystal-muted: #4d6575;
  --crystal-edge: rgba(44, 167, 198, 0.38);
  color: #172535 !important;
  background:
    radial-gradient(circle at 18% 8%, rgba(85, 218, 226, 0.22), transparent 32%),
    radial-gradient(circle at 78% 18%, rgba(55, 148, 215, 0.18), transparent 36%),
    linear-gradient(180deg, #ffffff 0%, #f6fdff 42%, #ffffff 100%) !important;
}

body:not(.password-gate-page):not(:has(main.password-page))::before,
body:not(.password-gate-page):not(:has(main.password-page))::after,
body.merch-direct-page::before,
body.merch-direct-page::after {
  display: block !important;
  pointer-events: none;
  background: transparent !important;
  animation: none !important;
}

body:not(.password-gate-page):not(:has(main.password-page)) #particles-js,
body:not(.password-gate-page):not(:has(main.password-page)) #vanta-bg,
body:not(.password-gate-page):not(:has(main.password-page)) #particles-js canvas,
body:not(.password-gate-page):not(:has(main.password-page)) #vanta-bg canvas,
body.merch-direct-page #particles-js,
body.merch-direct-page #vanta-bg,
body.merch-direct-page #particles-js canvas,
body.merch-direct-page #vanta-bg canvas {
  display: block !important;
}

body:not(.password-gate-page):not(:has(main.password-page)) #particles-js,
body:not(.password-gate-page):not(:has(main.password-page)) #vanta-bg,
body.merch-direct-page #particles-js,
body.merch-direct-page #vanta-bg {
  opacity: 0.42 !important;
  background: transparent !important;
  filter: saturate(112%) contrast(104%) brightness(1.08) !important;
}

body:not(.password-gate-page):not(:has(main.password-page)) header,
body:not(.password-gate-page):not(:has(main.password-page)) main > section,
body:not(.password-gate-page):not(:has(main.password-page)) .home-pathway-card,
body:not(.password-gate-page):not(:has(main.password-page)) .books-next-card,
body:not(.password-gate-page):not(:has(main.password-page)) .store-promise-strip article,
body:not(.password-gate-page):not(:has(main.password-page)) .music-product-card,
body:not(.password-gate-page):not(:has(main.password-page)) .book-item,
body:not(.password-gate-page):not(:has(main.password-page)) .edition-grid .book-item,
body:not(.password-gate-page):not(:has(main.password-page)) .update-card,
body:not(.password-gate-page):not(:has(main.password-page)) footer,
body:not(.password-gate-page):not(:has(main.password-page)) form,
body:not(.password-gate-page):not(:has(main.password-page)) .site-messenger-panel,
body:not(.password-gate-page):not(:has(main.password-page)) .audio-player-panel,
body.merch-direct-page header,
body.merch-direct-page main > section,
body.merch-direct-page form {
  border-color: rgba(50, 161, 190, 0.28) !important;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.72), rgba(255, 255, 255, 0.32) 46%, rgba(226, 248, 252, 0.34)),
    rgba(255, 255, 255, 0.36) !important;
  box-shadow:
    0 22px 54px rgba(31, 80, 104, 0.12),
    inset 0 1px 0 rgba(255, 255, 255, 0.78),
    inset 0 -1px 0 rgba(44, 167, 198, 0.12) !important;
  backdrop-filter: blur(10px) saturate(128%) !important;
  -webkit-backdrop-filter: blur(10px) saturate(128%) !important;
}

body:not(.password-gate-page):not(:has(main.password-page)) header,
body.merch-direct-page header {
  background:
    linear-gradient(135deg, rgba(23, 143, 191, 0.86), rgba(61, 209, 204, 0.76)),
    rgba(31, 160, 197, 0.82) !important;
  border-color: rgba(255, 255, 255, 0.52) !important;
}

body:not(.password-gate-page):not(:has(main.password-page)) header::after,
body:not(.password-gate-page):not(:has(main.password-page)) nav .nav-list li a::after,
body:not(.password-gate-page):not(:has(main.password-page)) .hero::after,
body.merch-direct-page header::after,
body.merch-direct-page nav .nav-list li a::after,
body.merch-direct-page .hero::after {
  background: linear-gradient(90deg, transparent, rgba(128, 242, 255, 0.62), rgba(18, 143, 196, 0.86), rgba(71, 221, 208, 0.76), transparent) !important;
  box-shadow: 0 0 16px rgba(33, 180, 210, 0.28) !important;
}

body:not(.password-gate-page):not(:has(main.password-page)) h1,
body:not(.password-gate-page):not(:has(main.password-page)) h2,
body:not(.password-gate-page):not(:has(main.password-page)) h3,
body:not(.password-gate-page):not(:has(main.password-page)) p,
body:not(.password-gate-page):not(:has(main.password-page)) li,
body:not(.password-gate-page):not(:has(main.password-page)) span,
body:not(.password-gate-page):not(:has(main.password-page)) small,
body:not(.password-gate-page):not(:has(main.password-page)) label,
body.merch-direct-page h1,
body.merch-direct-page h2,
body.merch-direct-page h3,
body.merch-direct-page p,
body.merch-direct-page span,
body.merch-direct-page label {
  color: #172535 !important;
  text-shadow: none !important;
}

body:not(.password-gate-page):not(:has(main.password-page)) header a,
body.merch-direct-page header a {
  color: #ffffff !important;
}

body:not(:has(main.password-page)) p,
body:not(:has(main.password-page)) li,
body:not(:has(main.password-page)) span,
body:not(:has(main.password-page)) small,
body:not(:has(main.password-page)) label,
body:has(main.password-page) p,
body:has(main.password-page) span,
body:has(main.password-page) small,
body:has(main.password-page) label,
body:has(main.password-page) blockquote,
body:has(main.password-page) cite {
  color: #e3c4c4 !important;
}

body:not(.password-gate-page):not(:has(main.password-page)) p,
body:not(.password-gate-page):not(:has(main.password-page)) li,
body:not(.password-gate-page):not(:has(main.password-page)) span,
body:not(.password-gate-page):not(:has(main.password-page)) small,
body:not(.password-gate-page):not(:has(main.password-page)) label,
body.merch-direct-page p,
body.merch-direct-page li,
body.merch-direct-page span,
body.merch-direct-page small,
body.merch-direct-page label {
  color: #243444 !important;
}

body:not(.password-gate-page):not(:has(main.password-page)) input:not([type="range"]),
body:not(.password-gate-page):not(:has(main.password-page)) textarea,
body:not(.password-gate-page):not(:has(main.password-page)) select,
body.merch-direct-page input:not([type="range"]),
body.merch-direct-page textarea,
body.merch-direct-page select {
  background: rgba(255, 255, 255, 0.64) !important;
  border-color: rgba(50, 161, 190, 0.30) !important;
  color: #172535 !important;
}

/* Lawn sign direct-sales polish */
body:not(.password-gate-page):not(:has(main.password-page)),
body.merch-direct-page {
  --crystal-blue: #0b5f9f;
  --crystal-cyan: #0b72b7;
  --crystal-edge: rgba(11, 95, 159, 0.42);
}

body:not(.password-gate-page):not(:has(main.password-page)) header,
body.merch-direct-page header {
  background:
    linear-gradient(135deg, rgba(6, 75, 132, 0.94), rgba(10, 105, 170, 0.88)),
    rgba(8, 88, 150, 0.9) !important;
}

body:not(.password-gate-page):not(:has(main.password-page)) header::after,
body:not(.password-gate-page):not(:has(main.password-page)) nav .nav-list li a::after,
body:not(.password-gate-page):not(:has(main.password-page)) .hero::after,
body.merch-direct-page header::after,
body.merch-direct-page nav .nav-list li a::after,
body.merch-direct-page .hero::after {
  background: linear-gradient(90deg, transparent, rgba(133, 205, 255, 0.48), rgba(5, 82, 146, 0.96), rgba(9, 118, 184, 0.76), transparent) !important;
}

body.merch-direct-page {
  padding-top: 0 !important;
}

body.merch-direct-page .merch-direct-header {
  margin-bottom: clamp(0.65rem, 2vw, 1rem) !important;
}

body.merch-direct-page .merch-direct-shell {
  margin-top: 0 !important;
  padding-top: 0 !important;
  gap: clamp(0.85rem, 2vw, 1.2rem) !important;
}

body.merch-direct-page .merch-direct-hero {
  margin-top: 0 !important;
  padding-top: clamp(1rem, 2.5vw, 1.6rem) !important;
  padding-bottom: clamp(1rem, 2.5vw, 1.5rem) !important;
}

body.merch-direct-page .merch-direct-hero h1 {
  max-width: 900px;
  margin-left: auto;
  margin-right: auto;
  color: #082846 !important;
  font-size: clamp(2.3rem, 6vw, 4.25rem);
  line-height: 0.96;
}

body.merch-direct-page .merch-direct-hero p {
  max-width: 760px;
  color: #243444 !important;
  font-size: clamp(1rem, 2.2vw, 1.2rem);
  line-height: 1.55;
}

body.merch-direct-page .merch-direct-layout {
  margin-top: 0 !important;
}

body.merch-direct-page .merch-direct-details {
  align-content: start;
  text-align: left;
}

body.merch-direct-page .merch-direct-details h2 {
  color: #082846 !important;
  font-size: clamp(1.45rem, 3.3vw, 2.35rem);
  line-height: 1.05;
}

body.merch-direct-page .music-product-price {
  width: fit-content;
  padding: 0.35rem 0.75rem;
  border-radius: 999px;
  background: rgba(11, 95, 159, 0.10);
  color: #064b84 !important;
  font-size: clamp(1.55rem, 4vw, 2.25rem);
}

.merch-sales-points {
  display: grid;
  gap: 0.55rem;
  margin: 0.2rem 0 0;
  padding: 0;
  list-style: none;
}

.merch-sales-points li {
  padding: 0.65rem 0.8rem;
  border: 1px solid rgba(11, 95, 159, 0.20);
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.52);
  color: #172535 !important;
  font-weight: 900;
}

.merch-order-note {
  color: #4d6575 !important;
  font-weight: 900;
}

body.merch-direct-page #lawn-sign-checkout {
  width: 100%;
  min-height: 52px;
  border-color: rgba(5, 82, 146, 0.42) !important;
  background:
    linear-gradient(135deg, #064b84, #0b72b7) !important;
  color: #ffffff !important;
  box-shadow: 0 14px 30px rgba(6, 75, 132, 0.22), inset 0 1px 0 rgba(255,255,255,0.35) !important;
}

body.merch-direct-page #lawn-sign-checkout:hover,
body.merch-direct-page #lawn-sign-checkout:focus-visible {
  background:
    linear-gradient(135deg, #053d6c, #0966a6) !important;
}

/* Lawn sign layout correction */
body.merch-direct-page {
  min-height: 100vh !important;
  padding-top: 0 !important;
}

body.merch-direct-page #vanta-bg,
body.merch-direct-page #particles-js {
  position: fixed !important;
  inset: 0 !important;
  width: 100vw !important;
  height: 100vh !important;
  min-height: 100vh !important;
  z-index: 0 !important;
  pointer-events: none !important;
}

body.merch-direct-page #vanta-bg canvas,
body.merch-direct-page #particles-js canvas {
  position: absolute !important;
  inset: 0 !important;
  width: 100vw !important;
  height: 100vh !important;
}

body.merch-direct-page .merch-direct-header {
  position: sticky !important;
  top: 0 !important;
  margin-bottom: 0 !important;
}

body.merch-direct-page .merch-direct-shell {
  position: relative;
  z-index: 1;
  width: min(100% - 2rem, 1120px) !important;
  margin: 0 auto !important;
  padding: clamp(0.75rem, 1.8vw, 1.15rem) 0 2rem !important;
}

body.merch-direct-page .merch-direct-hero {
  margin-bottom: clamp(0.75rem, 1.8vw, 1.1rem) !important;
  padding-top: clamp(0.85rem, 1.8vw, 1.2rem) !important;
}

body.merch-direct-page .merch-direct-layout {
  margin-top: 0 !important;
}

body.merch-direct-page .store-form {
  gap: 0.85rem;
}

body.merch-direct-page .merch-direct-hero h2,
body.merch-direct-page .merch-direct-hero h3,
body.merch-direct-page .merch-direct-details h3,
body.merch-direct-page .merch-direct-manifesto h2,
body.merch-direct-page .merch-direct-manifesto h3 {
  margin: 0.4rem auto;
  color: #082846 !important;
  text-transform: uppercase;
}

body.merch-direct-page .merch-direct-hero h2,
body.merch-direct-page .merch-direct-manifesto h2 {
  font-size: clamp(1.55rem, 4vw, 2.8rem);
  line-height: 1;
}

body.merch-direct-page .merch-direct-hero h3,
body.merch-direct-page .merch-direct-details h3,
body.merch-direct-page .merch-direct-manifesto h3 {
  font-size: clamp(1rem, 2.5vw, 1.35rem);
  letter-spacing: 0;
}

body.merch-direct-page .merch-direct-callout {
  font-size: clamp(1.3rem, 4vw, 2.35rem) !important;
  line-height: 1;
  color: #064b84 !important;
}

body.merch-direct-page .merch-direct-details p,
body.merch-direct-page .merch-direct-manifesto p {
  line-height: 1.48;
}

body.merch-direct-page .merch-direct-manifesto {
  display: grid;
  gap: 0.45rem;
  margin: 0.65rem 0;
  padding: 1rem;
  border: 1px solid rgba(11, 95, 159, 0.18);
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.42);
}

body.merch-direct-page .merch-direct-manifesto h2,
body.merch-direct-page .merch-direct-manifesto h3,
body.merch-direct-page .merch-direct-manifesto p {
  margin: 0;
}

/* Lawn sign compact sales layout */
body.merch-direct-page .merch-direct-shell {
  width: min(100% - 1.5rem, 1240px) !important;
  padding-top: clamp(0.45rem, 1.2vw, 0.8rem) !important;
}

body.merch-direct-page .merch-direct-hero {
  width: min(100%, 1080px) !important;
  padding: clamp(0.85rem, 2vw, 1.25rem) clamp(1rem, 3vw, 2rem) !important;
}

body.merch-direct-page .merch-direct-hero h1 {
  font-size: clamp(2rem, 4.8vw, 3.65rem) !important;
}

body.merch-direct-page .merch-direct-hero h2 {
  font-size: clamp(1.45rem, 3.5vw, 2.35rem) !important;
}

body.merch-direct-page .merch-direct-hero p {
  max-width: 820px;
  margin-top: 0.35rem;
  margin-bottom: 0;
  font-size: clamp(0.94rem, 1.8vw, 1.08rem) !important;
  line-height: 1.34 !important;
}

body.merch-direct-page .merch-direct-layout {
  grid-template-columns: minmax(300px, 0.78fr) minmax(360px, 1.22fr) !important;
  gap: clamp(0.85rem, 2vw, 1.4rem) !important;
  padding: clamp(0.9rem, 2.2vw, 1.35rem) !important;
}

body.merch-direct-page .merch-direct-preview {
  position: sticky;
  top: 5rem;
}

body.merch-direct-page .merch-direct-preview figcaption {
  margin-top: -0.25rem;
}

body.merch-direct-page .merch-direct-details {
  gap: 0.55rem !important;
}

body.merch-direct-page .merch-direct-details h2 {
  font-size: clamp(1.35rem, 2.7vw, 2rem) !important;
}

body.merch-direct-page .merch-direct-details p {
  margin: 0 !important;
  font-size: clamp(0.92rem, 1.7vw, 1.02rem);
  line-height: 1.34 !important;
}

body.merch-direct-page .music-product-price {
  margin-top: 0.25rem !important;
  font-size: clamp(1.45rem, 3vw, 1.9rem) !important;
}

body.merch-direct-page .merch-sales-points {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.45rem;
}

body.merch-direct-page .merch-sales-points li {
  padding: 0.5rem 0.65rem;
  font-size: 0.9rem;
  line-height: 1.25;
}

body.merch-direct-page .merch-direct-manifesto {
  gap: 0.35rem;
  margin: 0.4rem 0;
  padding: 0.75rem;
}

body.merch-direct-page .store-form {
  margin-top: 0.6rem !important;
}

body.merch-direct-page .merch-option-group {
  display: grid;
  gap: 0.5rem;
  margin: 0;
  padding: 0.75rem;
  border: 1px solid rgba(11, 95, 159, 0.18);
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.42);
}

body.merch-direct-page .merch-option-group legend {
  padding: 0 0.45rem;
  color: #082846;
  font-weight: 900;
  text-transform: uppercase;
}

body.merch-direct-page .merch-option-card {
  display: grid;
  grid-template-columns: 22px 1fr;
  align-items: center;
  gap: 0.55rem;
  min-height: 44px;
  padding: 0.55rem 0.65rem;
  border: 1px solid rgba(11, 95, 159, 0.18);
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.48);
  text-align: left !important;
}

body.merch-direct-page .merch-option-card input {
  width: 18px !important;
  min-height: 18px !important;
}

body.merch-direct-page .merch-option-card span {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
}

body.merch-direct-page .merch-option-card small,
body.merch-direct-page .merch-order-total {
  color: #064b84 !important;
  font-weight: 900;
}

body.merch-direct-page .merch-order-total {
  margin: 0 !important;
  font-size: 1.05rem;
  text-align: center;
}

@media (max-width: 820px) {
  body.merch-direct-page .merch-direct-preview {
    position: static;
  }

  body.merch-direct-page .merch-sales-points {
    grid-template-columns: 1fr;
  }
}

/* Clearer particles through translucent frosted glass */
body.merch-direct-page #vanta-bg,
body.merch-direct-page #particles-js {
  opacity: 0.88 !important;
  filter: saturate(142%) contrast(118%) brightness(1.06) !important;
}

body.merch-direct-page #vanta-bg canvas,
body.merch-direct-page #particles-js canvas {
  opacity: 1 !important;
  filter: none !important;
}

body.merch-direct-page header,
body.merch-direct-page main > section,
body.merch-direct-page form,
body.merch-direct-page .merch-direct-manifesto,
body.merch-direct-page .merch-option-group,
body.merch-direct-page .merch-option-card,
body.merch-direct-page .merch-sales-points li {
  border-color: rgba(11, 95, 159, 0.26) !important;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.34), rgba(255, 255, 255, 0.12) 48%, rgba(196, 234, 246, 0.16)),
    rgba(255, 255, 255, 0.14) !important;
  box-shadow:
    0 18px 44px rgba(31, 80, 104, 0.10),
    inset 0 1px 0 rgba(255, 255, 255, 0.68),
    inset 0 -1px 0 rgba(11, 95, 159, 0.10) !important;
  backdrop-filter: blur(4px) saturate(145%) contrast(104%) !important;
  -webkit-backdrop-filter: blur(4px) saturate(145%) contrast(104%) !important;
}

body.merch-direct-page header {
  background:
    linear-gradient(135deg, rgba(6, 75, 132, 0.76), rgba(10, 105, 170, 0.62)),
    rgba(8, 88, 150, 0.42) !important;
}

body.merch-direct-page main > section::before,
body.merch-direct-page form::before,
body.merch-direct-page .merch-direct-manifesto::before,
body.merch-direct-page .merch-option-group::before,
body.merch-direct-page .merch-option-card::before {
  opacity: 0.18 !important;
  background:
    linear-gradient(120deg, rgba(255, 255, 255, 0.16), transparent 30%, rgba(72, 181, 220, 0.08) 54%, transparent 72%) !important;
}