/* Burger Plaza — premium orange #f16623 × navy #262262 */
:root {
  --bg: #0e0c1a;
  --surface: rgba(28, 24, 52, 0.92);
  --surface2: rgba(38, 34, 78, 0.95);
  --border: rgba(241, 102, 35, 0.32);
  --border-strong: rgba(241, 102, 35, 0.55);
  --gold: #f16623;
  --gold-soft: #ff8a4c;
  --gold-dim: #c44e14;
  --yellow: #ff8a4c;
  --navy: #262262;
  --navy-deep: #1a1848;
  --navy-soft: #3d3a8a;
  --cream: #fff5ef;
  --silver: #c9c6e8;
  --silver-bright: #e8e6ff;
  --white: #fff8f4;
  --text: #fff8f4;
  --muted: #b0add4;
  --ok: #3ddc84;
  --err: #ff6b7a;
  --max: 440px;
  --nav: 68px;
  --radius: 18px;
  --glow-gold: 0 0 28px rgba(241, 102, 35, 0.45);
  --glow-navy: 0 0 20px rgba(38, 34, 98, 0.5);
  --grad-main: linear-gradient(135deg, #f16623 0%, #e85a1a 40%, #262262 100%);
  --grad-btn: linear-gradient(105deg, #c44e14 0%, #f16623 35%, #ff8a4c 50%, #f16623 65%, #c44e14 100%);
  --grad-card: linear-gradient(160deg, rgba(241,102,35,0.12) 0%, rgba(38,34,98,0.25) 100%);
  --grad-bg: linear-gradient(160deg, #1a1848 0%, #0e0c1a 45%, #1a1020 100%);
}

html[data-theme="light"] {
  --bg: #f7f4ff;
  --surface: rgba(255, 255, 255, 0.94);
  --surface2: rgba(245, 242, 255, 0.96);
  --border: rgba(241, 102, 35, 0.28);
  --border-strong: rgba(38, 34, 98, 0.35);
  --gold: #e55a18;
  --gold-soft: #c44e14;
  --navy: #262262;
  --text: #1a1848;
  --muted: #5a5780;
  --white: #1a1848;
  --cream: #1a1848;
  --silver: #4a4780;
  --silver-bright: #262262;
}

.bp-floaters {
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  overflow: hidden;
}

.bp-floaters span {
  position: absolute;
  display: block;
  border-radius: 999px;
  opacity: 0.5;
  animation: bp-float 15s ease-in-out infinite;
}

.bp-floaters .f1 {
  width: 160px; height: 160px;
  top: 4%; left: -50px;
  background: radial-gradient(circle at 35% 35%, rgba(241, 102, 35, 0.5), rgba(241, 102, 35, 0.08) 55%, transparent 72%);
  animation-duration: 17s;
}

.bp-floaters .f2 {
  width: 120px; height: 120px;
  top: 22%; right: -30px;
  background: radial-gradient(circle at 40% 40%, rgba(38, 34, 98, 0.55), rgba(61, 58, 138, 0.15) 55%, transparent 70%);
  animation-duration: 19s;
  animation-delay: -4s;
}

.bp-floaters .f3 {
  width: 80px; height: 14px;
  top: 50%; left: 5%;
  border-radius: 10px;
  background: linear-gradient(90deg, rgba(241, 102, 35, 0.7), rgba(38, 34, 98, 0.2));
  box-shadow: 0 0 18px rgba(241, 102, 35, 0.35);
  transform: rotate(-16deg);
  animation-duration: 12s;
  animation-delay: -2s;
}

.bp-floaters .f4 {
  width: 60px; height: 12px;
  top: 56%; left: 12%;
  border-radius: 10px;
  background: linear-gradient(90deg, rgba(255, 138, 76, 0.55), rgba(38, 34, 98, 0.15));
  transform: rotate(14deg);
  animation-duration: 13s;
  animation-delay: -6s;
}

.bp-floaters .f5 {
  width: 140px; height: 140px;
  bottom: 12%; right: 2%;
  background: radial-gradient(circle at 50% 50%, rgba(241, 102, 35, 0.28), transparent 68%);
  animation-duration: 21s;
  animation-delay: -8s;
}

.bp-floaters .f6 {
  width: 50px; height: 50px;
  top: 36%; left: 70%;
  background: radial-gradient(circle, rgba(61, 58, 138, 0.45), transparent 70%);
  animation-duration: 11s;
  animation-delay: -3s;
}

.bp-floaters .f7 {
  width: 200px; height: 48px;
  bottom: 5%; left: -60px;
  border-radius: 40px;
  background: linear-gradient(90deg, transparent, rgba(241, 102, 35, 0.2), rgba(38, 34, 98, 0.15), transparent);
  animation-duration: 23s;
}

.bp-floaters .f8 {
  width: 28px; height: 28px;
  top: 14%; left: 46%;
  background: radial-gradient(circle, rgba(255, 245, 239, 0.5), transparent 70%);
  animation-duration: 9s;
  animation-delay: -1s;
}

@keyframes bp-float {
  0%, 100% { transform: translateY(0) translateX(0) rotate(0deg); }
  25% { transform: translateY(-16px) translateX(8px) rotate(2deg); }
  50% { transform: translateY(-6px) translateX(-10px) rotate(-2deg); }
  75% { transform: translateY(-20px) translateX(5px) rotate(1deg); }
}

html[data-theme="light"] .bp-floaters span { opacity: 0.28; }

.btn-gold, .btn-primary, button.primary, .amt-btn.active, .nav-item.active {
  box-shadow: var(--glow-gold);
}

.bp-shine {
  background: linear-gradient(135deg, #ff8a4c 0%, #f16623 40%, #c9c6e8 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

/* Premium card sheen */
.card, .panel, .wallet-card, .stat-card, .plan-card {
  background-image: var(--grad-card);
}