*{box-sizing:border-box}body{margin:0;font-family:Arial;background:#0d1722;color:#eef5fb}header{display:flex;justify-content:space-between;align-items:center;padding:22px 4vw;background:#101f2d;border-bottom:1px solid #31465a}header a{color:white}main{max-width:1200px;margin:auto;padding:22px}.tabs{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:16px}button,select,input{font:inherit}button{padding:10px 14px;border:1px solid #3a536b;border-radius:8px;background:#20384f;color:#fff;cursor:pointer}button.on{background:#66c9ff;color:#07131d}section{display:none}section.on{display:block}.grid{display:grid;grid-template-columns:400px 1fr;gap:16px}.card{background:#162636;border:1px solid #30475e;border-radius:14px;padding:18px}label{display:block;margin:12px 0}input,select{width:100%;padding:8px;margin-top:5px;background:#0c1721;color:#fff;border:1px solid #40566d;border-radius:7px}canvas{width:100%;background:#07101a;border-radius:8px}#led{width:80px;height:80px;border-radius:50%;background:#27333f;margin:20px auto;border:8px solid #091017}#led.lit{background:#8bff9e;box-shadow:0 0 30px #8bff9e}@media(max-width:800px){.grid{grid-template-columns:1fr}}