:root{
  --bg:#FFF9F0;
  --ink:#2B2D42;
  --ink2:#6B7080;
  --line:#ECE2D4;
  --card:#FFFFFF;
  --orange:#FF9F1C;
  --orange-d:#E8871A;
  --blue:#4EA8DE;
  --green:#52B788;
  --purple:#9D8DF1;
  --teal:#2A9D8F;
  --red:#E86A8A;
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{margin:0;padding:0}
body{
  background:var(--bg);
  color:var(--ink);
  font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;
  font-size:17px;line-height:1.7;
  padding-bottom:40px;
}
button{font-family:inherit;font-size:inherit;color:inherit;cursor:pointer}
img{display:block;max-width:100%}

#topbar{
  position:sticky;top:0;z-index:20;
  display:flex;align-items:center;gap:8px;
  padding:12px 16px;background:var(--bg);
  border-bottom:1.5px solid var(--line);
}
#topbar h1{flex:1;margin:0;text-align:center;font-size:18px;font-weight:600}
.top-btn{
  min-width:56px;padding:7px 12px;
  border:1.5px solid var(--line);border-radius:999px;
  background:#fff;font-size:15px;color:var(--ink2);
}
.top-btn:active{background:#f3ece1}

#main{padding:16px 16px 8px;max-width:640px;margin:0 auto}

/* ---------- 通用 ---------- */
.card{background:var(--card);border-radius:20px;padding:18px;margin-bottom:14px;border:1.5px solid var(--line)}
.muted{color:var(--ink2);font-size:15px}
.big{font-size:20px;font-weight:600;margin:0 0 6px}

/* ---------- 首页 ---------- */
.entry{
  display:block;width:100%;text-align:left;
  background:var(--card);border:2px solid var(--line);border-radius:24px;
  padding:18px;margin-bottom:16px;
}
.entry:active{transform:scale(.985)}
.entry .e-row{display:flex;align-items:center;gap:16px}
.entry .e-art{
  width:78px;height:78px;border-radius:20px;flex:0 0 auto;
  object-fit:cover;background:#FFF6E5;
}
.entry .e-title{font-size:22px;font-weight:600;margin:0 0 3px}
.entry .e-desc{font-size:15px;color:var(--ink2);margin:0;line-height:1.5}
.entry.a{border-color:#FFD9A6}
.entry.b{border-color:#BFE3F5}

/* ---------- 步骤点 ---------- */
.steps{display:flex;align-items:center;justify-content:center;gap:8px;margin-bottom:16px}
.step-dot{
  width:34px;height:34px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  font-size:15px;font-weight:600;
  background:#EFE7D9;color:#A99C86;
}
.step-dot.on{background:var(--orange);color:#fff}
.step-dot.done{background:#DFF3E8;color:#3F8F68}
.step-line{width:16px;height:2px;background:#EFE7D9;border-radius:2px}
.step-line.done{background:#DFF3E8}

/* ---------- 按钮 ---------- */
.btn{
  display:block;width:100%;min-height:56px;padding:16px;
  border:none;border-radius:18px;
  background:var(--orange);color:#fff;
  font-size:18px;font-weight:600;margin-top:12px;
}
.btn:active{opacity:.85}
.btn.blue{background:var(--blue)}
.btn.green{background:var(--green)}
.btn.purple{background:var(--purple)}
.btn.teal{background:var(--teal)}
.btn.ghost{
  background:transparent;border:1.5px dashed var(--line);color:var(--ink2);
  font-size:15px;font-weight:400;min-height:48px;padding:13px;
}
.btn:disabled{background:#DCD6CC;color:#fff}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.row2 .btn{margin-top:12px;font-size:16px;padding-left:8px;padding-right:8px}

/* ---------- 学方法 ---------- */
.learn-art{
  width:100%;aspect-ratio:1/1;max-height:260px;
  object-fit:cover;border-radius:18px;margin-bottom:16px;background:#FFF6E5;
}
.learn-q{font-size:24px;font-weight:600;margin:0 0 4px}
.learn-sub{font-size:16px;color:var(--ink2);margin:0 0 16px}
.say{background:#FFF6E5;border-radius:14px;padding:14px 16px;margin-bottom:12px;border-left:5px solid var(--orange)}
.say .lbl{font-size:13px;color:#B07800;font-weight:600;margin-bottom:3px}
.say p{margin:0;font-size:17px}
.why{background:#F4F7FB;border-radius:14px;padding:14px 16px}
.why .lbl{font-size:13px;color:var(--ink2);font-weight:600;margin-bottom:3px}
.why p{margin:0;font-size:16px;color:var(--ink2)}
.dots{display:flex;justify-content:center;gap:8px;margin:16px 0 2px}
.dot{width:9px;height:9px;border-radius:50%;background:#E3DACA;transition:all .2s}
.dot.on{background:var(--orange);width:24px;border-radius:999px}

/* ---------- chips / 输入 ---------- */
.chips{display:flex;flex-wrap:wrap;gap:8px;margin:10px 0 4px}
.chip{
  padding:8px 14px;border-radius:999px;
  border:1.5px solid #F1DFC0;background:#FFFDF7;
  font-size:15px;color:#8A6A2A;
}
.chip:active{background:#FFF3DC}
.input-row{display:flex;gap:10px;margin-top:12px}
.input-row input,.ta{
  flex:1;width:100%;padding:14px 16px;font-size:17px;font-family:inherit;
  border:1.5px solid var(--line);border-radius:16px;background:#fff;color:var(--ink);
}
.input-row input:focus,.ta:focus{outline:none;border-color:var(--orange)}
.ta{resize:vertical;min-height:120px;line-height:1.6;margin-top:12px}
.add-btn{flex:0 0 auto;padding:14px 20px;border:none;border-radius:16px;background:var(--orange);color:#fff;font-size:17px;font-weight:600}

/* ---------- 语音 ---------- */
.voice-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:14px}
.vbtn{
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;
  min-height:96px;border-radius:20px;border:2px solid #BFE3F5;background:#F5FBFE;
  font-size:16px;font-weight:600;color:#1F6E96;padding:10px;
}
.vbtn.mic{border-color:#FFD9A6;background:#FFFBF3;color:#A86A0A}
.vbtn:active{transform:scale(.97)}
.vbtn svg{width:30px;height:30px}
.vbtn small{font-size:12px;font-weight:400;color:var(--ink2)}

.voicebar{
  position:fixed;left:0;right:0;bottom:0;z-index:60;
  background:#2B2D42;color:#fff;
  padding:22px 20px calc(26px + env(safe-area-inset-bottom));
  border-radius:24px 24px 0 0;text-align:center;
}
.voicebar[hidden]{display:none}
.vb-mic{display:flex;align-items:center;justify-content:center;gap:14px}
.vb-pulse{
  width:16px;height:16px;border-radius:50%;background:#E86A8A;flex:0 0 auto;
  animation:vp 1s infinite;
}
@keyframes vp{0%,100%{transform:scale(1);opacity:1}50%{transform:scale(1.5);opacity:.45}}
.vb-stop{
  padding:15px 34px;border:none;border-radius:999px;
  background:#fff;color:#2B2D42;font-size:18px;font-weight:600;
}
.vb-hint{margin:12px 0 0;font-size:14px;color:rgba(255,255,255,.66)}

/* ---------- 结果确认 ---------- */
.confirm{
  border:2px solid var(--green);background:#F2FBF7;
  border-radius:18px;padding:16px;margin-top:14px;
}
.confirm .cq{font-size:13px;color:#0F6E56;font-weight:600;margin-bottom:6px}
.confirm .ct{
  width:100%;font-size:19px;font-family:inherit;line-height:1.5;
  border:1.5px solid #BFE3D5;border-radius:12px;padding:10px 12px;
  background:#fff;color:var(--ink);resize:vertical;
}
.confirm .ct:focus{outline:none;border-color:var(--green)}

/* ---------- 拆分预览 ---------- */
.preview{margin-top:14px}
.pv-head{font-size:15px;font-weight:600;color:var(--teal);margin-bottom:8px}
.pv{
  display:flex;align-items:flex-start;gap:10px;
  background:#F2FBF7;border:1.5px solid #BFE3D5;border-radius:14px;
  padding:11px 13px;margin-bottom:8px;font-size:16px;
}
.pv .n{flex:0 0 auto;width:22px;height:22px;border-radius:50%;background:#DFF3E8;color:#3F8F68;font-size:12px;font-weight:600;display:flex;align-items:center;justify-content:center;margin-top:3px}
.pv .t{flex:1;word-break:break-all}
.pv .x{flex:0 0 auto;border:none;background:none;color:#A09889;font-size:18px;padding:0 2px}

/* ---------- 条目 ---------- */
.items{margin-top:12px}
.item{background:#fff;border:1.5px solid var(--line);border-radius:16px;padding:13px 14px;margin-bottom:10px}
.item .top{display:flex;align-items:flex-start;gap:12px}
.item .txt{flex:1;font-size:17px;word-break:break-all}
.item .del{flex:0 0 auto;width:30px;height:30px;border:none;border-radius:50%;background:#F6F1E8;color:#A09889;font-size:17px;line-height:1;padding:0}
.item .meta{font-size:13px;color:var(--ink2);margin-top:3px}
.item .tool{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.star{
  flex:0 0 auto;width:40px;height:40px;border-radius:50%;
  border:1.5px solid var(--line);background:#fff;
  font-size:20px;line-height:1;padding:0;color:#DCD6CC;
}
.star.on{background:#FFF0D6;border-color:var(--orange);color:var(--orange)}
.daypick{display:flex;gap:8px}
.daypick button{
  flex:1;height:44px;border-radius:12px;
  border:1.5px solid var(--line);background:#fff;
  font-size:15px;color:var(--ink2);padding:0;
}
.daypick button.on{background:var(--green);border-color:var(--green);color:#fff;font-weight:600}
.minpick{display:flex;gap:8px}
.minpick button{
  flex:1;height:44px;border-radius:12px;
  border:1.5px solid var(--line);background:#fff;
  font-size:15px;color:var(--ink2);padding:0;
}
.minpick button.on{background:var(--purple);border-color:var(--purple);color:#fff;font-weight:600}
.splitbtn{
  padding:9px 14px;border-radius:999px;border:1.5px dashed #C6BFF0;
  background:#F7F5FE;color:#6B5CC4;font-size:14px;
}
.splitbtn.on{border-style:solid;border-color:var(--purple);background:#EFEBFD;color:#5B4AC0;font-weight:600}
.tagline{display:inline-block;font-size:12px;padding:2px 9px;border-radius:999px;background:#EFEBFD;color:#6B5CC4;margin-left:6px;vertical-align:middle}

/* ---------- 执行 ---------- */
.dayblock{margin-bottom:14px}
.dayname{font-size:16px;font-weight:600;margin:0 0 8px;display:flex;align-items:center;gap:8px}
.dayname .cnt{font-size:14px;font-weight:400;color:var(--ink2)}
.task{
  display:flex;align-items:flex-start;gap:12px;
  background:#fff;border:1.5px solid var(--line);border-radius:16px;
  padding:13px 14px;margin-bottom:9px;
}
.task:active{background:#FDFAF4}
.tick{
  flex:0 0 auto;width:28px;height:28px;border-radius:50%;
  border:2px solid #D6CEC0;background:#fff;margin-top:1px;
  display:flex;align-items:center;justify-content:center;
  font-size:14px;color:transparent;line-height:1;padding:0;
  transition:background .18s,border-color .18s;
}
.task.done .tick{background:var(--green);border-color:var(--green);color:#fff}
.task.done .txt{color:#A9B0A6;text-decoration:line-through}
.task .txt{flex:1;font-size:17px}
.task .min{font-size:14px;color:#A9B0A6;flex:0 0 auto}
.progressbar{height:12px;border-radius:999px;background:#F0E9DC;overflow:hidden;margin:8px 0 14px}
.progressbar i{display:block;height:100%;background:linear-gradient(90deg,#7BD3A8,#52B788);border-radius:999px;transition:width .3s}

/* ---------- 记录 ---------- */
.plan{background:#fff;border:1.5px solid var(--line);border-radius:18px;padding:15px 16px;margin-bottom:12px}
.plan .p-title{font-size:18px;font-weight:600;margin:0 0 3px}
.plan .p-meta{font-size:14px;color:var(--ink2);margin:0 0 8px}
.plan .p-review{font-size:15px;color:var(--teal);background:#F0FAF8;border-radius:12px;padding:9px 12px;margin-top:8px}
.empty{text-align:center;color:var(--ink2);padding:44px 20px;font-size:16px}

/* ---------- toast ---------- */
.toast{
  position:fixed;left:50%;bottom:32px;transform:translateX(-50%);
  background:#2B2D42;color:#fff;padding:12px 22px;border-radius:999px;
  font-size:15px;z-index:99;max-width:88vw;text-align:center;
}
.toast[hidden]{display:none}