:root{--bg: #f5f7fb;--card: #ffffff;--border: #e5e7eb;--muted: #6b7280;--primary: #2563eb}*{box-sizing:border-box}body{margin:0;background:var(--bg);font-family:Inter,system-ui,sans-serif}button{appearance:none;border:none;background:transparent;cursor:pointer;font-family:inherit;outline:none}.btn-primary{padding:10px 16px;border-radius:12px;background:linear-gradient(135deg,#2563eb,#1e40af);color:#fff;font-size:14px;font-weight:600;box-shadow:0 10px 25px #2563eb59;transition:transform .15s ease,box-shadow .15s ease}.btn-primary:hover{transform:translateY(-1px);box-shadow:0 14px 30px #2563eb73}.btn-primary:active{transform:translateY(0);box-shadow:0 6px 14px #2563eb66}.btn-ghost{padding:8px 14px;border-radius:10px;border:1px solid var(--border);color:#111827;background:#fff;transition:background .15s ease,border-color .15s ease}.btn-ghost:hover{background:#f3f4f6;border-color:#d1d5db}.btn-danger{padding:8px 14px;border-radius:10px;background:#fee2e2;color:#b91c1c;font-weight:500;transition:background .15s ease}.btn-danger:hover{background:#fecaca}.btn-icon{padding:10px;border-radius:12px;border:1px solid var(--border);background:#fff;transition:all .15s ease}.btn-icon:hover{border-color:var(--primary);box-shadow:0 6px 14px #00000014}.btn-icon.active{border:2px solid var(--primary);box-shadow:0 0 0 3px #2563eb33}button:focus-visible{outline:none;box-shadow:0 0 0 3px #2563eb66}.btn-danger-soft{padding:8px 14px;border-radius:10px;background:#fff1f2;color:#be123c;font-weight:500;border:1px solid #fecdd3;transition:all .15s ease}.btn-danger-soft:hover{background:#ffe4e6}input,select{font-family:inherit}.app-container{display:flex;gap:48px;padding:40px;align-items:flex-start;max-width:1200px;width:100%}@media(max-width:1023px){.app-container{gap:32px;padding:32px 24px}}@media(max-width:767px){.app-container{flex-direction:column;gap:24px;padding:24px 16px}.qr-preview-wrapper{position:static!important;width:100%}.qr-preview-card{width:100%!important}}
