/* ==========================================================
   三色计划 P1 · 样式
   色彩系统：工作 #7F77DD 靛紫 / 生活 #F0997B 珊瑚橙 / 学习 #5DCAA5 薄荷绿
   三层结构：浅底(h3) + 3px 左色条(h1) + 深字(h4)
   ========================================================== */
:root{
  --w1:#7F77DD; --w2:#534AB7; --w3:#EEEDFE; --w4:#26215C;
  --l1:#F0997B; --l2:#D85A30; --l3:#FAECE7; --l4:#4A1B0C;
  --s1:#5DCAA5; --s2:#0F6E56; --s3:#E1F5EE; --s4:#04342C;
  --ink:#1C1B2E; --ink2:#55536E; --ink3:#8B88A3;
  --line:#E6E6F0; --bg:#F6F6FA; --card:#FFFFFF;
  --danger:#D64545; --amber:#B7791F;
  --shadow:0 1px 2px rgba(28,27,46,.04),0 4px 14px rgba(28,27,46,.05);
  --radius:14px;
}
*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%}
body{
  font-family:"PingFang SC","Microsoft YaHei","Noto Sans SC",system-ui,sans-serif;
  background:var(--bg); color:var(--ink); font-size:13px;
  -webkit-font-smoothing:antialiased;
}
button{font-family:inherit;cursor:pointer;border:none;background:none;color:inherit}
input,select{font-family:inherit;font-size:12.5px;color:var(--ink)}
.hidden{display:none!important}
.ic{width:14px;height:14px;fill:none;vertical-align:-2px}

/* ---------------- 顶栏 ---------------- */
.topbar{
  position:sticky;top:0;z-index:40;display:flex;align-items:center;gap:14px;
  padding:9px 18px;background:rgba(255,255,255,.92);backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line);
}
.brand{display:flex;align-items:center;gap:8px;font-size:14.5px}
.logo{width:20px;height:20px;border-radius:6px;display:inline-block;
  background:conic-gradient(var(--w1) 0 120deg,var(--l1) 120deg 240deg,var(--s1) 240deg 360deg)}
.vtabs{display:flex;gap:2px;background:#EFEFF6;border-radius:10px;padding:3px}
.vtabs button{padding:5px 13px;border-radius:8px;font-size:12.5px;color:var(--ink2);transition:.15s}
.vtabs button.on{background:#fff;color:var(--ink);font-weight:700;box-shadow:0 1px 4px rgba(28,27,46,.1)}
.nav-date{display:flex;align-items:center;gap:7px}
.nav-date .cur{font-size:13.5px;font-weight:700;min-width:96px;text-align:center}
.lunar-cap{font-size:10px;color:#9A7238;background:#FFFCF3;border:1px solid #F2DCAE;border-radius:7px;padding:2px 7px;white-space:nowrap}
.lunar-cap:empty{display:none}
.navbtn{width:25px;height:25px;border-radius:8px;display:grid;place-items:center;color:var(--ink2)}
.navbtn:hover{background:#EFEFF6;color:var(--ink)}
.tday{font-size:11.5px;color:var(--w2);background:var(--w3);border-radius:8px;padding:4px 10px;font-weight:600}
.filters{display:flex;gap:6px;margin-left:auto}
.fchip{display:flex;align-items:center;gap:5px;font-size:11.5px;padding:4px 11px;border-radius:999px;
  border:1.5px solid var(--line);color:var(--ink2);transition:.15s}
.fchip i{width:8px;height:8px;border-radius:3px;display:inline-block}
.fchip.on.w{border-color:var(--w1);color:var(--w2);background:var(--w3)}
.fchip.on.l{border-color:var(--l1);color:var(--l2);background:var(--l3)}
.fchip.on.s{border-color:var(--s1);color:var(--s2);background:var(--s3)}
.fchip.off{opacity:.45}
.tb-right{display:flex;align-items:center;gap:8px}
.iconbtn{width:30px;height:30px;border-radius:9px;display:grid;place-items:center;color:var(--ink2);border:1px solid var(--line);background:#fff}
.iconbtn:hover{color:var(--ink);border-color:#CFCFE0}
.btn{display:inline-flex;align-items:center;justify-content:center;border-radius:9px;
  padding:7px 15px;font-size:12.5px;font-weight:600;transition:.15s;border:1px solid transparent}
.btn.p{background:var(--w1);color:#fff}
.btn.p:hover{background:var(--w2)}
.btn.g{border-color:var(--line);color:var(--ink2);background:#fff}
.btn.g:hover{color:var(--ink);border-color:#CFCFE0}
.avatar-btn{width:30px;height:30px;border-radius:50%;background:linear-gradient(135deg,var(--w1),var(--s1));
  color:#fff;font-size:12.5px;font-weight:700;display:grid;place-items:center}
.avatar-btn.guest{background:#C9C7DD;color:#fff}

/* ---------------- 主区布局 ---------------- */
#app{padding:16px 18px 90px;max-width:1460px;margin:0 auto}
.view{display:flex;gap:14px;align-items:flex-start}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow)}
.dcol{width:264px;flex:none;display:flex;flex-direction:column;gap:12px}
.side-card{padding:13px 15px}
.side-card h4{font-size:12.5px;font-weight:700;display:flex;justify-content:space-between;align-items:baseline;margin-bottom:9px}
.side-card h4 small{font-weight:400;color:var(--ink3);font-size:10.5px}
.empty{padding:18px 8px;text-align:center;font-size:11.5px;color:var(--ink3);line-height:1.7}

/* 统计小块 */
.stats{display:flex;gap:8px;flex-wrap:wrap}
.st{flex:1;min-width:64px;background:#FAFAFD;border:1px solid var(--line);border-radius:10px;padding:8px 10px}
.st span{display:block;font-size:10px;color:var(--ink3);margin-bottom:3px}
.st b{font-size:16px}
.st b small{font-size:10px;color:var(--ink3);font-weight:400;margin-left:2px}
.bar3{display:flex;height:8px;border-radius:5px;overflow:hidden;gap:2px}
.bar3 i{display:block}

/* ---------------- 日视图 ---------------- */
#view-day .day-left{order:0}
#view-day .day-main{flex:1;min-width:0}
#view-day .day-right{order:2}
.tl-head{display:flex;justify-content:space-between;align-items:center;padding:13px 16px;border-bottom:1px solid var(--line)}
.tl-head h3{font-size:16px;display:inline-block;margin-right:9px}
.dsub{font-size:11px;color:var(--ink3)}
.dsub.today{color:var(--w2);font-weight:600}
.tl-legend{display:flex;gap:11px;font-size:10.5px;color:var(--ink2)}
.tl-legend i{display:inline-block;width:8px;height:8px;border-radius:3px;margin-right:4px}
.tl-scroll{height:calc(100vh - 175px);min-height:420px;overflow-y:auto;position:relative}
.tl-inner{display:flex;position:relative}
.tl-hours{width:52px;flex:none;padding-top:0}
.tl-hour{height:44px;position:relative}
.tl-hour span{position:absolute;top:-7px;right:8px;font-size:10px;color:var(--ink3);background:#fff;padding:0 2px}
.tl-canvas{flex:1;position:relative;border-left:1px solid var(--line)}
.tl-hline{position:absolute;left:0;right:0;border-top:1px solid #F0F0F7;pointer-events:none}
.tl-hline.half{border-top-style:dashed;border-color:#F5F5FA}
.tl-slot{position:absolute;left:0;right:0;cursor:pointer}
.tl-slot:hover{background:rgba(127,119,221,.05)}
.nowline{position:absolute;left:0;right:0;border-top:2px solid var(--danger);z-index:5;pointer-events:none}
.nowline b{position:absolute;top:-8px;left:6px;font-size:9.5px;color:#fff;background:var(--danger);border-radius:6px;padding:1px 6px}
.day-empty{position:absolute;left:0;right:0;text-align:center;color:var(--ink3)}
.day-empty p{font-size:13.5px;color:var(--ink2);font-weight:600;margin-bottom:4px}
.day-empty span{font-size:11px}
.tplrow{display:flex;gap:8px;justify-content:center;margin-top:11px}
.tpl{border:1.5px dashed #C9C7E0;color:var(--w2);border-radius:9px;padding:6px 13px;font-size:11.5px;font-weight:600}
.tpl:hover{background:var(--w3);border-style:solid}

/* 事件块（三层结构） */
.ev{position:absolute;border-radius:8px;padding:5px 9px 5px 11px;font-size:11.5px;cursor:grab;
  border-left:3px solid;overflow:hidden;transition:box-shadow .15s;z-index:2}
.ev:hover{box-shadow:0 3px 12px rgba(28,27,46,.16);z-index:6}
.ev.dragging{opacity:.5}
.ev b{display:block;font-size:11.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ev span{font-size:10px;opacity:.75;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ev.w{background:var(--w3);border-color:var(--w1)}
.ev.l{background:var(--l3);border-color:var(--l1)}
.ev.s{background:var(--s3);border-color:var(--s1)}
.ev.done{opacity:.48}
.ev.done b{text-decoration:line-through}
.ev.mute{opacity:.22;filter:grayscale(.5)}
.ev.tight b{display:inline;margin-right:6px}
.ev.tight span{display:inline}
.lntag{font-size:8.5px;background:#9A7238;color:#fff;border-radius:4px;padding:0 4px;margin-right:4px;display:inline-block!important}
.ric{vertical-align:-1px;margin-right:3px;opacity:.7}

/* 完成度圆环 */
.ringrow{display:flex;flex-direction:column;gap:10px}
.ring{display:flex;align-items:center;gap:10px}
.rr{width:46px;height:46px;border-radius:50%;display:grid;place-items:center;flex:none}
.rr i{width:34px;height:34px;border-radius:50%;background:#fff;display:grid;place-items:center;font-size:9.5px;font-style:normal;font-weight:700}
.rt b{display:block;font-size:12px}
.rt span{font-size:10px;color:var(--ink3)}

/* 待办行 */
.tlist{display:flex;flex-direction:column;gap:2px}
.titem{display:flex;align-items:flex-start;gap:8px;padding:6px 6px;border-radius:8px;cursor:pointer}
.titem:hover{background:#F7F7FC}
.titem.done{opacity:.5}
.titem.done b{text-decoration:line-through}
.titem.pri-high .t1 b::after{content:"!";color:var(--danger);margin-left:4px;font-weight:800}
.titem.mute{opacity:.25}
.cb{width:16px;height:16px;border-radius:50%;border:1.8px solid currentColor;flex:none;margin-top:1px;
  display:grid;place-items:center;color:#C6C4DA;cursor:pointer;transition:.12s}
.cb.on{background:currentColor;border-color:currentColor}
.cb.on svg{color:#fff}
.titem .tx{flex:1;min-width:0}
.t1{display:flex;align-items:center;gap:6px;font-size:12px}
.t1 b{font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sq{width:7px;height:7px;border-radius:2px;flex:none}
.t2{display:flex;align-items:center;gap:6px;margin-top:2px;flex-wrap:wrap}
.estcap{font-size:9.5px;background:#F0F0F7;color:var(--ink2);border-radius:5px;padding:1px 6px}
.estcap.late{background:#FBEAEA;color:var(--danger);font-weight:600}
.recur-ic{color:var(--ink3)}

/* 快速录入 */
.quickadd{display:flex;align-items:center;gap:7px;margin-top:9px;padding:8px 11px;
  border:1.5px dashed #D9D9E8;border-radius:10px;color:var(--ink3);font-size:11.5px;cursor:pointer}
.quickadd:hover{border-color:var(--w1);color:var(--w2)}
.quickadd input{flex:1;border:none;outline:none;font-size:12px;background:transparent}

/* 今日翻牌 */
.flipcard{padding:13px 15px;border:1.5px solid var(--s1);background:linear-gradient(150deg,var(--s3),#fff)}
.flipcard.warn{border-color:#E8C06A;background:linear-gradient(150deg,#FFF8EA,#fff)}
.flipcard em{font-style:normal;font-size:10px;font-weight:700;color:var(--s2);letter-spacing:.5px}
.flipcard.warn em{color:#9A7238}
.flipcard b{display:block;font-size:13.5px;margin:6px 0 4px}
.flipcard span{font-size:11px;color:var(--ink2);line-height:1.6;display:block}
.bbtn{display:flex;gap:7px;margin-top:10px}
.bbtn i{flex:1;text-align:center;font-style:normal;font-size:11px;font-weight:600;padding:6px 4px;
  border-radius:8px;border:1px solid var(--line);color:var(--ink2);cursor:pointer;background:#fff}
.bbtn i:hover{border-color:var(--w1);color:var(--w2)}
.bbtn i.solid{background:var(--w1);border-color:var(--w1);color:#fff}
.bbtn i.solid:hover{background:var(--w2)}

/* ---------------- 移动端「今天」 ---------------- */
#view-mday{display:block}
.mday-top{background:linear-gradient(135deg,var(--w1),#9B8FF0 55%,var(--s1));border-radius:16px;
  color:#fff;padding:17px 16px;margin-bottom:13px;box-shadow:0 6px 18px rgba(83,74,183,.25)}
.mday-top .pt{font-size:16.5px;font-weight:700}
.mday-top .pd{font-size:11px;opacity:.85;margin-top:3px}
.mday-top .pp{display:flex;gap:9px;margin-top:13px}
.mday-top .pp div{flex:1;background:rgba(255,255,255,.16);border-radius:10px;padding:7px 4px;text-align:center}
.mday-top .pp b{font-size:14.5px;display:block}
.mday-top .pp span{font-size:9.5px;opacity:.85}
.mday-body h6{font-size:11.5px;color:var(--ink3);margin-bottom:8px;font-weight:700}
.pcard{display:flex;align-items:center;gap:10px;background:#fff;border:1px solid var(--line);
  border-left:3.5px solid;border-radius:11px;padding:10px 12px;margin-bottom:7px;cursor:pointer}
.pcard.w{border-left-color:var(--w1)} .pcard.l{border-left-color:var(--l1)} .pcard.s{border-left-color:var(--s1)}
.pcard.done{opacity:.5}
.pcard.done b{text-decoration:line-through}
.pcard b{font-size:12.5px;display:block}
.pcard span{font-size:10px;color:var(--ink3)}
.pck{width:21px;height:21px;border-radius:50%;border:2px solid;display:grid;place-items:center;flex:none;cursor:pointer}
.tdi{display:flex;align-items:center;gap:9px;background:#fff;border:1px solid var(--line);border-radius:11px;
  padding:9px 12px;margin-bottom:6px;cursor:pointer}
.tdi.ok{opacity:.5}
.tdi.ok .tt{text-decoration:line-through}
.tdi .tt{flex:1;font-size:12.5px;display:flex;align-items:center;gap:7px}
.tdi .cat{width:7px;height:7px;border-radius:2px;flex:none}
.meta2 .tg{font-size:9px;background:#F0F0F7;border-radius:5px;padding:1px 6px;color:var(--ink2)}
.tg{font-style:normal}

/* ---------------- 周视图 ---------------- */
.week-wrap{flex:1;overflow:hidden}
.wk-head{display:grid;grid-template-columns:52px repeat(7,1fr);border-bottom:1px solid var(--line)}
.wh{padding:8px 4px;text-align:center;cursor:pointer;border-left:1px solid #F4F4F9}
.wh:first-child{border-left:none;cursor:default}
.wh b{display:block;font-size:11px}
.wh span{font-size:10px;color:var(--ink3)}
.wh em{display:block;font-style:normal;font-size:9px;color:#9A7238;margin-top:1px;min-height:12px}
.wh em.fest{color:#C0443E;font-weight:600}
.wh.today{background:var(--w3)}
.wh.today b{color:var(--w2)}
.wk-body{display:flex;max-height:calc(100vh - 245px);min-height:340px;overflow-y:auto}
.wk-gutter{width:52px;flex:none}
.wk-gut{height:40px;position:relative}
.wk-gut span{position:absolute;top:-6px;right:7px;font-size:9.5px;color:var(--ink3);background:#fff}
.wk-col{flex:1;position:relative;border-left:1px solid #F4F4F9;cursor:pointer}
.wk-col.today{background:#FBFAFF}
.wk-hl{position:absolute;left:0;right:0;border-top:1px solid #F4F4F9;pointer-events:none}
.wk-hl.half{border-top-style:dashed;border-color:#F7F7FB}
.wk-ev{position:absolute;border-radius:5px;padding:2px 5px;font-size:9.5px;cursor:pointer;
  border-left:2.5px solid;overflow:hidden;z-index:2}
.wk-ev b{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:9.5px}
.wk-ev span{font-size:8.5px;opacity:.75}
.wk-ev.w{background:var(--w3);border-color:var(--w1)}
.wk-ev.l{background:var(--l3);border-color:var(--l1)}
.wk-ev.s{background:var(--s3);border-color:var(--s1)}
.wk-ev.done{opacity:.45}
.wk-ev.mute{opacity:.2}
.wk-foot{padding:13px 16px;border-top:1px solid var(--line);display:flex;gap:18px;align-items:center}
.wk-bars{display:flex;gap:7px;align-items:flex-end;flex:none}
.bcol{display:flex;flex-direction:column;align-items:center;gap:4px}
.bstack{width:22px;display:flex;flex-direction:column-reverse;border-radius:4px;overflow:hidden;gap:1px}
.bstack i{display:block;width:100%}
.bcol em{font-style:normal;font-size:9.5px;color:var(--ink3)}
.wk-insight{font-size:11.5px;color:var(--ink2);line-height:1.8}
.wk-insight b{color:var(--ink)}
.tagline{margin-top:6px}
.dotlegend{display:flex;gap:11px;font-size:10px;color:var(--ink3)}
.dotlegend i{display:inline-block;width:7px;height:7px;border-radius:2px;margin-right:4px}

/* ---------------- 月视图 ---------------- */
.month-wrap{flex:1;overflow:hidden}
.mo-head{display:grid;grid-template-columns:repeat(7,1fr);border-bottom:1px solid var(--line)}
.mo-head div{padding:7px;text-align:center;font-size:10.5px;color:var(--ink3);font-weight:600}
.mo-grid{display:grid;grid-template-columns:repeat(7,1fr)}
.mocell{min-height:96px;border-right:1px solid #F4F4F9;border-bottom:1px solid #F4F4F9;
  padding:5px 6px;cursor:pointer;position:relative;display:flex;flex-direction:column}
.mocell:nth-child(7n){border-right:none}
.mocell:hover{background:#FAFAFE}
.mocell.off{opacity:.38;background:#FBFBFD}
.mocell.today{background:var(--w3)}
.mocell .dnum{font-size:12px;font-weight:700}
.mocell.today .dnum{color:#fff;background:var(--w1);width:20px;height:20px;border-radius:50%;
  display:inline-grid;place-items:center;font-size:10.5px}
.mocell .ln{font-size:8.5px;color:var(--ink3);margin-top:1px;min-height:11px}
.mocell .ln.hol{color:#C0443E;font-weight:600}
.mocell.fest .dnum{color:#C0443E}
.mtlist{margin-top:3px;display:flex;flex-direction:column;gap:2px;overflow:hidden}
.mt{font-size:9.5px;border-radius:4px;padding:1px 5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;border-left:2.5px solid;cursor:pointer}
.mt.w{background:var(--w3);border-color:var(--w1);color:var(--w4)}
.mt.l{background:var(--l3);border-color:var(--l1);color:var(--l4)}
.mt.s{background:var(--s3);border-color:var(--s1);color:var(--s4)}
.mt.done{opacity:.45;text-decoration:line-through}
.mtmore{font-size:9px;color:var(--w2);padding:0 5px;cursor:pointer;font-weight:600}
.mo-prog{position:absolute;bottom:0;left:0;right:0;height:3px;background:#F0F0F6}
.mo-prog i{display:block;height:100%}
.mocat{display:flex;align-items:center;gap:8px;font-size:11px;color:var(--ink2)}
.mocat span{flex:none}
.mocat .bar{flex:1;height:6px;border-radius:4px;background:#F0F0F6;overflow:hidden}
.mocat .bar i{display:block;height:100%;border-radius:4px}
.mocat b{font-size:10.5px;min-width:30px;text-align:right}
.todo-item{padding:6px 4px;border-radius:8px;cursor:pointer;font-size:11.5px}
.todo-item:hover{background:#F7F7FC}
.todo-item .tx{display:flex;align-items:center;gap:6px}
.todo-item small{color:var(--ink3);font-size:9.5px;margin-left:auto;flex:none}
.dotside{width:7px;height:7px;border-radius:2px;flex:none}

/* ---------------- 年视图 ---------------- */
#view-year{display:block}
.yr-sum{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:13px}
.ycard{padding:12px 14px}
.ystat em{font-style:normal;font-size:10.5px;color:var(--ink3);display:block;margin-bottom:5px}
.ystat b{font-size:19px}
.ystat b small{font-size:11px;color:var(--ink3);font-weight:400}
.yr-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.ycard h6{font-size:12px;margin-bottom:8px}
.ycard h6 small{color:var(--ink3);font-weight:400;font-size:9.5px;margin-left:5px}
.ygrid{display:grid;grid-template-columns:repeat(7,1fr);gap:3px}
.yc{aspect-ratio:1;border-radius:4px;background:#F3F3F9;font-size:8px;color:#fff;
  display:grid;place-items:center;cursor:pointer}
.yc.off{background:transparent;cursor:default}
.yc.today{outline:2px solid var(--w1);font-weight:700}
.yfestrow{display:flex;gap:9px;flex-wrap:wrap}
.yfest{background:#FFFCF3;border:1px solid #F2DCAE;border-radius:9px;padding:6px 11px;font-size:10.5px}
.yfest b{color:#9A7238;margin-right:6px}
.yfest span{color:var(--ink2)}

/* ---------------- 待办视图 ---------------- */
.todo-main{flex:1;padding:16px 18px;min-width:0}
.todo-main h3{font-size:15.5px}
.tsub{font-size:11px;color:var(--ink3);margin:4px 0 15px}
.tgroup{margin-bottom:17px}
.tgroup-hd{display:flex;align-items:center;gap:8px;margin-bottom:8px}
.tgroup-hd b{font-size:13px}
.cnt{font-size:9.5px;background:#F0F0F6;color:var(--ink2);border-radius:8px;padding:1px 8px;font-weight:700}
.cnt.alert{background:#FBEAEA;color:var(--danger)}
.tgroup-hd .line{flex:1;border-top:1px solid var(--line)}
.acts .minibtn{margin-left:6px}
.biglist{display:flex;flex-direction:column;gap:1px}
.minibtn{font-size:10.5px;color:var(--w2);background:var(--w3);border-radius:7px;padding:4px 10px;font-weight:600}
.minibtn:hover{background:#E1DFFC}
.minibtn.danger{color:var(--danger);background:#FBEAEA}
.minibtn.danger:hover{background:#F6DBDB}

/* ---------------- 拥有物 ---------------- */
#view-items .items-main{flex:1;min-width:0}
.alertbar{display:flex;align-items:center;gap:12px;background:linear-gradient(120deg,#FFF6E5,#FFEFD8);
  border:1px solid #F0D9A8;border-radius:13px;padding:12px 15px;margin-bottom:13px}
.ab-ic{font-size:22px}
.abv{font-size:14px;font-weight:800;color:#854F0B}
.alertbar p{font-size:11px;color:#9A7238;margin-top:2px}
.items-toolbar{display:flex;align-items:center;gap:8px;margin-bottom:13px}
.segsm{display:flex;gap:2px;background:#EFEFF6;border-radius:10px;padding:3px;flex-wrap:wrap}
.segsm b{padding:5px 11px;border-radius:8px;font-size:11.5px;color:var(--ink2);cursor:pointer;font-weight:600}
.segsm b.on{background:#fff;color:var(--ink);box-shadow:0 1px 4px rgba(28,27,46,.1)}
.sp{flex:1}
.ast-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(215px,1fr));gap:12px}
.ast{background:#fff;border:1px solid var(--line);border-radius:13px;overflow:hidden;cursor:pointer;
  transition:.15s;box-shadow:var(--shadow)}
.ast:hover{transform:translateY(-2px);box-shadow:0 6px 18px rgba(28,27,46,.1)}
.ast.idle{border-color:#E8C06A}
.ast.done{opacity:.75}
.ast.letgo{opacity:.55;filter:grayscale(.4)}
.ast-cv{height:74px;display:grid;place-items:center;font-size:30px;position:relative}
.ast-cv.w{background:linear-gradient(140deg,var(--w3),#fff)}
.ast-cv.l{background:linear-gradient(140deg,var(--l3),#fff)}
.ast-cv.s{background:linear-gradient(140deg,var(--s3),#fff)}
.pin{position:absolute;top:6px;left:6px;font-size:8.5px;background:#FFF3D6;color:#854F0B;
  border:1px solid #EFD9A8;border-radius:6px;padding:1px 7px;font-weight:700}
.ast-bd{padding:10px 12px 11px}
.ast-bd>b{font-size:12.5px;display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ast-sub{font-size:10px;color:var(--ink3);margin:4px 0 8px;display:flex;align-items:center;gap:5px}
.ast-sub .cat{width:7px;height:7px;border-radius:2px;display:inline-block}
.ast-pg{height:4.5px;border-radius:3px;background:#F0F0F6;overflow:hidden}
.ast-pg i{display:block;height:100%;border-radius:3px}
.ast-ft{display:flex;justify-content:space-between;align-items:center;margin-top:8px}
.lu{font-size:10px;color:var(--ink3)}
.lu.warn{color:#B7791F;font-weight:600}
.mini{width:22px;height:22px;border-radius:7px;display:grid;place-items:center;cursor:pointer;border:1px solid var(--line);color:var(--ink2)}
.mini.pri{background:var(--w1);border-color:var(--w1);color:#fff}
.stbox{font-size:9px;border-radius:6px;padding:2px 7px;font-weight:700;white-space:nowrap}
.stbox.fresh{background:#F0F0F6;color:var(--ink2)}
.stbox.active{background:var(--s3);color:var(--s2)}
.stbox.done{background:var(--w3);color:var(--w2)}
.stbox.letgo{background:#EFEFEF;color:#888}
.stbox.idle{background:#FFF3D6;color:#854F0B}
.ast-cv .stbox{position:absolute;top:6px;right:6px}
.ast-list{display:flex;flex-direction:column;gap:6px}
.astrow{display:flex;align-items:center;gap:11px;background:#fff;border:1px solid var(--line);
  border-radius:11px;padding:9px 13px;cursor:pointer}
.astrow.idle{border-color:#E8C06A}
.astrow:hover{border-color:#CFCFE0}
.ar-ic{width:34px;height:34px;border-radius:9px;display:grid;place-items:center;font-size:16px;flex:none}
.ar-ic.w{background:var(--w3)} .ar-ic.l{background:var(--l3)} .ar-ic.s{background:var(--s3)}
.ar-name{flex:1;min-width:0}
.ar-name b{display:block;font-size:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ar-name small{font-size:9.5px;color:var(--ink3)}
.ar-lu{font-size:10px;color:var(--ink3);min-width:52px;text-align:right}

/* ---------------- 统计 ---------------- */
#view-stats{display:block}
.stat-ranges{display:flex;gap:6px;margin-bottom:13px}
.ropt{padding:6px 13px;border-radius:9px;font-size:11.5px;color:var(--ink2);border:1px solid var(--line);background:#fff;font-weight:600}
.ropt.on{background:var(--w1);border-color:var(--w1);color:#fff}
.ropt:disabled{cursor:not-allowed}
.stat-cards{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:13px}
.statc{padding:14px 16px}
.statc em{font-style:normal;font-size:11px;color:var(--ink3);display:block;margin-bottom:6px}
.statc em span{font-size:9px;margin-left:4px;opacity:.8}
.statc b{font-size:23px}
.statc b small{font-size:11px;color:var(--ink3);font-weight:400;margin-left:3px}
.statc p{font-size:10px;color:var(--ink3);margin-top:5px}
.stat-mid{display:grid;grid-template-columns:1.4fr 1fr;gap:12px}
.sbars{display:flex;gap:5px;align-items:flex-end;height:110px;margin-top:10px}
.sbcol{flex:1;display:flex;flex-direction:column;align-items:center;gap:4px;cursor:pointer;height:100%;justify-content:flex-end}
.sbstack{width:100%;max-width:30px;display:flex;flex-direction:column-reverse;border-radius:4px 4px 0 0;overflow:hidden}
.sbstack i{display:block;width:100%}
.sbcol em{font-style:normal;font-size:8.5px;color:var(--ink3);white-space:nowrap}
.donutrow{display:flex;align-items:center;gap:14px}
.donut{width:74px;height:74px;border-radius:50%;display:grid;place-items:center;flex:none}
.donut b{background:#fff;width:52px;height:52px;border-radius:50%;display:grid;place-items:center;font-size:12px}
.legend{flex:1;display:flex;flex-direction:column;gap:5px}
.legend div{display:flex;align-items:center;gap:6px;font-size:11px;color:var(--ink2)}
.legend i{width:8px;height:8px;border-radius:2px}
.legend b{margin-left:auto;font-size:11px}
.item-stat-row{display:flex;gap:11px}
.isr{flex:1;background:#FAFAFD;border:1px solid var(--line);border-radius:11px;padding:11px 13px}
.isr em{font-style:normal;font-size:10px;color:var(--ink3);display:block;margin-bottom:4px}
.isr b{font-size:17px}
.isr b small{font-size:10px;font-weight:400;color:var(--ink3)}
.isr span{font-size:9.5px;color:var(--ink3);display:block;margin-top:3px}
.isr.warn{background:#FFFBEF;border-color:#EFD9A8}
.isr.warn b{color:#854F0B}

/* ---------------- 我的页面 ---------------- */
#view-me{display:block}
.me-wrap{max-width:620px;margin:0 auto}
.me-col{display:flex;flex-direction:column;gap:13px}
.me-acc{display:flex;align-items:center;gap:13px;padding:17px 18px}
.me-av{width:48px;height:48px;border-radius:50%;background:linear-gradient(135deg,var(--w1),var(--s1));
  color:#fff;font-size:19px;font-weight:800;display:grid;place-items:center;flex:none}
.me-av.guest{background:#C9C7DD}
.me-acc b{font-size:15px;display:block}
.me-acc span{font-size:11px;color:var(--ink3);display:block;margin-top:3px}
.me-acc .btn{margin-left:auto}
.me-acc .btn+.btn{margin-left:7px}
.bstack2{display:flex;gap:9px}
.bstack2 .btn{flex:1}
.bkrow{display:flex;align-items:center;gap:10px;padding:8px 2px;border-bottom:1px dashed #F0F0F6}
.bkrow:last-child{border-bottom:none}
.bkrow span{flex:1}
.bkrow b{font-size:12px;display:block}
.bkrow small{font-size:10px;color:var(--ink3)}
.danger-zone{border-color:#F3C9C9}
.danger-zone h4{color:var(--danger)}

/* ---------------- 登录页 ---------------- */
.authpage{position:fixed;inset:0;z-index:100;display:grid;place-items:center;
  background:linear-gradient(150deg,#F3F1FD 0%,#FDF6F0 50%,#EFF9F4 100%);padding:20px}
.auth-card{width:100%;max-width:380px;background:#fff;border-radius:20px;box-shadow:0 12px 44px rgba(83,74,183,.14);padding:30px 28px}
.auth-brand{text-align:center;margin-bottom:22px}
.auth-brand .logo{width:40px;height:40px;border-radius:12px}
.auth-brand b{display:block;font-size:19px;margin-top:10px}
.auth-brand p{font-size:11.5px;color:var(--ink3);margin-top:4px}
.auth-go{width:100%;padding:10px;font-size:13.5px;margin-top:6px}
.auth-err{color:var(--danger);font-size:11.5px;text-align:center;min-height:17px;margin-top:8px}
.auth-recents{font-size:11px;color:var(--ink3);text-align:center;margin-top:4px}
.auth-recents b{color:var(--w2);cursor:pointer;margin:0 5px;font-weight:600}
.auth-recents b:hover{text-decoration:underline}
.auth-skip{text-align:center;margin-top:14px}
.auth-skip span{font-size:11.5px;color:var(--ink3);cursor:pointer}
.auth-skip span:hover{color:var(--w2)}
.auth-note{font-size:9.5px;color:var(--ink3);text-align:center;margin-top:16px;line-height:1.6}

/* ---------------- 弹层 ---------------- */
.overlay{position:fixed;inset:0;z-index:90;background:rgba(28,27,46,.4);display:grid;place-items:center;padding:18px;
  animation:fadeIn .15s}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
.modal{background:#fff;border-radius:16px;width:100%;max-width:520px;max-height:88vh;display:flex;flex-direction:column;
  box-shadow:0 16px 50px rgba(28,27,46,.22);animation:popIn .16s}
@keyframes popIn{from{transform:translateY(10px);opacity:0}to{transform:none;opacity:1}}
.modal-hd{display:flex;align-items:center;justify-content:space-between;padding:14px 18px;border-bottom:1px solid var(--line)}
.modal-hd h3{font-size:14.5px}
.modal-bd{padding:15px 18px;overflow-y:auto}
.modal-ft{display:flex;gap:8px;padding:12px 18px;border-top:1px solid var(--line);align-items:center}
.fld{margin-bottom:13px}
.fld label{display:block;font-size:11px;font-weight:700;color:var(--ink2);margin-bottom:6px}
.fld .hint{font-weight:400;color:var(--ink3);margin-left:5px;font-size:9.5px}
.inp{border:1.5px solid var(--line);border-radius:9px;padding:7px 11px;outline:none;width:100%;transition:.15s;background:#fff}
.inp:focus{border-color:var(--w1)}
.title-inp{font-size:14px;font-weight:600}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:11px}
.row3{display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:8px}
.seg{display:flex;gap:3px;background:#EFEFF6;border-radius:10px;padding:3px;margin-bottom:13px}
.seg button{flex:1;padding:7px;border-radius:8px;font-size:12.5px;color:var(--ink2);font-weight:600}
.seg button.on{background:#fff;color:var(--ink);box-shadow:0 1px 4px rgba(28,27,46,.12)}
.catpick{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.catcard{border:1.5px solid var(--line);border-radius:11px;padding:9px 10px;text-align:left;transition:.12s}
.catcard .swatch{display:block;width:14px;height:14px;border-radius:4px;margin-bottom:6px}
.catcard b{display:block;font-size:12px}
.catcard span{font-size:9.5px;color:var(--ink3)}
.catcard.work.on{border-color:var(--w1);background:var(--w3)}
.catcard.life.on{border-color:var(--l1);background:var(--l3)}
.catcard.study.on{border-color:var(--s1);background:var(--s3)}
.rgrid{display:flex;gap:6px;flex-wrap:wrap}
.custpanel{background:#FAFAFD;border:1px solid var(--line);border-radius:11px;padding:11px 12px;margin-top:9px;
  display:flex;flex-direction:column;gap:9px}
.cprow{display:flex;align-items:center;gap:8px;font-size:11.5px;color:var(--ink2);flex-wrap:wrap}
.numinp{width:56px;border:1.5px solid var(--line);border-radius:8px;padding:5px 8px;outline:none;text-align:center}
.numinp:focus{border-color:var(--w1)}
.sel{border:1.5px solid var(--line);border-radius:8px;padding:5px 8px;outline:none;background:#fff}
.sel:focus{border-color:var(--w1)}
.wdays{display:flex;gap:4px}
.wd{width:30px;height:30px;border-radius:8px;border:1.5px solid var(--line);font-size:11px;color:var(--ink2)}
.wd.on{background:var(--w1);border-color:var(--w1);color:#fff;font-weight:700}
.holchips{display:flex;gap:5px;flex-wrap:wrap}
.hchip{border:1.5px solid #F2DCAE;background:#FFFCF3;color:#9A7238;border-radius:8px;padding:4px 9px;font-size:10.5px}
.hchip.on{background:#9A7238;color:#fff;border-color:#9A7238}
.switch{width:32px;height:18px;border-radius:999px;background:#D9D9E6;position:relative;cursor:pointer;transition:.15s;flex:none}
.switch i{position:absolute;top:2px;left:2px;width:14px;height:14px;border-radius:50%;background:#fff;transition:.15s}
.switch.on{background:var(--w1)}
.switch.on i{left:16px}
.scope{background:#F4F3FD;border:1px solid #DFDCF7;border-radius:11px;padding:11px 12px;margin-top:4px}
.scope .sl{font-size:11px;color:var(--w2);font-weight:700;margin-bottom:9px}
.srow{display:flex;gap:8px}
.sopt{flex:1;border:1.5px solid var(--line);border-radius:10px;padding:8px 10px;text-align:left;background:#fff}
.sopt b{display:block;font-size:11.5px}
.sopt span{font-size:9.5px;color:var(--ink3);display:block;margin-top:2px;line-height:1.5}
.sopt.on{border-color:var(--w1);background:var(--w3)}
.preview{background:#F4FBF7;border:1px solid #CDEBDC;border-radius:11px;padding:11px 13px;margin-top:4px}
.preview .pl{font-size:10px;font-weight:700;color:var(--s2);margin-bottom:7px}
.preview .plist{display:flex;gap:5px;flex-wrap:wrap}
.preview .pd{font-size:10.5px;background:#fff;border-radius:6px;padding:3px 8px;color:var(--s4);font-weight:600;border:1px solid #CDEBDC}
.preview .pn{font-size:9.5px;color:var(--ink3);margin-top:8px}

/* 抽屉 */
.drawer{background:#fff;width:100%;max-width:400px;height:100%;display:flex;flex-direction:column;
  box-shadow:-10px 0 40px rgba(28,27,46,.18);animation:slideIn .18s}
@keyframes slideIn{from{transform:translateX(40px);opacity:0}to{transform:none;opacity:1}}
.drawer-hd{display:flex;align-items:center;gap:8px;padding:14px 16px;border-bottom:1px solid var(--line)}
.drawer-bd{flex:1;overflow-y:auto;padding:15px 16px}
.drawer-ft{display:flex;gap:8px;padding:12px 16px;border-top:1px solid var(--line)}
.tline{display:flex;flex-direction:column}
.tline .tlnode{border-left:2px solid var(--w1);padding:0 0 12px 11px;position:relative}
.tline .tlnode::before{content:"";position:absolute;left:-5px;top:3px;width:8px;height:8px;border-radius:50%;background:var(--w1)}
.tline .tlnode.dim{border-color:#D9D9E6}
.tline .tlnode.dim::before{background:#D9D9E6}
.tlnode b{font-size:11.5px;display:block}
.tlnode span{font-size:10px;color:var(--ink3)}

/* ---------------- Toast ---------------- */
.toasts{position:fixed;bottom:22px;left:50%;transform:translateX(-50%);z-index:200;display:flex;flex-direction:column;gap:8px;align-items:center}
.toast{display:flex;align-items:center;gap:9px;background:#26253B;color:#fff;font-size:12px;
  border-radius:11px;padding:9px 15px;box-shadow:0 8px 26px rgba(28,27,46,.3);animation:popIn .18s;max-width:86vw}
.toast .em{width:7px;height:7px;border-radius:50%;flex:none}
.toast .act{color:#B9B3FF;font-weight:700;cursor:pointer;margin-left:5px;white-space:nowrap}
.toast.out{opacity:0;transform:translateY(8px);transition:.2s}

/* ---------------- 移动端底部导航 / FAB ---------------- */
.mtabs{display:none}
.fab{display:none}

/* ==========================================================
   移动端自适应（≤860px）
   ========================================================== */
@media (max-width:860px){
  body{font-size:13px}
  #app{padding:12px 12px 92px}
  .topbar{padding:8px 12px;gap:8px;flex-wrap:wrap}
  .brand b{display:none}
  .vtabs{display:none}
  .nav-date{order:2;flex:1;justify-content:center}
  .nav-date .cur{min-width:0}
  .filters{display:none}
  .tb-right{margin-left:auto}
  .tb-right .iconbtn{display:none}
  .tb-right .btn.p{display:none}
  /* 单列布局，侧栏全部收进主列下方 */
  .view{flex-direction:column}
  .dcol{width:100%;order:3}
  #view-day .day-left,#view-day .day-right{display:none}
  .tl-scroll{height:auto;max-height:none;min-height:0;overflow:visible}
  .week-wrap{overflow-x:auto}
  .wk-head{min-width:640px}
  .wk-body{min-width:640px;max-height:none}
  .wk-foot{flex-direction:column;align-items:flex-start;gap:10px;min-width:640px}
  .mocell{min-height:64px;padding:3px 4px}
  .mtlist .mt:nth-child(n+2){display:none}
  .month-side{width:100%}
  .yr-sum{grid-template-columns:repeat(2,1fr)}
  .yr-grid{grid-template-columns:repeat(2,1fr)}
  .stat-cards{grid-template-columns:repeat(2,1fr)}
  .stat-mid{grid-template-columns:1fr}
  .item-stat-row{flex-direction:column}
  .ast-grid{grid-template-columns:repeat(auto-fill,minmax(160px,1fr))}
  .row2,.row3{grid-template-columns:1fr}
  .catpick{grid-template-columns:1fr}
  .modal{max-width:100%;max-height:92vh}
  .drawer{max-width:100%}
  .me-acc{flex-wrap:wrap}
  .me-acc .btn{margin-left:0}
  /* 底部五页签 */
  .mtabs{display:flex;position:fixed;bottom:0;left:0;right:0;z-index:60;background:rgba(255,255,255,.96);
    backdrop-filter:blur(10px);border-top:1px solid var(--line);padding:5px 4px calc(5px + env(safe-area-inset-bottom))}
  .mtabs button{flex:1;display:flex;flex-direction:column;align-items:center;gap:2px;
    font-size:9.5px;color:var(--ink3);padding:4px 0;border-radius:9px}
  .mtabs button .ic{width:18px;height:18px}
  .mtabs button.on{color:var(--w2);font-weight:700}
  .fab{display:grid;place-items:center;position:fixed;right:16px;bottom:74px;z-index:60;width:48px;height:48px;
    border-radius:50%;background:var(--w1);color:#fff;box-shadow:0 6px 20px rgba(83,74,183,.4)}
  .toasts{bottom:130px}
}

/* 窄屏下的月/年/周/待办/拥有/统计仍走各自视图（页签只有五个入口） */
@media (max-width:860px){
  #view-week,#view-month,#view-year,#view-todo,#view-items,#view-stats,#view-me{display:block}
}
