.mobile-bottom-nav { display: none; }

@media (max-width: 1180px) {
    .split-layout { grid-template-columns: minmax(0, 1fr); }
}

@media (max-width: 900px) {
    html { overflow-x: hidden; scroll-padding-top: 72px; }
    body.app-body {
        min-width: 0;
        padding: 0;
        overflow-x: clip;
        background: #f4f7f2;
    }
    body.app-body.sidebar-open { overflow: hidden; }

    .mobile-bar {
        position: fixed;
        z-index: 45;
        top: 0;
        right: 0;
        left: 0;
        display: grid;
        grid-template-columns: 40px minmax(0, 1fr) auto;
        align-items: center;
        gap: 8px;
        min-height: calc(58px + env(safe-area-inset-top));
        padding: env(safe-area-inset-top) 12px 0;
        border-bottom: 1px solid rgba(205, 222, 206, .95);
        background: rgba(255, 255, 255, .96);
        box-shadow: 0 8px 24px rgba(16, 32, 24, .055);
        backdrop-filter: blur(16px);
    }
    .mobile-menu-button {
        display: inline-grid;
        place-items: center;
        width: 38px;
        height: 38px;
        padding: 0;
        border: 1px solid var(--border);
        border-radius: 12px;
        background: #fff;
        color: var(--green-800);
    }
    .mobile-brand {
        display: flex;
        align-items: center;
        gap: 8px;
        min-width: 0;
    }
    .mobile-brand img {
        width: 24px;
        height: 24px;
        flex: 0 0 auto;
        object-fit: contain;
    }
    .mobile-brand strong {
        overflow: hidden;
        color: var(--green-950);
        font-size: .92rem;
        letter-spacing: -.02em;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
    .mobile-quick-actions { display: inline-flex; align-items: center; gap: 5px; }
    .mobile-action,
    .mobile-avatar {
        display: inline-grid;
        place-items: center;
        width: 36px;
        height: 36px;
        flex: 0 0 auto;
    }
    .mobile-action {
        position: relative;
        border: 1px solid var(--border);
        border-radius: 11px;
        background: #fff;
        color: var(--green-800);
    }
    .mobile-action b {
        position: absolute;
        top: -5px;
        right: -5px;
        display: grid;
        place-items: center;
        min-width: 18px;
        height: 18px;
        padding: 0 4px;
        border: 2px solid #fff;
        border-radius: 999px;
        background: var(--green-800);
        color: #fff;
        font-size: .56rem;
        line-height: 1;
    }
    .mobile-avatar {
        overflow: hidden;
        border-radius: 50%;
        background: var(--green-800);
        color: #fff;
        font-size: .64rem;
        font-weight: 900;
    }
    .mobile-action:hover,
    .mobile-menu-button:hover { border-color: var(--yellow-strong); background: var(--yellow); color: var(--green-950); }

    .app-shell {
        display: block;
        width: 100%;
        min-height: 100dvh;
        margin: 0;
        padding: calc(68px + env(safe-area-inset-top)) 10px calc(82px + env(safe-area-inset-bottom));
    }
    .app-main { width: 100%; min-width: 0; padding: 0; }
    .topbar {
        min-height: 0;
        margin: 0 2px 10px;
        padding: 0;
    }
    .topbar-title { min-width: 0; }
    .topbar .eyebrow { display: none; }
    .topbar h1 {
        overflow-wrap: anywhere;
        font-size: 1.34rem;
        line-height: 1.18;
        letter-spacing: -.035em;
    }
    .topbar-user { display: none; }
    .page-content { min-width: 0; gap: 10px; }

    .sidebar {
        position: fixed;
        z-index: 60;
        top: calc(8px + env(safe-area-inset-top));
        bottom: calc(8px + env(safe-area-inset-bottom));
        left: 8px;
        width: min(304px, calc(100vw - 34px));
        min-height: 0;
        max-height: none;
        padding: 13px;
        border-radius: 19px;
        transform: translateX(calc(-100% - 18px));
        transition: transform 190ms ease;
    }
    .sidebar.is-open { transform: translateX(0); }
    .sidebar-card { display: none; }
    .sidebar-scroll { margin-bottom: 0; }
    .side-nav a { min-height: 46px; font-size: .86rem; }
    .sidebar-backdrop {
        position: fixed;
        z-index: 55;
        inset: 0;
        display: block;
        visibility: hidden;
        opacity: 0;
        background: rgba(11, 27, 17, .48);
        backdrop-filter: blur(2px);
        transition: opacity 170ms ease, visibility 170ms ease;
    }
    .sidebar-backdrop.is-open { visibility: visible; opacity: 1; }

    .mobile-bottom-nav {
        position: fixed;
        z-index: 42;
        right: 8px;
        bottom: calc(7px + env(safe-area-inset-bottom));
        left: 8px;
        display: grid;
        grid-template-columns: repeat(5, minmax(0, 1fr));
        align-items: stretch;
        min-height: 62px;
        padding: 5px;
        border: 1px solid rgba(198, 218, 200, .96);
        border-radius: 18px;
        background: rgba(255, 255, 255, .97);
        box-shadow: 0 14px 36px rgba(16, 32, 24, .16);
        backdrop-filter: blur(18px);
    }
    .mobile-bottom-nav a {
        display: grid;
        place-items: center;
        align-content: center;
        gap: 3px;
        min-width: 0;
        min-height: 50px;
        padding: 4px 2px;
        border-radius: 13px;
        color: #657368;
    }
    .mobile-bottom-nav a > span {
        display: grid;
        place-items: center;
        width: 29px;
        height: 25px;
        border-radius: 10px;
    }
    .mobile-bottom-nav small {
        overflow: hidden;
        width: 100%;
        font-size: .53rem;
        font-weight: 780;
        line-height: 1;
        text-align: center;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
    .mobile-bottom-nav a.is-active { color: var(--green-950); }
    .mobile-bottom-nav a.is-active > span {
        background: linear-gradient(145deg, var(--yellow), #ffea55);
        box-shadow: 0 5px 13px rgba(240, 214, 39, .24);
    }
    body.sidebar-open .mobile-bottom-nav { pointer-events: none; opacity: .22; }

    .card {
        min-width: 0;
        padding: 14px;
        border-radius: 16px;
        box-shadow: 0 8px 24px rgba(16, 32, 24, .055);
    }
    .button,
    button,
    input,
    select,
    textarea { max-width: 100%; }
    .button { min-height: 42px; }
    input,
    select,
    textarea { font-size: 16px; }
    textarea { resize: vertical; }
    img,
    video,
    iframe { max-width: 100%; }
    p,
    strong,
    small,
    span,
    a { overflow-wrap: anywhere; }

    .form-grid,
    .search-form { min-width: 0; }
    .form-grid { grid-template-columns: 1fr; }
    .field.full,
    .form-grid > .full { grid-column: auto; }
    .field,
    .checkbox-field,
    .form-control { min-width: 0; width: 100%; }

    .split-layout,
    .social-layout,
    .right-column,
    .people-grid,
    .people-suggestions-grid,
    .opportunity-layout,
    .opportunity-detail-shell,
    .opportunity-detail-aside,
    .community-layout,
    .community-detail-layout,
    .event-detail-layout,
    .event-discussion-layout,
    .event-manage-layout,
    .settings-layout,
    .profile-edit-layout,
    .diagnostic-layout,
    .email-delivery-grid,
    .demo-environment-body,
    .private-beta-layout { grid-template-columns: minmax(0, 1fr); }

    .page-actions,
    .toolbar-actions,
    .hero-actions,
    .opportunity-hero,
    .notification-hero,
    .email-delivery-head,
    .demo-environment-head,
    .private-beta-head { align-items: stretch; flex-direction: column; }

    .tabs,
    .filter-tabs,
    .people-filter-tabs,
    .opportunity-view-tabs,
    .event-filter-tabs,
    .event-tabs,
    .notification-filters,
    .profile-tabs-social {
        max-width: 100%;
        overflow-x: auto;
        overscroll-behavior-inline: contain;
        scrollbar-width: none;
    }
    .tabs::-webkit-scrollbar,
    .filter-tabs::-webkit-scrollbar,
    .people-filter-tabs::-webkit-scrollbar,
    .opportunity-view-tabs::-webkit-scrollbar,
    .event-filter-tabs::-webkit-scrollbar,
    .event-tabs::-webkit-scrollbar,
    .notification-filters::-webkit-scrollbar,
    .profile-tabs-social::-webkit-scrollbar { display: none; }

    .app-legal-footer {
        align-items: flex-start;
        flex-direction: column;
        gap: 6px;
        margin-top: 8px;
        padding: 12px 2px 4px;
    }

    /* Início / feed */
    .composer-card { padding: 13px; }
    .composer-head { align-items: flex-start; }
    .composer-tool-row { flex-wrap: wrap; }
    .composer-tool-note { flex-basis: 100%; }
    .composer-actions { gap: 8px; }
    .feed-stream-nav { border-radius: 14px; }
    .post-card { overflow: visible; border-radius: 16px; }
    .post-head,
    .post-body,
    .post-engagement,
    .post-interaction-panel,
    .comment-list,
    .comment-form { padding-right: 13px; padding-left: 13px; }
    .post-head { grid-template-columns: auto minmax(0, 1fr) auto; gap: 9px; }
    .post-head-actions { min-width: 0; }
    .post-visibility { display: none; }
    .post-media-grid { border-radius: 0; }
    .post-engagement { gap: 8px; }
    .reaction-popover,
    .comment-reaction-popover { max-width: calc(100vw - 40px); }
    .post-edit-form { margin-right: 12px; margin-left: 12px; }

    /* Pessoas */
    .people-toolbar,
    .person-card,
    .people-suggestion-card { border-radius: 15px; }
    .people-search-form { grid-template-columns: minmax(0, 1fr) auto; }
    .people-search-button { grid-column: 1 / -1; width: 100%; }
    .person-card-footer { grid-template-columns: 1fr; }
    .person-card-footer form,
    .person-follow-button { width: 100%; }

    /* Oportunidades */
    .create-panel,
    .opportunity-detail-aside { position: static; }
    .opportunity-search-form { grid-template-columns: 1fr 1fr; }
    .opportunity-search { grid-column: 1 / -1; }
    .opportunity-search-form > .button { width: 100%; }
    .opportunity-card { border-radius: 15px; }
    .opportunity-context-row { min-width: 0; }

    /* Mensagens */
    .messages-shell { grid-template-columns: 1fr; min-height: 0; gap: 10px; }
    .conversations-panel,
    .conversation-panel { min-width: 0; min-height: auto; border-radius: 16px; }
    .conversation-list { max-height: none; }
    .messages-shell:has(.conversation-panel .message-stream) .conversations-panel { display: none; }
    .messages-shell:has(.conversation-panel .message-stream) .conversation-panel { min-height: calc(100dvh - 154px); }
    .message-stream { min-height: 280px; max-height: calc(100dvh - 300px); }
    .conversation-welcome { min-height: 360px; }
    .conversation-mobile-back { display: grid; }
    .message-row { max-width: 90%; }
    .message-bubble { min-width: 0; }
    .message-composer { position: sticky; bottom: 73px; background: rgba(255,255,255,.98); }

    /* Perfis, comunidades e eventos */
    .profile-shell,
    .profile-main-social,
    .community-profile,
    .event-profile { max-width: 100%; border-radius: 17px; }
    .profile-cover,
    .community-cover,
    .event-cover { min-width: 0; }
    .event-link-preview { grid-template-columns: 88px minmax(0, 1fr); }
    .event-link-preview > :last-child { display: none; }

    /* Administração e diagnóstico */
    .diagnostic-definition-grid,
    .diagnostic-count-grid { grid-template-columns: 1fr 1fr; }
    .demo-environment-body,
    .private-beta-layout { gap: 10px; }
    .beta-invite-row { grid-template-columns: 1fr; }
    .smtp-fields-grid { grid-template-columns: 1fr; }
    .email-action-buttons { align-items: stretch; flex-direction: column; }
    .email-action-buttons .button { width: 100%; }

    table { min-width: 620px; }
    .table-wrap,
    .table-responsive,
    .diagnostic-table-wrap { max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
}

@media (max-width: 640px) {
    .app-shell { padding-right: 7px; padding-left: 7px; }
    .mobile-bar { padding-right: 9px; padding-left: 9px; }
    .topbar { margin-right: 4px; margin-left: 4px; }
    .topbar h1 { font-size: 1.26rem; }
    .page-content { gap: 8px; }
    .card { padding: 12px; border-radius: 15px; }

    .search-form,
    .opportunity-search-form,
    .event-search-form,
    .people-search-form { grid-template-columns: 1fr; }
    .opportunity-search,
    .people-search-button { grid-column: auto; }
    .search-form > *,
    .opportunity-search-form > *,
    .event-search-form > *,
    .people-search-form > * { width: 100%; }

    .composer-actions { grid-template-columns: 1fr; }
    .composer-actions .button,
    .composer-visibility { width: 100%; max-width: none; }
    .feed-stream-tabs { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .feed-stream-tab { padding-inline: 6px; }
    .post-head { grid-template-columns: auto minmax(0, 1fr) auto; padding-top: 12px; }
    .post-author small { line-height: 1.35; }
    .post-engagement { align-items: flex-start; flex-direction: column; }
    .engagement-comments { align-self: flex-end; }
    .post-interaction-panel { gap: 6px; }
    .reaction-trigger,
    .comment-focus { min-width: 0; flex: 1 1 0; }
    .reaction-trigger-label { font-size: .68rem; }

    .person-card { padding: 13px; }
    .person-name-line { align-items: flex-start; }
    .person-meta { min-width: 0; }

    .opportunity-meta { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .opportunity-context-row { align-items: flex-start; flex-direction: column; }
    .opportunity-pagination { display: grid; grid-template-columns: 1fr 1fr; }
    .opportunity-pagination > span { grid-column: 1 / -1; grid-row: 1; text-align: center; }

    .notification-hero-stats { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); }
    .notification-hero-stats > div { min-width: 0; }

    .diagnostic-definition-grid,
    .diagnostic-count-grid { grid-template-columns: 1fr; }

    .app-legal-footer { display: none; }
}

@media (max-width: 430px) {
    .mobile-brand strong { font-size: .84rem; }
    .mobile-action,
    .mobile-avatar { width: 34px; height: 34px; }
    .mobile-bottom-nav { right: 5px; left: 5px; }
    .mobile-bottom-nav small { font-size: .49rem; }
    .card { padding: 11px; }
    .button { width: 100%; justify-content: center; }
    .button.button-compact { min-height: 38px; }
    .post-head { gap: 7px; }
    .post-head-actions { gap: 3px; }
    .post-options > summary { width: 32px; height: 32px; }
    .reaction-popover { grid-template-columns: repeat(3, 42px); gap: 6px; }
    .comment-reaction-popover { grid-template-columns: repeat(3, 36px); }
    .post-interaction-panel .button { width: auto; }
    .conversation-header { align-items: center; }
    .conversation-header .button { width: auto; }
    .message-row { max-width: 94%; }
    .event-link-preview { grid-template-columns: 72px minmax(0, 1fr); }
}

@media (prefers-reduced-motion: reduce) {
    .sidebar,
    .sidebar-backdrop { transition: none; }
}

/* Separação clara entre navegação principal e opções secundárias no telemóvel. */
@media (max-width: 900px) {
    .mobile-bar { grid-template-columns: 40px minmax(0, 1fr) 38px; }
    .mobile-quick-actions { justify-self: end; }
    .mobile-avatar { display: none; }

    .side-nav-desktop { display: none; }
    .mobile-secondary-menu {
        display: grid;
        gap: 11px;
        min-height: 100%;
    }
    .mobile-secondary-title {
        margin: 1px 3px -1px;
        color: var(--green-800);
        font-size: .68rem;
        font-weight: 900;
        letter-spacing: .08em;
        text-transform: uppercase;
    }
    .side-nav-mobile { display: grid; }
    .side-nav-mobile a { min-height: 47px; }
    .side-nav-mobile a[href^="mailto:"] { margin-top: 3px; }
    .mobile-secondary-meta {
        display: flex;
        flex-wrap: wrap;
        gap: 8px 14px;
        padding: 2px 4px 0;
    }
    .mobile-secondary-meta a {
        color: var(--muted);
        font-size: .72rem;
        font-weight: 760;
    }
    .mobile-secondary-meta a:hover { color: var(--green-800); }
    .mobile-sidebar-logout { margin: auto 0 0; padding-top: 3px; }
    .mobile-sidebar-logout button {
        display: flex;
        align-items: center;
        gap: 10px;
        width: 100%;
        min-height: 47px;
        padding: 7px 9px;
        border: 1px solid rgba(155, 52, 52, .18);
        border-radius: 11px;
        background: rgba(255, 248, 248, .96);
        color: #8e2e2e;
        font-size: .84rem;
        font-weight: 800;
        text-align: left;
    }
    .mobile-sidebar-logout .nav-icon {
        border-color: rgba(155, 52, 52, .18);
        background: #fff;
        color: #8e2e2e;
    }
    .mobile-sidebar-logout button:hover {
        border-color: rgba(155, 52, 52, .34);
        background: #fff0f0;
    }
}