/*
             ___
  __      __/ _ \ _ __  _ __   __ _
  \ \ /\ / / | | | '_ \| '_ \ / _` |
   \ V  V /| |_| | | | | | | | (_| |
    \_/\_/  \___/|_| |_|_| |_|\__,_|

  made by w0nna · HANC Studio
*/

/* Studio 2.0: публичные страницы (404, changelog) — стеклянная pill-навигация из дизайн-экспортов.
   Токены берутся из core.css (.hs-root / .hs-root.is-light). */
.pg-ic-moon,.pg-ic-sun,.au-ic-moon,.au-ic-sun{display:block}
.hs-root:not(.is-light) .au-ic-moon{display:none}
.hs-root.is-light .au-ic-sun{display:none}
@keyframes pg-up{from{opacity:0;transform:translateY(22px);filter:blur(8px)}to{opacity:1;transform:none;filter:none}}
@keyframes pg-down{from{opacity:0;transform:translateY(-16px)}to{opacity:1;transform:none}}
.pg-up{animation:pg-up 900ms cubic-bezier(.2,.8,.2,1) both}
.pg-eyebrow{font-family:"Onest",system-ui,sans-serif;font-size:12px;letter-spacing:.16em;color:var(--vhi)}

/* То же, что .hs-sr в core.css, продублировано, чтобы визуально скрытый h1 оставался скрытым даже там, где
   блоки @supports из core.css не применяются. */
.hs-sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
html,body{min-height:100%}
body.hs-root{min-height:100vh;overflow-x:clip}

.pn-bar{position:absolute;left:0;right:0;top:0;z-index:20;display:flex;flex-direction:column;align-items:center;padding:0 16px}
.pn{position:relative;margin-top:20px;width:1320px;max-width:100%;flex-shrink:0;height:60px;box-sizing:border-box;padding:0 8px 0 22px;display:flex;align-items:center;gap:20px;background:var(--glass);border:1px solid var(--line);border-radius:999px;box-shadow:0 10px 40px -20px var(--shadow);animation:pg-down 900ms cubic-bezier(.2,.8,.2,1) both}
.pn-brand{display:flex;align-items:center;gap:10px;color:var(--ink);flex-shrink:0}
.pn-brand img{display:block;width:26px;height:24px}
.pn-word{font-size:15px;letter-spacing:-0.03em;white-space:nowrap}
.pn-word span{color:var(--ink3);font-weight:500}
.pn-badge{height:20px;padding:0 7px;display:flex;align-items:center;background:#7c3aed;border-radius:6px;font-size:10.5px;color:#ffffff}
.pn-links{display:flex;align-items:center;justify-content:center;gap:8px;flex-grow:1;min-width:0}
.pn-link{padding:8px 12px;font-size:14.5px;color:var(--ink2);white-space:nowrap}
.pn-side{display:flex;align-items:center;gap:4px;flex-shrink:0;margin-left:auto}
.pn-ic{width:44px;height:44px;display:flex;align-items:center;justify-content:center;background:#00000000;border:0;border-radius:999px;color:var(--ink2);padding:0}
.pn-lang{position:relative}
.pn-lang-btn{height:44px;padding:0 12px;display:flex;align-items:center;gap:6px;background:#00000000;border:0;border-radius:999px;color:var(--ink2);font-size:12px;letter-spacing:0.08em}
.pn-lang-btn svg{transition:transform 220ms cubic-bezier(.2,.8,.2,1)}
.pn-lang-btn[aria-expanded=true] svg{transform:rotate(180deg)}
.pn-lang-list{position:absolute;top:calc(100% + 10px);right:0;z-index:40;min-width:184px;box-sizing:border-box;padding:6px;display:flex;flex-direction:column;gap:2px;border-radius:18px;background:var(--panel);border:1px solid var(--line2);box-shadow:0 24px 48px -20px var(--shadow);-webkit-backdrop-filter:blur(20px) saturate(180%);backdrop-filter:blur(20px) saturate(180%)}
.pn-lang-list[hidden]{display:none}
.pn-lang-item{display:flex;align-items:center;gap:12px;min-height:40px;padding:0 12px;border-radius:12px;font-size:14px;color:var(--ink);transition:background-color 120ms}
.pn-lang-item b{width:22px;font-family:"Onest",system-ui,sans-serif;font-size:11px;font-weight:500;letter-spacing:.1em;color:var(--ink3)}
.pn-lang-item:hover,.pn-lang-item:focus-visible{background:var(--tint)}
.pn-lang-item[aria-checked=true],.pn-lang-item[aria-checked=true] b{color:var(--vhi)}
.pn-login{height:44px;padding:0 14px;display:flex;align-items:center;background:#00000000;border:0;border-radius:999px;color:var(--ink2);font-size:14.5px;font-weight:500;white-space:nowrap}
.pn-cta{height:44px;padding:0 20px;display:flex;align-items:center;background:var(--pri);border:0;border-radius:999px;color:var(--onpri);font-size:14.5px;font-weight:600;white-space:nowrap}
.pn-burger{display:none}
.pn-mob{width:100%;max-width:1320px;box-sizing:border-box;margin-top:8px;padding:8px 18px;display:flex;flex-direction:column;border-radius:24px;background:var(--panel);border:1px solid var(--line);box-shadow:0 24px 48px -20px var(--shadow)}
.pn-mob[hidden]{display:none}
.pn-mob a{display:flex;align-items:center;min-height:48px;font-size:16px;font-weight:500;color:var(--ink);border-bottom:1px solid var(--line)}
.pn-mob a:last-child{border-bottom:0}

@media (max-width:1180px){.pn{gap:12px}.pn-links{gap:2px}.pn-link{padding:8px 8px;font-size:14px}}
@media (min-width:900px){.pn-mob{display:none!important}}
@media (max-width:899px){
  .pn-links,.pn-login{display:none}
  .pn-burger{display:flex}
}
@media (max-width:560px){.pn-cta{display:none}}
@media (max-width:480px){
  .pn{padding:0 6px 0 14px;gap:8px}
  .pn-badge{display:none}
  .pn-ic{width:40px;height:40px}
  .pn-lang-btn{padding:0 8px}
}
@media (prefers-reduced-motion:reduce){
  .pn,.pg-up{animation:none!important}
  .pn-lang-btn svg{transition:none}
}