/* Shared global navigation: HOME / SHIYI / AI TEAM / contextual action.
   Loaded last on every surface so marketing pages and both app demos use one system. */
.unified-nav,
.global-nav.unified-nav{
  position:sticky;top:0;z-index:70;
  box-sizing:border-box;
  height:72px;min-height:72px;
  width:100%;
  padding:0 clamp(16px,4vw,76px);
  display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);
  align-items:center;gap:clamp(10px,2vw,30px);
  border:0;border-bottom:1px solid rgba(64,59,53,.14);
  background:rgba(250,249,246,.96);
  backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);
  color:#262725;
}
.unified-nav .identity,
.global-nav.unified-nav .identity{
  display:inline-flex;align-items:center;gap:11px;min-width:0;
  color:#252725;white-space:nowrap;justify-self:start;
  font-size:16px;font-weight:700;
}
.unified-nav .identity-mark{
  box-sizing:border-box;display:inline-flex;align-items:center;
  justify-content:center;flex:none;width:37px;height:37px;
  border:1px solid #c8c4bc;color:#343534;
  border-radius:6px;font-size:13px;letter-spacing:-.045em;
}
.unified-nav .identity-x{font-size:10px;margin:0 2px;color:#88867f}
.unified-nav .identity-name{font-size:17px;font-weight:650;letter-spacing:-.04em}
.unified-nav .identity-name i{font-style:normal;font-weight:400;color:#aaa39b}
.unified-nav .desktop-links,
.global-nav.unified-nav .desktop-links{
  display:flex;align-items:center;justify-content:center;
  gap:clamp(14px,2.4vw,35px);min-width:0;color:#615e59;
}
.unified-nav .desktop-links a{
  display:inline-flex;align-items:center;justify-content:center;
  padding:10px 2px;min-height:44px;white-space:nowrap;
  font-size:13px;font-weight:600;color:inherit;
  border-bottom:2px solid transparent;
  transition:color .16s ease,border-color .16s ease;
}
.unified-nav .desktop-links a:hover,
.unified-nav .desktop-links a[aria-current="page"]{color:#1b1f21;border-bottom-color:#3f505c}
.unified-nav .top-action,
.global-nav.unified-nav .top-action{
  justify-self:end;display:inline-flex;align-items:center;justify-content:center;
  gap:9px;min-height:42px;padding:10px 16px;
  border-radius:8px;border:1px solid #343636;
  background:#2b3135;color:#fff;font-size:12px;font-weight:700;
  white-space:nowrap;box-sizing:border-box;
  transition:background .16s ease,transform .16s ease;
}
.unified-nav .top-action:hover{color:#fff;background:#425461;transform:translateY(-1px)}
.unified-nav a:focus-visible{outline:3px solid #7ca5c3;outline-offset:3px;border-radius:5px}
.global-nav.unified-nav .top-action span{display:inline}
.unified-nav .demo-switch-short{display:none!important}
/* On phones keep the three destinations visible instead of hiding the nav. */
@media(max-width:800px){
  .unified-nav,.global-nav.unified-nav{
    height:60px;min-height:60px;padding:0 12px;gap:9px;
    display:flex;justify-content:space-between;grid-template-columns:none;
  }
  .unified-nav .identity{gap:0;flex-shrink:0}
  .unified-nav .identity-mark{width:32px;height:32px;font-size:11px}
  .unified-nav .identity-name{display:none}
  .unified-nav .desktop-links,.global-nav.unified-nav .desktop-links{
    display:flex;gap:clamp(7px,2vw,13px);flex:1 1 auto;
    min-width:0;justify-content:center;
  }
  .unified-nav .desktop-links a{font-size:12px;padding:8px 1px;min-height:38px}
  .unified-nav .top-action,.global-nav.unified-nav .top-action{
    padding:8px 10px;min-height:37px;font-size:11px;gap:3px;flex-shrink:0;
    border-radius:7px;
  }
  .unified-nav .demo-switch-long{display:none!important}
  .unified-nav .demo-switch-short{display:inline!important}
}
@media(max-width:360px){
  .unified-nav,.global-nav.unified-nav{gap:5px;padding:0 9px}
  .unified-nav .desktop-links,.global-nav.unified-nav .desktop-links{gap:5px}
  .unified-nav .desktop-links a{font-size:11px}
  .unified-nav .top-action,.global-nav.unified-nav .top-action{font-size:10px;padding:7px 7px}
}
/* Reduce full-page jumpiness; actions remain visible after navigation. */
.screen-scroll{scroll-behavior:auto!important}
@media(max-width:680px){
  .experience-layout .story-column{display:none}
  .experience-layout{padding-top:0!important}
  .device-workspace{max-width:100%!important}
  .screen-scroll{padding-bottom:calc(92px + env(safe-area-inset-bottom))!important}
  .bottom-nav .nav-item{touch-action:manipulation;min-height:48px}
}
@media(prefers-reduced-motion:reduce){
  .unified-nav a{transition:none!important}
  html{scroll-behavior:auto!important}
}

/* Product Lab nav semantics — clear connection to Ken's main portfolio. */
.unified-nav .identity-name{letter-spacing:-.025em;font-size:15px}
.unified-nav .identity-name i{padding:0 3px}
.unified-nav .desktop-links a.nav-experience{font-weight:700}
.unified-nav .ken-return,
.global-nav.unified-nav .ken-return{
  background:transparent;color:#424745;
  border:1px solid rgba(61,67,65,.28);
  box-shadow:none;
}
.unified-nav .ken-return:hover,
.global-nav.unified-nav .ken-return:hover{
  color:#1c2c34;background:#e7eeef;transform:none;
}
.unified-nav .ken-return-short{display:none}
.portfolio-footer-link{color:#b9d6dd;text-decoration:underline;text-underline-offset:3px}
.guide-switch a{color:inherit;text-decoration:underline;text-underline-offset:3px}
@media(max-width:890px) {
 .unified-nav .identity-name{font-size:12px}
 .unified-nav .desktop-links{gap:14px}
 .unified-nav .desktop-links a{font-size:12px}
 .unified-nav .ken-return-long{display:none}
 .unified-nav .ken-return-short{display:inline}
}
@media(max-width:800px) {
 .unified-nav .desktop-links,.global-nav.unified-nav .desktop-links{display:flex}
 .unified-nav .nav-experience{display:none!important}
 .unified-nav .ken-return-short{display:inline}
 .unified-nav .ken-return-long{display:none}
}
@media(max-width:359px){
 .unified-nav .desktop-links a{font-size:10px}
 .unified-nav .ken-return{font-size:10px}
}
