/* Frosted navigation with a readable navy fallback, including non-WebGL browsers. */
.fixed-glass-dock .reactbits-dock {
  background: rgba(13, 32, 52, .58) !important;
  backdrop-filter: var(--filter-id) blur(8px) saturate(1.5) !important;
  -webkit-backdrop-filter: blur(10px) saturate(1.5) !important;
  border: 1px solid rgba(192, 231, 244, .22);
  box-shadow: 0 12px 36px #020c1f66, inset 0 1px 0 #e9faff26;
}
.fixed-glass-dock .glass-surface__canvas { opacity: .72; }
.fixed-glass-dock { bottom: max(16px, env(safe-area-inset-bottom)) !important; }
@media (max-width: 600px) {
  .unified-hero .deck-wrap { padding-top: 58px !important; }
  .unified-hero .deck-stage { height: 195px !important; }
  .unified-hero { padding-bottom: 110px !important; }
  .deck-guide { margin-bottom: 16px !important; }
}
@media (max-width: 600px) and (max-height: 800px) {
  .site-header { height: 64px !important; min-height: 64px !important; }
  .hero-principles { display: none !important; }
  .unified-hero { padding-top: 16px !important; }
  .unified-hero .display { font-size: 27px !important; line-height: 1.5 !important; margin-block: 8px !important; }
  .unified-hero .deck-wrap { padding-top: 54px !important; }
  .unified-hero .deck-stage { height: 185px !important; }
  .deck-guide span { max-width: 270px; }
}
@media (max-width: 600px) and (max-height: 680px) {
  .site-header { height: 52px !important; min-height: 52px !important; }
  .unified-hero { padding-top: 8px !important; }
  .deck-controls { margin-top: 6px !important; }
  .deck-guide strong { font-size: 17px !important; line-height: 1.4 !important; }
  .unified-hero .deck-stage { height: 165px !important; }
  .unified-hero .deck-wrap { padding-top: 48px !important; }
  .deck-guide span { display: none; }
}
