* { box-sizing: border-box; }
body { margin: 0; width: 320px; max-width: 100%; background: #f4f7fb; color: #172033; font: 16px/1.45 system-ui, sans-serif; }
main { padding: 18px; }
h1 { font-size: 21px; line-height: 1.2; margin: 0 0 8px; }
.intro { margin: 0 0 18px; color: #526078; font-size: 14px; }
label { display: block; font-weight: 650; margin-bottom: 6px; }
select { width: 100%; padding: 11px; border: 1px solid #bac5d6; border-radius: 10px; background: white; font-size: 16px; }
.buttons { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin: 14px 0; }
button { min-height: 44px; border: 0; border-radius: 10px; padding: 10px; font-weight: 700; font-size: 15px; background: #e0e7f1; color: #172033; }
button.primary { background: #1769e0; color: white; }
button.stop { background: #ffe4e4; color: #9b1c1c; grid-column: 1 / -1; }
button:active { transform: scale(.99); }
.status { background: white; border: 1px solid #e0e6ef; border-radius: 12px; padding: 12px; overflow-wrap: anywhere; }
.status strong { font-size: 13px; color: #526078; }
.status p { margin: 3px 0 12px; font-weight: 650; }
.status p:last-child { margin-bottom: 0; }
.note { font-size: 12px; color: #526078; margin: 13px 0 0; }