/* ===== Icon harmony pass — v1 =====
   One dark plate, optical—not raw—sizing. Brand marks keep their identity,
   while high-contrast source artwork no longer controls the whole grid. */
:root { --icon-box: 54px; --icon-pad: 8px; }
html[data-theme="dark"] .favicon-container,
body[data-theme="dark"] .favicon-container {
  background: linear-gradient(145deg, rgba(84, 101, 140, .30), rgba(13, 17, 28, .58));
  border-color: rgba(196, 211, 255, .14);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.11), 0 3px 8px rgba(0,0,0,.18);
}
/* Let every mark breathe inside the same optical frame. */
.favicon { padding: var(--icon-pad); }
/* Dense white-backed or circular assets: deliberately smaller and calmer. */
li[data-icon="NodeSeek.png"] .favicon,
li[data-icon="Navidrome.png"] .favicon,
li[data-icon="FileBrowser.png"] .favicon,
li[data-icon="CloudFlare.png"] .favicon {
  padding: 12px;
  filter: saturate(.78) brightness(.93);
}
li[data-icon="Navidrome.png"] .favicon { padding: 13px; filter: saturate(.68) brightness(.88); }
li[data-icon="CloudFlare.png"] .favicon { padding: 13px; filter: saturate(.70) brightness(.88); }
/* Saturated green / blue artwork should not become the visual priority. */
li[data-icon="WorkBuddy.png"] .favicon,
li[data-icon="Emby.png"] .favicon,
li[data-icon="MasterGo.png"] .favicon {
  padding: 10px;
  filter: saturate(.78) brightness(.90);
}
/* Illustration becomes a quiet service mark rather than a competing avatar. */
li[data-icon="Komari.png"] .favicon {
  padding: 10px;
  filter: saturate(.66) brightness(.92) contrast(.96);
}
/* The thin outlined qBittorrent mark needs a little more apparent weight. */
li[data-icon="Qbittorrent.png"] .favicon {
  padding: 5px;
  filter: saturate(.82) brightness(1.10) contrast(1.08);
}
/* Compact, already well-balanced marks retain more presence. */
li[data-icon="Sub2API.png"] .favicon,
li[data-icon="Symedia.png"] .favicon,
li[data-icon="MoviePilot.png"] .favicon,
li[data-icon="Redia.png"] .favicon { padding: 7px; }
@media (max-width: 520px) {
  :root { --icon-box: 50px; }
  li[data-icon="NodeSeek.png"] .favicon,
  li[data-icon="Navidrome.png"] .favicon,
  li[data-icon="FileBrowser.png"] .favicon,
  li[data-icon="CloudFlare.png"] .favicon { padding: 11px; }
}

/* ===== v2: full-bleed source icons =====
   The navigation now treats each supplied app icon like qBittorrent: every
   image fills the same 50–54px plate.  No per-app shrinking or muting. */
.favicon {
  inset: 0;
  width: 100%;
  height: 100%;
  padding: 0 !important;
  border-radius: inherit;
  object-fit: cover;
  object-position: center;
  filter: none !important;
}