:root { color-scheme: dark; }
html { background: #0b0e14; }
body {
  background: #0b0e14; color: #d7dce1; font-family: system-ui, sans-serif;
  max-width: 720px; margin: 0 auto; padding: 2rem 1rem;
  min-height: 100vh; box-sizing: border-box;
}
a.button, button {
  display: inline-block; background: #1b7a3d; color: #fff; border: 0;
  border-radius: 6px; padding: .7rem 1.2rem; font-size: 1rem; cursor: pointer;
  text-decoration: none;
}
input { background: #161b24; color: #d7dce1; border: 1px solid #2a3140; border-radius: 4px; padding: .5rem; }
#term { background: #05070b; border-radius: 8px; padding: .5rem; height: 60vh; }
#pairing-banner {
  background: #1b2a3a; border: 1px solid #2a4a6a; border-radius: 6px; padding: .8rem;
  margin-bottom: 1rem; font-size: .9rem;
  display: flex; gap: 1rem; align-items: center; flex-wrap: wrap;
}
#qr-code { background: #fff; padding: 6px; border-radius: 6px; line-height: 0; flex: 0 0 auto; }
#pairing-text { flex: 1 1 220px; }
#pairing-code { font-size: 1.4rem; letter-spacing: .2em; font-weight: 700; }