html,
body {
  background: transparent !important;
  overflow: hidden !important;
}

body {
  min-height: auto !important;
  overflow-x: hidden;
}

.page {
  width: 100% !important;
  padding: 0 !important;
}

.hero {
  display: none !important;
}

.filter-panel {
  margin-top: 0 !important;
  border-color: transparent !important;
  box-shadow: none !important;
}

.content-panel {
  margin-top: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.detail-modal {
  position: absolute !important;
  inset: 0 auto auto 0 !important;
  width: 100% !important;
  min-height: 960px !important;
  place-items: center !important;
  align-items: center !important;
  padding: 32px !important;
}

.detail-modal.is-open {
  display: grid !important;
}

.modal-backdrop {
  position: absolute !important;
  inset: 0 !important;
}

.modal-panel {
  margin: 0 auto !important;
  max-height: 896px !important;
}

/* The embedded vault follows the host theme. Its media remains untouched so
   images and video previews keep their intended contrast. */
html.host-light-theme {
  color-scheme: light;
  --bg: #e9f2f4;
  --panel: rgba(248, 252, 252, 0.96);
  --panel-soft: #edf5f6;
  --line: rgba(0, 201, 200, 0.12);
  --text: #172c3d;
  --muted: #5d7180;
  --dim: #718592;
  --teal: #00c9c8;
  --teal-soft: rgba(0, 201, 200, 0.1);
  --chip: #e4eff1;
}

html.host-light-theme body {
  color: var(--text) !important;
}

html.host-light-theme .filter-panel {
  border: 1px solid rgba(91, 125, 139, 0.17) !important;
  background:
    radial-gradient(circle at 12% 0%, rgba(45, 212, 191, 0.12), transparent 34%),
    rgba(243, 249, 250, 0.94) !important;
  box-shadow: 0 18px 48px rgba(42, 72, 88, 0.11) !important;
}

html.host-light-theme .major-tabs {
  border-bottom-color: rgba(85, 119, 134, 0.16) !important;
}

html.host-light-theme .category-tabs,
html.host-light-theme .vault-search {
  border-color: rgba(80, 114, 129, 0.17) !important;
  background: rgba(226, 238, 241, 0.82) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.72) !important;
}

html.host-light-theme .major-tab,
html.host-light-theme .category-tab,
html.host-light-theme .vault-search input {
  color: #445e6d !important;
}

html.host-light-theme .vault-search input::placeholder {
  color: #758b98 !important;
}

html.host-light-theme .major-tab.active {
  color: #138f80 !important;
  background: linear-gradient(180deg, rgba(45, 212, 191, 0.17), rgba(45, 212, 191, 0.03)) !important;
  box-shadow: none !important;
}

html.host-light-theme .category-tab.active {
  color: #083f3a !important;
  background: linear-gradient(180deg, #52dec9, #2dd4bf) !important;
}

html.host-light-theme .content-panel {
  background: transparent !important;
}

html.host-light-theme .card,
html.host-light-theme .text-template-card,
html.host-light-theme .prompt-card,
html.host-light-theme .copy-card,
html.host-light-theme .image-card,
html.host-light-theme .video-card {
  border-color: rgba(78, 116, 132, 0.18) !important;
  background:
    radial-gradient(260px 150px at 5% 0%, rgba(45, 212, 191, 0.1), transparent 68%),
    rgba(248, 252, 252, 0.97) !important;
  box-shadow: 0 14px 34px rgba(42, 72, 88, 0.11) !important;
}

html.host-light-theme .text-template-card::before {
  background: linear-gradient(135deg, rgba(45, 212, 191, 0.08), transparent 48%) !important;
}

html.host-light-theme :is(.card, .modal-content) h2,
html.host-light-theme :is(.card, .modal-content) h3,
html.host-light-theme :is(.card, .modal-content) h4,
html.host-light-theme :is(.card, .modal-content) strong,
html.host-light-theme .copy-card-title,
html.host-light-theme .video-card-body h3 {
  color: #172c3d !important;
}

html.host-light-theme :is(.card, .modal-content) p,
html.host-light-theme :is(.card, .modal-content) li,
html.host-light-theme :is(.card, .modal-content) span:not(.tag):not(.badge),
html.host-light-theme .video-card-body p {
  color: #5a707e !important;
}

html.host-light-theme :is(.tag, .badge, .meta-chip),
html.host-light-theme .copy-card-tags span {
  border-color: rgba(45, 212, 191, 0.24) !important;
  background: rgba(45, 212, 191, 0.1) !important;
  color: #137f73 !important;
}

html.host-light-theme :is(pre, .prompt-box, .modal-prompt-card) {
  border-color: rgba(76, 110, 126, 0.18) !important;
  background: #e8f1f3 !important;
  color: #233e4d !important;
}

html.host-light-theme :is(.copy-button, .action-copy-button) {
  border-color: #2dd4bf !important;
  background: rgba(45, 212, 191, 0.12) !important;
  color: #0d776d !important;
}

html.host-light-theme .member-prompt-locked::after,
html.host-light-theme .member-prompt-locked > .member-prompt-unlock-link {
  border-color: rgba(0, 175, 168, 0.34);
  background: rgba(247, 251, 251, 0.94);
  color: #087e78;
  box-shadow: 0 8px 24px rgba(21, 74, 71, 0.12);
}

html.host-light-theme .member-prompt-locked > .member-prompt-unlock-link:hover,
html.host-light-theme .member-prompt-locked > .member-prompt-unlock-link:focus-visible {
  border-color: #00b9b1;
  background: #00b9b1;
  color: #ffffff;
}

html.host-light-theme .member-prompt-visibility-toggle {
  border-color: rgba(0, 175, 168, 0.34);
  background: rgba(255, 255, 255, 0.94);
  color: #087e78;
}

html.host-light-theme .member-prompt-visibility-toggle:hover,
html.host-light-theme .member-prompt-visibility-toggle:focus-visible,
html.host-light-theme .member-prompt-visibility-toggle.is-revealed {
  background: #00b9b1;
  color: #ffffff;
}

html.host-light-theme .detail-modal .modal-backdrop {
  background: rgba(24, 47, 61, 0.36) !important;
  backdrop-filter: blur(12px);
}

html.host-light-theme .modal-panel,
html.host-light-theme .modal-content {
  border-color: rgba(72, 108, 124, 0.2) !important;
  background: #f2f8f9 !important;
  color: #172c3d !important;
}

html.host-light-theme .modal-close {
  border-color: rgba(72, 108, 124, 0.22) !important;
  background: rgba(244, 250, 250, 0.94) !important;
  color: #254454 !important;
}

html.host-light-theme .filter-panel,
html.host-light-theme .card,
html.host-light-theme .text-template-card,
html.host-light-theme .prompt-card,
html.host-light-theme .copy-card,
html.host-light-theme .image-card,
html.host-light-theme .video-card,
html.host-light-theme .modal-panel,
html.host-light-theme .modal-content {
  border-color: rgba(0,201,200,.12) !important;
  background-color: rgba(255,255,255,.72) !important;
  box-shadow: 0 10px 35px rgba(20,80,100,.08) !important;
  backdrop-filter: blur(20px);
}

html.host-light-theme :is(h1,h2,h3,h4,strong) { color:#132238 !important; }
html.host-light-theme :is(p,li,.card-meta,.card-description) { color:#536273 !important; }
html.host-light-theme :is(.eyebrow,.active-path) { color:#00afa8 !important; }
html.host-light-theme :is(pre,.prompt-box,.modal-prompt-card) { background:#f2f6f8 !important; color:#344054 !important; }
html.host-light-theme :is(.copy-button,.action-copy-button) { border-color:#00c9c8 !important; color:#00afa8 !important; }
html.host-light-theme :is(.copy-button,.action-copy-button):hover { background:#00c9c8 !important; color:#fff !important; box-shadow:0 0 22px rgba(0,201,200,.18) !important; }
html.host-light-theme .category-tab.active { background:#00c9c8 !important; color:#fff !important; }
html.host-light-theme .category-tab:not(.active) { background:#eef3f5 !important; color:#536273 !important; }

html.host-light-theme .image-card-grid .prompt-box {
  border:1px solid rgba(0,175,168,.3) !important;
  background:#f2f6f8 !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.8) !important;
}

html.host-light-theme .image-card-grid .prompt-box > .prompt-text {
  border:0 !important;
  background:transparent !important;
}

html.host-light-theme .filter-panel {
  background:
    radial-gradient(circle at 12% 0%,rgba(183,245,240,.22),transparent 34%),
    rgba(255,255,255,.72) !important;
}

html.host-light-theme :is(.card,.image-template-card,.text-template-card,.video-template-card) {
  background:
    radial-gradient(260px 150px at 5% 0%,rgba(183,245,240,.18),transparent 68%),
    rgba(255,255,255,.72) !important;
}

html.host-light-theme :is(.card-body,.prompt-card-body,.video-card-body,.copy-card-main,.copy-card-footer) {
  background:transparent !important;
}

html.host-light-theme :is(.prompt-text,.subpage-prompt-box,.modal-prompt-card,pre) {
  border-color:rgba(0,201,200,.12) !important;
  background:#f2f6f8 !important;
  color:#344054 !important;
}

/* Reference-led light corrections: retain the existing vault geometry while
   restoring editorial contrast and removing the remaining dark UI islands. */
html.host-light-theme .vault-page-button {
  border-color: rgba(19, 34, 56, 0.1) !important;
  background: #e9eef0 !important;
  color: #536273 !important;
  box-shadow: none !important;
}

html.host-light-theme .vault-page-button:hover:not(:disabled),
html.host-light-theme .vault-page-button.active {
  border-color: #00c9c8 !important;
  background: #00c9c8 !important;
  color: #fff !important;
  box-shadow: 0 8px 20px rgba(0, 201, 200, 0.18) !important;
}

html.host-light-theme .vault-page-button:disabled {
  border-color: rgba(19, 34, 56, 0.06) !important;
  background: #edf1f2 !important;
  color: #8a98a8 !important;
  opacity: 0.78 !important;
}

html.host-light-theme :is(.detail-button, .text-detail-link, .video-detail-button) {
  border-color: rgba(0, 201, 200, 0.34) !important;
  background: rgba(248, 251, 252, 0.94) !important;
  color: #00afa8 !important;
  box-shadow: none !important;
  opacity: 1 !important;
}

html.host-light-theme :is(.detail-button, .text-detail-link, .video-detail-button)::before,
html.host-light-theme :is(.detail-button, .text-detail-link, .video-detail-button)::after {
  color: #00afa8 !important;
  opacity: 1 !important;
}

html.host-light-theme :is(.detail-button, .text-detail-link, .video-detail-button):hover {
  border-color: #00c9c8 !important;
  background: #00c9c8 !important;
  color: #fff !important;
  box-shadow: 0 8px 22px rgba(0, 201, 200, 0.2) !important;
}

html.host-light-theme :is(.detail-button, .text-detail-link, .video-detail-button):hover::before,
html.host-light-theme :is(.detail-button, .text-detail-link, .video-detail-button):hover::after {
  color: #fff !important;
}

html.host-light-theme .detail-modal .modal-backdrop {
  background:
    radial-gradient(circle, rgba(183, 245, 240, 0.72) 1px, transparent 1.5px) 0 0 / 38px 38px,
    rgba(19, 34, 56, 0.38) !important;
  backdrop-filter: blur(12px) saturate(0.9) !important;
}

html.host-light-theme .modal-panel {
  border-color: rgba(0, 201, 200, 0.16) !important;
  background: #f5fafc !important;
  box-shadow: 0 26px 80px rgba(19, 34, 56, 0.2) !important;
}

html.host-light-theme .modal-content {
  border-color: rgba(0, 201, 200, 0.12) !important;
  background:
    radial-gradient(circle at 100% 0%, rgba(183, 245, 240, 0.2), transparent 36%),
    linear-gradient(145deg, #f8fbfc, #eef7f7) !important;
  color: #132238 !important;
}

html.host-light-theme .modal-content :is(h2, h3, h4, strong) {
  color: #132238 !important;
}

html.host-light-theme .modal-content :is(p, li, span:not(.tag):not(.badge)) {
  color: #536273 !important;
}

html.host-light-theme .modal-meta,
html.host-light-theme .modal-section h3 {
  color: #00afa8 !important;
}

html.host-light-theme .modal-section {
  border-color: rgba(0, 201, 200, 0.14) !important;
}

html.host-light-theme .modal-image-wrap {
  border-color: rgba(0, 201, 200, 0.16) !important;
  background: #08131a !important;
}

html.host-light-theme .modal-close {
  border-color: rgba(19, 34, 56, 0.12) !important;
  background: rgba(255, 255, 255, 0.92) !important;
  color: #25364a !important;
  box-shadow: 0 8px 22px rgba(19, 34, 56, 0.1) !important;
}

html.host-light-theme .vault-page-jump input {
  border: 1px solid rgba(0, 175, 168, 0.32) !important;
  background: #fff !important;
  color: #25364a !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9) !important;
}

html.host-light-theme .vault-page-jump input:focus {
  border-color: #00c9c8 !important;
  box-shadow: 0 0 0 3px rgba(0, 201, 200, 0.1) !important;
}

html.host-light-theme :is(.copy-button, .action-copy-button) {
  border: 1px solid #00c9c8 !important;
  background: #e6faf8 !important;
  color: #00afa8 !important;
  box-shadow: none !important;
}
html.host-light-theme .vault-engagement {
  border-top-color: rgba(15, 23, 42, .10);
}
html.host-light-theme .vault-engagement button {
  color: #64748b;
}
html.host-light-theme .vault-engagement button:hover,
html.host-light-theme .vault-engagement button:focus-visible {
  background: rgba(15, 23, 42, .06);
  color: #0f766e;
}
html.host-light-theme .vault-engagement button:first-child.is-active {
  color: #e11d48;
}
html.host-light-theme .vault-engagement button:last-child.is-active {
  color: #0f766e;
}