


:root{
  --pad:clamp(10px, 3vw, 50px);
  --glow-r: 0px;
  --glow-color: rgba(5, 5, 5, 0.993);
  --h:clamp(50px,8vw,70px);
  
  --scroll-threshold:10;
  --scroll-lag:10;
  --hover-bg-enable:0;
  --hover-bg-range:120;
}

   .pk-header{
    position:fixed; inset:0 0 auto 0; height:var(--h); z-index:2000;
    background:rgba(41,41,41,0); box-shadow:0 0 0 0 rgba(0,0,0,0);
    transition:background .35s ease, box-shadow .35s ease;
  
    
    --ui-scale: 1.16;
    --ui-speed: .75s;
    --ui-ease: cubic-bezier(.2,.8,.2,1);
  
  
  --ui-color:       var(--hero-text,   #e3fc00);
  --ui-color-muted: var(--color-secondary);
  
    
    --ui-text-glow:   0 0 var(--glow-r,6px) var(--glow-color,rgba(255,255,255,.45)),
                      0 0 var(--glow-r,6px) var(--glow-color,rgba(255,255,255,.45));
    --ui-box-glow:    0 0 var(--glow-r,6px) var(--glow-color,rgba(255,255,255,.45));
    --ui-filter-glow: drop-shadow(0 0 var(--glow-r,6px) var(--glow-color,rgba(255,255,255,.45)));
  }
  .pk-header.is-on{ background:var(--hdr-bg-on); box-shadow:var(--hdr-shadow-on); }
  
  .pk-inner{
    height:100%;
    display:flex; align-items:center; justify-content:space-between;
    gap:16px;
  }
  
  
  .pk-header a{
    font:600 20px/1.2 var(--font-ui-menu);
    color:var(--ui-color); text-decoration:none;
    text-shadow:var(--ui-text-glow);
    transition:color .35s ease, text-shadow .35s ease;
  }
  #pkHeader.is-on a:link,#pkHeader.is-on a:visited{color: var(--hero-text-muted) !important;}
  
  
  
  
  
  .pk-home-link{
    margin-left:var(--pad);
    display:inline-flex; align-items:center; justify-content:center;
    
    border-radius:10px;
  }

  .pk-home-link .ico{
    font-size: clamp(25px, 5vw, 40px);
    width: clamp(28px, 4vw, 40px)!important;
    height: clamp(28px, 4vw, 40px) !important;
    transform:scale(1);
    transition:transform var(--ui-speed) var(--ui-ease);
  }
  
  .pk-home-link:hover .ico,
  .pk-home-link:focus-visible .ico{
    transform:scale(var(--ui-scale));
  }
  
  .pk-home-link:active .ico{
    transform:scale(calc(var(--ui-scale)*0.92));
  }

 #pkHeader.is-on .pk-home-link{color: var(--hero-text-muted);}
  
  
  .pk-burger{
    margin-right:var(--pad);                                                    
                  
    width:clamp(40px, 5vw, 50px); height:clamp(35px, 5vw, 40px); position:relative;         
    border:0; background:transparent; cursor:pointer;
    color:var(--ui-color);
    transform:scale(1);
    transition:transform var(--ui-speed) var(--ui-ease), color .2s ease;
    touch-action:manipulation;
  }
  #pkHeader.is-on .pk-burger{color: var(--hero-text-muted);}
  .pk-burger:hover,.pk-burger:focus-visible{ transform:scale(var(--ui-scale)); }            
  .pk-burger:active{ transform:scale(calc(var(--ui-scale)*0.92)); }
  .pk-burger span{
    position:absolute; left:10px; right:10px; height:2px;
    background:currentColor; box-shadow:var(--ui-box-glow);
    transition:transform .35s ease, opacity .25s ease, top .35s ease, bottom .35s ease;
  }
  .pk-burger span:nth-child(1){ top:10px; }                                                      
  .pk-burger span:nth-child(2){ top:50%; transform:translateY(-50%); }                           
  .pk-burger span:nth-child(3){ bottom:10px; }                                                     
  .pk-menu-open #pkBurger span:nth-child(1){ top:50%; transform:translateY(-50%) rotate(45deg); }    
  .pk-menu-open #pkBurger span:nth-child(2){ opacity:0; }
  .pk-menu-open #pkBurger span:nth-child(3){ bottom:auto; top:50%; transform:translateY(-50%) rotate(-45deg); } 
  
  
  .pk-overlay{
    position:fixed; inset:0; background:transparent; z-index:1999;
    opacity:0; pointer-events:none; transition:opacity .2s ease;
  }
  .pk-menu-open #pkOverlay{ opacity:1; pointer-events:auto; }
  
  
  .pk-drawer{
    position:fixed;
    right:var(--pad,40px);
    top:calc(var(--header-h, var(--h,70px)) + 8px);                          
    z-index:2460;
    color:var(--color-primary);
    background: var(--glass-bg);                                              
    border:1px solid var(--glass-bd);
    border-radius:14px;
    box-shadow: var(--shadow-2);
    -webkit-backdrop-filter: blur(var(--glass-blur));
            backdrop-filter: blur(var(--glass-blur));
  padding:12px 20px 10px 20px;
  width:max-content; min-width:180px; max-width:min(92vw, 440px);
  max-height:calc(100dvh - var(--h,70px) - 24px); overflow:auto;

  transform:translateY(-24px); opacity:0;
  will-change:transform, opacity;
  transition:transform .6s cubic-bezier(.2,.8,.2,1), opacity .6s ease;
  
    
  }

  .pk-drawer__main a{
    display:block; font:600 18px/1.3 var(--font-ui-menu);
    color:var(--color-primary) !important; text-decoration:none;
    padding:5px 10px; border-radius:8px; cursor:pointer;
    white-space:nowrap; color:var(--color-primary);
  }

  
  .pk-drawer__main a:hover{ background: color-mix(in srgb, var(--color-primary) 10%, transparent); }
  
  .pk-drawer__main a + a{ margin-top:3px; }
  .pk-hr{ border:0; height:1px; margin:10px 0 10px; background: color-mix(in srgb, var(--color-primary) 14%, transparent); }
  .pk-drawer__footer{ display:flex; align-items:center; gap:12px; }
  
  
  .pk-menu-open #pkNavDrawer{ transform:translateY(0); opacity:1; }

 
  
  
  .pk-theme-btn{
    inline-size:40px; block-size:40px; border-radius:10px;
    display:grid; place-items:center;
    color:var(--color-primary);
    background:transparent; border:1px solid transparent;
    cursor:pointer;
    transform:scale(1);
    transition:transform .18s var(--ui-ease), color .2s ease;
  }
  .pk-theme-btn .ico{ font-size:26px; }



  
  .pk-drawer__footer .pk-login-btn .ico{
    display:inline-block;
    width:calc(var(--ico) + 10px);
    height:calc(var(--ico) + 10px);

    stroke: currentColor;
    fill: none;

    
    stroke-width: 26;

    stroke-linecap: round;
    stroke-linejoin: round;
  }






  .pk-theme-btn:hover{ transform:scale(1.08); }
  .pk-theme-btn:active{ transform:scale(.94); }
  
  
  @keyframes themeIconOut{ to{ transform:translateY(-40%); opacity:0; } }
  @keyframes themeIconIn { from{ transform:translateY(40%);  opacity:0; } to{ transform:translateY(0); opacity:1; } }
  .pk-theme-btn.is-swap .ico{ animation:themeIconOut .22s ease both; }
  .pk-theme-btn.is-swap-in .ico{ animation:themeIconIn  .22s ease both; }
  
  
  .pk-lang2{ position:relative; }
  .pk-lang2__btn{
    display:inline-flex; align-items:center; gap:8px;
    padding:8px 12px; 
    background:transparent; border:0px solid color-mix(in srgb, var(--color-primary) 16%, transparent);
    color:var(--color-primary); cursor:pointer;
    font:600 18px/1 var(--font-ui-menu);
    transition:transform .18s var(--ui-ease), background .2s ease, border-color .2s ease;
  }


  .pk-lang2__btn:hover{ transform:scale(1.02); }
  .pk-lang2__btn:active{ transform:scale(.98); }
  .pk-lang2__btn .ico{ font-size:26px; }
  
  
  
  .pk-lang2__menu{
    position:fixed; left:0; top:0; 
    color:var(--color-primary);
    background: var(--glass-bg);
    border:1px solid var(--glass-bd);
    border-radius:10px;
    -webkit-backdrop-filter: blur(var(--glass-blur));
            backdrop-filter: blur(var(--glass-blur));
    box-shadow: var(--shadow-2);
    padding:6px;
    margin:0;
    list-style:none;
    z-index:3001;
    min-width: 160px;
    font:600 16px/1 var(--font-ui-menu);
  }
  .pk-lang2__menu[hidden]{ display:none; }
  .pk-lang2__menu li{
    padding:12px 10px; border-radius:8px; cursor:pointer;
    white-space:nowrap; color:var(--color-primary);
  }
  .pk-lang2__menu li:hover{ background: color-mix(in srgb, var(--color-primary) 10%, transparent); }



.pk-drawer__footer .btn-small{
  width: 38px;
  height: 38px;
  color: var(--color-primary, #ddd);
}
.pk-drawer__footer .btn-small .icon{
  width: 18px;
  height: 18px;
}

  

  @media (max-width:639px){
    #pkHeader{ --h:50px; }
    .pk-header a{font-size: 16px;}
  }
  
