@font-face {
    font-family: 'ZCOOL KuaiLe';
    src: url('fonts/zcool-kuaile.ttf') format('truetype');
    font-display: swap;
}

html {
    min-height: 100%;
    background: #fff5f8;
}

body {
    min-height: 100dvh;
    padding-top: max(20px, env(safe-area-inset-top));
    padding-right: max(20px, env(safe-area-inset-right));
    padding-bottom: max(20px, env(safe-area-inset-bottom));
    padding-left: max(20px, env(safe-area-inset-left));
    overscroll-behavior-y: none;
    -webkit-tap-highlight-color: transparent;
}

button,
input,
textarea,
select {
    font-size: 16px;
}

button,
a,
input,
textarea,
select {
    touch-action: manipulation;
}

@media (max-width: 500px) {
    body {
        padding-top: max(14px, env(safe-area-inset-top));
        padding-right: max(12px, env(safe-area-inset-right));
        padding-bottom: max(18px, env(safe-area-inset-bottom));
        padding-left: max(12px, env(safe-area-inset-left));
    }
}