/* 组件样式 */

/* 毛玻璃效果 */
.glass-morphism {
    background: var(--glass-bg);
    backdrop-filter: blur(50px);
    -webkit-backdrop-filter: blur(50px);
    border: 1px solid var(--glass-border);
}

/* 消息气泡 */
.message-bubble {
    opacity: 0;
    transform: translateY(20px) scale(0.95);
    animation: pop-in var(--animation-duration-normal) cubic-bezier(0.175, 0.885, 0.32, 1.275) forwards;
}

/* 光球容器 */
.orb-container {
    position: relative;
    width: var(--orb-size);
    height: var(--orb-size);
    cursor: pointer;
    transition: transform var(--animation-duration-fast) ease;
}

.orb-container:active {
    transform: scale(0.9);
}

/* 光球样式 */
.orb {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    mix-blend-mode: screen;
    filter: blur(8px);
    opacity: 0.9;
}

.orb-1 {
    background: var(--orb-color-1);
    animation: move 10s infinite alternate;
}

.orb-2 {
    background: var(--orb-color-2);
    animation: move 12s infinite alternate-reverse;
}

.orb-3 {
    background: var(--orb-color-3);
    animation: move 8s infinite alternate;
}

/* 思考状态的光球 */
.thinking .orb-1 {
    animation: think-move 2s infinite alternate;
    filter: blur(12px);
}

.thinking .orb-2 {
    animation: think-move 2.5s infinite alternate-reverse;
    filter: blur(12px);
}

.thinking .orb-3 {
    animation: think-move 1.5s infinite alternate;
    filter: blur(12px);
}

/* 交互卡片 */
.interactive-card {
    transition: transform var(--animation-duration-fast) ease, box-shadow var(--animation-duration-fast) ease;
}

.interactive-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2);
}