:root,
:host {
    /* Font */
    --ft: -apple-system, BlinkMacSystemFont, "Segoe UI", "Noto Sans", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji";
    --ft-mono: ui-monospace, SFMono-Regular, SF Mono, Menlo, Consolas, Liberation Mono, monospace;
    --ft-size: 18px;

    /* Layouts */
    --ly-aside-size-small: 2.5rem;
    --ly-bg-brand: #010409;
    --ly-brand: #e6edf3;
    --ly-header-size: 3.5rem;

    /* Miscellaneous */
    --bd-radius: 3px;
    --ct-width: 1024px;
    --dark-backdrop: #161b2266;
    --dark-bd-muted: #30363db3;
    --light-backdrop: #8c959f33;
    --light-bd-muted: #d0d7deb3;
    --tr-duration: 0.5s;
}

/* @media (prefers-color-scheme: light) { */

:root:not([data-color-scheme="dark"]),
:host:not([data-color-scheme="dark"]),
[data-color-scheme="light"] {
    /* Colors */
    --primary: #668581;
    --secondary: #087E8B;
    --accent: #0969da;
    --active: #8250df;
    --attention: #9a6700;
    --contrast: #e6edf3;
    --danger: #d1242f;
    --default: #1f2328;
    --muted: #656d76;
    --severe: #bc4c00;
    --subtle: #1f2328;
    --success: #1a7f37;
    --variant: #bf3989;

    /* Hover */
    --hover-primary: #425855;
    --hover-secondary: #067a86;
    --hover-accent: #0169c9;
    --hover-active: #9a77d8;
    --hover-attention: #c57800;
    --hover-contrast: #d7dbe4;
    --hover-danger: #f25454;
    --hover-default: #2d333b;
    --hover-muted: #868f98;
    --hover-severe: #e27d00;
    --hover-subtle: #2d333b;
    --hover-success: #1da64f;
    --hover-variant: #e274e8;

    /* Backgrounds */
    --bg-primary: #e6edf3;
    --bg-secondary: #daebff;
    --bg-accent: #ddf4ff;
    --bg-active: #fbefff;
    --bg-attention: #fff8c5;
    --bg-contrast: #d1d6e0;
    --bg-danger: #ffebe9;
    --bg-default: #ffffff;
    --bg-muted: #f6f8fa;
    --bg-severe: #fff1e5;
    --bg-subtle: #d0d7de;
    --bg-success: #dafbe1;
    --bg-variant: #ffeff7;
}

/* } */

/* @media (prefers-color-scheme: dark) { */

:root:not([data-color-scheme="light"]),
:host:not([data-color-scheme="light"]),
[data-color-scheme="dark"] {
    /* Colors */
    --primary: #C4E3DF;
    --secondary: #1bc4d6;
    --accent: #4493f8;
    --active: #a371f7;
    --attention: #d29922;
    --contrast: #1f2328;
    --danger: #f85149;
    --default: #e6edf3;
    --muted: #848d97;
    --severe: #db6d28;
    --subtle: #e6edf3;
    --success: #3fb950;
    --variant: #db61a2;

    /* Hover */
    --hover-primary: #697976;
    --hover-secondary: #11bed1;
    --hover-accent: #3676cb;
    --hover-active: #8e58ca;
    --hover-attention: #b57c1c;
    --hover-contrast: #1a1d20;
    --hover-danger: #ca3b3f;
    --hover-default: #c5d1d9;
    --hover-muted: #6f7d84;
    --hover-severe: #b85722;
    --hover-subtle: #c5d1d9;
    --hover-success: #348045;
    --hover-variant: #b34d8a;

    /* Backgrounds */
    --bg-primary: #0d1117;
    --bg-secondary: #161b22;
    --bg-accent: #121d2f;
    --bg-active: #231f39;
    --bg-attention: #272115;
    --bg-contrast: #6e7681;
    --bg-danger: #25171c;
    --bg-default: #0d1117;
    --bg-muted: #161b22;
    --bg-severe: #221a19;
    --bg-subtle: #30363d;
    --bg-success: #12261e;
    --bg-variant: #221926;
}

/* } */