:root {
    --gmcdt-bg: #030806;
    --gmcdt-bg-2: #06110b;
    --gmcdt-panel: rgba(8, 22, 14, .78);
    --gmcdt-panel-strong: #08160e;
    --gmcdt-gold: #f5c451;
    --gmcdt-gold-soft: #ffe49a;
    --gmcdt-emerald: #13c777;
    --gmcdt-emerald-soft: #67e8a7;
    --gmcdt-line: rgba(245, 196, 81, .18);
}

html, body, form { min-height: 100%; }
body { background: var(--gmcdt-bg); }

.gmcdt-auth-bg {
    background:
        radial-gradient(circle at 16% 18%, rgba(245,196,81,.15), transparent 31%),
        radial-gradient(circle at 82% 74%, rgba(19,199,119,.14), transparent 31%),
        linear-gradient(145deg, #020604 0%, #07120c 46%, #030806 100%);
}

.gmcdt-grid {
    background-image:
        linear-gradient(rgba(255,255,255,.018) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.018) 1px, transparent 1px);
    background-size: 42px 42px;
    mask-image: linear-gradient(to bottom, rgba(0,0,0,.72), transparent 86%);
}

.gmcdt-premium-card {
    background: linear-gradient(145deg, rgba(12,31,20,.84), rgba(5,14,9,.91));
    box-shadow: 0 35px 100px -48px rgba(245,196,81,.55), inset 0 1px 0 rgba(255,255,255,.04);
}

.gmcdt-hero-card {
    background: linear-gradient(145deg, rgba(9,27,17,.82), rgba(3,10,7,.88));
    box-shadow: 0 42px 130px -58px rgba(19,199,119,.42), inset 0 1px 0 rgba(255,255,255,.04);
}

.gmcdt-coin-halo::before {
    content: "";
    position: absolute;
    inset: 18%;
    border-radius: 9999px;
    background: radial-gradient(circle, rgba(19,199,119,.23), rgba(245,196,81,.11) 44%, transparent 70%);
    filter: blur(24px);
}

.gmcdt-gold-text {
    background: linear-gradient(180deg, #fff4c2 0%, #f5c451 45%, #b88118 100%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}

.gmcdt-action {
    background: linear-gradient(100deg, #f7d878 0%, #eab63d 44%, #21c77a 100%);
    box-shadow: 0 18px 45px -20px rgba(245,196,81,.75);
}
.gmcdt-action:hover { filter: brightness(1.08); }

.gmcdt-input:focus {
    border-color: rgba(245,196,81,.58) !important;
    box-shadow: 0 0 0 3px rgba(245,196,81,.10) !important;
}

@media (prefers-reduced-motion: no-preference) {
    .gmcdt-coin-float { animation: gmcdtFloat 6s ease-in-out infinite; }
    @keyframes gmcdtFloat {
        0%, 100% { transform: translateY(0) rotate(-6deg); }
        50% { transform: translateY(-10px) rotate(-3deg); }
    }
}
