@import url('https://fonts.googleapis.com/css2?family=Press+Start+2P&family=Space+Grotesk:wght@400;500;700;800&family=VT323&display=swap');

* {
    -webkit-tap-highlight-color: transparent;
}

html,
body {
    min-height: 100%;
}

.safe-area-bottom {
    padding-bottom: env(safe-area-inset-bottom, 0);
}

.kc-retro {
    letter-spacing: 0.01em;
}

.kc-retro h1,
.kc-retro h2,
.kc-retro h3,
.kc-retro h4,
.kc-retro .retro-headline {
    font-family: 'VT323', monospace;
    letter-spacing: 0.03em;
}

.kc-retro .font-black,
.kc-retro .font-bold {
    letter-spacing: 0.02em;
}

.kc-retro .shadow-sm,
.kc-retro .shadow,
.kc-retro .shadow-md,
.kc-retro .shadow-lg,
.kc-retro .shadow-xl,
.kc-retro .shadow-2xl {
    box-shadow: 0 10px 28px rgba(0, 0, 0, 0.3) !important;
}

.kc-retro .rounded-xl,
.kc-retro .rounded-2xl,
.kc-retro .rounded-3xl {
    border-radius: 1rem;
}

.kc-retro main {
    animation: retroPageIn 220ms ease-out;
}

.kc-retro .hover\:bg-slate-50:hover,
.kc-retro .hover\:bg-slate-100:hover {
    background-color: rgba(255, 209, 102, 0.12) !important;
}

.kc-retro .text-kcPrimary {
    color: #ffb347 !important;
}

.kc-retro .bg-kcPrimary {
    background-color: #ff9f1a !important;
}

.kc-retro .bg-kcSecondary {
    background-color: #f97316 !important;
}

.kc-retro .border-kcPrimary,
.kc-retro .border-kcSecondary {
    border-color: rgba(255, 209, 102, 0.6) !important;
}

.kc-retro #invite-modal,
.kc-retro #announcement-modal,
.kc-retro #alert-modal,
.kc-retro #energy-claim-modal,
.kc-retro [id$='-modal'] {
    animation: retroModalFade 220ms ease-out;
}

@keyframes retroPageIn {
    from {
        opacity: 0;
        transform: translateY(6px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes retroModalFade {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}
