/* «Эффективность 2» — новый интерфейс (макет пользователя, handoff 2026-10-05).
   Только оформление: все цифры берутся из тех же API, что и у старой страницы.
   Токены макета: фон #f4f7fb, карточки #fff, граница #e5ebf2, текст #172033,
   вторичный #4b5563/#6b7280, акцент #145da0, хорошо #0f8a5f, плохо #c94747,
   предупреждение #b7791f, просрочено #e0a33b, нет данных #d5dce4. Префикс классов e2n-. */
/* 2026-10-05, замечание пользователя «контент узкий, по бокам пусто — шрифт чуть больше»:
   ограничение 1240px снято (страница занимает всю рабочую область), масштаб текста и отступов +12 %
   через zoom — расположение блоков прежнее, сетки auto-fit сами заполняют ширину. */
.e2n{max-width:none;margin:0 auto;display:flex;flex-direction:column;gap:24px;font-size:15px;line-height:1.45;color:#172033;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;zoom:1.12}
@media(max-width:1100px){.e2n{zoom:1}}
.e2n *{box-sizing:border-box}
.e2n a{color:#145da0}
.e2n-head{display:flex;flex-wrap:wrap;gap:16px;align-items:flex-end;justify-content:space-between}
.e2n-title{font-size:26px;font-weight:800;letter-spacing:-0.01em;line-height:1.15}
.e2n-sub{font-size:14px;color:#6b7280}
.e2n-seg{display:inline-flex;background:#fff;border:1px solid #dbe3ec;border-radius:9px;padding:3px;gap:2px}
.e2n-seg button{border:0;border-radius:7px;padding:7px 12px;font-family:inherit;font-size:13px;font-weight:600;line-height:1.2;white-space:nowrap;cursor:pointer;background:transparent;color:#4b5563}
.e2n-seg button.active{background:#145da0;color:#fff}
.e2n-btn{border:1px solid #dbe3ec;background:#fff;border-radius:9px;padding:9px 14px;font-family:inherit;font-size:13px;font-weight:600;line-height:1.2;white-space:nowrap;color:#163b5c;cursor:pointer}
.e2n-btn.on{background:#eaf2fb}
.e2n-btn.primary{border:0;background:#145da0;color:#fff}
.e2n-btn.quiet{color:#4b5563}
.e2n-btn:disabled{opacity:.5;cursor:default}
.e2n-panel{background:#fff;border:1px solid #e5ebf2;border-radius:12px;padding:16px 18px;display:flex;flex-direction:column;gap:14px}
.e2n-fgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:12px}
.e2n-fgrid label{display:flex;flex-direction:column;gap:5px;font-size:12px;color:#6b7280;font-weight:600}
.e2n-fgrid select,.e2n-fgrid input{font-family:inherit;font-size:14px;padding:8px 10px;border:1px solid #dbe3ec;border-radius:8px;background:#fff;color:#172033;min-width:0;width:100%}
.e2n-fgrid input:disabled{background:#f4f7fb;color:#9aa3ad}
.e2n-warn{display:flex;gap:10px;align-items:flex-start;background:#fff8e6;border:1px solid #f0d9a0;border-radius:10px;padding:10px 14px;font-size:13px;color:#7a5200}
.e2n-eyebrow{font-size:13px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:#6b7280}
.e2n-kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:14px}
.e2n-kpi{background:#fff;border:1px solid #e5ebf2;border-radius:14px;padding:20px;display:flex;flex-direction:column;gap:12px}
.e2n-kpi .q{font-size:14px;color:#6b7280}
.e2n-big{font-size:38px;font-weight:800;line-height:1}
.e2n-mid{font-size:22px;font-weight:800;line-height:1}
.e2n-delta{font-size:13px;font-weight:700}
.e2n-bar{height:8px;background:#e7edf3;border-radius:4px;overflow:hidden}
.e2n-bar>i{display:block;height:100%}
.e2n-stack{display:flex;height:8px;border-radius:4px;overflow:hidden;gap:2px}
.e2n-stack>i{display:block;height:100%}
.e2n-note{font-size:13px;color:#4b5563;line-height:1.4}
.e2n-pill{display:inline-block;border-radius:999px;padding:3px 9px;font-size:12px;font-weight:700;white-space:nowrap}
.e2n-pill.bad{background:#fdeaea;color:#a92d2d}.e2n-pill.warn{background:#fff3cd;color:#8a5700}.e2n-pill.good{background:#e3f4ec;color:#08704a}.e2n-pill.grey{background:#f1f4f8;color:#4b5563}
.e2n-outcomes{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:1px;background:#e5ebf2;border:1px solid #e5ebf2;border-radius:12px;overflow:hidden}
.e2n-outcome{background:#fff;padding:14px 18px;display:flex;justify-content:space-between;align-items:baseline;gap:10px}
/* 12-колоночная сетка: ширину карточки задаёт JS (grid-column:span N по числу пунктов), чтобы ряды всегда были заполнены — пользователь 2026-10-05: «пустое место для 2 карточек не нравится» */
.e2n-att{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:12px}
@media(max-width:1100px){.e2n-att{grid-template-columns:repeat(2,minmax(0,1fr))}.e2n-att-item{grid-column:auto!important}}
@media(max-width:640px){.e2n-att{grid-template-columns:minmax(0,1fr)}}
.e2n-att-item{background:#fff;border:1px solid #e5ebf2;border-radius:12px;padding:16px 18px;display:grid;grid-template-columns:28px minmax(0,1fr);gap:12px;align-items:start}
.e2n-att-n{width:28px;height:28px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:13px}
.e2n-tabs-box{background:#fff;border:1px solid #e5ebf2;border-radius:14px;overflow:hidden;scroll-margin-top:16px}
.e2n-tabs{display:flex;gap:2px;overflow-x:auto;border-bottom:1px solid #e5ebf2;padding:6px 8px 0}
.e2n-tabs button{border:0;background:transparent;padding:12px 14px;font-family:inherit;font-size:14px;font-weight:600;line-height:1.2;white-space:nowrap;cursor:pointer;color:#4b5563;border-bottom:3px solid transparent}
.e2n-tabs button.active{color:#145da0;border-bottom-color:#145da0}
.e2n-tab-body{padding:clamp(16px,2.4vw,28px);display:flex;flex-direction:column;gap:20px}
.e2n-h2{font-size:19px;font-weight:800;line-height:1.25}
.e2n-hint{font-size:14px;color:#4b5563;max-width:820px;text-wrap:pretty}
.e2n-h3{font-size:15px;font-weight:700}
.e2n-legend{display:flex;gap:18px;flex-wrap:wrap;font-size:12px;color:#4b5563}
.e2n-legend span{display:inline-flex;gap:6px;align-items:center}
.e2n-legend i{width:11px;height:11px;border-radius:3px;display:inline-block}
.e2n-row{display:grid;gap:14px;align-items:center;padding:10px 0;border-bottom:1px solid #eef2f6}
.e2n-row-cov{grid-template-columns:minmax(120px,190px) minmax(0,1fr) 64px 90px}
.e2n-row-res{grid-template-columns:minmax(120px,220px) minmax(0,1fr) 150px}
.e2n-row-dyn{grid-template-columns:minmax(120px,220px) minmax(0,1fr) 190px}
.e2n-hbar{display:flex;height:14px;border-radius:4px;overflow:hidden;background:#f1f4f8}
.e2n-hbar>i{display:block;height:100%}
.e2n-sep{border-top:1px solid #eef2f6;padding-top:18px}
.e2n-grid2{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:24px}
.e2n-tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:12px;align-items:stretch}
.e2n-tile{border:1px solid #e5ebf2;border-radius:12px;padding:18px;display:flex;flex-direction:column;gap:6px;background:#fff}
.e2n-tile .v{font-size:30px;font-weight:800;line-height:1.1}
.e2n-tile.small{padding:14px 16px;gap:4px}.e2n-tile.small .v{font-size:24px}
.e2n-matrix{display:grid;gap:3px;font-size:12px}
.e2n-mcell{border-radius:5px;padding:7px 4px;text-align:center;display:flex;flex-direction:column;min-width:0}
.e2n-link{color:#145da0;font-weight:700;text-decoration:none;cursor:pointer}
.e2n-link:hover{text-decoration:underline}
.e2n-link.ink{color:inherit}
.e2n-dtable{overflow-x:auto;border:1px solid #e5ebf2;border-radius:10px}
.e2n-dtable table{border-collapse:collapse;width:100%;min-width:1280px;font-size:13px}
.e2n-dtable th{background:#f7f9fc;border-bottom:1px solid #dbe3ec;font-size:12px;color:#6b7280;font-weight:700;text-align:right;padding:10px 10px;cursor:pointer;white-space:nowrap;vertical-align:bottom;line-height:1.25;user-select:none}
.e2n-dtable th.sorted{color:#145da0}
.e2n-dtable th:first-child,.e2n-dtable td:first-child{text-align:left}
.e2n-dtable td{padding:9px 10px;border-bottom:1px solid #eef2f6;text-align:right;white-space:nowrap;vertical-align:top}
.e2n-dtable tr.total td{background:#f7f9fc;font-weight:800}
.e2n-table{width:100%;border-collapse:collapse;font-size:13.5px}
.e2n-table th{text-align:left;font-size:12px;color:#6b7280;font-weight:700;padding:8px 10px;border-bottom:1px solid #dbe3ec;white-space:nowrap}
.e2n-table td{padding:8px 10px;border-bottom:1px solid #eef2f6;vertical-align:top}
.e2n-table tr.click{cursor:pointer}.e2n-table tr.click:hover td{background:#f7f9fc}
.e2n-scroll{overflow-x:auto}
.e2n details{background:#fff;border:1px solid #e5ebf2;border-radius:12px;padding:14px 18px;font-size:13px;color:#4b5563;line-height:1.55}
.e2n details.inner{border-radius:10px;padding:10px 14px;background:#fbfcfe}
.e2n summary{font-weight:700;color:#172033;font-size:14px;cursor:pointer}
.e2n-small{font-size:12px;color:#6b7280}
.e2n-chipline{display:flex;gap:8px;flex-wrap:wrap}
.e2n-chip{border:1px solid #dbe3ec;background:#fff;color:#6b7280;border-radius:999px;padding:6px 12px;font-size:13px;font-weight:600;cursor:pointer}
.e2n-chip.active{border-color:#145da0;background:#145da0;color:#fff}
.e2n-gapfilters{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.e2n-gapfilters select,.e2n-gapfilters input{font-family:inherit;font-size:13px;padding:7px 9px;border:1px solid #dbe3ec;border-radius:8px;background:#fff;color:#172033}
.e2n-months{display:grid;gap:6px;align-items:end;height:150px}
.e2n select.inline{font-family:inherit;font-size:13px;padding:5px 8px;border:1px solid #dbe3ec;border-radius:8px;background:#fff;color:#172033}
.e2n-switch{display:flex;justify-content:flex-end;gap:8px;align-items:center;font-size:12px;color:#6b7280}
@media(max-width:640px){.e2n-row-cov{grid-template-columns:minmax(90px,130px) minmax(0,1fr) 56px 76px}.e2n-row-res,.e2n-row-dyn{grid-template-columns:1fr;gap:6px}.e2n-big{font-size:32px}.e2n-title{font-size:22px}}