:root { color-scheme: dark; font: 16px/1.5 system-ui, sans-serif; background: #10131b; color: #f3f5fa; }
body { margin: 0; padding: 24px; }
main { max-width: 760px; margin: 0 auto; }
header { margin-bottom: 32px; }
h1 { margin-bottom: 0; }
header p { color: #aeb9ca; margin-top: 4px; }
section { background: #1a2030; border: 1px solid #30394c; border-radius: 16px; padding: 24px; }
.toolbar { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.session { border-top: 1px solid #30394c; padding: 20px 0; }
.session:first-child { border-top: 0; }
.session h2 { font-size: 1.1rem; margin: 0 0 8px; }
.controls { display: flex; flex-wrap: wrap; gap: 12px; align-items: end; }
label { display: grid; gap: 5px; color: #b6c0d0; }
select, button, .button { font: inherit; border-radius: 9px; padding: 8px 12px; }
select { color: #f3f5fa; background: #202a3c; border: 1px solid #3d4b62; }
button, .button { color: #0e1420; background: #a4c8ff; border: 0; cursor: pointer; text-decoration: none; }
button:hover, .button:hover { background: #c8ddff; }
#message { min-height: 1.5em; color: #c6d8f4; }