@import"https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;700&display=swap";.navbar{padding:24px 24px 0;display:flex;justify-content:space-between;position:fixed;z-index:1;top:0;width:100%}.left__nav{display:flex}.intro__text{color:#1a1b1c83;padding:0 16px}.nav__text{font-size:14px}.nav__button{position:relative;padding:8px 10px;background-color:#000;border:none;outline:none;top:-10px}.nav__button--text{font-size:8px;color:#fff}@media(max-width:768px){.navbar{background-color:#fff}}.loading__overlay{position:fixed;top:0;left:0;width:100vw;height:100vh;background-color:#fffffff2;z-index:1;display:flex;flex-direction:column;align-items:center;justify-content:center}.loading__animation{position:absolute;bottom:5%;display:flex;flex-direction:column;align-items:center;justify-content:center}.square{width:50px;height:50px;margin:5px;background-color:gray;animation:rotate 1.5s linear infinite}.scan__icon{width:120px;height:120px;margin-top:20px;animation:pulse 1.5s ease-in-out infinite}.camera__loading--text{position:absolute;bottom:40%;font-size:18px;font-weight:700;text-align:center}.camera__tips{position:absolute;bottom:50px;text-align:center;width:100%}.tips__list{display:flex;justify-content:center;gap:40px;margin-top:5px}.camera__feed--overlay{position:relative;top:70px;height:calc(100vh - 70px);width:100%;overflow:hidden;background:#000;display:flex;flex-direction:column;justify-content:center;align-items:center}.camera__video{width:100%;height:100%;object-fit:cover}.camera__tips--camera{position:absolute;bottom:150px;text-align:center;width:100%;color:#fff;font-weight:lighter}@keyframes pulse{0%,to{transform:scale(1);opacity:.7}50%{transform:scale(1.2);opacity:1}}@keyframes rotate{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.take__picture--text{position:absolute;right:8%;top:49%;color:#fff}.take__picture--button{position:absolute;right:2%;top:50%;transform:translateY(-50%);background-color:#00000080;color:#fff;border:none;border-radius:50%;padding:18px;cursor:pointer;z-index:20}.captured__overlay{position:absolute;inset:0;background:#000000e2;display:flex;flex-direction:column;align-items:center;justify-content:center;z-index:30}.captured__image{max-width:90%;max-height:70%;object-fit:contain;border-radius:12px}.great__shot--text{position:absolute;top:20%;color:#fff;font-size:24px;font-weight:700;z-index:40}.preview__title{margin-top:20px;color:#fff}.preview__buttons{margin-top:12px;display:flex;gap:16px}.use__photo--button{background-color:#fff;color:#000;padding:10px 20px;border:none;border-radius:6px;cursor:pointer}.retake__button{background-color:#000;color:#fff;padding:10px 20px;border:none;border-radius:6px;cursor:pointer}.analyzing__overlay{position:absolute;top:0;left:0;width:100%;height:100%;background:#000000b3;display:flex;flex-direction:column;justify-content:center;align-items:center;color:#fff;z-index:50}.analyzing__box{background-color:#e0e0e0;padding:24px 32px;border-radius:12px;text-align:center;box-shadow:0 4px 10px #0000004d}.analyzing__text{color:#000;font-size:18px;font-weight:600;margin-bottom:16px}html,body{margin:0;padding:0;height:100%;overflow:hidden;background:#000}@media(max-width:1024px){.take__picture--text{right:10%}}@media(max-width:900px){.take__picture--text{right:12%}}@media(max-width:900px){.take__picture--text{display:none}}.back__button--white{cursor:pointer;position:absolute;display:flex;align-items:center;bottom:5%;left:2%;color:#fff}.back__icon--white{transform:rotate(315deg);font-size:40px;transition:transform .3s ease;color:#fff}.back__text--white{margin-left:25px;color:#fff}@media(max-width:1024px){.back__button--white{margin-left:20px}}.loading__dots{display:flex;justify-content:center;align-items:center;gap:8px}.dot{width:12px;height:12px;background-color:#999;border-radius:50%;animation:bounce 1.4s infinite ease-in-out both}.dot:nth-child(1){animation-delay:-.32s}.dot:nth-child(2){animation-delay:-.16s}@keyframes bounce{0%,80%,to{transform:translateY(0)}40%{transform:translateY(-10px)}}.left__button,.right__button{display:flex;align-items:center;border:none;cursor:pointer;background-color:#fff}.left__icon{transform:rotate(315deg);margin-right:16px;font-size:30px}.right__icon{transform:rotate(45deg);margin-left:16px;font-size:30px}.landing{display:flex;justify-content:space-around;align-items:center;height:100vh}.hero-text{font-size:100px;font-weight:400;line-height:1.1;letter-spacing:-.2rem;display:flex;flex-direction:column;text-align:center}.hero-text .line{display:inline-block;transition:transform .7s ease}.line1.slide-right{transform:translate(22vw)}.line1.slide-left{transform:translate(-22vw)}.line2.slide-right-small{transform:translate(28vw)}.line2.slide-left-small{transform:translate(-28vw)}.left__section,.right__section{transition:opacity .5s ease}.intro{font-weight:lighter;position:absolute;top:85%;left:4%;font-size:14px;line-height:1.3}.square-container{position:relative;display:flex;justify-content:center;align-items:center}.left__square,.right__square{position:absolute;width:450px;height:450px;border:2px dotted #a0a4ab;background-color:#fff;top:22%;transform:rotate(45deg);z-index:0}.left__square{left:-225px}.right__square{right:-225px}.left__button,.right__button,.landing h1{position:relative;z-index:1}.home__mobile{display:none;position:relative;height:100vh;width:100%;justify-content:center;align-items:center;text-align:center;padding:0 16px}.home__mobile h1{font-size:48px;line-height:1.1;margin-bottom:20px;font-weight:400}.home__mobile p{font-size:16px;line-height:1.5;margin-bottom:20px}.home__mobile .diamond__outer,.home__mobile .diamond__inner{position:absolute;top:50%;left:50%;width:400px;height:400px;border:2px dotted #a0a4ab;transform:translate(-50%,-50%) rotate(45deg);z-index:0}.home__mobile .diamond__inner{width:340px;height:340px}@media(max-width:1024px){.landing,.left__section,.right__section,.hero-text,.intro{display:none}.home__mobile{display:flex;flex-direction:column}.mobile__para{color:gray;font-weight:500}}@media(max-width:640px){.home__mobile h1{font-size:32px}.home__mobile p{font-size:14px}.home__mobile .diamond__outer{width:320px;height:320px}.home__mobile .diamond__inner{width:280px;height:280px}}.enter__button{cursor:pointer;display:flex;align-items:center;font-size:14px;border:none;color:#000;position:relative;z-index:1}.enter__icon{transform:rotate(45deg);font-size:20px;transition:transform .3s ease}.enter__button:hover .enter__icon{transform:rotate(45deg) scale(1.2)}.enter__text{margin-right:10px;font-weight:700}.analysis{z-index:10}.center__image{position:relative;width:130px;height:auto;z-index:5;cursor:pointer;transition:transform .3s ease}.center__image:hover{transform:scale(1.1)}.modal__overlay{position:fixed;top:0;left:0;background-color:#ffffff98;width:100vw;height:100vh;display:flex;justify-content:center;align-items:center;z-index:99}.modal__content{background-color:#000;border:1px solid black;padding:30px;border-radius:12px;text-align:left;color:#fff;width:400px}.modal__text{margin-bottom:48px;color:#fff}.modal__buttonGrid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.modal__buttons{grid-column:3 / 5;display:flex;justify-content:flex-end;gap:20px}.modal__buttons button{padding:10px 20px;cursor:pointer;border:none;color:#fff;background-color:#000;border:1px solid white;border-radius:6px;transition:background-color .3s ease}.modal__buttons button:hover{background-color:#222}#deny__text{color:gray}.result__page{display:flex;justify-content:space-between;align-items:center;padding:0 15%;height:100vh;position:relative;background-color:#fff;overflow:hidden}.triplet{position:relative;display:flex;justify-content:center;align-items:center;width:450px;height:450px}.triplet .square{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%) rotate(0);transform-origin:center;border:3px dotted #000;background-color:transparent;border-radius:0;z-index:2;pointer-events:none}.result__square--outer{width:300px;height:300px;opacity:.1;animation:rotateOuter 50s linear infinite}.result__square--middle{width:280px;height:280px;opacity:.15;animation:rotateMiddle 70s linear infinite}.result__square--inner{width:230px;height:230px;opacity:.2;animation:rotateInner 85s linear infinite}.scan__line{position:absolute;z-index:10;top:27%;left:58%}.upload__line{position:absolute;z-index:10;bottom:27%;right:58%}.scan__text{position:absolute;top:15%;left:75%;font-size:14px}.upload__text{position:absolute;bottom:18%;right:60%;font-size:14px}.preview__window{position:fixed;right:5%;top:20%;transform:translateY(-50%);width:150px;height:150px;border:2px solid #000;border-radius:8px;background-color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:5px;z-index:20}.preview__empty{width:100%;height:100%;display:flex;align-items:center;justify-content:center;color:#aaa;font-size:12px;text-align:center}.preview__window img{max-width:100%;max-height:100%;object-fit:contain;border-radius:5px}.loading__overlay{position:relative;height:100vh;display:flex;justify-content:center;align-items:center;flex-direction:column;background-color:#fff;z-index:100}.loading__animation{position:relative;width:250px;height:250px;margin-bottom:20px}.loading__animation .square{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);border:3px dotted #000;background:transparent;animation-timing-function:linear;transform-origin:center}.loading__square--outer{width:400px;height:400px;opacity:.15;animation:rotateOuter 4s linear infinite}.loading__square--middle{width:360px;height:360px;opacity:.25;animation:rotateMiddle 6s linear infinite}.loading__square--inner{width:350px;height:350px;opacity:.35;animation:rotateInner 8s linear infinite}@keyframes rotateOuter{0%{transform:translate(-50%,-50%) rotate(0)}to{transform:translate(-50%,-50%) rotate(360deg)}}@keyframes rotateMiddle{0%{transform:translate(-50%,-50%) rotate(360deg)}to{transform:translate(-50%,-50%) rotate(0)}}@keyframes rotateInner{0%{transform:translate(-50%,-50%) rotate(0)}to{transform:translate(-50%,-50%) rotate(360deg)}}.loading__container{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);text-align:center}.loading__text{font-size:18px;letter-spacing:1px;font-weight:700;color:#000;margin-bottom:30px;white-space:nowrap}@media(max-width:1024px){.result__page{padding:0 10%}.triplet{width:350px;height:350px}.result__square--outer{width:240px;height:240px}.result__square--middle{width:220px;height:220px}.result__square--inner{width:180px;height:180px}.center__image{width:110px}.scan__text{position:absolute;top:8%}.upload__text{position:absolute;bottom:5%;right:70%}}@media(max-width:768px){.result__page{flex-direction:column;justify-content:center;align-items:center;padding:0 5%}.triplet{width:280px;height:280px}.result__square--outer{width:200px;height:200px}.result__square--middle{width:180px;height:180px}.result__square--inner{width:140px;height:140px}.center__image{width:90px}.scan__text,.upload__text{font-size:12px}.scan__text{top:68%;left:30%;display:flex;text-align:center}.upload__text{bottom:20%;left:30%;display:flex;text-align:center;white-space:nowrap}.scan__line,.upload__line{display:none}.preview__window{width:120px;height:120px}}.back__button{cursor:pointer;position:absolute;display:flex;align-items:center;bottom:5%;left:2%}.back__icon{transform:rotate(315deg);font-size:40px;transition:transform .3s ease}.back__button:hover .back__icon{transform:rotate(315deg) scale(1.2)}.back__text{margin-left:25px}@media(max-width:1024px){.back__button{margin-left:20px}}.analysis__text{position:absolute;top:60px;left:24px}.analysis__title{font-size:16px;font-weight:700}.analysis__para{font-size:14px;font-weight:lighter}.select__page{height:100vh;width:100vw;background-color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative;overflow:hidden}.select__container{position:relative;width:380px;height:380px}.diamond__button{position:absolute;width:153px;height:153px;background-color:#f3f4f6;border:none;transform:rotate(45deg);cursor:not-allowed;transition:background-color .3s ease;display:flex;align-items:center;justify-content:center}.diamond__button:hover{background-color:#d2d5db}.diamond__top{top:0;left:50%;transform:translate(-50%) rotate(45deg);background-color:#e6e7eb;cursor:pointer}.diamond__left{top:50%;left:0;transform:translateY(-50%) rotate(45deg)}.diamond__right{top:50%;right:0;transform:translateY(-50%) rotate(45deg)}.diamond__bottom{bottom:0;left:50%;transform:translate(-50%) rotate(45deg)}.diamond__label{transform:rotate(-45deg);color:#000;font-size:16px;font-weight:700;white-space:nowrap;text-align:center;width:100%;pointer-events:none;-webkit-user-select:none;user-select:none}.dotted__diamond{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%) rotate(45deg) scale(.8);border:2px dotted rgba(0,0,0,.3);opacity:0;transition:opacity .4s ease,transform .4s ease;pointer-events:none;z-index:0}.dotted__diamond--small{width:400px;height:400px}.dotted__diamond--medium{width:440px;height:440px}.dotted__diamond--large{width:480px;height:480px}.diamond__top:hover~.dotted__diamond--small{opacity:1;transform:translate(-50%,-50%) rotate(45deg) scale(1)}.diamond__left:hover~.dotted__diamond--medium,.diamond__right:hover~.dotted__diamond--medium{opacity:1;transform:translate(-50%,-50%) rotate(45deg) scale(1)}.diamond__bottom:hover~.dotted__diamond--large{opacity:1;transform:translate(-50%,-50%) rotate(45deg) scale(1)}@media(max-width:768px){.select__container{height:300px;width:300px}.diamond__button{height:120px;width:120px}.dotted__diamond--large{width:380px;height:380px}.dotted__diamond--medium{width:350px;height:350px}.dotted__diamond--small{width:310px;height:310px}}.forward__button{cursor:pointer;position:absolute;display:flex;align-items:center;bottom:5%;right:2%}.forward__icon{transform:rotate(45deg);font-size:40px;transition:transform .3s ease}.forward__button:hover .forward__icon{transform:rotate(45deg) scale(1.2)}.forward__text{margin-right:25px}@media(max-width:1024px){.forward__button{margin-right:20px}}.testing__page{position:relative;display:flex;flex-direction:column;justify-content:center;align-items:center;height:100vh;background-color:#fff;overflow:hidden}.analysis{position:absolute;top:9%;left:2.5%;font-size:12px;font-weight:700;letter-spacing:1px}.rotating__squares{position:relative;width:500px;height:500px;display:flex;align-items:center;justify-content:center}.square{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%) rotate(45deg);transform-origin:center;border:3px dotted #000;background-color:transparent;border-radius:0;z-index:2;pointer-events:none}.testing__square--outer{width:600px;height:600px;opacity:.1;animation:rotateOuter 50s linear infinite}.testing__square--middle{width:550px;height:550px;opacity:.2;animation:rotateMiddle 70s linear infinite}.testing__square--inner{width:400px;height:400px;opacity:.3;animation:rotateInner 85s linear infinite}.form__prompt{color:#808080a4}.form__container{text-align:center}.form__input{font-size:60px;text-align:center;border:none;border-bottom:2px solid black;outline:none;width:100%;max-width:600px;padding-top:10px}.form__input::placeholder{color:#0006}.input__fields{position:absolute;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;z-index:5}.input__fields input{padding:10px 15px;border:1px solid #000;border-radius:8px;background-color:#fff9;font-size:14px;width:200px;text-align:center;outline:none;transition:transform .2s ease,box-shadow .2s ease}.input__fields input:focus{transform:scale(1.05);box-shadow:0 0 8px #0000004d}.error__message{color:red;font-size:14px;margin-top:8px;text-align:center;animation:fadeIn .3s ease-in}h2,h3{font-weight:100}@keyframes fadeIn{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}@keyframes rotateOuter{0%{transform:translate(-50%,-50%) rotate(45deg)}to{transform:translate(-50%,-50%) rotate(405deg)}}@keyframes rotateMiddle{0%{transform:translate(-50%,-50%) rotate(45deg)}to{transform:translate(-50%,-50%) rotate(405deg)}}@keyframes rotateInner{0%{transform:translate(-50%,-50%) rotate(45deg)}to{transform:translate(-50%,-50%) rotate(405deg)}}@media(max-width:768px){.testing__square--outer{width:400px;height:400px}.testing__square--middle{width:350px;height:350px}.testing__square--inner{width:250px;height:250px}.form__input{font-size:40px;max-width:90%}}@media(max-width:640px){.testing__square--outer{width:300px;height:300px}.testing__square--middle{width:250px;height:250px}.testing__square--inner{width:180px;height:180px}.form__input{font-size:32px;max-width:90%}}.piechart__container{width:360px;height:360px;display:flex;align-items:center;justify-content:center;align-self:flex-end}.piechart__fill{transition:stroke-dashoffset .6s ease}.piechart__text{font-size:20px;font-weight:700;fill:#000}.demographics__section{position:absolute;top:80px;width:100%;height:calc(100% - 70px);margin:0 36px}.demographics__text{position:relative}.summary__analysis{font-weight:700;font-size:16px}.summary__title{font-size:72px;font-weight:lighter;letter-spacing:-.1rem;margin:-15px 0}.predicted__text{font-weight:lighter}.demographics__grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:20px;margin-top:10px}.demographics__tabs{display:flex;flex-direction:column;gap:15px;width:150px}.demographics__tabs .tab{background-color:#f3f3f4;border-top:2px solid #000;gap:15px;padding:10px;cursor:pointer;text-align:left;transition:background-color .2s ease}.demographics__tabs .tab:hover{background-color:#e1e1e2}.demographics__tabs .tab.active{background-color:#000;color:#fff}.demographics__tabs .tab.active span{color:#fff}.demographics__tabs .tab p{margin:0;font-weight:700;font-size:18px}.demographics__tabs .tab span{font-size:14px;color:#000;font-weight:700}.demographics__pie{position:relative;right:9%;background-color:#f5f5f5;border-top:2px solid #000;padding:40px 60px;display:flex;flex-direction:column;align-items:flex-start;justify-content:space-between;width:850px;height:480px;box-sizing:border-box}.criteria{font-size:40px;font-weight:lighter;margin:0;align-self:flex-start}.demographics__list{position:relative;right:19%;background-color:#f5f5f5;border-top:2px solid #000;padding:20px;display:flex;flex-direction:column;gap:10px;height:480px;width:350px}.demographics__list p{margin:0;cursor:pointer;transition:color .2s ease,font-weight .2s ease}.loading__overlay{position:absolute;top:80px;left:0;width:100%;height:calc(100% - 70px);display:flex;justify-content:center;align-items:center;font-size:18px;font-weight:700;color:#333;background-color:#ffffffe6;z-index:10}.demographics__list--header{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}.demographics__list--header h4{margin:0;font-size:14px;font-weight:700;letter-spacing:.05rem}.demographics__list--item{display:flex;justify-content:space-between;align-items:center;padding:6px 8px;border-radius:6px;transition:background-color .2s ease,color .2s ease;cursor:pointer}.demographics__list--item:hover{background-color:#00000014}.demographics__list--item.selected{background-color:#000;color:#fff}.demographics__list--text{display:flex;align-items:center;gap:6px;font-size:14px}.diamond-icon{color:#000}.demographics__list--item.selected .diamond-icon{color:#fff}@media(max-width:1300px){.demographics__grid{display:grid;grid-template-columns:minmax(150px,1fr) minmax(200px,1fr) minmax(150px,1fr);gap:20px;justify-items:center}.demographics__pie{right:20%;width:400px;height:500px;padding:30px 40px}.demographics__list{width:90%;max-width:300px;height:500px}}@media(max-width:1024px){.demographics__tabs{position:relative;right:20%}.demographics__pie{right:30%;width:400px;height:500px;padding:30px 40px}.demographics__list{width:90%;max-width:300px;height:500px}}@media(max-width:900px){html,body{overflow:scroll}.summary__title{font-size:24px;margin:10px 0}.demographics__section{top:70px;height:auto}.demographics__tabs,.demographics__pie{margin-top:20px;left:-6%}.piechart__container{position:relative;margin-top:20px;left:16%}.demographics__grid{display:flex;flex-direction:column;align-items:center;gap:30px}.demographics__list{left:-6%;margin-bottom:100px}.demographics__pie,.demographics__list,.demographics__tabs{width:90%;max-width:350px;height:auto}}@media(max-width:714px){.summary__button--container{position:fixed;bottom:0;left:0;width:100%;display:flex;justify-content:space-between;padding:30px 20px;background-color:#fff;box-shadow:0 -2px 6px #0000001a;z-index:1000;box-sizing:border-box}.back__button,.forward__button{bottom:17%}}*{margin:0;padding:0;box-sizing:border-box}body,html{font-family:Roboto,sans-serif;background-color:#fff;line-height:1.5;overflow-x:hidden}body{overflow:hidden}a{text-decoration:none;color:#000}li{list-style:none}