/* ОБЩИЕ КОМПОНЕНТЫ САЙТА
   ═════════════════════════════════════════════════════════════════════
   Появился 22.08.2026, когда выяснилось, что одна и та же лента чисел
   на хабе была лентой, а на арсенале — тремя одинаковыми карточками.
   Пока правило живёт в двух местах, оно разойдётся: вопрос только когда.

   ЛЕНТА ПОКАЗАТЕЛЕЙ. Карточка оправдана, когда несёт содержимое; под
   одно число она лишняя рама. Строка с разделителями плотнее, а числа
   в ней при этом КРУПНЕЕ, а не мельче.

       <div class="tape">
         <div><span>подпись</span><b>число</b><em>пояснение</em></div>
       </div>
*/

.tape{display:flex;flex-wrap:wrap;gap:0;border:1px solid var(--line);
      border-radius:var(--r-md,4px);overflow:hidden;background:var(--xsl-surface)}
.tape > div{flex:1 1 160px;min-width:0;padding:18px 22px;
            border-right:1px solid var(--line);
            transition:background-color 200ms var(--ease-out,ease)}
.tape > div:last-child{border-right:none}
.tape > div:hover{background:var(--xsl-surface-2)}
.tape span{display:block;font-family:var(--font-mono);font-size:10px;
           letter-spacing:.18em;text-transform:uppercase;
           color:var(--text-muted);margin-bottom:9px}
.tape b{display:block;font-family:var(--font-mono);font-size:27px;font-weight:500;
        line-height:1;color:var(--text-primary);
        font-variant-numeric:tabular-nums}
/* Пояснение под числом отдельной строкой СВОЕГО размера. Внутри <b> оно
   наследовало 27px и разворачивало ячейку на пять строк. */
.tape em{display:block;margin-top:7px;font-style:normal;
         font-family:var(--font-mono);font-size:10px;letter-spacing:.09em;
         color:var(--text-muted);line-height:1.35}
/* На хабе пояснение — одна строка с отточием, здесь может быть фразой:
   .tape.широкая разрешает перенос. */
.tape:not(.широкая) em{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tape.широкая em{font-size:11px;line-height:1.5;letter-spacing:0;
                 font-family:var(--font-body)}

@media (max-width:760px){ .tape > div{flex:1 1 50%;
  border-bottom:1px solid var(--line)} }