/* DailyCard · 界面样式
   风格：拟物（Skeuomorphism）· 真实度 classic · 主题色 橄榄绿 #5F7A43
   规则来源：每个可见表面都有材质身份（渐变 + 顶部高光 + 投影）；
   凹陷元素用内阴影 + 底部微高光；光源统一从上方来。
   背景按要求使用纯色渐变，不使用任何网格 / 点阵图案。 */

:root{
  /* —— 主题色：橄榄绿 —— */
  --theme-color:#5F7A43;
  --acc:#5F7A43;
  --acc-lt:#729053;
  --acc-dk:#475E32;
  --acc-wash:#E4E9D8;
  --acc-mid:#C3CDB2;

  /* —— 中性材质（暖色，带亚光感） —— */
  --bg-1:#F7F3EE;
  --bg-2:#EFE9E1;
  --mat-1:#FFFDFA;
  --mat-2:#FBF7F2;
  --mat-3:#EFE8DE;
  --well-1:#E9DFD2;
  --well-2:#F5F0E8;
  --edge:#D5C8B7;
  --edge-dk:#C4B5A1;

  /* —— 文字 —— */
  --ink:#2C2019;
  --ink-2:#8C7E6F;
  --ink-3:#A6977F;

  /* —— 光与影（真实度 classic：两层投影） —— */
  --hl:rgba(255,255,255,.92);
  --hl-soft:rgba(255,255,255,.55);
  --inner:rgba(80,50,30,.26);
  --shadow-raised:inset 0 1px 0 var(--hl), 0 2px 4px rgba(70,45,25,.12), 0 10px 18px rgba(70,45,25,.10);
  --shadow-soft:inset 0 1px 0 var(--hl), 0 1px 3px rgba(70,45,25,.14);
  --shadow-deep:inset 0 1px 0 var(--hl), 0 4px 8px rgba(70,45,25,.16), 0 18px 34px rgba(70,45,25,.16);
  --shadow-recessed:inset 0 2px 3px var(--inner), 0 1px 0 var(--hl);
  --glow:0 0 0 3px rgba(95,122,67,.32), 0 0 10px rgba(95,122,67,.28);

  /* —— 尺度 —— */
  --unit:8px;
  --r-sm:6px;
  --r:10px;
  --r-lg:14px;
  --serif:Georgia,'Times New Roman','Songti SC','SimSun','Noto Serif SC',serif;
  --sans:system-ui,-apple-system,'PingFang SC','Microsoft YaHei','Noto Sans SC',sans-serif;

  color:var(--ink);
  font-family:var(--sans);
  font-size:14px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  -webkit-text-size-adjust:100%;
}

*{box-sizing:border-box}
html,body{margin:0;padding:0;height:100%;overflow:hidden}
body{
  background:var(--bg-1);
  background-image:linear-gradient(180deg,#F8F4EF 0%,#F1EBE3 58%,#EBE4DA 100%);
}
h1,h2,h3,p{margin:0}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font-family:inherit}

/* ---------------------------------------------------------------- 应用外壳 */

.app{max-width:1180px;margin:0 auto;height:100vh;height:100dvh;display:flex;flex-direction:column}

.bar{
  flex:0 0 auto;z-index:20;position:relative;
  display:flex;align-items:center;gap:16px;flex-wrap:wrap;
  padding:10px 18px;
  background:linear-gradient(180deg,#FFFDFA 0%,#F6F0E8 62%,#EEE6DB 100%);
  border-bottom:1px solid var(--edge);
  box-shadow:inset 0 1px 0 var(--hl), 0 2px 5px rgba(70,45,25,.13);
}
.brand{display:flex;align-items:center;gap:8px;font-family:var(--serif);font-size:16px;font-weight:600;text-shadow:0 1px 0 var(--hl)}
.mark{
  width:26px;height:26px;display:grid;place-items:center;border-radius:8px;flex:0 0 auto;
  font-family:var(--serif);font-size:13px;color:#FFF9F3;
  background:linear-gradient(180deg,var(--acc-lt) 0%,var(--acc) 52%,var(--acc-dk) 100%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.55), 0 1px 3px rgba(40,60,30,.45);
  text-shadow:0 -1px 0 rgba(0,0,0,.18);
}
.nav{display:flex;gap:4px;flex-wrap:wrap}
.nav a{
  padding:7px 13px;border-radius:9px;font-size:13.5px;color:var(--ink-2);
  transition:color .25s ease-out, background-color .25s ease-out, box-shadow .25s ease-out;
}
.nav a:hover{color:var(--ink);background:linear-gradient(180deg,var(--mat-1),var(--mat-3));box-shadow:var(--shadow-soft)}
#nav a.is-on{
  color:var(--acc-dk);font-weight:500;
  background:linear-gradient(180deg,var(--mat-1),#F0E9DE);
  box-shadow:inset 0 1px 0 var(--hl), 0 1px 3px rgba(70,45,25,.2);
}
.userbox{display:flex;align-items:center;gap:8px;margin-left:auto;font-size:12px;color:var(--ink-2);flex-wrap:wrap}
.userbox .ver{opacity:.75;font-variant-numeric:tabular-nums}
.status{font-size:12px;color:var(--ink-2);white-space:nowrap}

#view{flex:1 1 auto;overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain}
.view{padding:22px 18px 32px}

/* ---------------------------------------------------------------- 通用块 */

.card{
  background:linear-gradient(180deg,var(--mat-1) 0%,var(--mat-2) 48%,var(--mat-3) 100%);
  border:1px solid var(--edge);border-radius:var(--r);
  padding:16px 18px;margin-bottom:16px;position:relative;
  box-shadow:var(--shadow-raised);
}
.card::after{
  content:'';position:absolute;left:0;right:0;top:0;height:32%;border-radius:var(--r) var(--r) 0 0;
  background:linear-gradient(180deg,rgba(255,255,255,.5),rgba(255,255,255,0));pointer-events:none;
}
.card-head{display:flex;align-items:baseline;gap:10px;margin-bottom:12px;flex-wrap:wrap}
.card-head h2{font-family:var(--serif);font-size:15px;font-weight:600;letter-spacing:.01em;text-shadow:0 1px 0 var(--hl)}
.card-head h3{font-family:var(--serif);font-size:15px;font-weight:600;text-shadow:0 1px 0 var(--hl)}
.card-head .sub{margin-left:auto;font-size:11.5px;color:var(--ink-2)}
.hint{font-size:11.5px;color:var(--ink-2)}
.empty{padding:24px 0;text-align:center;font-size:13px;color:var(--ink-2)}
.row{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.grow{flex:1 1 200px}

/* 按钮：凸起的胶囊，带顶部高光与投影 */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:6px;
  padding:8px 15px;border-radius:9px;cursor:pointer;position:relative;
  border:1px solid var(--edge-dk);color:#5A4A39;font-size:13px;line-height:1.35;
  background:linear-gradient(180deg,#FFFCF8 0%,#F3EBDF 55%,#E9DFD0 100%);
  box-shadow:inset 0 1px 0 var(--hl), 0 1px 3px rgba(70,45,25,.2);
  transition:box-shadow .2s ease-out, background-color .2s ease-out, transform .1s ease-out;
}
.btn:hover{box-shadow:inset 0 1px 0 var(--hl), 0 2px 6px rgba(70,45,25,.26)}
.btn:active{transform:translateY(1px);box-shadow:inset 0 2px 4px rgba(80,50,30,.3)}
.btn-primary{
  color:#FFF9F3;border-color:var(--acc-dk);text-shadow:0 -1px 0 rgba(0,0,0,.16);
  background:linear-gradient(180deg,var(--acc-lt) 0%,var(--acc) 55%,var(--acc-dk) 100%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.45), 0 2px 4px rgba(40,60,30,.4);
}
.btn-primary:hover{box-shadow:inset 0 1px 0 rgba(255,255,255,.6), 0 3px 8px rgba(40,60,30,.45)}
.btn-ghost{
  border-color:transparent;background:transparent;color:var(--ink-2);box-shadow:none;
}
.btn-ghost:hover{color:var(--ink);background:linear-gradient(180deg,var(--mat-1),var(--mat-3));box-shadow:var(--shadow-soft)}
.btn-sm{padding:5px 11px;font-size:12px;border-radius:8px}
.btn-danger{border-color:#B98C7C;color:#8C3B2A;background:linear-gradient(180deg,#FFFBF8,#F3E6DF)}
.btn-danger:hover{box-shadow:inset 0 1px 0 var(--hl), 0 2px 6px rgba(140,60,40,.3)}
.btn[disabled]{opacity:.42;cursor:default;box-shadow:none}

/* 输入：凹陷的槽 */
input[type="text"],input[type="email"],input[type="password"],input[type="date"],
input[type="search"],select,textarea{
  font-size:13.5px;color:var(--ink);padding:8px 10px;border-radius:8px;min-width:0;
  border:1px solid var(--edge-dk);
  background:linear-gradient(180deg,var(--well-1) 0%,var(--well-2) 100%);
  box-shadow:inset 0 2px 3px var(--inner), 0 1px 0 var(--hl);
  transition:box-shadow .2s ease-out;
}
input::placeholder,textarea::placeholder{color:var(--ink-3)}
input:focus,select:focus,textarea:focus{outline:none;box-shadow:inset 0 2px 3px var(--inner), var(--glow)}
textarea{resize:vertical;line-height:1.6}

/* 分段控件：凹槽里的一块凸起 */
.seg{
  display:inline-flex;border-radius:9px;overflow:hidden;padding:3px;
  border:1px solid var(--edge-dk);
  background:linear-gradient(180deg,var(--well-1),var(--well-2));
  box-shadow:inset 0 2px 3px var(--inner), 0 1px 0 var(--hl);
}
.seg button{
  appearance:none;border:0;background:transparent;color:var(--ink-2);cursor:pointer;
  font-size:12.5px;padding:6px 13px;border-radius:7px;
  transition:background-color .25s ease-in-out, color .25s ease-in-out, box-shadow .25s ease-in-out;
}
.seg button.is-on{
  color:var(--acc-dk);font-weight:500;
  background:linear-gradient(180deg,var(--mat-1),#F1E9DE);
  box-shadow:inset 0 1px 0 var(--hl), 0 1px 3px rgba(70,45,25,.24);
}

/* ---------------------------------------------------------------- 表格 */

table.t{width:100%;border-collapse:collapse;font-size:13px}
table.t th{
  font-weight:400;font-size:11.5px;color:var(--ink-2);text-align:left;
  padding:0 0 6px;border-bottom:1px solid var(--edge);white-space:nowrap;
}
table.t td{padding:6px 0;border-bottom:1px dashed var(--edge);vertical-align:top}
table.t tr:last-child td{border-bottom:0}
.num{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.muted{color:var(--ink-2)}

/* ---------------------------------------------------------------- 今日 */

.day-head{display:flex;align-items:flex-end;gap:14px;flex-wrap:wrap;margin-bottom:16px}
.day-date{font-family:var(--serif);font-size:30px;font-weight:600;line-height:1.15;text-shadow:0 1px 0 var(--hl)}
.day-week{font-size:13px;color:var(--ink-2)}
.day-stat{margin-left:auto;font-size:12.5px;color:var(--ink-2);text-align:right}

.moodrow{display:flex;align-items:center;gap:12px;padding:6px 0;cursor:pointer}
.mooddot{
  width:44px;height:44px;border-radius:50%;flex:0 0 auto;
  border:1px solid var(--edge-dk);background:linear-gradient(180deg,#FFFDFA,#F2EBE1);
  box-shadow:inset 0 2px 3px var(--inner), 0 1px 0 var(--hl);
}
.mooddot.has{
  border-color:rgba(0,0,0,.12);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.5), 0 1px 3px rgba(70,45,25,.3);
}
.moodlabel{font-size:14px}
.moodhint{margin-left:auto;font-size:12px;color:var(--ink-2)}

.moodpick{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px}
.moodpick .mp{
  border-radius:var(--r);padding:10px 8px;display:flex;flex-direction:column;align-items:center;gap:8px;
  border:1px solid var(--edge);
  background:linear-gradient(180deg,var(--mat-1),var(--mat-3));
  box-shadow:var(--shadow-soft);
}
.moodpick .mp.is-current{
  border-color:var(--acc-mid);
  box-shadow:inset 0 1px 0 var(--hl), 0 1px 3px rgba(70,45,25,.2), 0 0 0 2px rgba(95,122,67,.22);
}
.moodpick .mp-name{font-size:12.5px}
.shades{display:flex;gap:5px}
.shade{
  width:28px;height:28px;border-radius:50%;cursor:pointer;padding:0;
  border:1px solid rgba(0,0,0,.14);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.5), 0 1px 2px rgba(70,45,25,.22);
}
.shade.is-on{box-shadow:inset 0 1px 0 rgba(255,255,255,.6), 0 0 0 3px rgba(95,122,67,.35)}

/* 今日待办行 */
.taskline{display:flex;align-items:flex-start;gap:10px;padding:8px 0;border-bottom:1px dashed var(--edge)}
.taskline:last-child{border-bottom:0}
.check{
  width:22px;height:22px;border-radius:6px;flex:0 0 auto;cursor:pointer;padding:0;
  border:1px solid var(--edge-dk);color:transparent;font-size:12px;line-height:1;
  display:grid;place-items:center;margin-top:2px;
  position:relative;
  background:linear-gradient(180deg,var(--well-1),var(--well-2));
  box-shadow:inset 0 2px 3px var(--inner), 0 1px 0 var(--hl);
  transition:box-shadow .15s ease-out;
}
/* 扩大点击范围，但不与相邻行重叠 */
.check::after{content:'';position:absolute;inset:-8px;border-radius:10px}
.check.is-done{
  color:#FFF9F3;border-color:var(--acc-dk);
  background:linear-gradient(180deg,var(--acc-lt),var(--acc) 60%,var(--acc-dk));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.45), 0 1px 3px rgba(40,60,30,.4);
  text-shadow:0 -1px 0 rgba(0,0,0,.16);
}
.taskline.done .title{color:var(--ink-2);text-decoration:line-through}
.title{font-size:13.5px}
.meta{font-size:11.5px;color:var(--ink-2)}
.overdue{color:#A9523D}

/* ---------------------------------------------------------------- 任务板 */

.board{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:14px;align-items:start}
.boardcard{
  display:flex;flex-direction:column;gap:8px;min-height:190px;padding:16px;
  border:1px solid var(--edge);border-radius:var(--r);position:relative;
  background:linear-gradient(180deg,var(--mat-1) 0%,var(--mat-2) 48%,var(--mat-3) 100%);
  box-shadow:var(--shadow-raised);
}
.boardcard.over{border-color:var(--acc-mid);box-shadow:var(--shadow-raised), 0 0 0 2px rgba(95,122,67,.25)}
.boardcard > .card-head{margin-bottom:2px}
.boardlist{display:flex;flex-direction:column;gap:6px}
.boardlist:not(.open) > .tcard:nth-child(n+4){display:none}
.boardcard .more{align-self:flex-start;padding:3px 8px}
.boardcard .empty{padding:10px 0;font-size:12px}
.goalcard-head{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.goalcard-head h3{font-family:var(--serif);font-size:15px;font-weight:600;text-shadow:0 1px 0 var(--hl)}
.goalcard-head .sub{margin-left:auto;font-size:11.5px;color:var(--ink-2)}

/* 进度：凹槽 + 光泽填充 */
.track{
  height:8px;border-radius:99px;position:relative;overflow:hidden;
  background:linear-gradient(180deg,var(--well-1),var(--well-2));
  box-shadow:inset 0 2px 3px var(--inner), 0 1px 0 var(--hl);
}
.track span{
  display:block;height:100%;border-radius:99px;
  background:linear-gradient(180deg,var(--acc-lt),var(--acc) 60%,var(--acc-dk));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.45);
}

.tag{
  font-size:11px;padding:3px 9px;border-radius:99px;color:#6B5B49;white-space:nowrap;
  border:1px solid var(--edge-dk);
  background:linear-gradient(180deg,#F9F3EA,#EADFD0);
  box-shadow:inset 0 1px 0 var(--hl);
}
.tag.done{
  color:var(--acc-dk);border-color:var(--acc-mid);
  background:linear-gradient(180deg,#F3F7EC,var(--acc-wash));
}
.tag.late{color:#8C3B2A;border-color:#D3AC9C;background:linear-gradient(180deg,#FBF0EB,#F0DCD2)}

/* 事项卡片：小凸起面板 */
.tcard{
  display:flex;gap:7px;align-items:flex-start;padding:8px 10px;border-radius:8px;cursor:grab;
  border:1px solid var(--edge);
  background:linear-gradient(180deg,var(--mat-1),#F4EDE3);
  box-shadow:inset 0 1px 0 var(--hl), 0 1px 2px rgba(70,45,25,.14);
  transition:box-shadow .2s ease-out;
}
.tcard:hover{box-shadow:inset 0 1px 0 var(--hl), 0 2px 5px rgba(70,45,25,.2)}
.tcard .check{width:17px;height:17px;border-radius:5px;font-size:10px;margin-top:1px}
.tcard-body{min-width:0;flex:1}
.tcard-title{font-size:12.5px;line-height:1.45;word-break:break-word}
.tcard-goal{font-size:10.5px;color:var(--ink-2);margin-top:2px}
.tcard .mini{
  border:0;background:transparent;color:var(--ink-2);cursor:pointer;
  font-size:13px;line-height:1;padding:3px;flex:0 0 auto;
}
.tcard .mini:hover{color:var(--ink)}
.tcard .mini.danger:hover{color:#A9523D}
.tcard.done{opacity:.55}
.tcard.done .tcard-title{text-decoration:line-through}
.tcard.dragging{opacity:.4}
.tcard.picked{box-shadow:0 0 0 2px rgba(95,122,67,.5), 0 2px 6px rgba(70,45,25,.2)}
.tcard.overdue{border-color:#D3AC9C}

.editrow{
  display:flex;gap:8px;flex-wrap:wrap;align-items:center;padding:10px;border-radius:9px;
  border:1px solid var(--acc-mid);
  background:linear-gradient(180deg,var(--mat-2),var(--mat-3));
  box-shadow:var(--shadow-recessed);
}
.editrow input[name="title"]{flex:1 1 200px}
.editrow input[name="note"]{flex:1 1 200px}

/* ---------------------------------------------------------------- 本周 */

.weekbar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:14px}
.wk-title{font-family:var(--serif);font-size:19px;font-weight:600;text-shadow:0 1px 0 var(--hl)}
.wk-range{font-size:12px;color:var(--ink-2)}
.pickbar{
  display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:12px;padding:9px 13px;
  font-size:12.5px;border-radius:9px;border:1px dashed var(--acc-mid);
  background:linear-gradient(180deg,var(--mat-2),var(--mat-3));
}

.planner{display:grid;grid-template-columns:106px 232px minmax(0,1fr);gap:14px;align-items:start}

/* 任务筛选：一列按钮，同时筛待排期和本周列表 */
.filterrail{display:flex;flex-direction:column;gap:7px;position:sticky;top:12px}
.fbtn{
  display:flex;flex-direction:column;gap:3px;text-align:left;cursor:pointer;
  padding:9px 10px;border-radius:9px;font-size:12px;line-height:1.35;color:#5A4A39;
  border:1px solid var(--edge-dk);word-break:break-word;
  background:linear-gradient(180deg,var(--mat-1),var(--mat-3));
  box-shadow:inset 0 1px 0 var(--hl), 0 1px 3px rgba(70,45,25,.18);
  transition:box-shadow .2s ease-out, color .2s ease-out;
}
.fbtn span{font-size:10px;color:var(--ink-2);font-variant-numeric:tabular-nums}
.fbtn:hover{box-shadow:inset 0 1px 0 var(--hl), 0 2px 6px rgba(70,45,25,.24)}
.fbtn.is-on{
  color:#FFF9F3;border-color:var(--acc-dk);text-shadow:0 -1px 0 rgba(0,0,0,.16);
  background:linear-gradient(180deg,var(--acc-lt),var(--acc) 55%,var(--acc-dk));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.45), 0 2px 5px rgba(40,60,30,.4);
}
.fbtn.is-on span{color:rgba(255,249,243,.82)}
.inbox{
  padding:12px;border-radius:var(--r);min-height:240px;position:sticky;top:12px;
  border:1px solid var(--edge);
  background:linear-gradient(180deg,var(--mat-1),var(--mat-3));
  box-shadow:var(--shadow-raised);
}
.inbox.over{border-color:var(--acc-mid);box-shadow:var(--shadow-raised), 0 0 0 2px rgba(95,122,67,.25)}
.poolpane{
  padding:12px;border-radius:var(--r);min-height:260px;position:sticky;top:12px;
  border:1px solid var(--edge);
  background:linear-gradient(180deg,var(--mat-1),var(--mat-3));
  box-shadow:var(--shadow-raised);
}
.poolpane.over{border-color:var(--acc-mid)}
.inhead{display:flex;align-items:baseline;gap:8px;font-family:var(--serif);font-size:14px;font-weight:600;margin-bottom:10px}
.inhead .n{font-family:var(--sans);font-size:11.5px;font-weight:400;color:var(--ink-2)}
.inhead select{margin-left:auto;font-size:11.5px;padding:4px 6px;max-width:132px}
.inbody{display:flex;flex-direction:column;gap:7px;max-height:62vh;overflow:auto}
.goalpane{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:12px}

.days{display:flex;flex-direction:column;gap:8px}
.daycol{
  display:grid;grid-template-columns:112px minmax(0,1fr);gap:10px;align-items:start;min-height:54px;
  padding:10px 12px;border-radius:var(--r);
  border:1px solid var(--edge);
  background:linear-gradient(180deg,var(--mat-1),var(--mat-3));
  box-shadow:var(--shadow-soft);
  transition:box-shadow .2s ease-out;
}
.daycol.is-today{border-color:var(--acc-mid);box-shadow:var(--shadow-soft), 0 0 0 2px rgba(95,122,67,.2)}
.daycol.over{border-color:var(--acc-mid);box-shadow:var(--shadow-raised)}
.daycol.is-weekend .dname{color:#A9523D}
.dhead{display:flex;align-items:baseline;gap:6px;flex-wrap:wrap;padding-top:2px}
.dname{font-size:12.5px;font-weight:600}
.ddate{font-size:11.5px;color:var(--ink-2);font-variant-numeric:tabular-nums}
.dhead .dot{width:9px;height:9px;border-radius:50%;display:block;flex:0 0 auto;border:1px solid rgba(0,0,0,.12)}
.dbody{display:flex;flex-direction:row;flex-wrap:wrap;gap:6px;align-items:flex-start;min-height:24px}
.dbody .tcard{padding:6px 9px;gap:6px;align-items:center;max-width:100%;cursor:grab}
.dbody .tcard .check{width:16px;height:16px;border-radius:5px;margin:0;font-size:10px}
.dbody .tcard-body{display:flex;align-items:center;min-width:0}
.dbody .tcard-title{font-size:12px;white-space:nowrap}
.dbody .tcard .mini{font-size:12px;padding:2px}

/* ---------------------------------------------------------------- 心情页 */

.cal{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:6px}
.cal .wk{font-size:11px;color:var(--ink-2);text-align:center;padding-bottom:2px}
.cell{
  border-radius:9px;padding:6px;min-height:58px;display:flex;flex-direction:column;gap:5px;cursor:pointer;
  border:1px solid var(--edge);
  background:linear-gradient(180deg,var(--mat-1),var(--mat-3));
  box-shadow:var(--shadow-soft);
}
.cell.pad{border:0;background:transparent;box-shadow:none;cursor:default}
.cell .d{font-size:11px;color:var(--ink-2);font-variant-numeric:tabular-nums}
.cell .sw{
  height:20px;border-radius:5px;
  background:linear-gradient(180deg,var(--well-1),var(--well-2));
  box-shadow:inset 0 2px 3px var(--inner);
}
.cell .mk{font-size:11px;color:var(--ink-2)}
.cell.is-today{border-color:var(--acc-mid);box-shadow:var(--shadow-soft), 0 0 0 2px rgba(95,122,67,.2)}
.legend{display:flex;flex-wrap:wrap;gap:6px 16px;font-size:11.5px;color:var(--ink-2);margin-top:12px}
.legend span{display:inline-flex;align-items:center;gap:5px}
.sq{width:12px;height:12px;border-radius:3px;display:block;flex:0 0 auto;border:1px solid rgba(0,0,0,.1)}

/* ---------------------------------------------------------------- 复盘 · 书架 */

.shelf{display:flex;gap:8px;flex-wrap:wrap;align-items:flex-end}
.spine{
  appearance:none;cursor:pointer;width:58px;height:66px;padding:8px 4px 6px;
  border:1px solid var(--edge-dk);border-left:5px solid var(--acc);border-radius:4px 7px 7px 4px;
  background:linear-gradient(180deg,var(--mat-1),var(--mat-3));color:var(--ink);
  display:flex;flex-direction:column;justify-content:space-between;align-items:center;
  font-family:var(--serif);font-size:13px;line-height:1.1;
  box-shadow:inset 0 1px 0 var(--hl), 0 2px 5px rgba(70,45,25,.22);
}
.spine small{font-family:var(--sans);font-size:9.5px;color:var(--ink-2);letter-spacing:.04em}
.spine.is-on{
  color:#FFF9F3;transform:translateY(-4px);
  background:linear-gradient(180deg,var(--acc-lt),var(--acc) 55%,var(--acc-dk));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.45), 0 4px 10px rgba(40,60,30,.4);
}
.spine.is-on small{color:rgba(255,249,243,.75)}

.readbar{
  display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:9px 14px;
  background:linear-gradient(180deg,var(--mat-1),var(--mat-3));
  border-bottom:1px solid var(--edge);
}
.bar2{
  display:flex;align-items:center;gap:14px;flex-wrap:wrap;padding:12px 14px;
  border:1px solid var(--edge);border-radius:var(--r) var(--r) 0 0;
  background:linear-gradient(180deg,var(--mat-1),var(--mat-3));
  box-shadow:var(--shadow-soft);
}
.goalcard{cursor:pointer}
.goalcard .editrow,.goalcard .boardlist,.goalcard form,.goalcard button{cursor:default}
.goalcard .tcard{cursor:grab}
.readbar .bookname{font-family:var(--serif);font-size:13.5px;font-weight:600}
.readbar .count{font-size:12px;color:var(--ink-2);font-variant-numeric:tabular-nums}
.readbar .pager{margin-left:auto;display:flex;align-items:center;gap:8px}
.iconbtn{
  width:34px;height:34px;display:grid;place-items:center;cursor:pointer;font-size:15px;
  border:1px solid var(--edge-dk);border-radius:9px;color:var(--ink);
  background:linear-gradient(180deg,var(--mat-1),var(--mat-3));
  box-shadow:inset 0 1px 0 var(--hl), 0 1px 3px rgba(70,45,25,.2);
}
.iconbtn:active{box-shadow:inset 0 2px 4px rgba(80,50,30,.3)}
.iconbtn[disabled]{opacity:.4;cursor:default;box-shadow:none}

.stage{
  padding:24px;border-radius:0 0 var(--r) var(--r);
  background:linear-gradient(180deg,#F4EFE8 0%,#EDE6DC 100%);
  border:1px solid var(--edge);border-top:0;
}
.book{
  position:relative;display:grid;grid-template-columns:1fr 1fr;perspective:2200px;
  filter:drop-shadow(0 10px 22px rgba(70,45,25,.22));
}
.book::after{
  content:'';position:absolute;left:50%;top:0;bottom:0;width:34px;transform:translateX(-50%);
  background:linear-gradient(90deg,rgba(80,60,40,0),rgba(80,60,40,.14) 46%,rgba(80,60,40,.14) 54%,rgba(80,60,40,0));
  pointer-events:none;z-index:4;
}
.page{
  position:relative;display:flex;flex-direction:column;gap:12px;min-height:560px;padding:20px;
  background:linear-gradient(180deg,#FFFDFA 0%,#FDFAF4 100%);
  border:1px solid var(--edge);
}
.page.is-left{border-radius:var(--r) 0 0 var(--r)}
.page.is-right{border-radius:0 var(--r) var(--r) 0}
.leaf{
  position:absolute;top:0;left:50%;width:50%;height:100%;z-index:5;
  transform-origin:left center;transform-style:preserve-3d;transform:rotateY(0deg);
  visibility:hidden;pointer-events:none;
}
.leaf.is-armed{visibility:visible}
.leaf.is-moving{transition:transform .62s cubic-bezier(.45,.05,.25,1)}
.face{
  position:absolute;inset:0;backface-visibility:hidden;overflow:hidden;
  display:flex;flex-direction:column;gap:12px;padding:20px;
  background:linear-gradient(180deg,#FFFDFA 0%,#FDFAF4 100%);
  border:1px solid var(--edge);
}
.face.is-front{border-radius:0 var(--r) var(--r) 0}
.face.is-back{transform:rotateY(180deg);border-radius:var(--r) 0 0 var(--r)}

.ph{display:flex;align-items:baseline;gap:10px;padding-bottom:8px;border-bottom:1px solid var(--edge)}
.pt{font-family:var(--serif);font-size:19px;font-weight:600;line-height:1.25;text-shadow:0 1px 0 var(--hl)}
.ptag{margin-left:auto;font-size:11.5px;color:var(--ink-2);white-space:nowrap}
.stats{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.stat{
  padding:9px 11px;border-radius:9px;border:1px solid var(--edge);
  background:linear-gradient(180deg,var(--mat-1),var(--mat-3));
  box-shadow:var(--shadow-soft);
}
.stat .sl{font-size:11px;color:var(--ink-2);white-space:nowrap}
.stat .sv{font-family:var(--serif);font-size:20px;font-weight:600;line-height:1.3;font-variant-numeric:tabular-nums}
.stat .sv small{font-family:var(--sans);font-size:11.5px;font-weight:400;color:var(--ink-2);margin-left:3px}
.h{font-size:11px;color:var(--ink-2);letter-spacing:.06em}
.foot{display:flex;align-items:center;gap:6px;font-size:10.5px;color:var(--ink-2);flex-wrap:wrap}
.lg{margin-left:auto;display:flex;align-items:center;gap:5px}
.pf{
  margin-top:auto;padding-top:8px;border-top:1px solid var(--edge);
  display:flex;justify-content:space-between;font-size:11px;color:var(--ink-2);
}
.chart{width:100%;height:auto;display:block}

/* 记录密度：凹槽 + 填色 */
.months{display:grid;gap:2px;font-size:9.5px;color:var(--ink-2)}
.months span{white-space:nowrap;overflow:hidden;text-align:center}
.heat{display:grid;grid-template-rows:repeat(7,auto);grid-auto-flow:column;gap:2px}
.heat.single{grid-template-rows:auto}
.dcell{height:8px;border-radius:2px;background:var(--well-2);box-shadow:inset 0 1px 2px rgba(80,50,30,.14)}
.dcell[data-l="1"]{background:color-mix(in srgb,var(--acc) 22%,var(--mat-1))}
.dcell[data-l="2"]{background:color-mix(in srgb,var(--acc) 44%,var(--mat-1))}
.dcell[data-l="3"]{background:color-mix(in srgb,var(--acc) 68%,var(--mat-1))}
.dcell[data-l="4"]{background:var(--acc)}
.dcell[data-l="-1"]{background:transparent;box-shadow:none}
.dgap{height:8px}
.sw-sq{width:11px;height:11px;border-radius:3px;display:block;background:var(--well-2);box-shadow:inset 0 1px 2px rgba(80,50,30,.14)}
.sw-sq[data-l="1"]{background:color-mix(in srgb,var(--acc) 22%,var(--mat-1))}
.sw-sq[data-l="2"]{background:color-mix(in srgb,var(--acc) 44%,var(--mat-1))}
.sw-sq[data-l="3"]{background:color-mix(in srgb,var(--acc) 68%,var(--mat-1))}
.sw-sq[data-l="4"]{background:var(--acc)}

.mgrid{display:grid;gap:3px}
.mrow{display:flex;align-items:center;font-size:9.5px;color:var(--ink-2);white-space:nowrap}
.mcell{height:10px;border-radius:2px;background:var(--well-2);box-shadow:inset 0 1px 2px rgba(80,50,30,.12)}
.mcell[data-e="1"]{background:transparent;box-shadow:none}
.mkey{display:flex;flex-wrap:wrap;gap:4px 14px;font-size:10.5px;color:var(--ink-2)}
.mkey>span{display:inline-flex;align-items:center;gap:5px}

.mweek{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:6px}
.md{display:flex;flex-direction:column;align-items:center;gap:4px;min-width:0}
.md .d,.md .n{font-size:10px;color:var(--ink-2);white-space:nowrap;overflow:hidden}
.md .b{
  width:100%;height:16px;border-radius:4px;
  background:linear-gradient(180deg,var(--well-1),var(--well-2));
  box-shadow:inset 0 2px 3px var(--inner);
}

/* ---------------------------------------------------------------- 词云 / 每日一句 */

.cloud{display:flex;flex-wrap:wrap;gap:4px 14px;align-items:baseline;justify-content:center;padding:10px 4px;line-height:1.5}
.cloud span{font-family:var(--serif);white-space:nowrap}
.notes{display:flex;flex-direction:column;gap:6px}
.noteline{display:flex;gap:10px;align-items:baseline;font-size:12.5px}
.noteline .nd{flex:0 0 auto;font-size:11px;color:var(--ink-2);font-variant-numeric:tabular-nums;padding-top:1px}
.noteline .nt{min-width:0;word-break:break-word}

/* ---------------------------------------------------------------- 登录 */

.auth{display:flex;justify-content:center;padding-top:6vh}
.authcard{
  width:100%;max-width:420px;padding:26px 26px 22px;border-radius:var(--r-lg);
  border:1px solid var(--edge);
  background:linear-gradient(180deg,var(--mat-1) 0%,var(--mat-2) 52%,var(--mat-3) 100%);
  box-shadow:var(--shadow-deep);
}
.authbrand{display:flex;align-items:center;gap:9px;font-family:var(--serif);font-size:20px;font-weight:600;text-shadow:0 1px 0 var(--hl)}
.authform{display:flex;flex-direction:column;gap:12px}
.fld{display:flex;flex-direction:column;gap:5px;font-size:12.5px;color:var(--ink-2)}
.fld input{width:100%;font-size:15px;padding:10px 12px}
.autherr{
  margin-top:8px;font-size:12.5px;color:#8C3B2A;padding:8px 11px;border-radius:9px;
  border:1px solid #D3AC9C;background:linear-gradient(180deg,#FBF1EC,#F2DED4);
  box-shadow:inset 0 1px 0 var(--hl);
}
.reccode{
  font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  font-size:22px;letter-spacing:.14em;text-align:center;padding:18px 10px;border-radius:var(--r);
  word-break:break-all;user-select:all;
  border:1px dashed var(--acc-mid);
  background:linear-gradient(180deg,var(--well-1),var(--well-2));
  box-shadow:var(--shadow-recessed);
}

/* ---------------------------------------------------------------- 提示 */

.toast{
  position:fixed;left:50%;bottom:28px;transform:translateX(-50%);z-index:60;
  padding:11px 18px;border-radius:11px;font-size:13px;color:#FFF9F3;
  background:linear-gradient(180deg,#3A2E22,#2C2019);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.18), 0 6px 18px rgba(40,25,15,.4);
}
.toast.err{background:linear-gradient(180deg,#9C4A38,#7E3826)}

/* ---------------------------------------------------------------- 窄屏 */

@media (max-width:820px){
  .view{padding:12px 12px calc(84px + env(safe-area-inset-bottom))}
  .bar{padding:9px 12px;gap:10px}
  .brand-text{display:none}
  .status{display:none}

  /* 底部标签栏：一条凸起的材质条，当前项抬起 */
  #nav{
    position:fixed;left:0;right:0;bottom:0;z-index:40;margin:0;gap:0;justify-content:space-around;
    padding:8px 6px calc(8px + env(safe-area-inset-bottom));
    background:linear-gradient(180deg,#F7F2EA 0%,#EDE5DA 100%);
    border-top:1px solid var(--edge);
    box-shadow:inset 0 1px 0 var(--hl), 0 -3px 8px rgba(70,45,25,.14);
  }
  #nav a{
    flex:1 1 0;text-align:center;padding:8px 2px;font-size:12px;color:var(--ink-2);
    background:transparent;box-shadow:none;min-height:44px;
  }
  #nav a.is-on{
    color:var(--acc-dk);font-weight:500;
    background:linear-gradient(180deg,var(--mat-1),#F1E9DE);
    box-shadow:inset 0 1px 0 var(--hl), 0 1px 3px rgba(70,45,25,.24);
  }

  .day-date{font-size:24px}
  .moodpick{grid-template-columns:repeat(3,minmax(0,1fr))}
  .stage{padding:12px;overflow:hidden}

  /* 手机上的书：一页一屏，仍可翻页 */
  .book{grid-template-columns:1fr;perspective:1600px}
  .book::after{display:none}
  .page.is-left{border-radius:var(--r)}
  .page.is-right{display:none}
  .leaf{left:0;width:100%}
  .face{border-radius:var(--r)}
  .page,.face{min-height:0;padding:16px}
  .card{padding:16px}

  /* 本周：左待排期、右周内容 */
  /* 手机上筛选变成横向可滑动的一排，放在待排期和周列表上方 */
  .planner{grid-template-columns:114px minmax(0,1fr);gap:8px}
  .filterrail{
    grid-column:1/-1;flex-direction:row;overflow-x:auto;position:static;gap:6px;
    padding-bottom:3px;-webkit-overflow-scrolling:touch;
  }
  .fbtn{flex:0 0 auto;min-width:74px;align-items:center;text-align:center;padding:8px 10px;min-height:44px;justify-content:center}
  .fbtn span{font-size:9.5px}
  .inbox,.poolpane{position:static;min-height:0;padding:8px;border-radius:9px}
  .inhead{font-size:12.5px;gap:4px;margin-bottom:7px}
  .inhead select{max-width:100%;margin-left:0;font-size:11px;padding:3px 4px}
  .inbody{flex-direction:column;flex-wrap:nowrap;max-height:56vh;gap:6px}
  .inbody .tcard{flex:none;width:100%}
  .daycol{grid-template-columns:minmax(0,1fr);gap:6px;min-height:0;padding:9px}
  .dbody{min-height:22px}

  .board{grid-template-columns:1fr}
  .goalpane{grid-template-columns:1fr}

  /* 手机上的点击区域不小于 44px */
  .btn{min-height:44px;padding:10px 16px}
  .btn-sm{min-height:36px;padding:8px 12px}
  .mini{padding:6px}
  .check{width:24px;height:24px}
  .tcard .check{width:20px;height:20px}
  .items{gap:2px}
  .items li{padding:6px 0;min-height:38px}
  .taskline{padding:11px 0}
  .shade{width:32px;height:32px}
  .seg button{min-height:40px}
  .iconbtn{width:40px;height:40px}
  input[type="text"],input[type="email"],input[type="password"],input[type="date"],select{min-height:42px;font-size:16px}
}

@media (prefers-reduced-motion:reduce){
  .leaf.is-moving{transition:none}
  *{transition-duration:.01ms !important}
}