/* ── Self-hosted Phosphor icon subset ─────────────────────────────
   Replaces @phosphor-icons/web (unpkg) — only the 37 icons this
   site actually uses, loaded as local SVG masks. No external
   requests, no full 1200+ icon font, no render-blocking 3rd-party
   stylesheets.
   Usage is unchanged: <i class="ph ph-star"></i>, <i class="ph-fill ph-star"></i>
   Fixes: ph-play-fill / ph-pause-fill / ph-stop-fill / ph-star-fill
   (used directly as single classes in some templates) now resolve
   correctly to their filled icon — previously these matched no CSS
   rule in the official stylesheet and rendered blank.
------------------------------------------------------------------- */

.ph,
.ph-fill {
  display: inline-block;
  width: 1em;
  height: 1em;
  background-color: currentColor;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-size: contain;
  mask-size: contain;
  vertical-align: -0.125em;
  flex-shrink: 0;
}

.ph-arrow-bend-up-left { -webkit-mask-image: url(../icons/arrow-bend-up-left.svg); mask-image: url(../icons/arrow-bend-up-left.svg); }
.ph-arrow-left { -webkit-mask-image: url(../icons/arrow-left.svg); mask-image: url(../icons/arrow-left.svg); }
.ph-arrow-square-out { -webkit-mask-image: url(../icons/arrow-square-out.svg); mask-image: url(../icons/arrow-square-out.svg); }
.ph-book-open { -webkit-mask-image: url(../icons/book-open.svg); mask-image: url(../icons/book-open.svg); }
.ph-bookmark { -webkit-mask-image: url(../icons/bookmark.svg); mask-image: url(../icons/bookmark.svg); }
.ph-bookmark-simple { -webkit-mask-image: url(../icons/bookmark-simple.svg); mask-image: url(../icons/bookmark-simple.svg); }
.ph-caret-left { -webkit-mask-image: url(../icons/caret-left.svg); mask-image: url(../icons/caret-left.svg); }
.ph-caret-right { -webkit-mask-image: url(../icons/caret-right.svg); mask-image: url(../icons/caret-right.svg); }
.ph-chat-circle { -webkit-mask-image: url(../icons/chat-circle.svg); mask-image: url(../icons/chat-circle.svg); }
.ph-check-circle { -webkit-mask-image: url(../icons/check-circle.svg); mask-image: url(../icons/check-circle.svg); }
.ph-corners-out { -webkit-mask-image: url(../icons/corners-out.svg); mask-image: url(../icons/corners-out.svg); }
.ph-eye { -webkit-mask-image: url(../icons/eye.svg); mask-image: url(../icons/eye.svg); }
.ph-headphones { -webkit-mask-image: url(../icons/headphones.svg); mask-image: url(../icons/headphones.svg); }
.ph-image { -webkit-mask-image: url(../icons/image.svg); mask-image: url(../icons/image.svg); }
.ph-instagram-logo { -webkit-mask-image: url(../icons/instagram-logo.svg); mask-image: url(../icons/instagram-logo.svg); }
.ph-linkedin-logo { -webkit-mask-image: url(../icons/linkedin-logo.svg); mask-image: url(../icons/linkedin-logo.svg); }
.ph-list { -webkit-mask-image: url(../icons/list.svg); mask-image: url(../icons/list.svg); }
.ph-magnifying-glass { -webkit-mask-image: url(../icons/magnifying-glass.svg); mask-image: url(../icons/magnifying-glass.svg); }
.ph-moon { -webkit-mask-image: url(../icons/moon.svg); mask-image: url(../icons/moon.svg); }
.ph-newspaper { -webkit-mask-image: url(../icons/newspaper.svg); mask-image: url(../icons/newspaper.svg); }
.ph-newspaper-clipping { -webkit-mask-image: url(../icons/newspaper-clipping.svg); mask-image: url(../icons/newspaper-clipping.svg); }
.ph-pencil-simple { -webkit-mask-image: url(../icons/pencil-simple.svg); mask-image: url(../icons/pencil-simple.svg); }
.ph-plus-circle { -webkit-mask-image: url(../icons/plus-circle.svg); mask-image: url(../icons/plus-circle.svg); }
.ph-printer { -webkit-mask-image: url(../icons/printer.svg); mask-image: url(../icons/printer.svg); }
.ph-rss-simple { -webkit-mask-image: url(../icons/rss-simple.svg); mask-image: url(../icons/rss-simple.svg); }
.ph-share-network { -webkit-mask-image: url(../icons/share-network.svg); mask-image: url(../icons/share-network.svg); }
.ph-sign-out { -webkit-mask-image: url(../icons/sign-out.svg); mask-image: url(../icons/sign-out.svg); }
.ph-sliders { -webkit-mask-image: url(../icons/sliders.svg); mask-image: url(../icons/sliders.svg); }
.ph-star { -webkit-mask-image: url(../icons/star.svg); mask-image: url(../icons/star.svg); }
.ph-sun { -webkit-mask-image: url(../icons/sun.svg); mask-image: url(../icons/sun.svg); }
.ph-trash { -webkit-mask-image: url(../icons/trash.svg); mask-image: url(../icons/trash.svg); }
.ph-x { -webkit-mask-image: url(../icons/x.svg); mask-image: url(../icons/x.svg); }
.ph-x-logo { -webkit-mask-image: url(../icons/x-logo.svg); mask-image: url(../icons/x-logo.svg); }

/* Correct usage: combine .ph-fill with the base icon class */
.ph-fill.ph-star { -webkit-mask-image: url(../icons/star-fill.svg); mask-image: url(../icons/star-fill.svg); }
.ph-fill.ph-play { -webkit-mask-image: url(../icons/play-fill.svg); mask-image: url(../icons/play-fill.svg); }
.ph-fill.ph-pause { -webkit-mask-image: url(../icons/pause-fill.svg); mask-image: url(../icons/pause-fill.svg); }
.ph-fill.ph-stop { -webkit-mask-image: url(../icons/stop-fill.svg); mask-image: url(../icons/stop-fill.svg); }

/* Back-compat: templates currently use these as single classes (e.g. class="ph ph-star-fill") — kept working as-is */
.ph-star-fill { -webkit-mask-image: url(../icons/star-fill.svg); mask-image: url(../icons/star-fill.svg); }
.ph-play-fill { -webkit-mask-image: url(../icons/play-fill.svg); mask-image: url(../icons/play-fill.svg); }
.ph-pause-fill { -webkit-mask-image: url(../icons/pause-fill.svg); mask-image: url(../icons/pause-fill.svg); }
.ph-stop-fill { -webkit-mask-image: url(../icons/stop-fill.svg); mask-image: url(../icons/stop-fill.svg); }