/* sahifadan sahifaga silliq o'tish (cross-document, React SPA hissi) */
@view-transition{ navigation: auto; }
::view-transition-old(root),::view-transition-new(root){animation-duration:.32s}

/* ===== TSP umumiy header (floating pill, brand lockup) — barcha sahifada bitta manba ===== */
header{position:fixed;top:18px;left:0;right:0;z-index:100}
.nav{max-width:1320px;width:calc(100% - 36px);margin:0 auto;display:flex;align-items:center;gap:22px;background:rgba(255,255,255,.82);backdrop-filter:saturate(160%) blur(16px);border:1px solid var(--line);border-radius:999px;box-shadow:0 12px 40px rgba(9,54,116,.12);padding:11px 14px 11px 22px}

/* brand — TSP logo */
.brand{display:flex;align-items:center;gap:12px;flex:none;text-decoration:none}
.brand-logo{height:38px;width:auto;display:block;-webkit-user-select:none;user-select:none}

/* nav links */
.links{display:flex;align-items:center;gap:2px;margin:0 auto}
.links a{font:600 14px/1 var(--display);color:var(--muted);text-decoration:none;padding:9px 14px;border-radius:999px;white-space:nowrap;transition:color .15s,background .15s}
.links a:hover{color:var(--navy);background:#f1f4f9}
.links a.on{color:var(--navy);font-weight:700;background:#eef6ff}

/* right group */
.hr{display:flex;align-items:center;gap:14px;flex:none}
.ph{font:600 13px/1 var(--mono);color:var(--navy);white-space:nowrap;text-decoration:none}
.nav .btn{padding:12px 22px;font-size:13.5px}

/* ===== burger + mobil menyu (desktop'da ko'rinmaydi) ===== */
.burger{display:none}
@media(min-width:1081px){ .mnav,.mnav-bg{display:none!important} }

@media(max-width:1080px){
  .links,.hr{display:none}
  .burger{display:inline-flex;flex-direction:column;justify-content:center;gap:5px;width:44px;height:44px;margin-left:auto;padding:0;border:0;background:transparent;cursor:pointer;border-radius:12px}
  .burger span{display:block;width:22px;height:2px;margin:0 auto;background:var(--navy);border-radius:2px;transition:transform .28s ease,opacity .18s ease}
  .mnav-open .burger span:nth-child(1){transform:translateY(7px) rotate(45deg)}
  .mnav-open .burger span:nth-child(2){opacity:0}
  .mnav-open .burger span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

  .mnav-bg{position:fixed;inset:0;z-index:98;background:rgba(9,54,116,.28);backdrop-filter:blur(2px);opacity:0;visibility:hidden;transition:opacity .3s ease,visibility .3s ease}
  .mnav-open .mnav-bg{opacity:1;visibility:visible}

  .mnav{position:fixed;top:84px;left:18px;right:18px;z-index:99;background:rgba(255,255,255,.96);backdrop-filter:saturate(160%) blur(18px);border:1px solid var(--line);border-radius:26px;box-shadow:0 20px 60px rgba(9,54,116,.18);padding:14px;opacity:0;visibility:hidden;transform:translateY(-12px);transition:opacity .3s ease,transform .3s ease,visibility .3s ease}
  .mnav-open .mnav{opacity:1;visibility:visible;transform:none}
  .mnav-links{display:flex;flex-direction:column}
  .mnav-links a{font:700 17px/1 var(--display);color:var(--navy);text-decoration:none;padding:14px 16px;border-radius:14px;transition:background .15s}
  .mnav-links a:hover{background:#f1f4f9}
  .mnav-links a.on{background:#eef6ff}
  .mnav-foot{display:flex;flex-direction:column;gap:12px;margin-top:10px;padding:16px 16px 6px;border-top:1px solid var(--line)}
  .ph-m{font:600 15px/1 var(--mono);color:var(--navy);text-decoration:none}
  .mnav-foot .btn{text-align:center}
  html.mnav-open,html.mnav-open body{overflow:hidden}
}
@media(max-width:560px){.brand-logo{height:32px}}