/*
  RUEZALS.lol Slink skin
  Purpose: make Slink visually belong to the Dhraconyx/RUEZALS app family.
  Source of truth: dhraconyx.ruezals.com and dhraconyx.ruezals.com/index2.html.
  This file is injected by Apache and can be removed without touching Slink.
*/

:root {
  --rz-black: #010602;
  --rz-shell: #031006;
  --rz-panel: rgba(1, 8, 3, 0.82);
  --rz-panel-strong: rgba(0, 4, 2, 0.92);
  --rz-green: #49d46b;
  --rz-green-soft: #9df2ad;
  --rz-green-dim: rgba(68, 190, 92, 0.44);
  --rz-gold: #d3a424;
  --rz-gold-bright: #ffd84b;
  --rz-ink: #e7f7df;
  --rz-muted: #a8c6a9;
}

html.rz-lol-dhraconyx,
html.rz-lol-dhraconyx body {
  min-height: 100%;
  background: radial-gradient(circle at 50% 20%, rgba(0, 70, 28, 0.22), transparent 42%),
    linear-gradient(180deg, #000 0%, var(--rz-black) 42%, #000 100%) !important;
  color: var(--rz-ink) !important;
}

html.rz-lol-dhraconyx body {
  overflow-x: hidden;
}

html.rz-lol-dhraconyx:not(.rz-touch) body,
html.rz-lol-dhraconyx:not(.rz-touch) body * {
  cursor: none !important;
}

html.rz-lol-dhraconyx body > .h-full {
  position: relative;
  z-index: 2;
}

#rz-realm-bg,
#rz-molecule-canvas {
  display: block;
}

#rz-realm-bg {
  position: fixed;
  inset: 0;
  width: 100%;
  height: 100%;
  z-index: 0;
  pointer-events: none;
  opacity: 0.88;
}

#rz-cursor {
  position: fixed;
  left: 0;
  top: 0;
  width: 34px;
  height: 34px;
  pointer-events: none;
  z-index: 2147483646;
  filter: drop-shadow(0 0 5px rgba(140, 255, 160, 0.85));
  transform-origin: 3px 3px;
}

html.rz-cursor-press #rz-cursor {
  transform: scale(0.82) rotate(-10deg);
}

#rz-dragon-chase {
  position: fixed;
  left: 0;
  top: 0;
  width: 50px;
  height: 50px;
  pointer-events: none;
  z-index: 2147483645;
  opacity: 0.92;
  will-change: transform;
  filter: invert(1) drop-shadow(0 0 8px rgba(60, 210, 120, 0.9))
    drop-shadow(0 0 18px rgba(28, 200, 75, 0.52));
}

#rz-dragon-chase img,
#rz-logo-pong {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

#rz-logo-pong {
  position: fixed;
  width: 82px;
  height: 82px;
  left: 0;
  top: 0;
  z-index: 1;
  opacity: 0.18;
  pointer-events: none;
  filter: invert(1) drop-shadow(0 0 12px rgba(120, 255, 150, 0.42));
  will-change: transform;
}

#rz-shell-runes {
  position: fixed;
  inset: 18px;
  z-index: 1;
  border: 1px solid rgba(40, 120, 50, 0.28);
  box-shadow: inset 0 0 70px rgba(0, 75, 30, 0.18);
  pointer-events: none;
}

#rz-shell-runes span {
  position: absolute;
  font-family: Consolas, "Courier New", monospace;
  font-size: 11px;
  color: var(--rz-green);
  opacity: 0.08;
  animation: rz-rune-glow var(--fd, 4s) ease-in-out infinite;
  animation-delay: var(--fph, 0s);
}

@keyframes rz-rune-glow {
  0%,
  100% {
    opacity: 0.06;
    text-shadow: none;
  }
  50% {
    opacity: 0.88;
    text-shadow: 0 0 10px rgba(140, 255, 160, 1), 0 0 24px rgba(28, 200, 75, 0.7);
  }
}

#rz-molecule-banner {
  position: relative;
  z-index: 3;
  min-height: clamp(150px, 24vh, 250px);
  margin: 14px clamp(16px, 4vw, 64px) 6px;
  border: 1px solid rgba(40, 120, 50, 0.42);
  background:
    linear-gradient(90deg, rgba(6, 18, 8, 0.88), rgba(6, 24, 10, 0.74), rgba(6, 18, 8, 0.88)),
    radial-gradient(circle at 50% 45%, rgba(211, 164, 36, 0.11), transparent 42%);
  box-shadow: inset 0 0 65px rgba(0, 80, 30, 0.36), 0 0 50px rgba(0, 70, 30, 0.22);
  overflow: hidden;
}

#rz-molecule-banner::before {
  content: "MOLECULE FIELD";
  position: absolute;
  left: 18px;
  top: 14px;
  z-index: 2;
  color: rgba(157, 242, 173, 0.55);
  font: 700 10px/1 Consolas, "Courier New", monospace;
  letter-spacing: 0.28em;
}

#rz-molecule-canvas {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

#rz-banner-log {
  position: absolute;
  right: 14px;
  bottom: 10px;
  z-index: 3;
  color: rgba(157, 242, 173, 0.62);
  font: 700 9px/1.4 Consolas, "Courier New", monospace;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

html.rz-lol-dhraconyx header {
  position: relative;
  z-index: 4;
  background: linear-gradient(90deg, rgba(0, 5, 2, 0.96), rgba(3, 17, 7, 0.88), rgba(0, 5, 2, 0.96)) !important;
  border-bottom: 1px solid rgba(40, 120, 50, 0.44) !important;
  box-shadow: 0 0 35px rgba(0, 70, 30, 0.2);
}

html.rz-lol-dhraconyx header a[href="/"] span {
  color: var(--rz-gold-bright) !important;
  font-family: Georgia, "Times New Roman", serif !important;
  text-transform: uppercase;
  letter-spacing: 0.12em;
}

html.rz-lol-dhraconyx header a[href="/"] img {
  filter: invert(1) drop-shadow(0 0 8px rgba(120, 255, 150, 0.45));
}

html.rz-lol-dhraconyx main,
html.rz-lol-dhraconyx footer,
html.rz-lol-dhraconyx [data-slot="sidebar-inset"] {
  background: transparent !important;
}

html.rz-lol-dhraconyx .container,
html.rz-lol-dhraconyx [class*="rounded-3xl"],
html.rz-lol-dhraconyx [class*="rounded-xl"],
html.rz-lol-dhraconyx [class*="rounded-lg"] {
  border-color: rgba(40, 120, 50, 0.42) !important;
}

html.rz-lol-dhraconyx [class*="bg-white"],
html.rz-lol-dhraconyx [class*="dark:bg-gray"],
html.rz-lol-dhraconyx [class*="bg-gray"],
html.rz-lol-dhraconyx [class*="bg-slate"],
html.rz-lol-dhraconyx [class*="bg-blue"] {
  background-color: rgba(3, 13, 6, 0.72) !important;
  background-image: linear-gradient(180deg, rgba(8, 26, 11, 0.86), rgba(2, 9, 4, 0.74)) !important;
}

html.rz-lol-dhraconyx [class*="text-blue"],
html.rz-lol-dhraconyx [class*="text-indigo"] {
  color: var(--rz-gold-bright) !important;
  -webkit-text-fill-color: var(--rz-gold-bright) !important;
}

html.rz-lol-dhraconyx [class*="text-slate"],
html.rz-lol-dhraconyx [class*="text-gray"],
html.rz-lol-dhraconyx [class*="text-muted"] {
  color: var(--rz-muted) !important;
}

html.rz-lol-dhraconyx h1,
html.rz-lol-dhraconyx h2,
html.rz-lol-dhraconyx h3 {
  color: var(--rz-gold-bright) !important;
  font-family: Georgia, "Times New Roman", serif !important;
  letter-spacing: 0;
  text-shadow: 0 0 14px rgba(211, 164, 36, 0.22);
}

html.rz-lol-dhraconyx a,
html.rz-lol-dhraconyx button {
  transition: border-color 0.2s ease, color 0.2s ease, background 0.2s ease, box-shadow 0.2s ease !important;
}

html.rz-lol-dhraconyx a:hover,
html.rz-lol-dhraconyx button:hover {
  border-color: rgba(211, 164, 36, 0.58) !important;
  box-shadow: 0 0 18px rgba(211, 164, 36, 0.14), inset 0 0 22px rgba(30, 140, 60, 0.14) !important;
}

html.rz-lol-dhraconyx input,
html.rz-lol-dhraconyx textarea,
html.rz-lol-dhraconyx select {
  background: rgba(1, 7, 3, 0.82) !important;
  border-color: rgba(40, 120, 50, 0.42) !important;
  color: var(--rz-ink) !important;
}

html.rz-lol-dhraconyx footer {
  position: relative;
  z-index: 4;
  border-top: 1px solid rgba(40, 120, 50, 0.34);
}

.rz-realm-mark {
  color: var(--rz-green-soft);
  font: 700 10px/1 Consolas, "Courier New", monospace;
  letter-spacing: 0.24em;
  text-transform: uppercase;
  opacity: 0.62;
}

@media (prefers-reduced-motion: reduce), (max-width: 720px) {
  #rz-cursor,
  #rz-dragon-chase,
  #rz-logo-pong {
    display: none;
  }

  html.rz-lol-dhraconyx body,
  html.rz-lol-dhraconyx body * {
    cursor: auto !important;
  }

  #rz-molecule-banner {
    min-height: 128px;
    margin-inline: 10px;
  }
}