:root {
      --bg:      #000000;
      --surface: #0d0d12;
      --border:  #1a1a2e;
      --accent:  #ff4d00;
      --accent2: #ff8c00;
      --green:   #00ff88;
      --text:    #e8e8f0;
      --red:     #ff4444;
      --yellow:  #ffcc00;
      --mono:    'Nunito', sans-serif;
      --display: 'Nunito', sans-serif;
      --body:    'Nunito', sans-serif;

      --up-modal-font-family: 'Orbitron', ui-sans-serif, sans-serif;
      --up-modal-dark-bg: #0a0608;
      --up-modal-bg: #0a0608;
      --up-modal-font-dark-color: #f5ece0;
      --up-modal-font-color: #f5ece0;
      --up-modal-btn-dark-color: #ff4d00;
      --up-modal-btn-color: #ff4d00;
      --up-modal-btn-dark-text: #1a0f00;
      --up-modal-btn-text: #1a0f00;
      --up-modal-border-radius: 18px;
      --up-modal-btn-radius: 14px;

      /* ── Fluid font scale — identical to garden/bloom ── */
      --fs-xs:  clamp(7px,  0.5vw,  9px);
      --fs-sm:  clamp(8px,  0.6vw,  11px);
      --fs-md:  clamp(10px, 0.75vw, 14px);
      --fs-lg:  clamp(14px, 1.1vw,  20px);
      --fs-xl:  clamp(18px, 1.5vw,  26px);
      --fs-2xl: clamp(24px, 2.2vw,  42px);

      /* ── Sidebar & layout ── */
      --sidebar-w: 220px;
      --navbar-h: clamp(38px, 2vw, 42px);
    }
    * { margin: 0; padding: 0; box-sizing: border-box; }
    body {
      background: #000;
      min-height: 100vh;
      padding-top: var(--navbar-h);
      color: var(--text);
      font-family: var(--body);
      overflow-y: auto;
      overflow-x: hidden;
      scrollbar-width: thin;
      scrollbar-color: #ff4d00 transparent;
    }
    body::-webkit-scrollbar { width: 6px; }
    body::-webkit-scrollbar-track { background: transparent; }
    body::-webkit-scrollbar-thumb { background: #ff4d00; border-radius: 3px; }
    body::before {
      content: '';
      position: fixed;
      top: var(--navbar-h);
      left: 0;
      right: 0;
      bottom: 0;
      background: url('background.webp') center center / cover no-repeat;
      z-index: 0;
      pointer-events: none;
      transition: opacity 0.3s ease;
    }
    body.airtrust-open::before,
    body.nursery-open::before {
      opacity: 0;
      pointer-events: none;
    }

    /* ── Perf: mobile / WebView mode ─────────────────────────────────────
       backdrop-filter is extremely expensive on mobile/WebView GPUs. Also
       targets (hover: none) to catch touch devices that report a wide
       viewport (tablets, some in-app WebViews). */
    @media (max-width: 700px), (hover: none) {
      * {
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
      }
    }

    /* ── Perf: pause offscreen decorative animations ───────────────────────
       Toggle this class (via IntersectionObserver) on elements running
       infinite CSS animations to stop compositor/GPU work while offscreen. */
    .anim-offscreen,
    .anim-offscreen *,
    .anim-offscreen::before,
    .anim-offscreen::after {
      animation-play-state: paused !important;
    }
    .layout, .navbar, #bloom-score-dropdown, #entering-overlay, .soulbloom-shutters, #back-to-top {
      position: relative;
      z-index: 1;
    }
    * { box-sizing: border-box; margin: 0; padding: 0; }
    * {
  -webkit-tap-highlight-color: transparent;
  -webkit-touch-callout: none;
}

@media (max-width: 1024px) {
  body {
    overflow: auto;
  }
  /* Lock-hint: shown directly in CSS (not toggled by JS after
     DOMContentLoaded) so it renders correctly from the very first paint —
     previously the only visible card at page load (AirTrust) would flash
     the desktop layout (hidden hint, left-aligned feature list) until JS
     caught up a moment later, while cards reached via the bottom nav
     never showed that flash since JS had already run by then. */
  .phlame-lock-hint {
    display: block !important;
    order: 999 !important;
    margin-top: 8px !important;
    margin-bottom: 0 !important;
  }
  /* Feature list: centered directly in CSS for the same reason (was only
     centered by JS after DOMContentLoaded, causing the same first-paint
     flash on whichever card was visible at load). */
  .card-feature-list {
    text-align: center !important;
    align-items: center !important;
  }
    .at-label-full { display: none !important; }
  .at-label-short { display: inline !important; }
}
    /* ── Navbar ─────────────────────────────────────────────────────────── */
.navbar {
  position: fixed;
  top: 0; left: 0; right: 0;
  z-index: 9999;
  width: 100%;
  background: linear-gradient(135deg, #ff4d00, #ff8c00);
  display: flex;
  align-items: center;
  padding: 0 20px;
  height: var(--navbar-h);
  border-bottom: 1px solid rgba(0,0,0,0.2);
  box-shadow:
    0 2px 12px rgba(255,77,0,0.35),
    0 1px 0 rgba(255,255,255,0.18) inset,
    0 -6px 18px rgba(0,0,0,0.25) inset;
  overflow: hidden;
}
.navbar::before {
  content: '';
  position: absolute;
  left: 0; right: 0; bottom: 0;
  height: 2px;
  background: #ffd400;
  opacity: 0.6;
  pointer-events: none;
}
.navbar::after {
  content: '';
  position: absolute;
  top: 0; bottom: 0;
  width: 80px;
  background: rgba(255,255,255,0.22);
  animation: navbar-shimmer 4s ease-in-out infinite;
  pointer-events: none;
  z-index: 0;
}
@keyframes shimmer-slide {
  0%   { background-position: -200% 0; }
  100% { background-position: 200% 0; }
}
@keyframes navbar-shimmer {
  0%   { transform: translateX(-100%) skewX(-15deg); opacity:0; }
  40%  { opacity: 0.18; }
  100% { transform: translateX(300%) skewX(-15deg); opacity:0; }
}
.navbar > * { position: relative; z-index: 1; }
.navbar-brand {
  display: flex;
  align-items: center;
  gap: 8px;
  font-family: 'Share Tech Mono', monospace;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 1.5px;
  color: #000;
  text-transform: uppercase;
  margin-right: 28px;
  text-decoration: none;
  opacity: 0.92;
}
.navbar-brand-cursor {
  display: inline-block;
  font-weight: 900;
  animation: dot-blink 1s steps(2, start) infinite;
}
.navbar-links {
  display: flex;
  align-items: center;
  gap: 2px;
  flex: 1;
}
.nav-sep {
  display: inline-block;
  width: 1px;
  height: 14px;
  background: linear-gradient(180deg, transparent, rgba(0,0,0,0.35) 30%, rgba(0,229,255,0.45) 50%, rgba(0,0,0,0.35) 70%, transparent);
  margin: 0 4px;
  flex-shrink: 0;
  border-radius: 1px;
}
.navbar-link {
  position: relative;
  font-family: 'Share Tech Mono', monospace;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: #000;
  text-decoration: none;
  padding: 5px 14px;
  border-radius: 3px;
  transition: background 0.15s, opacity 0.15s, letter-spacing 0.15s;
  opacity: 0.7;
  background: none;
  border: none;
  cursor: pointer;
}
.navbar-link::before,
.navbar-link::after {
  opacity: 0;
  transition: opacity 0.15s, margin 0.15s;
  font-weight: 900;
}
.navbar-link::before { content: '['; margin-right: 0; }
.navbar-link::after  { content: ']'; margin-left: 0; }
.navbar-link:hover {
  background: rgba(0,0,0,0.12);
  opacity: 1;
  letter-spacing: 2.5px;
}
.navbar-link:hover::before, .navbar-link.active::before { opacity: 0.6; margin-right: 3px; }
.navbar-link.active::before { content: ''; background-image: url('image2_1.webp'); background-size: contain; background-repeat: no-repeat; background-position: center; width: 28px; height: 28px; display: inline-block; opacity: 1; margin-right: 4px; vertical-align: middle; }
.navbar-link:hover::after { opacity: 0.6; margin-left: 3px; }
.navbar-link.active::after  { content: ''; opacity: 0 !important; margin-left: 0; }
.navbar-link.active {
  color: #ff8c00;
  opacity: 1;
  letter-spacing: 2.5px;
  text-shadow: 0 0 10px rgba(255,140,0,0.8), 0 0 20px rgba(255,140,0,0.4);
  background: linear-gradient(145deg, #2a2a2a 0%, #050505 55%, #000 100%);
  border: 2px solid #1a1a1a;
  border-radius: 8px;
  transform: none;
  align-self: center;
  display: flex;
  align-items: center;
  height: 24px;
  padding-top: 0;
  padding-bottom: 0;
  animation: active-tab-sheen 2.4s ease-in-out infinite;
}
@keyframes active-tab-tilt {
  0%, 100% { transform: none; }
  50%      { transform: none; }
}
@keyframes active-tab-sheen {
  0%   { box-shadow: 0 0 8px rgba(255,140,0,0.4), 0 0 18px rgba(255,100,0,0.2), inset 0 0 6px rgba(255,140,0,0.05); }
  50%  { box-shadow: 0 0 16px rgba(255,140,0,0.75), 0 0 32px rgba(255,100,0,0.4), 0 0 48px rgba(255,60,0,0.15), inset 0 0 10px rgba(255,140,0,0.12); }
  100% { box-shadow: 0 0 8px rgba(255,140,0,0.4), 0 0 18px rgba(255,100,0,0.2), inset 0 0 6px rgba(255,140,0,0.05); }
}
.navbar-actions {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  flex-shrink: 0;
  margin-left: auto;
}
@property --garden-spin {
  syntax: '<angle>';
  inherits: false;
  initial-value: 0deg;
}
@keyframes garden-rotate { to { --garden-spin: 360deg; } }
@keyframes garden-pulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(255,184,0,0.55), 0 0 14px rgba(255,140,0,0.35), inset 0 0 10px rgba(255,255,255,0.18); }
  50%      { box-shadow: 0 0 0 4px rgba(255,184,0,0.12), 0 0 22px rgba(255,140,0,0.55), inset 0 0 14px rgba(255,255,255,0.28); }
}
@keyframes garden-pulse-leave {
  0%, 100% { box-shadow: 0 0 0 0 rgba(0,255,136,0.45), 0 0 14px rgba(0,255,136,0.30), inset 0 0 10px rgba(255,255,255,0.16); }
  50%      { box-shadow: 0 0 0 4px rgba(0,255,136,0.10), 0 0 22px rgba(0,255,136,0.50), inset 0 0 14px rgba(255,255,255,0.26); }
}
@keyframes garden-sweep {
  0%   { transform: translateX(-130%) skewX(-18deg); }
  100% { transform: translateX(230%)  skewX(-18deg); }
}
@keyframes garden-pop {
  0%   { transform: scale(0.4) rotate(-15deg); opacity: 0; }
  60%  { transform: scale(1.15) rotate(4deg);  opacity: 1; }
  100% { transform: scale(1) rotate(0deg);     opacity: 1; }
}
#connect-btn {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  border: none;
  border-radius: 20px;
  cursor: pointer;
  font-family: 'Nunito', sans-serif;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 2.2px;
  text-transform: uppercase;
  color: #1a0f00;
  padding: 7px 18px;
  opacity: 1;
  background: linear-gradient(135deg, #ffc830 0%, #ffe680 22%, #ffffff 48%, #fff0a0 74%, #ffb800 100%);
  box-shadow: 0 0 0 0 rgba(255,184,0,0.55), 0 2px 8px rgba(0,0,0,0.35), inset 0 0 10px rgba(255,255,255,0.18);
  transition: transform 0.18s cubic-bezier(.34,1.56,.64,1), box-shadow 0.25s ease, filter 0.2s ease, letter-spacing 0.2s ease;
  animation: garden-pulse 2.6s ease-in-out infinite;
  will-change: transform;
}
#connect-btn::before {
  content: '';
  position: absolute;
  inset: -2px;
  z-index: -1;
  border-radius: inherit;
  background: conic-gradient(from var(--garden-spin), #ffb800, #fff3b0, #ff7a00, #ffe680, #ffb800);
  animation: garden-rotate 3.2s linear infinite;
  filter: saturate(1.3);
}
#connect-btn::after {
  content: '';
  position: absolute;
  top: -10%; bottom: -10%; left: 0;
  width: 32%;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,0.75), transparent);
  pointer-events: none;
  mix-blend-mode: overlay;
  animation: garden-sweep 2.8s ease-in-out infinite;
  animation-delay: 0.4s;
}
#connect-btn:hover {
  transform: translateY(-2px) scale(1.045);
  letter-spacing: 2.6px;
  filter: brightness(1.08) saturate(1.15);
  box-shadow: 0 0 0 3px rgba(255,184,0,0.18), 0 6px 18px rgba(255,122,0,0.40), inset 0 0 14px rgba(255,255,255,0.3);
}
#connect-btn:active { transform: translateY(0) scale(0.96); filter: brightness(0.97); transition-duration: 0.08s; }
#connect-btn:focus-visible { outline: 2px solid #fff3b0; outline-offset: 3px; }
#connect-btn .connect-l1, #connect-btn .connect-l2 { position: relative; z-index: 1; }
@media (prefers-reduced-motion: reduce) {
  #connect-btn, #connect-btn::before, #connect-btn::after { animation: none !important; }
}
@keyframes dot-blink {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.2; }
}
#connected-dot {
  display: none;
  width: 10px; height: 10px;
  min-width: 10px; min-height: 10px;
  border-radius: 50%;
  background: var(--green);
  box-shadow: 0 0 6px var(--green);
  flex-shrink: 0;
  animation: dot-blink 1.5s ease-in-out infinite;
}
#connected-dot.is-connected { display: inline-block; }
#up-identity.is-connected { display: inline-flex !important; }
@media (max-width: 1360px) {
  #up-identity.is-connected { display: none !important; }
  #up-identity { display: none !important; }
}
@media (max-width: 1024px) {
  #nav-phlame-mobile.is-connected { display: block !important; }
}
@media (max-width: 1024px) {
  #up-name { display: none; }
  #up-pfp  { display: none; }
}
#disconnect-btn.btn-connected {
  position: relative !important;
  isolation: isolate !important;
  overflow: hidden !important;
  border: none !important;
  border-radius: 20px !important;
  cursor: pointer !important;
  font-family: 'Nunito', sans-serif !important;
  font-size: 10px !important;
  font-weight: 800 !important;
  letter-spacing: 2.2px !important;
  text-transform: uppercase !important;
  color: #1a0f00 !important;
  padding: 7px 18px !important;
  opacity: 1 !important;
  background: linear-gradient(135deg, #00ffaa 0%, #b9ffe3 22%, #ffffff 48%, #c9ffe9 74%, #00e09a 100%) !important;
  box-shadow: 0 0 0 0 rgba(0,255,136,0.45), 0 2px 8px rgba(0,0,0,0.35), inset 0 0 10px rgba(255,255,255,0.16) !important;
  transition: transform 0.18s cubic-bezier(.34,1.56,.64,1), box-shadow 0.25s ease, filter 0.2s ease, letter-spacing 0.2s ease !important;
  animation: garden-pulse-leave 2.6s ease-in-out infinite, garden-pop 0.45s cubic-bezier(.34,1.56,.64,1) !important;
  will-change: transform;
}
#disconnect-btn.btn-connected::before {
  content: '';
  position: absolute;
  inset: -2px;
  z-index: -1;
  border-radius: inherit;
  background: conic-gradient(from var(--garden-spin), #00e09a, #d6fff0, #00ffaa, #b9ffe3, #00e09a);
  animation: garden-rotate 3.2s linear infinite;
  filter: saturate(1.3);
}
#disconnect-btn.btn-connected::after {
  content: '';
  position: absolute;
  top: -10%; bottom: -10%; left: 0;
  width: 32%;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,0.75), transparent);
  pointer-events: none;
  mix-blend-mode: overlay;
  animation: garden-sweep 2.8s ease-in-out infinite;
  animation-delay: 1.2s;
}
#disconnect-btn.btn-connected:hover {
  transform: translateY(-2px) scale(1.045) !important;
  letter-spacing: 2.6px !important;
  filter: brightness(1.08) saturate(1.15) !important;
  box-shadow: 0 0 0 3px rgba(0,255,136,0.18), 0 6px 18px rgba(0,255,136,0.40), inset 0 0 14px rgba(255,255,255,0.3) !important;
}
#disconnect-btn.btn-connected:active { transform: translateY(0) scale(0.96) !important; filter: brightness(0.97) !important; transition-duration: 0.08s !important; }
#disconnect-btn.btn-connected:focus-visible { outline: 2px solid #d6fff0 !important; outline-offset: 3px !important; }
#disconnect-btn .disconnect-label-short, #disconnect-btn .disconnect-label-full { position: relative; z-index: 1; }
@media (prefers-reduced-motion: reduce) {
  #disconnect-btn.btn-connected, #disconnect-btn.btn-connected::before, #disconnect-btn.btn-connected::after { animation: none !important; }
}
.disconnect-label-short { display: none; }

/* ── BloomScore Dropdown ──────────────────────────────────────────────── */
#bloom-score-dropdown {
  position: fixed;
  top: 45px;
  left: 50%;
  transform: translateX(-50%) translateY(-8px);
  z-index: 9998;
  width: 240px;
  background: rgba(8,8,12,0.97);
  border: 1.5px solid rgba(255,77,0,0.5);
  border-radius: 12px;
  box-shadow: 0 8px 32px rgba(0,0,0,0.6), 0 0 24px rgba(255,77,0,0.12);
  padding: 16px 20px 18px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.2s ease, transform 0.2s ease;
}
#bloom-score-dropdown.open {
  opacity: 1;
  pointer-events: auto;
  transform: translateX(-50%) translateY(0);
}
#bsd-pfp {
  width: 48px; height: 48px;
  border-radius: 50%; object-fit: cover;
  border: 2px solid rgba(255,77,0,0.6);
  margin-bottom: 4px;
}
#bsd-name {
  font-family: 'Orbitron', sans-serif;
  font-size: var(--fs-sm); font-weight: 700; color: #e8e8f0;
  letter-spacing: 1px; text-align: center;
  max-width: 200px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
#bsd-addr {
  font-family: var(--mono); font-size: var(--fs-xs);
  color: #555; letter-spacing: 1px; margin-top: -2px;
}
#bsd-score-wrap {
  display: flex; flex-direction: column; align-items: center;
  margin: 6px 0 2px; gap: 2px;
}
#bsd-score-title {
  font-family: 'Orbitron', sans-serif; font-size: var(--fs-xs); font-weight: 700;
  letter-spacing: 3px; color: #ff8c00; text-transform: uppercase; opacity: 0.8;
}
#bsd-score {
  font-family: 'Orbitron', sans-serif; font-size: var(--fs-2xl);
  font-weight: 900; line-height: 1; letter-spacing: 2px;
}
#bsd-label {
  font-family: var(--mono); font-size: var(--fs-xs); font-weight: 700;
  letter-spacing: 2px; text-transform: uppercase; margin-top: 2px;
}
.bsd-divider {
  width: 100%; height: 1px;
  background: linear-gradient(90deg, transparent, rgba(255,77,0,0.3), transparent);
  margin: 6px 0 4px;
}
#bsd-bloom-link {
  font-family: 'Orbitron', sans-serif; font-size: var(--fs-xs); font-weight: 700;
  letter-spacing: 2px; color: #ff8c00; text-decoration: none;
  text-transform: uppercase; opacity: 0.6; transition: opacity 0.15s;
}
#bsd-bloom-link:hover { opacity: 1; }

@media (min-width: 1025px) {
  #connect-btn {
    border-radius: 20px !important;
  }

  /* Background starts right below the navbar, regardless of resolution */
  body::before {
    top: var(--navbar-h) !important;
    background: url('background.webp') center center / cover no-repeat !important;
  }
}

@media (max-width: 1024px) {
  .navbar-brand { display: none; }
  .navbar {
    padding: 0 8px;
    overflow: visible;
  }
  .navbar-links {
    flex: 1;
    justify-content: flex-start;
    gap: 0;
    min-width: 0;
    overflow: hidden;
  }
  .navbar-link {
    padding: 5px 7px !important;
    font-size: 14px !important;
    letter-spacing: 0.5px !important;
    white-space: nowrap;
  }
  .navbar-link:hover, .navbar-link.active { letter-spacing: 0.5px !important; }
  .navbar-link::before, .navbar-link::after { display: none !important; }
  .navbar-link.active::before { display: inline-block !important; content: ''; background-image: url('image2_1.webp'); background-size: contain; background-repeat: no-repeat; background-position: center; width: 28px; height: 28px; opacity: 1; margin-right: 4px; vertical-align: middle; }
  .navbar-link.active::after  { display: none !important; content: ''; }
  .nav-bloom-prefix { display: none; }
  .navbar-actions {
    flex-shrink: 0;
    gap: 4px;
    margin-left: 4px;
  }
  #connect-btn {
    display: inline-flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    border-radius: 12px !important;
    padding: 4px 5px !important;
    font-size: 7px !important;
    letter-spacing: 0.5px !important;
    line-height: 1.2 !important;
    color: #1a0f00 !important;
    white-space: normal;
    width: 42px;
    flex-shrink: 0;
  }
  #connect-btn:hover { transform: none; letter-spacing: 0.5px !important; }
  .sidebar { display: none !important; }
  #connect-btn .connect-l1,
  #connect-btn .connect-l2 { display: block; }
  #connect-btn.btn-hidden-mobile { display: none !important; }
  #connected-dot { display: none !important; }
  #connected-dot.is-connected {
    display: inline-block !important;
    visibility: visible !important;
    margin: 0 !important;
  }
  #disconnect-btn.btn-connected {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 12px !important;
    padding: 4px 7px !important;
    font-size: 7px !important;
    letter-spacing: 0.5px !important;
    white-space: nowrap;
    flex-shrink: 0;
  }
  #disconnect-btn.btn-connected:hover { transform: none !important; letter-spacing: 0.5px !important; }
  .disconnect-label-short { display: inline; }
  .disconnect-label-full { display: none; }
  #up-identity.is-connected { display: none !important; }
}

    /* ── Layout ─────────────────────────────────────────────────────────── */
    .layout {
      display: flex;
      align-items: flex-start;
      min-height: calc(100vh - var(--navbar-h));
    }

    /* ── Sidebar ─────────────────────────────────────────────────────────── */
    .sidebar {
      width: var(--sidebar-w);
      min-width: var(--sidebar-w);
      position: fixed;
      top: var(--navbar-h);
      height: calc(100vh - var(--navbar-h));
      overflow-y: auto;
      overflow-x: hidden;
      border-right: 1px solid var(--border);
      background: rgba(6,6,8,0.75);
      backdrop-filter: blur(12px);
      padding: 0 0 clamp(20px, 3vw, 40px);
      scrollbar-width: thin;
      scrollbar-color: var(--accent) transparent;
    }
    .sidebar::-webkit-scrollbar { width: 3px; }
    .sidebar::-webkit-scrollbar-thumb { background: var(--accent); border-radius: 2px; }

    .sidebar-header {
      padding: clamp(28px, 3.5vw, 52px) clamp(14px, 1.8vw, 26px) clamp(14px, 1.8vw, 26px);
      margin-bottom: clamp(6px, 0.8vw, 12px);
    }
    .sidebar-title {
      font-family: var(--display);
      font-size: var(--fs-md);
      font-weight: 700;
      letter-spacing: 3px;
      color: var(--accent);
      text-transform: uppercase;
      text-align: center;
      margin-bottom: 4px;
    }
    .sidebar-subtitle {
      font-family: var(--mono);
      font-size: var(--fs-sm);
      color: #ff7b00;
      letter-spacing: 1px;
      text-align: center;
    }

    .sidebar-content {
      padding: clamp(8px, 0.9vw, 12px) clamp(10px, 1.2vw, 16px);
      font-family: var(--mono);
      font-size: var(--fs-xs);
      color: #444455;
      letter-spacing: 2px;
      text-align: center;
    }

    /* ── Main content ────────────────────────────────────────────────────── */
    .content {
      flex: 1;
      margin-left: var(--sidebar-w);
      display: flex;
      align-items: flex-start;
      justify-content: center;
      min-height: calc(100vh - var(--navbar-h));
      overflow-y: auto;
      overflow-x: hidden;
      padding: clamp(14px, 1.8vw, 28px) 0;
    }
@media (max-width: 1024px) {
  /* Reset sidebar width to 0 so all var(--sidebar-w) calcs resolve to 0 */
  :root {
    --sidebar-w: 0px;
  }

  body {
    overflow-x: hidden;
    overflow-y: auto;
  }

  /* (2026-07-13) Several JS flows (AirTrust/SBT-creator/nursery panels)
     set document.body.style.background directly with a hardcoded
     'fixed' attachment. That inline style overrides any CSS rule for
     `body` and isn't covered by the body::before override below, so on
     mobile the background stopped following scroll whenever one of
     those panels opened/closed (background-attachment:fixed is
     notoriously buggy on iOS Safari/Android — the image detaches from
     content and appears to jump or not scroll at all). This forces
     `scroll` back on mobile regardless of what JS set inline, without
     touching the JS itself or the desktop behavior. */
  body {
    background-attachment: scroll !important;
  }

  /* Background starts right below the navbar */
  body::before {
    background: url('background.webp') center center / cover no-repeat !important;
    top: var(--navbar-h) !important;
  }

  /* Sidebar hidden */
  .sidebar {
    display: none !important;
  }

  /* Full-width layout */
  .layout {
    flex-direction: column !important;
  }

  /* Full-width content, no margin-left */
  .content {
    margin-left: 0 !important;
    padding: 0 5vw calc(90px + 0.5cm) 5vw !important;
    width: 100vw !important;
    min-height: calc(100vh - var(--navbar-h)) !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: flex-start !important;
    overflow-x: hidden !important;
    box-sizing: border-box !important;
  }

  /* Desktop cards-grid and long-footer-card are desktop-only; the mobile
     view uses dedicated clones in #mobile-cards-view instead (see HTML). */
  .cards-grid,
  .long-footer-card {
    display: none !important;
  }
}

/* Between 1025px and 1600px only, the cards-grid/long-footer-card were
   locked to a fixed 62vw width with a negative sidebar-offset left shift,
   leaving dead margin on the right instead of filling the available space.
   Above 1600px the existing margin-right is intentional and untouched. */
@media (min-width: 1025px) and (max-width: 1600px) {
  .cards-grid,
  .long-footer-card {
    width: calc(100vw - var(--sidebar-w) - 5vw) !important;
    left: 0 !important;
  }
}

@media (max-width: 1024px) {
  /* Mobile bottom nav bar visible from first paint — was display:none
     inline in HTML, toggled to flex only after JS ran, which reserved no
     space for it up front and contributed to the layout shift. */
  #mobile-bottom-bar {
    display: flex !important;
  }

  /* ── Mobile cards view (clones of the 3 desktop cards) ───────────────── */
  #mobile-cards-view {
    display: flex !important;
    flex-direction: column;
    width: 100%;
    margin-top: max(20px, calc(23.17vh - 0.2317 * var(--navbar-h) - 2.5cm - 1.5cm));
    box-sizing: border-box;
  }
  #mobile-cards-view .mob-card-tab {
    display: none;
    width: 100%;
    box-sizing: border-box;
  }
  #mobile-cards-view .mob-card-tab.is-active {
    display: flex;
    flex-direction: column;
    gap: 4vw;
  }
  #mobile-cards-view .sb-card {
    position: relative;
    top: 0.4cm;
  }
  #mobile-cards-view #airtrust-btn-m,
  #mobile-cards-view #create-sbt-btn-m,
  #mobile-cards-view #open-manager-btn-m {
    margin-top: -12px !important;
  }
  /* Reduce the gap between the "Locked by requirements" hint and its
     onclick button. The generic @media(1024px) rule above reorders the
     hint to appear after the button (order:999) and resets margin-bottom
     to 0, so the gap must be closed via margin-top here instead — a
     negative margin-bottom would pull the hint back up under the button
     and hide it. */
  #mobile-cards-view .phlame-lock-hint {
    margin-top: -14px !important;
    margin-bottom: 8px !important;
  }
  #mobile-cards-view .long-footer-card {
    display: flex !important;
    width: 100% !important;
    left: 0 !important;
    position: relative !important;
    box-sizing: border-box !important;
    margin-top: calc(0.2cm + 24px) !important;
  }
}

/* Mobile only (not tablet): hide the long-footer-card entirely
   (TOTAL SBT CREATED / TOTAL AIRTRUST / BLOOM PROFILES row). */
@media (max-width: 768px) {
  #mobile-cards-view .long-footer-card {
    display: none !important;
  }
}

@media (max-width: 1024px) {

  /* Panels onclick - pleine page, fond opaque */
  #airtrust-content {
    width: 100vw !important;
    left: 0 !important;
    top: var(--navbar-h) !important;
    transform: none !important;
    padding-top: 0 !important;
    padding-left: 4vw !important;
    padding-right: 4vw !important;
    padding-bottom: calc(80px + 1cm) !important;
    margin-left: 0 !important;
    height: calc(100vh - var(--navbar-h)) !important;
    background: rgba(6,6,8,0.98) !important;
    overflow-y: scroll !important;
    overflow-x: hidden !important;
    box-sizing: border-box !important;
    scrollbar-width: thin !important;
    scrollbar-color: #ff4d00 transparent !important;
  }
  #airtrust-content::-webkit-scrollbar { width: 4px !important; }
  #airtrust-content::-webkit-scrollbar-track { background: transparent !important; margin: 0 !important; }
  #airtrust-content::-webkit-scrollbar-thumb { background: #ff4d00 !important; border-radius: 0 !important; }

  .airtrust-grid {
    grid-template-columns: 1fr !important;
    width: calc(100vw - 8vw) !important;
    max-width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    box-sizing: border-box !important;
  }

  #sbt-creator-content {
    width: 100vw !important;
    left: 0 !important;
    top: var(--navbar-h) !important;
    transform: none !important;
    padding-top: 0 !important;
    padding-left: 4vw !important;
    padding-right: 0 !important;
    padding-bottom: calc(80px + 1cm) !important;
    margin-left: 0 !important;
    height: calc(100vh - var(--navbar-h)) !important;
    background: rgba(6,6,8,0.98) !important;
    overflow-y: scroll !important;
    overflow-x: hidden !important;
    box-sizing: border-box !important;
    scrollbar-width: thin !important;
    scrollbar-color: #ff4d00 transparent !important;
  }
  #sbt-creator-content::-webkit-scrollbar { width: 4px !important; }
  #sbt-creator-content::-webkit-scrollbar-track { background: transparent !important; margin: 0 !important; }
  #sbt-creator-content::-webkit-scrollbar-thumb { background: #ff4d00 !important; border-radius: 0 !important; }

  .sbtc-grid {
    grid-template-columns: 1fr !important;
    padding-right: 4vw !important;
  }

  /* X close buttons fixed top-right */
  .airtrust-close-btn-desktop { display: none !important; }
  #airtrust-close-mobile {
    position: fixed !important;
    top: calc(var(--navbar-h) + 8px) !important;
    right: 12px !important;
    left: auto !important;
    bottom: auto !important;
    z-index: 10010 !important;
    background: rgba(13,13,18,0.92);
    border: 1.5px solid #ff4d00;
    color: #ff4d00;
    font-size: 11px;
    font-weight: 700;
    cursor: pointer;
    padding: 4px 12px;
    border-radius: 6px;
    backdrop-filter: blur(8px);
    transition: all 0.2s;
    line-height: 1;
    letter-spacing: 1px;
    font-family: var(--display);
    text-transform: uppercase;
  }
  .sbt-creator-close-btn-desktop { display: none !important; }
  #sbt-creator-close-mobile {
    position: fixed !important;
    top: calc(var(--navbar-h) + 8px) !important;
    right: 12px !important;
    left: auto !important;
    bottom: auto !important;
    z-index: 10010 !important;
    background: rgba(13,13,18,0.92);
    border: 1.5px solid #00d4f0;
    color: #00d4f0;
    font-size: 11px;
    font-weight: 700;
    cursor: pointer;
    padding: 4px 12px;
    border-radius: 6px;
    backdrop-filter: blur(8px);
    transition: all 0.2s;
    line-height: 1;
    letter-spacing: 1px;
    font-family: var(--display);
    text-transform: uppercase;
  }
  #sbt-creator-close-btn {
    display: none !important;
  }

  #airtrust-btn, #create-sbt-btn, #open-manager-btn {
    margin-top: calc(-3px + 0.5cm) !important;
  }
  .sbtc-header-sub { margin-top: calc(0.38vw + 0.2cm) !important; }
  .airtrust-inner-wrap { padding-top: 0 !important; }
}
    .content img {
      max-width: 100%;
      height: auto;
      display: block;
    }
    .footer-text-block { display: none !important; }

    /* ── AirTrust Content ───────────────────────────────────────────────── */
    #airtrust-content {
      left: var(--sidebar-w) !important;
      width: calc(100vw - var(--sidebar-w)) !important;
    }
    @media (max-width: 1024px) {
      #airtrust-content {
        left: 0 !important;
        width: 100vw !important;
        overflow-y: auto !important;
        overflow-x: hidden !important;
        -webkit-overflow-scrolling: touch !important;
      }
      #assets-held-section,
      #bloomboard-section {
        -webkit-overflow-scrolling: touch !important;
      }
    }
    /* Mobile AirTrust close button — hidden by default, shown by JS on mobile only */
    #airtrust-close-mobile {
      display: none;
    }
    /* Mobile SBT Creator close button — hidden by default, shown by JS on mobile only */
    #sbt-creator-close-mobile {
      display: none;
    }
.airtrust-close {
  position: absolute;
  right: 0;
  top: 0;
  background: transparent;
  border: none;
  color: #ff4d00;
  font-size: 18px;
  cursor: pointer;
  padding: 4px 8px;
  border-radius: 4px;
  transition: all 0.2s;
  pointer-events: auto !important;
  z-index: 10001 !important;
}
.airtrust-close:hover {
  background: rgba(255, 77, 0, 0.1);
  border-color: #ff4d00;
  color: #ff4d00;
}
    .airtrust-grid {
      display: grid;
      grid-template-columns: 1fr 1fr;
      align-items: start;
      gap: clamp(14px, 1.8vw, 26px);
      margin-bottom: clamp(20px, 3vw, 42px);
      width: 100%;
      max-width: 1100px;
      margin-left: auto;
      margin-right: auto;
    }
    .airtrust-section {
      border: 2px solid var(--border);
      border-radius: 8px;
      padding: clamp(14px, 1.5vw, 22px);
      background: rgba(6, 6, 8, 0.8);
      backdrop-filter: blur(8px);
    }
    /* Mobile: each section scrolls independently */
    @media (max-width: 700px) {
      .airtrust-section {
        max-height: none;
        overflow: visible;
      }
      #assets-held-section {
        max-height: 70vh;
        overflow-y: auto;
        overflow-x: hidden;
        scrollbar-width: thin;
        scrollbar-color: #ff4d00 transparent;
      }
      #bloomboard-section {
        max-height: 80vh;
        overflow-y: auto;
        overflow-x: hidden;
        scrollbar-width: thin;
        scrollbar-color: #ff4d00 transparent;
      }
    }
    .airtrust-section-title {
      font-family: var(--display);
      font-size: var(--fs-sm);
      font-weight: 700;
      letter-spacing: 2px;
      text-transform: uppercase;
      color: #ff8c00;
      margin-bottom: clamp(10px, 1.2vw, 16px);
      border-bottom: 1px solid var(--border);
      padding-bottom: 8px;
    }
    .airtrust-list {
      display: flex;
      flex-direction: column;
      gap: clamp(8px, 0.8vw, 12px);
      max-height: clamp(220px, 38vh, 480px);
      overflow-y: auto;
      overflow-x: visible;
      scrollbar-width: thin;
      scrollbar-color: #ff4d00 transparent;
    }
    .airtrust-list::-webkit-scrollbar {
      width: 4px;
    }
    .airtrust-list::-webkit-scrollbar-thumb {
      background: #ff4d00;
      border-radius: 2px;
    }
    #airtrust-content::-webkit-scrollbar {
      width: 6px;
    }
    #airtrust-content::-webkit-scrollbar-track {
      background: transparent;
      margin: 0;
      border-radius: 0;
    }
    #airtrust-content::-webkit-scrollbar-thumb {
      background: #ff4d00;
      border-radius: 0;
      border: none;
    }
    .airtrust-item {
      display: flex;
      justify-content: space-between;
      align-items: center;
      padding: clamp(6px, 0.55vw, 10px) clamp(8px, 0.8vw, 12px);
      background: linear-gradient(135deg, rgba(255,77,0,0.1), rgba(255,140,0,0.05));
      border: 1px solid rgba(255, 77, 0, 0.3);
      border-radius: 6px;
      font-family: var(--mono);
      font-size: var(--fs-sm);
      color: var(--text);
      transition: all 0.2s;
      overflow: visible;
      min-height: clamp(48px, 4.5vw, 64px);
      flex-shrink: 0;
    }
    .token-drop-item {
      padding: clamp(8px, 0.8vw, 12px) !important;
      min-height: clamp(40px, 3.8vw, 52px) !important;
      line-height: 1.3 !important;
      align-items: center !important;
    }
    .token-drop-item .airtrust-item-name { font-size: var(--fs-sm) !important; }
    .token-drop-item .airtrust-item-address { font-size: var(--fs-xs) !important; }
    .token-drop-item .airtrust-item-label { gap: 1px !important; }
    .token-drop-item .airtrust-item-value {
      display: flex !important;
      align-items: center !important;
      justify-content: flex-end !important;
      gap: 6px !important;
      font-size: var(--fs-md) !important;
    }
    .airtrust-item:hover {
      border-color: #ff4d00;
    }
    .airtrust-item-label {
      display: flex;
      flex-direction: column;
      gap: 3px;
    }
    .airtrust-item-name {
      color: #ff8c00;
      font-weight: 700;
    }
    .airtrust-item-address {
      color: #888;
      font-size: var(--fs-xs);
      letter-spacing: 0.5px;
    }
    .airtrust-item-value {
      color: var(--green);
      font-weight: 700;
      text-align: right;
    }
    .airtrust-item .airtrust-pfp {
      width: clamp(36px, 3.2vw, 48px);
      height: clamp(36px, 3.2vw, 48px);
      border-radius: 50%;
      object-fit: cover;
      flex-shrink: 0;
    }
    .airtrust-item .airtrust-label-wrap {
      display:flex;
      align-items:center;
      gap: clamp(6px, 0.7vw, 12px);
    }
    .airtrust-item .airtrust-item-meta {
      display:flex;
      flex-direction:column;
      gap:2px;
    }
    .airtrust-item .airtrust-upname {
      font-weight:700;
      color:#ff8c00;
      font-size: var(--fs-md);
    }
    .airtrust-item .airtrust-pfp-fallback {
      width: clamp(36px, 3.2vw, 48px);
      height: clamp(36px, 3.2vw, 48px);
      border-radius:50%; background:rgba(255,140,0,0.12); display:inline-block;
    }
    .airtrust-loading {
      text-align: center;
      padding: clamp(30px, 4vw, 60px) clamp(20px, 3vw, 40px);
      color: var(--accent2);
      font-family: var(--mono);
      font-size: var(--fs-sm);
      letter-spacing: 2px;
    }
    .airtrust-error {
      text-align: center;
      padding: clamp(16px, 2vw, 30px);
      background: rgba(255, 100, 100, 0.1);
      border: 2px solid rgba(255, 100, 100, 0.3);
      border-radius: 6px;
      color: #ff6464;
      font-family: var(--mono);
      font-size: var(--fs-sm);
      letter-spacing: 1px;
    }
    .airtrust-leaderboard-tabs {
      display: flex;
      gap: clamp(5px, 0.6vw, 10px);
      margin-bottom: clamp(10px, 1.2vw, 18px);
      flex-wrap: wrap;
    }
    .airtrust-tab-btn {
      background: transparent;
      border: 1px solid var(--border);
      color: var(--text);
      padding: clamp(5px, 0.5vw, 8px) clamp(10px, 1vw, 16px);
      border-radius: 4px;
      cursor: pointer;
      font-family: var(--mono);
      font-size: var(--fs-xs);
      font-weight: 700;
      letter-spacing: 1px;
      transition: all 0.2s;
    }
    @media (max-width: 768px) {
      .airtrust-header {
  margin-bottom: 0 !important;
}

.airtrust-header img {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  max-width: 80% !important;
  display: block !important;
  margin-left: auto !important;
  margin-right: auto !important;
}
      .airtrust-tab-btn {
        padding: clamp(4px, 0.8vw, 7px) clamp(6px, 1.2vw, 10px) !important;
        font-size: clamp(8px, 1.4vw, 11px) !important;
      }
    }
    .airtrust-tab-btn:hover {
      border-color: #ff4d00;
      color: #ff4d00;
    }
    .airtrust-tab-btn.active {
      background: #ff4d00;
      border-color: #ff4d00;
      color: #000;
    }

    #airtrust-btn:not(:disabled) {
      opacity: 1;
      cursor: pointer;
    }
    #airtrust-btn:not(:disabled):hover {
      background: linear-gradient(135deg, #ff9000 0%, #ffb000 40%, #ff7000 100%) !important;
      transform: translateY(-2px);
    }

    /* ── Bloomboard Accordion — collapsible panel on mobile ── */
    .bloomboard-accordion {
      border: 1px solid rgba(255,77,0,0.3);
      border-radius: 6px;
      overflow: hidden;
      margin-top: 0;
    }
    /* Desktop: accordion trigger hidden, body always visible */
    @media (min-width: 769px) {
      .bloomboard-accordion {
        border: none;
        border-radius: 0;
        overflow: visible;
      }
      .bloomboard-accordion-trigger {
        display: none !important;
      }
      .bloomboard-accordion-body {
        display: block !important;
        background: transparent;
        border-top: none;
      }
      .bloomboard-accordion-body .airtrust-list {
        max-height: none;
        padding: 0;
      }
    }
    /* Mobile: accordion collapsed by default */
    @media (max-width: 768px) {
      .bloomboard-accordion-trigger {
        width: 100%;
        display: flex !important;
        align-items: center;
        justify-content: space-between;
        padding: 12px 14px;
        background: rgba(255,77,0,0.08);
        border: none;
        cursor: pointer;
        font-family: var(--display);
        font-size: 10px;
        font-weight: 700;
        letter-spacing: 2px;
        color: #ff8c00;
        text-transform: uppercase;
        transition: background 0.2s;
        user-select: none;
      }
      .bloomboard-accordion-trigger:hover {
        background: rgba(255,77,0,0.15);
      }
      .bloomboard-accordion-trigger .acc-arrow {
        color: #ff4d00;
        font-size: 10px;
        transition: transform 0.3s ease;
        flex-shrink: 0;
      }
      .bloomboard-accordion-trigger .acc-count {
        background: rgba(255,77,0,0.2);
        color: #ff4d00;
        font-size: 9px;
        font-weight: 700;
        padding: 2px 7px;
        border-radius: 10px;
        letter-spacing: 1px;
      }
      .bloomboard-accordion-trigger.is-open .acc-arrow {
        transform: rotate(180deg);
      }
      .bloomboard-accordion-body {
        display: none;
        background: rgba(6,6,8,0.6);
        border-top: 1px solid rgba(255,77,0,0.2);
      }
      .bloomboard-accordion-body.is-open {
        display: block;
      }
      .bloomboard-accordion-body .airtrust-list {
        max-height: 360px; /* 5 rows × 72px on mobile */
        padding: 10px;
      }
    }

    /* ── Responsive Grid Styles ─────────────────────────────────────────── */
    @media (max-width: 1024px) {
      [style*="grid-template-columns:repeat(3"] {
        grid-template-columns: 1fr 1fr !important;
      }
    }

    @media (max-width: 768px) {
      [style*="grid-template-columns:repeat(3"] {
        grid-template-columns: 1fr !important;
      }
      [style*="grid-template-columns:140px"] {
        grid-template-columns: 1fr !important;
      }
      #airtrust-content {
        left: var(--sidebar-w) !important;
        width: calc(100vw - var(--sidebar-w)) !important;
        transform: none !important;
      }
      #airtrust-content > div {
        width: 100% !important;
        max-width: 90vw !important;
      }
    }

    /* ── UP SELECTED box: label left, value right, applied globally ── */
    .up-selected-row {
      display: flex !important;
      flex-direction: row !important;
      align-items: center !important;
      justify-content: space-between !important;
      text-align: left !important;
    }
    .up-selected-label-wrap {
      text-align: left !important;
      align-items: flex-start !important;
      display: flex !important;
      flex-direction: column !important;
    }
    .up-selected-label-wrap > * {
      text-align: left !important;
    }

    .soulbloom-shutters { display: none; }

    select.nft-up-select {
      flex: 1;
      padding: 7px 10px;
      background: rgba(6,6,8,0.98);
      border: 1px solid rgba(255,77,0,0.4);
      border-radius: 5px;
      color: #ff8c00;
      font-family: var(--mono);
      font-size: 10px;
      outline: none;
      cursor: pointer;
      appearance: none;
      -webkit-appearance: none;
    }
    select.nft-up-select option {
      background: rgba(20,8,0,0.98);
      color: #ff8c00;
    }
    select.nft-up-select:focus {
      border-color: #ff4d00;
    }

    .up-label-short { display: none; }
    @media (max-width: 1024px) {
      .up-label-full  { display: none !important; }
      .up-label-short { display: inline !important; }
    }

    @media (max-width: 1024px) {
      /* UP selected label: inline text only, no pseudo-element */
    }

    @media (max-width: 900px) {
      .airtrust-grid {
        grid-template-columns: 1fr;
        margin-bottom: -20px;
      }
      .airtrust-list {
        max-height: 400px;
      }
    }
    /* Hide long footer card text and image on small screens */
    @media (max-width: 1024px) {
      .long-footer-text,
        .long-footer-subtext,
        .long-footer-image {
          display: none !important;
        }
        .long-footer-left { display: none !important; }
        /* Extra spacing between the subtext and the separator, in case
           .long-footer-subtext/.long-footer-left get re-enabled on responsive. */
        .long-footer-subtext { margin-right: 24px !important; }
        .long-footer-left { padding-right: 24px !important; }
        .long-footer-stats {
          border-left: none !important;
          padding-left: 0 !important;
          justify-content: space-between !important;
          gap: 12px !important;
          flex-direction: row !important;
          align-items: center !important;
          flex-wrap: nowrap !important;
          overflow: hidden !important;
          width: 100% !important;
        }
        .long-footer-stats > div {
          text-align: center !important;
          flex: 1 1 0 !important;
          min-width: 0 !important;
          max-width: none !important;
          box-sizing: border-box !important;
          padding: 6px 4px !important;
        }
      .long-footer-stats > div > div:first-child { font-size: 11px !important; }
      .long-footer-stats > div > div:last-child { font-size: 16px !important; }
      .long-footer-stats > div > div:last-child { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
    }
#sbt-creator-content {
  display: none;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  position: fixed;
  top: var(--navbar-h);
  left: var(--sidebar-w);
  transform: none;
  width: calc(100vw - var(--sidebar-w));
  height: calc(100vh - var(--navbar-h));
  overflow-y: auto;
  overflow-x: hidden;
  padding-top: 0;
  box-sizing: border-box;
  z-index: 100;
  scrollbar-width: thin;
  scrollbar-color: #0080cc transparent;
}
#sbt-creator-content::-webkit-scrollbar { width: 6px; }
#sbt-creator-content::-webkit-scrollbar-track { background: transparent; }
#sbt-creator-content::-webkit-scrollbar-thumb { background: #0080cc; border-radius: 3px; }
#airtrust-content::-webkit-scrollbar { width: 6px; }
#airtrust-content::-webkit-scrollbar-track { background: transparent; }
#airtrust-content::-webkit-scrollbar-thumb { background: #0080cc; border-radius: 3px; }
#sbt-creator-content.open { display: flex; }

/* HEADER */
.sbtc-header {
  width: 100%;
  max-width: clamp(700px, 80vw, 1020px);
  text-align: center;
  margin-bottom: calc(clamp(24px, 3vw, 42px) - 2.84vw);
  padding: clamp(28px, 4vw, 52px) clamp(14px, 2vw, 28px) clamp(24px, 3.5vw, 44px);
  position: relative;
  overflow: hidden;
}

/* Radial halo glow behind the SBT Creator header */
.sbtc-header::before {
  content: '';
  position: absolute;

  top: 0;
  left: 50%;

  transform: translateX(-50%);

  width: 420px;
  height: 220px;

  background: radial-gradient(
    circle,
    rgba(0,164,251,.16) 0%,
    rgba(0,164,251,.08) 35%,
    transparent 75%
  );

  pointer-events: none;
  z-index: -1;
}

/* Decorative horizontal gradient line at the bottom of the header */
.sbtc-header::after {
  content: '';
  position: absolute;
  bottom: 1.89vw;
  left: 50%;
  transform: translateX(-50%);
  width: 65%;
  height: 1px;
  background: linear-gradient(
    90deg,
    transparent,
    rgba(0,153,243,.2),
    rgba(0,210,240,.8),
    rgba(0,153,243,.2),
    transparent
  );
}
.sbtc-header-eyebrow {
  font-family:'Orbitron', monospace;
  font-size: var(--fs-xs);
  font-weight:700;
  letter-spacing:8px;
  text-transform:uppercase;
  color:#47d9ff;
  opacity:.8;
  margin-bottom: clamp(-16px, -1.5vw, -10px);
  text-shadow: 0 0 8px rgba(0,200,235,.35);
}
.sbtc-header-title {

  font-family:'Orbitron', monospace;

  font-size:clamp(34px,6vw,60px);
  font-weight:900;
  margin-top: -50px;
  margin-bottom: -5px !important;

  letter-spacing:12px;
  text-transform:uppercase;

  background: linear-gradient(
    135deg,
    #0099d4 0%,
    #6be5ff 45%,
    #00d4f0 75%,
    #0099d4 100%
  );

  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
  background-clip:text;

  filter:
    drop-shadow(0 0 10px rgba(0,164,251,.25))
    drop-shadow(0 0 25px rgba(0,164,251,.18));

  line-height:1;
  margin-bottom:16px;
}
.sbtc-header-sub {
  font-family:'Nunito',sans-serif;
  font-size: var(--fs-sm);
  font-weight:600;
  letter-spacing:13px;
  text-transform:uppercase;
  color:rgba(180,240,255,.7);
  max-width: clamp(380px, 50vw, 650px);
  margin: clamp(6px, 0.8vw, 12px) auto 0;
  line-height:1.8;
}
@media (max-width: 768px) {
  .sbtc-header-title {
    margin-top: -70px;
  }
}
  .sbtc-header-sub {
    margin-top: -80px;
  }
/* LSP7/LSP8 tabs */
.sbtc-tabs {
  display: flex;
  gap: clamp(6px, 0.8vw, 8px);
  margin-bottom: clamp(14px, 1.8vw, 20px);
  width: 100%; max-width: 1020px;
}
.sbtc-tab {
  flex: 1;
  padding: clamp(11px, 1.6vw, 16px) 0;
  background: transparent;
  border: 1.5px solid var(--border);
  border-radius: 6px;
  color: #555;
  font-family: 'Nunito', sans-serif;
  font-size: clamp(9px, 1vw, 11px); font-weight: 700;
  letter-spacing: 2px; text-transform: uppercase;
  cursor: pointer;
  transition: all 0.2s;
}
.sbtc-tab.active {
  background: rgba(0,140,225,0.15);
  border-color: #0080cc;
  color: #00d4f0;
}
.sbtc-tab:hover:not(.active) {
  border-color: rgba(0,140,225,0.4);
  color: #666;
}

/* main grid */
.sbtc-grid {
  display: grid;
  grid-template-columns: 1.4fr 1fr;
  gap: clamp(14px, 1.8vw, 20px);
  width: 100%; max-width: 1020px;
  align-items: stretch;
}
@media (max-width: 700px) {
  .sbtc-grid { grid-template-columns: 1fr; }
}

/* cards */
.sbtc-card {
  background: rgba(2,2,4,0.92);
  border: 2px solid var(--border);
  border-radius: 8px;
  padding: clamp(16px, 2vw, 24px) clamp(14px, 1.8vw, 22px);
  display: flex;
  flex-direction: column;
}

/* Seed Identity card — image2_1.webp watermark in the background */
#sbtc-seed-card {
  position: relative;
  background:
    linear-gradient(rgba(2,2,4,0.93), rgba(2,2,4,0.93)),
    url('image2_1.webp');
  background-size: auto, 480px;
  background-position: center, center;
  background-repeat: no-repeat, no-repeat;
}

/* form fields */
.sbtc-label {
  font-family: 'Nunito', sans-serif;
  font-size: clamp(9px, 1vw, 10px); font-weight: 700;
  letter-spacing: 2px; text-transform: uppercase;
  color: #00d4f0;
  display: block; margin-bottom: 6px;
}
.sbtc-input {
  width: 100%;
  padding: clamp(8px, 1.1vw, 10px) clamp(11px, 1.5vw, 14px);
  background: rgba(0,164,251,0.06);
  border: 1px solid rgba(0,164,251,0.25);
  border-radius: 6px;
  color: var(--text);
  font-family: 'Nunito', sans-serif;
  font-size: clamp(11px, 1.3vw, 13px);
  outline: none;
  transition: border 0.18s;
  margin-bottom: clamp(12px, 1.6vw, 16px);
}
.sbtc-input:focus { border-color: #00d4f0; }
.sbtc-input::placeholder { color: rgba(0,164,251,0.25); }
/* Hide native +/- spinners on Max Blossoms and Genesis Bloom */
#sbtc-max-supply::-webkit-inner-spin-button,
#sbtc-max-supply::-webkit-outer-spin-button,
#sbtc-init-mint::-webkit-inner-spin-button,
#sbtc-init-mint::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; }
#sbtc-max-supply, #sbtc-init-mint { appearance: textfield; -moz-appearance: textfield; }
.sbtc-input-row { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }

/* section title */

.sbtc-section-title::before {
  content: '';
  position: absolute;
  inset: -12px -23px 0px;

  background: linear-gradient(
    180deg,
    transparent,
    rgba(0,161,249,0.616),
    transparent
  );
}
.sbtc-section-title {
  display: flex;
  align-items: center;
  gap: 8px;
  justify-content: center;
  margin-top: -10px;

  font-family: 'Nunito', sans-serif;
  font-size: 12px;
  font-weight: 900;

  letter-spacing: 3px;
  text-transform: uppercase;

  color: #47d9ff;

  margin-bottom: 18px;
  padding-bottom: 12px;

  border-bottom: 1px solid rgba(0,164,251,0.25);

  text-shadow:
    0 0 8px rgba(0,164,251,0.4);

  position: relative;
}

/* hint */
.sbtc-hint {
  font-family: 'Nunito', sans-serif;
  font-size: 10px; color: #555;
  margin-top: -12px; margin-bottom: 14px;
  overflow: visible !important;
}

/* preview inner */
.sbtc-preview-inner {
  background: rgba(0,0,0,0.85);
  border: 1px solid var(--border);
  border-radius: 5px;
  padding: 18px;
  margin-bottom: 16px;
  flex: 1;
  position: relative;
}
.sbtc-preview-inner::before {
  content: '';
  position: absolute;
  inset: 0;
  background: url('LSP8.webp') center/cover no-repeat;
  opacity: 0.12;
  border-radius: 5px;
  z-index: 0;
  transition: background 0.3s;
}
.sbtc-preview-inner.lsp7::before {
  background: url('LSP7.webp') center/cover no-repeat;
}
.sbtc-preview-inner > * {
  position: relative;
  z-index: 1;
}
.sbtc-preview-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;

  background: linear-gradient(
    135deg,
    #00a8dc 0%,
    #00e0ff 50%,
    #4ae0ff 100%
  );

  color: #140600;
  font-family: 'Nunito', sans-serif;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 2px;
  text-transform: uppercase;

  padding: 5px 14px;
  border-radius: 5px;

  border: 1px solid rgba(255, 220, 120, 0.4);

  box-shadow:
    0 0 12px rgba(0,161,249,0.5),
    0 0 24px rgba(0,143,237,0.25),
    inset 0 1px 0 rgba(255,255,255,0.3);

  margin-bottom: 14px;

  position: relative;
  overflow: hidden;
}

.sbtc-preview-badge::before {
  content: '';
  position: absolute;
  inset: 0;

  background: linear-gradient(
    90deg,
    transparent,
    rgba(255,255,255,0.25),
    transparent
  );

  transform: translateX(-100%);
  animation: bloomShine 4s infinite;
}

@keyframes bloomShine {
  to {
    transform: translateX(200%);
  }
}
.sbtc-preview-name {
  font-family: 'Nunito', sans-serif;
  font-size: 18px; font-weight: 900;
  color: var(--accent2); letter-spacing: 1px;
  margin-bottom: 4px; min-height: 26px;
}
.sbtc-preview-symbol {
  font-family: 'Nunito', sans-serif;
  font-size: 12px; color: #00a8dc;
  letter-spacing: 3px; text-transform: uppercase;
  margin-bottom: 14px; min-height: 18px;
}
.sbtc-preview-row {
  display: flex; justify-content: space-between; align-items: center;
  padding: 7px 0;
  border-top: 1px solid var(--border);
  font-family: 'Nunito', sans-serif; font-size: 11px;
}
.sbtc-preview-row-label { color: #555; }
.sbtc-preview-row-val   { color: var(--text); font-weight: 600; }
.sbtc-owner-preview { font-size: 10px; word-break: break-all; max-width: 160px; text-align: right; }

/* deploy button */
.sbtc-deploy-btn {
  width: 100%;
  position: relative;
  overflow: hidden;

  padding: 16px 22px;

  background: linear-gradient(
    135deg,
    #0099d4 0%,
    #00b8e8 25%,
    #00e5ff 55%,
    #00b8e8 80%,
    #0099d4 100%
  );

  border: 1px solid rgba(255, 210, 120, 0.35);
  border-radius: 8px;

  color: #120400;

  font-family: 'Nunito', sans-serif;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: 4px;
  text-transform: uppercase;

  cursor: pointer;

  transition:
    transform .2s ease,
    box-shadow .2s ease,
    filter .2s ease;

  margin-top: 0;
  margin-bottom: 2px !important;

  box-shadow:
    0 0 15px rgba(0,152,243,.45),
    0 0 35px rgba(0,152,243,.25),
    inset 0 1px 0 rgba(255,255,255,.25);

  text-shadow:
    0 1px 0 rgba(255,255,255,.15);
}

.sbtc-deploy-btn::before {
  content: '';
  position: absolute;
  inset: 0;

  background: linear-gradient(
    90deg,
    transparent,
    rgba(255,255,255,.25),
    transparent
  );

  transform: translateX(-150%);
  animation: deployShine 4s infinite;
}

.sbtc-deploy-btn:hover {
  transform: translateY(-2px);

  box-shadow:
    0 0 25px rgba(0,164,251,.65),
    0 0 55px rgba(0,152,243,.40),
    inset 0 1px 0 rgba(255,255,255,.35);

  filter: brightness(1.08);
}

.sbtc-deploy-btn:active {
  transform: translateY(1px) scale(.99);
}

@keyframes deployShine {
  to {
    transform: translateX(200%);
  }
}
.sbtc-deploy-btn:hover:not(:disabled) { transform: translateY(-2px); opacity: 0.9; }
.sbtc-deploy-btn:disabled { opacity: 0.45; cursor: not-allowed; }

/* status bar */
.sbtc-status {
  display: none;
}
.sbtc-status.visible {
  display: block;
  position: fixed;
  top: 50%; left: 50%;
  transform: translate(-50%, -50%);
  z-index: 9999;
  min-width: min(300px, 90vw); max-width: 500px;
  padding: 14px 24px;
  border-radius: 8px;
  font-family: 'Orbitron', monospace;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 1.5px;
  text-align: center;
  pointer-events: none;
}
.sbtc-status.pending { background: linear-gradient(135deg, #00b8e8 0%, #00e0ff 40%, #0099d4 100%); border: 2px solid #000000; color: #000; box-shadow: 0 0 40px rgba(0,164,251,0.5); }
.sbtc-status.success { background: linear-gradient(135deg, #00b8e8 0%, #00e0ff 40%, #0099d4 100%); border: 2px solid #000000; color: #000; box-shadow: 0 0 40px rgba(0,164,251,0.5); }
.sbtc-status.error   { background: #cc0000; border: none; color: #ffffff; font-weight: 700; box-shadow: 0 0 40px rgba(200,0,0,0.6); }

/* result card */
.sbtc-result {
  display: none;
  position: fixed;
  top: 50%; left: 50%;
  transform: translate(-50%, -50%);
  z-index: 10001;
  width: 90%; max-width: 520px;
  background: rgba(2,2,4,0.98);
  border: 2px solid rgba(0,255,136,0.3);
  border-radius: 12px;
  overflow: visible !important;
  padding: 28px 24px;
  box-shadow: 0 0 60px rgba(0,255,136,0.15);
}
.sbtc-result.visible { display: block; }
.sbtc-result-title {
  font-family: 'Nunito', sans-serif;
  font-size: 13px; font-weight: 900;
  letter-spacing: 2px; text-transform: uppercase;
  color: var(--green); margin-bottom: 16px;
}
.sbtc-result-row {
  display: flex; justify-content: space-between; align-items: flex-start;
  padding: 8px 0;
  border-top: 1px solid var(--border);
  font-family: 'Nunito', sans-serif; font-size: 11px;
  gap: 12px;
}
.sbtc-result-row-label { color: #555; font-weight: 700; min-width: 100px; flex-shrink: 0; }
.sbtc-result-row-val   { color: var(--text); word-break: break-all; text-align: right; }
.sbtc-result-ca {
  font-family: 'Nunito', sans-serif;
  font-size: 13px; color: var(--green); font-weight: 700;
  word-break: break-all; text-align: right;
}
.sbtc-result-links {
  display: flex; flex-wrap: wrap; gap: 8px;
  margin-top: 16px; padding-top: 14px;
  border-top: 1px solid var(--border);
}
.sbtc-result-link {
  padding: 7px 12px;
  background: rgba(0,255,136,0.06);
  border: 1px solid rgba(0,255,136,0.2);
  border-radius: 5px;
  color: var(--green);
  font-family: 'Nunito', sans-serif;
  font-size: 10px; font-weight: 700;
  text-decoration: none;
  transition: all 0.18s;
}
.sbtc-result-link:hover { background: rgba(0,255,136,0.12); border-color: var(--green); }
.sbtc-result-manager-btn {
  display: block;
  width: 100%;
  margin-top: 12px;
  padding: 13px 20px;
  background: linear-gradient(135deg, #00b8e8 0%, #00e0ff 40%, #0099d4 100%);
  border: none; border-radius: 6px;
  color: #000;
  font-family: var(--display);
  font-size: 11px; font-weight: 700;
  letter-spacing: 2px; text-transform: uppercase;
  text-align: center; text-decoration: none;
  cursor: pointer;
  transition: opacity 0.2s, transform 0.2s;
}
.sbtc-result-manager-btn:hover { opacity: 0.9; transform: translateY(-2px); }

/* close button */
#sbt-creator-close-btn {
  position: absolute;
  top: -38px;
  right: 0;
  z-index: 999999;
  background: rgba(6,6,8,0.92);
  border: 1.5px solid #00d4f0;
  color: #00d4f0; font-size: 11px; font-weight: 700;
  cursor: pointer; padding: 4px 12px;
  border-radius: 6px;
  backdrop-filter: blur(8px);
  transition: all 0.2s;
  line-height: 1;
  font-family: var(--display);
  letter-spacing: 2px; text-transform: uppercase;
}
#sbt-creator-close-btn {
  transition: transform 0.1s ease, box-shadow 0.1s ease, background 0.2s ease !important;
  box-shadow:
    3px 3px 0 rgba(0,140,180,0.9),
    4px 4px 0 rgba(0,100,140,0.6),
    5px 5px 0 rgba(0,60,90,0.3) !important;
}
#sbt-creator-close-btn:hover {
  border-color: #00d4f0;
  color: var(--accent2);
  background: rgba(0,164,251,0.1);
  transform: translate(-1px, -1px) !important;
  box-shadow:
    4px 4px 0 rgba(0,180,220,0.9),
    6px 6px 0 rgba(0,140,180,0.6),
    8px 8px 0 rgba(0,80,110,0.3),
    0 0 20px rgba(0,212,240,0.3) !important;
}
#sbt-creator-close-btn:active {
  transform: translate(2px, 2px) !important;
  box-shadow: 1px 1px 0 rgba(0,140,180,0.9) !important;
  transition: transform 0.06s ease, box-shadow 0.06s ease !important;
}



/* ── NURSERY new design ───────────────────────────────────────────────── */
.sbtc-nursery-title { text-align: center; margin-bottom: 4px; }

.sbtc-type-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(9px, 1.3vw, 12px);
  width: 100%;
  margin-bottom: 0;
}
@media (max-width: 1024px) {
  .sbtc-type-row { grid-template-columns: 1fr; gap: clamp(8px, 1.1vw, 10px); }
}
.sbtc-type-card {
  display:flex;
  align-items:center;
  gap:clamp(10px, 1.4vw, 14px);

  padding:clamp(13px, 1.8vw, 18px);

  background:
    linear-gradient(
      180deg,
      rgba(20,20,25,.95),
      rgba(8,8,10,.95)
    );

  border:1px solid rgba(255,255,255,.06);
  border-radius:14px;

  cursor:pointer;

  transition:
    all .25s ease,
    transform .25s ease;

  position:relative;
  overflow:hidden;
}

.sbtc-type-card:hover{
  transform:translateY(-2px);

  border-color:rgba(0,164,251,.35);

  box-shadow:
    0 0 20px rgba(0,164,251,.12);
}

.sbtc-type-card.active{
  border-color:#00e0ff;

  background:
    linear-gradient(
      135deg,
      rgba(0,140,233,.22),
      rgba(0,188,255,.12)
    );

  box-shadow:
    0 0 15px rgba(0,164,251,.25),
    0 0 35px rgba(0,164,251,.08);
}

.sbtc-type-card.active::before{
  content:"";
  position:absolute;
  inset:0;

  background:
    radial-gradient(
      circle at top right,
      rgba(0,200,255,.15),
      transparent 50%
    );
}
.sbtc-type-icon{

  width:clamp(40px, 5vw, 52px);
  height:clamp(40px, 5vw, 52px);

  border-radius:14px;

  background:
    linear-gradient(
      135deg,
      rgba(0,146,239,.2),
      rgba(0,182,255,.1)
    );

  border:1px solid rgba(0,182,255,.15);

  display:flex;
  align-items:center;
  justify-content:center;

  font-size:22px;

  color:#47d9ff;

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.1),
    0 0 15px rgba(0,164,251,.15);
}
.sbtc-type-name{
  font-family:'Nunito',sans-serif;
  font-size:clamp(12px, 1.5vw, 14px);
  font-weight:800;

  color:#fff;

  letter-spacing:.5px;
}
.sbtc-type-sub{
  font-size:clamp(9px, 1.2vw, 11px);

  color:#b0b0b0;

  letter-spacing:1px;
}
.sbtc-toggle-row{
  display:grid;
  grid-template-columns: 1fr auto auto;
  align-items:center;
  gap:12px;
  margin-bottom: 8px;
}

.sbtc-toggle-label{
  flex:1;

  font-family:'Nunito',sans-serif;
  font-size:12px;
  font-weight:500;
  margin-bottom: 8px;

  color:var(--text);
}
.sbtc-live-badge{

  font-family:'Nunito',sans-serif;

  font-size:9px;
  font-weight:800;

  color:#6be5ff;

  letter-spacing:1.5px;

  padding:4px 10px;

  border-radius:999px;

  background:
    rgba(0,188,255,.12);

  border:
    1px solid rgba(0,188,255,.25);

  box-shadow:
    0 0 10px rgba(0,188,255,.15);
}

/* deploy button upgrade */
.sbtc-deploy-btn {
  background: linear-gradient(135deg, #0090cc 0%, #00e0ff 50%, #0090cc 100%) !important;
  background-size: 200% auto !important;
  font-size: 13px !important; letter-spacing: 4px !important;
  padding: 10px 20px !important;
  box-shadow: 0 4px 24px rgba(0,140,225,0.4);
  transition: all 0.3s !important;
}
.sbtc-deploy-btn:hover:not(:disabled) {
  background-position: right center !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 8px 36px rgba(0,140,225,0.6) !important;
}

/* section title flex */
.sbtc-section-title {
  display: flex !important;
  align-items: center !important;
}

@media (max-width: 1024px) {
  .sbtc-header { padding: clamp(20px, 3vw, 28px) clamp(12px, 2vw, 16px) clamp(18px, 2.6vw, 24px); }
  .sbtc-toggle-row { flex-direction: column; align-items: flex-start; gap: clamp(8px, 1.1vw, 10px); }
}

/* ═══════════════════════════════════════════════════════
   GARDEN-STYLE ANIMATIONS & HALO EFFECTS
   ═══════════════════════════════════════════════════════ */

/* ── Keyframes ──────────────────────────────────────────────── */
@keyframes pulse-glow-orange {
  0%, 100% { box-shadow: 0 0 10px rgba(255,77,0,0.15), 0 0 30px rgba(255,40,0,0.08); }
  50%       { box-shadow: 0 0 20px rgba(255,77,0,0.3),  0 0 50px rgba(255,40,0,0.15); }
}
@keyframes pulse-glow-cyan {
  0%, 100% { text-shadow: 0 0 10px rgba(0,229,255,0.5), 0 0 25px rgba(0,180,255,0.2); }
  50%       { text-shadow: 0 0 20px rgba(0,229,255,0.9), 0 0 50px rgba(0,180,255,0.4); }
}
@keyframes pulse-glow-gold {
  0%, 100% { text-shadow: 0 0 12px rgba(255,215,0,0.5), 0 0 30px rgba(255,150,0,0.2); }
  50%       { text-shadow: 0 0 24px rgba(255,215,0,0.9), 0 0 60px rgba(255,150,0,0.4); }
}
@keyframes pulse-glow-orange-text {
  0%, 100% { text-shadow: 0 0 8px rgba(255,140,0,0.7), 0 0 20px rgba(255,77,0,0.35), 0 0 40px rgba(255,40,0,0.15); }
  50%       { text-shadow: 0 0 16px rgba(255,160,0,0.9), 0 0 40px rgba(255,100,0,0.5), 0 0 70px rgba(255,60,0,0.25); }
}
@keyframes border-flow {
  0%   { background-position: 0% 50%; }
  50%  { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}
@keyframes shimmer {
  0%   { left: -100%; }
  100% { left: 200%; }
}

/* ── Nursery section titles (Seed Identity / Bloom Preview) ──────────────
   Distinctive cyan scan-shimmer animation, separate from the generic
   pulse-glow-cyan used elsewhere. The text itself softly breathes while a
   bright cyan sweep glides across underneath it on a loop. ── */
@keyframes sbtc-title-breathe {
  0%, 100% { text-shadow: 0 0 6px rgba(0,229,255,0.45), 0 0 16px rgba(0,180,255,0.18); letter-spacing: 3px; }
  50%      { text-shadow: 0 0 14px rgba(0,229,255,0.85), 0 0 34px rgba(0,180,255,0.4); letter-spacing: 3.6px; }
}
@keyframes sbtc-title-sweep {
  0%   { transform: translateX(-130%); opacity: 0; }
  8%   { opacity: 1; }
  45%  { opacity: 1; }
  55%  { opacity: 0; }
  100% { transform: translateX(130%); opacity: 0; }
}
#sbtc-form-title,
#sbtc-preview-title {
  animation: sbtc-title-breathe 2.6s ease-in-out infinite;
  position: relative;
}
/* Remove the generic blue background band on these two titles */
#sbtc-form-title::before,
#sbtc-preview-title::before {
  display: none !important;
}
#sbtc-form-title::after,
#sbtc-preview-title::after {
  content: '';
  position: absolute;
  top: -2px; bottom: 10px; left: 0;
  width: 40%;
  background: linear-gradient(90deg, transparent, rgba(120,235,255,0.55), transparent);
  filter: blur(2px);
  pointer-events: none;
  z-index: 1;
  animation: sbtc-title-sweep 3.4s ease-in-out infinite;
}
#sbtc-preview-title::after { animation-delay: 1.1s; }

/* ── Sidebar — subtle glow border ─────────────────────────── */
.sidebar {
  box-shadow: 6px 0 40px rgba(255,40,0,0.08), inset -1px 0 0 rgba(255,77,0,0.12) !important;
}

/* ── Sidebar PHLAME holdings widget ───────────────────────────
   Distinct from the navbar/mobile pill: vertical, sober, blends
   into the sidebar's stat-block rhythm (ENGINE STATUS, AIRTRUST
   SENT, etc.) instead of the orange-gradient navbar treatment. */
.sidebar-phlame-widget {
  margin-top: 18px;
  padding-top: 14px;
  border-top: 1px solid rgba(255,140,0,0.22);
}
.sidebar-phlame-header {
  display: flex;
  align-items: center;
  gap: 8px;
  cursor: pointer;
  user-select: none;
}
.sidebar-phlame-icon {
  width: clamp(18px, 1.8vw, 22px);
  height: clamp(18px, 1.8vw, 22px);
  border-radius: 50%;
  object-fit: cover;
  flex-shrink: 0;
  border: 1px solid rgba(255,140,0,0.45);
  box-shadow: 0 0 6px rgba(255,140,0,0.25);
}
.sidebar-phlame-label {
  font-family: 'Nunito';
  font-size: clamp(11px, 1.3vw, 14px);
  color: #ff8c00;
  font-weight: 700;
  letter-spacing: 1px;
  text-transform: uppercase;
}
.sidebar-phlame-content {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-top: 10px;
  max-height: 80px;
  opacity: 1;
  overflow: hidden;
  transition: max-height 0.25s ease, opacity 0.2s ease, margin-top 0.25s ease;
}
.sidebar-phlame-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.sidebar-phlame-sublabel {
  font-family: 'Nunito';
  font-size: clamp(8px, 1vw, 10px);
  color: #9e9e9e;
  letter-spacing: 1px;
  text-transform: uppercase;
}
.sidebar-phlame-value {
  font-family: var(--mono);
  font-size: clamp(11px, 1.3vw, 14px);
  font-weight: 700;
  color: var(--green);
  letter-spacing: 0.5px;
}
#sidebar-phlame-info.is-connected { display: block !important; }



/* ══════════════════════════════════════════════════════════════
   SIDEBAR — BLUR PREMIUM DEV++
   ══════════════════════════════════════════════════════════════ */

/* ── Keyframes ─────────────────────────────────────────────── */
@keyframes sb-pulse-dot {
  0%, 100% { box-shadow: 0 0 4px #ff8c00, 0 0 8px rgba(255,140,0,0.4); opacity: 1; }
  50%       { box-shadow: 0 0 8px #ffb800, 0 0 18px rgba(255,184,0,0.6); opacity: 0.6; }
}
@keyframes sb-scan-line {
  0%   { top: 0%; opacity: 0; }
  10%  { opacity: 0.5; }
  90%  { opacity: 0.5; }
  100% { top: 100%; opacity: 0; }
}
@keyframes sb-value-flicker {
  0%, 97%, 100% { opacity: 1; }
  98%            { opacity: 0.4; }
  99%            { opacity: 1; }
}
@keyframes sb-glow-breathe {
  0%, 100% { box-shadow: 0 0 0 1px rgba(255,140,0,0.08), inset 0 0 12px rgba(255,100,0,0.04); }
  50%       { box-shadow: 0 0 0 1px rgba(255,140,0,0.18), inset 0 0 20px rgba(255,100,0,0.08); }
}
@keyframes sb-border-flow {
  0%   { background-position: 0% 50%; }
  100% { background-position: 200% 50%; }
}
@keyframes sb-icon-spin-slow {
  0%   { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

/* ── Sidebar background ────────────────────────────────────── */
.sidebar {
  background:
    linear-gradient(180deg,
      rgba(8,4,0,0.88) 0%,
      rgba(4,2,0,0.90) 60%,
      rgba(6,3,0,0.89) 100%) !important;
  backdrop-filter: blur(24px) saturate(1.4) !important;
  -webkit-backdrop-filter: blur(24px) saturate(1.4) !important;
  border-right: 1px solid rgba(255,140,0,0.12) !important;
  overflow: hidden !important;
}
/* Scan line animation on sidebar */
.sidebar::after {
  content: '';
  position: absolute;
  left: 0; right: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(255,140,0,0.18), rgba(255,184,0,0.3), rgba(255,140,0,0.18), transparent);
  top: 0;
  animation: sb-scan-line 8s linear infinite;
  pointer-events: none;
  z-index: 10;
}

/* ── 3D BUTTON stat blocks ─────────────────────────────────── */
.sb-stat-block {
  margin-top: -14px;
  padding: 18px 14px 22px;
  border-radius: 10px;
  position: relative;
  overflow: visible;
  cursor: default;
  text-align: center;
  transform-origin: center top;
  z-index: 1;

  /* Face gradient — volcanic burgundy */
  background: linear-gradient(155deg,
    rgba(45,8,4,0.97) 0%,
    rgba(28,4,2,0.99) 45%,
    rgba(18,2,0,1)    75%,
    rgba(38,6,2,0.98) 100%);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);

  /* Bevel borders: top/left bright, bottom/right dark */
  border-top:    1.5px solid rgba(255,210,80,0.55);
  border-left:   1px   solid rgba(255,160,40,0.30);
  border-right:  1px   solid rgba(40,15,0,0.90);
  border-bottom: 2px   solid rgba(20,7,0,1);

  /* Deep extrusion: thick slab shadow + glow */
  box-shadow:
    /* === extrusion slab (8px deep) === */
    0  2px 0   rgba(80,28,0,0.95),
    0  4px 0   rgba(60,18,0,0.95),
    0  6px 0   rgba(40,12,0,0.97),
    0  8px 0   rgba(22,7,0,1),
    /* === umbra under the slab === */
    0  9px  2px rgba(0,0,0,0.85),
    0 14px 20px rgba(0,0,0,0.55),
    /* === ambient orange glow === */
    0 18px 36px rgba(180,60,0,0.08),
    /* === inner face lighting === */
    inset 0  2px  4px rgba(255,210,100,0.16),
    inset 0  1px  0   rgba(255,230,120,0.22),
    inset 0 -2px  4px rgba(0,0,0,0.60),
    inset 2px 0   6px rgba(255,180,60,0.06),
    inset -2px 0  6px rgba(0,0,0,0.30);

  transition: transform 0.18s cubic-bezier(0.34,1.56,0.64,1), box-shadow 0.18s ease, border-color 0.2s ease, z-index 0s;
  animation: sb-glow-breathe 5s ease-in-out infinite;
}

/* Top-face gloss sheen */
.sb-stat-block::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 45%;
  background: linear-gradient(180deg,
    rgba(255,220,120,0.11) 0%,
    rgba(255,180,60,0.04)  50%,
    transparent            100%);
  border-radius: 9px 9px 0 0;
  pointer-events: none;
  z-index: 1;
}

/* Shimmer sweep on hover */
.sb-stat-block::after {
  content: '';
  position: absolute;
  top: 0; bottom: 0;
  width: 55%;
  background: linear-gradient(90deg,
    transparent,
    rgba(255,200,80,0.10),
    transparent);
  left: -80%;
  transition: left 0.6s ease;
  pointer-events: none;
  z-index: 2;
}

@keyframes sb-glitch {
  0%        { transform: translateY(-4px) translateX(0);    clip-path: none; }
  10%       { transform: translateY(-4px) translateX(-3px); clip-path: inset(10% 0 80% 0); }
  20%       { transform: translateY(-4px) translateX(3px);  clip-path: inset(60% 0 20% 0); }
  30%       { transform: translateY(-4px) translateX(-2px); clip-path: inset(30% 0 50% 0); }
  40%, 100% { transform: translateY(-4px) translateX(0);    clip-path: none; }
}
@keyframes sb-border-pulse {
  0%, 100% { border-top-color: rgba(255,230,100,0.80); box-shadow: 0 2px 0 rgba(80,28,0,0.95), 0 4px 0 rgba(60,18,0,0.95), 0 6px 0 rgba(40,12,0,0.97), 0 8px 0 rgba(22,7,0,1), 0 9px 3px rgba(0,0,0,0.85), 0 18px 28px rgba(0,0,0,0.50), 0 22px 44px rgba(220,90,0,0.15), inset 0 2px 5px rgba(255,220,120,0.22), inset 0 1px 0 rgba(255,240,140,0.30), inset 0 -2px 4px rgba(0,0,0,0.55), inset 2px 0 8px rgba(255,200,80,0.08), inset -2px 0 6px rgba(0,0,0,0.25); }
  50%       { border-top-color: rgba(255,255,160,1.00); box-shadow: 0 2px 0 rgba(80,28,0,0.95), 0 4px 0 rgba(60,18,0,0.95), 0 6px 0 rgba(40,12,0,0.97), 0 8px 0 rgba(22,7,0,1), 0 9px 3px rgba(0,0,0,0.85), 0 18px 28px rgba(0,0,0,0.50), 0 0 28px rgba(255,180,0,0.55), 0 0 55px rgba(255,100,0,0.25), inset 0 2px 5px rgba(255,220,120,0.22), inset 0 1px 0 rgba(255,240,140,0.30), inset 0 -2px 4px rgba(0,0,0,0.55), inset 2px 0 8px rgba(255,200,80,0.08), inset -2px 0 6px rgba(0,0,0,0.25); }
}
@keyframes sb-scanline {
  0%   { top: 100%; opacity: 0.7; }
  100% { top: -20%;  opacity: 0;   }
}
.sb-stat-block:hover {
  transform: translateY(-4px) scaleX(1.06);
  z-index: 10;
  border-left-color: rgba(255,180,60,0.45);
  animation: sb-glow-breathe 5s ease-in-out infinite, sb-border-pulse 1.2s ease-in-out infinite;
}
.sb-stat-block:hover::before {
  content: '';
  position: absolute;
  left: 0; right: 0;
  height: 30%;
  background: linear-gradient(180deg,
    transparent 0%,
    rgba(255,210,80,0.13) 50%,
    transparent 100%);
  border-radius: 9px;
  pointer-events: none;
  z-index: 3;
  animation: sb-scanline 1.1s linear infinite;
}
.sb-stat-block:hover::after {
  left: 140%;
}

/* Pressed — slab compresses */
.sb-stat-block:active {
  transform: translateY(6px);
  box-shadow:
    0 1px 0 rgba(80,28,0,0.95),
    0 2px 0 rgba(40,12,0,0.97),
    0 3px 6px rgba(0,0,0,0.70),
    inset 0 2px 6px rgba(0,0,0,0.50),
    inset 0 1px 0 rgba(0,0,0,0.40);
  border-top-color: rgba(255,180,60,0.30);
}

/* ── Label ─────────────────────────────────────────────────── */
.sb-stat-label {
  font-family: 'Nunito', sans-serif;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 3px;
  text-transform: uppercase;
  color: #ff6a00;
  margin-bottom: 9px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  white-space: nowrap;
  width: 100%;
}
.sb-stat-label::before {
  display: none;
}

/* Alternating offset — even cards shifted to the right */
.sb-stat-block:nth-child(even) {
  transform-origin: center top;
  margin-left: 5px;
  margin-right: -5px;
}
.sb-stat-block:nth-child(odd) {
  margin-left: -5px;
  margin-right: 5px;
}

/* AIRTRUST SENT, $PHLAME TOKEN and PHLOX ACTIVE LP live inside a separate
   #sidebar-phlame-info wrapper, which resets the nth-child count and breaks
   the intended left/right alternation. Force the correct sides explicitly. */
.sb-stat-block:has(#airtrust-sent) {
  margin-left: -5px !important;
  margin-right: 5px !important;
}
#sidebar-phlame-info .sb-stat-block:nth-of-type(1) {
  margin-left: 5px !important;
  margin-right: -5px !important;
}
#sidebar-phlame-info .sb-stat-block:nth-of-type(2) {
  margin-left: -5px !important;
  margin-right: 5px !important;
}

/* ── Value ────────────────────────────────────────────────── */
.sb-stat-value {
  font-family: 'Orbitron', sans-serif;
  font-size: 22px;
  font-weight: 400;
  letter-spacing: 2px;
  color: var(--green);
  line-height: 1;
  text-shadow:
    0 0 10px rgba(0,229,176,0.45),
    0 0 26px rgba(0,229,176,0.18);
  animation: sb-value-flicker 9s ease-in-out infinite;
  display: block;
  width: 100%;
  text-align: center;
}

/* ── Value + icon row ($PHLAME) ────────────────────────────── */
.sb-stat-value-row {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  width: 100%;
}
.sb-stat-icon {
  width: 22px;
  height: 22px;
  border-radius: 50%;
  object-fit: cover;
  flex-shrink: 0;
  border: 1px solid rgba(255,140,0,0.35);
  box-shadow: 0 0 8px rgba(255,140,0,0.2);
  animation: sb-icon-spin-slow 18s linear infinite;
}
.sb-stat-value-row .sb-stat-value {
  width: auto;
  text-align: left;
}

/* ── Sidebar title glow ────────────────────────────────────── */
.sidebar-title {
  text-shadow:
    0 0 8px rgba(255,140,0,0.7),
    0 0 20px rgba(255,77,0,0.35),
    0 0 40px rgba(255,40,0,0.15) !important;
}

/* ── AirTrust sections — widget-style redesign ─────────────── */
.airtrust-section {
  background-color: rgba(6,6,10,0.92);
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
  border: 1px solid rgba(255,77,0,0.3) !important;
  border-radius: 12px !important;
  box-shadow:
    0 0 0 1px rgba(255,40,0,0.06),
    0 0 16px rgba(255,60,0,0.1),
    0 4px 24px rgba(0,0,0,0.7),
    inset 0 1px 0 rgba(255,140,0,0.08),
    inset 0 -1px 0 rgba(0,0,0,0.5) !important;
  position: relative;
  overflow: visible;
  transition: border-color 0.3s, box-shadow 0.3s !important;
  animation: pulse-glow-orange 4s ease-in-out infinite;
}
.airtrust-section::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(255,140,0,0.4), transparent);
  pointer-events: none;
}
.airtrust-section:hover {
  border-color: rgba(255,140,0,0.5) !important;
  box-shadow:
    0 0 0 1px rgba(255,100,0,0.12),
    0 0 24px rgba(255,80,0,0.18),
    0 6px 32px rgba(0,0,0,0.8),
    inset 0 1px 0 rgba(255,180,0,0.12),
    inset 0 -1px 0 rgba(0,0,0,0.5) !important;
}

/* ── Premium contour — animated gradient ring around the AirTrust panels (border only) ── */
#assets-held-section,
#bloomboard-section {
  border: 1px solid transparent !important;
}
#assets-held-section::after,
#bloomboard-section::after {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: inherit;
  padding: 1px;
  background: linear-gradient(125deg,
    rgba(255,77,0,0.25) 0%,
    rgba(255,200,80,1) 22%,
    rgba(255,77,0,0.25) 45%,
    rgba(255,77,0,0.25) 55%,
    rgba(255,150,0,0.9) 78%,
    rgba(255,77,0,0.25) 100%);
  background-size: 240% 100%;
  mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  pointer-events: none;
  z-index: 2;
  animation: at-contour-flow 6s linear infinite;
}
@keyframes at-contour-flow {
  0%   { background-position: 0% 50%; }
  100% { background-position: 200% 50%; }
}

/* ── AirTrust section titles — glitch-glow ─────────────────── */
.airtrust-section-title {
  text-shadow:
    0 0 8px rgba(255,140,0,0.7),
    0 0 20px rgba(255,77,0,0.35),
    0 0 40px rgba(255,40,0,0.15) !important;
  letter-spacing: 3px !important;
  animation: pulse-glow-orange-text 3s ease-in-out infinite;
}

/* ── AirTrust items — hover glow ───────────────────────────── */
.airtrust-item {
  transition: transform 0.1s ease, box-shadow 0.1s ease, border-color 0.18s !important;
  box-shadow:
    3px 3px 0 rgba(180,40,0,0.8),
    4px 4px 0 rgba(140,20,0,0.5),
    5px 5px 0 rgba(100,10,0,0.25) !important;
}
.airtrust-item:hover {
  border-color: rgba(210,165,0,0.85) !important;
  transform: translate(-1px, -1px) !important;
  box-shadow:
    4px 4px 0 rgba(200,60,0,0.9),
    6px 6px 0 rgba(160,30,0,0.6),
    8px 8px 0 rgba(120,10,0,0.3),
    0 0 14px rgba(255,100,0,0.2) !important;
}
.airtrust-item:active {
  transform: translate(2px, 2px) !important;
  box-shadow: 1px 1px 0 rgba(180,40,0,0.9) !important;
  transition: transform 0.06s ease, box-shadow 0.06s ease !important;
}

/* ── token / asset / NFT drop items ──────────────────────── */
.token-drop-item {
  transition: transform 0.1s ease, box-shadow 0.1s ease, border-color 0.18s !important;
  box-shadow:
    3px 3px 0 rgba(180,40,0,0.7),
    4px 4px 0 rgba(140,20,0,0.45),
    5px 5px 0 rgba(100,10,0,0.2) !important;
}
.token-drop-item:hover {
  transform: translate(-1px, -1px) !important;
  box-shadow:
    4px 4px 0 rgba(200,60,0,0.9),
    6px 6px 0 rgba(160,30,0,0.6),
    8px 8px 0 rgba(120,10,0,0.3),
    0 0 12px rgba(255,100,0,0.2) !important;
}
.token-drop-item:active {
  transform: translate(2px, 2px) !important;
  box-shadow: 1px 1px 0 rgba(180,40,0,0.9) !important;
  transition: transform 0.06s ease, box-shadow 0.06s ease !important;
}

/* ── AIRTRUST THEM buttons ────────────────────────────────── */
#airtrust-them-lsp7,
#airtrust-them-lsp7asset,
#airtrust-them-lsp8 {
  box-shadow:
    5px 5px 0 rgba(160,30,0,0.95),
    7px 7px 0 rgba(120,15,0,0.65),
    9px 9px 0 rgba(80,5,0,0.35),
    0 4px 20px rgba(255,77,0,0.4) !important;
  transition: transform 0.1s ease, box-shadow 0.1s ease !important;
}
#airtrust-them-lsp7:hover,
#airtrust-them-lsp7asset:hover,
#airtrust-them-lsp8:hover {
  transform: translate(-2px, -2px) translateY(-2px) !important;
  box-shadow:
    7px 7px 0 rgba(180,50,0,0.95),
    10px 10px 0 rgba(140,20,0,0.65),
    13px 13px 0 rgba(90,5,0,0.35),
    0 8px 32px rgba(255,77,0,0.6) !important;
}
#airtrust-them-lsp7:active,
#airtrust-them-lsp7asset:active,
#airtrust-them-lsp8:active {
  transform: translate(3px, 3px) !important;
  box-shadow:
    1px 1px 0 rgba(160,30,0,0.9),
    0 2px 8px rgba(255,77,0,0.3) !important;
  transition: transform 0.06s ease, box-shadow 0.06s ease !important;
}

/* ── Panels (airtrust-section) full extrusion ─────────────── */
.airtrust-section {
  box-shadow:
    6px 6px 0 rgba(160,30,0,0.7),
    9px 9px 0 rgba(120,15,0,0.45),
    12px 12px 0 rgba(80,5,0,0.22),
    0 0 0 1px rgba(255,40,0,0.06),
    0 0 16px rgba(255,60,0,0.1),
    0 4px 24px rgba(0,0,0,0.7),
    inset 0 1px 0 rgba(255,140,0,0.08),
    inset 0 -1px 0 rgba(0,0,0,0.5) !important;
  transition: transform 0.15s ease, box-shadow 0.15s ease, border-color 0.3s !important;
}
.airtrust-section:hover {
  border-color: rgba(255,140,0,0.5) !important;
  transform: translate(-2px, -2px) !important;
  box-shadow:
    8px 8px 0 rgba(180,50,0,0.8),
    12px 12px 0 rgba(140,20,0,0.5),
    16px 16px 0 rgba(90,5,0,0.25),
    0 0 0 1px rgba(255,100,0,0.12),
    0 0 24px rgba(255,80,0,0.18),
    0 6px 32px rgba(0,0,0,0.8),
    inset 0 1px 0 rgba(255,180,0,0.12),
    inset 0 -1px 0 rgba(0,0,0,0.5) !important;
}

/* ── AirTrust item profile pictures — orange halo ──────────── */
.airtrust-pfp {
  box-shadow: 0 0 8px rgba(255,77,0,0.3) !important;
  transition: box-shadow 0.2s !important;
}
.airtrust-item:hover .airtrust-pfp {
  box-shadow: 0 0 14px rgba(255,120,0,0.5) !important;
}

/* ── BloomScore dropdown — glow ────────────────────────────── */
#bloom-score-dropdown {
  box-shadow: 0 8px 32px rgba(0,0,0,0.6), 0 0 24px rgba(255,77,0,0.12) !important;
}
#bsd-score-title {
  animation: pulse-glow-orange-text 3s ease-in-out infinite;
}

/* ── Claim / deploy button — shimmer + animated gradient ────── */
.reward-claim-btn,
#airtrust-btn,
.airtrust-tab-btn.active {
  background: linear-gradient(135deg, #ff6600, #ffaa00, #ff6600) !important;
  background-size: 200% 100% !important;
  animation: border-flow 3s ease infinite !important;
  box-shadow:
    0 0 16px rgba(255,120,0,0.4),
    0 4px 12px rgba(0,0,0,0.4),
    inset 0 1px 0 rgba(255,200,0,0.3) !important;
  position: relative;
  overflow: hidden;
}
.reward-claim-btn::before,
#airtrust-btn::before {
  content: '';
  position: absolute;
  top: 0; bottom: 0;
  width: 40%;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,0.12), transparent);
  left: -100%;
  animation: shimmer 2.5s ease infinite;
  pointer-events: none;
}
.reward-claim-btn:hover:not(:disabled),
#airtrust-btn:hover:not(:disabled) {
  box-shadow:
    0 0 30px rgba(255,150,0,0.6),
    0 6px 20px rgba(0,0,0,0.5),
    inset 0 1px 0 rgba(255,220,0,0.4) !important;
  transform: translateY(-2px) !important;
}

/* ── SBT slide-to-plant fill bar — animated gradient ───────── */
#sbtc-slide-fill {
  background: linear-gradient(90deg, #0055cc, #0099d4, #00e0ff, #00ff88) !important;
  background-size: 200% 100% !important;
  animation: border-flow 3s ease infinite !important;
  box-shadow: 0 0 8px rgba(0,180,255,0.4) !important;
}

/* ── Connected dot — already blinks, add glow boost ────────── */
#connected-dot.is-connected {
  box-shadow: 0 0 10px var(--green), 0 0 20px rgba(0,255,136,0.3) !important;
}

/* ── Navbar box-shadow boost ────────────────────────────────── */
.navbar {
  box-shadow:
    0 2px 16px rgba(255,77,0,0.45),
    0 0 40px rgba(255,40,0,0.1),
    0 1px 0 rgba(255,255,255,0.18) inset,
    0 -6px 18px rgba(0,0,0,0.25) inset !important;
}
/* ── Main cards hover effects ───────────────────────────────── */
@keyframes card-shimmer {
  0%   { left: -100%; }
  100% { left: 200%; }
}
@keyframes card-glow-pulse {
  0%, 100% {
    box-shadow:
      0 0 0 1px rgba(255,40,0,0.06),
      0 0 16px rgba(255,60,0,0.1),
      0 4px 24px rgba(0,0,0,0.7),
      inset 0 1px 0 rgba(255,140,0,0.08);
  }
  50% {
    box-shadow:
      0 0 0 1px rgba(255,80,0,0.12),
      0 0 30px rgba(255,77,0,0.2),
      0 8px 40px rgba(0,0,0,0.8),
      inset 0 1px 0 rgba(255,180,0,0.14);
  }
}

.sb-card {
  position: relative;
  overflow: hidden;
  transition:
    border-color 0.35s ease,
    box-shadow 0.35s ease,
    transform 0.35s ease,
    background 0.35s ease !important;
  cursor: default;
}

/* Top-edge highlight line */
.sb-card::before {
  content: '';
  position: absolute;
  top: 0; left: 10%; right: 10%;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(255,120,0,0.9) 30%, rgba(0,220,255,0.7) 70%, transparent);
  opacity: 0.55;
  animation: card-ambient-pulse 3s ease-in-out infinite;
  transition: opacity 0.35s ease, left 0.35s ease, right 0.35s ease;
  pointer-events: none;
  z-index: 2;
  filter: blur(0.4px);
}

/* Shimmer sweep on hover */
.sb-card::after {
  content: '';
  position: absolute;
  left: 0; right: 0;
  height: 30%;
  background: linear-gradient(180deg, transparent, rgba(255,180,0,0.03), rgba(0,220,255,0.02), transparent);
  top: -30%;
  animation: card-scanline 7s linear infinite;
  pointer-events: none;
  z-index: 1;
  transition: none;
}

.sb-card:hover {
  border-color: rgba(255,140,0,0.55) !important;
  background: linear-gradient(145deg, rgba(14,11,8,0.93), rgba(10,8,5,0.97)) !important;
  transform: translateY(-4px);
  box-shadow:
    0 0 0 1px rgba(255,100,0,0.14),
    0 0 28px rgba(255,90,0,0.22),
    0 0 60px rgba(255,40,0,0.10),
    0 12px 40px rgba(0,0,0,0.85),
    inset 0 1px 0 rgba(255,200,0,0.14),
    inset 0 -1px 0 rgba(0,0,0,0.6) !important;
}

.sb-card:hover::before {
  opacity: 1;
  left: 4%; right: 4%;
  filter: blur(1px);
}

.sb-card:hover::after {
  animation: card-shimmer 1s ease forwards;
}

.sb-card img { transition: transform 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94); }
.sb-card:hover img { transform: scale(1.08); }

/* Card title glow on hover */
.sb-card:hover [style*="font-size:15px"] {
  text-shadow:
    0 0 10px rgba(255,140,0,0.8),
    0 0 25px rgba(255,77,0,0.4) !important;
}

/* Card 2 (SoulBloom Creation) hover — cyan theme */
.cards-grid .sb-card:nth-child(2)::before {
  background: linear-gradient(90deg, transparent, rgba(0,229,255,0.5), transparent);
}
.cards-grid .sb-card:nth-child(2)::after {
  background: linear-gradient(90deg, transparent, rgba(0,200,255,0.07), transparent);
}
.cards-grid .sb-card:nth-child(2):hover {
  border-color: rgba(0,229,255,0.55) !important;
  background: linear-gradient(145deg, rgba(8,12,14,0.93), rgba(5,9,10,0.97)) !important;
  box-shadow:
    0 0 0 1px rgba(0,200,255,0.14),
    0 0 28px rgba(0,200,255,0.22),
    0 0 60px rgba(0,120,255,0.10),
    0 12px 40px rgba(0,0,0,0.85),
    inset 0 1px 0 rgba(0,229,255,0.14),
    inset 0 -1px 0 rgba(0,0,0,0.6) !important;
}
.cards-grid .sb-card:nth-child(2):hover [style*="font-size:15px"] {
  text-shadow:
    0 0 10px rgba(0,229,255,0.8),
    0 0 25px rgba(0,150,255,0.4) !important;
}

/* Card 3 (SoulBloom Keeper) hover — violet theme */
.cards-grid .sb-card:nth-child(3)::before {
  background: linear-gradient(90deg, transparent, rgba(147,51,234,0.5), transparent);
}
.cards-grid .sb-card:nth-child(3)::after {
  background: linear-gradient(90deg, transparent, rgba(147,51,234,0.07), transparent);
}
.cards-grid .sb-card:nth-child(3):hover {
  border-color: rgba(147,51,234,0.55) !important;
  background: linear-gradient(145deg, rgba(12,8,14,0.93), rgba(9,5,10,0.97)) !important;
  box-shadow:
    0 0 0 1px rgba(147,51,234,0.14),
    0 0 28px rgba(147,51,234,0.22),
    0 0 60px rgba(109,40,217,0.10),
    0 12px 40px rgba(0,0,0,0.85),
    inset 0 1px 0 rgba(168,85,247,0.14),
    inset 0 -1px 0 rgba(0,0,0,0.6) !important;
}
.cards-grid .sb-card:nth-child(3):hover [style*="font-size:15px"] {
  text-shadow:
    0 0 10px rgba(147,51,234,0.8),
    0 0 25px rgba(109,40,217,0.4) !important;
}

/* Long footer card hover */
.long-footer-card {
  position: relative;
  overflow: hidden;
  min-height: 0;
  padding-top: 0.5vw;
  padding-bottom: 0.5vw;
  transition: border-color 0.35s ease, box-shadow 0.35s ease !important;
}
.long-footer-card:hover {
  border-color: rgba(255,140,0,0.4) !important;
  box-shadow:
    0 0 20px rgba(255,77,0,0.14),
    0 4px 24px rgba(0,0,0,0.6) !important;
}

/* ═══ CARDS DEV++ — KEYFRAMES ═══ */
@keyframes card-ambient-pulse {
  0%, 100% { opacity: 0.55; }
  50%       { opacity: 1; }
}
@keyframes card-scanline {
  0%   { top: -30%; }
  100% { top: 130%; }
}

/* Pseudo-elements for sbtc-card + long-footer-card */
.sbtc-card,
.long-footer-card {
  position: relative;
  overflow: hidden;
}
.sbtc-card::before,
.long-footer-card::before {
  content: '';
  position: absolute;
  top: 0; left: 10%; right: 10%;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(255,120,0,0.9) 30%, rgba(0,220,255,0.7) 70%, transparent);
  opacity: 0.55;
  animation: card-ambient-pulse 3s ease-in-out infinite;
  pointer-events: none;
  z-index: 3;
  filter: blur(0.4px);
}
.sbtc-card::after,
.long-footer-card::after {
  content: '';
  position: absolute;
  left: 0; right: 0;
  height: 30%;
  background: linear-gradient(180deg, transparent, rgba(255,180,0,0.03), rgba(0,220,255,0.02), transparent);
  top: -30%;
  animation: card-scanline 7s linear infinite;
  pointer-events: none;
  z-index: 1;
}
.sbtc-card:hover::before,
.long-footer-card:hover::before {
  opacity: 1;
  left: 4%; right: 4%;
  filter: blur(1px);
}

/* Permanent ambient box-shadow on ALL cards */
.sb-card,
.sbtc-card,
.long-footer-card {
  box-shadow:
    0 0 0 1px rgba(255, 80, 0, 0.08),
    0 0 18px rgba(255, 60, 0, 0.10),
    0 0 40px rgba(0, 180, 255, 0.04),
    inset 0 1px 0 rgba(255, 200, 80, 0.07),
    inset 0 -1px 0 rgba(0, 0, 0, 0.5),
    0 8px 32px rgba(0, 0, 0, 0.6) !important;
}

/* Hover — full intensity */
.sb-card:hover,
.sbtc-card:hover,
.long-footer-card:hover {
  box-shadow:
    0 0 0 1px rgba(255, 100, 0, 0.22),
    0 0 28px rgba(255, 80, 0, 0.28),
    0 0 60px rgba(255, 40, 0, 0.12),
    0 0 80px rgba(0, 200, 255, 0.07),
    inset 0 1px 0 rgba(255, 220, 100, 0.18),
    inset 0 -1px 0 rgba(0, 0, 0, 0.7),
    0 16px 48px rgba(0, 0, 0, 0.85) !important;
  border-color: rgba(255, 130, 0, 0.6) !important;
}

/* Nursery (SBT Creation) — cyan hover instead of orange, matches the modal's theme color */
.sbtc-card:hover {
  box-shadow:
    0 0 0 1px rgba(0, 190, 255, 0.28),
    0 0 28px rgba(0, 190, 255, 0.30),
    0 0 60px rgba(0, 140, 255, 0.14),
    0 0 80px rgba(0, 220, 255, 0.08),
    inset 0 1px 0 rgba(150, 230, 255, 0.18),
    inset 0 -1px 0 rgba(0, 0, 0, 0.7),
    0 16px 48px rgba(0, 0, 0, 0.85) !important;
  border-color: rgba(0, 200, 255, 0.6) !important;
}

/* ═══════════════════════════════════════════════════════
   AIRTRUST PANEL — ENHANCED STYLE & ANIMATIONS
   ═══════════════════════════════════════════════════════ */

@keyframes at-fadeSlide {
  from { opacity: 0; transform: translateY(18px) scale(0.98); }
  to   { opacity: 1; transform: translateY(0)    scale(1); }
}
@keyframes at-title-glow {
  0%, 100% { filter: drop-shadow(0 0 8px rgba(255,120,0,0.6)); }
  50%       { filter: drop-shadow(0 0 20px rgba(255,160,0,0.95)) drop-shadow(0 0 40px rgba(255,80,0,0.4)); }
}
@keyframes at-input-pulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(255,77,0,0); }
  50%       { box-shadow: 0 0 0 2px rgba(255,77,0,0.15); }
}
@keyframes at-btn-shimmer {
  0%   { left: -100%; }
  100% { left: 200%; }
}
@keyframes at-count-pop {
  0%   { transform: scale(1); }
  40%  { transform: scale(1.18); }
  100% { transform: scale(1); }
}

/* ── Panel entry animation ─────────────────────────────────── */
#airtrust-content > div {
  animation: at-fadeSlide 0.45s cubic-bezier(0.16,1,0.3,1) both;
}

/* ── Title image glow ──────────────────────────────────────── */
.airtrust-header img {
  animation: at-title-glow 3s ease-in-out infinite;
  transition: filter 0.3s;
}

#bloomboard-acc-body {
  scrollbar-width: thin;
  scrollbar-color: #ff4d00 transparent;
  padding-right: 6px;
}
#bloomboard-acc-body::-webkit-scrollbar { width: 5px; }
#bloomboard-acc-body::-webkit-scrollbar-track { background: transparent; }
#bloomboard-acc-body::-webkit-scrollbar-thumb { background: #ff4d00; border-radius: 4px; }

/* ── Close button ──────────────────────────────────────────── */
#airtrust-close-btn {
  font-family: var(--display) !important;
  font-size: 11px !important;
  letter-spacing: 2px !important;
  text-transform: uppercase !important;
  transition: transform 0.1s ease, box-shadow 0.1s ease, background 0.2s ease !important;
  box-shadow:
    3px 3px 0 rgba(180,40,0,0.9),
    4px 4px 0 rgba(140,20,0,0.6),
    5px 5px 0 rgba(100,10,0,0.3) !important;
}
#airtrust-close-btn:hover {
  background: rgba(255,77,0,0.22) !important;
  transform: translate(-1px, -1px) !important;
  box-shadow:
    4px 4px 0 rgba(200,60,0,0.9),
    6px 6px 0 rgba(160,30,0,0.6),
    8px 8px 0 rgba(120,10,0,0.3),
    0 0 20px rgba(255,77,0,0.4) !important;
}
#airtrust-close-btn:active {
  transform: translate(2px, 2px) !important;
  box-shadow: 1px 1px 0 rgba(180,40,0,0.9) !important;
  transition: transform 0.06s ease, box-shadow 0.06s ease !important;
}

/* ── Asset type tabs (LSP7 / LSP8) ────────────────────────── */
#tab-lsp7, #tab-lsp7asset, #tab-lsp8 {
  position: relative;
  overflow: hidden;
  transition: all 0.25s ease !important;
  font-size: 10px !important;
  letter-spacing: 2px !important;
}
#tab-lsp7::before, #tab-lsp7asset::before, #tab-lsp8::before {
  content: '';
  position: absolute;
  top: 0; bottom: 0; width: 40%;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,0.1), transparent);
  left: -100%;
  pointer-events: none;
}
#tab-lsp7:hover::before, #tab-lsp7asset:hover::before, #tab-lsp8:hover::before {
  animation: at-btn-shimmer 0.6s ease forwards;
}
#tab-lsp7[style*="rgba(255,77,0,0.2)"],
#tab-lsp7asset[style*="rgba(255,77,0,0.2)"],
#tab-lsp8[style*="rgba(255,77,0,0.2)"] {
  box-shadow: 0 0 16px rgba(255,77,0,0.3), inset 0 1px 0 rgba(255,180,0,0.15) !important;
  text-shadow: 0 0 10px rgba(255,140,0,0.6) !important;
}
#tab-lsp7:hover, #tab-lsp7asset:hover, #tab-lsp8:hover {
  border-color: rgba(255,140,0,0.6) !important;
  box-shadow: 0 0 12px rgba(255,100,0,0.25) !important;
}

/* ── Side 3D extrusion (relief on the right and bottom edges) ─────── */
#tab-lsp7, #tab-lsp7asset, #tab-lsp8,
.at-filter-trigger {
  box-shadow:
    3px 3px 0 rgba(180,40,0,0.9),
    4px 4px 0 rgba(140,20,0,0.6),
    5px 5px 0 rgba(100,10,0,0.3) !important;
  transition: transform 0.1s ease, box-shadow 0.1s ease, border-color 0.2s ease, background 0.2s ease !important;
}
#tab-lsp7:hover, #tab-lsp7asset:hover, #tab-lsp8:hover,
.at-filter-trigger:hover {
  box-shadow:
    4px 4px 0 rgba(200,60,0,0.9),
    6px 6px 0 rgba(160,30,0,0.6),
    8px 8px 0 rgba(120,10,0,0.3),
    0 0 14px rgba(255,100,0,0.25) !important;
  transform: translate(-1px, -1px) !important;
}
#tab-lsp7:active, #tab-lsp7asset:active, #tab-lsp8:active,
.at-filter-trigger:active {
  box-shadow:
    1px 1px 0 rgba(180,40,0,0.9) !important;
  transform: translate(2px, 2px) !important;
  transition: transform 0.06s ease, box-shadow 0.06s ease !important;
}

/* ── Token / NFT dropdown trigger ─────────────────────────── */
#token-dropdown-trigger,
#nft-collection-trigger {
  transition: all 0.2s ease !important;
  border-radius: 8px !important;
}
#token-dropdown-trigger:hover,
#nft-collection-trigger:hover {
  border-color: rgba(255,140,0,0.6) !important;
  background: rgba(255,77,0,0.12) !important;
  box-shadow: 0 0 12px rgba(255,77,0,0.2) !important;
}

/* ── Dropdown lists ────────────────────────────────────────── */
#token-dropdown-list,
#nft-collection-list {
  border-radius: 10px !important;
  border-color: rgba(255,120,0,0.5) !important;
  box-shadow: 0 12px 40px rgba(0,0,0,0.8), 0 0 20px rgba(255,77,0,0.15) !important;
  backdrop-filter: blur(12px) !important;
  max-height: 220px !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  scrollbar-width: thin !important;
  scrollbar-color: #ff4d00 transparent !important;
}
#token-dropdown-list::-webkit-scrollbar,
#nft-collection-list::-webkit-scrollbar { width: 4px; }
#token-dropdown-list::-webkit-scrollbar-thumb,
#nft-collection-list::-webkit-scrollbar-thumb { background: #ff4d00; border-radius: 2px; }

/* ── Amount input ──────────────────────────────────────────── */
#token-amount-input {
  border-radius: 8px !important;
  transition: all 0.2s ease !important;
}
#token-amount-input:focus {
  box-shadow: 0 0 0 2px rgba(255,77,0,0.2), 0 0 16px rgba(255,77,0,0.15) !important;
  background: rgba(255,77,0,0.1) !important;
}

/* ── 3D extrusion — SELECT TOKEN / AMOUNT / STAT BOXES ───── */
#token-dropdown-trigger,
#asset-dropdown-trigger,
#nft-collection-trigger,
#token-dropdown-list,
#asset-dropdown-list,
#nft-collection-list {
  box-shadow:
    3px 3px 0 rgba(180,40,0,0.9),
    4px 4px 0 rgba(140,20,0,0.6),
    5px 5px 0 rgba(100,10,0,0.3) !important;
  transition: transform 0.1s ease, box-shadow 0.1s ease, border-color 0.2s ease, background 0.2s ease !important;
}
#token-dropdown-trigger:hover,
#asset-dropdown-trigger:hover,
#nft-collection-trigger:hover {
  box-shadow:
    4px 4px 0 rgba(200,60,0,0.9),
    6px 6px 0 rgba(160,30,0,0.6),
    8px 8px 0 rgba(120,10,0,0.3),
    0 0 14px rgba(255,100,0,0.2) !important;
  transform: translate(-1px, -1px) !important;
}
#token-dropdown-trigger:active,
#asset-dropdown-trigger:active,
#nft-collection-trigger:active {
  box-shadow: 1px 1px 0 rgba(180,40,0,0.9) !important;
  transform: translate(2px, 2px) !important;
  transition: transform 0.06s ease, box-shadow 0.06s ease !important;
}
/* ── filter dropdowns ─────────────────────────────────────── */
.at-filter-dropdown {
  box-shadow:
    3px 3px 0 rgba(180,40,0,0.85),
    5px 5px 0 rgba(140,20,0,0.55),
    7px 7px 0 rgba(100,10,0,0.28),
    0 8px 24px rgba(0,0,0,0.7) !important;
}

#token-amount-input,
#asset-amount-input {
  box-shadow:
    3px 3px 0 rgba(180,40,0,0.8),
    4px 4px 0 rgba(140,20,0,0.5),
    5px 5px 0 rgba(100,10,0,0.25) !important;
  transition: transform 0.1s ease, box-shadow 0.1s ease !important;
}
#token-amount-input:hover,
#asset-amount-input:hover {
  box-shadow:
    4px 4px 0 rgba(200,60,0,0.9),
    6px 6px 0 rgba(160,30,0,0.6),
    8px 8px 0 rgba(120,10,0,0.3) !important;
  transform: translate(-1px, -1px) !important;
}
#token-amount-input:focus,
#asset-amount-input:focus {
  box-shadow:
    2px 2px 0 rgba(255,77,0,0.9),
    3px 3px 0 rgba(200,40,0,0.6),
    0 0 0 2px rgba(255,77,0,0.2),
    0 0 16px rgba(255,77,0,0.15) !important;
  transform: translate(-1px, -1px) !important;
}

.at-stat-box--orange {
  box-shadow:
    3px 3px 0 rgba(180,40,0,0.8),
    4px 4px 0 rgba(140,20,0,0.5),
    5px 5px 0 rgba(100,10,0,0.25) !important;
  transition: transform 0.1s ease, box-shadow 0.1s ease !important;
}
.at-stat-box--orange:hover {
  box-shadow:
    4px 4px 0 rgba(200,60,0,0.9),
    6px 6px 0 rgba(160,30,0,0.6),
    8px 8px 0 rgba(120,10,0,0.3),
    0 0 12px rgba(255,77,0,0.2) !important;
  transform: translate(-1px, -1px) !important;
}

.at-stat-box--green {
  box-shadow:
    3px 3px 0 rgba(0,140,60,0.8),
    4px 4px 0 rgba(0,100,40,0.5),
    5px 5px 0 rgba(0,60,20,0.25) !important;
  transition: transform 0.1s ease, box-shadow 0.1s ease !important;
}
.at-stat-box--green:hover {
  box-shadow:
    4px 4px 0 rgba(0,180,80,0.9),
    6px 6px 0 rgba(0,140,50,0.6),
    8px 8px 0 rgba(0,80,20,0.3),
    0 0 12px rgba(0,255,136,0.2) !important;
  transform: translate(-1px, -1px) !important;
}

/* ── UP Selected box ───────────────────────────────────────── */
#airtrust-up-count {
  transition: transform 0.3s cubic-bezier(0.34,1.56,0.64,1), color 0.3s;
  text-shadow: 0 0 20px rgba(255,77,0,0.6), 0 0 40px rgba(255,40,0,0.3) !important;
}

/* ── Total amount value ────────────────────────────────────── */
#airtrust-total-amount, #nft-total-count {
  text-shadow: 0 0 16px rgba(0,255,136,0.5), 0 0 32px rgba(0,200,100,0.25) !important;
  transition: transform 0.3s cubic-bezier(0.34,1.56,0.64,1);
}

/* ── AIRTRUST THEM buttons ─────────────────────────────────── */
#airtrust-them-lsp7,
#airtrust-them-lsp8 {
  position: relative;
  overflow: hidden;
  background: linear-gradient(135deg, #ff4d00, #ff9d00, #ff6600, #ff4d00) !important;
  background-size: 300% auto !important;
  animation: border-flow 3s ease infinite !important;
  box-shadow:
    0 0 20px rgba(255,100,0,0.45),
    0 6px 24px rgba(0,0,0,0.5),
    inset 0 1px 0 rgba(255,200,0,0.3) !important;
  border-radius: 10px !important;
  letter-spacing: 5px !important;
  font-size: 13px !important;
  transition: all 0.3s ease !important;
}
#airtrust-them-lsp7::before,
#airtrust-them-lsp8::before {
  content: '';
  position: absolute;
  top: 0; bottom: 0; width: 45%;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,0.18), transparent);
  left: -100%;
  animation: at-btn-shimmer 2.5s ease infinite;
  pointer-events: none;
}
#airtrust-them-lsp7:hover,
#airtrust-them-lsp8:hover {
  box-shadow:
    0 0 40px rgba(255,120,0,0.7),
    0 10px 32px rgba(0,0,0,0.6),
    inset 0 1px 0 rgba(255,220,0,0.4) !important;
  transform: translateY(-3px) scale(1.01) !important;
  letter-spacing: 6px !important;
}

/* ── Leaderboard filter tabs ───────────────────────────────── */
.airtrust-tab-btn {
  position: relative;
  overflow: hidden;
  transition: all 0.2s ease !important;
  border-radius: 6px !important;
}
.airtrust-tab-btn::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, rgba(255,77,0,0.15), rgba(255,140,0,0.08));
  opacity: 0;
  transition: opacity 0.2s;
  pointer-events: none;
}
.airtrust-tab-btn:hover::before { opacity: 1; }
.airtrust-tab-btn:hover {
  border-color: rgba(255,140,0,0.5) !important;
  box-shadow: 0 0 10px rgba(255,77,0,0.2) !important;
  transform: translateY(-1px);
}
.airtrust-tab-btn.active {
  box-shadow: 0 0 16px rgba(255,77,0,0.35), inset 0 1px 0 rgba(255,180,0,0.2) !important;
  text-shadow: 0 0 8px rgba(255,140,0,0.7) !important;
}

/* ── AirTrust filter dropdown options ────────────────────── */
.at-filter-opt {
  padding: 7px 12px;
  font-family: var(--display);
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: #888;
  border-radius: 4px;
  cursor: pointer;
  transition: all 0.15s;
  white-space: nowrap;
}
.at-filter-opt:hover { background: rgba(255,77,0,0.15); color: #ff8c00; }
.at-filter-opt.at-filter-opt-active { color: #ff8c00; background: rgba(255,77,0,0.1); }

/* ── Bloomboard accordion header ───────────────────────────── */
.bloomboard-accordion-trigger {
  transition: all 0.2s ease !important;
}
.bloomboard-accordion-trigger:hover {
  box-shadow: 0 0 12px rgba(255,77,0,0.2) inset !important;
}

/* ── Airtrust items (leaderboard rows) ─────────────────────── */
.airtrust-item {
  border-radius: 8px !important;
  transition: border-color 0.2s ease, box-shadow 0.2s ease !important;
}
.airtrust-item:hover {
  border-color: rgba(255,160,0,0.6) !important;
  box-shadow: 0 0 14px rgba(210,155,0,0.2), inset 0 1px 0 rgba(255,180,0,0.08) !important;
}

/* ── Sidebar stat labels — orange glow ─────────────────────── */
#engine-status {
  text-shadow:
    0 0 10px rgba(255,140,0,0.7),
    0 0 24px rgba(255,77,0,0.4),
    0 0 48px rgba(255,40,0,0.2) !important;
  transition: text-shadow 0.3s;
}
#engine-status[style*="color:#00ff88"],
#engine-status[style*="color:var(--green)"],
#engine-status[style*="#00e5b0"] {
  text-shadow:
    0 0 10px rgba(0,255,136,0.8),
    0 0 24px rgba(0,200,100,0.5),
    0 0 48px rgba(0,180,80,0.25) !important;
}
#user-eligible {
  text-shadow:
    0 0 14px rgba(0,255,136,0.8),
    0 0 32px rgba(0,200,100,0.5),
    0 0 60px rgba(0,180,80,0.25) !important;
  transition: text-shadow 0.3s;
}
#airtrust-sent {
  text-shadow:
    0 0 14px rgba(0,255,136,0.8),
    0 0 32px rgba(0,200,100,0.5),
    0 0 60px rgba(0,180,80,0.25) !important;
  transition: text-shadow 0.3s;
}
#eligible-info-icon {
  box-shadow: 0 0 8px rgba(255,140,0,0.5), 0 0 16px rgba(255,77,0,0.25) !important;
  transition: box-shadow 0.2s;
}
#eligible-info-icon:hover {
  box-shadow: 0 0 14px rgba(255,160,0,0.9), 0 0 28px rgba(255,100,0,0.5) !important;
}
#eligible-tooltip {
  box-shadow: 0 4px 20px rgba(0,0,0,0.7), 0 0 16px rgba(255,140,0,0.2) !important;
}

/* Sidebar label titles glow */
.sidebar-content [style*="ENGINE STATUS"],
.sidebar-content [style*="PROFILES ELIGIBLE"],
.sidebar-content [style*="AIRTRUST SENT"] {
  text-shadow: 0 0 8px rgba(255,140,0,0.6), 0 0 18px rgba(255,77,0,0.3) !important;
}

/* ── CREATE SBT / OPEN MANAGER — hover halo ────────────────── */
#create-sbt-btn:not(:disabled):hover {
  box-shadow:
    0 0 18px rgba(0,200,255,0.55),
    0 0 40px rgba(0,150,255,0.25),
    inset 0 1px 0 rgba(255,255,255,0.2) !important;
  transform: translateY(-2px) !important;
  filter: brightness(1.08);
}
#open-manager-btn:not(:disabled):hover {
  box-shadow:
    0 0 18px rgba(168,85,247,0.55),
    0 0 40px rgba(109,40,217,0.25),
    inset 0 1px 0 rgba(255,255,255,0.2) !important;
  transform: translateY(-2px) !important;
  filter: brightness(1.08);
}

/* ── Responsive — mobile bottom bar cards (restore original) ── */
@media (max-width: 1024px) {
  /* Bottom bar always visible on mobile */
  #mobile-bottom-bar {
    display: flex !important;
    bottom: calc(60px + env(safe-area-inset-bottom)) !important;
  }

  /* Bottom bar images transparent */
  #mobile-bottom-bar img {
    mix-blend-mode: screen;
    background: transparent;
  }

  /* Active tab highlight in bottom bar */
  #mobile-bottom-bar button[style*="opacity: 1"],
  #mobile-bottom-bar button[style*="opacity:1"] {
    background: rgba(255,77,0,0.1) !important;
    border-radius: 8px !important;
  }

  /* ── Bottom bar — compact height, content scaled & centered ── */
  #mobile-bottom-bar {
    display: flex !important;
    align-items: center !important;
    justify-content: space-around !important;
    padding: 4px 6px !important;
  }
  #mobile-bottom-bar button {
    height: 100% !important;
    gap: 4px !important;
    padding: 0 6px !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
  }
  #mobile-bottom-bar img {
    width: clamp(38px, 7.8vw, 53px) !important;
    height: clamp(38px, 7.8vw, 53px) !important;
    display: block !important;
    margin: 0 auto !important;
  }
  #mobile-bottom-bar button span {
    font-size: clamp(12px, 2.2vw, 14px) !important;
    display: block !important;
    text-align: center !important;
    width: 100% !important;
  }

  /* ════════════════════════════════════════════════════════════
     ── DEV++ PRO — Bottom bar premium styling ──
     Glass surface, animated gradient top-line sweep, glowing
     active tab with gradient pill + icon/text glow, tactile press
     feedback. All scoped to #mobile-bottom-bar @856px only.
     ════════════════════════════════════════════════════════════ */
  #mobile-bottom-bar {
    position: fixed !important;
    bottom: calc(32px + env(safe-area-inset-bottom, 0px)) !important;
    left: 50% !important;
    right: auto !important;
    transform: translateX(-50%) !important;
    height: 65px !important;
    width: 100% !important;
    max-width: calc(100% - 24px) !important;
    background:
      linear-gradient(180deg, rgba(18,10,8,0.45) 0%, rgba(6,6,8,0.55) 100%),
      url('background4.webp') center center / cover no-repeat !important;
    border-radius: 18px !important;
    box-shadow:
      0 8px 30px rgba(0,0,0,0.55),
      0 2px 12px rgba(255,77,0,0.15),
      0 0 0 1px rgba(255,140,0,0.18) !important;
    border-top: none !important;
    overflow: hidden !important;
  }
  /* Soft ambient glow rising from the bar */
  #mobile-bottom-bar::after {
    content: '';
    position: absolute;
    top: -24px; left: 0; right: 0; height: 24px;
    background: linear-gradient(180deg, rgba(255,77,0,0.10), transparent);
    pointer-events: none;
    z-index: 0;
  }

  #mobile-bottom-bar button {
    position: relative !important;
    z-index: 2;
    border-radius: 10px !important;
    transition: transform .18s ease, background .25s ease, box-shadow .25s ease !important;
  }
  #mobile-bottom-bar button:active {
    transform: scale(0.93) !important;
  }
  #mobile-bottom-bar img {
    transition: filter .25s ease, transform .25s ease !important;
    filter: drop-shadow(0 0 0 rgba(255,140,0,0));
  }
  #mobile-bottom-bar button span {
    transition: text-shadow .25s ease, letter-spacing .25s ease !important;
  }

  /* Active tab — gradient pill + glow (overrides the flat highlight above) */
  #mobile-bottom-bar button[style*="opacity: 1"],
  #mobile-bottom-bar button[style*="opacity:1"] {
    background: linear-gradient(180deg, rgba(255,140,0,0.22), rgba(255,77,0,0.08)) !important;
    box-shadow:
      0 0 0 1px rgba(255,140,0,0.35) inset,
      0 4px 18px rgba(255,77,0,0.30),
      0 0 24px rgba(255,77,0,0.18) !important;
    border-radius: 10px !important;
  }
  #mobile-bottom-bar button[style*="opacity: 1"] img,
  #mobile-bottom-bar button[style*="opacity:1"] img {
    filter: drop-shadow(0 0 8px rgba(255,140,0,0.85)) !important;
    transform: translateY(-1px) scale(1.05) !important;
  }
  #mobile-bottom-bar button[style*="opacity: 1"] span,
  #mobile-bottom-bar button[style*="opacity:1"] span {
    text-shadow: 0 0 10px rgba(255,140,0,0.65) !important;
    letter-spacing: 1.4px !important;
  }

  /* ── SBT CREATION (mob-btn-1) — Cyan halo when active ── */
  #mobile-bottom-bar #mob-btn-1[style*="opacity: 1"],
  #mobile-bottom-bar #mob-btn-1[style*="opacity:1"] {
    background: linear-gradient(180deg, rgba(0,200,255,0.22), rgba(0,150,255,0.08)) !important;
    box-shadow:
      0 0 0 1px rgba(0,200,255,0.35) inset,
      0 4px 18px rgba(0,200,255,0.30),
      0 0 24px rgba(0,200,255,0.18) !important;
  }
  #mobile-bottom-bar #mob-btn-1[style*="opacity: 1"] img,
  #mobile-bottom-bar #mob-btn-1[style*="opacity:1"] img {
    filter: drop-shadow(0 0 8px rgba(0,200,255,0.85)) !important;
  }
  #mobile-bottom-bar #mob-btn-1[style*="opacity: 1"] span,
  #mobile-bottom-bar #mob-btn-1[style*="opacity:1"] span {
    text-shadow: 0 0 10px rgba(0,200,255,0.65) !important;
  }

  /* ── SBT MANAGER (mob-btn-2) — Violet halo when active ── */
  #mobile-bottom-bar #mob-btn-2[style*="opacity: 1"],
  #mobile-bottom-bar #mob-btn-2[style*="opacity:1"] {
    background: linear-gradient(180deg, rgba(147,51,234,0.22), rgba(124,58,237,0.08)) !important;
    box-shadow:
      0 0 0 1px rgba(147,51,234,0.35) inset,
      0 4px 18px rgba(147,51,234,0.30),
      0 0 24px rgba(147,51,234,0.18) !important;
  }
  #mobile-bottom-bar #mob-btn-2[style*="opacity: 1"] img,
  #mobile-bottom-bar #mob-btn-2[style*="opacity:1"] img {
    filter: drop-shadow(0 0 8px rgba(147,51,234,0.85)) !important;
  }
  #mobile-bottom-bar #mob-btn-2[style*="opacity: 1"] span,
  #mobile-bottom-bar #mob-btn-2[style*="opacity:1"] span {
    text-shadow: 0 0 10px rgba(147,51,234,0.65) !important;
  }

  /* Long-footer-card — cyan when SBT Creation is active (card 1) */
  /* Border — active only on direct click */
  .long-footer-card.mobile-active-cyan {
    border-color: rgba(0,200,255,0.5) !important;
    box-shadow:
      0 0 20px rgba(0,200,255,0.18),
      0 4px 24px rgba(0,0,0,0.6) !important;
  }
  .long-footer-card.mobile-active-violet {
    border-color: rgba(147,51,234,0.5) !important;
    box-shadow:
      0 0 20px rgba(147,51,234,0.18),
      0 4px 24px rgba(0,0,0,0.6) !important;
  }

  /* Text — always colored on the relevant card, independent of click */
  .long-footer-card.mobile-label-cyan .long-footer-stat-label {
    color: #00d4f0 !important;
  }
  .long-footer-card.mobile-label-violet .long-footer-stat-label {
    color: #a855f7 !important;
  }
}

  /* ── Lock-hint tooltip — colored to match its card via currentColor ── */
  .phlame-lock-hint {
    position: relative;
    cursor: help;
  }
  .phlame-lock-hint::after {
    content: attr(data-tooltip);
    position: absolute;
    bottom: calc(100% + 10px);
    left: 50%;
    transform: translateX(-50%) translateY(4px);
    width: max-content;
    max-width: 240px;
    white-space: pre-line;
    background: rgba(8,8,10,0.96);
    border: 1px solid currentColor;
    border-radius: 6px;
    color: #eee;
    font-family: 'Nunito', sans-serif;
    font-size: 10px;
    font-weight: 600;
    letter-spacing: 0.3px;
    line-height: 1.5;
    text-transform: none;
    text-align: center;
    padding: 8px 10px;
    box-shadow: 0 4px 18px rgba(0,0,0,0.55), 0 0 22px currentColor, 0 0 40px currentColor;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.2s ease, transform 0.2s ease;
    z-index: 50;
  }
  .phlame-lock-hint::before {
    content: '';
    position: absolute;
    bottom: calc(100% + 4px);
    left: 50%;
    transform: translateX(-50%) translateY(4px);
    border: 6px solid transparent;
    border-top-color: currentColor;
    filter: drop-shadow(0 0 6px currentColor);
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.2s ease, transform 0.2s ease;
    z-index: 50;
  }
  .phlame-lock-hint:hover::after,
  .phlame-lock-hint:hover::before {
    opacity: 1;
    transform: translateX(-50%) translateY(0);
  }

  /* Explicit per-card halo colors */
  .phlame-lock-hint.lock-hint-orange::after { box-shadow: 0 4px 18px rgba(0,0,0,0.55), 0 0 22px #ff8c00, 0 0 40px #ff8c00; }
  .phlame-lock-hint.lock-hint-orange::before { filter: drop-shadow(0 0 6px #ff8c00); }
  .phlame-lock-hint.lock-hint-cyan::after { box-shadow: 0 4px 18px rgba(0,0,0,0.55), 0 0 22px #00e5ff, 0 0 40px #00e5ff; }
  .phlame-lock-hint.lock-hint-cyan::before { filter: drop-shadow(0 0 6px #00e5ff); }
  .phlame-lock-hint.lock-hint-violet::after { box-shadow: 0 4px 18px rgba(0,0,0,0.55), 0 0 22px #9333ea, 0 0 40px #9333ea; }
  .phlame-lock-hint.lock-hint-violet::before { filter: drop-shadow(0 0 6px #9333ea); }