get-shit-pretty 0.6.2 → 0.6.3

package/gsp/skills/gsp-style/styles/art-deco.yml

@@ -57,5 +57,86 @@ dark_mode:
     background: "#050505"
     surface: "#0A0A0A"
 
+intensity:
+  variance: 3     # bilateral symmetry, centered axes, mathematical precision
+  motion: 5       # theatrical reveals, glow intensification, mechanical satisfaction
+  density: 5      # ornamental richness — geometric decoration fills surfaces intentionally
+
+patterns:
+  card:
+    border: "{shape.border-width} solid {shape.border-color}"
+    shadow: "{elevation.shadow-sm} — gold glow, never dark drop shadows"
+    radius: "0px to 2px — sharp geometric precision"
+    background: "{color.surface}"
+    decoration: "L-shaped brass corner brackets at opposing corners (top-right + bottom-left)"
+  button-primary:
+    background: "transparent"
+    border: "2px solid {color.primary}"
+    shadow: "{elevation.shadow-sm} resting, {elevation.shadow-md} on hover — gold glow"
+    text: "uppercase, tracking-widest (0.2em), {color.primary}"
+    radius: "0px"
+    hover: "gold fill + black text + glow expansion"
+  button-secondary:
+    background: "transparent"
+    border: "1px solid {color.primary}"
+    text: "uppercase, tracking-widest, {color.primary}"
+    radius: "0px"
+    hover: "midnight blue fill ({color.secondary})"
+  input:
+    border: "border-b 2px solid {color.primary}"
+    radius: "0px"
+    background: "transparent"
+    focus: "border brightens to lighter gold, bottom shadow glow appears"
+    placeholder: "{color.on-background} at 50% opacity"
+  badge:
+    shape: "0px radius, gold border, optional rotated-diamond frame"
+    text: "uppercase tracking-widest, {typography.font-family-display}, {color.primary}"
+  nav:
+    style: "centered axis, gold border separators between links"
+    links: "uppercase tracking-widest, hover shifts to {color.primary} with glow"
+  layout:
+    archetype: "symmetric-ceremonial"
+    max-width: "max-w-6xl"
+    section-spacing: "py-32 — generous ceremonial spacing"
+    grid-gap: "gap-8"
+    symmetry: "central axis, bilateral mirroring, even column counts"
+    surfaces: "diagonal crosshatch pattern at 3-5% opacity — repeating gold lines at 45deg"
+    decoration: "sunburst radial gradients, stepped corners (ziggurat), double borders, vertical gold dividers"
+
+constraints:
+  never:
+    - "rounded corners above 2px — geometric sharpness is non-negotiable"
+    - "soft diffused drop shadows — use glow effects instead"
+    - "organic curves or blob shapes — geometry only, mathematical forms"
+    - "muted or desaturated gold — metallic gold must feel radiant against obsidian"
+    - "asymmetric layouts — bilateral symmetry and central axes required"
+    - "lowercase display text — all headings, labels, buttons must be uppercase"
+    - "subtle invisible borders — borders are celebrated, gold, and visible"
+    - "bouncy or elastic easing — mechanical, theatrical motion only"
+  always:
+    - "gold glow (box-shadow 0 0 Npx rgba gold) on elevated elements, never dark shadows"
+    - "stepped corner decorations or L-brackets on major containers"
+    - "uppercase with tracking-widest on all display text and buttons"
+    - "diagonal crosshatch or geometric pattern at low opacity on backgrounds"
+    - "Roman numerals (I, II, III) for numbering steps, tiers, lists"
+    - "double-frame treatment on featured images (outer gold border + inner dark border)"
+    - "gold border at 30% default, intensifying to 100% on hover"
+
+effects:
+  interaction-vocabulary: [glow-intensify, mechanical-lift, diamond-rotate, border-reveal]
+  hover:
+    card: "mechanical-lift — -translate-y-2, border opacity 30%→100%, corner brackets brighten"
+    button: "glow-intensify — background flips gold, text inverts black, glow radius expands"
+    link: "border-reveal — gold underline expands, color shifts to {color.primary}"
+    image: "glow-intensify — scale-105, gold overlay or grayscale removal"
+  active:
+    button: "glow-intensify — glow dims slightly, pressed mechanical feel"
+  focus:
+    general: "ring-2 ring-{color.primary} ring-offset-2 ring-offset-{color.background}"
+  transition: "duration-300 to duration-500, ease-out or ease-in-out"
+  ambient:
+    - "sunburst-pulse — radial gold gradient pulses subtly at hero focal point"
+    - "glow-breathe — gold elements pulse glow at rest (subtle, 2s cycle)"
+
 compatibility: [luxury, monochrome]
 clashes: [neubrutalism, retro, flat-design]

package/gsp/skills/gsp-style/styles/bauhaus.yml

@@ -53,5 +53,83 @@ dark_mode:
     surface: "#2A2A2A"
     on-background: "#F0F0F0"
 
+intensity:
+  variance: 7     # asymmetric color-blocked sections, overlapping geometric shapes, broken grids
+  motion: 3       # snappy mechanical transitions, no ambient — static compositions with interaction only
+  density: 6      # poster-dense — thick borders, color blocks, geometric shapes fill the visual field
+
+patterns:
+  card:
+    border: "{shape.border-width} solid {shape.border-color}"
+    shadow: "{elevation.shadow-md}"
+    radius: "0px"
+    background: "{color.background}"
+    decoration: "small geometric shape (8px) in top-right corner — circle, square, or triangle in primary color"
+  button-primary:
+    background: "{color.primary}"
+    border: "{shape.border-width} solid {shape.border-color}"
+    shadow: "{elevation.shadow-sm}"
+    text: "uppercase, font-bold, tracking-wider, white"
+    radius: "0px or rounded-full — binary extremes only"
+  button-secondary:
+    background: "{color.secondary}"
+    border: "{shape.border-width} solid {shape.border-color}"
+    shadow: "{elevation.shadow-sm}"
+    text: "uppercase, font-bold, tracking-wider, white"
+    radius: "0px or rounded-full"
+  input:
+    border: "{shape.border-width} solid {shape.border-color}"
+    radius: "0px"
+    background: "{color.background}"
+    focus: "ring-2 ring-offset-2 ring-{color.primary}"
+    height: "h-12"
+  badge:
+    shape: "0px radius or rounded-full — binary extremes"
+    text: "uppercase font-bold tracking-widest text-xs"
+    decoration: "solid primary color background (red, blue, or yellow)"
+  nav:
+    logo: "three geometric shapes (circle, square, triangle) in primary colors"
+    links: "uppercase font-bold tracking-wider, hover color shifts to primary"
+    border: "border-b-4 {shape.border-color}"
+  layout:
+    archetype: "constructivist-poster"
+    max-width: "max-w-7xl"
+    section-spacing: "py-16 to py-24"
+    grid-gap: "gap-6 to gap-8"
+    surfaces: "solid color-blocked sections — alternating red, blue, yellow, white, black backgrounds"
+    decoration: "overlapping circles, rotated-45 squares, triangles (clip-path polygon), dot grid patterns"
+    dividers: "border-b-4 border-black between every section — strong horizontal rhythm"
+
+constraints:
+  never:
+    - "in-between border-radius (1px-9998px) — binary: 0px or 9999px only"
+    - "gradients of any kind — solid color blocks only, no blending"
+    - "soft blurred shadows — hard-offset (Npx Npx 0px 0px black) only"
+    - "thin borders — minimum 2px mobile, 4px desktop"
+    - "muted or desaturated colors — primary red, blue, yellow at full intensity"
+    - "organic curves or blob shapes — circles, squares, triangles only"
+    - "subtle effects or transparency — everything is direct and declarative"
+  always:
+    - "hard-offset shadows (4-8px, 0px blur, pure black) on every elevated element"
+    - "thick black borders (border-2 mobile, border-4 desktop) on every container"
+    - "at least 3 color-blocked sections using solid primary backgrounds"
+    - "geometric shape decorations (circle/square/triangle) on cards and corners"
+    - "45-degree rotation on every 3rd decorative shape"
+    - "grayscale images by default with hover:grayscale-0 reveal"
+    - "extreme type scale contrast (text-8xl headlines vs text-base body)"
+
+effects:
+  interaction-vocabulary: [press-down, geometric-lift, shape-scale, color-block-shift]
+  hover:
+    card: "geometric-lift — -translate-y-1, shadow maintained"
+    button: "color-block-shift — opacity-90 on background color"
+    icon-shape: "shape-scale — scale-110 via group-hover"
+    image: "grayscale-reveal — grayscale-0 over 300ms"
+  active:
+    button: "press-down — translate-x-[2px] translate-y-[2px], shadow-none"
+  focus:
+    general: "ring-2 ring-{color.primary} ring-offset-2"
+  transition: "duration-200 to duration-300, ease-out — mechanical, decisive"
+
 compatibility: [neubrutalism, flat-design]
 clashes: [glassmorphism, liquid-glass, neumorphism]

package/gsp/skills/gsp-style/styles/bold-typography.yml

@@ -57,5 +57,78 @@ dark_mode:
     background: "#050505"
     surface: "#0F0F0F"
 
+intensity:
+  variance: 6
+  motion: 3
+  density: 2
+
+patterns:
+  card:
+    border: "{shape.border-width} solid {shape.border-color}"
+    shadow: "none — depth from typographic layering only"
+    radius: "0px"
+    background: "{color.surface}"
+  button-primary:
+    style: "text-only with animated underline — no background fill"
+    text: "{color.primary}, uppercase, tracking-wider (0.1em), weight 600"
+    underline: "absolute h-0.5 bg-{color.primary}, scale-x-100 resting"
+  button-secondary:
+    background: "transparent → fills on hover"
+    border: "1px solid {color.on-background}"
+    text: "{color.on-background}, uppercase, tracking-wider"
+    radius: "0px"
+  input:
+    border: "1px solid {shape.border-color}"
+    radius: "0px"
+    background: "{color.surface}"
+    focus: "border-{color.primary} — border-only focus, no glow"
+  badge:
+    shape: "sharp corners, thin border"
+    text: "uppercase, tracking-widest, text-xs"
+  nav:
+    style: "minimal — logo + sparse links"
+    links: "uppercase tracking-wider, underline reveals on hover"
+  layout:
+    archetype: "editorial-whitespace"
+    max-width: "max-w-6xl"
+    section-spacing: "py-24 to py-40 — extreme negative space"
+    grid-gap: "gap-8 to gap-16"
+    surfaces: "noise grain at 1.5% opacity — subtle tactile depth"
+    typography-hero: "text-7xl to text-9xl desktop, tracking-tighter (-0.06em)"
+    decoration: "oversized muted numbers/text behind content at low opacity"
+    dividers: "full-width horizontal rules as section breaks"
+
+constraints:
+  never:
+    - "box-shadow of any kind — no shadows in this aesthetic"
+    - "border-radius above 0px — everything sharp-edged"
+    - "background fills on primary buttons — underline-only interaction"
+    - "small headlines — minimum text-5xl mobile, text-7xl desktop"
+    - "decorative imagery competing with type — type IS the visual"
+    - "more than one accent color — black, white, and one (vermillion)"
+    - "rounded or pill shapes — angular geometry only"
+    - "ease-in-out or bouncy easing — precise, deliberate motion only"
+  always:
+    - "extreme scale contrast between headline and body (6:1+ ratio)"
+    - "tight letter-spacing on display text (-0.04em to -0.06em)"
+    - "wide letter-spacing on labels/overlines (0.1em to 0.2em)"
+    - "generous negative space framing headlines"
+    - "noise grain texture (1-2% opacity)"
+    - "sharp 0px radius on all elements"
+    - "full-width horizontal rules between sections"
+
+effects:
+  interaction-vocabulary: [underline-reveal, color-invert, border-brighten, micro-press]
+  hover:
+    button-primary: "underline-reveal — scale-x expands to 110%"
+    button-secondary: "color-invert — bg fills foreground, text inverts"
+    link: "underline-reveal — scale-x-0 → scale-x-100 slide-in"
+    card: "border-brighten — border subtly lightens"
+  active:
+    button: "micro-press — translate-y-px"
+  focus:
+    general: "border-{color.primary} — border-based, no ring, no glow"
+  transition: "duration-150 to duration-200, cubic-bezier(0.25, 0, 0, 1)"
+
 compatibility: [monochrome, kinetic]
 clashes: [playful-geometric, botanical, claymorphism]

package/gsp/skills/gsp-style/styles/botanical.yml

@@ -59,5 +59,83 @@ dark_mode:
     surface: "#243524"
     on-background: "#E2EDE2"
 
+intensity:
+  variance: 4     # staggered card offsets, arch imagery, but structured overall
+  motion: 4       # slow and graceful — plant-sway feel, 500-700ms transitions
+  density: 3      # airy — generous whitespace, breathing room, nature needs space
+
+patterns:
+  card:
+    border: "{shape.border-width} solid {shape.border-color}"
+    shadow: "{elevation.shadow-sm} — green-tinted, diffused, never harsh"
+    radius: "{shape.border-radius-lg}"
+    background: "#FFFFFF or {color.surface}"
+    texture: "page-level paper grain at 1.5% opacity"
+  button-primary:
+    background: "{color.on-background}"
+    border: "none"
+    shadow: "none"
+    text: "uppercase, tracking-widest, text-sm, white"
+    shape: "rounded-full — pill always"
+    hover: "lightens slightly or shifts to terracotta ({color.accent})"
+  button-secondary:
+    background: "transparent"
+    border: "{shape.border-width} solid {color.muted}"
+    text: "uppercase, tracking-widest, text-sm, {color.muted}"
+    shape: "rounded-full"
+  input:
+    border: "border-b only or pill-shaped with light bg ({color.surface})"
+    radius: "{shape.border-radius-lg} if pill, 0px if underline"
+    background: "{color.surface} or transparent"
+    focus: "border shifts to {color.muted} — soft sage green, no harsh rings"
+  badge:
+    shape: "rounded-full pill"
+    text: "text-xs, {color.muted}, soft earth tones"
+  nav:
+    style: "clean horizontal with generous spacing"
+    links: "sans-serif weight 500, hover deepens to {color.primary}"
+  layout:
+    archetype: "staggered-botanical"
+    max-width: "max-w-7xl"
+    section-spacing: "py-24 to py-32 — sacred whitespace"
+    grid-gap: "gap-12 to gap-16"
+    asymmetry: "translate-y-12 on alternating cards for natural stagger (md+ only)"
+    surfaces: "paper grain texture at 1.5% opacity — mandatory, gives soul"
+    decoration: "arch-topped images (clip-path or border-radius), curved SVG vine connectors, italic serif word emphasis"
+
+constraints:
+  never:
+    - "harsh geometric shapes — everything soft, rounded, organic"
+    - "pure black (#000000) shadows or borders — green-tinted alternatives only"
+    - "neon or saturated artificial colors — earth-drawn palette exclusively"
+    - "flat textureless backgrounds — paper grain is non-negotiable"
+    - "snappy or mechanical motion — everything slow, graceful, eased"
+    - "heavy prominent borders — thin, delicate, 1px only"
+    - "tight cramped spacing — nature needs room to breathe"
+    - "drop shadows with dark tones — all shadows color-tinted (forest green)"
+  always:
+    - "paper grain noise texture (1.5% opacity, fixed overlay)"
+    - "arch-topped featured images (border-radius or clip-path)"
+    - "Playfair Display serif for headlines with italic emphasis on key words"
+    - "staggered card layouts (translate-y-12 on alternating items, md+)"
+    - "green-tinted soft shadows using palette colors"
+    - "generous whitespace — gap-12+, py-24+ between sections"
+    - "pill-shaped buttons (rounded-full) and badges"
+
+effects:
+  interaction-vocabulary: [gentle-lift, slow-bloom, soft-scale, vine-drift]
+  hover:
+    card: "gentle-lift — -translate-y-1 to -translate-y-2, shadow blooms"
+    button: "soft-scale — subtle darken (opacity-90) with duration-300"
+    image: "slow-bloom — scale-105 over 700ms, luxurious unfurl"
+    link: "vine-drift — arrow translates right (translate-x-1), color deepens"
+  active:
+    button: "soft-scale — slight darken, tactile but gentle"
+  focus:
+    general: "ring-2 ring-{color.muted} ring-offset-2 — sage green soft glow"
+  transition: "duration-300 to duration-700, ease-out"
+  ambient:
+    - "parallax-float — subtle vertical shift on decorative elements during scroll"
+
 compatibility: [organic, swiss-minimalist]
 clashes: [cyberpunk, terminal, industrial]

package/gsp/skills/gsp-style/styles/claymorphism.yml

@@ -65,5 +65,89 @@ dark_mode:
     surface: "rgba(50,45,70,0.60)"
     on-background: "#E8E6F0"
 
+intensity:
+  variance: 6     # bento grids with col-span mixing, overlapping badges, varied radii per nesting level
+  motion: 6       # blob drift, breathe animations, squish physics, hover lifts — playful and continuous
+  density: 4      # airy — clay needs space to show shadow depth and floating effect
+
+patterns:
+  card:
+    border: "none — depth from 4-layer shadow stack only"
+    shadow: "{elevation.shadow-lg}"
+    radius: "{shape.border-radius-md}"
+    background: "{color.surface} with backdrop-blur-xl"
+    texture: "glass-clay hybrid — semi-transparent white reveals background blobs"
+  button-primary:
+    background: "{gradient.button}"
+    border: "none"
+    shadow: "{elevation.shadow-md}"
+    text: "bold, tracking-wide, white"
+    radius: "{shape.border-radius-sm}"
+  button-secondary:
+    background: "white"
+    border: "none"
+    shadow: "{elevation.shadow-md}"
+    text: "{color.on-background}, bold"
+    radius: "{shape.border-radius-sm}"
+  input:
+    border: "none — depth from inset shadow only"
+    radius: "{shape.border-radius-sm}"
+    background: "#EFEBF5"
+    focus: "background becomes white, ring-4 ring-{color.primary}/20"
+    shadow: "{inset.pressed}"
+    height: "h-16"
+  badge:
+    shape: "rounded-full or rounded-lg, gradient background"
+    text: "text-xs font-bold uppercase tracking-wide"
+    decoration: "colored gradient fill matching icon orb palette"
+  nav:
+    style: "floating pill bar"
+    background: "white/80 with backdrop-blur-xl"
+    shape: "rounded-[40px]"
+    shadow: "{elevation.shadow-sm}"
+  layout:
+    archetype: "bento-clay"
+    max-width: "max-w-7xl"
+    section-spacing: "py-20 to py-32"
+    grid-gap: "gap-8 to gap-12"
+    surfaces: "animated gradient blobs (accent colors at /10 opacity, blur-3xl) — never flat"
+    decoration: "overlapping clay shapes, nested radii (outer 48px, card 32px, image 24px)"
+    depth: "glass-clay hybrid — bg-white/60 to /80 + backdrop-blur-xl"
+
+constraints:
+  never:
+    - "sharp corners — minimum radius {shape.border-radius-sm} (20px), never rounded-md or rounded-sm"
+    - "flat backgrounds without animated blobs — texture is mandatory"
+    - "single-layer shadows — minimum 4-layer shadow stack for clay depth"
+    - "gray text lighter than {color.muted} (#635F69) — accessibility minimum"
+    - "gradient text below text-5xl — readability risk at small sizes"
+    - "hard-offset shadows — all shadows soft, multi-layered, color-tinted"
+    - "visible borders — depth communicated through shadow stacks only"
+  always:
+    - "4-layer box-shadow on every elevated element (drop + highlight + inner bounce + inner rim)"
+    - "super-rounded corners ({shape.border-radius-sm} minimum on smallest elements)"
+    - "animated background blobs (3-4 large, staggered drift animations)"
+    - "glass-clay cards (semi-transparent white + backdrop-blur-xl)"
+    - "Nunito font-family on all headings and stat numbers"
+    - "inset shadow on inputs and pressed states ({inset.pressed})"
+    - "nested radius hierarchy (outer > card > image, each 8px smaller)"
+
+effects:
+  interaction-vocabulary: [squish-press, clay-lift, breathe-scale, blob-drift]
+  hover:
+    card: "clay-lift — -translate-y-2, shadow stack intensifies"
+    button: "clay-lift — -translate-y-1, shadow enhancement"
+    stat-orb: "breathe-scale — scale-110 with 300ms ease"
+    blog-card: "clay-lift — -translate-y-3 for dramatic float"
+  active:
+    button: "squish-press — scale-[0.92] + shadow switches to {inset.pressed}"
+  focus:
+    general: "ring-4 ring-{color.primary}/30 ring-offset-2"
+  transition: "duration-200 to duration-500, cubic-bezier(0.4, 0, 0.2, 1)"
+  ambient:
+    - "blob-drift — background blobs translateY(-20px) rotate(2deg) over 8-12s infinite"
+    - "breathe-scale — stat orbs scale(1.02) over 6s infinite"
+    - "clay-float — decorative shapes orbit hero with 12s pronounced drift"
+
 compatibility: [neumorphism, playful-geometric]
 clashes: [neubrutalism, monochrome, terminal]

package/gsp/skills/gsp-style/styles/cyberpunk.yml

@@ -58,5 +58,92 @@ dark_mode:
     background: "#050508"
     surface: "#0A0A12"
 
+intensity:
+  variance: 8     # asymmetric HUD layouts, skewed grids, overlapping neon panels
+  motion: 7       # glitch animations, scanline scrolls, neon pulses, chromatic flicker
+  density: 7      # layered textures — scanlines, circuit grids, noise, gradient mesh
+
+patterns:
+  card:
+    border: "{shape.border-width} solid {shape.border-color}"
+    shadow: "{elevation.shadow-md} neon glow, intensifies on hover"
+    radius: "clip-path chamfer — 45-degree corner cuts, never border-radius"
+    background: "{color.surface}"
+    variants: "default (chamfered), terminal (traffic-light header bar), holographic (glass + corner accents)"
+  button-primary:
+    background: "transparent, border {shape.border-width} solid {color.primary}"
+    border: "2px solid {color.primary}"
+    shadow: "{glow.neon-primary} on hover"
+    text: "uppercase, monospace, tracking-wider, {color.primary}"
+    radius: "clip-path chamfer-sm"
+    fill: "hover fills {color.primary}, text inverts to {color.background}"
+  button-secondary:
+    background: "transparent"
+    border: "2px solid {color.secondary}"
+    shadow: "{glow.neon-secondary} on hover"
+    text: "uppercase, monospace, {color.secondary}"
+    radius: "clip-path chamfer-sm"
+  input:
+    border: "{shape.border-width} solid {shape.border-color}"
+    radius: "clip-path chamfer-sm"
+    background: "{color.surface}"
+    prefix: "> symbol in {color.primary}, absolute positioned left"
+    focus: "border becomes {color.primary}, neon glow shadow, no outline"
+  badge:
+    shape: "chamfered or sharp-edged, {shape.border-width} border"
+    text: "font-mono text-xs uppercase tracking-[0.2em] {color.primary}"
+    decoration: "neon glow pulse on featured badges"
+  nav:
+    logo: "monospace uppercase, bordered with chamfered clip-path"
+    links: "monospace, hover adds neon underline glow"
+    mobile: "hamburger icon with neon glow ring"
+  layout:
+    archetype: "hud-schematic"
+    max-width: "max-w-7xl"
+    section-spacing: "py-24 to py-32"
+    grid-gap: "gap-6 to gap-10"
+    asymmetry: "60/40 hero splits, skew-y-1 on feature grids, overlapping negative margins"
+    surfaces: "scanlines + circuit grid + noise — always layered, never flat"
+    decoration: "corner-accent brackets on holographic panels, gradient orbs at low opacity"
+
+constraints:
+  never:
+    - "border-radius above 4px — chamfered clip-path or sharp corners only"
+    - "light backgrounds — dark void canvas is mandatory for neon to read"
+    - "soft diffused shadows — all shadows are neon glow (colored, no blur-only)"
+    - "serif or handwritten fonts — monospace and geometric sans only"
+    - "warm color temperatures — palette is cold: cyan, magenta, electric green"
+    - "rounded-full on containers — pill shapes conflict with angular HUD aesthetic"
+    - "static decorative elements — everything should pulse, scan, or flicker"
+    - "flat borders without glow — borders must emit light via stacked box-shadow"
+  always:
+    - "clip-path chamfered corners on cards and buttons"
+    - "scanline overlay (repeating-linear-gradient) on page or major sections"
+    - "neon glow (multi-layer box-shadow) on every interactive element hover"
+    - "monospace font for all UI labels, inputs, and code-style elements"
+    - "uppercase on headings, buttons, labels, and nav links"
+    - "circuit grid or noise texture on at least one section background"
+    - "chromatic aberration text-shadow on hero headlines"
+
+effects:
+  interaction-vocabulary: [neon-ignite, glitch-flicker, chromatic-shift, press-dim, scan-reveal]
+  hover:
+    card: "neon-ignite — border becomes {color.primary}, glow shadow appears, translateY(-1px)"
+    button: "neon-ignite — background fills accent, neon glow radiates, text inverts"
+    link: "chromatic-shift — text-shadow splits to magenta-left cyan-right"
+    badge: "glitch-flicker — brief clip-path skew animation"
+  active:
+    button: "press-dim — filter brightness(0.85), glow dims"
+  focus:
+    input: "neon-ignite — border {color.primary}, glow shadow, no outline ring"
+    general: "ring-2 ring-{color.primary} ring-offset-2 ring-offset-{color.background}"
+  transition: "duration-100 to duration-200, cubic-bezier(0.25, 0.46, 0.45, 0.94) or steps(4) for digital feel"
+  ambient:
+    - "scanline-scroll — horizontal line sweeps down viewport (8s linear infinite)"
+    - "glitch-pulse — hero text skews +-2px randomly (glitch keyframes, 4s)"
+    - "neon-breathe — glow opacity oscillates 0.3-0.6 on accent elements (3s ease-in-out)"
+    - "rgb-shift — chromatic aberration text-shadow alternates offsets (2s)"
+    - "cursor-blink — terminal cursor opacity steps (1s step-end infinite)"
+
 compatibility: [kinetic-typography, bento-grid]
 clashes: [swiss-minimalist, professional, liquid-glass]

package/gsp/skills/gsp-style/styles/enterprise.yml

@@ -58,5 +58,86 @@ dark_mode:
     on-background: "#F1F5F9"
     border-color: "#334155"
 
+intensity:
+  variance: 3     # structured grids, predictable zig-zag layouts, controlled hierarchy
+  motion: 4       # polished hover lifts and shadow transitions, subtle pulse on decorative elements
+  density: 6      # dashboard-dense — tighter base size (14px), compact cards, metric grids
+
+patterns:
+  card:
+    border: "{shape.border-width} solid {shape.border-color}"
+    shadow: "colored — {elevation.shadow-sm} resting, {elevation.shadow-md} on hover (indigo-tinted)"
+    radius: "{shape.border-radius-lg}"
+    background: "{color.surface}"
+    icon-container: "h-12 w-12 {shape.border-radius-lg} bg-{color.primary}/10 text-{color.primary}"
+  button-primary:
+    background: "{gradient.signature}"
+    border: "none"
+    shadow: "0 4px 14px rgba(79,70,229,0.3)"
+    text: "weight 600, sentence case, white"
+    radius: "rounded-full or {shape.border-radius-lg}"
+  button-secondary:
+    background: "{color.surface}"
+    border: "{shape.border-width} solid {shape.border-color}"
+    text: "weight 500, sentence case, slate-700"
+    radius: "rounded-full or {shape.border-radius-lg}"
+    hover: "bg-slate-50, border darkens"
+  input:
+    border: "{shape.border-width} solid {shape.border-color}"
+    radius: "{shape.border-radius-lg}"
+    background: "{color.surface}"
+    focus: "ring-2 ring-{color.primary} ring-offset-1, border-{color.primary}"
+    label: "text-sm font-semibold text-slate-700"
+  badge:
+    shape: "{shape.border-radius-lg} with {color.primary}/10 background"
+    text: "text-xs font-medium text-{color.primary}"
+    glow: "shadow-[0_0_20px_rgba(79,70,229,0.5)] on numbered badges"
+  nav:
+    style: "clean horizontal with blur background"
+    links: "font-medium text-slate-600, hover text-{color.primary}"
+    cta: "gradient pill button"
+  layout:
+    archetype: "enterprise-zig-zag"
+    max-width: "max-w-7xl"
+    section-spacing: "py-16 to py-24"
+    grid-gap: "gap-6 to gap-8"
+    surfaces: "subtle colored blur orbs (400-600px, 20-50% opacity) for atmospheric depth"
+    decoration: "isometric 3D transforms on hero cards, gradient text headlines"
+    emphasis: "center pricing card scaled 105% with ring highlight"
+
+constraints:
+  never:
+    - "harsh geometric patterns or textures — clean, polished surfaces only"
+    - "neutral gray shadows — all shadows must be indigo/violet tinted"
+    - "pure black text — use slate-900 ({color.on-background})"
+    - "small border radii on buttons — pills or rounded-lg minimum"
+    - "flat backgrounds on dark CTA sections — use gradient from-indigo-900 to-indigo-950"
+    - "single-layer shadows — combine ambient + colored for enterprise depth"
+    - "bouncy or playful animations — refined, professional motion only"
+  always:
+    - "colored shadows using indigo/violet tints on every elevated element"
+    - "gradient text (indigo→violet clip) on at least one headline per section"
+    - "isometric 3D transforms on hero visualization (rotate-x, rotate-y)"
+    - "blur orbs in background for atmospheric depth"
+    - "rounded-full on primary CTA buttons"
+    - "icon containers with soft primary-tinted backgrounds"
+
+effects:
+  interaction-vocabulary: [hover-lift, shadow-deepen, iso-tilt, arrow-nudge, glow-reveal]
+  hover:
+    card: "hover-lift — -translate-y-1, shadow-deepen with enhanced indigo tint"
+    button: "hover-lift — -translate-y-0.5, shadow intensifies"
+    link: "color shift to {color.primary} with underline"
+    image: "scale-105 with overflow-hidden clip"
+  active:
+    button: "scale-press — scale-[0.98], shadow reduces"
+  focus:
+    general: "ring-2 ring-{color.primary} ring-offset-2"
+  transition: "duration-200 to duration-300, ease-out"
+  ambient:
+    - "gentle-pulse — decorative floating cards pulse (4s duration)"
+    - "iso-tilt — hero card subtle 3D rotation on load"
+    - "arrow-nudge — directional icons translate-x-1 on group-hover"
+
 compatibility: [professional, saas]
 clashes: [vaporwave, retro, neubrutalism]