.dashboard-menu-toggle { display: none; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.fade-in { animation: reveal-content-fallback 0s 2s forwards; }
@keyframes reveal-content-fallback { to { opacity: 1; transform: translateY(0); } }

@media (min-width: 1600px) {
    .site-shell .container,
    .site-footer .footer-inner {
        width: min(2000px, calc(100% - 6rem));
        max-width: none;
    }
    .hero-copy h1 { max-width: 780px; }
    .hero-copy p { max-width: 720px; }
    .stats-grid { max-width: 760px; }
    .section-header { max-width: 920px; }
}

@media (max-width: 900px) {
    .dashboard-shell { display: block; min-height: 100vh; }
    .dashboard-sidebar { position: sticky; top: 0; z-index: 100; display: grid; grid-template-columns: minmax(0, 1fr) auto; min-height: 0; padding: .7rem .9rem; border-right: 0; border-bottom: 1px solid rgba(var(--primary-strong-rgb), .14); background: rgba(var(--bg-rgb), .97); backdrop-filter: blur(18px); }
    .dashboard-brand { min-width: 0; margin: 0; }
    .dashboard-brand .brand-mark { width: 2.25rem; height: 2.25rem; border-radius: .65rem; }
    .dashboard-brand strong { font-size: .78rem; }
    .dashboard-brand small { font-size: .52rem; }
    .dashboard-menu-toggle { display: grid; width: 2.5rem; height: 2.5rem; padding: 0; place-items: center; border: 1px solid var(--line); border-radius: .7rem; background: rgba(var(--bg-rgb), .92); color: var(--primary-strong); cursor: pointer; }
    .dashboard-menu-icon { display: grid; width: 1.15rem; gap: .22rem; }
    .dashboard-menu-icon i { display: block; width: 100%; height: 2px; border-radius: 99px; background: currentColor; transition: transform .2s ease, opacity .2s ease; }
    .dashboard-sidebar.is-menu-open .dashboard-menu-icon i:first-child { transform: translateY(.44rem) rotate(45deg); }
    .dashboard-sidebar.is-menu-open .dashboard-menu-icon i:nth-child(2) { opacity: 0; }
    .dashboard-sidebar.is-menu-open .dashboard-menu-icon i:last-child { transform: translateY(-.44rem) rotate(-45deg); }
    .dashboard-nav, .dashboard-sidebar-footer { display: none; grid-column: 1 / -1; }
    .dashboard-sidebar.is-menu-open .dashboard-nav { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); margin-top: .65rem; padding-top: .65rem; border-top: 1px solid rgba(var(--primary-strong-rgb), .1); }
    .dashboard-sidebar.is-menu-open .dashboard-sidebar-footer { display: grid; margin-top: .4rem; }
    .dashboard-nav-label { margin: .65rem .6rem .25rem; }
    .dashboard-nav-link, .dashboard-logout { min-height: 2.65rem; padding: .6rem .7rem; }
    .dashboard-main { min-width: 0; padding: 1.5rem clamp(1rem,4vw,2rem); }
}

@media (max-width: 650px) {
    .dashboard-main { padding: 1rem .8rem 1.5rem; }
    .dashboard-topbar { align-items: center; flex-direction: row; gap: .65rem; margin-bottom: 1.4rem; }
    .dashboard-topbar > div:first-child { min-width: 0; }
    .dashboard-topbar .eyebrow { font-size: .58rem; letter-spacing: .12em; }
    .dashboard-topbar h1 { margin-top: .2rem; font-size: clamp(1.45rem,8vw,2rem); }
    .dashboard-user-chip { width: auto; min-width: 0; max-width: 58%; padding: .45rem .55rem; gap: .5rem; }
    .dashboard-user-avatar { width: 2rem; height: 2rem; flex-basis: 2rem; border-radius: .55rem; }
    .dashboard-user-details strong { font-size: .68rem; }
    .dashboard-user-details small { font-size: .55rem; }
    .dashboard-duty-bar { display: grid; grid-template-columns: auto minmax(0,1fr) auto; gap: .55rem; margin: 0 0 1rem; padding: .65rem; }
    .dashboard-duty-bar form { margin: 0; }
    .dashboard-welcome { align-items: flex-start; flex-direction: column; gap: 1rem; padding: 1rem; }
    .dashboard-welcome h2 { font-size: 1.3rem; }
    .dashboard-welcome p, .dashboard-panel p { font-size: .8rem; line-height: 1.6; }
    .dashboard-status-panel { box-sizing: border-box; width: 100%; padding: .85rem 0 0; border-left: 0; border-top: 1px solid var(--line); }
    .dashboard-stat-grid, .dashboard-content-grid, .dashboard-form-two-col, .role-grid, .permission-groups, .profile-grid, .query-detail-grid, .query-composer-grid, .query-detail-sections { grid-template-columns: 1fr; }
    .dashboard-stat-card, .dashboard-panel { min-width: 0; padding: 1rem; border-radius: .85rem; }
    .dashboard-panel-heading { align-items: flex-start; flex-wrap: wrap; }
    .dashboard-filter-bar, .attendance-filter-bar, .attendance-filter-bar[data-range-mode="custom"] { grid-template-columns: 1fr; gap: .6rem; margin: 1rem 0; }
    .dashboard-filter-bar > span:empty { display: none; }
    .dashboard-filter-button, .dashboard-submit-small { width: 100%; justify-content: center; }
    .query-row { align-items: flex-start; flex-direction: column; gap: .65rem; padding: .85rem 0; }
    .query-row-meta { width: 100%; align-items: flex-start; }
    .query-detail-list div { align-items: flex-start; flex-direction: column; gap: .2rem; }
    .query-action-row, .dashboard-inline-form { align-items: stretch; flex-direction: column; }
    .query-action-row > *, .dashboard-inline-form > *, .dashboard-inline-form .form-field, .dashboard-inline-form .dashboard-custom-select { width: 100%; }
    .profile-avatar-field { align-items: stretch; flex-direction: column; }
    .member-actions { width: 100%; flex-wrap: wrap; justify-content: flex-start; }
    .team-directory-heading-actions { width: 100%; align-items: center; flex-direction: row; justify-content: space-between; }
    .chat-shell { display: flex; height: auto; min-height: 0; flex-direction: column; border-radius: .8rem; }
    .chat-rail { max-height: 19rem; border-right: 0; border-bottom: 1px solid var(--line); }
    .chat-main { min-height: 65dvh; }
    .chat-header { align-items: flex-start; flex-direction: column; gap: .65rem; padding: .8rem; }
    .chat-search { width: 100%; }
    .chat-composer { padding: .7rem; }
    .chat-composer-actions { align-items: flex-start; flex-direction: column; }
    .chat-composer-actions .primary-btn { width: 100%; }
}

@media (max-width: 420px) {
    .dashboard-sidebar.is-menu-open .dashboard-nav { grid-template-columns: 1fr; }
    .dashboard-user-chip { max-width: 54%; }
    .dashboard-duty-bar { grid-template-columns: 1fr auto; }
    .dashboard-duty-bar > span:nth-child(2) { grid-column: 1 / -1; grid-row: 2; }
    .dashboard-duty-bar form { grid-column: 2; grid-row: 1 / span 2; }
}

@media (max-width: 560px) {
    .topbar { position: relative; }
    .nav-wrap { min-height: 0; gap: .85rem; padding: .85rem 0; }
    .brand { gap: .65rem; }
    .brand-mark { width: 2.35rem; height: 2.35rem; border-radius: .7rem; }
    .brand strong { font-size: .78rem; }
    .brand small { font-size: .54rem; }
    .main-nav { width: 100%; justify-content: center; gap: .55rem 1rem; }
    .main-nav > a, .nav-drop-trigger { font-size: .68rem; letter-spacing: .06em; }
    .footer-inner { width: min(100% - 1.5rem,1180px); padding: 2rem 0 1rem; }
    .footer-top { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 1.75rem 1rem; }
    .footer-brand-block { grid-column: 1 / -1; max-width: none; }
    .footer-column { min-width: 0; justify-self: center; text-align: center; }
    .footer-column ul { width: max-content; margin-inline: auto; justify-items: start; text-align: left; }
    .footer-brand-block p { font-size: .86rem; line-height: 1.65; }
}

@media (max-width: 390px) {
    .footer-top { grid-template-columns: 1fr; }
    .footer-brand-block { grid-column: auto; }
    .footer-column { width: 100%; }
}