:root { --gap: 24px; --content-gap: 20px; --nav-width: 960px; --main-width: 720px; --post-width: 800px; --header-height: 60px; --footer-height: 60px; --radius: 8px; --theme: rgb(255, 255, 255); --entry: rgb(255, 255, 255); --primary: rgb(30, 30, 30); --secondary: rgb(108, 108, 108); --tertiary: rgb(214, 214, 214); --content: rgb(31, 31, 31); --code-bg: rgb(245, 245, 245); --border: rgb(238, 238, 238); --link-color: var(--primary); --link-hover-color: #573eaa; --link-underline-shadow: 0 1px 0 var(--link-color); --link-hover-underline-color: #6549c0; --link-hover-underline-shadow: 0 2px 0 var(--link-hover-underline-color); --link-transition: all 0.3s ease; } .dark { --theme: rgb(29, 30, 32); --entry: rgb(46, 46, 51); --primary: rgb(218, 218, 219); --secondary: rgb(155, 156, 157); --tertiary: rgb(65, 66, 68); --content: rgb(196, 196, 197); --code-bg: rgb(55, 56, 62); --border: rgb(51, 51, 51); --link-color: var(--primary); --link-hover-color: #876fd6; --link-underline-shadow: 0 1px 0 var(--link-color); --link-hover-underline-color: var(--link-hover-color); --link-hover-underline-shadow: 0 2px 0 var(--link-hover-underline-color); } .list { background: var(--code-bg); } .dark.list { background: var(--theme); }