﻿/* --- 1. 기본 레이아웃 및 중앙 정렬 고정 --- */
#forWidgetLogo {
    width: 235px;
    height: 36px;
    position: relative;
    overflow: hidden;
    /* [수정] 패딩을 0으로 설정하여 꽉 채움 */
    padding: 0 !important;
    box-sizing: border-box;
}

.logo-widget-item {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    white-space: nowrap;
    /* [팁] 상하 여백을 더 줄이려면 line-height를 0.8 정도로 조절 */
    line-height: 0.9;
}

/* --- 2. 텍스트 아트 스타일 옵션 --- */
/* 기본: GOLD (Aurum) */
.style-gold {
    background: linear-gradient(to bottom, #cf9710 22%, #ffaf4b 24%, #ba8b02 26%, #eed091 27%, #ffab40 40%, #ffdf7e 65%, #7e5a00 82%, #d2a139 88%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    filter: drop-shadow(1px 1px 2px rgba(0,0,0,0.6));
}

/* 네온 (Synth) */
.style-neon {
    color: #fff;
    -webkit-text-fill-color: #fff;
    text-shadow: 0 0 5px #fff, 0 0 10px #ff00de, 0 0 20px #ff00de;
}

/* 아웃라인 (Prism) */
.style-outline {
    color: transparent;
    -webkit-text-fill-color: transparent;
    -webkit-text-stroke: 1.5px #d2a139;
}

/* --- 3. 20가지 애니메이션 효과 정의 --- */
.fx-pop {
    animation: fx-pop 0.5s forwards;
}

.fx-slide {
    animation: fx-slide 0.5s forwards;
}

.fx-spin {
    animation: fx-spin 0.5s forwards;
}

.fx-zoom {
    animation: fx-zoom 0.5s forwards;
}

.fx-bounce {
    animation: fx-bounce 0.5s forwards;
}

.fx-flip {
    animation: fx-flip 0.6s forwards;
}

.fx-shake {
    animation: fx-shake 0.5s;
}

.fx-swing {
    animation: fx-swing 0.6s forwards;
}

.fx-wobble {
    animation: fx-wobble 0.6s forwards;
}

.fx-heartbeat {
    animation: fx-heartbeat 0.8s infinite;
}

.fx-rollIn {
    animation: fx-rollIn 0.6s forwards;
}

.fx-blurIn {
    animation: fx-blurIn 0.5s forwards;
}

.fx-glitch {
    animation: fx-glitch 0.3s infinite;
}

.fx-jello {
    animation: fx-jello 0.6s forwards;
}

.fx-flash {
    animation: fx-flash 0.5s infinite;
}

.fx-shrink {
    animation: fx-shrink 0.5s forwards;
}

.fx-skew {
    animation: fx-skew 0.5s forwards;
}

.fx-ghost {
    animation: fx-ghost 0.8s forwards;
}

.fx-rubber {
    animation: fx-rubber 0.6s forwards;
}

.fx-slideUp {
    animation: fx-slideUp 0.5s forwards;
}

/* --- 4. 애니메이션 키프레임 (중앙 좌표 보정 완료) --- */
@keyframes fx-pop {
    0% {
        transform: translate(-50%, -50%) scale(0);
        opacity: 0;
    }

    100% {
        transform: translate(-50%, -50%) scale(1);
        opacity: 1;
    }
}

@keyframes fx-slide {
    0% {
        transform: translate(-120%, -50%);
        opacity: 0;
    }

    100% {
        transform: translate(-50%, -50%);
        opacity: 1;
    }
}

@keyframes fx-spin {
    0% {
        transform: translate(-50%, -50%) rotate(-180deg);
        opacity: 0;
    }

    100% {
        transform: translate(-50%, -50%) rotate(0);
        opacity: 1;
    }
}

@keyframes fx-zoom {
    0% {
        transform: translate(-50%, -50%) scale(2);
        opacity: 0;
    }

    100% {
        transform: translate(-50%, -50%) scale(1);
        opacity: 1;
    }
}

@keyframes fx-bounce {
    0% {
        transform: translate(-50%, 30%);
        opacity: 0;
    }

    100% {
        transform: translate(-50%, -50%);
        opacity: 1;
    }
}

@keyframes fx-flip {
    0% {
        transform
