:root { --c-primary: hsl(184, 100%, 50%); --c-accent: hsl(157, 100%, 50%); --c-bg: hsl(180, 20%, 97%); --c-surface: hsl(0, 0%, 100%); --c-surface-hover: hsl(220, 20%, 95%); --c-text: hsl(220, 15%, 15%); --c-text-muted: hsl(220, 10%, 75%); --c-border: hsl(220, 15%, 88%); --c-success: hsl(145, 65%, 42%); --c-error: hsl(0, 75%, 55%);}.bg-c-primary { background-color: var(--c-primary); }.text-c-primary { color: var(--c-primary); }.border-c-primary { border-color: var(--c-primary); }.bg-c-accent { background-color: var(--c-accent); }.text-c-accent { color: var(--c-accent); }.border-c-accent { border-color: var(--c-accent); }.bg-c-bg { background-color: var(--c-bg); }.text-c-bg { color: var(--c-bg); }.border-c-bg { border-color: var(--c-bg); }.bg-c-surface { background-color: var(--c-surface); }.text-c-surface { color: var(--c-surface); }.border-c-surface { border-color: var(--c-surface); }.bg-c-surface-hover { background-color: var(--c-surface-hover); }.text-c-surface-hover { color: var(--c-surface-hover); }.border-c-surface-hover { border-color: var(--c-surface-hover); }.bg-c-text { background-color: var(--c-text); }.text-c-text { color: var(--c-text); }.border-c-text { border-color: var(--c-text); }.bg-c-text-muted { background-color: var(--c-text-muted); }.text-c-text-muted { color: var(--c-text-muted); }.border-c-text-muted { border-color: var(--c-text-muted); }.bg-c-border { background-color: var(--c-border); }.text-c-border { color: var(--c-border); }.border-c-border { border-color: var(--c-border); }.bg-c-success { background-color: var(--c-success); }.text-c-success { color: var(--c-success); }.border-c-success { border-color: var(--c-success); }.bg-c-error { background-color: var(--c-error); }.text-c-error { color: var(--c-error); }.border-c-error { border-color: var(--c-error); }