/*---------------------------- 

Nebuluna.com [Dreamlit Cosmos Network] (c) Star.

DO NOT use, copy, redistribute, modify, steal, 
or plagiarize any content from this website --
graphics, written content, code, or otherwise.

----------------------------*/







:root{
  --ink: #050706;
  --screen: rgba(170,255,200,0.92);
  --screen-dim: rgba(80,255,140,0.50);
  --green-line: rgba(0,180,70,0.22);

  --gold: #c8a64d;
  --brass: #6b4f29;
  --blood: #9d1600;
  --navy: #2c3249;

  --panel-r: 12px;
  --panel-shadow:
    0 0 0 1px rgba(0, 180, 70, 0.12) inset,
    0 0 22px rgba(0, 180, 70, 0.18),
    0 0 55px rgba(0, 120, 40, 0.12);
}

* { cursor: url('images/default.cur'), auto !important; }

::selection      { color: #7e120b; background: #000; }
::-moz-selection { color: #7e120b; background: #000; }

html, body {
  margin: 0;
  padding: 0;
  height: 100%;
}

body {
  background-image: 
    url("images/bg.png");
  background-repeat:
    repeat;
  background-position:
    top left;
  background-size:
    auto;
  background-color: #04080b;
  background-attachment:
    scroll;
}

b { 
  font-size: 1.4em;
  font-family: "Road Rage", sans-serif;
  text-transform: uppercase;
  letter-spacing: 3px;
  color: #c8a64d; 
  line-height: 1;
}
  
i { 
  font-family: "Ledger", serif;
  color: #4d89c2; }

u { color: #009e20; }

.req { color: red; }

@font-face {
  font-family: 'Due Date';
  src: url('images/duedate.ttf');
}


/*---------------------------- 
 >>>> LAYOUT
----------------------------*/
header, main, footer { position: relative; }

main { 
  flex: 1; 
  animation: fadeIn 450ms ease both;
}

@keyframes fadeIn {
  from { opacity: 0; transform: translateY(6px); }
  to   { opacity: 1; transform: translateY(0); }
}

header {
  width: 100%;
  max-width: 1200px;
  aspect-ratio: 1200 / 600;
  margin: 0 auto 3em;
  background: url('images/banner.png') no-repeat top center / contain;
}

.layout {
  display: flex;
  align-items: flex-start;
  gap: clamp(1.5rem, 4vw, 3rem);
  max-width: 1200px;
  width: min(calc(100% - 2rem), 1200px);
  margin: 0 auto;
  position: relative;
  z-index: 1;
}

footer {
  --footer-w: 1200;
  --footer-h: 276;
  left: auto; bottom: auto; top: 0; transform: none;
  width: min(100%, var(--footer-w)*1px);
  aspect-ratio: var(--footer-w) / var(--footer-h);
  background: center / contain no-repeat url("images/footer.png");
  position: relative;
  margin: 0 auto;
  z-index: 10;
  margin-top: 6em;
}

.copyright {
  font-family: "Fira Sans", serif;
  font-size: .7em;
  letter-spacing: 1px;
  color: #a19898;
  text-align: center;
  position: absolute;
  top: 60%;
  right: .5rem;
  z-index: 3;
  bottom: auto;
  transform: none;
  padding: 10px;
  background: #04080b;
  border-radius: 30px;
  box-sizing: border-box;
  width: min(500px, calc(100% - 1rem));
  max-width: calc(100% - 1rem);
}

.bullethole {
  position: fixed;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: radial-gradient(circle at 30% 30%, #444 0, #111 45%, #000 70%);
  box-shadow: 0 0 0 2px rgba(0,0,0,.5), 0 0 16px rgba(255,80,30,.12);
  pointer-events: none;
  transform: translate(-50%, -50%);
  z-index: 9999;
  animation: holeFade 1.2s ease forwards;
}

.bullethole::after {
  content:"";
  position:absolute;
  inset:-18px;
  border-radius:50%;
  border: 2px solid #6f0d12;
  transform: scale(.2);
  opacity: .9;
  animation: ring 450ms ease-out forwards;
}

@keyframes ring {
  to { transform: scale(1); opacity: 0; }
}
@keyframes holeFade {
  70% { opacity: 1; }
  100% { opacity: 0; transform: translate(-50%, -50%) scale(.9); }
}

@media (max-width: 980px){
  .layout {
    flex-direction: column;
    align-items: stretch;
    gap: 1.5rem;
  }
}

@media (max-width: 820px){
  footer {
    background: none !important;
    aspect-ratio: auto !important;
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.75rem;
    width: 100%;
    margin: 0 auto;
    margin-top: clamp(3.5rem, 7vw, 6em);
    padding: 1rem 0 0;
  }

  footer::after{
    content: "";
    display: block;
    width: min(100%, 1200px);
    aspect-ratio: 1200 / 276;
    background: center / contain no-repeat url("images/footer.png");
    margin-top: .25rem;
  }

  .copyright {
    position: static !important;
    left: auto !important;
    right: auto !important;
    top: auto !important;
    bottom: auto !important;
    transform: none !important;
    width: min(92%, 560px);
    margin: 0 auto;
    text-align: center;
  }
}



/*---------------------------- 
 >>>> NAVIGATION
----------------------------*/
.navpanel {
  --nav-w: 900px;
  --gun-w: clamp(95px, 22vw, 160px);
  --nav-h: clamp(80px, 16vw, 120px);
  width: 100%;
  display: flex;
  justify-content: center;
  margin: 0 auto 6rem;
  margin: 0 auto clamp(2.5rem, 6vw, 6rem);
  padding-inline: 1rem;
  box-sizing: border-box;
}

@keyframes recoil {
  0% { transform: translateX(0) }
  30% { transform: translateX(-2px) }
  60% { transform: translateX(2px) }
  100% { transform: translateX(0) }
}

.navpanel a:hover {
  animation: recoil 180ms ease-in-out;
}

.navpanel-inner {
  width: min(100%, var(--nav-w));
  height: var(--nav-h);
  display: grid;
  grid-template-columns: var(--gun-w) 1fr;
  grid-template-rows: 58px 62px;
  align-items: center;
  column-gap: 18px;
  position: relative;
}

.navgun {
  grid-column: 1;
  grid-row: 1 / span 2;
  width: var(--gun-w);
  height: var(--nav-h);
  display: block;
}

nav {
  grid-column: 2;
  grid-row: 1;
  align-self: end;
}

nav ul {
  list-style: none;
  margin: 0;
  padding: 0 8px 0 0;
  display: flex;
  gap: clamp(1.25rem, 3vw, 2.7rem);
  justify-content: flex-end;
  align-items: flex-end;
  flex-wrap: wrap;
  row-gap: .35rem;
}

nav a {
  position: relative;
  display: inline-block;
  padding: 8px 2px 10px;
  font-family: "Oswald", system-ui, -apple-system, "Segoe UI", Arial, sans-serif;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.22em;
  font-size: clamp(1.05rem, 0.85rem + 0.6vw, 1.45rem);
  color: #a19898;
  text-decoration: none;
  padding-inline: 3px;
  text-shadow: 0 2px 0 rgba(0,0,0,0.55);
  text-align: center;
}

nav a::before{
  content: "";
  position: absolute;
  right: 60%;
  top: 10px;
  width: 90px;
  height: 33px;
  background: url("images/navbullet.png") center/contain no-repeat;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.12s ease;
}

nav a::after{
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 2px;
  background: #2c3249;
  opacity: 0;
  transform: translateY(2px);
  transition: opacity 0.12s ease, transform 0.12s ease;
}

nav a:hover,
nav a:focus-visible{
  color: #9d1600;
  outline: none;
}

nav a:hover::before,
nav a:focus-visible::before{
  opacity: 1;
}

nav a:hover::after,
nav a:focus-visible::after{
  opacity: 1;
  transform: translateY(0);
}

.quote {
  grid-column: 2;
  grid-row: 2;
  display: flex;
  justify-content: center;
  align-items: center;
}

.quote-bg {
  width: min(100%, 819px);
  height: auto;
  min-height: 54px;
  background: url("images/navquote.png") center/contain no-repeat;
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  padding-inline: clamp(18px, 5vw, 44px);
  box-sizing: border-box;
}

.quote-text {
  margin: 0;
  font-family: "Ledger", serif;
  font-size: .9em;
  font-style: italic;
  color: #a19898;
  text-align: center;
  white-space: nowrap;
  white-space: normal;
  text-wrap: balance;
  line-height: 1.25;
}

.quote-text::before {
  content: open-quote;
}

.quote-text::after {
  content: close-quote;
}

.quote-text::before,
.quote-text::after {
  font-size: 1.2em;
  color: #9d1600;
  line-height: 1;
  font-family: inherit;
  pointer-events: none;
}

.quote-cite {
  position: absolute;
  right: 14px;
  bottom: 1px;
  font-family: "Oswald", system-ui, -apple-system, "Segoe UI", Arial, sans-serif;
  font-weight: 600;
  letter-spacing: 0.06em;
  font-size: 0.7rem;
  color: #6b4f29;
  text-transform: uppercase;
  text-shadow: 0 2px 0 rgba(0,0,0,0.55);
}

@media (max-width: 820px){
  .navpanel-inner{
    height: auto;
    grid-template-columns: 1fr;
    grid-template-rows: auto auto auto;
    row-gap: 10px;
    justify-items: center;
  }

  .navgun {
    grid-column: 1;
    grid-row: 1;
    width: clamp(90px, 28vw, 140px);
    height: auto;
  }

  nav {
    grid-column: 1;
    grid-row: 2;
    align-self: center;
    width: 100%;
  }

  nav ul {
    justify-content: center;
    padding-right: 0;
    gap: clamp(.9rem, 3vw, 1.6rem);
  }

  .quote {
    grid-column: 1;
    grid-row: 3;
    width: 100%;
    margin-bottom: 3em;
  }

  .quote-bg {
    width: 90%;
    background-size: cover;
    border-radius: 14px;
  }

  .quote-cite {
    position: static;
    margin-left: .5rem;
    padding-top: .25rem;
    text-align: center;
    display: block;
  }
}



/*---------------------------- 
 >>>> CONTENT
----------------------------*/
.content {
  font-family: "Fira Sans", serif;
  font-size: clamp(0.95rem, 0.85rem + 0.3vw, 1.05rem);
  color: #a9abb0;
  line-height: 1.5;
  position: relative;
  overflow: visible;
  box-sizing: border-box;
  text-align: justify;
}

.content-panel {
  flex: 1 1 0;
  position: relative;
  min-width: 0;
  border-radius: 30px;
  border: 1px solid #c0863d50;
  background-color: #11141990;
  padding-inline: clamp(16px, 4vw, 30px);
  padding-block: clamp(36px, 6vw, 60px);
  margin-top: clamp(1rem, 3vw, 2em);
  --top-h: 141px;
  --top-overlap: 42px;
  --bottom-h: 81px;
  --bottom-overlap: 39px;
}

.content-panel > * {
  position: relative;
  z-index: 2;
}

.content-panel::before,
.content-panel::after {
  content: "";
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  z-index: 1;
  pointer-events: none;
  max-width: 100%;
  opacity: 0.5;
}

.content-panel::before {
  width: min(800px, 100%);
  height: var(--top-h);
  background: url("images/top.png") center / 100% 100% no-repeat;
  top: calc(-1 * (var(--top-h) - var(--top-overlap)));
}

.content-panel::after {
  width: min(500px, 100%);
  height: var(--bottom-h);
  background: url("images/bottom.png") center / 100% 100% no-repeat;
  bottom: calc(-1 * (var(--bottom-h) - var(--bottom-overlap)));
}

.content-panel a, .copyright a {
  font-family: "Special Elite", sans-serif;
  text-decoration: none;
  padding: 0 2px;
  color: var(--brass);
  background-image: linear-gradient(90deg, var(--brass), var(--gold));
  background-repeat: no-repeat;
  background-size: 0% 2px;
  transition: background-size 0.3s ease, color 0.3s ease;
  background-position: 0 100%;
}

.copyright a { color: #009e20; }

.content-panel a:hover, .copyright a:hover {
  color: var(--blood);
  text-shadow: 0 0 3px var(--blood);
  background-size: 100% 1px;
}

.content-panel li {
  list-style: none;
  position: relative;
  padding-left: 2rem;
}

.content-panel li::before {
  content: "";
  width: clamp(16px, 2.3vw, 20px);
  height: clamp(16px, 2.3vw, 20px);
  position: absolute;
  left: 0;
  top: 0.2em;
  background-image: url("images/bullet.png");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}

.etc {
  background-color: #2c3249;
  width: 80%;
  text-align: center;
  padding: 10px;
  border-radius: 30px;
  margin: 2em auto;
	}

.etc a {
  font-family: "Oswald", serif;
  letter-spacing: 3px;
  text-transform: uppercase;
  background-image: none;
  color: #a19898;
	}

.etc a:hover {
  color: #c8a64d;
	}

.divicon {
  display: inline-block;
  width: 1.25em;
  height: 1.25em;
  background-repeat: no-repeat;
  background-size: 100% 100%;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Cpath fill='%23a9abb0' d='M55.9 38.9c2-3.5 3.1-7.5 3.1-11.8C59 13.3 46.9 2 32 2S5 13.3 5 27.2c0 4.2 1.1 8.2 3.1 11.8A7.16 7.16 0 0 0 5 44.9c0 4.1 3.6 7.5 8 7.5c.4 0 .8 0 1.2-.1c-.5 1.2-1.1 2.6-1.2 3.4c-.6 3.1 2.7 5.7 6.1 5.7c0 0 1.6.1 2-.2c1.3-1.2 0-6.4 0-6.4c0-.9.8-1.6 1.7-1.6s1.7.7 1.7 1.6c0 0-1.2 5.4 0 6.6c1 .9 4.8.9 5.8 0c1.3-1.2 0-6.6 0-6.6c0-.9.8-1.6 1.7-1.6s1.7.7 1.7 1.6c0 0-1.3 5.4 0 6.6c1 .9 4.8.9 5.8 0c1.3-1.2 0-6.6 0-6.6c0-.9.8-1.6 1.7-1.6c1 0 1.7.7 1.7 1.6c0 0-1.3 5.3 0 6.4c.3.3 2 .2 2 .2c3.4 0 6.7-2.6 6.1-5.7c-.1-.7-.7-2.2-1.2-3.4c.4.1.8.1 1.2.1c4.4 0 8-3.4 8-7.5c0-2.4-1.2-4.6-3.1-6m-38.5 1.4c-3-2.1-10.9-10.8-4.4-11.1c4-.2 13.7 3.1 14.3 6.8c.5 2.6-6.8 6.4-9.9 4.3m19.1 7.9c-1.5 1.4-7.2 1.4-8.8 0c-1.4-1.4.9-2.4 1.8-3.8c1-1.7 1.4-3.2 2.6-3.2s1.7 1.5 2.6 3.2c.9 1.4 3.3 2.5 1.8 3.8m10.4-7.9c-3 2.1-10.3-1.8-9.9-4.3c.6-3.7 10.3-7 14.3-6.8c6.5.4-1.4 9.1-4.4 11.1' stroke-width='1.5' stroke='%23a9abb0'/%3E%3C/svg%3E");
  margin-inline: 5px;
}

.code-a {
  font-family: "Courier New", monospace;
  background-color: #2c3249;
  color: #a9abb0;
  text-align: center;
  line-height: 1.2;
  padding-block: clamp(8px, 1.2vw, 12px);
  padding-inline: clamp(14px, 6vw, 48px);
  border-radius: clamp(12px, 6vw, 30px);
  max-width: min(92vw, 800px); 
  margin: 1em auto 2em;
  width: fit-content;
  text-shadow: none;
  overflow-wrap: anywhere;
}

.code-b, .aff { border: 5px solid #2c3249;
transition: 0.3s ease; }

.code-b:hover, .aff:hover { border: 5px solid #6f0d12; }

@media (max-width: 980px){
  .content-panel { margin-top: 1rem; }
}


@media (max-width: 560px) {
  .content-panel {
    --top-h: 110px;
    --top-overlap: 30px;
    --bottom-h: 70px;
    --bottom-overlap: 28px;
    border-radius: 22px;
  }

  .content-panel::before { width: min(560px, 100%); }

  .content-panel::after{ width: min(380px, 100%); }
}



/*----------------------------
 >>>> HEADERS
----------------------------*/
h1 {
  font-family: 'Due Date', 'Special Elite', system-ui;
  font-weight: 400;
  font-size: clamp(1.9rem, 1.2rem + 2.6vw, 3rem);
  color: #7e120b;
  text-transform: uppercase;
  text-shadow: 3px 3px 3px #000;
  display: flex;
  min-height: 126px;
  margin: 2em 0 0.25em;
  position: relative;
  isolation: isolate;
  --coin: 126px;
  --overlap: 50px;
  --cap-scale: 2.2;
}

h1::before {
  content:"";
  width: var(--coin);
  height: var(--coin);
  flex: 0 0 var(--coin);
  background: url("images/h1.png") no-repeat center / contain;
  position: relative;
  z-index: 0;
}

h1 .title {
  position: relative;
  z-index: 1;
  line-height: 1;
  display: inline-flex;
  align-items: center;
}

h1 .title::after {
  content:"";
  position: absolute;
  top:-20px;
  right:-180px;
  width: 260px;
  height: 110px;
  background: url("images/h1b.png") no-repeat center / contain;
  pointer-events: none;
}

h1 .cap{
  font-size: calc(1em * var(--cap-scale));
  line-height: 0.9;
  position: relative;
  transform: translateX(calc(-1 * var(--overlap)));
  top: -2px;
  margin-right: -18px;
}

h1 .rest {
  display: inline-block;
  margin-left: -0.5em;
  letter-spacing: 5px;
}

h1:first-of-type { 
  margin-top: 0; }

h2 {
  width: 80%;
  font-family: "Ledger", serif;
  font-weight: 400;
  font-style: normal;
  color: #c8a64d;
  text-transform: uppercase;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 18px;
  position: relative;
  text-shadow: 3px 3px 0 #000;
  margin: 2em auto 1em;
}

h2::before {
  content: "";
  flex: 1;
  height: 5px;
  background: linear-gradient(
    to left,
    #2c3249 0%,
    #2c3249 40%,
    #000 100%
  );
}

h2::after {
  content: "";
  flex: 1;
  height: 5px;
  background: linear-gradient(
    to right,
    #2c3249 0%,
    #2c3249 40%,
    #000 100%
  );
}

h2 span {
  display: flex;
  align-items: center;
  gap: 12px;
}

h2 span::after {
  content: "";
  width: 40px;
  height: 40px;
  background-image: url("images/h2.png");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  filter: drop-shadow(0 2px 3px rgba(0, 0, 0, 0.6));
  box-shadow:
    0 0 8px rgba(200, 166, 77, 0.4),
    0 0 16px rgba(200, 166, 77, 0.15);
  border-radius: 50%;
}

h2:first-of-type { margin-top: 0; }

hr {
  border: none;
  width: 300px;
  height: 26px;
  margin: 2em auto;
  background: url("images/hr.png") center no-repeat;
  background-size: contain;
}

@media (max-width: 680px){
  h1 {
    --coin: 92px;
    --overlap: 34px;
    --cap-scale: 1.9;
    min-height: 96px;
    gap: .25rem;
  }

  h1 .title::after {
    top: 5px;
    right: -100px;
    width: 130px;
    height: 60px;
    opacity: .9;
  }

  h1 .rest {
    letter-spacing: 3px;
    margin-left: -0.25em;
  }
}

@media (max-width: 480px){
  h1 {
    --coin: 78px;
    --overlap: 26px;
    --cap-scale: 1.75;
  }

  h1 .title::after{ display: none; }
}



/*---------------------------- 
 >>>> QUICK NAVIGATION
----------------------------*/
.quicknav {
  display: flex;
  justify-content: flex-end;
  align-items: flex-end;
  flex-wrap: wrap;
  gap: 1em;
  position: absolute;
  top: -5%;
  right: 0;
  z-index: 3;
  margin-top: 1.5em;
  max-width: 500px;
}

.quicknavlink a:is(:link, :visited, :active) {
  font-family: "Oswald", sans-serif;
  font-weight: 700;
  font-size: .8em;
  text-decoration: none;
  letter-spacing: 2px;
  padding: clamp(6px, 1vw + 4px, 12px);
  width: 100px;
  line-height: 1;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  border-radius: 15px;
  color: #a9abb0;
  text-transform: uppercase;
  background-color: #2c3249;
  gap: .5em;
  transition: all 0.4s ease;
}

.quicknavlink a:hover {
  color: #c8a64d;
  background-color: #6f0d12;
  box-shadow:
    0 0 0 1px rgba(220,182,116,0.35) inset,
    0 0 12px rgba(220,182,116,0.25),
    0 0 30px rgba(111,13,18,0.35);
}

.arrow-left {
  display: inline-flex;
  width: 1em;
  height: 1em;
  background-repeat: no-repeat;
  background-size: 100% 100%;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none'%3E%3Cpath d='M24 0v24H0V0zM12.593 23.258l-.011.002l-.071.035l-.02.004l-.014-.004l-.071-.035q-.016-.005-.024.005l-.004.01l-.017.428l.005.02l.01.013l.104.074l.015.004l.012-.004l.104-.074l.012-.016l.004-.017l-.017-.427q-.004-.016-.017-.018m.265-.113l-.013.002l-.185.093l-.01.01l-.003.011l.018.43l.005.012l.008.007l.201.093q.019.005.029-.008l.004-.014l-.034-.614q-.005-.019-.02-.022m-.715.002a.02.02 0 0 0-.027.006l-.006.014l-.034.614q.001.018.017.024l.015-.002l.201-.093l.01-.008l.004-.011l.017-.43l-.003-.012l-.01-.01z'/%3E%3Cpath fill='%23c8a64d' d='M3.283 10.94a1.5 1.5 0 0 0 0 2.12l5.656 5.658a1.5 1.5 0 1 0 2.122-2.122L7.965 13.5H19.5a1.5 1.5 0 0 0 0-3H7.965l3.096-3.096a1.5 1.5 0 1 0-2.122-2.121z'/%3E%3C/g%3E%3C/svg%3E");
}

.arrow-up {
  display: inline-flex;
  width: 1em;
  height: 1em;
  background-repeat: no-repeat;
  background-size: 100% 100%;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none'%3E%3Cpath d='M24 0v24H0V0zM12.593 23.258l-.011.002l-.071.035l-.02.004l-.014-.004l-.071-.035q-.016-.005-.024.005l-.004.01l-.017.428l.005.02l.01.013l.104.074l.015.004l.012-.004l.104-.074l.012-.016l.004-.017l-.017-.427q-.004-.016-.017-.018m.265-.113l-.013.002l-.185.093l-.01.01l-.003.011l.018.43l.005.012l.008.007l.201.093q.019.005.029-.008l.004-.014l-.034-.614q-.005-.019-.02-.022m-.715.002a.02.02 0 0 0-.027.006l-.006.014l-.034.614q.001.018.017.024l.015-.002l.201-.093l.01-.008l.004-.011l.017-.43l-.003-.012l-.01-.01z'/%3E%3Cpath fill='%23c8a64d' d='M13.06 3.283a1.5 1.5 0 0 0-2.12 0L5.281 8.939a1.5 1.5 0 0 0 2.122 2.122L10.5 7.965V19.5a1.5 1.5 0 0 0 3 0V7.965l3.096 3.096a1.5 1.5 0 1 0 2.122-2.122z'/%3E%3C/g%3E%3C/svg%3E");
}

.refresh {
  display: inline-flex;
  width: 1em;
  height: 1em;
  background-repeat: no-repeat;
  background-size: 100% 100%;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none'%3E%3Cpath d='m12.594 23.258l-.012.002l-.071.035l-.02.004l-.014-.004l-.071-.036q-.016-.004-.024.006l-.004.01l-.017.428l.005.02l.01.013l.104.074l.015.004l.012-.004l.104-.074l.012-.016l.004-.017l-.017-.427q-.004-.016-.016-.018m.264-.113l-.014.002l-.184.093l-.01.01l-.003.011l.018.43l.005.012l.008.008l.201.092q.019.005.029-.008l.004-.014l-.034-.614q-.005-.019-.02-.022m-.715.002a.02.02 0 0 0-.027.006l-.006.014l-.034.614q.001.018.017.024l.015-.002l.201-.093l.01-.008l.003-.011l.018-.43l-.003-.012l-.01-.01z'/%3E%3Cpath fill='%23c8a64d' d='M20 9.5a1.5 1.5 0 0 1 1.5 1.5a8.5 8.5 0 0 1-8.5 8.5h-2.382a1.5 1.5 0 0 1-2.179 2.06l-2.494-2.494a1.5 1.5 0 0 1-.445-1.052v-.028c.003-.371.142-.71.368-.97l.071-.077l2.5-2.5a1.5 1.5 0 0 1 2.18 2.061H13a5.5 5.5 0 0 0 5.5-5.5A1.5 1.5 0 0 1 20 9.5m-4.44-7.06l2.5 2.5a1.5 1.5 0 0 1 0 2.12l-2.5 2.5a1.5 1.5 0 0 1-2.178-2.06H11A5.5 5.5 0 0 0 5.5 13a1.5 1.5 0 1 1-3 0A8.5 8.5 0 0 1 11 4.5h2.382a1.5 1.5 0 0 1 2.179-2.06Z'/%3E%3C/g%3E%3C/svg%3E");
}

@media (max-width: 820px){
  .quicknav{
    position: static;
    inset: auto;
    justify-content: center;
    max-width: 100%;
    margin: 2rem auto 1rem;
    padding-inline: 1rem;
  }
}



/*---------------------------- 
 >>>> FORMS
----------------------------*/
input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="reset"]), textarea, select {
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
  color: #000;
  background-color: rgba(80, 255, 140, 0.55);
  cursor: url('images/text.cur'), auto !important;
}

button, #captcha input[type="button"] {
  cursor: url('images/link.cur'), auto !important;
  text-shadow: none;
}

.form-style, :where(.show_join_form, .show_update_form, .show_lostpass_form, #exitForm) {
  width: min(90%, 600px);
  max-width: 600px;
  margin: 2rem auto;
  padding: 1.5rem;
  border-radius: 12px;
  background: #050706;
  border: 1px solid rgba(0, 180, 70, 0.22);
  color: rgba(80,255,140,0.5);
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
  font-size: 0.9rem;
  letter-spacing: 0.10em;
  text-transform: uppercase;
  text-shadow: 0 0 8px rgba(0, 255, 120, 0.14);
  box-shadow:
    0 0 0 1px rgba(0, 180, 70, 0.12) inset,
    0 0 22px rgba(0, 180, 70, 0.18),
    0 0 55px rgba(0, 120, 40, 0.12);
  position: relative;
  overflow: hidden;
  margin-bottom: 0.45rem;
  display: block;
}

:where(.show_join_form, .show_update_form, .show_lostpass_form, #exitForm)::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    repeating-linear-gradient(
      to bottom,
      rgba(0,0,0,0) 0px,
      rgba(0,0,0,0) 3px,
      rgba(0,0,0,0.22) 4px
    );
  opacity: 0.32;
  pointer-events: none;
  z-index: 2;
}

@keyframes terminalSweep {
  0%   { transform: translateX(0); }
  100% { transform: translateX(370%); }
}

:where(
  .show_join_form span[class$="_label"],
  .show_update_form span[class$="_label"],
  .show_lostpass_form span[class$="_label"],
  #exitForm label
) {
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
  display: block;
  color: rgba(80,255,140,0.5);
  font-size: 0.78rem;
  letter-spacing: 0.14em;
  margin-bottom: 0.45rem;
  text-transform: uppercase;
}

:where(.show_join_form, .show_update_form, .show_lostpass_form, #exitForm)
  :where(input[type="text"], input[type="email"], input[type="url"], input[type="password"], select, textarea) {
  width: 100%;
  box-sizing: border-box;
  background: linear-gradient(
    180deg,
    rgba(0,180,70,0.85),
    rgba(0,120,45,0.95)
  );
  color: rgba(170, 255, 200, 0.92);
  border: 1px solid rgba(0, 180, 70, 0.22);
  border-radius: 8px;
  padding: 0.85rem 0.95rem;
  text-transform: none;
  letter-spacing: 0.06em;
  box-shadow:
    0 0 0 1px rgba(0, 180, 70, 0.10) inset,
    0 0 12px rgba(0, 255, 120, 0.05);
  position: relative;
  z-index: 5;
}

:where(.show_join_form, .show_update_form, .show_lostpass_form, #exitForm)
  :where(input, select, textarea)::placeholder {
  color: #2c3249;
}

:where(.show_join_form, .show_update_form, .show_lostpass_form, #exitForm)
  :where(input, select, textarea):focus {
  outline: none;
  border-color: rgba(0, 255, 120, 0.45);
  box-shadow:
    0 0 0 2px rgba(0, 255, 120, 0.18),
    0 0 20px rgba(0, 255, 120, 0.16);
}

:where(.show_join_form, .show_update_form, #exitForm) .actions {
  margin-top: 0.5rem;
}

.show_lostpass_form .show_lostpass_email > input[type="submit"] {
  margin-top: 0.9rem !important;
}

@media (max-width: 480px){
  .form-style,
  :where(.show_join_form, .show_update_form, .show_lostpass_form, #exitForm){
    padding: 1.1rem;
  }

  :where(.show_join_form, .show_update_form, .show_lostpass_form, #exitForm)
    :where(input[type="text"], input[type="email"], input[type="url"], input[type="password"], select, textarea){
    padding: .75rem .8rem;
  }
}



/*---------------------------- 
 >>>> STATS
----------------------------*/
blockquote {
  font-family: "Ledger", serif;
  font-size: 0.89em;
  color: #a19898;
  line-height: 1.6;
  text-shadow: 2px 2px 0 #6f0d12;
  width: 70%;
  margin: 1.5em auto;
  padding: clamp(1.25rem, 4vw, 2rem);
  border: clamp(20px, 6vw, 50px) solid transparent;
  border-image: url("images/bg2.png") 50 fill round;
  border-radius: clamp(18px, 6vw, 30px);
  position: relative;
  box-shadow:
    0 0 8px rgba(177,18,23,0.35),
    0 0 18px rgba(126,13,18,0.25);
  transition: box-shadow 0.4s ease, transform 0.3s ease;
}

blockquote:hover {
  transform: translateY(-2px);
  box-shadow:
    0 0 12px rgba(177,18,23,0.45),
    0 0 30px rgba(126,13,18,0.35);
}

blockquote::before {
  content: open-quote;
}

blockquote::after {
  content: close-quote;
}

blockquote::before,
blockquote::after {
  position: absolute;
  font-size: 5rem;
  color: #2c3249 ;
  line-height: 1;
  font-family: inherit;
  pointer-events: none;
  text-shadow: 2px 2px 0 #000;
}

blockquote::before {
  top: 0;
  left: -0.25em;
}

blockquote::after {
  bottom: 0;
  right: -0.35em;
}

cite a {
  font-weight: bold;
  width: fit-content;
  text-transform: uppercase;
  margin-left: auto;
  margin-top: 1rem;
  line-height: 1;
  position: relative;
  padding: 2px;
  padding-left: 2.25rem; 
  display: block;
  letter-spacing: 1px;
  text-shadow: none;
}

cite a::before {
  content: "";
  position: absolute;
  left: -30px;
  top: 50%;
  transform: translateY(-50%);
  width: 26px;
  height: 17px;
  background-image: url("images/cite.png");
  background-repeat: no-repeat;
  background-size: contain;
}

.stats {
  width: min(90%, 600px);
  margin: 2rem auto;
  padding: 1.5rem;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
  font-size: .85rem;
  letter-spacing: .12em;
  text-transform: uppercase;
  background: #050706;
  border-radius: 12px;
  border: 1px solid rgba(0, 180, 70, 0.22);
  color: rgba(170, 255, 200, 0.9);
  text-shadow: 0 0 8px rgba(0, 255, 120, 0.15);
  box-shadow:
    0 0 0 1px rgba(0, 180, 70, 0.12) inset,
    0 0 22px rgba(0, 180, 70, 0.18),
    0 0 55px rgba(0, 120, 40, 0.12);
  position: relative;
  overflow: hidden;
}

.stats::before {
  content:"";
  position:absolute;
  inset:0;
  background:
    repeating-linear-gradient(
      to bottom,
      rgba(0,0,0,0.0) 0px,
      rgba(0,0,0,0.0) 3px,
      rgba(0,0,0,0.22) 4px
    );
  opacity: .35;
  pointer-events:none;
  z-index: 2;
}

.stats::after {
  content:"";
  position:absolute;
  inset:-18%;
  background:
    radial-gradient(circle at 50% 45%,
      rgba(0,255,120,0.10),
      rgba(0,0,0,0.85) 62%,
      rgba(0,0,0,1) 100%
    );
  pointer-events:none;
  mix-blend-mode: screen;
  opacity: .55;
  z-index: 3;
}

.stats a {
  color: rgba(120,255,170,1);
  text-decoration: none;
}

.stats .stats-top {
  text-align: center;
  font-size: .8rem;
  color: rgba(80,255,140,0.5);
  margin-bottom: 1rem;
  position: relative;
}

.stats .stats-top::after {
  content:"";
  display:block;
  height: 2px;
  margin: .75rem auto 0;
  width: 90%;
  background: rgba(0,255,120,0.35);
}

.stats .stats-grid {
  display: grid;
  grid-template-columns: 180px 1fr;
  gap: 1rem 1.25rem;
  align-items: center;
}

.stats .stat-label {
  color: rgba(80,255,140,0.5);
  font-size: .95em;
}

.stats .stat-bar {
  height: 42px;
  border-radius: 4px;
  background: rgba(0, 60, 25, 0.35);
  box-shadow:
    0 0 0 1px rgba(0, 180, 70, 0.18) inset,
    0 0 14px rgba(0, 255, 120, 0.06);
  overflow: hidden;
  position: relative;
}

.stats .stat-fill{
  display: flex;
  align-items: center;
  height: 100%;
  padding: 0 .9rem;
  background: linear-gradient(
    180deg,
    rgba(0,180,70,0.85),
    rgba(0,120,45,0.95)
  );
  color: rgba(0,0,0,0.75);
  font-weight: 700;
  white-space: nowrap;
}

.stats .stats-footer {
  margin-top: 1.25rem;
  font-size: .7rem;
  color: rgba(80,255,140,0.5);
  text-align: center;
  letter-spacing: .10em;
}

.stats .stat-bar.is-newest .stat-fill::after {
  content:"";
  display: inline-block;
  width: 10px;
  height: 1em;
  margin-left: .45rem;
  background: rgba(0, 0, 0, 0.55);
  box-shadow: 0 0 10px rgba(0,255,120,0.18);
  transform: translateY(2px);
  animation: statsCursorBlink 1.1s steps(2, end) infinite;
}

@keyframes statsCursorBlink{
  50% { opacity: 0; }
}

@media (max-width: 640px){
  .stats .stats-grid{
    grid-template-columns: 150px 1fr;
    gap: .6rem .6rem;
  }
}


/*---------------------------- 
 >>>> FANS LIST
----------------------------*/
.members-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1.25rem;
  width: min(95%, 1100px);
  margin: 2rem auto;
}

.member-card {
  background: #050706;
  border-radius: 12px;
  border: 1px solid rgba(0, 180, 70, 0.22);
  padding: 1rem 1rem 1.1rem;
  text-align: left;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
  font-size: .82rem;
  letter-spacing: .10em;
  text-transform: uppercase;
  color: rgba(80,255,140,0.5);
  text-shadow: 0 0 8px rgba(0,255,120,0.10);
  box-shadow:
    0 0 0 1px rgba(0, 180, 70, 0.10) inset,
    0 0 18px rgba(0, 180, 70, 0.12),
    0 0 40px rgba(0, 120, 40, 0.08);
  position: relative;
  overflow: hidden;
  transition: transform .25s ease, border-color .3s ease, box-shadow .35s ease;
}

.member-card::before {
  content:"";
  position:absolute;
  inset:0;
  background:
    repeating-linear-gradient(
      to bottom,
      rgba(0,0,0,0) 0px,
      rgba(0,0,0,0) 3px,
      rgba(0,0,0,0.22) 4px
    );
  opacity: .28;
  pointer-events:none;
  z-index: 1;
}

.member-card::after {
  content:"";
  position:absolute;
  inset:-20%;
  background:
    radial-gradient(circle at 50% 45%,
      rgba(0,255,120,0.10),
      rgba(0,0,0,0.88) 60%,
      rgba(0,0,0,1) 100%
    );
  pointer-events:none;
  mix-blend-mode: screen;
  opacity: .50;
  z-index: 2;
}

.member-card > * {
  position: relative;
  z-index: 3;
}

.member-card:hover {
  transform: translateY(-2px);
  border-color: rgba(0,255,120,0.35);
  box-shadow:
    0 0 0 1px rgba(0, 180, 70, 0.14) inset,
    0 0 24px rgba(0, 180, 70, 0.16),
    0 0 54px rgba(0, 120, 40, 0.12);
}

.member-card b {
  display: block;
  margin-bottom: .25rem;
  font-weight: 700;
  letter-spacing: .14em;
  color: rgba(170, 255, 200, 0.92);
  background-image: none;
  -webkit-text-fill-color: currentColor;
}

.member-card a {
  color: #4d89c2;
  text-decoration: none;
}

.member-card a:hover {
  color: #9d1600;
}

@media (max-width: 1024px){
  .members-grid { grid-template-columns: repeat(3, minmax(0, 1fr));}
}

@media (max-width: 640px){
  .members-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}



/*---------------------------- 
 >>>> GLOBAL LINK CURSOR
----------------------------*/
a, a * {
  cursor: url('images/link.cur'), auto !important;
}