.results{flex-direction:column;row-gap:1rem;margin-block-end:7rem;display:flex}.dots{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:0 0 6px var(--text-color);border:2px solid var(--text-color);z-index:1;background-color:#16074ebb;border-radius:1rem;flex-wrap:wrap;justify-content:center;gap:.6rem;width:min(100%,500px);margin-inline:auto;padding:.75rem;display:flex;position:fixed;bottom:65px;left:0;right:0}.dots .dot{aspect-ratio:1;color:#fff;border-radius:50%;place-items:center;width:1.7rem;text-decoration:none;display:grid}.dots .dot.correct{background-color:var(--correct-color)}.dots .dot.incorrect{background-color:var(--incorrect-color)}.score{text-align:center;flex-direction:column;align-items:center;row-gap:1rem;display:flex}.score h2{font-size:2.2rem}.score .score-circles{column-gap:1rem;display:flex}.score .score-circles div{background-color:var(--info-color);aspect-ratio:1;border-radius:50%;place-items:center;width:5rem;font-size:1.25rem;font-weight:700;display:grid}.final-view{margin-block-end:1rem}.answer{background-color:var(--option-color);border-radius:16px;align-items:center;column-gap:1rem;padding:1rem;font-size:1.1rem;transition:filter .3s;display:flex}.answer.correct{background-color:var(--correct-color)}.answer.incorrect{background-color:var(--incorrect-color);animation:.3s ease-in-out vibrate}.answer.cursor{cursor:pointer}.answer.cursor:hover{filter:brightness(1.3)}.answer input{accent-color:var(--secondary-color)}@keyframes vibrate{0%{transform:translate(0)}20%{transform:translate(-5px)}40%{transform:translate(5px)}60%{transform:translate(-5px)}80%{transform:translate(5px)}to{transform:translate(0)}}.answers{flex-direction:column;row-gap:1rem;display:flex}.buttons{column-gap:1rem;display:flex}.buttons button{align-items:center;column-gap:.3rem;display:flex}.info{background-color:var(--info-color);opacity:1;interpolate-size:allow-keywords;border-radius:16px;flex-direction:column;row-gap:.5rem;height:max-content;padding:1rem;transition:opacity .3s,height .3s;display:flex;overflow:clip}@starting-style{.info{opacity:0;height:0}}.info h3{align-items:center;column-gap:.5rem;display:flex}.info p{width:100%}.info code,.info pre{background-color:var(--option-color);border-radius:4px}.info code{padding:.125rem .25rem}.info pre{padding:10px;overflow-x:auto}.quiz{background-color:var(--primary-color);box-shadow:2px 2px 3px var(--secondary-color);border-radius:16px;flex-direction:column;row-gap:1rem;padding:2rem 1.5rem;display:flex;position:relative}.quiz .badge{background-color:var(--secondary-color);border-radius:16px;padding:.3rem .6rem;position:absolute;top:.75rem;right:1.5rem}.quiz .question-title{padding-inline-end:70px}@scope(footer){:scope{text-align:center;padding-block:2rem 1rem}:scope p,:scope a{flex-wrap:wrap;justify-content:center;align-items:center;gap:.5rem;display:flex}:scope a{font-weight:700;text-decoration:none}:scope a:hover{text-decoration:underline}:scope img{border-radius:50%;width:2rem}}:root{--primary-color:#16074e;--secondary-color:#462a8c;--option-color:#434343;--correct-color:#007500;--incorrect-color:#750019;--info-color:#5e458e;--text-color:#efeeee;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark}@media (prefers-color-scheme:dark){:root{--lightningcss-light: ;--lightningcss-dark:initial}}*{box-sizing:border-box;margin:0}html{scroll-behavior:smooth}body{min-height:100dvh;color:var(--text-color);background:radial-gradient(125% 125% at 50% 10%, #121212 40%, var(--secondary-color) 100%);font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Open Sans,Helvetica Neue,sans-serif}#root{grid-template-rows:max-content 1fr max-content;min-height:100dvh;display:grid}.container{width:min(700px,100%);margin-inline:auto;padding-inline:1rem}h1{text-align:center;text-shadow:2px 2px 3px var(--info-color);flex-flow:column wrap;justify-content:center;align-items:center;row-gap:.5rem;margin-block:1rem 2rem;font-size:clamp(1.875rem,.75rem + 3vw,3rem);display:flex}h1 .img{width:clamp(11.25rem,8.5rem + 7.333vw,14rem);padding:.5rem}h1 .img img{width:100%}h2{text-wrap:balance}p{text-wrap:pretty;line-height:1.5}button{background-color:var(--secondary-color);font:inherit;color:var(--text-color);cursor:pointer;border:none;border-radius:16px;padding:1rem 2rem;transition:filter .3s,scale .3s}button.disabled{opacity:.5;filter:grayscale(.8)}button:hover{filter:brightness(1.15)}button:active{scale:.9}