#view-badge-page{margin-top:var(--nav-height);height:calc(100vh - var(--nav-height));display:flex;flex-direction:column;padding-bottom:1.5rem;gap:1rem;padding-inline:var(--main-padding);position:relative}#view-badge-page h1,#view-badge-page p{margin-inline:auto}#view-badge-page #mascot-badge-container{aspect-ratio:252/378;width:100%;max-width:21.5rem;margin-inline:auto;height:auto}#view-badge-page #mascot-badge-container #mascot-badge{max-width:none;aspect-ratio:auto;height:100%;max-height:none}.mascot-container{position:relative;display:grid;width:-moz-fit-content;width:fit-content;height:-moz-fit-content;height:fit-content}.mascot-container svg{overflow:visible}.mascot-container .mascot-accessory,.mascot-container .mascot-hat{position:absolute;right:0;top:0;left:0;margin-inline:auto}.mascot-container #mascot-hat-bowler{width:30%;position:absolute;right:0;top:-15%;left:0;margin-inline:auto}.mascot-container #mascot-hat-beret{width:50%;top:-7%;left:12%;margin-inline:0}.mascot-container #mascot-hat-hawk{width:30%;top:-32%}.mascot-container #mascot-hat-ivan{width:30%;top:-12%;left:0;right:0}.mascot-container #mascot-hat-nerve{width:15%;transform:translateY(-56%);left:0;right:0;z-index:-1}.mascot-container #mascot-hat-tophat{width:60%;top:-48%;left:0;right:0}.mascot-container #mascot-accessory-glasses{width:69%;top:8%}.mascot-container #mascot-accessory-bowtie{width:48%;top:42%}.mascot-container #mascot-accessory-monocle{width:28%;top:8%;right:-47%}.mascot-container #mascot-accessory-mustache{width:35%;top:23%}.mascot-container #mascot-accessory-suit{width:78%;top:44%}.mascot-circles-container{display:grid;place-items:center;position:relative;height:100%;bottom:-35%}.mascot-circles-container .mascot-container{position:absolute;transform-origin:bottom;margin-inline:auto;width:35%;left:0;right:0;z-index:1;bottom:12%}.mascot-circles-container .half-badge-circle{aspect-ratio:1;background-color:#fbfefc;border-radius:50%;left:0;right:0;margin-inline:auto;position:absolute;z-index:0}.mascot-circles-container .half-badge-circle.outer{width:100%;background-color:#16643d}.mascot-circles-container .half-badge-circle.middle{width:62.5%;background-color:#68dea3}.mascot-circles-container .half-badge-circle.inner{width:42.5%;background-color:#fbfefc}.folder-tabs-container{display:flex}.folder-tabs-container .folder-tab{position:relative;border:none;background:none;color:#fff;cursor:url(/images/cursors/Cursor-hover.svg),auto;padding:.5rem 1.25rem;margin:0 0 0 .5rem}@media(min-width:300px){.folder-tabs-container .folder-tab{margin-left:1rem}}@media(min-width:400px){.folder-tabs-container .folder-tab{padding:.75rem 1.75rem}}.folder-tabs-container .folder-tab:not(:first-child){margin-left:-12px}.folder-tabs-container .folder-tab:not(:first-child) .active-line3{display:none}.folder-tabs-container .folder-tab span{position:relative;z-index:2;font-family:var(--font-iosevka);font-size:.85rem}@media(min-width:325px){.folder-tabs-container .folder-tab span{font-size:1rem}}@media(min-width:400px){.folder-tabs-container .folder-tab span{font-size:1rem}}@media(min-width:480px){.folder-tabs-container .folder-tab span{font-size:1.2rem}}.folder-tabs-container .folder-tab:after,.folder-tabs-container .folder-tab:before{content:"";position:absolute;top:0;bottom:0;width:50%;background:#000;border:2px solid #fff;transform-origin:bottom;z-index:1}.folder-tabs-container .folder-tab:before{border-radius:8px 0 0 0;border-right:0;left:0;transform-origin:bottom;transform:skew(-15deg)}.folder-tabs-container .folder-tab:after{border-radius:0 8px 0 0;border-left:0;right:0;transform-origin:bottom;transform:skew(15deg)}.folder-tabs-container .active-line1:after,.folder-tabs-container .active-line1:before{content:"";position:absolute;top:0;width:50%;height:100%;background:transparent;border:2px solid #fff;border-top:none;border-bottom:none;z-index:3;overflow:hidden}.folder-tabs-container .active-line1:before{border-radius:10px 0 0 0;border-right:0;left:0;transform-origin:bottom;transform:skew(-15deg)}.folder-tabs-container .active-line1:after{border-radius:0 10px 0 0;border-left:0;right:0;transform-origin:bottom;transform:skew(15deg)}.folder-tabs-container .active-line2{position:absolute;bottom:-1px;background-color:#000;margin-inline:auto;width:calc(100% - 4px);height:5px;left:0;right:0;z-index:2}#form-step4{height:100%;width:100%;display:flex;flex-direction:column}#form-step4-text{opacity:0;animation:FadeIn .8s .9s forwards}@media(min-width:1024px){#form-step4-text{opacity:1;animation:none}}#form-step4-text p:first-child{margin-bottom:1rem}@media(min-width:1024px){#form-step4-text p{font-size:1.5rem}}#form-step4-text span{color:#58c988}@keyframes FadeIn{to{opacity:1}}#form-step4 #mascot-badge-container{padding-block:1rem}@media(min-width:1024px){#form-step4 #mascot-badge-container{display:none}}#mascot-badge-container{position:relative;height:100%;width:100%}#mascot-badge-container #mascot-badge{position:absolute;background-color:#000;left:0;right:0;z-index:1;aspect-ratio:252/378;border:2px solid #fff;border-radius:25px;overflow:hidden;display:flex;flex-direction:column;scale:1;margin-inline:auto;max-width:20.5rem;transform-origin:top}@media(min-width:1024px){#mascot-badge-container #mascot-badge{max-width:23rem;height:auto;max-height:90%;animation:none;transform:translateY(0)}}@media(min-width:1440px){#mascot-badge-container #mascot-badge{max-width:25rem}}@keyframes SlideUpAndScale{0%{transform:translateY(100%) scale(calc(1.1 * var(--badge-scale)))}50%{transform:translateY(-15%) scale(calc(1.1 * var(--badge-scale)))}to{transform:translateY(0) scale(calc(.95 * var(--badge-scale)))}}#mascot-badge-container #mascot-badge:before{content:"";width:100%;height:50%;bottom:0;background-color:transparent;margin-inline:auto;border-radius:0 0 23px 23px;border:8px solid #000;border-top:none;position:absolute;z-index:1}#mascot-badge-container #mascot-badge .badge-top{display:flex;justify-content:space-around;align-items:center;padding:1rem;padding-inline:1rem;border-bottom:3px solid #fff}#mascot-badge-container #mascot-badge .badge-top .long-hole{width:16%;height:60%;border-radius:24px;border:2px solid #fff}#mascot-badge-container #mascot-badge .badge-top .short-hole{width:1rem;aspect-ratio:1;border-radius:50%;border:2px solid #fff}#mascot-badge-container #mascot-badge .badge-top svg{width:35%}#mascot-badge-container #mascot-badge .badge-center{padding:8%}#mascot-badge-container #mascot-badge .badge-center-top{display:flex;justify-content:space-between;position:relative;align-items:center;width:100%}#mascot-badge-container #mascot-badge .badge-center-top.long-name{flex-direction:column;align-items:flex-start}#mascot-badge-container #mascot-badge .badge-center-top.long-name #badge-pronouns-container #vertical-dotted-bar{display:none}#mascot-badge-container #mascot-badge .badge-center-top.long-name #badge-pronouns-container p{padding-left:0;flex-direction:row;padding-top:1rem}#mascot-badge-container #mascot-badge .badge-center-top.long-name h2{font-size:clamp(.9rem,.9rem + 3vw,2rem)}#mascot-badge-container #mascot-badge .badge-center-top h2{display:flex;flex-direction:column;font-style:italic;font-weight:600;font-size:clamp(1rem,1rem + 3vw,2.2rem)}@media(min-width:1024px){#mascot-badge-container #mascot-badge .badge-center-top h2{font-size:2.2rem}}#mascot-badge-container #mascot-badge .badge-center-top #badge-pronouns-container{display:flex}#mascot-badge-container #mascot-badge .badge-center-top p{position:relative;display:flex;flex-direction:column;justify-content:center;padding-left:1.5rem;padding-right:0;font-size:clamp(.7rem,.65rem + 2.3vw,1.4rem)}@media(min-width:1024px){#mascot-badge-container #mascot-badge .badge-center-top p{padding-left:2.5rem}}#mascot-badge-container #mascot-badge .badge-center #horizontal-dotted-bar{margin-block:1rem}#mascot-badge-container #mascot-badge .badge-center-center{display:flex;justify-content:space-between;padding-bottom:1rem;gap:1rem}#mascot-badge-container #mascot-badge .badge-center-center #empty-qr-code{width:55%;aspect-ratio:1;border:2px dashed #fbfefc}#mascot-badge-container #mascot-badge .badge-center-center .badge-code{flex:1 1}#mascot-badge-container #mascot-badge .badge-center-center .badge-code svg{width:55%;height:auto}@media(min-width:1024px){#mascot-badge-container #mascot-badge .badge-center-center .badge-code svg{width:60%}}#mascot-badge-container #mascot-badge .badge-center-center p{flex:1 1;font-weight:400;text-align:right;font-size:clamp(.65rem,.6rem + 2.1vw,1.2rem)}#mascot-badge-container #mascot-badge .badge-bottom{height:100%;z-index:-1;position:relative}.download-button{background-color:#fbfefc;color:#000;text-transform:uppercase;padding:6px;padding-inline:1rem;transition:color .2s,background-color .2s;margin-inline:auto;border-radius:48px;border:2px solid #fbfefc;pointer-events:auto;display:flex;align-items:center;gap:1rem;font-weight:500;font-size:1.25rem}.download-button:hover{background-color:#000;color:#fbfefc}.register-asset-wrapper .register-asset{position:absolute;display:none;pointer-events:none}@media(min-width:1024px){.register-asset-wrapper .register-asset{display:block}}.register-asset-wrapper #register-asset-top-edge{top:0;right:30%}.register-asset-wrapper #register-asset-stacked-papers{top:15%;left:0}.register-asset-wrapper #register-asset-magnify-glass{top:0;right:0}.register-asset-wrapper #register-asset-right-edge{right:0;z-index:1;top:45%}.register-asset-wrapper #register-asset-hole-papers{top:23%;right:0}.register-asset-wrapper #register-asset-polaroid{bottom:12%;left:0}.register-asset-wrapper #register-asset-bottom-left-edge{bottom:0;left:0}.register-asset-wrapper #register-asset-bottom-left-paper{bottom:0;left:0;z-index:-1}.register-asset-wrapper #register-asset-bottom-papers{bottom:0;right:0;z-index:-1}.register-asset-wrapper #register-asset-feather{bottom:0;right:12%}.register-asset-wrapper.simplified #register-asset-bottom-left-paper,.register-asset-wrapper.simplified #register-asset-polaroid,.register-asset-wrapper.simplified #register-asset-stacked-papers{display:none}