waddling-errors 0.7.3

Structured, secure-by-default diagnostic codes for distributed systems with no_std and role-based documentation
Documentation
/* ============================================
   CSS CUSTOM PROPERTIES (VARIABLES)
   WDP Part 10 Severity Colors + Theme Support
   Dark theme based on waddling-error-docs-v3
   ============================================ */

:root {
    /* === Background Colors (Dark Theme - Default) === */
    --bg-deep: #08080c;
    --bg-surface: #0e0e14;
    --bg-card: #14141c;
    --bg-elevated: #1a1a24;
    --bg-hover: #22222e;
    
    /* Mapped aliases for compatibility */
    --bg-primary: var(--bg-deep);
    --bg-secondary: var(--bg-surface);
    --bg-tertiary: var(--bg-elevated);
    --bg-input: var(--bg-card);
    
    /* === Accent Colors === */
    --accent: #f59e0b;
    --accent-dim: #d97706;
    --accent-bright: #fbbf24;
    --accent-primary: var(--accent);
    --accent-secondary: #8b5cf6;
    --accent-success: #22c55e;
    --accent-warning: #f59e0b;
    --accent-danger: #ef4444;
    
    /* === Text Colors === */
    --text-primary: #fafafa;
    --text-secondary: #a1a1aa;
    --text-muted: #71717a;
    --text-dim: #52525b;
    --text-accent: var(--accent);
    
    /* === WDP Part 10 Severity Colors (Dark Mode - Radix Colors Dark Scale) === */
    --sev-error: #ff9592;      /* red-11 (dark) */
    --sev-blocked: #ec5d5e;    /* red-10 (dark) */
    --sev-critical: #ffa057;   /* orange-11 (dark) */
    --sev-warning: #ffca16;    /* amber-11 (dark) */
    --sev-help: #3dd68c;       /* green-11 (dark) */
    --sev-success: #33b074;    /* green-10 (dark) */
    --sev-completed: #0bd8b6;  /* teal-11 (dark) */
    --sev-info: #70b8ff;       /* blue-11 (dark) */
    --sev-trace: #b0b4ba;      /* slate-11 (dark) */
    
    /* Legacy severity aliases */
    --severity-critical: var(--sev-critical);
    --severity-error: var(--sev-error);
    --severity-warning: var(--sev-warning);
    --severity-info: var(--sev-info);
    --severity-debug: #7c3aed;
    --severity-trace: var(--sev-trace);
    --severity-blocked: var(--sev-blocked);
    --severity-success: var(--sev-success);
    --severity-completed: var(--sev-completed);
    --severity-help: var(--sev-help);
    
    /* === Severity Backgrounds === */
    --severity-critical-bg: rgba(249, 115, 22, 0.15);
    --severity-error-bg: rgba(239, 68, 68, 0.15);
    --severity-warning-bg: rgba(245, 158, 11, 0.15);
    --severity-info-bg: rgba(59, 130, 246, 0.15);
    --severity-debug-bg: rgba(124, 58, 237, 0.15);
    --severity-trace-bg: rgba(100, 116, 139, 0.15);
    
    /* === Code Part Colors === */
    --part-severity: #fca5a5;
    --part-component: #93c5fd;
    --part-primary: #c4b5fd;
    --part-sequence: #86efac;
    --part-hash: #fbbf24;
    
    /* === Border Colors === */
    --border: #27272a;
    --border-light: #3f3f46;
    --border-color: var(--border);
    
    /* === Visibility Role Colors === */
    --role-internal: #fca5a5;
    --role-developer: #93c5fd;
    --role-public: #86efac;
    --role-internal-bg: rgba(239, 68, 68, 0.15);
    --role-developer-bg: rgba(59, 130, 246, 0.15);
    --role-public-bg: rgba(34, 197, 94, 0.15);
    
    /* === Code Block Colors === */
    --code-bg: var(--bg-deep);
    --code-text: #fafafa;
    --code-keyword: #c4b5fd;
    --code-string: #86efac;
    --code-number: #fbbf24;
    --code-function: #93c5fd;
    --code-comment: #71717a;
    --code-operator: #06b6d4;
    
    /* === Fonts === */
    --font-sans: 'Plus Jakarta Sans', 'Segoe UI', system-ui, sans-serif;
    --font-mono: 'JetBrains Mono', 'Fira Code', 'Consolas', monospace;
    
    /* === UI Element Sizes === */
    --header-height: 56px;
    --sidebar-width: 380px;
    --border-radius-sm: 4px;
    --border-radius-md: 8px;
    --border-radius-lg: 12px;
    --border-radius-full: 9999px;
    
    /* === Shadows === */
    --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.3);
    --shadow-md: 0 4px 6px rgba(0, 0, 0, 0.4);
    --shadow-lg: 0 8px 32px rgba(0, 0, 0, 0.4);
    
    /* === Transitions === */
    --transition-fast: 150ms ease;
    --transition-normal: 200ms ease;
    --transition-slow: 300ms ease;
    
    /* === Z-Index Layers === */
    --z-dropdown: 60;
    --z-sidebar: 90;
    --z-header: 100;
    --z-modal: 300;
    --z-toast: 1000;
}

/* === Light Theme Overrides === */
[data-theme="light"] {
    --bg-deep: #ffffff;
    --bg-surface: #f8fafc;
    --bg-card: #ffffff;
    --bg-elevated: #f1f5f9;
    --bg-hover: #e2e8f0;
    
    --text-primary: #0f172a;
    --text-secondary: #475569;
    --text-muted: #64748b;
    --text-dim: #94a3b8;
    
    --border: #e2e8f0;
    --border-light: #cbd5e1;
    
    --accent: #d97706;
    --accent-dim: #b45309;
    --accent-bright: #f59e0b;
    
    --code-bg: #f1f5f9;
    --code-text: #0f172a;
    
    --part-severity: #dc2626;
    --part-component: #2563eb;
    --part-primary: #7c3aed;
    --part-sequence: #16a34a;
    --part-hash: #d97706;
    
    /* === WDP Part 10 Severity Colors (Light Mode - Radix Colors) === */
    --sev-error: #ce2c31;      /* red-11 */
    --sev-blocked: #dc3e42;    /* red-10 */
    --sev-critical: #cc4e00;   /* orange-11 */
    --sev-warning: #ab6400;    /* amber-11 */
    --sev-help: #218358;       /* green-11 */
    --sev-success: #30a46c;    /* green-9 */
    --sev-completed: #008573;  /* teal-11 */
    --sev-info: #0d74ce;       /* blue-11 */
    --sev-trace: #60646c;      /* slate-11 */
    
    --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.05);
    --shadow-md: 0 4px 6px rgba(0, 0, 0, 0.1);
    --shadow-lg: 0 8px 32px rgba(0, 0, 0, 0.15);
}