@property --ac { syntax: "<angle>"; inherits: false; initial-value: 360deg; }

.ikon-gecis {
  position: fixed; inset: 0; z-index: 100; pointer-events: none;
  display: none; place-items: center; overflow: hidden;
}
.ikon-gecis.is-oynuyor { display: grid; }
.ikon-sahne { position: relative; width: min(38vmin, 300px); aspect-ratio: 1; transform-origin: 50% 50%; }
.ikon-sahne img { position: absolute; inset: 0; width: 100%; height: 100%; display: block; }
.ikon-halka { -webkit-mask-image: conic-gradient(#000 var(--ac), transparent 0); mask-image: conic-gradient(#000 var(--ac), transparent 0); }
.ikon-yorunge { transform-origin: 50% 50%; }
.ikon-disk { position: absolute; left: 2.5%; top: 2.5%; width: 95%; height: 95%; border-radius: 50%; background: #F6F5F2; transform: scale(0); }