/* latin */
@font-face {
  font-family: 'Doto';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(/static/fonts/doto-700-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic */
@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/static/fonts/ibm-plex-mono-500-cyrillic.woff2) format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* latin */
@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/static/fonts/ibm-plex-mono-500-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic */
@font-face {
  font-family: 'IBM Plex Sans';
  font-style: normal;
  font-weight: 400;
  font-stretch: 100%;
  font-display: swap;
  src: url(/static/fonts/ibm-plex-sans-400-cyrillic.woff2) format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* latin */
@font-face {
  font-family: 'IBM Plex Sans';
  font-style: normal;
  font-weight: 400;
  font-stretch: 100%;
  font-display: swap;
  src: url(/static/fonts/ibm-plex-sans-400-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic */
@font-face {
  font-family: 'IBM Plex Sans';
  font-style: normal;
  font-weight: 500;
  font-stretch: 100%;
  font-display: swap;
  src: url(/static/fonts/ibm-plex-sans-500-cyrillic.woff2) format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* latin */
@font-face {
  font-family: 'IBM Plex Sans';
  font-style: normal;
  font-weight: 500;
  font-stretch: 100%;
  font-display: swap;
  src: url(/static/fonts/ibm-plex-sans-500-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic */
@font-face {
  font-family: 'IBM Plex Sans';
  font-style: normal;
  font-weight: 600;
  font-stretch: 100%;
  font-display: swap;
  src: url(/static/fonts/ibm-plex-sans-600-cyrillic.woff2) format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* latin */
@font-face {
  font-family: 'IBM Plex Sans';
  font-style: normal;
  font-weight: 600;
  font-stretch: 100%;
  font-display: swap;
  src: url(/static/fonts/ibm-plex-sans-600-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* cyrillic */
@font-face {
  font-family: 'PT Sans Narrow';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(/static/fonts/pt-sans-narrow-700-cyrillic.woff2) format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* latin */
@font-face {
  font-family: 'PT Sans Narrow';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(/static/fonts/pt-sans-narrow-700-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* ================================================================
   Справочник кодов ошибок — дизайн-система
   Мир предмета: передняя панель настенного котла.
   Слоновая кость корпуса, тёмное окно дисплея с подсветкой,
   красная лампа аварии, зелёный сектор манометра.
   ================================================================ */

:root{
  --casing:#F2F0EB;      /* пластик корпуса котла */
  --casing-2:#E8E5DD;
  --ink:#16191A;
  --ink-soft:#4B5255;     /* было #5C6365 — Валентина Петровна не читала серое */
  --display:#212A30;     /* окно дисплея */
  --display-2:#182025;
  --lit:#7FC0CE;         /* подсветка дисплея */
  --alarm:#BE311B;       /* лампа аварии */
  --alarm-bg:#FBEDEA;
  --safe:#2C6C4E;        /* зелёный сектор манометра */
  --safe-bg:#EAF3EE;
  --warn:#855508;
  --warn-bg:#FBF2E2;
  --rule:#D8D4C9;
  --shadow:0 1px 0 rgba(0,0,0,.04), 0 8px 24px -18px rgba(0,0,0,.5);
  --wrap:41rem;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --casing:#15181A; --casing-2:#1D2225; --ink:#EAE7E0; --ink-soft:#B3B9BB;
    --rule:#2F3538; --alarm-bg:#2A1815; --safe-bg:#132119; --warn-bg:#241C0F;
    --safe:#6DBF95; --warn:#E0A948;
    --shadow:0 1px 0 rgba(255,255,255,.03), 0 8px 24px -18px #000;
  }
}
[data-theme="dark"]{
  --casing:#15181A; --casing-2:#1D2225; --ink:#EAE7E0; --ink-soft:#B3B9BB;
  --rule:#2F3538; --alarm-bg:#2A1815; --safe-bg:#132119; --warn-bg:#241C0F;
  --safe:#6DBF95; --warn:#E0A948;
  --shadow:0 1px 0 rgba(255,255,255,.03), 0 8px 24px -18px #000;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0; background:var(--casing); color:var(--ink);
  font-family:"IBM Plex Sans","Helvetica Neue",Arial,sans-serif;
  font-size:1.0625rem; line-height:1.6;
  font-feature-settings:"kern","liga";
}
.wrap{max-width:var(--wrap); margin:0 auto; padding:0 1.15rem}

/* --- типографика ------------------------------------------------ */
h1,h2,h3{
  font-family:"PT Sans Narrow","Arial Narrow",sans-serif;
  font-weight:700; letter-spacing:.005em; line-height:1.12;
  text-wrap:balance; margin:0;
}
h1{font-size:clamp(1.85rem,7vw,2.6rem)}
h2{font-size:clamp(1.4rem,5.2vw,1.85rem); margin:2.6rem 0 .85rem}
h3{font-size:1.12rem; font-weight:600; margin:0 0 .3rem}
p{margin:0 0 1rem}
a{color:inherit; text-underline-offset:.18em; text-decoration-thickness:.06em}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible{
  outline:2.5px solid var(--lit); outline-offset:2px; border-radius:2px
}

.eyebrow{
  font-family:"IBM Plex Mono",monospace; font-size:.72rem; font-weight:500;
  letter-spacing:.16em; text-transform:uppercase; color:var(--ink-soft);
}

/* --- шапка ------------------------------------------------------ */
.top{border-bottom:1px solid var(--rule); background:var(--casing-2)}
.top .wrap{display:flex; align-items:center; gap:.7rem; height:3.1rem}
.mark{
  font-family:"PT Sans Narrow","Arial Narrow",sans-serif; font-weight:700;
  font-size:1.12rem; letter-spacing:.02em; text-decoration:none;
}
.mark span{color:var(--alarm)}
.top nav{margin-left:auto; font-size:.86rem; color:var(--ink-soft)}

.crumbs{
  font-family:"IBM Plex Mono",monospace; font-size:.84rem; color:var(--ink-soft);
  padding:1rem 0 0; letter-spacing:.01em;
}
.crumbs a{color:inherit; text-decoration:none}
.crumbs a:hover{text-decoration:underline}

/* --- ПОДПИСЬ СТРАНИЦЫ: панель котла ----------------------------- */
.panel{
  margin:.8rem 0 1.1rem; padding:.85rem .95rem .8rem;
  background:linear-gradient(178deg,var(--display),var(--display-2));
  border-radius:14px; box-shadow:var(--shadow);
  border:1px solid rgba(255,255,255,.06);
}
.panel-top{
  display:flex; align-items:center; gap:.5rem; margin-bottom:.55rem;
  font-family:"IBM Plex Mono",monospace; font-size:.68rem;
  letter-spacing:.14em; text-transform:uppercase; color:rgba(127,192,206,.65);
}
.lamp{
  width:.55rem; height:.55rem; border-radius:50%; background:var(--alarm);
  box-shadow:0 0 8px 1px rgba(190,49,27,.9); flex:none;
}
.panel-model{margin-left:auto; letter-spacing:.1em}
.readout{
  font-family:"Doto","IBM Plex Mono",monospace; font-weight:700;
  font-size:clamp(2.9rem,14vw,4.2rem); line-height:1;
  color:var(--lit); text-align:center;
  letter-spacing:.1em; padding:.15rem 0 .3rem;
  text-shadow:0 0 18px rgba(127,192,206,.45);
  animation:lcd-on .5s steps(3,end) both;
}
.readout .dim{opacity:.16}
.panel-label{
  text-align:center; color:rgba(234,231,224,.82); font-size:.94rem;
  letter-spacing:.02em; margin:0;
}
@keyframes lcd-on{
  0%{opacity:0} 33%{opacity:.35} 66%{opacity:.12} 100%{opacity:1}
}
@media (prefers-reduced-motion:reduce){
  .readout{animation:none}
}

/* --- прямой ответ ----------------------------------------------- */
.answer{
  font-size:1.2rem; line-height:1.5; margin:.9rem 0 1.4rem;
  border-left:3px solid var(--lit); padding-left:.95rem;
}
.answer strong{font-weight:600}

/* --- полоса опасности ------------------------------------------- */
.danger{
  background:var(--alarm-bg); border:1px solid var(--alarm);
  border-radius:10px; padding:.85rem 1rem; margin:1.4rem 0;
  font-size:.97rem;
}
.danger b{color:var(--alarm); display:block; font-size:1rem; margin-bottom:.15rem}

/* --- причины с частотой ----------------------------------------- */
.causes{list-style:none; margin:0; padding:0}
.causes li{padding:.75rem 0; border-bottom:1px solid var(--rule)}
.causes li:last-child{border-bottom:0}
.cause-head{display:flex; align-items:baseline; gap:.6rem}
.cause-head b{font-weight:600}
.share{
  margin-left:auto; font-family:"IBM Plex Mono",monospace;
  font-size:.84rem; color:var(--ink-soft); flex:none;
}
.bar{height:3px; background:var(--rule); border-radius:2px; margin-top:.45rem}
.bar i{display:block; height:100%; background:var(--lit); border-radius:2px}
.causes p{margin:.3rem 0 0; font-size:.95rem; color:var(--ink-soft)}

/* --- шаги -------------------------------------------------------- */
.steps{list-style:none; margin:0; padding:0; counter-reset:s}
.steps > li{
  counter-increment:s; position:relative;
  padding:.9rem 0 .9rem 2.6rem; border-bottom:1px solid var(--rule);
}
.steps > li:last-child{border-bottom:0}
.steps > li::before{
  content:counter(s,decimal-leading-zero); position:absolute; left:0; top:.95rem;
  font-family:"IBM Plex Mono",monospace; font-size:.8rem; font-weight:500;
  color:var(--ink-soft); letter-spacing:.02em;
}
.steps p{margin:.25rem 0 0; font-size:.97rem}
.tag{
  display:inline-block; font-family:"IBM Plex Mono",monospace;
  font-size:.74rem; letter-spacing:.08em; text-transform:uppercase;
  padding:.14rem .42rem; border-radius:4px; margin-left:.45rem;
  vertical-align:.1em; white-space:nowrap;
}
.tag.ok{background:var(--safe-bg); color:var(--safe)}
.tag.care{background:var(--warn-bg); color:var(--warn)}
.tag.no{background:var(--alarm-bg); color:var(--alarm)}

/* --- стоп-блок ---------------------------------------------------- */
.stop{
  border:1px solid var(--rule); border-left:3px solid var(--alarm);
  border-radius:0 10px 10px 0; padding:1rem 1.1rem; margin:1.3rem 0;
  background:var(--casing-2);
}
.stop ul{margin:.5rem 0 0; padding-left:1.1rem}
.stop li{margin:.3rem 0; font-size:.97rem}

/* --- цены --------------------------------------------------------- */
table{width:100%; border-collapse:collapse; font-size:.95rem}
th,td{text-align:left; padding:.62rem .5rem; border-bottom:1px solid var(--rule)}
th{
  font-family:"IBM Plex Mono",monospace; font-weight:500; font-size:.72rem;
  letter-spacing:.1em; text-transform:uppercase; color:var(--ink-soft);
}
td.code{font-family:"IBM Plex Mono",monospace; font-weight:500; white-space:nowrap}
td.num{font-family:"IBM Plex Mono",monospace; white-space:nowrap; text-align:right}
.scroll{overflow-x:auto; -webkit-overflow-scrolling:touch}
.note{font-size:.95rem; color:var(--ink-soft); margin-top:.5rem}

/* --- форма -------------------------------------------------------- */
.call{
  background:var(--casing-2); border:1px solid var(--rule);
  border-radius:14px; padding:1.25rem 1.15rem; margin:2rem 0;
  box-shadow:var(--shadow);
}
.call h2{margin:0 0 .3rem}
.call > p{font-size:.97rem; color:var(--ink-soft)}
.field{margin:.75rem 0}
.field label{display:block; font-size:.87rem; font-weight:500; margin-bottom:.25rem}
.field input,.field select,.field textarea{
  width:100%; font:inherit; font-size:1rem; padding:.72rem .8rem;
  background:var(--casing); color:var(--ink);
  border:1px solid var(--rule); border-radius:8px;
}
.field textarea{min-height:4.5rem; resize:vertical}
.consent{display:flex; gap:.6rem; align-items:flex-start; margin:.9rem 0 1rem}
.consent input{width:1.15rem; height:1.15rem; margin-top:.15rem; flex:none}
.consent label{font-size:.9rem; color:var(--ink-soft); line-height:1.45}
.btn{
  display:block; width:100%; font:inherit; font-family:"PT Sans Narrow","Arial Narrow",sans-serif;
  font-weight:700; font-size:1.15rem; letter-spacing:.02em;
  padding:.85rem 1rem; border:0; border-radius:9px; cursor:pointer;
  background:var(--alarm); color:#fff;
}
.btn:hover{filter:brightness(1.08)}
.trust{
  display:flex; flex-wrap:wrap; gap:.35rem 1.1rem; margin-top:.85rem;
  font-size:.9rem; color:var(--ink-soft);
}

/* --- вопрос-ответ -------------------------------------------------- */
details{border-bottom:1px solid var(--rule); padding:.2rem 0}
summary{
  cursor:pointer; padding:.72rem 0; font-weight:500; list-style:none;
  display:flex; gap:.7rem; align-items:baseline;
}
summary::-webkit-details-marker{display:none}
summary::after{
  content:"+"; margin-left:auto; flex:none; align-self:center;
  width:1.9rem; height:1.9rem; display:inline-flex; align-items:center; justify-content:center;
  border:1.5px solid var(--ink-soft); border-radius:50%;
  color:var(--ink); font-family:"IBM Plex Mono",monospace; font-size:1.15rem; line-height:1;
}
details[open] summary::after{content:"–"}
details p{margin:0 0 .85rem; font-size:.97rem; color:var(--ink-soft)}

/* --- подвал --------------------------------------------------------- */
footer{
  margin-top:3rem; border-top:1px solid var(--rule);
  background:var(--casing-2); padding:1.5rem 0 2.5rem;
  font-size:.85rem; color:var(--ink-soft);
}
footer a{color:inherit}
.upd{
  font-family:"IBM Plex Mono",monospace; font-size:.74rem;
  color:var(--ink-soft); letter-spacing:.02em; margin-top:2rem;
}

/* --- быстрые действия под прямым ответом --------------------------- */
.jump{display:flex; gap:.6rem; margin:0 0 1.6rem; flex-wrap:wrap}
.jump a{
  flex:1 1 9rem; text-align:center; text-decoration:none;
  font-family:"PT Sans Narrow","Arial Narrow",sans-serif; font-weight:600; font-size:1.02rem;
  padding:.72rem .8rem; border-radius:9px; border:1px solid var(--rule);
}
.jump .jump-do{background:var(--casing); color:var(--ink); border:1.5px solid var(--ink-soft)}
/* CL и подобные «не поломка»: мастер — запасной вариант, не тревожная красная кнопка */
.jump.calm .jump-call{background:transparent; color:var(--ink); border:1.5px solid var(--ink-soft)}
.jump-call{background:var(--alarm); border-color:var(--alarm); color:#fff}
.jump a:hover{filter:brightness(1.06)}

/* --- липкая кнопка: только после шагов, до формы -------------------- */
.dock{
  position:fixed; left:0; right:0; bottom:0; z-index:20;
  display:flex; align-items:center; gap:.8rem;
  padding:.6rem max(1.15rem, env(safe-area-inset-left)) calc(.6rem + env(safe-area-inset-bottom));
  background:var(--casing-2); border-top:1px solid var(--rule);
  box-shadow:0 -6px 20px -14px rgba(0,0,0,.6);
  font-size:.92rem; color:var(--ink-soft);
  animation:dock-in .22s ease-out both;
}
.dock a{
  margin-left:auto; text-decoration:none; white-space:nowrap;
  font-family:"PT Sans Narrow","Arial Narrow",sans-serif; font-weight:700; font-size:1rem;
  background:var(--alarm); color:#fff; padding:.8rem 1.15rem; min-height:2.75rem; border-radius:8px;
  display:inline-flex; align-items:center;
}
@keyframes dock-in{from{transform:translateY(100%)} to{transform:none}}
@media (prefers-reduced-motion:reduce){.dock{animation:none}}
.dock[hidden]{display:none !important}

.rented{
  font-size:.92rem; color:var(--ink-soft); background:var(--casing-2);
  border:1px solid var(--rule); border-radius:9px; padding:.7rem .85rem;
  margin:0 0 1.6rem;
}
.after{font-size:.92rem; color:var(--ink-soft); margin:0 0 .7rem}

.draft-note{
  font-size:.9rem; color:var(--warn); background:var(--warn-bg);
  border:1px solid var(--warn); border-radius:8px; padding:.6rem .75rem;
  margin:.6rem 0 .2rem;
}

.req,.opt{
  font-family:"IBM Plex Mono",monospace; font-size:.66rem; font-weight:500;
  letter-spacing:.08em; text-transform:uppercase; margin-left:.35rem;
}
.req{color:var(--alarm)}
.opt{color:var(--ink-soft)}

/* --- шкала манометра: зелёный сектор нормы ------------------------- */
.norm{
  border:1px solid var(--rule); border-radius:12px; padding:1rem 1.1rem .85rem;
  background:var(--casing-2); margin:1.4rem 0;
}
.norm-head{
  display:flex; align-items:baseline; gap:.6rem; flex-wrap:wrap;
  font-family:"PT Sans Narrow","Arial Narrow",sans-serif; font-weight:600; font-size:1.12rem;
}
.norm-head b{
  margin-left:auto; font-family:"IBM Plex Mono",monospace; font-weight:500;
  font-size:1.02rem; color:var(--safe); white-space:nowrap;
}
.gauge{
  position:relative; height:7px; border-radius:4px; background:var(--rule);
  margin:2.1rem .15rem 3.6rem;
}
.gauge .zone{
  position:absolute; top:0; height:100%; border-radius:4px; background:var(--safe);
}
.gauge .mk{position:absolute; top:-4px; transform:translateX(-50%); font-style:normal}
.gauge .mk::before{
  content:""; display:block; width:2px; height:15px; margin:0 auto;
  background:var(--ink-soft); opacity:.55;
}
.gauge .mk b{
  display:block; font-family:"IBM Plex Mono",monospace; font-size:.76rem;
  font-weight:500; text-align:center; margin-top:.2rem; white-space:nowrap;
}
.gauge .mk em{
  position:absolute; top:2.35rem; left:50%; transform:translateX(-50%);
  font-style:normal; font-size:.7rem; line-height:1.25; text-align:center;
  color:var(--ink-soft); width:6.2rem;
}
.gauge .mk.edge-l em{left:0; transform:none; text-align:left}
.gauge .mk.edge-r em{left:auto; right:0; transform:none; text-align:right}
.gauge .mk.alarm::before{background:var(--alarm); opacity:1}
.gauge .mk.alarm b{color:var(--alarm)}
.gauge .mk.safe::before{background:var(--safe); opacity:1}
.gauge .mk.warn::before{background:var(--warn); opacity:1}

/* --- диагностика по почерку: карточки, не таблица ------------------- */
.diag{list-style:none; margin:1rem 0 0; padding:0}
.diag li{
  border:1px solid var(--rule); border-left:3px solid var(--lit);
  border-radius:0 10px 10px 0; padding:.8rem .95rem; margin:0 0 .7rem;
  background:var(--casing-2);
}
.diag li b{display:block; font-weight:600; margin-bottom:.25rem}
.diag li p{margin:0; font-size:.95rem; color:var(--ink-soft)}
.diag li p.act{
  margin-top:.45rem; padding-top:.45rem; border-top:1px solid var(--rule);
  color:var(--safe); font-weight:500;
}

.trap{position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden}
.formmsg{
  margin:.7rem 0 0; padding:.65rem .8rem; border-radius:8px; font-size:.95rem;
}
.formmsg.good{background:var(--safe-bg); color:var(--safe); border:1px solid var(--safe)}
.formmsg.bad{background:var(--alarm-bg); color:var(--alarm); border:1px solid var(--alarm)}
.formmsg[hidden]{display:none !important}

/* --- схема: где искать кран подпитки ------------------------------- */
.scheme{margin:1.1rem 0 1.3rem; padding:0}
.scheme svg{
  display:block; width:100%; height:auto; color:var(--ink-soft);
  background:var(--casing); border:1px solid var(--rule); border-radius:11px;
  padding:.5rem .3rem;
}
.scheme .cap{
  font-family:"IBM Plex Mono",monospace; font-size:8.5px; fill:var(--ink-soft);
  letter-spacing:.02em;
}
.scheme .cap.hot{fill:var(--alarm); font-size:9.5px}
.scheme figcaption{font-size:.9rem; color:var(--ink-soft); margin-top:.55rem}

/* спокойная подсказка вместо предупреждения — «это не поломка» */
.danger.calm{background:var(--safe-bg); border-color:var(--safe)}
.danger.calm b{color:var(--safe)}

/* таблица кодов на странице бренда: код крупно сверху, другие написания — мелкой строкой под ним */
table.codes td.code{vertical-align:top; width:7.5rem; font-size:1.05rem; font-weight:500; padding-top:.75rem}
table.codes td.code .alt{
  display:block; margin-top:.25rem; font-size:.72rem; font-weight:400;
  color:var(--ink-soft); letter-spacing:.02em; line-height:1.35; white-space:normal;
}
table.codes td{vertical-align:top}
table.codes td p{margin:.35rem 0 0; color:var(--ink-soft); font-size:.95rem}
table.codes td .more{display:inline-block; margin-top:.4rem}


/* ================================================================
   Разбор 15.09.2026: поиск по коду, свёрнутые строки, оглавление,
   плашки разделов, читаемость
   ================================================================ */

/* тёмная тема: заголовок красной плашки на тёмно-красном был почти не виден */
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]) .danger b{color:#F2836C}
  :root:not([data-theme="light"]) .tag.no{color:#F2836C}
}
[data-theme="dark"] .danger b, [data-theme="dark"] .tag.no{color:#F2836C}

/* --- свёрнутый блок «Почему появляется» ------------------------------- */
details.fold{border:1px solid var(--rule); border-radius:12px; padding:0 1rem; margin:2rem 0 .5rem; background:var(--casing-2)}
details.fold > summary{padding:.9rem 0; align-items:center; flex-wrap:wrap; row-gap:.35rem}
details.fold > summary h2{flex:1 1 auto}
details.fold > summary .fold-lead{order:5; flex:1 1 11rem; font-size:1rem; line-height:1.45; color:var(--ink)}
details.fold > summary::after{order:6}
details.fold > summary::before{content:""; order:4; flex:1 0 100%; height:0} /* перенос: причина и кнопка — второй строкой */
details.fold > summary h2{margin:0; font-size:clamp(1.25rem,4.6vw,1.6rem)}
details.fold > summary .fold-hint{margin-left:auto; font-family:"IBM Plex Mono",monospace; font-size:.84rem; color:var(--ink-soft); white-space:nowrap}
details.fold > summary::after{
  content:"показать"; width:auto; height:auto; border-radius:8px; margin-left:.6rem; padding:.45rem .8rem; min-height:2.5rem;
  font-family:"PT Sans Narrow","Arial Narrow",sans-serif; font-weight:700; font-size:1rem; letter-spacing:.02em;
  color:#fff; background:var(--display); border:1px solid var(--display);
}
details.fold[open] > summary::after{content:"скрыть"}
details.fold .causes{margin-bottom:.6rem}
details.fold p{color:var(--ink-soft)}

/* --- поиск по коду: поле в виде табло ----------------------------------- */
.finder{margin:.4rem 0 1rem}
.finder label{display:block; font-weight:600; margin-bottom:.4rem}
.lcd-field{
  background:linear-gradient(178deg,var(--display),var(--display-2));
  border-radius:12px; padding:.35rem .5rem; box-shadow:var(--shadow);
  border:1px solid rgba(255,255,255,.06);
}
.lcd-field input{
  width:100%; border:0; background:transparent; color:var(--lit);
  font-family:"IBM Plex Mono",monospace; font-size:1.6rem; font-weight:500;
  letter-spacing:.18em; text-transform:uppercase; padding:.45rem .5rem; outline:none;
  text-shadow:0 0 14px rgba(127,192,206,.35);
}
.lcd-field input::placeholder{letter-spacing:.06em; text-transform:none; font-size:1.1rem}
.lcd-field:focus-within{outline:2.5px solid var(--lit); outline-offset:2px}
.lcd-field input::-webkit-search-cancel-button{filter:invert(.7)}
.finder-msg{min-height:1.4rem; margin:.45rem 0 0; font-size:.95rem; color:var(--ink-soft);
  display:flex; flex-wrap:wrap; align-items:center; gap:.3rem .8rem}
.finder{margin-bottom:.4rem}
.finder-after{margin:.8rem 0 0}
.finder-reset{
  font:inherit; font-size:.95rem; font-weight:600; cursor:pointer; min-height:2.5rem;
  padding:.35rem .9rem; border-radius:8px; background:var(--casing); color:var(--ink); border:1.5px solid var(--ink-soft);
}
.alt-tip{font-family:"IBM Plex Sans","Helvetica Neue",Arial,sans-serif; font-size:.84rem}
.lcd-field input::placeholder{color:rgba(127,192,206,.62)}

/* --- кнопки-коды ----------------------------------------------------- */
.keys{display:flex; flex-wrap:wrap; gap:.45rem; margin:0 0 1.2rem}
.keys-title{flex:1 0 100%; margin:0 0 .15rem; font-size:.95rem; color:var(--ink-soft)}
.keys-legend{flex:1 0 100%; margin:.35rem 0 0; font-size:.88rem; color:var(--ink-soft)}
.keys-legend i{display:inline-block; width:1.5rem; height:1rem; vertical-align:-.15rem; background:var(--display); box-shadow:inset 0 -3px 0 var(--lit); border-radius:3px}
.keys a{
  min-width:3.1rem; min-height:2.75rem; display:inline-flex; align-items:center; justify-content:center;
  padding:0 .6rem; border-radius:8px; text-decoration:none;
  font-family:"IBM Plex Mono",monospace; font-weight:500; font-size:1rem;
  background:var(--casing-2); color:var(--ink); border:1px solid var(--rule);
}
/* есть разбор — кнопка «горит» как табло: тёмная, с подсветкой */
.keys a.has{background:var(--display); color:var(--lit); border-color:var(--display); box-shadow:inset 0 -3px 0 var(--lit); font-weight:600}
.keys a.dim{opacity:.3}
.keys a.hit{outline:2.5px solid var(--lit); outline-offset:2px; opacity:1}
.keys a:hover{filter:brightness(1.05)}

/* --- строки кодов: свёрнуты до «код — что значит» ------------------------ */
.code-list{border-top:1px solid var(--rule); margin-top:.4rem}
details.code-row{border-bottom:1px solid var(--rule); padding:0; scroll-margin-top:1rem}
details.code-row > summary{padding:.8rem 0; align-items:flex-start; gap:.8rem; font-weight:400}
details.code-row > summary .k{
  flex:none; width:4.4rem; font-family:"IBM Plex Mono",monospace; font-weight:600; font-size:1.15rem; line-height:1.4;
}
details.code-row > summary .t{flex:1; line-height:1.45}
details.code-row > summary .badge{
  display:block; width:max-content; margin-top:.3rem; font-family:"IBM Plex Mono",monospace; font-size:.72rem; letter-spacing:.06em;
  text-transform:uppercase; color:var(--display); background:var(--lit); border-radius:4px; padding:.12rem .4rem;
}
details.code-row > summary::after{align-self:center}
details.code-row[open] > summary{padding-bottom:.35rem}
details.code-row .row-body{padding:0 0 1rem 5.2rem}
details.code-row .row-body p{margin:.3rem 0 0}
details.code-row .alts{font-family:"IBM Plex Mono",monospace; font-size:.86rem; color:var(--ink-soft)}
details.code-row .fix{color:var(--ink); font-size:.98rem}
details.code-row[hidden]{display:none}
.more-btn{
  display:inline-block; margin-top:.7rem; padding:.6rem .9rem; border-radius:9px; text-decoration:none;
  font-family:"PT Sans Narrow","Arial Narrow",sans-serif; font-weight:700; font-size:1.02rem;
  background:var(--display); color:#fff; border:1px solid var(--display);
}
.more-btn:hover{filter:brightness(1.15)}
@media (max-width:420px){ details.code-row .row-body{padding-left:0} }

/* --- главная: плашки разделов ------------------------------------------ */
/* плашки на широком экране выходят за колонку текста симметрично, текст остаётся на линии логотипа */
.plaques{display:grid; grid-template-columns:repeat(auto-fill,minmax(14.5rem,1fr)); gap:.9rem; margin:1.4rem 0 1rem}
@media (min-width:1000px){
}
.plaque{
  display:flex; flex-direction:column; gap:.15rem; text-decoration:none; color:#EAE7E0;
  background:linear-gradient(178deg,var(--display),var(--display-2)); border-radius:14px;
  padding:.85rem 1rem 1rem; box-shadow:var(--shadow); border:1px solid rgba(255,255,255,.06);
}
.plaque-top{
  display:flex; align-items:center; gap:.45rem; font-family:"IBM Plex Mono",monospace; font-size:.74rem;
  letter-spacing:.12em; text-transform:uppercase; color:rgba(127,192,206,.8);
}
.plaque-brands{margin-left:auto; letter-spacing:.08em}
.lamp.ok{background:#3FBF7F; box-shadow:0 0 8px 1px rgba(63,191,127,.8)}
.lamp.off{background:#3A4247; box-shadow:none}
.plaque-readout{
  font-family:"Doto","IBM Plex Mono",monospace; font-weight:700; font-size:3.2rem; line-height:1.05;
  color:var(--lit); letter-spacing:.1em; text-shadow:0 0 16px rgba(127,192,206,.4); margin:.3rem 0 .15rem;
}
.plaque-name{font-family:"PT Sans Narrow","Arial Narrow",sans-serif; font-weight:700; font-size:1.35rem; line-height:1.15; color:#fff}
.plaque-meta{font-size:.9rem; color:rgba(234,231,224,.78)}
.plaque.live:hover{filter:brightness(1.12)}
.plaque.live .plaque-name::after{content:" →"}
/* будущий раздел — пустое гнездо под табло: пунктир, текст читается, но видно, что ещё не готово */
.plaque.soon{background:transparent; border:1.5px dashed #B9B3A6; box-shadow:none; color:var(--ink)}
.plaque.soon .plaque-top{color:var(--ink-soft)}
.plaque.soon .plaque-name{color:var(--ink)}
.plaque.soon .plaque-meta{color:var(--ink-soft)}
.plaque.soon .plaque-name{margin-top:auto; padding-top:.5rem}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]) .plaque.soon{border-color:#3A4247}
}

/* --- оглавление в левом поле (только широкий экран) ---------------------- */
.toc{display:none}
@media (min-width:1180px){
  .toc{
    display:flex; flex-direction:column; gap:.1rem; position:fixed; top:6.5rem;
    left:max(1rem, calc(50% - var(--wrap)/2 - 14.5rem)); width:12.5rem; z-index:5;
  }
  .toc-title{margin:0 0 .5rem; font-family:"IBM Plex Mono",monospace; font-size:.78rem; letter-spacing:.12em; text-transform:uppercase; color:var(--ink-soft)}
  .toc a{
    padding:.32rem .7rem; border-left:2px solid var(--rule); color:var(--ink-soft); text-decoration:none; font-size:.93rem; line-height:1.3;
  }
  .toc a:hover{color:var(--ink); border-left-color:var(--ink-soft)}
  .toc a.on{color:var(--ink); border-left-color:var(--lit); font-weight:600}
  /* на странице бренда в левое поле уходят кнопки-коды */
  .keys{
    position:fixed; top:6.5rem; left:max(1rem, calc(50% - var(--wrap)/2 - 14.5rem)); width:12.5rem;
    margin:0; z-index:5;
  }
  .keys a{min-width:2.9rem; min-height:2.4rem; font-size:.92rem}
  /* на компьютере нижняя полоса не нужна — её место в правом поле */
  .dock{display:none !important}
  .side-call:not([hidden]){display:flex}
}

/* тёмная тема: кнопка «показать» тёмная на тёмном — даём ей рамку */
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]) details.fold > summary::after{border-color:var(--ink-soft)}
}
[data-theme="dark"] details.fold > summary::after{border-color:var(--ink-soft)}

/* --- карточка «Вызвать мастера» в правом поле (только широкий экран) ------ */
.side-call{display:none}
@media (min-width:1180px){
  .side-call{
    position:fixed; top:6.5rem; right:max(1rem, calc(50% - var(--wrap)/2 - 14.5rem)); width:12.5rem; z-index:5;
    flex-direction:column; gap:.5rem; padding:1rem 1rem 1.1rem;
    background:var(--casing-2); border:1px solid var(--rule); border-top:3px solid var(--lit); border-radius:12px;
    box-shadow:var(--shadow); animation:side-in .22s ease-out both;
  }
  .side-call p{margin:0}
  .side-call-title{font-family:"PT Sans Narrow","Arial Narrow",sans-serif; font-weight:700; font-size:1.2rem; line-height:1.2; color:var(--ink)}
  .side-call-text{font-size:.95rem; line-height:1.4; color:var(--ink)}
  .side-call a{
    margin-top:.25rem; text-align:center; text-decoration:none; min-height:2.75rem;
    display:flex; align-items:center; justify-content:center; border-radius:9px;
    font-family:"PT Sans Narrow","Arial Narrow",sans-serif; font-weight:700; font-size:1.05rem;
    background:var(--alarm); color:#fff;
  }
  .side-call a:hover{filter:brightness(1.08)}
  .side-call.calm{border-top-color:var(--safe)}
  .side-call.calm a{background:transparent; color:var(--ink); border:1.5px solid var(--ink-soft)}
}
@keyframes side-in{from{opacity:0; transform:translateY(-.4rem)} to{opacity:1; transform:none}}
@media (prefers-reduced-motion:reduce){.side-call{animation:none}}

/* --- доводка по третьему прогону ------------------------------------------ */
/* зелёная лампа на табло «не поломка» */
.lamp.ok{background:#3FBF7F; box-shadow:0 0 8px 1px rgba(63,191,127,.8)}
/* полоса внизу на странице «не поломка» — без тревожного красного */
.dock.calm a{background:transparent; color:var(--ink); border:1.5px solid var(--ink-soft)}
/* подвал не прячется под полосой внизу */
@media (max-width:1179px){ footer{padding-bottom:6rem} }
/* тёмная тема: горящие кнопки-коды и поле поиска не должны сливаться с фоном */
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]) .keys a.has,
  :root:not([data-theme="light"]) .lcd-field{border-color:rgba(127,192,206,.5)}
  :root:not([data-theme="light"]) .keys a.has{border-width:1px; border-style:solid}
}
[data-theme="dark"] .keys a.has, [data-theme="dark"] .lcd-field{border-color:rgba(127,192,206,.5)}
/* главная: будущие разделы компактнее на телефоне */
@media (max-width:999px){
  .plaque.soon{padding:.7rem 1rem .8rem}
  .plaque.soon .plaque-name{padding-top:.25rem}
}
/* компьютер: шапка по ширине трёх колонок, главная в той же сетке, подвал у низа окна */
@media (min-width:1180px){
  header.top .wrap, footer .wrap{max-width:calc(var(--wrap) + 31.3rem)}
  .home h1{margin-top:2.5rem}
}
body{min-height:100vh; display:flex; flex-direction:column}
body > main{flex:1 0 auto; width:100%}

/* --- заглушка «Вызвать мастера» (приём заявок выключен) ------------------ */
.call.stub .btn{margin-top:.4rem}
.stub-note{
  margin:.9rem 0 0; padding:.85rem 1rem; border-radius:10px; font-size:.98rem; line-height:1.5;
  background:var(--casing); border:1px solid var(--rule); border-left:3px solid var(--lit); color:var(--ink);
}

/* --- главная: «скоро», популярные коды, как пользоваться, доверие ------------ */
.soon-line{margin:.2rem 0 0; font-size:.98rem; color:var(--ink-soft)}
.soon-line .lamp{display:inline-block; vertical-align:.08em; margin-right:.45rem}
.soon-line b{color:var(--ink); font-weight:600}
.home-block{margin-top:2.4rem}
.home-block h2{margin:0 0 .9rem}
/* популярные разборы — окошки дисплея: марка, код, что случилось */
.tiles{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:.6rem}
.tile{
  display:flex; flex-direction:column; gap:.1rem; min-height:7.2rem; padding:.7rem .85rem .8rem;
  text-decoration:none; border-radius:12px; color:#EAE7E0;
  background:linear-gradient(178deg,var(--display),var(--display-2)); box-shadow:var(--shadow);
  border:1px solid rgba(255,255,255,.06);
}
.tile-brand{font-family:"IBM Plex Mono",monospace; font-size:.72rem; letter-spacing:.14em; text-transform:uppercase; color:rgba(127,192,206,.8)}
.tile-code{font-family:"Doto","IBM Plex Mono",monospace; font-weight:700; font-size:2.3rem; line-height:1.05; color:var(--lit);
  letter-spacing:.08em; text-shadow:0 0 14px rgba(127,192,206,.35)}
.tile-what{margin-top:auto; font-size:.9rem; line-height:1.3; color:rgba(234,231,224,.9)}
.tile:hover{filter:brightness(1.12)}
.tile:focus-visible, .plaque:focus-visible{outline:2.5px solid var(--lit); outline-offset:3px}
.howto{margin:0; padding-left:1.4rem}
.howto li{margin:0 0 .7rem; padding-left:.2rem}
.howto li::marker{font-family:"IBM Plex Mono",monospace; font-weight:600; color:var(--ink-soft)}
.trust-list{margin:0; padding:0; list-style:none}
.trust-list li{margin:0 0 .7rem; padding-left:1.1rem; position:relative}
.trust-list li::before{content:""; position:absolute; left:0; top:.62em; width:.5rem; height:.5rem; border-radius:50%; background:var(--safe)}
.howto b, .trust-list b{display:block; font-weight:600}
@media (min-width:700px){ .tiles{grid-template-columns:repeat(4,minmax(0,1fr))} }
@media (min-width:1000px){
  .home .home-duo{display:grid; grid-template-columns:1fr 1fr; gap:2.5rem}
  .home .home-duo .home-block{margin-top:2.4rem}
}
@media (min-width:1180px){
}

/* главная на широком экране — одна сетка на всю ширину шапки, текст ограничен по длине строки */
@media (min-width:1000px){
  main.home{max-width:min(calc(var(--wrap) + 31.3rem), 100%)}
  .home h1, .home .answer{max-width:44rem}
  .home .plaques{grid-template-columns:repeat(4,1fr); align-items:stretch}
  .home .plaques .soon-line{grid-column:var(--from, auto) / -1; align-self:center; margin:0; padding-left:.6rem}
}