@layer components {
  .access-settings{display:grid;gap:21px;margin-top:21px}
  .access-panel{min-width:0}
  .access-panel .panel-heading{flex-wrap:wrap}
  .access-actions{display:flex;gap:8px;flex-wrap:wrap}
  .access-table{font-variant-numeric:tabular-nums}
  .access-table .access-grants{min-width:220px;max-width:420px;white-space:normal;overflow-wrap:anywhere}
  .access-table .access-reason{min-width:190px;max-width:330px;white-space:normal;overflow-wrap:anywhere}
  .access-permissions{margin:3px 0 0;padding:17px;border:1px solid var(--line);border-radius:4px;min-width:0}
  .access-permissions legend{font-size:12px;padding:0 6px;font-weight:600}
  .access-permissions>p{font-size:11px;line-height:1.7;margin-bottom:17px}
  .access-active>span:nth-child(2){display:flex;align-items:center;gap:8px;min-height:38px;font-size:12px}
  .access-active input{accent-color:var(--accent)}
  .workspace-user .workspace-user-copy{min-width:0;flex:1}
  .workspace-user .workspace-user-name,.workspace-user .workspace-user-copy small{display:block;overflow-wrap:anywhere}
  .workspace-user .workspace-logout{border:1px solid #ffffff20;border-radius:4px;padding:6px;color:#d5e0d9;flex-shrink:0}
  .workspace-user .workspace-logout:hover{background:#ffffff0f}
  .workspace-user .workspace-logout svg{width:16px;height:16px}
}
@layer responsive {
  @media(max-width:600px){
    .access-settings{gap:15px;margin-top:15px}
    .access-actions{width:100%}
    .access-permissions{padding:12px}
  }
}