:root{color-scheme:dark;font-family:system-ui,sans-serif;background:#0b0b14;color:#eeeaf7}*{box-sizing:border-box}body{margin:0}main{max-width:780px;margin:auto;padding:24px 16px}header,.heading,.controls{display:flex;align-items:center;justify-content:space-between;gap:12px}.brand{font-size:26px;letter-spacing:7px;color:#dda4ff}header{margin-bottom:28px;color:#a7a1ba;font-size:13px}section{padding:24px;border:1px solid #353044;border-radius:20px;background:#171320;margin-bottom:18px}h1{font-size:26px;margin:0 0 12px}h2{font-size:21px}p,footer{line-height:1.5;color:#bcb5ca}label{display:block;margin:18px 0}input{display:block;width:100%;padding:13px;border:1px solid #655471;background:#0f0c15;border-radius:10px;color:inherit;font-size:17px;margin-top:8px}button{border:0;border-radius:12px;background:#d3a5f8;color:#21122c;padding:14px 17px;font-size:15px;font-weight:650;cursor:pointer}button:disabled{opacity:.5;cursor:wait}.secondary{background:#30263c;color:#e9dff0}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid #fdc0e5;outline-offset:3px}a{color:#e5b8ff}.channels{display:grid;grid-template-columns:repeat(5,1fr);gap:8px}.channel{border-radius:8px;padding:10px;text-align:center;background:#352e3d}.ok{background:#183f34;color:#b5f8d8}.bad{background:#502936;color:#ffd0d5}.qr{background:white;width:240px;max-width:100%}#screen{display:block;width:100%;max-width:400px;margin:auto;touch-action:manipulation;cursor:pointer;border-radius:8px}#viewer{max-width:400px;margin:auto}.controls{margin:12px 0}#confirm{width:100%;margin:15px 0}li{margin:8px 0;color:#cbbddc}footer{text-align:center;font-size:12px;margin:28px 0}[hidden]{display:none!important}@media(max-width:480px){section{padding:16px}header{align-items:flex-start}h1{font-size:22px}.heading{align-items:flex-start}.channels{gap:5px}.channel{padding:9px 4px}}