/* This stylesheet has its own cache key because the desktop/mobile navigation
   has different DOM positions. It keeps the visibility rule reliable across
   pages that may otherwise have an older cached index.css file. */
.mobile-publication-nav { display:none !important; }

@media (min-width:781px) {
    .desktop-publication-nav {
        position:absolute;
        left:50%;
        top:50%;
        display:block;
        width:min(56vw,600px);
        margin:0;
        padding:0;
        border:0;
        background:transparent;
        transform:translate(-50%,-50%);
    }
    .desktop-publication-nav .section-tabs { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); width:100%; }
    .desktop-publication-nav .section-tab { min-height:38px; padding:.45rem .7rem; font-size:.88rem; }
}

@media (max-width:780px) {
    .desktop-publication-nav { display:none !important; }
    .mobile-publication-nav {
        display:flex !important;
        justify-content:center;
        width:calc(100% - 2rem);
        margin:.65rem auto 0;
        padding:0;
        border:0;
        border-radius:0;
        background:transparent;
    }
    .mobile-publication-nav .section-tabs { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); width:100%; gap:.25rem; padding:.3rem; }
    .mobile-publication-nav .section-tab { min-height:42px; padding:.5rem .35rem; font-size:.82rem; white-space:nowrap; }
}

@media (max-width:360px) {
    .mobile-publication-nav { width:calc(100% - 1rem); }
    .mobile-publication-nav .section-tab { font-size:.74rem; padding:.45rem .2rem; }
}
