/* Калькуляторы Money Site ISR (RTL). Нейтральная палитра, без зависимости от опций темы. */
/* Направление письма задаёт атрибут dir на .msi-calc (he/ar — rtl, ru/en — ltr).
   Жёсткий direction:rtl здесь перекрывал его, и переводы рисовались справа налево. */
.msi-calc { --msi-accent: #1d4ed8; --msi-accent-2: #93c5fd; --msi-bg: #f8fafc; --msi-border: #e2e8f0; --msi-text: #0f172a; --msi-muted: #64748b;
  background: var(--msi-bg); border: 1px solid var(--msi-border); border-radius: 14px; padding: 22px; margin: 28px 0; color: var(--msi-text); font-family: var(--ms-font, 'Rubik', 'Heebo', 'Assistant', Arial, sans-serif); text-align: start; }
.msi-calc *, .msi-calc *::before, .msi-calc *::after { box-sizing: border-box; }
.msi-calc [hidden] { display: none !important; }
.msi-calc__mode { display: flex; gap: 18px; flex-wrap: wrap; margin-bottom: 16px; font-size: 15px; }
.msi-calc__mode label { display: flex; align-items: center; gap: 6px; cursor: pointer; min-height: 44px; }
/* Радио наследовали 15px от блока: аудит считает это полем ввода, с которого iOS зумит. */
.msi-calc__mode input { font-size: 16px; width: 18px; height: 18px; flex: none; }
.msi-calc__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 14px 18px; }
.msi-field label { display: block; font-size: 14px; color: var(--msi-muted); margin-bottom: 6px; }
.msi-input { display: flex; align-items: center; background: #fff; border: 1px solid var(--msi-border); border-radius: 10px; padding: 0 12px; height: 46px; }
.msi-input:focus-within { border-color: var(--msi-accent); box-shadow: 0 0 0 3px rgba(29, 78, 216, .15); }
.msi-input input { flex: 1; min-width: 0; border: 0; outline: 0; background: transparent; font: inherit; font-size: 18px; font-weight: 600; color: var(--msi-text); direction: ltr; text-align: end; padding: 0; height: 100%; }
/* Логический отступ, а не margin-right: в RTL это та же правая сторона, а в LTR (русская версия)
   единица переставала липнуть к числу — было «150 000₪» и «60месяцев». */
.msi-input span { color: var(--msi-muted); font-size: 14px; margin-inline-start: 8px; white-space: nowrap; }
.msi-field select { width: 100%; height: 46px; border: 1px solid var(--msi-border); border-radius: 10px; background: #fff; font: inherit; font-size: 16px; padding: 0 10px; color: var(--msi-text); }
/* Поле с ползунком (msi_calc_field_range + js/calc-slider.js): ползунок и ввод руками — одна пара.
   Высота дорожки 6 px, а сам range — 44 px: полоса под палец, при этом визуально это тонкая линия.
   font-size: аудит считает range полем ввода .msi-calc input, а с мелким шрифтом iOS зумит страницу. */
.msi-field--range .msi-range { -webkit-appearance: none; appearance: none; width: 100%; height: 44px; margin: 0; padding: 0; background: transparent; font-size: 16px; cursor: pointer; }
.msi-field--range .msi-range::-webkit-slider-runnable-track { height: 6px; border-radius: 999px; background: var(--msi-border); }
.msi-field--range .msi-range::-moz-range-track { height: 6px; border-radius: 999px; background: var(--msi-border); }
.msi-field--range .msi-range::-webkit-slider-thumb { -webkit-appearance: none; appearance: none; width: 24px; height: 24px; margin-top: -9px; border-radius: 50%; background: var(--msi-accent); border: 3px solid #fff; box-shadow: 0 1px 4px rgba(15, 23, 42, .3); }
.msi-field--range .msi-range::-moz-range-thumb { width: 24px; height: 24px; border-radius: 50%; background: var(--msi-accent); border: 3px solid #fff; box-shadow: 0 1px 4px rgba(15, 23, 42, .3); }
.msi-field--range .msi-range:focus-visible::-webkit-slider-thumb { box-shadow: 0 0 0 3px rgba(29, 78, 216, .35); }
.msi-chips { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 6px; }
/* 44 px по меньшей стороне: палец, а не курсор (хвост из PATTERN.md, закрыт 23.09.2026) */
.msi-chips button { display: inline-flex; align-items: center; min-height: 44px; border: 1px solid var(--msi-border); background: #fff; color: var(--msi-muted); border-radius: 999px; font: inherit; font-size: 13px; padding: 8px 14px; cursor: pointer; }
.msi-chips button:hover { border-color: var(--msi-accent); color: var(--msi-accent); }
/* На мыши 44 px избыточны и растягивают колонку: там, где есть точный указатель, чип ниже. */
@media (hover: hover) and (pointer: fine) { .msi-chips button { min-height: 36px; padding: 6px 12px; } }
.msi-calc__adv { margin-top: 14px; border-top: 1px dashed var(--msi-border); padding-top: 10px; }
.msi-calc__adv summary { cursor: pointer; color: var(--msi-accent); font-size: 14px; font-weight: 600; list-style: none; }
.msi-calc__adv summary::before { content: '+ '; }
.msi-calc__adv[open] summary::before { content: '– '; }
.msi-calc__adv .msi-calc__grid { margin-top: 12px; }
.msi-calc__results { margin-top: 22px; }
.msi-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 12px; }
.msi-card { background: #fff; border: 1px solid var(--msi-border); border-radius: 12px; padding: 14px 16px; }
.msi-card__label { display: block; font-size: 13px; color: var(--msi-muted); margin-bottom: 4px; }
.msi-card strong { font-size: 22px; font-weight: 700; display: inline-block; unicode-bidi: isolate; }
.msi-card--main { grid-column: 1 / -1; background: var(--msi-accent); border-color: var(--msi-accent); color: #fff; }
.msi-card--main .msi-card__label { color: rgba(255,255,255,.8); }
.msi-card--main strong { font-size: 34px; }
.msi-insights { list-style: none; padding: 0; margin: 16px 0 0; font-size: 15px; line-height: 1.6; }
.msi-insights li { padding: 6px 14px 6px 0; border-right: 3px solid var(--msi-accent-2); margin-bottom: 6px; }
.msi-chart { margin-top: 18px; background: #fff; border: 1px solid var(--msi-border); border-radius: 12px; padding: 12px; direction: ltr; }
.msi-chart canvas { display: block; width: 100%; }
.msi-legend { display: flex; gap: 16px; justify-content: flex-end; font-size: 13px; color: var(--msi-muted); margin-top: 6px; }
.msi-sw { display: inline-block; width: 12px; height: 12px; border-radius: 3px; margin-left: 5px; vertical-align: -1px; }
.msi-sw--dep { background: var(--msi-accent-2); } .msi-sw--profit { background: var(--msi-accent); }
.msi-actions { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 14px; }
.msi-actions button { border: 1px solid var(--msi-border); background: #fff; color: var(--msi-text); border-radius: 10px; font: inherit; font-size: 14px; padding: 10px 16px; min-height: 44px; cursor: pointer; }   /* 44 px — палец, а не курсор (interactive_audit) */
.msi-actions button:hover { border-color: var(--msi-accent); color: var(--msi-accent); }
.msi-table-wrap { overflow-x: auto; margin-top: 12px; }
.msi-table { width: 100%; border-collapse: collapse; font-size: 14px; background: #fff; }
.msi-table th, .msi-table td { padding: 8px 10px; border-bottom: 1px solid var(--msi-border); text-align: right; white-space: nowrap; }
.msi-table th { color: var(--msi-muted); font-weight: 600; background: var(--msi-bg); }
.msi-table td:not(:first-child) { text-align: right; unicode-bidi: isolate; }
.msi-note { font-size: 13px; color: var(--msi-muted); margin: 14px 0 0; line-height: 1.5; }
.msi-disclaimer { background: #fffbeb; border: 1px solid #fde68a; border-radius: 10px; padding: 12px 16px; font-size: 14px; line-height: 1.6; margin: 24px 0; }
@media (max-width: 600px) { .msi-calc { padding: 14px; border-radius: 10px; } .msi-card--main strong { font-size: 28px; } .msi-input input { font-size: 17px; } }
@media print { .msi-actions, .msi-chips, .msi-calc__mode { display: none; } .msi-calc { border: 0; background: #fff; } .msi-table-wrap[hidden] { display: block; } }

/* --- נדל"ן --- */
.msi-fs { border: 0; padding: 0; margin: 0 0 16px; min-width: 0; }
.msi-fs legend { font-weight: 700; font-size: 16px; color: var(--msi-text); padding: 0; margin-bottom: 10px; }
/* Чекбокс — тоже поле ввода: 16px, чтобы iOS не зумил, и строка в 44px под палец. */
.msi-check { display: flex; align-items: center; gap: 8px; min-height: 44px; font-size: 13px; color: var(--msi-muted); margin-top: 6px; cursor: pointer; }
.msi-check input { font-size: 16px; width: 18px; height: 18px; flex: none; }
.msi-card--neg strong { color: #b91c1c; }
.msi-card--main strong { color: #fff; }
.msi-bd-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 12px; margin-top: 16px; }
.msi-bd { background: #fff; border: 1px solid var(--msi-border); border-radius: 12px; padding: 12px 14px; }
.msi-bd h4 { margin: 0 0 8px; font-size: 14px; color: var(--msi-muted); font-weight: 600; }
.msi-bd ul { list-style: none; margin: 0; padding: 0; font-size: 14px; }
.msi-bd li { display: flex; justify-content: space-between; gap: 10px; padding: 4px 0; border-bottom: 1px dashed var(--msi-border); }
.msi-bd li:last-child { border-bottom: 0; }
.msi-bd li b { white-space: nowrap; font-weight: 600; }
.msi-bd__total { font-weight: 700; color: var(--msi-text); }

/* --- balloon / loan vs invest / pension fees --- */
.msi-row--hl td { background: #eff6ff; font-weight: 700; }
.msi-verdict { font-size: 17px; font-weight: 600; margin: 0 0 12px; padding: 12px 14px; background: #fff; border-right: 4px solid var(--msi-accent); border-radius: 8px; }
.msi-card--best { border-color: #16a34a; box-shadow: inset 0 0 0 1px #16a34a; }
.msi-card small { display: block; color: var(--msi-muted); font-size: 12px; margin-top: 4px; line-height: 1.4; }
.msi-cards--offers .msi-card strong { font-size: 24px; }
.msi-fs--offer { background: #fff; border: 1px solid var(--msi-border); border-radius: 12px; padding: 12px 14px; }
.msi-fs--offer legend { padding: 0 6px; }

/* --- kids: hours --- */
.msi-calc--kids { font-size: 17px; }
.msi-calc--kids .msi-field label { font-size: 16px; color: var(--msi-text); }
.msi-calc--kids .msi-card--main strong { font-size: 30px; }
.msi-bar { height: 14px; background: #e2e8f0; border-radius: 999px; margin-top: 14px; overflow: hidden; }
.msi-bar__fill { height: 100%; background: linear-gradient(90deg, #93c5fd, #1d4ed8); width: 0; transition: width .3s; }
.msi-bar__label { font-size: 13px; color: var(--msi-muted); margin-top: 4px; }
.msi-kids-ins { font-size: 17px; margin: 12px 0 0; line-height: 1.6; }

/* ---------- Таблица бюджета (10.09.2026) ---------- */
.msi-bd-sec { margin: 0 0 22px; }
.msi-bd-sec h3 { font-size: 17px; margin: 0 0 6px; display: flex; align-items: baseline; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.msi-bd-sum { font-size: 15px; color: var(--msi-accent); font-weight: 700; }
.msi-bd-table td { padding: 5px 8px; white-space: normal; }
.msi-bd-table td:first-child { width: 45%; }
.msi-bd-table .msi-input { margin: 0; }
.msi-bd-table .msi-input input { width: 100%; min-width: 90px; }
.msi-bd-name { width: 100%; border: 1px solid transparent; background: transparent; border-radius: 6px; font: inherit; font-size: 14px; padding: 5px 6px; color: inherit; }
.msi-bd-name:hover { border-color: var(--msi-border); }
.msi-bd-name:focus { border-color: var(--msi-accent); background: #fff; outline: none; }
.msi-bd-pct { color: var(--msi-muted); font-size: 13px; }
.msi-bd-del { border: 0; background: transparent; color: var(--msi-muted); font-size: 20px; line-height: 1; cursor: pointer; padding: 0 6px; border-radius: 6px; }
.msi-bd-del:hover { color: #C2412A; background: #FFF0EB; }
.msi-bd-add { margin-top: 8px; border: 1px dashed var(--msi-border); background: #fff; color: var(--msi-accent); border-radius: 999px; font: inherit; font-size: 13px; font-weight: 600; padding: 6px 14px; cursor: pointer; }
.msi-bd-add:hover { border-color: var(--msi-accent); }
@media (max-width: 640px) { .msi-bd-table td:first-child { width: auto; } .msi-bd-table th:nth-child(3), .msi-bd-table td:nth-child(3) { display: none; } }
@media print { .msi-bd-add, .msi-bd-del { display: none; } .msi-bd-name, .msi-input input { border: 0; } }

/* ---------- Урок «מלכודת הקיוסק» (10.09.2026) ---------- */
.msi-kiosk-q { font-weight: 700; font-size: 16px; margin: 0 0 10px; }
.msi-kiosk-items { display: grid; gap: 8px; margin-bottom: 16px; }
.msi-kiosk-items label { display: flex; align-items: center; gap: 10px; background: #fff; border: 1px solid var(--msi-border); border-radius: 12px; padding: 11px 14px; cursor: pointer; font-size: 16px; }
.msi-kiosk-items label:hover { border-color: var(--msi-accent); }
.msi-kiosk-items input { width: 20px; height: 20px; accent-color: var(--msi-accent); flex: 0 0 auto; }
.msi-kiosk-items b { margin-right: auto; color: var(--msi-accent); }
.msi-kiosk-days input[type=range] { width: 100%; accent-color: var(--msi-accent); height: 30px; }
.msi-kiosk-days label b { color: var(--msi-accent); font-size: 18px; }
.msi-kiosk-sub { font-weight: 700; margin: 16px 0 4px; }
.msi-kiosk-qa { margin-bottom: 16px; }
.msi-kiosk-qa button { display: block; width: 100%; text-align: right; background: #fff; border: 2px solid var(--msi-border); border-radius: 12px; padding: 11px 14px; margin-bottom: 7px; font: inherit; font-size: 15px; cursor: pointer; }
.msi-kiosk-qa button:hover { border-color: var(--msi-accent); }
.msi-kiosk-qa button.is-on { border-color: var(--msi-accent); background: #FFF8E1; font-weight: 700; }
.msi-light { display: flex; gap: 14px; align-items: flex-start; background: #fff; border: 1px solid var(--msi-border); border-radius: 14px; padding: 14px 16px; }
.msi-light__dot { width: 26px; height: 26px; border-radius: 50%; flex: 0 0 auto; margin-top: 3px; background: #ccc; }
.msi-light__dot.is-red { background: #D64545; } .msi-light__dot.is-yellow { background: #F5B301; } .msi-light__dot.is-green { background: #0E9F6E; }
.msi-light strong { display: block; font-size: 17px; margin-bottom: 4px; }
.msi-light p { margin: 0; font-size: 15px; line-height: 1.55; }
.msi-freeze-list { list-style: none; margin: 0 0 14px; padding: 0; display: grid; gap: 8px; }
.msi-freeze-item { display: flex; justify-content: space-between; gap: 12px; align-items: center; flex-wrap: wrap; background: #fff; border: 1px solid var(--msi-border); border-radius: 12px; padding: 11px 14px; }
.msi-freeze-item.is-ready { border-color: var(--msi-accent); background: #FFF8E1; }
.msi-freeze-price { color: var(--msi-accent); font-weight: 700; }
.msi-freeze-time { font-size: 13px; color: var(--msi-muted); margin-top: 3px; }
.msi-freeze-btns { display: flex; gap: 6px; }
.msi-freeze-btns button { border: 1px solid var(--msi-border); background: #fff; border-radius: 999px; font: inherit; font-size: 13px; padding: 6px 13px; cursor: pointer; }
.msi-freeze-btns button:hover { border-color: var(--msi-accent); color: var(--msi-accent); }
.msi-freeze-empty { color: var(--msi-muted); font-size: 15px; }

/* ---------- Урок 3: 4 קופסאות (11.09.2026) ---------- */
.msi-fb-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin: 16px 0; }
.msi-fb-card { position: relative; background: #fff; border: 1px solid var(--msi-border); border-right: 5px solid var(--msi-border); border-radius: 14px; padding: 14px 16px 13px; }
.msi-fb-card h4 { margin: 0 0 2px; font-size: 15px; font-weight: 700; }
.msi-fb-card strong { display: block; font-size: 26px; font-weight: 800; margin: 2px 0 6px; }
.msi-fb-card p { margin: 0; font-size: 13px; line-height: 1.45; color: var(--msi-muted); }
.msi-fb-card.is-zero { opacity: .55; }
.msi-fb-num { position: absolute; left: 12px; top: 12px; width: 24px; height: 24px; border-radius: 50%; background: var(--msi-bg); color: var(--msi-muted); font-size: 13px; font-weight: 800; display: grid; place-items: center; }
.msi-fb--daily { border-right-color: #F5B301; } .msi-fb--daily strong { color: #8F6400; }
.msi-fb--dream { border-right-color: #0B1F3A; } .msi-fb--dream strong { color: #0B1F3A; }
.msi-fb--future { border-right-color: #0E9F6E; } .msi-fb--future strong { color: #0E9F6E; }
.msi-fb--give { border-right-color: #FF7A59; } .msi-fb--give strong { color: #C2412A; }
.msi-fb-sliders { display: grid; gap: 12px; margin-top: 10px; }
.msi-fb-sliders label { display: block; font-size: 14px; font-weight: 600; }
.msi-fb-sliders label b { color: var(--msi-accent); margin-right: 6px; }
.msi-fb-sliders input[type=range] { width: 100%; accent-color: var(--msi-accent); height: 28px; }
.msi-fb-goal { background: var(--msi-bg); border: 1px dashed var(--msi-border); border-radius: 14px; padding: 14px 16px; margin-top: 16px; }
.msi-fb-goal h4 { margin: 0 0 10px; font-size: 15px; font-weight: 700; }
.msi-fb-out { margin: 10px 0 0; background: #fff; border-radius: 10px; padding: 11px 13px; font-size: 15px; line-height: 1.55; font-weight: 600; }
@media (max-width: 560px) { .msi-fb-grid { grid-template-columns: 1fr; } }
/* активная «фишка» выбора доходности (урок 5) */
.msi-chips button.is-on { border-color: var(--msi-accent); background: #FFF8E1; color: var(--msi-accent); font-weight: 700; }

/* --- מחשבון מימון רכב: подзаголовок внутри результата и блок «это оценка» ---
   ACCURACY.md: точный расчёт и оценка не должны стоять в одном ряду карточек. */
/* Подпись блока внутри результата: именно p, а не h4 — калькулятор стоит до первого h2 статьи,
   и заголовок четвёртого уровня ломал бы порядок разделов страницы (proofread_check). */
.msi-sub { margin: 22px 0 0; font-size: 15px; font-weight: 700; color: var(--msi-text); }
.msi-est { margin-top: 22px; background: #fff; border: 1px dashed var(--msi-border); border-radius: 12px; padding: 14px 16px; }
.msi-est .msi-sub { margin-top: 0; }
.msi-est .msi-card { background: var(--msi-bg); }
.msi-est__note { margin: 6px 0 12px; font-size: 14px; line-height: 1.6; color: var(--msi-muted); }
.msi-card--alert { background: #FEF2F2; border-color: #FCA5A5; }
.msi-card--alert .msi-card__label, .msi-card--alert strong { color: #B91C1C; }
.msi-insights li.is-warn { border-right-color: #F59E0B; }
.msi-sw--value { background: #16a34a; } .msi-sw--debt { background: #ef4444; }

/* Итог инвестиции в калькуляторе נדל"ן: широкий блок поверх остальных разбивок, внутри две колонки
   «вышло из кармана» и «вернулось», под ними — прибыль. И кнопка обнуления сопутствующих расходов. */
.msi-bd--wide { grid-column: 1 / -1; }
.msi-bd__cols { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 0 22px; }
.msi-bd__cols h5 { margin: 0 0 4px; font-size: 13px; font-weight: 600; color: var(--msi-muted); }
.msi-bd__bottom { list-style: none; margin: 10px 0 0; padding: 10px 0 0; border-top: 2px solid var(--msi-border); font-size: 14px; }
.msi-bd__bottom li { display: flex; justify-content: space-between; gap: 10px; padding: 4px 0; }
.msi-bd__bottom li b { white-space: nowrap; font-weight: 600; }
.msi-bd--neg b { color: #b91c1c; }
.msi-reset { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-top: 10px; }
.msi-reset button { border: 1px solid var(--msi-border); background: #fff; color: var(--msi-muted); border-radius: 999px; font: inherit; font-size: 13px; padding: 8px 14px; min-height: 44px; cursor: pointer; }
.msi-reset button:hover { border-color: var(--msi-accent); color: var(--msi-accent); }
.msi-reset span { font-size: 13px; color: var(--msi-muted); }
@media (hover: hover) and (pointer: fine) { .msi-reset button { min-height: 36px; } }
@media print { .msi-reset { display: none; } }