54 lines
2.3 KiB
CSS
54 lines
2.3 KiB
CSS
/* Vibe AI: Стандартный дизайн. Load AFTER the four base stylesheets. */
|
|
:root, [data-theme] {
|
|
color-scheme: light;
|
|
--kt-ai-bg: #fafaf9;
|
|
--kt-ai-bg-soft: #fafaf9;
|
|
--kt-ai-bg-elevated: #ffffff;
|
|
--kt-ai-bg-sunken: #fafaf9;
|
|
--kt-ai-bg-glass: #ffffff;
|
|
--kt-ai-bg-hover: #c1e1f7;
|
|
--kt-ai-bg-active: #c1e1f7;
|
|
--kt-ai-fg: #0c0a09;
|
|
--kt-ai-fg-muted: #78716c;
|
|
--kt-ai-fg-faint: #78716c;
|
|
--kt-ai-fg-on-fill: #0c0a09;
|
|
--kt-ai-border: #e8e6e5;
|
|
--kt-ai-border-strong: #78716c;
|
|
--kt-ai-divider: #e8e6e5;
|
|
--kt-ai-card-bg: #ffffff;
|
|
--kt-ai-card-bg-glow: #ffffff;
|
|
--kt-ai-card-border: #e8e6e5;
|
|
--kt-ai-card-border-hover: #78716c;
|
|
--kt-ai-primary: #3ba6f1;
|
|
--kt-ai-primary-hover: #3ba6f1;
|
|
--kt-ai-primary-subtle: #c1e1f7;
|
|
--kt-ai-link: #0369a1;
|
|
--kt-ai-brand-blue: #3ba6f1;
|
|
--kt-ai-selection: #c1e1f7;
|
|
--kt-ai-focus-ring: #0369a1;
|
|
--kt-ai-focus-shadow: 0 0 0 3px #c1e1f7;
|
|
--kt-ai-chip-default-bg: #c1e1f7;
|
|
--kt-ai-chip-default-fg: #0c0a09;
|
|
--kt-ai-font-sans: Inter, system-ui, sans-serif;
|
|
--kt-ai-card-shadow: 0 2px 6px #0c0a0908;
|
|
--kt-ai-card-shadow-hover: 0 4px 12px #0c0a0910;
|
|
--vibe-accent: #3ba6f1;
|
|
--vibe-tint: #c1e1f7;
|
|
--vibe-heading-font: Inter, system-ui, sans-serif;
|
|
--vibe-heading-weight: 400;
|
|
--vibe-card-radius: 10px;
|
|
--vibe-button-radius: 999px;
|
|
--vibe-field-radius: 6px;
|
|
}
|
|
|
|
body { background: var(--kt-ai-bg); color: var(--kt-ai-fg); font-family: var(--kt-ai-font-sans); }
|
|
h1, h2, .kt-ai-h1, .kt-ai-h2 { font-family: var(--vibe-heading-font); font-weight: var(--vibe-heading-weight); letter-spacing: -.035em; }
|
|
.kt-ai-hero h1 { font-size: clamp(36px, 5.5vw, 64px); line-height: 1.08; }
|
|
.kt-ai-section { padding-block: clamp(32px, 6vw, 64px); }
|
|
.kt-ai-pagehead, .kt-ai-cta, .kt-ai-pagefoot { background: var(--kt-ai-bg); color: var(--kt-ai-fg); }
|
|
.kt-ai-tile, .kt-ai-card { background: var(--kt-ai-card-bg); border: 1px solid var(--kt-ai-card-border); border-radius: var(--vibe-card-radius); box-shadow: var(--kt-ai-card-shadow); }
|
|
.kt-ai-btn, .kt-ai-btn[data-size] { border-radius: var(--vibe-button-radius); }
|
|
.kt-ai-input, .kt-ai-select, .kt-ai-textarea { border-radius: var(--vibe-field-radius); }
|
|
.vibe-highlight { background: var(--vibe-tint); color: var(--kt-ai-fg); border-radius: 4px; padding-inline: .12em; }
|
|
.vibe-accent { color: var(--vibe-accent); }
|