/* ===== Rune hover layer (Triquetra-inspired, reliable) ===== */

/* Apply rune hover to common interactive elements */
.btn-primary, .btn,
#main-nav .nav-link,
.card, .panel, .rme-card, .rme-panel {{
  position: relative;
  overflow: hidden;
}}

/* Rune layer */
.btn-primary::after, .btn::after,
#main-nav .nav-link::after,
.card::after, .panel::after, .rme-card::after, .rme-panel::after {{
  content:"";
  position:absolute;
  inset:-35%;
  pointer-events:none;
  opacity:0;
  transform:scale(0.92) rotate(-16deg);
  transition: opacity .35s ease, transform .85s ease;

  background:
    radial-gradient(circle at 50% 45%, rgba(185,166,255,0.55), rgba(124,58,237,0.22), transparent 64%);
  mix-blend-mode: screen;
  filter: blur(0.3px);

  -webkit-mask-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxMDAgMTAwIj4KICA8ZyBmaWxsPSJub25lIiBzdHJva2U9IndoaXRlIiBzdHJva2Utd2lkdGg9IjciIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCI+CiAgICA8Y2lyY2xlIGN4PSI1MCIgY3k9IjM0IiByPSIyMiIvPgogICAgPGNpcmNsZSBjeD0iMzQiIGN5PSI2NiIgcj0iMjIiLz4KICAgIDxjaXJjbGUgY3g9IjY2IiBjeT0iNjYiIHI9IjIyIi8+CiAgPC9nPgo8L3N2Zz4=");
  mask-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxMDAgMTAwIj4KICA8ZyBmaWxsPSJub25lIiBzdHJva2U9IndoaXRlIiBzdHJva2Utd2lkdGg9IjciIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCI+CiAgICA8Y2lyY2xlIGN4PSI1MCIgY3k9IjM0IiByPSIyMiIvPgogICAgPGNpcmNsZSBjeD0iMzQiIGN5PSI2NiIgcj0iMjIiLz4KICAgIDxjaXJjbGUgY3g9IjY2IiBjeT0iNjYiIHI9IjIyIi8+CiAgPC9nPgo8L3N2Zz4=");
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-size: 52%;
  mask-size: 52%;
}}

/* Show on hover / focus */
.btn-primary:hover::after, .btn-primary:focus-visible::after,
.btn:hover::after, .btn:focus-visible::after,
#main-nav .nav-link:hover::after, #main-nav .nav-link:focus-visible::after,
.card:hover::after, .card:focus-within::after,
.panel:hover::after, .panel:focus-within::after,
.rme-card:hover::after, .rme-card:focus-within::after,
.rme-panel:hover::after, .rme-panel:focus-within::after {{
  opacity:0.26;
  transform:scale(1.06) rotate(10deg);
}}

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {{
  .btn-primary::after, .btn::after,
  #main-nav .nav-link::after,
  .card::after, .panel::after, .rme-card::after, .rme-panel::after {{
    transition:none;
    transform:none;
  }}
}}