:root{--bg0:#eef5f7;--bg1:#e4eef2;--ink:#1c3340;--muted:#5e7582;--accent:#2f8f8a;--accent-soft:#d7efed;--warm:#b8862d;--warm-soft:#f5ead0;--surface:#fffc;--surface-solid:#fff;--line:#c5d5dc;--danger:#c45c5c;--radius:18px;--font:"DM Sans", "PingFang SC", "Microsoft YaHei", sans-serif;--display:"Noto Serif SC", "Songti SC", serif;color:var(--ink);font-family:var(--font);font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;background:radial-gradient(900px 480px at 8% -5%,#cfe8e866,#0000 55%),radial-gradient(800px 420px at 96% 0,#f5ead055,#0000 50%),linear-gradient(165deg,#f7fbfc 0%,#eaf3f6 48%,#e3eef2 100%);line-height:1.5}*{box-sizing:border-box}html,body,#root{min-height:100%;margin:0}body{min-width:320px}a{color:inherit;text-decoration:none}button,input{font:inherit}.app-shell{flex-direction:column;gap:1.25rem;max-width:720px;min-height:100dvh;margin:0 auto;padding:1rem 1.1rem 2.5rem;display:flex}.topbar{justify-content:space-between;align-items:center;gap:1rem;display:flex}.brand{align-items:center;gap:.55rem;display:inline-flex}.brand-mark{background:radial-gradient(circle at 30% 30%, var(--warm-soft), transparent 45%), linear-gradient(135deg, var(--accent), #4aa8a3);border-radius:.45rem;width:1.55rem;height:1.55rem;box-shadow:0 0 0 1px #1c334015}.brand-text{font-family:var(--display);letter-spacing:.04em;font-size:1.35rem;font-weight:600}.nav{gap:.35rem;display:flex}.nav a{color:var(--muted);border-radius:999px;padding:.4rem .75rem;font-size:.92rem}.nav a.active{background:var(--accent-soft);color:var(--ink)}.main{flex:1}.footer{color:var(--muted);text-align:center;opacity:.9;font-size:.82rem}.page{flex-direction:column;gap:1.1rem;display:flex}.hero-block h1,.page>h1{font-family:var(--display);letter-spacing:.02em;margin:0;font-size:clamp(1.7rem,4vw,2.15rem);font-weight:600}.eyebrow{color:var(--accent);letter-spacing:.08em;text-transform:none;margin:0;font-size:.85rem}.lede{color:var(--muted);max-width:36rem;margin:0}.hero-block{flex-direction:column;gap:.55rem;display:flex}.hero-cta{margin-top:.85rem}.primary-btn,.ghost-btn{cursor:pointer;border:0;border-radius:999px;justify-content:center;align-items:center;padding:.7rem 1.15rem;transition:transform .15s,box-shadow .15s,background .15s,filter .15s;display:inline-flex}.primary-btn{color:#fff;letter-spacing:.02em;background:linear-gradient(160deg,#4db5af 0%,#2f8f8a 55%,#287f7a 100%);width:fit-content;min-height:2.75rem;padding:.85rem 1.45rem;font-weight:650;box-shadow:inset 0 1px #fff5,0 8px 18px #2f8f8a33,0 2px 4px #1c334018}.primary-btn:disabled{opacity:.55;cursor:not-allowed;box-shadow:none}.primary-btn:hover:not(:disabled),.ghost-btn:hover{filter:brightness(1.03);transform:translateY(-1px)}.primary-btn:active:not(:disabled){transform:translateY(0);box-shadow:inset 0 1px #fff3,0 3px 8px #2f8f8a28}.ghost-btn{color:var(--ink);background:#dfecef}.stats-bar{border-radius:var(--radius);background:var(--surface);border:1px solid var(--line);grid-template-columns:repeat(3,1fr);gap:.55rem;padding:.85rem;display:grid}.stats-bar.skeleton{color:var(--muted);display:block}.stat{text-align:center;flex-direction:column;align-items:center;gap:.15rem;display:flex}.stat-value{justify-content:center;align-items:center;min-height:1.6em;font-size:1.15rem;font-weight:650;line-height:1.2;display:flex}.stat.highlight .stat-value{color:var(--accent)}.stat-label{color:var(--muted);font-size:.75rem}.week-strip{flex-direction:column;gap:.75rem;display:flex}.week-toolbar{justify-content:space-between;align-items:center;display:flex}.week-title{margin:0;font-size:1rem;font-weight:550}.week-grid{grid-template-columns:repeat(7,1fr);gap:.4rem;margin:0;padding:0;list-style:none;display:grid}.day-cell{background:var(--surface-solid);border:1px solid var(--line);border-radius:14px;flex-direction:column;align-items:center;gap:.25rem;min-height:4.6rem;padding:.65rem .2rem;display:flex}.day-weekday{color:var(--muted);font-size:.72rem}.day-num{font-weight:650}.day-dot{background:0 0;border-radius:50%;width:.45rem;height:.45rem}.day-cell.done{background:var(--accent-soft);border-color:#9ecfcb}.day-cell.done .day-dot{background:var(--accent)}.day-cell.today{outline:1.5px solid var(--warm);outline-offset:1px}.hint{color:var(--muted);margin:0;font-size:.9rem}.hint.error{color:var(--danger)}.empty{border-radius:var(--radius);background:var(--surface);border:1px solid var(--line);flex-direction:column;align-items:flex-start;gap:.85rem;padding:1.2rem;display:flex}.recording-list{flex-direction:column;gap:.85rem;margin:0;padding:0;list-style:none;display:flex}.recording-item{border-radius:var(--radius);background:var(--surface-solid);border:1px solid var(--line);flex-direction:column;gap:.65rem;padding:.95rem;display:flex}.recording-meta{color:var(--muted);justify-content:space-between;gap:.75rem;display:flex}.recording-meta strong{color:var(--ink)}.recording-item audio{width:100%}.upload-form{border-radius:var(--radius);background:var(--surface-solid);border:1px solid var(--line);flex-direction:column;gap:.9rem;padding:1rem;display:flex}.api-status{border:1px solid var(--line);background:var(--surface);border-radius:12px;padding:.65rem .85rem;font-size:.88rem}.api-status.ok{color:var(--accent);background:var(--accent-soft);border-color:#9ecfcb}.api-status.bad{color:var(--danger);background:#fbeeee;border-color:#e8b4b4}.field{flex-direction:column;gap:.35rem;display:flex}.field span{color:var(--muted);font-size:.85rem}.field input[type=text],.field input[type=password]{border:1px solid var(--line);color:var(--ink);background:#f8fbfc;border-radius:12px;padding:.7rem .8rem}.field small{color:var(--muted)}.celebrate{z-index:50;background:#e8f1f4dd;place-items:center;padding:1rem;animation:.25s fade-in;display:grid;position:fixed;inset:0}.celebrate-card{background:var(--surface-solid);border:1px solid var(--line);border-radius:22px;flex-direction:column;gap:.75rem;width:min(420px,100%);padding:1.4rem 1.25rem 1.1rem;animation:.35s rise-in;display:flex;box-shadow:0 16px 40px #1c334022}.celebrate-eyebrow{color:var(--accent);letter-spacing:.06em;margin:0;font-size:.8rem}.celebrate-title{font-family:var(--display);margin:0;font-size:1.45rem;line-height:1.35}.celebrate-sub,.celebrate-milestone{color:var(--muted);margin:0}.celebrate-milestone{color:var(--warm)}.celebrate-stats{grid-template-columns:repeat(3,1fr);gap:.5rem;margin-top:.25rem;display:grid}.celebrate-stats div{background:var(--bg1);border-radius:12px;flex-direction:column;align-items:center;gap:.15rem;padding:.55rem .2rem;display:flex}.celebrate-stats strong{color:var(--warm);font-size:1.15rem}.celebrate-stats span{color:var(--muted);font-size:.72rem}.celebrate-actions{flex-direction:column;gap:.45rem;margin-top:.35rem;display:flex}.celebrate-actions .primary-btn,.celebrate-actions .ghost-btn{width:100%}.mute-btn{color:var(--muted);cursor:pointer;text-underline-offset:3px;background:0 0;border:0;align-self:center;margin-top:.15rem;font-size:.8rem;text-decoration:underline}@keyframes fade-in{0%{opacity:0}to{opacity:1}}@keyframes rise-in{0%{opacity:0;transform:translateY(12px)scale(.98)}to{opacity:1;transform:translateY(0)scale(1)}}@media (width<=520px){.day-cell{min-height:4.2rem;padding:.5rem .1rem}}.timeline-section{flex-direction:column;gap:.85rem;display:flex}.timeline-section-head h2{margin:0;font-size:1.05rem;font-weight:650}.timeline-section-head p{color:var(--muted);margin:.2rem 0 0;font-size:.85rem}.timeline-toolbar{justify-content:space-between;align-items:center;gap:.75rem;margin-bottom:.15rem;display:flex}.timeline-toolbar .hint{margin:0}.text-action{color:var(--accent);cursor:pointer;background:0 0;border:0;padding:.25rem .15rem;font-size:.9rem;font-weight:650}.text-action:hover{opacity:.8}.timeline.is-managing{padding-bottom:5.5rem}.timeline-row.managing{gap:.85rem}.select-dot{color:#fff;background:#fff;border:1.5px solid #b7c8cf;border-radius:50%;flex:none;place-items:center;width:1.35rem;height:1.35rem;margin-top:.45rem;transition:background .15s,border-color .15s,transform .15s;display:grid}.select-dot.on{background:var(--accent);border-color:var(--accent);transform:scale(1.04)}.timeline-item.selected{background:#f3faf9}.manage-bar{left:50%;bottom:calc(.85rem + env(safe-area-inset-bottom,0px));border:1px solid var(--line);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);z-index:40;background:#ffffffeb;border-radius:18px;grid-template-columns:1fr 1.4fr;gap:.55rem;width:min(680px,100% - 1.5rem);padding:.7rem;display:grid;position:fixed;transform:translate(-50%);box-shadow:0 12px 36px #1c334028}.manage-bar-cancel,.manage-bar-delete{cursor:pointer;border:0;border-radius:12px;min-height:2.7rem;font-weight:650}.manage-bar-cancel{color:var(--ink);background:#eef3f5}.manage-bar-delete{color:#fff;background:#e85d5d;box-shadow:0 6px 14px #e85d5d33}.manage-bar-delete:disabled{opacity:.4;cursor:not-allowed;box-shadow:none}.sheet-mask{z-index:60;padding:.85rem;padding-bottom:calc(.85rem + env(safe-area-inset-bottom,0px));background:#1c334047;place-items:end center;animation:.18s fade-in;display:grid;position:fixed;inset:0}.confirm-sheet{background:#fff;border-radius:20px;flex-direction:column;gap:.45rem;width:min(420px,100%);padding:1.15rem 1rem .85rem;animation:.22s rise-in;display:flex;box-shadow:0 18px 40px #1c334033}.confirm-sheet h3{text-align:center;margin:.15rem 0 0;font-size:1.05rem}.confirm-sheet p{text-align:center;color:var(--muted);margin:0 0 .55rem;font-size:.9rem}.sheet-danger,.sheet-cancel{cursor:pointer;border:0;border-radius:12px;min-height:2.75rem;font-weight:650}.sheet-danger{color:#fff;background:#e85d5d}.sheet-cancel{color:var(--muted);background:0 0}.sheet-danger:disabled,.sheet-cancel:disabled{opacity:.55;cursor:not-allowed}.timeline{flex-direction:column;gap:1rem;display:flex}.timeline-month{background:var(--surface-solid);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}.timeline-month-head{width:100%;color:inherit;text-align:left;cursor:pointer;background:0 0;border:0;border-bottom:1px solid #0000;justify-content:space-between;align-items:center;gap:.75rem;padding:.95rem 1rem;display:flex}.timeline-month.expanded .timeline-month-head{border-bottom-color:#e8eef1}.timeline-month-head h2{margin:0;font-size:1rem;font-weight:650}.timeline-month-head p{color:var(--muted);margin:.25rem 0 0;font-size:.82rem}.month-chevron{color:var(--accent);flex:none;font-size:.82rem;font-weight:600}.timeline-list{margin:0;padding:0;list-style:none}.timeline-item{border-top:1px solid #eef3f5}.timeline-item:first-child{border-top:0}.timeline-row{width:100%;color:inherit;text-align:left;cursor:pointer;background:0 0;border:0;align-items:flex-start;gap:.75rem;padding:.9rem 1rem;display:flex}.timeline-row:hover{background:#f7fbfc}.timeline-icon{color:#fff;background:linear-gradient(145deg,#3a9f9a,#2f8f8a);border-radius:50%;flex:none;place-items:center;width:2.35rem;height:2.35rem;font-size:.95rem;display:grid}.timeline-body{flex-direction:column;flex:1;gap:.35rem;min-width:0;display:flex}.timeline-top,.timeline-bottom{justify-content:space-between;align-items:baseline;gap:.75rem;display:flex}.timeline-top strong{text-overflow:ellipsis;white-space:nowrap;font-size:.98rem;font-weight:650;overflow:hidden}.timeline-top time{color:var(--muted);flex:none;font-size:.78rem}.timeline-bottom em{color:var(--muted);font-size:.85rem;font-style:normal}.timeline-bottom span{letter-spacing:.01em;font-size:1.05rem;font-weight:700}.timeline-player{padding:0 1rem .95rem 4.1rem}.timeline-player audio{width:100%}.timeline-item.open{background:#f4fafb}