/* PC 首页分组导航：宣纸实底、无毛玻璃，同板块入口在悬停或点击时完整展开。 */
@media (min-width: 769px) {
  body.community-stream .main-nav {
    min-height: 4.5rem;
    padding: 0;
    border-bottom: 1px solid rgba(34, 83, 75, .2);
    background: #f5f2e8;
    box-shadow: 0 .35rem .9rem rgba(31, 66, 58, .08);
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
  }

  body.community-stream .nav-container {
    width: min(100%, 96rem);
    min-height: 4.5rem;
    margin: 0 auto;
    padding: 0 5.5rem 0 1.25rem;
    align-items: center;
  }

  body.community-stream .world-brand.world-brand-image {
    width: 10rem;
    min-width: 10rem;
    padding: .42rem .7rem .38rem;
    border: 1px solid #285e55;
    border-radius: .35rem;
    background: #174f46;
    box-shadow: none;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
  }

  body.community-stream .world-brand.world-brand-image small {
    color: #dfece5 !important;
    letter-spacing: .1em;
  }

  body.community-stream .nav-links-grouped {
    position: relative;
    align-self: stretch;
    display: flex;
    align-items: stretch;
    gap: .15rem;
    margin: 0 0 0 auto;
    padding: 0;
    border: 0;
    background: transparent;
    box-shadow: none;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
  }

  .nav-links-grouped > li {
    position: relative;
    display: flex;
    align-items: stretch;
    list-style: none;
  }

  body.community-stream .nav-links-grouped > .nav-direct > a,
  .nav-group-trigger {
    position: relative;
    display: inline-flex;
    min-height: 4.5rem;
    align-items: center;
    gap: .35rem;
    padding: 0 .85rem;
    border: 0;
    border-radius: 0;
    background: transparent;
    color: #3e5f58;
    font: 800 .78rem/1.2 var(--qjs-font-ui, "Microsoft YaHei", sans-serif);
    letter-spacing: .055em;
    white-space: nowrap;
    cursor: pointer;
  }

  .nav-group-trigger span { color: #8b7a4e; font-size: .75rem; transition: transform .18s ease; }

  body.community-stream .nav-links-grouped > .nav-direct > a::after,
  .nav-group-trigger::after {
    position: absolute;
    right: .78rem;
    bottom: 0;
    left: .78rem;
    height: 3px;
    content: "";
    background: #267060;
    opacity: 0;
    transform: scaleX(.35);
    transition: opacity .18s ease, transform .18s ease;
  }

  body.community-stream .nav-links-grouped > .nav-direct > a:hover,
  body.community-stream .nav-links-grouped > .nav-direct > a.active,
  .nav-group:hover > .nav-group-trigger,
  .nav-group:focus-within > .nav-group-trigger,
  .nav-group.is-open > .nav-group-trigger,
  .nav-group:has(.active) > .nav-group-trigger {
    color: #174f46 !important;
    background: #e5eee7 !important;
    box-shadow: none !important;
  }

  body.community-stream .nav-links-grouped > .nav-direct > a:hover::after,
  body.community-stream .nav-links-grouped > .nav-direct > a.active::after,
  .nav-group:hover > .nav-group-trigger::after,
  .nav-group:focus-within > .nav-group-trigger::after,
  .nav-group.is-open > .nav-group-trigger::after,
  .nav-group:has(.active) > .nav-group-trigger::after { opacity: 1; transform: scaleX(1); }

  .nav-group:hover > .nav-group-trigger span,
  .nav-group:focus-within > .nav-group-trigger span,
  .nav-group.is-open > .nav-group-trigger span { transform: rotate(180deg); }

  .nav-group-menu {
    position: absolute;
    z-index: 1200;
    top: calc(100% - 1px);
    left: 0;
    display: grid;
    width: 18.5rem;
    padding: .45rem;
    border: 1px solid rgba(35, 88, 78, .26);
    background: #faf7ee;
    box-shadow: 0 1rem 2rem rgba(31, 67, 59, .14);
    opacity: 0;
    visibility: hidden;
    transform: translateY(-.3rem);
    transition: opacity .16s ease, transform .16s ease, visibility .16s ease;
  }

  .nav-group-menu-end { right: 0; left: auto; }
  .nav-group:hover > .nav-group-menu,
  .nav-group:focus-within > .nav-group-menu,
  .nav-group.is-open > .nav-group-menu { opacity: 1; visibility: visible; transform: translateY(0); }

  body.community-stream .nav-group-menu a {
    display: grid;
    gap: .14rem;
    padding: .7rem .75rem;
    border-bottom: 1px solid rgba(42, 91, 82, .12);
    border-radius: .22rem;
    color: #264f47;
    text-decoration: none;
  }
  body.community-stream .nav-group-menu a:last-child { border-bottom: 0; }
  body.community-stream .nav-group-menu a:hover,
  body.community-stream .nav-group-menu a:focus-visible,
  body.community-stream .nav-group-menu a.active {
    background: #dfece4 !important;
    color: #174f46 !important;
    box-shadow: inset 3px 0 #267060 !important;
    outline: 0;
  }
  .nav-group-menu strong { font-size: .78rem; letter-spacing: .035em; }
  .nav-group-menu small { color: #70817c; font-size: .63rem; font-weight: 500; line-height: 1.45; }

  body.community-stream > .qjs-menu-button {
    border-color: #285e55;
    border-radius: .4rem;
    background: #174f46;
    box-shadow: none;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
  }
}

@media (min-width: 769px) and (max-width: 1120px) {
  body.community-stream .world-brand.world-brand-image { width: 8rem; min-width: 8rem; }
  body.community-stream .world-brand.world-brand-image small { display: none; }
  body.community-stream .nav-links-grouped > .nav-direct > a,
  .nav-group-trigger { padding-right: .58rem; padding-left: .58rem; font-size: .7rem; letter-spacing: .025em; }
  .nav-group-menu { width: 16.5rem; }
}

@media (max-width: 768px) {
  .nav-links-grouped { display: none !important; }
}
