:root,
[data-theme="teal"] {
    --brand: #1a6b73;
    --brand-text: #1a6b73;
    --brand-deep: #124e55;
    --on-brand: #fff;
    --hero: #12343a;
    --brand-ink-rgb: 14, 42, 48;
    --brand-deep-rgb: 18, 78, 85;
    --brand-mist: #d5efec;
    --brand-line: #b7d0cc;
    --grad-a: #0c3a40;
    --grad-b: #1a6b73;
    --grad-c: #248891;
    --ink: #1b2a30;
    --muted: #5e7278;
    --cream: #f3f7f6;
    --line: #d5e2df;
}

[data-theme="sky"] {
    --brand: #7ec8ea;
    --brand-text: #14668f;
    --brand-deep: #b7e4f6;
    --on-brand: #0e3c56;
    --hero: #16344a;
    --brand-ink-rgb: 14, 42, 58;
    --brand-deep-rgb: 14, 60, 86;
    --brand-mist: #e7f6fc;
    --brand-line: #b7dff0;
    --grad-a: #62b6e0;
    --grad-b: #8fd0ee;
    --grad-c: #e5f5fc;
    --ink: #163044;
    --muted: #4e6d80;
    --cream: #f4fafd;
    --line: #d5e8f2;
}