*{font-family: 'Ownglyph_ParkDaHyun';margin: 0;padding: 0;}
@font-face {font-family: 'Galmuri7';font-weight: normal;font-style: normal;font-display: swap;src: url('https://cdn.jsdelivr.net/gh/fonts-archive/Galmuri7/Galmuri7.woff2') format('woff2')}
@font-face {font-family: 'Ownglyph_ParkDaHyun';src: url('https://fastly.jsdelivr.net/gh/projectnoonnu/2411-3@1.0/Ownglyph_ParkDaHyun.woff2') format('woff2');font-weight: normal;font-style: normal;}
body{background-color: #ffe5b6;user-select: none;-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;}
#loading_screen {position: fixed;top: 0; left: 0;width: 100%; height: 100%;background: white;display: flex;flex-direction: column;justify-content: center;align-items: center;z-index: 9999;transition: transform 2s cubic-bezier(.6,0,.45,.82);}
.cookie_spin {font-size: 80px;animation: spin 1s linear infinite;}
@keyframes spin {100% { transform: rotate(360deg);}}
.hide {transform: translateY(-100%);}
div.all div.top h1{text-align: center;margin-top: 15px;}
div.all div.top p.cookie_count{font-family: 'Galmuri7';text-align: center; font-size: 32px;margin: 10px;}
div.all div.mid{height: 33vh;display: flex;justify-content: space-between;}
div.all div.mid div.mid_left{margin: 20px;margin-left: 3%;position: relative;top: 50px;}
div.all div.mid div.mid_left button{background-color: #ffc75e;border: #ffac11 solid 5px;padding: 15px;font-size: 20px;border-radius: 15px;}
div.all div.mid div.mid_left button:hover{transform: scale(1.05);}
div.all div.mid div.mid_left button:active{transform: scale(0.975);}
div.all div.mid div.mid_left p.under_the_cookie{margin-top: 5px;position: relative;left: 15px;}
div.all div.mid div.mid_right{height: 99vh;position: relative; bottom: 50%;overflow: hidden;}
div.all div.mid div.mid_right button{position: relative;bottom: 5%;height: 110%;background: #ffc75e;border: #ffa600 3px solid;padding-left: 5px;padding-right: 5px;letter-spacing: 4px;writing-mode: vertical-lr;cursor: pointer;transition: transform 0.25s cubic-bezier(.6,0,.45,.82);z-index: 1000;}
#upgrade.active {position: fixed;top: -5%;transform: translateX(-250px);}
#upgrade_menu {position: fixed;height: 100%;top: 50%;right: 0;transform: translateY(-50%) translateX(100%);background: #fff;border: 2px solid #333;padding: 20px;transition: transform 0.3s cubic-bezier(.6,0,.45,.82);;z-index: 999;width: 190px;}
#upgrade_menu.show {transform: translateY(-50%) translateX(0);}.number{font-family: 'Galmuri7';}
.up_button{background-color: #e7e7e7;border-radius: 5px; padding: 5px;margin-top: 15px; position: relative;left: 5px;}
.up_button:hover{transform: scale(1.05);}
.up_button:active{transform: scale(0.975);}
.falling-cookie {position: absolute;animation-name: fall;animation-timing-function: ease-out; animation-fill-mode: forwards;pointer-events: none;will-change: transform, opacity;}
@keyframes fall {0% {transform: translateY(0) rotate(0deg);opacity: 1;}100% {transform: translateY(100vh) rotate(360deg);opacity: 0;}}
@media (max-width: 768px) {
    div.all div.mid div.mid_left {margin: 10px; top: 0;}
    div.all div.mid div.mid_left button {font-size: 16px; padding: 10px;}
    div.all div.mid div.mid_right {position: relative; bottom: 170px;}
    div.all div.mid div.mid_right button{position: relative; top: 10px;}
}

@media (max-width: 480px) {
    div.all div.top h1 {font-size: 24px;}
    div.all div.top p.cookie_count {font-size: 24px;}
    .cookie_spin {font-size: 60px;}
    .up_button {font-size: 14px; padding: 3px;}
}