/* Usuarios (R-02): CSS movido desde el <style> inline del componente a un modulo global
   (patron de tareas.css/pqrs.css). Enlazado en App.razor. Reglas identicas; @@->@ desescapado. */
    /* Tabs simples Activos/Pendientes/Inactivos (reemplazan las tarjetas KPI que hacian de tabs). */
    .usr-tabs { display: flex; gap: 6px; margin-bottom: 16px; border-bottom: 1px solid var(--propia-border-card); }
    .usr-tab { padding: 9px 16px; border: 0; background: transparent; color: var(--propia-text-muted); font-size: 14px; font-weight: 600; cursor: pointer; font-family: inherit; border-bottom: 2px solid transparent; margin-bottom: -1px; }
    .usr-tab:hover { color: var(--propia-brand, var(--propia-brand)); }
    .usr-tab.active { color: var(--propia-brand, var(--propia-brand)); border-bottom-color: var(--propia-brand, var(--propia-brand)); }
    .usr-wrap { width:100%; max-width:1900px; margin:0 auto; padding:6px 28px 60px; box-sizing:border-box; }
    .usr-head { display:flex; align-items:flex-start; justify-content:space-between; gap:20px; margin-bottom:20px; flex-wrap:wrap; }
    .usr-title { font-size:27px; font-weight:800; letter-spacing:-.6px; color:var(--propia-text-h1); margin:0; }
    .usr-sub { font-size:14px; color:var(--propia-text-muted); margin-top:4px; margin-bottom:0; }

    .usr-btn-primary { display:inline-flex; align-items:center; gap:7px; padding:10px 16px; border-radius:10px; background:var(--propia-brand); color: var(--propia-text-inverse); font-size:13px; font-weight:700; border:none; box-shadow:0 6px 16px rgba(109,79,227,.3); cursor:pointer; }
    .usr-btn-primary:hover { background:var(--propia-brand-hover); }
    .usr-btn-primary:disabled { opacity:.55; cursor:default; box-shadow:none; }
    .usr-btn-ghost { display:inline-flex; align-items:center; gap:7px; padding:10px 15px; border-radius:10px; border:1px solid var(--propia-border-card); background:var(--propia-bg-card); font-size:13px; font-weight:600; color:var(--propia-text-secondary); cursor:pointer; }
    .usr-btn-ghost:hover { border-color:var(--propia-text-faint); color:var(--propia-text-body); }

    .usr-stats { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:18px; }
    .usr-stat { background:var(--propia-bg-card); border:1px solid var(--propia-border-card); border-radius:14px; padding:18px; box-shadow:0 1px 2px rgba(45,62,80,.05); cursor:pointer; transition:border-color .15s, box-shadow .15s; }
    .usr-stat:hover { border-color:var(--propia-text-faint); }
    .usr-stat.active { border-color:var(--propia-brand); box-shadow:0 0 0 1px var(--propia-brand); }
    .usr-stat-label { display:flex; align-items:center; gap:7px; font-size:12px; font-weight:700; color:var(--propia-text-muted); }
    .usr-dot { width:8px; height:8px; border-radius:50%; display:inline-block; }
    .usr-stat-num { font-size:30px; font-weight:800; color:var(--propia-text-h1); letter-spacing:-1px; margin-top:5px; }

    .usr-tabs { display:flex; align-items:center; gap:8px; border-bottom:1px solid var(--propia-border-card); }
    .usr-tab { padding:11px 4px; margin-right:18px; font-size:14px; font-weight:700; color:var(--propia-text-faint); border:none; background:none; border-bottom:2.5px solid transparent; cursor:pointer; }
    .usr-tab.active { color:var(--propia-brand); border-bottom-color:var(--propia-brand); }

    .usr-search { width:100%; max-width:380px; border:1px solid var(--propia-border-card); border-radius:9px; padding:9px 12px; font-size:13.5px; color:var(--propia-text-body); outline:none; background:var(--propia-bg-card); margin:14px 0; }
    .usr-search:focus { border-color:var(--propia-brand); }
    /* Toolbar de filtros + vista (2.5.C) */
    .usr-toolbar2 { display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin:14px 0; }
    .usr-toolbar2 .usr-search { margin:0; flex:1 1 320px; }
    .usr-fsel { border:1px solid var(--propia-border-card); border-radius:9px; padding:9px 12px; font-size:13px; color:var(--propia-text-body); background:var(--propia-bg-card); outline:none; cursor:pointer; }
    .usr-fsel:focus { border-color:var(--propia-brand); }
    /* Toggle de vista: mismo lenguaje que el del Directorio (texto + icono). */
    .usr-viewtoggle { display:inline-flex; gap:2px; background:var(--propia-border-divider); border-radius:9px; padding:3px; margin-left:auto; }
    .usr-vbtn { display:inline-flex; align-items:center; gap:5px; border:0; background:transparent; color:var(--propia-text-muted); font-size:12.5px; font-weight:600; padding:5px 11px; border-radius:7px; cursor:pointer; font-family:inherit; }
    .usr-vbtn.on { background:var(--propia-bg-card); color:var(--propia-brand); box-shadow:0 1px 3px rgba(27,42,58,.12); }
    /* Avatares con foto */
    .usr-av-img { object-fit:cover; border-radius:11px; }
    .usr-av-edit { position:relative; width:64px; height:64px; flex-shrink:0; }
    .usr-av-cam { position:absolute; right:-4px; bottom:-4px; width:24px; height:24px; border-radius:50%; background:var(--propia-brand); color: var(--propia-text-inverse); display:flex; align-items:center; justify-content:center; cursor:pointer; border:2px solid var(--propia-bg-card); box-shadow:0 1px 3px rgba(45,62,80,.25); }

    /* ---- Vista Tabla (utb-*): la usa UsuariosTablaVista. Vive aqui, en la pagina, y no
       en el componente: los estilos declarados dentro de un componente solo estan en el
       DOM mientras ese componente se renderiza. ---- */
    .utb-scroll { overflow-x:auto; }
    /* Ajustado para que la fila entera (incluido el "+" de confirmar) quepa sin scroll
       horizontal en una pantalla normal; con menos ancho, .utb-scroll se encarga. */
    .utb-grid { display:grid; grid-template-columns:186px 1.3fr 1.5fr .9fr 118px 132px 88px 34px; align-items:center; gap:8px; padding:8px 14px; min-width:1040px; }
    .utb-head { background:var(--propia-bg-table-head); font-size:11px; font-weight:700; color:var(--propia-text-faint); letter-spacing:.4px; border-bottom:1px solid var(--propia-border-divider); }
    .utb-row { border-bottom:1px solid var(--propia-border-divider); font-size:13px; color:var(--propia-text-body); }
    .utb-row:hover { background:var(--propia-bg-card-soft); }
    .utb-c { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
    .utb-link { border:0; background:transparent; text-align:left; padding:0; font-size:13px; font-weight:600; color:var(--propia-brand); cursor:pointer; font-family:inherit; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
    .utb-link:hover { text-decoration:underline; }
    .utb-badge { font-size:11px; font-weight:600; color:var(--propia-text-secondary); background:var(--propia-border-divider); padding:2px 8px; border-radius:6px; }
    .utb-badge--ok { color:var(--propia-success-hover); background:var(--propia-ok-soft); }
    .utb-act { display:flex; justify-content:flex-end; }
    .utb-icon { width:26px; height:26px; display:flex; align-items:center; justify-content:center; padding:0; border:0; border-radius:7px; background:transparent; color:#94A9BF; cursor:pointer; }
    .utb-icon:hover { background:var(--propia-brand-soft); color:var(--propia-brand); }
    /* Fila de alta: una fila mas de la tabla; solo se tine al enfocarla (como en Tareas). */
    .utb-newrow { background:#FCFDFF; }
    .utb-newrow:focus-within { background:var(--propia-brand-soft-2); }
    .utb-nf-nombre { display:grid; grid-template-columns:1fr 1fr; gap:6px; min-width:0; }
    .utb-nf-mut { color:var(--propia-text-faint); font-size:12px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
    .utb-inp { width:100%; box-sizing:border-box; border:1px dashed var(--propia-border-input); border-radius:7px; padding:5px 8px; font-size:12.5px; color:var(--propia-text-body); outline:none; background:var(--propia-bg-card); font-family:inherit; }
    .utb-inp:focus { border-style:solid; border-color:var(--propia-brand); box-shadow:0 0 0 2px rgba(109,79,227,.12); }
    .utb-inp-tipo { width:62px; flex-shrink:0; }
    /* El "+" del inicio es lo que anuncia que la fila es de alta; sin el se lee como filtro. */
    .utb-nf-first { display:flex; align-items:center; gap:6px; min-width:0; }
    .utb-nf-plus { flex-shrink:0; color:#B7A6F0; font-size:15px; font-weight:700; }
    /* Confirmar: se pinta solo cuando la fila ya es valida; antes seria ruido. */
    .utb-add { width:26px; height:26px; padding:0; line-height:1; display:flex; align-items:center; justify-content:center; border:0; border-radius:7px; background:var(--propia-brand); color: var(--propia-text-inverse); font-size:17px; font-weight:700; cursor:pointer; font-family:inherit; }
    .utb-add:hover:not(:disabled) { filter:brightness(1.08); }
    .utb-add:disabled { background:transparent; color:#D9E0E8; cursor:default; }

    .usr-table { background:var(--propia-bg-card); border:1px solid var(--propia-border-card); border-radius:14px; box-shadow:0 1px 2px rgba(45,62,80,.05); overflow:hidden; }
    .usr-th { display:flex; align-items:center; gap:14px; padding:11px 18px; border-bottom:1px solid var(--propia-border-divider); background:var(--propia-bg-table-head); font-size:11px; letter-spacing:.4px; font-weight:700; color:var(--propia-text-faint); }
    .usr-row { display:flex; align-items:center; gap:14px; padding:13px 18px; border-bottom:1px solid var(--propia-border-divider); }
    .usr-row:last-child { border-bottom:none; }
    .usr-av { width:42px; height:42px; border-radius:11px; background:linear-gradient(135deg,var(--propia-brand),var(--propia-brand-hover)); color: var(--propia-text-inverse); display:flex; align-items:center; justify-content:center; font-size:14px; font-weight:700; flex-shrink:0; }
    .usr-name { font-size:14px; font-weight:700; color:var(--propia-text-body); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
    .usr-email { font-size:12px; color:var(--propia-text-faint); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
    .usr-rol { font-size:12px; font-weight:700; color:var(--propia-brand); background:var(--propia-brand-soft); border:1px solid var(--propia-brand-border); padding:4px 11px; border-radius:7px; }

    /* Modal de usuario: 2 columnas (izq = quien es y su rol; der = donde participa).
       El ancho se declara junto a .usr-modal (mas abajo) porque esa regla lo pisaria. */
    .usr-mgrid { display:grid; grid-template-columns:1fr 1fr; gap:22px; align-items:start; }
    .usr-mcol { min-width:0; }
    @media (max-width: 820px) { .usr-mgrid { grid-template-columns:1fr; gap:0; } }
    /* === Movil: modales (invitar/editar usuario) a pantalla completa === */
    @media (max-width: 640px) {
        .usr-modal-bg { padding: 0; }
        .usr-modal, .usr-modal-wide, .usr-modal-user { width: 100%; max-width: 100%; min-height: 100dvh; max-height: 100dvh; border-radius: 0; }
    }

    /* Etiquetas de usuario (2.5) - se administran dentro del modal del usuario */
    .usr-etq-disp-t { font-size:11px; font-weight:700; color:var(--propia-text-faint); letter-spacing:.3px; margin-bottom:6px; }
    .usr-etq-off { display:inline-flex; align-items:center; border:1px dashed var(--propia-brand-border); border-radius:20px; background:var(--propia-bg-card); overflow:hidden; }
    .usr-etq-pick2 { display:inline-flex; align-items:center; gap:6px; border:0; background:transparent; font-size:11.5px; font-weight:700; color:var(--propia-text-secondary); padding:3px 8px 3px 9px; cursor:pointer; font-family:inherit; }
    .usr-etq-pick2:hover:not(:disabled) { background:var(--propia-brand-soft-2); color:var(--propia-brand); }
    .usr-etq-del { border:0; background:transparent; color:#C8D4DF; cursor:pointer; font-size:14px; line-height:1; padding:0 7px 0 3px; }
    .usr-etq-del:hover:not(:disabled) { color:var(--propia-error); }
    .usr-etq-list { display:flex; flex-wrap:wrap; gap:7px; margin-bottom:12px; }
    .usr-etq-empty { font-size:12px; color:var(--propia-text-faint); }
    .usr-etq-chip { display:inline-flex; align-items:center; gap:5px; font-size:11.5px; font-weight:700; padding:3px 9px; border-radius:20px; border:1px solid; }
    .usr-etq-chip-sm { font-size:10.5px; padding:2px 8px; }
    .usr-etq-x { border:0; background:transparent; color:inherit; opacity:.6; cursor:pointer; font-size:14px; line-height:1; padding:0; }
    .usr-etq-x:hover { opacity:1; }
    .usr-etq-form { display:flex; align-items:center; gap:8px; }
    .usr-etq-in { flex:1; max-width:260px; border:1px solid var(--propia-border-card); border-radius:9px; padding:8px 11px; font-size:13px; color:var(--propia-text-body); outline:none; }
    .usr-etq-in:focus { border-color:var(--propia-brand); }
    .usr-etq-color { width:38px; height:36px; border:1px solid var(--propia-border-card); border-radius:9px; background:var(--propia-bg-card); cursor:pointer; padding:2px; }
    .usr-etq-add { padding:8px 16px; }
    .usr-etq-row { display:flex; flex-wrap:wrap; align-items:center; gap:5px; margin-top:5px; }
    .usr-etq-addwrap { position:relative; display:inline-flex; }
    .usr-etq-plus { width:20px; height:20px; border-radius:50%; border:1px dashed var(--propia-text-faint); background:var(--propia-bg-card); color:var(--propia-text-muted); font-size:13px; line-height:1; cursor:pointer; display:inline-flex; align-items:center; justify-content:center; }
    .usr-etq-plus:hover { border-color:var(--propia-brand); color:var(--propia-brand); }
    .usr-etq-picker { position:absolute; top:24px; left:0; z-index:20; background:var(--propia-bg-card); border:1px solid var(--propia-border-card); border-radius:10px; box-shadow:0 8px 24px rgba(45,62,80,.15); padding:5px; min-width:150px; max-height:220px; overflow-y:auto; }
    .usr-etq-pick { display:flex; align-items:center; gap:7px; width:100%; text-align:left; border:0; background:transparent; padding:6px 8px; border-radius:7px; font-size:12px; color:var(--propia-text-body); cursor:pointer; }
    .usr-etq-pick:hover { background:var(--propia-brand-soft-2); }
    .usr-etq-dot { width:9px; height:9px; border-radius:50%; flex-shrink:0; }
    /* Tags de gobierno (2.5.1) en la lista */
    .usr-gob-tag { display:inline-flex; align-items:center; font-size:10.5px; font-weight:700; padding:2px 8px; border-radius:20px; color:var(--propia-warning); background:var(--propia-warn-soft); border:1px solid #FCE7A3; }
    /* Seccion Gobierno dentro del modal Editar (2.5.1) */
    .usr-gob-sec { margin:6px 0 18px; }
    .usr-gob-sec-t { font-size:11px; font-weight:800; letter-spacing:.5px; color:#7A8DA0; margin-bottom:2px; }
    .usr-gob-sec-hint { font-size:12px; color:var(--propia-text-faint); line-height:1.4; margin-bottom:10px; }
    .usr-gob-card { border:1.5px solid var(--propia-border-divider); border-radius:12px; padding:11px 13px; margin-bottom:9px; transition:border-color .15s, background .15s; }
    .usr-gob-card.on { border-color:#B9E0C9; background:#F4FBF7; }
    .usr-gob-card-h { display:flex; align-items:center; gap:8px; }
    .usr-gob-card-name { font-size:13.5px; font-weight:700; color:var(--propia-text-body); }
    .usr-gob-badge { font-size:10px; font-weight:800; padding:1px 8px; border-radius:20px; color:var(--propia-success-hover); background:#DBF3E5; }
    .usr-gob-tagrow { display:flex; flex-wrap:wrap; align-items:center; gap:6px; margin-top:9px; }
    .usr-gob-tag2 { display:inline-flex; align-items:center; gap:4px; font-size:12px; font-weight:700; padding:3px 10px; border-radius:20px; color:#0F6E43; background:#E4F6EC; border:1px solid #BEE7CE; }
    .usr-gob-x2 { border:none; background:transparent; color:var(--propia-success-hover); font-size:15px; line-height:1; cursor:pointer; padding:0 0 0 2px; }
    .usr-gob-x2:disabled { opacity:.4; cursor:default; }
    .usr-gob-quitar { margin-left:auto; border:1px solid var(--propia-border-divider); background:var(--propia-bg-card); color:#C0392B; font-size:11.5px; font-weight:700; padding:3px 12px; border-radius:8px; cursor:pointer; }
    .usr-gob-quitar:disabled { opacity:.5; cursor:default; }
    .usr-gob-form { display:flex; gap:8px; margin-top:9px; }
    .usr-gob-in { flex:1 1 auto; min-width:0; border:1px solid var(--propia-border-divider); border-radius:8px; padding:7px 10px; font-size:13px; color:var(--propia-text-body); background:var(--propia-bg-card); }
    .usr-gob-add { flex:0 0 auto; border:none; background:#1E88E5; color: var(--propia-text-inverse); font-size:12.5px; font-weight:700; padding:7px 14px; border-radius:8px; cursor:pointer; }
    .usr-gob-add:disabled { opacity:.5; cursor:default; }
    .usr-gob-note { font-size:12px; color:var(--propia-text-faint); margin-top:8px; font-style:italic; }
    /* Chips de tablero (2.5.D) */
    .usr-tab-chip { display:inline-flex; align-items:center; gap:6px; font-size:12px; font-weight:700; padding:3px 8px 3px 10px; border-radius:20px; color:var(--propia-text-body); background:var(--propia-border-divider); border:1px solid var(--propia-border-divider); }
    .usr-tab-dot { width:9px; height:9px; border-radius:50%; flex-shrink:0; }
    .usr-tab-link { color:var(--propia-text-body); text-decoration:none; }
    .usr-tab-link:hover { text-decoration:underline; }
    .usr-tab-n { font-size:10px; font-weight:800; color:#7A8DA0; background:var(--propia-border-divider); border-radius:10px; padding:0 6px; }
    /* Directorio (2.5.E) */
    .usr-nodir { display:inline-flex; align-items:center; font-size:10px; font-weight:800; padding:2px 8px; border-radius:20px; color:var(--propia-warning); background:var(--propia-bg-card)4E0; border:1px solid #FBD9A0; }
    .usr-dir-box { display:flex; align-items:center; gap:12px; border:1.5px solid var(--propia-border-divider); border-radius:12px; padding:12px 14px; margin:6px 0 16px; }
    .usr-dir-box.on { border-color:#B9E0C9; background:#F4FBF7; }
    .usr-dir-ico { width:38px; height:38px; border-radius:10px; background:var(--propia-border-divider); color:var(--propia-text-secondary); display:flex; align-items:center; justify-content:center; flex-shrink:0; }
    .usr-dir-box.on .usr-dir-ico { background:#DBF3E5; color:var(--propia-success-hover); }
    .usr-badge-pend { font-size:11px; font-weight:700; color:var(--propia-warning); background:var(--propia-warn-soft); padding:4px 10px; border-radius:7px; }
    .usr-badge-inact { font-size:11px; font-weight:700; color:var(--propia-text-faint); background:var(--propia-border-divider); padding:4px 10px; border-radius:7px; }
    .usr-rowbtn { display:inline-flex; align-items:center; gap:6px; padding:7px 12px; border-radius:8px; color:var(--propia-brand); border:1px solid var(--propia-brand-border); background:var(--propia-bg-card); font-size:12px; font-weight:700; cursor:pointer; white-space:nowrap; }
    .usr-rowbtn:hover { background:var(--propia-brand-soft); }
    .usr-rowbtn-danger { color:var(--propia-error-strong); border-color:#F3C9CB; }
    .usr-rowbtn-danger:hover { background:#FBEBEC; }
    .usr-empty { background:var(--propia-bg-card); border:1px solid var(--propia-border-card); border-radius:14px; padding:34px; text-align:center; color:var(--propia-text-muted); font-size:13.5px; }
    .min-w-0 { min-width:0; }

    /* Modales */
    .usr-modal-bg { position:fixed; inset:0; z-index:1080; background:rgba(27,42,58,.55); display:flex; align-items:flex-start; justify-content:center; padding:40px 20px; overflow-y:auto; }
    .usr-modal { width:560px; max-width:100%; background:var(--propia-bg-card); border-radius:18px; box-shadow:0 30px 70px rgba(27,42,58,.4); margin:auto; overflow:hidden; display:flex; flex-direction:column; max-height:88vh; }
    .usr-modal-wide { width:880px; }
    .usr-modal-user { width:900px; max-width:96vw; }
    .usr-modal-head { display:flex; align-items:flex-start; gap:13px; padding:20px 24px; border-bottom:1px solid var(--propia-border-divider); flex-shrink:0; }
    .usr-modal-ico { width:38px; height:38px; border-radius:10px; background:var(--propia-brand-soft); color:var(--propia-brand); display:flex; align-items:center; justify-content:center; flex-shrink:0; }
    .usr-modal-title { font-size:16px; font-weight:800; letter-spacing:-.3px; color:var(--propia-text-h1); }
    .usr-modal-subtitle { font-size:12.5px; color:var(--propia-text-muted); }
    .usr-modal-x { width:34px; height:34px; border-radius:9px; display:flex; align-items:center; justify-content:center; color:var(--propia-text-muted); border:1px solid var(--propia-border-card); background:var(--propia-bg-card); cursor:pointer; flex-shrink:0; }
    .usr-modal-x:hover { background:var(--propia-bg-app); color:var(--propia-text-body); }
    .usr-modal-body { overflow-y:auto; padding:22px 24px; }
    .usr-modal-foot { display:flex; justify-content:flex-end; gap:8px; padding:16px 24px; border-top:1px solid var(--propia-border-divider); flex-shrink:0; }
    .usr-label { font-size:11px; color:var(--propia-text-muted); font-weight:700; display:block; margin-bottom:5px; }
    .usr-input, .usr-select { width:100%; border:1px solid var(--propia-border-card); border-radius:9px; padding:10px 12px; font-size:13.5px; color:var(--propia-text-body); outline:none; background:var(--propia-bg-card); }
    .usr-input:focus, .usr-select:focus { border-color:var(--propia-brand); }
    .usr-input:disabled { background:var(--propia-bg-app); color:var(--propia-text-muted); }

    .usr-results { border:1px solid var(--propia-border-card); border-radius:11px; margin-top:10px; overflow:hidden; max-height:220px; overflow-y:auto; }
    .usr-result { display:flex; align-items:center; gap:10px; width:100%; text-align:left; padding:10px 13px; border:none; border-bottom:1px solid var(--propia-border-divider); background:var(--propia-bg-card); cursor:pointer; }
    .usr-result:last-child { border-bottom:none; }
    .usr-result:hover { background:var(--propia-bg-app); }
    .usr-hint { font-size:12.5px; color:var(--propia-text-faint); line-height:1.55; margin-top:14px; padding:12px 14px; background:var(--propia-bg-app); border-radius:10px; border:1px dashed var(--propia-border-input); }
    .usr-rolcfg { border:1px solid var(--propia-border-card); border-radius:12px; padding:14px 16px; margin-bottom:16px; background:#FCFDFE; display:flex; flex-direction:column; gap:12px; }
    .usr-rolcfg-row { display:flex; gap:12px; align-items:flex-end; }
    .usr-rolcfg-seed { border-top:1px solid var(--propia-border-divider); padding-top:12px; display:flex; flex-direction:column; gap:8px; }
    .usr-facetas { display:flex; flex-wrap:wrap; gap:7px; }
    .usr-faceta { border:1px solid var(--propia-brand-border); background:var(--propia-bg-card); color:var(--propia-brand); border-radius:20px; padding:6px 14px; font-size:12.5px; font-weight:700; cursor:pointer; }
    .usr-faceta.on { background:var(--propia-brand); border-color:var(--propia-brand); color: var(--propia-text-inverse); }
    .usr-seedchk { display:flex; align-items:center; gap:8px; font-size:12.5px; color:var(--propia-text-secondary); font-weight:600; cursor:pointer; margin-top:2px; }
    .usr-seedchk input { width:16px; height:16px; accent-color:var(--propia-brand); }
    .usr-seedchk em { color:var(--propia-text-faint); font-style:normal; }
    .usr-pick { border:1px solid var(--propia-brand-border); background:var(--propia-brand-soft-2); border-radius:12px; padding:14px 16px; margin-top:14px; }
    .usr-note { font-size:11.5px; color:var(--propia-brand-hover); margin-top:11px; display:flex; align-items:center; gap:6px; }
    .usr-link-ok { background:var(--propia-ok-soft); border:1px solid var(--propia-success-border); border-radius:11px; padding:13px 15px; margin-top:16px; font-size:12.5px; }

    .usr-security { margin-top:18px; border-top:1px solid var(--propia-border-divider); padding-top:16px; }
    .usr-sec-label { font-size:11px; letter-spacing:.5px; color:var(--propia-text-faint); font-weight:700; margin-bottom:10px; }
    .usr-sec-box { border:1px solid var(--propia-border-card); border-radius:11px; padding:13px 15px; }
    .usr-sec-ico { width:36px; height:36px; border-radius:9px; background:#FBEBEC; color:var(--propia-error-strong); display:flex; align-items:center; justify-content:center; flex-shrink:0; }

    /* Roles */
    .usr-rolecard { display:flex; align-items:center; gap:12px; border:1px solid var(--propia-border-card); border-radius:11px; padding:12px 15px; }
    .usr-rolecard-off { opacity:.6; }
    .usr-ext-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:8px; }
    .usr-count { font-size:11px; font-weight:600; color:var(--propia-text-muted); background:var(--propia-bg-app); border:1px solid var(--propia-border-card); padding:3px 9px; border-radius:6px; white-space:nowrap; }
    .usr-link-btn { font-size:12px; font-weight:700; color:var(--propia-brand); background:var(--propia-brand-soft); border:1px solid var(--propia-brand-border); padding:6px 11px; border-radius:8px; cursor:pointer; white-space:nowrap; }
    .usr-link-btn:hover { background:var(--propia-brand-border); }
    .usr-newrole-btn { display:flex; align-items:center; justify-content:center; gap:8px; width:100%; border:1px dashed var(--propia-brand-border); border-radius:11px; padding:13px; font-size:13px; font-weight:700; color:var(--propia-brand); background:var(--propia-brand-soft-2); cursor:pointer; }
    .usr-newrole-btn:hover { background:var(--propia-brand-soft-2); }
    .usr-newrole { border:1px solid var(--propia-brand-border); border-radius:12px; padding:16px; background:var(--propia-brand-soft-2); }

    .usr-matrix { border:1px solid var(--propia-border-card); border-radius:12px; overflow:hidden; }
    .usr-matrix-head { display:flex; align-items:center; padding:10px 14px; background:var(--propia-bg-table-head); border-bottom:1px solid var(--propia-border-divider); }
    .usr-matrix-row { display:flex; align-items:center; padding:9px 14px; border-bottom:1px solid var(--propia-border-divider); }
    .usr-matrix-row:last-child { border-bottom:none; }
    .usr-matrix-mod { flex:1; font-size:13px; font-weight:600; color:var(--propia-text-body); }
    .usr-matrix-col { width:62px; flex-shrink:0; text-align:center; font-size:10.5px; letter-spacing:.3px; font-weight:700; color:var(--propia-text-faint); }
    .usr-cell { width:62px; flex-shrink:0; display:flex; justify-content:center; }
    .usr-chk { width:24px; height:24px; border-radius:7px; display:flex; align-items:center; justify-content:center; border:1.5px solid var(--propia-border-card); background:var(--propia-bg-card); color:transparent; cursor:pointer; padding:0; }
    .usr-chk.on { border-color:var(--propia-brand); background:var(--propia-brand); color: var(--propia-text-inverse); }