.quiz-banner{width:80%}.q-img{width:60%}.login-box{margin:var(--spacing4) var(--spacing7)}#banner{position:relative;width:100%;min-height:90dvh;overflow:hidden;margin-bottom:0;background:linear-gradient(45deg,#824f74,#a63272,#2aa701);background-size:300% 300%;animation:gradient 9s alternate infinite}.intro-box{position:relative;z-index:1;margin:var(--spacing5);padding:var(--spacing2) var(--spacing5);translate:0% 100%;display:flex;flex-direction:column;justify-content:space-evenly;align-items:center;animation:breathing 6s linear infinite alternate}.banner-greeting{color:var(--subbackground);font-size:5rem;margin-bottom:var(--spacing5)}.banner-img{width:100%;height:auto}#banner .banner-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0}@keyframes breathing{0%{transform:scale(.99)}25%{transform:scale(1)}50%{transform:scale(1.05)}to{transform:scale(1.1)}}@keyframes gradient{0%{background-position:0%}to{background-position:100%}}*{margin:0;padding:0;box-sizing:border-box}@media(prefers-color-scheme:light){:root{--text: hsl(320 7% 8%);--subtext: hsl(320 7% 45%);--background: hsl(300 10% 96%);--subbackground: hsl(300 10% 92%);--primary: hsl(316 16% 27%);--secondary: hsl(317 20% 69%);--accent: hsl(316 24% 41%)}}@media(prefers-color-scheme:dark){:root{--text: hsl(320 8% 92%);--subtext: hsl(320 8% 70%);--background: hsl(300 11% 4%);--subbackground: hsl(300 11% 8%);--primary: hsl(316 16% 73%);--secondary: hsl(317 20% 31%);--accent: hsl(310 86% 54%)}}:root{--ff1: "Noto Sans", sans-serif;--ff2: "Momo Trust Sans", sans-serif;--fsize1: 1rem;--fsize2: 1.125rem;--fsize3: 1.25rem;--fsize4: 1.5rem;--fsize5: .875rem;--spacing1: 4px;--spacing2: 8px;--spacing3: 16px;--spacing4: 20px;--spacing5: 40px;--spacing6: 80px;--spacing7: 160px;--spacing8: 320px;--h1: 700 4rem/1.2em var(--ff2);--h2: 600 2rem/1.2em var(--ff2);--p: 1rem/1.5em var(--ff1);--successGreen: hsl(162 100% 29%);--errorRed: hsl(7 89% 66%);--warning: hsl(54 100% 25%);--focus: 2px solid hsl(217 100% 69%)}html{scroll-behavior:smooth}body{min-height:100vh;text-wrap:balance;font:var(--p);color:var(--text);background:var(--background)}#root{min-height:100vh;margin:0;padding:0}section{width:80%;max-width:1200px;padding:var(--spacing6);margin:var(--spacing6) auto}h1{font:var(--h1);color:var(--primary);margin:var(--spacing1)}h2{font:var(--h2);color:var(--primary);margin:var(--spacing2)}h3,p{margin:var(--spacing2)}small{color:var(--subtext)}a{text-decoration:none;color:var(--accent)}a:hover{color:var(--primary)}ul{list-style:inside;margin:var(--spacing2)}img{width:100%;border-radius:var(--spacing2)}input{width:40%;min-height:var(--spacing4);padding:var(--spacing2);border:0px;border-radius:var(--spacing1);font-size:var(--ff2)}.btn,button{all:unset;background-color:var(--primary);font:var(--p);color:var(--secondary);margin:var(--spacing2) auto;padding:var(--spacing2) var(--spacing3);display:inline-block;border-radius:var(--spacing2);cursor:pointer}@media(hover:hover){.btn:hover,button:hover{scale:1.115;box-shadow:0 var(--spacing1) var(--spacing2) var(--accent)}}.outline-btn{color:var(--text);background-color:transparent;border:2px solid var(--primary)}*:focus,button:focus,anchor:focus{outline:var(--focus)}.icon{height:var(--spacing5);margin-left:var(--spacing3);width:var(--spacing5);vertical-align:middle}.center{text-align:center}.hidden{display:none}.flex{display:flex;align-items:center;justify-content:center;gap:var(--spacing4);flex-wrap:wrap}.flex>*{flex:1;min-width:200px}.column{flex-direction:column}.reverse{flex-direction:row-reverse}.flex-start{align-items:flex-start}.flex-end{align-items:end}.flex-center{justify-content:center}.top-accent-tab{border-top:var(--spacing1) solid var(--accent);border-top-left-radius:var(--spacing1);border-top-right-radius:var(--spacing1)}.left-accent-tab{border-left:var(--spacing1) solid var(--accent);border-radius:var(--spacing1)}.container{margin:var(--spacing3) auto;padding:var(--spacing4)}.card{background-color:var(--subbackground);box-shadow:0 4px 8px #0000001a;border-radius:var(--spacing1)}.card.success{background-color:var(--successGreen)!important;color:var(--text)}.card.error{background-color:var(--errorRed)!important;color:var(--text)}.click-hover:hover{cursor:pointer;transform:scale(1.0625);transition:transform .15s cubic-bezier(.4,0,.2,1);will-change:transform}.padding1{padding:var(--spacing1) 0}.padding2{padding:var(--spacing2) 0}.padding3{padding:var(--spacing3) 0}.padding4{padding:var(--spacing4) 0}.padding5{padding:var(--spacing5) 0}.padding6{padding:var(--spacing6) 0}.padding7{padding:var(--spacing7) 0}.margin1{margin:var(--spacing1) auto}.margin2{margin:var(--spacing2) auto}.margin3{margin:var(--spacing3) auto}.margin4{margin:var(--spacing4) auto}.margin5{margin:var(--spacing5) auto}.margin6{margin:var(--spacing6) auto}.margin7{margin:var(--spacing7) auto}#footer{padding:var(--spacing3) var(--spacing4);margin-top:var(--spacing5);background-color:var(--subbackground);border-top:2px solid var(--secondary);border-radius:2px}#nav{position:sticky;top:0;z-index:1;display:flex;justify-content:space-between;align-items:center;padding:var(--spacing2);background-color:var(--subbackground);opacity:.9;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid var(--secondary);border-radius:4px}.nav-logo{padding:var(--spacing3);margin:auto var(--spacing5)}#nav-menu{margin:auto var(--spacing2)}#nav-menu>a{margin:auto var(--spacing4);text-align:center;max-width:fit-content;font-size:var(--fsize2)}