:root { --bg:#16110f; --card:#241b17; --ink:#f4ece6; --muted:#b3a79f; --accent:#e8743b; --good:#5fb87a; --bad:#e2574c; }
* { box-sizing: border-box; }
body { margin:0; font-family: system-ui, -apple-system, Segoe UI, Roboto, sans-serif; background:var(--bg); color:var(--ink); padding:16px 16px 96px; max-width:680px; margin:0 auto; }
h1 { font-size:1.6rem; margin:.2rem 0; }
h2 { font-size:1.05rem; margin:0 0 .6rem; }
.hidden { display:none !important; }
.muted { color:var(--muted); font-size:.9rem; }
.error { color:var(--bad); }
.why { color:var(--accent); font-weight:600; font-size:1.05rem; }
header { margin-bottom:16px; }
.block { background:var(--card); border-radius:14px; padding:14px; margin:12px 0; }
.card-grid { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.card { background:var(--card); border-radius:14px; padding:14px; }
.card .big { font-size:1.5rem; font-weight:700; }
.bar { height:10px; background:#3a2c25; border-radius:6px; overflow:hidden; margin-top:8px; }
.bar > span { display:block; height:100%; background:var(--accent); }
.bar.weight > span { background:var(--good); }
.row { display:flex; gap:8px; flex-wrap:wrap; align-items:center; }
input { flex:1 1 90px; min-width:0; padding:10px; border-radius:10px; border:1px solid #3a2c25; background:#1c1512; color:var(--ink); }
button { padding:10px 14px; border:0; border-radius:10px; background:var(--accent); color:#1a0f0a; font-weight:700; cursor:pointer; }
button.ghost { background:transparent; color:var(--muted); border:1px solid #3a2c25; }
.chips { display:flex; gap:8px; flex-wrap:wrap; margin-bottom:10px; }
.chip { background:#1c1512; border:1px solid #3a2c25; color:var(--ink); font-weight:600; }
ul { list-style:none; padding:0; margin:8px 0 0; }
li { display:flex; justify-content:space-between; padding:8px 0; border-bottom:1px solid #2e221d; }
li button { background:transparent; color:var(--bad); padding:2px 8px; }
.flag { font-weight:600; }
.flag.low, .flag.high { color:var(--bad); }
.flag.ok { color:var(--good); }
#antisnack { position:fixed; left:16px; right:16px; bottom:16px; max-width:648px; margin:0 auto; background:var(--bad); color:#fff; font-size:1.1rem; padding:16px; box-shadow:0 6px 20px rgba(0,0,0,.4); }
#modal { position:fixed; inset:0; background:rgba(0,0,0,.7); display:flex; align-items:center; justify-content:center; padding:16px; }
.modal-card { background:var(--card); border-radius:16px; padding:20px; max-width:420px; }
.reframe { font-size:1.1rem; }
.cooldown { font-size:1.2rem; font-weight:700; }
.training-item { display:flex; align-items:center; gap:10px; padding:6px 0; }
.training-item input { flex:0 0 auto; }
.workout { background:#1c1512; border:1px solid #3a2c25; border-radius:12px; padding:12px; margin:10px 0; }
.workout-head { margin-bottom:4px; }
.exlist { margin:6px 0 8px; }
.exlist li { padding:6px 0; }
.exlist li span:last-child { color:var(--muted); white-space:nowrap; padding-left:12px; }
.settings-field { display:block; margin:10px 0; }
.settings-field > span { display:block; color:var(--muted); font-size:.85rem; margin-bottom:4px; }
.settings-field > input { width:100%; }
.settings-pair { display:flex; gap:8px; }
#settings-form > button { width:100%; margin-top:6px; }