path: root/internal/generator/templates/shared/nav.tmpl

{{define "splashGate"}}
<script>
(function(){
  try {
    var sp = new URLSearchParams(location.search);
    if (sp.get('splash') === '0') {
      document.documentElement.classList.add('sno-splash-skip');
      return;
    }
  } catch (_) {}
  try {
    if (/^#post-/.test(location.hash)) {
      document.documentElement.classList.add('sno-splash-skip');
      return;
    }
  } catch (_) {}
  function isIndexLikePath(pathname) {
    var p = pathname || '/';
    if (p === '' || p === '/') return true;
    var parts = p.split('/').filter(function(s) { return s.length; });
    if (parts.length === 0) return true;
    var last = parts[parts.length - 1].toLowerCase();
    if (last === 'index.html' || last === 'index.htm') return true;
    if (p.endsWith('/') && parts.length === 1) return true;
    return false;
  }
  var onIndex = isIndexLikePath(location.pathname);
  var ref = document.referrer;
  function refIsSameSiteBlogPage(url) {
    if (!url) return false;
    try {
      var ru = new URL(url), cu = new URL(location.href);
      if (ru.origin !== cu.origin) return false;
      if (isIndexLikePath(ru.pathname)) return true;
      var rp = ru.pathname.split('/').filter(function(s) { return s.length; });
      var rs = (rp.length ? rp[rp.length - 1] : '').toLowerCase();
      return /^page\d+\.html$/.test(rs);
    } catch (_) { return false; }
  }
  if (!onIndex || refIsSameSiteBlogPage(ref)) document.documentElement.classList.add('sno-splash-skip');
})();
</script>
{{end}}

{{define "navhints"}}
<div class="nav-hints" role="region" aria-label="Keyboard shortcuts">
    <span><kbd>j</kbd><kbd>k</kbd> or <kbd>↑</kbd><kbd>↓</kbd> select post</span>
    <span><kbd>PgUp</kbd><kbd>PgDn</kbd> scroll</span>
    <span><kbd>Enter</kbd> or click post to expand</span>
    <span><kbd>Esc</kbd> close</span>
    <span><kbd>h</kbd><kbd>l</kbd> or <kbd>←</kbd><kbd>→</kbd> change page</span>
    <span><kbd>w</kbd> wild mode</span>
</div>
{{end}}

{{define "navSharedCSSInner"}}
/* Non-active posts are translucent so the WebGL background shows through.
   The active/highlighted post snaps to full opacity for clear reading.
   Hover on a non-active post partially reveals it before selection. */
.post { position:relative; }
.post:not(.post-active) { opacity: 0.55; transition: opacity 0.25s ease; }
.post:not(.post-active):hover { opacity: 0.85; }
.post.post-active { opacity: 1 !important; transition: opacity 0.15s ease; }
/* Thumbnail sizing in list view; modal overrides to full width. */
.post-image { max-height:220px; max-width:100%; object-fit:cover; cursor:pointer; }
#post-modal .post-image { max-height:none; width:100%; max-width:100%; object-fit:contain; cursor:default; }
/* Semi-transparent modal backdrop so the WebGL scene stays visible behind
   the expanded post. Theme-specific modal-inner keeps its own background. */
.post-modal { background:rgba(0,0,0,0.55) !important; backdrop-filter:blur(6px) !important; }
#post-modal.active { display:flex !important; align-items:center; justify-content:center; }
#post-modal .modal-inner { width:fit-content; max-width:min(100%, 90vw); max-height:calc(100vh - 80px); overflow:auto; margin:0 auto !important; }
/* Content area max-width across all themes */
.overlay { max-width:1200px; margin-left:auto; margin-right:auto; }
/* Pagination: newer + older in a footer bar (below scrollable posts, like the header) */
.page-nav-dual { display:flex; justify-content:center; align-items:center; flex-wrap:wrap;
                gap:clamp(16px,4vw,48px); }
/* Flex column layout: let #post-content shrink so overflow-y scrolls; footer stays visible */
#post-content.content { min-height:0; }
.page-nav-footer { flex-shrink:0; width:100%; box-sizing:border-box; }
.page-nav-footer .page-nav { margin:0; }
/* ~Half-height footer bar vs default .page-nav padding */
.page-nav-footer .page-nav a { padding-top:4px; padding-bottom:4px; }
/* Shared nav FX keyframes — themes apply these classes for brief effects */
/* Modal open: post zooms/flies into the modal overlay */
@keyframes sno-modal-zoom { 0%{transform:scale(0.82) translateY(18px);opacity:0} 60%{transform:scale(1.02) translateY(-3px);opacity:1} 100%{transform:scale(1) translateY(0);opacity:1} }
@keyframes sno-modal-fly-up { 0%{transform:translateY(60px) scale(0.92);opacity:0} 70%{transform:translateY(-4px) scale(1.01);opacity:1} 100%{transform:translateY(0) scale(1);opacity:1} }
@keyframes sno-modal-slide-in { 0%{transform:translateX(-40px) scale(0.96);opacity:0} 65%{transform:translateX(4px) scale(1.005);opacity:1} 100%{transform:translateX(0) scale(1);opacity:1} }
@keyframes sno-modal-expand { 0%{transform:scale(0.05) rotate(-4deg);opacity:0} 55%{transform:scale(1.04) rotate(0.5deg);opacity:1} 100%{transform:scale(1) rotate(0);opacity:1} }
.sno-modal-zoom   .modal-inner { animation:sno-modal-zoom    0.36s cubic-bezier(0.22,1,0.36,1) both !important; }
.sno-modal-fly    .modal-inner { animation:sno-modal-fly-up   0.34s cubic-bezier(0.22,1,0.36,1) both !important; }
.sno-modal-slide  .modal-inner { animation:sno-modal-slide-in 0.32s cubic-bezier(0.22,1,0.36,1) both !important; }
.sno-modal-expand .modal-inner { animation:sno-modal-expand   0.4s  cubic-bezier(0.22,1,0.36,1) both !important; }
@keyframes sno-shake { 0%,100%{transform:translate(0)} 14%{transform:translate(-7px,4px)} 28%{transform:translate(7px,-5px)} 42%{transform:translate(-5px,6px)} 56%{transform:translate(6px,-4px)} 70%{transform:translate(-4px,3px)} 86%{transform:translate(4px,-2px)} }
@keyframes sno-zoom-fwd { 0%{transform:scale(1)} 40%{transform:scale(1.05)} 100%{transform:scale(1)} }
@keyframes sno-glitch { 0%,100%{transform:translate(0) skewX(0)} 20%{transform:translate(-5px,0) skewX(-4deg)} 40%{transform:translate(5px,0) skewX(4deg)} 60%{transform:translate(-3px,0)} 80%{transform:translate(3px,0)} }
@keyframes sno-bounce-left { 0%{transform:translateX(0)} 25%{transform:translateX(-18px)} 50%{transform:translateX(6px)} 75%{transform:translateX(-3px)} 100%{transform:translateX(0)} }
@keyframes sno-bounce-right { 0%{transform:translateX(0)} 25%{transform:translateX(18px)} 50%{transform:translateX(-6px)} 75%{transform:translateX(3px)} 100%{transform:translateX(0)} }
@keyframes sno-bounce-left-wild { 0%{transform:translateX(0) rotate(0)} 15%{transform:translateX(-48px) rotate(-3deg)} 35%{transform:translateX(22px) rotate(2deg)} 55%{transform:translateX(-12px) rotate(-1.2deg)} 75%{transform:translateX(6px) rotate(0.5deg)} 100%{transform:translateX(0) rotate(0)} }
@keyframes sno-bounce-right-wild { 0%{transform:translateX(0) rotate(0)} 15%{transform:translateX(48px) rotate(3deg)} 35%{transform:translateX(-22px) rotate(-2deg)} 55%{transform:translateX(12px) rotate(1.2deg)} 75%{transform:translateX(-6px) rotate(-0.5deg)} 100%{transform:translateX(0) rotate(0)} }
.sno-fx-bounce-left  { animation:sno-bounce-left  0.35s cubic-bezier(.36,.07,.19,.97) both !important; }
.sno-fx-bounce-right { animation:sno-bounce-right 0.35s cubic-bezier(.36,.07,.19,.97) both !important; }
.sno-fx-bounce-left-wild  { animation:sno-bounce-left-wild  0.5s cubic-bezier(.36,.07,.19,.97) both !important; }
.sno-fx-bounce-right-wild { animation:sno-bounce-right-wild 0.5s cubic-bezier(.36,.07,.19,.97) both !important; }
/* Vertical boundary bounce (top/bottom post list) */
@keyframes sno-bounce-up { 0%{transform:translateY(0)} 25%{transform:translateY(-14px)} 50%{transform:translateY(5px)} 75%{transform:translateY(-2px)} 100%{transform:translateY(0)} }
@keyframes sno-bounce-down { 0%{transform:translateY(0)} 25%{transform:translateY(14px)} 50%{transform:translateY(-5px)} 75%{transform:translateY(2px)} 100%{transform:translateY(0)} }
@keyframes sno-bounce-up-wild { 0%{transform:translateY(0) rotate(0)} 15%{transform:translateY(-40px) rotate(-2.5deg)} 35%{transform:translateY(18px) rotate(1.5deg)} 55%{transform:translateY(-9px) rotate(-0.8deg)} 75%{transform:translateY(4px) rotate(0.3deg)} 100%{transform:translateY(0) rotate(0)} }
@keyframes sno-bounce-down-wild { 0%{transform:translateY(0) rotate(0)} 15%{transform:translateY(40px) rotate(2.5deg)} 35%{transform:translateY(-18px) rotate(-1.5deg)} 55%{transform:translateY(9px) rotate(0.8deg)} 75%{transform:translateY(-4px) rotate(-0.3deg)} 100%{transform:translateY(0) rotate(0)} }
.sno-fx-bounce-up    { animation:sno-bounce-up   0.35s cubic-bezier(.36,.07,.19,.97) both !important; }
.sno-fx-bounce-down  { animation:sno-bounce-down 0.35s cubic-bezier(.36,.07,.19,.97) both !important; }
.sno-fx-bounce-up-wild   { animation:sno-bounce-up-wild   0.5s cubic-bezier(.36,.07,.19,.97) both !important; }
.sno-fx-bounce-down-wild { animation:sno-bounce-down-wild 0.5s cubic-bezier(.36,.07,.19,.97) both !important; }
/* Post hover ripple — radial ring emanates from center on hover */
@keyframes sno-hover-ripple { 0%{transform:translate(-50%,-50%) scale(0);opacity:0.5} 100%{transform:translate(-50%,-50%) scale(1);opacity:0} }
.post:not(.post-active)::before { content:''; position:absolute; top:50%; left:50%; width:120%; height:120%;
  border-radius:50%; border:2px solid currentColor; pointer-events:none;
  transform:translate(-50%,-50%) scale(0); opacity:0; z-index:0; }
.post:not(.post-active):hover::before { animation:sno-hover-ripple 0.6s ease-out forwards; }
/* Modal scroll-end flash — brief glow at bottom of modal-inner when scrolled to end */
@keyframes sno-scroll-end-flash { 0%{opacity:0.7} 100%{opacity:0} }
.modal-inner .sno-scroll-end { position:sticky; bottom:0; left:0; right:0; height:3px; pointer-events:none;
  background:linear-gradient(90deg, transparent, currentColor, transparent); opacity:0; }
.modal-inner .sno-scroll-end.sno-scroll-end-active { animation:sno-scroll-end-flash 0.5s ease-out forwards; }
/* Idle breathing — gentle glow pulse on active post after inactivity */
@keyframes sno-idle-breathe { 0%,100%{box-shadow:inherit} 50%{box-shadow:0 0 18px 4px currentColor} }
.post-active.sno-idle-breathe { animation:sno-idle-breathe 3s ease-in-out infinite; }
/* First-visit particle burst */
@keyframes sno-particle-fly { 0%{transform:translate(0,0) scale(1);opacity:1} 100%{transform:translate(var(--px),var(--py)) scale(0);opacity:0} }
#sno-burst { position:fixed; inset:0; z-index:9999; pointer-events:none; }
#sno-burst span { position:absolute; width:6px; height:6px; border-radius:50%; background:currentColor;
  animation:sno-particle-fly var(--pdur) ease-out forwards; animation-delay:var(--pdel); opacity:0; }
@keyframes sno-wild-pulse { 0%,100%{opacity:1} 50%{opacity:0.6} }
/* Storm overlay that flickers like distant lightning while wild mode is on */
@keyframes sno-wild-flicker { 0%,84%,87%,91%,94%,100%{opacity:0} 85%,90%{opacity:0.75} 86%,92%{opacity:0.35} }
.sno-fx-shake { animation:sno-shake 0.38s cubic-bezier(.36,.07,.19,.97) both !important; transform-origin:center; }
.sno-fx-zoom  { animation:sno-zoom-fwd 0.32s ease both !important; }
.sno-fx-glitch { animation:sno-glitch 0.3s ease both !important; }
/* Wild mode badge — only visible (opacity:1) when .sno-wild-on is present */
#sno-wild-badge { position:fixed; top:10px; right:12px; z-index:5000; padding:3px 12px;
  font-size:0.64rem; letter-spacing:0.2em; text-transform:uppercase; border-radius:2px;
  pointer-events:none; opacity:0; transition:opacity 0.4s;
  background:rgba(220,0,0,0.92); color:#fff; border:1px solid rgba(255,100,100,0.8);
  font-family:monospace; }
/* Animation only runs when wild is actually on, preventing invisible badge pulse */
#sno-wild-badge.sno-wild-on { opacity:1; animation:sno-wild-pulse 0.9s ease-in-out infinite; }
#sno-wild-root { position:fixed; inset:0; z-index:18; pointer-events:none; opacity:0;
  transition:opacity 0.35s ease; overflow:hidden; isolation:isolate; }
body.sno-wild-active #sno-wild-root { opacity:1; }
#sno-wild-root .sno-wild-layer,
#sno-wild-root #sno-wild-scraps,
#sno-wild-root #sno-wild-banner,
#sno-wild-root #sno-wild-ticker { position:absolute; inset:0; }
#sno-wild-colorwash {
  background-image:var(--sno-wild-colorwash, none);
  background-size:var(--sno-wild-colorwash-size, cover);
  background-position:center;
  mix-blend-mode:screen;
  opacity:var(--sno-wild-colorwash-opacity, 0.55);
  animation:sno-wild-drift 9s ease-in-out infinite;
}
#sno-wild-rain {
  background-image:var(--sno-wild-rain, none);
  background-size:var(--sno-wild-rain-size, 220px 220px);
  background-repeat:repeat;
  background-position:0 0;
  mix-blend-mode:screen;
  opacity:var(--sno-wild-rain-opacity, 0.18);
  animation:sno-wild-rainfall var(--sno-wild-rain-speed, 1.2s) linear infinite;
}
#sno-wild-wave {
  inset:auto 0 -8vh 0;
  height:70vh;
  background:var(--sno-wild-wave, none);
  opacity:var(--sno-wild-wave-opacity, 0.32);
  transform-origin:50% 100%;
  animation:sno-wild-surge 6.4s ease-in-out infinite;
}
#sno-wild-beacon {
  background:var(--sno-wild-beacon, none);
  opacity:var(--sno-wild-beacon-opacity, 0.38);
  filter:blur(var(--sno-wild-beacon-blur, 0px));
  mix-blend-mode:screen;
  animation:sno-wild-lens 4.5s ease-in-out infinite;
}
#sno-wild-noise {
  background-image:
    linear-gradient(90deg, rgba(255,255,255,0.08) 0 1px, transparent 1px 100%),
    linear-gradient(180deg, rgba(255,255,255,0.07) 0 1px, transparent 1px 100%),
    repeating-linear-gradient(180deg,
      rgba(255,255,255,0.08) 0 2px,
      rgba(0,0,0,0.02) 2px 4px,
      transparent 4px 8px);
  background-size:3px 3px, 100% 3px, 100% 8px;
  mix-blend-mode:overlay;
  opacity:var(--sno-wild-noise-opacity, 0.12);
  animation:sno-wild-static-shift 0.22s steps(2) infinite;
}
#sno-wild-banner {
  inset:18px auto auto 50%;
  transform:translateX(-50%);
  width:max-content;
  max-width:min(92vw, 920px);
  height:auto;
  padding:10px 18px;
  border:1px solid var(--sno-wild-accent, rgba(255,255,255,0.8));
  background:var(--sno-wild-banner-bg, rgba(0,0,0,0.82));
  color:var(--sno-wild-banner-color, #fff);
  font:700 clamp(0.75rem, 1vw + 0.55rem, 1.15rem)/1.1 monospace;
  letter-spacing:0.38em;
  text-transform:uppercase;
  text-align:center;
  box-shadow:0 0 28px var(--sno-wild-banner-glow, rgba(255,255,255,0.25));
  text-shadow:0 0 18px var(--sno-wild-banner-glow, rgba(255,255,255,0.25));
  white-space:nowrap;
  animation:sno-wild-banner-flicker 1.2s steps(2) infinite;
}
#sno-wild-ticker {
  inset:auto 0 12px 0;
  height:30px;
  overflow:hidden;
  opacity:0.92;
  color:var(--sno-wild-accent, #fff);
  font:700 0.76rem/30px monospace;
  letter-spacing:0.32em;
  text-transform:uppercase;
  text-shadow:0 0 14px var(--sno-wild-banner-glow, rgba(255,255,255,0.28));
}
#sno-wild-ticker span {
  position:absolute;
  left:0;
  top:0;
  display:inline-block;
  white-space:nowrap;
  padding-left:100%;
  animation:sno-wild-marquee 13s linear infinite;
}
#sno-wild-scraps span {
  position:absolute;
  left:var(--x);
  top:var(--y);
  transform:rotate(var(--rot));
  color:var(--sno-wild-scrap-color, rgba(255,255,255,0.82));
  font:700 clamp(0.6rem, 0.45rem + 0.45vw, 0.94rem)/1 monospace;
  letter-spacing:0.24em;
  text-transform:uppercase;
  white-space:nowrap;
  opacity:0;
  text-shadow:0 0 10px var(--sno-wild-banner-glow, rgba(255,255,255,0.18));
  animation:sno-wild-scrap var(--dur, 6s) linear infinite;
  animation-delay:var(--delay, 0s);
}
body.sno-wild-active .overlay,
body.sno-wild-active header,
body.sno-wild-active .post,
body.sno-wild-active .page-nav-footer { will-change:transform, filter, opacity; }
body.sno-wild-active .overlay { position:relative; z-index:24 !important; isolation:isolate; }
body.sno-wild-active .post:not(.post-active) {
  opacity:0.32 !important;
  filter:saturate(0.78) brightness(0.82);
}
body.sno-wild-active .post.post-active {
  z-index:2;
  opacity:1 !important;
  background:rgba(0,0,0,0.84) !important;
  backdrop-filter:blur(14px) saturate(0.94);
  -webkit-backdrop-filter:blur(14px) saturate(0.94);
  box-shadow:
    0 0 0 2px var(--sno-wild-accent, rgba(255,255,255,0.82)),
    0 18px 44px rgba(0,0,0,0.55),
    inset 0 0 0 1px rgba(255,255,255,0.06) !important;
  text-shadow:none !important;
  filter:none !important;
  animation:none !important;
  transform:none !important;
}
body.sno-wild-active .post.post-active::after {
  content:"";
  position:absolute;
  inset:0;
  border-radius:inherit;
  pointer-events:none;
  background:linear-gradient(180deg, rgba(255,255,255,0.06), rgba(255,255,255,0.01) 38%, rgba(0,0,0,0.08));
}
body.sno-wild-active .post.post-active > * { position:relative; z-index:1; }
@keyframes sno-wild-drift {
  0%,100% { transform:translate3d(0,0,0) scale(1); }
  50% { transform:translate3d(-2%,1.5%,0) scale(1.08); }
}
@keyframes sno-wild-rainfall {
  from { background-position:0 0, 0 0, 0 0; }
  to { background-position:0 280px, 160px 420px, -140px 640px; }
}
@keyframes sno-wild-surge {
  0%,100% { transform:translateY(16%) scaleY(0.92) skewX(0deg); }
  50% { transform:translateY(-8%) scaleY(1.12) skewX(-4deg); }
}
@keyframes sno-wild-lens {
  0%,100% { transform:scale(0.9); opacity:0.18; }
  50% { transform:scale(1.24); opacity:0.52; }
}
@keyframes sno-wild-static-shift {
  0% { transform:translate3d(0,0,0); }
  25% { transform:translate3d(-1.2%,0.6%,0); }
  50% { transform:translate3d(1%, -0.6%,0); }
  75% { transform:translate3d(0.7%,1.1%,0); }
  100% { transform:translate3d(0,0,0); }
}
@keyframes sno-wild-banner-flicker {
  0%,100% { opacity:0.95; }
  12% { opacity:0.4; }
  13% { opacity:1; }
  32% { opacity:0.6; }
  33% { opacity:1; }
  61% { opacity:0.48; }
  62% { opacity:0.98; }
}
@keyframes sno-wild-marquee {
  from { transform:translateX(0); }
  to { transform:translateX(-46%); }
}
@keyframes sno-wild-scrap {
  0%   { transform:translate3d(0,0,0) rotate(var(--rot)); opacity:0; }
  12%  { opacity:0.78; }
  45%  { transform:translate3d(var(--dx), var(--dy), 0) rotate(calc(var(--rot) + 10deg)); opacity:0.92; }
  100% { transform:translate3d(calc(var(--dx) * -0.75), calc(var(--dy) * -0.75), 0) rotate(calc(var(--rot) - 8deg)); opacity:0.18; }
}
@keyframes sno-wild-hard-blink {
  0%,44%,100% { filter:invert(0) grayscale(0) contrast(1.04); }
  45%,49% { filter:invert(1) grayscale(1) contrast(1.8); }
  50%,53% { filter:invert(0) grayscale(0) contrast(1.15); }
  54%,58% { filter:invert(1) grayscale(1) contrast(1.9); }
}
@keyframes sno-wild-jitter {
  0%,100% { transform:translate(0,0); }
  20% { transform:translate(-4px,2px); }
  40% { transform:translate(5px,-4px); }
  60% { transform:translate(-3px,4px); }
  80% { transform:translate(3px,-1px); }
}
@keyframes sno-wild-roll {
  0%,100% { transform:translateY(0); }
  28% { transform:translateY(-12px); }
  29% { transform:translateY(16px); }
  58% { transform:translateY(-8px); }
  59% { transform:translateY(6px); }
}
@keyframes sno-wild-collapse {
  0%,100% { transform:perspective(1200px) rotateX(0deg) scale(1); }
  50% { transform:perspective(1200px) rotateX(10deg) scale(1.04) translateY(1.2%); }
}
@keyframes sno-wild-compress {
  0%,100% { transform:scaleY(1); }
  40% { transform:scaleY(0.9); }
  70% { transform:scaleY(1.08); }
}
@keyframes sno-wild-text-burn {
  0%,100% { text-shadow:0 0 0 transparent; }
  33% { text-shadow:-2px 0 rgba(255,60,60,0.75), 2px 0 rgba(100,255,255,0.7); }
  66% { text-shadow:2px 0 rgba(255,240,80,0.75), -2px 0 rgba(90,90,255,0.7); }
}
body[data-sno-theme="aurora"] {
  --sno-wild-colorwash:
    linear-gradient(112deg, transparent 0 16%, rgba(0,255,179,0.2) 26%, transparent 38%, rgba(0,207,232,0.24) 48%, transparent 60%, rgba(192,132,252,0.24) 70%, transparent 84%),
    radial-gradient(circle at 50% 28%, rgba(255,255,255,0.18) 0%, rgba(0,255,179,0.08) 20%, transparent 48%);
  --sno-wild-rain:
    linear-gradient(180deg, transparent 0 68%, rgba(236,255,255,0.9) 76% 80%, transparent 88%),
    linear-gradient(180deg, transparent 0 72%, rgba(0,255,179,0.6) 80% 84%, transparent 92%),
    linear-gradient(180deg, transparent 0 64%, rgba(192,132,252,0.55) 72% 78%, transparent 86%);
  --sno-wild-rain-size:160px 240px, 220px 280px, 290px 330px;
  --sno-wild-rain-opacity:0.3;
  --sno-wild-rain-speed:1.05s;
  --sno-wild-wave:linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,255,179,0.08) 38%, rgba(192,132,252,0.22) 76%, rgba(3,8,17,0.88) 100%);
  --sno-wild-wave-opacity:0.62;
  --sno-wild-beacon:radial-gradient(circle at 50% 24%, rgba(255,255,255,0.3) 0%, rgba(0,255,179,0.14) 18%, transparent 54%);
  --sno-wild-accent:#8fffe7;
  --sno-wild-banner-bg:rgba(3,16,28,0.74);
  --sno-wild-banner-color:#e9fff8;
  --sno-wild-banner-glow:rgba(0,255,179,0.34);
  --sno-wild-scrap-color:rgba(224,248,240,0.8);
}
body.sno-wild-active[data-sno-theme="aurora"] header,
body.sno-wild-active[data-sno-theme="aurora"] .nav-hints,
body.sno-wild-active[data-sno-theme="aurora"] .post:not(.post-active),
body.sno-wild-active[data-sno-theme="aurora"] .page-nav-footer { animation:sno-wild-text-burn 1.9s steps(1) infinite; }
body[data-sno-theme="brutalist"] {
  --sno-wild-colorwash:
    linear-gradient(134deg, transparent 0 24%, rgba(255,255,255,0.08) 24.5% 25.2%, transparent 26% 42%, rgba(255,255,255,0.06) 42.5% 43.2%, transparent 44%),
    linear-gradient(28deg, transparent 0 30%, rgba(195,32,32,0.22) 30.5% 31.5%, transparent 32% 65%, rgba(255,255,255,0.07) 65.4% 66.2%, transparent 67%),
    radial-gradient(circle at 50% 10%, rgba(255,130,80,0.18) 0%, transparent 44%);
  --sno-wild-rain:
    linear-gradient(180deg, transparent 0 72%, rgba(133,65,22,0.9) 82% 84%, transparent 90%),
    linear-gradient(180deg, transparent 0 60%, rgba(255,255,255,0.35) 70% 72%, transparent 80%);
  --sno-wild-rain-size:240px 300px, 340px 360px;
  --sno-wild-rain-opacity:0.22;
  --sno-wild-wave:linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(24,24,24,0.22) 38%, rgba(92,16,16,0.4) 78%, rgba(0,0,0,0.88) 100%);
  --sno-wild-accent:#ff5d52;
  --sno-wild-banner-bg:rgba(12,12,12,0.84);
  --sno-wild-banner-color:#fff3ef;
  --sno-wild-banner-glow:rgba(255,93,82,0.28);
  --sno-wild-scrap-color:rgba(255,214,204,0.82);
}
body.sno-wild-active[data-sno-theme="brutalist"] header,
body.sno-wild-active[data-sno-theme="brutalist"] .nav-hints,
body.sno-wild-active[data-sno-theme="brutalist"] .post:not(.post-active),
body.sno-wild-active[data-sno-theme="brutalist"] .page-nav-footer { animation:sno-wild-jitter 0.22s steps(2) infinite; }
body[data-sno-theme="cosmos"] {
  --sno-wild-colorwash:
    radial-gradient(circle at 50% 48%, rgba(255,255,255,0.5) 0 2%, rgba(99,0,164,0.5) 6%, rgba(12,4,33,0.05) 16%, transparent 26%),
    radial-gradient(circle at 50% 48%, transparent 0 22%, rgba(255,255,255,0.18) 26% 27%, transparent 31%),
    conic-gradient(from 0deg at 50% 48%, rgba(255,255,255,0.28), transparent 18%, rgba(135,206,250,0.2) 32%, transparent 52%, rgba(255,240,150,0.24) 68%, transparent 84%, rgba(255,255,255,0.28));
  --sno-wild-rain:
    linear-gradient(180deg, transparent 0 70%, rgba(255,255,255,0.92) 80% 82%, transparent 90%),
    linear-gradient(180deg, transparent 0 72%, rgba(180,128,255,0.7) 82% 84%, transparent 92%);
  --sno-wild-rain-size:260px 280px, 320px 360px;
  --sno-wild-rain-opacity:0.26;
  --sno-wild-beacon:radial-gradient(circle at 50% 48%, rgba(255,255,255,0.75) 0%, rgba(155,115,255,0.24) 14%, transparent 36%);
  --sno-wild-wave:radial-gradient(circle at 50% 110%, rgba(255,255,255,0.12) 0%, rgba(20,6,44,0.52) 45%, rgba(2,2,12,0.94) 100%);
  --sno-wild-accent:#f8d9ff;
  --sno-wild-banner-bg:rgba(8,6,24,0.82);
  --sno-wild-banner-color:#ffffff;
  --sno-wild-banner-glow:rgba(238,214,255,0.34);
  --sno-wild-scrap-color:rgba(240,228,255,0.82);
}
body.sno-wild-active[data-sno-theme="cosmos"] header,
body.sno-wild-active[data-sno-theme="cosmos"] .nav-hints,
body.sno-wild-active[data-sno-theme="cosmos"] .post:not(.post-active),
body.sno-wild-active[data-sno-theme="cosmos"] .page-nav-footer { animation:sno-wild-collapse 4.2s ease-in-out infinite; }
body[data-sno-theme="dos"] {
  --sno-wild-colorwash:
    linear-gradient(90deg, rgba(255,255,255,0.12) 0 50%, rgba(0,0,0,0.16) 50% 100%),
    radial-gradient(circle at 50% 14%, rgba(85,255,255,0.18) 0%, transparent 38%);
  --sno-wild-rain:
    linear-gradient(180deg, transparent 0 62%, rgba(255,255,255,0.95) 68% 72%, transparent 78%),
    linear-gradient(180deg, transparent 0 54%, rgba(85,255,255,0.85) 60% 64%, transparent 70%),
    linear-gradient(180deg, transparent 0 70%, rgba(255,255,85,0.75) 76% 80%, transparent 86%);
  --sno-wild-rain-size:120px 180px, 190px 220px, 280px 260px;
  --sno-wild-rain-opacity:0.34;
  --sno-wild-rain-speed:0.62s;
  --sno-wild-wave:linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,0,170,0.18) 42%, rgba(0,0,0,0.82) 100%);
  --sno-wild-accent:#ffff55;
  --sno-wild-banner-bg:#0000aa;
  --sno-wild-banner-color:#ffffff;
  --sno-wild-banner-glow:rgba(85,255,255,0.28);
  --sno-wild-scrap-color:#ffff55;
}
body.sno-wild-active[data-sno-theme="dos"] header,
body.sno-wild-active[data-sno-theme="dos"] .nav-hints,
body.sno-wild-active[data-sno-theme="dos"] .post:not(.post-active),
body.sno-wild-active[data-sno-theme="dos"] .page-nav-footer {
  animation:sno-wild-hard-blink 0.72s steps(1) infinite, sno-wild-jitter 0.14s steps(2) infinite;
}
body[data-sno-theme="matrix"] {
  --sno-wild-colorwash:
    radial-gradient(circle at 50% 0%, rgba(0,255,65,0.18) 0%, transparent 42%),
    linear-gradient(180deg, rgba(0,40,0,0) 0%, rgba(0,255,65,0.09) 60%, rgba(0,0,0,0.62) 100%);
  --sno-wild-rain:
    linear-gradient(180deg, transparent 0 54%, rgba(187,255,210,1) 62% 68%, transparent 76%),
    linear-gradient(180deg, transparent 0 44%, rgba(0,255,65,0.9) 52% 58%, transparent 66%),
    linear-gradient(180deg, transparent 0 68%, rgba(140,255,180,0.72) 76% 82%, transparent 90%);
  --sno-wild-rain-size:90px 180px, 130px 210px, 200px 280px;
  --sno-wild-rain-opacity:0.5;
  --sno-wild-rain-speed:0.38s;
  --sno-wild-wave:linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,255,65,0.04) 40%, rgba(0,0,0,0.92) 100%);
  --sno-wild-accent:#98ffac;
  --sno-wild-banner-bg:rgba(0,10,0,0.78);
  --sno-wild-banner-color:#d8ffe2;
  --sno-wild-banner-glow:rgba(0,255,65,0.32);
  --sno-wild-scrap-color:rgba(152,255,172,0.84);
}
body.sno-wild-active[data-sno-theme="matrix"] header,
body.sno-wild-active[data-sno-theme="matrix"] .nav-hints,
body.sno-wild-active[data-sno-theme="matrix"] .post:not(.post-active),
body.sno-wild-active[data-sno-theme="matrix"] .page-nav-footer { animation:sno-wild-text-burn 1.1s steps(1) infinite; }
body[data-sno-theme="neon"] {
  --sno-wild-colorwash:
    conic-gradient(from 90deg at 50% 20%, rgba(255,231,0,0.16), transparent 18%, rgba(255,0,204,0.22) 32%, transparent 50%, rgba(0,245,255,0.24) 66%, transparent 84%, rgba(255,231,0,0.16)),
    radial-gradient(circle at 50% 15%, rgba(255,255,255,0.22) 0%, rgba(0,245,255,0.08) 26%, transparent 56%);
  --sno-wild-rain:
    linear-gradient(118deg, transparent 0 46%, rgba(255,255,255,0.95) 49% 50%, transparent 53%),
    linear-gradient(62deg, transparent 0 45%, rgba(0,245,255,0.75) 48% 49%, transparent 52%),
    linear-gradient(132deg, transparent 0 42%, rgba(255,0,204,0.82) 45% 46%, transparent 49%);
  --sno-wild-rain-size:280px 280px, 360px 360px, 420px 420px;
  --sno-wild-rain-opacity:0.34;
  --sno-wild-rain-speed:0.72s;
  --sno-wild-beacon:radial-gradient(circle at 50% 20%, rgba(255,255,255,0.44) 0%, rgba(255,0,204,0.18) 14%, transparent 42%);
  --sno-wild-wave:linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(255,0,204,0.08) 44%, rgba(11,0,26,0.88) 100%);
  --sno-wild-accent:#ffe700;
  --sno-wild-banner-bg:rgba(11,0,26,0.8);
  --sno-wild-banner-color:#faff9c;
  --sno-wild-banner-glow:rgba(255,231,0,0.42);
  --sno-wild-scrap-color:rgba(255,245,174,0.88);
}
body.sno-wild-active[data-sno-theme="neon"] header,
body.sno-wild-active[data-sno-theme="neon"] .nav-hints,
body.sno-wild-active[data-sno-theme="neon"] .post:not(.post-active),
body.sno-wild-active[data-sno-theme="neon"] .page-nav-footer { animation:sno-wild-text-burn 1.3s steps(1) infinite; }
body[data-sno-theme="ocean"] {
  --sno-wild-colorwash:
    radial-gradient(circle at 50% 120%, rgba(0,180,255,0.22) 0%, rgba(0,31,63,0.08) 34%, transparent 56%),
    radial-gradient(circle at 20% 28%, rgba(147,255,227,0.16) 0%, transparent 32%),
    radial-gradient(circle at 78% 22%, rgba(120,255,235,0.14) 0%, transparent 30%);
  --sno-wild-rain:
    linear-gradient(165deg, transparent 0 58%, rgba(220,255,255,0.95) 62% 66%, transparent 72%),
    linear-gradient(175deg, transparent 0 48%, rgba(98,255,228,0.72) 52% 56%, transparent 62%),
    linear-gradient(170deg, transparent 0 68%, rgba(170,255,240,0.78) 72% 76%, transparent 82%);
  --sno-wild-rain-size:170px 260px, 240px 320px, 310px 360px;
  --sno-wild-rain-opacity:0.26;
  --sno-wild-rain-speed:0.82s;
  --sno-wild-wave:radial-gradient(circle at 50% 100%, rgba(0,255,220,0.3) 0%, rgba(0,80,120,0.32) 28%, rgba(1,20,40,0.92) 74%);
  --sno-wild-wave-opacity:0.86;
  --sno-wild-beacon:radial-gradient(circle at 50% 88%, rgba(147,255,227,0.18) 0%, transparent 38%);
  --sno-wild-accent:#bafcff;
  --sno-wild-banner-bg:rgba(0,24,42,0.8);
  --sno-wild-banner-color:#e1ffff;
  --sno-wild-banner-glow:rgba(120,255,235,0.34);
  --sno-wild-scrap-color:rgba(202,240,248,0.86);
}
body.sno-wild-active[data-sno-theme="ocean"] header,
body.sno-wild-active[data-sno-theme="ocean"] .nav-hints,
body.sno-wild-active[data-sno-theme="ocean"] .post:not(.post-active),
body.sno-wild-active[data-sno-theme="ocean"] .page-nav-footer { animation:sno-wild-collapse 5.2s ease-in-out infinite; }
body[data-sno-theme="plasma"] {
  --sno-wild-colorwash:
    radial-gradient(circle at 50% 48%, rgba(255,255,255,0.66) 0%, rgba(165,230,255,0.18) 10%, transparent 24%),
    conic-gradient(from 0deg at 50% 48%, rgba(255,255,255,0.28), rgba(157,255,255,0.16), rgba(251,146,255,0.28), rgba(255,255,255,0.28)),
    radial-gradient(circle at 50% 110%, rgba(65,14,90,0.34) 0%, transparent 52%);
  --sno-wild-rain:
    linear-gradient(180deg, transparent 0 70%, rgba(255,255,255,0.92) 78% 82%, transparent 90%),
    linear-gradient(180deg, transparent 0 60%, rgba(132,255,255,0.72) 68% 72%, transparent 80%);
  --sno-wild-rain-size:220px 260px, 320px 360px;
  --sno-wild-rain-opacity:0.28;
  --sno-wild-beacon:radial-gradient(circle at 50% 48%, rgba(255,255,255,0.78) 0%, rgba(128,224,255,0.2) 12%, transparent 36%);
  --sno-wild-wave:linear-gradient(180deg, rgba(255,255,255,0) 0%, rgba(144,220,255,0.12) 44%, rgba(8,2,20,0.9) 100%);
  --sno-wild-accent:#fef3ff;
  --sno-wild-banner-bg:rgba(18,6,36,0.8);
  --sno-wild-banner-color:#ffffff;
  --sno-wild-banner-glow:rgba(160,224,255,0.42);
  --sno-wild-scrap-color:rgba(248,240,255,0.88);
}
body.sno-wild-active[data-sno-theme="plasma"] header,
body.sno-wild-active[data-sno-theme="plasma"] .nav-hints,
body.sno-wild-active[data-sno-theme="plasma"] .post:not(.post-active),
body.sno-wild-active[data-sno-theme="plasma"] .page-nav-footer { animation:sno-wild-text-burn 1.5s steps(1) infinite; }
body[data-sno-theme="retro"] {
  --sno-wild-colorwash:
    linear-gradient(90deg, rgba(255,80,0,0.18) 0 18%, transparent 24% 76%, rgba(255,220,80,0.14) 82% 100%),
    linear-gradient(180deg, rgba(255,255,255,0.08), transparent 16%, rgba(255,255,255,0.06) 34%, transparent 54%, rgba(255,255,255,0.05) 78%, transparent 100%);
  --sno-wild-rain:
    linear-gradient(180deg, transparent 0 46%, rgba(255,255,255,0.88) 52% 56%, transparent 62%),
    linear-gradient(180deg, transparent 0 64%, rgba(255,190,50,0.82) 70% 74%, transparent 80%);
  --sno-wild-rain-size:160px 220px, 260px 300px;
  --sno-wild-rain-opacity:0.24;
  --sno-wild-wave:linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(255,190,50,0.08) 42%, rgba(10,4,0,0.9) 100%);
  --sno-wild-accent:#ffcf63;
  --sno-wild-banner-bg:rgba(24,10,0,0.82);
  --sno-wild-banner-color:#ffe7a5;
  --sno-wild-banner-glow:rgba(255,190,50,0.34);
  --sno-wild-scrap-color:rgba(255,215,120,0.86);
}
body.sno-wild-active[data-sno-theme="retro"] header,
body.sno-wild-active[data-sno-theme="retro"] .nav-hints,
body.sno-wild-active[data-sno-theme="retro"] .post:not(.post-active),
body.sno-wild-active[data-sno-theme="retro"] .page-nav-footer {
  animation:sno-wild-roll 0.85s linear infinite, sno-wild-jitter 0.18s steps(2) infinite;
}
body[data-sno-theme="retrofuture"] {
  --sno-wild-colorwash:
    radial-gradient(circle at 50% 20%, rgba(255,220,140,0.24) 0%, transparent 38%),
    linear-gradient(180deg, rgba(169,111,46,0.08) 0%, rgba(133,86,33,0.16) 60%, rgba(50,29,12,0.52) 100%);
  --sno-wild-rain:
    linear-gradient(180deg, transparent 0 66%, rgba(255,232,180,0.82) 74% 78%, transparent 86%),
    linear-gradient(180deg, transparent 0 58%, rgba(170,120,60,0.7) 66% 70%, transparent 78%);
  --sno-wild-rain-size:180px 240px, 260px 320px;
  --sno-wild-rain-opacity:0.22;
  --sno-wild-wave:linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(255,206,128,0.07) 42%, rgba(28,18,9,0.92) 100%);
  --sno-wild-accent:#ffd793;
  --sno-wild-banner-bg:rgba(26,16,8,0.82);
  --sno-wild-banner-color:#fff4d6;
  --sno-wild-banner-glow:rgba(255,215,147,0.3);
  --sno-wild-scrap-color:rgba(255,233,190,0.86);
}
body.sno-wild-active[data-sno-theme="retrofuture"] header,
body.sno-wild-active[data-sno-theme="retrofuture"] .nav-hints,
body.sno-wild-active[data-sno-theme="retrofuture"] .post:not(.post-active),
body.sno-wild-active[data-sno-theme="retrofuture"] .page-nav-footer { animation:sno-wild-text-burn 1.6s steps(1) infinite; }
body[data-sno-theme="spaceage"] {
  --sno-wild-colorwash:
    linear-gradient(180deg, rgba(255,170,90,0.16) 0%, transparent 24%, rgba(80,220,255,0.12) 54%, transparent 100%),
    radial-gradient(circle at 50% -10%, rgba(255,255,255,0.46) 0%, rgba(255,180,120,0.16) 18%, transparent 42%);
  --sno-wild-rain:
    linear-gradient(160deg, transparent 0 52%, rgba(255,220,190,0.95) 58% 62%, transparent 68%),
    linear-gradient(170deg, transparent 0 42%, rgba(255,138,84,0.74) 48% 52%, transparent 58%),
    linear-gradient(180deg, transparent 0 62%, rgba(120,220,255,0.68) 68% 72%, transparent 78%);
  --sno-wild-rain-size:180px 260px, 260px 320px, 360px 420px;
  --sno-wild-rain-opacity:0.28;
  --sno-wild-wave:linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(255,149,90,0.08) 44%, rgba(0,10,18,0.9) 100%);
  --sno-wild-accent:#ffd0a8;
  --sno-wild-banner-bg:rgba(3,18,26,0.82);
  --sno-wild-banner-color:#fff1e0;
  --sno-wild-banner-glow:rgba(255,172,124,0.34);
  --sno-wild-scrap-color:rgba(255,225,206,0.82);
}
body.sno-wild-active[data-sno-theme="spaceage"] header,
body.sno-wild-active[data-sno-theme="spaceage"] .nav-hints,
body.sno-wild-active[data-sno-theme="spaceage"] .post:not(.post-active),
body.sno-wild-active[data-sno-theme="spaceage"] .page-nav-footer {
  animation:sno-wild-compress 1.8s ease-in-out infinite, sno-wild-jitter 0.42s steps(2) infinite;
}
body[data-sno-theme="synthwave"] {
  --sno-wild-colorwash:
    linear-gradient(180deg, rgba(255,20,147,0.14) 0%, transparent 20%, rgba(0,255,255,0.12) 52%, transparent 74%),
    radial-gradient(circle at 50% 18%, rgba(255,255,255,0.34) 0%, rgba(255,20,147,0.14) 14%, transparent 36%),
    linear-gradient(90deg, rgba(255,20,147,0.14) 0 1px, transparent 1px 11%);
  --sno-wild-rain:
    linear-gradient(180deg, transparent 0 68%, rgba(255,255,255,0.95) 76% 80%, transparent 88%),
    linear-gradient(180deg, transparent 0 60%, rgba(255,20,147,0.82) 68% 72%, transparent 80%),
    linear-gradient(180deg, transparent 0 50%, rgba(0,255,255,0.74) 58% 62%, transparent 70%);
  --sno-wild-rain-size:160px 220px, 260px 320px, 360px 400px;
  --sno-wild-rain-opacity:0.32;
  --sno-wild-wave:linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(255,20,147,0.08) 42%, rgba(5,1,22,0.92) 100%);
  --sno-wild-accent:#ff7de9;
  --sno-wild-banner-bg:rgba(18,0,34,0.84);
  --sno-wild-banner-color:#ffe9ff;
  --sno-wild-banner-glow:rgba(255,125,233,0.4);
  --sno-wild-scrap-color:rgba(255,225,255,0.86);
}
body.sno-wild-active[data-sno-theme="synthwave"] header,
body.sno-wild-active[data-sno-theme="synthwave"] .nav-hints,
body.sno-wild-active[data-sno-theme="synthwave"] .post:not(.post-active),
body.sno-wild-active[data-sno-theme="synthwave"] .page-nav-footer { animation:sno-wild-collapse 3.8s ease-in-out infinite; }
body[data-sno-theme="terminal"] {
  --sno-wild-colorwash:
    linear-gradient(180deg, rgba(51,255,51,0.14) 0%, transparent 24%, rgba(0,0,0,0.14) 46%, transparent 68%, rgba(51,255,51,0.1) 100%),
    radial-gradient(circle at 50% 10%, rgba(255,255,255,0.18) 0%, transparent 38%);
  --sno-wild-rain:
    linear-gradient(180deg, transparent 0 52%, rgba(255,255,255,0.94) 58% 62%, transparent 68%),
    linear-gradient(180deg, transparent 0 44%, rgba(51,255,51,0.9) 50% 54%, transparent 60%),
    linear-gradient(180deg, transparent 0 64%, rgba(140,255,140,0.7) 70% 74%, transparent 80%);
  --sno-wild-rain-size:100px 180px, 140px 210px, 220px 260px;
  --sno-wild-rain-opacity:0.4;
  --sno-wild-rain-speed:0.42s;
  --sno-wild-wave:linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(51,255,51,0.06) 42%, rgba(0,0,0,0.95) 100%);
  --sno-wild-accent:#8dff8d;
  --sno-wild-banner-bg:rgba(0,10,0,0.8);
  --sno-wild-banner-color:#d7ffd7;
  --sno-wild-banner-glow:rgba(51,255,51,0.34);
  --sno-wild-scrap-color:rgba(141,255,141,0.84);
}
body.sno-wild-active[data-sno-theme="terminal"] header,
body.sno-wild-active[data-sno-theme="terminal"] .nav-hints,
body.sno-wild-active[data-sno-theme="terminal"] .post:not(.post-active),
body.sno-wild-active[data-sno-theme="terminal"] .page-nav-footer {
  animation:sno-wild-hard-blink 0.82s steps(1) infinite, sno-wild-jitter 0.16s steps(2) infinite;
}
body.sno-wild-active[data-sno-theme="terminal"] .post.post-active {
  filter:invert(1) grayscale(1) contrast(1.28) !important;
  background:#fff !important;
  color:#000 !important;
  text-shadow:none !important;
}
body.sno-wild-active[data-sno-theme="terminal"] .post.post-active a { color:#000 !important; }
body.sno-wild-active[data-sno-theme="terminal"] .post.post-active .post-time,
body.sno-wild-active[data-sno-theme="terminal"] .post.post-active .post-header strong { color:#000 !important; }
body[data-sno-theme="tropicale"] {
  --sno-wild-colorwash:
    linear-gradient(180deg, rgba(255,255,255,0.12) 0%, transparent 18%, rgba(0,110,160,0.1) 46%, rgba(0,40,70,0.38) 100%),
    radial-gradient(circle at 50% 110%, rgba(0,210,255,0.24) 0%, transparent 44%);
  --sno-wild-rain:
    linear-gradient(168deg, transparent 0 54%, rgba(255,255,255,0.98) 60% 64%, transparent 70%),
    linear-gradient(176deg, transparent 0 42%, rgba(200,255,255,0.72) 48% 52%, transparent 58%),
    linear-gradient(172deg, transparent 0 64%, rgba(255,230,180,0.52) 70% 74%, transparent 80%);
  --sno-wild-rain-size:150px 260px, 230px 320px, 320px 400px;
  --sno-wild-rain-opacity:0.44;
  --sno-wild-rain-speed:0.5s;
  --sno-wild-wave:radial-gradient(circle at 50% 100%, rgba(175,255,255,0.28) 0%, rgba(0,135,190,0.32) 26%, rgba(0,24,44,0.92) 74%);
  --sno-wild-wave-opacity:0.88;
  --sno-wild-accent:#fff2bf;
  --sno-wild-banner-bg:rgba(0,34,56,0.82);
  --sno-wild-banner-color:#fff7db;
  --sno-wild-banner-glow:rgba(255,242,191,0.34);
  --sno-wild-scrap-color:rgba(255,244,213,0.84);
}
body.sno-wild-active[data-sno-theme="tropicale"] header,
body.sno-wild-active[data-sno-theme="tropicale"] .nav-hints,
body.sno-wild-active[data-sno-theme="tropicale"] .post:not(.post-active),
body.sno-wild-active[data-sno-theme="tropicale"] .page-nav-footer { animation:sno-wild-jitter 0.3s steps(2) infinite; }
body[data-sno-theme="volcano"] {
  --sno-wild-colorwash:
    linear-gradient(180deg, rgba(60,60,60,0.28) 0%, rgba(40,40,40,0.18) 26%, transparent 48%, rgba(255,140,0,0.18) 72%, rgba(255,214,102,0.14) 100%),
    radial-gradient(circle at 50% 8%, rgba(255,255,255,0.24) 0%, rgba(255,150,60,0.1) 18%, transparent 42%);
  --sno-wild-rain:
    linear-gradient(180deg, transparent 0 42%, rgba(110,110,110,0.92) 48% 54%, transparent 60%),
    linear-gradient(180deg, transparent 0 54%, rgba(255,170,80,0.82) 60% 66%, transparent 72%),
    linear-gradient(180deg, transparent 0 64%, rgba(255,235,140,0.54) 70% 76%, transparent 82%);
  --sno-wild-rain-size:150px 230px, 220px 300px, 320px 360px;
  --sno-wild-rain-opacity:0.38;
  --sno-wild-rain-speed:0.68s;
  --sno-wild-wave:linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(255,120,20,0.1) 42%, rgba(55,20,0,0.9) 100%);
  --sno-wild-accent:#ffdf76;
  --sno-wild-banner-bg:rgba(22,8,0,0.84);
  --sno-wild-banner-color:#fff0c2;
  --sno-wild-banner-glow:rgba(255,190,70,0.34);
  --sno-wild-scrap-color:rgba(255,230,170,0.86);
}
body.sno-wild-active[data-sno-theme="volcano"] header,
body.sno-wild-active[data-sno-theme="volcano"] .nav-hints,
body.sno-wild-active[data-sno-theme="volcano"] .post:not(.post-active),
body.sno-wild-active[data-sno-theme="volcano"] .page-nav-footer { animation:sno-wild-jitter 0.24s steps(2) infinite; }
body[data-sno-theme="noir"] {
  --sno-wild-colorwash:
    radial-gradient(circle at 18% 18%, rgba(36,65,130,0.2) 0%, transparent 24%),
    radial-gradient(circle at 82% 24%, rgba(169,55,43,0.24) 0%, transparent 24%),
    linear-gradient(180deg, rgba(240,234,214,0.08) 0%, transparent 26%, rgba(0,0,0,0.14) 48%, transparent 72%, rgba(240,234,214,0.06) 100%);
  --sno-wild-rain:
    linear-gradient(168deg, transparent 0 56%, rgba(255,255,255,0.96) 62% 66%, transparent 72%),
    linear-gradient(174deg, transparent 0 48%, rgba(210,220,255,0.72) 54% 58%, transparent 64%),
    linear-gradient(170deg, transparent 0 64%, rgba(255,170,170,0.68) 70% 74%, transparent 80%);
  --sno-wild-rain-size:170px 260px, 250px 340px, 340px 420px;
  --sno-wild-rain-opacity:0.34;
  --sno-wild-rain-speed:0.58s;
  --sno-wild-wave:linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(255,255,255,0.04) 44%, rgba(0,0,0,0.96) 100%);
  --sno-wild-beacon:linear-gradient(90deg, rgba(36,65,130,0.12), transparent 28%, rgba(169,55,43,0.14) 72%, transparent);
  --sno-wild-accent:#f0ead6;
  --sno-wild-banner-bg:rgba(5,5,5,0.84);
  --sno-wild-banner-color:#fff6e2;
  --sno-wild-banner-glow:rgba(240,234,214,0.28);
  --sno-wild-scrap-color:rgba(255,242,224,0.84);
}
body.sno-wild-active[data-sno-theme="noir"] header,
body.sno-wild-active[data-sno-theme="noir"] .nav-hints,
body.sno-wild-active[data-sno-theme="noir"] .post:not(.post-active),
body.sno-wild-active[data-sno-theme="noir"] .page-nav-footer { animation:sno-wild-roll 1.1s linear infinite, sno-wild-text-burn 1.8s steps(1) infinite; }
body[data-sno-theme="cathedral"] {
  --sno-wild-colorwash:
    radial-gradient(circle at 50% 10%, rgba(217,191,120,0.22) 0%, transparent 26%),
    conic-gradient(from 0deg at 50% 18%, rgba(79,127,209,0.18), rgba(113,35,61,0.22), rgba(217,191,120,0.18), rgba(79,127,209,0.18)),
    linear-gradient(180deg, rgba(255,255,255,0.04) 0%, transparent 26%, rgba(0,0,0,0.18) 100%);
  --sno-wild-rain:
    linear-gradient(180deg, transparent 0 64%, rgba(255,220,140,0.92) 72% 76%, transparent 84%),
    linear-gradient(180deg, transparent 0 58%, rgba(255,140,90,0.72) 66% 70%, transparent 78%),
    linear-gradient(180deg, transparent 0 52%, rgba(120,160,255,0.66) 60% 64%, transparent 72%);
  --sno-wild-rain-size:180px 220px, 260px 320px, 320px 420px;
  --sno-wild-rain-opacity:0.26;
  --sno-wild-wave:radial-gradient(circle at 50% 100%, rgba(217,191,120,0.18) 0%, rgba(113,35,61,0.24) 34%, rgba(8,6,10,0.94) 78%);
  --sno-wild-beacon:radial-gradient(circle at 50% 18%, rgba(255,244,210,0.36) 0%, rgba(217,191,120,0.16) 18%, transparent 40%);
  --sno-wild-accent:#f5d89a;
  --sno-wild-banner-bg:rgba(18,11,20,0.84);
  --sno-wild-banner-color:#fff4d8;
  --sno-wild-banner-glow:rgba(217,191,120,0.34);
  --sno-wild-scrap-color:rgba(255,239,206,0.86);
}
body.sno-wild-active[data-sno-theme="cathedral"] header,
body.sno-wild-active[data-sno-theme="cathedral"] .nav-hints,
body.sno-wild-active[data-sno-theme="cathedral"] .post:not(.post-active),
body.sno-wild-active[data-sno-theme="cathedral"] .page-nav-footer { animation:sno-wild-collapse 4.4s ease-in-out infinite, sno-wild-text-burn 1.7s steps(1) infinite; }
body[data-sno-theme="surveillance"] {
  --sno-wild-colorwash:
    linear-gradient(180deg, rgba(99,243,168,0.12) 0%, transparent 22%, rgba(255,77,92,0.08) 56%, transparent 100%),
    linear-gradient(90deg, rgba(99,243,168,0.08) 0 1px, transparent 1px 8%);
  --sno-wild-rain:
    linear-gradient(180deg, transparent 0 52%, rgba(188,255,212,0.96) 58% 62%, transparent 68%),
    linear-gradient(180deg, transparent 0 44%, rgba(99,243,168,0.82) 50% 54%, transparent 60%),
    linear-gradient(180deg, transparent 0 62%, rgba(255,77,92,0.68) 68% 72%, transparent 78%);
  --sno-wild-rain-size:100px 180px, 160px 220px, 260px 320px;
  --sno-wild-rain-opacity:0.4;
  --sno-wild-rain-speed:0.38s;
  --sno-wild-wave:linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(99,243,168,0.06) 42%, rgba(0,0,0,0.95) 100%);
  --sno-wild-accent:#bcffd4;
  --sno-wild-banner-bg:rgba(6,12,9,0.84);
  --sno-wild-banner-color:#ecfff5;
  --sno-wild-banner-glow:rgba(99,243,168,0.34);
  --sno-wild-scrap-color:rgba(188,255,212,0.86);
}
body.sno-wild-active[data-sno-theme="surveillance"] header,
body.sno-wild-active[data-sno-theme="surveillance"] .nav-hints,
body.sno-wild-active[data-sno-theme="surveillance"] .post:not(.post-active),
body.sno-wild-active[data-sno-theme="surveillance"] .page-nav-footer { animation:sno-wild-hard-blink 0.94s steps(1) infinite, sno-wild-jitter 0.18s steps(2) infinite; }
body[data-sno-theme="biomech"] {
  --sno-wild-colorwash:
    radial-gradient(circle at 50% 44%, rgba(245,91,125,0.22) 0%, transparent 24%),
    conic-gradient(from 0deg at 50% 44%, rgba(147,255,216,0.2), rgba(128,63,93,0.28), rgba(208,199,187,0.14), rgba(147,255,216,0.2)),
    linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(147,255,216,0.04) 40%, rgba(0,0,0,0.24) 100%);
  --sno-wild-rain:
    linear-gradient(180deg, transparent 0 64%, rgba(245,91,125,0.86) 72% 76%, transparent 84%),
    linear-gradient(180deg, transparent 0 56%, rgba(147,255,216,0.84) 64% 68%, transparent 76%),
    linear-gradient(180deg, transparent 0 48%, rgba(208,199,187,0.62) 56% 60%, transparent 68%);
  --sno-wild-rain-size:150px 220px, 240px 340px, 320px 420px;
  --sno-wild-rain-opacity:0.3;
  --sno-wild-wave:radial-gradient(circle at 50% 100%, rgba(245,91,125,0.18) 0%, rgba(128,63,93,0.3) 32%, rgba(5,4,8,0.96) 78%);
  --sno-wild-beacon:radial-gradient(circle at 50% 44%, rgba(255,210,220,0.28) 0%, rgba(147,255,216,0.12) 14%, transparent 36%);
  --sno-wild-accent:#93ffd8;
  --sno-wild-banner-bg:rgba(10,8,14,0.84);
  --sno-wild-banner-color:#e7fff6;
  --sno-wild-banner-glow:rgba(147,255,216,0.34);
  --sno-wild-scrap-color:rgba(216,255,242,0.88);
}
body.sno-wild-active[data-sno-theme="biomech"] header,
body.sno-wild-active[data-sno-theme="biomech"] .nav-hints,
body.sno-wild-active[data-sno-theme="biomech"] .post:not(.post-active),
body.sno-wild-active[data-sno-theme="biomech"] .page-nav-footer { animation:sno-wild-collapse 3.6s ease-in-out infinite, sno-wild-jitter 0.22s steps(2) infinite; }
body[data-sno-theme="paper"] {
  --sno-wild-colorwash:
    linear-gradient(180deg, rgba(184,58,46,0.1) 0%, transparent 18%, rgba(62,93,138,0.06) 52%, rgba(0,0,0,0.04) 100%),
    radial-gradient(circle at 22% 24%, rgba(0,0,0,0.05) 0%, transparent 18%),
    radial-gradient(circle at 78% 72%, rgba(0,0,0,0.05) 0%, transparent 18%);
  --sno-wild-rain:
    linear-gradient(180deg, transparent 0 54%, rgba(0,0,0,0.34) 60% 64%, transparent 70%),
    linear-gradient(180deg, transparent 0 62%, rgba(184,58,46,0.46) 68% 72%, transparent 78%),
    linear-gradient(180deg, transparent 0 48%, rgba(62,93,138,0.42) 54% 58%, transparent 64%);
  --sno-wild-rain-size:160px 220px, 260px 320px, 360px 420px;
  --sno-wild-rain-opacity:0.24;
  --sno-wild-rain-speed:0.74s;
  --sno-wild-wave:linear-gradient(180deg, rgba(255,255,255,0) 0%, rgba(0,0,0,0.03) 44%, rgba(215,199,167,0.2) 100%);
  --sno-wild-accent:#b83a2e;
  --sno-wild-banner-bg:rgba(250,244,231,0.88);
  --sno-wild-banner-color:#16120f;
  --sno-wild-banner-glow:rgba(184,58,46,0.18);
  --sno-wild-scrap-color:rgba(22,18,15,0.76);
}
body.sno-wild-active[data-sno-theme="paper"] header,
body.sno-wild-active[data-sno-theme="paper"] .nav-hints,
body.sno-wild-active[data-sno-theme="paper"] .post:not(.post-active),
body.sno-wild-active[data-sno-theme="paper"] .page-nav-footer { animation:sno-wild-roll 0.9s linear infinite, sno-wild-text-burn 2.2s steps(1) infinite; }
/* Host note under the site subtitle (all themes) */
.logo-host { font-size:0.65rem; opacity:0.55; margin-top:4px; letter-spacing:0.3px; line-height:1.3; }
/* Atom feed link in header (paired with transmit in .nav) */
.nav { display:flex; align-items:center; gap:clamp(10px,2.2vw,20px); flex-wrap:wrap; justify-content:flex-end; }
a.header-feed-link { font-size:0.8rem; text-decoration:none; opacity:0.82; letter-spacing:0.04em; white-space:nowrap; }
a.header-feed-link:hover { opacity:1; text-decoration:underline; }
/* Header logo/title can reopen the splash overlay. */
.logo-mark, .logo-title h1, #sn-logo { cursor:pointer; }
/* Full-viewport splash (theme-specific colours/animation on each .splash-THEMENAME) */
#splash-overlay { position:fixed; inset:0; z-index:2000; display:flex; flex-direction:column; align-items:center;
  justify-content:center; text-align:center; padding:max(16px,4vw); box-sizing:border-box; cursor:pointer;
  transition:opacity .55s ease, visibility .55s ease, transform .55s ease; }
#splash-overlay.splash--dismissed { opacity:0 !important; visibility:hidden !important;
  pointer-events:none !important; transform:scale(1.02); }
#splash-overlay:focus { outline:2px solid rgba(255,255,255,0.35); outline-offset:4px; }
/* Vignette over WebGL so 3D motion does not overpower the edges */
#splash-overlay::before { content:""; position:absolute; inset:0; z-index:1; pointer-events:none;
  background: radial-gradient(ellipse 92% 82% at 50% 42%, rgba(0,0,0,0) 32%, rgba(0,0,0,0.26) 68%, rgba(0,0,0,0.48) 100%); }
.splash-title { font-weight:700; letter-spacing:0.06em; line-height:1.15; }
.splash-tag { margin-top:0.35rem; font-size:0.76rem; letter-spacing:0.2em; text-transform:uppercase; }
.splash-hint { margin-top:1.25rem; font-size:0.72rem; letter-spacing:0.12em; }
#splash-overlay .splash-gl-canvas { position:absolute; inset:0; width:100%; height:100%; display:block; z-index:0; pointer-events:none; }
/* Frosted panel so title/tag/hint stay readable over busy shaders */
#splash-overlay .splash-inner { position:relative; z-index:2; max-width:min(520px,92vw);
  padding: clamp(1.15rem, 3.2vw, 1.75rem) clamp(1.3rem, 3.8vw, 1.95rem); border-radius:14px;
  background: rgba(0, 0, 0, 0.58); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px);
  box-shadow: 0 14px 44px rgba(0, 0, 0, 0.58), inset 0 1px 0 rgba(255, 255, 255, 0.07); }
#splash-overlay.splash-brutalist .splash-inner.splash-frame {
  padding: clamp(1.4rem, 4.5vw, 2.25rem) clamp(1.1rem, 3.5vw, 1.9rem); background: rgba(0, 0, 0, 0.78); }
html.sno-splash-skip #splash-overlay { display:none !important; visibility:hidden !important; pointer-events:none !important; }
/* Images embedded in markdown posts */
.post-text img { max-width:100%; max-height:320px; object-fit:contain; border-radius:6px; cursor:pointer; }
#post-modal .post-text img, #modal-content img { max-height:none; cursor:default; }
/* Markdown post typography: restore spacing stripped by the global reset.
   Rules apply to both the list-view .post-text and the zoomed-in #modal-content
   so the formatting is identical in both views. */
.post-text p, #modal-content p { margin:0.65em 0; }
.post-text ul, .post-text ol, #modal-content ul, #modal-content ol { margin:0.65em 0; padding-left:1.8em; }
.post-text li, #modal-content li { margin:0.3em 0; }
.post-text p:first-child, #modal-content p:first-child { margin-top:0; }
.post-text p:last-child, .post-text ul:last-child, .post-text ol:last-child,
#modal-content p:last-child, #modal-content ul:last-child, #modal-content ol:last-child { margin-bottom:0; }
{{end}}

{{define "navmodal"}}
<div class="post-modal" id="post-modal" role="dialog" aria-modal="true" aria-label="Expanded post">
    <div class="modal-inner">
        <button class="modal-close" onclick="closeModal()">[ ESC ] CLOSE</button>
        <div id="modal-content"></div>
        <div class="sno-scroll-end" id="sno-scroll-end" aria-hidden="true"></div>
    </div>
</div>
{{end}}

{{define "navscript"}}
<script>
    const SNONUX_SOUNDS = {{.ThemeSoundsJSON}};
    // Inject wild-mode badge used by all themes
    (function() { var b=document.createElement('div'); b.id='sno-wild-badge'; b.textContent='WILD MODE'; document.body.appendChild(b); })();
    const SNONUX_WILD_PRESETS = {
        aurora: {
            banner: 'SOLAR STORM',
            ticker: ['FIELD INTERFERENCE', 'PLASMA DRIFT', 'PARTICLE BOMBARDMENT', 'CHROMATIC SPIKE'],
            scraps: ['MAGNETIC SHEAR', 'SOLAR WIND', 'AURORA NOISE', 'ION STORM', 'POLAR ARC'],
            flash: 'rgba(220,255,240,0.72)'
        },
        brutalist: {
            banner: 'STRUCTURAL COLLAPSE',
            ticker: ['CONDEMNED', 'REBAR EXPOSED', 'FOUNDATION FAILURE', 'CRACK PROPAGATION'],
            scraps: ['CONDEMNED', 'RUST BLEED', 'SHEAR WALL LOST', 'LOAD PATH BROKEN', 'SPALLING'],
            flash: 'rgba(255,210,190,0.58)'
        },
        cosmos: {
            banner: 'SUPERNOVA',
            ticker: ['SINGULARITY LENSING', 'GAMMA BURST', 'SHOCKWAVE EXPANDING', 'SPACETIME TEAR'],
            scraps: ['WHITEOUT', 'EVENT HORIZON', 'RADIATION FRONT', 'LENS LOCK', 'CORE BREACH'],
            flash: 'rgba(255,255,255,0.8)'
        },
        dos: {
            banner: 'KERNEL PANIC',
            ticker: ['ABORT, RETRY, FAIL?', 'MEMORY CORRUPTION', 'STACK DUMP', 'SEGMENT FAULT'],
            scraps: ['DEAD BEEF', 'C0FFEE', 'BAD SECTOR', 'IRQ STORM', 'NULL PTR', 'HEX DUMP'],
            flash: 'rgba(255,255,255,0.88)'
        },
        matrix: {
            banner: 'CASCADE FAILURE',
            ticker: ['SENTINEL TRACE', 'GLYPH SATURATION', 'PHOSPHOR BURN-IN', 'RAIN AT TERMINAL VELOCITY'],
            scraps: ['SENTINEL', '0XDECODE', 'OVERRIDE', 'TRACE LOST', 'MACHINE DREAM'],
            flash: 'rgba(180,255,190,0.68)'
        },
        neon: {
            banner: 'GAS DISCHARGE',
            ticker: ['TUBE ARC', 'ULTRAVIOLET BLEED', 'STROBE LOCK', 'SHORT CIRCUIT'],
            scraps: ['ARC OVERLOAD', 'PLASMA SIGN', 'NOBLE GAS', 'HARD STROBE', 'OVERDRIVE'],
            flash: 'rgba(255,245,170,0.72)'
        },
        ocean: {
            banner: 'HADAL DESCENT',
            ticker: ['PRESSURE SPIKE', 'BIOLUMINESCENT SWARM', 'ABYSSAL DRAG', 'TSUNAMI FRONT'],
            scraps: ['NO SURFACE', 'CRUSH DEPTH', 'TENTACLE DRIFT', 'SONAR LOST', 'DEEP CURRENT'],
            flash: 'rgba(200,255,255,0.54)'
        },
        plasma: {
            banner: 'FUSION BREACH',
            ticker: ['CONTAINMENT FAILURE', 'TOKAMAK DISTORTION', 'THERMAL RUNAWAY', 'WHITE-BLUE CORE'],
            scraps: ['ION SPRAY', 'FIELD LOSS', 'HEAT HAZE', 'QUENCH', 'ARC SHELL'],
            flash: 'rgba(230,250,255,0.78)'
        },
        retro: {
            banner: 'TAPE EAT',
            ticker: ['TRACKING LOSS', 'CHROMA SPLIT', 'MAGNETIC SNOW', 'CLICK-EJECT'],
            scraps: ['NO SIGNAL', 'HEAD DRAG', 'ROLL HOLD', 'SNOW PACK', 'EJECT CYCLE'],
            flash: 'rgba(255,226,178,0.6)'
        },
        retrofuture: {
            banner: 'ATOMIC TWILIGHT',
            ticker: ['GEIGER STATIC', 'FALLOUT DUST', 'RADIATION BURN', 'IRRADIATED SEPIA'],
            scraps: ['FALLOUT', 'BETA LEAK', 'ASH DRIFT', 'HALF-LIFE', 'GLOW CLOUD'],
            flash: 'rgba(255,240,180,0.62)'
        },
        spaceage: {
            banner: 'RE-ENTRY BURN',
            ticker: ['HEAT SHIELD LOSS', 'PLASMA BLACKOUT', 'COMMS STATIC', 'G-FORCE COMPRESSION'],
            scraps: ['BLACKOUT', 'SPARK SHOWER', 'PLASMA SHEATH', 'HULL GLOW', 'COMMS LOST'],
            flash: 'rgba(255,220,190,0.68)'
        },
        synthwave: {
            banner: 'GRID COLLAPSE',
            ticker: ['VOID PERSPECTIVE', 'MOLTEN SUN', 'CHROMA TEAR', 'OUT OF MEMORY'],
            scraps: ['VOID GRID', 'SUN DRIP', 'NEON PANIC', 'FRAME DROP', 'MEMORY STARVE'],
            flash: 'rgba(255,210,255,0.68)'
        },
        terminal: {
            banner: 'FORK BOMB',
            ticker: ['PROCESS STORM', 'STACK TRACE WATERFALL', 'MEMORY GARBAGE', 'BSOD CREEP'],
            scraps: ['PID 65535', 'STACK OVERFLOW', 'OOM KILL', 'PANIC', '(:'],
            flash: 'rgba(180,255,180,0.7)'
        },
        tropicale: {
            banner: 'CATEGORY 5',
            ticker: ['HORIZONTAL RAIN', 'STORM SURGE', 'DEBRIS FIELD', 'WIND SHEAR'],
            scraps: ['PALM SNAP', 'SURGE LINE', 'SPRAY WALL', 'FLYING ROOF', 'LANDFALL'],
            flash: 'rgba(240,255,255,0.74)'
        },
        noir: {
            banner: 'BLACKOUT DISTRICT',
            ticker: ['BLINDS SLAMMED SHUT', 'SIREN SWEEP', 'PROJECTOR BURN', 'MIDNIGHT DOWNPOUR'],
            scraps: ['NO WITNESSES', 'WET ASPHALT', 'RED CHANNEL', 'BLUE CHANNEL', 'SMOKE CURTAIN'],
            flash: 'rgba(255,245,225,0.66)'
        },
        cathedral: {
            banner: 'LAST JUDGMENT',
            ticker: ['BELL SHOCKWAVE', 'INCENSE FIRESTORM', 'ROSE WINDOW FRACTURE', 'APSE IN FLAME'],
            scraps: ['REQUIEM', 'SHARD RAIN', 'VESPER BURN', 'GLORIA STATIC', 'NAVE COLLAPSE'],
            flash: 'rgba(255,239,202,0.72)'
        },
        surveillance: {
            banner: 'TOTAL COMPROMISE',
            ticker: ['CAMERA MESH BREACH', 'TRACKING LOSS', 'MULTIPLEX PANIC', 'ALERT CASCADE'],
            scraps: ['FLAGGED', 'OVERRIDDEN', 'TRACE LOOP', 'BOX LOST', 'ALERT 99'],
            flash: 'rgba(210,255,225,0.72)'
        },
        biomech: {
            banner: 'CONTAINMENT RUPTURE',
            ticker: ['SYNAPSE STORM', 'TISSUE ARC', 'MEMBRANE TEAR', 'HYBRID OVERDRIVE'],
            scraps: ['VENTRICLE', 'MYCELIUM', 'RUPTURE', 'BIOFILM', 'NERVE GRID'],
            flash: 'rgba(255,205,220,0.7)'
        },
        paper: {
            banner: 'PRESS JAM',
            ticker: ['TONER BLIZZARD', 'INK BLEED', 'COPY LAMP WHITEOUT', 'PAGE STORM'],
            scraps: ['MISPRINT', 'SKEWED FEED', 'RAG EDGE', 'CARBON DUST', 'REDACTION'],
            flash: 'rgba(255,250,236,0.82)'
        },
        volcano: {
            banner: 'PYROCLASTIC SURGE',
            ticker: ['ASH CASCADE', 'LAVA BOMB IMPACT', 'EARTHQUAKE SHAKE', 'SULFUR CLOUD'],
            scraps: ['ASHFALL', 'VENT BLAST', 'PYROCLAST', 'SEISMIC HIT', 'MAGMA SPRAY'],
            flash: 'rgba(255,220,150,0.72)'
        }
    };
    function snonuxDetectThemeName() {
        var splash = document.getElementById('splash-overlay');
        if (splash) {
            for (var i = 0; i < splash.classList.length; i++) {
                var cls = splash.classList[i];
                if (cls.indexOf('splash-') === 0 && cls !== 'splash-overlay' && cls.indexOf('splash--') !== 0) {
                    return cls.slice(7);
                }
            }
        }
        return 'neon';
    }
    function snonuxEnsureWildRoot() {
        var root = document.getElementById('sno-wild-root');
        if (root) return root;
        root = document.createElement('div');
        root.id = 'sno-wild-root';
        root.setAttribute('aria-hidden', 'true');
        root.innerHTML =
            '<div id="sno-wild-colorwash" class="sno-wild-layer"></div>' +
            '<div id="sno-wild-rain" class="sno-wild-layer"></div>' +
            '<div id="sno-wild-wave" class="sno-wild-layer"></div>' +
            '<div id="sno-wild-beacon" class="sno-wild-layer"></div>' +
            '<div id="sno-wild-noise" class="sno-wild-layer"></div>' +
            '<div id="sno-wild-banner"></div>' +
            '<div id="sno-wild-ticker"><span></span></div>' +
            '<div id="sno-wild-scraps"></div>';
        document.body.appendChild(root);
        return root;
    }
    function snonuxApplyWildPreset(theme) {
        var preset = SNONUX_WILD_PRESETS[theme] || SNONUX_WILD_PRESETS.neon;
        var html = document.documentElement;
        var body = document.body;
        html.setAttribute('data-sno-theme', theme);
        body.setAttribute('data-sno-theme', theme);
        var root = snonuxEnsureWildRoot();
        var banner = root.querySelector('#sno-wild-banner');
        var ticker = root.querySelector('#sno-wild-ticker span');
        var scraps = root.querySelector('#sno-wild-scraps');
        banner.textContent = preset.banner;
        ticker.textContent = ' ' + preset.ticker.join('   //   ') + '   //   ' + preset.ticker.join('   //   ') + ' ';
        scraps.innerHTML = '';
        var phrases = preset.scraps || [];
        var count = theme === 'dos' || theme === 'terminal' || theme === 'matrix' ? 22 : 16;
        for (var i = 0; i < count; i++) {
            var span = document.createElement('span');
            span.textContent = phrases[i % phrases.length];
            span.style.setProperty('--x', (8 + Math.random() * 84).toFixed(2) + '%');
            span.style.setProperty('--y', (12 + Math.random() * 72).toFixed(2) + '%');
            span.style.setProperty('--rot', ((Math.random() * 36) - 18).toFixed(1) + 'deg');
            span.style.setProperty('--dx', ((Math.random() * 120) - 60).toFixed(1) + 'px');
            span.style.setProperty('--dy', ((Math.random() * 100) - 50).toFixed(1) + 'px');
            span.style.setProperty('--dur', (4.5 + Math.random() * 5.5).toFixed(2) + 's');
            span.style.setProperty('--delay', (-Math.random() * 6).toFixed(2) + 's');
            scraps.appendChild(span);
        }
        window._snonuxWildTheme = theme;
        window._snonuxWildFlashColor = preset.flash || 'rgba(255,255,255,0.7)';
    }
    function snonuxPulseFlash(color, duration) {
        var ov = document.createElement('div');
        ov.style.cssText = 'position:fixed;inset:0;z-index:9998;pointer-events:none;opacity:0;';
        document.body.appendChild(ov);
        var tone = color || window._snonuxWildFlashColor || 'rgba(255,255,255,0.7)';
        [0, 70, 150, 250].forEach(function(d, i) {
            setTimeout(function() {
                ov.style.transition = 'opacity 0.08s linear';
                ov.style.background = tone;
                ov.style.opacity = (i % 2 === 0) ? '0.82' : '0';
            }, d);
        });
        setTimeout(function() {
            ov.style.transition = 'opacity 0.25s linear';
            ov.style.opacity = '0';
        }, Math.max(180, duration || 320));
        setTimeout(function() { ov.remove(); }, Math.max(520, duration || 320) + 260);
    }
    function snonuxScheduleWildBursts() {
        clearTimeout(window._snonuxWildBurstTimer);
        if (!window._snoWildActive) return;
        var delay = 1400 + Math.random() * 3600;
        window._snonuxWildBurstTimer = setTimeout(function() {
            if (!window._snoWildActive) return;
            snonuxPulseFlash(window._snonuxWildFlashColor, 260);
            snonuxScheduleWildBursts();
        }, delay);
    }
    function snonuxSetWildState(on) {
        var body = document.body;
        var badge = document.getElementById('sno-wild-badge');
        body.classList.toggle('sno-wild-active', !!on);
        if (badge) badge.classList.toggle('sno-wild-on', !!on);
        if (on) {
            snonuxApplyWildPreset(window._snonuxWildTheme || snonuxDetectThemeName());
            snonuxScheduleWildBursts();
        } else {
            clearTimeout(window._snonuxWildBurstTimer);
        }
    }
    (function snonuxWildSetup() {
        window._snoWildActive = !!window._snoWildActive;
        snonuxApplyWildPreset(snonuxDetectThemeName());
        snonuxSetWildState(window._snoWildActive);
    })();
    // Dramatic lightning flash on wild mode activation/deactivation
    function snonuxWildFlash(on) {
        var ov = document.createElement('div');
        ov.style.cssText = 'position:fixed;inset:0;z-index:9998;pointer-events:none;';
        document.body.appendChild(ov);
        if (on) {
            // Three rapid lightning flashes on activation
            [0, 80, 180, 300, 440].forEach(function(d, i) {
                setTimeout(function() {
                    ov.style.background = (i % 2 === 0) ? 'rgba(255,255,200,0.72)' : 'transparent';
                }, d);
            });
            setTimeout(function() { ov.remove(); }, 550);
            // Persistent storm overlay with intermittent flicker
            var storm = document.createElement('div');
            storm.id = 'sno-wild-storm';
            storm.style.cssText = 'position:fixed;inset:0;z-index:4998;pointer-events:none;' +
                'background:radial-gradient(ellipse at 50% 0%,rgba(255,255,200,0.88) 0%,transparent 55%);' +
                'animation:sno-wild-flicker 3.7s ease-in-out infinite;';
            document.body.appendChild(storm);
        } else {
            // Brief dark veil on deactivation
            ov.style.background = 'rgba(0,0,0,0.45)';
            ov.style.transition = 'opacity 0.45s';
            setTimeout(function() { ov.style.opacity = '0'; }, 60);
            setTimeout(function() { ov.remove(); }, 550);
            var storm = document.getElementById('sno-wild-storm');
            if (storm) { storm.style.transition = 'opacity 0.5s'; storm.style.opacity = '0'; setTimeout(function() { storm.remove(); }, 600); }
        }
    }
    function snonuxWaveType(w) {
        if (w === 'square') return 'square';
        if (w === 'triangle') return 'triangle';
        return 'sine';
    }
    (function splashSetup() {
        var el = document.getElementById('splash-overlay');
        if (!el) return;
        var splashAudioCtx = null;
        var splashChimePlayed = false;
        function playSplashChime() {
            if (splashChimePlayed) return;
            try {
                if (!splashAudioCtx) {
                    splashAudioCtx = new (window.AudioContext || window.webkitAudioContext)();
                }
                var ctx = splashAudioCtx;
                function ring() {
                    splashChimePlayed = true;
                    // Theme override: if defined, plays its own sound and returns true to skip the default chime.
                    if (window.snonuxSplashSound && window.snonuxSplashSound(ctx)) return;
                    var now = ctx.currentTime;
                    var sp = SNONUX_SOUNDS.splash;
                    var freqs = sp.freqs;
                    var spacing = sp.spacing != null ? sp.spacing : 0.075;
                    var gainAm = sp.gain != null ? sp.gain : 0.1;
                    var wave = snonuxWaveType(sp.wave);
                    var i, osc, g, t0;
                    for (i = 0; i < freqs.length; i++) {
                        osc = ctx.createOscillator();
                        g = ctx.createGain();
                        osc.connect(g);
                        g.connect(ctx.destination);
                        osc.type = wave;
                        osc.frequency.value = freqs[i];
                        t0 = now + i * spacing;
                        g.gain.setValueAtTime(0, t0);
                        g.gain.linearRampToValueAtTime(gainAm, t0 + 0.028);
                        g.gain.exponentialRampToValueAtTime(0.001, t0 + 0.52);
                        osc.start(t0);
                        osc.stop(t0 + 0.55);
                    }
                }
                ctx.resume().then(ring).catch(function() {});
            } catch (_) {}
        }
        function dismiss() {
            if (el.classList.contains('splash--dismissed')) return;
            el.classList.add('splash--dismissed');
            el.setAttribute('aria-hidden', 'true');
        }
        function show() {
            document.documentElement.classList.remove('sno-splash-skip');
            el.classList.remove('splash--dismissed');
            el.removeAttribute('aria-hidden');
            el.focus({ preventScroll: true });
        }
        function openSplashFromHeader(e) {
            if (e.target.closest('a')) return;
            e.preventDefault();
            var modal = document.getElementById('post-modal');
            if (modal) modal.classList.remove('active');
            show();
        }
        var triggers = document.querySelectorAll('.logo-mark, .logo-title h1, #sn-logo');
        triggers.forEach(function(trigger) {
            trigger.addEventListener('click', openSplashFromHeader);
        });
        window._snonuxDismissSplash = dismiss;
        window._snonuxShowSplash = show;
        if (document.documentElement.classList.contains('sno-splash-skip')) {
            dismiss();
            return;
        }
        playSplashChime();
        el.addEventListener('pointerdown', function() { playSplashChime(); }, { passive: true });
        el.addEventListener('click', function(e) { e.preventDefault(); dismiss(); });
        el.focus({ preventScroll: true });
    })();

    // === KEYBOARD NAVIGATION ===
    // j / ArrowDown  → next post       k / ArrowUp    → previous post
    // h / ArrowLeft  → previous page   l / ArrowRight → next page
    // PageUp/PageDown → scroll the post list; re-highlight post at top of visible area
    // Enter / click post → expand modal    Esc → close modal
    const posts = document.querySelectorAll('.post');
    let currentIndex = posts.length > 0 ? 0 : -1;
    const prevPageURL = {{.PrevPageJSON}};
    const nextPageURL = {{.NextPageJSON}};

    if (currentIndex >= 0) selectPost(0);

    function setActiveHighlight(index, playSound, scrollIntoView) {
        if (posts.length === 0) return;
        if (currentIndex >= 0) posts[currentIndex].classList.remove('post-active');
        currentIndex = Math.max(0, Math.min(index, posts.length - 1));
        posts[currentIndex].classList.add('post-active');
        if (scrollIntoView) {
            posts[currentIndex].scrollIntoView({ behavior: 'smooth', block: 'nearest' });
        }
        if (playSound) playNavSound();
    }

    function selectPost(index) {
        setActiveHighlight(index, true, true);
        if (window.snonuxNavEffect) window.snonuxNavEffect();
    }

    /** Pick the post that should be active for the current viewport (anchor near top of visible area). */
    function activeIndexForVisibleRegion(sc) {
        if (posts.length === 0) return -1;
        var scrTop, scrBot, anchorY;
        if (sc) {
            var scr = sc.getBoundingClientRect();
            scrTop = scr.top;
            scrBot = scr.bottom;
            anchorY = scr.top + Math.min(scr.height * 0.18, 100);
        } else {
            scrTop = 0;
            scrBot = window.innerHeight;
            anchorY = window.innerHeight * 0.15;
        }
        var i, pr;
        for (i = 0; i < posts.length; i++) {
            pr = posts[i].getBoundingClientRect();
            if (pr.top <= anchorY && anchorY < pr.bottom) return i;
        }
        for (i = 0; i < posts.length; i++) {
            pr = posts[i].getBoundingClientRect();
            if (pr.bottom > scrTop && pr.top < scrBot) return i;
        }
        return posts.length - 1;
    }

    function playNavSound() {
        try {
            var n = SNONUX_SOUNDS.nav;
            const ctx = new (window.AudioContext || window.webkitAudioContext)();
            const osc = ctx.createOscillator();
            const gain = ctx.createGain();
            osc.connect(gain); gain.connect(ctx.destination);
            osc.frequency.value = n.freq;
            osc.type = snonuxWaveType(n.wave);
            var dur = n.dur != null ? n.dur : 0.08;
            var g = n.gain != null ? n.gain : 0.12;
            gain.gain.setValueAtTime(g, ctx.currentTime);
            gain.gain.exponentialRampToValueAtTime(0.001, ctx.currentTime + dur);
            osc.start(ctx.currentTime); osc.stop(ctx.currentTime + dur + 0.02);
        } catch (_) {}
    }

    function playOpenSound() {
        try {
            var o = SNONUX_SOUNDS.open;
            const ctx = new (window.AudioContext || window.webkitAudioContext)();
            const osc = ctx.createOscillator();
            const gain = ctx.createGain();
            osc.connect(gain); gain.connect(ctx.destination);
            osc.type = snonuxWaveType(o.wave);
            var dur = o.dur != null ? o.dur : 0.14;
            var g = o.gain != null ? o.gain : 0.1;
            osc.frequency.setValueAtTime(o.start, ctx.currentTime);
            osc.frequency.exponentialRampToValueAtTime(o.end, ctx.currentTime + dur);
            gain.gain.setValueAtTime(g, ctx.currentTime);
            gain.gain.exponentialRampToValueAtTime(0.001, ctx.currentTime + dur + 0.06);
            osc.start(ctx.currentTime); osc.stop(ctx.currentTime + dur + 0.07);
        } catch (_) {}
    }

    function playCloseSound() {
        try {
            var c = SNONUX_SOUNDS.close;
            const ctx = new (window.AudioContext || window.webkitAudioContext)();
            const osc = ctx.createOscillator();
            const gain = ctx.createGain();
            osc.connect(gain); gain.connect(ctx.destination);
            osc.type = snonuxWaveType(c.wave);
            var dur = c.dur != null ? c.dur : 0.15;
            var g = c.gain != null ? c.gain : 0.1;
            osc.frequency.setValueAtTime(c.start, ctx.currentTime);
            osc.frequency.exponentialRampToValueAtTime(c.end, ctx.currentTime + dur);
            gain.gain.setValueAtTime(g, ctx.currentTime);
            gain.gain.exponentialRampToValueAtTime(0.001, ctx.currentTime + dur + 0.05);
            osc.start(ctx.currentTime); osc.stop(ctx.currentTime + dur + 0.06);
        } catch (_) {}
    }

    function playBounceSound() {
        try {
            var b = SNONUX_SOUNDS.bounce;
            const ctx = new (window.AudioContext || window.webkitAudioContext)();
            const osc = ctx.createOscillator();
            const gain = ctx.createGain();
            osc.connect(gain); gain.connect(ctx.destination);
            osc.type = snonuxWaveType(b.wave);
            var dur = b.dur != null ? b.dur : 0.12;
            var g = b.gain != null ? b.gain : 0.1;
            osc.frequency.setValueAtTime(b.start, ctx.currentTime);
            osc.frequency.exponentialRampToValueAtTime(b.end, ctx.currentTime + dur);
            gain.gain.setValueAtTime(g, ctx.currentTime);
            gain.gain.exponentialRampToValueAtTime(0.001, ctx.currentTime + dur + 0.05);
            osc.start(ctx.currentTime); osc.stop(ctx.currentTime + dur + 0.06);
        } catch (_) {}
    }

    var _snoBounceCls = ['sno-fx-bounce-left','sno-fx-bounce-right','sno-fx-bounce-left-wild','sno-fx-bounce-right-wild',
        'sno-fx-bounce-up','sno-fx-bounce-down','sno-fx-bounce-up-wild','sno-fx-bounce-down-wild'];

    function bounceEffect(dir) {
        var ov = document.querySelector('.overlay');
        if (!ov) return;
        var wild = !!window._snoWildActive;
        var map = { left: wild ? 'sno-fx-bounce-left-wild' : 'sno-fx-bounce-left',
                    right: wild ? 'sno-fx-bounce-right-wild' : 'sno-fx-bounce-right',
                    up: wild ? 'sno-fx-bounce-up-wild' : 'sno-fx-bounce-up',
                    down: wild ? 'sno-fx-bounce-down-wild' : 'sno-fx-bounce-down' };
        var cls = map[dir] || map.down;
        _snoBounceCls.forEach(function(c) { ov.classList.remove(c); });
        void ov.offsetWidth;
        ov.classList.add(cls);
        var dur = wild ? 540 : 380;
        setTimeout(function() { ov.classList.remove(cls); }, dur);
        playBounceSound();
        if (wild) snonuxPulseFlash(window._snonuxWildFlashColor, 200);
    }

    function openPostAt(index, scrollIntoView) {
        if (posts.length === 0) return;
        setActiveHighlight(index, false, !!scrollIntoView);
        var post = posts[currentIndex];
        var postText = post ? post.querySelector('.post-text') : null;
        if (!postText) return;
        var modal = document.getElementById('post-modal');
        var modalInner = modal ? modal.querySelector('.modal-inner') : null;
        document.getElementById('modal-content').innerHTML = postText.innerHTML;
        modal.classList.add('active');
        if (window.snonuxOpenEffect) window.snonuxOpenEffect(post);
        modal.scrollTop = 0;
        if (modalInner) {
            modalInner.scrollTop = 0;
            requestAnimationFrame(function() {
                modalInner.scrollIntoView({ block: 'center', inline: 'nearest' });
            });
        }
        playOpenSound();
    }

    function closeModal() {
        document.getElementById('post-modal').classList.remove('active');
        playCloseSound();
        if (window.snonuxCloseEffect) window.snonuxCloseEffect();
    }

    (function postClickOpen() {
        posts.forEach(function(post, idx) {
            post.addEventListener('click', function(e) {
            if (e.target.closest('a, button, audio, video, input, textarea, select, label')) return;
                openPostAt(idx, true);
            });
        });
    })();

    (function deepLinkFromHash() {
        var h = location.hash;
        if (!h || h.indexOf('#post-') !== 0) return;
        var id = decodeURIComponent(h.slice(6));
        var el = document.getElementById('post-' + id);
        if (!el) return;
        var idx = parseInt(el.getAttribute('data-index'), 10);
        if (isNaN(idx)) return;
        openPostAt(idx, true);
    })();

    document.addEventListener('keydown', function(e) {
        if (e.target.tagName === 'INPUT' || e.target.tagName === 'TEXTAREA') return;
        var splash = document.getElementById('splash-overlay');
        if (splash && !splash.classList.contains('splash--dismissed')) {
            if (e.key === 'Enter' || e.key === ' ' || e.key === 'Escape') {
                e.preventDefault();
                if (window._snonuxDismissSplash) window._snonuxDismissSplash();
            }
            return;
        }
        if (document.getElementById('post-modal').classList.contains('active')) {
            if (e.key === 'Escape') { closeModal(); e.preventDefault(); }
            return;
        }
        switch (e.key) {
            case 'PageUp':
            case 'PageDown': {
                var sc = document.getElementById('post-content');
                var step = (sc && sc.clientHeight) ? sc.clientHeight : window.innerHeight;
                var dy = (e.key === 'PageUp') ? -step : step;
                if (sc) {
                    sc.scrollTop += dy;
                } else {
                    window.scrollBy(0, dy);
                }
                var idx = activeIndexForVisibleRegion(sc);
                if (idx >= 0) setActiveHighlight(idx, true, false);
                if (window.snonuxScrollEffect) window.snonuxScrollEffect(e.key === 'PageUp' ? 'up' : 'down');
                e.preventDefault();
                break;
            }
            case 'j': case 'ArrowDown':
                if (currentIndex >= posts.length - 1) { bounceEffect('down'); }
                else { selectPost(currentIndex + 1); }
                e.preventDefault(); break;
            case 'k': case 'ArrowUp':
                if (currentIndex <= 0) { bounceEffect('up'); }
                else { selectPost(currentIndex - 1); }
                e.preventDefault(); break;
            case 'h': case 'ArrowLeft':
                if (prevPageURL) { playNavSound(); if (window.snonuxPageEffect) window.snonuxPageEffect(); window.location.href = prevPageURL; }
                else { bounceEffect('left'); }
                e.preventDefault(); break;
            case 'l': case 'ArrowRight':
                if (nextPageURL) { playNavSound(); if (window.snonuxPageEffect) window.snonuxPageEffect(); window.location.href = nextPageURL; }
                else { bounceEffect('right'); }
                e.preventDefault(); break;
            case 'Enter': openPostAt(currentIndex, true); e.preventDefault(); break;
            case 'w':
                window._snoWildActive = !window._snoWildActive;
                if (window.snonuxWildToggle) window.snonuxWildToggle();
                snonuxSetWildState(window._snoWildActive);
                snonuxWildFlash(window._snoWildActive);
                e.preventDefault(); break;
        }
    });

    // === MODAL SCROLL-END INDICATOR ===
    (function modalScrollEnd() {
        var mi = document.querySelector('#post-modal .modal-inner');
        if (!mi) return;
        mi.addEventListener('scroll', function() {
            var atEnd = mi.scrollHeight - mi.scrollTop - mi.clientHeight < 4;
            var el = document.getElementById('sno-scroll-end');
            if (!el) return;
            if (atEnd) {
                el.classList.remove('sno-scroll-end-active');
                void el.offsetWidth;
                el.classList.add('sno-scroll-end-active');
            }
        }, { passive: true });
    })();

    // === IDLE BREATHING ===
    (function idleBreathe() {
        var timer = null;
        var IDLE_DELAY = 10000;
        function startBreathe() {
            stopBreathe();
            timer = setTimeout(function() {
                if (currentIndex >= 0 && posts[currentIndex]) {
                    posts[currentIndex].classList.add('sno-idle-breathe');
                }
            }, IDLE_DELAY);
        }
        function stopBreathe() {
            clearTimeout(timer);
            for (var i = 0; i < posts.length; i++) {
                posts[i].classList.remove('sno-idle-breathe');
            }
        }
        function resetIdle() { stopBreathe(); startBreathe(); }
        document.addEventListener('keydown', resetIdle);
        document.addEventListener('pointermove', resetIdle, { passive: true });
        document.addEventListener('pointerdown', resetIdle, { passive: true });
        startBreathe();
    })();

    // === FIRST-VISIT PARTICLE BURST ===
    (function firstVisitBurst() {
        var key = 'sno-visited';
        try { if (sessionStorage.getItem(key)) return; sessionStorage.setItem(key, '1'); } catch (_) { return; }
        if (document.documentElement.classList.contains('sno-splash-skip')) return;
        var origDismiss = window._snonuxDismissSplash;
        if (!origDismiss) return;
        window._snonuxDismissSplash = function() {
            origDismiss();
            var burst = document.createElement('div');
            burst.id = 'sno-burst';
            burst.setAttribute('aria-hidden', 'true');
            document.body.appendChild(burst);
            var cx = window.innerWidth / 2, cy = window.innerHeight / 2;
            for (var i = 0; i < 36; i++) {
                var s = document.createElement('span');
                var angle = (i / 36) * Math.PI * 2 + (Math.random() - 0.5) * 0.4;
                var dist = 80 + Math.random() * 180;
                s.style.left = cx + 'px';
                s.style.top = cy + 'px';
                s.style.setProperty('--px', (Math.cos(angle) * dist).toFixed(1) + 'px');
                s.style.setProperty('--py', (Math.sin(angle) * dist).toFixed(1) + 'px');
                s.style.setProperty('--pdur', (0.4 + Math.random() * 0.5).toFixed(2) + 's');
                s.style.setProperty('--pdel', (Math.random() * 0.12).toFixed(2) + 's');
                s.style.width = (4 + Math.random() * 5) + 'px';
                s.style.height = s.style.width;
                burst.appendChild(s);
            }
            setTimeout(function() { burst.remove(); }, 1200);
        };
    })();
</script>
{{end}}