rewrite 2026-09 and 2027 articles for reader-facing quality

web/public/assets/editorial/2027/debugging-decade-2027-evolution-timeline.svg

@@ -1,26 +1,24 @@
 <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 720 500" role="img" aria-labelledby="title desc">
-  <title id="title">Карта развития плановой web-диагностики</title>
-  <desc id="desc">Временная шкала показывает, как от синтетического симптома перейти к именованной гипотезе, плановым сигналам и безопасной передаче вопроса. Красные блоки обозначают остановки.</desc>
+  <title id="title">Маршрут диагностики web-запроса</title>
+  <desc id="desc">Схема ведёт от внешнего симптома через конверт запроса и различающий сигнал к проверяемому действию. Отдельная ветка показывает разрыв цепочки.</desc>
   <rect width="720" height="500" fill="#f8fafc"/>
-  <text x="42" y="52" fill="#172554" font-family="Arial, sans-serif" font-size="25" font-weight="700">Плановая карта диагностики на 2027-01</text>
-  <text x="42" y="78" fill="#475569" font-family="Arial, sans-serif" font-size="15">source cutoff 2026-07-31 · инструменты меняются, границы вывода остаются</text>
-  <line x1="74" y1="178" x2="646" y2="178" stroke="#2563eb" stroke-width="6" stroke-linecap="round"/>
-  <g font-family="Arial, sans-serif">
-    <circle cx="92" cy="178" r="22" fill="#1d4ed8"/><text x="92" y="184" text-anchor="middle" fill="#fff" font-size="16" font-weight="700">1</text>
-    <text x="92" y="225" text-anchor="middle" fill="#172554" font-size="16" font-weight="700">Симптом</text><text x="92" y="247" text-anchor="middle" fill="#475569" font-size="13">synthetic вопрос</text>
-    <circle cx="252" cy="178" r="22" fill="#1d4ed8"/><text x="252" y="184" text-anchor="middle" fill="#fff" font-size="16" font-weight="700">2</text>
-    <text x="252" y="225" text-anchor="middle" fill="#172554" font-size="16" font-weight="700">Гипотеза</text><text x="252" y="247" text-anchor="middle" fill="#475569" font-size="13">опровержимая</text>
-    <circle cx="412" cy="178" r="22" fill="#1d4ed8"/><text x="412" y="184" text-anchor="middle" fill="#fff" font-size="16" font-weight="700">3</text>
-    <text x="412" y="225" text-anchor="middle" fill="#172554" font-size="16" font-weight="700">Сигналы</text><text x="412" y="247" text-anchor="middle" fill="#475569" font-size="13">planned-input</text>
-    <circle cx="572" cy="178" r="22" fill="#15803d"/><text x="572" y="184" text-anchor="middle" fill="#fff" font-size="16" font-weight="700">4</text>
-    <text x="572" y="225" text-anchor="middle" fill="#14532d" font-size="16" font-weight="700">Hand-off</text><text x="572" y="247" text-anchor="middle" fill="#475569" font-size="13">not-attempted</text>
+  <style>text{font-family:Arial,sans-serif;fill:#172554}.head{font-size:25px;font-weight:700}.label{font-size:16px;font-weight:700}.small{font-size:13px}.box{fill:#dbeafe;stroke:#2563eb;stroke-width:2}.ok{fill:#dcfce7;stroke:#15803d;stroke-width:2}.stop{fill:#fef2f2;stroke:#dc2626;stroke-width:2}.line{stroke:#2563eb;stroke-width:5}</style>
+  <text x="38" y="48" class="head">Web-диагностика: от симптома к проверке</text>
+  <text x="38" y="76" class="small">Один запрос · один различающий сигнал · одно действие</text>
+  <line x1="78" y1="172" x2="642" y2="172" class="line"/>
+  <g>
+    <circle cx="86" cy="172" r="23" fill="#1d4ed8"/><text x="86" y="178" text-anchor="middle" fill="#fff" font-size="16">1</text>
+    <text x="86" y="220" text-anchor="middle" class="label">Симптом</text><text x="86" y="242" text-anchor="middle" class="small">502, 403, пустой DOM</text>
+    <circle cx="274" cy="172" r="23" fill="#1d4ed8"/><text x="274" y="178" text-anchor="middle" fill="#fff" font-size="16">2</text>
+    <text x="274" y="220" text-anchor="middle" class="label">Конверт</text><text x="274" y="242" text-anchor="middle" class="small">route · time · request-id</text>
+    <circle cx="462" cy="172" r="23" fill="#1d4ed8"/><text x="462" y="178" text-anchor="middle" fill="#fff" font-size="16">3</text>
+    <text x="462" y="220" text-anchor="middle" class="label">Сигнал</text><text x="462" y="242" text-anchor="middle" class="small">разделяет причины</text>
+    <circle cx="650" cy="172" r="23" fill="#15803d"/><text x="650" y="178" text-anchor="middle" fill="#fff" font-size="16">4</text>
+    <text x="650" y="220" text-anchor="middle" class="label">Действие</text><text x="650" y="242" text-anchor="middle" class="small">лог, trace или DOM</text>
   </g>
-  <path d="M252 282 L252 314 L184 314" fill="none" stroke="#dc2626" stroke-width="3"/><polygon points="184,314 195,307 195,321" fill="#dc2626"/>
-  <rect x="42" y="316" width="192" height="74" rx="10" fill="#fef2f2" stroke="#dc2626" stroke-width="2"/>
-  <text x="58" y="346" fill="#991b1b" font-family="Arial, sans-serif" font-size="15" font-weight="700">STOP: нет имени</text><text x="58" y="369" fill="#991b1b" font-family="Arial, sans-serif" font-size="14">сигнала или гипотезы</text>
-  <path d="M412 282 L412 314 L486 314" fill="none" stroke="#dc2626" stroke-width="3"/><polygon points="486,314 475,307 475,321" fill="#dc2626"/>
-  <rect x="486" y="316" width="192" height="74" rx="10" fill="#fef2f2" stroke="#dc2626" stroke-width="2"/>
-  <text x="502" y="346" fill="#991b1b" font-family="Arial, sans-serif" font-size="15" font-weight="700">STOP: evidence</text><text x="502" y="369" fill="#991b1b" font-family="Arial, sans-serif" font-size="14">сильнее plan input</text>
-  <rect x="42" y="422" width="636" height="43" rx="8" fill="#e0f2fe"/>
-  <text x="360" y="450" text-anchor="middle" fill="#0c4a6e" font-family="Arial, sans-serif" font-size="15">Вывод не сильнее входа: никакого root cause, отчёта или production effect</text>
+  <path d="M274 198v68H116" fill="none" stroke="#dc2626" stroke-width="3"/>
+  <rect x="38" y="284" width="230" height="80" rx="10" class="stop"/>
+  <text x="55" y="316" class="label" fill="#991b1b">СТОП: нет ключа связи</text><text x="55" y="338" class="small" fill="#991b1b">не соединять события</text><text x="55" y="355" class="small" fill="#991b1b">только по времени</text>
+  <rect x="306" y="302" width="350" height="72" rx="10" class="ok"/>
+  <text x="481" y="331" text-anchor="middle" class="label" fill="#14532d">Вывод ограничен наблюдением</text><text x="481" y="353" text-anchor="middle" class="small" fill="#14532d">сначала найти слой, потом менять код</text>
 </svg>