/* =========================================================================
   v2.2 — Edzéstervező: komponensek (public/training.js).
   Az omni.css tokenjeire épül (--a terület-szín, --o-* paletta), a
   referencia a docs/design/v2 09–13-as képei. Mint az omni.css-ben: kártyán
   nincs backdrop-filter (mozgó háttér fölött minden képkockán újraszámolná).
   ========================================================================= */

/* ---------- Pálcikaember ---------- */
.tf-limb{ stroke:var(--o-ink); stroke-width:3.6; stroke-linecap:round; fill:none; }
.tf-head{ fill:none; }
.tf-prop{ stroke:var(--c-cal); stroke-width:2.6; stroke-linecap:round; stroke-linejoin:round; fill:none; }
.tf-ground{ stroke:rgba(255,255,255,.16); stroke-width:2; }
.tf-joint{ fill:var(--c-plan); }
.tf-joint.hip{ fill:var(--c-guest); }
.tf-hit{ fill:transparent; cursor:grab; }
.tf-thumb{ width:52px; height:60px; flex:0 0 auto; border-radius:14px; background:rgba(0,0,0,.28); border:1px solid var(--o-line);
  display:flex; align-items:center; justify-content:center; overflow:hidden; color:var(--a, var(--o-ink-2)); }
.tf-thumb svg{ width:100%; height:100%; }
.tf-thumb.sm{ width:44px; height:50px; border-radius:12px; }
.tf-thumb.empty .ic{ width:24px; height:24px; opacity:.8; }
.tf-editor{ display:flex; flex-direction:column; gap:12px; }
.tf-stage-wrap{ display:flex; justify-content:center; }
/* A színpad sosem görget és sosem nagyít: minden érintés a figuráé (3.4). */
.tf-stage{ width:min(100%, 330px); height:auto; aspect-ratio:100/124; border-radius:22px; background:rgba(0,0,0,.32);
  border:1px solid var(--o-line-2); touch-action:none; -webkit-user-select:none; user-select:none; -webkit-touch-callout:none; overscroll-behavior:none; }
body.dragging{ overflow:hidden; touch-action:none; overscroll-behavior:none; }
.tf-frames{ display:flex; gap:8px; flex-wrap:wrap; }
.tf-frame{ width:52px; height:62px; border-radius:12px; border:1px solid var(--o-line-2); background:rgba(0,0,0,.25); position:relative;
  cursor:pointer; overflow:hidden; display:flex; align-items:center; justify-content:center; user-select:none; -webkit-user-select:none; }
.tf-frame svg{ width:100%; height:100%; pointer-events:none; }
.tf-frame.on{ border:2px solid var(--c-plan); }
.tf-frame .n{ position:absolute; top:2px; left:5px; font-family:var(--f-mono); font-size:10px; font-weight:600; color:var(--o-ink-2); }
.tf-frame.dragging-frame{ z-index:5; opacity:.85; box-shadow:0 8px 20px rgba(0,0,0,.4); }
.tf-frame.drop-target{ outline:2px dashed var(--c-plan); outline-offset:2px; }
.chip-tg:disabled{ opacity:.4; }

/* ---------- Edzéstervező főlap ---------- */
.trn-plancard{ gap:10px; }
.trn-plancard-top{ display:flex; align-items:center; justify-content:space-between; gap:10px; font-size:19px; }
.trn-plancard-top strong{ overflow-wrap:anywhere; }
.trn-exrow .row-sub{ text-transform:none; letter-spacing:.04em; font-size:11.5px; }

/* ---------- Varázsló (9-es kép) ---------- */
.trn-steps{ margin-top:4px; max-width:260px; }
.trn-steps span.on{ background:var(--c-cal); }
.trn-q{ font-size:30px; margin:4px 0 -6px; }
.trn-hint{ margin:0; font-size:15px; line-height:1.45; }
.trn-opts{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.trn-opt{ display:flex; flex-direction:column; align-items:flex-start; gap:6px; min-height:140px; padding:16px; box-sizing:border-box; text-align:left;
  border-radius:22px; border:1px solid var(--o-line); color:var(--o-ink); cursor:pointer; font:inherit;
  background:linear-gradient(155deg, var(--o-glass-hi), rgba(255,255,255,.012) 60%), var(--o-glass); }
.trn-opt b{ font-family:var(--f-disp); font-size:19px; font-weight:800; margin-top:auto; }
.trn-opt > span:last-child{ font-size:13px; color:var(--o-ink-2); }
.trn-opt-ico{ width:50px; height:50px; border-radius:15px; display:flex; align-items:center; justify-content:center; background:rgba(255,255,255,.08); color:var(--o-ink); }
.trn-opt.on{ border-color:rgba(var(--c-plan-rgb),.8);
  background:linear-gradient(155deg, rgba(var(--c-plan-rgb),.42), rgba(var(--c-plan-rgb),.12) 60%), var(--o-glass); }
.trn-opt.on .trn-opt-ico{ background:var(--c-plan); color:#fff; }
.trn-wiz-nav{ margin-top:8px; }
details.trn-more{ border-top:1px dashed var(--o-line-2); padding-top:12px; }
details.trn-more > summary{ cursor:pointer; font-family:var(--f-mono); font-weight:600; font-size:11.5px; letter-spacing:.14em; text-transform:uppercase;
  color:var(--o-ink-2); display:flex; align-items:center; gap:8px; list-style:none; min-height:36px; }
details.trn-more > summary .ic{ width:18px; height:18px; }
details.trn-more > summary::-webkit-details-marker{ display:none; }

/* ---------- Tervszerkesztő (10-es kép) ---------- */
html[data-theme] input.trn-title-in, .trn-title-in{ font-family:var(--f-disp); font-weight:800; font-size:23px; letter-spacing:-.015em; color:var(--o-ink);
  background:transparent; border:0; border-bottom:1px dashed transparent; padding:0; margin:0; width:100%; min-height:0 !important; border-radius:0 !important; }
.trn-title-in{ background:transparent !important; border:0 !important; border-bottom:1px dashed transparent !important; box-shadow:none !important; padding:0 !important; }
.trn-title-in:focus{ outline:none; border-bottom-color:var(--o-line-2) !important; }
.trn-blk{ gap:4px; padding:16px 16px 12px; }
.trn-blk-head{ display:flex; align-items:center; gap:8px; margin-bottom:6px; flex-wrap:wrap; }
/* Keskeny kijelzőn a típus és a körszám a cím alá törik, nem a címet vágja. */
.trn-blk-ctl{ display:flex; align-items:center; gap:8px; margin-left:auto; }
.trn-blk-title{ flex:1 1 110px; min-width:0; font-family:var(--f-disp); font-weight:800; font-size:20px; color:var(--o-ink);
  background:transparent !important; border:0 !important; padding:0 !important; min-height:36px !important; border-radius:0 !important; }
.trn-blk-title:focus{ outline:none; border-bottom:1px dashed var(--o-line-2) !important; box-shadow:none !important; }
button.trn-type{ cursor:pointer; font:inherit; font-family:var(--f-mono); font-weight:600; font-size:10px; }
.trn-stepper{ display:inline-flex; align-items:center; gap:2px; color:var(--a); }
.trn-stepper b{ font-family:var(--f-disp); font-weight:800; font-size:22px; min-width:38px; text-align:center; }
.trn-stepper button{ width:34px; height:34px; border-radius:11px; border:1px solid rgba(var(--a-rgb),.4); background:rgba(0,0,0,.2); color:var(--a);
  font-size:18px; font-weight:700; cursor:pointer; display:flex; align-items:center; justify-content:center; padding:0; }
.trn-stepper.sm b{ font-size:15px; min-width:28px; }
.trn-stepper.sm button{ width:28px; height:28px; border-radius:9px; font-size:15px; }
.trn-rounds-ro{ font-family:var(--f-disp); font-weight:800; font-size:22px; color:var(--a); }
.trn-tabata{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; margin:2px 0 6px; }
.trn-tbox{ display:flex; flex-direction:column; gap:4px; padding:10px 14px; border-radius:16px; background:rgba(0,0,0,.28); border:1px solid var(--o-line); }
.trn-tbox .lbl{ font-size:10px; }
.trn-time{ width:76px; text-align:right; font-family:var(--f-disp) !important; font-weight:800 !important; font-size:18px !important; color:var(--o-ink);
  background:transparent !important; border:0 !important; padding:0 !important; min-height:32px !important; border-radius:8px !important; font-variant-numeric:tabular-nums; }
.trn-time.big{ width:100%; text-align:left; font-size:30px !important; color:var(--a); }
b.trn-time{ display:inline-block; }
.trn-time:focus{ outline:none; background:rgba(0,0,0,.3) !important; box-shadow:none !important; }
.trn-lines{ display:flex; flex-direction:column; }
.trn-line{ display:flex; align-items:center; gap:12px; padding:10px 0; border-bottom:1px solid var(--o-hair); }
.trn-line:last-child{ border-bottom:0; }
.trn-line-main{ flex:1; min-width:0; display:flex; flex-direction:column; gap:2px; }
.trn-line-main b{ font-size:16px; font-weight:700; line-height:1.25; overflow-wrap:break-word; hyphens:auto; -webkit-hyphens:auto; }
.trn-dose{ display:flex; align-items:baseline; gap:4px; white-space:nowrap; }
.trn-dose b{ font-family:var(--f-disp); font-weight:800; font-size:20px; }
.trn-dose small{ font-family:var(--f-mono); font-size:10.5px; color:var(--o-ink-2); }
.trn-dose .kg{ color:var(--c-cal); }
.trn-num{ width:52px; text-align:right; font-family:var(--f-disp) !important; font-weight:800 !important; font-size:20px !important; color:var(--o-ink);
  background:transparent !important; border:0 !important; border-bottom:1px dashed var(--o-line-2) !important; border-radius:0 !important;
  padding:0 2px !important; min-height:30px !important; font-variant-numeric:tabular-nums; }
.trn-num.kg{ width:44px; color:var(--c-cal); }
.trn-num:focus{ outline:none; border-bottom-color:var(--a) !important; box-shadow:none !important; }
.trn-mbtn{ width:36px; height:36px; border-radius:11px; border:1px solid var(--o-line); background:rgba(255,255,255,.04); color:var(--o-ink-2);
  display:flex; align-items:center; justify-content:center; padding:0; cursor:pointer; flex:0 0 auto; }
.trn-mbtn .ic{ width:20px; height:20px; }
.trn-rest{ display:flex; align-items:center; gap:10px; padding:6px 12px; margin:6px 0; border:1px dashed var(--o-line-2); border-radius:14px; }
.trn-rest .lbl{ flex:1; display:flex; align-items:center; gap:6px; font-size:10.5px; }
.trn-rest .lbl .ic, .trn-blk-foot .lbl .ic, .trn-chain-head .lbl .ic{ width:15px; height:15px; }
.trn-chain{ border:1px solid rgba(var(--a-rgb),.45); border-radius:16px; padding:6px 12px; margin:6px 0; background:rgba(0,0,0,.18); }
.trn-chain-head{ display:flex; align-items:center; gap:8px; flex-wrap:wrap; padding:4px 0; }
.trn-chain-head .lbl{ display:flex; align-items:center; gap:6px; color:var(--a); font-size:10.5px; }
.trn-addex{ display:flex; align-items:center; justify-content:center; gap:8px; min-height:44px; margin-top:6px; border-radius:14px;
  border:1px dashed rgba(var(--a-rgb),.5); background:transparent; color:var(--a); font-family:var(--f-disp); font-weight:700; font-size:15px; cursor:pointer; }
.trn-addex .ic{ width:20px; height:20px; }
.trn-blk-foot{ display:flex; align-items:center; justify-content:space-between; gap:10px; border-top:1px solid var(--o-hair); padding-top:8px; margin-top:6px; }
.trn-blk-foot .lbl{ display:flex; align-items:center; gap:6px; font-size:10.5px; }
.trn-addblk{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; }
.trn-addblk-btn{ display:flex; flex-direction:column; align-items:center; justify-content:center; gap:6px; min-height:76px; border-radius:20px;
  border:1px solid var(--o-line); background:rgba(255,255,255,.05); color:var(--o-ink); font-family:var(--f-disp); font-weight:700; font-size:14.5px; cursor:pointer; }
.trn-addblk-btn .ic{ color:var(--a); }
.trn-dim{ opacity:.55; }
.trn-pick-list{ max-height:52vh; overflow-y:auto; }
.pick .row-ico{ background:rgba(var(--a-rgb),.16); color:var(--a); }

.trn-plan .fld-row{ align-items:end; }

/* ---------- Vendég: terv-kártya (8-as kép), Edzéseim ---------- */
.trn-homecard{ gap:12px; }
.trn-homecard-top{ display:flex; align-items:center; justify-content:space-between; gap:10px; }
.trn-homecard-top .lbl{ display:flex; align-items:center; gap:8px; color:var(--a); }
.trn-homecard-top .lbl .ic{ width:17px; height:17px; }
.trn-homecard-title{ display:flex; align-items:center; justify-content:space-between; gap:10px; background:none; border:0; padding:0; color:var(--o-ink);
  font-family:var(--f-disp); font-weight:800; font-size:27px; letter-spacing:-.015em; text-align:left; cursor:pointer; line-height:1.15; }
.trn-homecard-title .ic{ color:var(--o-ink-3); }
.trn-center{ text-align:center; margin:0; }
.trn-resume .lbl{ display:flex; align-items:center; gap:8px; color:var(--a); }

/* ---------- Levezénylés (11–12-es kép) ---------- */
.trn-run{ gap:14px; }
.trn-run-head{ display:flex; align-items:center; gap:14px; }
.trn-run-prog{ flex:1; min-width:0; display:flex; flex-direction:column; gap:8px; }
.trn-run-prog .lbl{ font-size:10.5px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.trn-run-prog .lbl.gold{ color:var(--c-cal); }
.trn-run-prog .bar{ height:6px; }
.trn-count{ font-size:11px; }
.trn-figcard{ align-items:center; padding:18px; }
.trn-fig{ width:min(62vw, 250px); height:auto; aspect-ratio:100/124; display:block; }
.trn-fig .tf-limb{ stroke-width:4; }
.trn-fig.empty{ display:flex; align-items:center; justify-content:center; color:var(--c-cal); }
.trn-fig.empty .ic{ width:72px; height:72px; stroke-width:1.4; }
.trn-dots{ display:flex; gap:6px; }
.trn-dots i{ width:22px; height:5px; border-radius:999px; background:rgba(255,255,255,.18); }
.trn-dots i.on{ background:var(--c-cal); }
.trn-run-name{ font-size:32px; text-align:center; margin:2px 0 -6px; overflow-wrap:anywhere; }
.trn-plan-line{ font-size:14.5px; }
.trn-timer{ font-family:var(--f-disp); font-weight:800; font-size:clamp(64px, 24vw, 104px); line-height:1; letter-spacing:-.04em; text-align:center;
  font-variant-numeric:tabular-nums; color:var(--o-ink); }
.trn-timer.rest{ color:var(--c-guest); }
.trn-timer.over{ color:var(--o-red-t); }
.trn-over-note{ text-align:center; margin:-6px 0 0; min-height:20px; color:var(--o-red-t); font-weight:700; font-size:14px; }
.trn-steppers{ display:grid; grid-template-columns:repeat(auto-fit,minmax(0,1fr)); gap:10px; }
.trn-big-stepper{ display:flex; align-items:center; justify-content:space-between; gap:6px; padding:8px; border-radius:20px;
  border:1px solid var(--o-line); background:rgba(0,0,0,.25); }
.trn-big-stepper button{ width:52px; height:52px; border-radius:16px; border:1px solid var(--o-line-2); background:rgba(255,255,255,.06); color:var(--o-ink);
  display:flex; align-items:center; justify-content:center; cursor:pointer; padding:0; flex:0 0 auto; }
.trn-big-stepper button:active{ transform:scale(.96); }
.trn-big-stepper span{ display:flex; flex-direction:column; align-items:center; min-width:0; }
.trn-big-stepper b{ font-family:var(--f-disp); font-weight:800; font-size:32px; line-height:1; font-variant-numeric:tabular-nums; }
.trn-big-stepper small{ font-family:var(--f-mono); font-weight:600; font-size:10px; letter-spacing:.14em; text-transform:uppercase; color:var(--o-ink-2); margin-top:4px; }
.trn-next-info{ cursor:default; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; }
.trn-next-info .ic{ flex:0 0 auto; }
.trn-restcard{ align-items:center; text-align:center; padding:34px 20px 26px; gap:14px; min-height:42vh; justify-content:center;
  border-color:rgba(var(--c-guest-rgb),.35); }
.trn-restcard.over{ border-color:rgba(229,87,74,.55);
  background:linear-gradient(155deg, rgba(229,87,74,.28), rgba(229,87,74,.10) 60%), var(--o-glass); }
.trn-over-pill{ visibility:hidden; }
.trn-restcard.over .trn-over-pill{ visibility:visible; }
.trn-restbar{ display:flex; width:100%; height:8px; border-radius:999px; background:rgba(255,255,255,.10); overflow:hidden; }
#trnRestFill{ background:var(--c-guest); height:100%; }
#trnRestOver{ background:var(--o-red-t); height:100%; }
.trn-nextcard{ flex-direction:row; align-items:center; gap:14px; }
.trn-nextcard > div{ display:flex; flex-direction:column; gap:3px; min-width:0; }
.trn-nextcard strong{ font-size:18px; }
.trn-gold{ color:var(--c-cal); font-weight:700; font-size:16px; }

/* ---------- Összegzés (13-as kép) ---------- */
.trn-summary{ gap:14px; }
.trn-donebadge{ width:78px; height:78px; border-radius:24px; margin:6px auto 0; display:flex; align-items:center; justify-content:center;
  background:var(--o-cta); color:var(--o-cta-ink); box-shadow:inset 0 1px 0 rgba(255,255,255,.9), 0 10px 26px rgba(0,0,0,.3); }
.trn-donebadge .ic{ width:38px; height:38px; stroke-width:2.4; }
.trn-summary h1{ margin:0; }
.trn-valid{ height:auto; min-height:28px; white-space:normal; text-align:center; line-height:1.3; padding:5px 12px; }
.trn-tiles .tile{ min-height:0; gap:8px; cursor:default; }
.trn-tiles .num{ font-size:30px; color:var(--o-ink); }
.trn-tiles .num.ok{ color:var(--o-ok); }
.trn-tiles .num.rest{ color:var(--c-guest); }
.trn-tiles .lbl{ font-size:10px; }
.trn-tile-ico .ic{ width:22px; height:22px; color:var(--o-ink); }
.trn-tile-ico.ok .ic{ color:var(--o-ok); }
.trn-tile-ico.rest .ic{ color:var(--c-guest); }
.trn-restcmp{ gap:10px; }
.trn-restcmp.neg{ border-color:rgba(229,87,74,.5); }
.trn-restcmp.pos{ border-color:rgba(var(--o-ok-rgb),.45); }
.trn-restdiff{ display:flex; align-items:baseline; gap:12px; margin:0; flex-wrap:wrap; }
.trn-restdiff b{ font-family:var(--f-disp); font-weight:800; font-size:40px; letter-spacing:-.03em; }
.trn-restdiff b.neg{ color:var(--o-red-t); }
.trn-restdiff b.pos{ color:var(--o-ok); }
.trn-cmprow{ display:grid; grid-template-columns:96px minmax(0,1fr) auto; align-items:center; gap:12px; }
.trn-cmprow .lbl{ font-size:10px; }
.trn-cmprow b{ font-family:var(--f-disp); font-weight:800; font-variant-numeric:tabular-nums; }
.trn-cmpbar{ height:10px; border-radius:999px; background:rgba(255,255,255,.08); overflow:hidden; }
.trn-cmpbar span{ display:block; height:100%; border-radius:999px; }
.trn-cmpbar .plan{ background:var(--c-guest); }
.trn-cmpbar .act{ background:var(--o-ink-2); }
.trn-cmpbar .act.neg{ background:var(--o-red-t); }
.trn-cmpbar .act.pos{ background:var(--o-ok); }
.trn-blkrow{ min-height:52px; }
.trn-dot{ width:10px; height:10px; border-radius:50%; background:var(--a); flex:0 0 auto; }
.trn-blkrow .lbl{ font-size:10.5px; }
.row-val.trn-changed{ color:var(--c-cal); }

/* ---------- Chat-kártya ---------- */
.trn-ccard{ display:flex; flex-direction:column; gap:8px; min-width:220px; padding:4px 0 2px; color:var(--o-ink); }
.trn-ccard .lbl{ display:flex; align-items:center; gap:6px; color:var(--a); font-size:10px; }
.trn-ccard .lbl .ic{ width:15px; height:15px; }
.trn-ccard strong{ font-size:17px; font-family:var(--f-disp); }
.trn-ccard .ob{ min-height:42px; font-size:14.5px; }
html[data-theme] .chat-msg.has-card, html[data-theme] .chat-msg.mine.has-card{ background:linear-gradient(155deg, var(--o-glass-hi), rgba(255,255,255,.012) 60%), var(--o-solid);
  border:1px solid rgba(var(--a-rgb, 154,171,164),.35); color:var(--o-ink); min-width:240px; }
html[data-theme] .chat-msg.has-card.mine{ border-color:rgba(var(--c-chat-rgb),.55); }

/* ---------- Vendégkártya: Edzések ---------- */
.trn-guestsec > .lbl{ display:flex; align-items:center; gap:8px; }
.trn-guestsec .pl{ cursor:pointer; font:inherit; font-family:var(--f-mono); font-weight:600; font-size:10.5px; }

/* Telefonon a blokk típusa csak ikon (a teljes név a blokk-menüben), a
   láncon belül nincs bélyegkép -- különben a gyakorlat neve szóközepén törne. */
@media (max-width:480px){
  .trn-type .trn-type-t{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); }
  .trn-type{ padding:0 8px; }
  .trn-stepper button{ width:30px; height:30px; }
  .trn-stepper b{ min-width:34px; font-size:20px; }
  .trn-chain .tf-thumb{ display:none; }
}
@media (max-width:370px){
  .trn-opt{ min-height:124px; padding:13px; }
  .trn-opt b{ font-size:17px; }
  .trn-big-stepper button{ width:44px; height:44px; }
  .trn-big-stepper b{ font-size:26px; }
  .trn-cmprow{ grid-template-columns:80px minmax(0,1fr) auto; }
}

/* =========================================================================
   v2.3 — Termékek, Kérések (public/shop.js), Fejlődés
   ========================================================================= */
button.set-row.shop-prow{ width:100%; background:none; border-left:0; border-right:0; border-top:0; color:var(--o-ink); font:inherit; text-align:left; cursor:pointer; }
.shop-order{ gap:10px; }
.shop-order-top{ display:flex; align-items:center; gap:12px; }
.shop-note{ margin:0; font-size:15px; line-height:1.45; color:var(--o-ink); padding:10px 14px; border-radius:14px; background:rgba(0,0,0,.25); border:1px solid var(--o-line); }
.shop-balance{ flex-direction:row; align-items:center; justify-content:space-between; }
.shop-card{ gap:10px; }
.shop-card-top{ display:flex; align-items:center; justify-content:space-between; gap:10px; }
.shop-card-top .lbl{ display:flex; align-items:center; gap:8px; color:var(--a); }
.shop-card-top .lbl .ic{ width:17px; height:17px; }
.shop-price{ font-family:var(--f-disp); font-weight:800; font-size:24px; color:var(--c-cal); white-space:nowrap; font-variant-numeric:tabular-nums; }
.shop-price small{ font-family:var(--f-mono); font-size:10px; font-weight:600; letter-spacing:.14em; color:var(--o-ink-2); margin-left:6px; text-transform:uppercase; }
.shop-card-name{ font-family:var(--f-disp); font-size:22px; font-weight:800; letter-spacing:-.01em; line-height:1.2; }
.shop-short{ margin:0; font-size:14px; font-weight:700; color:var(--o-red-t); }
.shop-sum{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
.shop-sum > div{ display:flex; flex-direction:column; gap:6px; padding:12px 14px; border-radius:16px; background:rgba(0,0,0,.25); border:1px solid var(--o-line); }
.shop-sum b{ font-family:var(--f-disp); font-weight:800; font-size:24px; font-variant-numeric:tabular-nums; }
.shop-sum > div:first-child b{ color:var(--c-cal); }

.trn-tile-ico.gold .ic, .trn-tiles .num.gold{ color:var(--c-cal); }
.prg-ex{ gap:8px; }
.prg-ex-top{ display:flex; align-items:center; justify-content:space-between; gap:10px; }
.prg-ex-top strong{ font-size:17px; }
.prg-spark{ width:100%; height:70px; display:block; overflow:visible; }
.prg-spark polyline{ fill:none; stroke:var(--c-rep); stroke-width:2.5; stroke-linejoin:round; stroke-linecap:round; vector-effect:non-scaling-stroke; }
.prg-spark circle{ fill:var(--c-rep); }
.prg-spark circle.best{ fill:var(--c-cal); }
.prg-ex-foot{ display:flex; align-items:center; justify-content:space-between; gap:10px; flex-wrap:wrap; }
.prg-best{ display:inline-flex; align-items:center; gap:6px; font-size:15px; color:var(--o-ink-2); }
.prg-best .ic{ width:18px; height:18px; color:var(--c-cal); }
.prg-best b{ color:var(--o-ink); font-family:var(--f-disp); font-weight:800; }
.prg-best small{ font-family:var(--f-mono); font-size:10.5px; letter-spacing:.1em; text-transform:uppercase; }
.prg-diff{ font-family:var(--f-disp); font-weight:800; font-size:16px; color:var(--o-ink-2); }
.prg-diff.up{ color:var(--o-ok); }
.prg-diff.down{ color:var(--o-red-t); }
.shop-actions{ grid-template-columns:minmax(0,1.5fr) minmax(0,1fr); }
.shop-actions .ob{ white-space:nowrap; padding:0 12px; }

/* ---------- v2.4: kezdőképernyő, Start nyomva tartással ---------- */
.trn-ready{ gap:16px; }
.trn-hold-wrap{ display:flex; flex-direction:column; align-items:center; gap:12px; margin:10px 0 4px; }
.trn-hold{ position:relative; width:200px; height:200px; border-radius:50%; border:0; padding:0; cursor:pointer; background:none;
  -webkit-user-select:none; user-select:none; -webkit-touch-callout:none; touch-action:none; color:var(--o-cta-ink); }
.trn-hold > svg{ position:absolute; inset:0; width:100%; height:100%; transform:rotate(-90deg); }
.trn-hold circle{ fill:none; stroke-width:8; }
.trn-hold circle.bg{ stroke:rgba(255,255,255,.12); }
.trn-hold circle.fg{ stroke:var(--c-cal); stroke-linecap:round; stroke-dasharray:339.3; stroke-dashoffset:339.3; }
.trn-hold-t{ position:absolute; inset:16px; border-radius:50%; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:4px;
  background:var(--o-cta); box-shadow:inset 0 1px 0 rgba(255,255,255,.9), 0 14px 34px rgba(0,0,0,.35); transition:transform .2s ease; }
.trn-hold-t b{ font-family:var(--f-disp); font-weight:800; font-size:30px; letter-spacing:-.01em; }
.trn-hold-t .ic{ width:30px; height:30px; }
.trn-hold.holding .trn-hold-t{ transform:scale(.94); }
#trnHoldHint{ font-size:14px; transition:color .2s; }
#trnHoldHint.nudge{ color:var(--c-cal); }

/* ---------- v2.4: közös könyvtár, szűrés, privát jel ---------- */
.trn-pick-filters{ margin:10px 0 0; gap:6px; }
.trn-pick-filters .chip-tg{ height:36px; padding:0 10px; font-size:13px; }
.trn-pick-filters .chip-tg .ic{ width:16px; height:16px; }
.trn-pick-filters.tags{ max-height:84px; overflow-y:auto; }
.trn-pick-list{ margin-top:12px; }
.trn-lock{ display:inline-flex; margin-left:6px; color:var(--o-ink-3); vertical-align:middle; }
.trn-lock .ic{ width:15px; height:15px; }
.trn-private{ margin-top:6px; font-size:15px; }

/* ---------- v2.4: az edző saját edzései ---------- */
.trn-self-sum .lbl{ display:flex; align-items:center; gap:8px; color:var(--a); }
.trn-self-nums{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; }
.trn-self-nums span{ display:flex; flex-direction:column; gap:4px; }
.trn-self-nums .num{ font-size:28px; color:var(--o-ink); }
.trn-self-nums small{ font-family:var(--f-mono); font-size:10px; letter-spacing:.12em; text-transform:uppercase; color:var(--o-ink-2); }