* { margin: 0; padding: 0; box-sizing: border-box; }
        body {
            overflow: hidden;
            background-color: #000;
            font-family: sans-serif;
        }

        /* Loading Overlay */
        #loading-overlay {
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background: #000;
            z-index: 9999;
            display: flex;
            justify-content: center;
            align-items: center;
            transition: opacity 0.5s ease-out;
        }
        .loading-content {
            text-align: center;
            color: #00f7ff;
            font-family: 'Roboto', sans-serif;
        }
        .loading-spinner {
            width: 50px;
            height: 50px;
            border: 3px solid rgba(0, 247, 255, 0.3);
            border-radius: 50%;
            border-top-color: #00f7ff;
            animation: spin 1s ease-in-out infinite;
            margin: 0 auto 20px;
        }
        @keyframes spin {
            to { transform: rotate(360deg); }
        }
        .loading-text {
            font-size: 18px;
            letter-spacing: 2px;
            margin-bottom: 10px;
        }
        .loading-progress {
            font-size: 24px;
            font-weight: bold;
        }

        /* 烟花 Canvas 容器 */
        .stage-container {
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            z-index: 5;
        }
        .canvas-container {
            position: relative;
            width: 100%;
            height: 100%;
        }
        .canvas-container canvas {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
        }

        /* FlipClock 容器 - 居中 */
        .wrapper {
            position: fixed;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            display: flex;
            justify-content: center;
            align-items: center;
            z-index: 20;
        }
        /* FlipClock 放大 3 倍（TwentyFourHourClock: HH:MM:SS = 6数字+2分隔符） */
        .flip-clock-wrapper {
            width: auto !important;
            height: 300px !important;
            position: relative !important;
            margin: 0 !important;
        }
        .flip-clock-wrapper ul {
            width: 180px !important;
            height: 270px !important;
            font-size: 240px !important;
            line-height: 261px !important;
            margin: 15px !important;
            border-radius: 18px !important;
        }
        .flip-clock-wrapper ul li {
            line-height: 261px !important;
        }
        .flip-clock-wrapper ul li a {
            -webkit-perspective: 600px !important;
            perspective: 600px !important;
        }
        .flip-clock-wrapper ul li a div {
            font-size: 240px !important;
        }
        .flip-clock-wrapper ul li a div.up:after {
            top: 132px !important;
            height: 9px !important;
        }
        .flip-clock-wrapper ul li a div div.inn {
            font-size: 210px !important;
            border-radius: 18px !important;
        }
        .flip-clock-divider {
            width: 60px !important;
            height: 300px !important;
        }
        .flip-clock-dot {
            width: 30px !important;
            height: 30px !important;
            left: 15px !important;
        }
        .flip-clock-dot.top {
            top: 90px !important;
        }
        .flip-clock-dot.bottom {
            bottom: 90px !important;
        }

        /* 月亮 */
        .moon {
            position: fixed;
            top: 120px;
            left: 120px;
            width: 100px;
            height: 100px;
            border-radius: 50%;
            background: radial-gradient(circle at 35% 35%, #fff8dc 0%, #ffe066 30%, #ffc107 60%, #ffab00 100%);
            box-shadow:
                0 0 20px rgba(255, 200, 50, 0.8),
                0 0 40px rgba(255, 180, 30, 0.6),
                0 0 80px rgba(255, 160, 0, 0.4),
                0 0 120px rgba(255, 140, 0, 0.3);
            z-index: 8;
            opacity: 0.6;
            transition: opacity 0.5s;
        }
        .moon.hidden { opacity: 0; pointer-events: none; }
        .clouds.hidden { opacity: 0; pointer-events: none; }

        /* 控制按钮组 */
        .control-btns {
            position: fixed;
            right: 30px;
            bottom: 30px;
            display: flex;
            flex-direction: column;
            gap: 10px;
            z-index: 100;
        }
        .ctrl-btn {
            width: 44px;
            height: 44px;
            padding: 0;
            background: rgba(0, 0, 0, 0.5);
            border: 2px solid rgba(255, 255, 255, 0.3);
            cursor: pointer;
            transition: all 0.3s;
            border-radius: 50%;
            display: flex;
            justify-content: center;
            align-items: center;
        }
        .ctrl-btn svg {
            width: 20px;
            height: 20px;
            fill: rgba(255, 255, 255, 0.7);
        }
        .ctrl-btn:hover {
            background: rgba(0, 247, 255, 0.2);
            border-color: #00f7ff;
            box-shadow: 0 0 15px rgba(0, 247, 255, 0.5);
        }
        .ctrl-btn:hover svg { fill: #00f7ff; }
        .ctrl-btn.off { opacity: 0.4; }
        .ctrl-btn.off:hover { opacity: 0.7; }

        /* 触摸设备按钮始终半透明 */
        @media (hover: none) {
            .ctrl-btn {
                opacity: 0.4;
            }
            .ctrl-btn:hover, .ctrl-btn:active, .ctrl-btn:focus {
                background: rgba(0, 0, 0, 0.5);
                border-color: rgba(255, 255, 255, 0.3);
                box-shadow: none;
                opacity: 0.4;
            }
            .ctrl-btn:hover svg, .ctrl-btn:active svg, .ctrl-btn:focus svg {
                fill: rgba(255, 255, 255, 0.7);
            }
            .ctrl-btn.off { opacity: 0.4; }
        }

        /* 日期和标题隐藏 */
        .date-display.hidden, .event-title.hidden { opacity: 0; }

        /* ========== 侧边栏样式 ========== */
        /* 遮罩层 */
        .sidebar-overlay {
            position: fixed;
            inset: 0;
            background: rgba(0, 0, 0, 0.5);
            opacity: 0;
            visibility: hidden;
            transition: all 0.3s ease;
            z-index: 200;
        }
        .sidebar-overlay.active {
            opacity: 1;
            visibility: visible;
        }

        /* 侧边栏 */
        .sidebar {
            position: fixed;
            top: 0;
            right: -320px;
            width: 320px;
            height: 100%;
            background: rgba(0, 0, 0, 0.85);
            backdrop-filter: blur(15px);
            -webkit-backdrop-filter: blur(15px);
            transition: right 0.3s ease;
            z-index: 201;
            color: #fff;
            overflow-y: auto;
            overflow-x: hidden;
        }
        .sidebar.active {
            right: 0;
        }
        .sidebar::-webkit-scrollbar {
            width: 4px;
        }
        .sidebar::-webkit-scrollbar-track {
            background: transparent;
        }
        .sidebar::-webkit-scrollbar-thumb {
            background: rgba(255, 255, 255, 0.2);
            border-radius: 2px;
        }

        /* 侧边栏头部 */
        .sidebar-header {
            display: flex;
            justify-content: space-between;
            align-items: center;
            padding: 20px;
            border-bottom: 1px solid rgba(255, 255, 255, 0.1);
            position: sticky;
            top: 0;
            background: rgba(0, 0, 0, 0.9);
            z-index: 1;
        }
        .sidebar-title {
            font-size: 18px;
            font-weight: 500;
            letter-spacing: 2px;
        }
        .sidebar-close {
            width: 32px;
            height: 32px;
            background: transparent;
            border: none;
            cursor: pointer;
            display: flex;
            align-items: center;
            justify-content: center;
            border-radius: 50%;
            transition: background 0.2s;
        }
        .sidebar-close svg {
            width: 20px;
            height: 20px;
            fill: rgba(255, 255, 255, 0.7);
        }
        .sidebar-close:hover {
            background: rgba(255, 255, 255, 0.1);
        }
        .sidebar-close:hover svg {
            fill: #fff;
        }

        /* 设置项 */
        .setting-item {
            display: flex;
            align-items: center;
            padding: 16px 20px;
            border-bottom: 1px solid rgba(255, 255, 255, 0.06);
            transition: background 0.2s;
        }
        .setting-item:hover {
            background: rgba(255, 255, 255, 0.03);
        }
        .setting-item-column {
            flex-direction: column;
            align-items: stretch;
        }
        .setting-row {
            display: flex;
            align-items: center;
            width: 100%;
            margin-bottom: 12px;
        }
        .setting-icon {
            width: 20px;
            height: 20px;
            fill: rgba(255, 255, 255, 0.5);
            margin-right: 14px;
            flex-shrink: 0;
        }
        .setting-label {
            flex: 1;
            font-size: 14px;
            color: rgba(255, 255, 255, 0.9);
        }
        .setting-value {
            font-size: 12px;
            color: rgba(255, 255, 255, 0.5);
            margin-left: 8px;
        }

        /* 下拉选择 */
        .setting-select {
            background: rgba(255, 255, 255, 0.1);
            border: 1px solid rgba(255, 255, 255, 0.2);
            border-radius: 6px;
            color: #fff;
            padding: 6px 12px;
            font-size: 13px;
            cursor: pointer;
            outline: none;
            min-width: 100px;
        }
        .setting-select:focus {
            border-color: rgba(0, 247, 255, 0.5);
        }
        .setting-select option {
            background: #1a1a1a;
            color: #fff;
        }

        /* 开关按钮 */
        .toggle-switch {
            position: relative;
            width: 44px;
            height: 24px;
            flex-shrink: 0;
        }
        .toggle-switch input {
            opacity: 0;
            width: 0;
            height: 0;
        }
        .toggle-slider {
            position: absolute;
            cursor: pointer;
            inset: 0;
            background: rgba(255, 255, 255, 0.2);
            border-radius: 24px;
            transition: 0.3s;
        }
        .toggle-slider:before {
            position: absolute;
            content: "";
            height: 18px;
            width: 18px;
            left: 3px;
            bottom: 3px;
            background: #fff;
            border-radius: 50%;
            transition: 0.3s;
        }
        .toggle-switch input:checked + .toggle-slider {
            background: #00f7ff;
        }
        .toggle-switch input:checked + .toggle-slider:before {
            transform: translateX(20px);
        }

        /* 切换标签按钮 */
        .setting-tabs {
            display: flex;
            background: rgba(255, 255, 255, 0.1);
            border-radius: 6px;
            overflow: hidden;
        }
        .tab-btn {
            padding: 6px 12px;
            background: transparent;
            border: none;
            color: rgba(255, 255, 255, 0.6);
            font-size: 12px;
            cursor: pointer;
            transition: all 0.2s;
        }
        .tab-btn:hover {
            color: #fff;
        }
        .tab-btn.active {
            background: #00f7ff;
            color: #000;
        }
        /* 预设文字按钮橙色样式 */
        #textPresetTab .tab-btn {
            color: #ff9800;
        }
        #textPresetTab .tab-btn:hover {
            color: #ffb74d;
        }
        #textPresetTab .tab-btn.active {
            background: #00f7ff;
            color: #000;
        }

        /* 滑杆 */
        .setting-range {
            width: 100%;
            height: 4px;
            -webkit-appearance: none;
            appearance: none;
            background: rgba(255, 255, 255, 0.2);
            border-radius: 2px;
            outline: none;
        }
        .setting-range::-webkit-slider-thumb {
            -webkit-appearance: none;
            appearance: none;
            width: 16px;
            height: 16px;
            background: #00f7ff;
            border-radius: 50%;
            cursor: pointer;
            box-shadow: 0 0 10px rgba(0, 247, 255, 0.5);
        }
        .setting-range::-moz-range-thumb {
            width: 16px;
            height: 16px;
            background: #00f7ff;
            border-radius: 50%;
            cursor: pointer;
            border: none;
            box-shadow: 0 0 10px rgba(0, 247, 255, 0.5);
        }

        /* 输入框 */
        .setting-input {
            width: 100%;
            padding: 8px 12px;
            background: rgba(255, 255, 255, 0.1);
            border: 1px solid rgba(255, 255, 255, 0.2);
            border-radius: 6px;
            color: #fff;
            font-size: 13px;
            outline: none;
            transition: all 0.2s;
            margin-top: 8px;
        }
        .setting-input:focus {
            border-color: #00f7ff;
            box-shadow: 0 0 8px rgba(0, 247, 255, 0.3);
        }
        .setting-input::placeholder {
            color: rgba(255, 255, 255, 0.4);
        }
        .setting-hint {
            font-size: 11px;
            color: rgba(255, 255, 255, 0.4);
            margin-top: 6px;
        }

        /* 按钮 */
        .setting-btn {
            padding: 6px 16px;
            background: rgba(255, 255, 255, 0.1);
            border: 1px solid rgba(255, 255, 255, 0.2);
            border-radius: 6px;
            color: #fff;
            font-size: 12px;
            cursor: pointer;
            transition: all 0.2s;
        }
        .setting-btn:hover {
            background: rgba(0, 247, 255, 0.2);
            border-color: #00f7ff;
        }

        /* PWA 安装弹窗 */
        .pwa-modal {
            position: fixed;
            inset: 0;
            background: rgba(0, 0, 0, 0.8);
            display: none;
            justify-content: center;
            align-items: center;
            z-index: 300;
        }
        .pwa-modal.active {
            display: flex;
        }
        .pwa-modal-content {
            background: rgba(30, 30, 30, 0.95);
            border-radius: 16px;
            max-width: 340px;
            width: 90%;
            overflow: hidden;
            backdrop-filter: blur(20px);
            -webkit-backdrop-filter: blur(20px);
        }
        .pwa-modal-header {
            display: flex;
            justify-content: space-between;
            align-items: center;
            padding: 16px 20px;
            border-bottom: 1px solid rgba(255, 255, 255, 0.1);
            font-size: 16px;
            font-weight: 500;
            color: #fff;
        }
        .pwa-modal-close {
            width: 28px;
            height: 28px;
            background: transparent;
            border: none;
            cursor: pointer;
            display: flex;
            align-items: center;
            justify-content: center;
            border-radius: 50%;
        }
        .pwa-modal-close svg {
            width: 18px;
            height: 18px;
            fill: rgba(255, 255, 255, 0.6);
        }
        .pwa-modal-close:hover svg {
            fill: #fff;
        }
        .pwa-modal-body {
            padding: 20px;
            color: rgba(255, 255, 255, 0.8);
            font-size: 14px;
        }
        .pwa-modal-body p {
            margin: 0 0 16px 0;
        }
        .pwa-steps {
            display: flex;
            flex-direction: column;
            gap: 12px;
        }
        .pwa-step {
            display: flex;
            align-items: center;
            gap: 12px;
        }
        .pwa-step-num {
            width: 28px;
            height: 28px;
            background: #00f7ff;
            color: #000;
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            font-weight: 600;
            font-size: 14px;
            flex-shrink: 0;
        }
        .pwa-step-text {
            color: rgba(255, 255, 255, 0.9);
            line-height: 1.4;
        }
        .pwa-share-icon {
            width: 18px;
            height: 18px;
            fill: #00f7ff;
            vertical-align: middle;
            margin: 0 2px;
        }

        /* 桌面端侧边栏放大110% */
        @media (min-width: 769px) {
            .sidebar {
                width: 352px;
                right: -352px;
            }
            .sidebar.active {
                right: 0;
            }
            .sidebar-header {
                padding: 22px 22px;
            }
            .sidebar-title {
                font-size: 19.8px;
            }
            .close-sidebar {
                width: 35px;
                height: 35px;
            }
            .settings-section {
                padding: 0 22px 22px;
            }
            .setting-item {
                padding: 17.6px 0;
            }
            .setting-icon {
                width: 26px;
                height: 26px;
                margin-right: 16.5px;
            }
            .setting-label {
                font-size: 16.5px;
            }
            .toggle-switch {
                width: 48px;
                height: 28.6px;
            }
            .toggle-slider:before {
                width: 22px;
                height: 22px;
                left: 4px;
                bottom: 3.3px;
            }
            input:checked + .toggle-slider:before {
                transform: translateX(20px);
            }
            .tab-container {
                margin-bottom: 16.5px;
            }
            .tab-btn {
                padding: 8.8px 16.5px;
                font-size: 14.3px;
            }
            .settings-tip {
                font-size: 12.1px;
                margin-top: 11px;
                padding: 11px;
            }
            .tips-icon {
                width: 19.8px;
                height: 19.8px;
            }
            .setting-select {
                padding: 6.6px 13.2px;
                font-size: 14.3px;
                min-width: 110px;
                border-radius: 6.6px;
            }
            .setting-input {
                padding: 8.8px 13.2px;
                font-size: 14.3px;
                border-radius: 6.6px;
                margin-top: 8.8px;
            }
            .setting-hint {
                font-size: 12.1px;
                margin-top: 6.6px;
            }
            .setting-btn {
                padding: 6.6px 17.6px;
                font-size: 14.3px;
            }
        }

        /* 侧边栏响应式 - 平板 */
        @media (min-width: 601px) and (max-width: 768px) {
            .sidebar {
                width: 360px;
                right: -360px;
            }
        }

        /* 侧边栏响应式 - 手机 */
        @media (max-width: 600px) {
            .sidebar {
                width: 85vw;
                max-width: 320px;
                right: -85vw;
            }
            .setting-item {
                padding: 14px 16px;
            }
            .setting-label {
                font-size: 13px;
            }
        }

        /* 倒计时特效 */
        #countdownDisplay {
            position: fixed;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            z-index: 60;
            display: none;
        }
        .countdown-number {
            font-family: 'Arial Black', sans-serif;
            font-size: 400px;
            color: #00f7ff;
            text-shadow: 
                0 0 20px #00f7ff,
                0 0 40px #00f7ff,
                0 0 80px #0066ff;
        }
        @keyframes countdownPulse {
            0% { transform: scale(0.5); opacity: 0; }
            20% { transform: scale(1.2); opacity: 1; }
            100% { transform: scale(1); opacity: 1; }
        }

        /* 文字从超大缩小到正常的入场动画 */
        @keyframes zoomInFromHuge {
            0% {
                transform: scale(8);
                opacity: 0;
            }
            30% {
                opacity: 1;
            }
            100% {
                transform: scale(1);
                opacity: 1;
            }
        }

        /* 新年快乐文字 */
        #happyNewYear {
            position: fixed;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            z-index: 60;
            display: none;
            text-align: center;
        }

        .year-text {
            font-family: 'Roboto', 'Arial Black', sans-serif;
            font-size: 300px;
            font-weight: 900;
            background-image: url(https://eud3.oss-cn-hangzhou.aliyuncs.com/libs/ossnewyear/img/stars-twinkling.gif);
            -webkit-background-clip: text;
            background-clip: text;
            -webkit-text-fill-color: transparent;
            filter: url(#golden-stroke-year);
            margin-bottom: 20px;
        }

        .greeting-text {
            font-family: 'Roboto', 'Arial Black', sans-serif;
            font-size: 90px;
            font-weight: 900;
            background-image: url(https://eud3.oss-cn-hangzhou.aliyuncs.com/libs/ossnewyear/img/stars-twinkling.gif);
            -webkit-background-clip: text;
            background-clip: text;
            -webkit-text-fill-color: transparent;
            filter: url(#golden-stroke-greeting);
            letter-spacing: 20px;
        }

        /* 时钟容器布局 */
        .clock-container {
            display: flex;
            flex-direction: column;
            align-items: center;
        }

        /* 日期显示 */
        .date-display {
            color: rgba(255, 255, 255, 0.9);
            font-size: 36px;
            font-weight: 300;
            letter-spacing: 8px;
            margin-bottom: 30px;
            text-shadow: 0 0 10px rgba(255, 255, 255, 0.5);
        }

        /* 标题文字 */
        .event-title {
            color: rgba(255, 255, 255, 0.8);
            font-size: 28px;
            font-weight: 300;
            letter-spacing: 6px;
            margin-top: 30px;
        }
        .event-title a {
            color: rgba(255, 255, 255, 0.8);
            text-decoration: none;
        }

        /* 响应式 - 平板端 */
        @media (max-width: 900px) {
            /* FlipClock 缩小到 2 倍 */
            .flip-clock-wrapper { height: 200px !important; }
            .flip-clock-wrapper ul {
                width: 120px !important;
                height: 180px !important;
                font-size: 160px !important;
                line-height: 174px !important;
                margin: 10px !important;
                border-radius: 12px !important;
            }
            .flip-clock-wrapper ul li { line-height: 174px !important; }
            .flip-clock-wrapper ul li a div { font-size: 160px !important; }
            .flip-clock-wrapper ul li a div.up:after { top: 88px !important; height: 6px !important; }
            .flip-clock-wrapper ul li a div div.inn { font-size: 140px !important; border-radius: 12px !important; }
            .flip-clock-divider { width: 40px !important; height: 200px !important; }
            .flip-clock-dot { width: 20px !important; height: 20px !important; left: 10px !important; }
            .flip-clock-dot.top { top: 60px !important; }
            .flip-clock-dot.bottom { bottom: 60px !important; }

            /* 倒计时数字 */
            .countdown-number { font-size: 280px; }

            /* 其他元素 */
            .year-text { font-size: 150px; filter: url(#golden-stroke-year-mobile); }
            .greeting-text { font-size: 45px; letter-spacing: 10px; filter: url(#golden-stroke-greeting-mobile); }
            .control-btns { right: 15px; bottom: 15px; gap: 8px; }
            .ctrl-btn { width: 38px; height: 38px; }
            .ctrl-btn svg { width: 16px; height: 16px; }
            .date-display { font-size: 24px; letter-spacing: 4px; margin-bottom: 20px; }
            .event-title { font-size: 20px; letter-spacing: 4px; margin-top: 20px; }
            .moon { top: 80px; left: 80px; width: 70px; height: 70px; }
        }

        /* 响应式 - 手机端 (再缩小30%) */
        @media (max-width: 600px) {
            /* FlipClock 缩小到 0.7 倍 */
            .flip-clock-wrapper { height: 67px !important; }
            .flip-clock-wrapper ul {
                width: 41px !important;
                height: 60px !important;
                font-size: 54px !important;
                line-height: 59px !important;
                margin: 3px !important;
                border-radius: 4px !important;
            }
            .flip-clock-wrapper ul li { line-height: 59px !important; }
            .flip-clock-wrapper ul li a div { font-size: 54px !important; }
            .flip-clock-wrapper ul li a div.up:after { top: 29px !important; height: 2px !important; }
            .flip-clock-wrapper ul li a div div.inn { font-size: 47px !important; border-radius: 4px !important; }
            .flip-clock-divider { width: 14px !important; height: 67px !important; }
            .flip-clock-dot { width: 7px !important; height: 7px !important; left: 4px !important; }
            .flip-clock-dot.top { top: 20px !important; }
            .flip-clock-dot.bottom { bottom: 20px !important; }

            /* 倒计时数字 */
            .countdown-number { font-size: 84px; }

            /* 其他元素 */
            .year-text { font-size: 54px; filter: url(#golden-stroke-year-mobile); }
            .greeting-text { font-size: 15px; letter-spacing: 3px; filter: url(#golden-stroke-greeting-mobile); }
            .date-display { font-size: 10px; letter-spacing: 1px; margin-bottom: 10px; }
            .event-title { font-size: 10px; letter-spacing: 1px; margin-top: 10px; }
            .moon { top: 56px; left: 56px; width: 28px; height: 28px; }
        }

        /* 响应式 - 手机横屏 (×2) */
        @media (max-height: 500px) and (orientation: landscape) {
            /* FlipClock */
            .flip-clock-wrapper { height: 120px !important; }
            .flip-clock-wrapper ul {
                width: 72px !important;
                height: 108px !important;
                font-size: 96px !important;
                line-height: 104px !important;
                margin: 4px !important;
                border-radius: 8px !important;
            }
            .flip-clock-wrapper ul li { line-height: 104px !important; }
            .flip-clock-wrapper ul li a div { font-size: 96px !important; }
            .flip-clock-wrapper ul li a div.up:after { top: 52px !important; height: 4px !important; }
            .flip-clock-wrapper ul li a div div.inn { font-size: 84px !important; border-radius: 8px !important; }
            .flip-clock-divider { width: 24px !important; height: 120px !important; }
            .flip-clock-dot { width: 12px !important; height: 12px !important; left: 6px !important; }
            .flip-clock-dot.top { top: 36px !important; }
            .flip-clock-dot.bottom { bottom: 36px !important; }

            /* 倒计时数字 */
            .countdown-number { font-size: 140px; }

            /* 其他元素 */
            .year-text { font-size: 96px; filter: url(#golden-stroke-year-mobile); }
            .greeting-text { font-size: 30px; letter-spacing: 6px; filter: url(#golden-stroke-greeting-mobile); }
            .date-display { font-size: 20px; letter-spacing: 2px; margin-bottom: 12px; }
            .event-title { font-size: 18px; letter-spacing: 2px; margin-top: 12px; }
            .moon { top: 80px; left: 80px; width: 48px; height: 48px; }
            .control-btns { right: 20px; bottom: 20px; gap: 12px; }
            .ctrl-btn { width: 44px; height: 44px; }
            .ctrl-btn svg { width: 20px; height: 20px; }
        }

        /* iOS 音频激活弹窗 */
        .ios-audio-modal {
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background: rgba(0, 0, 0, 0.95);
            display: flex;
            justify-content: center;
            align-items: center;
            z-index: 10000;
        }
        .ios-audio-content {
            text-align: center;
            color: #fff;
            padding: 40px;
            max-width: 320px;
        }
        .ios-audio-icon {
            font-size: 80px;
            margin-bottom: 20px;
            animation: pulse 2s ease-in-out infinite;
        }
        @keyframes pulse {
            0%, 100% { transform: scale(1); }
            50% { transform: scale(1.1); }
        }
        .ios-audio-content h2 {
            font-size: 24px;
            margin-bottom: 12px;
            background: linear-gradient(135deg, #ffd700, #ff6b6b);
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
            background-clip: text;
        }
        .ios-audio-content p {
            font-size: 14px;
            color: rgba(255, 255, 255, 0.7);
            margin-bottom: 30px;
        }
        .ios-audio-btn {
            background: linear-gradient(135deg, #00f7ff, #ff00ff);
            border: none;
            padding: 16px 48px;
            font-size: 18px;
            color: #fff;
            border-radius: 30px;
            cursor: pointer;
            font-weight: bold;
            box-shadow: 0 4px 20px rgba(0, 247, 255, 0.4);
            transition: transform 0.2s, box-shadow 0.2s;
        }
        .ios-audio-btn:active {
            transform: scale(0.95);
        }