/* Mobile enhancements without touching existing desktop styles */

@media (max-width: 768px) {
    .container { padding-left: 16px; padding-right: 16px; }
    .hero-title { font-size: 1.75rem; }
    .hero-subtitle { font-size: 0.95rem; }
    .magical-input-card, .content-section, .seo-content { padding: 16px; }
    .pill-toggle-container { gap: 8px; flex-wrap: wrap; }
    .pill-toggle-option { width: 100%; }
    .spread-options { grid-template-columns: 1fr 1fr !important; gap: 12px; }
    .cards-container { grid-template-columns: repeat(3, 1fr); gap: 8px; }
    .share-modal .modal-content { width: 96%; margin: 0 auto; }
    .floating-footer .footer-content { flex-direction: column; gap: 8px; }
}

@media (max-width: 480px) {
    .hero-title { font-size: 1.5rem; }
    .cards-container { grid-template-columns: repeat(2, 1fr); }
    .reading-type-label { margin-bottom: 8px; }
    .api-key-form { flex-direction: column; gap: 8px; }
    .api-buttons { display: flex; gap: 8px; width: 100%; }
    .api-buttons .btn, .api-buttons button { flex: 1; }
}

/* Defensive ad styles to prevent layout breaks on mobile */
@media (max-width: 768px) {
    .mobile-hidden, .excluded-ad, .hidden {
        display: none !important;
        visibility: hidden !important;
        height: 0 !important;
        min-height: 0 !important;
        max-height: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
        pointer-events: none !important;
    }

    /* Collapse aggressive auto-placed/sticky units */
    .google-auto-placed[style*="position: fixed"],
    .adsbygoogle.google-auto-placed[style*="position: fixed"],
    .google-auto-placed[style*="z-index"],
    .adsbygoogle.google-auto-placed[style*="z-index"],
    .google-auto-placed[style*="height: 100%"],
    .adsbygoogle.google-auto-placed[style*="height: 100%"] {
        display: none !important;
        height: 0 !important;
        width: 0 !important;
    }

    /* Keep any allowed ad responsive within content width */
    .adsbygoogle { max-width: 100% !important; height: auto !important; }
}