/* app.css source lines: 421-444 — role picker
   V2: former dead .rp-* markup styles replaced — the live template's inline
   styles were relocated here, Mineral tokens only (both themes via tokens). */
/* ── ROLE PICKER ─────────────────────────────────── */
.rp-hero{position:relative;overflow:hidden;margin:-32px -72px 0;padding:40px 72px 36px;background:linear-gradient(135deg,var(--bg-solid) 0%,var(--surf) 55%,var(--bg-solid) 100%)}
.rp-hero::before{content:"";position:absolute;top:-40px;right:-40px;width:200px;height:200px;border-radius:50%;background:radial-gradient(circle,var(--accent-glow) 0%,transparent 70%);pointer-events:none}
.rp-hero-inner{max-width:520px;position:relative}
.rp-co{font-size:var(--fs-12);font-weight:700;text-transform:uppercase;letter-spacing:.12em;color:var(--link-strong);margin-bottom:8px}
.rp-h2{font-size:26px;font-weight:700;color:var(--tx);margin:0 0 5px;letter-spacing:-.02em}
.rp-lead{font-size:14px;color:var(--mt);margin:0}
.rp-list-wrap{max-width:520px;margin:0 auto;padding:32px 24px}
.rp-list{display:flex;flex-direction:column;gap:12px}
.rp-opt{background:var(--bg2);border:1px solid var(--bord);border-radius:var(--r-card);padding:20px 22px;cursor:pointer;display:flex;align-items:center;gap:16px;transition:background var(--dur-2),border-color var(--dur-2),box-shadow var(--dur-2)}
.rp-opt--rec{border-color:var(--bord-bright)}
.rp-ico{width:46px;height:46px;border-radius:var(--r-sm);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.rp-ico--gp{background:var(--info-dim)}
.rp-ico--mg{background:var(--copper-dim)}
.rp-ico--pv{background:var(--ok-dim)}
.rp-body{flex:1;min-width:0}
.rp-title-row{display:flex;align-items:center;gap:8px;margin-bottom:3px}
.rp-t{font-size:15px;font-weight:700;color:var(--tx)}
.rp-card-t{font-size:15px;font-weight:700;color:var(--tx);margin-bottom:3px}
.rp-d{font-size:13px;color:var(--tx2)}
.rp-chip{font-size:var(--fs-12);background:var(--info-dim);color:var(--info-strong);padding:2px 9px;border-radius:var(--r-pill);font-weight:600}
/* SVG glyphs: CSS stroke beats presentation attributes; chevron keeps its
   existing stroke="var(--mt)" attribute. */
.rp-glyph--info{stroke:var(--info)}
.rp-glyph--copper{stroke:var(--copper)}
.rp-glyph--ok{stroke:var(--ok)}