*{box-sizing:border-box}body{margin:0;background:#eef2f7;color:#111827;font-family:Arial,sans-serif}main{max-width:760px;margin:auto;padding:24px 16px}h1{font-size:2.5rem}section{background:white;padding:22px;border-radius:18px;box-shadow:0 10px 30px #0001}label{display:block;font-weight:700;margin:16px 0 7px}input,button{font:inherit}input{width:100%;min-height:58px;border:2px solid #cbd5e1;border-radius:12px;padding:10px 14px}button{min-height:50px;border:0;border-radius:12px;padding:10px 16px;font-weight:700;margin-top:12px}.top{display:flex;justify-content:space-between;align-items:center}.top button{margin:0}.top strong{font-size:1.6rem}article{border:2px solid #dbe3ee;border-radius:16px;padding:20px;margin:18px 0}article h2{font-size:2rem;margin:.4rem 0 1rem}.modes{display:grid;grid-template-columns:1fr 1fr;background:#e2e8f0;padding:5px;border-radius:14px}.modes button{margin:0;background:transparent}.modes .active{background:white;box-shadow:0 2px 8px #0002}#barcode{margin-top:14px;min-height:74px;font-size:1.5rem;text-align:center;font-weight:700}#result{white-space:pre-line;min-height:105px;margin-top:18px;border-radius:16px;padding:18px;display:flex;align-items:center;justify-content:center;text-align:center;font-size:1.35rem;font-weight:800;background:#e2e8f0}.success{background:#dcfce7!important;color:#166534}.error{background:#fee2e2!important;color:#991b1b}.actions{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.actions button{background:#e2e8f0}#start{width:100%;background:#111827;color:#fff}@media(max-width:560px){.actions{grid-template-columns:1fr}}