/* Rep Atlas · «Журнал тренера» — ALL brand colours and fonts live here (coach, client page, «Моя програма», sign-up, lock screen). Three ready themes; brand.js line 1 picks one (html.theme-black | .theme-navy | .theme-emerald). BLACK is the default. Contrast: every text pair below is ≥ 4.5:1 (AA) in light and dark; gold is never used for small text on ivory/white — on light surfaces small «gold» text uses --ra-gold-ink (a deep bronze), real gold only on the dark brand colour. */ /* ---------- 1. palettes (the only place with brand hex codes) ---------- */ html.theme-navy{ --ra-brand:#0D1730; --ra-brand-2:#1A2850; --ra-gold:#CFAE6B; --ra-ivory:#F3E9D2; --ra-bg:#F6F7FA; --ra-gold-ink:#6B4F1A; --ra-hold:#24407A; --ra-down:#9E3B2C; --ra-good:#1D7350; --ra-d-bg:#0A1022; --ra-d-surface:#121A33; --ra-d-soft:#18213F; --ra-d-line:#2A3660; --ra-d-muted:#A9B0C4; } html.theme-black{ /* v1.14 DEFAULT — «Графіт-помаранч»: always dark graphite + orange, amber chips; sporty fonts */ --ra-brand:#1B1D23; --ra-brand-2:#2A2D35; --ra-gold:#FF6A2B; --ra-ivory:#F4F4F6; --ra-bg:#F3F4F6; --ra-gold-ink:#B8430F; --ra-hold:#5C8DFF; --ra-down:#FF7A6B; --ra-good:#3DD68C; --ra-d-bg:#16181D; --ra-d-surface:#22252C; --ra-d-soft:#2A2D35; --ra-d-line:#363A44; --ra-d-muted:#A3A8B3; } html.theme-emerald{ --ra-brand:#0E3A30; --ra-brand-2:#17503F; --ra-gold:#C8A45A; --ra-ivory:#F2EDE0; --ra-bg:#F4F6F3; --ra-gold-ink:#6A501C; --ra-hold:#0E5A49; --ra-down:#9B3A2C; --ra-good:#1F6E4E; --ra-d-bg:#07201A; --ra-d-surface:#0D2C24; --ra-d-soft:#12372E; --ra-d-line:#24524A; --ra-d-muted:#A8BDB5; } html.theme-orange{ /* v1.9.8 coach — як старий журнал: помаранчевий градієнт, біле, синій для «Змінити» */ --ra-brand:#E8572B; --ra-brand-2:#F5832A; --ra-gold:#F28A3C; --ra-ivory:#FFF1E6; --ra-bg:#F5F6FA; --ra-gold-ink:#A8431A; --ra-hold:#1F5FD1; --ra-down:#C0392B; --ra-good:#1E7B4F; --ra-d-bg:#121214; --ra-d-surface:#1C1C20; --ra-d-soft:#24242A; --ra-d-line:#3A3A42; --ra-d-muted:#B4B4BE; } html.ra{ --ra-f-brand:"Lora",Georgia,"Times New Roman",serif; --ra-f-body:"Inter",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif; --ra-f-num:"JetBrains Mono",ui-monospace,"SFMono-Regular",Menlo,monospace; } /* ---------- 2. light mode: map the brand onto the variables the pages already use ---------- */ html.ra{ color-scheme:light; --bg:var(--ra-bg); --surface:#ffffff; --ink:#17171A; --muted:#5A5852; --line:#DCDFE7; --soft:#F2F3F7; --accent:var(--ra-brand); --accent2:var(--ra-brand-2); --accent-ink:var(--ra-gold); --edit:var(--ra-hold); --good:var(--ra-good); --warm:var(--ra-gold-ink); --cool:var(--ra-hold); --goal:var(--ra-brand); --mark:var(--ra-hold); --sp-prev:var(--ra-hold); --sp-now:var(--ra-gold-ink); --hero1:var(--ra-brand); --hero2:var(--ra-brand-2); --f-display:var(--ra-f-brand); --f-body:var(--ra-f-body); --f-num:var(--ra-f-num); /* role tokens used below */ --ra-btn-bg:var(--ra-brand); --ra-btn-ink:var(--ra-gold); --ra-sel-bg:var(--ra-brand); --ra-sel-ink:var(--ra-ivory); --ra-chip-bg:var(--ra-gold); --ra-chip-ink:var(--ra-brand); --ra-tint:color-mix(in srgb,var(--ra-ivory) 45%,#fff); /* light cream tint for «Ціль» panels */ --ra-rule:var(--ra-gold); --ra-small-gold:var(--ra-gold-ink); --ra-ring:color-mix(in srgb,var(--ra-gold) 55%,transparent); --shadow:0 1px 2px rgba(13,23,48,.06),0 6px 18px rgba(13,23,48,.07); } /* ---------- 3. dark mode (system dark, unless the page forces light) ---------- */ @media (prefers-color-scheme: dark){html.ra:not([data-theme="light"]){ color-scheme:dark; --bg:var(--ra-d-bg); --surface:var(--ra-d-surface); --ink:var(--ra-ivory); --muted:var(--ra-d-muted); --line:var(--ra-d-line); --soft:var(--ra-d-soft); --accent:var(--ra-gold); --accent2:var(--ra-gold); --accent-ink:var(--ra-brand); --edit:#9DB8EE; --good:#6CCB9F; --warm:var(--ra-gold); --cool:#9DB8EE; --goal:var(--ra-gold); --mark:#9DB8EE; --sp-prev:#9DB8EE; --sp-now:var(--ra-gold); --ra-down:#F29A84; --ra-btn-bg:var(--ra-gold); --ra-btn-ink:var(--ra-brand); --ra-sel-bg:var(--ra-gold); --ra-sel-ink:var(--ra-brand); --ra-tint:color-mix(in srgb,var(--ra-gold) 9%,var(--ra-d-surface)); --ra-small-gold:var(--ra-gold); --shadow:0 1px 2px rgba(0,0,0,.35),0 8px 22px rgba(0,0,0,.35); }} html.ra[data-theme="dark"]{ color-scheme:dark; --bg:var(--ra-d-bg); --surface:var(--ra-d-surface); --ink:var(--ra-ivory); --muted:var(--ra-d-muted); --line:var(--ra-d-line); --soft:var(--ra-d-soft); --accent:var(--ra-gold); --accent2:var(--ra-gold); --accent-ink:var(--ra-brand); --edit:#9DB8EE; --good:#6CCB9F; --warm:var(--ra-gold); --cool:#9DB8EE; --goal:var(--ra-gold); --mark:#9DB8EE; --sp-prev:#9DB8EE; --sp-now:var(--ra-gold); --ra-down:#F29A84; --ra-btn-bg:var(--ra-gold); --ra-btn-ink:var(--ra-brand); --ra-sel-bg:var(--ra-gold); --ra-sel-ink:var(--ra-brand); --ra-tint:color-mix(in srgb,var(--ra-gold) 9%,var(--ra-d-surface)); --ra-small-gold:var(--ra-gold); } /* ---------- 4. typography ---------- */ html.ra:where(:not(.theme-orange):not(.theme-black)) body{font-family:var(--ra-f-body);background:var(--bg);color:var(--ink)} html.ra:where(:not(.theme-orange):not(.theme-black)) h1,html.ra:where(:not(.theme-orange):not(.theme-black)) h2,html.ra:where(:not(.theme-orange):not(.theme-black)) .wiz-head h2,html.ra:where(:not(.theme-orange):not(.theme-black)) .section-t,html.ra:where(:not(.theme-orange):not(.theme-black)) .login-card h2,html.ra:where(:not(.theme-orange):not(.theme-black)) .sec-t,html.ra:where(:not(.theme-orange):not(.theme-black)) .state h2{font-family:var(--ra-f-brand);font-weight:700;letter-spacing:0} html.ra:where(:not(.theme-orange):not(.theme-black)) .tab{font-family:var(--ra-f-brand);font-weight:600} .ra-wm{font-family:var(--ra-f-brand);font-weight:700;letter-spacing:.01em;white-space:nowrap} .ra-wm i{font-weight:400;font-style:italic} .ra-sub{font:600 10px/1.2 var(--ra-f-body);letter-spacing:.32em;text-transform:uppercase} /* ---------- 5. logo tile ---------- */ .ra-logo{display:block;flex:none;background:var(--ra-brand);border-radius:22%;padding:6%;box-sizing:border-box;box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--ra-gold) 35%,transparent)} .ra-logo.ra-logo-light{background:none;box-shadow:none;padding:0;border-radius:0} /* light-background version: no tile */ /* ---------- 6. coach header (journal) ---------- */ .ra-bar{display:flex;align-items:center;gap:10px;background:var(--ra-brand);color:var(--ra-ivory);border-radius:12px;padding:7px 12px 7px 8px;box-shadow:var(--shadow);border-bottom:2px solid var(--ra-gold)} .ra-bar .ra-logo{width:40px;height:40px;box-shadow:none;padding:0} .ra-bar .ra-wm{font-size:19px;color:var(--ra-ivory)} .ra-bar .ra-wm i{color:var(--ra-gold)} .ra-bar .ra-sub{color:var(--ra-gold);display:block;margin-top:2px;font-size:9px;letter-spacing:.28em} .ra-bar .ra-ws{margin-left:auto;font:500 12.5px var(--ra-f-body);color:color-mix(in srgb,var(--ra-ivory) 88%,var(--ra-brand));text-align:right;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap} /* ---------- 7. sign-up / login / lock screen ---------- */ html.ra .login{background:radial-gradient(900px 520px at 50% -10%,var(--ra-brand-2),var(--ra-brand) 70%);overflow-y:auto;padding-top:24px;padding-bottom:24px} html.ra .login-card{background:var(--surface);border:1px solid color-mix(in srgb,var(--ra-gold) 45%,var(--line));border-top:3px solid var(--ra-gold);border-radius:16px;padding:22px;box-shadow:0 24px 60px rgba(0,0,0,.35)} .ra-auth-head{display:flex;flex-direction:column;align-items:center;gap:6px;margin:-4px 0 8px;text-align:center} .ra-auth-head .ra-logo{width:92px;height:92px} .ra-auth-head .ra-wm{font-size:30px;color:var(--ink)} .ra-auth-head .ra-wm i{color:var(--ra-small-gold)} .ra-auth-head .ra-sub{color:var(--muted)} html.ra .auth-tabs{background:var(--soft);border:1px solid var(--line)} html.ra .auth-tabs button[aria-selected="true"]{background:var(--ra-sel-bg);color:var(--ra-sel-ink);box-shadow:none} html.ra .login-msg.err{color:var(--ra-down)} html.ra #lockScreen h2{font-size:22px} html.ra #lockScreen #lockText{font-size:15px;line-height:1.5;margin:0} /* ---------- 8. buttons, tabs, chips (solid colours: no gradients behind text) ---------- */ html.ra:where(:not(.theme-orange):not(.theme-black)) .btn-main,html.ra:where(:not(.theme-orange):not(.theme-black)) .main,html.ra:where(:not(.theme-orange):not(.theme-black)) .today,html.ra:where(:not(.theme-orange):not(.theme-black)) .fab,html.ra:where(:not(.theme-orange):not(.theme-black)) .msg.u{background:var(--ra-btn-bg);color:var(--ra-btn-ink);border:1px solid var(--ra-btn-bg);box-shadow:0 3px 10px rgba(13,23,48,.18),inset 0 -2px 0 color-mix(in srgb,var(--ra-gold) 35%,transparent)} html.ra:where(:not(.theme-orange):not(.theme-black)) .btn-main:hover,html.ra:where(:not(.theme-orange):not(.theme-black)) .main:hover,html.ra:where(:not(.theme-orange):not(.theme-black)) .today:hover{filter:brightness(1.12)} html.ra:where(:not(.theme-orange):not(.theme-black)) .tab[aria-selected="true"],html.ra:where(:not(.theme-orange):not(.theme-black)) .pick-opt[aria-selected="true"]{background:var(--ra-sel-bg);color:var(--ra-sel-ink);box-shadow:0 6px 16px rgba(13,23,48,.22),inset 0 -2px 0 var(--ra-gold)} html.ra:where(:not(.theme-orange):not(.theme-black)) .tab[aria-selected="true"] small{color:var(--ra-sel-ink);opacity:.9} html.ra:where(:not(.theme-orange):not(.theme-black)) .tab.add{color:var(--ra-small-gold)} html.ra:where(:not(.theme-orange):not(.theme-black)) .week{background:var(--ra-sel-bg);color:var(--ra-sel-ink);font-family:var(--ra-f-body);font-weight:600} html.ra:where(:not(.theme-orange):not(.theme-black)) .panel::before{background:var(--ra-gold);height:3px} html.ra:where(:not(.theme-orange):not(.theme-black)) .ex:not(.chk)::before{background:var(--ra-gold)} html.ra:where(:not(.theme-orange):not(.theme-black)) .ex.done:not(.chk)::before{background:var(--good)} html.ra:where(:not(.theme-orange):not(.theme-black)) .num{background:color-mix(in srgb,var(--ra-gold) 22%,transparent);color:var(--ra-small-gold)} html.ra:where(:not(.theme-orange):not(.theme-black)) .ex.done .num{background:color-mix(in srgb,var(--good) 14%,transparent);color:var(--good)} html.ra:where(:not(.theme-orange):not(.theme-black)) .ex-toggle[aria-expanded="true"] .ex-i{background:var(--ra-sel-bg);border-color:var(--ra-sel-bg);color:var(--ra-sel-ink)} html.ra:where(:not(.theme-orange):not(.theme-black)) .set input:focus,html.ra:where(:not(.theme-orange):not(.theme-black)) input:focus-visible,html.ra:where(:not(.theme-orange):not(.theme-black)) button:focus-visible{border-color:var(--ra-small-gold);box-shadow:0 0 0 3px var(--ra-ring);outline:none} html.ra:where(:not(.theme-orange):not(.theme-black)) .exp-badge{border-color:var(--ra-small-gold);color:var(--ra-small-gold)} html.ra:where(:not(.theme-orange):not(.theme-black)) .linkbtn,html.ra:where(:not(.theme-orange):not(.theme-black)) a{color:var(--ra-hold)} @media (prefers-color-scheme: dark){html.ra:where(:not(.theme-orange):not(.theme-black)):not([data-theme="light"]) .linkbtn,html.ra:where(:not(.theme-orange):not(.theme-black)):not([data-theme="light"]) a{color:var(--edit)}} html.ra:where(:not(.theme-orange):not(.theme-black)) .share a.btn-sm{color:var(--ink)} html.ra:where(:not(.theme-orange):not(.theme-black)) .btn-main.btn-sm,html.ra:where(:not(.theme-orange):not(.theme-black)) a.btn-main{color:var(--ra-btn-ink)} html.ra:where(:not(.theme-orange):not(.theme-black)) a.today{color:var(--ra-btn-ink)} /* «Ціль сьогодні»: a gold label chip on an ivory tint, numbers keep their meaning (up / hold / down / deload) */ html.ra:where(:not(.theme-orange):not(.theme-black)) .rec{background:var(--ra-tint);border:1px solid color-mix(in srgb,var(--ra-gold) 40%,var(--line));border-left:4px solid var(--ra-gold)} html.ra:where(:not(.theme-orange):not(.theme-black)) .rec.up{border-left-color:var(--good)}html.ra:where(:not(.theme-orange):not(.theme-black)) .rec.down{border-left-color:var(--ra-down)}html.ra:where(:not(.theme-orange):not(.theme-black)) .rec.first,html.ra:where(:not(.theme-orange):not(.theme-black)) .rec.return{border-left-color:var(--muted)} html.ra:where(:not(.theme-orange):not(.theme-black)) .rec-l,html.ra:where(:not(.theme-orange):not(.theme-black)) .goal .l{display:inline-block;background:var(--ra-chip-bg);color:var(--ra-chip-ink);border-radius:6px;padding:2px 7px;letter-spacing:.06em;font-weight:700} html.ra:where(:not(.theme-orange):not(.theme-black)) .rec-v{color:var(--ink)} html.ra:where(:not(.theme-orange):not(.theme-black)) .rec.up .rec-v{color:var(--good)}html.ra:where(:not(.theme-orange):not(.theme-black)) .rec.down .rec-v{color:var(--ra-down)}html.ra:where(:not(.theme-orange):not(.theme-black)) .rec.hold .rec-v{color:var(--edit)} html.ra:where(:not(.theme-orange):not(.theme-black)) .rec.deload .rec-v{color:var(--ra-small-gold)} html.ra:where(:not(.theme-orange):not(.theme-black)) .goal{background:var(--ra-tint);border-left:4px solid var(--ra-gold);border-top:1px solid color-mix(in srgb,var(--ra-gold) 30%,transparent)} html.ra:where(:not(.theme-orange):not(.theme-black)) .goal .v{color:var(--goal)} html.ra:where(:not(.theme-orange):not(.theme-black)) .tgt{color:var(--goal)} html.ra:where(:not(.theme-orange):not(.theme-black)) .chk-warmup .ttl,html.ra:where(:not(.theme-orange):not(.theme-black)) .chk-cooldown .ttl{color:var(--ink)} html.ra:where(:not(.theme-orange):not(.theme-black)) .chk-warmup,html.ra:where(:not(.theme-orange):not(.theme-black)) .chk-cooldown{background:var(--surface)} /* wizard */ html.ra .wiz{background:color-mix(in srgb,var(--ra-brand) 70%,transparent)} html.ra .wiz-card{border-top:3px solid var(--ra-gold);border-radius:16px} html.ra .mcard{background:var(--surface);border:1px solid var(--line)} html.ra .mcard b{font-family:var(--ra-f-brand);font-size:15.5px} html.ra .mcard[aria-pressed="true"]{border-color:var(--ra-gold);box-shadow:inset 0 0 0 1px var(--ra-gold),0 6px 16px rgba(13,23,48,.12);background:var(--ra-tint)} html.ra .wtable tr.dl td{color:var(--ra-small-gold)} /* client pages: brand line = theme logo + the trainer's own name */ html.ra .brand{display:flex;align-items:center;gap:8px;font:700 13px var(--ra-f-brand);letter-spacing:.02em;text-transform:none;color:var(--ink)} html.ra .brand .ra-logo{width:34px;height:34px} .ra-foot{margin:18px 0 0;text-align:center;font:12px var(--ra-f-body);color:var(--muted)} .ra-foot .ra-wm{font-size:13px}.ra-foot .ra-wm i{color:var(--ra-small-gold)} html.ra .done-badge{background:var(--good);color:#fff} html.ra .state{border-top:3px solid var(--ra-gold)} /* program edit banner: brand bar with a gold rule; its quiet buttons in ivory (not muted grey on a dark bar) */ html.ra .editbanner{background:var(--ra-brand);color:var(--ra-ivory);border-bottom:2px solid var(--ra-gold)} html.ra .editbanner .btn-ghost{color:var(--ra-ivory);border-color:color-mix(in srgb,var(--ra-ivory) 45%,transparent)} html.ra .editbanner .btn-sm:not(.btn-ghost){background:var(--ra-gold);color:var(--ra-brand);border-color:var(--ra-gold)} /* ======================= 9. SIZE — comfortable on a phone. Tune everything here ======================= */ html.ra:where(:not(.theme-orange):not(.theme-black)){ --fs-base:17px; /* body text */ --fs-small:14px; /* secondary text, labels, hints — never smaller */ --fs-btn:16px; /* buttons, tabs, chips */ --fs-h:18px; /* exercise / card headings */ --fs-goal:19px; /* the «Ціль сьогодні» value */ --fs-num:13.5px; /* weight / reps / reserve fields in the coach journal (as before the size change, by the owner's choice) */ --fs-num-client:17px; --pad-num:5px 4px; --pad-num-client:10px 6px; /* the same fields on the client page */ --tap:46px; /* minimum height of every button, select, input, tab */ --tap-num:0px; /* number fields: no extra height (natural size as before); «великий» sets 58 px */ --fs-top:17.5px; /* TOP MENU: header bar, date, client, action buttons, chips, day tabs (coach) and header/day tabs (client pages) */ --tap-top:50px; --tap-chip:42px; /* day tabs, client chips */ --gap-card:14px; /* space between cards */ } /* «Розмір тексту: великий» (per device, coach footer) */ /* «Розмір тексту: компактний» — за замовчуванням з v1.9.3 (щільніше, як старий журнал) */ html.ra:where(:not(.theme-orange):not(.theme-black)).ra-size-sm{--fs-base:15px; --fs-small:12.5px; --fs-btn:14px; --fs-h:16px; --fs-goal:17px; --fs-num:13.5px; --tap:40px; --gap-card:10px; --fs-top:15px; --tap-top:40px; --tap-chip:34px} html.ra:where(:not(.theme-orange):not(.theme-black)).ra-size-lg{--fs-base:19px; --fs-small:16px; --fs-btn:18px; --fs-h:20px; --fs-goal:21px; --fs-num:21px; --fs-num-client:21px; --pad-num:8px 4px; --pad-num-client:8px 4px; --tap:52px; --tap-num:58px; --tap-chip:48px; --gap-card:16px; --fs-top:19px; --tap-top:54px} html.ra:where(:not(.theme-orange):not(.theme-black)) body{font-size:var(--fs-base);line-height:1.45} html.ra:where(:not(.theme-orange):not(.theme-black)) .wrap{gap:var(--gap-card)} html.ra:where(:not(.theme-orange):not(.theme-black)) .wrap{zoom:1} html.ra:where(:not(.theme-orange):not(.theme-black)) .list{gap:var(--gap-card)} /* text */ html.ra:where(:not(.theme-orange):not(.theme-black)) .lbl,html.ra:where(:not(.theme-orange):not(.theme-black)) label.lbl,html.ra:where(:not(.theme-orange):not(.theme-black)) .sethead,html.ra:where(:not(.theme-orange):not(.theme-black)) .legend,html.ra:where(:not(.theme-orange):not(.theme-black)) .cue,html.ra:where(:not(.theme-orange):not(.theme-black)) .prevline,html.ra:where(:not(.theme-orange):not(.theme-black)) .rec-why,html.ra:where(:not(.theme-orange):not(.theme-black)) .rec-plan,html.ra:where(:not(.theme-orange):not(.theme-black)) .status,html.ra:where(:not(.theme-orange):not(.theme-black)) details,html.ra:where(:not(.theme-orange):not(.theme-black)) summary, html.ra:where(:not(.theme-orange):not(.theme-black)) .target,html.ra:where(:not(.theme-orange):not(.theme-black)) .progline,html.ra:where(:not(.theme-orange):not(.theme-black)) .info-goal,html.ra:where(:not(.theme-orange):not(.theme-black)) .send-line,html.ra:where(:not(.theme-orange):not(.theme-black)) .send-warn,html.ra:where(:not(.theme-orange):not(.theme-black)) .send-info,html.ra:where(:not(.theme-orange):not(.theme-black)) .ed-cue,html.ra:where(:not(.theme-orange):not(.theme-black)) .muted,html.ra:where(:not(.theme-orange):not(.theme-black)) small,html.ra:where(:not(.theme-orange):not(.theme-black)) .tab small,html.ra:where(:not(.theme-orange):not(.theme-black)) .pick-opt small, html.ra:where(:not(.theme-orange):not(.theme-black)) .acct,html.ra:where(:not(.theme-orange):not(.theme-black)) .acct-foot,html.ra:where(:not(.theme-orange):not(.theme-black)) .login-note,html.ra:where(:not(.theme-orange):not(.theme-black)) .login-msg,html.ra:where(:not(.theme-orange):not(.theme-black)) .trial-bar,html.ra:where(:not(.theme-orange):not(.theme-black)) .chk-d,html.ra:where(:not(.theme-orange):not(.theme-black)) .chk-count,html.ra:where(:not(.theme-orange):not(.theme-black)) .src-client,html.ra:where(:not(.theme-orange):not(.theme-black)) .conflict,html.ra:where(:not(.theme-orange):not(.theme-black)) .mark-note,html.ra:where(:not(.theme-orange):not(.theme-black)) .was-note, html.ra:where(:not(.theme-orange):not(.theme-black)) .wiz-steps,html.ra:where(:not(.theme-orange):not(.theme-black)) .mcard span,html.ra:where(:not(.theme-orange):not(.theme-black)) .mcard em,html.ra:where(:not(.theme-orange):not(.theme-black)) .wtable,html.ra:where(:not(.theme-orange):not(.theme-black)) .whead,html.ra:where(:not(.theme-orange):not(.theme-black)) .ra-sub,html.ra:where(:not(.theme-orange):not(.theme-black)) .short-prev,html.ra:where(:not(.theme-orange):not(.theme-black)) .short-gt,html.ra:where(:not(.theme-orange):not(.theme-black)) .exm-params label.chk,html.ra:where(:not(.theme-orange):not(.theme-black)) .wrow-x, html.ra:where(:not(.theme-orange):not(.theme-black)) .prev,html.ra:where(:not(.theme-orange):not(.theme-black)) .prev b,html.ra:where(:not(.theme-orange):not(.theme-black)) .meta,html.ra:where(:not(.theme-orange):not(.theme-black)) .li-d,html.ra:where(:not(.theme-orange):not(.theme-black)) .goal .why,html.ra:where(:not(.theme-orange):not(.theme-black)) .week,html.ra:where(:not(.theme-orange):not(.theme-black)) .pic span,html.ra:where(:not(.theme-orange):not(.theme-black)) .exp-badge,html.ra:where(:not(.theme-orange):not(.theme-black)) .ra-foot,html.ra:where(:not(.theme-orange):not(.theme-black)) .set .sn,html.ra:where(:not(.theme-orange):not(.theme-black)) .chk-t,html.ra:where(:not(.theme-orange):not(.theme-black)) .how,html.ra:where(:not(.theme-orange):not(.theme-black)) .orphan ul{font-size:var(--fs-small)} html.ra:where(:not(.theme-orange):not(.theme-black)) .lbl,html.ra:where(:not(.theme-orange):not(.theme-black)) label.lbl,html.ra:where(:not(.theme-orange):not(.theme-black)) .sethead{letter-spacing:.03em} html.ra:where(:not(.theme-orange):not(.theme-black)) .acct-foot{opacity:1;color:var(--muted)} html.ra:where(:not(.theme-orange):not(.theme-black)) .ra-sub{letter-spacing:.14em} html.ra:where(:not(.theme-orange):not(.theme-black)) .ra-bar .ra-sub{font-size:12px;letter-spacing:.12em} /* logo tagline (decorative, part of the wordmark) */ html.ra:where(:not(.theme-orange):not(.theme-black)) .ex-toggle,html.ra:where(:not(.theme-orange):not(.theme-black)) .name,html.ra:where(:not(.theme-orange):not(.theme-black)) .chk .ttl,html.ra:where(:not(.theme-orange):not(.theme-black)) .section-t,html.ra:where(:not(.theme-orange):not(.theme-black)) .mcard b,html.ra:where(:not(.theme-orange):not(.theme-black)) .sec-t{font-size:var(--fs-h)} html.ra:where(:not(.theme-orange):not(.theme-black)) .num{font-size:var(--fs-small);min-width:30px;height:26px} html.ra:where(:not(.theme-orange):not(.theme-black)) .rec{padding:10px 12px;gap:6px} html.ra:where(:not(.theme-orange):not(.theme-black)) .rec-l,html.ra:where(:not(.theme-orange):not(.theme-black)) .goal .l{font-size:var(--fs-small);padding:3px 9px} html.ra:where(:not(.theme-orange):not(.theme-black)) .rec-v,html.ra:where(:not(.theme-orange):not(.theme-black)) .goal .v{font-size:var(--fs-goal)} html.ra:where(:not(.theme-orange):not(.theme-black)) .ex{padding:12px 12px 12px 16px;gap:8px} html.ra:where(:not(.theme-orange):not(.theme-black)) .card{gap:12px} html.ra:where(:not(.theme-orange):not(.theme-black)) h1{font-size:24px} /* tap targets */ html.ra:where(:not(.theme-orange):not(.theme-black)) button,html.ra:where(:not(.theme-orange):not(.theme-black)) .btn-sm,html.ra:where(:not(.theme-orange):not(.theme-black)) a.btn-sm,html.ra:where(:not(.theme-orange):not(.theme-black)) a.btn-main,html.ra:where(:not(.theme-orange):not(.theme-black)) .main,html.ra:where(:not(.theme-orange):not(.theme-black)) .today,html.ra:where(:not(.theme-orange):not(.theme-black)) .add{min-height:var(--tap);font-size:var(--fs-btn);padding:10px 16px;display:inline-flex;align-items:center;justify-content:center;gap:6px;line-height:1.2} html.ra:where(:not(.theme-orange):not(.theme-black)) .ex-toggle,html.ra:where(:not(.theme-orange):not(.theme-black)) .name,html.ra:where(:not(.theme-orange):not(.theme-black)) .chk-toggle{min-height:var(--tap);justify-content:flex-start;padding:6px 0;margin:0} html.ra:where(:not(.theme-orange):not(.theme-black)) .chk-toggle{justify-content:space-between} html.ra:where(:not(.theme-orange):not(.theme-black)) .linkbtn{min-height:var(--tap);display:inline-flex;align-items:center;padding:0 4px;font-size:var(--fs-small)} html.ra:where(:not(.theme-orange):not(.theme-black)) .chk-q{width:var(--tap);height:var(--tap);min-height:0;padding:0} html.ra:where(:not(.theme-orange):not(.theme-black)) input:not([type=checkbox]):not([type=radio]),html.ra:where(:not(.theme-orange):not(.theme-black)) select,html.ra:where(:not(.theme-orange):not(.theme-black)) textarea,html.ra:where(:not(.theme-orange):not(.theme-black)) .pick-btn{min-height:var(--tap);font-size:max(16px,var(--fs-small));padding:10px 12px} html.ra:where(:not(.theme-orange):not(.theme-black)) .info-btn{font-size:var(--fs-btn);padding:0 14px} html.ra:where(:not(.theme-orange):not(.theme-black)) .tab{min-height:var(--tap-chip);font-size:var(--fs-btn);padding:8px 10px} html.ra:where(:not(.theme-orange):not(.theme-black)) .swipe-dot{min-height:var(--tap-chip);display:inline-flex;align-items:center;box-sizing:border-box;padding:0 14px;font-size:var(--fs-small);max-width:10em} html.ra:where(:not(.theme-orange):not(.theme-black)) .auth-tabs button{min-height:var(--tap);font-size:var(--fs-btn)} html.ra:where(:not(.theme-orange):not(.theme-black)) .send-btns,html.ra:where(:not(.theme-orange):not(.theme-black)) .row,html.ra:where(:not(.theme-orange):not(.theme-black)) .ed-tools,html.ra:where(:not(.theme-orange):not(.theme-black)) .pl-btns{gap:8px;flex-wrap:wrap} html.ra:where(:not(.theme-orange):not(.theme-black)) input[type=checkbox],html.ra:where(:not(.theme-orange):not(.theme-black)) input[type=radio]{width:22px;height:22px} html.ra:where(:not(.theme-orange):not(.theme-black)) a#progLink{min-height:var(--tap);display:inline-flex;align-items:center;margin:0;padding:0;font-size:var(--fs-base)} /* weight / reps: big, side by side even on a 360 px phone */ html.ra:where(:not(.theme-orange):not(.theme-black)) .set,html.ra:where(:not(.theme-orange):not(.theme-black)) .sethead{gap:6px;grid-template-columns:20px minmax(0,1fr) 12px minmax(0,1fr) 18px} html.ra:where(:not(.theme-orange):not(.theme-black)) .set.rq,html.ra:where(:not(.theme-orange):not(.theme-black)) .sethead.rq{grid-template-columns:20px minmax(0,1fr) 12px minmax(0,1fr) 56px 18px} html.ra:where(:not(.theme-orange):not(.theme-black)) .sets{gap:8px} html.ra:where(:not(.theme-orange):not(.theme-black)) .set input:not([type=checkbox]):not([type=radio]){min-height:var(--tap-num);font-size:var(--fs-num);padding:var(--pad-num)} html.ra:where(:not(.theme-orange):not(.theme-black)) .card .set input:not([type=checkbox]):not([type=radio]){font-size:var(--fs-num-client);padding:var(--pad-num-client)} /* client page grid (no indicator column) */ html.ra:where(:not(.theme-orange):not(.theme-black)) .card .set,html.ra:where(:not(.theme-orange):not(.theme-black)) .card .sethead{grid-template-columns:22px minmax(0,1fr) 14px minmax(0,1fr)} html.ra:where(:not(.theme-orange):not(.theme-black)) .card .set.rq,html.ra:where(:not(.theme-orange):not(.theme-black)) .card .sethead.rq{grid-template-columns:22px minmax(0,1fr) 14px minmax(0,1fr) 64px} /* weeks editor and wizard inputs */ html.ra:where(:not(.theme-orange):not(.theme-black)) .weeks .wrow{grid-template-columns:44px 44px 44px minmax(0,1fr) minmax(0,1fr) var(--tap)} html.ra:where(:not(.theme-orange):not(.theme-black)) .weeks .wrow input{padding:8px 2px} html.ra:where(:not(.theme-orange):not(.theme-black)) .wrow-x input[type=number]{width:72px} html.ra:where(:not(.theme-orange):not(.theme-black)) .ra-size{display:inline-flex;align-items:center;gap:6px} html.ra:where(:not(.theme-orange):not(.theme-black)) .ra-size select{width:auto;display:inline-block} html.ra:where(:not(.theme-orange):not(.theme-black)) .ex-i{width:24px;height:24px;font-size:var(--fs-small)} html.ra:where(:not(.theme-orange):not(.theme-black)) .swipe-hint,html.ra:where(:not(.theme-orange):not(.theme-black)) .ra-ws,html.ra:where(:not(.theme-orange):not(.theme-black)) .set .x,html.ra:where(:not(.theme-orange):not(.theme-black)) .set .ind,html.ra:where(:not(.theme-orange):not(.theme-black)) .chk-caret{font-size:var(--fs-small)} html.ra:where(:not(.theme-orange):not(.theme-black)) .ra-bar .ra-ws{font-size:var(--fs-small)} html.ra:where(:not(.theme-orange):not(.theme-black)) .brand{font-size:var(--fs-btn)} html.ra:where(:not(.theme-orange):not(.theme-black)) .ra-foot .ra-wm{font-size:var(--fs-btn)} html.ra:where(:not(.theme-orange):not(.theme-black)) .tgt{font-size:var(--fs-btn);white-space:normal;text-align:right} html.ra:where(:not(.theme-orange):not(.theme-black)) .ra-bar .ra-sub{font-size:var(--fs-small);letter-spacing:.08em} html.ra:where(:not(.theme-orange):not(.theme-black)) .ra-bar .ra-wm{font-size:21px} /* buttons that are cards / list rows keep their own layout */ html.ra:where(:not(.theme-orange):not(.theme-black)) .mcard{display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;text-align:left;padding:12px 14px;line-height:1.35} html.ra:where(:not(.theme-orange):not(.theme-black)) .pick-btn{justify-content:space-between;text-align:left} html.ra:where(:not(.theme-orange):not(.theme-black)) .pick-opt{justify-content:space-between;text-align:left;width:100%} /* phone: action buttons share rows instead of one per line */ html.ra:where(:not(.theme-orange):not(.theme-black)) .send-btns>button,html.ra:where(:not(.theme-orange):not(.theme-black)) .send-btns>a,html.ra:where(:not(.theme-orange):not(.theme-black)) .pl-btns>button{flex:1 1 auto} html.ra:where(:not(.theme-orange):not(.theme-black)) .pl-btns{width:100%} html.ra:where(:not(.theme-orange):not(.theme-black)) .card .head{align-items:center} html.ra:where(:not(.theme-orange):not(.theme-black)) .card .num,html.ra:where(:not(.theme-orange):not(.theme-black)) .ex .num{display:inline-grid;place-items:center;border-radius:7px;padding:0 6px;line-height:1} /* ---------- TOP MENU (bigger, by the owner's choice): coach header + panel, day tabs; client pages header + day tabs ---------- */ html.ra:where(:not(.theme-orange):not(.theme-black)) .ra-bar{min-height:calc(var(--tap-top) + 8px);padding:8px 14px 8px 10px} html.ra:where(:not(.theme-orange):not(.theme-black)) .ra-bar .ra-logo{width:48px;height:48px} html.ra:where(:not(.theme-orange):not(.theme-black)) .ra-bar .ra-wm{font-size:24px} html.ra:where(:not(.theme-orange):not(.theme-black)) .ra-bar .ra-ws{font-size:var(--fs-top)} html.ra:where(:not(.theme-orange):not(.theme-black)) .panel button,html.ra:where(:not(.theme-orange):not(.theme-black)) .panel .pick-btn,html.ra:where(:not(.theme-orange):not(.theme-black)) .panel select,html.ra:where(:not(.theme-orange):not(.theme-black)) .panel input:not([type=checkbox]):not([type=radio]), html.ra:where(:not(.theme-orange):not(.theme-black)) .panel a.btn-sm,html.ra:where(:not(.theme-orange):not(.theme-black)) .tabs .tab{min-height:var(--tap-top);font-size:var(--fs-top)} html.ra:where(:not(.theme-orange):not(.theme-black)) .panel .linkbtn{min-height:var(--tap);font-size:var(--fs-btn)} html.ra:where(:not(.theme-orange):not(.theme-black)) .panel .send-info,html.ra:where(:not(.theme-orange):not(.theme-black)) .panel .send-line{font-size:var(--fs-btn)} html.ra:where(:not(.theme-orange):not(.theme-black)) .swipe-dot{min-height:calc(var(--tap-top) - 4px);font-size:var(--fs-btn);padding:0 16px} html.ra:where(:not(.theme-orange):not(.theme-black)) .tabs .tab small{font-size:var(--fs-small)} /* client page / «Моя програма» */ html.ra:where(:not(.theme-orange):not(.theme-black)) .brand{font-size:var(--fs-top);min-height:var(--tap-top)} html.ra:where(:not(.theme-orange):not(.theme-black)) .brand .ra-logo{width:44px;height:44px} html.ra:where(:not(.theme-orange):not(.theme-black)) a#progLink{min-height:var(--tap-top);font-size:var(--fs-top)} html.ra:where(:not(.theme-orange):not(.theme-black)) .wrap>.tabs .tab,html.ra:where(:not(.theme-orange):not(.theme-black)) #app .tab{min-height:var(--tap-top);font-size:var(--fs-top);padding:8px 18px} html.ra:where(:not(.theme-orange):not(.theme-black)) a.today{min-height:var(--tap-top);font-size:var(--fs-top)} html.ra:where(:not(.theme-orange):not(.theme-black)) a#progLink{font-size:var(--fs-top)!important} /* k.html sets an inline size */ /* ======================= compact top (coach journal) ======================= */ /* header: ☰ · logo + Rep Atlas · (workspace on wide screens) · ⚙ */ html.ra .ra-bar{gap:8px;padding:6px 6px 6px 6px} html.ra .ra-bar .ra-bar-wm{min-width:0;flex:1} html.ra .ra-hbtn{flex:none;width:var(--tap-top);min-height:var(--tap-top);height:var(--tap-top);padding:0;border-radius:12px;background:transparent;border:1px solid color-mix(in srgb,var(--ra-gold) 45%,transparent);color:var(--ra-gold);font-size:var(--fs-top)} html.ra .ra-hbtn:hover{background:color-mix(in srgb,var(--ra-gold) 14%,transparent)} html.ra .ra-hbtn[aria-expanded="true"]{background:var(--ra-gold);color:var(--ra-brand)} html.ra .ra-bar .ra-ws{margin-left:0} @media (max-width:640px){html.ra .ra-bar .ra-ws{display:none}} @media (max-width:380px){html.ra .ra-bar .ra-wm{font-size:21px}html.ra .ra-bar .ra-logo{width:40px;height:40px}} /* panel order: action row → status/⚠ line → client chips → date label → link box / new client */ html.ra .panel>#actRow{order:1}html.ra .panel>#sendRow{order:2;border-top:0;padding-top:0} html.ra .panel>.field:has(#swipeDots){order:3;border-top:0;padding-top:0} html.ra .panel>#dateChip{order:4}html.ra .panel>#linkBox{order:5}html.ra .panel>#newClientRow{order:6}html.ra .panel>#progline{order:7} html.ra .panel>.field:has(#swipeDots)>.row,html.ra .panel>.field:has(#swipeDots)>.lbl{display:none} /* the full list lives in the drawer now */ html.ra .panel>.field:has(#swipeDots) .swipe-dots{margin-top:0} html.ra #progline:empty{display:none} /* one row, three equal buttons; short labels on a phone */ html.ra .act-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px} html.ra .act-row[hidden]{display:none} html.ra .act-row .slot{display:flex;min-width:0} html.ra .act-row .slot>button{flex:1;min-width:0;width:100%;padding:4px 4px;white-space:nowrap;letter-spacing:-.005em} html.ra .l-short{display:none} @media (max-width:560px){html.ra .l-full{display:none}html.ra .l-short{display:inline}} /* status / ⚠ line: compact */ html.ra .panel #sendRow .send-info{display:flex;flex-direction:column;gap:2px} html.ra .panel #sendRow .send-line{font-size:var(--fs-small);line-height:1.35} html.ra .panel #sendRow .send-line .linkbtn{min-height:0;padding:0 2px;font-size:var(--fs-small);display:inline} /* the open date, always visible; tap → menu */ html.ra .date-chip{justify-content:flex-start;background:var(--soft);border:1px solid var(--line);color:var(--ink);font-weight:600;border-radius:12px} html.ra .date-chip.past{border-color:var(--ra-gold);background:var(--ra-tint)} html.ra .date-chip[hidden]{display:none} /* overlays */ .ra-shade{position:fixed;inset:0;z-index:70;background:rgba(10,10,10,.45)} .ra-shade[hidden]{display:none} .ra-sheet,.ra-drawer{position:fixed;z-index:71;background:var(--surface);color:var(--ink);display:flex;flex-direction:column;gap:12px;padding:14px 16px calc(16px + env(safe-area-inset-bottom,0px));overflow-y:auto;box-shadow:0 -10px 40px rgba(0,0,0,.35)} .ra-sheet[hidden],.ra-drawer[hidden]{display:none} .ra-sheet{left:0;right:0;bottom:0;max-height:88vh;max-height:88dvh;border-radius:18px 18px 0 0;border-top:3px solid var(--ra-gold)} @media (min-width:700px){.ra-sheet{left:auto;right:16px;top:72px;bottom:auto;width:400px;border-radius:16px;max-height:calc(100vh - 90px)}} .ra-drawer{left:0;top:0;bottom:0;width:min(86vw,360px);border-right:3px solid var(--ra-gold);transform:translateX(-12px);opacity:.98;transition:transform .16s ease-out} .ra-drawer.in{transform:none} @media (prefers-reduced-motion:reduce){.ra-drawer{transition:none}} .sheet-head{display:flex;align-items:center;justify-content:space-between;gap:8px} .sheet-head b{font:700 20px var(--ra-f-brand)} html.ra .ra-x{width:var(--tap);padding:0;background:transparent} .menu-sec{display:flex;flex-direction:column;gap:8px;border-top:1px solid var(--line);padding-top:12px} .menu-sec.send-btns{flex-direction:column} .menu-sec.send-btns:empty{display:none} html.ra .menu-sec button{width:100%} html.ra .date-nav{display:grid;grid-template-columns:var(--tap) minmax(0,1fr) var(--tap);gap:6px} html.ra .date-nav button{padding:0;font-size:22px} html.ra .ra-sheet .info-pop{position:static;box-shadow:none;border:1px solid var(--line);margin:0} html.ra .info-pop{font-size:14px} html.ra .ra-sheet .info-btn{justify-content:flex-start} .menu-row{margin:0;display:flex;flex-wrap:wrap;gap:8px;align-items:center;font-size:var(--fs-small);color:var(--muted)} html.ra .menu-acct .linkbtn{min-height:var(--tap)} html.ra .ra-sheet .ws-switch{width:auto} .drawer-list{display:flex;flex-direction:column;gap:6px} html.ra .drawer-list .pick-opt{display:flex;justify-content:space-between;align-items:center;gap:8px;min-height:var(--tap);border:1px solid var(--line);border-radius:12px;background:var(--surface);color:var(--ink);text-align:left} html.ra .drawer-list .pick-opt .nm{font-weight:600;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap} html.ra .drawer-list .pick-opt small{flex:none;color:var(--muted)} html.ra .drawer-list .pick-opt[aria-selected="true"]{background:var(--ra-sel-bg);color:var(--ra-sel-ink);border-color:var(--ra-sel-bg);box-shadow:inset 0 -2px 0 var(--ra-gold)} html.ra .drawer-list .pick-opt[aria-selected="true"] small{color:var(--ra-sel-ink)} html.ra #drawerNew{width:100%;margin-top:auto} body.ov-open{overflow:hidden} /* unfilled workout of another day: item in the ⚙ menu + a dot on the ⚙ button */ html.ra .ra-hbtn{position:relative} html.ra .ra-hbtn.has-dot::after{content:"";position:absolute;top:6px;right:6px;width:12px;height:12px;border-radius:50%;background:#E5533D;box-shadow:0 0 0 2px var(--ra-brand)} .menu-warn{display:flex;flex-direction:column;gap:8px;background:var(--ra-tint);border:1px solid color-mix(in srgb,var(--ra-gold) 45%,var(--line));border-left:4px solid var(--ra-down);border-radius:12px;padding:10px 12px} .menu-warn p{margin:0;font-size:var(--fs-small);color:var(--ink)} #menuWarn[hidden]{display:none} /* ======================= full-screen pages: Налаштування, довідка, шаблони, вставити текстом, копія ======================= */ .ra-page{position:fixed;inset:0;z-index:80;background:var(--bg);color:var(--ink);overflow-y:auto;padding:0 16px calc(28px + env(safe-area-inset-bottom,0px));display:flex;flex-direction:column;gap:14px} .ra-page[hidden]{display:none} @media (min-width:760px){.ra-page{left:50%;right:auto;width:720px;transform:translateX(-50%);border-left:1px solid var(--line);border-right:1px solid var(--line);box-shadow:0 0 0 100vmax rgba(10,10,10,.45)}} .page-head{position:sticky;top:0;z-index:2;display:flex;align-items:center;gap:8px;background:var(--bg);padding:12px 0 10px;border-bottom:2px solid var(--ra-gold)} .page-head h2{margin:0;flex:1;min-width:0;font:700 22px/1.2 var(--ra-f-brand)} .page-body{display:flex;flex-direction:column;gap:12px} .set-sec{display:flex;flex-direction:column;gap:6px;background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:14px} .set-sec h3{margin:0 0 4px;font:700 var(--fs-h) var(--ra-f-brand)} .set-sec h4{margin:10px 0 0;font:700 var(--fs-btn) var(--ra-f-brand)} .set-sec p{margin:0} .set-chk{display:flex;gap:10px;align-items:center;min-height:var(--tap);font-size:var(--fs-base);cursor:pointer} .set-save{display:flex;gap:12px;align-items:center;flex-wrap:wrap;position:sticky;bottom:0;background:var(--bg);padding:8px 0} html.ra .set-save .btn-main{min-width:160px} html.ra .ra-page input:disabled,html.ra .ra-page select:disabled{opacity:1;color:var(--muted);background:var(--soft)} /* help */ .help-list{display:flex;flex-direction:column;gap:8px} html.ra .help-topic{display:flex;justify-content:flex-start;align-items:center;gap:12px;text-align:left;padding:10px 14px;border:1px solid var(--line);border-radius:14px;background:var(--surface);color:var(--ink);width:100%} .help-topic .ht-ic{font-size:24px;flex:none;width:32px;text-align:center} .help-topic .ht-tx{display:flex;flex-direction:column;min-width:0} .help-topic b{font:700 var(--fs-btn) var(--ra-f-brand)} html.ra .help-topic small{color:var(--muted)} .help-steps{margin:0;padding:0;list-style:none;counter-reset:hs;display:flex;flex-direction:column;gap:10px} .help-steps li{counter-increment:hs;position:relative;padding:12px 14px 12px 52px;background:var(--surface);border:1px solid var(--line);border-radius:14px;line-height:1.55} .help-steps li::before{content:counter(hs);position:absolute;left:12px;top:10px;width:28px;height:28px;border-radius:50%;background:var(--ra-brand);color:var(--ra-gold);display:grid;place-items:center;font:700 15px var(--ra-f-brand)} .help-qa{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:12px 14px} .help-qa p{margin:4px 0 0} .help-rel{display:flex;flex-wrap:wrap;gap:8px;align-items:center} .pg{display:inline-block;vertical-align:baseline;border-radius:8px;padding:1px 8px;margin:1px 2px;font:600 .92em var(--ra-f-body);white-space:nowrap;line-height:1.5} .pg-btn{border:1px solid var(--ink);background:var(--surface);color:var(--ink)} .pg-main{background:var(--ra-btn-bg);color:var(--ra-btn-ink);border:1px solid var(--ra-btn-bg)} .pg-ic{background:var(--ra-brand);color:var(--ra-gold);border-radius:8px;min-width:1.6em;text-align:center} .pg-chip{background:var(--ra-chip-bg);color:var(--ra-chip-ink)} .pg-tab,.pg-field{border:1px solid var(--line);background:var(--soft);color:var(--ink)} /* contextual «?» (44 px tap, small visual circle) */ html.ra .help-q{min-height:44px;width:44px;height:44px;padding:0;border:0;background:transparent;color:var(--ra-small-gold);display:inline-grid;place-items:center;flex:none;font:700 15px var(--ra-f-brand);position:relative} html.ra .help-q::before{content:"";position:absolute;width:28px;height:28px;border-radius:50%;border:1.5px solid currentColor;left:8px;top:8px} html.ra .rec-lw{display:inline-flex;align-items:center;gap:2px} html.ra .rec-top{align-items:center} .sh-q{margin-left:auto} /* «Перші кроки» */ .ob-card{background:var(--surface);border:1px solid color-mix(in srgb,var(--ra-gold) 50%,var(--line));border-top:3px solid var(--ra-gold);border-radius:14px;padding:12px 14px;display:flex;flex-direction:column;gap:8px;box-shadow:var(--shadow)} .ob-card[hidden]{display:none} .ob-head{display:flex;justify-content:space-between;align-items:baseline;gap:8px} .ob-head h2{margin:0;font:700 var(--fs-h) var(--ra-f-brand)} .ob-n{font-size:var(--fs-small);color:var(--muted);white-space:nowrap} .ob-list{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:4px} .ob-step{display:flex;align-items:center;gap:8px;flex-wrap:wrap;min-height:var(--tap)} .ob-check{flex:none;width:26px;height:26px;border-radius:50%;border:2px solid var(--line);display:grid;place-items:center;font-weight:700;color:#fff} .ob-step.done .ob-check{background:var(--good);border-color:var(--good);color:var(--surface)} .ob-step.done .ob-t{color:var(--muted);text-decoration:line-through} .ob-t{flex:1 1 160px;min-width:0} .ob-foot{display:flex;gap:8px;flex-wrap:wrap;justify-content:space-between} /* templates */ .tpl-card{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:14px;display:flex;flex-direction:column;gap:6px} .tpl-card h3{margin:0;font:700 var(--fs-h) var(--ra-f-brand)} .tpl-card p{margin:0} .tpl-meta{font-size:var(--fs-small);color:var(--ra-small-gold);font-weight:600} .tpl-days{margin:0;padding-left:18px;font-size:var(--fs-small);color:var(--muted);display:flex;flex-direction:column;gap:2px} .tpl-days b{color:var(--ink)} html.ra .tpl-card .btn-main{align-self:flex-start} html.ra .prog-tools{justify-content:flex-start} /* paste preview */ #pasteText{width:100%;font:500 16px/1.5 var(--ra-f-body)} .paste-prev{display:flex;flex-direction:column;gap:10px} .pp-day{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:10px;display:flex;flex-direction:column;gap:8px} html.ra .pp-title{font:700 var(--fs-btn) var(--ra-f-brand)} .pp-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px;align-items:center;border-top:1px solid var(--line);padding-top:8px} .pp-row .pp-n{grid-column:1/-1} .pp-nums{display:flex;gap:4px;align-items:center} html.ra .pp-num{width:58px;text-align:center;padding:8px 2px} .pp-tags{display:flex;gap:4px;flex-wrap:wrap;grid-column:1/2} .pp-tag{font-size:var(--fs-small);background:var(--ra-tint);border:1px solid var(--line);border-radius:999px;padding:1px 8px} .pp-row .btn-ghost{grid-row:2;grid-column:2} .pp-warn{margin:0;padding:10px 14px 10px 30px;background:var(--ra-tint);border-left:4px solid var(--ra-down);border-radius:10px;font-size:var(--fs-small)} #bulkNames{width:100%} html.ra .menu-links{display:flex;flex-direction:column;gap:8px;align-items:stretch} html.ra #assistBtn:disabled{opacity:1;color:var(--muted);border-style:dashed;background:var(--soft)} html.ra .pp-num{width:64px;-moz-appearance:textfield;appearance:textfield} html.ra .pp-num::-webkit-inner-spin-button,html.ra .pp-num::-webkit-outer-spin-button{-webkit-appearance:none;margin:0} /* «▶ Відео техніки» — the only media on an exercise card (no drawings) */ html.ra .video-link{min-height:var(--tap);display:inline-flex;align-items:center;gap:6px;align-self:flex-start;margin-top:6px;padding:8px 14px;border-radius:10px;border:1px solid var(--ra-gold);background:var(--surface);color:var(--ink);font-size:var(--fs-btn);font-weight:600;text-decoration:none} html.ra .video-link:hover{background:var(--ra-tint)} html.ra input.bad{border-color:var(--ra-down);box-shadow:0 0 0 2px color-mix(in srgb,var(--ra-down) 25%,transparent)} /* exercise media (the trainer's photos / videos / links) — no drawings */ .media-sec{display:flex;flex-direction:column;gap:8px;border-top:1px solid var(--line);padding-top:10px;margin-top:4px} .media-h{font:700 var(--fs-btn) var(--ra-f-brand)} .media-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,240px),1fr));gap:10px} .media-item{margin:0;display:flex;flex-direction:column;gap:6px;min-width:0} .media-item img,.media-item video{width:100%;max-height:60vh;object-fit:contain;background:#111;border-radius:10px;border:1px solid var(--line);display:block} .media-item.main img,.media-item.main video{border:2px solid var(--ra-gold)} .media-item figcaption{display:flex;flex-wrap:wrap;gap:6px;align-items:center;font-size:var(--fs-small);color:var(--muted)} .media-main{background:var(--ra-chip-bg);color:var(--ra-chip-ink);border-radius:6px;padding:1px 8px;font-weight:700} .media-file{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none} html.ra .media-add{cursor:pointer;min-height:var(--tap);display:inline-flex;align-items:center;border:1px solid var(--ink);border-radius:10px;padding:8px 14px;font-weight:600;background:var(--surface);color:var(--ink)} html.ra .media-add.busy{opacity:.6;pointer-events:none} .media-bar{width:100%;height:10px;accent-color:var(--ra-gold)} .media-bar[hidden]{display:none} .media-linkrow{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px} .media-linkrow[hidden]{display:none} .media-st:empty{display:none} .media-st.err{color:var(--ra-down)}.media-st.ok{color:var(--good)} html.ra .name .i{width:28px;height:28px;font-size:var(--fs-small);font-weight:700;border-width:1.5px;flex:none} /* ---------- v1.2 · progression models explained: one-liner + mini chart (model-viz.js) ---------- */ html.ra .mv-card{display:flex;flex-direction:column;gap:4px;min-width:0;text-align:left} html.ra .mv-head{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 8px} html.ra .mv-name{font-family:var(--ra-f-brand);font-size:var(--fs-h);font-weight:700;color:var(--ink)} html.ra .mv-sci,html.ra .mv-exp{font-size:var(--fs-small);color:var(--muted);font-weight:400} html.ra .mv-exp{border:1px solid var(--line);border-radius:999px;padding:0 8px} html.ra .mv-line{margin:0;font-size:var(--fs-base);line-height:1.35;color:var(--ink)} html.ra .mv-who{margin:0;font-size:var(--fs-small);color:var(--muted)} html.ra .mv-fig{margin:4px 0 2px;width:100%;max-width:420px} html.ra .mv-fig.big{max-width:560px;margin:8px 0} html.ra .mv-fig svg{display:block;width:100%;height:auto;overflow:visible} html.ra .mv-cap{font-size:var(--fs-small);color:var(--muted);margin-top:4px} html.ra .mv-bar{fill:var(--ra-gold);stroke:var(--warm);stroke-width:1} html.ra .mv-bar.mv-b2{fill:var(--surface);stroke:var(--warm);stroke-width:1.5} html.ra .mv-bar.mv-dl{fill:var(--soft);stroke:var(--muted);stroke-dasharray:3 2} html.ra .mv-line{stroke:var(--ink);stroke-width:1.6} html.ra .mv-dot{fill:var(--ink)} html.ra .mv text{fill:currentColor;font-family:var(--ra-f-body)} html.ra .mv-t,html.ra .mv-r{color:var(--muted)} html.ra .mv-t{font-weight:600} html.ra .mv-tdl{font-weight:400} html.ra .mv-v,html.ra .mv-m{color:var(--ink);font-weight:600} html.ra .mv-more{font-size:var(--fs-small);min-height:var(--tap);padding:0 2px;align-self:flex-start} /* wizard model cards: button (text + chart) and «Детальніше» under it */ html.ra .mcard-wrap{display:flex;flex-direction:column;gap:0;min-width:0} html.ra .mcard.mv-mcard{gap:6px;padding:12px} html.ra .mcard.mv-mcard .mv-line{font-size:var(--fs-small)} html.ra .mcard.mv-mcard em{font-size:var(--fs-small);color:var(--muted)} /* model picker (exercise editor, settings) */ html.ra .mpick{display:flex;flex-direction:column;gap:6px;min-width:0;max-width:100%} html.ra .mpick-cur{all:unset;box-sizing:border-box;cursor:pointer;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:2px 8px;align-items:center;width:100%;min-height:var(--tap); padding:8px 12px;border:1px solid var(--line);border-radius:12px;background:var(--surface);color:var(--ink)} html.ra .mpick-cur:focus-visible,html.ra .mpick-row:focus-visible{outline:2px solid var(--ra-ring);outline-offset:2px} html.ra .mpick-t{display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 8px;min-width:0} html.ra .mpick-t b{font-size:var(--fs-base)} html.ra .mpick-l{grid-column:1;font-size:var(--fs-small);color:var(--muted)} html.ra .mpick-chev{grid-column:2;grid-row:1/span 2;color:var(--muted)} html.ra .mpick-cur[aria-expanded="true"] .mpick-chev{transform:rotate(180deg)} html.ra .mpick-list{display:flex;flex-direction:column;gap:8px;padding:8px;border:1px solid var(--line);border-radius:12px;background:var(--soft)} html.ra .mpick-list[hidden]{display:none} html.ra .mpick-item{display:flex;flex-direction:column;background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:2px 10px 0;min-width:0} html.ra .mpick-row{all:unset;box-sizing:border-box;cursor:pointer;display:flex;flex-direction:column;gap:4px;padding:8px 0 2px;min-height:var(--tap);width:100%;min-width:0} html.ra .mpick-row .mv-line{font-size:var(--fs-small)} html.ra .mpick-row[aria-checked="true"] .mv-name::before{content:"✓ ";color:var(--warm)} html.ra .mpick-item:has(.mpick-row[aria-checked="true"]){border-color:var(--ra-gold);box-shadow:inset 0 0 0 1px var(--ra-gold);background:var(--ra-tint)} html.ra .mpick-exp>summary{cursor:pointer;min-height:var(--tap);display:flex;align-items:center;font-size:var(--fs-small);color:var(--muted)} html.ra .mpick-exp[open]{display:flex;flex-direction:column;gap:8px} /* help: model topics */ html.ra .help-model .mv-line{font-size:var(--fs-base);margin:4px 0} html.ra .help-sec{font-size:var(--fs-small);text-transform:uppercase;letter-spacing:.06em;color:var(--muted);margin:14px 0 6px} html.ra .mv-cards{grid-template-columns:repeat(auto-fill,minmax(260px,1fr))} html.ra .sig-box{display:flex;flex-direction:column;gap:6px;padding:10px 12px;border:1px solid var(--ra-gold);border-radius:12px;background:var(--ra-tint);width:100%} /* ---------- v1.3 · methodologies with slots, «+ Вправа» (catalog search, own name, voice, text), quick swap ---------- */ html.ra .exp-search{display:flex;gap:8px;align-items:stretch} html.ra .exp-search input{flex:1;min-width:0;min-height:var(--tap);font-size:var(--fs-base)} html.ra .mic-wrap{display:inline-flex;gap:6px;align-items:stretch;flex:none} html.ra .mic-btn{min-width:var(--tap);font-size:20px} html.ra .mic-btn.on{background:var(--ra-down);color:#fff;border-color:var(--ra-down);font-size:var(--fs-small)} html.ra .mic-lang{min-height:var(--tap);width:auto;padding:0 6px;font-size:var(--fs-small)} html.ra .mic-hint{margin:0;font-size:var(--fs-small)} html.ra .paste-voice{display:flex;gap:8px;align-items:center} html.ra .exp-filters>summary{cursor:pointer;min-height:var(--tap);display:flex;align-items:center;font-size:var(--fs-small);color:var(--muted)} html.ra .exp-chips{display:flex;flex-wrap:wrap;gap:6px;margin:4px 0 8px} html.ra .chip-f{min-height:44px;padding:0 12px;border-radius:999px;border:1px solid var(--line);background:var(--surface);color:var(--ink);font-size:var(--fs-small)} html.ra .chip-f[aria-pressed="true"]{background:var(--ra-sel-bg);color:var(--ra-sel-ink);border-color:var(--ra-sel-bg)} html.ra .exp-h{font-size:var(--fs-small);text-transform:uppercase;letter-spacing:.06em;color:var(--muted);margin:10px 0 4px} html.ra .exp-list{display:flex;flex-direction:column;gap:6px} html.ra .exp-opt{display:flex;flex-direction:column;align-items:flex-start;gap:2px;text-align:left;width:100%;min-height:var(--tap);padding:8px 12px;border:1px solid var(--line);border-radius:12px;background:var(--surface);color:var(--ink)} html.ra .exp-opt b{font-weight:600;font-size:var(--fs-base)} html.ra .exp-opt small{color:var(--muted);font-size:var(--fs-small)} html.ra .own-badge{margin-left:8px;padding:0 8px;border-radius:999px;border:1px solid var(--warm);color:var(--warm)} html.ra .exp-new{margin-top:8px} html.ra .exp-newbtn{width:100%;border-style:dashed} html.ra .exp-form{display:flex;flex-direction:column;gap:8px;padding:12px;border:1px solid var(--ra-gold);border-radius:12px;background:var(--ra-tint)} html.ra .exp-foot{margin-top:12px;display:flex;flex-wrap:wrap;gap:8px} html.ra .slot-hint{margin:0;padding:8px 12px;border-left:3px solid var(--ra-gold);background:var(--ra-tint);font-size:var(--fs-small)} html.ra .slot-head{display:flex;flex-wrap:wrap;gap:4px 10px;align-items:baseline;margin-bottom:8px} html.ra .slot-badge{font-size:var(--fs-small);font-weight:700;color:var(--warm);text-transform:uppercase;letter-spacing:.04em} html.ra article.ed-slot{border:1.5px dashed var(--ra-gold)} html.ra .slot-fill{width:100%;margin-bottom:10px} html.ra .ed-add{display:flex;flex-direction:column;gap:8px} html.ra .slot-add{display:flex;flex-direction:column;gap:6px} html.ra .slot-types{display:flex;flex-wrap:wrap;gap:6px} html.ra .slot-card{border:1.5px dashed var(--ra-gold);display:flex;flex-direction:column;gap:8px} html.ra .slot-row{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:6px 10px;padding:6px 0;border-top:1px solid var(--line)} html.ra .slot-l{min-width:0;flex:1 1 180px} /* ---------- v1.4 ---------- */ html.ra .ra-hbtn.sig-dot::after{content:"";position:absolute;top:6px;right:6px;width:12px;height:12px;border-radius:50%;background:#E5533D;box-shadow:0 0 0 2px var(--ra-brand)} html.ra .ed-warn{margin:0;padding:8px 10px;border-left:3px solid var(--ra-down);background:var(--ra-tint);font-size:var(--fs-small);color:var(--ink)} /* v1.4: the status line never covers the cards: solid bar with a top rule, at most 3 lines, the list scrolls clear of it */ html.ra .bar{background:var(--bg);border-top:1px solid var(--line);backdrop-filter:none;-webkit-backdrop-filter:none;z-index:4} html.ra .bar .status{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden} html.ra #list{padding-bottom:12px} html.ra .date-box{position:relative;display:flex;flex:1;min-width:0} html.ra .date-box input#date{width:100%;color:transparent} html.ra .date-box input#date::-webkit-datetime-edit{color:transparent} html.ra .date-box input#date:focus::-webkit-datetime-edit{color:transparent} html.ra .date-txt{position:absolute;left:0;right:34px;top:0;bottom:0;display:flex;align-items:center;justify-content:center;pointer-events:none;font-variant-numeric:tabular-nums;color:var(--ink);font-size:var(--fs-top)} html.ra .trial-warn{display:flex;flex-wrap:wrap;gap:8px;align-items:center;justify-content:space-between;margin:8px 0;padding:10px 14px;border:1.5px solid var(--ra-gold);border-radius:12px;background:var(--ra-tint);color:var(--ink);font-size:var(--fs-small);font-weight:600} /* v1.4: supersets, pain field */ html.ra article.ex.ss{border-left:4px solid var(--ra-gold)} html.ra .ss-tag{font:600 var(--fs-small) var(--ra-f-num);color:var(--warm);letter-spacing:.04em;text-transform:uppercase;margin-bottom:4px} html.ra .pain-row{display:flex;flex-wrap:wrap;gap:6px 10px;align-items:center;margin-top:6px} html.ra .pain-row .lbl{margin:0} html.ra .pain-sel{min-height:var(--tap);width:auto;min-width:80px} html.ra .pain-warn{font-size:var(--fs-small);color:var(--ra-down);font-weight:600} /* v1.5: ramp-up week, «Тиждень», «Звіт прогресу» */ html.ra .ramp-box{display:flex;flex-direction:column;gap:6px;width:100%;padding:10px 12px;border:1px solid var(--line);border-radius:12px;background:var(--surface)} html.ra .ramp-box p{margin:0;font-size:var(--fs-small)} html.ra .ramp-plan{display:flex;flex-direction:column;gap:4px;margin:6px 0;padding:8px 10px;border-left:3px solid var(--ra-good);background:var(--ra-tint)} html.ra .ramp-plan input{min-height:var(--tap)} html.ra .wk-list{display:flex;flex-direction:column;gap:6px} html.ra .wk-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:2px 10px;align-items:center;text-align:left;width:100%;min-height:var(--tap);padding:10px 12px;border:1px solid var(--line);border-radius:12px;background:var(--surface);color:var(--ink)} html.ra .wk-row b{font-size:var(--fs-base)} html.ra .wk-row .wk-ic{font-size:20px;letter-spacing:2px;grid-row:1/span 2;grid-column:2} html.ra .wk-row small{color:var(--muted);font-size:var(--fs-small)} html.ra .wk-legend{font-size:var(--fs-small);color:var(--muted);margin:0} html.ra .wk-item{display:flex;gap:6px;align-items:stretch} html.ra .wk-item .wk-row{flex:1;min-width:0} /* «Звіт прогресу» */ html.ra .rp-actions{display:flex;flex-wrap:wrap;gap:8px;align-items:flex-end} html.ra .rp-actions select{min-height:var(--tap)} html.ra .rp-custom{display:flex;flex-wrap:wrap;gap:8px;align-items:flex-end} html.ra .rp-custom input{width:9.5em;min-height:var(--tap)} html.ra .rp-share{display:flex;flex-direction:column;gap:6px} html.ra .rp{display:flex;flex-direction:column;gap:10px;color:var(--ink)} html.ra .rp-head h3{margin:0;font:700 var(--fs-h) var(--ra-f-brand)} html.ra .rp-period{margin:2px 0 0;color:var(--muted);font-size:var(--fs-small)} html.ra .rp-sum{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px} html.ra .rp-tile{display:flex;flex-direction:column;gap:2px;padding:10px;border:1px solid var(--line);border-radius:12px;background:var(--surface)} html.ra .rp-tile b{font:700 22px var(--ra-f-num);color:var(--ink)} html.ra .rp-tile span{font-size:var(--fs-small);color:var(--muted)} html.ra .rp-lifts{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:6px} html.ra .rp-lift{display:flex;flex-direction:column;padding:8px 10px;border-left:3px solid var(--ra-gold);background:var(--ra-tint);border-radius:8px} html.ra .rp-lift b{font-size:var(--fs-small)} html.ra .rp-lift span{font:600 var(--fs-small) var(--ra-f-num);color:var(--ink)} html.ra .rp-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:8px} html.ra .rp-card{margin:0;padding:8px;border:1px solid var(--line);border-radius:12px;background:var(--surface);min-width:0} html.ra .rp-card figcaption{display:flex;flex-wrap:wrap;justify-content:space-between;gap:2px 8px;font-size:var(--fs-small)} html.ra .rp-card figcaption small{color:var(--muted);font-size:var(--fs-small)} html.ra .rp-svg{display:block;width:100%;height:auto} html.ra .rp-svg .rp-line{stroke:var(--ink);stroke-width:2} html.ra .rp-svg .rp-dot{fill:var(--ink)} html.ra .rp-svg .rp-ton{fill:var(--ra-gold);opacity:.6} html.ra .rp-svg .rp-dl{fill:var(--soft);stroke:var(--muted);stroke-dasharray:2 2;opacity:1} html.ra .rp-svg .rp-ramp{fill:var(--ra-good);opacity:.14} html.ra .rp-svg .rp-rampdot{fill:var(--ra-good)} html.ra .rp-svg .rp-ax{fill:var(--muted);font:10px var(--ra-f-num)} html.ra .rp-svg .rp-base{stroke:var(--line)} html.ra .rp-legend{font-size:var(--fs-small);color:var(--muted);margin:0} /* ---------- v1.6: «+ Вправа» with autocomplete · exercise row (wizard, after adding, «✎ Змінити») · new-client wizard ---------- */ html.ra .exa{display:flex;flex-direction:column;gap:8px;position:relative} html.ra .exa-hint{margin:0;font-size:var(--fs-base);color:var(--ink);font-weight:600} html.ra .exa-row{display:flex;gap:8px;align-items:stretch;flex-wrap:wrap} html.ra .exa-row #exAdd{flex:1 1 180px;min-width:0;min-height:var(--tap);font-size:var(--fs-base)} html.ra .exa-row .btn-sm{min-height:var(--tap)} html.ra .exa-list{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:12px;background:var(--surface);overflow:hidden;box-shadow:0 8px 22px rgba(0,0,0,.12)} html.ra .exa-opt{display:flex;flex-direction:column;align-items:flex-start;gap:2px;text-align:left;border:0;border-bottom:1px solid var(--line);border-radius:0;background:var(--surface);color:var(--ink);padding:10px 12px;min-height:var(--tap);width:100%} html.ra .exa-opt:last-child{border-bottom:0} html.ra .exa-opt{scroll-margin:12px} html.ra .exa-opt b{font-size:var(--fs-base);font-weight:600} html.ra .exa-opt small{font-size:var(--fs-small);color:var(--muted)} html.ra .exa-opt.on,html.ra .exa-opt:hover{background:var(--soft)} html.ra .exa-new b{color:var(--ink)} html.ra .exa-role{border:2px solid var(--ra-gold);border-radius:14px;padding:4px;background:var(--surface)} html.ra .cwx{border:1px solid var(--line);border-radius:14px;background:var(--surface);padding:10px 12px;display:flex;flex-direction:column;gap:8px} html.ra .cwx-head{display:flex;justify-content:space-between;align-items:center;gap:8px;flex-wrap:wrap} html.ra .cwx-n{font-size:var(--fs-h);min-width:0;overflow-wrap:anywhere;flex:1 1 140px} html.ra .cwx-tools{display:flex;gap:6px} html.ra .cwx-tools .btn-sm{min-width:var(--tap);min-height:var(--tap);padding:0 10px} html.ra .cwx-g{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px 10px;align-items:end} html.ra .cwx-g>div{min-width:0} html.ra .cwx-g .cwx-wide,html.ra .cwx-g .cwx-hint{grid-column:1/-1} html.ra .cwx-g input,html.ra .cwx-g select{width:100%;min-width:0;min-height:var(--tap)} html.ra .cwx-hint{margin:0;font-size:var(--fs-small);color:var(--muted)} html.ra .cwx-ss-t{margin:0;font-size:var(--fs-small);font-weight:600;color:var(--ink)} html.ra .cwx-foot{display:flex;gap:8px;flex-wrap:wrap} html.ra .cwx-list{display:flex;flex-direction:column;gap:10px} html.ra .cw .page-body{display:flex;flex-direction:column;gap:12px} html.ra .cw-steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:4px} html.ra .cw-steps li{font-size:var(--fs-small);padding:4px 2px 6px;border-bottom:3px solid var(--line);color:var(--muted);text-align:center;display:flex;flex-direction:column;align-items:center;line-height:1.25;min-width:0} html.ra .cw-sn{font-family:var(--f-num);font-weight:700} html.ra .cw-steps li.done{border-color:var(--good);color:var(--ink)} html.ra .cw-steps li.on{border-color:var(--ra-gold);color:var(--ink);font-weight:700} html.ra .cw-h{margin:4px 0 0;font-size:var(--fs-h)} html.ra .cw-main{display:flex;flex-direction:column;gap:12px} html.ra .cw-main textarea,html.ra .cw-main input:not([type=checkbox]),html.ra .cw-main select{width:100%;min-height:var(--tap);font-size:var(--fs-base)} html.ra .cw-srcs{display:flex;flex-direction:column;gap:8px} html.ra .cw-src{display:flex;flex-direction:column;align-items:flex-start;gap:2px;text-align:left;min-height:var(--tap);padding:10px 12px;border:1px solid var(--line);border-radius:12px;background:var(--surface);color:var(--ink)} html.ra .cw-src b{font-size:var(--fs-base)} html.ra .cw-src small{font-size:var(--fs-small);color:var(--muted)} html.ra .cw-src[aria-checked="true"]{border:2px solid var(--ra-gold);background:var(--soft)} html.ra .cw-info{border:1px solid var(--line);border-radius:14px;padding:10px 12px;background:var(--surface)} html.ra .cw-who{margin:0 0 6px} html.ra .cw-daynames{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 10px} html.ra .cw-tabs{display:flex;gap:6px;overflow-x:auto;padding-bottom:2px} html.ra .cw-tab{flex:none;min-height:var(--tap);padding:0 12px;border-radius:999px;border:1px solid var(--line);background:var(--surface);color:var(--ink);font-size:var(--fs-small)} html.ra .cw-tab[aria-selected="true"]{background:var(--ink);color:var(--surface);border-color:var(--ink)} html.ra .cw-tab small{font-size:var(--fs-small)} html.ra .cw-nav{display:grid;grid-template-columns:1fr 2fr;gap:10px;padding:12px 0 4px;border-top:1px solid var(--line)} html.ra .btn-big{min-height:52px;font-size:var(--fs-btn)} html.ra .cw-cancel{align-self:center} html.ra .cw-err{margin:0;padding:8px 10px;border-radius:10px;border:1px solid #b3261e;color:var(--ink);background:var(--surface);font-weight:600} html.ra .cw-warn{margin:0;padding:10px 12px;border-radius:12px;border:2px solid #e0b400;background:var(--surface);color:var(--ink)} html.ra .cw-sum{display:flex;flex-direction:column;gap:10px} html.ra .cw-sum-day{border:1px solid var(--line);border-radius:14px;padding:8px 12px;background:var(--surface)} html.ra .cw-sum-h{display:flex;justify-content:space-between;align-items:center;gap:8px} html.ra .cw-sum-list{margin:4px 0 0;padding-left:20px;display:flex;flex-direction:column;gap:6px} html.ra .cw-sum-list small{display:block;font-size:var(--fs-small);color:var(--muted)} html.ra .cw-sum-top{margin:0;font-weight:600} html.ra .info-notes{white-space:pre-wrap} html.ra .src-client{color:var(--good)} @media (max-width:400px){html.ra .cwx-g{grid-template-columns:repeat(2,minmax(0,1fr))}} @media print{ @page{size:A4 portrait;margin:10mm} html.ra body{background:#fff !important} html.ra body > *:not(#reportPage):not(.rp-print){display:none !important} html.ra #reportPage{position:static !important;display:block !important;width:auto !important;transform:none !important;box-shadow:none !important;border:0 !important;overflow:visible !important;background:#fff !important;padding:0 !important} html.ra #reportPage .page-head,html.ra #reportPage .rp-actions,html.ra #reportPage .rp-share{display:none !important} html.ra .rp-grid{grid-template-columns:repeat(3,1fr)} html.ra .rp-card,html.ra .rp-tile{break-inside:avoid} } /* v1.7 · голосовий ввід у майстрі */ html.ra .cw-voice{display:flex;flex-direction:column;gap:8px;padding:12px;border:1px solid var(--line);border-radius:14px;background:var(--surface)} html.ra .cw-voice textarea{width:100%;box-sizing:border-box;font-size:16px} html.ra .cw-voice-row{display:flex;gap:8px;flex-wrap:wrap} html.ra .cw-voice-row>button{flex:1 1 140px} html.ra .cw-mic.on{background:#b3261e;color:#fff;border-color:#b3261e} html.ra .cw-voice-st{margin:0;min-height:1em} html.ra #cwDoubts ul{margin:6px 0 0;padding-left:18px} html.ra .ws-switch{max-width:46vw;font:inherit;font-size:13px;padding:4px 6px;border-radius:8px;border:1px solid var(--line);background:var(--surface);color:var(--ink)} html.ra .ws-switch-drawer{display:block;width:100%;max-width:none;box-sizing:border-box;margin:0 0 8px;font-size:15px;padding:10px 12px;min-height:var(--tap,44px)} /* v1.8 · голосовий помічник */ html.ra .as-fab{position:fixed;right:14px;bottom:calc(84px + env(safe-area-inset-bottom,0px));z-index:70;width:62px;height:62px;border-radius:50%;border:3px solid #fff;background:#e5484d;color:#fff;display:flex;align-items:center;justify-content:center;padding:0;box-shadow:0 0 0 3px rgba(229,72,77,.35),0 8px 22px rgba(0,0,0,.45)} html.ra .as-fab svg{width:30px;height:30px} html.ra .as-fab.on{display:none} html.ra .as-sheet{position:fixed;left:0;right:0;bottom:0;z-index:69;max-height:78vh;overflow-y:auto;background:var(--surface);color:var(--ink);border-top:2px solid var(--ra-brand,#c9a961);border-radius:16px 16px 0 0;padding:12px 14px calc(14px + env(safe-area-inset-bottom,0px));display:flex;flex-direction:column;gap:8px;box-shadow:0 -10px 30px rgba(0,0,0,.4)} html.ra .as-head{display:flex;justify-content:space-between;align-items:center;font-size:17px;padding-right:0} html.ra .as-hint{margin:0;font-size:13px} html.ra .as-sheet textarea{width:100%;box-sizing:border-box;font-size:16px} html.ra .as-row{display:flex;gap:8px;flex-wrap:wrap} html.ra .as-row>button{flex:1 1 130px} html.ra .as-row>.as-mic{flex:0 0 auto;min-width:96px} html.ra .as-row>.as-go{flex:1 1 auto} html.ra .as-mic{display:inline-flex;align-items:center;justify-content:center;gap:6px;color:#e5484d;border:2px solid #e5484d} html.ra .as-mic.on{background:#e5484d;color:#fff;border-color:#e5484d} html.ra .as-say{margin:4px 0;font-size:15px} html.ra .as-acts{margin:0;padding-left:18px;display:flex;flex-direction:column;gap:4px} html.ra .as-bad{color:#d9822b} /* v1.9.1 · горизонтальний екран: ряд кнопок вузький (поруч зі списком клієнтів) → короткі підписи за шириною самого ряду, без накладання */ html.ra .act-row{container-type:inline-size;align-self:start} html.ra .act-row .slot>button{overflow:hidden;text-overflow:ellipsis} @container (max-width:560px){html.ra .act-row .l-full{display:none}html.ra .act-row .l-short{display:inline}} /* v1.9.2 · кнопка помічника не перекриває вміст на жодному екрані: вміст можна прокрутити вище кнопки; на низьких (горизонтальних) екранах кнопка менша */ html.ra body{padding-bottom:calc(140px + env(safe-area-inset-bottom,0px))} html.ra .ra-page,html.ra #settings{padding-bottom:calc(120px + env(safe-area-inset-bottom,0px))} @media (max-height:520px){html.ra .as-fab{width:48px;height:48px;right:10px;bottom:calc(52px + env(safe-area-inset-bottom,0px))}html.ra .as-fab svg{width:24px;height:24px}html.ra .as-sheet{max-height:92vh}} /* ---------- v1.9.3 · компактна шапка ---------- */ html.ra .panel{display:flex;flex-direction:column;gap:6px} html.ra .panel>#dateChip{order:-2;margin:0} html.ra .panel>.field{order:-1;margin:0} html.ra .panel>.field>.lbl,html.ra .panel>.field>.row{display:none} /* клієнти: один рядок, видно рівно 4, решта — гортанням убік */ html.ra .swipe-dots{flex-wrap:nowrap!important;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x proximity;scrollbar-width:none;gap:6px;margin:0} html.ra .swipe-dots::-webkit-scrollbar{display:none} html.ra .swipe-dots>.swipe-dot{flex:0 0 calc((100% - 18px) / 4);min-width:0;scroll-snap-align:start;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding-left:6px;padding-right:6px} html.ra .swipe-dots>.swipe-hint{display:none} /* кнопки дій окремим рядком (з підписами), під ними — дні Т1/Т2/Т3 одним рядком */ html.ra .day-bar{display:flex;flex-direction:column;gap:6px;container-type:inline-size} html.ra .day-bar>.act-row{order:-1;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;width:100%;container-type:normal;align-self:stretch} html.ra .day-bar>.act-row .slot>button{width:100%;min-height:var(--tap-top)} html.ra .day-bar>.tabs{width:100%;margin:0} @container (max-width:560px){html.ra .day-bar .act-row .l-full{display:none}html.ra .day-bar .act-row .l-short{display:inline}} @container (min-width:561px){html.ra .day-bar .act-row .l-full{display:inline}html.ra .day-bar .act-row .l-short{display:none}} /* v1.9.4 compact goal panel */ html.ra:where(:not(.theme-orange)) .rec{display:grid;grid-template-columns:minmax(0,1fr) auto;column-gap:8px;row-gap:2px;padding:6px 10px;border-radius:10px} html.ra:where(:not(.theme-orange)) .rec>.rec-top{grid-column:1/-1;display:flex;flex-wrap:nowrap;justify-content:flex-start;align-items:center;gap:4px 8px;min-width:0} html.ra:where(:not(.theme-orange)) .rec-l,html.ra:where(:not(.theme-orange)) .goal .l{font-size:10.5px;padding:2px 6px;letter-spacing:.04em} html.ra:where(:not(.theme-orange)) .rec-v,html.ra:where(:not(.theme-orange)) .goal .v{font-size:calc(var(--fs-goal) - 1px);line-height:1.2} html.ra:where(:not(.theme-orange)) .rec>.rec-why{grid-column:1;grid-row:2;align-self:center;font-size:11.5px;line-height:1.3;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;cursor:pointer} html.ra:where(:not(.theme-orange)) .rec>.rec-why.open{display:block} html.ra:where(:not(.theme-orange)) .rec>.rec-plan{grid-column:1/-1;font-size:12px} html.ra:where(:not(.theme-orange)) .rec>.fill-w{grid-column:2;grid-row:2;align-self:center;padding:4px 9px;font-size:12px;min-height:30px;white-space:nowrap} html.ra:where(:not(.theme-orange)) .ex .prevline{gap:4px 8px} html.ra:where(:not(.theme-orange)) .ex .prevline .btn-sm{padding:3px 8px;font-size:12px;min-height:28px} html.ra:where(:not(.theme-orange)) .ex .legend{font-size:10.5px;line-height:1.3} html.ra:where(:not(.theme-orange)) .ex~.ex .legend{display:none} html.ra:where(:not(.theme-orange)) .rec-l,html.ra:where(:not(.theme-orange)) .goal .l{white-space:nowrap} html.ra:where(:not(.theme-orange)) .rec .rec-v{white-space:nowrap;margin-left:auto} html.ra:where(:not(.theme-orange)) .rec .rec-lw .help-q{width:28px;height:28px;min-height:28px;font-size:12px;margin:-4px 0}html.ra:where(:not(.theme-orange)) .rec .rec-lw .help-q::before{width:20px;height:20px;left:4px;top:4px} html.ra:where(:not(.theme-orange)) .ex .prevline .btn-sm,html.ra:where(:not(.theme-orange)) .rec>.fill-w{min-height:28px!important} /* v1.9.5 no horizontal overflow (big system font) */ html.ra .rec>.rec-top{flex-wrap:wrap} html.ra .rec .rec-v{white-space:normal;text-align:right} html.ra .rec>.fill-w{white-space:normal;max-width:45vw} html.ra,html.ra body{overflow-x:clip;max-width:100%} /* v1.9.6 compact set rows / add-set / note */ html.ra:where(:not(.theme-orange)).ra-size-sm{--tap-num:34px;--pad-num:4px 4px;--pad-num-client:4px 4px;--fs-num-client:15px} html.ra:where(:not(.theme-orange)).ra-size-sm .ex .sets{gap:4px} html.ra:where(:not(.theme-orange)).ra-size-sm .ex .set{gap:6px} html.ra:where(:not(.theme-orange)).ra-size-sm .ex .sethead{font-size:11px;margin-bottom:0} html.ra:where(:not(.theme-orange)).ra-size-sm .ex .set input:not([type=checkbox]):not([type=radio]){min-height:34px;height:34px;padding:2px 4px;font-size:15px} html.ra:where(:not(.theme-orange)).ra-size-sm .ex .sets+.btn-sm,html.ra:where(:not(.theme-orange)).ra-size-sm .ex>.btn-sm.btn-ghost{min-height:28px!important;padding:2px 10px;font-size:12.5px;margin-top:2px} html.ra:where(:not(.theme-orange)).ra-size-sm .ex .note input{min-height:32px;height:32px;padding:4px 10px;font-size:13px} html.ra:where(:not(.theme-orange)).ra-size-sm .ex details>summary{font-size:12px} html.ra:where(:not(.theme-orange)).ra-size-sm .ex .mark-note{padding:4px 8px;font-size:12.5px} html.ra:where(:not(.theme-orange)).ra-size-sm .ex .mark-note .btn-sm{min-height:28px!important;padding:2px 10px;font-size:12.5px} html.ra:where(:not(.theme-orange)) .ex .tools-row{display:flex;flex-wrap:nowrap;align-items:center;gap:6px;margin-top:4px} html.ra:where(:not(.theme-orange)) .ex .tools-row>.btn-sm{flex:none;min-height:32px!important;padding:2px 10px;font-size:12.5px;white-space:nowrap} html.ra:where(:not(.theme-orange)) .ex .tools-row>.note{flex:1 1 auto;min-width:0;margin:0} html.ra:where(:not(.theme-orange)) .ex .tools-row>.note input{width:100%;min-height:32px;height:32px;padding:4px 10px;font-size:13px} /* v1.9.8 theme-orange: white text on orange, gradient buttons like the old journal */ html.ra.theme-orange{--ra-btn-ink:#fff;--ra-sel-ink:#fff;--ra-chip-bg:#FCE3D3;--ra-chip-ink:#A8431A;--accent-ink:#fff;--ra-ring:color-mix(in srgb,#E8572B 45%,transparent);--ra-tint:#EEF3FD} /* classic: html.ra.theme-orange .btn-main,html.ra.theme-orange #sendBtn,html.ra.theme-orange .tabs button[aria-selected="true"],html.ra.theme-orange .tabs .on,html.ra.theme-orange .swipe-dot[aria-current="true"]{background:linear-gradient(135deg,#E8452C,#F5832A)!important;color:#fff!important;border-color:transparent!important} */ /* classic: html.ra.theme-orange .tabs button[aria-selected="true"] *,html.ra.theme-orange #sendBtn *{color:#fff!important} */ /* classic: html.ra.theme-orange .rec{border-color:#C9D8F5;border-left-color:#1F5FD1} */ /* classic: html.ra.theme-orange .rec-v{color:#1F5FD1} */ html.ra.theme-orange .ra-wm,html.ra.theme-orange .ra-wm *,html.ra.theme-orange .ra-sub{color:#fff!important;fill:#fff} html.ra.theme-orange header button,html.ra.theme-orange .topbar button{color:#fff;border-color:rgba(255,255,255,.6)} /* v1.10 inbox banner */ html.ra .ra-inbox{position:fixed;left:8px;right:8px;top:calc(env(safe-area-inset-top,0px) + 8px);z-index:9999;display:flex;flex-direction:column;gap:6px;pointer-events:none} html.ra .ra-inbox-item{pointer-events:auto;display:flex;align-items:center;gap:8px;background:var(--surface);color:var(--ink);border:1px solid var(--line);border-left:5px solid var(--good);border-radius:12px;padding:8px 10px;box-shadow:0 6px 24px rgba(0,0,0,.18);font-size:var(--fs-small);max-width:560px;margin:0 auto;width:100%} html.ra .ra-inbox-item>span{flex:1;min-width:0} html.ra .ra-inbox-item .btn-sm{min-height:32px!important;padding:2px 10px;flex:none} html.ra #asRes{white-space:pre-line} /* v1.12 «класичний» вигляд (тема orange = журнал тренера Avangard): кольори, шрифти й розміри старого журналу; Rep Atlas додає лише шапку з ⚙ */ html.ra.theme-orange{--bg:#eef2f8;--surface:#ffffff;--ink:#121a2b;--muted:#5a6578;--line:#dde3ec;--soft:#f3f6fb;--accent:#e5432d;--accent2:#ff8a3d;--accent-ink:#ffffff; --edit:#2f6bdc;--good:#16a06a;--warm:#f2a516;--cool:#2f8fdc;--hero1:#121a2b;--hero2:#24366b;--goal:#2f6bdc;--mark:#2f6bdc; --f-display:"Unbounded","Arial Black",system-ui,sans-serif;--f-body:"Golos Text",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;--f-num:"JetBrains Mono",ui-monospace,monospace} html.ra.theme-orange body{font-family:var(--f-body)} html.ra.theme-orange{--tap-top:40px;--fs-top:14px;--tap-chip:30px;--tap:38px;--fs-btn:13.5px;--fs-small:12px;--fs-base:15px;--fs-h:16px;--fs-goal:16px;--gap-card:10px} /* v1.14 «Графіт-помаранч»: amber chips, orange rules */ html.ra.theme-black{--ra-f-brand:"Unbounded","Golos Text",system-ui,sans-serif;--ra-f-body:"Golos Text","Inter",system-ui,sans-serif;--ra-chip-bg:#FFB547;--ra-chip-ink:#16181D;--edit:#7FA6FF;--cool:#7FA6FF;--mark:#7FA6FF;--sp-prev:#7FA6FF;--good:#3DD68C} /* v1.14.1 brand theme keeps the compact scale of the classic journal (as theme orange) */ html.ra.theme-black,html.ra.theme-black.ra-size-sm{--tap-top:40px;--fs-top:14px;--tap-chip:30px;--tap:38px;--fs-btn:13.5px;--fs-small:12px;--fs-base:15px;--fs-h:16px;--fs-goal:16px;--gap-card:10px} html.ra.theme-black .ra-bar .ra-logo{width:36px;height:36px}html.ra.theme-black .ra-bar .ra-wm{font-size:20px} /* ===== v1.15 «як у ролику»: форма кнопок, вкладок, карток (кольори — ті самі, графіт + помаранч) ===== */ html.ra.theme-black{--v-card:#1F2228;--v-chip:#2A2D35;--v-line:#30333B;--v-mut:#9EA3AE} html.ra.theme-black body{background:#16181D} /* шапка: плоска, малий логотип */ html.ra.theme-black .ra-bar{background:transparent;box-shadow:none;border:0;border-bottom:0;min-height:0;padding:4px 2px} html.ra.theme-black .ra-bar .ra-wm{font-size:17px;font-family:"Golos Text","Inter",system-ui,sans-serif;font-weight:700;letter-spacing:-.01em} html.ra.theme-black .ra-bar .ra-wm i{font-style:normal;color:var(--ra-ivory)} html.ra.theme-black .ra-bar .ra-sub{font-size:10px;letter-spacing:.12em;color:var(--v-mut)} html.ra.theme-black .ra-bar .ra-hbtn{width:36px;height:36px;min-height:36px;border-radius:50%;border:1px solid var(--v-line);background:transparent;color:var(--ra-gold)} /* панель з клієнтами і датою */ html.ra.theme-black .panel{background:transparent;border:0;box-shadow:none;padding:2px 0} html.ra.theme-black .panel::before{display:none} html.ra.theme-black #dateChip{background:transparent;border:0;box-shadow:none;color:var(--v-mut);font-size:12.5px;font-weight:500;min-height:0;padding:2px 4px;justify-content:flex-start;text-align:left} html.ra.theme-black .swipe-dots{gap:6px} html.ra.theme-black .swipe-dots>.swipe-dot{flex:0 0 auto;min-height:30px;height:30px;padding:0 14px;border-radius:999px;background:var(--v-chip);border:0;color:#D5D8DE;font-size:13px;font-weight:600;box-shadow:none} html.ra.theme-black .swipe-dots>.swipe-dot[aria-current="true"],html.ra.theme-black .swipe-dots>.swipe-dot.on,html.ra.theme-black .swipe-dots>.swipe-dot[aria-selected="true"],html.ra.theme-black .swipe-dots>.swipe-dot.active{background:var(--ra-gold);color:#fff} /* дні Т1/Т2/Т3 — вкладки з підкресленням */ html.ra.theme-black .day-bar>.tabs{gap:4px;border-bottom:1px solid var(--v-line);padding-bottom:0} html.ra.theme-black .tabs .tab{background:transparent!important;border:0!important;box-shadow:none!important;border-radius:0;color:var(--v-mut);font-family:"Golos Text","Inter",system-ui,sans-serif;font-weight:700;min-height:38px;padding:4px 8px 6px;border-bottom:2px solid transparent!important} html.ra.theme-black .tabs .tab[aria-selected="true"]{color:var(--ra-gold)!important;border-bottom-color:var(--ra-gold)!important} html.ra.theme-black .tabs .tab small{color:var(--v-mut)!important;font-weight:500} /* кнопки дій */ html.ra.theme-black .day-bar .act-row .slot>button{border-radius:12px;min-height:40px;font-weight:700;font-size:13.5px;box-shadow:none} html.ra.theme-black #sendBtn{background:var(--ra-gold);border-color:var(--ra-gold);color:#fff} html.ra.theme-black .btn-short,html.ra.theme-black .btn-edit{background:var(--v-chip);border:1px solid var(--v-line);color:var(--ra-ivory)} /* картки вправ */ html.ra.theme-black .ex{background:var(--v-card);border:0;border-radius:14px;box-shadow:none;padding:12px} html.ra.theme-black .ex:not(.chk)::before{display:none} html.ra.theme-black .ex.ss{border-left:3px solid var(--ra-gold);border-top-left-radius:6px;border-bottom-left-radius:6px} html.ra.theme-black .ss-tag{color:var(--ra-gold);font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;font-family:"Golos Text",system-ui,sans-serif} html.ra.theme-black .ex .num{background:var(--v-chip);color:var(--ra-gold);border-radius:7px;font-size:11.5px;min-width:26px;height:22px} html.ra.theme-black .ex .ex-n{font-family:"Golos Text","Inter",system-ui,sans-serif;font-weight:700;font-size:15px;color:var(--ra-ivory)} html.ra.theme-black .ex .ex-i,html.ra.theme-black .help-q{background:transparent;border:1px solid var(--v-line);color:var(--v-mut)} html.ra.theme-black .ex .prevline{color:var(--v-mut)} html.ra.theme-black .btn-sm.btn-ghost{background:var(--v-chip);border:0;color:#D5D8DE;border-radius:10px} /* «Ціль сьогодні» */ html.ra.theme-black .rec{background:color-mix(in srgb,var(--ra-gold) 7%,var(--v-card));border:1px solid color-mix(in srgb,var(--ra-gold) 45%,transparent);border-left-width:1px;border-radius:12px} html.ra.theme-black .rec .rec-l{background:transparent;color:var(--ra-gold);padding:0;font-weight:700;letter-spacing:.06em} html.ra.theme-black .rec .rec-v,html.ra.theme-black .rec.up .rec-v{color:var(--ra-gold);font-weight:800} html.ra.theme-black .rec>.fill-w{background:color-mix(in srgb,#FFB547 18%,transparent);color:#FFB547;border:0;border-radius:8px} /* підходи */ html.ra.theme-black .ex .set input:not([type=checkbox]):not([type=radio]){background:var(--v-chip);border:1px solid transparent;border-radius:10px;color:var(--ra-ivory);font-weight:700} html.ra.theme-black .ex .set input:focus{border-color:var(--ra-gold)} html.ra.theme-black .ex .sethead{color:var(--v-mut);letter-spacing:.06em} html.ra.theme-black .ex .note input{background:var(--v-chip);border:0;border-radius:10px} /* кнопка мікрофона / помічника — кругла помаранчева з кільцем */ html.ra.theme-black .fab{background:var(--ra-gold)!important;color:#fff!important;border:0!important;border-radius:50%!important;box-shadow:0 0 0 6px color-mix(in srgb,var(--ra-gold) 22%,transparent),0 8px 22px rgba(0,0,0,.45)!important} html.ra.theme-black .day-bar>.act-row{order:1} html.ra.theme-black .rec .help-q,html.ra.theme-black .rec .rec-lw .help-q{width:20px!important;height:20px!important;min-height:20px!important;min-width:20px!important;padding:0!important;border-radius:50%!important;font-size:11px!important;margin:0 0 0 4px!important;background:transparent!important;border:1px solid color-mix(in srgb,var(--ra-gold) 50%,transparent)!important;color:var(--ra-gold)!important;box-shadow:none!important} html.ra.theme-black .rec .help-q::before{display:none} /* меню і налаштування: картки-рядки, як у ролику */ html.ra.theme-black .ra-sheet,html.ra.theme-black .ra-page{background:#16181D} html.ra.theme-black .ra-sheet button:not(.btn-main):not(.ra-x):not(.help-q):not([class*="arrow"]),html.ra.theme-black .ra-sheet .pick-btn,html.ra.theme-black .ra-page .btn-sm:not(.btn-main){background:var(--v-chip);border:0;border-radius:12px;color:var(--ra-ivory);box-shadow:none;min-height:40px;font-weight:600} html.ra.theme-black .ra-sheet input:not([type=checkbox]):not([type=radio]),html.ra.theme-black .ra-sheet select,html.ra.theme-black .ra-page input:not([type=checkbox]):not([type=radio]),html.ra.theme-black .ra-page select{background:var(--v-chip);border:1px solid transparent;border-radius:12px;color:var(--ra-ivory)} html.ra.theme-black .ra-x{border-radius:50%;width:36px;height:36px;min-height:36px;border:1px solid var(--v-line);background:transparent;color:var(--ra-ivory)} html.ra.theme-black .set-sec{background:var(--v-card);border:0;border-radius:14px;box-shadow:none} html.ra.theme-black .set-sec::before{display:none} html.ra .set-chk input[type=checkbox]{width:20px;height:20px;flex:none;margin:0} /* сторінка клієнта — ті самі картки, що й у тренера */ html.ra.theme-black .card{background:var(--v-card);border:0;border-radius:14px;box-shadow:none} html.ra.theme-black .card.ss{border-left:3px solid var(--ra-gold);border-top-left-radius:6px;border-bottom-left-radius:6px} html.ra.theme-black .card .num{background:var(--v-chip);color:var(--ra-gold);border-radius:7px;padding:1px 6px;font-size:11.5px} html.ra.theme-black .goal{background:color-mix(in srgb,var(--ra-gold) 7%,var(--v-card));border:1px solid color-mix(in srgb,var(--ra-gold) 45%,transparent);border-left-width:1px;border-radius:12px} html.ra.theme-black .goal .l{background:transparent;color:var(--ra-gold);padding:0;font-weight:700;letter-spacing:.06em} html.ra.theme-black .goal .v{color:var(--ra-gold);font-weight:800} html.ra.theme-black .card input:not([type=checkbox]):not([type=radio]){background:var(--v-chip);border:1px solid transparent;border-radius:10px;color:var(--ra-ivory);font-weight:700} html.ra.theme-black .bar{background:#16181D;border-top:1px solid var(--v-line)} html.ra.theme-black .bar .main,html.ra.theme-black #doneBtn{border-radius:14px;background:var(--ra-gold);color:#fff;border:0} /* v1.15.1 «Коротко» — рядки-картки як у ролику */ html.ra.theme-black .short{background:transparent;border:0;box-shadow:none;padding:0} html.ra.theme-black .short-head{background:transparent;border:0;padding:4px 2px 6px;color:var(--v-mut)} html.ra.theme-black .short-grp{background:var(--v-card);border:0;border-radius:12px;margin:0 0 6px;padding:0;overflow:hidden} html.ra.theme-black .short-row{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:10px;padding:10px 12px;border:0} html.ra.theme-black .short-n{color:var(--v-mut);font-size:11px;font-weight:700} html.ra.theme-black .short-name{font-weight:700;color:var(--ra-ivory);font-size:14.5px} html.ra.theme-black .short-prev{color:var(--v-mut);font-size:12px} html.ra.theme-black .short-prev .sp-hl{color:#FFB547} html.ra.theme-black .short-v{color:var(--ra-gold);font-weight:800;font-size:15px;text-align:right;white-space:nowrap;display:flex;flex-direction:column;align-items:flex-end;line-height:1.15} html.ra.theme-black .short-v::before{content:"ціль сьогодні";font-size:10px;font-weight:600;color:var(--v-mut);letter-spacing:.02em} html.ra.theme-black .rec>.rec-why:not(.open){display:none} html.ra.theme-black .rec{cursor:pointer} @media (max-width:420px){html.ra.theme-black .short-row{grid-template-columns:22px minmax(0,1fr) auto}html.ra.theme-black .short-v{grid-column:3;grid-row:1;font-size:14px}} html.ra.theme-black .as-fab{background:var(--ra-gold)!important;color:#fff!important;border:0!important;box-shadow:0 0 0 6px color-mix(in srgb,var(--ra-gold) 22%,transparent),0 8px 22px rgba(0,0,0,.45)!important} html.ra.theme-black .as-fab.on{background:#E5432D!important} html.ra .short-n,html.ra .ex .num,html.ra .card .num{font-family:"Golos Text","Inter",system-ui,sans-serif;font-variant-numeric:tabular-nums} /* ===== v1.16 точно за специфікацією ролика (макет 520pt → телефон ≈390px, ×0.75) ===== */ html.ra.theme-black{--v-card:#20232A;--v-chip:#2A2E37;--v-line:#353A44;--v-mut:#9AA0AA;--ra-ivory:#F4F4F6;--ra-good:#3DDC84;--good:#3DDC84; --ra-f-brand:"Inter","Golos Text",system-ui,sans-serif;--ra-f-body:"Inter","Golos Text",system-ui,sans-serif;--f-display:"Inter",system-ui,sans-serif;--f-body:"Inter",system-ui,sans-serif; --fs-base:13.5px;--fs-small:11.5px;--fs-btn:15px;--fs-h:14px;--fs-goal:22px;--gap-card:8px;--tap:36px;--tap-top:36px;--fs-top:12.5px;--tap-chip:29px} html.ra.theme-black body{font-family:"Inter",system-ui,sans-serif;font-size:13.5px;color:#F4F4F6} html.ra.theme-black .wrap{padding-left:13px!important;padding-right:13px!important;gap:8px} html.ra.theme-black .ra-bar .ra-wm,html.ra.theme-black h1,html.ra.theme-black h2,html.ra.theme-black .sec-t{font-family:"Inter",system-ui,sans-serif;font-weight:800;letter-spacing:-.01em} html.ra.theme-black .ra-bar .ra-wm{font-size:16px} /* чипи клієнтів */ html.ra.theme-black .swipe-dots{gap:7px} html.ra.theme-black .swipe-dots>.swipe-dot{height:29px;min-height:29px;font-size:12.5px;font-weight:600;padding:0 13px;background:#2A2E37;border-radius:15px} /* вкладки днів: 48×30, радіус 9 */ html.ra.theme-black .day-bar>.tabs{border-bottom:0;gap:7px} html.ra.theme-black .tabs .tab{border-radius:9px!important;min-height:30px;padding:4px 10px!important;font-size:13px;font-weight:700;border-bottom:0!important} html.ra.theme-black .tabs .tab[aria-selected="true"]{background:#2A2E37!important;color:#FF6A2B!important;box-shadow:inset 0 -2px 0 #FF6A2B!important} html.ra.theme-black .tabs .tab small{font-size:10.5px} /* кнопки: головна 48–52, радіус 15 */ html.ra.theme-black .day-bar .act-row .slot>button{min-height:44px;border-radius:14px;font-size:14.5px;font-weight:700} html.ra.theme-black .btn-main,html.ra.theme-black .bar .main,html.ra.theme-black #doneBtn{min-height:48px;border-radius:15px;font-size:15.5px;font-weight:700} /* картки в списку: радіус 12, поля 12–16, між ними 8–9 */ html.ra.theme-black .ex,html.ra.theme-black .card{background:#20232A;border-radius:12px;padding:13px 13px 12px;margin-bottom:0} html.ra.theme-black .list{gap:8px} html.ra.theme-black .ex .ex-n,html.ra.theme-black .card .ex-n,html.ra.theme-black .short-name{font-size:14px;font-weight:600} html.ra.theme-black .ex .prevline,html.ra.theme-black .short-prev,html.ra.theme-black .card .prev{font-size:11.5px;font-weight:500;color:#9AA0AA} html.ra.theme-black .ss-tag,html.ra.theme-black .ex .sethead,html.ra.theme-black .chk-warmup .ttl,html.ra.theme-black .chk-cooldown .ttl{font-size:10px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:#9AA0AA} html.ra.theme-black .ss-tag{color:#FF6A2B} html.ra.theme-black .ex .num{height:20px;min-width:24px;border-radius:6px;font-size:11px} /* ціль сьогодні */ html.ra.theme-black .rec,html.ra.theme-black .goal{border-radius:15px;padding:10px 12px} html.ra.theme-black .rec .rec-l,html.ra.theme-black .goal .l{font-size:9.5px} html.ra.theme-black .rec .rec-v,html.ra.theme-black .goal .v{font-size:22px;font-weight:900;letter-spacing:-.01em;font-family:"Inter",system-ui,sans-serif} html.ra.theme-black .short-v{font-size:14px;font-weight:800} html.ra.theme-black .short-v::before{font-size:9px} /* поля вводу: радіус 9 */ html.ra.theme-black .ex .set input:not([type=checkbox]):not([type=radio]),html.ra.theme-black .card input:not([type=checkbox]):not([type=radio]){background:#2A2E37;border-radius:9px;font-family:"Inter",system-ui,sans-serif;font-weight:700;font-size:14px} html.ra.theme-black .ex .note input,html.ra.theme-black .btn-sm.btn-ghost{border-radius:9px} /* мікрофон ⌀ 63 */ html.ra.theme-black .as-fab{width:62px!important;height:62px!important} /* v1.17 шапка як у макеті (сторінка 1 PDF): лого + «Rep Atlas» + дата · чипи клієнтів · Т1/Т2/Т3 + круглі кнопки */ html.ra.theme-black .ra-bar{display:flex;align-items:center;gap:8px;padding:6px 0 2px;min-height:44px} html.ra.theme-black .ra-bar .ra-bar-wm{display:flex;align-items:center;gap:8px;flex:none} html.ra.theme-black .ra-bar .ra-logo{width:26px;height:26px;background:transparent;box-shadow:none;padding:0;border-radius:0} html.ra.theme-black .ra-bar .ra-wm{font-size:19px;font-weight:800;letter-spacing:-.02em} html.ra.theme-black .ra-bar .ra-sub{display:none} html.ra.theme-black .ra-bar .ra-hbtn{width:34px;height:34px;min-height:34px;border-radius:50%;border:1.5px solid #4A505C;background:transparent;color:#C9CDD4;font-size:16px} html.ra.theme-black .ra-bar>#dateChip{flex:1 1 auto;min-width:0;margin:0;padding:0 6px;min-height:0;background:transparent;border:0;box-shadow:none;color:#9AA0AA;font-size:13px;font-weight:500;text-align:right;justify-content:flex-end;white-space:nowrap;overflow:hidden;text-overflow:ellipsis} html.ra.theme-black .panel{position:static!important;padding:4px 0 2px} /* чипи клієнтів: висота 34, повністю круглі */ html.ra.theme-black .swipe-dots{gap:9px;padding:2px 0} html.ra.theme-black .swipe-dots>.swipe-dot{flex:0 0 auto;height:34px;min-height:34px;padding:0 16px;border-radius:17px;background:#2A2E37;border:0;color:#E6E8EC;font-size:15px;font-weight:600;box-shadow:none} /* рядок днів: плитки 54×36 зліва, круглі кнопки ⌀40 справа */ html.ra.theme-black .day-bar{flex-direction:row;align-items:center;justify-content:space-between;gap:10px;flex-wrap:nowrap;padding:2px 0} html.ra.theme-black .day-bar>.tabs{flex:1 1 auto;min-width:0;width:auto;display:flex;flex-wrap:nowrap;gap:9px;overflow-x:auto;scrollbar-width:none;border:0;padding:0} html.ra.theme-black .day-bar>.tabs::-webkit-scrollbar{display:none} html.ra.theme-black .tabs .tab{flex:0 0 auto;min-width:54px;min-height:36px;height:36px;padding:0 12px!important;border-radius:10px!important;background:#2A2E37!important;border:0!important;box-shadow:none!important;color:#9AA0AA!important;font-size:15px;font-weight:700;position:relative} html.ra.theme-black .tabs .tab[aria-selected="true"]{color:#FF6A2B!important} html.ra.theme-black .tabs .tab[aria-selected="true"]::after{content:"";position:absolute;left:12px;right:12px;bottom:4px;height:2.5px;border-radius:2px;background:#FF6A2B} html.ra.theme-black .tabs .tab small{display:none!important} html.ra.theme-black .tabs .tab.add{min-width:36px;padding:0 10px!important} html.ra.theme-black .day-bar>.act-row{order:1;display:flex!important;width:auto!important;gap:9px;flex:none} html.ra.theme-black .day-bar .act-row .slot>button{width:40px!important;height:40px;min-height:40px!important;padding:0!important;border-radius:50%!important;font-size:0!important;display:grid;place-items:center;background:transparent!important;border:1.5px solid #4A505C!important;color:#C9CDD4!important;box-shadow:none!important} html.ra.theme-black .day-bar .act-row .slot>button .l-short,html.ra.theme-black .day-bar .act-row .slot>button .l-full{display:none!important} html.ra.theme-black .day-bar .act-row .slot>button::before{font-size:18px;line-height:1;font-weight:700} html.ra.theme-black .day-bar .btn-short::before{content:"≡";font-size:22px!important} html.ra.theme-black .day-bar .btn-edit::before{content:"✎";font-size:16px!important} html.ra.theme-black .day-bar .btn-edit[aria-pressed="true"]::before{content:"✓"} html.ra.theme-black .day-bar #sendBtn{border-color:#FF6A2B!important;color:#FF6A2B!important} html.ra.theme-black .day-bar #sendBtn::before{content:"➤";margin-left:3px} html.ra.theme-black .day-bar #sendBtn[data-again="1"]::before{content:"↻";margin-left:0;font-size:20px!important} html.ra.theme-black .day-bar .act-row .slot>button[aria-pressed="true"]{background:#FF6A2B!important;border-color:#FF6A2B!important;color:#fff!important} html.ra.theme-black .ra-bar>#dateChip{white-space:normal;line-height:1.2;font-size:12px}html.ra.theme-black .ra-bar .ra-wm{font-size:18px} /* v1.17.1 кнопки дня: ширші, з підписом (Відправити · Коротко · Змінити) */ html.ra.theme-black .day-bar{flex-direction:column;align-items:stretch;gap:8px} html.ra.theme-black .day-bar>.act-row{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;width:100%!important;order:1} html.ra.theme-black .day-bar .act-row .slot>button{width:100%!important;height:42px;min-height:42px!important;border-radius:21px!important;padding:0 10px!important;font-size:14px!important;font-weight:700;display:inline-flex;align-items:center;justify-content:center;gap:7px;white-space:nowrap} html.ra.theme-black .day-bar .act-row .slot>button .l-short{display:inline!important} html.ra.theme-black .day-bar .act-row .slot>button .l-full{display:none!important} html.ra.theme-black .day-bar .act-row .slot>button::before{font-size:16px} html.ra.theme-black .day-bar .btn-short::before{font-size:19px!important} html.ra.theme-black .day-bar #sendBtn::before{margin:0} html.ra.theme-black .day-bar #sendBtn{background:#FF6A2B!important;border-color:#FF6A2B!important;color:#fff!important} @media (max-width:370px){html.ra.theme-black .day-bar .act-row .slot>button{font-size:13px!important;gap:5px;padding:0 6px!important}} html.ra:where(:not(.theme-black)) .btn-edit .l-short::before,html.ra:where(:not(.theme-black)) .btn-edit .l-full::before{content:"✎ "} /* v1.18 екран вправи */ html.ra.theme-black .rec{cursor:pointer} html.ra.ex-sheet-open{overflow:hidden} .ex-sheet{position:fixed;inset:0;z-index:10050;background:#16181D;color:#F4F4F6;overflow-y:auto;padding:max(10px,env(safe-area-inset-top)) 14px 24px;font-family:"Inter",system-ui,sans-serif;display:flex;flex-direction:column;gap:14px} .exs-head{display:flex;align-items:center;gap:10px;min-height:44px} .exs-head b{font-size:17px;font-weight:700} .exs-back{width:36px;height:36px;border-radius:50%;border:0;background:transparent;color:#F4F4F6;font-size:30px;line-height:1;padding:0 0 4px;cursor:pointer} .exs-lbl{font-size:10.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:#9AA0AA} .exs-goal{background:#20232A;border:1.5px solid #FF6A2B;border-radius:18px;padding:16px} .exs-goal .exs-lbl{color:#FF6A2B} .exs-goal h2{margin:8px 0 6px;font-size:21px;font-weight:700;letter-spacing:-.01em} .exs-val{font-size:44px;font-weight:900;color:#FF6A2B;letter-spacing:-.02em;line-height:1.05;font-variant-numeric:tabular-nums} .exs-meta{display:flex;align-items:center;gap:10px;margin-top:12px;flex-wrap:wrap} .exs-badge{background:color-mix(in srgb,#FFB547 20%,transparent);color:#FFB547;font-weight:700;font-size:13px;padding:4px 10px;border-radius:12px} .exs-badge.down{background:color-mix(in srgb,#F87171 20%,transparent);color:#F87171} .exs-why{font-size:12.5px;color:#9AA0AA;flex:1 1 160px;min-width:0} .exs-sub{margin-top:10px;font-size:12.5px;color:#9AA0AA} .exs-det{margin-top:10px;font-size:12.5px;color:#C9CDD4}.exs-det summary{color:#FFB547;cursor:pointer} .exs-chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px} .exs-chip{height:34px;padding:0 14px;border-radius:17px;border:0;background:#2A2E37;color:#E6E8EC;font-size:13.5px;font-weight:600;cursor:pointer;font-family:inherit} .exs-chip.on{background:#FF6A2B;color:#fff} .exs-hint{margin-top:8px;font-size:12px;color:#9AA0AA} .exs-plan{background:#20232A;border-radius:18px;padding:14px 16px 10px} .exs-bars{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;gap:8px;align-items:end;height:150px;margin-top:12px} .exs-bar{position:relative;height:100%;display:flex;align-items:flex-end;justify-content:center} .exs-bar::before{content:"";display:block;width:100%;height:var(--h,40%);background:#2A2E37;border-radius:8px} .exs-bar.dl::before{background:#FF6A2B}.exs-bar.after::before{background:#FFB547} .exs-bar.now::before{box-shadow:inset 0 0 0 1.5px #F4F4F6} .exs-wk{position:absolute;bottom:-18px;font-size:10.5px;color:#9AA0AA} .exs-bars{margin-bottom:22px} .exs-note{display:inline-block;margin:0 0 6px;padding:5px 10px;border:1px solid #FFB547;border-radius:10px;color:#FFB547;font-size:11.5px;font-weight:600} .exs-send{margin-top:auto;height:52px;border:0;border-radius:16px;background:#FF6A2B;color:#fff;font-size:16px;font-weight:700;cursor:pointer;font-family:inherit} /* v1.18 сторінка клієнта: підходи плитками «підхід 1 · 62,5 × 8 ✓», зелена смуга «Надіслано тренеру» */ html.ra.theme-black .card>.goal{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:0;background:transparent;border:0;border-radius:0;margin:0} html.ra.theme-black .card>.goal .l{font-size:10px} html.ra.theme-black .card>.goal .v{font-size:14px;font-weight:800} html.ra.theme-black .card>.goal .why{flex:0 0 100%;font-size:11.5px;color:#9AA0AA} html.ra.theme-black .card>.head{margin-bottom:0} html.ra.theme-black .done-badge{position:fixed;left:14px;right:14px;bottom:calc(14px + env(safe-area-inset-bottom));z-index:50;justify-content:center;align-self:auto;height:52px;border-radius:16px;background:#3DDC84;color:#16181D;font-size:16px;font-weight:700} html.ra.theme-black .done-badge+*{margin-top:0} html.ra.theme-black body:has(.done-badge) .wrap{padding-bottom:84px} /* v1.18 звіт прогресу як у макеті: помаранчева лінія, плитки «+12,5 кг · 36 · 98%», список приростів */ html.ra.theme-black .rp-head h3{font:800 20px "Inter",system-ui,sans-serif;letter-spacing:-.01em} html.ra.theme-black .rp-period{color:#9AA0AA;font-size:12.5px} html.ra.theme-black .rp-sum{gap:8px} html.ra.theme-black .rp-tile{background:#20232A;border:0;border-radius:14px;padding:14px 10px;align-items:center;text-align:center} html.ra.theme-black .rp-tile b{font:900 22px "Inter",system-ui,sans-serif;color:#F4F4F6;letter-spacing:-.01em} html.ra.theme-black .rp-tile[data-k="ups"] b{color:#FF6A2B} html.ra.theme-black .rp-tile span{font-size:11px;color:#9AA0AA} html.ra.theme-black .rp-lifts{display:flex;flex-direction:column;gap:0;background:#20232A;border-radius:14px;padding:4px 14px} html.ra.theme-black .rp-lift{flex-direction:row;justify-content:space-between;align-items:center;gap:10px;padding:11px 0;border:0;border-bottom:1px solid #2E323B;background:transparent;border-radius:0} html.ra.theme-black .rp-lift:last-child{border-bottom:0} html.ra.theme-black .rp-lift b{font-size:14px;font-weight:600;color:#F4F4F6} html.ra.theme-black .rp-lift span{font:800 14px "Inter",system-ui,sans-serif;color:#FF6A2B;white-space:nowrap} html.ra.theme-black .rp-card{background:#20232A;border:0;border-radius:14px;padding:12px} html.ra.theme-black .rp-card figcaption b{font-size:10.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:#9AA0AA} html.ra.theme-black .rp-card figcaption small{color:#FFB547;font-weight:700} html.ra.theme-black .rp-svg .rp-line{stroke:#FF6A2B;stroke-width:2.5;stroke-linejoin:round;stroke-linecap:round} html.ra.theme-black .rp-svg .rp-dot{fill:#FF6A2B;stroke:#20232A;stroke-width:1.5;r:4} html.ra.theme-black .rp-svg .rp-ton{fill:#2A2E37;opacity:1} html.ra.theme-black .rp-svg .rp-ax{fill:#9AA0AA;font-size:9px} html.ra.theme-black .rp-svg .rp-base{stroke:#353A44} html.ra.theme-black .rp-legend{color:#9AA0AA;font-size:11.5px} /* v1.18.4 панель посилання клієнта */ html.ra .link-warn{color:#FFB547;font-weight:600;margin:0 0 6px} html.ra .link-h{font-weight:700;margin:12px 0 4px;font-size:14px} html.ra.theme-black .link-h{color:#F4F4F6} /* v1.19 повна програма */ html.ra .fp-head h3{margin:0 0 2px;font-size:18px} html.ra .fp-grid{display:grid;grid-template-columns:1fr;gap:10px;margin-top:10px} @media (min-width:700px){html.ra .fp-grid{grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}} html.ra .fp-day{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:10px 12px} html.ra.theme-black .fp-day{background:#20232A;border:0} html.ra .fp-side{opacity:.85} html.ra .fp-dt{font-weight:800;font-size:14px;margin-bottom:6px;color:var(--ra-gold)} html.ra.theme-black .fp-dt{color:#FF6A2B} html.ra .fp-ex{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:2px 10px;padding:6px 0;border-top:1px solid var(--line);font-size:13.5px} html.ra.theme-black .fp-ex{border-top-color:#2E323B} html.ra .fp-ex:first-of-type{border-top:0} html.ra .fp-ex b{font-weight:600} html.ra .fp-ex>span{color:var(--ra-gold);font-weight:700;white-space:nowrap;text-align:right} html.ra.theme-black .fp-ex>span{color:#FFB547} html.ra .fp-ex>small{grid-column:1/-1;color:var(--muted);font-size:11.5px} html.ra .fp-ex.ss{border-left:3px solid var(--ra-gold);padding-left:8px;margin-left:-2px} html.ra.theme-black .fp-ex.ss{border-left-color:#FF6A2B} html.ra .fp .send-btns{margin-top:12px} html.ra .drawer-row{display:flex;align-items:stretch;gap:6px} html.ra .drawer-row>.pick-opt{flex:1 1 auto;min-width:0} html.ra .drawer-row>.fp-btn{flex:none;width:44px;padding:0;font-size:18px;display:grid;place-items:center} /* v1.19.2 full program: warm-up / cool-down popups */ html.ra .fp-chips{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px} html.ra .fp-chip{border:0;border-radius:999px;padding:8px 14px;font:inherit;font-weight:700;font-size:13px;cursor:pointer;background:var(--surface);color:var(--ink);border:1px solid var(--line)} html.ra .fp-chip.warm{background:color-mix(in srgb,var(--warm) 18%,var(--surface));border-color:color-mix(in srgb,var(--warm) 45%,transparent)} html.ra .fp-chip.cool{background:color-mix(in srgb,var(--cool) 18%,var(--surface));border-color:color-mix(in srgb,var(--cool) 45%,transparent)} html.ra.theme-black .fp-chip{background:#2A2E37;border-color:#353A44;color:#F4F4F6} html.ra.theme-black .fp-chip.warm{border-color:#FFB547;color:#FFB547} html.ra.theme-black .fp-chip.cool{border-color:#55aef0;color:#55aef0} html.ra .fp-pop{position:fixed;inset:0;z-index:1200;background:rgba(0,0,0,.55);display:flex;align-items:flex-end;justify-content:center} html.ra .fp-pop[hidden]{display:none} html.ra .fp-pop-sheet{width:100%;max-width:560px;max-height:80vh;overflow:auto;background:var(--surface);border-radius:18px 18px 0 0;padding:12px 16px calc(16px + env(safe-area-inset-bottom));box-shadow:0 -8px 30px rgba(0,0,0,.35)} html.ra.theme-black .fp-pop-sheet{background:#20232A;color:#F4F4F6} @media (min-width:700px){html.ra .fp-pop{align-items:center}html.ra .fp-pop-sheet{border-radius:18px}} html.ra .fp-pop-h{display:flex;align-items:center;justify-content:space-between;font-size:17px;margin-bottom:6px} html.ra .fp-pop-x{border:0;background:transparent;color:inherit;font:inherit;font-size:18px;padding:6px 8px;cursor:pointer} html.ra .fp-pop-list .fp-ex{grid-template-columns:1fr;gap:0} html.ra .fp-pop-list .fp-ex>span{text-align:left;white-space:normal;font-weight:500;color:var(--muted)} html.ra.theme-black .fp-pop-list .fp-ex>span{color:#9AA0AA} html.ra .fp-chips-day{margin:0 0 6px}html.ra .fp-chips-day .fp-chip{padding:5px 10px;font-size:12px} /* v1.19.4 week chip beside day tabs */ html.ra .tabs .wk-chip{margin-left:auto;align-self:center;border:1px solid var(--line);background:var(--surface);color:var(--muted);border-radius:999px;padding:5px 11px;font:inherit;font-size:12px;font-weight:700;white-space:nowrap;cursor:pointer;min-height:0} html.ra .tabs .wk-chip.deload{color:#b86a00;border-color:#f2a516;background:color-mix(in srgb,#f2a516 14%,var(--surface))} html.ra.theme-black .tabs .wk-chip{background:#2A2E37;border-color:#353A44;color:#9AA0AA} html.ra.theme-black .tabs .wk-chip.deload{color:#FFB547;border-color:#FFB547;background:#2A2E37} html.ra.theme-black .tabs .wk-chip.over{color:#FF6A2B;border-color:#FF6A2B} /* v1.20.7: supersets in the full program — one box per superset */ html.ra .fp-grp{border:1px solid var(--line);border-radius:12px;padding:2px 10px 4px;margin:8px 0;background:color-mix(in srgb,var(--ra-gold) 6%,transparent)} html.ra.theme-black .fp-grp{border-color:#3A3F4A;background:rgba(255,106,43,.06)} html.ra .fp-gt{font-size:11.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);padding:6px 0 2px} html.ra .fp-gt+.fp-ex{border-top:0} /* v1.21.2: the settings «Зберегти» bar sat 120px above the bottom (sticky counts the page's bottom padding) and covered the fields — pin it to the real bottom */ html.ra #settings .set-save{bottom:calc(-120px - env(safe-area-inset-bottom,0px));padding:10px 0 calc(12px + env(safe-area-inset-bottom,0px));margin-bottom:calc(-120px - env(safe-area-inset-bottom,0px));border-top:1px solid var(--line);z-index:5} html.ra #settings .set-save+*{margin-top:calc(120px + env(safe-area-inset-bottom,0px))}