/* ===== US3 revamp shell: sidebar + topbar (overrides legacy top-nav layout) ===== */
#nav{position:fixed;top:0;left:0;bottom:0;width:262px;height:auto;z-index:300;background:var(--sidebar-bg);border-right:1px solid var(--sidebar-border);border-bottom:0;display:flex;flex-direction:column;backdrop-filter:none;align-items:stretch;}
.us3-brand{display:flex;align-items:center;gap:11px;padding:18px 18px 15px;flex:none;}
.us3-brand-logo{width:38px;height:38px;border-radius:10px;background:var(--logo-chip);border:1px solid var(--border);display:flex;align-items:center;justify-content:center;flex:none;box-shadow:var(--shadow);overflow:hidden;}
.us3-brand-logo img{width:26px;height:auto;display:block;}
.us3-brand-name{font:700 15px/1 'Hanken Grotesk',sans-serif;color:var(--text);letter-spacing:.01em;text-transform:none;}
.us3-brand-sub{font-size:11px;color:var(--sidebar-text-2);margin-top:3px;letter-spacing:.02em;}
.us3-navwrap{flex:1;min-height:0;overflow-y:auto;padding:6px 12px 12px;}
.us3-navgroup-label{font:700 10.5px/1 'Hanken Grotesk',sans-serif;letter-spacing:.11em;text-transform:uppercase;color:var(--sidebar-group);padding:14px 10px 7px;}
#nav .ntab{display:flex;align-items:center;gap:11px;width:100%;height:auto;padding:9px 10px;margin:1px 0;border:0;border-right:0;border-bottom:0;border-radius:9px;background:transparent;color:var(--sidebar-text);font:600 13px/1.2 'Hanken Grotesk',sans-serif;text-transform:none;letter-spacing:0;cursor:pointer;transition:.15s;white-space:nowrap;}
#nav .ntab:hover{background:var(--sidebar-active-bg);color:var(--sidebar-active-text);}
#nav .ntab.active{background:var(--sidebar-active-bg);color:var(--sidebar-active-text);font-weight:700;}
#nav .ntab .ti{font-size:16px;width:20px;text-align:center;flex:none;}
#nav .ntab>span:nth-child(2){flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;}
.us3-userbox{margin-top:auto;padding:12px;border-top:1px solid var(--sidebar-border);flex:none;position:relative;}
.us3-userbox .nr{display:flex;align-items:center;gap:10px;padding:8px;border-radius:11px;cursor:pointer;transition:background .15s;}
.us3-userbox .nr:hover,.us3-userbox .nr:focus-visible{background:var(--sidebar-active-bg);outline:none;}
.us3-usercar{flex:none;transition:transform .18s;}
.us3-userbox .nr[aria-expanded="true"] .us3-usercar{transform:rotate(180deg);}
/* Menu opened by the footer identity row. Sign out lives here rather than as a
   bare link in the sidebar, which is what the design specifies. */
.us3-usermenu{position:absolute;left:12px;right:12px;bottom:calc(100% - 6px);z-index:320;
  background:var(--surface);border:1px solid var(--border);border-radius:12px;box-shadow:var(--shadow-lg,var(--shadow));
  padding:6px;display:flex;flex-direction:column;gap:2px;}
.us3-usermenu[hidden]{display:none;}
.us3-usermenu button{display:flex;align-items:center;gap:10px;width:100%;text-align:left;cursor:pointer;
  padding:9px 10px;border:0;border-radius:8px;background:transparent;color:var(--text);
  font:600 13px 'Hanken Grotesk',sans-serif;}
.us3-usermenu button:hover{background:var(--surface-2);}
.us3-usermenu button.danger{color:var(--danger);}
.us3-usermenu button .mi{width:18px;text-align:center;flex:none;opacity:.85;}
.us3-usermenu-sep{height:1px;margin:4px 2px;background:var(--border);}
.us3-uav{width:34px;height:34px;border-radius:9px;flex:none;background:var(--brand);color:var(--brand-contrast);display:flex;align-items:center;justify-content:center;font:700 12.5px 'Hanken Grotesk',sans-serif;}
/* topbar */
#topbar{position:fixed;top:0;left:262px;right:0;height:60px;z-index:290;display:flex;align-items:center;gap:12px;padding:0 22px;background:var(--topbar-bg);border-bottom:1px solid var(--topbar-border);}
.us3-crumb{display:flex;align-items:center;gap:8px;min-width:0;font-size:13px;color:var(--text-3);white-space:nowrap;}
.us3-crumb svg{flex:none;}
.us3-crumb b{font:600 14px 'Hanken Grotesk',sans-serif;color:var(--text);}
.us3-topsearch{position:relative;width:250px;max-width:24vw;}
.us3-topsearch svg{position:absolute;left:11px;top:50%;transform:translateY(-50%);}
.us3-topsearch input{width:100%;height:38px;padding:0 12px 0 34px;border-radius:9px;border:1px solid var(--border);background:var(--surface-2);color:var(--text);font:500 13px 'Hanken Grotesk',sans-serif;outline:none;}
.us3-topsearch input:focus{border-color:var(--brand);}
.us3-topbtn{display:flex;align-items:center;gap:7px;height:38px;padding:0 12px;border-radius:9px;border:1px solid var(--border);background:var(--surface);color:var(--text-2);font:600 13px 'Hanken Grotesk',sans-serif;cursor:pointer;white-space:nowrap;}
.us3-topbtn:hover{background:var(--surface-2);}
#helpBtn{position:relative;}
#helpBadge{display:none;position:absolute;top:5px;right:5px;width:7px;height:7px;border-radius:50%;background:var(--danger);border:1.5px solid var(--surface);}
#cloudSync.us3-topbtn::before{content:'';width:7px;height:7px;border-radius:50%;background:var(--ok);flex:none;}
.us3-seg{display:flex;align-items:center;gap:2px;padding:3px;border-radius:10px;background:var(--surface-2);border:1px solid var(--border);flex:none;}
.us3-seg button{width:32px;height:30px;border:0;border-radius:7px;background:transparent;color:var(--text-3);cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:15px;padding:0;}
.us3-seg button.on{background:var(--surface);color:var(--brand);box-shadow:var(--shadow);}
.us3-bell{position:relative;width:38px;height:38px;border-radius:9px;border:1px solid var(--border);background:var(--surface);display:flex;align-items:center;justify-content:center;cursor:pointer;color:var(--text-2);flex:none;}
.us3-bell .dot{position:absolute;top:8px;right:9px;width:7px;height:7px;border-radius:50%;background:var(--danger);border:1.5px solid var(--surface);}
.us3-hamb{display:none;width:38px;height:38px;border-radius:9px;border:1px solid var(--border);background:var(--surface);cursor:pointer;align-items:center;justify-content:center;color:var(--text-2);flex:none;font-size:18px;}
/* pages -> scrollable main area right of sidebar, below topbar */
.page{display:none;position:fixed;top:60px;left:262px;right:0;bottom:0;overflow-y:auto;overflow-x:hidden;background:var(--bg);}
.page.active{display:block;}
#techSubBar{position:fixed;top:60px;left:262px;right:0;z-index:250;background:var(--surface);border-bottom:1px solid var(--border);box-shadow:var(--shadow);}
body.tech-sub #page-parts,body.tech-sub #page-scan,body.tech-sub #page-kit,body.tech-sub #page-count,body.tech-sub #page-shop,body.tech-sub #page-viewer{top:113px !important;}
#us3-navscrim{display:none;position:fixed;inset:0;background:rgba(8,14,22,.42);z-index:295;}
body.nav-open #us3-navscrim{display:block;}
@media(max-width:860px){
  #nav{transform:translateX(-100%);transition:transform .22s ease;box-shadow:var(--shadow-lg);}
  body.nav-open #nav{transform:none;}
  #topbar{left:0;}
  .page{left:0;}
  #techSubBar{left:0;}
  .us3-hamb{display:flex;}
  .us3-topsearch{display:none;}
}
