:root{
  --bg:#000;
  --text:#fff;
  --muted:#a8a8a8;
  --violet:#a020f0;
  --violet-dark:#5e2d79;
  --grad:linear-gradient(45deg,var(--violet),var(--violet-dark));
  --container:1200px;
  --padx:1.25rem;
  --radius:18px;
  --card:rgba(255,255,255,.06);
  --border-soft:rgba(255,255,255,.12);
  --focus:0 0 0 4px rgba(160,32,240,.25);
}

html,body{background:var(--bg);color:var(--text)}

/* OnlyDream navbar */
.od-navbar{
  position:fixed;inset:0 0 auto 0;z-index:1000;
  display:flex;align-items:center;justify-content:space-between;gap:.8rem;
  padding:1.15rem 2rem;
  background:rgba(0,0,0,.92);
  backdrop-filter:blur(12px);
  border-bottom:1px solid rgba(160,32,240,.22);
  transition:.25s;
}
.od-navbar.scrolled{
  padding:.85rem 2rem;
  background:rgba(0,0,0,.97);
  box-shadow:0 10px 35px rgba(160,32,240,.16);
  border-bottom-color:rgba(160,32,240,.28);
}
.od-nav-brand{
  display:flex;align-items:center;gap:.75rem;
  font-weight:900;font-size:1.35rem;
  text-transform:uppercase;letter-spacing:1px;
}
.od-nav-brand i{color:var(--violet);font-size:1.6rem;text-shadow:0 0 14px rgba(160,32,240,.6)}
.od-nav-toggle{display:none;background:transparent;border:0;color:#fff;font-size:1.75rem;padding:.35rem .6rem;border-radius:12px;line-height:1;cursor:pointer}
.od-nav-toggle:focus-visible{outline:none;box-shadow:var(--focus)}
.od-nav-links{
  display:flex;gap:1.25rem;align-items:center;
  background:rgba(160,32,240,.06);
  padding:.5rem 1rem;border-radius:999px;
  border:1px solid rgba(160,32,240,.14);
}
.od-nav-links a{
  color:#b8b8b8;position:relative;
  padding:.55rem .95rem;border-radius:999px;
  letter-spacing:.35px;text-transform:uppercase;
  font-weight:800;font-size:.9rem;
  transition:.25s;
  white-space:nowrap;
}
.od-nav-links a::before{content:"";position:absolute;inset:0;border-radius:999px;background:var(--grad);opacity:0;transition:.25s;z-index:-1}
.od-nav-links a:hover{color:#fff;transform:translateY(-2px);text-shadow:0 0 12px rgba(160,32,240,.25)}
.od-nav-links a:hover::before{opacity:.18}
.od-nav-links a.active{color:#f0ddff;background:rgba(160,32,240,.14);border:1px solid rgba(160,32,240,.18)}
.od-nav-actions{display:flex;align-items:center;margin-left:.75rem;gap:.6rem}
.od-btn{
  display:inline-flex;align-items:center;gap:.5rem;
  padding:.6rem 1.05rem;border-radius:999px;
  font-weight:900;letter-spacing:.3px;
  background:transparent;
  border:1px solid rgba(160,32,240,.42);
  color:#eedcff;
  box-shadow:inset 0 0 0 1px rgba(160,32,240,.16);
  transition:.25s;
  white-space:nowrap;
}
.od-btn:hover{background:var(--grad);color:#fff;transform:translateY(-2px);box-shadow:0 12px 30px rgba(160,32,240,.28)}
.od-btn:focus-visible{outline:none;box-shadow:var(--focus)}

.od-offset{height:92px}

@media (max-width: 900px){
  .od-nav-toggle{display:inline-flex}
  .od-nav-links{
    position:absolute;left:1rem;right:1rem;top:calc(100% + .75rem);
    flex-direction:column;align-items:stretch;gap:.35rem;
    padding:.75rem;border-radius:18px;
    background:rgba(0,0,0,.96);border:1px solid rgba(160,32,240,.2);
    display:none;
  }
  .od-nav-links.open{display:flex}
  .od-nav-links a{justify-content:center}
}

/* Cards + simple helpers */
.od-card{background:linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.03));border:1px solid var(--border-soft);border-radius:var(--radius)}
.od-badge{display:inline-flex;align-items:center;gap:.55rem;padding:.4rem .8rem;border-radius:999px;border:1px solid rgba(160,32,240,.22);background:rgba(160,32,240,.08);color:#f1e3ff;font-weight:900}

/* Footer */
.od-footer{border-top:1px solid rgba(160,32,240,.18);background:rgba(0,0,0,.85)}
.od-footer .inner{max-width:var(--container);margin:0 auto;padding:1.4rem var(--padx);display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap;color:#cfcfcf;font-size:.95rem}
.od-footer a{text-decoration:underline;text-underline-offset:3px}
