slurpyb/slurpyb-wip-skills

Create modern, intrinsic, accessible web elements using BONES semantic markup patterns fused with Every Layout custom elements. Use when building UI components, accessible widgets, responsive layouts, or web elements that must be framework-agnostic. Activates on bones, every-layout, intrinsic layout, accessible widget, semantic HTML, BEM, ARIA, stack-l, sidebar-l, cluster-l, box-l, cover-l, switcher-l, grid-l, frame-l, reel-l, icon-l, imposter-l, container-l. NOT for framework-specific components (React/Vue/Angular-only), CSS-only layouts without semantic structure, or purely visual styling tasks.

CUBE CSS (Composition, Utility, Block, Exception) methodology — a pragmatic CSS architecture that works with the browser's cascade and inheritance. Use when designing CSS architecture, writing modern layout primitives, deciding utility vs. block placement, or migrating from BEM or utility-first systems like Tailwind.

Modern CSS architecture — CUBE CSS methodology (Composition, Utility, Block, Exception) layered with Every Layout primitives (Stack, Cluster, Sidebar, Switcher, Cover, Grid, Frame, Reel, Imposter). Cascade-first, algorithmic, intrinsic. Uses logical properties and relative units (rem/em/ch/clamp/minmax). Use for any CSS architecture, responsive layout, or migration away from utility-only or BEM-only approaches.

Build accessible design systems with Radix UI primitives. Headless component customization, theming strategies, and compound component patterns for production-grade UI libraries.