/* Калькулятор мощности квартиры и дома (/kalkulyator/moshchnost/). Токены — из main.css (:root). */
.pm{margin-bottom:0}
.pm-top{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px 24px;margin-bottom:18px}
.pm-lead{margin:0;max-width:560px;font-size:15px}
.pm-presets{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.pm-presets span{font-size:14px;font-weight:700;color:var(--muted)}
.pm-presets .btn{color:var(--ink)}
.pm-nojs{margin:0 0 16px}

.pm-body{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:28px;align-items:start}
.pm-side{position:sticky;top:90px;display:grid;gap:14px}

/* список приборов */
.pm-head,.pm-row{display:grid;grid-template-columns:minmax(0,1fr) 92px 74px 96px 78px 26px;gap:10px;align-items:center}
.pm-head{font-size:13px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);padding:0 0 8px;border-bottom:1px solid var(--line)}
.pm-group{margin:18px 0 4px;font-size:13px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--volt-d)}
.pm-row{padding:7px 0;border-bottom:1px solid var(--line)}
.pm-name{min-width:0}
.pm-name b{display:block;color:var(--ink);font-size:14.5px;font-weight:700;line-height:1.3}
.pm-name small{display:block;color:var(--muted);font-size:14px;line-height:1.35}
.pm-f{display:block;margin:0}
.pm-lab{display:none}
.pm-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.pm .pm-f input,.pm .pm-name input{padding:8px 10px;font-size:15px;font-variant-numeric:tabular-nums}
.pm-al{display:flex;align-items:center;gap:7px;font-size:14px;color:var(--body);cursor:pointer}
.pm .pm-al input{width:18px;height:18px;padding:0;margin:0;accent-color:var(--volt-d);flex-shrink:0}
.pm-sum{font-size:14px;font-weight:800;color:var(--ink);text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.pm-off .pm-name b,.pm-off .pm-sum{color:var(--muted);font-weight:600}
.pm-del{width:26px;height:26px;border-radius:0;border:1px solid var(--line);background:#fff;color:var(--muted);font-size:17px;line-height:1;cursor:pointer}
.pm-del:hover,.pm-del:focus-visible{color:var(--bad);border-color:var(--bad)}
.pm-add{margin-top:14px;color:var(--ink)}

/* коэффициент */
.pm-k select{font-size:14px}
.pm-k input{margin-top:8px}
.pm-hint{margin:8px 0 0;font-size:14px;line-height:1.5;color:var(--muted)}

/* итог */
.pm-out{display:grid;grid-template-columns:1fr 1fr;gap:12px 14px;border-radius:0;padding:16px}
.pm-out small{display:block;color:var(--smoke);font-size:13px;line-height:1.35;text-transform:uppercase;letter-spacing:.05em}
.pm-out b{display:block;color:#fff;font-size:20px;font-weight:900;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.pm-big{grid-column:1/-1;padding-bottom:12px;border-bottom:1px solid var(--line-d)}
.pm-big b{font-size:clamp(28px,3.4vw,36px);border-radius:0;transition:background-color .6s}
.pm-big b.pm-flash{background-color:rgba(255,138,76,.16);transition:none}
.pm-big span{display:block;color:var(--smoke);font-size:14px;line-height:1.45;margin-top:2px}

/* сравнение */
.pm-cmp{border-radius:0;padding:14px}
.pm-cmp-t{margin:0 0 10px;font-weight:800;color:var(--ink);font-size:15px}
.pm-cmp-in{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.pm-cmp .field label{font-size:14px}
.pm-verdict{margin-top:12px;font-size:14px;line-height:1.55;border-radius:0}
.pm-verdict p{margin:0}
.pm-verdict.pm-ok,.pm-verdict.pm-mid,.pm-verdict.pm-bad{padding:12px 14px}
.pm-ok{background:var(--ok-wash);border-color:var(--ok)}
.pm-ok b{color:var(--ok)}
.pm-mid{background:var(--warn-wash);border-color:var(--signal)}
.pm-bad{background:var(--bad-wash);border-color:var(--bad)}
.pm-bad b{color:var(--bad)}
.pm-link{display:inline-block;margin-top:8px;font-weight:700;color:var(--volt-d)}
.pm-phase{margin-top:8px!important;padding-top:8px;border-top:1px dashed var(--line);font-size:14px;color:var(--body)}

.pm-act{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.pm-act .btn-line{color:var(--ink)}
.pm-copied{flex-basis:100%;margin:0;font-size:14px;color:var(--muted);min-height:1em}
.pm-note{margin:22px 0 0;padding-top:14px;border-top:1px solid var(--line)}

@media (max-width:1100px){
  .pm-body{grid-template-columns:1fr}
  .pm-side{position:static}
}
@media (max-width:640px){
  .pm{padding:18px 16px}
  .pm-head{display:none}
  .pm-row{grid-template-columns:minmax(0,1fr) 66px 54px;gap:4px 8px;padding:10px 0}
  .pm-name{grid-column:1;grid-row:1}
  .pm-al{grid-column:1;grid-row:2;font-size:14px}
  .pm-row .pm-f:nth-of-type(1){grid-column:2;grid-row:1/3;align-self:center}
  .pm-row .pm-f:nth-of-type(2){grid-column:3;grid-row:1/3;align-self:center}
  .pm-lab{display:block;font-size:13px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin-bottom:2px}
  .pm .pm-f input{padding:7px 8px}
  .pm-sum{display:none}
  .pm-own .pm-f:nth-of-type(1),.pm-own .pm-f:nth-of-type(2){grid-row:1}
  .pm-own .pm-del{grid-column:2/4;grid-row:2;justify-self:end}
  .pm-out{padding:14px}
  .pm-out b{font-size:18px}
  .pm-cmp-in{grid-template-columns:1fr}
}
@media (prefers-reduced-motion:reduce){
  .pm-big b,.pm-big b.pm-flash{transition:none;background-color:transparent}
}
/* фирменный вид: итог — табличка техданных, сравнение — плашка с фаской */
.pm-out,.pm-cmp,.pm-verdict,.pm-del{--c:var(--c-m);clip-path:polygon(var(--c) 0,100% 0,100% calc(100% - var(--c)),calc(100% - var(--c)) 100%,0 100%,0 var(--c))}
.pm-del{--c:var(--c-xs)}
.pm-out{background:var(--grip),var(--black);box-shadow:inset 0 4px 0 var(--acc-hi)}
.pm-out :focus-visible{outline-color:var(--acc-hi)}
.pm-big b{display:inline-block;color:var(--acc-hi);font-variant-numeric:tabular-nums lining-nums}
.pm-cmp{border:0;box-shadow:inset 0 0 0 1px var(--steel)}
.pm-verdict.pm-ok,.pm-verdict.pm-mid,.pm-verdict.pm-bad{border:0;box-shadow:inset 4px 0 0 currentColor}
.pm-verdict.pm-ok{color:var(--ok)}.pm-verdict.pm-mid{color:var(--warn-ink)}.pm-verdict.pm-bad{color:var(--bad)}
.pm-verdict.pm-ok p,.pm-verdict.pm-mid p,.pm-verdict.pm-bad p{color:var(--body)}
.pm-mid b{color:var(--warn-ink)}
.pm-del:focus-visible{outline:0;box-shadow:inset 0 0 0 2px var(--acc-ink)}
