:root { color-scheme: light; font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; color: #172033; background: #f6f8fb; }
* { box-sizing: border-box; } body { margin: 0; } header, main, .auth-card { max-width: 56rem; margin: 0 auto; padding-left: 1.25rem; padding-right: 1.25rem; } header { min-height: 4.5rem; display: flex; align-items: center; justify-content: space-between; } header strong { display: block; } header span, .signed-in, .upload-help, .upload-details { color: #526176; font-size: .92rem; } main, .auth-card { padding-top: 2rem; } .auth-card { max-width: 28rem; margin-top: 7vh; } section { background: #fff; border: 1px solid #dce3ec; border-radius: .65rem; padding: 1.25rem; margin: 1rem 0; } h1, h2 { color: #172033; } h1 { font-size: 1.5rem; } h2 { font-size: 1.1rem; margin-top: 0; } h3 { font-size: .95rem; margin: 0 0 .35rem; } a { color: #174ea6; } label { display: block; font-weight: 600; margin: 1rem 0; } input { display: block; width: 100%; margin-top: .35rem; padding: .65rem; border: 1px solid #9ba8b9; border-radius: .35rem; font: inherit; } button, .button-link { background: #174ea6; border: 1px solid #174ea6; border-radius: .35rem; color: #fff; cursor: pointer; font: inherit; font-weight: 600; padding: .6rem 1rem; text-decoration: none; } button:disabled { cursor: wait; opacity: .65; } .secondary { background: transparent; color: #174ea6; } .error { background: #fff1f1; border: 1px solid #e8a1a1; border-radius: .35rem; color: #8b1c1c; padding: .75rem; } .notice { background: #edf8ef; border: 1px solid #9ccaa4; border-radius: .35rem; color: #205c2b; padding: .75rem; } form { margin: 0; } .inline-form { display: inline; } .inline-form input { display: none; } .inline-form button { padding: .35rem .6rem; font-size: .85rem; } .upload-status { min-height: 1.25rem; margin-bottom: 0; } .table-wrap { overflow-x: auto; } table { border-collapse: collapse; width: 100%; } th, td { border-bottom: 1px solid #dce3ec; padding: .7rem .5rem; text-align: left; } th { color: #526176; font-size: .8rem; text-transform: uppercase; } .status { text-transform: capitalize; } .transcript-heading { display: flex; align-items: flex-start; gap: 1rem; justify-content: space-between; } .metadata { display: flex; flex-wrap: wrap; gap: 1rem 2rem; } .metadata div { min-width: 8rem; } .metadata dt { color: #526176; font-size: .8rem; text-transform: uppercase; } .metadata dd { margin: .2rem 0 0; } .utterance { border-left: 3px solid #dce3ec; margin: 1rem 0; padding-left: 1rem; } .utterance p, .transcript-text { line-height: 1.6; white-space: normal; } .fallback-note { color: #526176; font-style: italic; } @media (max-width: 35rem) { .transcript-heading { align-items: stretch; flex-direction: column; } .button-link { text-align: center; } }