@font-face{font-family:GothamLight;src:url(/fonts/GothamLight.woff2) format("woff2"),url(/fonts/GothamLight.woff) format("woff"),url(/fonts/GothamLight.ttf) format("truetype")}@font-face{font-family:GothamBold;src:url(/fonts/GothamBold.woff2) format("woff2"),url(/fonts/GothamBold.woff) format("woff"),url(/fonts/GothamBold.ttf) format("truetype")}.flag img{width:24px;height:auto;vertical-align:middle}.flag{padding:5px;cursor:pointer;border:1px solid transparent;border-bottom:1px solid transparent}.flag[d-underline]{border-bottom-color:initial}*,*:before,*:after{box-sizing:inherit}html{font-family:GothamLight;box-sizing:border-box;touch-action:manipulation;width:100%;height:100%}body{width:100%;height:100%;color:#fff;background-color:#000;margin:0}a{color:#0a66c2;font-family:GothamBold}[d-none]{display:none!important}[unselectable]{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}a[unstyle]{color:inherit;text-decoration:none;background-color:transparent;border:none;outline:none;cursor:pointer}[d-underline]{text-decoration:underline}button[unstyle]{background:none;border:none;padding:0;margin:0;font:inherit;color:inherit;outline:none;appearance:none}.fill{width:100%;height:100%}.f{display:flex}.f.column{flex-direction:column}.f.row{flex-direction:row}.f.center{align-items:center;justify-content:center}.p2{padding:8px}#loader>.logo{object-fit:cover;height:100px}#loader>.title{margin-top:40px}#loader>.subtitle{font-family:GothamBold}#loader>.loading{margin-top:40px}#loader>progress{margin-top:20px}#loader>progress{width:90%;max-width:25em;height:.5em}#loader>progress{border-radius:10px}#loader>progress::-moz-progress-bar{background:white;border-radius:10px}#loader>progress::-moz-progress-value{background:white;border-radius:10px}#loader>progress::-webkit-progress-value{border-radius:10px;background:white}#loader>progress::-webkit-progress-bar{border-radius:10px}.video{margin:0 auto;width:1280px;height:720px;display:none}#main .logo-wrapper{display:flex;justify-content:end;align-items:end;width:100%}#main .logo{max-height:60px;margin:0}#camera{grid-area:camera;height:100%;min-height:unset;position:relative;overflow:hidden}#content{grid-area:content;height:100%;display:flex;flex-direction:column;justify-content:flex-start;padding:8px;visibility:hidden}#skintone-result{display:flex;align-items:center;gap:8px;margin:8px}.modal{position:fixed;height:100%;width:100%;top:0;left:0;background-color:rgba(0,0,0,.4);display:none;justify-content:center;align-items:center}.modal-card{width:90%;max-width:600px;height:90%;max-height:920px;color:#fff;background-color:#111;border-radius:8px;padding:8px;box-shadow:rgba(0,0,0,.16) 0 1px 4px;display:flex;flex-direction:column}.modal-card h1{margin-top:0}.modal-card flag{height:20px;cursor:pointer}.modal-card>.content{padding:4px;flex:1 1 auto;height:calc(100% - 48px);overflow-y:scroll}.modal-card>h1{padding:4px;border-bottom:1px solid gray}.modal-card>.actions{flex:1 1 auto;height:48px;display:flex;justify-content:end;align-items:center;gap:8px;padding:4px}.button-primary{align-items:center;background-color:#0a66c2;border:0;border-radius:100px;box-sizing:border-box;color:#fff;cursor:pointer;display:inline-flex;font-family:-apple-system,system-ui,system-ui,Segoe UI,Roboto,Helvetica Neue,Fira Sans,Ubuntu,Oxygen,Oxygen Sans,Cantarell,Droid Sans,"Apple Color Emoji","Segoe UI Emoji",Segoe UI Symbol,Lucida Grande,Helvetica,Arial,sans-serif;font-size:16px;font-weight:600;justify-content:center;line-height:20px;max-width:480px;min-height:40px;min-width:0px;overflow:hidden;padding:0 20px;text-align:center;touch-action:manipulation;transition:background-color .167s cubic-bezier(.4,0,.2,1) 0s,box-shadow .167s cubic-bezier(.4,0,.2,1) 0s,color .167s cubic-bezier(.4,0,.2,1) 0s;user-select:none;-webkit-user-select:none;vertical-align:middle}.button-primary:hover,.button-primary:focus{background-color:#16437e;color:#fff}.button-primary:active{background:#09223b;color:rgba(255,255,255,.7)}.button-primary:disabled{cursor:not-allowed;background:rgba(0,0,0,.08);color:rgba(0,0,0,.3)}@media (min-width: 900px) and (orientation: landscape){#content{overflow-y:auto}}@font-face{font-family:GothamLight;src:url(/fonts/GothamLight.woff2) format("woff2"),url(/fonts/GothamLight.woff) format("woff"),url(/fonts/GothamLight.ttf) format("truetype")}@font-face{font-family:GothamBold;src:url(/fonts/GothamBold.woff2) format("woff2"),url(/fonts/GothamBold.woff) format("woff"),url(/fonts/GothamBold.ttf) format("truetype")}*{box-sizing:border-box}@media screen and (min-width: 50em){html{font-size:18px}}body{font-family:GothamLight;font-size:inherit;margin:0;padding:0;width:100vw;height:100vh;background-color:#000}.unselectable{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}[hidden=false]{display:initial}[hidden]:not([hidden="false"]){display:none!important}#main{position:absolute;width:100%;height:100%;padding:3%;column-gap:3%;background-color:#000;display:grid;grid-template-rows:1fr;grid-template-columns:55% 42%;grid-template-areas:"camera content";place-items:start}@media (orientation: portrait){#main{display:grid;padding:1% 0%;grid-template-columns:100%;grid-template-rows:auto 1fr auto;grid-template-areas:"title" "camera" "content-area";place-items:center;row-gap:1%;column-gap:unset}#camera{grid-area:camera;height:100%;min-height:70vh}#content{grid-area:content-area;display:flex!important;flex-direction:column;align-items:center;margin-top:10px;margin-bottom:10px;padding:8px;min-height:150px;width:90%;box-sizing:border-box}#content h2,#skintone-result #monk-txt,#skintone-result #rgb-txt{color:#fff!important}}#container{position:relative;place-self:stretch;grid-area:camera;overflow:hidden;z-index:0}.analysis-component{position:relative;margin-top:3rem;display:flex}.analysis-component_title{position:absolute;left:0;top:calc((1rem + 8px)*-1);height:calc(2rem + 16px);padding:8px;border-radius:20px;display:flex;flex-direction:row;justify-content:start;align-items:center;font-family:GothamBold;background:linear-gradient(0,#5c6466,#879097);box-shadow:inset 0 0 1px 1px rgba(255,255,255,.2),0 1px 1px rgba(0,0,0,.6);min-width:240px}.analysis-component_title--success{background:linear-gradient(0,#2eba87,#19b371)}.analysis-component_title_text{text-transform:capitalize;font-size:2rem}.analysis-component_title_icon{width:2rem;height:2rem;margin-right:8px}.analysis-component_body{background:linear-gradient(0,#2e2d2d,#373837);box-shadow:inset 0 0 1px 1px rgba(255,255,255,.1),0 1px 1px rgba(0,0,0,.6);border-radius:0 20px 20px;padding:calc(1rem + 16px) calc(2rem + 8px) 2px calc(2rem + 8px)}.analysis-suggestions{margin:1rem 0;display:flex;flex-wrap:wrap;gap:1rem}.analysis-label{font-family:GothamBold;margin:0 0 1rem}.logo{grid-area:logo;object-fit:cover;max-height:10vh;width:33%}@media (orientation: portrait){.logo{width:25%}}.title{grid-area:title;color:#fff;display:flex;flex-direction:column}@media (orientation: portrait){.title{place-items:center}}.titleTop{font-family:GothamBold;font-size:2rem;line-height:2rem}.titleBottom{font-family:GothamLight;font-size:2rem;line-height:2rem}.description{grid-area:description;color:#fff}@media (orientation: portrait){.description{display:none}}#face-position-mask{position:absolute;width:100%;height:100%;top:50%;left:50%;transform:translate(-50%,-50%);stroke:#fff;stroke-width:1.5px;fill:rgba(0,0,0,.4);transition:fill .8s ease-out}#face-position-mask g{transform-origin:2050px 2050px;transform:scale(30)}@media (orientation: portrait){#face-position-mask g{transform:scale(38)}}#face-position-mask.success{stroke:#06954f;fill:transparent}#face-position-mask.success-1{stroke:#dfff00;fill:transparent}#face-position-mask.success-2{transition:fill,stroke .25s ease-out;stroke:transparent;fill:transparent}#position-hint{position:absolute;font-size:1.4rem;color:#fff;top:50%;left:50%;transform:translate(-50%,-50%);filter:drop-shadow(1px 1px 1px rgba(0,0,0,.8))}#well-lit-hint{position:absolute;top:0;left:0;padding:1rem;color:#fff;display:flex;align-items:center;filter:drop-shadow(1px 1px 1px rgba(0,0,0,.8))}#clear-btn{position:absolute;top:.5rem;right:.5rem;color:#fff;display:flex;width:4rem;height:4rem;cursor:pointer;transition:filter .2s ease-out;transform:scale(1);filter:drop-shadow(0 3px 1px rgba(0,0,0,.6))}#clear-btn:hover{filter:drop-shadow(0 4px 3px rgba(0,0,0,.6))}#clear-btn:active{filter:drop-shadow(0 0 0px rgba(0,0,0,.9))}