:root{--hue: 90;--hueComplement: calc(var(--hue) + 180);--hueRightAnalogous: calc(var(--hue) + 30);--hueLeftAnalogous: calc(var(--hue) - 30);--pure: hsl(var(--hue) 100% 50%);--primary: hsl(var(--hue) 25% 95%);--primaryDark500: hsl(var(--hue) 20% 85%);--primaryDark600: hsl(var(--hue) 20% 75%);--secondary: hsl(var(--hueComplement) 5% 25%);--secondaryLight500: hsl(var(--hueComplement) 5% 30%);--secondaryLight900: hsl(var(--hueComplement) 5% 95%);--secondaryDark500: hsl(var(--hueComplement) 5% 20%);--accentV1: hsl(var(--hueRightAnalogous) 40% 40%);--accentV1Light900: hsl(var(--hueRightAnalogous) 40% 90%);--accentV2: hsl(var(--hueLeftAnalogous) 40% 40%);--accentV2Light900: hsl(var(--hueLeftAnalogous) 40% 90%)}body{font:1em/160% Inter,sans-serif;background-color:var(--primary);color:var(--secondary)}a{color:var(--accentV1)}a:focus,a:hover,a:active{color:var(--accentV2)}p:not(:last-child){margin-bottom:1.5em}h1,h2,h3,h4{line-height:120%;margin-top:1.5em;margin-bottom:1.5rem;font-weight:bold;font-family:Nunito,sans-serif;color:var(--secondaryDark500)}h1{font-size:160%}h2{font-size:140%}h3{font-size:120%}.container{margin-right:auto;margin-left:auto;max-width:600px;padding:2em}.cp-grid{display:grid;grid-template-columns:1fr 3fr;gap:2em}.cp-grid-col-full{grid-column:1/3}.cp-grid-label{font-size:.75em;font-family:Nunito,sans-serif;letter-spacing:1px;text-transform:uppercase;color:var(--secondaryLight500)}.cp-widget:not(:last-child){padding-bottom:2em;border-bottom:1px solid var(--primaryDark500)}.cp-box{padding:1.5em;background-color:var(--primaryDark500);border:1px solid var(--primaryDark600);border-radius:.25em}.cp-box.cp-box--dark{background-color:var(--secondaryLight500);color:var(--secondaryLight900);border:1px solid var(--secondary)}.cp-btn{padding:1em 1.5em;display:inline-flex;margin:1em 0;background-color:var(--accentV1);color:var(--accentV1Light900);border-radius:.25em;text-decoration:none}.cp-btn:hover,.cp-btn:focus,.cp-btn:active{background-color:var(--accentV2);color:var(--accentV2Light900)}#swatches{padding:.25em;border:1px solid var(--primaryDark500);border-radius:.25em;display:grid;grid-template-columns:repeat(auto-fit, minmax(30px, 1fr))}#swatches div{height:30px}#swatches div:nth-child(1n){background-color:var(--primary)}#swatches div:nth-child(2n){background-color:var(--primaryDark500)}#swatches div:nth-child(3n){background-color:var(--primaryDark600)}#swatches div:nth-child(4n){background-color:var(--secondary)}#swatches div:nth-child(5n){background-color:var(--secondaryLight500)}#swatches div:nth-child(6n){background-color:var(--secondaryLight900)}#swatches div:nth-child(7n){background-color:var(--secondaryDark500)}#swatches div:nth-child(8n){background-color:var(--accentV1)}#swatches div:nth-child(9n){background-color:var(--accentV1Light900)}#swatches div:nth-child(10n){background-color:var(--accentV2)}#swatches div:nth-child(11n){background-color:var(--accentV2Light900)}.pure{background-color:var(--pure);color:var(--primary);border:1px solid var(--accentV1);padding:0 1em}.primary{background-color:var(--primary);color:var(--secondary);border:1px solid var(--primaryDark500);padding:0 1em}.primaryDark500{background-color:var(--primaryDark500);color:var(--secondary);border:1px solid var(--primaryDark600);padding:0 1em}.primaryDark600{background-color:var(--primaryDark600);color:var(--secondary);border:1px solid var(--secondaryLight500);padding:0 1em}.secondary{background-color:var(--secondary);color:var(--primary);padding:0 1em}.secondaryLight500{background-color:var(--secondaryLight500);color:var(--primary);padding:0 1em}.secondaryLight900{background-color:var(--secondaryLight900);color:var(--secondary);border:1px solid var(--primaryDark500);padding:0 1em}.secondaryDark500{background-color:var(--secondaryDark500);color:var(--primary);padding:0 1em}.accentV1{background-color:var(--accentV1);color:var(--primary);padding:0 1em}.accentV1Light900{background-color:var(--accentV1Light900);color:var(--secondary);border:1px solid var(--accentV1);padding:0 1em}.accentV2{background-color:var(--accentV2);color:var(--primary);padding:0 1em}.accentV2Light900{background-color:var(--accentV2Light900);color:var(--secondary);border:1px solid var(--accentV2);padding:0 1em}/*# sourceMappingURL=variables.css.map */