/* Written by 7lr. Approved Wilderness homepage skin. Original Vexor layout retained. */
/* Written by 7lr. Visual skins over the retained Vexor homepage layout.
   No section, grid, placement, spacing or artwork dimensions are changed here. */
html:root {
  --skin-page:#101011; --skin-panel:#222123; --skin-raised:#38282b;
  --skin-header:#20191a; --skin-foot:#141113; --skin-edge:#554744;
  --skin-accent:#bd7562; --skin-title:#f0d5b3; --skin-text:#e3d8cb;
  --skin-muted:#b9aca2; --skin-gold:#e3bf80; --skin-top:#dabc7c;
  --skin-bottom:#b08a47; --skin-button-text:#231a10;
  --skin-wash:#8c4c4025; --skin-stone:#101011e8; --skin-glow:#a4634833;
  --skin-hero:#27131655; --skin-texture-opacity:.36;
}
html:root { --ink:var(--skin-page); --surface:var(--skin-panel); --text:var(--skin-text); --muted:var(--skin-muted); --border:var(--skin-edge); --gold:var(--skin-gold); }
html:root body { background:var(--skin-page); color:var(--skin-text); }
html:root body::before { background:linear-gradient(var(--skin-stone),var(--skin-stone)),url('assets/obsidian-continuous.png') center/cover no-repeat; opacity:var(--skin-texture-opacity); }
html:root ::selection { background:var(--skin-accent); color:var(--skin-page); }
html:root .site-header { background:linear-gradient(180deg,var(--skin-raised),var(--skin-header)); border-color:var(--skin-edge); box-shadow:0 5px 24px #0005,inset 0 1px #e3bf8014; }
html:root .nav-shell nav :is(a,.nav-link) { color:var(--skin-text); font-family:Arial,Helvetica,sans-serif; text-shadow:none; }
html:root .nav-shell nav :is(a,.nav-link):is(:hover,:focus-visible) { color:var(--skin-gold); text-shadow:0 0 12px var(--skin-glow); }
html:root .living-hero::after { background:radial-gradient(ellipse at 50% 43%,#0e0b10a1 0%,var(--skin-hero) 48%,transparent 80%),linear-gradient(180deg,var(--skin-hero),transparent 35%,var(--skin-hero)); }
html:root :is(.hero-tagline,.section-heading h2,.card-caption h3,dialog h2) { font-family:Arial,Helvetica,sans-serif; font-weight:700; color:var(--skin-title); }
html:root .hero-tagline { text-shadow:0 2px 8px #000; }
html:root .hero-intro { color:#ede3d9; }
html:root .community-launch-note { color:var(--skin-title); }
html:root .community-launch-note span { color:#d5c8bb; }
html:root .button { font-family:Arial,Helvetica,sans-serif; font-weight:700; letter-spacing:.8px; text-shadow:none; border-radius:3px; background-size:100% 100%; background-position:center; box-shadow:inset 0 0 0 1px var(--skin-edge),inset 0 2px #fff1d519,0 3px 7px #0004; filter:none; }
html:root .button-primary { color:var(--skin-button-text); background:linear-gradient(var(--skin-top),var(--skin-bottom)); box-shadow:inset 0 0 0 1px var(--skin-top),inset 0 2px #fff1d550,0 3px 7px #0005; }
html:root .button-outline { color:var(--skin-title); background:linear-gradient(var(--skin-raised),var(--skin-header)); }
html:root .button:is(:hover,:focus-visible) { color:var(--skin-title); background:linear-gradient(var(--skin-raised),var(--skin-header)); filter:brightness(1.14); text-shadow:none; box-shadow:inset 0 0 0 1px var(--skin-accent),0 0 20px var(--skin-glow); }
html:root .button-primary:is(:hover,:focus-visible) { color:var(--skin-button-text); background:linear-gradient(var(--skin-top),var(--skin-bottom)); }
html:root :is(button,a):focus-visible { outline-color:var(--skin-gold); }
html:root .section-heading h2::before { background:linear-gradient(90deg,transparent,var(--skin-edge)); }
html:root .section-heading h2::after { background:linear-gradient(90deg,var(--skin-edge),transparent); }
html:root .adventure-card { color:var(--skin-title); }
html:root .adventure-card .scene { border-color:var(--skin-edge); background:var(--skin-panel); box-shadow:0 0 0 3px var(--skin-page),0 0 0 4px var(--skin-edge),0 7px 22px #0005; }
html:root .adventure-card .scene::before { border-color:#e6c99733; }
html:root .adventure-card .scene::after { background:radial-gradient(ellipse 28px 10px at 50% 0%,var(--skin-glow),transparent),radial-gradient(ellipse 28px 10px at 50% 100%,var(--skin-glow),transparent); }
html:root .adventure-card:is(:hover,:focus-visible)::after { border-color:var(--skin-accent); }
html:root .card-ornament { color:var(--skin-accent); }
html:root .card-ornament::before,html:root .card-ornament::after { background:linear-gradient(90deg,transparent,var(--skin-edge)); }
html:root .community-inner { background:radial-gradient(ellipse at 50% 0,var(--skin-wash),transparent 80%),linear-gradient(110deg,var(--skin-panel),var(--skin-header)); border-color:var(--skin-edge); box-shadow:inset 0 3px var(--skin-accent),0 12px 35px #0002; }
html:root .community-inner .section-heading :is(.eyebrow,h2) { color:var(--skin-title); }
html:root .community-inner .section-heading p { color:var(--skin-muted); }
html:root .community-account-register { color:var(--skin-gold); }
html:root .community-account-register:is(:hover,:focus-visible) { color:var(--skin-title); text-shadow:none; }
html:root footer { background:var(--skin-foot); border-color:var(--skin-edge); }
html:root .footer-inner { color:var(--skin-muted); }
html:root .footer-inner p,html:root .footer-links :is(a,.text-button),html:root .footer-bottom>a { color:var(--skin-muted); }
html:root .footer-links h2 { font-family:Arial,Helvetica,sans-serif; font-weight:700; color:var(--skin-title); }
html:root .footer-links :is(a,.text-button):is(:hover,:focus-visible),html:root .footer-bottom>a:hover { color:var(--skin-gold); text-shadow:none; }
html:root .footer-bottom { border-color:var(--skin-edge); }
html:root :is(.menu-toggle,.scenery-controls button) { background:var(--skin-header); border-color:var(--skin-edge); color:var(--skin-title); font-family:Arial,Helvetica,sans-serif; }
html:root .scenery-controls button:is(:hover,[aria-pressed=true]) { background:var(--skin-raised); border-color:var(--skin-accent); color:var(--skin-title); }
html:root dialog { background:linear-gradient(120deg,var(--skin-panel),var(--skin-header)); border-color:var(--skin-edge); box-shadow:inset 0 3px var(--skin-accent),0 20px 100px #000c; }
html:root dialog :is(p,li) { color:var(--skin-text); }
html:root .dialog-close { color:var(--skin-title); }
html:root .dialog-close:hover { background:var(--skin-raised); color:var(--skin-gold); box-shadow:none; text-shadow:none; }
@media(max-width:760px) { html:root .nav-shell nav { background:var(--skin-header); border-color:var(--skin-edge); } }