:root{--orange1: #ffcc46;--orange2: #f99f31;--orange3: #e5611f;--green: #009a46;--brown: #6f0a09;--grey: #646363;--slices: 11;--picked: 1}*{box-sizing:border-box}html,body{margin:0;padding:0;width:100vw;height:100vh;width:100dvw;height:100dvh;font-size:20px;color:var(--orange3);font-family:Raleway,sans-serif}*{font-family:Raleway,sans-serif}#root{height:100%;width:100%}.startPage{margin:auto;width:clamp(70%,90%,1200px);height:100%;display:-webkit-flex;display:flex;-webkit-flex-direction:column;flex-direction:column;-webkit-flex-wrap:nowrap;flex-wrap:nowrap;-webkit-justify-content:center;justify-content:center;-webkit-align-content:center;align-content:center;-webkit-align-items:center;align-items:center}.startPage form{display:-webkit-flex;display:flex;-webkit-flex-direction:column;flex-direction:column;-webkit-flex-wrap:nowrap;flex-wrap:nowrap;-webkit-justify-content:center;justify-content:center;-webkit-align-content:center;align-content:center;-webkit-align-items:center;align-items:center;max-width:100%}img{max-width:100%;height:auto}.mibeLogo{-webkit-align-self:flex-start;align-self:flex-start;margin-bottom:60px;max-height:160px}.titleLogo{margin-bottom:60px;max-height:20vh}input[type=text],input[type=email]{font-size:1.6rem;padding:8px;border:3px solid #666;margin:6px 6px 16px;max-width:100%}@media (max-width: 600px){input[type=text],input[type=email]{font-size:1.5rem;margin-bottom:16px}}.btn{font-size:2rem;padding:16px 32px;border:none;margin:6px;background:var(--green);color:#fff;text-align:center;border-radius:60px}@media (max-width: 600px){.btn{font-size:1.5rem}}.ruletaPage{margin:auto;width:100%;height:100%;display:-webkit-flex;display:flex;-webkit-flex-direction:column;flex-direction:column;-webkit-flex-wrap:nowrap;flex-wrap:nowrap;-webkit-justify-content:center;justify-content:center;-webkit-align-content:center;align-content:center;-webkit-align-items:center;align-items:center;font-weight:700;font-size:2rem}.ruletaPage-inner{-webkit-flex:1 1 auto;flex:1 1 auto;position:relative;display:-webkit-flex;display:flex;-webkit-flex-direction:column;flex-direction:column;-webkit-flex-wrap:nowrap;flex-wrap:nowrap;-webkit-justify-content:center;justify-content:center;-webkit-align-content:center;align-content:center;-webkit-align-items:center;align-items:center;height:100%;width:100%;overflow:hidden;padding:20px}.ruleta-outer{position:relative;width:100%;height:auto;max-height:100%}.ruleta{background:red;position:relative;overflow:hidden;counter-reset:slice;aspect-ratio:1 / 1;border-radius:100%;height:100%;width:auto;max-width:100%;margin:auto;max-width:60vw;container-type:inline-size;container-name:wheel}.ruleta.animate .wheel{transition:transform 5s ease-out;transform:rotate(calc(calc(calc(1turn / var(--slices) * -1) - calc(1turn / var(--slices) * calc(var(--picked) - 1))) - 5turn))}.wheel{transform:rotate(calc(1turn / var(--slices) * -1));width:100%;height:100%}.ruleta-slice{counter-increment:slice;width:100%;height:100%;position:absolute;left:0;top:0;clip-path:polygon(calc(50% - (tan(calc(180deg / var(--slices)))*50%)) 0,50% 50%,calc(50% + tan(calc(180deg / var(--slices)))*50%) 0)}.ruleta-slice:after{content:counter(slice);position:absolute;left:50%;bottom:100%;transform:translate(-50%,calc(100% + 80px));color:#fff;font-size:4rem}@container wheel (max-width: 600px){.ruleta-slice:after{transform:translate(-50%,calc(100% + 50px));font-size:2.5rem}}@container wheel (max-width: 400px){.ruleta-slice:after{transform:translate(-50%,calc(100% + 40px));font-size:1.5rem}}.ruleta-slice:nth-child(1){background:var(--orange3);transform:rotate(calc(1turn / var(--slices) * 1))}.ruleta-slice:nth-child(2){background:var(--orange2);transform:rotate(calc(1turn / var(--slices) * 2))}.ruleta-slice:nth-child(3){background:var(--orange1);transform:rotate(calc(1turn / var(--slices) * 3))}.ruleta-slice:nth-child(4){background:var(--orange3);transform:rotate(calc(1turn / var(--slices) * 4))}.ruleta-slice:nth-child(5){background:var(--orange2);transform:rotate(calc(1turn / var(--slices) * 5))}.ruleta-slice:nth-child(6){background:var(--orange1);transform:rotate(calc(1turn / var(--slices) * 6))}.ruleta-slice:nth-child(7){background:var(--orange3);transform:rotate(calc(1turn / var(--slices) * 7))}.ruleta-slice:nth-child(8){background:var(--orange2);transform:rotate(calc(1turn / var(--slices) * 8))}.ruleta-slice:nth-child(9){background:var(--orange1);transform:rotate(calc(1turn / var(--slices) * 9))}.ruleta-slice:nth-child(10){background:var(--orange3);transform:rotate(calc(1turn / var(--slices) * 10))}.ruleta-slice:nth-child(11){background:var(--orange2);transform:rotate(calc(1turn / var(--slices) * 11))}.ruleta-slice:nth-child(12){background:var(--orange1);transform:rotate(calc(1turn / var(--slices) * 12))}.ruleta:before{position:absolute;top:0;left:50%;transform:translate(-50%,-50%) scale(1);content:"";width:160px;height:160px;clip-path:polygon(100% 0,0 0,50% 100%);background:#fff;z-index:1}.ruleta:after{position:absolute;top:0;left:50%;transform:translate(-50%,-50%) scale(.8);content:"";width:160px;height:160px;clip-path:polygon(100% 0,0 0,50% 100%);background:var(--green);z-index:2}@container wheel (max-width: 600px){.ruleta:before,.ruleta:after{top:-40px}}@container wheel (max-width: 400px){.ruleta:before,.ruleta:after{top:-50px}}div.closed,div.open{opacity:0;position:absolute;top:0;left:0;width:100%;height:100%;transition:opacity .2s ease-in-out}div.closed{opacity:0;pointer-events:none;z-index:1}div.open{opacity:1;pointer-events:all;z-index:2}.questionPage,.ruletaPage,.startPage,.scorePage,.adminPage{padding:5%}.questionPage{display:-webkit-flex;display:flex;-webkit-flex-direction:column;flex-direction:column;-webkit-flex-wrap:nowrap;flex-wrap:nowrap;-webkit-justify-content:flex-start;justify-content:flex-start;-webkit-align-content:flex-start;align-content:flex-start;-webkit-align-items:stretch;align-items:stretch}.questionPage-innner{-webkit-flex:1 1 auto;flex:1 1 auto;position:relative;display:-webkit-flex;display:flex;-webkit-flex-direction:column;flex-direction:column;-webkit-flex-wrap:nowrap;flex-wrap:nowrap;-webkit-justify-content:center;justify-content:center;-webkit-align-content:center;align-content:center;-webkit-align-items:center;align-items:center;height:100%;width:100%;overflow:hidden;padding:100px}.questionPage-circle-outer{position:relative;width:100%;height:auto;max-height:100%}.questionPage-circle{background:red;aspect-ratio:1 / 1;border-radius:100%;height:100%;width:auto;max-width:100%;margin:auto;max-width:60vw;color:#fff;text-align:center;position:relative;display:-webkit-flex;display:flex;-webkit-flex-direction:column;flex-direction:column;-webkit-flex-wrap:nowrap;flex-wrap:nowrap;-webkit-justify-content:center;justify-content:center;-webkit-align-content:center;align-content:center;-webkit-align-items:center;align-items:center;container-type:inline-size;container-name:circle}.questionPage-circle h1{font-size:5rem;margin:0;padding:20px}@container circle (max-width: 600px){.questionPage-circle h1{font-size:3rem;padding:10px}}@container circle (max-width: 400px){.questionPage-circle h1{font-size:2rem;padding:10px}}.questionPage-circle h2{font-size:2.5rem;margin:0;padding:20px 10%;line-height:3rem}.questionPage-circle h2:has(small){line-height:2rem}@container circle (max-width: 600px){.questionPage-circle h2{font-size:1.5rem;padding:10px 10%}}@container circle (max-width: 400px){.questionPage-circle h2{font-size:1.2rem;padding:10px 10%}}.questionPage-circle h2 small{font-size:1.5rem}@container circle (max-width: 600px){.questionPage-circle h2 small{font-size:1rem}}@container circle (max-width: 400px){.questionPage-circle h2 small{font-size:.8rem}}.questionPage-circle p{color:var(--brown);margin:0 0 20%;padding:20px 10%;font-size:1.5rem}@container circle (max-width: 600px){.questionPage-circle p{font-size:1rem;padding:10px 10%}}@container circle (max-width: 400px){.questionPage-circle p{font-size:.7rem;padding:10px 10%}}.questionPage-circle .answers{position:absolute;bottom:0;left:50%;transform:translate(-50%,calc(50% - 30px));width:100%;display:-webkit-flex;display:flex;-webkit-flex-direction:row;flex-direction:row;-webkit-flex-wrap:nowrap;flex-wrap:nowrap;-webkit-justify-content:center;justify-content:center;-webkit-align-content:center;align-content:center;-webkit-align-items:center;align-items:center}.questionPage-circle .answers>div{background:#fff;border-radius:100%;-webkit-box-shadow:0px 1px 25px -11px rgba(0,0,0,.75);-moz-box-shadow:0px 1px 25px -11px rgba(0,0,0,.75);box-shadow:0 1px 25px -11px #000000bf;width:calc(100% / 3.3);height:auto;aspect-ratio:1 / 1;text-align:center;display:-webkit-flex;display:flex;-webkit-flex-direction:column;flex-direction:column;-webkit-flex-wrap:nowrap;flex-wrap:nowrap;-webkit-justify-content:center;justify-content:center;-webkit-align-content:center;align-content:center;-webkit-align-items:center;align-items:center;color:var(--green);font-size:1.3rem;padding:20px;position:relative;margin:20px}@container circle (max-width: 600px){.questionPage-circle .answers>div{padding:10px;font-size:.9rem}}@container circle (max-width: 400px){.questionPage-circle .answers>div{padding:10px;font-size:.6rem}}.questionPage-circle .answers>div:after{content:attr(data-value);position:absolute;top:0;left:50%;width:50px;height:50px;text-align:center;line-height:50px;transform:translate(-50%,-50%);background:var(--green);color:#fff;border-radius:100%}.orange1 .questionPage-circle{background:var(--orange1)}.orange2 .questionPage-circle{background:var(--orange2)}.orange3 .questionPage-circle{background:var(--orange3)}.answered div[data-question]:not([data-correct=true]){transition:all .6s ease-in-out;transform:scale(0);padding:0;margin:0;width:0px}.wrong-text,.correct-text{opacity:0;position:absolute;top:50%;transition:opacity .6s ease-in-out}.answered .correct-text{font-size:3rem}.answered.wrong .wrong-text,.answered.correct .correct-text{opacity:1}.answered.wrong p:not(.wrong-text),.answered.wrong h2{opacity:0}.answered.correct p:not(.correct-text),.answered.correct h2{opacity:0}.scorePage{margin:auto;width:100%;height:100%;display:-webkit-flex;display:flex;-webkit-flex-direction:column;flex-direction:column;-webkit-flex-wrap:nowrap;flex-wrap:nowrap;-webkit-justify-content:center;justify-content:center;-webkit-align-content:center;align-content:center;-webkit-align-items:center;align-items:center;font-weight:700;font-size:2rem}.scorePage-innner{-webkit-flex:1 1 auto;flex:1 1 auto;position:relative;display:-webkit-flex;display:flex;-webkit-flex-direction:column;flex-direction:column;-webkit-flex-wrap:nowrap;flex-wrap:nowrap;-webkit-justify-content:center;justify-content:center;-webkit-align-content:center;align-content:center;-webkit-align-items:center;align-items:center;height:100%;width:100%;overflow:hidden;padding:20px;container-type:size;container-name:scoreboard}.ranking{border-bottom:4px solid var(--orange3);color:var(--green);padding-bottom:10px;display:inline-block;margin:0 0 20px;font-size:4rem}table{width:max-content}table td{padding:12px;text-align:left}table .index{font-size:2rem;color:var(--green);width:10%}table .name{font-size:2rem;color:var(--grey)}@container scoreboard (max-width: 1200px) or (max-height: 1200px){table .index,table .name{font-size:1.8rem}table td{padding:12px}}@container scoreboard (max-width: 600px) or (max-height: 600px){table .index,table .name{font-size:1.5rem}table td{padding:8px}}@container scoreboard (max-width: 400px) or (max-height: 400px){table .index,table .name{font-size:1rem}table td{padding:8px}}.adminPage *{font-size:18px!important}.container{padding:5%;margin:auto;color:#000}.container table{width:100%}.green-text{color:var(--green)}.maxWidthInput{max-width:640px;text-align:center;color:#000}