/* Калькулятор кровли в карточке металлочерепицы (демо 21.10.2026).
   Считает relay (chat.richstack.ru/roofcalc/), ядро = Riff-бот «Калькулятор». */
.rcbtn{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;margin:10px 0 4px;padding:14px 16px;
  background:#fff;color:var(--brand,#810600);border:2px solid var(--brand,#810600);border-radius:13px;
  font:800 15px 'Manrope',sans-serif;cursor:pointer;transition:.18s}
.rcbtn:hover{background:var(--brand,#810600);color:#fff}
.rcbtn svg{width:22px;height:22px;flex:none}
.rcbtn small{display:block;font:600 12px 'Manrope',sans-serif;opacity:.75}
.rchint{font:500 12.5px 'Manrope',sans-serif;color:#8a8175;margin:0 0 6px;text-align:center}

dialog.rc{position:fixed;inset:0;margin:auto;border:0;padding:0;border-radius:18px;height:fit-content;width:min(780px,calc(100vw - 32px));max-height:calc(100dvh - 32px);
  background:#faf7f2;color:#201c17;font:500 15px/1.45 'Manrope',sans-serif;box-shadow:0 30px 80px -20px rgba(0,0,0,.45)}
dialog.rc::backdrop{background:rgba(20,22,26,.55)}
.rc *{box-sizing:border-box}
.rc .rchd{position:sticky;top:0;z-index:2;display:flex;align-items:center;gap:12px;padding:16px 20px;background:#faf7f2;border-bottom:1px solid #ece7df}
.rc .rchd h2{margin:0;font:700 18px Unbounded,sans-serif;flex:1}
.rc .rcx{width:38px;height:38px;border-radius:50%;border:0;background:#ece7df;font-size:22px;line-height:1;cursor:pointer;color:#201c17}
.rc .rcsteps{display:flex;gap:6px;padding:0 20px 12px;background:#faf7f2;border-bottom:1px solid #ece7df;position:sticky;top:70px;z-index:2}
.rc .rcsteps span{flex:1;height:4px;border-radius:2px;background:#ece7df}
.rc .rcsteps span.on{background:var(--brand,#810600)}
.rc .rcbody{padding:18px 20px 22px}
.rc h3{font:700 15px Unbounded,sans-serif;margin:4px 0 12px}
.rc .rcshapes{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.rc .rcshape{border:2px solid #ece7df;background:#fff;border-radius:14px;padding:12px 10px 10px;cursor:pointer;text-align:center;font:700 14px 'Manrope',sans-serif;color:#201c17;transition:.15s}
.rc .rcshape:hover{border-color:#c9b9a3}
.rc .rcshape.on{border-color:var(--brand,#810600);box-shadow:0 8px 20px -12px rgba(129,6,0,.6)}
.rc .rcshape svg{width:100%;height:auto;display:block;margin-bottom:6px}
.rc .rcdraw{background:#fff;border:1px solid #ece7df;border-radius:14px;padding:10px;margin-bottom:14px}
.rc .rcdraw svg{width:100%;max-width:420px;height:auto;display:block;margin:0 auto}
.rc .rcfields{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.rc .rcf label{display:block;font:700 13px 'Manrope',sans-serif;margin-bottom:5px}
.rc .rcf label b{display:inline-grid;place-items:center;width:22px;height:22px;border-radius:50%;background:var(--brand,#810600);color:#fff;font:800 12px 'Manrope',sans-serif;margin-right:6px}
.rc .rcf .in{display:flex;align-items:center;border:1.5px solid #ddd3c4;border-radius:11px;background:#fff;overflow:hidden}
.rc .rcf .in:focus-within{border-color:var(--brand,#810600)}
.rc .rcf input,.rc .rcf select{width:100%;border:0;background:transparent;padding:11px 12px;font:700 16px 'Manrope',sans-serif;color:#201c17;outline:0;appearance:none;-webkit-appearance:none}
.rc .rcf .in i{font-style:normal;color:#8a8175;padding-right:12px;font-weight:600}
.rc .rcf small{display:block;color:#8a8175;font-size:12px;margin-top:4px}
.rc .rcsel{position:relative}
.rc .rcsel::after{content:"";position:absolute;right:14px;top:50%;width:8px;height:8px;border-right:2px solid #8a8175;border-bottom:2px solid #8a8175;transform:translateY(-70%) rotate(45deg);pointer-events:none}
.rc .rcseg{display:flex;gap:6px;margin:2px 0 8px}
.rc .rcseg button{flex:1;padding:9px 6px;border-radius:10px;border:1.5px solid #ddd3c4;background:#fff;font:700 13px 'Manrope',sans-serif;cursor:pointer;color:#201c17}
.rc .rcseg button.on{border-color:var(--brand,#810600);color:var(--brand,#810600)}
.rc .rcchk{display:flex;align-items:center;gap:8px;font:600 13.5px 'Manrope',sans-serif;margin:10px 0 0;cursor:pointer}
.rc .rcnote{background:#fff7e6;border:1px solid #f1dcb0;border-radius:11px;padding:10px 12px;font-size:13px;margin:14px 0 0}
.rc .rcerr{background:#fdeceb;border:1px solid #f3c2bf;color:#8a1a12;border-radius:11px;padding:10px 12px;font:600 13.5px 'Manrope',sans-serif;margin:12px 0 0}
.rc .rcmat{margin-top:18px;padding-top:16px;border-top:1px dashed #ddd3c4}
.rc .rcnav{display:flex;gap:10px;margin-top:20px}
.rc .rcnav .go{flex:1;padding:14px;border:0;border-radius:13px;background:var(--brand,#810600);color:#fff;font:800 15px 'Manrope',sans-serif;cursor:pointer}
.rc .rcnav .go:disabled{opacity:.5;cursor:default}
.rc .rcnav .back{padding:14px 18px;border:1.5px solid #ddd3c4;border-radius:13px;background:#fff;font:700 14px 'Manrope',sans-serif;cursor:pointer;color:#201c17}
.rc .rcsum{background:#fff;border:1px solid #ece7df;border-radius:16px;padding:16px 18px;margin-bottom:14px}
.rc .rcsum .what{font:600 13.5px 'Manrope',sans-serif;color:#8a8175}
.rc .rcsum .tot{font:800 30px Unbounded,sans-serif;margin:6px 0 2px;color:#201c17}
.rc .rcsum .m2{font:700 14px 'Manrope',sans-serif}
.rc .rcgrp{background:#fff;border:1px solid #ece7df;border-radius:14px;margin-bottom:10px;overflow:hidden}
.rc .rcgrp h4{margin:0;padding:10px 14px;font:800 12px 'Manrope',sans-serif;letter-spacing:.06em;text-transform:uppercase;color:#8a8175;background:#f7f3ec;display:flex;justify-content:space-between}
.rc .rcrow{padding:10px 14px;border-top:1px solid #f1ece4;display:grid;grid-template-columns:1fr auto;gap:2px 12px}
.rc .rcrow:first-of-type{border-top:0}
.rc .rcrow .n{font:600 14px 'Manrope',sans-serif}
.rc .rcrow .s{font:800 14px 'Manrope',sans-serif;text-align:right;white-space:nowrap}
.rc .rcrow .q{font-size:12.5px;color:#8a8175;grid-column:1/-1}
.rc .rcrow .f{display:none;font-size:12px;color:#6b6257;grid-column:1/-1;background:#faf7f2;border-radius:8px;padding:6px 8px;margin-top:4px}
.rc.formulas .rcrow .f{display:block}
.rc .rcrow.np .s{color:#b8791f;font-weight:700}
.rc .rcsheets{display:flex;flex-wrap:wrap;gap:6px;grid-column:1/-1;margin-top:4px}
.rc .rcsheets span{background:#f1ece4;border-radius:7px;padding:3px 8px;font:700 12px 'Manrope',sans-serif}
.rc .rcacts{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:16px}
.rc .rcacts a,.rc .rcacts button{display:flex;align-items:center;justify-content:center;gap:8px;padding:13px;border-radius:13px;font:800 14px 'Manrope',sans-serif;cursor:pointer;text-decoration:none;border:1.5px solid #ddd3c4;background:#fff;color:#201c17}
.rc .rcacts .pri{background:var(--brand,#810600);border-color:var(--brand,#810600);color:#fff;grid-column:1/-1}
.rc .rcfine{font-size:12px;color:#8a8175;margin-top:12px}
.rc .rclink{background:none;border:0;padding:0;color:var(--brand,#810600);font:700 13px 'Manrope',sans-serif;cursor:pointer;text-decoration:underline}
.rc .rcload{text-align:center;padding:40px 0;color:#8a8175;font-weight:700}
@media(max-width:600px){
  dialog.rc{width:100vw;max-width:100vw;height:100dvh;max-height:100dvh;border-radius:0;margin:0}
  .rc .rcshapes{grid-template-columns:1fr 1fr 1fr;gap:8px}
  .rc .rcshape{font-size:12.5px;padding:8px 4px}
  .rc .rcfields{grid-template-columns:1fr}
  .rc .rcsum .tot{font-size:26px}
  .rc .rcacts{grid-template-columns:1fr}
}
@media print{
  body>*:not(dialog.rc){display:none!important}
  dialog.rc{position:static;box-shadow:none;max-height:none;width:100%;background:#fff}
  .rc .rchd .rcx,.rc .rcsteps,.rc .rcacts,.rc .rcnav,.rc .rclink{display:none!important}
  .rc.formulas .rcrow .f,.rc .rcrow .f{display:block}
}
html.rc-lock,html.rc-lock body{overflow:hidden!important;overscroll-behavior:none}
dialog.rc{overscroll-behavior:contain}
.rc .rccart{background:#fff;border:1px solid #ece7df;border-radius:14px;padding:12px 14px;margin-top:14px;font-size:13px;color:#4a433a}
.rc .rccart b{display:block;color:#201c17;font-size:14px;margin-bottom:4px}
.rc .rccart div{margin-top:4px}
.rc .rcacts .pri.alt{background:#fff;color:var(--brand,#810600)}
.rc .rcacts button:disabled{opacity:.45;cursor:default}
.rc .rclead{background:#fff;border:1px solid #ece7df;border-radius:14px;padding:14px;margin-top:14px}
.rc .rclead h3{margin-top:0}
.rc .rcmsg{white-space:pre-wrap;background:#f4f6fb;border:1px solid #dde3ef;border-radius:12px;padding:12px;font:500 13px/1.5 'Manrope',sans-serif;margin:10px 0 8px;color:#1e2533}
.rc .rcbtns{display:flex;gap:8px}
.rc .rcbtns span{flex:1;text-align:center;padding:9px;border-radius:9px;background:#e8eefc;color:#2c4a8a;font:700 13px 'Manrope',sans-serif}
.rc .rctag{display:inline-block;margin-left:6px;padding:1px 7px;border-radius:6px;background:#fff1e0;color:#9a5a00;font:800 11px Manrope,sans-serif;vertical-align:middle}
.rc .rccart .out{color:#9a5a00;font-weight:600}
.rc .rcacts .rcsub{grid-column:1/-1;margin:-4px 0 4px;text-align:center;font:600 12.5px Manrope,sans-serif;color:#8a8175}
.rc .rclead.ok{border-color:#bfe3c8;background:#f1faf3}
.rc .rclead.ok h3{color:#15803d}
.rc .rcacts .rclead{grid-column:1/-1;margin:0 0 4px}
.rc .rcchk a{color:var(--brand,#810600);text-decoration:underline}
.rc .rcchk input{flex:none;width:18px;height:18px}
.rc .rcacts .rclead a{display:inline;padding:0;border:0;border-radius:0;background:none;font:inherit;color:var(--brand,#810600);text-decoration:underline}
.rc .rcacts .rclead .rcchk{align-items:flex-start}