/* Sabotage — Web design tokens. Generated from spec/palette.json. * Light is the default; set data-theme="dark" on (or :root) to flip. */ :root { --sb-bg: #fbfbfd; --sb-bg-alt: #f1f2f6; --sb-bg-hl: #e7e8ee; --sb-fg: #1a1c24; --sb-fg-dim: #5a5b63; --sb-comment: #9395a0; --sb-selection: #cfe0f5; --sb-cursor: #dd5040; --sb-border: #dddee6; --sb-accent: #dd5040; --sb-ansi-black: #1a1c24; --sb-ansi-red: #d32f2f; --sb-ansi-green: #1a9e5a; --sb-ansi-yellow: #b7791f; --sb-ansi-blue: #2563c9; --sb-ansi-magenta: #7c3aed; --sb-ansi-cyan: #0e7490; --sb-ansi-white: #c8cad2; --sb-ansi-bright-black: #5a5b63; --sb-ansi-bright-red: #e14b4b; --sb-ansi-bright-green: #1fb368; --sb-ansi-bright-yellow: #cc8f1e; --sb-ansi-bright-blue: #3b77e0; --sb-ansi-bright-magenta: #8b5cf6; --sb-ansi-bright-cyan: #1395b8; --sb-ansi-bright-white: #fbfbfd; --sb-syntax-keyword: #c8432f; --sb-syntax-string: #1a9e5a; --sb-syntax-number: #c2410c; --sb-syntax-function: #0e7490; --sb-syntax-variable: #1a1c24; --sb-syntax-type: #b7791f; --sb-syntax-constant: #c2410c; --sb-syntax-comment: #9395a0; --sb-syntax-operator: #c026a0; --sb-syntax-punctuation: #5a5b63; --sb-syntax-tag: #c8432f; --sb-syntax-attribute: #b7791f; --sb-syntax-property: #0e7490; --sb-syntax-class: #b7791f; --sb-syntax-regex: #c026a0; --sb-syntax-escape: #c2410c; --sb-syntax-invalid: #d32f2f; --sb-orange: #c2410c; --sb-pink: #c026a0; --sb-purple: #7c3aed; --sb-error: #d32f2f; --sb-warning: #b7791f; --sb-info: #0e7490; --sb-success: #1a9e5a; --sb-on-accent: #ffffff; } [data-theme="dark"] { --sb-bg: #0d0e11; --sb-bg-alt: #1a1c24; --sb-bg-hl: #22242e; --sb-fg: #e8e8ea; --sb-fg-dim: #a8a9b0; --sb-comment: #5a5b63; --sb-selection: #2a3a52; --sb-cursor: #dd5040; --sb-border: #2a2c36; --sb-accent: #dd5040; --sb-ansi-black: #1a1c24; --sb-ansi-red: #ff5555; --sb-ansi-green: #2ecc71; --sb-ansi-yellow: #ffd166; --sb-ansi-blue: #5b8def; --sb-ansi-magenta: #8b5cf6; --sb-ansi-cyan: #4dd9ff; --sb-ansi-white: #e8e8ea; --sb-ansi-bright-black: #5a5b63; --sb-ansi-bright-red: #ff6e6e; --sb-ansi-bright-green: #54e08c; --sb-ansi-bright-yellow: #ffdd8a; --sb-ansi-bright-blue: #7faaf5; --sb-ansi-bright-magenta: #a78bfa; --sb-ansi-bright-cyan: #7ae4ff; --sb-ansi-bright-white: #ffffff; --sb-syntax-keyword: #dd5040; --sb-syntax-string: #2ecc71; --sb-syntax-number: #ff8a44; --sb-syntax-function: #4dd9ff; --sb-syntax-variable: #e8e8ea; --sb-syntax-type: #ffd166; --sb-syntax-constant: #ff8a44; --sb-syntax-comment: #5a5b63; --sb-syntax-operator: #ff69b4; --sb-syntax-punctuation: #a8a9b0; --sb-syntax-tag: #dd5040; --sb-syntax-attribute: #ffd166; --sb-syntax-property: #4dd9ff; --sb-syntax-class: #ffd166; --sb-syntax-regex: #ff69b4; --sb-syntax-escape: #ff8a44; --sb-syntax-invalid: #ff5555; --sb-orange: #ff8a44; --sb-pink: #ff69b4; --sb-purple: #8b5cf6; --sb-error: #ff5555; --sb-warning: #ffd166; --sb-info: #4dd9ff; --sb-success: #2ecc71; --sb-on-accent: #ffffff; } @media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) { --sb-bg: #0d0e11; --sb-bg-alt: #1a1c24; --sb-bg-hl: #22242e; --sb-fg: #e8e8ea; --sb-fg-dim: #a8a9b0; --sb-comment: #5a5b63; --sb-selection: #2a3a52; --sb-cursor: #dd5040; --sb-border: #2a2c36; --sb-accent: #dd5040; --sb-ansi-black: #1a1c24; --sb-ansi-red: #ff5555; --sb-ansi-green: #2ecc71; --sb-ansi-yellow: #ffd166; --sb-ansi-blue: #5b8def; --sb-ansi-magenta: #8b5cf6; --sb-ansi-cyan: #4dd9ff; --sb-ansi-white: #e8e8ea; --sb-ansi-bright-black: #5a5b63; --sb-ansi-bright-red: #ff6e6e; --sb-ansi-bright-green: #54e08c; --sb-ansi-bright-yellow: #ffdd8a; --sb-ansi-bright-blue: #7faaf5; --sb-ansi-bright-magenta: #a78bfa; --sb-ansi-bright-cyan: #7ae4ff; --sb-ansi-bright-white: #ffffff; --sb-syntax-keyword: #dd5040; --sb-syntax-string: #2ecc71; --sb-syntax-number: #ff8a44; --sb-syntax-function: #4dd9ff; --sb-syntax-variable: #e8e8ea; --sb-syntax-type: #ffd166; --sb-syntax-constant: #ff8a44; --sb-syntax-comment: #5a5b63; --sb-syntax-operator: #ff69b4; --sb-syntax-punctuation: #a8a9b0; --sb-syntax-tag: #dd5040; --sb-syntax-attribute: #ffd166; --sb-syntax-property: #4dd9ff; --sb-syntax-class: #ffd166; --sb-syntax-regex: #ff69b4; --sb-syntax-escape: #ff8a44; --sb-syntax-invalid: #ff5555; --sb-orange: #ff8a44; --sb-pink: #ff69b4; --sb-purple: #8b5cf6; --sb-error: #ff5555; --sb-warning: #ffd166; --sb-info: #4dd9ff; --sb-success: #2ecc71; } }