:root { color-scheme: light dark; font-family: Inter, system-ui, sans-serif; }
body { max-width: 850px; margin: 3rem auto; padding: 0 1rem; background: #10151f; color: #edf1f8; }
header, form, article { display: flex; align-items: center; gap: 1rem; }
header { justify-content: space-between; } form { margin: 1.5rem 0; }
input { flex: 1; } input, button { padding: .65rem .8rem; border-radius: .45rem; border: 1px solid #50607a; font: inherit; }
button { cursor: pointer; background: #4267d5; color: white; } button.remove { background: #9d3543; }
article { justify-content: space-between; background: #1b2330; border-radius: .7rem; padding: 1rem 1.25rem; margin: .75rem 0; }
h1, h2, p { margin: 0; } h2 { font-size: 1rem; } .presence { margin-top: .35rem; color: #a9d3ff; } small { color: #abb6c8; } ol { position: absolute; max-width: 700px; margin-top: 8rem; background: #263141; padding: 1rem 1rem 1rem 2.5rem; border-radius: .5rem; }