/* ===== VAELINYA — palette + auras (Cassiopeia child) ===== */
:root{
--bg:#0B0B10; --panel:#121219; --text:#F2F3F5; --text-2:#C9CDD6; --chalk:#D1D3D8;
--brand:#5A3EA3;
--liny-base:#DFAE3B; --liny-hover:#F2C45A; --liny-aura:rgba(223,174,59,.25);
--elar-base:#8D63E6; --elar-hover:#A07DF0; --elar-aura:rgba(141,99,230,.25);
--vae-base:#2BBF87; --vae-hover:#48D4A0; --vae-aura:rgba(43,191,135,.22);
--nyth-base:#C2473A; --nyth-hover:#D35F52; --nyth-aura:rgba(194,71,58,.22);
--com-base:#5B7DA6; --com-hover:#6F92BA; --com-aura:rgba(91,125,166,.22);
}
html, body { background: var(--bg); color: var(--text); }
.container-component, .item-page, main[role="main"] { background: transparent; }


/* Buttons */
.btn, button, .mod-articles-category-introtext a.btn { border-radius:999px; border:1px solid rgba(255,255,255,.14); background:transparent; color:var(--text); }
.btn:hover{ color:var(--text); filter:brightness(1.08); }


/* Auras on the main content area */
.v-com .container-component,.v-com .item-page{ background: linear-gradient(var(--com-aura), var(--com-aura)), var(--bg); border-radius:12px; padding:2rem; }
.v-liny .container-component,.v-liny .item-page{ background: linear-gradient(var(--liny-aura),var(--liny-aura)),var(--bg); border-radius:12px; padding:2rem; }
.v-elar .container-component,.v-elar .item-page{ background: linear-gradient(var(--elar-aura),var(--elar-aura)),var(--bg); border-radius:12px; padding:2rem; }
.v-vae .container-component,.v-vae .item-page{ background: linear-gradient(var(--vae-aura), var(--vae-aura)), var(--bg); border-radius:12px; padding:2rem; }
.v-nyth .container-component,.v-nyth .item-page{ background: linear-gradient(var(--nyth-aura),var(--nyth-aura)),var(--bg); border-radius:12px; padding:2rem; }


/* Realm-flavoured headings/links */
.v-com h1, .v-com h2, .v-com h3 { color: var(--com-base); }
.v-liny h1, .v-liny h2, .v-liny h3 { color: var(--liny-base); }
.v-elar h1, .v-elar h2, .v-elar h3 { color: var(--elar-base); }
.v-vae h1, .v-vae h2, .v-vae h3 { color: var(--vae-base); }
.v-nyth h1, .v-nyth h2, .v-nyth h3 { color: var(--nyth-base); }
.v-com a { color: var(--com-base); } .v-com a:hover{ color: var(--com-hover); }
.v-liny a { color: var(--liny-base);} .v-liny a:hover{ color: var(--liny-hover); }
.v-elar a { color: var(--elar-base);} .v-elar a:hover{ color: var(--elar-hover); }
.v-vae a { color: var(--vae-base);} .v-vae a:hover{ color: var(--vae-hover); }
.v-nyth a { color: var(--nyth-base);} .v-nyth a:hover{ color: var(--nyth-hover); }


/* Chamber wrapper (optional extra class you can place on <main>) */
.chamber{ position:relative; border-radius:12px; padding:2rem; }


/* Reading typography */
.item-page p { line-height:1.75; margin: 0 0 1.1rem; }
.item-page blockquote { border-left:3px solid rgba(255,255,255,.2); padding: .5rem 1rem; color: var(--text-2); }
.item-page hr { border-color: rgba(255,255,255,.12); }


/* Progress bar */
#reading-progress { position: fixed; left:0; top:0; height: 3px; width:0; background: var(--brand); z-index: 9999; }


/* Cards for category blog */
.vae-card{ background: rgba(255,255,255,.03); border:1px solid rgba(255,255,255,.1); border-radius:12px; padding:1rem; height:100%; }
.vae-card h2 a{ text-decoration:none; }
.vae-meta{ font-size:.9rem; color: var(--text-2); }