html,
body {
  background: var(--bg, #000);
}

body.retroterminal-memos {
  color: var(--fg, #0f0);
  background: var(--bg, #000);
  font-family: "Courier New", monospace;
  position: relative;
}

body.retroterminal-memos::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 2147483000;
  background:
    linear-gradient(rgba(var(--fg-rgb, 0,255,0), var(--crt-line-alpha, 0.08)) 50%, rgba(var(--fg-rgb, 0,255,0), 0) 50%),
    linear-gradient(90deg, rgba(var(--fg-rgb, 0,255,0), var(--crt-glow-alpha, 0.02)), rgba(var(--fg-rgb, 0,255,0), var(--crt-glow-alpha, 0.02)));
  background-size: 100% 2px, 3px 100%;
  opacity: 0.55;
}

body.retroterminal-memos::after {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 2147483001;
  mix-blend-mode: screen;
  background-image: linear-gradient(
    to bottom,
    rgba(var(--fg-rgb, 0,255,0), 0.0) 0px,
    rgba(var(--fg-rgb, 0,255,0), 0.0) 6px,
    rgba(var(--fg-rgb, 0,255,0), 0.25) 8px,
    rgba(var(--fg-rgb, 0,255,0), 0.12) 30px,
    rgba(var(--fg-rgb, 0,255,0), 0.04) 44px,
    rgba(var(--fg-rgb, 0,255,0), 0.0) 48px
  );
  background-size: 100% 48px;
  background-repeat: no-repeat;
  animation: rt-glowline-sweep 12.8s linear infinite, rt-glowline-flicker 0.18s infinite;
  opacity: 0.24;
}

body.retroterminal-memos.glowline-off::after {
  display: none;
}

@keyframes rt-glowline-sweep {
  0% { background-position: 0 -48px; }
  100% { background-position: 0 100%; }
}

@keyframes rt-glowline-flicker {
  0%, 100% { opacity: 0.22; }
  50% { opacity: 0.3; }
}

body.retroterminal-memos #root,
body.retroterminal-memos #app,
body.retroterminal-memos main,
body.retroterminal-memos nav,
body.retroterminal-memos aside,
body.retroterminal-memos header,
body.retroterminal-memos section,
body.retroterminal-memos article,
body.retroterminal-memos [role="dialog"] {
  color: inherit;
}

body.retroterminal-memos main,
body.retroterminal-memos nav,
body.retroterminal-memos aside,
body.retroterminal-memos header,
body.retroterminal-memos section,
body.retroterminal-memos article,
body.retroterminal-memos .flex.flex-col.justify-start.items-start.w-full.max-w-full,
body.retroterminal-memos .min-w-0.mx-auto.w-full.max-w-2xl,
body.retroterminal-memos [class*="paper"],
body.retroterminal-memos [class*="Paper"],
body.retroterminal-memos [class*="card"],
body.retroterminal-memos [class*="Card"],
body.retroterminal-memos [class*="memo"],
body.retroterminal-memos [class*="Memo"] {
  background-color: var(--bg, #000) !important;
  border-color: var(--border, #0f0);
}

body.retroterminal-memos a,
body.retroterminal-memos [role="button"],
body.retroterminal-memos button {
  color: var(--fg, #0f0);
}

body.retroterminal-memos a:hover,
body.retroterminal-memos button:hover {
  color: var(--accent, #0c6);
}

body.retroterminal-memos button,
body.retroterminal-memos [role="button"],
body.retroterminal-memos input,
body.retroterminal-memos textarea,
body.retroterminal-memos select {
  background: var(--bg, #000) !important;
  color: var(--fg, #0f0) !important;
  border: 1px solid var(--border, #0f0) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  font-family: "Courier New", monospace !important;
}

body.retroterminal-memos [class*="sidebar"],
body.retroterminal-memos [class*="Sidebar"],
body.retroterminal-memos .bg-sidebar,
body.retroterminal-memos .bg-popover,
body.retroterminal-memos [class*="drawer"],
body.retroterminal-memos [class*="Drawer"],
body.retroterminal-memos [class*="list"],
body.retroterminal-memos [class*="List"],
body.retroterminal-memos [class*="menu"],
body.retroterminal-memos [class*="Menu"],
body.retroterminal-memos [role="menu"],
body.retroterminal-memos [role="listbox"],
body.retroterminal-memos [data-radix-popper-content-wrapper] > div,
body.retroterminal-memos [class*="popover"],
body.retroterminal-memos [class*="Popover"],
body.retroterminal-memos [class*="dropdown"],
body.retroterminal-memos [class*="Dropdown"] {
  background-color: var(--bg, #000) !important;
  border-color: var(--border, #0f0) !important;
  color: var(--fg, #0f0) !important;
}

body.retroterminal-memos .theme-switcher {
  position: fixed;
  left: 14px;
  bottom: 14px;
  z-index: 2147483002;
  display: flex;
  align-items: flex-end;
}

body.retroterminal-memos .theme-dot {
  width: 42px;
  height: 42px;
  border-radius: 999px;
  border: 2px solid var(--border, #0f0);
  display: grid;
  place-items: center;
  font-size: 12px;
  cursor: pointer;
  box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.4) inset;
  background: var(--bg, #000);
}

body.retroterminal-memos .theme-dot.small {
  width: 28px;
  height: 28px;
  flex: 0 0 auto;
  font-size: 0;
  border: 2px solid #000;
}

body.retroterminal-memos .theme-dot.small.theme-effect-toggle {
  width: 34px;
  height: 34px;
  font-size: 10px;
  border-color: var(--border, #0f0);
}

body.retroterminal-memos .theme-menu-core {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
  transition: transform 0.25s ease, opacity 0.25s ease;
}

body.retroterminal-memos .theme-menu-top {
  display: flex;
  align-items: center;
  gap: 8px;
}

body.retroterminal-memos .theme-switcher.hidden .theme-menu-core {
  transform: translateX(-120%);
  opacity: 0.2;
}

body.retroterminal-memos .theme-effect-toggle {
  display: grid;
  place-items: center;
  font-size: 10px;
  font-weight: bold;
  letter-spacing: 0.04em;
  color: var(--fg, #0f0);
  box-shadow: 0 0 0 1px rgba(var(--fg-rgb, 0,255,0), 0.18), 0 0 12px rgba(var(--fg-rgb, 0,255,0), 0.12);
  text-shadow: 0 0 6px rgba(var(--fg-rgb, 0,255,0), 0.28);
}

body.retroterminal-memos .theme-effect-toggle.active {
  background: var(--fg, #0f0);
  color: var(--bg, #000);
}

body.retroterminal-memos .theme-options {
  display: flex;
  gap: 8px;
  align-items: center;
  flex-wrap: nowrap;
  min-width: 0;
  max-width: 0;
  overflow-x: auto;
  overflow-y: hidden;
  padding: 0 20px;
  white-space: nowrap;
  scrollbar-width: thin;
  scrollbar-color: rgba(var(--fg-rgb, 0,255,0), 0.65) transparent;
  mask-image: linear-gradient(90deg, transparent 0, #000 20px, #000 calc(100% - 20px), transparent 100%);
  -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 20px, #000 calc(100% - 20px), transparent 100%);
  transition: max-width 0.25s ease, opacity 0.25s ease;
  opacity: 0;
  margin-left: 0;
  margin-bottom: 0;
}

body.retroterminal-memos .theme-switcher.open .theme-options {
  max-width: calc(100vw - 90px);
  opacity: 1;
}

body.retroterminal-memos .theme-options::-webkit-scrollbar {
  height: 8px;
}

body.retroterminal-memos .theme-options::-webkit-scrollbar-thumb {
  background: rgba(var(--fg-rgb, 0,255,0), 0.65);
  border-radius: 999px;
}

body.retroterminal-memos .theme-options::-webkit-scrollbar-track {
  background: transparent;
}

body.retroterminal-memos .theme-account-proxy {
  width: 34px;
  height: 34px;
  font-size: 10px;
  border-color: var(--border, #0f0);
}

body.retroterminal-memos .theme-account-proxy.is-active {
  background: var(--fg, #0f0);
  color: var(--bg, #000);
}

@media (max-width: 760px) {
  body.retroterminal-memos .theme-options {
    margin-bottom: 0;
  }

  body.retroterminal-memos .theme-switcher {
    bottom: 14px;
  }
}
