:root{
  --bg:#fffafa;--card:#ffffff;--ink:#2d2929;--muted:#786f70;
  --pink:#f7a9b4;--pink-deep:#e76f82;--green:#9bc9a4;--blue:#a9c8e8;
  --yellow:#f6d98a;--lav:#c8b8df;--line:#eadfe0;--shadow:0 12px 30px rgba(89,58,65,.09);
  --safe-bottom:max(12px, env(safe-area-inset-bottom));
}
*{box-sizing:border-box}
html{font-family:-apple-system,BlinkMacSystemFont,"PingFang TC","Noto Sans TC","Microsoft JhengHei",sans-serif;background:var(--bg);color:var(--ink)}
body{margin:0;min-height:100vh;background:linear-gradient(180deg,#fff7f8 0,#fffdfa 45%,#f8fbff 100%);padding-bottom:calc(78px + var(--safe-bottom))}
button,input,textarea{font:inherit}
button{cursor:pointer}
.topbar{position:sticky;top:0;z-index:20;display:flex;justify-content:space-between;align-items:center;padding:18px 18px 12px;background:rgba(255,250,250,.9);backdrop-filter:blur(14px);border-bottom:1px solid rgba(234,223,224,.8)}
.topbar h1{font-size:1.25rem;margin:2px 0 0}
.eyebrow{margin:0;color:var(--pink-deep);font-size:.76rem;font-weight:800;letter-spacing:.12em}
main{width:min(760px,100%);margin:auto;padding:14px}
.view{display:none;animation:fade .18s ease}
.view.active{display:block}
@keyframes fade{from{opacity:.4;transform:translateY(4px)}to{opacity:1;transform:none}}
.mode-switch{display:grid;grid-template-columns:1fr 1fr;background:#f3e9ea;border-radius:16px;padding:4px;margin:2px 0 14px}
.mode-switch.compact{width:210px;margin:0}
.mode-btn{border:0;background:transparent;padding:10px;border-radius:12px;color:var(--muted);font-weight:800}
.mode-btn.active{background:#fff;box-shadow:0 3px 10px rgba(70,40,45,.08);color:var(--pink-deep)}
.hero-card,.section-card,.mini-card,.plan-card{background:var(--card);border:1px solid var(--line);box-shadow:var(--shadow)}
.hero-card{border-radius:26px;padding:22px;background:linear-gradient(135deg,#fff 20%,#fff0f2 100%)}
.hero-card h2{font-size:1.75rem;margin:12px 0 6px}
.hero-card p{margin:4px 0}
.hero-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:20px}
.primary-btn,.secondary-btn,.ghost-btn{border-radius:14px;padding:12px 16px;font-weight:800;border:0}
.primary-btn{background:var(--pink-deep);color:#fff;box-shadow:0 8px 18px rgba(231,111,130,.25)}
.secondary-btn{background:#fff;border:1px solid var(--line);color:var(--ink)}
.ghost-btn{background:#fff;border:1px solid var(--line);padding:9px 12px}
.hidden{display:none!important}
.plan-badge{display:inline-flex;background:#ffe6ea;color:#b44d61;padding:6px 10px;border-radius:999px;font-weight:900;font-size:.82rem}
.duration{color:#8b6370;font-weight:700}
.muted{color:var(--muted)}
.section-card{border-radius:22px;padding:18px;margin-top:14px}
.section-title-row,.page-heading{display:flex;align-items:center;justify-content:space-between;gap:12px}
.section-title-row h3,.section-card h3{margin:0}
.page-heading{padding:8px 2px 12px}
.page-heading h2{margin:2px 0 0;font-size:1.5rem}
.small-pill{background:#f5eef0;border-radius:999px;padding:5px 9px;font-size:.78rem;font-weight:800}
.week-strip{display:grid;grid-template-columns:repeat(7,1fr);gap:7px;margin-top:14px}
.day-chip{display:flex;flex-direction:column;align-items:center;gap:5px;padding:9px 2px;border-radius:14px;background:#faf5f6;font-size:.75rem}
.day-chip.today{outline:2px solid var(--pink)}
.day-chip.done{background:#eaf6ed}
.day-chip b{font-size:.85rem}
.stats-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:14px}
.mini-card{border-radius:18px;padding:14px}
.mini-card span{font-size:.74rem;color:var(--muted)}
.mini-card strong{display:block;margin-top:6px;font-size:1rem}
.plan-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:14px}
.plan-card{border-radius:18px;padding:14px;text-align:left}
.plan-card h4{margin:7px 0 5px;font-size:.96rem}
.plan-card p{margin:0;color:var(--muted);font-size:.78rem;line-height:1.45}
.plan-card .plan-letter{width:32px;height:32px;display:grid;place-items:center;border-radius:50%;font-weight:900;background:#ffe4e8;color:#b84e60}
.plan-card:nth-child(2) .plan-letter{background:#eaf5ec;color:#4a8659}
.plan-card:nth-child(3) .plan-letter{background:#eaf2fb;color:#4f77a0}
.plan-list{display:grid;gap:12px}
.plan-row{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:12px;border:1px solid var(--line);background:#fff;border-radius:20px;padding:15px;box-shadow:var(--shadow)}
.plan-row .plan-letter{width:44px;height:44px;display:grid;place-items:center;border-radius:15px;background:#ffe6ea;color:#b84e60;font-weight:900;font-size:1.2rem}
.plan-row h3{margin:0 0 4px}
.plan-row p{margin:0;color:var(--muted);font-size:.84rem}
.plan-actions{display:flex;flex-direction:column;gap:6px}
.icon-action{border:1px solid var(--line);background:#fff;border-radius:12px;padding:8px 10px;font-weight:700}
.guide-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin-top:12px}
.guide-thumb{border:1px solid var(--line);background:#fff;border-radius:16px;padding:0;overflow:hidden;text-align:left}
.guide-thumb img{width:100%;aspect-ratio:3/4;object-fit:cover;object-position:top;display:block}
.guide-thumb span{display:block;padding:10px;font-weight:800}
.text-btn{border:0;background:transparent;color:#946673;font-weight:800}
.text-btn.danger{color:#c75063}
.history-list,.body-records{display:grid;gap:10px;margin-top:12px}
.empty-state{padding:24px;text-align:center;color:var(--muted);background:#faf6f7;border-radius:16px}
.history-item,.body-item{display:flex;justify-content:space-between;gap:12px;padding:13px;border-radius:16px;background:#faf6f7}
.history-item h4,.body-item h4{margin:0 0 4px}
.history-item p,.body-item p{margin:0;color:var(--muted);font-size:.8rem}
.button-row{display:flex;gap:10px;flex-wrap:wrap;margin-top:12px}
.file-label{display:inline-block;cursor:pointer}
.file-label input{display:none}
.tiny-note{font-size:.76rem;color:var(--muted)}
.form-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin-top:14px}
.form-grid label{display:grid;gap:6px;font-size:.82rem;font-weight:700;color:var(--muted)}
.form-grid input,.session-tools textarea{width:100%;border:1px solid var(--line);border-radius:13px;padding:12px;background:#fff;color:var(--ink)}
.full{width:100%;grid-column:1/-1}
details{border-top:1px solid var(--line);padding:12px 0}
details:first-of-type{margin-top:8px}
summary{font-weight:800;cursor:pointer}
details p{color:var(--muted);line-height:1.6}
.bottom-nav{position:fixed;left:0;right:0;bottom:0;z-index:30;display:grid;grid-template-columns:repeat(4,1fr);padding:8px 10px var(--safe-bottom);background:rgba(255,255,255,.94);backdrop-filter:blur(16px);border-top:1px solid var(--line)}
.nav-btn{border:0;background:transparent;color:#857b7d;font-size:.72rem;font-weight:800;padding:5px}
.nav-btn span{display:block;font-size:1.15rem;margin-bottom:2px}
.nav-btn.active{color:var(--pink-deep)}
.app-dialog{width:min(720px,calc(100% - 20px));max-height:92vh;border:0;border-radius:26px;padding:0;background:#fff;color:var(--ink);box-shadow:0 30px 80px rgba(40,25,30,.3)}
.app-dialog::backdrop{background:rgba(38,27,30,.55);backdrop-filter:blur(4px)}
.dialog-head{position:sticky;top:0;z-index:3;display:flex;justify-content:space-between;gap:12px;align-items:flex-start;padding:18px;background:#fff;border-bottom:1px solid var(--line)}
.dialog-head h2{margin:8px 0 2px}
.icon-btn{width:40px;height:40px;border-radius:50%;border:1px solid var(--line);background:#fff;font-size:1.5rem}
.progress-line{height:6px;background:#f1e8ea}
.progress-line span{display:block;height:100%;width:0;background:var(--pink-deep);transition:width .2s}
.exercise-list{padding:12px 16px;display:grid;gap:10px}
.exercise-card{display:grid;grid-template-columns:auto 1fr;gap:12px;padding:14px;border:1px solid var(--line);border-radius:18px;background:#fff}
.exercise-card.done{background:#eef8f0;border-color:#b9dfc1}
.exercise-check{width:26px;height:26px;accent-color:var(--pink-deep)}
.exercise-card h4{margin:0 0 4px}
.exercise-card p{margin:2px 0;color:var(--muted);font-size:.82rem;line-height:1.45}
.weight-field{display:flex;align-items:center;gap:7px;margin-top:8px}
.weight-field input{width:90px;border:1px solid var(--line);border-radius:10px;padding:8px}
.session-tools{padding:0 16px 22px}
.timer-card{background:#fff4f6;border:1px solid #f4d3d9;border-radius:18px;padding:15px;margin-bottom:12px}
.timer-card strong{font-size:1.8rem;display:block;margin:5px 0}
.compact-row{margin-top:7px}
.timer-btn{border:1px solid #eccbd1;background:#fff;border-radius:10px;padding:8px 10px}
.image-dialog{padding-bottom:14px}
.image-dialog img{width:100%;display:block}
.toast{position:fixed;left:50%;bottom:100px;z-index:100;transform:translate(-50%,20px);opacity:0;pointer-events:none;background:#332c2d;color:#fff;padding:11px 16px;border-radius:999px;font-weight:700;transition:.2s;max-width:90%;text-align:center}
.toast.show{opacity:1;transform:translate(-50%,0)}
@media (min-width:720px){
  .topbar{padding-left:calc((100% - 760px)/2 + 16px);padding-right:calc((100% - 760px)/2 + 16px)}
  .hero-card{display:grid;grid-template-columns:1fr auto;align-items:end}
  .hero-actions{flex-direction:column}
}
@media (max-width:560px){
  .stats-grid,.plan-grid{grid-template-columns:1fr}
  .plan-card{display:grid;grid-template-columns:auto 1fr;gap:10px}
  .plan-card .plan-letter{grid-row:1/3}
  .plan-card h4{margin:0}
  .page-heading{align-items:flex-start;flex-direction:column}
  .mode-switch.compact{width:100%}
  .guide-grid{grid-template-columns:1fr 1fr}
  .form-grid{grid-template-columns:1fr}
  .plan-row{grid-template-columns:auto 1fr}
  .plan-actions{grid-column:1/-1;flex-direction:row}
}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}