:root { color-scheme: light dark; }
body { font-family: system-ui, sans-serif; margin: 0; }
main { max-width: 56rem; margin: 0 auto; padding: 1rem; }
nav { display: flex; gap: 1rem; align-items: center; }
.tag { color: #555; }
.hint { color: #555; font-size: .9rem; }
#conn-health { margin-left: auto; font-size: .85rem; border: 1px solid #999; border-radius: 1rem; padding: .1rem .6rem; }
#device-list { list-style: none; padding: 0; display: grid; gap: .75rem; }
#device-list li { border: 1px solid #999; border-radius: .5rem; padding: .75rem; }
#approvals-list, #sessions-list, #schedules-list, #outbox-list { list-style: none; padding: 0; display: grid; gap: .5rem; }
#approvals-list li, #sessions-list li, #schedules-list li, #outbox-list li { border: 1px solid #999; border-radius: .5rem; padding: .5rem .75rem; }
#approvals-list .card-actions { display: flex; gap: .5rem; margin-top: .5rem; flex-wrap: wrap; }
#approvals-dot:not([hidden]) { background: #b00020; color: #fff; border-color: #b00020; font-weight: bold; }
.badge { display: inline-block; border: 1px solid #666; border-radius: 1rem; padding: 0 .5rem; margin-right: .4rem; font-size: .8rem; }
.badge.windows { font-weight: bold; }
#terminal { background: #111; color: #eee; min-height: 12rem; max-height: 24rem; overflow: auto; padding: .5rem; white-space: pre-wrap; }
#desktop-shot { max-width: 100%; border: 1px solid #999; }
form { display: flex; gap: .5rem; flex-wrap: wrap; align-items: center; }
input[type="text"], input[type="password"] { min-width: 16rem; }