:root{
  --glass-surface:rgba(8,12,15,.34);
  --glass-surface-strong:rgba(8,12,15,.46);
  --glass-line:rgba(255,255,255,.115);
  --glass-line-hot:rgba(145,243,156,.30);
  --glass-shadow:inset 0 1px 0 rgba(255,255,255,.13),inset 0 -1px 0 rgba(145,243,156,.055);
  --glass-shadow-hover:inset 0 1px 0 rgba(255,255,255,.17),inset 0 -1px 0 rgba(145,243,156,.10),inset 1px 0 0 rgba(255,255,255,.025),inset -1px 0 0 rgba(145,243,156,.025);
  --glass-blur:22px;
}

/* Liquid glass should read as part of the surface, not as a floating card casting a shadow. */
.professional-page .project-card,
.passion-page .project-card,
.tooling-page .plugin-card,
.plugins-page .plugin-card,
.tooling-page .software-repo-card,
.plugins-page .software-repo-card,
.tooling-page .plugin-focus-card,
.plugins-page .plugin-focus-card,
.tooling-page .tooling-activity-shell,
.plugins-page .tooling-activity-shell,
.post-card,
.publisher-card,
.article-pullquote,
.article-closing{
  box-shadow:var(--glass-shadow)!important;
  -webkit-backdrop-filter:blur(var(--glass-blur)) saturate(146%) brightness(1.025)!important;
  backdrop-filter:blur(var(--glass-blur)) saturate(146%) brightness(1.025)!important;
}

.professional-page .project-card:hover,
.passion-page .project-card:hover,
.professional-page .project-card.is-focused,
.passion-page .project-card.is-active,
.tooling-page .plugin-card:hover,
.plugins-page .plugin-card:hover,
.tooling-page .software-repo-card:hover,
.plugins-page .software-repo-card:hover,
.tooling-page .plugin-card.is-selected,
.plugins-page .plugin-card.is-selected,
.tooling-page .software-repo-card.is-selected,
.plugins-page .software-repo-card.is-selected,
.post-card:hover,
.publisher-card:hover{
  box-shadow:var(--glass-shadow-hover)!important;
}

/* Keep motion subtle: refraction/edge response should sell the glass, not elevation. */
.professional-page .project-card:hover,
.passion-page .project-card:hover,
.tooling-page .plugin-card:hover,
.plugins-page .plugin-card:hover,
.tooling-page .software-repo-card:hover,
.plugins-page .software-repo-card:hover,
.post-card:hover,
.publisher-card:hover{
  transform:translateY(-1px)!important;
}

.steam-game-card{
  background:
    linear-gradient(145deg,rgba(255,255,255,.052),rgba(255,255,255,.010) 42%,rgba(145,243,156,.018)),
    rgba(8,12,15,.38)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.13),inset 0 -1px 0 rgba(145,243,156,.055)!important;
  -webkit-backdrop-filter:blur(20px) saturate(146%) brightness(1.02)!important;
  backdrop-filter:blur(20px) saturate(146%) brightness(1.02)!important;
}

.steam-game-card[href]:hover{
  box-shadow:inset 0 1px 0 rgba(255,255,255,.17),inset 0 -1px 0 rgba(145,243,156,.10)!important;
  transform:translateY(-1px)!important;
}

.game-platform-stamp{
  box-shadow:inset 0 1px 0 rgba(255,255,255,.085)!important;
}

.media-stage,
.media-frame .media-stage,
.article-video-frame{
  box-shadow:inset 0 1px 0 rgba(255,255,255,.065)!important;
}

/* A faint edge refraction instead of a cast shadow. */
.professional-page .project-card,
.passion-page .project-card,
.tooling-page .plugin-card,
.plugins-page .plugin-card,
.tooling-page .software-repo-card,
.plugins-page .software-repo-card,
.steam-game-card,
.post-card,
.publisher-card,
.article-pullquote,
.article-closing{
  outline:1px solid rgba(255,255,255,.018);
  outline-offset:-2px;
}
