/* ========================================
   时光 · Time Flow
   小清新时间主题
   ======================================== */
:root {
    --bg: #faf7f2;
    --mint: #a8d8b9; --mint-d: #7ec6a0;
    --peach: #ffd3b6; --peach-d: #ff9a76;
    --sky: #a8d8ea; --sky-d: #6cb4e0;
    --lavender: #e0c3fc; --lav-d: #b08ee0;
    --lemon: #fff3b0; --lemon-d: #ffd93d;
    --coral: #f4a9a8; --coral-d: #e87878;
    --text: #5a5650; --text-l: #9a958e; --text-ll: #c5c0b8;
    --white: #fff;
    --shadow: 0 8px 32px rgba(120,100,80,0.08);
    --shadow-h: 0 20px 60px rgba(120,100,80,0.15);
    --radius: 24px; --radius-s: 16px;
    --tr: .4s cubic-bezier(.25,.46,.45,.94);
}
* { margin:0; padding:0; box-sizing:border-box; }
html, body { height:100%; overflow:hidden; }
body {
    background:var(--bg); color:var(--text);
    font-family:'Nunito','Noto Sans SC',sans-serif;
    line-height:1.6;
    -webkit-font-smoothing:antialiased;
}

/* Blob 背景 */
.blob-bg { position:fixed; inset:0; z-index:0; pointer-events:none; overflow:hidden; }
.blob { position:absolute; border-radius:50%; filter:blur(80px); opacity:.4; animation:blobFloat 20s ease-in-out infinite; }
.blob-1 { width:500px; height:500px; background:var(--mint); top:-100px; left:-100px; }
.blob-2 { width:400px; height:400px; background:var(--peach); top:30%; right:-80px; animation-delay:-5s; }
.blob-3 { width:450px; height:450px; background:var(--sky); bottom:10%; left:10%; animation-delay:-10s; }
.blob-4 { width:350px; height:350px; background:var(--lavender); top:60%; right:20%; animation-delay:-15s; }
@keyframes blobFloat { 0%,100%{transform:translate(0,0) scale(1);} 25%{transform:translate(40px,-50px) scale(1.1);} 50%{transform:translate(-30px,40px) scale(.95);} 75%{transform:translate(50px,30px) scale(1.05);} }

.cursor-glow { position:fixed; width:300px; height:300px; border-radius:50%; background:radial-gradient(circle,rgba(168,216,234,.15),transparent 70%); pointer-events:none; z-index:1; transform:translate(-50%,-50%); }

/* 导航 - 半隐藏式 */
.nav { position:fixed; top:20px; left:50%; transform:translateX(-50%) translateY(-120%); width:calc(100% - 40px); max-width:1100px; height:56px; background:rgba(255,255,255,.7); backdrop-filter:blur(20px); border:1px solid rgba(255,255,255,.8); border-radius:100px; box-shadow:var(--shadow); display:flex; align-items:center; justify-content:space-between; padding:0 28px; z-index:100; transition:transform .45s cubic-bezier(.4,0,.2,1), opacity .3s ease; opacity:0; }
.nav.visible { transform:translateX(-50%) translateY(0); opacity:1; }

/* 导航触发区 */
.nav-trigger { position:fixed; top:0; left:50%; transform:translateX(-50%); width:220px; height:32px; z-index:99; cursor:pointer; }
.nav-trigger-bar { position:absolute; bottom:10px; left:50%; transform:translateX(-50%); width:36px; height:4px; border-radius:2px; background:linear-gradient(90deg,var(--mint-d),var(--sky-d)); opacity:.25; transition:opacity .3s, width .3s; }
.nav-trigger:hover .nav-trigger-bar { opacity:.7; width:52px; }
.nav-logo { display:flex; align-items:center; gap:10px; cursor:pointer; }
.logo-clock { width:30px; height:30px; flex-shrink:0; }
.lc-face { fill:rgba(255,255,255,.5); stroke:rgba(168,216,234,.25); stroke-width:1; }
.lc-ring { fill:none; stroke:var(--sky-d); stroke-width:1.5; opacity:.35; }
.lc-tick { stroke:var(--text-ll); stroke-width:1.2; stroke-linecap:round; }
.lc-hand-h { stroke:var(--text); stroke-width:2; stroke-linecap:round; transform-origin:18px 18px; transition:transform .4s ease; }
.lc-hand-m { stroke:var(--sky-d); stroke-width:1.5; stroke-linecap:round; transform-origin:18px 18px; transition:transform .4s ease; }
.lc-dot { fill:var(--coral-d); }
.logo-text-group { display:flex; flex-direction:column; line-height:1.1; gap:1px; }
.logo-text { font-family:'Comfortaa',sans-serif; font-weight:700; font-size:17px; background:linear-gradient(135deg,var(--mint-d),var(--sky-d)); -webkit-background-clip:text; -webkit-text-fill-color:transparent; }
.logo-sub { font-family:'Comfortaa',sans-serif; font-size:8px; letter-spacing:2.5px; color:var(--text-ll); font-weight:600; }
.nav-menu { display:flex; list-style:none; gap:4px; }
.nav-link { text-decoration:none; color:var(--text-l); font-size:14px; font-weight:600; padding:8px 16px; border-radius:100px; transition:var(--tr); cursor:pointer; }
.nav-link:hover { color:var(--text); background:rgba(168,216,234,.2); }
.nav-link.active { color:var(--white); background:linear-gradient(135deg,var(--mint-d),var(--sky-d)); box-shadow:0 4px 12px rgba(126,198,160,.3); }
.nav-burger { display:none; flex-direction:column; gap:5px; cursor:pointer; padding:8px; }
.nav-burger span { width:22px; height:3px; border-radius:2px; background:var(--text); }

/* Section 通用 - 全屏翻页 */
.section { position:fixed; inset:0; z-index:2; padding:70px 40px 50px; display:flex; flex-direction:column; align-items:center; justify-content:center; opacity:0; transform:translateY(100%); transition:opacity .6s cubic-bezier(.4,0,.2,1), transform .6s cubic-bezier(.4,0,.2,1); pointer-events:none; overflow:hidden; }
.section.active { opacity:1; transform:translateY(0); pointer-events:auto; z-index:3; }
.section.prev { opacity:0; transform:translateY(-100%); }

/* 翻页指示器 */
.page-dots { position:fixed; right:24px; top:50%; transform:translateY(-50%); z-index:200; display:flex; flex-direction:column; gap:12px; }
.page-dot { width:10px; height:10px; border-radius:50%; background:rgba(154,149,142,.3); border:1px solid rgba(154,149,142,.4); cursor:pointer; transition:var(--tr); position:relative; }
.page-dot:hover { background:rgba(108,180,224,.5); }
.page-dot.active { background:linear-gradient(135deg,var(--mint-d),var(--sky-d)); border-color:transparent; width:10px; height:28px; border-radius:5px; box-shadow:0 0 10px rgba(108,180,224,.4); }
.page-dot-label { position:absolute; right:20px; top:50%; transform:translateY(-50%); white-space:nowrap; font-size:12px; color:var(--text-l); background:rgba(255,255,255,.8); backdrop-filter:blur(10px); padding:4px 12px; border-radius:100px; opacity:0; pointer-events:none; transition:opacity .3s; }
.page-dot:hover .page-dot-label { opacity:1; }

/* 翻页按钮 */
.page-arrow { position:fixed; z-index:200; width:48px; height:48px; border-radius:50%; border:2px solid rgba(255,255,255,.8); background:rgba(255,255,255,.6); backdrop-filter:blur(10px); color:var(--sky-d); font-size:28px; font-weight:300; cursor:pointer; transition:var(--tr); display:flex; align-items:center; justify-content:center; line-height:1; }
.page-arrow:hover { background:var(--sky); color:var(--white); border-color:transparent; box-shadow:0 4px 16px rgba(108,180,224,.3); }
.page-arrow:disabled { opacity:0; pointer-events:none; }
.page-prev { bottom:30px; left:30px; }
.page-next { bottom:30px; right:30px; }

/* 翻页提示 */
.page-hint { position:fixed; bottom:30px; left:50%; transform:translateX(-50%); z-index:200; font-size:12px; color:var(--text-ll); letter-spacing:1px; opacity:.6; transition:opacity .5s; pointer-events:none; }
.page-hint.hidden { opacity:0; }
.section-header { text-align:center; margin-bottom:28px; flex-shrink:0; }
.section-tag { display:inline-block; font-size:11px; font-weight:700; letter-spacing:3px; color:var(--sky-d); background:rgba(168,216,234,.2); padding:6px 16px; border-radius:100px; margin-bottom:16px; }
.section-title { font-family:'Comfortaa',sans-serif; font-size:clamp(32px,5vw,48px); font-weight:700; margin-bottom:8px; }
.section-desc { font-size:16px; color:var(--text-l); }
.grad-1 { background:linear-gradient(135deg,var(--mint-d),var(--sky-d)); -webkit-background-clip:text; -webkit-text-fill-color:transparent; }

/* Hero */
.hero { justify-content:center; text-align:center; overflow:hidden; }
.hero-content { position:relative; z-index:3; }
.hero-eyebrow { font-size:14px; color:var(--coral-d); font-weight:600; letter-spacing:2px; margin-bottom:24px; animation:fadeInDown 1s ease; }
.hero-title { font-family:'Comfortaa',sans-serif; font-size:clamp(40px,8vw,80px); font-weight:700; line-height:1.2; margin-bottom:16px; animation:fadeInUp 1s ease .2s both; }
.hero-subtitle { font-size:clamp(16px,2.5vw,22px); color:var(--text-l); min-height:36px; margin-bottom:32px; animation:fadeInUp 1s ease .4s both; }
.cursor { color:var(--sky-d); animation:blink 1s steps(1) infinite; }
@keyframes blink { 50%{opacity:0;} }
.hero-clock { font-family:'Comfortaa',sans-serif; font-size:clamp(36px,6vw,56px); font-weight:700; color:var(--text); letter-spacing:3px; margin-bottom:8px; animation:fadeInUp 1s ease .6s both; }
.hero-date { font-size:16px; color:var(--text-l); animation:fadeInUp 1s ease .8s both; }
.floating-shapes { position:absolute; inset:0; z-index:1; pointer-events:none; }
.shape { position:absolute; border-radius:50%; opacity:.5; animation:floatShape 6s ease-in-out infinite; }
.s1 { width:60px; height:60px; background:var(--peach); top:20%; left:10%; }
.s2 { width:40px; height:40px; background:var(--sky); top:60%; left:15%; animation-delay:-1s; }
.s3 { width:50px; height:50px; background:var(--lavender); top:30%; right:12%; animation-delay:-2s; }
.s4 { width:35px; height:35px; background:var(--lemon); top:70%; right:20%; animation-delay:-3s; }
.s5 { width:45px; height:45px; background:var(--mint); top:15%; right:30%; animation-delay:-4s; }
@keyframes floatShape { 0%,100%{transform:translateY(0) rotate(0);} 50%{transform:translateY(-30px) rotate(180deg);} }
@keyframes fadeInUp { from{opacity:0;transform:translateY(30px);} to{opacity:1;transform:translateY(0);} }
@keyframes fadeInDown { from{opacity:0;transform:translateY(-20px);} to{opacity:1;transform:translateY(0);} }

/* ===== 倒计时 ===== */
.countdown-targets { display:flex; gap:10px; margin-bottom:24px; flex-wrap:wrap; justify-content:center; }
.cd-tab { padding:8px 20px; border:2px solid rgba(255,255,255,.8); border-radius:100px; background:rgba(255,255,255,.5); color:var(--text-l); font-family:'Nunito',sans-serif; font-size:13px; font-weight:600; cursor:pointer; transition:var(--tr); }
.cd-tab:hover { background:rgba(255,255,255,.8); color:var(--text); }
.cd-tab.active { background:linear-gradient(135deg,var(--peach),var(--peach-d)); color:var(--white); border-color:transparent; box-shadow:0 4px 12px rgba(255,154,118,.3); }
.countdown-display { background:rgba(255,255,255,.6); backdrop-filter:blur(20px); border:1px solid rgba(255,255,255,.9); border-radius:var(--radius); padding:28px 32px; box-shadow:var(--shadow); text-align:center; max-width:680px; width:100%; }
.cd-label { font-size:16px; color:var(--text-l); margin-bottom:20px; }
.cd-numbers { display:flex; align-items:flex-start; justify-content:center; gap:10px; margin-bottom:20px; }
.cd-unit { display:flex; flex-direction:column; align-items:center; gap:8px; }
.cd-num { font-family:'Comfortaa',sans-serif; font-size:clamp(32px,5.5vw,52px); font-weight:700; color:var(--text); min-width:64px; }
.cd-unit label { font-size:14px; color:var(--text-l); }
.cd-colon { font-size:clamp(32px,5vw,48px); color:var(--text-ll); font-weight:300; margin-top:8px; }
.cd-bar-wrap { margin-top:12px; }
.cd-bar { width:100%; height:8px; background:rgba(168,216,234,.15); border-radius:4px; overflow:hidden; }
.cd-bar-fill { height:100%; background:linear-gradient(90deg,var(--peach),var(--coral-d)); border-radius:4px; transition:width .5s ease; }
.cd-bar-info { font-size:13px; color:var(--text-l); margin-top:8px; }
.cd-custom { display:flex; gap:10px; margin-top:16px; flex-wrap:wrap; justify-content:center; }
.cd-input { padding:10px 16px; border:2px solid rgba(255,255,255,.8); border-radius:12px; background:rgba(255,255,255,.5); color:var(--text); font-family:'Nunito',sans-serif; font-size:14px; outline:none; }
.cd-input:focus { border-color:var(--sky-d); }
.cd-go-btn { padding:10px 28px; border:none; border-radius:12px; background:linear-gradient(135deg,var(--sky),var(--sky-d)); color:var(--white); font-weight:600; font-size:14px; cursor:pointer; transition:var(--tr); }
.cd-go-btn:hover { box-shadow:0 4px 12px rgba(108,180,224,.3); }

/* ===== 实时时钟 ===== */
.clock-stage { display:flex; gap:32px; align-items:center; justify-content:center; max-width:760px; width:100%; flex-wrap:wrap; }
.clock-analog { flex-shrink:0; }
.clock-svg { width:clamp(200px,26vh,280px); height:clamp(200px,26vh,280px); filter:drop-shadow(0 8px 24px rgba(120,100,80,.08)); }
.clk-face { fill:rgba(255,255,255,.7); stroke:rgba(168,216,234,.3); stroke-width:2; }
.clk-face-inner { fill:none; stroke:rgba(168,216,234,.15); stroke-width:1; }
.clk-tick { stroke:var(--text-ll); stroke-width:1.5; }
.clk-tick-major { stroke:var(--sky-d); stroke-width:3; }
.clk-num-text { font-family:'Comfortaa',sans-serif; font-size:18px; font-weight:700; fill:var(--text-l); text-anchor:middle; dominant-baseline:central; }
.clk-hand { stroke-linecap:round; transform-origin:150px 150px; transition:transform .05s linear; }
.clk-hour { stroke:var(--text); stroke-width:6; }
.clk-min { stroke:var(--sky-d); stroke-width:4; }
.clk-sec { stroke:var(--coral-d); stroke-width:2; }
.clk-center { fill:var(--coral-d); }
.clk-center-dot { fill:var(--white); }
.clock-digital-side { text-align:center; }
.clk-digital { font-family:'Comfortaa',sans-serif; font-size:clamp(36px,5vw,52px); font-weight:700; color:var(--text); letter-spacing:2px; }
.clk-date { font-size:16px; color:var(--text-l); margin-bottom:24px; }
.clk-info-cards { display:flex; gap:12px; }
.clk-info-card { background:rgba(255,255,255,.6); backdrop-filter:blur(10px); border:1px solid rgba(255,255,255,.8); border-radius:var(--radius-s); padding:16px 20px; display:flex; flex-direction:column; gap:4px; }
.info-label { font-size:11px; color:var(--text-l); letter-spacing:1px; }
.info-val { font-family:'Comfortaa',sans-serif; font-size:18px; font-weight:700; color:var(--sky-d); }

/* ===== 时间进度 ===== */
.progress-list { max-width:580px; width:100%; display:flex; flex-direction:column; gap:14px; }
.prog-item { background:rgba(255,255,255,.6); backdrop-filter:blur(20px); border:1px solid rgba(255,255,255,.9); border-radius:var(--radius-s); padding:16px 24px; }
.prog-head { display:flex; justify-content:space-between; align-items:center; margin-bottom:12px; }
.prog-head span { font-size:16px; font-weight:600; color:var(--text); }
.prog-head b { font-family:'Comfortaa',sans-serif; font-size:20px; color:var(--sky-d); }
.prog-bar { width:100%; height:12px; background:rgba(168,216,234,.12); border-radius:6px; overflow:hidden; }
.prog-fill { height:100%; border-radius:6px; transition:width .5s ease; }
.grad-mint { background:linear-gradient(90deg,var(--mint),var(--mint-d)); }
.grad-peach { background:linear-gradient(90deg,var(--peach),var(--peach-d)); }
.grad-sky { background:linear-gradient(90deg,var(--sky),var(--sky-d)); }
.grad-lavender { background:linear-gradient(90deg,var(--lavender),var(--lav-d)); }
.prog-sub { font-size:13px; color:var(--text-l); margin-top:8px; }

/* ===== 人生进度 ===== */
.life-stage { max-width:700px; width:100%; text-align:center; }
.life-input-area { display:flex; gap:12px; align-items:center; justify-content:center; flex-wrap:wrap; margin-bottom:20px; }
.life-label { font-size:14px; color:var(--text-l); }
.life-input { padding:10px 16px; border:2px solid rgba(255,255,255,.8); border-radius:12px; background:rgba(255,255,255,.5); color:var(--text); font-family:'Nunito',sans-serif; font-size:14px; outline:none; }
.life-input:focus { border-color:var(--lav-d); }
.life-btn { padding:10px 28px; border:none; border-radius:12px; background:linear-gradient(135deg,var(--lavender),var(--lav-d)); color:var(--white); font-weight:600; font-size:14px; cursor:pointer; transition:var(--tr); }
.life-btn:hover { box-shadow:0 4px 12px rgba(176,142,224,.3); }
.life-result { background:rgba(255,255,255,.6); backdrop-filter:blur(20px); border:1px solid rgba(255,255,255,.9); border-radius:var(--radius); padding:24px 28px; box-shadow:var(--shadow); }
.life-grid { display:grid; grid-template-columns:repeat(40,1fr); gap:2px; margin-bottom:20px; }
.life-cell { aspect-ratio:1; border-radius:3px; background:rgba(168,216,234,.12); transition:background .3s; }
.life-cell.lived { background:linear-gradient(135deg,var(--mint),var(--sky-d)); }
.life-cell.current { background:var(--coral-d); animation:cellPulse 1.5s infinite; }
@keyframes cellPulse { 0%,100%{opacity:1;} 50%{opacity:.5;} }
.life-stats { display:flex; justify-content:center; gap:32px; flex-wrap:wrap; margin-bottom:12px; }
.life-stat { display:flex; align-items:baseline; gap:6px; font-size:14px; color:var(--text-l); }
.life-stat b { font-family:'Comfortaa',sans-serif; font-size:28px; color:var(--sky-d); }
.life-quote { font-size:14px; color:var(--text-l); font-style:italic; }

/* ===== 番茄钟 ===== */
.pomo-stage { display:flex; flex-direction:column; align-items:center; gap:16px; max-width:500px; width:100%; }
.pomo-modes { display:flex; gap:12px; }
.pomo-mode { padding:8px 20px; border:2px solid rgba(255,255,255,.8); border-radius:100px; background:rgba(255,255,255,.5); color:var(--text-l); font-size:13px; font-weight:600; cursor:pointer; transition:var(--tr); }
.pomo-mode.active { background:linear-gradient(135deg,var(--coral),var(--coral-d)); color:var(--white); border-color:transparent; }
.pomo-ring-wrap { position:relative; width:clamp(180px,24vh,240px); height:clamp(180px,24vh,240px); }
.pomo-ring { width:100%; height:100%; transform:rotate(-90deg); }
.pomo-ring-bg { fill:none; stroke:rgba(168,216,234,.15); stroke-width:10; }
.pomo-ring-fill { fill:none; stroke:var(--coral-d); stroke-width:10; stroke-linecap:round; stroke-dasharray:565.48; stroke-dashoffset:565.48; transition:stroke-dashoffset .8s ease; filter:drop-shadow(0 0 6px var(--coral)); }
.pomo-center { position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); text-align:center; }
.pomo-time { font-family:'Comfortaa',sans-serif; font-size:clamp(32px,4.5vh,44px); font-weight:700; color:var(--text); }
.pomo-state { font-size:14px; color:var(--text-l); margin-top:4px; }
.pomo-controls { display:flex; gap:12px; }
.pomo-btn { padding:12px 32px; border:2px solid rgba(255,255,255,.8); border-radius:100px; background:rgba(255,255,255,.5); color:var(--text-l); font-size:15px; font-weight:600; cursor:pointer; transition:var(--tr); }
.pomo-btn:hover { background:rgba(255,255,255,.8); color:var(--text); }
.pomo-btn.primary { background:linear-gradient(135deg,var(--mint),var(--mint-d)); color:var(--white); border-color:transparent; }
.pomo-btn:disabled { opacity:.4; cursor:not-allowed; }
.pomo-stats { display:flex; gap:28px; }
.pomo-stat { display:flex; align-items:baseline; gap:6px; font-size:14px; color:var(--text-l); }
.pomo-stat b { font-family:'Comfortaa',sans-serif; font-size:22px; color:var(--mint-d); }

/* ===== 世界时钟 ===== */
.world-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(170px,1fr)); gap:14px; max-width:880px; width:100%; }
.world-card { background:rgba(255,255,255,.6); backdrop-filter:blur(20px); border:1px solid rgba(255,255,255,.9); border-radius:var(--radius-s); padding:18px 18px; text-align:center; box-shadow:var(--shadow); transition:var(--tr); }
.world-card:hover { transform:translateY(-4px); box-shadow:var(--shadow-h); }
.world-city { font-size:16px; font-weight:700; color:var(--text); margin-bottom:4px; }
.world-zone { font-size:12px; color:var(--text-ll); margin-bottom:16px; }
.world-time { font-family:'Comfortaa',sans-serif; font-size:26px; font-weight:700; color:var(--sky-d); margin-bottom:6px; }
.world-date { font-size:12px; color:var(--text-l); }
.world-icon { font-size:26px; margin-bottom:6px; }

/* ===== 碎碎念 ===== */
.quote-section { justify-content:center; }

/* 页脚页 */
.footer-section { justify-content:center; text-align:center; }
.quote-stage { max-width:650px; width:100%; text-align:center; }
.quote-card { background:rgba(255,255,255,.6); backdrop-filter:blur(20px); border:1px solid rgba(255,255,255,.9); border-radius:var(--radius); padding:36px 32px; box-shadow:var(--shadow); transition:var(--tr); }
.quote-mark { font-family:'Dancing Script',cursive; font-size:80px; line-height:.5; color:var(--sky-d); opacity:.3; margin-bottom:20px; }
.quote-text { font-size:clamp(20px,3vw,26px); font-weight:300; line-height:1.8; margin-bottom:16px; min-height:72px; transition:opacity .3s; }
.quote-author { font-size:15px; color:var(--text-l); font-style:italic; }
.quote-controls { display:flex; align-items:center; justify-content:center; gap:24px; margin-top:28px; }
.quote-btn { width:44px; height:44px; border-radius:50%; border:2px solid rgba(255,255,255,.8); background:rgba(255,255,255,.6); color:var(--sky-d); font-size:24px; cursor:pointer; transition:var(--tr); }
.quote-btn:hover { background:var(--sky); color:var(--white); border-color:transparent; }
.quote-dots { display:flex; gap:8px; }
.quote-dot { width:8px; height:8px; border-radius:50%; background:rgba(255,255,255,.8); border:1px solid var(--text-ll); cursor:pointer; transition:var(--tr); }
.quote-dot.active { background:var(--sky-d); width:24px; border-radius:4px; }

/* 页脚 */
/* 页脚内容样式 */
.footer-content { max-width:600px; margin:0 auto; }
.footer-logo { font-family:'Comfortaa',sans-serif; font-size:24px; font-weight:700; background:linear-gradient(135deg,var(--mint-d),var(--sky-d)); -webkit-background-clip:text; -webkit-text-fill-color:transparent; margin-bottom:12px; }
.footer-text { font-size:14px; color:var(--text-l); margin-bottom:20px; }
.footer-links a { display:inline-block; padding:10px 28px; border-radius:100px; background:rgba(255,255,255,.6); color:var(--sky-d); text-decoration:none; font-size:14px; font-weight:600; transition:var(--tr); }
.footer-links a:hover { background:var(--sky); color:var(--white); }
.footer-copy { margin-top:24px; font-size:12px; color:var(--text-ll); }

/* 响应式 */
@media (max-width:768px) {
    .nav-menu { position:fixed; top:90px; left:20px; right:20px; flex-direction:column; background:rgba(255,255,255,.95); backdrop-filter:blur(20px); border-radius:20px; padding:16px; gap:4px; box-shadow:var(--shadow-h); transform:translateY(-20px); opacity:0; pointer-events:none; transition:var(--tr); }
    .nav-menu.open { transform:translateY(0); opacity:1; pointer-events:auto; }
    .nav-burger { display:flex; }
    .section { padding:60px 16px 50px; }
    .clock-stage { flex-direction:column; gap:32px; }
    .clock-svg { width:240px; height:240px; }
    .life-grid { grid-template-columns:repeat(20,1fr); }
    .cd-numbers { gap:6px; }
    .cd-colon { display:none; }
    .blob { filter:blur(60px); }
    .page-dots { right:10px; gap:8px; }
    .page-dot { width:8px; height:8px; }
    .page-dot.active { width:8px; height:22px; }
    .page-dot-label { display:none; }
    .page-arrow { width:40px; height:40px; font-size:22px; }
    .page-prev { bottom:16px; left:16px; }
    .page-next { bottom:16px; right:16px; }
    .page-hint { font-size:10px; bottom:16px; }
}
@media (max-width:480px) {
    .hero-title { font-size:40px; }
    .clk-info-cards { flex-wrap:wrap; }
    .life-grid { grid-template-columns:repeat(12,1fr); }
    .pomo-ring-wrap { width:220px; height:220px; }
    .pomo-time { font-size:40px; }
}