/* ==========================================
   Leon's Website - Pure Cosmic Ambient Background
   ========================================= */

/* 1. 核心设计变量 (参照桌面银河系方案一色彩与对数级 0.8s 缓动重构) */
:root {
    --color-dark-bg: oklch(0.12 0.002 240); /* 深邃冷天青黑，模拟真实宇宙的非死黑呼吸度 */
    --color-yellow: oklch(0.92 0.16 100);  /* 参照桌面 Demo 的高明度温润柠檬黄 */
    --font-heading: 'Lexend Deca', -apple-system, BlinkMacSystemFont, sans-serif;
    --font-body: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
    --border-dark: rgba(255, 255, 255, 0.08);
    --transition-base: all 0.8s cubic-bezier(0.16, 1, 0.3, 1); /* 大师级 0.8s 平滑对数缓动 */
}

/* 基础重置与单屏锁定 */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html, body {
    height: 100vh;
    width: 100vw;
    overflow: hidden; /* 强制单屏无滚动 */
    background-color: var(--color-dark-bg);
    font-family: var(--font-body);
}

/* 彻底更替为最纯粹的单色深曜石黑底，消除一切圆形渐变晕影与干扰 */
body::before {
    content: '';
    display: block;
    height: 100vh;
    left: 0;
    pointer-events: none;
    position: fixed;
    top: 0;
    width: 100vw;
    z-index: 0;
    background-color: var(--color-dark-bg);
}

/* Canvas 星空天轨层 */
.space-layer {
    position: absolute;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    z-index: 2;
    pointer-events: none;
}

/* 2. 右上角极简静音/播放开关 */
.zen-audio-toggle {
    position: absolute;
    top: 2.2rem;
    right: 2.5rem;
    z-index: 50;
    cursor: pointer;
    padding: 0.8rem;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: var(--transition-base);
}

/* 音量波纹线 (默认静音状态下，透明度为 0.28，起到弱引导提示作用) */
.audio-wave-line {
    width: 8px;
    height: 1px;
    background-color: var(--color-yellow);
    opacity: 0.28;
    box-shadow: 0 0 4px oklch(0.92 0.16 100 / 0.3);
    transition: var(--transition-base);
}

/* 播放状态：变为发光垂直线并做极其缓慢的缩放呼吸 */
.zen-audio-toggle.playing .audio-wave-line {
    width: 1px;
    height: 15px;
    opacity: 0.55;
    box-shadow: 0 0 8px oklch(0.92 0.16 100 / 0.6);
    animation: audioPulse 2.2s infinite ease-in-out;
}

@keyframes audioPulse {
    0%, 100% {
        transform: scaleY(1);
    }
    50% {
        transform: scaleY(0.4);
    }
}

.zen-audio-toggle:hover {
    opacity: 1;
}

.zen-audio-toggle:hover .audio-wave-line {
    opacity: 0.85;
    box-shadow: 0 0 10px oklch(0.92 0.16 100 / 0.8);
}

/* 3. 底部居中禅意哲思短句 (生活如流水 · 不舍昼夜) - 1:1 参照桌面 Demo 色彩与排版 */
.zen-quote-text {
    position: absolute;
    bottom: 2.2rem;
    left: 50%;
    transform: translateX(-50%);
    z-index: 50;
    font-family: var(--font-body);
    font-size: 0.75rem;
    font-weight: 300;
    letter-spacing: 4px;
    color: var(--color-yellow);
    opacity: 0.65;     /* 参照桌面 Demo 经典柔光色阶 */
    padding-left: 4px; /* 补齐字距居中偏移 */
    pointer-events: none;
    text-shadow: 0 0 8px oklch(0.92 0.16 100 / 0.25);
    user-select: none;
}