:root{--color-white: hsl(0, 100%, 100%);--color-black: hsl(0, 0%, 0%);--color-grey-50: hsl(220, 38%, 97%);--color-grey-500: hsl(219, 13%, 44%);--color-blue-50: hsl(225, 100%, 96%);--color-blue-100: hsl(220, 50%, 95%);--color-blue-300: hsl(216, 47%, 78%);--color-blue-500: hsl(223, 100%, 59%);--color-blue-850: hsl(215, 27%, 32%);--color-blue-900: hsl(216, 25%, 25%);--color-blue-950: hsl(214, 24%, 23%);--color-green-100: hsl(151, 88%, 94%);--color-green-500: hsl(151, 68%, 52%);--color-purple-100: hsl(278, 100%, 95%);--color-purple-600: hsl(277, 91%, 56%);--color-orange-50: hsl(27, 100%, 96%);--color-orange-400: hsl(22, 100%, 60%);--color-red-500: hsl(0, 82%, 63%);--base-bg-mobile-image: url(../assets/images/pattern-background-mobile-light.svg);--base-bg-tablet-image: url(../assets/images/pattern-background-tablet-light.svg);--base-bg-desktop-image: url(../assets/images/pattern-background-desktop-light.svg);--base-primary-bg-color: var(--color-grey-50);--base-secondary-bg-color: var(--color-white);--svg-color: var(--color-grey-500);--theme-input-focus: var(--color-blue-500);--box-shadow-color: hsla(220, 29%, 66%, 14%);--text-color-primary: var(--color-blue-900);--text-color-secondary: var(--color-grey-500)}.darkmode{--base-bg-mobile-image: url(../assets/images/pattern-background-mobile-dark.svg);--base-bg-tablet-image: url(../assets/images/pattern-background-tablet-dark.svg);--base-bg-desktop-image: url(../assets/images/pattern-background-desktop-dark.svg);--base-primary-bg-color: var(--color-blue-900);--base-secondary-bg-color: var(--color-blue-850);--svg-color: var(--color-white);--theme-input-focus: var(--color-blue-100);--box-shadow-color: hsla(216, 25%, 25%, 14%);--text-color-primary: var(--color-white);--text-color-secondary: var(--color-blue-300)}header{display:flex;align-items:center;width:100%;padding:1rem 0}@media(min-width: 37.5em){header{max-width:40rem}}@media(min-width: 68.75em){header{padding:3.125rem 0;max-width:68.75rem}}header .header__title{display:flex;align-items:center;gap:1rem}header .header__title h1{color:var(--text-color-primary);font-family:"Rubik",sans-serif;font-size:1.125rem;font-size:clamp(1.125rem,.1875rem + 2.5vw,1.7rem);font-weight:500;line-height:100%;letter-spacing:0}header .header__theme{display:flex;align-items:center;min-height:3.5rem;gap:0.5rem;margin-left:auto}header .header__theme svg{width:clamp(1rem,.25rem + 2vw,1.5rem);height:clamp(1rem,.25rem + 2vw,1.5rem);fill:var(--svg-color)}header .header__theme input{-webkit-appearance:none;-moz-appearance:none;appearance:none;outline:none;position:relative;width:clamp(2rem,.5rem + 4vw,3rem);height:clamp(1.25rem,.5rem + 2vw,1.75rem);border-radius:1.25rem;background-color:var(--color-purple-600);cursor:pointer}header .header__theme input::after{content:"";position:absolute;top:50%;left:35%;width:clamp(.875rem,.125rem + 2vw,1.375rem);height:clamp(.875rem,.125rem + 2vw,1.375rem);border-radius:50%;background-color:var(--color-white);translate:-50% -50%;transition:left .3s}header .header__theme input:checked::after{left:65%}header .header__theme input:focus{border:2px solid var(--theme-input-focus)}.question__view--title{display:flex;flex-direction:column;gap:1.5rem}@media(min-width: 37.5em){.question__view--title{gap:2.5rem}}@media(min-width: 68.75em){.question__view--title{gap:10.25rem}}.question__view--title h2{color:var(--text-color-primary);font-family:"Rubik",sans-serif;font-size:1.25rem;font-size:clamp(1.25rem,-0.25rem + 4vw,2.25rem);font-weight:500;line-height:120%;letter-spacing:0}.question__view--title h2 span{display:block;color:var(--text-color-secondary);margin-bottom:1rem;font-family:"Rubik",sans-serif;font-size:.875rem;font-size:clamp(.875rem,-0.0625rem + 2.5vw,1.5rem);line-height:150%;letter-spacing:0}.question__view--title-progress-container{height:1rem;width:100%;background-color:var(--base-secondary-bg-color);border-radius:1.5625rem;padding:0.25rem}.question__view--title-progress-bar{height:0.5rem;width:0;background-color:var(--color-purple-600);border-radius:1.5625rem}.question__view--content{display:flex;flex-direction:column;gap:1rem}@media(min-width: 37.5em){.question__view--content{padding-bottom:2.5rem;gap:2rem}}.question__view--content-answers{display:flex;flex-direction:column;gap:1rem}.question__view--content-answers img{margin-left:auto}.question__view--content-answers .answer__letter{color:var(--color-grey-500);background-color:var(--color-grey-50);font-family:"Rubik",sans-serif;font-size:1.125rem;font-size:clamp(1.125rem,.1875rem + 2.5vw,1.7rem);font-weight:500;line-height:100%;letter-spacing:0}.question__view--content-answers .selected{border:0.1875rem solid var(--color-purple-600)}.question__view--content-answers .selected .answer__letter{color:var(--color-white);background-color:var(--color-purple-600)}.question__view--content-answers .correct{border:0.1875rem solid var(--color-green-500)}.question__view--content-answers .correct .answer__letter{color:var(--color-white);background-color:var(--color-green-500)}.question__view--content-answers .incorrect{border:0.1875rem solid var(--color-red-500)}.question__view--content-answers .incorrect .answer__letter{color:var(--color-white);background-color:var(--color-red-500)}.question__view--content .error__message{display:flex;justify-content:center;align-items:center;gap:0.5rem;color:var(--color-red-500);font-family:"Rubik",sans-serif;font-size:1.125rem;font-size:clamp(1.125rem,.1875rem + 2.5vw,1.7rem);font-weight:500;line-height:100%;letter-spacing:0}@media(min-width: 37.5em){.question__view--content .error__message{font-family:"Rubik",sans-serif;font-size:.875rem;font-size:clamp(.875rem,-0.0625rem + 2.5vw,1.5rem);line-height:150%;letter-spacing:0}}.question__view--content .error__message img{width:clamp(1.5rem,1.05rem + 1.2vw,1.875rem);height:clamp(1.5rem,1.05rem + 1.2vw,1.875rem)}.score__view--title{display:flex;flex-direction:column}.score__view--title h2{color:var(--text-color-primary);font-family:"Rubik",sans-serif;font-size:2.5rem;font-size:clamp(2.5rem,.25rem + 6vw,4rem);font-weight:300;line-height:100%;letter-spacing:0}.score__view--title h2 span{display:block;margin-top:0.5rem;font-family:"Rubik",sans-serif;font-size:2.5rem;font-size:clamp(2.5rem,.25rem + 6vw,4rem);font-weight:500;line-height:100%;letter-spacing:0}.score__view--content{display:flex;flex-direction:column;gap:1rem}@media(min-width: 37.5em){.score__view--content{gap:2rem}}.score__view--content-card{display:flex;flex-direction:column;align-items:center;background-color:var(--base-secondary-bg-color);padding:2rem;border-radius:0.75rem}.score__view--content-card h3{display:flex;align-items:center;gap:1rem;color:var(--text-color-primary);margin-bottom:1rem;font-family:"Rubik",sans-serif;font-size:1.25rem;font-size:clamp(1.25rem,-0.25rem + 4vw,2.25rem);font-weight:500;line-height:120%;letter-spacing:0}@media(min-width: 37.5em){.score__view--content-card h3{margin-bottom:2.5rem}}.score__view--content-card .score{color:var(--text-color-primary);margin-bottom:1rem;font-family:"Rubik",sans-serif;font-size:5.5rem;font-size:clamp(5.5rem,.25rem + 14vw,9rem);font-weight:500;line-height:100%;letter-spacing:0}.score__view--content-card .out-of{color:var(--text-color-secondary);margin-bottom:1rem;font-family:"Rubik",sans-serif;font-size:1.125rem;font-size:clamp(1.125rem,.1875rem + 2.5vw,1.7rem);font-weight:500;line-height:100%;letter-spacing:0}.start__view--title{display:flex;flex-direction:column;gap:1rem}@media(min-width: 68.75em){.start__view--title{gap:3rem}}.start__view--title h1{color:var(--text-color-primary);font-family:"Rubik",sans-serif;font-size:2.5rem;font-size:clamp(2.5rem,.25rem + 6vw,4rem);font-weight:300;line-height:100%;letter-spacing:0}.start__view--title h1 span{display:block;margin-top:0.5rem;font-family:"Rubik",sans-serif;font-size:2.5rem;font-size:clamp(2.5rem,.25rem + 6vw,4rem);font-weight:500;line-height:100%;letter-spacing:0}.start__view--title h3{color:var(--text-color-secondary);font-family:"Rubik",sans-serif;font-size:.875rem;font-size:clamp(.875rem,-0.0625rem + 2.5vw,1.5rem);line-height:150%;letter-spacing:0}.start__view--content{display:flex;flex-direction:column;gap:1rem}*,::before,::after{margin:0;padding:0;box-sizing:border-box}body{min-height:100vh;width:100%;padding:0 1.5rem;display:flex;flex-direction:column;align-items:center;gap:1rem;background:var(--base-primary-bg-color) var(--base-bg-mobile-image) no-repeat}@media(min-width: 37.5em){body{background:var(--base-primary-bg-color) var(--base-bg-tablet-image) no-repeat}}@media(min-width: 68.75em){body{background:var(--base-primary-bg-color) var(--base-bg-desktop-image) no-repeat center center fixed;background-size:cover;padding:0 2rem}}section{width:100%}main{display:flex;flex-direction:column;gap:2.5rem;width:100%;padding-bottom:1rem}@media(min-width: 37.5em){main{gap:4rem;max-width:40rem}}@media(min-width: 68.75em){main{flex-direction:row;max-width:75rem}}button{display:flex;align-items:center;text-align:left;gap:1rem;padding:1rem;width:100%;height:clamp(4.5rem,3rem + 4vw,5.5rem);background-color:var(--base-secondary-bg-color);border:none;border-radius:0.75rem;color:var(--text-color-primary);box-shadow:0 1rem 2.5rem 0 var(--box-shadow-color);cursor:pointer;border:0.1875rem solid rgba(0,0,0,0);font-family:"Rubik",sans-serif;font-size:1.125rem;font-size:clamp(1.125rem,.1875rem + 2.5vw,1.7rem);font-weight:500;line-height:100%;letter-spacing:0}button:hover{border:0.1875rem solid var(--color-purple-600)}button:hover .answer__letter{color:var(--color-white);background-color:var(--color-purple-600)}button:focus{outline:none;border:0.1875rem solid var(--color-purple-600)}button:focus .answer__letter{color:var(--color-white);background-color:var(--color-purple-600)}button.answer-buttons:disabled{pointer-events:none}button.submit__button{display:flex;justify-content:center;align-items:center;color:var(--color-white);background-color:var(--color-purple-600)}button.submit__button.disabled{opacity:50%}span.icon__bg{display:flex;justify-content:center;align-items:center;width:clamp(2.5rem,1rem + 3vw,2.6rem);height:clamp(2.5rem,1rem + 3vw,2.6rem);min-width:2.5rem;min-height:2.5rem;border-radius:0.375rem}@media(min-width: 37.5em){span.icon__bg{min-width:2.75rem;min-height:2.75rem}}span.icon__bg img{width:clamp(1.8rem,1.05rem + 1.2vw,2.5rem);height:clamp(1.8rem,1.05rem + 1.2vw,2.5rem)}span.icon__bg.html__bg{background-color:var(--color-orange-50)}span.icon__bg.css__bg{background-color:var(--color-green-100)}span.icon__bg.javascript__bg{background-color:var(--color-blue-50)}span.icon__bg.accessibility__bg{background-color:var(--color-purple-100)}.hidden{display:none !important}/*# sourceMappingURL=styles.css.map */