:root{--color-bg:#361547;--color-bg-code:#18032b;--color-bg-code-end:#000}body{letter-spacing:initial;font-weight:400}header{padding:1rem}.palette-logo{display:block;width:100%;max-width:800px;margin:0 auto}header p{letter-spacing:normal;text-align:center;font-size:1.125rem;font-style:italic}main{width:100%;max-width:900px;margin:0 auto}.main-buttons{display:flex;flex-direction:column;justify-content:center;align-items: center;gap:2rem;font-size:1.5rem}@media (min-width:500px){.main-buttons{flex-direction:row}}.ink-button{border-radius:1rem;padding:1rem}.snippet-wrapper{overflow-x:auto;padding:var(--space-3);background-color:var(--color-bg-code);background-image:linear-gradient(135deg,var(--color-bg-code),var(--color-bg-code-end));border:var(--border);margin-top:var(--space-3);max-width:100%;font-size:.875rem}h2{letter-spacing:1px;text-align:center;margin-bottom:var(--space-3)}.snippet{margin:0;padding:0}code{display:inline}.code-keyword{color:#87ceeb}.code-comment{color:gray}.code-string{color:salmon}.code-title{color:pink}.code-attr{color:#deb887}.code-variable{color:violet}.code-property,.code-tag,.code-selector{color:#7fffd4}.code-cssprop{color:salmon}