/* Feather wallet site - clean rewrite.
   ponytail: deliberately keeps upstream's browser-default serif look.
   No font stack beyond the serif request, no dark mode, no accent palette. */

html { overflow-y: scroll; }

body {
    margin: 0;
    background: #f8f8f8;
    color: #000;
    font-family: "Times New Roman", Times, serif;
}

.page {
    max-width: 120ch;
    margin: 1em auto;
    background: #fff;
    border: 1px solid #777;
    padding: 0 1.2em 0.4em;
}

header, footer { text-align: center; }

h1 { font-size: 134%; }

/* download page: the release date sits inside the h1 and upstream shrank it
   with an inline style, which clean() strips */
h1 > span { font-size: 16px; }
h2 { font-size: 117%; }
h3 { font-size: 100%; }

a { text-decoration: none; }

nav, footer { margin: 1em 0; }
footer img { width: 1rem; vertical-align: middle; padding-right: 0.2rem; }

code {
    border: 1px solid #d9d9d9;
    background: #ededed;
    padding: 0 4px;
    font-family: monospace;
}

/* tables are the widest thing here; let them scroll rather than the page */
main { overflow-x: auto; }

table {
    border-collapse: collapse;
    outline: 1px solid #000;
    background: #f0f0f0;
}

tbody { border: 1px solid grey; }

td {
    padding: 0.3em 2em 0.4em 0.3em;
    vertical-align: middle;
}

/* platform cells span up to 5 rows; keep the icon+label at the top
   of the group instead of floating in the vertical middle */
td:has(> img.icon) { vertical-align: top; }

tbody.title td { font-weight: bold; }

.icon { width: 32px; padding-right: 8px; padding-left: 5px; vertical-align: middle; }

img { max-width: 100%; height: auto; }

.front { display: block; box-shadow: 4px 4px 6px #00000020; }

figure { margin: 1em 0; }
figure img { max-width: 50%; box-shadow: 4px 4px 6px #00000020; }