.nav{background:var(--color-surface);position:sticky;top:0;z-index:50;border-bottom:1px solid var(--color-border)}.nav__inner{min-height:var(--nav-h);display:flex;align-items:center;gap:clamp(12px,1.6vw,26px);padding-block:12px;flex-wrap:nowrap;overflow:hidden}.nav__back{display:inline-flex;align-items:center;flex:0 0 auto;justify-content:flex-start;gap:8px;min-width:112px;height:42px;padding:0 14px 0 12px;border-radius:14px;border:1px solid rgba(222,225,234,.95);background:linear-gradient(180deg,#fffffffa,#f7f8fbfa);color:#212634;box-shadow:0 10px 24px #1f24330d,inset 0 1px #ffffffe0;transition:background var(--dur) var(--ease),color var(--dur) var(--ease),transform var(--dur) var(--ease),box-shadow var(--dur) var(--ease),border-color var(--dur) var(--ease)}@media (min-width: 1560px){.nav--with-back .nav__inner{max-width:min(1680px,calc(100vw - 64px))}}.nav--with-back .nav__inner{gap:clamp(10px,1.2vw,18px)}.nav__back svg{width:17px;height:17px;flex:0 0 auto;transform:translate(-1px);transition:transform var(--dur) var(--ease)}.nav__back span{font-size:15px;font-weight:var(--fw-semibold);line-height:1;white-space:nowrap}.nav__back:hover{border-color:#cbd0ddfa;background:linear-gradient(180deg,#fff,#f3f5f9);color:#000;box-shadow:0 14px 28px #1f243314,inset 0 1px #ffffffeb}.nav__back:hover svg{transform:translate(-4px)}.nav__back:focus-visible{outline:none;border-color:#c0c6d6;box-shadow:0 0 0 4px #dfe3eeb3,0 12px 28px #1f243314}.nav__search{flex:0 1 460px;min-width:180px;max-width:520px;display:flex;align-items:center;background:#fafafa;border:1px solid var(--color-border);border-radius:14px;padding:5px 5px 5px 18px;height:52px;box-shadow:inset 0 0 0 1px #eceaf673;transition:border-color var(--dur) var(--ease),background var(--dur) var(--ease)}.nav__search:focus-within{border-color:#d8dbe8;background:var(--color-surface)}.nav__search input{flex:1;border:none;outline:none;background:transparent;font-size:var(--fs-base);color:var(--color-text)}.nav__search input::placeholder{color:var(--color-text-muted)}.nav__search-btn{display:inline-flex;align-items:center;justify-content:center;width:46px;height:42px;border-radius:12px;background:#fff;color:#000;flex-shrink:0;box-shadow:0 8px 22px #1f243314}.nav--compact-search .nav__inner{min-height:76px;padding-block:0}.nav--compact-search .nav__search{flex-basis:clamp(340px,26vw,350px);min-width:240px;max-width:350px;height:44px;padding:4px 4px 4px 14px;border-radius:12px}.nav--compact-search .nav__search input{font-size:var(--fs-sm)}.nav--compact-search .nav__search-btn{width:36px;height:36px;border-radius:10px;box-shadow:0 4px 12px #1f24330f}.nav--compact-search .nav__search-btn svg{width:16px;height:16px}.nav--with-back .nav__search{flex-basis:clamp(220px,20vw,320px);max-width:320px;height:40px;padding:3px 3px 3px 12px}.nav--with-back .nav__search input{font-size:var(--fs-sm)}.nav--with-back .nav__search-btn{width:34px;height:32px;border-radius:10px;box-shadow:0 5px 14px #1f243311}.nav--with-back .nav__search-btn svg{width:16px;height:16px}.nav__tabs-shell{position:relative;display:flex;align-items:center;flex:1 1 auto;min-width:0}.nav__tabs-shell.has-overflow:before,.nav__tabs-shell.has-overflow:after{position:absolute;top:0;bottom:0;z-index:1;width:24px;content:"";pointer-events:none;opacity:0;transition:opacity var(--dur) var(--ease)}.nav__tabs-shell.has-overflow:before{left:0;background:linear-gradient(90deg,var(--color-surface),transparent)}.nav__tabs-shell.has-overflow:after{right:0;background:linear-gradient(270deg,var(--color-surface),transparent)}.nav__tabs-shell.can-scroll-start:before,.nav__tabs-shell.can-scroll-end:after{opacity:1}.nav__tabs{width:100%;display:flex;align-items:center;gap:clamp(10px,1.2vw,14px);flex:1 1 auto;min-width:0;flex-wrap:nowrap;overflow-x:auto;overscroll-behavior-x:contain;scroll-behavior:auto;scrollbar-width:none}.nav__tabs.is-dragging{-webkit-user-select:none;user-select:none}@media (pointer: fine){.nav__tabs-shell.has-overflow .nav__tabs{cursor:grab}.nav__tabs.is-dragging,.nav__tabs.is-dragging .nav__tab{cursor:grabbing}}.nav--with-back .nav__tabs{gap:clamp(8px,1vw,12px)}.nav--with-back .nav__tab{padding:10px 13px;font-size:15px}.nav__tabs::-webkit-scrollbar{display:none}.nav__tab{flex:0 0 auto;color:var(--color-text-secondary);font-size:16px;font-weight:var(--fw-semibold);padding:12px 16px;border-radius:10px;transition:all var(--dur) var(--ease)}.nav__tab:hover{background:#f5f5f5;color:var(--color-text)}.nav__tab.is-active{background:#f5f5f5;color:#000;font-weight:var(--fw-bold)}@media (max-width: 720px){.nav__tabs-shell.has-overflow:before,.nav__tabs-shell.has-overflow:after{width:20px}}