@font-face{font-family:'Baloo 2';font-style:normal;font-weight:600 800;font-display:swap;src:url(fonts/baloo2-latin.woff2) format('woff2')}
@font-face{font-family:'Nunito';font-style:normal;font-weight:600 900;font-display:swap;src:url(fonts/nunito-latin.woff2) format('woff2')}

html,body{margin:0;height:100%;overflow:hidden;overscroll-behavior:none;touch-action:manipulation;background:#e8f0f3}
*{box-sizing:border-box}
a{color:#3b7dd8}a:hover{color:#23283a}
button,input{font-family:inherit}

#app{position:relative;width:100%;height:100dvh;overflow:hidden;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none;font-family:'Nunito',sans-serif;color:#23283a;background:linear-gradient(180deg,#cfe6f3 0%,#f3f1e6 100%)}
#scene{position:absolute;inset:0;cursor:grab;touch-action:none}
#ui{display:contents}
#confetti{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}

/* pressed states of the chunky buttons */
.p6:active{transform:translateY(4px)!important;box-shadow:0 2px 0 #23283a!important}
.p4:active{transform:translateY(3px)!important;box-shadow:0 1px 0 #23283a!important}

/* white-label edition: big place badge instead of the 3D house */
.stage{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:10px;padding:clamp(130px,18vh,170px) 16px 0;pointer-events:none}
.stage-disc{width:min(30vw,15vh,160px);aspect-ratio:1;border-radius:50%;border:5px solid #23283a;box-shadow:0 8px 0 #23283a;display:flex;align-items:center;justify-content:center;font-family:'Baloo 2',sans-serif;font-weight:800;font-size:min(16vw,8vh,90px);line-height:1;transition:background .4s}
.stage-name{display:none;font-family:'Baloo 2',sans-serif;font-weight:800;font-size:clamp(26px,3.4vw,48px);line-height:1;text-align:center;opacity:.85}
.stage-l{display:none}
@media (min-width:900px){
  .stage,.stage-l{display:flex;justify-content:center;padding:120px 16px 40px}
  .stage-disc{width:min(28vw,40vh,340px);border-width:6px;box-shadow:0 10px 0 #23283a;font-size:min(14vw,20vh,170px)}
  .stage-name{display:block}
  .stage-l{padding-left:500px}
  .stage-r{padding-right:450px}
}