/* Phones: every table becomes a list of cards (cards.js copies each column title onto its cells). */
@media (max-width:640px){
  main table.cardy{display:block;width:100%;border:0}
  main table.cardy thead{display:none}
  main table.cardy tbody,main table.cardy tfoot{display:grid;gap:10px}
  main table.cardy tr{display:grid;gap:6px;padding:12px;border:1px solid var(--line);border-radius:10px;background:var(--surface)}
  main table.cardy tfoot tr{background:var(--bg)}
  main table.cardy td{display:flex;justify-content:space-between;align-items:baseline;gap:14px;padding:0;border:0;white-space:normal!important;text-align:right;min-width:0;overflow-wrap:anywhere}
  main table.cardy td::before{content:attr(data-label);flex:none;max-width:46%;text-align:left;font-size:12px;color:var(--ink2);font-weight:500}
  main table.cardy td[data-label=""]::before,main table.cardy td:not([data-label])::before{content:none}
  main table.cardy td:empty{display:none}
  main table.cardy td{background:transparent!important}
  main table.cardy td.act{justify-content:flex-end;position:static;width:auto;box-shadow:none;order:-1;margin:-4px -4px 0 0}
  main table.cardy td input,main table.cardy td select{max-width:62%}
  main table.cardy tr.is-deleted{opacity:.6}
  main table.cardy td[colspan]{display:block;text-align:left}
  main table.cardy td[colspan]::before{content:none}
  main .scroll,main [style*="overflow-x:auto"]{overflow-x:visible!important}
}