@import"https://fonts.googleapis.com/css2?family=Ubuntu:wght@400;500;700&display=swap";*{margin:0;box-sizing:border-box}:root{--White: hsl(0, 0%, 100%);--pastel-blue: hsl(228, 100%, 84%);--Purplish: hsl(243, 100%, 62%);--Strawberry: hsl(354, 84%, 57%);--color-primary-h: 26;--color-primary-base-s: 100%;--color-primary-l: 55%;--color-neutral-h: 219;--color-neutral-base-s: 9%;--color-neutral-l: 45%;--font-size: 1rem}body{--font-color-secondary: hsl(231, 11%, 63%);--font-color: hsl(213, 96%, 18%);--background-color: white;--background-color-body: hsl(218, 100%, 97%);color:var(--font-color);font-family:Ubuntu,sans-serif;max-width:100vw;background-color:var(--background-color-body);font-size:var(--font-size)}main{display:grid;place-items:center;min-height:100vh;max-width:940px;margin:auto}@media (max-width: 600px){main{place-items:flex-start}}ul{list-style:none}button{cursor:pointer;padding-inline:1rem;padding-block:.4rem;border-radius:.3rem;border:transparent;font-size:1rem;max-height:fit-content}button.plain{color:var(--font-color-secondary)}button[type=submit]{color:#fff;background-color:var(--color-primary)}input[type=text],input[type=email]{padding-block:.7rem;padding-inline:.8rem;font-size:1rem;border:1px solid var(--color-emphasis-300);border-radius:.5rem}input[type=text]::placeholder,input[type=email]::placeholder{color:var(--color-emphasis-400);font-weight:500}input[type=text]:user-invalid,input[type=email]:user-invalid{outline:1px auto var(--color-danger)}input[type=text]:user-valid,input[type=email]:user-valid{outline:1px auto var(--color-success)}input[role=checkbox]{cursor:pointer;width:1.2rem;height:1.2rem;border-radius:.3rem;-webkit-appearance:none;-moz-appearance:none;appearance:none;border:1px solid var(--color-emphasis-300);display:grid;place-content:center}input[role=checkbox]:after{content:"";font-size:1rem;color:var(--font-color-inverse)}input[role=checkbox]:checked{background-color:var(--Purplish)}input[role=checkbox]:checked:after{content:"✔"}input[role=switch]{-webkit-appearance:none;-moz-appearance:none;appearance:none;display:inline-flex;align-items:center;background-color:var(--color-primary);border-radius:1rem;width:3rem;height:1.4rem}input[role=switch]:before{content:"";border-radius:50%;background-color:var(--color-emphasis-100);width:1rem;height:1rem;margin:.2rem;transition:all .3s;left:5%}input[role=switch]:checked:before{background-color:var(--color-emphasis-300);transform:translate(1.5rem)}label{transition:all .2s}label:has(input[type=radio]){outline:1px solid var(--color-emphasis-100);cursor:pointer;border-radius:.5rem}label:has(input[type=radio]) input{opacity:0}label:has(input[type=radio]:checked,input[role=checkbox]:checked){outline:2px solid var(--Purplish)}label:has(input[type=radio]:focus){outline:1px solid var(--Purplish)}label:has(input[type=text],input[type=email]){display:inline-flex;flex-direction:column;gap:.3rem;font-size:.75rem}