.service-panel { display: none !important; }
.service-panel.active { display: block !important; }
::-webkit-scrollbar { width: 6px; }
::-webkit-scrollbar-thumb { background: #4c1d95; border-radius: 10px; }
/* 반투명 흐림 처리 백드롭 유틸리티 */
.glass-overlay { backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); }

/* 타로 보드 빈 슬롯 호버 & 가독성 강화 스타일 */
.tarot-slot-box {
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

/* 마우스가 올라가거나 클릭(터치) 시 상자가 살짝 커지며 발광 */
.tarot-slot-box:hover {
    transform: translateY(-4px) scale(1.05);
    border-color: #c084fc !important; /* 명확하고 밝은 보라색 테두리 */
    background-color: rgba(88, 28, 135, 0.3) !important; /* 반투명 보라 배경 */
    box-shadow: 0 0 20px rgba(168, 85, 247, 0.5);
}

/* 마우스 호버 시 '자리 번호' 강조 */
.tarot-slot-box:hover .slot-title {
    color: #ffffff !important;
    font-weight: 800;
    text-shadow: 0 0 10px rgba(192, 132, 252, 0.9);
}

/* 마우스 호버 시 '자리 의미(과거...)' 가독성 증대 */
.tarot-slot-box:hover .slot-desc {
    color: #f3e8ff !important; /* 또렷한 연보라/흰색 */
    font-weight: 700;
}

/* 1. 부채꼴 컨테이너 절대 위치 고정 */
#tarot-fan-container {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
}

/* 1. 컨테이너 잘림 방지 */
#tarot-deck-element, #tarot-fan-container {
    overflow: visible !important;
}

/* 2. [모바일 WebKit 강제 출력 실물 카드] */
.fan-card-layer {
    position: absolute !important;
    display: block !important;
    width: 30px !important;
    height: 52px !important;
    top: 10px !important;
    left: 145px !important; /* (320px - 30px) / 2 = 145px 모바일 정중앙 오프셋 */
    
    background: linear-gradient(135deg, #3b0764, #1e1b4b) !important;
    border: 1.5px solid rgba(192, 132, 252, 0.85) !important;
    border-radius: 4px !important;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.7) !important;
    
    /* 회전 중심축 */
    transform-origin: 50% 115px !important;
    
    /* 모바일 GPU 하드웨어 강제 가속 (Safari 화면 사라짐 100% 방지) */
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    
    opacity: 0.85;
    cursor: pointer !important;
    touch-action: none !important;
    -webkit-tap-highlight-color: rgba(192, 132, 252, 0.4) !important;
    transition: filter 0.12s, box-shadow 0.12s, opacity 0.12s, transform 0.3s ease;
}

/* 3. ✨ [모바일 터치 & PC 마우스 반응 통합] */
.fan-card-layer:active,
.fan-card-layer:hover {
    filter: brightness(1.7) !important;
    border-color: #ffffff !important;
    box-shadow: 0 0 18px #c084fc, 0 0 25px #ffffff !important;
    z-index: 950 !important;
}

/* 4. ✨ [모바일 손가락 추적 발광]: PC 호버와 동일한 카드 자체 밝기 증대 & 보라 네온 효과 */
.fan-card-layer.active-highlight {
    opacity: 1 !important;
    filter: brightness(1.7) !important; /* 노란 배경을 치우고 카드 원래 색상을 1.7배 밝게 강조 */
    border-color: #ffffff !important; /* 또렷한 흰색 테두리 */
    box-shadow: 0 0 20px #c084fc, 0 0 30px #ffffff !important; /* PC와 동일한 보라/흰색 네온 발광 */
    z-index: 1000 !important;
}

/* 5. 🎯 [선택 팝업 모션]: 아쿠아 블루 발광 */
.fan-card-layer.drawn-pop {
    opacity: 1 !important;
    background: #00ffff !important;
    border: 2px solid #ffffff !important;
    box-shadow: 0 0 30px #00ffff, 0 0 45px #ffffff !important;
    z-index: 2000 !important;
}

/* 이미 뽑힌 카드는 어둡게 비활성화 */
.fan-card-layer.is-drawn {
    opacity: 0.08 !important;
    filter: brightness(0.1) !important;
    border-color: transparent !important;
    pointer-events: none !important;
}