/* 減重習慣網頁 — 方向C 雜誌編輯風·燒橙（沿用 draft-c，段2-2 擴充） */
:root{
  --bg:#0d0c0b;
  --paper:#151311;
  --line:rgba(255,255,255,.11);
  --line-soft:rgba(255,255,255,.06);
  --txt:#f4efe8;
  --txt-2:#a49b8e;
  --txt-3:#6e675d;
  --burnt:#e0703a;
  --burnt-soft:rgba(224,112,58,.12);
}
*{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent}
html,body{background:var(--bg);color:var(--txt)}
body{
  font-family:"PingFang TC","Noto Sans TC",-apple-system,BlinkMacSystemFont,sans-serif;
  line-height:1.6;-webkit-font-smoothing:antialiased;
  padding:calc(env(safe-area-inset-top) + 8px) 24px calc(env(safe-area-inset-bottom) + 48px);
  max-width:600px;margin:0 auto;
}
.serif{font-family:"Songti TC","Noto Serif TC",Georgia,"Times New Roman",serif}

/* 測試切換列（驗證用，正式首頁行為靠 PWA） */
.testbar{display:flex;align-items:center;gap:10px;justify-content:center;
  font-size:12px;color:var(--txt-3);letter-spacing:.04em;
  padding:8px 10px;margin:2px 0 4px;border:1px dashed var(--line);border-radius:8px}
.testbar button{background:transparent;border:1px solid var(--line);color:var(--txt-2);
  font:inherit;font-size:12px;padding:4px 10px;border-radius:6px;cursor:pointer}
.testbar button:active{background:var(--burnt-soft)}
.testbar .today-btn{color:var(--burnt);border-color:var(--burnt)}
.testbar .vd{min-width:96px;text-align:center;color:var(--txt-2);font-variant-numeric:tabular-nums}

.topbar{display:flex;justify-content:space-between;align-items:center;padding:12px 0 8px;color:var(--txt-3);font-size:12px;letter-spacing:.05em}
.topbar a{color:var(--txt-3);text-decoration:none}
.tag{color:var(--burnt);font-weight:600;letter-spacing:.08em}

/* 刊頭 */
.masthead{padding:14px 0 26px;border-bottom:2px solid var(--txt)}
.kicker{display:flex;justify-content:space-between;align-items:center;font-size:11px;letter-spacing:.28em;text-transform:uppercase;color:var(--burnt);margin-bottom:6px}
.kicker .r{color:var(--txt-3);letter-spacing:.1em}
.bignum{font-size:88px;line-height:.92;font-weight:600;letter-spacing:-.03em;margin:6px 0 4px}
.bignum small{font-size:24px;font-weight:400;color:var(--txt-2);letter-spacing:0;margin-left:10px}
.dow{font-size:14px;color:var(--txt-2);letter-spacing:.24em}

.lead{padding:24px 0 26px;border-bottom:1px solid var(--line)}
.lead p{font-size:20px;line-height:1.55;font-weight:400;letter-spacing:.005em}
.lead .dc{float:left;font-size:56px;line-height:.8;font-weight:600;color:var(--burnt);margin:6px 12px 0 0}
.lead.pending p{font-size:14px;color:var(--txt-3);letter-spacing:.1em}

/* 欄目 */
.col{padding:26px 0;border-bottom:1px solid var(--line-soft)}
.col-h{display:flex;align-items:baseline;gap:12px;margin-bottom:18px}
.col-h .no{font-size:12px;color:var(--burnt);font-weight:700;letter-spacing:.1em}
.col-h h2{font-size:19px;font-weight:600;letter-spacing:.02em}
.col-h .meta{margin-left:auto;font-size:11px;color:var(--txt-3);letter-spacing:.06em}

.cycle-note{font-size:14px;color:var(--txt-2);line-height:1.7;margin-bottom:18px}
.cycle-note b{color:var(--txt);font-weight:600;border-bottom:2px solid var(--burnt-soft)}
.move{display:grid;grid-template-columns:1fr auto;align-items:baseline;padding:14px 0;border-bottom:1px solid var(--line-soft)}
.move:last-child{border-bottom:none}
.move .n{font-size:18px;font-weight:400}
.move .n small{color:var(--txt-3);font-size:12px;margin-left:8px}
.move .r{font-size:22px;font-weight:600;color:var(--burnt);font-variant-numeric:tabular-nums}
.move .r em{font-style:normal;font-size:12px;color:var(--txt-3);font-weight:400;margin-left:3px}

/* 升級規則（第5週起） */
.upgrade{margin-top:16px;padding:14px 16px;background:var(--burnt-soft);border-radius:8px}
.upgrade .ut{font-size:11px;color:var(--burnt);letter-spacing:.16em;text-transform:uppercase;font-weight:600;margin-bottom:10px}
.upgrade .ur{font-size:13px;color:var(--txt-2);line-height:1.7}
.upgrade .ur b{color:var(--txt);font-weight:600}

.field{margin-top:20px}
.field label{display:block;font-size:12px;color:var(--txt-3);letter-spacing:.04em;margin-bottom:9px}
.input{width:100%;background:transparent;border:none;border-bottom:1px solid var(--line);color:var(--txt);font:inherit;font-size:16px;padding:10px 2px}
.input::placeholder{color:var(--txt-3)}
.input:focus{outline:none;border-bottom-color:var(--burnt)}
.hint{margin-top:9px;font-size:12px;color:var(--txt-3);line-height:1.6}

.weight-line{display:flex;align-items:baseline;gap:10px;border-bottom:1px solid var(--line);padding-bottom:8px}
.weight-line input{flex:1;background:transparent;border:none;color:var(--txt);font:inherit;font-size:40px;font-weight:600;padding:6px 0;font-variant-numeric:tabular-nums;letter-spacing:-.01em}
.weight-line input:focus{outline:none}
.weight-line span{font-size:15px;color:var(--txt-3)}

/* 打勾 */
.check{display:flex;align-items:center;gap:15px;padding:14px 0;cursor:pointer;border-bottom:1px solid var(--line-soft)}
.check:last-child{border-bottom:none}
.box{width:20px;height:20px;border:1.5px solid var(--txt-2);flex:none;position:relative;transition:.18s}
.check .t{font-size:16px}
.check .t small{color:var(--txt-3);font-size:11px;margin-left:7px}
.check.on .box{background:var(--burnt);border-color:var(--burnt)}
.check.on .box::after{content:"";position:absolute;left:6.5px;top:2.5px;width:5px;height:10px;border:solid #0d0c0b;border-width:0 2px 2px 0;transform:rotate(45deg)}
.check.on .t{color:var(--txt-3)}

/* 三餐 */
.meal{padding:14px 0;border-bottom:1px solid var(--line-soft)}
.meal:last-child{border-bottom:none}
.meal .top{display:flex;align-items:baseline;gap:12px}
.meal .tm{font-size:13px;color:var(--burnt);font-weight:600;font-variant-numeric:tabular-nums;letter-spacing:.04em;width:46px;flex:none}
.meal .food{font-size:16px;flex:1}
.meal .g{font-size:12px;color:var(--txt-3)}
.shop-link{display:inline-block;margin-top:18px;font-size:13px;color:var(--burnt);text-decoration:none;letter-spacing:.04em;border-bottom:1px solid var(--burnt);padding-bottom:2px}

/* 回顧日 */
.review{padding:22px 0 26px;border-bottom:1px solid var(--line-soft)}
.review .q{font-size:20px;font-weight:600;line-height:1.5;margin-bottom:8px}
.review .qn{font-size:14px;color:var(--txt-2);line-height:1.7;margin-bottom:16px}
.review .ts{font-size:13px;color:var(--txt-2);line-height:1.8;padding:14px 16px;background:var(--paper);border-left:2px solid var(--burnt);border-radius:0 8px 8px 0}
.calib{margin-top:16px;padding:14px 16px;background:var(--burnt-soft);border-radius:8px}
.calib .ct{font-size:11px;color:var(--burnt);letter-spacing:.16em;text-transform:uppercase;font-weight:600;margin-bottom:10px}
.calib table{width:100%;border-collapse:collapse;font-size:13px}
.calib td{padding:6px 4px;border-bottom:1px solid var(--line-soft);color:var(--txt-2);vertical-align:top}
.calib td:first-child{color:var(--txt);white-space:nowrap;padding-right:12px}
.calib tr:last-child td{border-bottom:none}

/* 底線 */
.fallback{margin-top:28px;padding:22px 0 4px;border-top:2px solid var(--txt)}
.fallback .ft{font-size:11px;color:var(--burnt);letter-spacing:.22em;text-transform:uppercase;margin-bottom:14px;font-weight:600}
.fallback p{font-size:14px;color:var(--txt-2);line-height:1.7}
.fallback p + p{margin-top:10px}
.fallback b{color:var(--txt);font-weight:600}

/* 未開始 */
.not-started{padding:60px 0;text-align:center}
.not-started .big{font-size:40px;font-weight:600;color:var(--burnt);margin-bottom:16px}
.not-started p{font-size:15px;color:var(--txt-2);line-height:1.8}

/* 頁腳導覽 */
.nav{display:flex;gap:8px;margin-top:34px}
.nav a{flex:1;text-align:center;padding:12px 6px;font-size:13px;color:var(--txt-2);
  text-decoration:none;border:1px solid var(--line);border-radius:8px;letter-spacing:.06em}
.nav a:active{background:var(--burnt-soft)}
.foot{margin-top:22px;text-align:center;color:var(--txt-3);font-size:11px;letter-spacing:.14em}