/* OxidativeState Gym — original app styles. Black, white, thin lines, Anton headings. */
:root { --bg:#000; --ink:#fff; --ink2:#a3a3a3; --ink3:#6b6b6b; --line:#2a2a2a; --line2:#fff; --card:#0a0a0a; --ok:#fff; --warn:#ffb020; --hot:#ff5a4f; --sab:env(safe-area-inset-bottom,0px); }
* { box-sizing:border-box; margin:0; }
html, body { background:var(--bg); color:var(--ink); }
body { font-family:Geist, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; font-size:16px; line-height:1.45; -webkit-tap-highlight-color:transparent; }
[hidden] { display:none !important; }
button, input, select { font:inherit; color:inherit; }
button { cursor:pointer; background:none; border:0; }
a { color:inherit; }
svg { fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.app { max-width:640px; margin:0 auto; min-height:100vh; padding:18px 16px calc(96px + var(--sab)); }
h1 { font-family:Anton, Impact, sans-serif; font-weight:400; font-size:34px; letter-spacing:.02em; text-transform:uppercase; line-height:1.05; }
h2 { font-family:Anton, Impact, sans-serif; font-weight:400; font-size:21px; letter-spacing:.05em; text-transform:uppercase; margin:26px 2px 10px; }
.sub { color:var(--ink2); font-size:14.5px; margin-top:4px; }
.top { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; margin-bottom:18px; }
.icon-btn { width:42px; height:42px; flex:none; display:grid; place-items:center; border:1px solid var(--line); border-radius:50%; }
.icon-btn svg { width:19px; height:19px; }
.icon-btn:hover { border-color:#fff; }
.card { border:1px solid var(--line); border-radius:18px; background:var(--card); padding:16px; margin-bottom:12px; }
.row { display:flex; align-items:center; gap:12px; }
.grow { flex:1; min-width:0; }
.muted { color:var(--ink2); } .small { font-size:13.5px; } .tiny { font-size:12px; letter-spacing:.12em; text-transform:uppercase; color:var(--ink3); font-family:"Geist Mono", ui-monospace, monospace; }
.btn { display:inline-flex; align-items:center; justify-content:center; gap:8px; min-height:50px; padding:0 20px; border:1px solid var(--line2); border-radius:14px; font-weight:600; text-decoration:none; transition:background-color .15s, color .15s, transform .1s; }
.btn:active { transform:scale(.98); }
.btn--fill { background:#fff; color:#000; }
.btn--ghost { border-color:var(--line); color:var(--ink); }
.btn--block { width:100%; }
.btn--sm { min-height:38px; padding:0 14px; border-radius:11px; font-size:14px; }
.btn--danger { border-color:#5a1f1b; color:var(--hot); }
.btn:hover { background:#fff; color:#000; }
.btn--fill:hover { background:#d9d9d9; }
.btn--danger:hover { background:var(--hot); color:#000; border-color:var(--hot); }

/* tab bar */
.tabs { position:fixed; left:0; right:0; bottom:0; z-index:20; display:flex; justify-content:center; gap:4px; padding:8px 10px calc(8px + var(--sab)); background:rgba(0,0,0,.9); backdrop-filter:blur(14px); border-top:1px solid var(--line); }
.tabs a { flex:1; max-width:118px; display:flex; flex-direction:column; align-items:center; gap:3px; padding:6px 2px; color:var(--ink3); text-decoration:none; font-size:11px; font-weight:600; }
.tabs svg { width:23px; height:23px; }
.tabs a.on { color:#fff; }
.tabs__go { color:#000 !important; }
.tabs__go svg { width:52px; height:52px; padding:13px; margin-top:-22px; border-radius:50%; background:#fff; box-shadow:0 0 0 6px #000, 0 0 26px rgba(255,255,255,.3); }
.tabs__go span { color:#fff; }

/* week strip */
.week { display:grid; grid-template-columns:repeat(7,1fr); gap:6px; }
.day { display:flex; flex-direction:column; align-items:center; gap:4px; padding:8px 0; border:1px solid transparent; border-radius:12px; color:var(--ink2); font-size:11px; letter-spacing:.08em; }
.day b { font-size:17px; font-weight:600; color:#fff; letter-spacing:0; }
.day i { width:5px; height:5px; border-radius:50%; background:transparent; }
.day.has i { background:#fff; } .day.done i { background:#fff; box-shadow:0 0 8px #fff; }
.day.today { border-color:#fff; }
.day.sel { background:#fff; color:#000; } .day.sel b { color:#000; } .day.sel i { background:#000; box-shadow:none; }

/* lists */
.list { list-style:none; padding:0; }
.ex { display:flex; align-items:center; gap:12px; padding:9px 0; border-bottom:1px solid #161616; }
.ex:last-child { border-bottom:0; }
.ex img { width:54px; height:54px; flex:none; border-radius:10px; background:#fff; object-fit:cover; }
.ex__t { font-weight:600; font-size:15.5px; line-height:1.25; }
.ex__s { font-size:13px; color:var(--ink2); text-transform:capitalize; }
.chips { display:flex; gap:8px; overflow-x:auto; padding:2px 0 10px; scrollbar-width:none; }
.chips::-webkit-scrollbar { display:none; }
.chip { flex:none; padding:7px 14px; border:1px solid var(--line); border-radius:999px; font-size:13.5px; text-transform:capitalize; white-space:nowrap; }
.chip.on { background:#fff; color:#000; border-color:#fff; }
.search { display:flex; align-items:center; gap:10px; padding:0 14px; border:1px solid #3a3a3a; border-radius:999px; margin-bottom:12px; }
.search:focus-within { border-color:#fff; }
.search svg { width:18px; height:18px; color:var(--ink3); flex:none; }
.search input { flex:1; min-width:0; height:48px; border:0; outline:none; background:transparent; }
.field { width:100%; height:48px; padding:0 14px; border:1px solid #3a3a3a; border-radius:12px; background:#000; outline:none; }
.field:focus { border-color:#fff; }
select.field { appearance:none; }

/* plan */
.pday { display:flex; align-items:center; gap:12px; padding:12px 0; border-bottom:1px solid #161616; }
.pday:last-child { border-bottom:0; }
.pday__d { width:44px; font-family:Anton, sans-serif; font-size:17px; letter-spacing:.06em; }
.pday select { flex:1; }
.stepper { display:inline-flex; align-items:center; border:1px solid var(--line); border-radius:10px; }
.stepper button { width:34px; height:36px; font-size:18px; }
.stepper span { min-width:30px; text-align:center; font-weight:600; font-variant-numeric:tabular-nums; }

/* workout */
.wx { padding:14px; }
.wx__head { display:flex; gap:12px; align-items:center; margin-bottom:10px; }
.wx__head img { width:76px; height:76px; border-radius:12px; background:#fff; flex:none; }
.set { display:grid; grid-template-columns:28px 1fr 1fr 46px; gap:8px; align-items:center; padding:5px 0; }
.set__n { color:var(--ink3); font-family:"Geist Mono", monospace; font-size:13px; text-align:center; }
.set input { width:100%; height:44px; text-align:center; border:1px solid var(--line); border-radius:10px; background:#000; outline:none; font-weight:600; font-size:17px; }
.set input:focus { border-color:#fff; }
.set__ok { height:44px; border:1px solid var(--line); border-radius:10px; display:grid; place-items:center; }
.set__ok svg { width:18px; height:18px; opacity:.35; }
.set.done input { border-color:#fff; }
.set.done .set__ok { background:#fff; color:#000; border-color:#fff; }
.set.done .set__ok svg { opacity:1; }
.set__hd { color:var(--ink3); font-size:11px; letter-spacing:.12em; text-transform:uppercase; text-align:center; }
.pr { display:inline-block; margin-left:8px; padding:1px 7px; border-radius:6px; background:#fff; color:#000; font-size:11px; font-weight:700; letter-spacing:.06em; }
.timer { position:fixed; left:50%; transform:translateX(-50%); bottom:calc(92px + var(--sab)); z-index:15; display:flex; align-items:center; gap:14px; padding:10px 14px 10px 18px; background:#fff; color:#000; border-radius:999px; font-weight:700; box-shadow:0 10px 40px rgba(0,0,0,.6); }
.timer b { font-family:Anton, sans-serif; font-weight:400; font-size:22px; letter-spacing:.04em; font-variant-numeric:tabular-nums; }
.timer button { padding:6px 12px; border-radius:999px; background:#000; color:#fff; font-size:13px; }

/* body map */
.body { display:grid; grid-template-columns:1fr 1fr; gap:6px; }
.body svg { width:100%; height:auto; stroke:none; }
.body .m { fill:#3d3d3d; stroke:#000; stroke-width:1.5; cursor:pointer; transition:fill .15s; }
.body .m:hover, .body .m.on { fill:#fff; }
.body .sk { fill:#161616; stroke:none; }
.body__cap { text-align:center; font-size:11px; letter-spacing:.16em; text-transform:uppercase; color:var(--ink3); margin-top:4px; }

/* stats */
.bars { display:flex; align-items:flex-end; gap:8px; height:120px; }
.bars div { flex:1; display:flex; flex-direction:column; justify-content:flex-end; align-items:center; gap:6px; height:100%; }
.bars i { width:100%; border-radius:6px 6px 2px 2px; background:#fff; min-height:2px; }
.bars span { font-size:10.5px; color:var(--ink3); }
.kpis { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; }
.kpi { border:1px solid var(--line); border-radius:14px; padding:12px; }
.kpi b { display:block; font-family:Anton, sans-serif; font-weight:400; font-size:26px; letter-spacing:.02em; }
.kpi span { font-size:12px; color:var(--ink2); }
.spark { width:100%; height:90px; }
.spark path { stroke:#fff; stroke-width:2; }

/* sheet */
.sheet { position:fixed; inset:0; z-index:40; background:rgba(0,0,0,.7); display:flex; align-items:flex-end; justify-content:center; }
.sheet__panel { position:relative; width:100%; max-width:640px; max-height:90vh; overflow-y:auto; background:#000; border:1px solid var(--line); border-bottom:0; border-radius:22px 22px 0 0; padding:22px 16px calc(24px + var(--sab)); }
.sheet__x { position:absolute; top:12px; right:12px; width:36px; height:36px; border-radius:50%; border:1px solid var(--line); font-size:20px; line-height:1; }
.demo { display:block; width:100%; max-width:300px; margin:0 auto 14px; border-radius:16px; background:#fff; aspect-ratio:1; object-fit:contain; }
.steps { padding-left:20px; display:grid; gap:8px; color:#d6d6d6; font-size:15px; }
.empty { text-align:center; color:var(--ink2); padding:26px 10px; }
.credit { margin-top:22px; font-size:11.5px; color:var(--ink3); text-align:center; line-height:1.6; }
.credit a { color:var(--ink2); }
@media (min-width:700px) { .app { padding-top:28px; } }