:root{
  --bg:#f3f4f6;--card:#fff;--text:#111827;--muted:#6b7280;--line:#e5e7eb;
  --accent:#111827;--soft:#f9fafb;--ok:#166534;
}
*{box-sizing:border-box}
html{font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:var(--bg);color:var(--text)}
body{margin:0;min-height:100vh}
.topbar{max-width:880px;margin:0 auto;padding:28px 18px 14px;display:flex;justify-content:space-between;gap:18px;align-items:flex-start}
.eyebrow{font-size:.78rem;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);font-weight:700}
h1{margin:3px 0 4px;font-size:2rem}
.motto{margin:0;color:var(--muted);font-size:.94rem}
.install,.primary,.tab{border:0;border-radius:12px;cursor:pointer;font-weight:700}
.install{padding:11px 14px;background:#fff;border:1px solid var(--line);color:var(--text)}
main{max-width:880px;margin:0 auto;padding:0 18px 34px}
.card{background:var(--card);border:1px solid var(--line);border-radius:18px;padding:18px;margin-bottom:14px;box-shadow:0 4px 18px rgba(17,24,39,.04)}
.hero{display:flex;justify-content:space-between;align-items:center;gap:20px}
.label{font-size:.78rem;color:var(--muted);text-transform:uppercase;font-weight:700}
h2{margin:4px 0;font-size:1.35rem}
.hero p{margin:0;color:var(--muted)}
.score{min-width:92px;text-align:center;background:var(--soft);border-radius:14px;padding:12px}
.score strong{display:block;font-size:1.45rem}
.score span{font-size:.75rem;color:var(--muted)}
.tabs{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:12px 0}
.tab{padding:11px;background:#e5e7eb;color:#374151}
.tab.active{background:var(--accent);color:#fff}
.panel{display:none}.panel.active{display:block}
.section-head{display:flex;align-items:center;justify-content:space-between;gap:12px}
h3{margin:0 0 14px;font-size:1.05rem}
.muted{color:var(--muted);font-size:.85rem}
.schedule-table{width:100%;border-collapse:collapse}
.schedule-table td{padding:10px 6px;border-top:1px solid var(--line);vertical-align:top}
.schedule-table tr:first-child td{border-top:0}
.schedule-table td:first-child{width:120px;font-weight:700;white-space:nowrap}
.checklist{display:grid;gap:8px}
.task{display:flex;align-items:flex-start;gap:12px;padding:12px;border:1px solid var(--line);border-radius:12px;background:var(--soft)}
.task input{margin-top:3px;width:20px;height:20px}
.task.done label{text-decoration:line-through;color:var(--muted)}
.field{display:block;margin:12px 0}
.field span{display:block;font-size:.83rem;font-weight:700;margin-bottom:6px}
input[type=text],textarea{width:100%;border:1px solid var(--line);border-radius:11px;padding:11px;font:inherit;background:#fff;color:var(--text)}
.primary{background:var(--accent);color:#fff;padding:12px 16px;width:100%;font-size:.95rem}
.save-status{font-size:.82rem;color:var(--ok);padding-top:8px;min-height:22px}
.week-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:8px}
.day-card{border:1px solid var(--line);border-radius:12px;padding:10px;background:var(--soft);min-height:96px}
.day-card strong{display:block;font-size:.86rem}
.day-card span{font-size:.76rem;color:var(--muted)}
.day-card .pct{font-size:1.1rem;color:var(--text);margin-top:8px}
.month-summary{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:16px}
.month-summary div{background:var(--soft);padding:12px;border-radius:12px;text-align:center}
.month-summary strong{display:block;font-size:1.25rem}
.month-summary span{font-size:.72rem;color:var(--muted)}
.month-list{display:grid;gap:8px}
.month-item{border-top:1px solid var(--line);padding-top:10px}
.month-item:first-child{border-top:0}
.month-item strong{font-size:.9rem}
.month-item p{margin:4px 0 0;color:var(--muted);font-size:.84rem}
footer{max-width:880px;margin:0 auto;padding:0 18px 24px;color:var(--muted);font-size:.76rem}
@media(max-width:640px){
  .topbar{padding-top:20px}.topbar{flex-direction:column}.install{width:100%}
  .hero{align-items:flex-start}.schedule-table td:first-child{width:94px}
  .week-grid{grid-template-columns:repeat(2,1fr)}
  .month-summary{grid-template-columns:1fr}
}

.week-schedule{display:grid;gap:10px}
.week-day-row{border:1px solid var(--line);border-radius:14px;background:var(--soft);overflow:hidden}
.week-day-head{padding:12px 14px;display:flex;justify-content:space-between;gap:12px;align-items:center;background:#fff}
.week-day-head strong{font-size:.95rem}
.week-day-head span{font-size:.78rem;color:var(--muted);text-align:right}
.week-day-body{padding:4px 12px 10px}
.week-day-body table{width:100%;border-collapse:collapse}
.week-day-body td{padding:8px 4px;border-top:1px solid var(--line);vertical-align:top;font-size:.87rem}
.week-day-body td:first-child{width:118px;font-weight:700;white-space:nowrap}
.week-rule{margin:8px 2px 2px;padding:9px 10px;border-radius:10px;background:#fff;font-size:.82rem;color:var(--muted)}
@media(max-width:640px){
  .week-day-head{align-items:flex-start;flex-direction:column}
  .week-day-head span{text-align:left}
  .week-day-body td:first-child{width:92px}
}