
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{
  /* FORGE DESIGN TOKENS. The one place the visual system is defined.
     Everything else reads these; nothing below should invent a colour. */
  --sans:'Sora',system-ui,-apple-system,sans-serif;
  --serif:var(--sans); --mono:var(--sans);
  --display:'Playfair Display',Georgia,'Times New Roman',serif;
  /* foundation */
  --bg:#F6F6F3; --surface:#FFFFFF; --surface-subtle:#F0F1F3; --surface-strong:#EBEAE7;
  --ink:#0C0D10; --ink-2:#60636B;
  /* quiet text still has to be read: both greys clear a 3:1 floor on --bg */
  --ink-3:#797D86; --ink-4:#84878F;
  --hairline:rgba(12,13,14,.08); --hair:rgba(12,13,14,.10); --hair-2:rgba(12,13,14,.06);
  --surf:var(--surface-subtle);
  /* brand accent: auxe cobalt. Restrained: primary action, active state, progress, PR, coach. */
  --accent:#8792A2; --accent-hover:#8792A2; --accent-soft:#E9ECF1; --accent-ink:#FFFFFF;
  /* semantic, never decorative */
  --ok:#169B62; --warn:#C48618; --error:#D54848;
  /* progress fills. Old code says var(--metal); it now means the accent. */
  --metal:var(--accent);
  /* shape */
  --r-sm:10px; --r-md:14px; --r-lg:18px; --r-xl:24px; --r-sheet:28px; --r-pill:999px;
  /* elevation */
  --shadow-1:0 1px 2px rgba(30,31,33,.04),0 8px 24px -12px rgba(30,31,33,.14);
  --shadow-2:0 12px 36px -10px rgba(30,31,33,.28);
  /* layers */
  --z-nav:45; --z-under:60; --z-bar:70; --z-float:130; --z-sess:134; --z-sheet:140; --z-ask:150; --z-tut:200;
  /* surfaces that must flip with the theme */
  --ink-invert:#FFFFFF;            /* text on an ink-coloured surface */
  --frost:var(--frost);   /* floating bars */
  --frost-2:var(--frost-2);
  --veil:var(--veil);    /* soft button on an ink surface */
  /* motion */
  --ease:cubic-bezier(.16,1,.3,1); --t-micro:.14s; --t-norm:.24s; --t-state:.38s}/* DARK. The same tokens, a second set of values, nothing else. The app sets
   data-theme on <html> from the Appearance setting; light is the default. */

:root[data-theme="dark"]{
  --bg:#0D0E0F; --surface:#161718; --surface-subtle:#1D1E1F; --surface-strong:#262728;
  --ink:#F7F7F5; --ink-2:#A5A7AE; --ink-3:#8A8D96; --ink-4:#7E8189;
  --hairline:rgba(255,255,255,.08); --hair:rgba(255,255,255,.12); --hair-2:rgba(255,255,255,.06);
  --accent:#8792A2; --accent-hover:#B4BCC8; --accent-soft:rgba(171,172,173,.18); --accent-ink:#FFFFFF;
  --ink-invert:#0D0E11;
  --frost:rgba(22,23,24,.84); --frost-2:rgba(22,23,24,.97);
  --veil:rgba(255,255,255,.12);
  --shadow-1:0 1px 2px rgba(0,0,0,.35),0 8px 24px -12px rgba(0,0,0,.5);
  --shadow-2:0 12px 36px -10px rgba(0,0,0,.6)}
html,body{height:100%}/* AN APP SURFACE, NOT A PAGE. The document only ever pans vertically: no
   pinching the whole UI, no double-tap zoom, no sideways drift, no
   rubber-banding into blank space around the app. auxe-native gestures,
   like the reorder handle, opt in on their own element. */

html{overscroll-behavior:none;touch-action:pan-y pinch-zoom}
body{font-family:var(--sans);background:var(--bg);color:var(--ink);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;display:flex;justify-content:center;overflow-x:hidden;overscroll-behavior:none;letter-spacing:-.005em}/* overlays keep their scrolling to themselves, never dragging the page */

.sess,.sheet-wrap,#askNum,#fdlg,#tut{overscroll-behavior:contain}
.light{display:none}/* fill-mode backwards, not both: a finished "both" keeps an identity transform on the column, and any transform makes it
   the containing block for position:fixed inside it (the keyboard-pinned Coach composer rode away with the page) */

.col{position:relative;z-index:3;width:100%;max-width:600px;min-height:100vh;padding:64px 22px 132px;animation:pageIn .5s var(--ease) backwards}
@keyframes pageIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.back{position:fixed;top:20px;left:20px;z-index:40;display:inline-flex;align-items:center;gap:8px;padding:9px 15px;border:1px solid var(--hair);border-radius:100px;background:rgba(8,8,8,.55);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);color:var(--ink-3);text-decoration:none;cursor:pointer;font-family:var(--mono);font-size:var(--ui-meta,14px);font-weight:600;letter-spacing:.18em;text-transform:uppercase;transition:.25s}
.back:hover{color:var(--ink-invert);border-color:var(--hair)}
.kicker{font-family:var(--mono);font-size:var(--ui-meta,14px);font-weight:600;letter-spacing:.34em;text-transform:uppercase;color:var(--ink-3);margin-bottom:14px;display:flex;align-items:center;gap:10px}
.kicker::before{content:"";width:22px;height:1px;background:linear-gradient(90deg,transparent,var(--ink-3))}
h1{font-family:var(--serif);font-weight:500;font-size:46px;line-height:.98;letter-spacing:-.02em}
.sub{margin-top:12px;font-size:14px;color:var(--ink-2);line-height:1.55;max-width:46ch}/* tabs (Today / Progress) */


.tabs{position:fixed;bottom:22px;left:50%;transform:translateX(-50%);z-index:45;display:flex;gap:5px;padding:6px;border:1px solid var(--hair);border-radius:100px;background:rgba(10,10,10,.7);-webkit-backdrop-filter:blur(20px) saturate(1.4);backdrop-filter:blur(20px) saturate(1.4);box-shadow:0 12px 40px rgba(0,0,0,.6),0 0 0 1px rgba(255,255,255,.02) inset}
.tabs button{background:none;border:none;color:var(--ink-3);font-family:var(--mono);font-size:var(--ui-meta,14px);font-weight:600;letter-spacing:.12em;text-transform:uppercase;padding:11px 10px;border-radius:100px;cursor:pointer;transition:.28s var(--ease)}
.tabs button.on{background:var(--metal);color:var(--t-ink,#0a0a0a);box-shadow:0 1px 0 rgba(255,255,255,.8) inset,0 4px 12px rgba(0,0,0,.4)}/* mode toggle */


.modebar{display:flex;gap:4px;padding:4px;border:1px solid var(--hair-2);border-radius:100px;background:rgba(255,255,255,.025);margin:22px 0 26px}
.modebar button{flex:1;background:none;border:none;color:var(--ink-3);font-family:var(--mono);font-size:var(--ui-meta,14px);font-weight:600;letter-spacing:.16em;text-transform:uppercase;padding:11px 8px;border-radius:100px;cursor:pointer;transition:.28s var(--ease)}
.modebar button.on{background:var(--surface);color:var(--t-ink,#0a0a0a)}/* my-own routine builder */

.ob-targets{display:flex;gap:12px;margin-bottom:18px}
.ob-targets .field{flex:1}
.obday{border:1px solid rgba(255,255,255,.12);border-radius:14px;padding:14px;margin-bottom:10px;background:rgba(255,255,255,.025)}
.obday-h{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}
.obday-h span{font-size:var(--ui-meta,14px);font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.62)}
.obrest{font-size:var(--ui-meta,14px);color:rgba(255,255,255,.5);display:flex;align-items:center;gap:6px;cursor:pointer}
.obfields{display:flex;flex-direction:column;gap:8px}
.obfields.hide{display:none}
.obday .ob-title,.obday .ob-lifts{width:100%;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.12);border-radius:10px;padding:10px 12px;color:var(--ink-invert);font-family:inherit;font-size:14px;box-sizing:border-box;resize:vertical}
.obday .ob-lifts{line-height:1.5}/* intake */


.field{margin-bottom:20px}
.field>label{display:block;font-family:var(--mono);font-size:var(--ui-meta,14px);font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-3);margin-bottom:10px}
.row{display:flex;gap:10px}.row .field{flex:1}/* Height as feet + inches. Asking for raw inches makes people go look it up. */

.ftin{display:flex;align-items:center;gap:6px}
.ftin input{flex:1;min-width:0}
.ftin span{font-size:var(--ui-meta,14px);color:var(--ink-3);flex:none}
.grp-title{font-family:var(--mono);font-size:var(--ui-meta,14px);font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:var(--ink-4);margin:32px 0 6px;display:flex;align-items:center;gap:10px}
.grp-title::after{content:"";flex:1;height:1px;background:var(--hair-2)}
input[type=number],input[type=text]{width:100%;background:var(--surf);border:1px solid var(--hair);border-radius:13px;color:var(--ink-invert);font-family:inherit;font-size:16px;font-weight:600;padding:14px 15px;transition:.2s}
input:focus{outline:none;border-color:rgba(255,255,255,.4);background:rgba(255,255,255,.05)}
.opts{display:flex;flex-wrap:wrap;gap:8px}
.opt{flex:1 0 auto;text-align:center;background:var(--surf);border:1px solid var(--hair);border-radius:13px;color:var(--ink-2);font-size:var(--ui-meta,14px);font-weight:600;padding:13px 15px;cursor:pointer;transition:.2s var(--ease);white-space:nowrap}
.opt:hover{border-color:rgba(255,255,255,.3);color:var(--ink-invert);transform:translateY(-1px)}
.opt.sel{background:var(--metal);color:var(--t-ink,#0a0a0a);border-color:transparent;box-shadow:0 1px 0 rgba(255,255,255,.7) inset,0 6px 16px rgba(0,0,0,.4)}
.chips{display:flex;flex-wrap:wrap;gap:7px;margin-top:6px}
.chip{display:inline-flex;align-items:center;gap:8px;background:var(--surf);border:1px solid var(--hair);border-radius:100px;color:var(--ink);font-size:var(--ui-meta,14px);font-weight:600;padding:8px 13px}
.chip b{cursor:pointer;color:var(--ink-3);font-weight:800;font-size:var(--ui-meta,14px)}
.chip b:hover{color:var(--ink-invert)}
.btn{display:block;width:100%;text-align:center;background:var(--metal);color:var(--t-ink,#0a0a0a);border:none;border-radius:14px;font-family:inherit;font-size:14px;font-weight:800;letter-spacing:.01em;padding:17px;cursor:pointer;margin-top:10px;box-shadow:0 1px 0 rgba(255,255,255,.7) inset,0 8px 22px rgba(0,0,0,.45);transition:.2s var(--ease)}
.btn:hover{transform:translateY(-1px);box-shadow:0 1px 0 rgba(255,255,255,.8) inset,0 12px 28px rgba(0,0,0,.55)}
.btn:disabled{opacity:.32;cursor:not-allowed;transform:none;box-shadow:none;background:rgba(255,255,255,.12);color:var(--ink-3)}
.btn.ghost{background:none;color:var(--ink-3);border:1px solid var(--hair);font-family:var(--mono);font-weight:600;font-size:var(--ui-meta,14px);letter-spacing:.18em;text-transform:uppercase;padding:13px;box-shadow:none}
.btn.ghost:hover{color:var(--ink-invert);border-color:var(--hair);transform:none}
.btn.sm{font-size:var(--ui-meta,14px);padding:11px 16px;width:auto;display:inline-block;margin:0}/* auxe banner */


.banner{display:flex;gap:13px;align-items:flex-start;padding:17px 18px;border-radius:var(--r-lg);background:var(--surface);box-shadow:var(--shadow-1);margin-bottom:26px;position:relative}
.banner .orb{width:32px;height:32px;border-radius:11px;flex:none;background:var(--metal);box-shadow:0 1px 0 rgba(255,255,255,.9) inset,0 -2px 7px rgba(0,0,0,.5) inset,0 8px 18px rgba(0,0,0,.5)}
.banner .ln{font-size:14.5px;font-weight:500;line-height:1.5;color:var(--ink-invert);position:relative}
.banner .who{font-family:var(--mono);font-size:var(--ui-meta,14px);font-weight:600;letter-spacing:.26em;text-transform:uppercase;color:var(--ink-3);margin-bottom:6px}/* adapt card + changed note */


.adaptcard{display:flex;align-items:center;gap:14px;padding:16px 18px;border:1px solid rgba(255,255,255,.26);border-radius:18px;background:linear-gradient(160deg,rgba(255,255,255,.07),rgba(255,255,255,.02));margin-bottom:20px}
.adaptcard .ac-body{flex:1}
.adaptcard .ac-h{font-size:14px;font-weight:700;color:var(--ink-invert)}
.adaptcard .ac-sub{font-size:var(--ui-meta,14px);color:var(--ink-2);margin-top:5px;line-height:1.5}
.adaptcard .btn{flex:none;white-space:nowrap}
.changed{padding:13px 16px;border:1px solid var(--hair);border-left:2px solid #fff;border-radius:12px;background:rgba(255,255,255,.035);margin-bottom:20px;font-size:var(--ui-meta,14px);color:var(--ink-2);line-height:1.55}
.changed b{color:var(--ink-invert);font-weight:700}
.daybtn{margin:2px 0 6px}
.daybtn.done{background:none;border:1px solid var(--hair);color:var(--ink-2);box-shadow:none;cursor:default}
.daybtn-sub{font-family:var(--mono);font-size:var(--ui-meta,14px);letter-spacing:.04em;color:var(--ink-4);text-align:center;margin-bottom:26px;line-height:1.5}
.recent{display:flex;flex-wrap:wrap;gap:6px;width:100%;margin-bottom:4px}
.recent .rf{display:inline-flex;align-items:center;gap:6px}
.recent .rf span{font-family:var(--mono);font-size:var(--ui-meta,14px);color:var(--ink-4)}/* sections */


.sec{margin-bottom:30px}
.sec-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:13px}
.sec-head h2{font-family:var(--mono);font-weight:600;font-size:var(--ui-meta,14px);letter-spacing:.24em;text-transform:uppercase;color:var(--ink-2);display:flex;align-items:center;gap:10px}
.sec-head h2::before{content:none}
.sec-head .ix{font-family:var(--mono);font-size:var(--ui-meta,14px);font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-4)}
.card{border:1px solid var(--hair-2);border-radius:18px;background:linear-gradient(180deg,rgba(255,255,255,.035),rgba(255,255,255,.015));padding:4px 18px;box-shadow:0 1px 0 rgba(255,255,255,.03) inset}
.card.pad{padding:20px}/* progressive reveal — Today focuses on ONE thing (train/rest), the rest tucks behind tap-to-open rows */


.hero-sec{margin-top:22px}
.reveal-h{all:unset;box-sizing:border-box;display:flex;align-items:center;justify-content:space-between;width:100%;cursor:pointer;margin-bottom:13px}
.revealR{display:flex;align-items:center;gap:10px}
.chev{width:14px;height:14px;stroke:var(--ink-3);fill:none;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round;transition:transform .3s var(--ease);flex:none}
.reveal.open .chev{transform:rotate(180deg)}
.reveal-body{overflow:hidden;max-height:2000px;transition:max-height .35s var(--ease),opacity .3s var(--ease);opacity:1}
.reveal-body.hide{max-height:0;opacity:0;pointer-events:none}/* progress rings (today hero stat) */


.rings-card{display:flex;flex-direction:column;align-items:center;gap:6px}
.rings{display:flex;justify-content:space-around;width:100%;gap:8px}
.ring{position:relative;width:104px;height:104px;flex:1;max-width:118px}
.ring svg{width:100%;height:100%;transform:rotate(-90deg);overflow:visible}
.ring .rt{fill:none;stroke:rgba(255,255,255,.08);stroke-width:6}
.ring .ra{fill:none;stroke:var(--accent-ink);stroke-width:6;stroke-linecap:round;filter:drop-shadow(0 0 5px rgba(255,255,255,.4));transition:stroke-dashoffset 1.1s var(--ease)}
.ring-c{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px}
.ring-c b{font-family:var(--mono);font-size:19px;font-weight:700;letter-spacing:-.01em;line-height:1}
.ring-c small{font-family:var(--mono);font-size:var(--ui-meta,14px);font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-3)}
.ring-cap{font-family:var(--mono);font-size:var(--ui-meta,14px);font-weight:500;letter-spacing:.1em;color:var(--ink-3);margin-top:8px}/* meal rows */


.meal{padding:14px 0;border-bottom:1px solid var(--hair-2)}
.meal:last-child{border-bottom:none}
.meal-top{display:flex;align-items:flex-start;gap:13px}
.tick{width:24px;height:24px;border-radius:50%;flex:none;margin-top:2px;border:1.5px solid var(--hair);display:flex;align-items:center;justify-content:center;transition:.25s var(--ease);cursor:pointer}
.tick:hover{border-color:rgba(255,255,255,.5)}
.tick svg{width:11px;height:11px;stroke:#0a0a0a;fill:none;stroke-width:2.8;stroke-linecap:round;stroke-linejoin:round;opacity:0;transition:.2s}
.meal.logged .tick{background:var(--metal);border-color:transparent;box-shadow:0 0 10px rgba(255,255,255,.25)}
.meal.logged .tick svg{opacity:1}
.meal .mbody{flex:1;min-width:0}
.meal .when{font-family:var(--mono);font-size:var(--ui-meta,14px);font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-3);margin-bottom:5px}
.meal .nm{font-size:14px;font-weight:600;line-height:1.4}
.meal.logged .nm{color:var(--ink-2)}
.meal .mac{font-family:var(--mono);font-size:var(--ui-meta,14px);font-weight:600;color:var(--ink-3);margin-top:5px}
.meal .status{font-family:var(--mono);font-size:var(--ui-meta,14px);font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-4);margin-left:37px;margin-top:6px}
.meal-acts{display:flex;gap:7px;margin:10px 0 0 37px;flex-wrap:wrap}
.mini{background:rgba(255,255,255,.04);border:1px solid var(--hair);color:var(--ink-2);font-family:inherit;font-size:var(--ui-meta,14px);font-weight:600;padding:8px 12px;border-radius:10px;cursor:pointer;transition:.18s var(--ease)}
.mini:hover{border-color:rgba(255,255,255,.32);color:var(--ink-invert)}
.mini.on{background:var(--surface);color:var(--t-ink,#0a0a0a);border-color:var(--ink-invert)}
.custom{display:none;gap:7px;margin:10px 0 0 37px;flex-wrap:wrap;align-items:center}
.custom.show{display:flex}
.custom input{width:auto;flex:1;min-width:130px;font-size:16px;padding:10px 12px}
.custom input.tiny{flex:0 0 66px;min-width:0;text-align:center}/* lifts — tap to complete; exact numbers optional behind "edit" */


.lift{padding:6px 0;border-bottom:1px solid var(--hair-2)}
.lift:last-child{border-bottom:none}
.lift-top{display:flex;align-items:center;gap:13px;padding:9px 0;cursor:pointer}
.ltick{width:26px;height:26px;border-radius:50%;flex:none;border:1.5px solid var(--hair);display:flex;align-items:center;justify-content:center;transition:.25s var(--ease)}
.ltick svg{width:12px;height:12px;stroke:#0a0a0a;fill:none;stroke-width:2.8;stroke-linecap:round;stroke-linejoin:round;opacity:0;transition:.2s}
.lift.done .ltick{background:var(--metal);border-color:transparent;box-shadow:0 0 10px rgba(255,255,255,.25)}
.lift.done .ltick svg{opacity:1}
.lift .lbody{flex:1;min-width:0}
.lift .exline{flex:1;min-width:0}
.lift .nm{font-weight:600;font-size:14.5px}
.lift.done .nm{color:var(--ink-2)}
.lift .lsub{font-family:var(--mono);font-size:var(--ui-meta,14px);font-weight:600;color:var(--ink-3);margin-top:3px}
.ledit{flex:none;background:none;border:1px solid var(--hair);color:var(--ink-3);font-family:var(--mono);font-size:var(--ui-meta,14px);font-weight:600;letter-spacing:.12em;text-transform:uppercase;padding:7px 10px;border-radius:9px;cursor:pointer}
.ledit:hover{color:var(--ink-invert);border-color:rgba(255,255,255,.3)}
.sets{display:flex;flex-direction:column;gap:7px;margin:2px 0 12px 39px}
.setrow{display:flex;align-items:center;gap:9px}
.setrow .sl{font-family:var(--mono);font-size:var(--ui-meta,14px);font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-4);width:42px}
.setrow input{width:70px;font-family:var(--mono);font-size:16px;font-weight:600;padding:9px;text-align:center}
.setrow .x{font-size:var(--ui-meta,14px);color:var(--ink-4);font-weight:700}
.setrow .wu{flex:none;width:26px;height:26px;border-radius:100px;border:1px solid var(--hair);background:transparent;
  font-family:var(--mono);font-size:var(--ui-meta,14px);font-weight:700;color:var(--ink-4);cursor:pointer;padding:0}
.setrow.warm .wu{background:#141516;border-color:var(--ink);color:var(--ink-invert)}
.setrow.warm input{opacity:.55}
.setrow .rm{flex:none;width:26px;height:26px;border-radius:100px;border:none;background:transparent;
  font-size:16px;line-height:1;color:var(--ink-4);cursor:pointer;padding:0}
.setfoot{display:flex;gap:8px;align-items:center;margin-left:42px;margin-top:2px}
.setfoot button{border:1px dashed var(--hair);background:transparent;border-radius:100px;padding:6px 12px;
  font-size:var(--ui-meta,14px);font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-3);cursor:pointer}
.setfoot .hint{font-size:var(--ui-meta,14px);color:var(--ink-4)}/* THE LIFT ROW, REBUILT
   It was seven identical paragraphs, each repeating "first session: find a weight
   you could do for about ten". Nothing told a bench press from a lateral raise at
   a glance and every number had to be typed on a phone keyboard mid-set.

   Now: a glyph for what it trains, a dot per set so progress is visible without
   reading, the target as a chip instead of a sentence, and plus/minus pads so a
   whole session can be logged without the keyboard ever appearing. */


.lglyph{width:38px;height:38px;flex:none;border-radius:12px;display:flex;align-items:center;justify-content:center;
  background:var(--surf);border:1px solid var(--hair-2)}
body.pm-premium .lglyph{background:var(--surface-subtle);border-color:transparent}
.lglyph svg{width:21px;height:21px;stroke:var(--ink-2);fill:none;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.lift.done .lglyph{background:#141516}
.lift.done .lglyph svg{stroke:var(--bg,#0A0B0C)}
body.pm-premium .lift.done .lglyph svg{stroke:var(--accent-ink)}
.ldots{display:flex;gap:5px;align-items:center;margin-top:7px}
.ldots i{width:7px;height:7px;border-radius:50%;background:var(--hair);display:block}
.ldots i.on{background:#141516}
.ldots i.warm{background:transparent;box-shadow:inset 0 0 0 1.5px var(--hair)}
.ldots b{font-family:var(--mono);font-size:var(--ui-meta,14px);font-weight:700;letter-spacing:.08em;color:var(--ink-4);margin-left:4px}
.ltarget{display:inline-flex;align-items:center;gap:6px;margin-top:8px;padding:5px 10px;border-radius:100px;
  background:var(--surf);border:1px solid var(--hair-2);font-family:var(--mono);font-size:var(--ui-meta,14px);font-weight:700;color:var(--ink)}
body.pm-premium .ltarget{background:var(--surface-subtle);border-color:transparent}
.ltarget.up{background:#141516;color:var(--bg,#0b0b0d);border-color:transparent}/* the light theme's .ltarget rule outranks .ltarget.up, so the raised state has to
   restate its background here or it renders white on near-white */

body.pm-premium .ltarget.up{background:#141516;color:var(--ink-invert)}
.lhint{font-size:var(--ui-meta,14px);color:var(--ink-3);margin-top:7px;line-height:1.45}/* the pad: two steppers and one big button, sized for a thumb.
   Named setpad because .pad was already a padding utility on other cards. */


.setpad{margin:6px 0 14px 51px}/* the held weight: shown, not asked for */

.held{display:flex;align-items:center;justify-content:space-between;gap:12px;
  background:var(--surf);border-radius:14px;padding:13px 16px}
body.pm-premium .held{background:var(--surface-subtle)}
.held .hw{font-family:var(--mono);font-size:19px;font-weight:700}
.held .hchg{background:none;border:none;padding:0;font:inherit;font-size:var(--ui-meta,14px);color:var(--ink-3);
  text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.held.ask{cursor:pointer;box-shadow:inset 0 0 0 1.5px var(--ink)}
.held.ask .hw{font-family:inherit;font-size:16px;font-weight:600}
.setlab{font-family:var(--mono);font-size:var(--ui-meta,14px);font-weight:700;letter-spacing:.16em;text-transform:uppercase;
  color:var(--ink-4);margin:16px 0 9px}/* the only question: how many did you get */

.reprow{display:flex;gap:7px}
.reprow .rep{flex:1;min-width:0;border:1px solid var(--hair);background:transparent;border-radius:13px;
  font-family:var(--mono);font-size:19px;font-weight:700;color:var(--ink);padding:16px 0;cursor:pointer}
body.pm-premium .reprow .rep{background:var(--surface);border-color:transparent;box-shadow:inset 0 0 0 1px var(--hairline)}
.reprow .rep.aim{background:#141516;color:var(--bg,#0b0b0d);border-color:transparent}
body.pm-premium .reprow .rep.aim{background:#141516;color:var(--ink-invert);box-shadow:none}
.reprow .rep:active{transform:scale(.97)}
.repmore{display:block;width:100%;background:none;border:none;font:inherit;font-size:var(--ui-meta,14px);color:var(--ink-2);
  text-decoration:underline;text-underline-offset:3px;padding:12px 0 0;cursor:pointer;text-align:center}
.padnote button{background:none;border:none;padding:0;font:inherit;color:var(--ink-3);text-decoration:underline;
  text-underline-offset:3px;cursor:pointer}/* the line that stops "My own" being a secret only Settings knows */

.ownline{margin-top:12px;font-size:var(--ui-meta,14px);color:var(--ink-3);line-height:1.5}
.ownline button{background:none;border:none;padding:0;font:inherit;font-weight:700;color:var(--ink);
  text-decoration:underline;text-underline-offset:3px;cursor:pointer}/* GUIDED SESSION
   Full screen on purpose. Mid-set nobody wants a page, they want the one number
   they are about to do and a button the size of a thumb. */


.sess{position:fixed;inset:0;z-index:120;display:none;flex-direction:column;
  background:var(--bg,#0A0B0C);padding:calc(14px + env(safe-area-inset-top)) 20px calc(20px + env(safe-area-inset-bottom))}
body.pm-premium .sess{background:var(--bg)}
.sess.on{display:flex}
.sess-top{display:flex;align-items:center;gap:12px}
.sess-ix{flex:1;font-family:var(--mono);font-size:var(--ui-meta,14px);font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-3)}
.sess-x{flex:none;width:38px;height:38px;border-radius:100px;border:1px solid var(--hair);background:transparent;
  color:var(--ink-2);font-size:22px;line-height:1;cursor:pointer}
.sess-bar{height:3px;border-radius:100px;background:var(--hair-2);margin-top:14px;overflow:hidden}
.sess-bar i{display:block;height:100%;width:0;background:#141516;border-radius:100px;transition:width .4s var(--ease)}
.sess-body{flex:1;display:flex;flex-direction:column;justify-content:center;min-height:0;overflow-y:auto;padding:20px 0}
.sess-eyebrow{font-family:var(--mono);font-size:var(--ui-meta,14px);font-weight:700;letter-spacing:.28em;text-transform:uppercase;color:var(--ink-4)}
.sess-lift{font-family:var(--display,inherit);font-size:clamp(30px,8vw,46px);font-weight:700;letter-spacing:-.03em;line-height:1.04;margin-top:6px}
.sess-set{font-family:var(--mono);font-size:var(--ui-meta,14px);font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-3);margin-top:12px}
.sess-instr{font-size:15px;line-height:1.55;color:var(--ink-2);margin-top:14px;max-width:34ch}
.wsrow{display:flex;align-items:center;gap:10px;margin-top:30px}
.wbig{flex:1;min-width:0;background:transparent;border:none;color:var(--ink);font-family:var(--mono);
  text-align:center;cursor:pointer;padding:10px 0}
.wbig b{display:block;font-size:clamp(54px,17vw,84px);font-weight:700;letter-spacing:-.04em;line-height:1}
.wbig b{white-space:nowrap;overflow:hidden;max-width:100%}
.wbig b.wtxt{font-size:clamp(30px,9.5vw,46px);letter-spacing:-.02em}
.wbig small{display:block;font-size:var(--ui-meta,14px);font-weight:700;letter-spacing:.16em;text-transform:uppercase;
  color:var(--ink-4);margin-top:8px}
.wbig-step{flex:none;width:58px;height:58px;border-radius:50%;border:1px solid var(--hair);background:transparent;
  color:var(--ink);font-size:28px;line-height:1;cursor:pointer}
body.pm-premium .wbig-step{background:var(--surface);border-color:transparent;box-shadow:inset 0 0 0 1px var(--hairline)}
.sess-clock.runclock{font-size:clamp(110px,34vw,180px);margin-top:12vh;text-align:center}
.runw{background:none;border:none;font:inherit;color:var(--ink-2);font-weight:700;cursor:pointer;
  letter-spacing:inherit;text-transform:inherit;padding:0}
#sessRepRow .rep{font-size:23px;padding:19px 0}
.sess-in{display:flex;align-items:flex-end;gap:12px;margin-top:26px}
.sess-in label{display:block;font-family:var(--mono);font-size:var(--ui-meta,14px);font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-4);margin-bottom:7px}
.sess-in input{width:118px;font-family:var(--mono);font-size:26px;font-weight:700;text-align:center;padding:14px 8px}
.sess-x2{padding-bottom:18px;color:var(--ink-4);font-weight:700}
.sess-elapsed{font-family:var(--mono);font-size:var(--ui-meta,14px);font-weight:600;letter-spacing:.1em;color:var(--ink-4);margin-top:18px}
.sess-clock{font-family:var(--mono);font-size:clamp(62px,20vw,104px);font-weight:700;letter-spacing:-.04em;line-height:1;margin-top:8px;font-variant-numeric:tabular-nums}/* Past the target the clock keeps running, because some days you need longer.
   It just stops looking like you are on schedule. This is the one colour on the
   whole site, and it is here because it has to be read from across a gym. */

.sess.over .sess-clock{color:var(--error)}
.sess-over{font-size:var(--ui-meta,14px);font-weight:700;color:var(--error);margin-top:10px}
.sess-why{font-size:14px;line-height:1.6;color:var(--ink-2);margin-top:20px;max-width:38ch}
.sess-next{font-size:var(--ui-meta,14px);color:var(--ink-3);margin-top:18px}
.sess-next b{color:var(--ink)}
.sess-foot{display:flex;flex-direction:column;gap:9px}
.sess-foot .btn{margin-top:0}
.msgrid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}
.msf label{display:block;font-size:var(--ui-meta,14px);font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-4);margin-bottom:6px}
.msf .mline{display:flex;align-items:baseline;gap:8px;margin-top:6px}
.msf .mdel{font-family:var(--mono);font-size:var(--ui-meta,14px);font-weight:700;color:var(--ink-3)}
.cdsel{flex:1;min-width:120px;background:var(--surf);border:1px solid var(--hair);border-radius:13px;
  color:inherit;font-family:inherit;font-size:var(--ui-meta,14px);font-weight:600;padding:12px 13px;-webkit-appearance:none;appearance:none}
body.pm-premium .cdsel{background:var(--surface);border-color:rgba(18,19,20,.12);color:var(--ink)}
.cdrow{display:flex;align-items:center;gap:12px;padding:14px 0;border-bottom:1px solid var(--hair-2)}
.cdrow:last-child{border-bottom:none}
.cdrow .cn{flex:1;min-width:0}
.cdrow .cnm{font-size:14px;font-weight:700}
.cdrow .csub{font-size:var(--ui-meta,14px);color:var(--ink-3);margin-top:3px}
.cdrow .cx{flex:none;width:30px;height:30px;border-radius:100px;border:none;background:transparent;
  font-size:17px;line-height:1;color:var(--ink-4);cursor:pointer}
.lsmodes{display:flex;gap:6px;margin:14px 0 4px}
.lsmodes button{flex:1;border:1px solid var(--hair);background:transparent;border-radius:100px;padding:8px 4px;
  font-size:var(--ui-meta,14px);font-weight:700;letter-spacing:.04em;color:var(--ink-3);cursor:pointer;transition:.2s}
.lsmodes button.on{background:#141516;border-color:var(--ink);color:var(--bg,#0b0b0d)}
body.pm-premium .lsmodes button.on{color:var(--ink-invert)}
.alwrap{position:relative;flex:1;min-width:0}
.alwrap input{width:100%}
.alsug{position:absolute;left:0;right:0;top:calc(100% + 6px);z-index:40;max-height:236px;overflow-y:auto;
  background:#141516;border:1px solid var(--hair);border-radius:14px;box-shadow:0 18px 40px rgba(0,0,0,.45)}
body.pm-premium .alsug{background:var(--surface);border-color:rgba(18,19,20,.09);box-shadow:0 18px 40px -12px rgba(30,31,33,.28)}/* the dropdown has to sit over the buttons below it, and those come later in the page */

.addlift{position:relative;z-index:60}
.alsug button{display:block;width:100%;text-align:left;border:none;background:transparent;cursor:pointer;
  padding:11px 14px;font-size:var(--ui-meta,14px);font-weight:600;color:var(--ink)}
.alsug button+button{border-top:1px solid var(--hair-2)}
.alsug button:hover,.alsug button.pre{background:var(--hair-2)}
.alsug .grp{font-family:var(--mono);font-size:var(--ui-meta,14px);font-weight:700;letter-spacing:.12em;text-transform:uppercase;
  color:var(--ink-4);padding:9px 14px 3px}
.rest{padding:24px 4px;text-align:center;font-size:var(--ui-meta,14px);color:var(--ink-3);font-weight:500;line-height:1.6}/* weight */


.wt{display:flex;align-items:center;gap:13px;padding:14px 0 4px}
.wt label{font-family:var(--mono);font-size:var(--ui-meta,14px);font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-3)}
.wt input{width:74px;font-family:var(--mono);font-size:16px;font-weight:600;padding:10px 8px;text-align:center}
.wt .wstep{width:38px;height:38px;flex:none;border-radius:11px;border:1px solid var(--hair);background:var(--surf);color:var(--ink-invert);font-size:18px;font-weight:600;cursor:pointer;transition:.2s var(--ease)}
.wt .wstep:hover{border-color:rgba(255,255,255,.4);background:rgba(255,255,255,.06)}
.wt .delta{margin-left:auto;font-family:var(--mono);font-size:var(--ui-meta,14px);font-weight:600;color:var(--ink-2)}/* progress */


.stat{display:flex;align-items:baseline;gap:9px;margin-bottom:4px}
.stat .big{font-family:var(--mono);font-weight:700;font-size:34px;letter-spacing:-.02em}.stat .u{font-family:var(--mono);font-size:var(--ui-meta,14px);color:var(--ink-3);font-weight:500}
.stat .d{margin-left:auto;font-family:var(--mono);font-size:var(--ui-meta,14px);font-weight:600;color:var(--ink-2)}
.spark{width:100%;height:64px;margin-top:10px;display:block}
.spark path{fill:none;stroke:var(--accent-ink);stroke-width:2;stroke-linejoin:round;stroke-linecap:round;filter:drop-shadow(0 0 4px rgba(255,255,255,.35))}
.spark circle{fill:#fff}
.lifttrend{display:flex;justify-content:space-between;align-items:center;padding:13px 0;border-bottom:1px solid var(--hair-2);font-size:var(--ui-meta,14px)}
.lifttrend:last-child{border-bottom:none}
.lifttrend .nm{font-weight:600}.lifttrend .v{font-family:var(--mono);font-weight:700}
.lifttrend .v small{color:var(--ink-3);font-weight:500;margin-left:5px}
.photos{display:flex;gap:12px;flex-wrap:wrap;margin-top:4px}
.photoslot{flex:1;min-width:120px;text-align:center}
.photoslot .lbl{font-family:var(--mono);font-size:var(--ui-meta,14px);font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-4);margin-bottom:8px}
.photoslot img{width:100%;border-radius:14px;border:1px solid var(--hair);aspect-ratio:3/4;object-fit:cover;background:rgba(255,255,255,.03)}
.photoslot .empty{display:flex;align-items:center;justify-content:center;width:100%;aspect-ratio:3/4;border:1px dashed var(--hair);border-radius:14px;color:var(--ink-4);font-size:var(--ui-meta,14px)}
.thumbs{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}
.thumb{position:relative;width:54px;height:72px;border-radius:9px;overflow:hidden;border:1px solid var(--hair)}
.thumb img{width:100%;height:100%;object-fit:cover}
.thumb b{position:absolute;top:2px;right:2px;width:17px;height:17px;background:rgba(0,0,0,.72);color:#fff;border-radius:50%;font-size:var(--ui-meta,14px);line-height:17px;text-align:center;cursor:pointer}

.foot{display:flex;gap:10px;margin-top:30px}.foot .btn{margin-top:0}
.hide{display:none!important}
.note{font-family:var(--mono);font-size:var(--ui-meta,14px);letter-spacing:.04em;color:var(--ink-4);text-align:center;margin-top:18px;line-height:1.6}
.warn{font-size:var(--ui-meta,14px);color:#e0b6b6;margin-top:8px}
@media (max-width:480px){h1{font-size:38px}.ring{width:92px;height:92px}.ring-c b{font-size:17px}}
