:root {
            --site-max-w: 1760px;
            --site-pad-x: 40px;
        }
        @media (max-width: 1200px) { :root { --site-pad-x: 32px; } }
        @media (max-width: 768px)  { :root { --site-pad-x: 20px; } }
        @media (max-width: 480px)  { :root { --site-pad-x: 16px; } }

        
        .header { padding-left: 0 !important; padding-right: 0 !important; }
        
        .footer-links-column h3 { font-size: 14px; font-weight: 600; margin-bottom: 12px; color: inherit; }

        
        @media (max-width: 1760px) {
            .header-inner { padding-left: var(--site-pad-x) !important; padding-right: var(--site-pad-x) !important; }
            .main-layout  { padding-left: var(--site-pad-x) !important; padding-right: var(--site-pad-x) !important; }
        }
        
        .base-impersonation-bar { background: #1d8fe1; color: #fff; padding: 8px 24px; font-size: 13px; display: flex; align-items: center; justify-content: center; gap: 12px; position: relative; z-index: 1001; }
        .base-impersonation-exit { color: #fff; background: rgba(255,255,255,0.2); padding: 4px 12px; border-radius: 6px; font-weight: 600; text-decoration: none; }
        
        .footer-contact-list { margin-top: 12px; }
        
        .base-modal-content { border-radius: var(--radius-lg); border: none; }
        .base-modal-header { border-bottom: 1px solid var(--gray); padding: 20px 24px; }
        .base-modal-title { font-weight: 600; font-size: 20px; margin: 0; }
        .base-modal-desc { color: var(--gray-dark); margin-bottom: 20px; }
        .base-form-label { font-weight: 500; margin-bottom: 8px; display: block; }
        .base-label-hint { color: var(--gray-dark); font-weight: 400; }
        .base-consent-row { display: flex; gap: 8px; align-items: flex-start; font-size: 13px; color: var(--gray-dark); }
        .base-consent-checkbox { margin-top: 3px; }
        .base-modal-footer { border-top: 1px solid var(--gray); padding: 16px 24px; display: flex; gap: 12px; }
        .base-btn-flex-1 { flex: 1; }
        .base-btn-flex-2 { flex: 2; }
        
        .auth-form-hint { color: var(--gray-dark); font-size: 12px; margin-top: 4px; }
        
        .base-success-modal-content { border-radius: 20px; border: none; overflow: hidden; text-align: center; }
        .base-success-modal-top { padding: 40px 32px 0; }
        .base-success-icon-circle { width: 80px; height: 80px; background: linear-gradient(135deg, #34C759 0%, #30B350 100%); border-radius: 50%; display: flex; align-items: center; justify-content: center; margin: 0 auto 24px; }
        .base-success-icon-inner { font-size: 40px; color: #fff; }
        .base-success-heading { font-weight: 700; font-size: 22px; margin-bottom: 12px; }
        .base-success-text { color: var(--gray-dark); font-size: 15px; line-height: 1.6; margin-bottom: 0; }
        .base-success-actions { padding: 24px 32px 32px; display: flex; flex-direction: column; gap: 12px; align-items: center; }
        .base-success-login-btn { width: 100%; padding: 14px 24px; font-size: 16px; }
        .base-success-close-btn { color: var(--gray-dark); }

        /* Scroll-reveal animation (P2) */
        .sr-hidden {
            opacity: 0;
            transform: translateY(20px);
            transition: opacity 0.4s ease, transform 0.4s ease;
        }
        .sr-visible {
            opacity: 1;
            transform: translateY(0);
        }

        /* Auth modal: border-radius consistent with other modals */
        .auth-modal-content { border-radius: var(--radius-lg) !important; }

        /* Mobile full-screen: auth, contact modals */
        @media (max-width: 576px) {
            #authModal .modal-dialog,
            #contactModal .modal-dialog {
                margin: 0; max-width: 100%; min-height: 100vh;
            }
            #authModal .modal-content,
            #contactModal .modal-content {
                border-radius: 0 !important; min-height: 100vh; display: flex; flex-direction: column;
            }
            /* auth modal: body+footer wrapped in auth-form-container */
            #authModal .auth-form-container { flex: 1; display: flex; flex-direction: column; overflow: hidden; }
            #authModal .modal-body { flex: 1; overflow-y: auto; }
            #authModal .modal-footer { flex-shrink: 0; }
            /* contact modal: body/footer are direct children */
            #contactModal .modal-body { flex: 1; overflow-y: auto; }
            #authModal .modal-header,
            #contactModal .modal-header,
            #contactModal .modal-footer { flex-shrink: 0; }
        }