/* Nort Cipher — indigo ink, fuchsia pulse, cyan vault, lime signal, mist canvas */
:root {
  --color-fg: #1a1033;
  --color-primary: #c026d3;
  --color-secondary: #0891b2;
  --color-accent: #65a30d;
  --color-bg: #f3f0fa;
  --color-surface: #ffffff;
  --color-muted: #6b6280;
  --color-nav: #faf8ff;
  --shadow-color: #1a1033;
}

body {
  color: var(--color-fg) !important;
  background-color: var(--color-bg) !important;
  background-image:
    radial-gradient(circle at 0% 0%, rgba(192, 38, 211, 0.07) 0%, transparent 42%),
    radial-gradient(circle at 100% 100%, rgba(8, 145, 178, 0.08) 0%, transparent 38%),
    linear-gradient(135deg, transparent 48%, rgba(26, 16, 51, 0.025) 48%, rgba(26, 16, 51, 0.025) 52%, transparent 52%);
  background-size: auto, auto, 28px 28px;
}

.bg-bg { background-color: var(--color-bg) !important; }
.bg-fg { background-color: var(--color-fg) !important; }
.bg-primary { background-color: var(--color-primary) !important; }
.bg-secondary { background-color: var(--color-secondary) !important; }
.bg-accent { background-color: var(--color-accent) !important; }
.bg-white { background-color: var(--color-surface) !important; }

.text-fg { color: var(--color-fg) !important; }
.text-primary { color: var(--color-primary) !important; }
.text-secondary { color: var(--color-secondary) !important; }
.text-accent { color: var(--color-accent) !important; }

.border-fg { border-color: var(--color-fg) !important; }
.border-primary { border-color: var(--color-primary) !important; }
.border-secondary { border-color: var(--color-secondary) !important; }
.border-accent { border-color: var(--color-accent) !important; }

.bg-zinc-50 { background-color: var(--color-bg) !important; }
.bg-zinc-900 { background-color: var(--color-fg) !important; }

.shadow-neo { box-shadow: 5px 5px 0 0 var(--shadow-color) !important; }
.shadow-neo-hover:hover { box-shadow: 3px 3px 0 0 var(--shadow-color) !important; }
.hover\:shadow-neo-hover:hover { box-shadow: 3px 3px 0 0 var(--shadow-color) !important; }
.hover\:shadow-neo-lg:hover { box-shadow: 9px 9px 0 0 var(--shadow-color) !important; }
.focus\:shadow-neo:focus { box-shadow: 5px 5px 0 0 var(--shadow-color) !important; }
.group:hover .group-hover\:shadow-neo-lg { box-shadow: 9px 9px 0 0 var(--shadow-color) !important; }

.selection\:bg-primary ::selection,
.selection\:bg-primary::-moz-selection { background-color: var(--color-primary) !important; }
.hover\:bg-primary:hover { background-color: var(--color-primary) !important; }
.hover\:bg-fg:hover { background-color: var(--color-fg) !important; }
.hover\:bg-secondary:hover { background-color: var(--color-secondary) !important; }
.hover\:bg-accent:hover { background-color: var(--color-accent) !important; }
.hover\:text-primary:hover { color: var(--color-primary) !important; }
.hover\:text-fg:hover { color: var(--color-fg) !important; }
.hover\:border-primary:hover { border-color: var(--color-primary) !important; }
.focus\:border-primary:focus { border-color: var(--color-primary) !important; }

.group:hover .group-hover\:text-primary { color: var(--color-primary) !important; }
.group:hover .group-hover\:text-secondary { color: var(--color-secondary) !important; }
.group:hover .group-hover\:text-accent { color: var(--color-accent) !important; }
.group:hover .group-hover\:text-fg { color: var(--color-fg) !important; }

::-webkit-scrollbar-track { background-color: var(--color-bg) !important; }
::-webkit-scrollbar-thumb { background-color: var(--color-secondary) !important; border-radius: 0 !important; }
::-webkit-scrollbar-thumb:hover { background-color: var(--color-primary) !important; }

.from-zinc-900 { --tw-gradient-from: var(--color-fg) var(--tw-gradient-from-position) !important; }
.prose-zinc { --tw-prose-headings: var(--color-fg) !important; --tw-prose-links: var(--color-secondary) !important; --tw-prose-bold: var(--color-fg) !important; --tw-prose-quotes: var(--color-fg) !important; --tw-prose-kbd: var(--color-fg) !important; --tw-prose-code: var(--color-fg) !important; }

.text-gray-500 { color: var(--color-muted) !important; }
.text-gray-600 { color: #4a4260 !important; }
.border-gray-800 { border-color: #2d2448 !important; }

nav.bg-white {
  background-color: var(--color-nav) !important;
  backdrop-filter: blur(10px);
}

nav {
  border-radius: 0 !important;
  border-bottom-width: 4px !important;
  border-bottom-color: var(--color-secondary) !important;
  border-bottom-style: solid !important;
}

footer {
  border-radius: 0 !important;
  border-top-width: 4px !important;
  border-top-color: var(--color-primary) !important;
  background: linear-gradient(180deg, #1a1033 0%, #120a24 100%) !important;
}

/* Unique marquee band */
.animate-marquee {
  color: var(--color-fg) !important;
  letter-spacing: 0.06em;
}

/* Generator card accent */
#password-output,
.nort-generator-card {
  border-left: 4px solid var(--color-primary) !important;
}

/* Decorative floating shapes — sharper geometry */
.animate-float {
  border-radius: 4px !important;
}

/* CTA buttons — slight skew on hover feel */
a.bg-primary,
button.bg-primary,
#generate-btn {
  background: linear-gradient(135deg, var(--color-primary) 0%, #a21caf 100%) !important;
}

a.bg-fg,
button.bg-fg,
button[type="submit"].bg-fg {
  background: linear-gradient(135deg, var(--color-fg) 0%, #2d1f52 100%) !important;
}

/* Section rhythm */
section.bg-accent {
  background: linear-gradient(90deg, #d9f99d 0%, #bef264 50%, #a3e635 100%) !important;
  color: var(--color-fg) !important;
}

section.bg-secondary {
  background: linear-gradient(135deg, #0891b2 0%, #0e7490 100%) !important;
}