body {
    font: 16px system-ui, -apple-system, sans-serif;
    max-width: 640px;
    margin: 3em auto;
    padding: 0 1em;
    color: #222;
    line-height: 1.5;
}
h1 { margin-bottom: .4em; }
label { display: block; margin: 1em 0; }
input[type=file] { display: block; margin-top: .4em; }
button, .btn {
    display: inline-block;
    padding: .6em 1.2em;
    background: #0a66c2;
    color: #fff;
    border: 0;
    border-radius: 6px;
    text-decoration: none;
    cursor: pointer;
    font: inherit;
}
button:hover, .btn:hover { background: #0954a0; }
.hint  { color: #666; font-size: .9em; }
.ok    { color: #0a7a2f; font-weight: 600; }
.err   { color: #b00020; }
.msg   { color: #555; }
code   { background: #f4f4f4; padding: .1em .35em; border-radius: 3px; font-size: .9em; }
pre    { background: #f4f4f4; padding: .8em; overflow: auto; font-size: .85em; }
#state[data-state=running] { animation: pulse 1.5s infinite; }
@keyframes pulse { 0%,100% { opacity: 1 } 50% { opacity: .5 } }

fieldset { border: 1px solid #ddd; border-radius: 6px; padding: 1em 1.2em; }
legend { padding: 0 .4em; color: #555; font-weight: 600; }
.sep { text-align: center; color: #999; margin: .8em 0; font-size: .9em; }
details.advanced { margin: 1em 0; }
details.advanced summary { cursor: pointer; padding: .4em 0; color: #0a66c2; font-weight: 600; }
details.advanced label { margin: .8em 0; }
details.advanced input { width: 100%; max-width: 260px; padding: .4em .6em; border: 1px solid #ccc; border-radius: 4px; font: inherit; }
details.advanced small { display: block; color: #666; font-size: .85em; margin-top: .2em; }