/* The tips articles use old-style HTML tables sized by attributes and spacer GIFs.
   main.css stretches every table to full width with roomy cell padding, and base.css
   sets img { height: auto }, which turns a 150x4 spacer into a 150x150 square. */

table {
  width: auto;
}

td,
td:first-child,
td:last-child {
  padding: .2rem .8rem;
}

table[cellpadding="0"] td {
  padding: 0;
  border-bottom: 0;
  text-align: center;
}

/* CSS can't read the height attribute back once height: auto overrides it, so each
   height in use is listed here. */
img[src$="spacer.gif"] { max-width: none; }
img[src$="spacer.gif"][height="2"]  { height: 2px; }
img[src$="spacer.gif"][height="3"]  { height: 3px; }
img[src$="spacer.gif"][height="4"]  { height: 4px; }
img[src$="spacer.gif"][height="15"] { height: 15px; }
img[src$="spacer.gif"][height="22"] { height: 22px; }
img[src$="spacer.gif"][height="23"] { height: 23px; }

/* In play lines, cards are bold and scores are sup/sub at 75%. main.css gives b a fixed
   1.6rem, so <sup><b>5</b></sup> shows the card full size but <b><sup>5</sup></b> shrinks
   it; both orders appear in these articles. */
.Play b > sup,
.Play b > sub {
  font-size: 1.6rem;
}

.Play font {
  font-size: inherit;
}