@import "https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap";*{box-sizing:border-box}:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--bg-body:#161e3f;--bg-panel:#0f1117;--bg-muted:#ffffff0a;--border:#ffffff1a;--border-strong:#fff3;--text-primary:#f5f7ff;--text-muted:#a3a9c2;--accent:#3b82f6;--accent-gradient:linear-gradient(135deg,#6366f1 0%,#06b6d4 100%);--shadow:0 20px 45px #090a0f8c}body{background:radial-gradient(circle at 20% 20%,#999aee33,transparent 55%),radial-gradient(circle at 80% 0%,#0ea5e933,transparent 60%),var(--bg-body);color:var(--text-primary);min-height:100vh;margin:0;font-family:Inter,Segoe UI,system-ui,-apple-system,sans-serif}a{color:inherit;text-decoration:none}.page{flex-direction:column;gap:3.5rem;width:min(1080px,92vw);margin:0 auto;padding:4rem 0 3rem;display:flex}.hero{text-align:center;flex-direction:column;gap:.75rem;display:flex}.title{letter-spacing:-.04em;margin:0;font-size:clamp(2.25rem,4vw,2.8rem);font-weight:600}.subtitle{max-width:48ch;color:var(--text-muted);margin:0 auto;font-size:1rem;line-height:1.6}.layout{grid-template-columns:repeat(2,minmax(0,1fr));align-items:start;gap:2.5rem;display:grid}.panel{background:var(--bg-panel);border:1px solid var(--border);box-shadow:var(--shadow);border-radius:18px;padding:2rem;position:relative;overflow:hidden}.panel:before{content:"";pointer-events:none;background:radial-gradient(circle at 15% 20%,#6366f11f,#0000 55%);position:absolute;inset:0}.panel:after{content:"";border-radius:inherit;mix-blend-mode:screen;pointer-events:none;border:1px solid #ffffff05;position:absolute;inset:0}.panel-controls{flex-direction:column;gap:1.5rem;display:flex}.qr-form{flex-direction:column;gap:1rem;display:flex}.control-label{text-transform:uppercase;letter-spacing:.08em;color:var(--text-muted);margin-bottom:.5rem;font-size:.85rem;font-weight:500}.qr-text{border:1px solid var(--border);background:var(--bg-muted);width:100%;color:var(--text-primary);resize:vertical;border-radius:14px;min-height:120px;padding:1rem 1.1rem;font-size:1rem;line-height:1.5;transition:border .2s,box-shadow .2s}.qr-text::placeholder{color:#a3a9c2bf}.qr-text:focus-visible{border-color:#6366f180;outline:none;box-shadow:0 0 0 4px #6366f126}.helper-row{justify-content:space-between;align-items:center;display:flex}.helper-text{color:var(--text-muted);font-size:.85rem}.btn-mini{border:1px solid var(--border-strong);color:var(--text-primary);cursor:pointer;background:0 0;border-radius:999px;padding:.4rem .9rem;font-size:.8rem;font-weight:500;line-height:1;transition:background .2s,border-color .2s}.btn-mini:hover,.btn-mini:focus-visible{background:#ffffff14;border-color:#ffffff52;outline:none}.grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem;display:grid}.control-block{background:var(--bg-muted);border:1px solid var(--border);border-radius:14px;flex-direction:column;gap:.75rem;padding:1rem;display:flex;position:relative}.color-row{align-items:center;gap:.75rem;display:flex}input[type=color]{appearance:none;cursor:pointer;background:var(--bg-panel);width:44px;height:44px;box-shadow:inset 0 0 0 1px var(--border);border:none;border-radius:12px;padding:0}input[type=color]::-webkit-color-swatch{border:none;border-radius:10px}input[type=color]::-webkit-color-swatch-wrapper{padding:4px}.color-value{color:var(--text-muted);letter-spacing:.05em;text-transform:uppercase;font-family:Inter,monospace;font-size:.9rem}.sizes{background:var(--bg-panel);border:1px solid var(--border);width:100%;color:var(--text-primary);cursor:pointer;border-radius:12px;padding:.75rem .9rem;font-size:.95rem;transition:border .2s,box-shadow .2s}.sizes:focus-visible{border-color:#0ea5e973;outline:none;box-shadow:0 0 0 4px #0ea5e926}.action-container{flex-wrap:wrap;gap:.9rem;display:flex}.btn{color:var(--text-primary);cursor:pointer;background:#ffffff14;border:1px solid #0000;border-radius:14px;align-items:center;gap:.6rem;min-width:max-content;padding:.85rem 1.1rem;font-size:.95rem;font-weight:500;transition:transform .2s,box-shadow .2s,background .2s,border .2s;display:inline-flex}.btn img{filter:invert();width:18px}.btn:hover,.btn:focus-visible{background:var(--accent-gradient);border-color:#0000;outline:none;transform:translateY(-1px);box-shadow:0 12px 25px #6366f133}.btn[disabled]{opacity:.4;cursor:not-allowed;box-shadow:none;background:#ffffff0d;transform:none}.btn-success{background:#22c55e40;border-color:#22c55e73;box-shadow:0 12px 25px #22c55e2e}.btn-success:hover,.btn-success:focus-visible{background:#22c55e59;border-color:#22c55ea6;box-shadow:0 16px 35px #22c55e40}.copy-btn{border-color:var(--border-strong);background:#ffffff0d}.copy-btn:hover,.copy-btn:focus-visible{background:#ffffff1f;border-color:#ffffff59}.sharing-hint{color:var(--text-muted);margin:0;font-size:.8rem}.panel-preview{text-align:center;flex-direction:column;align-items:stretch;gap:1.5rem;display:flex}.preview-header{color:var(--text-muted);text-transform:uppercase;letter-spacing:.08em;justify-content:space-between;align-items:center;font-size:.85rem;display:flex}.preview-label{font-weight:600}.preview-size{border:1px solid var(--border);color:var(--text-primary);background:#ffffff0f;border-radius:999px;padding:.35rem .65rem}.qr-code{background:#0f1117a6;border:1px dashed #ffffff14;border-radius:16px;place-items:center;min-height:320px;padding:1.5rem;display:grid}.qr-code img,.qr-code canvas{max-width:min(360px,100%);height:auto}.preview-helper{color:var(--text-muted);margin:0;font-size:.9rem}.notice{color:#fff6;text-align:center;font-size:.75rem}@media (width<=980px){.layout{grid-template-columns:1fr}.panel-preview{order:-1}.qr-code{min-height:280px}}@media (width<=640px){.page{gap:2.5rem;padding:3rem 0 2rem}.panel{padding:1.5rem}.grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (width<=480px){.grid{grid-template-columns:1fr}.action-container{flex-direction:column}.btn{justify-content:center;width:100%}}.credit{color:var(--text-muted);text-align:center;margin-top:auto;font-size:1rem}.credit a{color:var(--text-muted);text-decoration:none}.credit a:hover{text-decoration:underline}