/* =====================================================================
   Vahcyn Studio — VGen flavor, dark mode. Loaded after vgen.css;
   html has classes "vg vgd". Light-purple pop buttons keep their black
   outline; everything else outlines in near-white on dark surfaces.
   ===================================================================== */
html.vg.vgd{
  --a-bg:#121114;--a-chrome:#1A181D;--a-band:#1C1A1F;--a-tile:#141216;--a-raise:#27242B;
  --a-line:#2E2B33;--a-line2:#3D3943;--a-slate:#77727F;--a-ash:#A29DAA;--a-text:#F4F2F6;
  --a-ink:#141216;--a-edge:#F4F2F6;--a-link:var(--t4);--a-ok:#34C46A;
  --a-tint:color-mix(in srgb,var(--t2) 30%,#1C1A1F);
  background:#121114;color-scheme:dark
}
/* navigation */
.vgd .vn{background:rgba(18,17,20,.95)!important;border-bottom:1px solid var(--a-line)!important}
.vgd .vn.vn-hero{background:rgba(18,17,20,.95)!important}
.vgd .vn-av{box-shadow:0 0 0 2px var(--a-edge)}
.vgd .vn-btn{border-color:var(--a-edge)!important;color:var(--a-text)!important}
.vgd .vn-ham i{background:var(--a-edge)!important}
@media (max-width:900px){.vgd .vn-a.on{color:var(--t4)!important}}
/* buttons */
.vgd .b1:hover,.vgd .hb1:hover,.vgd .rq:hover,.vgd .fm .go:hover,.vgd .vn-a.vn-cta:hover{box-shadow:0 3px 0 var(--a-edge)!important}
.vgd .b2,.vgd .hb2{background:var(--a-band)!important;border:2px solid var(--a-edge)!important;color:var(--a-text)!important}
.vgd .b2:hover,.vgd .hb2:hover{background:var(--a-band)!important;color:var(--a-text)!important;box-shadow:0 3px 0 var(--a-edge)!important}
.vgd .qkofi{background:var(--a-band)!important;border:2px solid var(--a-edge)!important;color:var(--a-text)!important}
.vgd .more,.vgd .cl a,.vgd .qfine a,.vgd .qsv span,.vgd .spr b.plus,.vgd .pfe,.vgd .spc small,.vgd .spc h3 small,.vgd .spc h3 span,.vgd .qreset{color:var(--t4)!important}
/* chips, tiles, selected states */
.vgd .pcats:not(.svt) button{background:var(--a-band)!important;box-shadow:inset 0 0 0 1px var(--a-line2)!important;color:var(--a-text)!important}
.vgd .pcats:not(.svt) button:hover{background:var(--a-band)!important;box-shadow:inset 0 0 0 2px var(--a-edge)!important}
.vgd .pcats:not(.svt) button.on{background:var(--a-edge)!important;color:var(--a-ink)!important}
.vgd .pcats:not(.svt) button.on small{color:rgba(20,18,22,.6)!important}
.vgd .pg-l:hover,.vgd .pfp .pcats.svt button:hover{background:var(--a-band)!important;box-shadow:inset 0 0 0 2px var(--a-edge)!important}
.vgd .pfp .pcats.svt button.on{background:var(--a-tint)!important;box-shadow:inset 0 0 0 2px var(--a-edge)!important}
.vgd .vq-opt.on,.vgd .vq-opt:hover{box-shadow:inset 0 0 0 2px var(--a-edge)!important}
.vgd .vq-opt.on::after{background:var(--a-pop)!important;color:var(--a-ink)!important}
.vgd .qa.on{background:var(--a-tint)!important;box-shadow:inset 0 0 0 2px var(--a-edge)!important}
.vgd .qa.on .qtg{background:var(--a-pop)!important}
.vgd .qtg{background:#3D3943!important}
.vgd .qbar{background:rgba(28,26,31,.97)!important;box-shadow:inset 0 0 0 2px var(--a-edge)!important}
/* cards */
.vgd .pc .fr,.vgd .pfp .pc .fr{background:var(--a-band)!important}
.vgd .pc:hover .fr{box-shadow:inset 0 0 0 2px var(--a-edge)}
.vgd .ab2-stats div{background:rgba(28,26,31,.92)!important}
.vgd .ab2-lead,.vgd .rv-bub blockquote{color:#D9D5DE!important}
.vgd .ab2-av b{color:var(--a-text)!important}
.vgd .rv-masonry::after,.vgd .rv-grid::after{background:linear-gradient(rgba(18,17,20,0),#121114)!important}
.vgd .rv-stars svg,.vgd .rv-stars path{fill:var(--t4)!important;color:var(--t4)!important}
.vgd .qu-st{background:var(--a-band)!important;box-shadow:inset 0 0 0 2px var(--a-edge)!important}
.vgd .qu-st.is-open{background:color-mix(in srgb,var(--a-ok) 16%,#1C1A1F)!important}
.vgd .abshade{background:linear-gradient(270deg,#121114 0%,rgba(18,17,20,.92) 46%,rgba(18,17,20,0) 72%)!important}
@media (max-width:900px){.vgd .abshade{background:rgba(18,17,20,.78)!important}}
/* forms and modals */
.vgd .fm input,.vgd .fm textarea,.vgd .fm select,.vgd .fm input:focus,.vgd .fm textarea:focus{background:var(--a-tile)!important;border-color:var(--a-line2)!important}
.vgd .modal{background:rgba(0,0,0,.72)!important}

/* text on light-purple fills stays dark */
.vgd .rv-b figcaption .rv-av,.vg .rv-b figcaption .rv-av{color:var(--a-ink)!important}
.vgd .vn-a.vn-cta,.vgd .vn-a.vn-cta.on{color:var(--a-ink)!important}
html.vg.vgd{--a-dot:rgba(255,255,255,.075)}
html.vg.vgd{--a-cur:var(--t4)}