/* Heebo (OFL), מתארח באפליקציה עצמה: בלי בקשות לגוגל */
@font-face { font-family: "Heebo"; font-style: normal; font-display: swap; font-weight: 100 900;
  src: url("fonts/heebo-hebrew-wght-normal.woff2") format("woff2");
  unicode-range: U+0307-0308, U+0590-05FF, U+200C-2010, U+20AA, U+25CC, U+FB1D-FB4F; }
@font-face { font-family: "Heebo"; font-style: normal; font-display: swap; font-weight: 100 900;
  src: url("fonts/heebo-latin-wght-normal.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }

/* © 2026 Yossi Ozan. All rights reserved. כל הזכויות שמורות. */
:root {
  --ground: #F7F6FB;
  --surface: #FFFFFF;
  --ink: #1B2B2A;
  --muted: #3E4A55;
  --line: #CDD3CC;
  --accent: #A8525E;          /* זהב ורוד עמוק: טקסט ומסגרות */
  --accent-deep: #134A7A;     /* כחול פנינה עמוק: טקסט חזק */
  --accent-soft: #FCEBF2;     /* רקע עדין משולב */
  /* שילוב צבעי הדמויות: זהב ורוד של האישה + כחול פנינה של הגבר */
  --blend: linear-gradient(120deg, #F57FA0 0%, #FFB3C7 22%, #F0D2F0 48%, #8FD0FF 74%, #45A8F5 100%);
  --blend-deep: linear-gradient(120deg, #E8336F 0%, #D9447F 28%, #8A5FD6 52%, #2D8CF0 76%, #0866D9 100%);
  --green: #0E8A62;           /* ירוק: התקדמות ומשקל */
  --green-soft: #E2F5EC;
  --sky: #1F6FD1;             /* כחול: תזכורות וגיבוי */
  --sky-soft: #E6F0FC;
  --coral: #E8572E;           /* קורל: מוטיבציה וטיפים */
  --warm-soft: #FFEDE6;
  --warm-ink: #8A2E10;
  --error: #B42318;
  --radius: 20px;
  --font: "Heebo", system-ui, -apple-system, "Segoe UI", Arial, sans-serif;
}

* { box-sizing: border-box; }

[hidden] { display: none !important; }

html, body { margin: 0; min-height: 100%; }

body {
  background: var(--ground);
  color: var(--ink);
  font-family: var(--font);
  font-size: 18px;
  line-height: 1.55;
  -webkit-text-size-adjust: 100%;
}

#app {
  max-width: 480px;
  margin: 0 auto;
  min-height: 100dvh;
}

.screen {
  min-height: 100dvh;
  display: flex;
  flex-direction: column;
  gap: 18px;
  padding: calc(env(safe-area-inset-top) + 32px) 20px calc(env(safe-area-inset-bottom) + 24px);
}

h1 { margin: 0; font-size: 28px; font-weight: 800; line-height: 1.2; }
h2 { margin: 0; font-size: 17px; font-weight: 700; }
p { margin: 0; }

.muted { color: var(--muted); }
.small-text { font-size: 14px; }
.accent { color: var(--accent); }
.stack-xs { display: flex; flex-direction: column; gap: 2px; }
.stack-sm { display: flex; flex-direction: column; gap: 6px; }
.spacer { flex: 1; }
.row-between { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; }

/* טפסים */
fieldset { border: 0; margin: 0; padding: 0; min-width: 0; }

.field {
  display: flex;
  flex-direction: column;
  gap: 8px;
  font-size: 15px;
  font-weight: 700;
}

.field legend { padding: 0; margin-bottom: 8px; }

.field input,
.field select {
  height: 50px;
  border-radius: 14px;
  border: 1px solid var(--line);
  background: var(--surface);
  padding: 0 14px;
  font: inherit;
  font-size: 17px;
  font-weight: 400;
  color: var(--ink);
  width: 100%;
}

.field input:focus-visible,
.field select:focus-visible,
.btn:focus-visible,
.choice input:focus-visible + span {
  outline: 3px solid var(--accent);
  outline-offset: 2px;
}

.grid-two {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.choice-grid { display: grid; gap: 8px; }
.choice-grid.three { grid-template-columns: repeat(3, minmax(0, 1fr)); }

.choice { position: relative; }
.choice input { position: absolute; opacity: 0; inset: 0; margin: 0; }
.choice span {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 50px;
  border-radius: 14px;
  border: 1px solid var(--line);
  background: var(--surface);
  font-weight: 400;
}
.choice input:checked + span {
  border: 2px solid var(--accent);
  background: var(--accent-soft);
  color: var(--accent-deep);
  font-weight: 700;
}

.error { color: var(--error); font-weight: 500; }

/* כפתורים */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 52px;
  border-radius: 16px;
  border: 0;
  font: inherit;
  font-size: 17px;
  font-weight: 700;
  cursor: pointer;
  padding: 0 20px;
}
.btn.primary { background: var(--accent); color: #FFFFFF; min-height: 56px; }
.btn.light { background: #FFFFFF; color: var(--accent-deep); }
.btn.ghost { background: transparent; color: var(--muted); border: 1px solid var(--line); }
.btn.small { min-height: 44px; font-size: 14px; padding: 0 14px; }
.btn:active { transform: scale(0.98); }

/* מסך בית */
.home-top { display: flex; justify-content: space-between; align-items: center; }
.wordmark { color: var(--accent); font-size: 26px; letter-spacing: 0.3px; }

.card {
  background: var(--surface);
  border-radius: 24px;
  padding: 20px;
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.next-shot { background: var(--accent); color: #FFFFFF; gap: 12px; }
.label-light { font-size: 15px; opacity: 0.92; }
.countdown { display: flex; align-items: baseline; gap: 8px; font-size: 20px; font-weight: 700; }
.countdown strong { font-size: 56px; font-weight: 800; line-height: 1; }

.stats {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  margin: 0;
  text-align: center;
}
.stats div { display: flex; flex-direction: column-reverse; gap: 2px; }
.stats dt { font-size: 13px; color: var(--muted); }
.stats dd { margin: 0; font-size: 24px; font-weight: 800; }

.progress { height: 10px; border-radius: 5px; background: #E4E8E2; overflow: hidden; }
.progress-fill { height: 100%; width: 0; background: var(--accent); border-radius: 5px; transition: width 400ms ease; }

.note {
  background: var(--warm-soft);
  color: var(--warm-ink);
  border-radius: 20px;
  padding: 16px 18px;
  font-size: 15px;
}

.toast {
  position: fixed;
  inset-inline: 20px;
  bottom: calc(env(safe-area-inset-bottom) + 24px);
  max-width: 440px;
  margin: 0 auto;
  background: var(--accent-deep);
  color: #FFFFFF;
  border-radius: 14px;
  padding: 14px 16px;
  font-weight: 500;
  text-align: center;
}

.choice-grid.two { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.choice.suggested span::after { content: " ★"; color: var(--accent); }

.card-legend { padding: 0; margin-bottom: 4px; float: right; width: 100%; }
.card-legend + * { clear: both; }
.big-line { font-size: 22px; font-weight: 800; }
.small-link { font-size: 14px; font-weight: 700; color: var(--accent); }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

.btn.outline { background: var(--surface); color: var(--accent-deep); border: 2px solid var(--accent); }
.link-btn {
  background: none; border: 0; font: inherit; font-size: 14px; color: var(--muted);
  text-decoration: underline; min-height: 44px; cursor: pointer; align-self: center;
}
a.btn { text-decoration: none; }

.history { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.history li { display: flex; justify-content: space-between; font-size: 15px; border-bottom: 1px solid #E4E8E2; padding-bottom: 8px; }
.history li:last-child { border-bottom: 0; padding-bottom: 0; }

.last-shot {
  color: #FFFFFF;
  font-size: 15px;
  text-align: center;
  text-decoration: underline;
  text-underline-offset: 3px;
  min-height: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.shot-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.shot-list li {
  background: var(--surface);
  border-radius: 18px;
  padding: 14px 16px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
}
.shot-list .when { display: flex; flex-direction: column; }
.shot-list .when strong { font-size: 17px; }
.shot-list .when span, .shot-list .site { font-size: 14px; color: var(--muted); }
.shot-list .dose { font-weight: 800; font-size: 17px; white-space: nowrap; }

@media (prefers-reduced-motion: reduce) {
  .progress-fill { transition: none; }
  .btn:active { transform: none; }
}

/* הגדרות וגיבוי (S15) */
.file-btn { position: relative; overflow: hidden; }
.file-btn input { position: absolute; inset: 0; opacity: 0; cursor: pointer; }
.file-btn:focus-within { outline: 3px solid var(--accent); outline-offset: 2px; }
.danger-zone { border: 1px solid #F1C9C5; }
.btn.danger { background: var(--surface); color: var(--error); border: 2px solid var(--error); }
.backup-nudge {
  display: flex; flex-direction: column; gap: 2px;
  background: var(--surface); border: 2px dashed var(--accent);
  border-radius: 20px; padding: 14px 18px; color: var(--ink); text-decoration: none; font-size: 15px;
}
.backup-nudge strong { color: var(--accent-deep); }
.backup-nudge span { color: var(--muted); font-size: 14px; }

/* מסך פתיחה מונפש: צלליות שמתעדנות בתוך טבעת המותג */
#splash {
  position: fixed;
  inset: 0;
  z-index: 100;
  background:
    radial-gradient(70% 45% at 50% 38%, rgba(255, 255, 255, .16) 0%, rgba(255, 255, 255, 0) 70%),
    linear-gradient(160deg, #E8336F 0%, #D44A86 30%, #6E6BDB 62%, #1E7FEA 85%, #0B63D1 100%);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 26px;
  animation: splash-out 600ms ease 4100ms forwards;
}
.splash-stage { position: relative; width: 260px; height: 260px; }
.splash-art { position: absolute; inset: 0; }
.fig3d {
  position: absolute;
  top: 24px;
  opacity: 0;
  transform-origin: 50% 90%;
  animation:
    figs-in 450ms ease 50ms forwards,
    turn3d 3.4s ease-in-out 0s infinite alternate;
}
.fig3d.woman { left: 40px; }
.fig3d.man { left: 133px; animation-delay: 170ms, -1.7s; }
.fig-svg { display: block; overflow: visible; animation: breathe 2.6s ease-in-out infinite; }
.man .fig-svg { animation-delay: -1.3s; }
@keyframes turn3d {
  from { transform: perspective(520px) rotateY(-20deg); }
  to   { transform: perspective(520px) rotateY(20deg); }
}
@keyframes breathe {
  0%, 100% { transform: translateY(0) scaleY(1); }
  50%      { transform: translateY(-4px) scaleY(1.012); }
}
.splash-ring {
  stroke-dasharray: 867;
  stroke-dashoffset: 867;
  opacity: .9;
  animation: ring-draw 1300ms cubic-bezier(.65, 0, .35, 1) 400ms forwards;
}
.splash-brand { display: flex; flex-direction: column; align-items: center; gap: 4px; }
.splash-word {
  direction: ltr;
  color: #FFFFFF;
  font-family: var(--font);
  font-size: 44px;
  font-weight: 900;
  letter-spacing: 0;
  opacity: 0;
  transform: translateY(8px);
  animation:
    rise-in 450ms ease 1500ms forwards,
    word-slim 1000ms cubic-bezier(.65, 0, .35, 1) 1850ms forwards;
}
.splash-tag {
  color: rgba(255, 255, 255, .85);
  font-family: var(--font);
  font-size: 16px;
  font-weight: 500;
  opacity: 0;
  transform: translateY(6px);
  animation: rise-in 500ms ease 1800ms forwards;
}
@keyframes figs-in { to { opacity: 1; } }
@keyframes ring-draw { to { stroke-dashoffset: 0; } }
@keyframes rise-in { to { opacity: 1; transform: translateY(0); } }
@keyframes word-slim { from { font-weight: 900; letter-spacing: 0; } to { font-weight: 300; letter-spacing: 3px; } }
@keyframes splash-out { to { opacity: 0; visibility: hidden; } }

/* שם המותג במסך הפתיחה: זהב ורוד שמתמזג לפנינה */
.splash-word, .splash-word .wm-b {
  background: linear-gradient(90deg, #FFFFFF 0%, #FFE0EA 25%, #FFC2D4 45%, #E6F5FF 70%, #B5E0FF 100%);
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent; color: transparent;
}

/* "הסר אנימציות" בטלפון: המסך מוצג במלואו ובאותו אורך, רק בלי סיבוב ונשימה מתמשכים */
@media (prefers-reduced-motion: reduce) {
  .fig3d { animation: figs-in 450ms ease 50ms forwards; }
  .fig3d.man { animation-delay: 170ms; }
  .fig-svg { animation: none; }
}

/* שילוב צבעים: לכל אזור באפליקציה צבע משלו */
.wordmark .wm-b { color: var(--coral); }
.stats .accent { color: var(--green); }
.progress-fill { background: var(--green); }
.card.progress-card { border-top: 5px solid var(--green); }
.reminder { background: var(--sky-soft); }
.reminder h2 { color: var(--sky); }
.reminder .btn.outline { border-color: var(--sky); color: var(--sky); }
.backup-nudge { border-color: var(--sky); }
.backup-nudge strong { color: var(--sky); }
.note { border-inline-start: 5px solid var(--coral); }
.next-shot { background: var(--blend-deep); box-shadow: 0 10px 24px -14px rgba(138, 95, 214, .7); }
.choice.suggested span::after { color: var(--coral); }

/* התאמה לגילאי 40–60: טקסט גדול יותר, כפתורים גדולים, ניגודיות חזקה */
h1 { font-size: 30px; }
h2 { font-size: 19px; }
.small-text { font-size: 16px; }
.field { font-size: 17px; }
.field input, .field select { height: 56px; font-size: 19px; }
.choice span { height: 56px; font-size: 18px; }
.btn { min-height: 56px; font-size: 18px; }
.btn.primary { min-height: 60px; font-size: 19px; }
.btn.small { min-height: 48px; font-size: 16px; }
.stats dt { font-size: 15px; }
.stats dd { font-size: 27px; }
.label-light { font-size: 17px; }
.note { font-size: 17px; }
.last-shot { font-size: 16px; }
.toast { font-size: 17px; padding: 16px 18px; }
.shot-list .when strong { font-size: 18px; }
.shot-list .when span, .shot-list .site { font-size: 16px; }
.history li { font-size: 17px; }
.link-btn { font-size: 16px; }
.backup-nudge { font-size: 17px; }
.backup-nudge span { font-size: 16px; }

/* אפשרות "טקסט גדול" בהגדרות */
html.text-large #app { zoom: 1.15; }
.segmented { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }

/* שקילה וגרף (S5, S6) */
.btn.green { background: var(--green); color: #FFFFFF; text-decoration: none; }
.btn.big { min-height: 62px; font-size: 20px; }
.stepper { display: grid; grid-template-columns: 68px minmax(0, 1fr) 68px; gap: 10px; align-items: center; }
.step-btn {
  height: 72px; border-radius: 20px; border: 2px solid var(--line); background: var(--surface);
  font: inherit; font-size: 38px; font-weight: 700; color: var(--ink); cursor: pointer;
}
.step-btn:active { background: var(--green-soft); border-color: var(--green); }
.step-btn:focus-visible { outline: 3px solid var(--green); outline-offset: 2px; }
.weight-input { display: flex; flex-direction: column; align-items: center; gap: 0; min-width: 0; }
.weight-input input {
  width: 100%; border: 0; padding: 0; background: transparent; text-align: center;
  font: inherit; font-size: 44px; font-weight: 800; color: var(--ink); direction: ltr; line-height: 1.1;
  -moz-appearance: textfield;
}
.weight-input input::-webkit-outer-spin-button, .weight-input input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.weight-input input:focus-visible { outline: 3px solid var(--green); outline-offset: 4px; border-radius: 12px; }
.weight-input span { font-size: 17px; color: var(--muted); }
.lost-badge { background: var(--green-soft); color: var(--green); font-weight: 800; border-radius: 999px; padding: 4px 12px; font-size: 16px; }
.chart svg { display: block; width: 100%; height: auto; direction: ltr; }
.pace { background: var(--green-soft); color: #0A5A40; border-radius: 16px; padding: 14px 16px; font-size: 17px; }
.history li button { background: none; border: 0; color: var(--muted); font: inherit; font-size: 15px; text-decoration: underline; min-height: 44px; cursor: pointer; }

/* משוב על שינוי במשקל */
.feedback {
  display: flex; gap: 14px; align-items: flex-start;
  border-radius: 20px; padding: 16px 18px; font-size: 17px; line-height: 1.45;
}
.feedback strong { font-size: 19px; }
.feedback.down { background: var(--green-soft); color: #0A5A40; border: 2px solid #9ED9C1; }
.feedback.up { background: #FFF1E6; color: #8A3A0C; border: 2px solid #F7C39E; }
.feedback.same { background: var(--sky-soft); color: #134C8F; border: 2px solid #B8D3F3; }
.feedback-icon { flex-shrink: 0; width: 44px; height: 44px; border-radius: 50%; display: grid; place-items: center; }
.feedback.down .feedback-icon { background: var(--green); }
.feedback.up .feedback-icon { background: #E07A2E; }
.feedback.same .feedback-icon { background: var(--sky); }
.feedback-icon svg { width: 24px; height: 24px; }
.feedback.celebrate { animation: fb-pop 600ms cubic-bezier(.34, 1.56, .64, 1); position: relative; overflow: visible; }
.feedback.celebrate .feedback-icon { animation: fb-spin 700ms ease; }
@keyframes fb-pop { 0% { transform: scale(.9); opacity: 0; } 100% { transform: scale(1); opacity: 1; } }
@keyframes fb-spin { 0% { transform: scale(.4) rotate(-90deg); } 70% { transform: scale(1.15) rotate(10deg); } 100% { transform: scale(1) rotate(0); } }
.spark { position: absolute; width: 8px; height: 8px; border-radius: 50%; pointer-events: none; animation: spark 900ms ease-out forwards; }
@keyframes spark { 0% { transform: translate(0, 0) scale(1); opacity: 1; } 100% { transform: translate(var(--dx), var(--dy)) scale(.3); opacity: 0; } }
.feedback.warn-in { animation: fb-pop 450ms ease; }
@media (prefers-reduced-motion: reduce) {
  .feedback.celebrate, .feedback.celebrate .feedback-icon, .feedback.warn-in, .spark { animation: none; }
  .spark { display: none; }
}

/* אזהרה בצבע לפי מגדר */
.feedback.up.g-female { background: linear-gradient(115deg, #FDE3E7, #F7C4C8 60%, #F2B8BE); color: #5E2531; border-color: #EDA8AE; }
.feedback.up.g-female .feedback-icon { background: linear-gradient(135deg, #C46F7B, #A8525E); }
.feedback.up.g-male { background: linear-gradient(115deg, #EAF7FE, #A9D8F0 60%, #7DC0E8); color: #0F2E4A; border-color: #7DC0E8; }
.feedback.up.g-male .feedback-icon { background: linear-gradient(135deg, #4FA3DA, #1F6FAE); }

/* ערכת צבעים לפי מגדר: אישה = זהב ורוד, גבר = פנינה */
html.theme-female {
  --accent: #C23A5A;          /* זהב ורוד חי ועמוק לטקסט ומסגרות */
  --accent-deep: #7A1A33;
  --accent-soft: #FDE2E8;
  --blend-deep: linear-gradient(120deg, #EC5F7C 0%, #D9405F 50%, #B42A4C 100%);
}
/* הכרטיס הראשי בזהב ורוד בהיר ומבריק, לפי דוגמת הצבע */
html.theme-female .next-shot::after,
html.theme-male .next-shot::after {
  content: ""; position: absolute; inset: 0; border-radius: inherit; pointer-events: none;
  background: linear-gradient(115deg, transparent 30%, rgba(255, 255, 255, .5) 45%, transparent 60%);
}
html.theme-female .feedback.up.g-female { background: linear-gradient(115deg, #FDE3E7, #F7C4C8 60%, #F2B8BE); color: #5E2531; border-color: #EDA8AE; }
html.theme-female .feedback.up.g-female .feedback-icon { background: linear-gradient(135deg, #C46F7B, #A8525E); }

html.theme-male {
  --accent: #0B6BD6;          /* כחול פנינה חי ועמוק לטקסט ומסגרות */
  --accent-deep: #0A3F80;
  --accent-soft: #E0EFFF;
  --blend-deep: linear-gradient(120deg, #3D9EF5 0%, #1A7FE8 50%, #0860CC 100%);
}
/* הכרטיס הראשי בכחול פנינה מבריק, לפי דוגמת הפנינים */
.version { text-align: center; }

.weigh-nudge {
  display: flex; flex-direction: column; gap: 2px;
  background: var(--green-soft); border: 2px solid var(--green);
  border-radius: 20px; padding: 14px 18px; color: var(--ink); text-decoration: none; font-size: 17px;
}
.weigh-nudge strong { color: var(--green); font-size: 18px; }
.weigh-nudge span { color: #1F4D3C; font-size: 16px; }

/* גרף משקל: אנימציה עדינה */
.wchart { overflow: visible; }
.chart-seg { stroke-dasharray: 1; stroke-dashoffset: 1; animation: seg-draw 520ms cubic-bezier(.65, 0, .35, 1) forwards; }
.chart-area { opacity: 0; animation: fade-in 700ms ease 250ms forwards; }
.chart-dot { opacity: 0; transform: scale(.3); animation: dot-pop 380ms cubic-bezier(.34, 1.56, .64, 1) forwards; }
.chart-halo { transform-box: fill-box; transform-origin: center; animation: halo 2.2s ease-in-out 1.2s infinite; }
.chart-bubble { opacity: 0; animation: bubble-in 420ms ease forwards; }
.goal-tag { opacity: 0; animation: fade-in 500ms ease 100ms forwards; }
@keyframes seg-draw { to { stroke-dashoffset: 0; } }
@keyframes fade-in { to { opacity: 1; } }
@keyframes dot-pop { to { opacity: 1; transform: scale(1); } }
@keyframes halo { 0%, 100% { transform: scale(1); opacity: .18; } 50% { transform: scale(1.5); opacity: .05; } }
@keyframes bubble-in { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: translateY(0); } }
@media (prefers-reduced-motion: reduce) {
  .chart-seg { animation: none; stroke-dashoffset: 0; }
  .chart-area, .chart-dot, .chart-bubble, .goal-tag { animation: none; opacity: 1; transform: none; }
  .chart-halo { animation: none; }
}

/* ---------- הרשמה ---------- */
.register-head { text-align: center; padding-top: 8px; }
.register-head .wordmark { font-size: 44px; margin: 0; }
.register-head h2 { margin: 4px 0 0; font-size: 26px; }
.register .field input[type="email"] { text-align: left; }
.register-note { text-align: center; }
.account .field input[type="email"] { text-align: left; }

/* ---------- שילוב צבעי הדמויות (לפני בחירת מגדר: הרשמה ומסך הטיפול) ---------- */
.btn.primary { background: var(--blend-deep); box-shadow: 0 10px 22px -14px rgba(45, 140, 240, .75); }
.toast { background: var(--blend-deep); }
html body {
  background: linear-gradient(170deg, #FFEAF1 0%, #F6EEFB 45%, #E6F3FF 100%) fixed;
}
html .wordmark,
html .wordmark .wm-b {
  background: linear-gradient(90deg, #E8336F 0%, #E0508A 28%, #8A5FD6 55%, #1E7FEA 80%, #0866D9 100%);
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent; color: transparent;
}
html .choice input:checked + span {
  border-color: transparent;
  background: linear-gradient(var(--accent-soft), var(--accent-soft)) padding-box, var(--blend-deep) border-box;
}
html .field input:focus-visible,
html .field select:focus-visible { outline-color: #6F6E9E; }

/* הכרטיס הראשי: זהב ורוד ופנינה כחולה מבריקים, לכולם */
.next-shot {
  position: relative; overflow: hidden;
  background: linear-gradient(115deg,
    #F57FA0 0%, #FFA9C0 14%, #FFE3EC 25%, #FFB8CD 37%,
    #D9C6F5 50%, #A8D9FF 62%, #E8F6FF 72%, #86C9FF 84%, #3D9EF2 100%);
  color: #1A1F3D;
  border: 1px solid rgba(255, 255, 255, .7);
  box-shadow: 0 16px 30px -14px rgba(232, 51, 111, .45), 0 10px 24px -16px rgba(30, 127, 234, .55);
}
.next-shot::after {
  content: ""; position: absolute; inset: 0; border-radius: inherit; pointer-events: none;
  background: linear-gradient(115deg, transparent 30%, rgba(255, 255, 255, .5) 45%, transparent 60%);
}
.next-shot .label-light { opacity: 1; color: #3B2554; font-weight: 600; }
.next-shot .btn.light { background: var(--blend-deep); color: #FFFFFF; }
.next-shot .last-shot { color: #241F45; }
.progress-fill { background: var(--blend-deep); }
.card.progress-card { border-top: 5px solid transparent; background: linear-gradient(#FFFFFF, #FFFFFF) padding-box, var(--blend-deep) border-box; }

/* ---------- אחרי בחירת מגדר: כל האפליקציה בצבע המגדר, חי וחד ---------- */
/* אישה: זהב ורוד */
html.theme-female body { background: linear-gradient(170deg, #FFF0F3 0%, #FFE6EC 100%) fixed; }
html.theme-female .next-shot {
  background: linear-gradient(115deg,
    #E8798B 0%, #F7A8B4 14%, #FFDCE2 26%, #F49AAA 40%,
    #FCC6CF 54%, #FFE6EA 64%, #F28C9E 80%, #E0607A 100%);
  color: #4A0F22;
  box-shadow: 0 16px 30px -14px rgba(217, 64, 95, .55);
}
html.theme-female .next-shot .label-light { color: #7A1A33; }
html.theme-female .next-shot .last-shot { color: #5C1428; }
html.theme-female .wordmark,
html.theme-female .wordmark .wm-b {
  background: linear-gradient(90deg, #B42A4C 0%, #E0506E 55%, #F28C9E 100%);
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent; color: transparent;
}

/* גבר: כחול פנינה */
html.theme-male body { background: linear-gradient(170deg, #EEF7FF 0%, #E0EFFF 100%) fixed; }
html.theme-male .next-shot {
  background: linear-gradient(115deg,
    #3D9EF2 0%, #86C9FF 16%, #E8F6FF 27%, #7CC2FF 39%,
    #4FAAF7 52%, #CDEAFF 64%, #6BB9FB 78%, #1E84E8 100%);
  color: #06264D;
  box-shadow: 0 16px 30px -14px rgba(26, 127, 232, .6);
}
html.theme-male .next-shot .label-light { color: #0A3F80; }
html.theme-male .next-shot .last-shot { color: #062B57; }
html.theme-male .wordmark,
html.theme-male .wordmark .wm-b {
  background: linear-gradient(90deg, #0860CC 0%, #1A7FE8 55%, #5DB3FA 100%);
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent; color: transparent;
}

/* ---------- בטיחות ותמיכה ---------- */
.safety-link {
  display: flex; gap: 14px; align-items: center;
  padding: 16px 18px; border-radius: 20px; text-decoration: none; color: var(--ink);
  background: #FFFFFF; border: 2px solid var(--accent-soft); font-size: 18px; line-height: 1.4;
}
.safety-ico { font-size: 30px; }
.emergency-bar {
  display: flex; flex-direction: column; gap: 2px; text-decoration: none;
  background: #C8102E; color: #FFFFFF; border-radius: 18px; padding: 14px 18px;
  box-shadow: 0 10px 20px -12px rgba(200, 16, 46, .8);
}
.emergency-bar strong { font-size: 22px; }
.emergency-bar span { font-size: 16px; opacity: .92; }
.symptoms { display: grid; gap: 8px; margin: 10px 0; }
.sym-group { margin: 10px 0 2px; font-weight: 800; font-size: 17px; color: var(--accent-deep); }
.sym { display: flex; gap: 12px; align-items: flex-start; padding: 12px 14px; border-radius: 14px;
  background: var(--accent-soft); font-size: 18px; line-height: 1.45; cursor: pointer; }
.sym input { width: 26px; height: 26px; flex: none; margin-top: 2px; accent-color: var(--accent); }
.sym:has(input:checked) { outline: 2px solid var(--accent); background: #FFFFFF; }
.advice { border-radius: 16px; padding: 16px; margin: 12px 0; display: grid; gap: 8px; }
.advice p { margin: 0; font-size: 18px; line-height: 1.5; }
.advice strong { font-size: 20px; }
.advice.urgent { background: #FDE7EA; border: 2px solid #C8102E; color: #6B0A19; }
.advice.doctor { background: #FFF4E0; border: 2px solid #E08A00; color: #5A3600; }
.advice.mood { background: #E8F5EE; border: 2px solid #0E8A62; color: #0B4A35; }
.btn.danger { background: #C8102E; color: #FFFFFF; }
.rules-list { margin: 8px 0 0; padding-inline-start: 24px; display: grid; gap: 10px; font-size: 18px; line-height: 1.5; }
.field textarea { width: 100%; font: inherit; font-size: 18px; padding: 12px 14px; border-radius: 14px;
  border: 2px solid #D9D6E6; background: #FFFFFF; resize: vertical; box-sizing: border-box; }
.field textarea:focus-visible { outline: 3px solid var(--accent); outline-offset: 1px; }

/* ---------- יומן אישי ---------- */
.moods { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 6px; }
.mood input, .chip input, .q-item input { position: absolute; opacity: 0; pointer-events: none; }
.mood span { display: flex; flex-direction: column; align-items: center; gap: 4px; padding: 10px 2px;
  border-radius: 16px; border: 2px solid transparent; background: var(--accent-soft); font-size: 14px;
  font-weight: 600; text-align: center; cursor: pointer; line-height: 1.2; }
.mood b { font-size: 32px; line-height: 1; }
.mood input:checked + span { border-color: var(--accent); background: #FFFFFF; box-shadow: 0 6px 14px -10px var(--accent); }
.mood input:focus-visible + span, .chip input:focus-visible + span { outline: 3px solid var(--accent); outline-offset: 2px; }
.chips { display: flex; flex-wrap: wrap; gap: 8px; }
.chip span { display: inline-block; padding: 10px 14px; border-radius: 999px; background: #FFFFFF;
  border: 2px solid #DAD6E8; font-size: 17px; cursor: pointer; }
.chip input:checked + span { background: var(--accent); border-color: var(--accent); color: #FFFFFF; }
.chip.none input:checked + span { background: #0E8A62; border-color: #0E8A62; }
.journal h3 { margin: 8px 0 0; font-size: 19px; }
.q-list, .entry-list { list-style: none; margin: 8px 0 0; padding: 0; display: grid; gap: 10px; }
.q-item { display: flex; gap: 12px; align-items: center; font-size: 18px; cursor: pointer; position: relative; }
.q-item span::before { content: ""; display: inline-block; width: 22px; height: 22px; border-radius: 6px;
  border: 2px solid var(--accent); margin-inline-end: 10px; vertical-align: -5px; }
.q-list li.done { opacity: .4; text-decoration: line-through; transition: opacity .4s; }
.entry-list li { display: flex; gap: 12px; align-items: flex-start; padding: 12px; border-radius: 14px; background: var(--accent-soft); }
.e-emoji { font-size: 30px; line-height: 1; }
.entry-list p { margin: 2px 0 0; }
.e-note { font-size: 17px; }
.journal-card .quick-moods { display: flex; justify-content: space-between; gap: 6px; margin: 6px 0; }
.quick-moods a { font-size: 36px; text-decoration: none; width: 56px; height: 56px; display: grid; place-items: center;
  border-radius: 50%; background: var(--accent-soft); border: 2px solid transparent; }
.quick-moods a.on { border-color: var(--accent); background: #FFFFFF; }
.small-link { font-size: 17px; font-weight: 700; color: var(--accent); }

/* ---------- מד הרגשה (במקום אימוג'י) ---------- */
.meter { --c1: #D93A4A; --c2: #F07B3F; --c3: #E8A82E; --c4: #5FB85A; --c5: #159A6E; }
.moods.meter { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 8px; align-items: end; }
.moods.meter .mood span {
  background: transparent; border: 0; padding: 6px 2px 4px; gap: 8px; justify-content: flex-end; min-height: 108px;
}
.meter .bar { display: block; width: 100%; max-width: 46px; border-radius: 10px 10px 6px 6px;
  background: var(--c); opacity: .28; transition: opacity .2s, transform .2s, box-shadow .2s; }
.meter .m1 { --c: var(--c1); } .meter .m2 { --c: var(--c2); } .meter .m3 { --c: var(--c3); }
.meter .m4 { --c: var(--c4); } .meter .m5 { --c: var(--c5); }
.meter .m1 .bar { height: 24px; } .meter .m2 .bar { height: 38px; } .meter .m3 .bar { height: 52px; }
.meter .m4 .bar { height: 66px; } .meter .m5 .bar { height: 80px; }
.meter em { font-style: normal; font-size: 15px; font-weight: 600; color: var(--muted, #6B6880); white-space: nowrap; }
.moods.meter .mood input:checked + span { box-shadow: none; background: transparent; }
.moods.meter .mood input:checked + span .bar { opacity: 1; transform: scaleY(1.06); box-shadow: 0 8px 16px -8px var(--c); }
.moods.meter .mood input:checked + span em { color: var(--c); font-weight: 800; }
.moods.meter:has(input:checked) .mood input:not(:checked) + span .bar { opacity: .18; }
.quick-moods.meter { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 8px; align-items: end; margin: 8px 0; }
.quick-moods.meter a { width: auto; height: auto; border-radius: 0; background: transparent; border: 0; font-size: inherit;
  display: flex; flex-direction: column; align-items: center; gap: 6px; text-decoration: none; }
.quick-moods.meter .m1 .bar { height: 18px; } .quick-moods.meter .m2 .bar { height: 28px; } .quick-moods.meter .m3 .bar { height: 38px; }
.quick-moods.meter .m4 .bar { height: 48px; } .quick-moods.meter .m5 .bar { height: 58px; }
.quick-moods.meter em { font-size: 13px; }
.quick-moods.meter a.on .bar { opacity: 1; box-shadow: 0 8px 16px -8px var(--c); }
.quick-moods.meter a.on em { color: var(--c); font-weight: 800; }
.quick-moods.meter:has(a.on) a:not(.on) .bar { opacity: .18; }
.mini-meter { display: inline-flex; align-items: flex-end; gap: 3px; height: 28px; padding-top: 2px; }
.mini-meter i { display: block; width: 6px; border-radius: 3px; background: #DAD7E5; }
.e-meter { flex: none; padding-top: 2px; }
.mood-trend { margin: 6px 0 4px; padding: 12px; border-radius: 16px; background: #FFFFFF; border: 1px solid #ECE9F4; }

/* ---------- סיכום תקופה ---------- */
.catchup-card { display: grid; gap: 6px; padding: 18px 20px; border-radius: 22px; text-decoration: none;
  background: linear-gradient(125deg, #D9F5E8 0%, #EEFBF4 55%, #FFFFFF 100%); border: 2px solid #3DBE8B;
  color: #0B5A3F; font-size: 17px; box-shadow: 0 12px 24px -16px rgba(21, 154, 110, .55); }
.catchup-card strong { font-size: 20px; line-height: 1.35; color: #064A33; }
.catchup-card span { font-weight: 600; color: #159A6E; }
.seg { display: grid; grid-auto-flow: column; grid-auto-columns: 1fr; gap: 6px; }
.seg input { position: absolute; opacity: 0; pointer-events: none; }
.seg span { display: block; text-align: center; padding: 10px 4px; border-radius: 12px; background: #FFFFFF;
  border: 2px solid #DAD6E8; font-size: 16px; font-weight: 600; cursor: pointer; }
.seg input:checked + span { background: var(--accent); border-color: var(--accent); color: #FFFFFF; }
.seg input:focus-visible + span { outline: 3px solid var(--accent); outline-offset: 2px; }
.missed-row { border: 0; margin: 0; padding: 12px; border-radius: 14px; background: var(--accent-soft); display: grid; gap: 8px; }
.missed-row legend { float: right; width: 100%; font-weight: 700; font-size: 18px; padding: 0; margin-bottom: 8px; }
.missed-list, .freq-list { display: grid; gap: 10px; }
.freq-row { display: grid; gap: 6px; padding: 10px 12px; border-radius: 14px; background: var(--accent-soft); }
.freq-row strong { font-size: 17px; }
.entry-list li.period { background: #FFFFFF; border: 2px dashed #D5D1E3; }

/* ---------- משפט מוטיבציה: בתוך כרטיס ההתקדמות, נקי ועדין ---------- */
.motivation { display: flex; gap: 10px; align-items: flex-start; margin: 4px 0 2px; padding: 12px 14px;
  border-radius: 14px; background: var(--accent-soft); color: var(--accent-deep); font-size: 17px; font-weight: 600; line-height: 1.45; }
.motivation::before { content: ""; flex: none; width: 8px; height: 8px; margin-top: 9px; border-radius: 50%; background: var(--accent); }
.first-hint { margin: 2px 0 0; font-size: 17px; line-height: 1.45; font-weight: 600; opacity: .9; }
.next-shot > * { position: relative; z-index: 1; }

/* ---------- 4 שלבים ---------- */
.stages-bar { display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; margin-top: 6px; }
.seg-s { height: 12px; border-radius: 6px; background: #E6E3EF; overflow: hidden; }
.seg-s i { display: block; height: 100%; width: 0; background: var(--blend-deep); border-radius: 6px; transition: width .6s ease; }
.seg-s.now { box-shadow: 0 0 0 2px var(--accent-soft), 0 0 0 3px var(--accent); }
.stage-line { display: flex; justify-content: space-between; align-items: center; gap: 10px; text-decoration: none; color: var(--ink); }
.stage-line strong { font-size: 18px; }
.stage-go { flex: none; font-weight: 700; color: var(--accent); font-size: 16px; }
.journey-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 14px; }
.stage-card { display: flex; gap: 14px; padding: 18px 16px; border-radius: 22px; background: #FFFFFF; border: 2px solid #ECE9F4; }
.stage-card.now { border-color: var(--accent); box-shadow: 0 14px 28px -18px var(--accent); }
.stage-card.next { opacity: .7; }
.stage-num { flex: none; width: 44px; height: 44px; border-radius: 50%; display: grid; place-items: center;
  font-size: 20px; font-weight: 800; background: #ECE9F4; color: #6B6880; }
.stage-card.now .stage-num { background: var(--blend-deep); color: #FFFFFF; }
.stage-card.done .stage-num { background: #159A6E; color: #FFFFFF; }
.stage-body { flex: 1; min-width: 0; }
.stage-body h2 { margin: 0; font-size: 20px; }
.stage-badge { font-size: 14px; font-weight: 700; padding: 4px 10px; border-radius: 999px; background: #ECE9F4; color: #6B6880; white-space: nowrap; }
.stage-card.now .stage-badge { background: var(--accent); color: #FFFFFF; }
.stage-card.done .stage-badge { background: #DDF3EA; color: #0B6B4C; }
.stage-range { margin: 4px 0 2px; font-weight: 700; font-size: 17px; direction: rtl; }
.stage-focus { margin: 0 0 8px; font-size: 16px; }
.stage-goals { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.goal { display: flex; gap: 10px; align-items: flex-start; font-size: 17px; line-height: 1.4; cursor: pointer; }
.goal input { width: 24px; height: 24px; flex: none; margin-top: 1px; accent-color: #159A6E; }
.goal input:checked + span { color: #0B6B4C; }
.journey-goal h2 { margin: 0 0 6px; }

.stage-expect { margin: 0 0 10px; font-size: 16px; line-height: 1.45; padding: 10px 12px; border-radius: 12px; background: var(--accent-soft); }
.stage-card.next .stage-expect { background: #F4F3F8; }
.journey-src { margin: 14px 4px 0; }

.field .hint { display: block; font-size: 15px; font-weight: 400; color: var(--muted, #6B6880); margin-top: 2px; }

.goal-auto { cursor: default; align-items: center; }
.goal-mark { flex: none; width: 24px; height: 24px; border-radius: 50%; border: 2px dashed #C9C4DA; display: grid; place-items: center;
  font-size: 14px; font-weight: 800; color: #FFFFFF; }
.goal-auto.done .goal-mark { background: #159A6E; border: 2px solid #159A6E; }
.goal-text { flex: 1; }
.goal-auto.done .goal-text { color: #0B6B4C; }
.goal-count { flex: none; font-size: 14px; font-weight: 700; padding: 3px 10px; border-radius: 999px; background: var(--accent-soft); color: var(--accent-deep); white-space: nowrap; }
.goal-auto.done .goal-count { background: #DDF3EA; color: #0B6B4C; }

/* בדיקת סבירות למשקל */
.weight-check { display: grid; gap: 10px; padding: 16px; border-radius: 18px; background: #FFF7E6; border: 2px solid #F2B33D; color: #4A2E00; }
.weight-check strong { font-size: 20px; }
.weight-check p { margin: 0; font-size: 18px; line-height: 1.5; }
.row-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }

/* אייקונים בקו דק (במקום אימוג'י) */
.safety-ico { width: 34px; height: 34px; flex: none; color: var(--accent); }
.ico-inline { width: 22px; height: 22px; flex: none; }
.ico-title { display: inline-flex; align-items: center; gap: 8px; }
.ico-line { display: flex; align-items: center; gap: 8px; }
.weight-check .ico-inline { color: #B07A10; }
.journey-goal .ico-inline { color: var(--accent); width: 26px; height: 26px; }

.no-splash #splash { display: none !important; }

/* מידע משפטי והסכמה */
.consent { display: flex; gap: 12px; align-items: flex-start; font-size: 16px; line-height: 1.5; padding: 12px 14px;
  border-radius: 14px; background: #FFFFFF; border: 2px solid #E3E0EC; }
.consent input { width: 24px; height: 24px; flex: none; margin-top: 2px; accent-color: var(--accent); }
.consent a { color: var(--accent); font-weight: 700; }
.legal-doc summary { cursor: pointer; list-style: none; display: flex; justify-content: space-between; align-items: center; }
.legal-doc summary::-webkit-details-marker { display: none; }
.legal-doc summary::after { content: "+"; font-size: 26px; font-weight: 700; color: var(--accent); }
.legal-doc[open] summary::after { content: "−"; }
.legal-doc summary h2 { margin: 0; }
.legal-body h3 { margin: 16px 0 4px; font-size: 18px; }
.legal-body p { margin: 0 0 8px; font-size: 17px; line-height: 1.6; }

/* היסטוריית עדכונים */
.act-filter { margin: 4px 0 6px; }
.act-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.act-day { margin: 14px 2px 2px; font-weight: 800; font-size: 16px; color: var(--accent-deep); }
.act-item { display: flex; gap: 12px; align-items: flex-start; padding: 12px 14px; border-radius: 16px; background: #FFFFFF; border: 1px solid #ECE9F4; }
.act-item strong { font-size: 17px; }
.act-item p { margin: 2px 0 0; }
.act-ico { flex: none; width: 38px; height: 38px; border-radius: 12px; display: grid; place-items: center; background: var(--accent-soft); color: var(--accent); }
.act-weight .act-ico { background: #E2F4EC; color: #159A6E; }
.act-weight.up .act-ico { background: #FFF1E3; color: #C46A12; }
.act-journal .act-ico, .act-question .act-ico { background: #F1ECFB; color: #6F55C8; }
.act-dose .act-ico { background: #FFF6DB; color: #A07800; }

/* ---------- סרגל ניווט תחתון ---------- */
.tabbar { position: fixed; inset-inline: 0; bottom: 0; z-index: 50; display: grid; grid-template-columns: repeat(4, 1fr);
  padding: 6px 8px calc(env(safe-area-inset-bottom) + 6px); background: rgba(255, 255, 255, .94);
  backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); border-top: 1px solid #E6E3EF;
  box-shadow: 0 -8px 24px -18px rgba(30, 20, 80, .35); }
.tab { display: flex; flex-direction: column; align-items: center; gap: 3px; padding: 6px 2px; border-radius: 14px;
  text-decoration: none; color: #6B6880; font-size: 14px; font-weight: 700; min-height: 56px; justify-content: center; }
.tab svg { transition: transform .2s; }
.tab.on { color: var(--accent); background: var(--accent-soft); }
.tab.on svg { transform: translateY(-1px) scale(1.06); }
.tab:focus-visible { outline: 3px solid var(--accent); outline-offset: 2px; }
body.has-tabbar .screen { padding-bottom: calc(env(safe-area-inset-bottom) + 96px); }
body.has-tabbar .toast { bottom: calc(env(safe-area-inset-bottom) + 88px); }

.quick-links { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.quick-links .safety-link { padding: 14px 12px; gap: 10px; font-size: 16px; line-height: 1.3; }
.quick-links .safety-ico { width: 28px; height: 28px; }

.reg-restore { display: grid; gap: 8px; margin-top: 8px; padding-top: 16px; border-top: 1px solid #E6E3EF; text-align: center; }
.reg-restore p { margin: 0; }

/* רישום מהיר ותובנות */
.quick-moods.meter button { background: transparent; border: 0; padding: 0; font: inherit; cursor: pointer;
  display: flex; flex-direction: column; align-items: center; gap: 6px; }
.quick-moods.meter button.on .bar { opacity: 1; box-shadow: 0 8px 16px -8px var(--c); }
.quick-moods.meter button.on em { color: var(--c); font-weight: 800; }
.quick-moods.meter:has(button.on) button:not(.on) .bar { opacity: .18; }
.quick-moods.meter button:focus-visible { outline: 3px solid var(--accent); outline-offset: 2px; border-radius: 10px; }
.quick-follow { display: grid; gap: 8px; padding: 12px; border-radius: 16px; background: var(--accent-soft); }
.qf-title { margin: 0; font-weight: 700; font-size: 17px; }
.qchips { display: flex; flex-wrap: wrap; gap: 8px; }
.qchip { font: inherit; font-size: 16px; padding: 8px 14px; border-radius: 999px; border: 2px solid #DAD6E8; background: #FFFFFF; cursor: pointer; }
.qchip.on { background: var(--accent); border-color: var(--accent); color: #FFFFFF; }
.qchip.none.on { background: #159A6E; border-color: #159A6E; }
.insight { margin: 0; padding: 12px 14px; border-radius: 14px; background: #E8F6EF; color: #0B5A3F; font-weight: 600; font-size: 17px; line-height: 1.45; }
.streak-pill { font-size: 14px; font-weight: 800; padding: 5px 12px; border-radius: 999px; background: #FFF4DE; color: #8A5A00; white-space: nowrap; }

/* טיפים מיידיים */
.effect-tip, .journal-tips { display: grid; gap: 8px; }
.tip-item { padding: 12px 14px; border-radius: 14px; background: #FFFFFF; border: 1px solid #E3E0EC; display: grid; gap: 4px; }
.tip-item strong { font-size: 17px; color: var(--accent-deep); }
.tip-item p { margin: 0; font-size: 16px; line-height: 1.5; }
.tip-item .tip-doc { color: #5A3600; }
.tip-item.urgent { border: 2px solid #E08A00; background: #FFF8EC; }
/* שיעור השבוע */
.lesson-card { display: grid; gap: 4px; text-decoration: none; color: var(--ink); border: 2px solid var(--accent-soft); }
.lesson-kicker { font-size: 14px; font-weight: 800; color: var(--accent); }
.lesson-card strong { font-size: 20px; }
.lesson-go { font-weight: 700; color: var(--accent); margin-top: 4px; }
.lesson-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.lesson { background: #FFFFFF; border-radius: 18px; border: 1px solid #ECE9F4; }
.lesson.locked { opacity: .55; }
.lesson-head { display: flex; gap: 12px; align-items: center; padding: 14px 16px; cursor: pointer; list-style: none; }
.lesson-head::-webkit-details-marker { display: none; }
.lesson-head div { display: grid; gap: 2px; }
.lesson-head strong { font-size: 18px; }
.lesson-num { flex: none; width: 36px; height: 36px; border-radius: 50%; display: grid; place-items: center; font-weight: 800; background: var(--accent-soft); color: var(--accent); }
.lesson.read .lesson-num { background: #159A6E; color: #FFFFFF; }
.lesson-body { padding: 0 16px 16px; display: grid; gap: 10px; }
.lesson-lead { margin: 0; font-weight: 700; font-size: 18px; line-height: 1.5; }
.lesson-body ul { margin: 0; padding-inline-start: 20px; display: grid; gap: 8px; font-size: 17px; line-height: 1.55; }

/* ---------- מסך משקל ---------- */
.page-head h1 { margin: 0; }
.page-head p { margin: 2px 0 0; }
.weight-hero { background: var(--blend-deep); color: #FFFFFF; border: 0; box-shadow: 0 16px 30px -18px var(--accent); }
.wh-stats { display: grid; grid-template-columns: 1fr 1.3fr 1fr; align-items: end; text-align: center; gap: 6px; }
.wh-stats span { display: block; font-size: 15px; opacity: .85; }
.wh-stats strong { font-size: 24px; font-weight: 800; }
.wh-now strong { font-size: 44px; line-height: 1.05; }
.wh-bar { height: 10px; border-radius: 6px; background: rgba(255, 255, 255, .28); overflow: hidden; margin-top: 12px; }
.wh-bar i { display: block; height: 100%; width: 0; background: #FFFFFF; border-radius: 6px; transition: width .8s ease; }
.wh-foot { display: flex; justify-content: space-between; font-size: 15px; font-weight: 700; margin-top: 6px; opacity: .95; }
.weigh-card .stepper { margin: 6px 0 2px; }
.weigh-card .step-btn { background: var(--accent-soft); border-color: transparent; color: var(--accent-deep); border-radius: 50%; }
.weigh-tip { text-align: center; margin: 0; }
.chart-range { grid-auto-columns: auto; gap: 4px; }
.chart-range span { padding: 6px 10px; font-size: 14px; }
.chart-card .chart { margin-top: 8px; position: relative; }
.chart-hint { text-align: center; margin: 4px 0 0; }
.chart-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(90px, 1fr)); gap: 8px; margin-top: 6px; }
.cstat { background: var(--accent-soft); border-radius: 14px; padding: 10px 8px; text-align: center; }
.cstat span { display: block; font-size: 13px; color: #6B6880; }
.cstat strong { font-size: 19px; color: var(--accent-deep); }
.cstat.good strong { color: #0E8A62; }
.cstat.up strong { color: #C46A12; }
.chart-up { animation: fadeIn .5s ease 1.2s both; }
@keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }

/* ---------- אבני דרך (v64) ---------- */
.ms { position: relative; height: 66px; margin: 26px 24px 0; }
.ms-track { position: absolute; top: 9px; right: 0; left: 0; height: 8px; border-radius: 5px; background: rgba(255, 255, 255, .28); }
.ms-fill { position: absolute; top: 0; right: 0; bottom: 0; width: 0; background: #FFFFFF; border-radius: 5px; transition: width .9s ease; }
.ms-nodes { position: absolute; inset: 0; }
.ms-node { position: absolute; top: 0; transform: translateX(50%); display: flex; flex-direction: column; align-items: center; gap: 6px; }
.ms-node i { width: 26px; height: 26px; border-radius: 50%; box-sizing: border-box; border: 2.5px solid #FFFFFF; background: rgba(255, 255, 255, .22); display: grid; place-items: center; }
.ms-node.done i { background: #FFFFFF; }
.ms-node.start i { width: 16px; height: 16px; margin-top: 5px; }
.ms-node.goal i { width: 30px; height: 30px; margin-top: -2px; }
.ms-node svg { width: 14px; height: 14px; fill: none; stroke: var(--accent); stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.ms-node span { font-size: 14px; font-weight: 700; white-space: nowrap; opacity: .95; }
.ms-here { position: absolute; top: -26px; transform: translateX(50%); display: flex; flex-direction: column; align-items: center; pointer-events: none; }
.ms-here b { font-size: 13px; font-weight: 800; background: #FFFFFF; color: var(--accent); border-radius: 10px; padding: 1px 8px; white-space: nowrap; }
.ms-here i { width: 18px; height: 18px; margin-top: 4px; border-radius: 50%; background: #FFFFFF; border: 4px solid var(--accent); box-shadow: 0 0 0 3px rgba(255, 255, 255, .5); }
.ms-next { margin: 4px 0 0; font-size: 15px; font-weight: 600; opacity: .95; }

/* ---------- גרף המגמה החדש (v65): כרטיס כהה, קו זוהר, צפי ליעד, מגע ---------- */
:root { --chart-bg: linear-gradient(165deg, #241A47 0%, #3B1F5E 100%); --chart-l1: #FF8FB8; --chart-l2: #9CCBFF; --chart-acc: #FF8FB8; }
html.theme-male { --chart-bg: linear-gradient(165deg, #0A1A38 0%, #0B3A7A 100%); --chart-l1: #4FB2FF; --chart-l2: #D6EEFF; --chart-acc: #7CC8FF; }
html.theme-female { --chart-bg: linear-gradient(165deg, #33091A 0%, #7A1E3F 100%); --chart-l1: #FF7FA6; --chart-l2: #FFD9E4; --chart-acc: #FF9DBA; }
.chart-card { background: var(--chart-bg); color: #FFFFFF; border: 0; box-shadow: 0 18px 34px -20px rgba(10, 20, 50, .7); }
.chart-card h2 { color: #FFFFFF; }
.cc-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 10px; }
.cc-sub { margin: 2px 0 0; font-size: 15px; color: rgba(255, 255, 255, .7); }
.cc-big { font-size: 34px; font-weight: 800; line-height: 1; letter-spacing: -.5px; white-space: nowrap; }
.cc-big.down { color: var(--chart-acc); }
.chart-card .chart-range { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; margin-top: 14px; background: rgba(255, 255, 255, .1); border-radius: 14px; padding: 4px; }
.chart-card .chart-range label { margin: 0; }
.chart-card .chart-range span { display: block; text-align: center; border: 0; background: transparent; color: rgba(255, 255, 255, .75); border-radius: 10px; padding: 8px 4px; font-size: 15px; font-weight: 700; }
.chart-card .chart-range input:checked + span { background: #FFFFFF; color: #14213A; box-shadow: 0 2px 8px rgba(0, 0, 0, .2); }
.chart-card .chart { margin: 10px -6px 0; }
.wchart { touch-action: pan-y; cursor: crosshair; -webkit-user-select: none; user-select: none; }
.chart-pt { opacity: 0; animation: fade-in 400ms ease 500ms forwards; }
.chart-proj { opacity: 0; animation: fade-in 600ms ease 750ms forwards; }
.chart-cursor { opacity: 0; animation: fade-in 400ms ease 600ms forwards; }
.chart-cursor line { opacity: 0; transition: opacity .2s; }
.wchart.scrubbing .chart-cursor line { opacity: 1; }
.cc-hint { margin: 2px 0 0; text-align: center; font-size: 13px; color: rgba(255, 255, 255, .55); }
.cc-chips { display: grid; grid-template-columns: repeat(auto-fit, minmax(90px, 1fr)); gap: 8px; margin-top: 12px; }
.cc-chip { background: rgba(255, 255, 255, .1); border-radius: 14px; padding: 10px 8px; text-align: center; }
.cc-chip span { display: block; font-size: 13px; color: rgba(255, 255, 255, .7); }
.cc-chip strong { display: block; font-size: 18px; font-weight: 800; margin-top: 2px; }
.chart-card .pace { background: rgba(255, 255, 255, .1); color: rgba(255, 255, 255, .9); font-size: 15px; margin-top: 10px; }
.chart-card .chart-hint { color: rgba(255, 255, 255, .7); }
@media (prefers-reduced-motion: reduce) { .chart-pt, .chart-proj, .chart-cursor { animation: none; opacity: 1; } }

/* ---------- צבעים לפי מגדר בכל האפליקציה (v66): במקום ירוק ובמקום צבעי מצב רוח ---------- */
html.theme-male { --green: #0B6BD6; --green-soft: #E3F0FF; --green-ink: #0A3F80; --green-line: #A9CFF7;
  --c1: #B9D9F7; --c2: #8DC0F2; --c3: #5AA2EA; --c4: #2E84DE; --c5: #0B5FC0; }
html.theme-female { --green: #C23A5A; --green-soft: #FCE6EC; --green-ink: #7A1E3A; --green-line: #F2B3C3;
  --c1: #F8C9D5; --c2: #F2A1B6; --c3: #E57592; --c4: #D24E72; --c5: #A82A4E; }
html.theme-male .meter, html.theme-female .meter { --c1: inherit; }
html.theme-male .meter { --c1: #B9D9F7; --c2: #8DC0F2; --c3: #5AA2EA; --c4: #2E84DE; --c5: #0B5FC0; }
html.theme-female .meter { --c1: #F8C9D5; --c2: #F2A1B6; --c3: #E57592; --c4: #D24E72; --c5: #A82A4E; }
html.theme-male .pace, html.theme-female .pace { color: var(--green-ink); }
html.theme-male .chart-card .pace, html.theme-female .chart-card .pace { color: rgba(255, 255, 255, .9); }
html.theme-male .feedback.down, html.theme-female .feedback.down { color: var(--green-ink); border-color: var(--green-line); }
html.theme-male .advice.mood, html.theme-female .advice.mood { background: var(--green-soft); border-color: var(--green); color: var(--green-ink); }
html.theme-male .chip.none input:checked + span, html.theme-female .chip.none input:checked + span { background: var(--green); border-color: var(--green); }
html.theme-male .meter .bar, html.theme-female .meter .bar { opacity: .6; }
html.theme-male .meter:has(.on) .bar, html.theme-female .meter:has(.on) .bar { opacity: .18; }
html.theme-male .meter .on .bar, html.theme-female .meter .on .bar { opacity: 1; }

/* עמודות מצב רוח חדות ובולטות (v67) */
html.theme-male .meter { --c1: #8EC2F4; --c2: #5DA6EE; --c3: #2F88E3; --c4: #136DD3; --c5: #0A4FA6; }
html.theme-female .meter { --c1: #F4A3B9; --c2: #EC7896; --c3: #DE5178; --c4: #C6355F; --c5: #9C1F46; }
html.theme-male .meter .bar, html.theme-female .meter .bar { opacity: 1; box-shadow: 0 6px 14px -8px var(--c); }
html.theme-male .meter:has(.on) .bar, html.theme-female .meter:has(.on) .bar { opacity: .3; box-shadow: none; }
html.theme-male .meter .on .bar, html.theme-female .meter .on .bar { opacity: 1; transform: scale(1.08); box-shadow: 0 10px 20px -8px var(--c); outline: 3px solid #FFFFFF; outline-offset: -3px; }
html.theme-male .meter em, html.theme-female .meter em { color: var(--ink, #1B2B2A); font-weight: 600; }
html.theme-male .meter .on em, html.theme-female .meter .on em { color: var(--c); font-weight: 800; }

/* עמודות מצב רוח בסגנון כרטיס הטיפול הבא: הדרגה מבריקה (v68) */
html.theme-male .meter .bar, html.theme-female .meter .bar { position: relative; overflow: hidden; outline: 0; }
html.theme-male .meter .bar {
  background: linear-gradient(115deg, #3D9EF2 0%, #86C9FF 22%, #E8F6FF 38%, #7CC2FF 55%, #4FAAF7 75%, #1E84E8 100%);
  box-shadow: 0 8px 16px -10px rgba(26, 127, 232, .7); }
html.theme-female .meter .bar {
  background: linear-gradient(115deg, #E8798B 0%, #F7A8B4 22%, #FFDCE2 38%, #F49AAA 55%, #FCC6CF 75%, #E0607A 100%);
  box-shadow: 0 8px 16px -10px rgba(217, 64, 95, .65); }
html.theme-male .meter .bar::after, html.theme-female .meter .bar::after {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(115deg, transparent 30%, rgba(255, 255, 255, .55) 45%, transparent 60%); }
html.theme-male .meter:has(.on) .bar, html.theme-female .meter:has(.on) .bar { opacity: .35; box-shadow: none; }
html.theme-male .meter .on .bar, html.theme-female .meter .on .bar { opacity: 1; transform: scale(1.08); outline: 0; }
html.theme-male .meter .on .bar { box-shadow: 0 12px 22px -10px rgba(26, 127, 232, .8); }
html.theme-female .meter .on .bar { box-shadow: 0 12px 22px -10px rgba(217, 64, 95, .75); }
html.theme-male .meter .on em { color: #0B6BD6; }
html.theme-female .meter .on em { color: #C23A5A; }

/* עמודות מצב רוח: הדרגה מבריקה בגוונים שמתכהים מ'קשה מאוד' ל'טוב מאוד' (v69) */
html.theme-male .meter .m1 .bar { background: linear-gradient(115deg, #BFE1FF 0%, #E9F5FF 40%, #BFE1FF 62%, #9FD0FF 100%); }
html.theme-male .meter .m2 .bar { background: linear-gradient(115deg, #8CC8FF 0%, #D6ECFF 40%, #8CC8FF 62%, #6DB6FB 100%); }
html.theme-male .meter .m3 .bar { background: linear-gradient(115deg, #5AAEF7 0%, #BFE2FF 40%, #5AAEF7 62%, #3D98EE 100%); }
html.theme-male .meter .m4 .bar { background: linear-gradient(115deg, #2F8EEA 0%, #9FD2FF 40%, #2F8EEA 62%, #1774D8 100%); }
html.theme-male .meter .m5 .bar { background: linear-gradient(115deg, #0F6AD0 0%, #6FB6F5 40%, #0F6AD0 62%, #0A4FA6 100%); }
html.theme-female .meter .m1 .bar { background: linear-gradient(115deg, #FFD3DC 0%, #FFF0F3 40%, #FFD3DC 62%, #F9B9C6 100%); }
html.theme-female .meter .m2 .bar { background: linear-gradient(115deg, #F8AABB 0%, #FFE0E7 40%, #F8AABB 62%, #F28FA4 100%); }
html.theme-female .meter .m3 .bar { background: linear-gradient(115deg, #EE8098 0%, #FFCAD5 40%, #EE8098 62%, #E2647F 100%); }
html.theme-female .meter .m4 .bar { background: linear-gradient(115deg, #DC5674 0%, #F8A9BA 40%, #DC5674 62%, #C63A5C 100%); }
html.theme-female .meter .m5 .bar { background: linear-gradient(115deg, #BC3355 0%, #EC8AA0 40%, #BC3355 62%, #951F40 100%); }

/* הוראת נטילה לכדור והתראת פספוס (v70) */
.next-shot .pill-tip { font-size: 15px; font-weight: 600; background: rgba(255, 255, 255, .55); border-radius: 12px; padding: 8px 12px; margin: 8px 0 4px; line-height: 1.45; }
.missed-card { background: var(--green-soft, #FFF6E5); border: 2px solid var(--accent, #F2C46B); }
.missed-card h2 { color: var(--accent, #7A4B00); margin: 0 0 4px; }
.missed-card p { margin: 0 0 12px; font-size: 16px; line-height: 1.5; }

/* משוב (v71) */
.feedback-prompt { background: var(--green-soft, #EEF4FF); border: 2px solid var(--accent); }
.feedback-prompt h2 { margin: 0 0 4px; color: var(--accent); }
.feedback-prompt p { margin: 0 0 12px; font-size: 16px; }
.row-gap { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }
.fb-scale { display: grid; grid-template-columns: repeat(5, 1fr); gap: 8px; margin-top: 8px; direction: ltr; }
.fb-scale input { position: absolute; opacity: 0; pointer-events: none; }
.fb-scale span { display: grid; place-items: center; height: 56px; border-radius: 14px; font-size: 22px; font-weight: 800;
  background: #FFFFFF; border: 2px solid var(--border, #D9DEE8); color: var(--accent); transition: transform .15s; }
.fb-scale input:checked + span { background: var(--accent); border-color: var(--accent); color: #FFFFFF; transform: scale(1.06); }
.fb-scale input:focus-visible + span { outline: 3px solid var(--accent); outline-offset: 2px; }
.fb-scale-ends { display: flex; justify-content: space-between; flex-direction: row-reverse; font-size: 14px; color: var(--muted, #6B7280); margin-top: 6px; }
.consent-row { display: flex; gap: 12px; align-items: flex-start; }
.consent-row input { width: 24px; height: 24px; margin-top: 2px; accent-color: var(--accent); flex: none; }
.consent-row strong { display: block; }
.feedback-screen textarea { width: 100%; box-sizing: border-box; font: inherit; font-size: 17px; border-radius: 14px; border: 2px solid var(--border, #D9DEE8); padding: 12px; margin-top: 8px; }
.center { text-align: center; }
.card.consent-row { display: flex; flex-direction: row; gap: 12px; align-items: flex-start; }

/* הבהרה רפואית קבועה (v72) */
.med-note { display: flex; align-items: center; gap: 6px; margin: 10px 0 0; font-size: 14px; font-weight: 600; color: var(--muted, #5B6478); line-height: 1.45; }
.med-note svg { flex: none; color: var(--accent); }
.med-note.boxed { align-items: flex-start; background: var(--green-soft, #EEF4FF); border-radius: 14px; padding: 12px 14px; font-weight: 500; font-size: 15px; color: inherit; }
.med-note.boxed svg { margin-top: 3px; }
.med-note.boxed strong { color: var(--accent); }
.lesson-card .med-note { margin-top: 8px; }
