:root {
  color-scheme: dark;
  font: 16px/1.5 system-ui, sans-serif;
  color: #f2f3fa;
  background: #101116;
}
* { box-sizing: border-box; }
body { margin: 0; }
main { max-width: 920px; margin: 0 auto; padding: 44px 22px 24px; }
header { margin: 0 0 28px; }
.brand { display: flex; align-items: center; gap: 9px; font-weight: 750; }
.brand img { border-radius: 8px; }
.brand span, .status { font-size: .78rem; background: #262939; color: #c4c9e0; border-radius: 99px; padding: 3px 10px; }
h1 { font-size: clamp(32px, 6vw, 52px); line-height: 1.08; margin: 18px 0 10px; letter-spacing: -.035em; }
h2 { margin: 0; font-size: 24px; line-height: 1.15; letter-spacing: -.025em; }
p, footer { color: #b8bbcb; margin: 8px 0 14px; }
section { padding: clamp(16px, 4vw, 24px); border: 1px solid #323445; border-radius: 16px; margin-bottom: 14px; background: #1a1b24; }
.section-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.step { font-size: .76rem; letter-spacing: .14em; color: #a8a9ff; font-weight: 800; margin-bottom: 6px; }
.actions, .mic-panel { display: flex; gap: 10px 12px; align-items: end; flex-wrap: wrap; }
.mic-panel { margin-top: 16px; padding-top: 14px; border-top: 1px solid #323445; }
label { display: flex; flex-direction: column; gap: 4px; color: #cfd0df; font-size: .85rem; }
select, input:not([type="checkbox"]), button, .file-button { font: inherit; }
select, input:not([type="checkbox"]) { max-width: min(100%, 300px); width: auto; min-width: 156px; padding: 8px 10px; border: 1px solid #414355; border-radius: 8px; color: #f2f3fa; background: #14151c; }
button, .file-button { padding: 8px 13px; border: 1px solid #414355; border-radius: 8px; color: #f2f3fa; background: #272938; cursor: pointer; white-space: nowrap; }
.primary { background: #5254ca; border-color: #6567e3; font-weight: 700; }
button:hover:not(:disabled), .file-button:hover { filter: brightness(1.18); }
button:disabled { opacity: .5; cursor: default; }
button[aria-pressed="true"] { border-color: #b0afff; background: #34366a; }
:focus-visible, .file-button:focus-within { outline: 2px solid #aaa8ff; outline-offset: 2px; }
.file-button input { position: absolute; width: 1px; min-width: 0; height: 1px; opacity: 0; padding: 0; }
.check { flex-direction: row; align-items: center; min-height: 42px; }
.check input { accent-color: #8284ff; }
.hint, .participants { font-size: .85rem; margin: 10px 0 0; }
.error { color: #ffb1bd; margin-bottom: 0; }
.results { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(220px, 100%), 1fr)); gap: 8px; margin-top: 14px; }
.result { min-height: 51px; text-align: left; white-space: normal; }
footer { font-size: .82rem; padding: 0 6px; }