@import "tailwindcss"; @import "tw-animate-css"; @import "shadcn/tailwind.css"; @custom-variant dark (&:is(.dark *)); @theme inline { --color-background: var(--background); --color-foreground: var(--foreground); --font-sans: var(--font-geist-sans); --font-mono: var(--font-mono); --font-heading: var(--font-mono); --color-ring: var(--ring); --color-input: var(--input); --color-border: var(--border); --color-destructive: var(--destructive); --color-primary-foreground: var(--primary-foreground); --color-primary: var(--primary); --color-secondary-foreground: var(--secondary-foreground); --color-secondary: var(--secondary); --color-muted-foreground: var(--muted-foreground); --color-muted: var(--muted); --color-accent-foreground: var(--accent-foreground); --color-accent: var(--accent); --color-popover-foreground: var(--popover-foreground); --color-popover: var(--popover); --color-card-foreground: var(--card-foreground); --color-card: var(--card); --radius-sm: 0.75rem; --radius-md: 1rem; --radius-lg: 1.5rem; --radius-xl: 2rem; --radius-2xl: 2.5rem; --radius-3xl: 3rem; } :root { /* Остужаем фон, чтобы он не был слепяще белым */ --background: oklch(0.98 0.01 240); --foreground: oklch(0.2 0.02 260); /* Карточки теперь чистые белые с легким блюром */ --card: oklch(1 0 0 / 90%); --card-foreground: oklch(0.2 0.02 260); --popover: oklch(1 0 0 / 95%); --popover-foreground: oklch(0.2 0.02 260); /* Светлая тема */ /* Primary = Более глубокий фиолетовый для контраста */ --primary: oklch(0.5 0.2 290); --primary-foreground: oklch(0.985 0 0); /* Secondary = Более насыщенный циан (ближе к синему) */ --secondary: oklch(0.55 0.15 220); --secondary-foreground: oklch(1 0 0); --muted: oklch(0.94 0.01 240); --muted-foreground: oklch(0.45 0.02 260); --accent: oklch(0.94 0.02 290); --accent-foreground: oklch(0.45 0.25 290); --border: oklch(0.85 0.02 260); --input: oklch(0.9 0.02 260); --ring: oklch(0.5 0.2 290); } .dark { --background: oklch(0.1 0.01 260); --foreground: oklch(0.98 0 0); --card: oklch(0.14 0.02 260 / 50%); --card-foreground: oklch(0.98 0 0); --popover: oklch(0.12 0.02 260 / 80%); --popover-foreground: oklch(0.98 0 0); /* ТЕПЕРЬ PRIMARY = ФИОЛЕТОВЫЙ */ --primary: oklch(0.65 0.25 290); --primary-foreground: oklch(0.98 0 0); /* ТЕПЕРЬ SECONDARY = CYAN */ --secondary: oklch(0.85 0.15 190); --secondary-foreground: oklch(0.1 0.01 260); --muted: oklch(0.18 0.02 260); --muted-foreground: oklch(0.85 0.02 260); --accent: oklch(0.2 0.04 260); --accent-foreground: oklch(0.98 0 0); --border: oklch(0.25 0.03 260 / 60%); --input: oklch(0.2 0.03 260 / 50%); --ring: oklch(0.65 0.25 290); } @layer base { * { @apply border-border outline-ring/50; } /* 1. ГЛОБАЛЬНЫЙ БАЗОВЫЙ КУРСОР (Без !important на уровне html/body) */ body { @apply bg-background text-foreground; cursor: url("/cursors/default.png") 1 1, auto; scrollbar-gutter: stable; } /* 2. ВСЕ КЛИКАБЕЛЬНЫЕ ЭЛЕМЕНТЫ (по всему сайту, не только в хедере) */ a, button, select, [role="button"], .cursor-pointer-trigger { cursor: url("/cursors/pointer.png") 13 1, pointer !important; } /* 3. ТЕКСТОВЫЕ ПОЛЯ */ input, textarea, [contenteditable="true"] { cursor: url("/cursors/text.png") 16 16, text !important; } /* 4. ЗАБЛОКИРОВАННЫЕ */ :disabled, [disabled], [aria-disabled="true"] { cursor: url("/cursors/not-allowed.png") 16 16, not-allowed !important; } /* 5. ПРИЦЕЛ (Движок Матрицы) */ /* Даем canvas'у явно его курсор, чтобы body его не перекрывал */ #matrix-canvas, canvas { cursor: url("/cursors/crosshair.png") 16 16, crosshair !important; } /* ХАК 1: Меняем курсор в правом нижнем углу Textarea при ресайзе */ ::-webkit-resizer { background-color: transparent; cursor: url("/cursors/resize-v.png") 16 16, nwse-resize !important; } } /* Переопределяем встроенные утилиты Tailwind для курсоров, чтобы не ломать логику компонентов Shadcn UI */ @layer utilities { .cursor-pointer { cursor: url("/cursors/pointer.png") 13 1, pointer !important; } .cursor-default { cursor: url("/cursors/default.png") 1 1, default !important; } .cursor-text { cursor: url("/cursors/text.png") 16 16, text !important; } .cursor-not-allowed { cursor: url("/cursors/not-allowed.png") 16 16, not-allowed !important; } .cursor-wait { cursor: url("/cursors/wait.png") 16 16, wait !important; } .cursor-help { cursor: url("/cursors/help.png") 1 1, help !important; } .cursor-move { cursor: url("/cursors/move.png") 16 16, move !important; } .cursor-grab { cursor: url("/cursors/grab.png") 16 16, grab !important; } .cursor-grabbing { cursor: url("/cursors/grabbing.png") 16 16, grabbing !important; } .cursor-ew-resize { cursor: url("/cursors/resize-h.png") 16 16, ew-resize !important; } .cursor-ns-resize { cursor: url("/cursors/resize-v.png") 16 16, ns-resize !important; } /* Специфичные кастомные классы */ .cursor-net-crosshair { cursor: url("/cursors/crosshair.png") 16 16, crosshair !important; } /* Автоскролл колесиком */ .autoscroll-active { cursor: url("/cursors/wait.png") 16 16, all-scroll !important; } } .shadow-md { box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.05), 0 2px 4px -2px rgb(0 0 0 / 0.05); } .dark .shadow-2xl { box-shadow: 0 25px 50px -12px rgb(0 0 0 / 0.5), 0 0 20px -5px oklch(var(--primary) / 0.1); } @layer utilities { .text-neon-cyan { color: #ffffff; text-shadow: 0 0 2px #fff, 0 0 8px #00f0ff, 0 0 15px #00f0ff, 0 0 30px #00f0ff; } .text-neon-purple { color: #ffffff; text-shadow: 0 0 2px #fff, 0 0 8px #8b3dff, 0 0 15px #8b3dff, 0 0 30px #8b3dff; } .light .text-neon-cyan { color: #0284c7; text-shadow: 0 0 2px rgba(2, 132, 199, 0.2); } .light .text-neon-purple { color: #6d28d9; text-shadow: 0 0 2px rgba(109, 40, 217, 0.2); } .animate-neon-flicker { animation: neon-flicker 4s infinite alternate ease-in-out; } /* Специфичный курсор для зажатой мыши, который сложно сделать через tailwind config */ .active\:cursor-net-grabbing:active { cursor: url("/cursors/grabbing.png") 16 16, grabbing !important; } } @keyframes neon-flicker { 0%, 18%, 22%, 25%, 53%, 57%, 100% { opacity: 1; } 20%, 24%, 55% { opacity: 0.6; } } @keyframes scan { from { left: -100%; } to { left: 100%; } } .animate-scan { animation: scan 3s cubic-bezier(0.4, 0, 0.6, 1) infinite; } @layer utilities { .custom-scrollbar-retro::-webkit-scrollbar { width: 16px; } .custom-scrollbar-retro::-webkit-scrollbar-track { background: #dfdfdf; box-shadow: inset 1px 1px #fff, inset -1px -1px #808080; } .custom-scrollbar-retro::-webkit-scrollbar-thumb { background: #c0c0c0; border: 2px solid #dfdfdf; box-shadow: 1px 1px #808080, -1px -1px #fff; } .dark .custom-scrollbar-retro::-webkit-scrollbar-track { background: #1a1a1a; } .dark .custom-scrollbar-retro::-webkit-scrollbar-thumb { background: #333; } .autoscroll-active { cursor: url("/cursors/wait.png") 16 16, all-scroll !important; } } #matrix-canvas { display: block; width: 100vw; height: 100vh; position: fixed; top: 0; left: 0; z-index: -1; pointer-events: auto; background-color: #0a0a0c; }