@import "tailwindcss";

@layer base {
  :root {
    /* Surfaces */
    --surface-page: #0a0a0a;
    --surface-card: rgb(23 23 23); /* neutral-900 */
    --surface-card-hover: rgb(38 38 38 / 0.5); /* neutral-800/50 */
    --surface-elevated: rgb(23 23 23); /* neutral-900 */
    --surface-input: rgb(10 10 10); /* neutral-950 */

    /* Text */
    --text-primary: rgb(245 245 245); /* neutral-100 */
    --text-secondary: rgb(163 163 163); /* neutral-400 */
    --text-muted: rgb(115 115 115); /* neutral-500 */

    /* Borders */
    --border-default: rgb(38 38 38); /* neutral-800 */
    --border-subtle: rgb(38 38 38 / 0.5); /* neutral-800/50 */
    --border-strong: rgb(64 64 64); /* neutral-700 */

    /* Accent (AgentLens emerald) */
    --accent: #10b981;
    --accent-hover: #34d399;
    --accent-muted: rgba(16, 185, 129, 0.15);
    --accent-foreground: #0a0a0a;

    /* Radius */
    --radius-card: 1rem;
    --radius-button: 0.5rem;
    --radius-icon: 0.75rem;
    --radius-badge: 9999px;

    /* Fonts */
    --font-sans: var(--font-inter), system-ui, sans-serif;
    --font-mono: var(--font-jetbrains), 'JetBrains Mono', 'Fira Code', monospace;
  }
}

[data-animate="hidden"] {
  opacity: 0;
  transform: translateY(24px);
  transition: opacity 0.7s cubic-bezier(0.16, 1, 0.3, 1),
    transform 0.7s cubic-bezier(0.16, 1, 0.3, 1);
}

[data-animate="visible"] {
  opacity: 1;
  transform: translateY(0);
}

[data-animate="hidden"][style*="animation-delay"] {
  transition-delay: inherit;
}

@media (prefers-reduced-motion: reduce) {
  [data-animate="hidden"] {
    opacity: 1;
    transform: none;
    transition: none;
  }
}

a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[role="button"]:focus-visible,
[tabindex]:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
  border-radius: 4px;
}