:root { --primary-dark-10: #e54485; --primary: #f65596; --primary-light-10: #f075a6; --primary-light-20: #f2a6c4; --primary-light-30: #f7c9dc; --grey-dark-50: #111; --grey-dark-40: #222; --grey-dark-30: #444; --grey-dark-20: #666; --grey-dark-10: #888; --grey: #aaa; --grey-light-10: #bbb; --grey-light-20: #ccc; --grey-light-30: #ddd; --grey-light-40: #eee; --grey-light-50: #fafafa; --grey-light-60: #fcfcfc; --background-dark-20: #eee; --background-dark-10: #f8f8f8; --background: #fff; --background-base: #fff; --background-base-10: #fafafa; --background-base-20: #f0f0f0; --background-level-10: #fff; --background-level-20: #eee; --background-level-30: #eee; --background-dim: var(--shadow-weak-10); --background-error: rgba(255, 0, 0, .1); --shadow-weak-50: rgba(0, 0, 0, .02); --shadow-weak-40: rgba(0, 0, 0, .05); --shadow-weak-30: rgba(0, 0, 0, .1); --shadow-weak-20: rgba(0, 0, 0, .2); --shadow-weak-10: rgba(0, 0, 0, .35); --shadow: rgba(0, 0, 0, .5); --shadow-strong-10: rgba(0, 0, 0, .6); --shadow-strong-20: rgba(0, 0, 0, .75); --shadow-strong-30: rgba(0, 0, 0, .9); --highlight-weak-40: rgba(255, 255, 255, .05); --highlight-weak-30: rgba(255, 255, 255, .1); --highlight-weak-20: rgba(255, 255, 255, .2); --highlight-weak-10: rgba(255, 255, 255, .35); --highlight: rgba(255, 255, 255, .5); --highlight-strong-10: rgba(255, 255, 255, .6); --highlight-strong-20: rgba(255, 255, 255, .75); --highlight-strong-30: rgba(255, 255, 255, .9); --glass-weak-50: rgba(0, 0, 0, .02); --glass-weak-40: rgba(0, 0, 0, .05); --glass-weak-30: rgba(0, 0, 0, .1); --glass-weak-20: rgba(0, 0, 0, .2); --glass-weak-10: rgba(0, 0, 0, .35); --glass: rgba(0, 0, 0, .5); --glass-strong-10: rgba(0, 0, 0, .6); --glass-strong-20: rgba(0, 0, 0, .75); --glass-strong-30: rgba(0, 0, 0, .9); --text: #222; --text-light: #fff; --link: #48f; --male: #0af; --female: #f0a; --enabled: #5c2; --enabled-background: rgba(0, 255, 0, .1); --disabled: #c20; --disabled-background: rgba(255, 0, 0, .1); --disabled-handle: var(--grey-light-10); --error: #f66; --alert: #f00; --warn: #e80; --success: #5c2; --notice: #25c; --gold: #d5b522; } .dark { --background-dark-20: #000; --background-dark-10: #111; --background: #222; --background-base: #252525; --background-base-10: #1a1a1a; --background-base-20: #050505; --background-level-10: #fff; --background-level-20: #eee; --background-level-30: #eee; --background-dim: var(--shadow-weak-10); --text: #fcfcfc; --glass-weak-50: rgba(255, 255, 255, .02); --glass-weak-40: rgba(255, 255, 255, .05); --glass-weak-30: rgba(255, 255, 255, .1); --glass-weak-20: rgba(255, 255, 255, .2); --glass-weak-10: rgba(255, 255, 255, .35); --glass: rgba(255, 255, 255, .5); --glass-strong-10: rgba(255, 255, 255, .6); --glass-strong-20: rgba(255, 255, 255, .75); --glass-strong-30: rgba(255, 255, 255, .9); --grey-dark-50: #101010; --grey-dark-40: #1f1f1f; --grey-dark-30: #3c3c3c; --grey-dark-20: #606060; --grey-dark-10: #808080; --grey: #aaa; --grey-light-10: #bbb; --grey-light-20: #ccc; --grey-light-30: #ddd; --grey-light-40: #eee; --grey-light-50: #fafafa; --grey-light-60: #fcfcfc; }