/* --- MOBILE BOTTOM SHEET LAYOUT --- */
@media (max-width: 900px) {
    .main-container {
        padding: 0;
        overflow-x: hidden;
    }

    .page-title,
    .section-desc {
        display: none;
        /* Hide title/desc on mobile to save space */
    }

    .calculator-wrapper {
        display: block;
        /* Stack them */
        position: relative;
    }

    /* Fixed Result Deck */
    .result-card {
        position: fixed;
        top: 90px;
        /* Below Navbar */
        left: 0;
        width: 100%;
        height: 55vh;
        /* Took top 55% */
        z-index: 10;
        border-radius: 0;
        border: none;
        border-bottom: 1px solid rgba(188, 19, 254, 0.3);
        background: rgba(10, 11, 30, 0.95);
        /* More opaque */
        overflow-y: auto;
        /* Allow internal scrolling if content overflows */
        padding: 15px;
        margin: 0;
        box-shadow: none;
        /* Shadow handled by input sheet */
    }

    /* Adjust Result Card Internal Layout for Compactness */
    .result-card .big-number {
        font-size: 2.5rem;
        margin: 5px 0;
    }

    .chart-container {
        height: 180px;
        /* Smaller chart */
        margin-top: 10px;
    }

    .wealth-breakdown {
        padding: 10px;
        margin-bottom: 10px;
    }

    .gap-chart-container {
        width: 80px;
        height: 80px;
    }

    /* Scrollable Input Sheet */
    .input-card {
        position: relative;
        z-index: 20;
        margin-top: 55vh;
        /* Push down by height of result card */
        min-height: 60vh;
        /* Ensure enough scroll space */
        background: #0b0c15;
        /* Solid background to cover fixed results */
        border-radius: 24px 24px 0 0;
        border: 1px solid rgba(0, 243, 255, 0.3);
        border-bottom: none;
        padding: 25px 20px 80px 20px;
        /* Extra bottom padding for scroll */
        box-shadow: 0 -10px 40px rgba(0, 0, 0, 0.8);
    }

    /* Handle Detail/Suggestion sections visibility if needed */
    .smart-suggestions,
    .insights-section,
    .faq-section {
        position: relative;
        z-index: 20;
        background: #050510;
        /* Match body bg */
        padding: 20px;
    }
}

/* Light mode mobile overrides */
@media (max-width: 900px) {
    [data-theme="light"] .result-card {
        background: rgba(255,255,255,0.97);
        border-bottom-color: rgba(37,99,235,0.2);
    }
    [data-theme="light"] .input-card {
        background: #F1F5F9;
        border-color: rgba(37,99,235,0.2);
        box-shadow: 0 -4px 12px rgba(0,0,0,0.06);
    }
    [data-theme="light"] .smart-suggestions,
    [data-theme="light"] .insights-section,
    [data-theme="light"] .faq-section {
        background: #F1F5F9;
    }
}