.dynamic-greeting {
    --daen-greeting-bg: linear-gradient(145deg, #e8e8ec, #f5f5f8);
    --daen-greeting-shadow: 8px 8px 20px rgba(180, 180, 185, 0.5), -8px -8px 20px rgba(255, 255, 255, 0.9);
    --daen-greeting-hover-shadow: 12px 12px 25px rgba(180, 180, 185, 0.55), -12px -12px 25px rgba(255, 255, 255, 0.95);
    --daen-greeting-content-bg: linear-gradient(145deg, #f0f0f4, #e5e5e9);
    --daen-greeting-content-shadow: inset 4px 4px 10px rgba(180, 180, 185, 0.4), inset -4px -4px 10px rgba(255, 255, 255, 0.8);
    --daen-greeting-time-color: #5a5a65;
    --daen-greeting-colon-color: #7a7a85;
    --daen-greeting-date-color: #7a7a85;
    --daen-greeting-section-bg: linear-gradient(145deg, #e6e6ea, #f2f2f6);
    --daen-greeting-section-shadow: 4px 4px 10px rgba(180, 180, 185, 0.35), -4px -4px 10px rgba(255, 255, 255, 0.75);
    --daen-greeting-text-color: #4a4a55;
    --daen-greeting-tip-color: #6a6a75;
    padding: 25px;
    margin: 20px 0;
    border-radius: 25px;
    background: var(--daen-greeting-bg);
    box-shadow: var(--daen-greeting-shadow);
    transition: transform 0.4s ease, box-shadow 0.4s ease;
}

.dynamic-greeting:hover {
    transform: translateY(-3px);
    box-shadow: var(--daen-greeting-hover-shadow);
}

.dynamic-greeting .greeting-content {
    padding: 18px;
    border-radius: 18px;
    background: var(--daen-greeting-content-bg);
    box-shadow: var(--daen-greeting-content-shadow);
}

.dynamic-greeting .time-section {
    margin-bottom: 18px;
}

.dynamic-greeting .time-display {
    display: flex;
    align-items: baseline;
    justify-content: center;
    flex-wrap: wrap;
    gap: 4px;
    font-family: 'SF Pro Display', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    font-size: clamp(1.8rem, 5vw, 3rem);
    font-weight: 700;
    color: var(--daen-greeting-time-color);
    line-height: 1.2;
}

.dynamic-greeting .time-display .colon {
    animation: daen-blink 1s infinite;
    color: var(--daen-greeting-colon-color);
    margin: 0 1px;
}

@keyframes daen-blink {
    50% { opacity: 0.3; }
}

.dynamic-greeting .date-display-inline {
    font-size: 0.45em;
    font-weight: 500;
    color: var(--daen-greeting-date-color);
    margin-left: 8px;
    letter-spacing: 0.5px;
    white-space: nowrap;
}

.dynamic-greeting .greeting-section {
    padding: 16px 20px;
    border-radius: 15px;
    background: var(--daen-greeting-section-bg);
    box-shadow: var(--daen-greeting-section-shadow);
}

.dynamic-greeting .greeting-text {
    font-size: clamp(1rem, 2.5vw, 1.3em);
    color: var(--daen-greeting-text-color);
    font-weight: 600;
    margin-bottom: 8px;
}

.dynamic-greeting .greeting-tip {
    font-size: clamp(0.85rem, 2vw, 0.95em);
    color: var(--daen-greeting-tip-color);
    line-height: 1.5;
}

/* ==================== 暗色主题 ==================== */
body.dark-theme .dynamic-greeting {
    --daen-greeting-bg: linear-gradient(145deg, #3a3a40, #2d2d32);
    --daen-greeting-shadow: 10px 10px 25px rgba(15, 15, 18, 0.6), -10px -10px 25px rgba(55, 55, 60, 0.35);
    --daen-greeting-hover-shadow: 14px 14px 30px rgba(15, 15, 18, 0.65), -14px -14px 30px rgba(60, 60, 65, 0.4);
    --daen-greeting-content-bg: linear-gradient(145deg, #32323a, #3a3a42);
    --daen-greeting-content-shadow: inset 5px 5px 12px rgba(15, 15, 18, 0.5), inset -5px -5px 12px rgba(60, 60, 68, 0.3);
    --daen-greeting-time-color: #b8b8c0;
    --daen-greeting-colon-color: #909098;
    --daen-greeting-date-color: rgba(140, 140, 148, 0.9);
    --daen-greeting-section-bg: linear-gradient(145deg, #353540, #2e2e38);
    --daen-greeting-section-shadow: 5px 5px 12px rgba(15, 15, 18, 0.45), -5px -5px 12px rgba(55, 55, 62, 0.25);
    --daen-greeting-text-color: #d0d0d8;
    --daen-greeting-tip-color: rgba(140, 140, 148, 0.85);
}

/* 响应式 */
@media (max-width: 480px) {
    .dynamic-greeting {
        padding: 18px;
    }
    .dynamic-greeting .greeting-content {
        padding: 14px;
    }
    .dynamic-greeting .date-display-inline {
        font-size: 0.4em;
        margin-left: 5px;
    }
}