* { margin: 0; padding: 0; box-sizing: border-box; }

body {

    font-family: -apple-system, 'PingFang SC', 'Microsoft YaHei', sans-serif;

    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);

    min-height: 100vh;

    display: flex;

    align-items: center;

    justify-content: center;

    padding: 20px;

}

.container {

    max-width: 640px;

    width: 100%;

    background: #fff;

    border-radius: 24px;

    padding: 40px;

    box-shadow: 0 20px 60px rgba(0,0,0,0.15);

}

.header {

    text-align: center;

    margin-bottom: 40px;

}

.title {

    font-size: 36px;

    color: #1a1a1a;

    margin-bottom: 8px;

}

.subtitle {

    font-size: 16px;

    color: #888;

}

.content {

    margin-bottom: 40px;

}

.feature-list {

    display: flex;

    flex-direction: column;

    gap: 16px;

    margin-bottom: 40px;

}

.feature-item {

    display: flex;

    align-items: center;

    gap: 16px;

    padding: 16px;

    background: #f8f9fa;

    border-radius: 16px;

    transition: transform 0.2s;

}

.feature-item:hover {

    transform: translateY(-2px);

}

.feature-icon {

    width: 32px;

    height: 32px;

    flex-shrink: 0;

}

.feature-item h3 {

    font-size: 16px;

    color: #333;

    margin-bottom: 4px;

}

.feature-item p {

    font-size: 14px;

    color: #888;

}

.download-section {

    margin-bottom: 40px;

}

.download-title {

    font-size: 20px;

    color: #1a1a1a;

    margin-bottom: 20px;

    text-align: center;

}

.download-list {

    display: flex;

    flex-direction: column;

    gap: 16px;

}

.download-item {

    display: flex;

    align-items: center;

    justify-content: space-between;

    padding: 20px;

    border: 2px solid #e8e8e8;

    border-radius: 16px;

    transition: all 0.2s;

}

.download-item:hover:not(.disabled) {

    border-color: #667eea;

    box-shadow: 0 4px 12px rgba(102,126,234,0.2);

}

.download-item.disabled {

    opacity: 0.6;

    background: #fafafa;

}

.download-info {

    display: flex;

    align-items: center;

    gap: 12px;

}

.platform-icon {

    width: 36px;

    height: 36px;

    flex-shrink: 0;

}

.download-info h3 {

    font-size: 16px;

    color: #333;

    margin-bottom: 4px;

}

.version-text {

    font-size: 13px;

    color: #667eea;

}

.dev-text {

    font-size: 13px;

    color: #999;

}

.download-btn {

    padding: 10px 24px;

    background: #667eea;

    color: #fff;

    border: none;

    border-radius: 24px;

    font-size: 14px;

    cursor: pointer;

    transition: all 0.2s;

}

.download-btn:hover {

    background: #5568d3;

    transform: scale(1.05);

}

.download-btn.disabled-btn {

    background: #ccc;

    cursor: not-allowed;

}

.footer {

    text-align: center;

    padding-top: 20px;

    border-top: 1px solid #eee;

}

.footer p {

    font-size: 13px;

    color: #aaa;

}

@media (max-width: 480px) {

    .container {

        padding: 24px;

    }

    .title {

        font-size: 28px;

    }

    .download-item {

        flex-direction: column;

        gap: 12px;

        text-align: center;

    }

}