:root {
    --main-color: #8A2BE2; /* 蓝紫色，比红色更安全，更有“游戏感” */
    --accent-color: #00e5ff; /* 青色荧光 */
    --gold: #ffd700;
}

* { margin: 0; padding: 0; box-sizing: border-box; font-family: sans-serif; }

body {
    background: #0f0c29;
    background: linear-gradient(to bottom, #24243e, #302b63, #0f0c29);
    color: white;
    height: 100vh;
    display: flex; justify-content: center; align-items: center;
    overflow: hidden;
}

.container {
    width: 100%; max-width: 450px; height: 100%;
    padding: 20px;
    display: flex; flex-direction: column;
    justify-content: space-between;
    position: relative;
    text-align: center;
}

/* Header */
.header { padding-top: 10px; }
.logo-box {
    background: rgba(255,255,255,0.1);
    display: inline-flex; align-items: center;
    padding: 8px 16px; border-radius: 30px;
    border: 1px solid rgba(255,255,255,0.2);
}
.star-icon { color: var(--gold); font-size: 20px; margin-right: 8px; }
.logo-text { font-weight: bold; letter-spacing: 1px; font-size: 14px; }

/* Main Visual - 纯CSS画的大礼物盒 */
.main-content { flex: 1; display: flex; flex-direction: column; justify-content: center; align-items: center; }

.gift-box-container { position: relative; margin-bottom: 30px; }
.gift-box {
    font-size: 100px;
    animation: bounce 2s infinite;
    z-index: 2; position: relative;
    filter: drop-shadow(0 0 20px rgba(138, 43, 226, 0.6));
}
.glow-bg {
    position: absolute; top: 50%; left: 50%;
    transform: translate(-50%, -50%);
    width: 200px; height: 200px;
    background: radial-gradient(circle, rgba(138,43,226,0.4) 0%, transparent 70%);
    animation: rotate 10s linear infinite;
}

@keyframes bounce {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-15px); }
}

.headline { font-size: 32px; font-weight: 900; line-height: 1.1; margin-bottom: 10px; }
.sub-headline { color: #ccc; font-size: 16px; max-width: 80%; margin: 0 auto 20px; }

.tag-container { display: flex; gap: 10px; justify-content: center; margin-bottom: 30px; }
.tag {
    font-size: 12px; color: var(--accent-color);
    border: 1px solid var(--accent-color);
    padding: 4px 8px; border-radius: 4px;
    background: rgba(0, 229, 255, 0.1);
}

/* Status Bar */
.status-bar { font-size: 12px; color: #888; display: flex; align-items: center; justify-content: center; gap: 8px;}
.blinking-dot {
    width: 8px; height: 8px; background: #00d26a;
    border-radius: 50%; animation: blink 1s infinite;
}
@keyframes blink { 50% { opacity: 0.3; } }

/* Button */
.hidden { display: none; }
.action-btn {
    background: linear-gradient(90deg, #ff416c, #ff4b2b); /* 红色系，强调行动 */
    color: white; border: none;
    padding: 18px 60px; font-size: 20px; font-weight: bold;
    border-radius: 50px; cursor: pointer;
    box-shadow: 0 10px 25px rgba(255, 75, 43, 0.4);
    position: relative; overflow: hidden;
    margin-top: 20px;
    width: 80%;
}
.shimmer {
    position: absolute; top: 0; left: -100%;
    width: 50%; height: 100%;
    background: linear-gradient(to right, transparent, rgba(255,255,255,0.5), transparent);
    transform: skewX(-25deg);
    animation: shimmer 2s infinite;
}
@keyframes shimmer { 100% { left: 200%; } }

/* Footer */
.footer { font-size: 10px; color: #555; margin-bottom: 10px; }
.links span { text-decoration: underline; cursor: pointer; }