/* ═══════════════════════════════════════════════════════════
   PULSAR — LORD OF THE RINGS THEME  (Dol Guldur)
   ═══════════════════════════════════════════════════════════ */

@import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@400;600;900&family=Cinzel+Decorative:wght@700&display=swap');

/* ── Variables ─────────────────────────────────────────────── */
:root {
  --lt-shadow:      #06050302;
  --lt-stone:       #0a0806;
  --lt-deep:        #100d09;
  --lt-panel:       #16120d;
  --lt-panel-hi:    #1e1810;
  --lt-border:      #2c2318;
  --lt-border-hi:   #3d3020;

  --lt-gold:        #c49a28;
  --lt-gold-glow:   rgba(196, 154, 40, 0.28);
  --lt-gold-dim:    rgba(196, 154, 40, 0.08);

  --lt-ember:       #c8561a;
  --lt-ember-glow:  rgba(200, 86, 26, 0.28);
  --lt-ember-dim:   rgba(200, 86, 26, 0.08);

  --lt-crimson:     #9b2020;
  --lt-crimson-glow:rgba(155, 32, 32, 0.30);

  --lt-silver:      #a09282;
  --lt-silver-glow: rgba(160, 146, 130, 0.18);
  --lt-silver-dim:  rgba(160, 146, 130, 0.07);

  --lt-moss:        #4a6b3a;
  --lt-moss-glow:   rgba(74, 107, 58, 0.20);
  --lt-moss-dim:    rgba(74, 107, 58, 0.08);

  --lt-purple:      #7a5aaa;
  --lt-purple-glow: rgba(122, 90, 170, 0.22);
  --lt-purple-dim:  rgba(122, 90, 170, 0.07);

  --lt-text:        #b0a08a;
  --lt-text-hi:     #cfc0a0;
  --lt-text-dim:    #524535;
  --lt-text-muted:  #221a10;

  --font-lt:   'Cinzel', Georgia, serif;
  --font-deco: 'Cinzel Decorative', 'Cinzel', serif;
  --font-mono: ui-monospace, SFMono-Regular, 'SF Mono', Menlo, Consolas, 'Liberation Mono', monospace;
}

/* ── Background — dark stone of Dol Guldur ─────────────────── */
html { background: var(--lt-stone); }

body {
  background:
    radial-gradient(ellipse at 30% 90%, rgba(120, 50, 10, 0.12) 0%, transparent 50%),
    radial-gradient(ellipse at 70% 10%, rgba(80, 30, 5,  0.10) 0%, transparent 45%),
    radial-gradient(ellipse at 50% 50%, rgba(30, 20, 5,  0.08) 0%, transparent 70%),
    var(--lt-stone);
  background-attachment: fixed;
  color: var(--lt-text);
  font-family: var(--font-lt);
  min-height: 100vh;
  position: relative;
}

/* ember sparks scattered across the stone */
body::before {
  content: '';
  position: fixed;
  top: 0; left: 0;
  width: 2px; height: 2px;
  pointer-events: none;
  z-index: 0;
  border-radius: 50%;
  box-shadow:
    /* warm ember sparks */
     80px 120px 2px 1px rgba(200, 100, 30, .55),
    340px  60px 2px 1px rgba(210, 120, 20, .50),
    650px 200px 2px 1px rgba(190,  80, 15, .60),
   1050px  90px 2px 1px rgba(215, 110, 25, .45),
   1380px 310px 2px 1px rgba(200,  90, 20, .55),
   1700px 140px 2px 1px rgba(205, 105, 30, .50),
    520px 480px 2px 1px rgba(195,  85, 18, .55),
    900px 600px 2px 1px rgba(210, 100, 22, .45),
   1280px 530px 2px 1px rgba(185,  75, 14, .50),
    160px 680px 2px 1px rgba(200,  95, 25, .55),
    /* medium glimmers */
     50px 200px 1px 0px rgba(180,  80, 15, .38),
    250px 380px 1px 0px rgba(190,  90, 20, .32),
    470px 260px 1px 0px rgba(175,  70, 12, .40),
    660px 550px 1px 0px rgba(195,  95, 22, .30),
    820px 350px 1px 0px rgba(185,  82, 16, .35),
   1000px 170px 1px 0px rgba(200,  98, 24, .32),
   1180px 440px 1px 0px rgba(178,  76, 14, .38),
   1360px 290px 1px 0px rgba(192,  88, 19, .30),
   1580px 510px 1px 0px rgba(188,  84, 17, .35),
   1800px 230px 1px 0px rgba(196,  92, 21, .32),
    300px 540px 1px 0px rgba(182,  78, 13, .30),
    710px 700px 1px 0px rgba(197,  93, 22, .35),
   1040px 760px 1px 0px rgba(183,  79, 15, .32),
   1440px 660px 1px 0px rgba(191,  87, 18, .28),
   1680px 730px 1px 0px rgba(199,  96, 23, .35),
    /* dim cinders */
     35px  80px 1px 0px rgba(160,  60, 10, .20),
    140px 310px 1px 0px rgba(165,  65, 12, .18),
    280px 170px 1px 0px rgba(155,  55,  8, .22),
    420px 590px 1px 0px rgba(170,  68, 13, .15),
    510px  95px 1px 0px rgba(162,  62, 11, .20),
    600px 420px 1px 0px rgba(167,  66, 12, .18),
    760px 235px 1px 0px rgba(158,  58,  9, .22),
    860px 495px 1px 0px rgba(172,  70, 14, .15),
    970px  60px 1px 0px rgba(163,  63, 11, .20),
   1060px 575px 1px 0px rgba(168,  67, 13, .18);
}

/* ── Base overrides ────────────────────────────────────────── */
* { box-sizing: border-box; }

body > * { position: relative; z-index: 1; }

h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-lt);
  letter-spacing: .06em;
  font-weight: 600;
}

.font-monospace, code, pre, .font-monospace * {
  font-family: var(--font-mono) !important;
}

/* ── Navbar ────────────────────────────────────────────────── */
.navbar {
  background: rgba(10, 8, 6, 0.94) !important;
  border-bottom: 1px solid var(--lt-border-hi) !important;
  box-shadow: 0 0 24px rgba(0,0,0,.9), 0 2px 0 var(--lt-gold-glow);
  backdrop-filter: blur(8px);
  z-index: 100;
}

.navbar-brand {
  font-family: var(--font-deco) !important;
  font-weight: 700;
  font-size: 1.1rem;
  letter-spacing: .18em;
  color: var(--lt-gold) !important;
  text-shadow: 0 0 10px var(--lt-gold), 0 0 28px rgba(196,154,40,.35);
  text-transform: uppercase;
}

.navbar-brand:hover {
  text-shadow: 0 0 16px var(--lt-gold), 0 0 40px rgba(196,154,40,.55);
}

.nav-link {
  color: var(--lt-text) !important;
  font-family: var(--font-lt);
  font-size: .72rem;
  letter-spacing: .1em;
  text-transform: uppercase;
  transition: color .2s, text-shadow .2s;
}

.nav-link:hover, .nav-link.active {
  color: var(--lt-gold) !important;
  text-shadow: 0 0 8px var(--lt-gold-glow);
}

.nav-link.active {
  color: var(--lt-gold) !important;
  text-shadow: 0 0 10px var(--lt-gold-glow);
}

.navbar-text {
  font-family: var(--font-lt);
  font-size: .64rem;
  letter-spacing: .14em;
  color: var(--lt-text-dim) !important;
  text-transform: uppercase;
}

.dropdown-menu {
  background: rgba(14, 11, 7, 0.97) !important;
  border: 1px solid var(--lt-border-hi) !important;
  box-shadow: 0 10px 40px rgba(0,0,0,.9), 0 0 0 1px var(--lt-gold-dim);
  backdrop-filter: blur(12px);
}

.dropdown-item {
  color: var(--lt-text) !important;
  font-family: var(--font-lt);
  font-size: .72rem;
  letter-spacing: .08em;
  text-transform: uppercase;
  transition: all .15s;
}

.dropdown-item:hover {
  background: var(--lt-gold-dim) !important;
  color: var(--lt-gold) !important;
}

.dropdown-item.active {
  background: var(--lt-ember-dim) !important;
  color: var(--lt-ember) !important;
}

/* ── Cards ─────────────────────────────────────────────────── */
.card {
  background: rgba(22, 18, 13, 0.88) !important;
  border: 1px solid var(--lt-border) !important;
  box-shadow: 0 4px 28px rgba(0,0,0,.7), inset 0 1px 0 rgba(196,154,40,.04);
  backdrop-filter: blur(4px);
  transition: border-color .2s, box-shadow .2s;
}

.card:hover {
  border-color: var(--lt-border-hi) !important;
}

.card-header {
  background: rgba(30, 24, 16, 0.92) !important;
  border-bottom: 1px solid var(--lt-border-hi) !important;
  font-family: var(--font-lt);
  font-size: .74rem;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--lt-text) !important;
}

.card-header .fw-semibold {
  color: var(--lt-text-hi);
}

/* ── List group ────────────────────────────────────────────── */
.list-group-item {
  background: transparent !important;
  border-color: var(--lt-border) !important;
  color: var(--lt-text);
  transition: background-color .15s;
}

.list-group-item:hover {
  background: var(--lt-gold-dim) !important;
}

/* ── Buttons ───────────────────────────────────────────────── */
.btn-outline-secondary {
  color: var(--lt-text-dim) !important;
  border-color: var(--lt-border-hi) !important;
}
.btn-outline-secondary:hover {
  background: var(--lt-border-hi) !important;
  color: var(--lt-text-hi) !important;
}

.btn-outline-info {
  color: var(--lt-silver) !important;
  border-color: var(--lt-silver) !important;
}
.btn-outline-info:hover {
  background: var(--lt-silver-dim) !important;
  box-shadow: 0 0 10px var(--lt-silver-glow);
}

.btn-outline-warning {
  color: var(--lt-gold) !important;
  border-color: var(--lt-gold) !important;
}
.btn-outline-warning:hover {
  background: var(--lt-gold-dim) !important;
  box-shadow: 0 0 12px var(--lt-gold-glow);
}

.btn-outline-danger {
  color: var(--lt-crimson) !important;
  border-color: var(--lt-crimson) !important;
}
.btn-outline-danger:hover {
  background: var(--lt-crimson-glow) !important;
  box-shadow: 0 0 10px var(--lt-crimson-glow);
}

.btn-link {
  color: var(--lt-text-dim) !important;
}
.btn-link:hover { color: var(--lt-text) !important; }

/* ── Badges ────────────────────────────────────────────────── */
.badge.bg-secondary {
  background: var(--lt-border-hi) !important;
  color: var(--lt-text) !important;
  font-family: var(--font-mono);
  font-weight: 400;
}

.badge.bg-success {
  background: rgba(74,107,58,.20) !important;
  color: var(--lt-moss) !important;
  border: 1px solid rgba(74,107,58,.30);
}

.badge.bg-warning {
  background: rgba(196,154,40,.15) !important;
  color: var(--lt-gold) !important;
  border: 1px solid rgba(196,154,40,.25);
}

.badge.bg-info {
  background: var(--lt-silver-dim) !important;
  color: var(--lt-silver) !important;
  border: 1px solid rgba(160,146,130,.22);
}

.badge.bg-danger {
  background: rgba(155,32,32,.20) !important;
  color: var(--lt-crimson) !important;
  border: 1px solid rgba(155,32,32,.30);
}

/* ── Tables ────────────────────────────────────────────────── */
.table {
  color: var(--lt-text) !important;
  border-color: var(--lt-border) !important;
}

.table > :not(caption) > * > * {
  background-color: transparent !important;
  border-color: var(--lt-border) !important;
  color: inherit;
}

.table-secondary th, thead.table-secondary th {
  background: rgba(30, 24, 16, 0.92) !important;
  color: var(--lt-text-dim) !important;
  font-family: var(--font-lt);
  font-size: .68rem;
  letter-spacing: .12em;
  text-transform: uppercase;
  border-color: var(--lt-border-hi) !important;
}

.table-hover tbody tr:hover td {
  background: var(--lt-gold-dim) !important;
}

tr.host-row:hover td {
  background: var(--lt-gold-dim) !important;
}

.bg-black {
  background: var(--lt-stone) !important;
}

/* ── Forms ─────────────────────────────────────────────────── */
.form-control {
  background: var(--lt-panel) !important;
  border: 1px solid var(--lt-border-hi) !important;
  color: var(--lt-text) !important;
  font-family: var(--font-mono);
}

.form-control:focus {
  background: var(--lt-panel-hi) !important;
  border-color: var(--lt-gold) !important;
  box-shadow: 0 0 0 3px var(--lt-gold-dim) !important;
  color: var(--lt-text-hi) !important;
}

.form-control::placeholder { color: var(--lt-text-dim) !important; }

/* ── Modals ────────────────────────────────────────────────── */
.modal-content {
  background: rgba(12, 9, 6, 0.97) !important;
  border: 1px solid var(--lt-border-hi) !important;
  box-shadow: 0 0 70px rgba(0,0,0,.95), 0 0 0 1px var(--lt-gold-dim);
  backdrop-filter: blur(16px);
}

.modal-header, .modal-footer {
  border-color: var(--lt-border-hi) !important;
}

.modal-title { font-family: var(--font-lt); letter-spacing: .1em; }

/* ── Alerts ────────────────────────────────────────────────── */
.alert-warning {
  background: rgba(196,154,40,.08) !important;
  border: 1px solid rgba(196,154,40,.22) !important;
  color: var(--lt-gold) !important;
}

/* ── Text color overrides ──────────────────────────────────── */
.text-warning  { color: var(--lt-gold) !important; }
.text-info     { color: var(--lt-silver) !important; }
.text-success  { color: var(--lt-moss) !important; }
.text-danger   { color: var(--lt-crimson) !important; }
.text-primary  { color: var(--lt-gold) !important; }
.text-purple   { color: var(--lt-purple) !important; }
.text-secondary { color: var(--lt-text-dim) !important; }
.text-light    { color: var(--lt-text-hi) !important; }

/* ── Background overrides ──────────────────────────────────── */
.bg-dark    { background: var(--lt-panel) !important; }
.bg-success { background: rgba(74,107,58,.14) !important; }
.bg-warning { background: rgba(196,154,40,.12) !important; }
.bg-danger  { background: rgba(155,32,32,.15) !important; }
.bg-purple  { background: rgba(122,90,170,.14) !important; }

/* ── Badge color variants ──────────────────────────────────── */
.badge.bg-purple {
  background: rgba(122,90,170,.20) !important;
  color: var(--lt-purple) !important;
  border: 1px solid rgba(122,90,170,.30);
}

/* ── Border overrides ──────────────────────────────────── */
.border-secondary { border-color: var(--lt-border) !important; }

/* ── Scrollbar ─────────────────────────────────────────────── */
::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-track { background: var(--lt-stone); }
::-webkit-scrollbar-thumb { background: var(--lt-border-hi); border-radius: 3px; }
::-webkit-scrollbar-thumb:hover { background: var(--lt-gold); }

/* ── Code / Pre ────────────────────────────────────────────── */
pre {
  background: rgba(6, 5, 3, 0.85) !important;
  border: 1px solid var(--lt-border-hi) !important;
  border-radius: 4px;
}

.hljs { background: transparent !important; }

/* ── Spinner ───────────────────────────────────────────────── */
.spinner-border { color: var(--lt-gold) !important; }

/* ── Misc ──────────────────────────────────────────────────── */
.toggle-btn { padding: .1rem .35rem; }

.navbar-toggler {
  border-color: var(--lt-border-hi) !important;
}

hr { border-color: var(--lt-border-hi) !important; }

/* Selection */
::selection {
  background: var(--lt-gold-dim);
  color: var(--lt-gold);
}

/* ── Markdown body ─────────────────────────────────────────── */
.md-body { line-height: 1.6; }
.md-body h1, .md-body h2 { color: var(--lt-gold); font-size: 1rem; font-weight: 600; text-transform: uppercase; letter-spacing: .06em; margin-top: 1.5rem; margin-bottom: .75rem; padding-bottom: .3rem; border-bottom: 1px solid rgba(196,154,40,.15); }
.md-body h1:first-child, .md-body h2:first-child { margin-top: 0; }
.md-body h3 { color: var(--lt-text-hi); font-size: .9rem; font-weight: 600; margin-top: 1.2rem; margin-bottom: .5rem; }
.md-body p { color: var(--lt-text); font-size: .875rem; }
.md-body a { color: var(--lt-silver); }
.md-body strong { color: var(--lt-text-hi); }
.md-body code { background: rgba(255,255,255,.05); padding: .1em .35em; border-radius: .2rem; font-size: .82rem; color: var(--lt-gold); }
.md-body pre { background: var(--lt-stone) !important; border: 1px solid var(--lt-border-hi) !important; border-radius: .375rem; padding: 1rem; overflow-x: auto; margin: .75rem 0; }
.md-body pre code { background: none; border: none; padding: 0; color: var(--lt-text-hi); font-size: .8rem; }
.md-body blockquote { border-left: 3px solid var(--lt-border-hi); padding-left: 1em; color: var(--lt-text-dim); margin-left: 0; }
.md-body table { width: 100%; border-collapse: collapse; font-size: .85rem; margin: .75rem 0; }
.md-body th { color: var(--lt-text-dim); font-weight: 600; text-transform: uppercase; font-size: .75rem; letter-spacing: .05em; padding: .4rem .75rem; border-bottom: 1px solid rgba(196,154,40,.15); }
.md-body td { color: var(--lt-text); padding: .35rem .75rem; border-bottom: 1px solid rgba(255,255,255,.04); font-size: .82rem; }
.md-body td code { font-size: .78rem; }
.md-body hr { border-color: rgba(196,154,40,.10); margin: 1.5rem 0; }
.md-body ul, .md-body ol { color: var(--lt-text); font-size: .875rem; padding-left: 1.5rem; }
.md-body li { margin-bottom: .25rem; }
.md-body img { max-width: 100%; }