h1{font-size:3.2em;line-height:1.1}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;cursor:pointer}button:hover{border-color:#646cff}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}.qr-container{max-width:400px;margin:0 auto;padding:20px}.qr-input-group{margin-bottom:20px}.qr-input{width:100%;padding:10px;box-sizing:border-box}.qr-preview{text-align:center;margin-bottom:20px}.qr-hidden-svg{display:none}.qr-buttons{display:flex;justify-content:center;flex-wrap:wrap;gap:20px}:root{--bg: #0f1724;--card: rgba(255,255,255,.06);--glass: rgba(255,255,255,.04);--accent: linear-gradient(90deg,#6ee7b7,#60a5fa);--text: #e6eef8;--muted: #9fb2cc;--radius: 14px;--glass-border: rgba(255,255,255,.06)}*{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial;background:radial-gradient(1200px 600px at 10% 10%,rgba(96,165,250,.08),transparent),radial-gradient(900px 400px at 90% 90%,rgba(110,231,183,.04),transparent),var(--bg);color:var(--text);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;display:flex;align-items:center;justify-content:center;padding:32px}.page{width:100%;max-width:980px;padding:12px}.card{background:linear-gradient(180deg,#ffffff05,#ffffff03);border:1px solid var(--glass-border);border-radius:var(--radius);padding:24px 24px 32px;box-shadow:0 8px 30px #02061799;-webkit-backdrop-filter:blur(8px) saturate(120%);backdrop-filter:blur(8px) saturate(120%)}.card-header{display:flex;flex-direction:column;gap:6px;margin-bottom:16px}.title{margin:0;font-size:20px;letter-spacing:.2px}.subtitle{margin:0;color:var(--muted);font-size:13px}.mode-toggle{display:flex;align-items:center;gap:8px;cursor:pointer;-webkit-user-select:none;user-select:none;padding-bottom:8px}.mode-toggle input[type=radio]{display:block;width:16px;height:16px;margin:0;appearance:none;border-radius:50%;border:2px solid rgba(255,255,255,.3);background:var(--glass);cursor:pointer;transition:all .15s}.mode-toggle input[type=radio]:checked{background:var(--accent);border-color:var(--accent);box-shadow:0 0 0 3px #60a5fa33}.mode-toggle input[type=radio]:hover{border-color:#ffffff80}.mode-label{color:var(--muted);font-size:14px}.qr-input-group{display:flex;flex-direction:column;gap:8px}.field{display:flex;flex-direction:column;gap:6px;color:var(--muted);font-size:13px}.qr-input{padding:10px 12px;border-radius:10px;border:1px solid rgba(255,255,255,.12);background:linear-gradient(180deg,#ffffff14,#ffffff0a);color:var(--text);outline:none;font-size:14px;width:100%;transition:box-shadow .15s,border-color .15s}.qr-input::placeholder{color:#ffffff40}.qr-input:focus{box-shadow:0 6px 18px #60a5fa14;border-color:#60a5fa2e}.preview-area{display:flex;justify-content:center;margin-top:6px}.qr-preview{display:flex;flex-direction:column;align-items:center;padding:16px;background:var(--card);border-radius:12px;border:1px solid rgba(255,255,255,.03)}.qr-canvas{width:200px;height:230px;border-radius:8px;background:#fff;display:block}.qr-label{margin-top:8px;color:var(--muted);font-size:13px}.card-footer{display:flex;flex-direction:column;align-items:center;margin-top:14px;gap:8px}.buttons{display:flex;gap:10px}.btn{padding:10px 14px;border-radius:10px;border:1px solid rgba(255,255,255,.04);background:transparent;color:var(--text);cursor:pointer;font-weight:600;transition:transform .12s ease,box-shadow .12s ease,opacity .12s}.btn.primary{background:var(--accent);color:#04233c;border:none;box-shadow:0 8px 20px #064e3b1f}.btn:hover{transform:translateY(-3px)}.hint{color:var(--muted);font-size:12px}@media (min-width:720px){.card{display:grid;grid-template-columns:1fr 320px;gap:18px;align-items:start}.card-header{grid-column:1 / -1}.controls{order:1}.preview-area{order:2}.card-footer{grid-column:1 / -1;align-items:start}}