/* /builds/ only (build.py builds_page → layout(extra_head=…)): linked from that page alone, never bundled into site.css.
   «В симулятор β» in a row of «Мои билды» (builds.js): a link before the three buttons of the row; off (no href, still
   focusable) while the build cannot be handed over — the tooltip says why, as on the calculator's link (.tc-sim, calc.css).
   The link takes room in the row, so the name keeps its column: the three buttons go to icons earlier than builds.css says
   (900 px), in a narrow table and in the card of a narrow phone the link stands above them, and in the card every action is
   a 40-px target. The card itself starts at 760 px here, not at the 640 px of builds.css: with the link (and a long class
   name — «Чернокнижник», «Разбойник») the table needs about 745 px, and below that it ran out of its panel. */
#bl-table{position:relative}   /* the visually hidden labels of the icon buttons (position:absolute) stay inside the panel's own scroll and never widen the page */
.bl-acts .bl-sim{margin-right:4px;vertical-align:middle;white-space:nowrap}
.bl-acts .bl-act{vertical-align:middle}
.bl-sim small{margin-left:-2px;color:var(--teal);font-size:.8125rem;font-weight:600}
.bl-sim.off{opacity:.45;cursor:not-allowed}
@media (max-width:1250px){   /* icon buttons (the label stays for screen readers, the title shows as a tooltip) */
  .bl-act{width:34px;height:34px;padding:0;justify-content:center}
  .bl-act-l{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}
  .bl-acts .bl-sim{height:34px;padding:0 9px}
}
@media (max-width:900px){   /* the link on a line of its own above the icons: the cell is as wide as the link */
  .bl-acts .bl-sim{display:flex;width:max-content;margin:0 0 4px auto}
}
@media (min-width:641px) and (max-width:760px){   /* the card of builds.css (the rules of its max-width:640px block) for a table that no longer fits */
  .bl-list thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}
  .bl-list,.bl-list tbody{display:block}
  .bl-list tr{position:relative;display:flex;flex-wrap:wrap;align-items:center;gap:4px 8px;padding:10px 0 10px 42px;border-bottom:1px solid var(--line)}
  .bl-list tr:last-child{border-bottom:0}
  .bl-list tr.bl-undo-row{display:block;padding:8px 0}
  .bl-list tr.bl-undo-row>td{padding:0}
  .bl-list td{display:block;padding:0;border:0}
  .bl-list td.bl-sel{position:absolute;left:0;top:4px;width:auto}
  .bl-check{width:38px;height:38px;margin:0}
  .bl-list td.bl-name{order:1;flex:1 1 100%;min-width:0}
  .bl-list td.bl-cls{order:2;color:var(--text-2);font-size:.86rem}
  .bl-list td.bl-split{order:3;flex:1 0 55%;font-size:.86rem}
  .bl-list td.bl-date{order:4}
  .bl-list td.bl-split::before{content:"·";margin-right:8px;color:var(--text-3)}
  .bl-ico{width:18px;height:18px;margin-right:5px}
  .bl-list td.bl-acts{order:5;display:flex;gap:6px;width:auto;margin-left:auto}
  .bl-acts .bl-act+.bl-act{margin-left:0}
  .bl-selbar .btn{min-height:38px}
  .bl-undo .btn{min-height:36px}
}
@media (max-width:760px){   /* a card per build: the four actions in one row under the date, each a 40-px target */
  .bl-list td.bl-acts{flex-wrap:wrap;justify-content:flex-end}   /* a wider font than expected: the row wraps, never overflows */
  .bl-acts .bl-sim{display:inline-flex;width:auto;height:40px;margin:0;padding:0 9px}
  .bl-acts .bl-act{width:40px;height:40px}
}
@media (max-width:383px){   /* the row no longer fits the card: the link above the icons again */
  .bl-list td.bl-acts{display:block}
  .bl-acts .bl-sim{display:flex;width:max-content;margin:0 0 6px auto}
  .bl-acts .bl-act+.bl-act{margin-left:6px}
}
