#platform-topbanner {
    position: fixed;
    inset: 0 0 auto 0;
    z-index: 9050;
    box-sizing: border-box;
    width: 100%;
    max-width: 100%;
    overflow: hidden;
    min-height: 72px;
    padding: 9px 170px 9px 18px;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    gap: 22px;
    background: rgb(255 251 241 / 92%);
    border-bottom: 1px solid rgba(255,255,255,.18);
    box-shadow: 0 4px 22px rgba(0,0,0,.28);
    backdrop-filter: blur(14px);
    transition: transform .3s ease, opacity .3s ease;
}
.topbanner-logo { display:inline-flex; align-items:center; gap:8px; color:#fff; text-decoration:none; font-size:1.35rem; font-weight:900; white-space:nowrap; letter-spacing:-.02em; }
.topbanner-logo:hover { color:#c47d0000; }
.topbanner-logo em { color:#f0a500; font-style:normal; }
.topbanner-logo-img { height:1.9rem; width:auto; vertical-align:middle; }
.topbanner-nav { box-sizing:border-box; display:flex; align-items:center; justify-content:center; gap:4px; min-width:0; overflow-x:auto; overflow-y:hidden; scrollbar-width:none; }
.topbanner-nav::-webkit-scrollbar { display:none; }
.topbanner-link {
    flex:0 0 auto;
    color: rgb(24 73 20);
    text-decoration:none;
    font-size:1rem;
    font-weight:700;
    line-height:1.25;
    padding:8px 9px;
    border-radius:9px;
    white-space:nowrap;
    transition:background .2s,color .2s;
}
.topbanner-link:hover { color:#a15500; background:rgba(255,255,255,.13); }
.topbanner-link.active { color:#7f2c00; background:rgba(255,255,255,.16); }
#platform-topbanner.scroll-hidden { opacity:0; transform:translateY(-100%); pointer-events:none; }
@media (max-width: 1440px) {
    #platform-topbanner { gap:14px; padding-right:158px; }
    .topbanner-link { padding-inline:7px; font-size:1rem; }
}
@media (max-width: 1100px) {
    #platform-topbanner { position:relative; inset:auto; min-height:148px; padding:8px; display:block; }
    #platform-topbanner.scroll-hidden { opacity:1; transform:none; pointer-events:auto; }
    .topbanner-logo { display:flex; width:max-content; min-height:40px; margin:0 0 6px; font-size:1rem; }
    .topbanner-nav { display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:3px; width:100%; max-width:100%; overflow:hidden; touch-action:pan-y; overscroll-behavior-x:none; }
    .topbanner-link { box-sizing:border-box; min-width:0; min-height:32px; display:flex; align-items:center; justify-content:flex-start; padding:5px 4px; font-size:1rem; line-height:1.2; text-align:center; white-space:normal; background:rgba(255,255,255,.06); }
}
@media (max-width: 1000px) {
    #platform-topbanner { position:relative; inset:auto; min-height:148px; padding:8px; display:block; }
    #platform-topbanner.scroll-hidden { opacity:1; transform:none; pointer-events:auto; }
    .topbanner-logo { display:flex; width:max-content; min-height:40px; margin:0 0 6px; font-size:1rem; }
    .topbanner-nav { display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:3px; width:100%; max-width:100%; overflow:hidden; touch-action:pan-y; overscroll-behavior-x:none; }
    .topbanner-link { box-sizing:border-box; min-width:0; min-height:32px; display:flex; align-items:center; justify-content:flex-start; padding:5px 4px; font-size:1rem; line-height:1.2; text-align:center; white-space:normal; background:rgba(255,255,255,.06); }
}
@media (min-width: 600px) and (max-width: 1000px) {
    #platform-topbanner { min-height:118px; }
    .topbanner-nav { grid-template-columns:repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 340px) {
    .topbanner-logo { font-size:.9rem; }
    .topbanner-link { font-size:1rem; padding-inline:8px; }
}
