/* ============================================================
   LonePortal - Necromancer (Halloween event theme)
   ------------------------------------------------------------
   Loaded by includes/lp_sitetheme.php only when this theme is
   showing, and every rule is scoped under html.lp-st-necromancer
   so nothing here can leak onto a page that is not wearing it.

   The look: the Win98 grey becomes weathered tombstone grey, the
   white panels become old parchment, and the chrome around the page
   (title bar, menus, header, nav, footer) goes dark as a crypt with
   grave moss green for the accents. Content colours stay dark on
   light so every page that was readable before is readable now.

   Graphics live in art/ and icons/ next to this file. See
   GRAPHICS.txt in the same folder for every file, its size, where
   it shows and how big it is drawn.

   Upload to: public_html/assets/themes/necromancer/necromancer.css
   ============================================================ */

/* ── PIXEL ART SWITCH ─────────────────────────────────────────
   Every graphic ships as small 1x pixel art and is scaled up here.
   These lines keep the pixels sharp. If you replace the art with
   smooth, painted, full size images, delete this block and they
   will scale softly instead. */
html.lp-st-necromancer #site-header,
html.lp-st-necromancer #site-wrapper,
html.lp-st-necromancer #featured-box,
html.lp-st-necromancer #lpst-back div,
html.lp-st-necromancer .lpst-deco span,
html.lp-st-necromancer #lpst-cemetery,
html.lp-st-necromancer #lpst-cemetery div,
html.lp-st-necromancer .lp-st-ico {
    image-rendering: -moz-crisp-edges;
    image-rendering: pixelated;
    -ms-interpolation-mode: nearest-neighbor;
}

/* ── Palette ──────────────────────────────────────────────────
   main.css draws most of the site from these variables, so
   changing them here recolours a lot of it in one go. */
html.lp-st-necromancer {
    --win-grey:       #a39d90;
    --win-grey-dark:  #5f594f;
    --win-border-l:   #d8d1bf;
    --win-border-d:   #3f3a33;
    --panel-bg:       #ece4cc;
    --text-link:      #6e1a14;
    --text-visited:   #5c2a66;
    --aol-yellow:     #a6e86a;
    --aol-orange:     #c8502c;
    --aol-blue:       #2e4a1c;
    --aol-blue-light: #4e7a2a;
    --aol-blue-dark:  #16240d;
    --bg-page:        #07080c;
    scrollbar-color: #5f594f #16141a;
}

/* ── The night behind the page ──────────────────────────────── */
html.lp-st-necromancer body {
    background-color: #07080c !important;
    background-image: url(art/stars.gif), linear-gradient(to bottom, #050609 0%, #0a0d12 42%, #111914 70%, #1c2820 88%, #27332a 100%) !important;
    background-repeat: repeat, no-repeat !important;
    background-size: 192px 192px, 100% 100% !important;
    background-attachment: fixed, fixed !important;
    padding-bottom: 170px;
}
html.lp-st-necromancer a:hover { color: #3f6b1f; }

/* ── Site wrapper: a slab of old tombstone ──────────────────── */
html.lp-st-necromancer #site-wrapper {
    background-color: #a39d90;
    background-image: url(art/stone-tile.png);
    background-size: 96px 96px;
    border-color: #d8d1bf #2a2620 #2a2620 #d8d1bf;
    box-shadow: 0 0 0 1px #000, 0 0 44px rgba(166,232,106,.10), 8px 10px 30px rgba(0,0,0,.85);
}

/* ── IE chrome ──────────────────────────────────────────────── */
/* A few sections (the forum page, the card game, the library and
   reading room) force their own chrome with !important. During an
   event the chrome rules below carry !important too, and being more
   specific they win, so every page gets the same crypt around it.
   Each section keeps its own content colours inside. */
html.lp-st-necromancer #ie-titlebar {
    background: linear-gradient(to right, #0b0a0d 0%, #1b2614 45%, #3f6a22 82%, #5f9a34 100%) !important;
    color: #efe9d6 !important;
    text-shadow: 1px 1px 0 #000 !important;
}
html.lp-st-necromancer #ie-titlebar .title-left a { color: #efe9d6 !important; }
html.lp-st-necromancer #ie-titlebar .win-btn {
    background: #3a3740;
    border-color: #6a6674 #111014 #111014 #6a6674;
    color: #e8e0c8;
    text-shadow: none;
}

html.lp-st-necromancer #ie-menubar {
    background: #1c1a20 !important;
    border-bottom-color: #0a090c !important;
    color: #e8e0c8 !important;
}
html.lp-st-necromancer #ie-menubar .ie-menu-item { color: #e8e0c8 !important; }
html.lp-st-necromancer #ie-menubar .ie-menu-item:hover {
    background: #2e4a1c !important;
    color: #f4f0e2 !important;
    border-color: #0f160a #5f8a3c #5f8a3c #0f160a !important;
}
/* The login text on the right of the menu bar is coloured inline for a
   grey bar. These keep it readable on the dark one. */
html.lp-st-necromancer #ie-menubar span[style*="color:#000080"] { color: #a6e86a !important; }
html.lp-st-necromancer #ie-menubar a[style*="color:#003399"]    { color: #d8d0b8 !important; }
html.lp-st-necromancer #ie-menubar a[style*="color:#CC0000"]    { color: #ff7a66 !important; }

/* Dropdowns stay light so the alert rows, which carry inline colours, read fine. */
html.lp-st-necromancer .ie-dropdown {
    background: #e9e1c9;
    border-color: #fbf6e6 #5f594f #5f594f #fbf6e6;
    box-shadow: 3px 3px 0 rgba(0,0,0,.45);
}
html.lp-st-necromancer .ie-dropdown a { color: #1b1510; }
html.lp-st-necromancer .ie-dropdown a:hover { background: #2e4a1c; color: #f4f0e2 !important; }
html.lp-st-necromancer .ie-dropdown-header { color: #6b6250; border-bottom-color: #b7ad93; }
html.lp-st-necromancer .ie-dropdown-sep { border-top-color: #b7ad93; }
html.lp-st-necromancer #lp-alerts-dropdown .ie-dropdown-header a { color: #6e1a14 !important; }

html.lp-st-necromancer #star-btn { color: #d8d0b8; }
html.lp-st-necromancer #star-btn:hover { background: #2c2a31; border-color: #4a4652; }
html.lp-st-necromancer #star-btn.favorited { color: #ffd24a; text-shadow: 0 0 6px rgba(255,210,74,.6); }

html.lp-st-necromancer #ie-addressbar {
    background: #1c1a20 !important;
    border-bottom-color: #0a090c !important;
    color: #e8e0c8 !important;
}
html.lp-st-necromancer #ie-addressbar input[type=text] {
    background: #0b0c0a !important;
    color: #a6e86a !important;
    border-color: #050505 #4a4652 #4a4652 #050505 !important;
    font-family: 'Courier New', monospace;
}
html.lp-st-necromancer #ie-addressbar .ie-btn {
    background: #3a3740 !important;
    color: #e8e0c8 !important;
    border-color: #6a6674 #111014 #111014 #6a6674 !important;
}
html.lp-st-necromancer #ie-addressbar .ie-btn:active { border-color: #111014 #6a6674 #6a6674 #111014; }

/* ── Header: a graveyard at night ───────────────────────────── */
html.lp-st-necromancer #site-header {
    position: relative;
    overflow: hidden;
    min-height: 124px;
    background-color: #0a0d12 !important;
    background-image: url(art/graveyard-far.png), url(art/stars.gif), linear-gradient(to bottom, #05060a 0%, #0c1117 55%, #1d2a22 100%) !important;
    background-repeat: repeat-x, repeat, no-repeat !important;
    background-position: -330px 100%, 0 0, 0 0 !important;
    background-size: 768px 160px, 192px 192px, 100% 100% !important;
    border-bottom: 3px solid #5fa33a !important;
    box-shadow: inset 0 -1px 0 #16240d !important;
}
html.lp-st-necromancer #site-header > div { position: relative; z-index: 2; }
html.lp-st-necromancer #site-header > div.lpst-deco { position: absolute; z-index: 1; }
html.lp-st-necromancer #site-logo {
    color: #e8e0c8 !important;
    text-shadow: 3px 3px 0 #000, 0 0 12px rgba(166,232,106,.35) !important;
}
html.lp-st-necromancer #site-logo span {
    color: #a6e86a !important;
    text-shadow: 3px 3px 0 #000, 0 0 14px rgba(166,232,106,.7) !important;
}
html.lp-st-necromancer #site-logo-sub { color: #c9bf9f !important; text-shadow: 1px 1px 0 #000 !important; }
html.lp-st-necromancer #header-user  { color: #a6e86a; text-shadow: 1px 1px 0 #000; }
html.lp-st-necromancer #header-clock { color: #d8d0b8; text-shadow: 1px 1px 0 #000; }
html.lp-st-necromancer #header-right a { color: #a6e86a; }

/* Decorations dropped into the header by necromancer.js */
html.lp-st-necromancer .lpst-deco {
    position: absolute; top: 0; left: 0; right: 0; bottom: 0;
    z-index: 1; pointer-events: none; overflow: hidden;
}
html.lp-st-necromancer .lpst-deco span { position: absolute; display: block; }
html.lp-st-necromancer .lpst-hmoon {
    top: 10px; right: 230px; width: 80px; height: 80px;
    background: url(art/moon.png) 0 0 / 80px 80px no-repeat;
    border-radius: 50%;
    box-shadow: 0 0 24px 5px rgba(214,52,30,.28), 0 0 56px 14px rgba(140,14,10,.12);
    -webkit-animation: lpstMoonPulseSm 4.5s ease-in-out infinite alternate;
    animation: lpstMoonPulseSm 4.5s ease-in-out infinite alternate;
}
/* The blood moon's red glow breathes slowly in and out. */
@-webkit-keyframes lpstMoonPulseSm {
    from { box-shadow: 0 0 24px 5px rgba(214,52,30,.28), 0 0 56px 14px rgba(140,14,10,.12); }
    to   { box-shadow: 0 0 38px 12px rgba(232,62,34,.50), 0 0 84px 24px rgba(160,18,12,.22); }
}
@keyframes lpstMoonPulseSm {
    from { box-shadow: 0 0 24px 5px rgba(214,52,30,.28), 0 0 56px 14px rgba(140,14,10,.12); }
    to   { box-shadow: 0 0 38px 12px rgba(232,62,34,.50), 0 0 84px 24px rgba(160,18,12,.22); }
}
html.lp-st-necromancer .lpst-web {
    top: 0; width: 68px; height: 68px;
    background: url(art/cobweb.png) 0 0 / 68px 68px no-repeat;
    opacity: .8;
}
html.lp-st-necromancer .lpst-web-l { left: 0; }
html.lp-st-necromancer .lpst-web-r {
    right: 0;
    -webkit-transform: scaleX(-1); -ms-transform: scaleX(-1); transform: scaleX(-1);
}
html.lp-st-necromancer .lpst-spider {
    top: 0; right: 36px; width: 32px; height: 46px;
    -webkit-animation: lpstDangle 11s ease-in-out infinite;
    animation: lpstDangle 11s ease-in-out infinite;
}
html.lp-st-necromancer .lpst-spider i {
    position: absolute; left: 15px; top: 0; bottom: 24px; width: 1px;
    background: rgba(216,211,194,.55);
}
html.lp-st-necromancer .lpst-spider b {
    position: absolute; left: 0; bottom: 0; width: 32px; height: 32px;
    background: url(art/spider.gif) 0 0 / 32px 32px no-repeat;
}
html.lp-st-necromancer .lpst-crow {
    bottom: 3px; right: 38%; width: 32px; height: 32px;
    background: url(art/crow.gif) 0 0 / 32px 32px no-repeat;
    -webkit-animation: lpstLook 9s steps(1) infinite;
    animation: lpstLook 9s steps(1) infinite;
}
html.lp-st-necromancer .lpst-bat {
    top: 26px; left: -60px; width: 32px; height: 32px;
    background: url(art/bat.gif) 0 0 / 32px 32px no-repeat;
    -webkit-animation: lpstFly 30s linear 4s infinite;
    animation: lpstFly 30s linear 4s infinite;
}
html.lp-st-necromancer.lp-st-no-critters .lpst-web,
html.lp-st-necromancer.lp-st-no-critters .lpst-spider,
html.lp-st-necromancer.lp-st-no-critters .lpst-crow,
html.lp-st-necromancer.lp-st-no-critters .lpst-bat { display: none; }

@-webkit-keyframes lpstDangle { 0%,100% { height: 46px; } 40% { height: 80px; } 60% { height: 74px; } }
@keyframes lpstDangle         { 0%,100% { height: 46px; } 40% { height: 80px; } 60% { height: 74px; } }
@-webkit-keyframes lpstLook { 0% { -webkit-transform: scaleX(1); } 70% { -webkit-transform: scaleX(-1); } 85% { -webkit-transform: scaleX(1); } }
@keyframes lpstLook         { 0% { transform: scaleX(1); } 70% { transform: scaleX(-1); } 85% { transform: scaleX(1); } }
@-webkit-keyframes lpstFly {
    0%   { left: -60px; top: 30px; }
    10%  { top: 14px; }
    20%  { top: 34px; }
    30%  { top: 18px; }
    40%  { left: 104%; top: 26px; }
    100% { left: 104%; top: 26px; }
}
@keyframes lpstFly {
    0%   { left: -60px; top: 30px; }
    10%  { top: 14px; }
    20%  { top: 34px; }
    30%  { top: 18px; }
    40%  { left: 104%; top: 26px; }
    100% { left: 104%; top: 26px; }
}

/* ── Marquee ────────────────────────────────────────────────── */
html.lp-st-necromancer #marquee-strip {
    background: #050605 !important;
    color: #a6e86a !important;
    text-shadow: 0 0 6px rgba(166,232,106,.55) !important;
    border-top-color: #16240d !important;
    border-bottom-color: #16240d !important;
}
html.lp-st-necromancer #marquee-strip a { color: #e8e0c8; }

/* ── Main nav ───────────────────────────────────────────────── */
html.lp-st-necromancer #main-nav {
    background: linear-gradient(180deg, #2a2730 0%, #16141a 100%) !important;
    border-top: 1px solid #3d3944 !important;
    border-bottom: 2px solid #5fa33a !important;
}
html.lp-st-necromancer #main-nav ul li a {
    color: #e8e0c8 !important;
    border-right-color: #0c0b0e !important;
    box-shadow: inset 1px 0 0 #3a3640 !important;
}
html.lp-st-necromancer #main-nav ul li a:hover,
html.lp-st-necromancer #main-nav ul li a.active {
    background: #a6e86a !important;
    color: #0b0c08 !important;
    box-shadow: none;
}
html.lp-st-necromancer #main-nav ul li.has-dropdown .nav-dropdown {
    background: #141317;
    border-color: #5fa33a;
}
html.lp-st-necromancer #main-nav ul li.has-dropdown .nav-dropdown a {
    color: #e8e0c8 !important;
    border-bottom-color: #2a2730 !important;
}
html.lp-st-necromancer #main-nav ul li.has-dropdown .nav-dropdown a:hover {
    background: #a6e86a !important;
    color: #0b0c08 !important;
}
html.lp-st-necromancer #lp-nav-toggle {
    background: linear-gradient(180deg, #2a2730, #16141a);
    border-color: #0c0b0e;
    color: #e8e0c8;
}

/* ── Homepage search strip ──────────────────────────────────── */
html.lp-st-necromancer #search-bar {
    background: #2a2730;
    border-bottom-color: #0c0b0e;
    color: #e8e0c8;
}
html.lp-st-necromancer #search-bar a { color: #a6e86a; }
html.lp-st-necromancer #search-bar input[type=text] {
    background: #f1ead6;
    border: 2px solid;
    border-color: #0c0b0e #6a6674 #6a6674 #0c0b0e;
}
html.lp-st-necromancer #search-bar input[type=submit],
html.lp-st-necromancer #search-bar select {
    background: #3a3740;
    color: #e8e0c8;
    border-color: #6a6674 #111014 #111014 #6a6674;
}
html.lp-st-necromancer #search-bar .visitors { color: #b5ab8e; }
html.lp-st-necromancer #search-bar .visitors strong { color: #ff7a66; }

/* ── Columns and panels ─────────────────────────────────────── */
html.lp-st-necromancer #main-layout { background: transparent; }
html.lp-st-necromancer #sidebar-left  { border-right-color: #5f594f; }
html.lp-st-necromancer #sidebar-right { border-left-color:  #5f594f; }

html.lp-st-necromancer .win-panel {
    background: #a39d90;
    border-color: #d8d1bf #3f3a33 #3f3a33 #d8d1bf;
    box-shadow: 1px 1px 0 #1b1814;
}
html.lp-st-necromancer .win-panel-title {
    background: linear-gradient(to right, #121015 0%, #22301a 60%, #3f6a22 100%);
    color: #efe9d6;
    text-shadow: 1px 1px 0 #000;
}
html.lp-st-necromancer .win-panel-title a { color: #cfe8b0; }
html.lp-st-necromancer .win-panel-body { background: #ece4cc; color: #1b1510; }
html.lp-st-necromancer .win-panel-body a { color: #6e1a14; }
html.lp-st-necromancer .win-panel-body a:before { color: #4e7a2a; }
html.lp-st-necromancer .win-panel-body a:hover { color: #3f6b1f; }

html.lp-st-necromancer .content-box {
    background: #ece4cc;
    border-color: #d8d1bf #3f3a33 #3f3a33 #d8d1bf;
    box-shadow: 1px 1px 0 #1b1814;
}
html.lp-st-necromancer .content-box-title { color: #efe9d6; text-shadow: 1px 1px 0 #000; }
html.lp-st-necromancer .content-box-title a { color: #cfe8b0; }
html.lp-st-necromancer .content-box-title.red    { background: linear-gradient(to right, #3a0907, #8a1a14); }
html.lp-st-necromancer .content-box-title.blue   { background: linear-gradient(to right, #0f1420, #2e3a54); }
html.lp-st-necromancer .content-box-title.green  { background: linear-gradient(to right, #13200c, #3f6a22); }
html.lp-st-necromancer .content-box-title.orange { background: linear-gradient(to right, #3a1c05, #9a4e14); }
html.lp-st-necromancer .content-box-title.purple { background: linear-gradient(to right, #1c0f24, #4a2a5e); }
html.lp-st-necromancer .content-box-title.teal   { background: linear-gradient(to right, #0c2220, #2a5f58); }
html.lp-st-necromancer .content-box-body { color: #1b1510; }

/* ── Homepage pieces ────────────────────────────────────────── */
html.lp-st-necromancer #featured-box {
    background-color: #0d0c10;
    background-image: url(art/sigil.png), linear-gradient(135deg, #0d0c10 0%, #1b2614 50%, #0d0c10 100%);
    background-repeat: no-repeat, no-repeat;
    background-position: right 12px center, 0 0;
    background-size: 144px 144px, 100% 100%;
    border: 3px solid #5fa33a;
    color: #e8e0c8;
    box-shadow: inset 0 0 26px rgba(166,232,106,.14);
}
html.lp-st-necromancer #featured-box::before {
    background: repeating-linear-gradient(45deg, transparent, transparent 10px, rgba(166,232,106,.03) 10px, rgba(166,232,106,.03) 20px);
}
html.lp-st-necromancer #featured-box h2 { color: #a6e86a; text-shadow: 2px 2px 0 #000, 0 0 10px rgba(166,232,106,.45); }
html.lp-st-necromancer #featured-box p  { color: #d8d0b8; }
html.lp-st-necromancer #featured-box a  { color: #cfe8b0; }
html.lp-st-necromancer #featured-box a.feat-btn-yellow { color: #0b0c08; }
html.lp-st-necromancer #featured-box a.feat-btn-orange { color: #f4f0e2; }

html.lp-st-necromancer .feat-btn-orange { background: #8a1a14; color: #f4f0e2; border-color: #c0392b; }
html.lp-st-necromancer .feat-btn-yellow { background: #a6e86a; color: #0b0c08; border-color: #cdf5a4; }

html.lp-st-necromancer .news-table th { background: #22301a; color: #efe9d6; }
html.lp-st-necromancer .news-table td { border-bottom-color: #d6ccb0; }
html.lp-st-necromancer .news-table tr:nth-child(even) td { background: #e3d9bc; }
html.lp-st-necromancer .news-table tr:hover td { background: #f3ead0; }
html.lp-st-necromancer .news-link-title { color: #6e1a14; }
html.lp-st-necromancer .news-row-link:hover { background: #f3ead0; }

html.lp-st-necromancer .badge-new { background: #8a1a14; color: #ffe9a0; border-color: #3a0907; }
html.lp-st-necromancer .badge-upd { background: #4e7a2a; border-color: #16240d; }
html.lp-st-necromancer .hit-counter { color: #a6e86a; text-shadow: 0 0 8px #a6e86a; }

html.lp-st-necromancer .poll-bar-wrap,
html.lp-st-necromancer .game-bar-wrap { background: #d6ccb0; border-color: #8a8272; }
html.lp-st-necromancer .poll-bar-1,
html.lp-st-necromancer .game-bar-fill { background: linear-gradient(to right, #2e4a1c, #8fd14f); }
html.lp-st-necromancer .poll-bar-2 { background: linear-gradient(to right, #5a0e0b, #c0392b); }
html.lp-st-necromancer .poll-bar-3 { background: linear-gradient(to right, #2c1838, #7a4a9a); }
html.lp-st-necromancer .poll-bar-4 { background: linear-gradient(to right, #3a1c05, #d08a2a); }
html.lp-st-necromancer .game-row   { border-bottom-color: #c9bfa3; }
html.lp-st-necromancer .game-rank  { color: #8a1a14; }
html.lp-st-necromancer .game-plays { color: #6b6250; }

html.lp-st-necromancer .weather-box { background: linear-gradient(180deg, #1a2433, #0c1119); color: #d8d0b8; }
html.lp-st-necromancer .aim-away { background: #f3ead0; }
html.lp-st-necromancer .sotd-placeholder,
html.lp-st-necromancer .link-us-btn {
    background: linear-gradient(135deg, #121015, #22301a);
    border-color: #5f8a3c;
    color: #a6e86a;
}
html.lp-st-necromancer .ad-banner { background: linear-gradient(135deg, #0b0a0d, #1a1820); border-color: #5fa33a; }
html.lp-st-necromancer .ad-banner:hover { border-color: #c8502c; }
html.lp-st-necromancer .ad-title { color: #a6e86a; }
html.lp-st-necromancer .ad-email { color: #ff7a66; }
html.lp-st-necromancer .under-con {
    background: repeating-linear-gradient(45deg, #5fa33a, #5fa33a 10px, #0b0a0d 10px, #0b0a0d 20px);
    color: #efe9d6;
}
html.lp-st-necromancer .news-ticker { background: #f3ead0; border-color: #b7ad93; }
html.lp-st-necromancer .news-ticker strong { color: #8a1a14; }
html.lp-st-necromancer .l33t-box { color: #a6e86a; text-shadow: 0 0 4px #a6e86a; }
html.lp-st-necromancer .hr-retro { border-top-color: #5f594f; border-bottom-color: #d8d1bf; }

html.lp-st-necromancer .guestbook-entry { background: #ece4cc; border-color: #d8d1bf #3f3a33 #3f3a33 #d8d1bf; }
html.lp-st-necromancer .gb-name { color: #6e1a14; }
html.lp-st-necromancer .gb-header { border-bottom-color: #d6ccb0; }
html.lp-st-necromancer .btn-submit { background: #2e4a1c; border-color: #5f8a3c; color: #f4f0e2; }
html.lp-st-necromancer .btn-submit:hover { background: #4e7a2a; }
html.lp-st-necromancer .btn-delete { background: #8a1a14; border-color: #c0392b; }

html.lp-st-necromancer .search-hero {
    background: linear-gradient(135deg, #07080c, #16240d, #07080c);
    border-bottom-color: #5fa33a;
}
html.lp-st-necromancer .search-tab.active { background: #ece4cc; }

/* ── Footer and status bar ──────────────────────────────────── */
html.lp-st-necromancer #site-footer {
    background: linear-gradient(180deg, #16141a, #07080a) !important;
    color: #9c937c !important;
    border-top: 2px solid #5fa33a !important;
}
html.lp-st-necromancer #site-footer a { color: #a6e86a; }
html.lp-st-necromancer #site-footer strong { color: #a6e86a !important; }
html.lp-st-necromancer .footer-copy { color: #7d7566; }
html.lp-st-necromancer #status-bar {
    background: #1c1a20 !important;
    border-top-color: #3a3640 !important;
    color: #b5ab8e !important;
}
html.lp-st-necromancer #status-bar a { color: #a6e86a; }
html.lp-st-necromancer #status-bar span[style*="color:#666"] { color: #8f8676 !important; }
html.lp-st-necromancer .status-panel { border-color: #0a090c #4a4652 #4a4652 #0a090c; }

/* ── Scrollbar ──────────────────────────────────────────────── */
html.lp-st-necromancer::-webkit-scrollbar-track,
html.lp-st-necromancer ::-webkit-scrollbar-track { background: #16141a; }
html.lp-st-necromancer::-webkit-scrollbar-thumb,
html.lp-st-necromancer ::-webkit-scrollbar-thumb {
    background: #5f594f;
    border: 2px solid;
    border-color: #8f887a #2a2620 #2a2620 #8f887a;
}

/* ── Graveyard behind everything (added by necromancer.js) ──── */
#lpst-back {
    position: fixed; top: 0; left: 0; right: 0; bottom: 0;
    z-index: -1; pointer-events: none; overflow: hidden;
}
#lpst-back .lpst-moon {
    position: absolute; top: 60px; right: 16px;
    width: 120px; height: 120px;
    background: url(art/moon.png) 0 0 / 120px 120px no-repeat;
    border-radius: 50%;
    box-shadow: 0 0 50px 10px rgba(214,52,30,.26), 0 0 130px 36px rgba(140,14,10,.10);
    -webkit-animation: lpstMoonPulse 4.5s ease-in-out infinite alternate;
    animation: lpstMoonPulse 4.5s ease-in-out infinite alternate;
}
@-webkit-keyframes lpstMoonPulse {
    from { box-shadow: 0 0 50px 10px rgba(214,52,30,.26), 0 0 130px 36px rgba(140,14,10,.10); }
    to   { box-shadow: 0 0 72px 20px rgba(232,62,34,.46), 0 0 175px 56px rgba(160,18,12,.20); }
}
@keyframes lpstMoonPulse {
    from { box-shadow: 0 0 50px 10px rgba(214,52,30,.26), 0 0 130px 36px rgba(140,14,10,.10); }
    to   { box-shadow: 0 0 72px 20px rgba(232,62,34,.46), 0 0 175px 56px rgba(160,18,12,.20); }
}
/* Internet Options > Animation and Motion off only reaches inside the page,
   so the moon out in the margin is told directly by necromancer.js. */
html.lp-st-still #lpst-back .lpst-moon { -webkit-animation: none; animation: none; }
#lpst-back .lpst-far {
    position: absolute; left: 0; right: 0; bottom: 64px; height: 240px;
    background: url(art/graveyard-far.png) repeat-x 0 100% / 1152px 240px;
}
/* Fills the strip between the far hills and the near ground so the sky
   never shows through. The top colour is the ground colour at the bottom of
   graveyard-far.png, the bottom colour is the ground in graveyard-near.png.
   If either picture changes colour, change these two to match. */
#lpst-back .lpst-gap {
    position: absolute; left: 0; right: 0; bottom: 0; height: 72px;
    background: #161b22;
    background: linear-gradient(to bottom, #161b22 0%, #161b22 18%, #0d1014 62%, #060708 100%);
}
#lpst-back .lpst-near {
    position: absolute; left: 0; right: 0; bottom: 0; height: 180px;
    background: url(art/graveyard-near.png) repeat-x -120px 100% / 960px 180px;
}
html.lp-st-no-graveyard #lpst-back { display: none; }
/* One moon at a time: the big one out in the margin on wide screens,
   the one in the header everywhere else. */
@media (max-width: 1599px) { #lpst-back .lpst-moon { display: none; } }
@media (min-width: 1600px) { html.lp-st-necromancer .lpst-deco span.lpst-hmoon { display: none; } }

/* Fog and soul wisps are painted on this canvas by necromancer.js. It sits
   over the bottom of the page but never catches a click, and the docked
   chat bar stays on top of it. */
#lpst-fog {
    position: fixed; left: 0; bottom: 0;
    width: 100%; height: 260px;
    z-index: 900; pointer-events: none;
    background: linear-gradient(to top, rgba(150,166,150,.16) 0%, rgba(150,166,150,.05) 40%, rgba(150,166,150,0) 75%);
}
html.lp-st-no-fog #lpst-fog { background: none; }

/* ── The Old Web Cemetery (above the footer) ────────────────── */
#lpst-cemetery {
    position: relative;
    overflow: hidden;
    padding: 18px 12px 0;
    background-color: #0a0d12;
    background-image: url(art/graveyard-far.png), url(art/stars.gif), linear-gradient(to bottom, #07080c 0%, #111820 60%, #1e2a22 100%);
    background-repeat: repeat-x, repeat, no-repeat;
    background-position: -180px 100%, 0 0, 0 0;
    background-size: 768px 160px, 192px 192px, 100% 100%;
    border-top: 2px solid #0a090c;
    font-family: 'VT323', 'Lucida Console', 'Courier New', monospace;
}
#lpst-cemetery .lpst-row {
    position: relative;
    display: flex; align-items: flex-end; justify-content: center;
    gap: 12px;
    min-height: 196px;
}
#lpst-cemetery .lpst-ground {
    position: absolute; left: 0; right: 0; bottom: 0; height: 12px;
    background: #060708;
    border-top: 1px solid #16240d;
}
#lpst-cemetery .lpst-sign {
    position: relative; z-index: 2;
    flex: 0 0 auto; align-self: flex-end;
    margin: 0 10px 40px 0;
    padding: 6px 12px 7px;
    background: #5a3a22;
    border: 3px solid;
    border-color: #7a5234 #2e1c0f #2e1c0f #7a5234;
    color: #f0dcb0;
    font-size: 21px; line-height: 1; text-align: center;
    text-shadow: 1px 1px 0 #2e1c0f;
    box-shadow: 3px 3px 0 rgba(0,0,0,.5);
    -webkit-transform: rotate(-3deg); -ms-transform: rotate(-3deg); transform: rotate(-3deg);
}
#lpst-cemetery .lpst-sign b { display: block; font-weight: normal; letter-spacing: 1px; }
#lpst-cemetery .lpst-sign small { display: block; font-size: 15px; color: #c9a878; margin-top: 3px; }
#lpst-cemetery .lpst-sign:after {
    content: ''; position: absolute; left: 50%; top: 100%;
    margin-left: -4px; width: 8px; height: 40px;
    background: #3e2716; border-left: 2px solid #5a3a22;
}
#lpst-cemetery .lpst-grave {
    position: relative; z-index: 2;
    flex: 0 0 auto;
    width: 96px; height: 178px;
    cursor: default;
}
#lpst-cemetery .lpst-stone {
    position: absolute; left: 0; bottom: 20px;
    width: 96px; height: 120px;
    background: url(art/stone-round.png) 0 0 / 96px 120px no-repeat;
}
#lpst-cemetery .lpst-g-gothic .lpst-stone { background-image: url(art/stone-gothic.png); }
#lpst-cemetery .lpst-g-cross  .lpst-stone { background-image: url(art/stone-cross.png); }
#lpst-cemetery .lpst-g-slab   .lpst-stone { background-image: url(art/stone-slab.png); }
#lpst-cemetery .lpst-mound {
    position: absolute; left: -12px; bottom: 6px;
    width: 120px; height: 27px;
    background: url(art/mound.png) 0 0 / 120px 27px no-repeat;
}
#lpst-cemetery .lpst-engr {
    position: absolute; left: 13px; right: 13px; top: 34px;
    overflow: hidden;
    text-align: center; line-height: 1;
    color: #2c2930;
    text-shadow: 1px 1px 0 #a9a5b2;
}
#lpst-cemetery .lpst-g-gothic .lpst-engr { top: 38px; }
#lpst-cemetery .lpst-g-slab   .lpst-engr { top: 42px; }
#lpst-cemetery .lpst-g-cross  .lpst-engr { top: 58px; }
#lpst-cemetery .lpst-rip  { display: block; font-size: 14px; letter-spacing: 2px; white-space: nowrap; }
#lpst-cemetery .lpst-name { display: block; font-size: 17px; margin-top: 4px; word-wrap: normal; white-space: normal; }
#lpst-cemetery .lpst-yrs  { display: block; font-size: 15px; margin-top: 4px; white-space: nowrap; }
#lpst-cemetery .lpst-ep {
    position: absolute; left: 50%; bottom: 150px; z-index: 5;
    -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%);
    white-space: nowrap;
    background: #0d0c10; color: #a6e86a;
    border: 1px solid #5fa33a;
    font-size: 16px; padding: 2px 7px;
    opacity: 0; visibility: hidden;
    -webkit-transition: opacity .2s; transition: opacity .2s;
    pointer-events: none;
}
#lpst-cemetery .lpst-grave:hover .lpst-ep,
#lpst-cemetery .lpst-grave.lpst-on .lpst-ep { opacity: 1; visibility: visible; }
/* A cluster of three candles. candle.gif animates the flames itself. */
#lpst-cemetery .lpst-candle {
    position: relative; z-index: 2;
    flex: 0 0 auto;
    width: 90px; height: 66px;
    margin-bottom: 10px;
    background: url(art/candle.gif) 0 0 / 90px 66px no-repeat;
}
#lpst-cemetery .lpst-candle:before {
    content: ''; position: absolute; left: -20px; top: -26px;
    width: 130px; height: 96px; border-radius: 50%;
    background: radial-gradient(ellipse, rgba(255,190,90,.30) 0%, rgba(255,150,40,.10) 45%, rgba(255,150,40,0) 70%);
}

/* Little souls leaving the graves. Square on purpose, they are pixels. */
#lpst-cemetery .lpst-wisp {
    position: absolute; left: 44px; bottom: 30px;
    width: 4px; height: 4px;
    background: #d9ffb0;
    box-shadow: 0 0 6px 2px rgba(166,232,106,.75);
    opacity: 0;
    -webkit-animation: lpstRise 7s linear infinite;
    animation: lpstRise 7s linear infinite;
}
@-webkit-keyframes lpstRise {
    0%   { opacity: 0; -webkit-transform: translate(0, 0); }
    12%  { opacity: .95; }
    50%  { -webkit-transform: translate(8px, -70px); }
    100% { opacity: 0; -webkit-transform: translate(-4px, -150px); }
}
@keyframes lpstRise {
    0%   { opacity: 0; transform: translate(0, 0); }
    12%  { opacity: .95; }
    50%  { transform: translate(8px, -70px); }
    100% { opacity: 0; transform: translate(-4px, -150px); }
}
html.lp-st-no-wisps #lpst-cemetery .lpst-wisp { display: none; }

/* ── Docked chat bar ────────────────────────────────────────── */
html.lp-st-necromancer.lp-st-chat #lp-chatbar #lp-cb-bar {
    background: linear-gradient(180deg, #2e4a1c 0%, #16240d 55%, #0b0c0a 100%);
    border-color: #a6e86a;
}
html.lp-st-necromancer.lp-st-chat #lp-chatbar .lp-cb-tab {
    background: linear-gradient(180deg, #3a3740, #1e1c22);
    color: #e8e0c8;
    border-color: #5c5866 #0a090c #0a090c #5c5866;
}
html.lp-st-necromancer.lp-st-chat #lp-chatbar .lp-cb-tab.on { background: linear-gradient(180deg, #5f9a34, #2e4a1c); color: #f4f0e2; }
html.lp-st-necromancer.lp-st-chat #lp-chatbar .lp-cb-dot { background: #a6e86a; box-shadow: 0 0 4px #a6e86a; }
html.lp-st-necromancer.lp-st-chat #lp-chatbar .lp-cb-win,
html.lp-st-necromancer.lp-st-chat #lp-chatbar #lp-cb-dmlist,
html.lp-st-necromancer.lp-st-chat #lp-chatbar .lp-cb-dm,
html.lp-st-necromancer.lp-st-chat #lp-chatbar .lp-cb-pop { background: #1e1c22; }
html.lp-st-necromancer.lp-st-chat #lp-chatbar .lp-cb-titlebar,
html.lp-st-necromancer.lp-st-chat #lp-chatbar .lp-cb-pop-h,
html.lp-st-necromancer.lp-st-chat #lp-chatbar .lp-cb-dm-head {
    background: linear-gradient(to right, #0b0a0d, #2e4a1c 70%, #5f9a34);
    color: #efe9d6;
}
html.lp-st-necromancer.lp-st-chat #lp-chatbar .lp-cb-wbtn,
html.lp-st-necromancer.lp-st-chat #lp-chatbar .lp-cb-sendbtn,
html.lp-st-necromancer.lp-st-chat #lp-chatbar .lp-cb-dm-send { background: linear-gradient(180deg, #3a3740, #1e1c22); color: #e8e0c8; }
html.lp-st-necromancer.lp-st-chat #lp-chatbar .lp-cb-body-wrap,
html.lp-st-necromancer.lp-st-chat #lp-chatbar .lp-cb-msgs { background: #0f0e12; }
html.lp-st-necromancer.lp-st-chat #lp-chatbar .lp-cb-body { color: #e3dcc6; }
html.lp-st-necromancer.lp-st-chat #lp-chatbar .lp-cb-uname { color: #9fe060; }
html.lp-st-necromancer.lp-st-chat #lp-chatbar .lp-cb-time { color: #7d7566; }
html.lp-st-necromancer.lp-st-chat #lp-chatbar .lp-cb-inputrow,
html.lp-st-necromancer.lp-st-chat #lp-chatbar .lp-cb-login { background: #26232b; border-top-color: #3a3640; }
html.lp-st-necromancer.lp-st-chat #lp-chatbar .lp-cb-login a,
html.lp-st-necromancer.lp-st-chat #lp-chatbar .lp-cb-body a { color: #a6e86a; }
html.lp-st-necromancer.lp-st-chat #lp-chatbar .lp-cb-av-ph,
html.lp-st-necromancer.lp-st-chat #lp-chatbar .lp-cb-dmrow-ph,
html.lp-st-necromancer.lp-st-chat #lp-chatbar .lp-cb-dm-ph { background: #2e4a1c; color: #efe9d6; }
html.lp-st-necromancer.lp-st-chat #lp-chatbar #lp-cb-dmlist-body,
html.lp-st-necromancer.lp-st-chat #lp-chatbar .lp-cb-dmrow,
html.lp-st-necromancer.lp-st-chat #lp-chatbar .lp-cb-row { background: #1e1c22; border-bottom-color: #3a3640; }
html.lp-st-necromancer.lp-st-chat #lp-chatbar .lp-cb-dmrow:hover,
html.lp-st-necromancer.lp-st-chat #lp-chatbar .lp-cb-row:hover { background: #26232b; }
html.lp-st-necromancer.lp-st-chat #lp-chatbar .lp-cb-dmrow-prev,
html.lp-st-necromancer.lp-st-chat #lp-chatbar .lp-cb-empty { color: #9c937c; }
html.lp-st-necromancer.lp-st-chat #lp-chatbar .lp-cb-empty a { color: #a6e86a; }
html.lp-st-necromancer.lp-st-chat #lp-chatbar .lp-cb-dm-body { background: #0f0e12; }
html.lp-st-necromancer.lp-st-chat #lp-chatbar .lp-cb-bub.mine { background: #2e4a1c; color: #f4f0e2; }
html.lp-st-necromancer.lp-st-chat #lp-chatbar .lp-cb-bub.theirs { background: #26232b; color: #e3dcc6; }
html.lp-st-necromancer.lp-st-chat #lp-chatbar .lp-cb-dm-input { background: #1e1c22; }

/* ── Phones and small tablets ───────────────────────────────── */
@media (max-width: 768px) {
    html.lp-st-necromancer body { padding-bottom: 120px; }
    html.lp-st-necromancer #site-header { min-height: 150px; background-position: -200px 100%, 0 0, 0 0 !important; }
    html.lp-st-necromancer .lpst-hmoon { top: 8px; right: 10px; width: 48px; height: 48px; background-size: 48px 48px; }
    html.lp-st-necromancer .lpst-web { width: 44px; height: 44px; background-size: 44px 44px; }
    html.lp-st-necromancer .lpst-spider { right: 64px; }
    #lpst-back .lpst-far  { bottom: 40px; height: 160px; background-size: 768px 160px; }
    #lpst-back .lpst-gap  { height: 48px; }
    #lpst-back .lpst-near { height: 120px; background-size: 640px 120px; }
    #lpst-fog { height: 170px; }
    #lpst-cemetery .lpst-sign { display: none; }
    #lpst-cemetery .lpst-row { gap: 6px; }
}

/* Anyone who asked their system for less motion gets a still graveyard. */
@media (prefers-reduced-motion: reduce) {
    html.lp-st-necromancer .lpst-deco span.lpst-bat { display: none; }
    html.lp-st-necromancer .lpst-hmoon,
    #lpst-back .lpst-moon,
    html.lp-st-necromancer .lpst-spider,
    html.lp-st-necromancer .lpst-crow,
    #lpst-cemetery .lpst-wisp { -webkit-animation: none; animation: none; }
}
