/* Ledger — Strong-style light iOS theme. White surfaces, system blue, gray-grouped
   fills, green-tinted completed sets. One design language: Apple's, like Strong. */
:root{
  --bg:#ffffff;
  --surface:#ffffff;          /* cards sit on white with hairlines */
  --surface-2:#f2f2f7;        /* inputs, raised fills (iOS systemGray6) */
  --ink:#000000;
  --ink-soft:#6d6d72;
  --ink-faint:#aeaeb2;
  --line:rgba(60,60,67,.12);
  --line-2:rgba(60,60,67,.22);
  --accent:#007aff;           /* iOS system blue — Strong's blue */
  --accent-soft:rgba(0,122,255,.10);
  --good:#34c759;
  --good-soft:#e7f8ec;        /* Strong's completed-set row tint */
  --danger:#ff3b30;
  --muscle:#ff5a4d;
  --radius:12px;
  --radius-sm:10px;
  --sans:-apple-system, BlinkMacSystemFont, 'SF Pro Text', 'SF Pro Display', 'Helvetica Neue', system-ui, sans-serif;
}

*{box-sizing:border-box; -webkit-tap-highlight-color:transparent;}
html,body{margin:0; padding:0; height:100%;}
body{
  background:var(--bg);
  color:var(--ink);
  font-family:var(--sans);
  font-size:16px; line-height:1.32;
  -webkit-font-smoothing:antialiased;
  overscroll-behavior-y:none;
  letter-spacing:-.014em;
}
button{font-family:inherit; color:inherit; cursor:pointer;}
input,select{font-family:inherit;}

#app{display:flex; flex-direction:column; height:100dvh; max-width:520px; margin:0 auto;}

/* ---- Top bar ---- */
#topbar{display:flex; align-items:center; justify-content:space-between; padding:calc(env(safe-area-inset-top) + 10px) 16px 8px; background:var(--bg);}
#topbar-title{font-size:28px; font-weight:800; letter-spacing:-.022em;}
#topbar-action button{background:none; border:none; border-radius:999px; font-size:16px; padding:6px 4px; color:var(--accent); font-weight:600;}

/* ---- View ---- */
#view{flex:1; overflow-y:auto; -webkit-overflow-scrolling:touch; padding:2px 16px 24px; background:var(--bg);}
.hidden{display:none !important;}
h2.section{font-size:13px; text-transform:uppercase; letter-spacing:.06em; color:var(--ink-soft); font-weight:600; margin:18px 0 8px;}
.muted{color:var(--ink-soft);} .center{text-align:center;}

/* ---- Surfaces ---- */
.glass, .card{background:var(--surface); border:1px solid var(--line); border-radius:var(--radius);}
.card{padding:13px; margin-bottom:10px;}
.row{display:flex; align-items:center; gap:10px;} .spread{justify-content:space-between;}

/* ---- Buttons — Strong's tinted style: blue tint + bold blue text ---- */
.btn{display:block; width:100%; text-align:center; padding:12px; border:1px solid transparent; border-radius:10px; background:var(--surface-2); color:var(--ink); font-size:16px; font-weight:600; letter-spacing:-.01em;}
.btn.accent{background:var(--accent-soft); color:var(--accent); font-weight:700;}
.btn.primary{background:var(--accent); color:#fff; font-weight:700;}
.btn.finish{background:var(--good-soft); color:#1e9e46; font-weight:700;}
.btn.ghost{background:var(--surface-2); border-color:transparent; color:var(--ink);}
.btn.small{display:inline-block; width:auto; padding:7px 14px; font-size:14px; border-radius:9px; font-weight:600;}
.btn:active{opacity:.6;}

/* ---- Library ---- */
#search{width:100%; padding:10px 14px; margin:6px 0; border:none; border-radius:11px; background:var(--surface-2); color:var(--ink); font-size:17px;}
#search::placeholder{color:var(--ink-faint);}
#search:focus{outline:none;}
.filters{display:flex; gap:7px; overflow-x:auto; padding:6px 0 4px; margin:0 -2px; scrollbar-width:none;}
.filters::-webkit-scrollbar{display:none;}
.chip{flex:0 0 auto; padding:6px 13px; border:none; border-radius:999px; font-size:13.5px; background:var(--surface-2); color:var(--ink-soft); white-space:nowrap; font-weight:500;}
.chip.on{background:var(--accent); color:#fff; font-weight:600;}
.count-note{font-size:13px; color:var(--ink-faint); padding:6px 2px 2px;}
.lib-letter{font-size:13px; text-transform:uppercase; letter-spacing:.06em; color:var(--ink-soft); font-weight:600; margin:14px 0 3px;}

.ex-item{display:flex; align-items:center; gap:12px; padding:9px 2px; border-bottom:1px solid var(--line);}
.ex-thumb{width:42px; height:48px; flex:0 0 auto; display:flex; align-items:center; justify-content:center; border-radius:14px; background:var(--surface-2); overflow:hidden;}
.ex-thumb svg{height:46px; width:auto;}
.ex-meta{flex:1; min-width:0;} .ex-meta .ex-name{font-size:16px; font-weight:600; line-height:1.2; letter-spacing:-.01em;}
.ex-sub{font-size:13px; color:var(--ink-soft); text-transform:capitalize; margin-top:1.5px;}
.ex-add{width:32px; height:32px; flex:0 0 auto; font-size:20px; line-height:1; border:none; border-radius:50%; background:var(--accent-soft); color:var(--accent); font-weight:600;}

/* ---- Active workout ---- */
.wk-header{margin:8px 0 4px;}
.wk-elapsed{font-variant-numeric:tabular-nums; font-size:14px; color:var(--ink-soft);}
.ex-block{padding:13px 13px 11px; margin-bottom:10px; background:var(--surface); border:1px solid var(--line); border-radius:var(--radius);}
.ex-block h3{font-size:17px; margin:0 0 1px; font-weight:600; letter-spacing:-.01em; color:var(--accent);}
.ex-block .ex-block-sub{font-size:13px; color:var(--ink-soft); text-transform:capitalize; margin-bottom:6px;}
/* set grid — flex rows, each swipeable left to delete that ONE set (Strong) */
.set-grid{display:flex; flex-direction:column; margin-top:2px;}
.set-head, .set-row{display:grid; grid-template-columns:34px 1fr 60px 60px 34px; gap:8px; align-items:center;}
.set-head{padding:2px 6px 5px;}
.set-head span{font-size:11px; text-transform:uppercase; letter-spacing:.03em; color:var(--ink-soft); font-weight:600; text-align:center;}
.set-head span:nth-child(2){text-align:left; padding-left:2px;}
.set-swipe{position:relative; overflow:hidden; border-radius:9px;}
.set-del{position:absolute; top:0; right:0; bottom:0; width:88px; border:none; background:var(--danger); color:#fff; font-size:13px; font-weight:600;}
.set-row{position:relative; background:var(--surface); padding:5px 6px; will-change:transform;}
.set-no-btn{justify-self:center; background:none; border:none; font-size:15px; font-weight:600; color:var(--ink); width:30px; height:30px; border-radius:7px; font-variant-numeric:tabular-nums;}
.set-warmup .set-no-btn{color:#e8912a;} .set-drop .set-no-btn{color:#7b5cff;} .set-failure .set-no-btn{color:var(--danger);}
.prev{background:none; border:none; text-align:left; padding:0 0 0 2px; font-size:13px; color:var(--ink-faint); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; font-variant-numeric:tabular-nums;}
.set-inp{width:100%; padding:8px 3px; text-align:center; font-size:16px; font-weight:600; color:var(--ink); border:1px solid transparent; border-radius:8px; background:var(--surface-2); font-variant-numeric:tabular-nums;}
.set-inp:focus{outline:none; background:#e9e9ee;}
.set-check{justify-self:center; width:32px; height:30px; border:none; border-radius:8px; background:var(--surface-2); font-size:15px; line-height:1; color:var(--ink-faint); font-weight:700;}
/* completed set → whole row green (Strong) */
.set-row.done{background:var(--good-soft);}
.set-row.done .set-inp{background:rgba(255,255,255,.55);}
.set-row.done .set-check{background:var(--good); color:#fff;}
.set-warmup .set-inp, .set-warmup .prev{opacity:.72;}
.addset{margin-top:8px; width:100%; font-size:14px; font-weight:600; background:var(--surface-2); border:none; color:var(--ink-soft); padding:8px; border-radius:9px;}
.timer-link{font-size:13px; color:var(--accent); background:none; border:none; font-weight:500;}
.ex-menu{background:transparent; border:none; color:var(--ink-faint); font-size:22px; line-height:1; width:32px; height:28px; padding:0;}
.rest-ctl{display:inline-block; margin:2px 0 5px; padding:4px 11px; font-size:12.5px; color:var(--accent); background:var(--accent-soft); border:none; border-radius:999px; font-weight:600;}

/* rest line between sets */
.rest-tr td{padding:1px 0 2px; background:transparent !important;}
.restline{display:flex; align-items:center; gap:8px; opacity:.8; padding:3px 8px;}
.restline::before, .restline::after{content:""; height:1px; flex:1; background:var(--line);}
.restline-time{font-size:11.5px; font-variant-numeric:tabular-nums; color:var(--ink-faint); letter-spacing:.03em;}
.restline.counting{opacity:1;}
.restline.counting::before, .restline.counting::after{background:rgba(0,122,255,.45);}
.restline.counting .restline-time{color:var(--accent); font-weight:700;}

/* superset grouping */
.ex-block.in-superset{border-left-width:3px; padding-left:12px;}
.ss-tag{font-size:11px; font-weight:800; letter-spacing:.08em; margin-bottom:6px;}

/* action-sheet menu items */
.menu-item{display:block; width:100%; text-align:left; padding:14px; margin-top:8px; font-size:17px; color:var(--ink); background:var(--surface-2); border:none; border-radius:11px; font-weight:500;}
.menu-item.danger{color:var(--danger);}
.menu-item.ss-pick.on{background:var(--accent-soft);}
.menu-item.ss-pick::after{content:"○"; float:right; color:var(--ink-faint);}
.menu-item.ss-pick.on::after{content:"●"; color:var(--accent);}

/* ---- History ---- */
.hist-item{padding:13px 14px; margin-bottom:10px; background:var(--surface); border:1px solid var(--line); border-radius:var(--radius);}
.hist-top{display:flex; justify-content:space-between; align-items:baseline;}
.hist-date{font-size:16px; font-weight:700; letter-spacing:-.01em;}
.hist-stat{font-size:13px; color:var(--ink-soft); font-variant-numeric:tabular-nums;}
.hist-ex{font-size:13.5px; color:var(--ink-soft); margin-top:7px; line-height:1.55;}

/* ---- Stats / charts ---- */
.stat-grid{display:grid; grid-template-columns:1fr 1fr; gap:9px; margin-bottom:9px;}
.stat-box{padding:13px; background:var(--surface); border:1px solid var(--line); border-radius:var(--radius-sm);}
.stat-num{font-size:23px; font-weight:800; font-variant-numeric:tabular-nums; letter-spacing:-.02em;}
.stat-lbl{font-size:11px; text-transform:uppercase; letter-spacing:.06em; color:var(--ink-soft); margin-top:2px;}
.pr-pick, .pr-pick:focus{width:100%; padding:11px 14px; border:none; border-radius:11px; background:var(--surface-2); color:var(--ink); font-size:16px; margin:6px 0 8px; -webkit-appearance:none; appearance:none;}
.chart-wrap{padding:13px 11px 7px; background:var(--surface); border:1px solid var(--line); border-radius:var(--radius);}

/* segmented control — iOS style */
.seg{display:flex; gap:0; padding:2px; margin:10px 0 8px; background:var(--surface-2); border:none; border-radius:9px;}
.seg-btn{flex:1; padding:7px; border:none; background:none; color:var(--ink); font-size:14px; font-weight:500; border-radius:7px;}
.seg-btn.on{background:#fff; box-shadow:0 1px 3px rgba(0,0,0,.10), 0 0 0 .5px rgba(0,0,0,.04); font-weight:600;}

/* strength standards */
.std-row{display:flex; align-items:center; justify-content:space-between; padding:12px 2px; border-bottom:1px solid var(--line);}
.std-row:last-child{border-bottom:none;}
.std-row.current{margin:0 -13px; padding:12px 13px; background:var(--accent-soft); border-radius:9px; border-bottom:none;}
.std-dot{width:9px; height:9px; border-radius:50%; border:1.5px solid var(--line-2); background:transparent;}
.std-dot.on{background:var(--accent); border-color:var(--accent);}
.std-name{font-size:15px;}
.std-row.current .std-name{font-weight:700;}
.std-val{font-size:15px; font-variant-numeric:tabular-nums; color:var(--ink-soft);}
.std-row.current .std-val{color:var(--ink); font-weight:700;}

/* ---- Body / measurements ---- */
.metric-card{display:flex; align-items:center; gap:12px; padding:12px 14px; margin-bottom:9px; background:var(--surface); border:1px solid var(--line); border-radius:var(--radius-sm);}
.metric-info{flex:1; min-width:0;}
.metric-name{font-size:15px; font-weight:600;}
.metric-val{font-size:13px; color:var(--ink-soft); font-variant-numeric:tabular-nums; margin-top:1px;}
.metric-delta{font-size:12.5px; font-variant-numeric:tabular-nums; color:var(--ink-soft);}
.spark{flex:0 0 auto; width:84px; height:34px;}
.field-row{display:flex; align-items:center; justify-content:space-between; gap:10px; padding:10px 0; border-bottom:1px solid var(--line);}
.field-row label{font-size:15px;}
.field-inp{width:98px; padding:9px 12px; text-align:right; font-size:16px; color:var(--ink); border:none; border-radius:9px; background:var(--surface-2); font-variant-numeric:tabular-nums;}
.field-inp:focus{outline:none; background:#e9e9ee;}
.field-unit{font-size:12.5px; color:var(--ink-faint); width:30px; text-align:left;}

/* ---- Detail muscle map ---- */
.detail-map-card{margin:12px 0 4px; padding:16px 12px 10px; background:#fff; border:1px solid var(--line); border-radius:12px;}
.detail-map{display:flex; justify-content:center;}
.detail-map svg{height:196px; width:auto;}
.legend{display:flex; gap:18px; justify-content:center; font-size:12.5px; color:var(--ink-soft); padding-top:8px;}
.legend i{display:inline-block; width:10px; height:10px; border-radius:3px; margin-right:6px; vertical-align:-1px;}

/* ---- Empty ---- */
.empty{text-align:center; padding:46px 18px; color:var(--ink-soft);}
.empty .big{font-size:30px; margin-bottom:11px; opacity:.45;}
.empty p{margin:0 0 14px;}

/* ---- Bottom nav — iOS tab bar ---- */
#nav{display:flex; border-top:.5px solid var(--line-2); padding:6px 4px calc(env(safe-area-inset-bottom) + 5px); background:rgba(249,249,251,.94); -webkit-backdrop-filter:blur(20px) saturate(1.8); backdrop-filter:blur(20px) saturate(1.8);}
.nav-btn{flex:1; background:none; border:none; padding:4px 0 2px; display:flex; flex-direction:column; align-items:center; gap:2.5px; color:var(--ink-faint);}
.nav-btn svg{width:24px; height:24px; stroke:currentColor; fill:none; stroke-width:1.7;}
.nav-btn .nav-lbl{font-size:10px; letter-spacing:.01em; font-weight:500;}
.nav-btn.active{color:var(--accent);}
.nav-btn.active .nav-lbl{font-weight:600;}

/* ---- Modal sheet (animated slide-up) ---- */
#modal{position:fixed; inset:0; background:rgba(0,0,0,.4); display:flex; align-items:flex-end; justify-content:center; z-index:40; opacity:0; transition:opacity .24s ease;}
#modal.show{opacity:1;}
#modal-sheet{width:100%; max-width:520px; max-height:90dvh; overflow-y:auto; background:var(--bg); border:none; border-radius:16px 16px 0 0; padding:10px 16px calc(env(safe-area-inset-bottom) + 18px); box-shadow:0 -10px 40px rgba(0,0,0,.18); transform:translateY(100%); transition:transform .36s cubic-bezier(.32,.72,0,1);}
#modal.show #modal-sheet{transform:translateY(0);}
/* Full-height add-exercise picker: search + chips pinned, list scrolls beneath them. */
#modal-sheet.sheet-full{height:92dvh; max-height:92dvh; display:flex; flex-direction:column; padding-bottom:0; overflow:hidden;}
.sheet-head{display:flex; align-items:center; justify-content:space-between; padding:4px 2px 10px; flex:0 0 auto;}
.sheet-done{background:none; border:none; color:var(--accent); font-size:16px; font-weight:600; padding:6px 2px;}
.picker-search{width:100%; padding:11px 14px; border:none; border-radius:11px; background:var(--surface-2); color:var(--ink); font-size:17px; flex:0 0 auto;}
.picker-search::placeholder{color:var(--ink-faint);} .picker-search:focus{outline:none;}
.picker-list{flex:1; overflow-y:auto; -webkit-overflow-scrolling:touch; padding-bottom:calc(env(safe-area-inset-bottom) + 14px); margin-top:6px;}
.sheet-handle{width:36px; height:5px; background:var(--line-2); border-radius:3px; margin:2px auto 12px;}
.sheet-title{font-size:20px; font-weight:800; letter-spacing:-.02em; margin-bottom:1px;}
.detail-name{font-size:26px; font-weight:800; letter-spacing:-.022em; line-height:1.1; margin-top:2px;}
.detail-label{font-size:13px; text-transform:uppercase; letter-spacing:.06em; color:var(--ink-soft); font-weight:600; margin:18px 0 6px;}
.detail-tags{display:flex; flex-wrap:wrap; gap:6px; margin:11px 0 4px;}
.tag{font-size:12.5px; padding:5px 11px; border:none; border-radius:999px; color:var(--ink-soft); text-transform:capitalize; background:var(--surface-2); font-weight:500;}
.detail-steps{display:flex; flex-direction:column; gap:11px;}
.step-row{display:flex; gap:12px; align-items:flex-start;}
.step-num{flex:0 0 auto; width:23px; height:23px; border-radius:50%; background:var(--surface-2); color:var(--ink-soft); font-size:12.5px; font-weight:700; display:flex; align-items:center; justify-content:center; margin-top:1px; font-variant-numeric:tabular-nums;}
.step-text{flex:1; font-size:15px; line-height:1.5; color:#3a3a3c;}

/* ---- Rest timer pill ---- */
#rest-timer{position:fixed; left:50%; transform:translateX(-50%); bottom:calc(env(safe-area-inset-bottom) + 76px); display:flex; align-items:center; gap:12px; padding:9px 15px; border-radius:999px; z-index:30; background:var(--accent); color:#fff; box-shadow:0 8px 26px rgba(0,122,255,.38); font-variant-numeric:tabular-nums;}
#rest-label{font-size:12.5px; opacity:.9;}
#rest-clock{font-size:16px; font-weight:700;}
#rest-skip{background:rgba(255,255,255,.24); border:none; color:#fff; border-radius:999px; padding:4px 11px; font-size:12.5px; font-weight:600;}

#view::-webkit-scrollbar, #modal-sheet::-webkit-scrollbar, .picker-list::-webkit-scrollbar{width:0;}
.bodymap, .bodymap-thumb{display:block;}

/* ---- Exercise block title is tappable → info sheet ---- */
.ex-block h3.ex-title{cursor:pointer;}
.ex-block h3.ex-title::after{content:"›"; color:var(--ink-faint); font-weight:400; margin-left:5px;}
.ex-block h3.ex-title:active{opacity:.5;}

/* ---- Exercise info: PR history list ---- */
.hist-list{display:flex; flex-direction:column;}
.hist-sess{display:flex; align-items:baseline; justify-content:space-between; gap:12px; padding:9px 0; border-bottom:1px solid var(--line);}
.hist-sess:last-child{border-bottom:none;}
.hist-sess-date{font-size:14px; font-weight:600; color:var(--ink); flex:0 0 auto;}
.hist-sess-sets{font-size:13px; color:var(--ink-soft); font-variant-numeric:tabular-nums; text-align:right;}

/* ---- Past-workout detail ---- */
.hist-item.tappable{cursor:pointer;}
.wd-ex{margin-top:15px;}
.wd-ex-name{font-size:16px; font-weight:700; letter-spacing:-.01em; margin-bottom:6px; cursor:pointer;}
.wd-sets{display:flex; flex-direction:column;}
.wd-set{display:flex; align-items:center; gap:12px; padding:6px 0; border-bottom:1px solid var(--line);}
.wd-set:last-child{border-bottom:none;}
.wd-set-no{width:22px; height:22px; flex:0 0 auto; border-radius:6px; background:var(--surface-2); color:var(--ink-soft); font-size:12px; font-weight:700; display:flex; align-items:center; justify-content:center; font-variant-numeric:tabular-nums;}
.wd-set-no.set-warmup{color:#e8912a;} .wd-set-no.set-drop{color:#7b5cff;} .wd-set-no.set-failure{color:var(--danger);}
.wd-set-val{font-size:15px; color:var(--ink); font-variant-numeric:tabular-nums;}
.btn.danger-ghost{background:transparent; color:var(--danger); font-weight:600;}

/* ---- Motion — presses, screen transitions, live rest pill ---- */
@keyframes viewIn{from{opacity:0; transform:translateY(8px);} to{opacity:1; transform:none;}}
.view-anim{animation:viewIn .28s cubic-bezier(.22,.61,.36,1);}
.btn, .chip, .ex-add, .set-check, .menu-item, .seg-btn, .rest-ctl, .set-no-btn, .sheet-done, .tag{transition:transform .12s ease, opacity .12s ease, background .15s ease;}
.btn:active, .menu-item:active, .seg-btn:active{transform:scale(.975);}
.chip:active, .ex-add:active, .set-check:active, .set-no-btn:active, .rest-ctl:active{transform:scale(.9);}
.nav-btn:active{opacity:.5;}
.ex-item, .hist-item, .metric-card{transition:background .15s ease;}
.ex-item:active, .hist-item.tappable:active, .metric-card:active{background:rgba(0,0,0,.04);}
.set-row td, .set-check{transition:background .22s ease;}
@keyframes restPulse{0%,100%{box-shadow:0 8px 26px rgba(0,122,255,.38);} 50%{box-shadow:0 10px 32px rgba(0,122,255,.6);}}
#rest-timer:not(.hidden){animation:restPulse 2.2s ease-in-out infinite;}

/* ---- Filter dropdowns (Body Part · Equipment) — no horizontal scrolling ---- */
.filter-bar{display:flex; gap:8px; margin:6px 0 2px;}
.filter-drop{flex:1; display:flex; align-items:center; justify-content:space-between; gap:6px; padding:9px 13px; border:none; border-radius:11px; background:var(--surface-2); color:var(--ink); font-size:14px; font-weight:600; transition:transform .12s ease;}
.filter-drop span{color:var(--ink-faint); font-size:13px;}
.filter-drop.on{background:var(--accent-soft); color:var(--accent);}
.filter-drop.on span{color:var(--accent);}
.filter-drop:active{transform:scale(.975);}
.fpop{position:fixed; inset:0; background:rgba(0,0,0,.4); z-index:60; display:flex; align-items:flex-end; justify-content:center; opacity:0; transition:opacity .22s ease;}
.fpop.show{opacity:1;}
.fpop-card{width:100%; max-width:520px; background:var(--bg); border-radius:16px 16px 0 0; padding:8px 10px calc(env(safe-area-inset-bottom) + 14px); max-height:70dvh; overflow-y:auto; transform:translateY(100%); transition:transform .32s cubic-bezier(.32,.72,0,1); box-shadow:0 -10px 40px rgba(0,0,0,.18);}
.fpop.show .fpop-card{transform:translateY(0);}
.fpop-title{font-size:13px; text-transform:uppercase; letter-spacing:.06em; color:var(--ink-soft); font-weight:600; padding:10px 8px 6px;}
.fpop-opt{display:block; width:100%; text-align:left; padding:14px 10px; border:none; background:none; color:var(--ink); font-size:17px; border-radius:10px;}
.fpop-opt.on{color:var(--accent); font-weight:600;}
.fpop-opt.on::after{content:"✓"; float:right;}
.fpop-opt:active{background:var(--surface-2);}

/* ---- Exercise movement demo (animated start↔finish) ---- */
.demo-card{margin:12px 0 4px; border:1px solid var(--line); border-radius:12px; overflow:hidden; background:var(--surface-2); height:240px; display:flex; align-items:center; justify-content:center;}
.demo-img{max-width:100%; max-height:100%; object-fit:contain; display:block;}

/* ---- Routines / templates ---- */
.linkbtn{background:none; border:none; color:var(--accent); font-size:15px; font-weight:600; padding:6px 2px;}
.linkbtn.strong{font-weight:700;}
.linkbtn:active{opacity:.5;}
.routine-name{width:100%; padding:12px 14px; border:none; border-radius:11px; background:var(--surface-2); color:var(--ink); font-size:18px; font-weight:700; margin-bottom:12px;}
.routine-name:focus{outline:none;}
.routine-empty{background:var(--surface-2); border-radius:var(--radius); padding:16px; color:var(--ink-soft); font-size:14px; line-height:1.5;}
.routine-empty p{margin:0;}
.routine-card{display:flex; align-items:center; gap:10px; padding:13px 14px; margin-bottom:9px; background:var(--surface); border:1px solid var(--line); border-radius:var(--radius);}
.routine-info{flex:1; min-width:0;}
.routine-name-lbl{font-size:16px; font-weight:700; letter-spacing:-.01em;}
.routine-sub{font-size:13px; color:var(--ink-soft); margin-top:2px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.routine-info.tappable:active{opacity:.55;}
.rt-sets{display:flex; flex-direction:column; margin-top:2px;}
.rt-set{display:flex; align-items:center; gap:8px; padding:4px 0;}
.rt-set .set-inp{flex:1; width:auto; min-width:0;}
.rt-hd{padding:2px 2px 4px;}
.rt-hd span{font-size:11px; text-transform:uppercase; letter-spacing:.03em; color:var(--ink-soft); font-weight:600;}
.rt-hd span:first-child{width:30px; text-align:center;} .rt-hd span:nth-child(2),.rt-hd span:nth-child(3){flex:1; text-align:center;} .rt-hd span:last-child{width:28px;}
.rt-rm{background:none; border:none; color:var(--ink-faint); font-size:15px; width:28px; flex:0 0 auto;}

/* ---- Plate calculator ---- */
.plate-out{margin-top:16px;}
.plate-lbl{font-size:13px; text-transform:uppercase; letter-spacing:.06em; color:var(--ink-soft); font-weight:600; margin-bottom:8px;}
.plate-chips{display:flex; flex-wrap:wrap; gap:8px;}
.plate-chip{min-width:46px; text-align:center; padding:12px 10px; border-radius:10px; background:var(--accent-soft); color:var(--accent); font-size:17px; font-weight:800; font-variant-numeric:tabular-nums;}