:root{--bg: #0c0f14;--surface: #141a22;--border: #263041;--text: #e8edf4;--muted: #8b98a8;--accent: #ff0013;--accent-dim: #c40010;--success: #2ee59d;--radius: 12px;--font: "DM Sans", system-ui, sans-serif}*{box-sizing:border-box}body{margin:0;min-height:100vh;font-family:var(--font);background:radial-gradient(ellipse 120% 80% at 50% -20%,#1a2332 0%,var(--bg) 55%);color:var(--text);line-height:1.5}#app{max-width:480px;margin:0 auto;padding:2.5rem 1.25rem 3rem}h1{font-size:1.5rem;font-weight:700;margin:0 0 .35rem;letter-spacing:-.02em}.sub{color:var(--muted);font-size:.9rem;margin:0 0 1.75rem}.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:1.25rem 1.35rem;margin-bottom:1rem}.card h2{font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);margin:0 0 1rem}.role-card p.hint{margin-bottom:.65rem}.role-card p.hint:last-child{margin-bottom:0}.role-card strong{color:var(--text);font-weight:600}label{display:block;font-size:.8rem;font-weight:500;color:var(--muted);margin-bottom:.35rem}input[type=text],input[type=number]{width:100%;padding:.65rem .85rem;border-radius:8px;border:1px solid var(--border);background:var(--bg);color:var(--text);font-family:var(--font);font-size:.95rem;margin-bottom:1rem}select.field-select{width:100%;padding:.65rem .85rem;border-radius:8px;border:1px solid var(--border);background:var(--bg);color:var(--text);font-family:var(--font);font-size:.95rem;margin-bottom:1rem;cursor:pointer}select.field-select:focus{outline:none;border-color:#4a5d78}input:focus{outline:none;border-color:#4a5d78}input:disabled{opacity:.55}.row{display:flex;align-items:center;gap:.5rem;margin-bottom:1rem}.row input[type=checkbox]{width:1rem;height:1rem;accent-color:var(--accent)}.row label{margin:0;cursor:pointer}.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;width:100%;padding:.85rem 1rem;border:none;border-radius:8px;font-family:var(--font);font-size:.95rem;font-weight:600;cursor:pointer;transition:background .15s,transform .1s}.btn:active{transform:scale(.99)}.btn-primary{background:linear-gradient(180deg,var(--accent) 0%,var(--accent-dim) 100%);color:#fff}.btn-primary:hover:not(:disabled){filter:brightness(1.08)}.btn-primary:disabled{opacity:.45;cursor:not-allowed}.btn-ghost{background:transparent;color:var(--muted);border:1px solid var(--border);margin-top:.5rem}.btn-ghost:hover:not(:disabled){color:var(--text);border-color:#4a5d78}.status{font-size:.85rem;color:var(--muted);word-break:break-all;margin-top:.75rem;padding:.65rem .75rem;background:var(--bg);border-radius:8px;border:1px solid var(--border)}.status strong{color:var(--success);font-weight:600}.status.error strong{color:#ff6b6b}.hint{font-size:.75rem;color:var(--muted);margin-top:-.5rem;margin-bottom:1rem}.connect-hint{margin-top:.75rem;margin-bottom:0}.tx-link{color:var(--accent);text-decoration:none}.tx-link:hover{text-decoration:underline}.notice-banner{font-size:.85rem;color:var(--text);background:#2ee59d14;border:1px solid rgba(46,229,157,.25);border-radius:8px;padding:.65rem .85rem;margin-bottom:1rem;word-break:break-all}.notice-banner[hidden]{display:none!important}.share-url-wrap{margin-bottom:1rem}.share-url-wrap label{margin-bottom:.35rem}input.share-url-input{font-size:.8rem;font-family:ui-monospace,monospace;margin-bottom:.5rem;color:var(--muted)}.btn-inline-row{display:flex;gap:.5rem;margin-bottom:1rem}.btn-inline-row .btn{flex:1;margin-top:0}.btn-grid-merchant{display:grid;grid-template-columns:1fr 1fr;gap:.5rem;margin-bottom:1rem}.btn-grid-merchant .btn{margin-top:0}.btn-grid-merchant .btn:nth-child(3){grid-column:1 / -1}.qr-panel{margin-top:1rem;padding:1rem;border-radius:var(--radius);border:1px solid var(--border);background:var(--bg);text-align:center}.qr-panel-title{margin:0 0 .75rem;font-size:.85rem;font-weight:600;color:var(--text)}.qr-box{display:inline-block;padding:.75rem;background:#fff;border-radius:8px;line-height:0}.qr-box img{display:block;max-width:100%;height:auto}.qr-panel-hint{margin:.75rem 0 0;text-align:left}.btn-secondary{background:var(--surface);color:var(--text);border:1px solid var(--border)}.btn-secondary:hover:not(:disabled){border-color:#4a5d78;color:var(--text)}
