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

        body {
            font-family: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
            background: #fff;
            color: #333;
            line-height: 1.7;
        }

        .nav {
            background: #7DA5F3;
            padding: 16px 20px;
            display: flex;
            align-items: center;
        }
        .nav a { display: flex; align-items: center; }
        .nav img { width: 40px; height: 40px; border-radius: 8px; }

        .breadcrumb {
            max-width: 860px;
            margin: 0 auto;
            padding: 20px 20px 0;
            font-size: 14px;
        }
        .breadcrumb a { color: #7DA5F3; text-decoration: none; }
        .breadcrumb a:hover { text-decoration: underline; }

        .hero {
            max-width: 860px;
            margin: 0 auto;
            padding: 50px 20px 20px;
        }
        .hero h1 {
            font-size: 44px;
            line-height: 1.2;
            color: #333;
            margin-bottom: 16px;
        }
        .hero p {
            font-size: 20px;
            color: #666;
            max-width: 680px;
            line-height: 1.6;
        }

        .faq-wrap {
            max-width: 860px;
            margin: 0 auto;
            padding: 50px 20px 80px;
        }

        .faq-category {
            margin-bottom: 50px;
        }
        .faq-category-label {
            font-size: 13px;
            font-weight: 700;
            text-transform: uppercase;
            letter-spacing: 0.08em;
            color: #7DA5F3;
            margin-bottom: 20px;
        }

        details {
            border-bottom: 1px solid #e8e8e8;
        }
        details:first-of-type {
            border-top: 1px solid #e8e8e8;
        }
        summary {
            font-size: 18px;
            font-weight: 600;
            color: #333;
            padding: 22px 36px 22px 0;
            cursor: pointer;
            list-style: none;
            position: relative;
            line-height: 1.4;
        }
        summary::-webkit-details-marker { display: none; }
        summary::after {
            content: '+';
            position: absolute;
            right: 4px;
            top: 50%;
            transform: translateY(-50%);
            font-size: 22px;
            font-weight: 300;
            color: #7DA5F3;
            line-height: 1;
            transition: transform 0.2s;
        }
        details[open] summary::after {
            content: '−';
        }
        summary:hover { color: #7DA5F3; }

        .answer {
            padding: 0 0 24px;
            font-size: 17px;
            color: #555;
            line-height: 1.8;
        }
        .answer p { margin-bottom: 14px; }
        .answer p:last-child { margin-bottom: 0; }
        .answer a { color: #7DA5F3; text-decoration: none; font-weight: 600; }
        .answer a:hover { text-decoration: underline; }
        .answer strong { color: #333; }

        .cta-box {
            background: linear-gradient(135deg, #7DA5F3, #9BBEF7);
            color: white;
            padding: 50px 40px;
            border-radius: 16px;
            text-align: center;
            margin-top: 60px;
        }
        .cta-box h2 { font-size: 28px; margin-bottom: 14px; color: white; }
        .cta-box p { font-size: 18px; margin-bottom: 30px; opacity: 0.95; }
        .download-section { margin-top: 10px; }
        .app-store-badge { display: inline-block; margin: 8px; }
        .app-store-badge img { height: 50px; width: auto; vertical-align: middle; }
        .app-store-badge img[alt*="App Store"] { height: 35px; }

        .related {
            background: #f8f9fa;
            padding: 36px;
            border-radius: 12px;
            margin-top: 50px;
        }
        .related h3 { font-size: 20px; margin-bottom: 18px; color: #333; }
        .related ul { list-style: none; padding: 0; }
        .related ul li { margin-bottom: 12px; }
        .related ul a { color: #7DA5F3; font-size: 16px; font-weight: 600; text-decoration: none; }
        .related ul a:hover { text-decoration: underline; }

        @media (max-width: 768px) {
            .hero h1 { font-size: 32px; }
            .hero p { font-size: 17px; }
            summary { font-size: 17px; }
            .answer { font-size: 16px; }
            .cta-box { padding: 36px 24px; }
            .cta-box h2 { font-size: 24px; }
        }