/* LaserCutie Cutie Effects 0.1.0 */

.lasercutie-ai__launcher {
    position: relative !important;
    overflow: hidden !important;
}

.lc-cutie-eye-tracker {
    position: absolute;
    inset: 0;
    z-index: 8;
    pointer-events: none;
    opacity: 1;
    transition: opacity 120ms ease;
}

.lc-cutie-eye {
    position: absolute;
    width: 8.8%;
    height: 9.7%;
    top: 42.2%;
    border-radius: 50%;
    background: radial-gradient(circle at 50% 52%, #252d35 0%, #14191f 68%, #080b0e 100%);
    box-shadow: inset 0 1px 1px rgba(255, 255, 255, 0.2), 0 0 1px rgba(0, 0, 0, 0.7);
    overflow: hidden;
}

.lc-cutie-eye--left {
    left: 35.3%;
}

.lc-cutie-eye--right {
    left: 55.9%;
}

.lc-cutie-pupil {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    background: transparent;
    box-shadow: none;
    transform: translate(var(--lc-pupil-x, 0px), var(--lc-pupil-y, 0px));
    transition: transform 80ms linear;
}

.lc-cutie-pupil::before,
.lc-cutie-pupil::after {
    content: "";
    position: absolute;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.96);
    box-shadow: 0 0 2px rgba(255, 255, 255, 0.78);
}

.lc-cutie-pupil::before {
    left: 19%;
    top: 16%;
    width: 31%;
    height: 27%;
}

.lc-cutie-pupil::after {
    left: 20%;
    top: 52%;
    width: 15%;
    height: 13%;
}

/* Amíg közvetlenül Cutie felett van az egér, az eredeti, változatlan arc látszik. */
.lasercutie-ai__launcher:hover .lc-cutie-eye-tracker {
    opacity: 0;
}

.lasercutie-ai__launcher:focus-visible .lc-cutie-eye-tracker {
    opacity: 0;
}

.lc-click-sparks {
    position: fixed;
    inset: 0;
    z-index: 2147483646;
    pointer-events: none;
    overflow: hidden;
}

.lc-click-spark {
    position: fixed;
    left: 0;
    top: 0;
    width: 2px;
    height: 15px;
    border-radius: 999px;
    opacity: 0;
    transform-origin: 50% 100%;
    background: linear-gradient(to top, #ff1437 0%, #ff9f43 58%, rgba(255, 226, 143, 0) 100%);
    box-shadow: 0 0 5px rgba(255, 20, 55, 0.92), 0 0 9px rgba(255, 151, 61, 0.74);
    animation: lc-click-spark 420ms cubic-bezier(0.2, 0.8, 0.2, 1) forwards;
}

.lc-click-spark::after {
    content: "";
    position: absolute;
    left: 50%;
    bottom: 0;
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: #fff1bd;
    box-shadow: 0 0 5px #ff2b4d;
    transform: translate(-50%, 50%);
}

.lc-click-spark--core {
    width: 5px;
    height: 5px;
    margin-left: -2.5px;
    margin-top: -2.5px;
    border-radius: 50%;
    background: #ffecb5;
    box-shadow: 0 0 4px #ff163c, 0 0 10px rgba(255, 102, 54, 0.95);
    animation: lc-click-spark-core 420ms ease-out forwards;
}

@keyframes lc-click-spark {
    0% {
        opacity: 0;
        transform: translate3d(var(--lc-x), var(--lc-y), 0) rotate(var(--lc-angle)) translateY(-3px) scaleY(0.25);
    }
    18% {
        opacity: 1;
    }
    100% {
        opacity: 0;
        transform: translate3d(var(--lc-x), var(--lc-y), 0) rotate(var(--lc-angle)) translateY(calc(-1 * var(--lc-distance))) scaleY(1);
    }
}

@keyframes lc-click-spark-core {
    0% {
        opacity: 0;
        transform: translate3d(var(--lc-x), var(--lc-y), 0) scale(0.35);
    }
    16% {
        opacity: 1;
    }
    100% {
        opacity: 0;
        transform: translate3d(var(--lc-x), var(--lc-y), 0) scale(1.85);
    }
}

@media (prefers-reduced-motion: reduce) {
    .lc-cutie-eye-tracker,
    .lc-click-sparks {
        display: none !important;
    }
}

/* A szemkövetés kizárólag asztali, egérmutatós nézetben jelenjen meg. */
@media (hover: none), (pointer: coarse), (max-width: 700px) {
    .lc-cutie-eye-tracker {
        display: none !important;
    }
}
