:root{
  --ink:#1f2329; --ink-2:#4e5561; --ink-3:#8a919c;
  --bg:#f5f6f8; --card:#ffffff; --line:#e8eaee;
  --brand:#534ab7; --brand-bg:#eeedfe; --brand-ink:#3c3489;
  --green:#0f6e56; --green-bg:#e1f5ee;
  --blue-bg:#e6f1fb; --blue:#185fa5;
  --orange:#b3540c; --red:#c0392b;
}
*{box-sizing:border-box; margin:0; padding:0;}
body{font-family:"PingFang SC","Microsoft YaHei",system-ui,sans-serif; background:var(--bg); color:var(--ink); min-height:100vh;}
.hidden{display:none !important;}
button{font-family:inherit; cursor:pointer;}

/* ---- 登录 ---- */
.login-view{min-height:100vh; display:flex; align-items:center; justify-content:center; padding:20px;}
.login-card{background:var(--card); border:1px solid var(--line); border-radius:20px; padding:40px 32px; width:360px; text-align:center; box-shadow:0 10px 30px rgba(31,35,41,.07);}
.login-card h1{color:var(--brand); font-size:24px;}
.slogan{font-size:13px; color:var(--ink-2); margin:14px 0 24px; line-height:1.9;}
.login-card input{width:100%; border:1.5px solid var(--line); border-radius:12px; padding:12px; font-size:15px; outline:none; text-align:center;}
.login-card input:focus{border-color:var(--brand);}
.btn-primary{display:block; width:100%; margin-top:14px; background:var(--brand); color:#fff; border:none; border-radius:12px; padding:12px; font-size:15px; font-weight:600;}
.btn-primary:active{opacity:.85;}
.tip{font-size:11.5px; color:var(--ink-3); margin-top:14px; line-height:1.8; text-align:center;}

/* ---- 框架 ---- */
/* 桌面端以日历工作台为主：给周/月/年视图足够横向空间，避免文字频繁换行 */
#appView{width:min(1440px, calc(100% - 48px)); max-width:none; margin:0 auto; padding:0 0 60px;}
header{display:flex; justify-content:space-between; align-items:center; padding:18px 4px 12px; position:sticky; top:0; background:var(--bg); z-index:5;}
.h-left{display:flex; align-items:center; gap:10px;}
.h-left b{font-size:17px; color:var(--brand);}
#syncStatus{font-size:11px; padding:3px 9px; border-radius:999px; font-weight:600;}
.st-synced{background:var(--green-bg); color:var(--green);}
.st-pushing{background:#fdf0e3; color:var(--orange);}
.st-offline{background:#fdeaea; color:var(--red);}
#topNav{display:flex; gap:4px; align-items:center;}
.top-nav{border:1px solid var(--line); background:var(--card); color:var(--ink-2); height:34px; padding:0 10px; border-radius:10px; font-size:12px; font-weight:700; white-space:nowrap;}
.top-nav:hover{border-color:var(--brand); color:var(--brand-ink);}
.top-nav.on{background:var(--brand); border-color:var(--brand); color:#fff;}
.top-nav.bell{font-size:16px; width:34px; padding:0; display:flex; align-items:center; justify-content:center;}
.top-nav.bell.off{opacity:.48; filter:grayscale(1);}
#timeTabs{display:inline-flex; gap:3px; background:var(--card); border:1px solid var(--line); padding:4px; border-radius:12px; margin:2px 4px 8px;}
#timeTabs button{border:none; background:transparent; padding:7px 18px; font-size:13px; color:var(--ink-2); border-radius:9px; font-weight:700;}
#timeTabs button.on{background:var(--brand); color:#fff;}

/* ---- 今日 ---- */
.day-nav{display:flex; align-items:center; gap:10px; padding:8px 4px;}
.day-nav #dayTitle, .day-nav #weekTitle{flex:1; font-size:17px; font-weight:700;}
.day-nav button{border:1px solid var(--line); background:var(--card); width:32px; height:32px; border-radius:10px; font-size:16px; color:var(--ink-2);}
.day-nav #todayBtn{width:auto; padding:0 12px; font-size:12.5px;}
.progress{height:8px; border-radius:999px; background:#e9eaee; overflow:hidden; margin:6px 4px 0;}
.progress i{display:block; height:100%; width:0; background:linear-gradient(90deg,#6a5fd8,#9b8df0); border-radius:999px; transition:width .4s;}
.progress-txt{font-size:12px; color:var(--ink-3); margin:7px 4px 0;}
.quickadd{margin:14px 0 6px;}
.quickadd input{width:100%; border:1.5px solid var(--line); border-radius:12px; padding:12px 14px; font-size:14px; outline:none; background:var(--card);}
.quickadd input:focus{border-color:var(--brand);}
.task{display:flex; align-items:flex-start; gap:10px; padding:12px 12px; border-radius:14px; margin-top:8px; background:var(--card); border:1px solid var(--line);}
.task.fix{background:linear-gradient(90deg,#f6f4ff,var(--card)); border-color:#e3dffb;}
.task .cb{width:21px; height:21px; border-radius:7px; border:1.5px solid #c9cdd6; flex:none; margin-top:1px; display:flex; align-items:center; justify-content:center; cursor:pointer;}
.task.done .cb{background:var(--green); border-color:var(--green);}
.task .cb svg{width:13px; height:13px;}
.task .t{flex:1; min-width:0;}
.task .name{font-size:14px; font-weight:600; word-break:break-all;}
.task .note{font-size:11.5px; color:var(--ink-3); margin-top:4px; line-height:1.5;}
.task .meta{display:flex; gap:6px; margin-top:5px; align-items:center;}
.task .time{font-size:12.5px; color:var(--ink-2); font-variant-numeric:tabular-nums; flex:none; margin-top:2px;}
.task .del{border:none; background:transparent; color:var(--ink-3); font-size:16px; flex:none; width:24px; height:24px; border-radius:6px; visibility:hidden;}
.task:hover .del{visibility:visible;}
.task .del:hover{color:var(--red); background:#fdeaea;}
.task.done{opacity:.55;}
.task.done .name{text-decoration:line-through; font-weight:500;}
.chip{display:inline-block; font-size:10px; padding:2px 8px; border-radius:999px; font-weight:600;}
.chip.fix{background:var(--brand-bg); color:var(--brand-ink);}
.chip.tmp{background:var(--blue-bg); color:var(--blue);}
.empty{padding:36px 0; text-align:center; color:var(--ink-3); font-size:13px;}

/* ---- 周历 ---- */
#weekGrid{display:grid; grid-template-columns:repeat(7,1fr); gap:6px; margin-top:8px;}
.wcol{background:var(--card); border:1px solid var(--line); border-radius:10px; padding:8px 6px; min-height:120px;}
/* 当前日优先级最高：加粗边框、顶部强调条和淡紫底 */
.wcol.today{border:2px solid var(--brand); background:#fbfaff; box-shadow:0 5px 18px rgba(83,74,183,.12); position:relative;}
.wcol.today::before{content:"今天"; position:absolute; top:-11px; left:50%; transform:translateX(-50%); padding:2px 8px; border-radius:999px; background:var(--brand); color:#fff; font-size:9px; font-weight:700; z-index:1;}
.wcol.overdue:not(.today){border-color:#f1b8ae; background:#fffafa;}
.wcol .d{text-align:center; font-size:11px; color:var(--ink-3); border-bottom:1px solid var(--line); padding-bottom:5px; margin-bottom:6px;}
.wcol .d b{display:block; font-size:14px; color:var(--ink); margin-top:2px;}
.wcol.today .d{color:var(--brand);}
.wcol.today .d b{color:var(--brand);}
.wcol .w-date{cursor:pointer; border-radius:7px; padding-top:3px; margin-top:-3px;}
.wcol .w-date:hover{background:var(--brand-bg); color:var(--brand-ink);}
.wcol .w-date:hover b{color:var(--brand-ink);}
.wt{font-size:10.5px; padding:4px 6px; border-radius:6px; margin-bottom:4px; line-height:1.35; font-weight:600; word-break:break-all;}
.wt-title{overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.wt-note{margin-top:2px; font-size:9.5px; line-height:1.3; font-weight:500; opacity:.74; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.wt.routine{background:var(--brand-bg); color:var(--brand-ink);}
.wt.manual{background:var(--blue-bg); color:var(--blue);}
/* 待完成：沿用固定紫/临时蓝；已完成：绿色；逾期未完成：暖红；跳过：灰 */
.wt.done{background:var(--green-bg); color:var(--green); opacity:.75; text-decoration:line-through;}
.wt.overdue{background:#fdeae7; color:#a63827; border-left:3px solid #d85a47;}
.wt.skipped{background:#f0f1f3; color:var(--ink-3); opacity:.62; text-decoration:line-through;}
.wadd{margin-top:6px; text-align:center; font-size:11px; color:var(--ink-3); padding:5px 0; border-radius:8px; cursor:pointer; font-weight:600;}
.wadd:hover{background:var(--brand-bg); color:var(--brand-ink);}

/* ---- 月视图 / 年视图 ---- */
.month-stats{font-size:12px; color:var(--ink-2); margin:2px 4px 8px;}
.month-stats b{color:var(--brand-ink);}
.month-weekdays{display:grid; grid-template-columns:repeat(7,1fr); gap:4px; margin-bottom:4px;}
.month-weekdays span{text-align:center; font-size:11px; color:var(--ink-3); font-weight:600; padding:4px 0;}
#monthGrid{display:grid; grid-template-columns:repeat(7,1fr); gap:4px;}
.mday{background:var(--card); border:1px solid var(--line); border-radius:10px; min-height:104px; padding:6px; overflow:hidden;}
.mday.outside{opacity:.38; background:#f9fafb;}
/* 月视图：今天突出，存在逾期计划的历史日期做柔和警示 */
.mday.today{border:2px solid var(--brand); background:#fbfaff; box-shadow:0 4px 14px rgba(83,74,183,.13); position:relative;}
.mday.today::after{content:"今天"; position:absolute; right:5px; bottom:4px; color:var(--brand); font-size:9px; font-weight:800;}
.mday.overdue:not(.today){border-color:#f1b8ae; background:#fffafa;}
.m-head{display:flex; align-items:center; justify-content:space-between; font-size:12px; font-weight:700; margin:-2px -2px 5px; padding:2px; border-radius:7px; cursor:pointer;}
.m-head:hover{background:var(--brand-bg);}
.m-date{padding:1px 4px; color:var(--ink); font-size:12px; font-weight:700;}
.m-head:hover .m-date{color:var(--brand-ink);}
.mday.today .m-date{color:var(--brand);}
.m-add{border:none; background:transparent; color:var(--ink-3); border-radius:6px; font-size:15px; line-height:18px; width:18px; height:18px; padding:0; opacity:0;}
.mday:hover .m-add{opacity:1;}
.m-add:hover{background:var(--brand-bg); color:var(--brand-ink);}
.mt{font-size:10px; border-radius:5px; padding:3px 4px; margin-top:3px; line-height:1.3; overflow:hidden; cursor:pointer; font-weight:600;}
.mt-title,.mt-note{white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.mt-note{margin-top:1px; font-size:8.5px; line-height:1.25; font-weight:500; opacity:.72;}
.mt.routine{background:var(--brand-bg); color:var(--brand-ink);}
.mt.manual{background:var(--blue-bg); color:var(--blue);}
.mt.done{background:var(--green-bg); color:var(--green); opacity:.75; text-decoration:line-through;}
.mt.overdue{background:#fdeae7; color:#a63827; border-left:3px solid #d85a47;}
.mt.skipped{background:#f0f1f3; color:var(--ink-3); opacity:.62; text-decoration:line-through;}
.m-more,.m-summary{font-size:9.5px; color:var(--ink-3); margin-top:3px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.m-summary{color:var(--green);}
.year-tip{font-size:12px; color:var(--ink-3); margin:0 4px 10px;}
#yearGrid{display:grid; grid-template-columns:repeat(3,1fr); gap:10px;}
.y-month{background:var(--card); border:1px solid var(--line); border-radius:14px; min-height:112px; padding:13px; text-align:left; display:flex; flex-direction:column; gap:5px; color:var(--ink);}
.y-month:hover{border-color:var(--brand); box-shadow:0 4px 14px rgba(83,74,183,.09);}
/* 年视图：当前月明确标识；有逾期计划的月份给出警示 */
.y-month.current{border:2px solid var(--brand); background:#fbfaff; box-shadow:0 5px 16px rgba(83,74,183,.12); position:relative;}
.y-month.current::after{content:"本月"; position:absolute; right:10px; top:10px; padding:2px 6px; border-radius:999px; background:var(--brand); color:#fff; font-size:9px; font-weight:700;}
.y-month.overdue:not(.current){border-color:#f1b8ae; background:#fffafa;}
.y-month.done:not(.current){border-color:#b7e3d4;}
.y-name{font-size:15px; font-weight:700; color:var(--brand-ink);}
.y-num{font-size:12px; color:var(--ink-2);}
.y-rate{font-size:11px; color:var(--ink-3);}
.y-month i{display:block; height:5px; background:#e9eaee; border-radius:999px; overflow:hidden; margin-top:3px;}
.y-month i b{display:block; height:100%; background:linear-gradient(90deg,#6a5fd8,#9b8df0); border-radius:999px;}
.y-month.overdue i b{background:linear-gradient(90deg,#ed8b7c,#d85a47);}
.y-month.done i b{background:linear-gradient(90deg,#67bba3,#0f6e56);}

/* ---- 数据统计 ---- */
.stats-head{display:flex; justify-content:space-between; align-items:flex-start; gap:12px; margin:8px 4px 14px;}
.stats-head h2{font-size:19px; margin-bottom:5px;}
.stats-head p{font-size:11.5px; color:var(--ink-3);}
.stats-range{display:flex; gap:3px; padding:3px; background:var(--card); border:1px solid var(--line); border-radius:10px;}
.stats-range button{border:none; background:transparent; border-radius:7px; padding:6px 9px; color:var(--ink-2); font-size:11.5px; font-weight:700;}
.stats-range button.on{background:var(--brand); color:#fff;}
.stats-cards{display:grid; grid-template-columns:repeat(5,1fr); gap:8px; margin-bottom:14px;}
.stat-card{background:var(--card); border:1px solid var(--line); border-radius:13px; padding:12px 10px; min-width:0;}
.stat-card span{display:block; font-size:10.5px; color:var(--ink-3); margin-bottom:7px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.stat-card b{font-size:20px; color:var(--brand-ink); font-variant-numeric:tabular-nums;}
.stats-section{background:var(--card); border:1px solid var(--line); border-radius:15px; padding:15px; margin-top:12px;}
.stats-section h3{font-size:14px; margin-bottom:14px;}
.trend-chart{height:150px; display:flex; align-items:flex-end; gap:5px; position:relative; padding-bottom:24px; border-bottom:1px solid var(--line);}
.trend-bar{height:100%; flex:1; min-width:4px; background:#f0f1f3; border-radius:4px 4px 0 0; display:flex; align-items:flex-end; overflow:hidden;}
.trend-bar i{width:100%; background:linear-gradient(180deg,#9b8df0,#534ab7); border-radius:4px 4px 0 0; min-height:2px;}
.trend-labels{position:absolute; bottom:2px; left:0; right:0; display:flex; justify-content:space-between; font-size:9.5px; color:var(--ink-3);}
.routine-stat{padding:10px 0; border-bottom:1px solid var(--line);}
.routine-stat:last-child{border-bottom:none;}
.routine-stat>div{display:flex; align-items:center; justify-content:space-between; gap:12px; font-size:13px; margin-bottom:7px;}
.routine-stat span{font-size:11px; color:var(--ink-3); white-space:nowrap;}
.routine-stat i{display:block; height:6px; background:#e9eaee; border-radius:999px; overflow:hidden;}
.routine-stat em{display:block; height:100%; background:linear-gradient(90deg,#6a5fd8,#9b8df0); border-radius:999px;}

/* ---- 固定计划 ---- */
.routine-form{background:var(--card); border:1px solid var(--line); border-radius:16px; padding:16px; margin-top:10px;}
.routine-form h3{font-size:15px; margin-bottom:12px;}
.routine-form input,.routine-form select,.routine-form textarea{width:100%; border:1.5px solid var(--line); border-radius:12px; padding:11px 12px; font-size:13.5px; outline:none; margin-bottom:10px; font-family:inherit; background:#fff; color:var(--ink);}
.routine-form textarea{resize:vertical;}
.routine-form input:focus,.routine-form select:focus,.routine-form textarea:focus{border-color:var(--brand);}
.daychips{display:flex; gap:7px; margin-bottom:10px;}
.daychips button{flex:1; height:36px; border-radius:10px; border:1.5px solid var(--line); background:var(--card); font-size:12.5px; font-weight:600; color:var(--ink-2);}
.daychips button.sel{background:var(--brand); border-color:var(--brand); color:#fff;}
.routine{background:var(--card); border:1px solid var(--line); border-radius:14px; padding:13px 14px; margin-top:10px;}
.routine.paused{opacity:.55;}
.routine .r1{display:flex; justify-content:space-between; align-items:center;}
.routine .name{font-size:14px; font-weight:700;}
.routine .wd{display:flex; gap:5px; margin-top:10px;}
.routine .wd span{font-size:10px; width:22px; height:22px; border-radius:50%; background:var(--bg); color:var(--ink-3); display:flex; align-items:center; justify-content:center; font-weight:600;}
.routine .wd span.hit{background:var(--brand); color:#fff;}
.routine .rt{font-size:11.5px; color:var(--ink-3); margin-top:9px; display:flex; justify-content:space-between; align-items:center;}
.routine-note{margin-top:9px; font-size:11.5px; color:var(--ink-2); line-height:1.45; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.routine .acts{display:flex; gap:8px;}
.routine .acts button{border:none; font-size:12px; padding:5px 12px; border-radius:8px; font-weight:600;}
.btn-edit{background:var(--blue-bg); color:var(--blue);}
.btn-pause{background:#fdf0e3; color:var(--orange);}
.btn-resume{background:var(--green-bg); color:var(--green);}
.btn-del{background:#fdeaea; color:var(--red);}

/* ---- V0.2：跳过/优先级/统计/冲突/弹窗 ---- */
.task.skipped{opacity:.45;}
.task.skipped .name{text-decoration:line-through; font-weight:500;}
.chip.skip{background:#f0f1f3; color:var(--ink-3);}
.chip.pri{background:#fdeaea; color:var(--red);}
.week-stats{font-size:12px; color:var(--ink-2); margin:2px 4px 6px;}
.week-stats b{color:var(--brand-ink);}
.wt{cursor:pointer;}
.wt.skipped{opacity:.5;}
#qaWarn{margin-top:8px; font-size:12px; background:#fdf0e3; color:var(--orange); padding:9px 12px; border-radius:10px; cursor:pointer; line-height:1.6;}
.modal-mask{position:fixed; inset:0; background:rgba(31,35,41,.35); display:flex; align-items:center; justify-content:center; z-index:50; padding:16px;}
.modal{background:#fff; border-radius:18px; padding:20px; width:400px; max-width:100%; max-height:90vh; overflow:auto;}
.modal h3{font-size:16px; margin-bottom:14px;}
/* ---- 计划详情 ---- */
.detail-top{display:flex; align-items:center; justify-content:space-between; margin-bottom:14px;}
.detail-top h3{margin:0;}
.detail-close{border:none; background:transparent; color:var(--ink-3); font-size:24px; width:30px; height:30px; border-radius:8px; line-height:1;}
.detail-close:hover{background:var(--bg); color:var(--ink);}
.detail-title{font-size:20px; font-weight:750; line-height:1.45; word-break:break-word; margin-bottom:8px;}
.detail-status{display:inline-flex; align-items:center; background:var(--blue-bg); color:var(--blue); border-radius:999px; padding:4px 10px; font-size:11.5px; font-weight:700; margin-bottom:14px;}
.detail-status.done{background:var(--green-bg); color:var(--green);}
.detail-status.skipped{background:#f0f1f3; color:var(--ink-3);}
.detail-list{border-top:1px solid var(--line); border-bottom:1px solid var(--line); padding:4px 0; margin-bottom:16px;}
.detail-list>div{display:grid; grid-template-columns:68px 1fr; gap:10px; padding:10px 2px; font-size:13px; line-height:1.55;}
.detail-list dt{color:var(--ink-3);}
.detail-list dd{margin:0; color:var(--ink); white-space:pre-wrap; word-break:break-word;}
.detail-list .muted dd{color:var(--ink-3);}
.detail-actions{display:flex; flex-wrap:wrap; gap:8px;}
.detail-actions .btn-primary2{flex:1; min-width:120px;}
.detail-actions button:not(.btn-primary2){padding:9px 11px;}
.modal input, .modal select, .modal textarea{width:100%; border:1.5px solid var(--line); border-radius:10px; padding:10px 12px; font-size:13.5px; outline:none; margin-bottom:10px; font-family:inherit; background:#fff; color:var(--ink);}
.modal input:focus, .modal select:focus, .modal textarea:focus{border-color:var(--brand);}
.modal textarea{resize:vertical;}
.em-row{display:flex; gap:10px;}
.em-foot{display:flex; gap:8px; margin-top:4px;}
.em-foot .spacer{flex:1;}
.btn-ghost{background:var(--bg); color:var(--ink-2); border:none; border-radius:10px; padding:10px 14px; font-size:13.5px; font-weight:600;}
.btn-primary2{flex:1; background:var(--brand); color:#fff; border:none; border-radius:10px; padding:10px 0; font-size:13.5px; font-weight:600;}
.btn-del2{background:#fdeaea; color:var(--red); border:none; border-radius:10px; padding:10px 12px; font-size:12.5px; font-weight:600;}
.btn-skip{background:#f0f1f3; color:var(--ink-2); border:none; border-radius:10px; padding:10px 12px; font-size:12.5px; font-weight:600;}
.btn-postpone{background:var(--blue-bg); color:var(--blue); border:none; border-radius:10px; padding:10px 12px; font-size:12.5px; font-weight:600;}
.conflict{background:#fdf0e3; border-radius:10px; padding:10px 12px; font-size:12.5px; color:var(--orange); line-height:2; margin-bottom:8px;}
.conflict button{border:1px solid #f3d4b0; background:#fff; color:var(--orange); border-radius:8px; padding:4px 10px; font-size:12px; font-weight:600; margin-left:6px; cursor:pointer;}
.routine-edit-tip{font-size:11.5px; color:var(--ink-3); line-height:1.6; margin:-1px 0 10px;}

/* ---- V0.3：提醒铃铛 / 提醒横幅 / 数据备份 / PWA ---- */
.h-right{display:flex; align-items:center; gap:10px;}
.bell{border:1px solid var(--line); background:var(--card); width:34px; height:34px; border-radius:10px; font-size:16px; line-height:1; display:flex; align-items:center; justify-content:center;}
.bell.off{opacity:.45; filter:grayscale(1);}
#remindBanner{position:sticky; top:62px; z-index:40; margin-bottom:8px;}
.rb-item{background:#fffbe8; border:1px solid #f3e3ae; color:#7a5c0d; border-radius:14px; padding:12px 14px; font-size:13.5px; display:flex; align-items:center; gap:8px; flex-wrap:wrap; box-shadow:0 6px 18px rgba(122,92,13,.08);}
.rb-item b{color:#5d4708;}
.rb-time{font-size:12px; opacity:.75; font-variant-numeric:tabular-nums;}
.rb-item button{border:none; border-radius:8px; padding:6px 12px; font-size:12.5px; font-weight:600; cursor:pointer;}
.rb-done{background:var(--green); color:#fff;}
.rb-later{background:transparent; color:#7a5c0d; border:1px solid #e6d69b !important;}
.rb-dismiss{background:transparent; color:#7a5c0d; border:1px solid #e6d69b !important;}
.rb-item.digest{background:var(--brand-bg); border-color:#d3cef0; color:var(--brand-ink); box-shadow:0 6px 18px rgba(83,74,183,.12);}
.rb-item.digest b{color:var(--brand-ink);}
.rb-item.digest .rb-dismiss{color:var(--brand-ink); border-color:#c4bcf1 !important;}

/* V0.4 提醒设置 */
.reminder-box{background:var(--card); border:1px solid var(--line); border-radius:16px; padding:16px; margin-top:16px;}
.settings-head{display:flex; align-items:flex-start; justify-content:space-between; gap:12px;}
.settings-head h3{font-size:15px; margin-bottom:6px;}
.settings-head p{font-size:12px; color:var(--ink-3); line-height:1.7;}
.settings-grid{display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:10px; margin-top:14px;}
.settings-grid label{font-size:12px; color:var(--ink-2); display:flex; flex-direction:column; gap:6px;}
.settings-grid input, .settings-grid select{border:1.5px solid var(--line); border-radius:10px; padding:9px 11px; font-size:13px; outline:none; background:#fff; color:var(--ink);}
.settings-grid input:focus, .settings-grid select:focus{border-color:var(--brand);}
.digest-check{display:flex; align-items:center; gap:8px; margin-top:12px; font-size:12.5px; color:var(--ink-2);}
.setting-switch{position:relative; display:inline-block; width:46px; height:26px; flex:none;}
.setting-switch input{opacity:0; width:0; height:0;}
.setting-switch span{position:absolute; inset:0; background:#d6d8df; border-radius:999px; transition:.2s;}
.setting-switch span::before{content:""; position:absolute; left:3px; top:3px; width:20px; height:20px; background:#fff; border-radius:50%; transition:.2s; box-shadow:0 1px 3px rgba(0,0,0,.2);}
.setting-switch input:checked + span{background:var(--brand);}
.setting-switch input:checked + span::before{transform:translateX(20px);}
.settings-info{font-size:12px; color:var(--ink-3); margin-top:10px; line-height:1.7;}
.push-box{background:linear-gradient(135deg,#f9f8ff,#fff); border:1px solid #dcd8f5; border-radius:16px; padding:16px; margin-top:16px;}
.push-badge{border-radius:999px; padding:4px 9px; font-size:11px; font-weight:700; background:#f0f1f3; color:var(--ink-3); white-space:nowrap;}
.push-badge.on{background:var(--green-bg); color:var(--green);}
.push-badge.warn{background:#fdf0e3; color:var(--orange);}
.push-device{border:1.5px solid var(--line); background:#fff; border-radius:10px; padding:9px 11px; min-height:40px; display:flex; flex-direction:column; gap:4px; font-size:12px; color:var(--ink-2);}
.push-device b{font-size:14px; color:var(--brand-ink);}
.push-actions{display:flex; gap:8px; flex-wrap:wrap; margin-top:12px;}
.push-actions button{flex:1; min-width:130px;}
.push-actions .btn-ghost{border:1px solid var(--line); background:#fff; color:var(--ink-2);}
.push-actions button:disabled{opacity:.55; cursor:not-allowed;}
.backup-box{background:var(--card); border:1px dashed #d4d7de; border-radius:16px; padding:16px; margin-top:16px;}
.backup-box h3{font-size:15px; margin-bottom:8px;}
.bk-actions{display:flex; gap:10px; margin-top:4px;}
.btn-bk{flex:1; background:var(--brand); color:#fff; border:none; border-radius:10px; padding:10px 0; font-size:13px; font-weight:600;}
.btn-bk2{background:#fff; color:var(--brand-ink); border:1.5px solid var(--brand) !important;}
.bk-info{font-size:12px; color:var(--green); margin-top:10px; line-height:1.6; min-height:0;}
/* PWA 独立窗口下留出刘海安全区 */
@media (display-mode: standalone){
  body{padding-top:env(safe-area-inset-top);}
}

@media (min-width:1000px){
  .task{padding:14px 16px;}
  .task .name{font-size:15px;}
  .wcol{min-height:170px; padding:10px 9px;}
  .wt{font-size:12px; padding:5px 7px;}
  .mday{min-height:136px; padding:9px;}
  .mt{font-size:11.5px; padding:4px 6px;}
  .m-summary,.m-more{font-size:10.5px;}
  .y-month{min-height:126px;}
  #yearGrid{grid-template-columns:repeat(4,1fr); gap:12px;}
  .stats-cards{gap:12px;}
  .stat-card{padding:16px 14px;}
  .reminder-box{padding:18px 20px;}
}

@media (max-width:640px){
  #appView{width:100%; padding:0 14px 60px;}
  #weekGrid{grid-template-columns:1fr; }
  .wcol{min-height:0;}
  header{flex-wrap:wrap; gap:8px;}
  .h-right{width:auto; justify-content:flex-end;}
  #timeTabs{display:flex; margin:2px 0 8px; width:100%;}
  #timeTabs button{flex:1; padding:7px 8px; font-size:12px;}
  .stats-head{align-items:stretch; flex-direction:column;}
  .stats-range{align-self:stretch;}
  .stats-range button{flex:1;}
  .stats-cards{grid-template-columns:repeat(2,1fr);}
  .stat-card:last-child{grid-column:span 2;}
  .mday{min-height:82px; padding:4px; border-radius:8px;}
  .mt{font-size:9px; padding:2px 3px;}
  .m-summary,.m-more{font-size:8.5px;}
  .m-add{opacity:1;}
  #yearGrid{grid-template-columns:repeat(2,1fr); gap:8px;}
  .y-month{min-height:96px; padding:11px;}
}