/* 节日特效公共样式 v2.1 */
:root {
    --festival-z: 9999;
    --fest-gold: #ffd700;
    --fest-red: #e60000;
    --fest-scale: 1;
}

.festival-element,
[id$="-effects-container"],
.festival-effects-root {
    --festival-z-local: var(--festival-z);
}

.festival-element,
.festival-effects-root {
    position: fixed;
    inset: 0;
    z-index: var(--festival-z);
    pointer-events: none;
}

.festival-effects-root {
    opacity: 1;
    transition: opacity 0.8s ease;
}

@media (max-width: 768px) {
    :root { --fest-scale: 0.72; }
}

@media (max-width: 480px) {
    :root { --fest-scale: 0.58; }
}

@media (prefers-reduced-motion: reduce) {
    .festival-element,
    [id$="-effects-container"] *,
    .festival-effects-root * {
        animation: none !important;
        transition: none !important;
    }
}

html.festival-gray-active {
    filter: grayscale(100%);
    -webkit-filter: grayscale(100%);
    -moz-filter: grayscale(100%);
    -ms-filter: grayscale(100%);
    transition: filter 0.8s ease;
}

.festival-gray-notice {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 100000;
    padding: 12px 20px;
    background: rgba(30, 30, 30, 0.75);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    color: #f0f0f0;
    font-size: 13px;
    text-align: center;
    pointer-events: none;
    border-top: 1px solid rgba(255, 255, 255, 0.08);
    animation: festNoticeIn 0.6s ease forwards;
}

@keyframes festNoticeIn {
    from { opacity: 0; transform: translateY(100%); }
    to { opacity: 1; transform: translateY(0); }
}

.fest-ripple {
    position: fixed;
    border-radius: 50%;
    border: 3px solid rgba(78, 115, 223, 0.6);
    z-index: 10001;
    pointer-events: none;
    transform: translate(-50%, -50%) scale(0);
    animation: festRippleAnim 1s cubic-bezier(0.1, 0.8, 0.3, 1) forwards;
    box-shadow: 0 0 20px rgba(78, 115, 223, 0.4);
}

@keyframes festRippleAnim {
    0% { transform: translate(-50%, -50%) scale(0); opacity: 0.8; }
    100% { transform: translate(-50%, -50%) scale(4); opacity: 0; }
}