/* Rounded, quiet directional cues and native music-focused accents. */
body svg.ui-chevron {
  display:inline-block;
  width:1em;
  height:1em;
  min-width:12px;
  max-width:24px;
  max-height:24px;
  vertical-align:-.12em;
  flex:0 0 auto;
  fill:none;
  stroke:currentColor;
  stroke-width:2;
  stroke-linecap:round;
  stroke-linejoin:round;
  overflow:visible;
}
body svg.ui-chevron path { fill:none; stroke:currentColor; stroke-width:2; }
html[dir=rtl] svg.ui-chevron { transform:scaleX(-1); }
.home-page .artist-card:hover .artist-image-arrow { transform:translateX(2px); }
html[dir=rtl] .home-page .artist-card:hover .artist-image-arrow { transform:translateX(-2px); }
.home-page .artist-image-arrow svg.ui-chevron { width:18px; height:18px; }
.blog-page .blog-card-action svg.ui-chevron { width:16px; height:16px; }
.blog-page .blog-sources svg.ui-chevron { width:12px; height:12px; opacity:.65; }

.ui-emoji {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-family:'Apple Color Emoji','Segoe UI Emoji','Noto Color Emoji',sans-serif;
  font-style:normal;
  font-weight:400;
  line-height:1;
  letter-spacing:0;
  flex-shrink:0;
  -webkit-text-fill-color:initial;
}
.home-page .service-top { width:100%; align-items:center; }
.home-page .service-top > .ui-service-icon {
  width:56px;
  height:56px;
  padding:0;
  border-radius:18px;
  border:1px solid rgb(255 255 255 / 85%);
  background:linear-gradient(145deg,#fff,#f4e8f0);
  box-shadow:0 5px 16px rgb(76 38 71 / 6%),inset 0 1px 0 #fff;
  font-size:29px;
}
.home-page .service:nth-child(2) .ui-service-icon { background:linear-gradient(145deg,#fff,#eee7fc); }
.home-page .service:nth-child(3) .ui-service-icon { background:linear-gradient(145deg,#fff,#e6efff); }
.home-page .about-symbol {
  display:grid;
  place-items:center;
  width:88px;
  height:88px;
  border:1px solid rgb(255 255 255 / 75%);
  border-radius:26px;
  background:linear-gradient(145deg,rgb(255 255 255 / 90%),rgb(241 226 248 / 65%));
  box-shadow:0 12px 28px rgb(96 46 97 / 8%),inset 0 1px 0 #fff;
  transform:none;
}
.home-page .ui-about-emoji { font-size:48px; }
.blog-page .blog-title-star {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:1.12em;
  height:1.12em;
  margin-inline-start:.22em;
  font-size:.68em;
  vertical-align:middle;
  transform:none;
}
.blog-page .ui-journal-emoji { font-size:1em; }
.home-page .ui-proof-mark {
  display:inline-grid;
  place-items:center;
  width:18px;
  height:18px;
  flex:0 0 18px;
  margin-top:1px;
  border-radius:6px;
  background:#e6f5ec;
  color:#25704a;
  font-size:12px;
  line-height:1;
  font-weight:800;
}
.home-page .manifesto-strip > .ui-separator {
  display:block;
  width:5px;
  height:5px;
  border-radius:50%;
  flex:0 0 5px;
  background:linear-gradient(135deg,#d96493,#9271cf);
  opacity:.6;
}
.home-page .catalog-player-brand > .ui-sound-mark {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:3px;
  height:25px;
  width:28px;
}
.ui-sound-mark > i { display:block; width:4px; height:10px; border-radius:4px; background:currentColor; }
.ui-sound-mark > i:nth-child(2) { height:21px; }
.ui-sound-mark > i:nth-child(3) { height:16px; }
.ui-sound-mark > i:nth-child(4) { height:8px; }

html[data-theme=dark] .home-page .service-top > .ui-service-icon {
  border-color:#50405d;
  background:linear-gradient(145deg,#3b3045,#2d2535);
  box-shadow:0 6px 18px #0002,inset 0 1px 0 #ffffff0b;
}
html[data-theme=dark] .home-page .about-symbol {
  border-color:#57415f;
  background:linear-gradient(145deg,#4d3657,#34283f);
  box-shadow:0 12px 28px #0002,inset 0 1px 0 #ffffff0b;
}
html[data-theme=dark] .home-page .ui-proof-mark { background:#243e34; color:#9ae3b8; }
html[data-theme=dark] .home-page .manifesto-strip > .ui-separator { opacity:.85; }
@media(max-width:600px) {
  .home-page .service-top > .ui-service-icon { width:50px; height:50px; font-size:26px; border-radius:16px; }
  .home-page .about-symbol { width:76px; height:76px; border-radius:23px; }
  .home-page .ui-about-emoji { font-size:42px; }
  .home-page .manifesto-strip > .ui-separator:last-of-type { display:none; }
}
@media(prefers-reduced-motion:reduce) {
  .home-page .artist-card:hover .artist-image-arrow,
  html[dir=rtl] .home-page .artist-card:hover .artist-image-arrow { transform:none; }
}