* { box-sizing: border-box; }
:root { font-family: Arial, Helvetica, sans-serif; color: #000; background: #fff; color-scheme: light; }
body { margin: 0; }
main { width: min(100% - 48px, 440px); margin: 100px auto 48px; }
h1 { font-size: 32px; font-weight: 600; letter-spacing: -1px; margin: 0 0 36px; }
button, input { font: inherit; color: #000; }
button { min-height: 44px; padding: 10px 22px; border: 1px solid #000; border-radius: 0; background: #fff; cursor: pointer; }
button[aria-pressed="true"] { outline: 2px solid #000; outline-offset: 2px; font-weight: 700; }
button:disabled { border-style: dashed; cursor: not-allowed; }
:focus-visible { outline: 3px solid #000; outline-offset: 5px; }
.choices, .actions { display: flex; gap: 16px; }
#upload-panel { margin-top: 36px; }
p { margin: 0; line-height: 1.5; }
#count { font-size: 20px; }
.limit { font-size: 13px; margin-top: 4px; }
form { margin-top: 32px; }
label { display: block; margin-bottom: 12px; }
input[type="file"] { display: block; width: 100%; min-height: 44px; font-size: 14px; }
input::file-selector-button { background: #fff; color: #000; border: 1px solid #000; border-radius: 0; padding: 10px 12px; margin-right: 10px; font: inherit; cursor: pointer; }
.actions { margin-top: 24px; }
#progress { margin-top: 20px; }
#errors, #notes { margin-top: 20px; font-size: 14px; overflow-wrap: anywhere; }
#errors p + p, #notes p + p { margin-top: 10px; }
[hidden] { display: none !important; }
@media (max-width: 500px) { main { margin-top: 56px; } }