:root{--bg: #ffffff;--bg-panel: #f3f4f6;--text: #1f2937;--text-muted: #6b7280;--primary: #2563eb;--primary-hover: #1d4ed8;--border: #e5e7eb;--s-1: .25rem;--s-2: .5rem;--s-3: 1rem;--s-4: 1.5rem;--radius: 8px;--font-main: system-ui, -apple-system, sans-serif}body.dark{--bg: #111827;--bg-panel: #1f2937;--text: #f9fafb;--text-muted: #9ca3af;--border: #374151}body{margin:0;font-family:var(--font-main);background-color:var(--bg);color:var(--text);transition:background-color .3s,color .3s}.container{max-width:600px;margin:0 auto;padding:var(--s-3)}.flex{display:flex}.f-col{flex-direction:column}.f-row{flex-direction:row}.jcc{justify-content:center}.aic{align-items:center}.jsb{justify-content:space-between}.g-2{gap:var(--s-2)}.g-3{gap:var(--s-3)}.w-full{width:100%}.hidden{display:none!important}.h1{font-size:1.5rem;font-weight:700;margin:0}.h2{font-size:1.25rem;font-weight:600;margin:0}.small{font-size:.875rem;color:var(--text-muted)}.card{background:var(--bg-panel);border:1px solid var(--border);border-radius:var(--radius);padding:var(--s-4)}.input{width:100%;padding:var(--s-2);border-radius:var(--radius);border:1px solid var(--border);background:var(--bg);color:var(--text);box-sizing:border-box}.btn{padding:var(--s-2) var(--s-3);border-radius:var(--radius);border:none;cursor:pointer;font-weight:500;background:var(--bg-panel);color:var(--text);border:1px solid var(--border)}.btn-primary{background:var(--primary);color:#fff;border:none}.btn-primary:hover{background:var(--primary-hover)}.qr-container{background:#fff;padding:var(--s-3);border-radius:var(--radius);display:flex;justify-content:center}