:root {
  --faq-p: #334155; --top-bg: rgba(255,255,255,.85); --hero-from: #fff; --badge-bg: #eef2ff; --badge-ink: #4338ca; --chip-bg: #f1f5f9; --tag-green-bg: #d1fae5; --tag-red-bg: #fee2e2;
  --ink: #0f172a; --muted: #64748b; --line: #e2e8f0;
  --bg: #f6f7fb; --card: #ffffff;
  --accent: #4f46e5; --accent-dark: #4338ca;
  --green: #059669; --green-bg: #ecfdf5;
  --red: #dc2626; --red-bg: #fef2f2;
  --r: 14px; --shadow: 0 1px 2px rgba(15,23,42,.05), 0 8px 24px -12px rgba(15,23,42,.12);
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; font: 17.5px/1.6 -apple-system, "Segoe UI", Roboto, "Helvetica Neue", sans-serif; color: var(--ink); background: var(--bg); }
.wrap { max-width: 1320px; margin: 0 auto; padding: 0 16px; }
.narrow { max-width: 980px; }
.center { text-align: center; }
section { margin: 28px auto; }

/* шапка */
.top { background: var(--top-bg); backdrop-filter: blur(8px); border-bottom: 1px solid var(--line); position: sticky; top: 0; z-index: 10; }
.nav { display: flex; justify-content: space-between; align-items: center; height: 54px; }
.logo { font-weight: 800; font-size: 1.05em; color: var(--ink); text-decoration: none; letter-spacing: -.01em; }
.logo span { color: var(--accent); }
.nav nav a { color: var(--muted); text-decoration: none; margin-left: 20px; font-size: .95em; }
.nav nav a:hover { color: var(--ink); }

/* hero */
.hero { background: linear-gradient(180deg, var(--hero-from) 0%, var(--bg) 100%); border-bottom: 1px solid var(--line); margin: 0 0 8px; padding: 36px 0 36px; text-align: center; }
.hero .calc-card { text-align: left; max-width: none; margin: 24px auto 0; }
.hero .badge { font-size: .9em; }
.badge { display: inline-block; background: var(--badge-bg); color: var(--badge-ink); font-size: .8em; font-weight: 600; padding: 4px 12px; border-radius: 999px; margin-bottom: 14px; }
h1 { font-size: clamp(1.7em, 3.6vw, 2.4em); line-height: 1.15; letter-spacing: -.025em; margin: 0 auto 8px; max-width: 24em; }
h1 em { font-style: normal; color: var(--accent); }
.sub { font-size: 1.08em; color: var(--muted); max-width: 40em; margin: 0 0 20px; }
h2 { font-size: 1.45em; letter-spacing: -.01em; margin: 0 0 8px; }
.muted { color: var(--muted); }

/* плитки цифр */
.stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 12px; margin: 20px 0 8px; }
.stat { background: var(--card); border: 1px solid var(--line); border-radius: var(--r); padding: 18px; box-shadow: var(--shadow); position: relative; }
.stat.good { border-color: #a7f3d0; background: var(--green-bg); }
.stat.bad { border-color: #fecaca; background: var(--red-bg); }
.stat-k { font-size: 1.7em; font-weight: 800; letter-spacing: -.02em; }
.stat.good .stat-k { color: var(--green); }
.stat.bad .stat-k { color: var(--red); }
.stat-t { color: var(--muted); font-size: .88em; line-height: 1.4; margin-top: 4px; }
.chip { position: absolute; top: 14px; right: 14px; font-size: .78em; font-weight: 700; background: var(--chip-bg); color: var(--muted); border-radius: 999px; padding: 2px 10px; }
.chip.green { background: var(--tag-green-bg); color: var(--green); }
.chip.red { background: var(--tag-red-bg); color: var(--red); }
.fine { color: var(--muted); font-size: .82em; }
.stat-how { margin-top: 8px; font-size: .8em; }
.stat-how summary { cursor: pointer; color: var(--muted); text-decoration: underline dotted; list-style: none; }
.stat-how summary::-webkit-details-marker { display: none; }
.stat-how p { margin: 6px 0 0; font-weight: 400; line-height: 1.5; color: var(--ink); white-space: pre-line; }

/* кнопки */
.btn { display: inline-block; background: var(--accent); color: #fff; text-decoration: none; padding: 10px 20px; border-radius: 10px; font-weight: 700; font-size: .97em; transition: background .15s; }
.btn:hover { background: var(--accent-dark); }
.btn.big { padding: 14px 28px; font-size: 1.05em; margin-top: 10px; }
.btn.ghost { background: transparent; color: var(--accent); border: 1.5px solid var(--accent); }
.btn.ghost:hover { background: #eef2ff; }

/* калькулятор */
.calc-card { background: var(--card); border: 1px solid var(--line); border-radius: var(--r); box-shadow: var(--shadow); padding: 20px; margin: 16px 0; }
.calc-controls { display: flex; gap: 14px; flex-wrap: wrap; margin-bottom: 6px; }
.calc-controls label { font-size: .85em; color: var(--muted); font-weight: 600; }
.calc-controls select { margin-top: 4px; padding: 9px 12px; font-size: 1em; border: 1.5px solid var(--line); border-radius: 10px; background: var(--card); color: var(--ink); min-width: 180px; }
.calc-controls select:focus { outline: none; border-color: var(--accent); }

/* строки результата */
.rows { margin-top: 10px; }
.row { display: grid; grid-template-columns: minmax(0, 1fr) 110px 110px 130px 110px 128px; gap: 6px 14px; align-items: start; padding: 14px 16px; border: 1px solid var(--line); border-radius: 12px; margin-bottom: 8px; background: var(--card); }
.row.otziv-card { grid-template-columns: minmax(0, 1fr) auto; }
.row .btn { align-self: center; }
.row > .tag { justify-self: start; }
.mob-select { display: none; }
@media (max-width: 700px) {
  .hero .badge { background: none; padding: 0; font-size: .72em; font-weight: 500; color: var(--muted); margin-bottom: 6px; }
  .hero .badge .dim { opacity: 1; }
  .pick .chips { display: none; }
  .pick .mob-select { display: block; width: 100%; box-sizing: border-box; padding: 12px 40px 12px 14px; font-size: 1em; font-weight: 600; border: 1.5px solid var(--line); border-radius: 12px; background-color: var(--card); color: var(--ink); appearance: none; -webkit-appearance: none; background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%2394a3b8' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 14px center; }
  .calc-card .pick { margin-bottom: 18px; }
  .calc-card .pick-label { margin-bottom: 8px; }
  .result-head { margin: 20px 0 12px; }
  .row { grid-template-columns: 1fr 1fr; grid-template-areas: "name name" "issue fee" "now year" "how how" "btn btn"; gap: 8px 10px; align-items: start; padding: 14px; }
  .tt::after { display: none; }
  .row .r-name { grid-area: name; }
  .rows .row .r-name small { display: inline; font-size: .76em; }
  .rows .row .r-name small:first-of-type::before { content: ""; display: block; margin-top: 2px; }
  .rows .row .r-name small + small::before { content: " · "; }
  .row .issue-cell { grid-area: issue; }
  .row .fee-cell { grid-area: fee; }
  .row .now-cell { grid-area: now; font-size: 1.2em; }
  .row .year-cell { grid-area: year; }
  .row .r-num { justify-self: start; text-align: left; }
  .row .fee-cell, .row .year-cell { justify-self: end; text-align: right; }
  .row .how-exp { grid-area: how; }
  .rows .row .btn { grid-area: btn; justify-self: stretch; text-align: center; box-sizing: border-box; }
  .row > .tag { grid-column: 1 / -1; justify-self: start; }
}
.row.best { border-color: var(--green); background: var(--green-bg); }
.row.worst { background: var(--red-bg); border-color: #fecaca; }
.row .r-name { flex: 1 1 200px; font-weight: 600; font-size: .95em; }
.row .r-name small { display: block; color: var(--muted); font-weight: 400; }
.row .r-name .src { font-size: .78em; margin-top: 2px; }
.row .r-name .warn { font-size: .78em; }
.row .r-num { font-size: 1.15em; font-weight: 400; white-space: nowrap; letter-spacing: -.01em; font-variant-numeric: tabular-nums; line-height: 1.2; text-align: right; justify-self: end; }
.row .r-num small { display: block; font-weight: 500; color: var(--muted); font-size: .62em; letter-spacing: 0; white-space: normal; }
.row .issue-cell, .row .fee-cell { color: var(--muted); }
.row .now-cell { font-size: 1.3em; font-weight: 800; }
.row .now-cell small { font-weight: 500; }
.row .year-cell { font-weight: 600; }
.row .how { font-size: .62em; letter-spacing: 0; font-weight: 400; }
.row .how, .how-exp .how-close, .how-exp .why-card { display: inline-block; margin-top: 4px; color: var(--muted); text-decoration: underline dotted; }
.how-exp .how-close, .how-exp .why-card { font-size: .78em; }
.how-exp .why-card { margin-right: 12px; }
.tt { border-bottom: 1px dotted var(--muted); cursor: help; position: relative; }
.tt::after { content: attr(data-tip); position: absolute; bottom: calc(100% + 8px); left: 0; width: min(260px, 74vw); background: var(--ink); color: var(--bg); font-size: 12.5px; font-weight: 400; line-height: 1.45; letter-spacing: 0; padding: 10px 12px; border-radius: 10px; box-shadow: var(--shadow); opacity: 0; visibility: hidden; transition: opacity .12s; z-index: 30; white-space: normal; text-align: left; pointer-events: none; }
.tt:hover::after { opacity: 1; visibility: visible; }
.how-exp { grid-column: 1 / -1; border-top: 1px solid var(--line); padding-top: 12px; }
.how-exp .why-text { margin: 0 0 10px; color: var(--ink); font-size: .9em; font-weight: 400; line-height: 1.55; white-space: pre-line; }
.how-exp .why-more { border-left: 3px solid var(--line); padding-left: 12px; margin-bottom: 10px; }
.base-note { color: var(--muted); font-weight: 400; font-size: .92em; }
.sort-wrap { display: inline-flex; align-items: center; gap: 6px; flex-wrap: wrap; font-size: .78em; margin: 6px 0 2px; }
.sort-wrap .sort-cap { color: var(--muted); }
.sort-btn { border: 1px solid var(--line); background: transparent; color: var(--muted); padding: 5px 12px; cursor: pointer; font-size: 1em; border-radius: 999px; }
.sort-btn.on { background: var(--accent); color: #fff; border-color: var(--accent); font-weight: 700; }
.tip-exp { border: 1px solid var(--line); border-radius: 10px; background: var(--card); padding: 12px 14px; margin: 10px 0; font-size: .88em; font-weight: 400; line-height: 1.5; color: var(--ink); }
.tip-exp .tip-exp-close { display: block; margin-top: 8px; color: var(--muted); font-size: .9em; text-decoration: underline dotted; }

.row .btn { padding: 7px 14px; font-size: .88em; justify-self: end; }
.btn.stack { text-align: center; line-height: 1.15; padding: 8px 16px; }
.btn.stack small { display: block; font-size: .72em; font-weight: 500; color: rgba(255,255,255,.75); }
.row .tag { font-size: .75em; font-weight: 700; border-radius: 999px; padding: 2px 10px; white-space: nowrap; }
.tag.green { background: var(--tag-green-bg); color: var(--green); }
.tag.red { background: var(--tag-red-bg); color: var(--red); }
.tag.gray { background: #f1f5f9; color: var(--muted); }

/* карточки офферов */
.offers { display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 14px; margin-top: 16px; }
.offer { background: var(--card); border: 1px solid var(--line); border-radius: var(--r); padding: 20px; box-shadow: var(--shadow); position: relative; display: flex; flex-direction: column; }
.offer.best { border: 2px solid var(--green); }
.offer .flag { position: absolute; top: -11px; left: 16px; background: var(--green); color: #fff; font-size: .72em; font-weight: 700; padding: 3px 10px; border-radius: 999px; }
.offer h3 { margin: 4px 0 8px; font-size: 1.02em; line-height: 1.3; }
.offer .price { font-size: 1.45em; font-weight: 800; letter-spacing: -.02em; }
.offer .price span { font-size: .55em; font-weight: 500; color: var(--muted); margin-left: 4px; }
.offer .price.muted-p { font-size: 1.05em; color: var(--muted); font-weight: 600; }
.offer .over { color: var(--muted); font-size: .82em; margin: 2px 0 10px; }
.feats { list-style: none; margin: 0 0 14px; padding: 0; color: var(--muted); font-size: .88em; flex: 1; }
.feats li { padding-left: 18px; position: relative; margin-bottom: 5px; }
.feats li::before { content: "✓"; position: absolute; left: 0; color: var(--green); font-weight: 700; }
.ad { display: block; color: #94a3b8; font-size: .68em; margin-top: 8px; line-height: 1.4; }

/* FAQ */
.faq details { background: var(--card); border: 1px solid var(--line); border-radius: 12px; margin-bottom: 8px; padding: 0 18px; }
.faq summary { cursor: pointer; font-weight: 600; padding: 14px 0; list-style: none; position: relative; padding-right: 28px; }
.faq summary::after { content: "+"; position: absolute; right: 2px; top: 50%; transform: translateY(-50%); color: var(--accent); font-size: 1.3em; font-weight: 400; }
.faq details[open] summary::after { content: "–"; }
.faq details p { margin: 0 0 14px; color: var(--faq-p); }

/* CTA-полоса */
.cta-band { background: #0f172a; color: #fff; padding: 40px 0; border-radius: 0; }
.cta-band h2 { color: #fff; }
.cta-band p { color: #cbd5e1; max-width: 34em; margin: 8px auto 4px; }
.cta-band .ad { color: #64748b; }

.chip-link { display: inline-block; background: var(--card); border: 1px solid var(--line); border-radius: 999px; padding: 4px 13px; margin: 2px 4px 2px 0; color: var(--ink); text-decoration: none; font-size: .9em; }
.chip-link:hover { border-color: var(--accent); color: var(--accent); }

footer { border-top: 1px solid var(--line); padding: 24px 0 40px; color: var(--muted); font-size: .82em; margin-top: 48px; background: #fff; }

@media (max-width: 560px) {
  .row .r-year { display: none; }
  .hero { padding-top: 26px; }
}

/* переключатель темы */
.theme-btn { background: none; border: 1px solid var(--line); border-radius: 8px; padding: 3px 10px; margin-left: 18px; cursor: pointer; color: var(--ink); font-size: 1em; line-height: 1.4; }
.theme-btn:hover { border-color: var(--accent); color: var(--accent); }

/* тёмная тема */
[data-theme="dark"] {
  --ink: #e6ebf4; --muted: #94a3b8; --line: #273244;
  --bg: #0d1220; --card: #161e30;
  --accent: #818cf8; --accent-dark: #a5b4fc;
  --green: #34d399; --green-bg: #0d2a21; --red: #f87171; --red-bg: #2b1417;
  --shadow: 0 1px 2px rgba(0,0,0,.4), 0 8px 24px -12px rgba(0,0,0,.5);
  --faq-p: #b9c3d4; --top-bg: rgba(13,18,32,.85); --hero-from: #131a2c;
  --badge-bg: #1e2547; --badge-ink: #a5b4fc; --chip-bg: #1f2937;
  --tag-green-bg: #0b3b2c; --tag-red-bg: #431a1d;
}
[data-theme="dark"] .stat.good { border-color: #14532d; }
[data-theme="dark"] .stat.bad { border-color: #7f1d1d; }
[data-theme="dark"] .offer.best { border-color: var(--green); }
[data-theme="dark"] .btn.ghost:hover { background: #1e2547; }
[data-theme="dark"] .tag.gray { background: #1f2937; }
[data-theme="dark"] footer { background: #0a0f1a; }

/* тултип и плашки без данных */
.calc-head { font-weight: 700; margin-bottom: 10px; }
.tip { display: inline-flex; align-items: center; justify-content: center; width: 18px; height: 18px; border-radius: 50%; background: var(--chip-bg); color: var(--muted); font-size: .75em; font-weight: 700; cursor: help; position: relative; vertical-align: middle; margin-left: 6px; }
.tip .tip-body { display: none; position: absolute; top: 24px; left: -20px; z-index: 20; width: min(340px, 80vw); background: var(--card); border: 1px solid var(--line); border-radius: 10px; box-shadow: var(--shadow); padding: 12px 14px; font-size: .85rem; font-weight: 400; color: var(--ink); line-height: 1.5; cursor: auto; }
.tip:hover .tip-body, .tip:focus .tip-body { display: block; }
@media (max-width: 700px) { .tip:hover .tip-body, .tip:focus .tip-body { display: none; } }
.row.dim { opacity: .65; }
.nodata { margin-top: 10px; }
.nodata summary { cursor: pointer; color: var(--muted); font-size: .9em; padding: 6px 0; }

/* закладка «Нашли ошибку?» */
.calc-card { position: relative; }
.err-tab { position: absolute; right: -25px; top: 140px; writing-mode: vertical-rl; background: var(--badge-bg); color: var(--badge-ink); text-decoration: none; font-size: .74em; font-weight: 600; padding: 12px 4px; border: 1px solid var(--line); border-left: none; border-radius: 0 10px 10px 0; letter-spacing: .02em; }
.err-tab:hover { background: var(--accent); color: #fff; }
@media (max-width: 1100px) { .err-tab { position: static; float: right; writing-mode: horizontal-tb; background: none; border: none; padding: 0; margin: -4px 0 8px 10px; color: var(--muted); font-weight: 400; font-size: .78em; text-decoration: underline dotted; border-radius: 0; } }
.r-num small.warn { color: #d97706; font-weight: 600; }

/* крупный основной оффер и сортировка */
.main-offer label { font-size: 1.05em; font-weight: 700; color: var(--ink); }
.main-offer select { font-size: 1.18em; padding: 13px 16px; min-width: 260px; border-width: 2px; border-radius: 12px; font-weight: 600; }
.sort-toggle { margin: 12px 0 4px; color: var(--muted); font-size: .88em; }
.sort-toggle button { background: var(--chip-bg); border: 1px solid var(--line); color: var(--muted); border-radius: 999px; padding: 4px 13px; margin-left: 6px; cursor: pointer; font-size: 1em; }
.sort-toggle button.on { background: var(--accent); border-color: var(--accent); color: #fff; }

.badge { font-variant-numeric: tabular-nums; font-weight: 800; font-size: .95em; }
.badge .dim { font-weight: 500; opacity: .65; }

/* таблица замеров */
.cmp.zamery { border: 1px solid var(--line); border-radius: var(--r); border-collapse: separate; border-spacing: 0; overflow: hidden; background: var(--card); box-shadow: var(--shadow); }
.cmp.zamery th { background: var(--chip-bg); padding: 12px 14px; }
.cmp.zamery td { padding: 14px; border-bottom: 1px solid var(--line); vertical-align: middle; }
.cmp.zamery tr:last-child td { border-bottom: none; }
.cmp.zamery .num { font-variant-numeric: tabular-nums; white-space: nowrap; }
.cmp.zamery .fact { font-weight: 400; font-size: 1.05em; }
.cmp.zamery .over-cell { font-weight: 800; font-size: 1.05em; }
.cmp.zamery .over-cell small { color: var(--muted); font-weight: 400; }
.cmp.zamery .date { color: var(--muted); white-space: nowrap; }
.cmp.zamery .fee-col { font-size: .88em; min-width: 190px; }
.cmp.zamery .fee-col small { color: var(--muted); }
.tbl-scroll { overflow-x: auto; }

/* чипы выбора */
.pick { margin-bottom: 16px; }
.pick-label { font-weight: 700; font-size: 1.02em; margin-bottom: 8px; }
.chips { display: flex; flex-wrap: wrap; gap: 8px; }
.chip-btn { padding: 11px 20px; border-radius: 12px; border: 2px solid var(--line); background: var(--card); color: var(--ink); font-weight: 700; font-size: 1.02em; cursor: pointer; transition: border-color .12s, background .12s; }
.chip-btn:hover { border-color: var(--accent); }
.chip-btn.on { border-color: var(--accent); background: var(--badge-bg); color: var(--badge-ink); }
.chips.small .chip-btn { padding: 7px 14px; font-size: .9em; font-weight: 600; border-width: 1.5px; }
/* компактная сортировка справа */
.result-head { display: flex; justify-content: space-between; align-items: center; gap: 10px; margin: 18px 0 8px; flex-wrap: wrap; }
.chip-btn.add-svc { border-style: dashed; background: transparent; color: var(--muted); }
.chip-btn.add-svc:hover { color: var(--accent); border-color: var(--accent); }
.chip-btn.more-svc { background: transparent; color: var(--muted); }
.chip-btn.more-svc:hover { color: var(--accent); border-color: var(--accent); }
.pick { position: relative; }
.svc-more { position: absolute; z-index: 40; top: 100%; left: 0; margin-top: 6px; background: var(--card); border: 1px solid var(--line); border-radius: 12px; box-shadow: var(--shadow); padding: 10px; width: min(340px, 90vw); }
.svc-search { width: 100%; box-sizing: border-box; padding: 8px 10px; border: 1.5px solid var(--line); border-radius: 8px; background: var(--bg); color: var(--ink); margin-bottom: 8px; font: inherit; }
.svc-search:focus { outline: none; border-color: var(--accent); }
.svc-more-list { display: flex; flex-direction: column; max-height: 260px; overflow-y: auto; }
.svc-more-item { text-align: left; background: none; border: none; padding: 8px 10px; border-radius: 8px; color: var(--ink); cursor: pointer; font: inherit; }
.svc-more-item:hover { background: var(--chip-bg); }
.svc-more-empty { color: var(--muted); font-size: .9em; padding: 6px 8px; }
#fb-overlay { position: fixed; inset: 0; background: rgba(2, 6, 23, .55); z-index: 100; display: flex; align-items: center; justify-content: center; padding: 16px; }
#fb-overlay[hidden] { display: none; }
.fb-modal { background: var(--card); border: 1px solid var(--line); border-radius: 14px; box-shadow: var(--shadow); width: min(480px, 100%); padding: 20px; position: relative; }
.fb-modal h3 { margin: 0 30px 6px 0; }
.fb-desc { color: var(--muted); font-size: .9em; margin: 0 0 12px; }
.fb-x { position: absolute; top: 12px; right: 12px; background: none; border: none; color: var(--muted); font-size: 1.1em; cursor: pointer; }
#fb-text { width: 100%; box-sizing: border-box; background: var(--bg); color: var(--ink); border: 1.5px solid var(--line); border-radius: 10px; padding: 10px 12px; font: inherit; resize: vertical; }
#fb-text:focus { outline: none; border-color: var(--accent); }
.fb-in { width: 100%; box-sizing: border-box; background: var(--bg); color: var(--ink); border: 1.5px solid var(--line); border-radius: 10px; padding: 9px 12px; font: inherit; margin: 0 0 8px; }
.fb-in:focus { outline: none; border-color: var(--accent); }
.fb-file { display: block; color: var(--muted); font-size: .85em; margin: 2px 0 10px; }
.fb-file input { display: block; margin-top: 4px; font: inherit; color: var(--muted); max-width: 100%; }
.fb-row { display: flex; align-items: center; gap: 12px; margin-top: 12px; }

/* таблица калькулятора */
.calc-table { background: var(--card); }
.calc-table th { font-size: .8em; white-space: nowrap; border-bottom: 2px solid var(--line); }
.calc-table td { vertical-align: middle; padding: 12px 10px; border-bottom: 1px solid var(--line); }
.calc-table .way { font-weight: 700; min-width: 200px; }
.calc-table .way small { font-weight: 400; }
.calc-table .num { font-variant-numeric: tabular-nums; white-space: nowrap; font-size: 1.05em; font-weight: 400; }
.calc-table .over-cell { font-weight: 800; }
.calc-table .total-cell { font-weight: 400; }
.calc-table .zero-cell { color: var(--muted); }

.calc-table .best-row td { background: color-mix(in srgb, var(--chip-bg) 55%, transparent); }
.calc-table .act { text-align: right; }
@media (max-width: 700px) { .calc-table { display: block; overflow-x: auto; } }

.row .r-num small.payoff { color: var(--muted); font-weight: 400; }

/* мобильная шапка и плотность */
body { overflow-x: clip; }
@media (max-width: 560px) {
  .nav { height: 46px; }
  .logo { font-size: .9em; }
  .nav nav a { margin-left: 9px; font-size: .8em; }
  .theme-btn { margin-left: 9px; padding: 1px 7px; font-size: .9em; }
  h1 { font-size: 1.78em; }
  .hero { padding: 20px 0 22px; }
  section { margin: 20px auto; }
  .chip-btn { padding: 9px 14px; font-size: .95em; }
  .calc-card { padding: 14px; }
}

/* читаемые текстовые ссылки в обеих темах */
main a:not(.btn):not(.chip-link):not(.chip-btn):not(.logo):not(.err-tab) { color: var(--accent); text-decoration: underline; text-underline-offset: 2px; }
main a:not(.btn):not(.chip-link):not(.chip-btn):not(.logo):not(.err-tab):hover { color: var(--accent-dark); }
footer a { color: var(--accent); }
.tbl-scroll { overflow-x: auto; }
.chips-links { display: flex; flex-wrap: wrap; gap: 8px; }
.plan-h { font-size: 1.1em; margin: 22px 0 4px; }

/* Карточка «оставить отзыв» в конце списка способов. Держать в конце файла:
   переопределяет grid базовой .row и мобильные grid-areas. */
.rows .row.otziv-card { display: flex; align-items: center; justify-content: space-between; gap: 14px; border: 1.5px dashed var(--muted); background: var(--bg); }
.rows .row.otziv-card .r-name small { display: block; margin-top: 2px; }
.rows .row.otziv-card .btn { flex-shrink: 0; }
@media (max-width: 700px) {
  .rows .row.otziv-card { flex-direction: column; align-items: stretch; }
  .rows .row.otziv-card .r-name small { display: block; font-size: .82em; }
  .rows .row.otziv-card .r-name small::before { content: ""; }
  .rows .row.otziv-card .btn { width: 100%; text-align: center; box-sizing: border-box; }
}

/* админ-режим: в светлой теме — синяя заливка, в тёмной — инверсия в светло-голубое свечение.
   Блок в конце файла: правило .chip-btn задаёт background шорткатом и при обычном порядке затирало заливку. */
.row.adm-measured { background-image: linear-gradient(rgba(59, 130, 246, .12), rgba(59, 130, 246, .12)); }
[data-theme="dark"] .row.adm-measured { background-image: linear-gradient(rgba(147, 197, 253, .16), rgba(147, 197, 253, .16)); }
.adm-shade { background-image: linear-gradient(rgba(59, 130, 246, var(--adm-a, 0)), rgba(59, 130, 246, var(--adm-a, 0))); }
[data-theme="dark"] .adm-shade { background-image: linear-gradient(rgba(147, 197, 253, var(--adm-a, 0)), rgba(147, 197, 253, var(--adm-a, 0))); }