/* V5.8.8.11 · Panel General JO: menos teoría, más lectura inmediata */
.app.profile-jo #rolePortalContent .joPanel58811{
  display:grid;gap:14px
}
.app.profile-jo #rolePortalContent .joHero58811{
  display:flex;justify-content:space-between;gap:18px;align-items:flex-start;
  padding:2px 2px 8px
}
.app.profile-jo #rolePortalContent .joHero58811 small{
  display:block;color:#55dff8;font-size:9px;font-weight:900;
  letter-spacing:.13em;text-transform:uppercase;margin-bottom:5px
}
.app.profile-jo #rolePortalContent .joHero58811 h2{
  margin:0;font-size:27px;line-height:1.05;color:#f4fbff
}
.app.profile-jo #rolePortalContent .joHero58811 p{
  margin:5px 0 0;color:#89a9ba;font-size:10px
}
.app.profile-jo #rolePortalContent .joKpis58811{
  display:grid;grid-template-columns:repeat(4,1fr);gap:10px
}
.app.profile-jo #rolePortalContent .joKpi58811{
  min-height:92px;padding:13px 14px;border-radius:15px;
  border:1px solid rgba(90,220,248,.14);
  background:linear-gradient(180deg,rgba(13,48,80,.94),rgba(9,34,58,.94))
}
.app.profile-jo #rolePortalContent .joKpi58811 small{
  color:#789aaa;font-size:8px;text-transform:uppercase;letter-spacing:.09em
}
.app.profile-jo #rolePortalContent .joKpi58811 b{
  display:block;margin-top:7px;font-size:25px;color:#f3fbff
}
.app.profile-jo #rolePortalContent .joKpi58811 span{
  display:block;margin-top:4px;color:#8da9b8;font-size:9px
}
.app.profile-jo #rolePortalContent .joMain58811{
  display:grid;grid-template-columns:minmax(0,1.55fr) minmax(300px,.75fr);gap:12px
}
.app.profile-jo #rolePortalContent .joCard58811{
  border:1px solid rgba(90,220,248,.13);border-radius:16px;
  background:linear-gradient(180deg,rgba(12,43,73,.94),rgba(8,31,54,.94));
  padding:15px
}
.app.profile-jo #rolePortalContent .joCardHead58811{
  display:flex;justify-content:space-between;align-items:flex-start;gap:12px;
  margin-bottom:12px
}
.app.profile-jo #rolePortalContent .joCardHead58811 h3{
  margin:0;font-size:14px;color:#f2f9ff
}
.app.profile-jo #rolePortalContent .joCardHead58811 p{
  margin:3px 0 0;font-size:9px;color:#7f9dac
}
.app.profile-jo #rolePortalContent .joState58811{
  padding:5px 9px;border-radius:999px;font-size:8px;
  border:1px solid rgba(75,229,174,.28);color:#66e4b1;background:rgba(75,229,174,.07)
}
.app.profile-jo #rolePortalContent .joWork58811{
  display:grid;grid-template-columns:135px minmax(0,1fr);gap:15px;align-items:center
}
.app.profile-jo #rolePortalContent .joDonut58811{
  --pct:68;width:116px;height:116px;border-radius:50%;
  background:conic-gradient(#26d8ff calc(var(--pct)*1%),rgba(255,255,255,.075) 0);
  position:relative;display:grid;place-items:center;margin:auto
}
.app.profile-jo #rolePortalContent .joDonut58811::after{
  content:"";position:absolute;inset:10px;border-radius:50%;background:#0b2c49
}
.app.profile-jo #rolePortalContent .joDonut58811 b{
  position:relative;z-index:1;font-size:27px;color:#fff
}
.app.profile-jo #rolePortalContent .joDonut58811 small{
  position:absolute;z-index:1;margin-top:34px;font-size:7px;color:#86a7b8
}
.app.profile-jo #rolePortalContent .joWorkInfo58811 h4{
  margin:0 0 3px;font-size:17px;color:#f3fbff
}
.app.profile-jo #rolePortalContent .joWorkInfo58811 > small{
  color:#85a4b4;font-size:9px
}
.app.profile-jo #rolePortalContent .joWorkMeta58811{
  display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:11px 0
}
.app.profile-jo #rolePortalContent .joWorkMeta58811 div{
  padding:8px 9px;border-radius:10px;background:rgba(5,25,43,.55);
  border:1px solid rgba(255,255,255,.045)
}
.app.profile-jo #rolePortalContent .joWorkMeta58811 small{
  display:block;font-size:7px;color:#7193a4;text-transform:uppercase
}
.app.profile-jo #rolePortalContent .joWorkMeta58811 b{
  display:block;margin-top:4px;font-size:10px;color:#dff7ff
}
.app.profile-jo #rolePortalContent .joPrimary58811{
  width:100%;min-height:42px;border-radius:11px!important;
  border:1px solid rgba(53,221,255,.70)!important;
  background:linear-gradient(180deg,#0f94c2,#08779d)!important;
  color:#fff!important;font-weight:900!important
}
.app.profile-jo #rolePortalContent .joRows58811{display:grid}
.app.profile-jo #rolePortalContent .joRow58811{
  display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;align-items:center;
  padding:9px 0;border-bottom:1px solid rgba(255,255,255,.055)
}
.app.profile-jo #rolePortalContent .joRow58811:last-child{border-bottom:0}
.app.profile-jo #rolePortalContent .joRow58811 b{display:block;font-size:9px;color:#eaf7fd}
.app.profile-jo #rolePortalContent .joRow58811 small{display:block;margin-top:2px;font-size:8px;color:#7f9fac}
.app.profile-jo #rolePortalContent .joRow58811 span{font-size:8px;color:#b4cbd6}
.app.profile-jo #rolePortalContent .joDot58811{
  width:8px;height:8px;border-radius:50%;display:inline-block;margin-right:7px;background:#25d8ff
}
.app.profile-jo #rolePortalContent .joDot58811.warn{background:#ffbd62}
.app.profile-jo #rolePortalContent .joDot58811.bad{background:#ff7474}
.app.profile-jo #rolePortalContent .joBottom58811{
  display:grid;grid-template-columns:1.1fr .9fr;gap:12px
}
.app.profile-jo #rolePortalContent .joTask58811{
  display:grid;grid-template-columns:minmax(0,1fr) 80px 80px;gap:10px;align-items:center;
  padding:9px 0;border-bottom:1px solid rgba(255,255,255,.055)
}
.app.profile-jo #rolePortalContent .joTask58811:last-child{border-bottom:0}
.app.profile-jo #rolePortalContent .joTask58811 b{font-size:9px}
.app.profile-jo #rolePortalContent .joTask58811 small{display:block;font-size:8px;color:#789aaa;margin-top:2px}
.app.profile-jo #rolePortalContent .joBar58811{
  height:7px;border-radius:999px;background:rgba(255,255,255,.07);overflow:hidden
}
.app.profile-jo #rolePortalContent .joBar58811 i{
  display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#18bce7,#55e5f6)
}
.app.profile-jo #rolePortalContent .joPct58811{text-align:right;font-size:9px;color:#dff8ff}
@media(max-width:1000px){
  .app.profile-jo #rolePortalContent .joKpis58811{grid-template-columns:1fr 1fr}
  .app.profile-jo #rolePortalContent .joMain58811,
  .app.profile-jo #rolePortalContent .joBottom58811{grid-template-columns:1fr}
}
@media(max-width:620px){
  .app.profile-jo #rolePortalContent .joKpis58811{grid-template-columns:1fr 1fr}
  .app.profile-jo #rolePortalContent .joWork58811{grid-template-columns:1fr}
  .app.profile-jo #rolePortalContent .joWorkMeta58811{grid-template-columns:1fr}
  .app.profile-jo #rolePortalContent .joTask58811{grid-template-columns:1fr 70px}
  .app.profile-jo #rolePortalContent .joTask58811 .joBar58811{display:none}
}