.star-users { scroll-margin-top:90px; }
.star-users-grid { position:relative; display:grid; grid-auto-flow:column; grid-auto-columns:calc((100% - 48px)/3); gap:24px; max-width:1020px; margin:0 auto; overflow-x:auto; scroll-snap-type:x mandatory; overscroll-behavior-x:contain; scrollbar-width:none; }
.star-users-grid::-webkit-scrollbar { display:none; }
.star-users-grid:focus-visible { outline:3px solid var(--orange); outline-offset:5px; border-radius:24px; }
.star-carousel-controls { display:flex; justify-content:space-between; align-items:center; gap:20px; max-width:1020px; margin:22px auto 0; }
.star-carousel-counter { color:var(--muted); font-size:14px; font-weight:600; }
.star-carousel-arrows { display:flex; gap:10px; }
.star-carousel-arrow { display:grid; place-items:center; width:46px; height:46px; border:1px solid var(--line); border-radius:50%; background:var(--card); color:var(--ink); cursor:pointer; transition:background .2s,color .2s; }
.star-carousel-arrow svg { width:20px; height:20px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.star-carousel-arrow:hover:not(:disabled) { background:var(--orange); color:white; }
.star-carousel-arrow:disabled { opacity:.3; cursor:default; }
.star-carousel-arrow:focus-visible { outline:3px solid var(--orange); outline-offset:3px; }
.star-photo-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px; max-width:1020px; margin:36px auto 0; }
.star-photo-grid[hidden] { display:none; }
.star-photo { position:relative; display:block; min-width:0; aspect-ratio:1; overflow:hidden; border-radius:20px; background:var(--cream-2); cursor:zoom-in; }
.star-photo:first-child { grid-column:span 2; aspect-ratio:auto; }
.star-photo img { position:absolute; inset:0; display:block; width:100%; height:100%; object-fit:cover; object-position:center 30%; transition:transform .3s; }
.star-photo:first-child img { object-position:center 10%; }
.star-photo:hover img { transform:scale(1.035); }
.star-photo:focus-visible { outline:3px solid var(--orange); outline-offset:4px; }
body.star-photo-open { overflow:hidden; }
#star-photo-dialog { margin:auto; padding:16px; width:min(1000px,94vw); max-width:94vw; max-height:94dvh; overflow:auto; border:0; border-radius:24px; background:var(--ink); color:white; }
#star-photo-dialog::backdrop { background:rgba(23,17,13,.86); }
.star-photo-toolbar, .star-photo-navigation { display:flex; justify-content:space-between; align-items:center; gap:16px; }
.star-photo-toolbar { margin-bottom:12px; }
#star-photo-counter { padding-left:8px; font-size:14px; }
#star-photo-full { display:block; width:100%; height:calc(94dvh - 152px); object-fit:contain; }
.star-photo-navigation { margin-top:12px; }
#star-photo-dialog button { display:grid; place-items:center; flex-shrink:0; width:44px; height:44px; border:1px solid rgba(255,255,255,.25); border-radius:50%; background:transparent; color:white; font-size:24px; cursor:pointer; }
#star-photo-dialog button:disabled { opacity:.3; cursor:default; }
#star-photo-dialog button:hover:not(:disabled) { background:var(--orange); }
#star-photo-original { color:inherit; font-size:13px; text-decoration:underline; }
#star-photo-dialog :focus-visible { outline:3px solid var(--orange); outline-offset:3px; }
.star-video-card { position:relative; min-width:0; aspect-ratio:9/16; overflow:hidden; border-radius:24px; border:1px solid var(--line); background:linear-gradient(145deg,var(--cream-2),#ead7bd); scroll-snap-align:start; }
.star-video { display:block; width:100%; height:100%; object-fit:cover; background:transparent; }
.star-video-play { position:absolute; inset:0; display:flex; align-items:center; justify-content:center; width:100%; height:100%; border:0; background:transparent; cursor:pointer; }
.star-video-play svg { width:64px; height:64px; padding:20px; border-radius:50%; fill:var(--cream-2); background:var(--orange); box-shadow:0 8px 28px rgba(23,17,13,.18); transition:transform .2s; }
.star-video-play:hover:not(:disabled) svg { transform:scale(1.08); }
.star-video-play:focus-visible { outline:3px solid var(--orange); outline-offset:-5px; border-radius:24px; }
.star-video-play:disabled { cursor:default; }
.star-video-play:disabled svg { opacity:.35; box-shadow:none; }
.star-video-card.is-playing .star-video-play { display:none; }
.cf-panel { max-height:calc(100dvh - 150px); overflow-y:auto; }
@media(max-width:950px) { .star-users-grid { grid-auto-columns:calc((100% - 20px)/2); gap:20px; } .star-photo-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } .star-photo:first-child { aspect-ratio:2/1; } }
@media(max-width:600px) { .star-users-grid { grid-auto-columns:85%; gap:16px; } .star-photo-grid { gap:12px; } }
@media(prefers-reduced-motion:reduce) { .star-video-play svg, .star-photo img { transition:none; } }