/* 深色一级带与浅色抽屉；面板在滚动带外，避免被 overflow 裁切。 */
#nav{--nc-paper:color-mix(in srgb,var(--acc) 0%,white);order:10;flex:1 1 100%;width:100%;min-width:0;max-width:100%;display:flex;flex-direction:column;gap:6px;position:relative}
#nav .nc-main{display:flex;align-items:center;gap:12px;max-width:100%;min-width:0;overflow-x:visible;background:linear-gradient(90deg,var(--deep),var(--acc));border-radius:14px;padding:6px 10px;box-shadow:0 2px 8px color-mix(in srgb,var(--deep) 6%,transparent)}
#nav .nc-left,#nav .nc-right{display:flex;align-items:center;gap:3px;flex:0 0 auto}
#nav .nc-right{margin-left:auto}
#nav .nc-item{display:inline-block;white-space:nowrap;cursor:pointer;padding:5px 10px;border-radius:999px;font-size:14px;font-weight:700}
#nav .nc-main .nc-item{color:var(--nc-paper);position:relative}
#nav .nc-main .nc-item:hover{background:color-mix(in srgb,var(--nc-paper) 18%,transparent)}
#nav .nc-main .nc-right .nc-item{color:color-mix(in srgb,var(--nc-paper) 85%,transparent)}
#nav .nc-main .nc-item.on{background:var(--nc-paper);color:var(--deep);box-shadow:0 1px 4px color-mix(in srgb,var(--deep) 12%,transparent)}
#nav .nc-main .nc-item.on::after{content:'';position:absolute;left:calc(50% - 6px);bottom:-6px;border-left:6px solid transparent;border-right:6px solid transparent;border-top:6px solid var(--nc-paper)}
#nav .nc-mascot{display:block;flex:0 0 auto;width:30px;height:30px;border-radius:50%;object-fit:contain;border:2px solid var(--nc-paper);box-sizing:border-box}
#nav .nc-roady{width:24px;height:24px;border:0}
#nav .nc-sub{display:flex;gap:4px;min-height:33px;align-items:center;background:var(--acc-s);border:1px solid var(--line);border-color:color-mix(in srgb,var(--acc) 25%,transparent);border-radius:12px;padding:4px 10px;overflow-x:auto;margin:0 12px;min-width:0}
#nav .nc-sub .nc-item{font-size:13px;font-weight:500;color:var(--ink2);border-bottom:2px solid transparent;padding:4px 6px;border-radius:7px}
#nav .nc-sub .nc-item:hover{color:var(--deep)}
#nav .nc-sub .nc-item.on{background:var(--nc-paper);color:var(--deep);border-bottom-color:var(--acc)}
#nav .nc-page{display:flex;align-items:center;flex:0 0 auto;gap:0;white-space:nowrap}
#nav .nc-caption,#nav .nc-prefix{font-size:12px;color:var(--ink2);white-space:nowrap;flex:0 0 auto;padding:0 5px}
#nav .nc-star{border:0;background:transparent;color:var(--ink2);font-size:12px;line-height:22px;padding:0 4px;cursor:pointer;opacity:0;pointer-events:none}
#nav .nc-star.on{color:var(--acc);font-size:11px;opacity:1;pointer-events:auto}
@media(hover:hover) and (min-width:769px){#nav .nc-page:hover .nc-star{opacity:.65;pointer-events:auto}}
#nav .nc-star:focus-visible{opacity:1;pointer-events:auto}
#nav button:disabled{cursor:wait;opacity:.6}
#nav .nc-divider{padding:0;border-radius:0;cursor:default;height:18px;border-left:1px solid var(--line);margin:0 5px;flex:0 0 auto}
#nav .nc-fav-toggle{display:flex;align-items:center;gap:4px;flex:0 0 auto;background:var(--nc-paper);border:1px solid var(--line);border-radius:999px;padding:4px 9px;color:var(--deep);font-size:13px;font-weight:700;white-space:nowrap;cursor:pointer}
#nav .nc-badge{padding:0 3px;cursor:inherit;background:var(--acc-s);color:var(--deep);border-radius:999px;min-width:16px;font-size:11px;text-align:center}
#nav .nc-panel{position:absolute;top:calc(100% + 6px);left:48px;width:320px;max-width:calc(100% - 24px);max-height:60vh;overflow:auto;box-sizing:border-box;background:var(--nc-paper);border:1px solid var(--line);border-radius:12px;padding:10px;box-shadow:0 8px 24px color-mix(in srgb,var(--deep) 16%,transparent);z-index:50;color:var(--ink2)}
#nav .nc-group + .nc-group{border-top:1px solid var(--line);margin-top:6px;padding-top:6px}
#nav .nc-caption{font-weight:700;padding:4px 5px}
#nav .nc-fav-row{display:flex;align-items:center;gap:4px}
#nav .nc-fav-link{flex:1;min-width:0;text-align:left;border:0;border-radius:6px;background:transparent;color:var(--ink2);padding:7px;font-size:13px;cursor:pointer}
#nav .nc-fav-link:hover,#nav .nc-remove:hover{background:var(--acc-s)}
#nav .nc-remove{border:0;background:transparent;color:var(--acc);font-size:11px;padding:8px;cursor:pointer;border-radius:6px}
#nav .nc-add{display:block;width:100%;margin-top:8px;padding:8px;border:0;border-top:1px solid var(--line);background:var(--acc-s);color:var(--deep);border-radius:6px;font-size:13px;cursor:pointer}
#nav .nc-add:disabled{cursor:default}
#nav .nc-empty{display:flex;align-items:center;gap:8px;padding:8px;font-size:13px;line-height:1.6}
#nav .nc-empty span{min-width:0;flex:1;white-space:normal;overflow-wrap:anywhere}
#nav .nc-empty .nc-roady{width:40px;height:40px}
#nav button:focus-visible,#nav .nc-toggle:focus-visible{outline:2px solid var(--acc);outline-offset:2px}
#nav .nc-more{flex:0 0 auto}
#nav .nc-toggle{list-style:none;cursor:pointer;font-weight:800;padding:5px 10px;border-radius:999px;color:var(--nc-paper)}
#nav .nc-toggle::-webkit-details-marker{display:none}
#nav .nc-menu{position:fixed;right:14px;top:var(--hdrH);max-width:calc(100vw - 28px);max-height:60vh;overflow:auto;background:var(--nc-paper);border:1px solid var(--line);border-radius:10px;padding:6px;box-shadow:0 8px 24px color-mix(in srgb,var(--deep) 8%,transparent);z-index:50}
#nav .nc-menu .nc-item{display:block;color:var(--ink2)}
#nav .nc-menu .nc-item:hover{background:var(--acc-s);color:var(--deep)}
@media(max-width:1280px){#nav .nc-main{gap:6px;padding:6px 8px}#nav .nc-main .nc-item{padding:5px 5px;font-size:13px}#nav .nc-sub .nc-item{font-size:12px}#nav .nc-left,#nav .nc-right{gap:1px}#nav .nc-main .nc-mascot{width:26px;height:26px}#nav .nc-toggle{padding:5px 5px;font-size:13px}}
@media(max-width:1023px){#nav .nc-main{overflow-x:auto}}
@media(max-width:768px){#nav .nc-main{gap:8px}#nav .nc-item{padding:5px 8px}#nav .nc-pawzy{width:24px;height:24px}#nav .nc-roady{width:20px;height:20px}#nav .nc-panel{left:12px;width:calc(100% - 24px)}#hdr #nav2{max-width:100%;overflow-x:auto}}
@media(hover:none),(max-width:768px){#nav .nc-star:not(.on){display:none}}