.result-container {
        display: none;
    }
.hexagram-comparison {
        display: flex;
        align-items: center;
        justify-content: center;
        flex-wrap: wrap;
        gap: 1rem;
        margin-bottom: 2rem;
    }

    .hexagram-card {
        flex: 1;
        min-width: 250px;
        padding: 1.5rem;
        border-radius: 12px;
        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    }

    .original-hexagram {
        background: linear-gradient(135deg, #f5f7fa, #e4e8eb);
        border: 1px solid #2c5364;
    }

    .changed-hexagram {
        background: linear-gradient(135deg, #fff8f0, #ffebd5);
        border: 1px solid #d35400;
    }

    .hexagram-header {
        display: flex;
        align-items: center;
        gap: 1rem;
    }

    .hexagram-info {
        flex: 1;
    }

    .hexagram-label {
        display: inline-block;
        padding: 0.3rem 0.8rem;
        border-radius: 20px;
        color: white;
        font-size: 0.8rem;
        margin-top: 0.5rem;
    }

    .change-arrow {
        padding: 0 1rem;
        display: flex;
        align-items: center;
    }

    @media (max-width: 768px) {
        .hexagram-comparison {
            flex-direction: column;
        }

        .change-arrow {
            transform: rotate(90deg);
            padding: 1rem 0;
        }
    }

    .gua-explanation {
        margin-top: 1rem;
    }

    .gua-header {
        margin-bottom: 1rem;
        font-size: 1.2rem;
    }

    .detail-text {
        transition: all 0.3s ease;
    }

    .detail-text:hover {
        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    }

    /* AI 分析表单样式 */
    #gua-ai-form textarea:focus,
    #gua-ai-form input:focus {
        outline: none;
        border-color: #2c5364;
        box-shadow: 0 0 0 3px rgba(44, 83, 100, 0.1);
    }

    #gua-ai-submit-btn:hover:not(:disabled) {
        opacity: 0.9;
        transform: translateY(-1px);
    }

    #gua-ai-submit-btn:disabled {
        opacity: 0.6;
        cursor: not-allowed;
    }

    #ai-analysis-section.show {
        animation: fadeInUp 0.5s ease-out;
    }

    @keyframes fadeInUp {
        from {
            opacity: 0;
            transform: translateY(20px);
        }
        to {
            opacity: 1;
            transform: translateY(0);
        }
    }
