:root { --bg:#f4efe4; --card:#fffdf8; --ink:#1f2a26; --muted:#6b736f; --green:#2f5d50; --green-2:#e3ede8; --red:#b8322a; --red-2:#fbe7e4; --yellow:#f6c945; --yellow-2:#fdf3cf; --line:#e4dccb; }
* { box-sizing:border-box; }
body { margin:0; background:var(--bg); color:var(--ink); font-family:-apple-system,BlinkMacSystemFont,"PingFang TC","Noto Sans TC","Microsoft JhengHei",sans-serif; -webkit-font-smoothing:antialiased; }
button { font:inherit; cursor:pointer; border:0; border-radius:12px; padding:10px 16px; background:var(--green); color:#fff; font-weight:600; }
button.ghost { background:transparent; color:var(--green); border:1.5px solid var(--green); }
button.danger { background:var(--red); }
button:disabled { opacity:.5; cursor:default; }
input, select { font:inherit; padding:9px 11px; border:1.5px solid var(--line); border-radius:10px; background:#fff; color:var(--ink); }
.card { background:var(--card); border:1px solid var(--line); border-radius:16px; padding:16px; }
.muted { color:var(--muted); }
.pill { display:inline-block; padding:2px 10px; border-radius:99px; font-size:13px; font-weight:600; }
.s-upcoming { background:#eef0ef; color:var(--muted); }
.s-due { background:var(--yellow-2); color:#8a6400; }
.s-overdue { background:var(--red-2); color:var(--red); }
.s-done { background:var(--green-2); color:var(--green); }
.s-skipped { background:#eef0ef; color:var(--muted); }
.toast { position:fixed; left:50%; bottom:24px; transform:translateX(-50%); background:var(--ink); color:#fff; padding:12px 18px; border-radius:12px; z-index:99; max-width:90vw; }
/* 任務照片 */
.thumb { width:84px; height:63px; border-radius:10px; object-fit:cover; border:2px solid #fff; box-shadow:0 1px 4px rgba(0,0,0,.2); cursor:zoom-in; flex:none; background:#eee; }
.photo-view { position:fixed; inset:0; z-index:90; background:rgba(0,0,0,.92); display:flex; flex-direction:column; align-items:center; justify-content:center; padding:20px; gap:14px; }
.photo-view img { max-width:100%; max-height:75vh; border-radius:10px; }
.photo-view .cap { color:#fff; font-size:17px; line-height:1.6; text-align:center; }
.photo-view .x { position:absolute; top:14px; right:14px; background:rgba(255,255,255,.15); font-size:22px; padding:6px 14px; }
/* 選誰做的 */
.who-pick { position:fixed; inset:0; z-index:80; background:rgba(31,42,38,.55); display:flex; align-items:center; justify-content:center; padding:16px; }
.who-pick .box { background:var(--card); border-radius:18px; padding:24px; width:100%; max-width:560px; text-align:center; box-shadow:0 10px 40px rgba(0,0,0,.3); }
.who-pick h3 { margin:0 0 4px; font-size:24px; }
.who-pick p { margin:0 0 16px; color:var(--muted); }
.who-pick .whos { display:grid; grid-template-columns:repeat(auto-fill,minmax(140px,1fr)); gap:10px; }
.who-pick .whos button { padding:18px 8px; font-size:21px; background:#f5f1e8; color:var(--ink); border:2px solid var(--line); }
.who-pick .whos button.other { color:var(--muted); font-size:18px; }
.who-pick .cancel { margin-top:14px; background:none; color:var(--muted); font-weight:500; }
/* 連結做成按鈕外觀 */
a.btn { display:inline-flex; align-items:center; justify-content:center; text-decoration:none; border-radius:12px; padding:10px 16px; background:var(--green); color:#fff; font-weight:600; }
a.btn.ghost { background:transparent; color:var(--green); border:1.5px solid var(--green); }