:root {
            --primary: #007AFF;
            --bg: #FFFFFF;
            --card: #F5F5F7;
            --text: #1D1D1F;
            --sub: #86868B;
            --border: #F2F2F7;
        }

        body {
            font-family: -apple-system, "SF Pro Display", "PingFang SC", sans-serif;
            background-color: var(--bg);
            color: var(--text);
            margin: 0;
            -webkit-font-smoothing: antialiased;
        }

        /* 顶部导航 */
        .header {
            position: sticky; top: 0; z-index: 100;
            background: rgba(255,255,255,0.8);
            backdrop-filter: blur(20px);
            padding: 14px 20px;
            display: flex; justify-content: space-between; align-items: center;
            border-bottom: 1px solid var(--border);
        }
        .header h1 { font-size: 19px; font-weight: 700; margin: 0; letter-spacing: -0.5px; }
        .download-btn {
            background: var(--primary); color: white;
            padding: 8px 16px; border-radius: 100px;
            font-size: 13px; text-decoration: none; font-weight: 600;
        }

        .container { width: 100%; max-width: 500px; margin: 0 auto; padding: 24px 20px; box-sizing: border-box; }

        /* 媒体区 - 严格 16:9 */
        .media-box {
            background: #000; border-radius: 20px; overflow: hidden;
            box-shadow: 0 12px 30px rgba(0,0,0,0.08); margin-bottom: 24px;
        }
        .media-tabs { display: flex; background: #1D1D1F; padding: 4px; }
        .media-tab {
            flex: 1; text-align: center; padding: 8px; color: #86868B;
            font-size: 12px; font-weight: 600; cursor: pointer; border-radius: 10px;
        }
        .media-tab.active { background: #323236; color: #fff; }
        
        .media-content { 
            position: relative; 
            width: 100%; 
            aspect-ratio: 16 / 9; 
            background: #000;
        }
        .media-item { position: absolute; width: 100%; height: 100%; display: none; }
        .media-item.active { display: block; }
        .media-item img, .media-item video { width: 100%; height: 100%; object-fit: cover; }

        /* 折叠面板 */
        .accordion { margin-bottom: 24px; }
        .accordion-item {
            background: #fff; border-radius: 18px; 
            margin-bottom: 12px; border: 1px solid var(--border); overflow: hidden;
        }
        .acc-header {
            padding: 18px 20px; display: flex; justify-content: space-between; align-items: center;
            cursor: pointer; font-weight: 600; font-size: 15px;
        }
        .acc-content {
            padding: 0 20px; height: 0; overflow: hidden; transition: all 0.3s ease;
            color: var(--sub); font-size: 14px; line-height: 1.6;
        }
        .accordion-item.active .acc-content { height: auto; padding-bottom: 18px; }
        .accordion-item.active .acc-header { color: var(--primary); }
        .btn-inline {
            display: inline-block; margin-top: 12px; padding: 10px 20px;
            background: var(--text); color: #fff; border-radius: 12px;
            text-decoration: none; font-size: 13px; font-weight: 600;
        }

        /* 底部功能磁贴 - 重新加入 */
        .feature-tiles {
            display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px;
            margin-top: 10px;
        }
        .tile {
            background: var(--card); aspect-ratio: 1/1; border-radius: 18px;
            display: flex; flex-direction: column; align-items: center; justify-content: center;
            border: 1px solid var(--border);
            transition: transform 0.2s;
        }
        .tile:active { transform: scale(0.95); }
        .tile-icon { font-size: 20px; margin-bottom: 4px; }
        .tile-name { font-size: 11px; font-weight: 600; color: var(--sub); }

        footer { text-align: center; padding: 40px 0 60px; color: #D2D2D7; font-size: 12px; }
