/* Navigation and action feedback. Terminal typing lives in typewriter.css. */
:root{--motion-ease:cubic-bezier(.16,1,.3,1)}
.site-header::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;background:var(--green);transform:scaleX(var(--reading-progress,0));transform-origin:left;pointer-events:none}
.site-header nav a{position:relative}
.site-header nav a::after{content:"";position:absolute;left:0;right:0;bottom:4px;height:1px;background:var(--green);transform:scaleX(0);transform-origin:left;transition:transform 240ms var(--motion-ease)}
.site-header nav a[aria-current="location"]{color:var(--green)}
.site-header nav a[aria-current="location"]::after{transform:scaleX(1)}
.button{transition:background 180ms,border-color 180ms,transform 200ms var(--motion-ease)}
.button:active{transform:translateY(1px) scale(.985)}
.button svg,.file-footer svg,.telegram-option svg,.site-footer svg{transition:transform 240ms var(--motion-ease)}
.project-card,.profile-file{transition:border-color 220ms,background 220ms}
.project-file,.file-bar{transition:color 220ms,background 220ms}
.folder-label svg{transition:transform 260ms var(--motion-ease),color 180ms}
.plus:after{transition:transform 240ms var(--motion-ease)}
.copy-button{position:relative;transition:color 180ms,border-color 180ms,background 180ms}
.copy-button::after{content:"";position:absolute;width:12px;height:7px;border-left:2px solid currentColor;border-bottom:2px solid currentColor;transform:translateY(-2px) rotate(-45deg) scale(.5);opacity:0;transition:opacity 150ms,transform 220ms var(--motion-ease)}
.copy-button svg{transition:opacity 150ms,transform 220ms var(--motion-ease)}
.copy-button.is-copied{color:var(--green);border-color:var(--green);background:#17271c}
.copy-button.is-copied svg{opacity:0;transform:scale(.6)}
.copy-button.is-copied::after{opacity:1;transform:translateY(-2px) rotate(-45deg) scale(1)}
.back-top{transition:background 180ms,border-color 180ms}
.back-top svg{transition:transform 220ms var(--motion-ease)}
@media(hover:hover) and (pointer:fine){
  .button:hover{transform:translateY(-2px)}
  .button:hover svg:last-child,.telegram-option:hover svg{transform:translate(2px,-2px)}
  .file-footer:hover svg{transform:translateY(3px)}
  .site-footer a:hover svg,.back-top:hover svg{transform:translateY(-3px)}
  .project-card:hover{border-color:#50745b}
  .project-card:hover .project-file,.profile-file:hover .file-bar{color:var(--green);background:#18221e}
  .profile-file:hover{border-color:#50745b}
  .skill-card:hover .folder-label svg{transform:translateY(-3px) rotate(-6deg);color:var(--green)}
}
@media(prefers-reduced-motion:reduce){
  .button,.button:hover,.button:active,.button svg,.file-footer svg,.telegram-option svg,.site-footer svg,.folder-label svg,.back-top svg{transform:none!important}
  .copy-button svg,.copy-button::after{transition:opacity 100ms!important}
}
