/* HostPocket Design System v1.0 — approved foundation tokens only. */
:root {
    /* Brand and semantic colors */
    --hp-green-900: #1F3A34;
    --hp-sage-500: #7D988A;
    --hp-sand-100: #EDE6D7;
    --hp-beige-300: #D6C2A1;
    --hp-terra-500: #E07A47;
    --hp-blue-400: #88A6B5;
    --hp-red-500: #E74C3C;
    --hp-white: #FFFFFF;
    --hp-bg: #F8F7F3;
    --hp-text: #24312D;
    --hp-muted: #66736F;
    --hp-border: #E5E8E5;
    --hp-success: #4F7D62;
    --hp-warning: #C9953D;

    /* Reusable surfaces */
    --hp-surface: var(--hp-white);
    --hp-surface-subtle: var(--hp-bg);
    --hp-text-secondary: var(--hp-muted);
    --hp-overlay: rgb(31 58 52 / 48%);

    /* Status presentation; business values remain unchanged. */
    --hp-status-neutral-bg: var(--hp-bg);
    --hp-status-neutral-text: var(--hp-muted);
    --hp-status-attention-bg: #F9E6DC;
    --hp-status-attention-text: #934825;
    --hp-status-planned-bg: #F7ECD5;
    --hp-status-planned-text: #7B5A20;
    --hp-status-warning-bg: var(--hp-status-planned-bg);
    --hp-status-warning-text: var(--hp-status-planned-text);
    --hp-status-active-bg: #E3EDF4;
    --hp-status-active-text: #315C75;
    --hp-status-done-bg: #E5EFE8;
    --hp-status-done-text: #315B42;
    --hp-status-error-bg: #FBE2E0;
    --hp-status-error-text: #A33730;

    /* Deterministic Planning palette; Cleaner identity is never stored as color data. */
    --hp-cleaner-1-bg: #DDEAE4;
    --hp-cleaner-1-text: #214B38;
    --hp-cleaner-2-bg: #DFEAF0;
    --hp-cleaner-2-text: #294F63;
    --hp-cleaner-3-bg: #E9E2F2;
    --hp-cleaner-3-text: #5A3D72;
    --hp-cleaner-4-bg: #F5E8CC;
    --hp-cleaner-4-text: #6D501A;
    --hp-cleaner-5-bg: #F6E1D5;
    --hp-cleaner-5-text: #7A3E24;
    --hp-cleaner-6-bg: #DCEDEB;
    --hp-cleaner-6-text: #245C56;
    --hp-cleaner-7-bg: #E2E5F4;
    --hp-cleaner-7-text: #394774;
    --hp-cleaner-8-bg: #F3E1E8;
    --hp-cleaner-8-text: #703B50;

    /* Spacing */
    --hp-space-1: 4px;
    --hp-space-2: 8px;
    --hp-space-3: 12px;
    --hp-space-4: 16px;
    --hp-space-5: 20px;
    --hp-space-6: 24px;
    --hp-space-8: 32px;

    /* Shape and depth */
    --hp-radius-s: 8px;
    --hp-radius-m: 12px;
    --hp-radius-l: 16px;
    --hp-shadow-1: 0 2px 8px rgb(31 58 52 / 6%);

    /* Typography */
    --hp-font-ui: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    --hp-font-display: "Playfair Display", Georgia, serif;

    /* Layout and interaction */
    --hp-sidebar-width: 256px;
    --hp-content-max-width: 1440px;
    --hp-control-height: 42px;
    --hp-touch-target: 44px;
    --hp-transition-fast: 160ms ease;
    --hp-z-dropdown: 100;
    --hp-z-sticky: 200;
    --hp-z-backdrop: 900;
    --hp-z-modal: 1000;
    --hp-z-media-viewer: 11000;
}
