/* Patch 0.1.5.0.0 - Premium material/glimmer system.
   Adds asynchronous reflected glimmers without image buttons. */
:root{
  --material-glimmer-strength:.82;
  --material-glimmer-speed:1.35s;
  --material-metal-edge:rgba(255,255,255,.38);
  --material-metal-edge-low:rgba(255,255,255,.10);
}

.btn,.nav-toggle{
  background-blend-mode:screen,normal;
}

.btn.primary,.btn.secondary,.nav-toggle,.btn.titanium{
  border-color:color-mix(in srgb,var(--btn-edge-strong) 64%,transparent);
  background:
    radial-gradient(120% 170% at 50% -55%,rgba(255,255,255,.42) 0%,rgba(255,255,255,.18) 26%,transparent 47%),
    linear-gradient(180deg,rgba(255,255,255,.19) 0%,rgba(255,255,255,.052) 43%,rgba(0,0,0,.28) 100%),
    linear-gradient(135deg,#3d4650 0%,#161b22 52%,#0a0d12 100%);
  box-shadow:
    inset 0 1px 1px rgba(255,255,255,.46),
    inset 0 -1px 1px rgba(0,0,0,.55),
    inset 0 0 0 1px rgba(255,255,255,.035),
    0 16px 34px rgba(0,0,0,.38);
}

.btn.primary{
  background:
    radial-gradient(120% 170% at 50% -55%,rgba(255,255,255,.44) 0%,rgba(255,255,255,.20) 26%,transparent 48%),
    linear-gradient(180deg,rgba(255,255,255,.18),rgba(255,255,255,.035) 45%,rgba(0,0,0,.22)),
    linear-gradient(135deg,#5d89ff 0%,#3149b8 55%,#111b4f 100%);
}

.btn.glass{
  background:
    radial-gradient(120% 150% at 68% -42%,rgba(255,255,255,.36),transparent 43%),
    linear-gradient(135deg,rgba(255,255,255,.15),rgba(255,255,255,.045) 52%,rgba(93,137,255,.10));
  box-shadow:
    inset 0 1px 1px rgba(255,255,255,.50),
    inset 0 -1px 1px rgba(0,0,0,.26),
    0 18px 42px rgba(0,0,0,.34),
    0 0 26px rgba(93,137,255,.12);
}

.btn.precision{
  background:
    linear-gradient(180deg,rgba(255,255,255,.11),rgba(255,255,255,.018)),
    linear-gradient(135deg,#111722,#07090d);
}

.btn.neural{
  color:#fff;
  border-color:rgba(93,137,255,.68);
  background:
    radial-gradient(120% 180% at 50% 130%,rgba(63,55,201,.42),transparent 48%),
    linear-gradient(180deg,rgba(255,255,255,.12),rgba(255,255,255,.025)),
    linear-gradient(135deg,#14152a,#070713);
  box-shadow:0 0 28px rgba(93,137,255,.24),0 14px 34px rgba(0,0,0,.36),inset 0 1px 1px rgba(255,255,255,.24);
}

.btn.neural:hover{box-shadow:0 0 34px rgba(93,137,255,.38),0 18px 42px rgba(0,0,0,.44),inset 0 1px 1px rgba(255,255,255,.32)}

.btn::after,.nav-toggle::after{
  width:64%;
  background:linear-gradient(90deg,transparent 0%,rgba(255,255,255,.06) 19%,rgba(255,255,255,.78) 48%,rgba(255,255,255,.14) 70%,transparent 100%);
  filter:blur(.2px);
  opacity:.42;
}

.btn.material-glimmer::after,.nav-toggle.material-glimmer::after{
  animation:material-random-glimmer var(--material-glimmer-speed) cubic-bezier(.22,.74,.19,1) 1;
}

.btn.material-idle,.nav-toggle.material-idle{
  animation:material-breathe 9s ease-in-out infinite;
}

@keyframes material-random-glimmer{
  0%{transform:skewX(-22deg) translateX(-80%);opacity:0}
  12%{opacity:calc(var(--material-glimmer-strength) * .35)}
  46%{opacity:var(--material-glimmer-strength)}
  100%{transform:skewX(-22deg) translateX(455%);opacity:0}
}

@keyframes material-breathe{
  0%,100%{filter:brightness(1) saturate(1)}
  48%{filter:brightness(1.025) saturate(1.02)}
}

@media (prefers-reduced-motion:reduce){
  .btn.material-glimmer::after,.nav-toggle.material-glimmer::after,.btn.material-idle,.nav-toggle.material-idle{animation:none}
}
html[data-motion="reduced"] .btn.material-glimmer::after,html[data-motion="reduced"] .nav-toggle.material-glimmer::after,html[data-motion="reduced"] .btn.material-idle,html[data-motion="reduced"] .nav-toggle.material-idle{animation:none}