@font-face {
  font-family: "Symbols";
  src: url("/res/font/symbols.woff2") format("woff2");
  font-display: block;
}

@font-face {
  font-family: 'Noto Emoji';
  src: url('/res/font/NotoEmoji.woff2') format('woff2');
  font-weight: normal;
  font-style: normal;
  font-display: block;
}


body {
  --bg-primary: #000000 !important;
  --bg-secondary: #0A0A0A !important;
  --text-primary: #00F000 !important;
  --text-secondary: #00C000 !important;
  --text-tertiary: #087808!important;
  --text-bright: #00FF00 !important;
  --accent: #FF0000 !important;
  --border: #00FF00 !important;
  --border-dark: #00AA00 !important;
  --status-bar-height: 28px;
  --phi: #6A8FFF;
  --lam: ForestGreen;
  --psi: MediumOrchid;
  --omg: #AAAAAA;

  padding-bottom: var(--status-bar-height);
  font-size-adjust: from-font;
}

code, [data-theme="dark"] code, [data-theme="light"] code {
  background-color: black;
  border: 1px solid var(--text-bright);
  border-radius: 0px;
}

.seeker-link>a {
  opacity: 1;
  color: var(--accent) !important;
}

.seeker-link>a:hover {
  opacity: 1;
}

.seeker-link>a:hover::after {
  width: 100%;
}

.theme-switch {
  display: none;
}

.logo {
  animation: glitch 3s infinite;
}

@keyframes glitch {

  0%,
  100% {
    text-shadow: 0 0 1px #FF0000;
  }

  20% {
    text-shadow: -1px 0 #00FF00, 1px 0 #0000FF;
  }

  40% {
    text-shadow: 1px 0 #F0FF, 0px 0 #0FFF, -1px 0 #FF0A;
  }

  60% {
    text-shadow: 0 0 3px #FF0000;
  }

  70% {
    text-shadow: 0 0 6px #FF0000;
  }


  80% {
    text-shadow: 0 0 3px #FF0000;
  }
}

.corrupted {
  position: relative;
  display: inline-block;
  filter: brightness(1);
}

.corrupted::before,
.corrupted::after {
  content: attr(data-text);
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.corrupted::before {
  animation: glitch-1 0.5s infinite;
  color: var(--border);
  z-index: -1;
}

.corrupted::after {
  animation: glitch-2 0.5s infinite;
  color: var(--accent);
  z-index: -2;
}


@keyframes glitch-1 {
  0%,
  100% {
    clip-path: inset(20% 0 30% 0);
    transform: translate(0);
  }

  20% {
    clip-path: inset(10% 0 80% 0);
    transform: translate(-2px, 2px);
  }

  40% {
    clip-path: inset(50% 0 5% 0);
    transform: translate(2px, -2px);
  }

  60% {
    clip-path: inset(80% 0 0% 0);
    transform: translate(-2px, 0);
  }

  80% {
    clip-path: inset(0% 0 70% 0);
    transform: translate(0, 2px);
  }
}

@keyframes glitch-2 {
  0%,
  100% {
    clip-path: inset(55% 0 5% 0);
    transform: translate(0);
  }

  20% {
    clip-path: inset(20% 0 35% 0);
    transform: translate(2px, -2px);
  }

  40% {
    clip-path: inset(0% 0 85% 0);
    transform: translate(-2px, 2px);
  }

  60% {
    clip-path: inset(40% 0 40% 0);
    transform: translate(2px, 0);
  }

  80% {
    clip-path: inset(85% 0 0% 0);
    transform: translate(0, -2px);
  }
}

.status-bar {
  position: fixed;
  bottom: 0;
  left: 0;
  width: 100%;
  height: var(--status-bar-height);
  background: #000000;
  border-top: 1px solid var(--border);
  padding: 0.2rem 0.2rem;
  font-size: 0.8rem;
  color: var(--text-primary);
  display: flex;
  justify-content: space-between;
}

.redacted {
  background: var(--text-secondary);
  color: transparent;
  user-select: none;
  text-decoration: none;
  border-bottom: none;
}

#seeker-location {
  transition: color 1s;
}

header.hidden ~ footer .status-bar {
  display: none;
}

.opr {
  font-family: "DepartureMono", "Symbols", monospace;
  font-smooth: none;
  text-size-adjust: none;
  filter: contrast(100.00001%);
}

.warning-container {
  text-align: center;
  margin-top: 100px;
}

.system-message {
  color: var(--accent);
  font-size: 0.8rem;
  margin-bottom: 2rem;
  opacity: 0.8;
  letter-spacing: 0.1em;
}

.warning-box {
  border: 1px solid var(--border);
  padding: 2rem;
  margin: 2rem auto;
  max-width: 600px;
  position: relative;
  background: rgba(0, 0, 0, 0.8);
  width: fit-content;
}

.warning-box::before {
  font-family: "DepartureMono", "Symbols", monospace;
  content: "[FG]";
  position: absolute;
  top: -10px;
  left: 20px;
  background: #000;
  padding: 0 2px;
  color: var(--text-primary);
  font-size: 0.8rem;
}

.warning-top {
  font-family: 'TX-02', 'Consolas', 'Courier New', monospace;
  font-size: 2rem;
  color: var(--accent);
  margin-bottom: 1rem;
  animation: flicker 0.5s infinite;
}

@keyframes flicker {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.8; }
}

.warning-text {
  color: var(--text-primary);
  line-height: 1.8;
  font-size: 1rem;
  font-family: revert;
  margin-bottom: 2.2rem;
}

.warning-text:last-child {
  margin-bottom: 0;
}

.warning-text p {
  margin-bottom: 0.5rem;
}

.btn {
  font-size: 1.1rem;
  font-family: 'TX-02', 'Consolas', 'Courier New', monospace;
  position: relative;
  border: solid 2px var(--text-primary);
  font-weight: bold;
  cursor: pointer;
  display: inline-block;
  padding: .5rem 1rem;
  vertical-align: bottom;
  margin: 0 1rem;
  user-select: none;
}

.btn:hover {
  border-color: var(--accent);
}

.btn:active {
  color: var(--accent);
  position: relative;
  top: .2em;
  left: .2em;
}

.btn.htmx-request {
  animation: load 0.25s infinite;
}

@keyframes load {
  0%, 50% { color: var(--accent); border-color: var(--accent); }
  51%, 100% { color: var(--text-primary); border-color: var(--text-primary); }
}

h1 {
  display: flex;
  align-items: center;
  text-align: center;
  font-family: 'TX-02', 'Consolas', 'Courier New', monospace;
}

h1::before,
h1::after {
  content: '';
  flex: 1;
  border-bottom: 1px solid;
}

h1::before {
  margin-right: 1rem;
}

h1::after {
  margin-left: 1rem;
}

.preserve {
  white-space: pre;
  display: inline-block;
  line-height: 1;
}

.opromg-c, .opromg {
  color: var(--omg) !important;
}

.opromg {
  font-family: 'Symbols', monospace !important;
  font-feature-settings: "ss02";
}

.oprpsi-c, .oprpsi {
  color: var(--psi) !important;
}

.oprpsi {
  font-family: 'Symbols', 'Noto Emoji', monospace !important;
}

.oprphi-c, .oprphi {
  color: var(--phi) !important;
}

.oprphi {
  font-family: 'Symbols', monospace !important;
  font-feature-settings: "ss01";
}

.oprlam-c, .oprlam {
  color: var(--lam) !important;
}

.oprlam {
  font-family: 'DepartureMono', 'Symbols', monospace !important;
}

.oprnab {
  font-family: 'DepartureMono', 'Symbols', monospace !important;
  color: #000 !important;
  letter-spacing: 0.1em;
  line-height: normal;
  cursor: none;
}

.oprnab::selection {
  background: #000 !important;
  color: #fff !important;
}

.emoji {
  font-family: 'Noto Emoji', sans-serif;
  font-size: 1.5em;
  line-height: normal;
}

.sym {
  font-family: "Symbols", monospace;
  font-size: 125%;
  line-height: normal;
}


/* An EKey? In my CSS? It's more likely than you think... */