/* Studio Memo — dark/light artist chooser; mobile first. */
.memo-home .memo-artist-overview{
  --chooser-bg:#0c0c0d;
  --chooser-ink:#fff;
  --chooser-muted:rgba(255,255,255,.7);
  --chooser-surface:rgba(255,255,255,.09);
  --chooser-stroke:rgba(255,255,255,.28);
  position:relative;isolation:isolate;
  width:100%;height:100svh;min-height:100svh;
  background:var(--chooser-bg);color:var(--chooser-ink);
  scroll-snap-align:start;scroll-snap-stop:always;
  overflow:hidden;
}
@supports(height:100dvh){.memo-home .memo-artist-overview{height:100dvh;min-height:100dvh}}
.memo-inside:not([data-discipline="tattoo"])>.memo-artist-overview{display:none}
.artist-chooser-inner{
  width:min(100%,750px);height:100%;margin:0 auto;
  padding:max(54px,env(safe-area-inset-top)) 18px max(24px,env(safe-area-inset-bottom));
  display:flex;flex-direction:column;align-items:center;justify-content:space-between;gap:10px;
}
.artist-chooser-heading{text-align:center;z-index:2;flex:none}
.artist-chooser-kicker{
  margin:0 0 12px;font:600 10px/1.3 var(--memo-copy,"Roboto",Arial,sans-serif);
  letter-spacing:.21em;color:var(--chooser-muted);
}
.artist-chooser-heading h2{
  font:500 clamp(37px,10vw,68px)/1.02 var(--memo-display,"Montserrat",Arial,sans-serif);
  letter-spacing:-.065em;margin:0;color:var(--chooser-ink);
}
.artist-chooser-heading h2 span{color:var(--chooser-ink)}
.artist-chooser-description{
  color:var(--chooser-muted);font:400 13px/1.45 var(--memo-copy,"Roboto",Arial,sans-serif);
  margin:14px 0 0;
}
.artist-orbit{
  position:relative;isolation:isolate;
  width:min(100%,min(54svh,490px));aspect-ratio:1;
  flex:0 1 auto;margin:auto 0;
}
.artist-orbit-ring{
  position:absolute;inset:0;transform-origin:50% 50%;
  animation:artist-rotate 150s linear infinite;
  will-change:transform;
}
.artist-orbit-tile{
  appearance:none;
  position:absolute;
  width:23%;height:23%;aspect-ratio:1;
  padding:0;margin:0;
  border:1px solid var(--chooser-stroke);
  border-radius:50%;
  overflow:hidden;
  background:var(--chooser-surface);
  box-shadow:0 6px 22px #0003;
  transition:border-color .2s,box-shadow .2s;
  cursor:pointer;
  touch-action:manipulation;
}
.artist-orbit-tile:nth-child(1){left:38.5%;top:2.5%}
.artist-orbit-tile:nth-child(2){left:66.5%;top:15.5%}
.artist-orbit-tile:nth-child(3){left:74.5%;top:46.5%}
.artist-orbit-tile:nth-child(4){left:54.5%;top:70.5%}
.artist-orbit-tile:nth-child(5){left:22.5%;top:70.5%}
.artist-orbit-tile:nth-child(6){left:2.5%;top:46.5%}
.artist-orbit-tile:nth-child(7){left:10.5%;top:15.5%}
.artist-orbit-tile:where(:hover,:focus-visible){border-color:var(--chooser-ink);box-shadow:0 8px 30px #0005}
.artist-orbit-face{
  position:relative;display:block;width:100%;height:100%;
  animation:artist-counterrotate 150s linear infinite;
  transform-origin:50% 50%;
}
.artist-orbit-face img{display:block;width:100%;height:100%;object-fit:cover;object-position:center}
.artist-name-strip{
  display:flex;align-items:center;justify-content:flex-start;
  gap:10px;width:100%;max-width:100%;
  min-height:55px;flex:none;
  overflow-x:auto;overflow-y:hidden;
  padding:4px 6px 8px;
  scroll-snap-type:x proximity;
  overscroll-behavior-x:contain;
  touch-action:pan-x;
  -webkit-overflow-scrolling:touch;
  scrollbar-width:none;
}
.artist-name-strip::-webkit-scrollbar{display:none}
.artist-name-chip{
  flex:0 0 auto;min-height:44px;min-width:76px;
  padding:11px 19px;
  border-radius:999px;
  border:1px solid var(--chooser-stroke);
  background:var(--chooser-surface);
  color:var(--chooser-ink);
  font:500 14px/1.15 var(--memo-copy,"Roboto",Arial,sans-serif);
  white-space:nowrap;
  scroll-snap-align:start;
  -webkit-backdrop-filter:blur(22px) saturate(160%);
  backdrop-filter:blur(22px) saturate(160%);
}
.artist-name-chip:where(:hover,:focus-visible){border-color:var(--chooser-ink)}
.artist-chooser-footnote{
  flex:none;margin:0;text-align:center;color:var(--chooser-muted);
  font:400 11px/1.4 var(--memo-copy,"Roboto",Arial,sans-serif);
}
@keyframes artist-rotate{to{transform:rotate(360deg)}}
@keyframes artist-counterrotate{to{transform:rotate(-360deg)}}
@media(max-width:700px){
  .artist-chooser-inner{padding-top:max(54px,env(safe-area-inset-top))}
  .artist-orbit{width:min(94%,min(54svh,440px))}
  .artist-chooser-description{font-size:12px}
}
@media(max-height:650px){
  .artist-chooser-inner{padding-top:20px;padding-bottom:13px;gap:5px}
  .artist-chooser-heading h2{font-size:clamp(27px,6.5vh,42px)}
  .artist-chooser-kicker{margin-bottom:5px}
  .artist-chooser-description{margin-top:5px}
  .artist-orbit{width:min(92%,min(53svh,380px))}
  .artist-chooser-footnote{font-size:9px}
}
@media(prefers-reduced-motion:reduce){
  .artist-orbit-ring,.artist-orbit-face{animation:none}
}
@media(prefers-color-scheme:light){
  .memo-home .memo-artist-overview{
    --chooser-bg:#f8f8f6;--chooser-ink:#151515;
    --chooser-muted:rgba(15,15,15,.68);
    --chooser-surface:rgba(0,0,0,.045);
    --chooser-stroke:rgba(0,0,0,.24);
  }
}
html[data-theme="day"] .memo-home .memo-artist-overview{
  --chooser-bg:#f8f8f6;--chooser-ink:#151515;
  --chooser-muted:rgba(15,15,15,.68);
  --chooser-surface:rgba(0,0,0,.045);
  --chooser-stroke:rgba(0,0,0,.24);
}
html[data-theme="night"] .memo-home .memo-artist-overview{
  --chooser-bg:#0c0c0d;--chooser-ink:#fff;
  --chooser-muted:rgba(255,255,255,.7);
  --chooser-surface:rgba(255,255,255,.09);
  --chooser-stroke:rgba(255,255,255,.28);
}

/* Compact orbit and name navigation on smaller phones. */
@media(max-width:700px){
  .artist-name-strip{width:calc(100% + 36px);margin-inline:-18px;padding-inline:18px;gap:8px}
  .artist-name-chip{font-size:13px;min-height:44px;padding:10px 16px;min-width:72px}
}
@media(max-height:650px){
  .artist-name-strip{min-height:47px;padding-bottom:3px}
  .artist-name-chip{min-height:40px;padding-block:9px}
}
