/* PURPLE STORM THEME */
:root{
  --storm-purple:#7c3aed;
  --storm-purple-2:#a855f7;
  --storm-purple-3:#c084fc;
  --storm-dark:#090313;
  --storm-dark-2:#140622;
  --storm-gold:#ffd700;
}

/* Main purple atmosphere */
html, body{
  background:
    radial-gradient(circle at 50% -10%, rgba(168,85,247,.28), transparent 38%),
    linear-gradient(135deg,#05020a 0%,#10051c 48%,#1b0730 100%) !important;
  color:#fff !important;
}

/* Purple tint for major page surfaces without hiding content */
body::before{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  z-index:998;
  background:
    radial-gradient(circle at 20% 30%, rgba(124,58,237,.08), transparent 28%),
    radial-gradient(circle at 80% 65%, rgba(168,85,247,.07), transparent 30%);
}

/* Common Samsung-style surfaces */
[class*="header"], [class*="gnb"], [class*="nav"], [class*="footer"],
[class*="tab"], [class*="option"], [class*="selector"],
[class*="accordion"], [class*="banner"], [class*="layer-popup"]{
  --purple-accent:var(--storm-purple);
}

.nv00-gnb-v4,
.nv00-gnb-v4__contents,
.nv00-gnb-v4__menu{
  background:rgba(9,3,19,.96) !important;
  color:#fff !important;
}

.cta--contained,
.cta--emphasis{
  background:linear-gradient(135deg,#6d28d9,#9333ea) !important;
  border-color:#a855f7 !important;
  color:#fff !important;
  box-shadow:0 0 18px rgba(168,85,247,.25);
}

.cta--black{
  background:linear-gradient(135deg,#12071d,#2a0b45) !important;
  color:#fff !important;
  border-color:rgba(192,132,252,.55) !important;
}

a:hover{
  color:#c084fc !important;
}

/* Existing rain becomes slightly purple/white */
#rain-canvas{
  filter:drop-shadow(0 0 2px rgba(192,132,252,.45));
  opacity:.9;
}

/* Lightning sits above rain, but remains non-interactive */
#lightning-canvas{
  mix-blend-mode:screen;
  filter:drop-shadow(0 0 9px rgba(168,85,247,.95));
}

#lightning-flash{
  background:
    radial-gradient(circle at 50% 35%,rgba(255,255,255,.96) 0%,rgba(216,180,254,.58) 25%,rgba(124,58,237,.25) 58%,rgba(20,6,34,.12) 100%) !important;
}

/* Popup / custom components */
.popup-container,
.SLOT{
  background:
    linear-gradient(145deg,rgba(10,3,20,.97),rgba(35,10,55,.96)) !important;
  border-color:rgba(168,85,247,.65) !important;
  box-shadow:
    0 0 0 1px rgba(192,132,252,.18),
    0 18px 70px rgba(0,0,0,.72),
    0 0 45px rgba(124,58,237,.22) !important;
}

.clk-btn-sgp a{
  box-shadow:0 8px 0 #050207,0 0 22px rgba(124,58,237,.18) !important;
}

.login{
  background:linear-gradient(145deg,#24103b,#4c1d95) !important;
  border-color:#a855f7 !important;
  color:#ffd700 !important;
}

.register{
  background:linear-gradient(145deg,#7e22ce,#a855f7) !important;
  border-color:#d8b4fe !important;
  color:#fff !important;
}

.login:hover,.register:hover{
  border-color:#ffd700 !important;
  box-shadow:0 12px 0 #050207,0 0 35px rgba(168,85,247,.55) !important;
}

.luxury-border{
  border-color:rgba(192,132,252,.45) !important;
  background:linear-gradient(135deg,transparent,rgba(168,85,247,.10),transparent) !important;
}

.close-btn{
  border-color:rgba(192,132,252,.65) !important;
}

.close-btn:hover{
  background:rgba(124,58,237,.9) !important;
}

.close-btn::before,.close-btn::after{
  background:#e9d5ff !important;
}

.info-table th{
  background:linear-gradient(135deg,#2e1065,#7e22ce) !important;
  color:#fff !important;
}

.info-table td{
  border-bottom-color:rgba(168,85,247,.20) !important;
}

.gold-particle{
  box-shadow:0 0 10px rgba(192,132,252,.7) !important;
}

/* Reduce the chance of the decorative storm layer blocking controls */
#rain-canvas,#lightning-canvas,#lightning-flash{
  pointer-events:none !important;
}

/* Mobile */
@media(max-width:768px){
  body{
    background:
      radial-gradient(circle at 50% 0%,rgba(168,85,247,.22),transparent 42%),
      linear-gradient(160deg,#05020a,#160621 55%,#22083a) !important;
  }
}