:root {
  --bg: #07111f;
  --ink: #eaf2ff;
  --muted: #9fb2cf;
  --cyan: #39d5ff;
  --hot: #ff4fa3;
  --green: #4ade80;
  --yellow: #facc15;
}

body {
  background:
    radial-gradient(circle at top left, rgba(57,213,255,.16), transparent 34rem),
    radial-gradient(circle at 80% 10%, rgba(255,79,163,.14), transparent 32rem),
    #f5f7fb;
}

.fw-black {
  font-weight: 900;
}

.tracking {
  letter-spacing: .12em;
}

.brand-orb {
  display: inline-grid;
  place-items: center;
  width: 2rem;
  height: 2rem;
  margin-right: .35rem;
  border-radius: .75rem;
  background: linear-gradient(135deg, #39d5ff, #a78bfa);
}

.hero-panel {
  color: var(--ink);
  background:
    linear-gradient(135deg, rgba(7,17,31,.97), rgba(19,36,59,.94)),
    linear-gradient(135deg, #07111f, #14243c);
  box-shadow: inset 0 -1px 0 rgba(255,255,255,.10);
}

.glass-card {
  border: 1px solid rgba(255,255,255,.15);
  border-radius: 1rem;
  background: rgba(255,255,255,.08);
  backdrop-filter: blur(10px);
}

.sidebar-card {
  position: sticky;
  top: 5.25rem;
  max-height: calc(100vh - 6rem);
  overflow: auto;
  border: 0;
  border-radius: 1rem;
}

.article-card {
  border: 0;
  border-radius: 1.15rem;
  overflow: hidden;
}

.article-top {
  color: var(--ink);
  background:
    radial-gradient(circle at 15% 0%, rgba(57,213,255,.24), transparent 18rem),
    linear-gradient(135deg, #111827, #1d2b45);
}

.text-cyan {
  color: var(--cyan);
}

.info-box {
  background: #ffffff;
  border-radius: 1rem;
  padding: 1rem;
  min-height: 100%;
}

.info-box h3 {
  font-size: 1rem;
  font-weight: 900;
}

.info-box p {
  margin: 0;
  color: #344256;
}

.article-content {
  font-size: 1.02rem;
  line-height: 1.7;
}

.article-content h1,
.article-content h2,
.article-content h3 {
  color: #0d6efd;
  font-weight: 900;
  margin-top: 1.4rem;
}

.article-content h4,
.article-content h5 {
  color: #7c3aed;
  font-weight: 800;
}

.article-content strong,
.article-content b {
  color: #198754;
}

.article-content em {
  color: #d63384;
}

.article-content a {
  color: #0dcaf0;
  font-weight: 800;
}

.article-content img,
.article-content iframe,
.article-content video {
  max-width: 100%;
  border-radius: 1rem;
}

.article-content table {
  width: 100%;
  border-collapse: collapse;
  margin: 1rem 0;
}

.article-content th,
.article-content td {
  border: 1px solid #d8e1ee;
  padding: .6rem;
}

.article-content th {
  background: #eef4ff;
  color: #0d6efd;
}

.list-group-item.active {
  background: linear-gradient(135deg, #0d6efd, #7c3aed);
  border-color: transparent;
}

@media (max-width: 991px) {
  .sidebar-card {
    position: relative;
    top: 0;
    max-height: none;
  }
}