:root{ --bg:#f1f5f9; --fg:#0f172a; --card:#fff; --muted:#64748b; --ok:#10b981; --accent:#0ea5e9; --warn:#f59e0b; }
*{ box-sizing:border-box; }
body{ margin:0; font-family: system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif; background:var(--bg); color:var(--fg); }
.container{ max-width:1100px; margin:0 auto; padding:16px; }
.card{ background:var(--card); border-radius:16px; padding:16px; box-shadow:0 2px 8px rgba(0,0,0,.06); margin-bottom:16px; }
.small-card{ padding:12px; }
.banner{ background:#fff7ed; border:1px solid #fed7aa; color:#92400e; padding:10px 12px; border-radius:12px; margin-bottom:8px; }
h1{ margin:0 0 8px; font-size:24px; } h2{ margin:0 0 8px; font-size:18px; } h3{ margin:8px 0; }
.big{ font-weight:700; font-size:18px; }
.small{ font-size:12px; }
.muted{ color:var(--muted); }
.divider{ height:1px; background:#e2e8f0; margin:12px 0; }
.table table{ width:100%; border-collapse:collapse; }
.table th, .table td{ text-align:left; padding:8px; border-bottom:1px solid #e2e8f0; }

.tabs{ display:flex; gap:8px; flex-wrap:wrap; margin-bottom:8px; }
.tab{ background:#e2e8f0; border:0; padding:8px 12px; border-radius:16px; }
.tab.active{ background:#fff; }

.grid{ display:grid; gap:16px; }
.grid-2{ grid-template-columns:2fr 1fr; }
@media(max-width:900px){ .grid-2{ grid-template-columns:1fr; } }

input,select,button{ font-size:16px; }
input,select{ width:100%; padding:12px; border:1px solid #cbd5e1; border-radius:12px; background:#fff; }
button{ border-radius:12px; padding:10px 14px; border:0; }
.btn{ background:var(--ok); color:#fff; } .btn.secondary{ background:#e2e8f0; color:#0f172a; }
.row{ display:grid; grid-template-columns:1fr 1fr; gap:8px; margin:8px 0; }

.sets-head{ display:grid; grid-template-columns:1.2fr 1.2fr 1.2fr 3fr 40px; gap:8px; color:var(--muted); margin-top:8px; }
.sets-grid{ display:grid; grid-template-columns:1.2fr 1.2fr 1.2fr 3fr 40px; gap:8px; margin:6px 0; }

.progress{ height:10px; background:#e2e8f0; border-radius:999px; overflow:hidden; margin:6px 0; }
.progress span{ display:block; height:100%; width:0; background:var(--ok); }

.list{ max-height:320px; overflow:auto; }
.timer{ font-size:28px; font-weight:700; margin-top:8px; }

.program{ display:grid; gap:12px; }
.program .day{ border:1px solid #e2e8f0; border-radius:12px; padding:12px; }
.program .title{ font-weight:700; margin-bottom:6px; }
.program .ex{ font-size:14px; color:#64748b; }

.chart{ width:100%; max-width:100%; background:#fff; border:1px solid #e2e8f0; border-radius:8px; }

:root.dark{ --bg:#0b1220; --fg:#e6edf3; --card:#0f172a; --muted:#8aa2c0; }
:root.dark .tab.active{ background:#0f172a; }
:root.dark input, :root.dark select{ background:#0f172a; color:#e6edf3; border-color:#253046; }
:root.dark .btn.secondary{ background:#1f2a3a; color:#e6edf3; }
:root.dark .chart{ background:#0f172a; border-color:#253046; }

.table{overflow:auto}
#plan-table input{width:100%;}
#plan-table td{min-width:140px}

.tab a{ color:inherit; text-decoration:none; display:block; }